
/* Nova Hub v1.5.1 — Tabs Visual Fidelity */
.nh-tab-step,.nh-tabs-floating,.nh-tab-panel,
.nh-tab-step *,.nh-tabs-floating *,.nh-tab-panel *{box-sizing:border-box}
.nh-tab-step,.nh-tabs-floating,.nh-tab-panel{
  --nh-tabs-accent:#7c4dff;
  --nh-tabs-accent-2:#18c8ff;
  --nh-tabs-text:#171c2d;
  --nh-tabs-muted:#677085;
  --nh-tabs-light:#f7f9ff;
  width:100%;
  font-family:Inter,Segoe UI,Arial,sans-serif;
}
.nh-tab-step.no-widget-bg,
.nh-tabs-floating.no-widget-bg,
.nh-tab-panel.no-widget-bg{background:transparent!important;box-shadow:none!important;border-color:transparent!important}

/* TAB STEP — Layout Rebuild 1.5.2 */
.nh-tab-step{
  --nh-step-indicator-size:64px;
  --nh-step-gap:20px;
  position:relative;
  width:100%;
  padding:34px;
  border:1px solid rgba(124,77,255,.12);
  border-radius:26px;
}
.nh-tab-step.has-widget-bg{
  background:
    radial-gradient(circle at 16% 8%,rgba(124,77,255,.13),transparent 26%),
    linear-gradient(145deg,#fbfbff 0%,#f3f0ff 100%);
  box-shadow:0 24px 60px rgba(54,39,120,.12);
}
.nh-tab-step-inner{
  position:relative;
  width:100%;
  max-width:1100px;
  margin:0 auto;
  display:flex;
  flex-direction:column;
  gap:16px;
}
.nh-tab-step.has-line:not(.indicator-none) .nh-tab-step-inner:before{
  content:"";
  position:absolute;
  left:calc(var(--nh-step-indicator-size) / 2);
  top:calc(var(--nh-step-indicator-size) / 2);
  bottom:calc(var(--nh-step-indicator-size) / 2);
  width:8px;
  transform:translateX(-50%);
  border-radius:999px;
  background:linear-gradient(to bottom,var(--nh-tabs-accent),var(--nh-tabs-accent-2));
  box-shadow:0 0 18px color-mix(in srgb,var(--nh-tabs-accent) 35%,transparent);
  z-index:0;
}
.nh-tab-step-item{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:var(--nh-step-indicator-size) minmax(0,1fr);
  gap:var(--nh-step-gap);
  align-items:start;
  width:100%;
  min-width:0;
}
.nh-tab-step.indicator-none .nh-tab-step-item{
  grid-template-columns:minmax(0,1fr);
}
.nh-tab-step-rail{
  position:relative;
  display:flex;
  justify-content:center;
  min-width:0;
}
.nh-tab-step.indicator-none .nh-tab-step-rail{display:none}
.nh-tab-step-indicator{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:center;
  width:var(--nh-step-indicator-size);
  height:var(--nh-step-indicator-size);
  color:#fff;
  background:linear-gradient(135deg,var(--nh-tabs-accent),var(--nh-tabs-accent-2));
  font-weight:800;
  box-shadow:0 14px 30px color-mix(in srgb,var(--nh-tabs-accent) 30%,transparent);
  flex:0 0 auto;
}
.nh-tab-step-indicator svg{width:1em;height:1em;fill:currentColor}
.nh-shape-circle{border-radius:50%}
.nh-shape-square{border-radius:15px}
.nh-shape-hexagon{clip-path:polygon(25% 6%,75% 6%,100% 50%,75% 94%,25% 94%,0 50%)}
.nh-shape-diamond{transform:rotate(45deg);border-radius:12px}
.nh-shape-diamond>*{transform:rotate(-45deg)}
.nh-shape-none{background:transparent!important;color:var(--nh-tabs-accent);box-shadow:none!important}
.nh-tab-step-card{
  width:100%;
  min-width:0;
  overflow:hidden;
  border:1px solid rgba(38,44,72,.08);
  border-radius:20px;
  background:#fff;
  box-shadow:0 16px 34px rgba(35,35,70,.09);
}
.nh-tab-step-item.is-active .nh-tab-step-card{
  border-color:color-mix(in srgb,var(--nh-tabs-accent) 25%,transparent);
  box-shadow:0 20px 42px color-mix(in srgb,var(--nh-tabs-accent) 16%,transparent);
}
.nh-tab-step-trigger{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:16px;
  width:100%;
  min-height:76px;
  padding:12px 18px;
  border:0;
  background:transparent;
  color:var(--nh-tabs-text);
  text-align:left;
  cursor:pointer;
}
.nh-tab-step-heading{
  display:flex;
  align-items:center;
  gap:15px;
  min-width:0;
}
.nh-tab-step-side-icon{
  display:grid;
  place-items:center;
  width:50px;
  height:50px;
  border-radius:15px;
  background:linear-gradient(145deg,rgba(124,77,255,.14),rgba(24,200,255,.10));
  color:var(--nh-tabs-accent);
  box-shadow:inset 0 0 0 1px rgba(124,77,255,.10);
  font-size:21px;
  flex:0 0 auto;
}
.nh-tab-step-side-icon svg{width:1em;height:1em;fill:currentColor}
.nh-tab-step-title{
  min-width:0;
  color:var(--nh-tabs-text);
  font-size:19px;
  line-height:1.25;
  font-weight:750;
}
.nh-tab-step-toggle{
  display:grid;
  place-items:center;
  width:36px;
  height:36px;
  border-radius:50%;
  background:color-mix(in srgb,var(--nh-tabs-accent) 12%,transparent);
  color:var(--nh-tabs-accent);
  font-size:21px;
  transition:transform .22s ease;
  flex:0 0 auto;
}
.nh-tab-step-item.is-active .nh-tab-step-toggle{transform:rotate(45deg)}
.nh-tab-step-panel{
  padding:0 24px 24px 83px;
  color:var(--nh-tabs-muted);
}
.nh-tab-step-description p{margin:0 0 16px;line-height:1.7}
.nh-tab-step-button{
  display:inline-flex;
  align-items:center;
  padding:11px 17px;
  border-radius:11px;
  background:linear-gradient(135deg,var(--nh-tabs-accent),var(--nh-tabs-accent-2));
  color:#fff!important;
  text-decoration:none!important;
  font-weight:700;
  box-shadow:0 10px 24px color-mix(in srgb,var(--nh-tabs-accent) 24%,transparent);
}
@media(max-width:767px){
  .nh-tab-step{
    --nh-step-indicator-size:44px;
    --nh-step-gap:12px;
    padding:22px;
  }
  .nh-tab-step-inner{gap:14px}
  .nh-tab-step-trigger{
    min-height:64px;
    padding:9px 12px;
  }
  .nh-tab-step-side-icon{
    width:42px;
    height:42px;
    border-radius:13px;
    font-size:18px;
  }
  .nh-tab-step-title{font-size:16px}
  .nh-tab-step-toggle{width:32px;height:32px}
  .nh-tab-step-panel{padding:0 16px 18px 69px}
}
@media(max-width:520px){
  .nh-tab-step{padding:16px}
  .nh-tab-step-heading{gap:10px}
  .nh-tab-step-side-icon{width:38px;height:38px}
  .nh-tab-step-panel{padding-left:16px}
}

/* TABS FLOATING — official concept */
.nh-tabs-floating{
  position:relative;
  padding:44px 32px 32px;
  border:1px solid rgba(35,78,160,.10);
  border-radius:28px;
}
.nh-tabs-floating.has-widget-bg{
  background:
    radial-gradient(circle at 82% 18%,rgba(58,123,255,.12),transparent 28%),
    linear-gradient(145deg,#fafdff,#edf4ff);
  box-shadow:0 24px 60px rgba(32,74,145,.12);
}
.nh-floating-nav{
  display:flex;flex-wrap:wrap;justify-content:center;
  gap:12px;
  margin-top:-72px;
  margin-bottom:28px;
}
.nh-floating-tab{
  position:relative;
  display:flex;align-items:center;gap:10px;
  min-height:58px;
  padding:12px 18px;
  border:1px solid rgba(35,78,160,.10);
  border-radius:16px;
  background:#fff;
  color:#1d2638;
  box-shadow:0 12px 26px rgba(43,65,110,.10);
  cursor:pointer;
  transition:transform .22s ease,box-shadow .22s ease,color .22s ease;
}
.nh-floating-tab.is-active{
  transform:translateY(-11px);
  color:#fff;
  background:linear-gradient(135deg,#1c7dff,#4f67ff);
  box-shadow:0 18px 34px rgba(43,108,255,.30);
}
.nh-floating-tab-icon{
  display:grid;place-items:center;
  width:35px;height:35px;border-radius:12px;
  background:rgba(124,77,255,.09);
}
.nh-floating-tab.is-active .nh-floating-tab-icon{background:rgba(255,255,255,.16)}
.nh-floating-badge{
  position:absolute;top:-10px;right:10px;
  padding:3px 8px;border-radius:999px;
  background:#8c5cff;color:#fff;
  font-size:10px;font-weight:800;
  box-shadow:0 8px 18px rgba(124,77,255,.24);
}
.nh-floating-panel{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(240px,.85fr);
  gap:28px;
  align-items:center;
  padding:32px;
  border:1px solid rgba(35,78,160,.08);
  border-radius:22px;
  background:rgba(255,255,255,.88);
  box-shadow:0 18px 40px rgba(35,70,130,.10);
}
.nh-floating-copy h3{margin:0 0 12px;color:#172033;font-size:31px}
.nh-floating-copy p{margin:0 0 20px;color:#647086;line-height:1.7}
.nh-floating-copy a{
  display:inline-flex;
  padding:11px 17px;
  border-radius:11px;
  background:linear-gradient(135deg,#1c7dff,#4f67ff);
  color:#fff!important;text-decoration:none!important;font-weight:700;
  box-shadow:0 10px 24px rgba(43,108,255,.24);
}
.nh-floating-visual img{
  width:100%;max-height:300px;object-fit:cover;
  border-radius:18px;
  box-shadow:0 18px 38px rgba(35,65,120,.18);
}

/* TAB PANEL — official Modern Glass concept */
.nh-tab-panel{
  display:grid;
  grid-template-columns:minmax(220px,25%) minmax(0,1fr);
  gap:20px;
  padding:22px;
  border-radius:28px;
  color:#fff;
}
.nh-tab-panel.has-widget-bg{
  background:
    radial-gradient(circle at 8% 0%,rgba(20,240,205,.18),transparent 26%),
    linear-gradient(135deg,#0d2330,#06131d);
  border:1px solid rgba(46,233,211,.18);
  box-shadow:0 26px 70px rgba(1,12,19,.36);
}
.nh-tab-panel.is-right{grid-template-columns:minmax(0,1fr) minmax(220px,25%)}
.nh-tab-panel.is-right .nh-panel-nav{grid-column:2}
.nh-tab-panel.is-right .nh-panel-stage{grid-column:1;grid-row:1}
.nh-panel-nav{
  display:flex;flex-direction:column;gap:8px;
  padding:14px;
  border-radius:22px;
  background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.06);
}
.nh-panel-tab{
  display:flex;align-items:center;gap:12px;
  width:100%;padding:14px 15px;
  border:1px solid transparent;border-radius:14px;
  background:transparent;color:#c9d6df;
  text-align:left;cursor:pointer;
  transition:.2s ease;
}
.nh-panel-tab.is-active{
  color:#fff;
  background:linear-gradient(90deg,rgba(21,222,193,.28),rgba(255,255,255,.06));
  border-color:rgba(37,230,203,.24);
  box-shadow:inset 4px 0 0 #1de0c2;
}
.nh-panel-tab-icon{
  display:grid;place-items:center;
  width:36px;height:36px;border-radius:12px;
  background:rgba(255,255,255,.06);
  color:#42e6d0;
}
.nh-panel-stage{min-width:0}
.nh-panel-content{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(240px,.85fr);
  gap:26px;
  min-height:100%;
  padding:28px;
  border-radius:22px;
  background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.07);
}
.nh-panel-content>small,
.nh-panel-content>h3,
.nh-panel-content>p,
.nh-panel-content>.nh-panel-button,
.nh-panel-content>.nh-panel-stats{grid-column:1}
.nh-panel-content>small{color:#43e4cf;letter-spacing:.08em}
.nh-panel-content h3{margin:5px 0 8px;font-size:31px;color:#fff}
.nh-panel-content p{margin:0 0 18px;color:#c6d0d8;line-height:1.7}
.nh-panel-image{
  grid-column:2;grid-row:1/6;
  width:100%;height:100%;max-height:360px;
  object-fit:cover;border-radius:18px;
  box-shadow:0 18px 42px rgba(0,0,0,.28);
}
.nh-panel-button{
  justify-self:start;
  display:inline-flex;padding:11px 17px;border-radius:11px;
  background:linear-gradient(135deg,#1dd9bd,#23bca8);
  color:#fff!important;text-decoration:none!important;font-weight:700;
  box-shadow:0 10px 24px rgba(29,217,189,.18);
}
.nh-panel-stats{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:4px
}
.nh-panel-stat{
  padding:16px;border-radius:16px;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.08);
}
.nh-panel-stat-icon{display:block;margin-bottom:8px;color:#43e4cf}
.nh-panel-stat strong{display:block;font-size:25px;color:#fff}
.nh-panel-stat span{color:#b9c6cf;font-size:13px}

@media(max-width:980px){
  .nh-floating-panel,.nh-panel-content{grid-template-columns:1fr}
  .nh-floating-visual img,.nh-panel-image{grid-column:1;grid-row:auto;max-height:280px}
  .nh-tab-panel,.nh-tab-panel.is-right{grid-template-columns:1fr}
  .nh-tab-panel.is-right .nh-panel-nav,.nh-tab-panel.is-right .nh-panel-stage{grid-column:auto;grid-row:auto}
  .nh-panel-nav{flex-direction:row;overflow:auto}
  .nh-panel-tab{min-width:max-content}
}
@media(max-width:767px){
  .nh-tabs-floating{padding:32px 18px 18px}
  .nh-floating-nav{justify-content:flex-start;overflow:auto;flex-wrap:nowrap;margin-top:-52px}
  .nh-floating-tab{min-width:max-content}
  .nh-floating-panel{padding:22px}
  .nh-tab-panel{padding:16px}
  .nh-panel-content{padding:21px}
  .nh-panel-stats{grid-template-columns:1fr}
}
