/* ============================================================
   FONTS — self-hosted static instances.
   Google Fonts serves Manrope as a VARIABLE font, and Chrome has
   a rendering bug where the space glyph collapses to zero advance,
   producing "textwithnospaces". Static weights avoid it entirely,
   and the site now works with no external font dependency.
   ============================================================ */
@font-face{font-family:'Manrope';font-style:normal;font-weight:400;font-display:block;
  src:url('fonts/manrope-latin-400-normal.woff2') format('woff2');}
@font-face{font-family:'Manrope';font-style:normal;font-weight:500;font-display:block;
  src:url('fonts/manrope-latin-500-normal.woff2') format('woff2');}
@font-face{font-family:'Manrope';font-style:normal;font-weight:600;font-display:block;
  src:url('fonts/manrope-latin-600-normal.woff2') format('woff2');}
@font-face{font-family:'Manrope';font-style:normal;font-weight:700;font-display:block;
  src:url('fonts/manrope-latin-700-normal.woff2') format('woff2');}
@font-face{font-family:'Manrope';font-style:normal;font-weight:800;font-display:block;
  src:url('fonts/manrope-latin-800-normal.woff2') format('woff2');}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400;font-display:block;
  src:url('fonts/jetbrains-mono-latin-400-normal.woff2') format('woff2');}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:500;font-display:block;
  src:url('fonts/jetbrains-mono-latin-500-normal.woff2') format('woff2');}

/* ============================================================
   SHAKTI GROUP — v2
   Base palette: Study 01 (Indigo Monochrome)
   · every neutral tinted toward indigo — nothing is pure grey
   · plum reserved for hairline rules and figures only
   · Simtex sections invert to their own navy/green identity
   ============================================================ */

:root{
  --bg:#F1F0F5;
  --bg-2:#EAE9F1;
  --surface:#FFFFFF;
  --surface-2:#F7F6FA;
  --ink:#191933;
  --ink-2:#2A2A4A;
  --mute:#5C5C78;
  --faint:#9292A8;
  --line:rgba(48,48,120,0.13);
  --line-2:rgba(48,48,120,0.22);
  --line-3:rgba(48,48,120,0.36);
  --primary:#303078;
  --primary-lift:#3E3E9C;
  --primary-soft:rgba(48,48,120,0.07);
  --plum:#7B2740;
  --brand-red:#8A2333;
  --brand-red-on-dark:#D4707F;
  /* On the indigo button, the brand red is unreadable (~1.3:1). This is
     the same hue lifted to clear 4.5:1 against #303078 while still
     reading as the brand red rather than pink. */
  --brand-red-on-indigo:#F58893;
  --plum-soft:rgba(123,39,64,0.09);

  /* Simtex identity — light and green-tinted, so the brand mark
     sits on its natural ground with no plate and no recolouring,
     while still reading as clearly separate from the indigo site. */
  --sim-bg:#EAF1DF;
  --sim-bg-2:#E1EBD2;
  --sim-surface:#FBFDF7;
  --sim-navy:#1E2E6C;
  --sim-accent:#2B4BC0;
  --sim-green:#3F7A2A;
  --sim-green-bright:#8CC349;
  --sim-text:#131F45;
  --sim-mute:#4C5670;
  --sim-faint:#7B8598;
  --sim-line:rgba(30,46,108,0.15);
  --sim-line-2:rgba(43,75,192,0.34);

  --maxw:1320px;
  --gut:40px;
  --r:2px;
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:124px;}
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto;} }

body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:'Manrope',sans-serif;
  font-size:16px;
  line-height:1.55;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

/* subtle paper grain — keeps large flat areas from feeling dead */
body::after{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:1;opacity:0.5;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E");
}

h1,h2,h3,h4{margin:0;font-weight:700;letter-spacing:-0.03em;line-height:1.04;}
p{margin:0;}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
button{font-family:inherit;border:none;background:none;cursor:pointer;color:inherit;}
:focus-visible{outline:2px solid var(--primary);outline-offset:3px;}

.mono{font-family:'JetBrains Mono',monospace;font-weight:400;}

.shell{max-width:var(--maxw);margin:0 auto;padding:0 var(--gut);position:relative;z-index:2;}
@media (max-width:900px){ :root{--gut:24px;} }
@media (max-width:520px){ :root{--gut:18px;} }

/* ---------------- TYPE SCALE ---------------- */
.d1{font-size:clamp(31px,4.1vw,56px);letter-spacing:-0.035em;}
.d2{font-size:clamp(27px,3.4vw,44px);letter-spacing:-0.032em;}
.d3{font-size:clamp(24px,3vw,38px);letter-spacing:-0.03em;}
.d4{font-size:clamp(19px,2vw,24px);letter-spacing:-0.022em;}
.lede{font-size:clamp(15px,1.35vw,18px);line-height:1.62;color:var(--mute);font-weight:400;}
.body-sm{font-size:14px;line-height:1.65;color:var(--mute);}

/* ---------------- EYEBROW / INDEX ---------------- */
.eyebrow{
  font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:0.18em;
  text-transform:uppercase;color:var(--primary);display:inline-flex;align-items:center;gap:11px;
}
.eyebrow::before{content:"";width:26px;height:1px;background:var(--primary);flex:none;}
.eyebrow.plain::before{display:none;}
.eyebrow.plum{color:var(--plum);}
.eyebrow.plum::before{background:var(--plum);}

.rule-plum{width:52px;height:3px;background:var(--plum);border-radius:2px;}

/* ---------------- HEADER ---------------- */
.hdr{
  position:sticky;top:0;z-index:60;
  background:rgba(241,240,245,0.82);
  backdrop-filter:blur(14px) saturate(1.4);
  border-bottom:1px solid var(--line);
}
.hdr-in{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:16px 0;}
.brand{display:flex;align-items:center;gap:16px;flex:none;}
.brand img{height:88px;width:88px;flex:none;}
.brand .lock{display:block;}
.brand .nm{display:block;font-weight:800;font-size:clamp(25px,3.05vw,46px);letter-spacing:0.005em;line-height:1.02;white-space:nowrap;}
.brand .nm em{font-style:normal;color:var(--brand-red);}
.brand .tg{display:block;font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:0.13em;color:var(--faint);text-transform:uppercase;margin-top:3px;line-height:1;}

.nav{display:flex;align-items:center;gap:3px;}
.nav > a, .nav .dd > .dd-trigger{
  font-size:13.5px;font-weight:500;color:var(--mute);padding:9px 12px;border-radius:var(--r);
  display:flex;align-items:center;gap:5px;transition:color .18s,background .18s;
}
.nav > a:hover, .nav .dd > .dd-trigger:hover{color:var(--ink);background:var(--primary-soft);}
.nav .dd > .dd-trigger.on{color:var(--primary);font-weight:600;}
.dd-trigger{cursor:pointer;text-decoration:none;}
.nav > a.on{color:var(--primary);font-weight:600;}
.dd{position:relative;}
.dd-menu{
  position:absolute;top:calc(100% + 8px);left:0;min-width:262px;background:var(--surface);
  border:1px solid var(--line-2);border-radius:var(--r);padding:7px;
  box-shadow:0 18px 44px -18px rgba(25,25,51,0.28);
  opacity:0;visibility:hidden;transform:translateY(5px);
  transition:opacity .18s,transform .18s,visibility .18s;
}
.dd:hover .dd-menu, .dd:focus-within .dd-menu{opacity:1;visibility:visible;transform:none;}
.dd-menu a{display:flex;justify-content:space-between;gap:12px;padding:10px 12px;font-size:13.5px;color:var(--mute);border-radius:2px;}
.dd-menu a:hover{background:var(--primary-soft);color:var(--ink);}
.dd-menu a i{font-family:'JetBrains Mono',monospace;font-style:normal;font-size:10.5px;color:var(--faint);}
.dd-menu .all{border-top:1px solid var(--line);margin-top:5px;padding-top:12px;color:var(--primary);font-weight:600;}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  padding:13px 22px;border-radius:var(--r);font-size:13px;font-weight:600;letter-spacing:0.005em;
  border:1px solid transparent;transition:transform .18s,background .18s,border-color .18s,color .18s;
}
.btn:hover{transform:translateY(-1px);}
.btn.fill{background:var(--primary);color:#fff;}
.btn.fill:hover{background:var(--primary-lift);}
.btn.line{border-color:var(--line-3);color:var(--ink);}
.btn.line:hover{border-color:var(--primary);color:var(--primary);}
.btn.sm{padding:10px 17px;font-size:12.5px;}

.burger{display:none;padding:9px 13px;border:1px solid var(--line-3);border-radius:var(--r);font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:0.1em;}
.msheet{
  display:none;position:fixed;inset:0;background:var(--bg);z-index:70;overflow-y:auto;
  padding:88px var(--gut) 60px;
}
.msheet.open{display:block;}
.msheet a{display:block;padding:16px 2px;border-bottom:1px solid var(--line);font-size:17px;font-weight:600;}
.msheet a.sub{padding-left:18px;font-size:14.5px;font-weight:400;color:var(--mute);}
.msheet .btn{margin-top:24px;width:100%;}
.msheet .msheet-close{position:absolute;top:22px;right:var(--gut);}
@media (max-width:1240px){ .nav{display:none;} .burger{display:inline-flex;position:relative;z-index:71;} }

/* ---------------- HERO ---------------- */
.hero{padding:clamp(48px,7vw,96px) 0 clamp(40px,5vw,72px);}
.hero-grid{display:grid;grid-template-columns:1.02fr 0.98fr;gap:clamp(28px,4vw,64px);align-items:center;}
@media (max-width:1000px){ .hero-grid{grid-template-columns:1fr;} }
.hero h1{max-width:21ch;}
.hero .lede{max-width:52ch;margin-top:26px;}
.hero-ctas{display:flex;gap:12px;margin-top:34px;flex-wrap:wrap;}

/* --- 3D stage --- */
.stage{
  position:relative;width:100%;aspect-ratio:1/1.02;min-height:400px;
  border:1px solid var(--line);border-radius:var(--r);background:
    linear-gradient(180deg,var(--surface-2),var(--bg));
  overflow:hidden;
}
.stage canvas{display:block;width:100%;height:100%;}
.stage .frame-tag{
  position:absolute;left:14px;bottom:12px;font-family:'JetBrains Mono',monospace;
  font-size:9.5px;letter-spacing:0.14em;color:var(--faint);text-transform:uppercase;
}
.stage .hint{
  position:absolute;right:14px;bottom:12px;font-family:'JetBrains Mono',monospace;
  font-size:9.5px;letter-spacing:0.1em;color:var(--faint);text-transform:uppercase;
  display:flex;align-items:center;gap:6px;
}
.stage .corner{position:absolute;width:12px;height:12px;border-color:var(--line-3);border-style:solid;border-width:0;}
.stage .c1{top:10px;left:10px;border-top-width:1px;border-left-width:1px;}
.stage .c2{top:10px;right:10px;border-top-width:1px;border-right-width:1px;}
.stage .c3{bottom:10px;left:10px;border-bottom-width:1px;border-left-width:1px;}
.stage .c4{bottom:10px;right:10px;border-bottom-width:1px;border-right-width:1px;}

/* floating 3D labels */
.lbl{
  position:absolute;pointer-events:none;
  font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:0.12em;
  text-transform:uppercase;color:var(--ink-2);white-space:nowrap;
  display:flex;align-items:center;gap:8px;opacity:0;
  transition:opacity .35s ease;will-change:opacity,left,top;
}
.lbl.show{opacity:1;}
.lbl::before{
  content:"";width:6px;height:6px;border-radius:50%;
  background:var(--plum);flex:none;box-shadow:0 0 0 3px rgba(123,39,64,0.14);
}
.lbl span{
  background:rgba(255,255,255,0.88);border:1px solid var(--line);
  padding:3px 8px;border-radius:3px;backdrop-filter:blur(6px);
  box-shadow:0 2px 8px -3px rgba(25,25,51,0.2);
}

/* ---------------- MEASURE STRIP ---------------- */
.measures{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line-2);border-bottom:1px solid var(--line-2);}
.measure{padding:26px 24px 24px;border-right:1px solid var(--line);}
.measure:last-child{border-right:none;}
.measure .v{font-family:'JetBrains Mono',monospace;font-size:clamp(24px,2.6vw,34px);color:var(--ink);letter-spacing:-0.02em;line-height:1;}
.measure .v em{font-style:normal;color:var(--plum);}
.measure .k{font-size:12px;color:var(--mute);margin-top:9px;line-height:1.4;}
@media (max-width:760px){ .measures{grid-template-columns:1fr 1fr;} .measure:nth-child(2n){border-right:none;} .measure:nth-child(-n+2){border-bottom:1px solid var(--line);} }

/* ---------------- SECTIONS ---------------- */
.sect{padding:clamp(64px,8vw,120px) 0;}
.sect.sm{padding:clamp(48px,5vw,80px) 0;}
.sect.alt{background:var(--bg-2);}
.sect.tl{border-top:1px solid var(--line);}
.shead{display:grid;grid-template-columns:1fr auto;gap:28px;align-items:end;margin-bottom:clamp(32px,4vw,56px);}
.shead .side{max-width:40ch;font-size:14.5px;line-height:1.65;color:var(--mute);}
@media (max-width:840px){ .shead{grid-template-columns:1fr;} }
.shead h2{margin-top:18px;}

/* ---------------- PRODUCT ROWS (editorial accordion) ---------------- */
.rows{border-top:1px solid var(--line-2);}
.row{border-bottom:1px solid var(--line-2);}
.row-head{
  display:grid;grid-template-columns:64px 1fr auto;gap:24px;align-items:center;
  padding:clamp(20px,2.4vw,30px) 0;width:100%;text-align:left;transition:padding .3s;
}
.row-head .ix{font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--faint);letter-spacing:0.06em;}
.row-head .ttl{font-size:clamp(20px,2.5vw,32px);font-weight:700;letter-spacing:-0.03em;transition:color .25s,transform .35s cubic-bezier(.22,1,.36,1);}
.row-head .plus{
  width:30px;height:30px;border:1px solid var(--line-2);border-radius:50%;flex:none;
  display:flex;align-items:center;justify-content:center;position:relative;transition:border-color .25s,background .25s,transform .35s;
}
.row-head .plus::before,.row-head .plus::after{
  content:"";position:absolute;background:var(--primary);transition:transform .35s cubic-bezier(.22,1,.36,1),background .25s;
}
.row-head .plus::before{width:11px;height:1.5px;}
.row-head .plus::after{width:1.5px;height:11px;}
.row:hover .row-head .ttl{color:var(--primary);transform:translateX(6px);}
.row:hover .row-head .plus{border-color:var(--primary);}
.row.open .row-head .plus{background:var(--primary);transform:rotate(135deg);}
.row.open .row-head .plus::before,.row.open .row-head .plus::after{background:#fff;}
.row.open .row-head .ttl{color:var(--primary);}
.row-body{max-height:0;overflow:hidden;transition:max-height .5s cubic-bezier(.22,1,.36,1);}
.row-inner{display:grid;grid-template-columns:64px 1fr 1fr;gap:24px;padding:0 0 34px;}
.row-inner .spacer{}
.row-inner p{font-size:14.5px;line-height:1.7;color:var(--mute);max-width:52ch;}
.row-meta{display:flex;flex-direction:column;gap:14px;}
.row-meta .mrow{display:flex;gap:12px;font-size:12.5px;border-bottom:1px solid var(--line);padding-bottom:11px;}
.row-meta .mrow .mk{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:0.09em;text-transform:uppercase;color:var(--faint);width:92px;flex:none;padding-top:2px;}
.row-meta .mrow .mv{color:var(--ink-2);}
.row-meta .go{font-size:12.5px;font-weight:600;color:var(--primary);display:inline-flex;gap:7px;align-items:center;}
@media (max-width:900px){
  .row-head{grid-template-columns:40px 1fr auto;gap:14px;}
  .row-inner{grid-template-columns:1fr;gap:22px;padding-left:0;}
  .row-inner .spacer{display:none;}
}

/* ---------------- SPEC BLOCKS ---------------- */
.specs{border-top:1px solid var(--line-2);}
.spec{
  display:grid;grid-template-columns:76px 1.15fr 0.85fr;gap:28px;
  padding:clamp(24px,3vw,38px) 0;border-bottom:1px solid var(--line-2);align-items:start;
}
.spec .ix{font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--faint);padding-top:6px;}
.spec h3{font-size:clamp(18px,2vw,25px);}
.spec .thr{
  font-family:'JetBrains Mono',monospace;font-size:clamp(18px,2.2vw,27px);color:var(--plum);
  letter-spacing:-0.02em;margin-top:12px;
}
.spec .thr small{display:block;font-size:10px;letter-spacing:0.14em;color:var(--faint);text-transform:uppercase;margin-top:5px;font-family:'JetBrains Mono',monospace;}
.spec p{font-size:14.5px;line-height:1.72;color:var(--mute);}
@media (max-width:900px){ .spec{grid-template-columns:1fr;gap:14px;} .spec .ix{padding-top:0;} }

/* ---------------- MEDIA ---------------- */
.media{position:relative;overflow:hidden;border:1px solid var(--line);background:var(--surface-2);border-radius:var(--r);}
.media img{
  width:100%;height:100%;object-fit:cover;
  /* pull stock photos toward the site's muted, cool register so they
     don't clash with the indigo palette; ease to full colour on hover */
  filter:saturate(0.82) contrast(1.02) brightness(0.98);
  transition:filter .4s ease, transform .6s cubic-bezier(.22,1,.36,1);
}
.media:hover img{filter:saturate(1) contrast(1) brightness(1);transform:scale(1.03);}
.media.r43{aspect-ratio:4/3;}
.media.r169{aspect-ratio:16/9;}
.media.r11{aspect-ratio:1/1;}
.media .chip{
  position:absolute;top:11px;left:11px;background:rgba(255,255,255,0.86);border:1px solid var(--line-2);
  font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:0.1em;text-transform:uppercase;
  color:var(--mute);padding:5px 8px;border-radius:2px;backdrop-filter:blur(4px);
}

/* ---------------- TWO COLUMN ---------------- */
.two{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4.5vw,72px);align-items:start;}
.two.wide-l{grid-template-columns:1.15fr 0.85fr;}
.two.wide-r{grid-template-columns:0.85fr 1.15fr;}
@media (max-width:900px){ .two,.two.wide-l,.two.wide-r{grid-template-columns:1fr;} }

/* ---------------- CARDS ---------------- */
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line-2);border:1px solid var(--line-2);border-radius:var(--r);overflow:hidden;}
.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line-2);border:1px solid var(--line-2);border-radius:var(--r);overflow:hidden;}
.cell{background:var(--surface);padding:clamp(24px,2.6vw,34px);display:flex;flex-direction:column;gap:13px;transition:background .25s;}
.cell:hover{background:var(--surface-2);}
.cell .ix{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--plum);letter-spacing:0.08em;}
.cell h3{font-size:18px;}
.cell p{font-size:13.8px;line-height:1.65;color:var(--mute);}
.cell .tag{margin-top:auto;font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:0.09em;color:var(--faint);text-transform:uppercase;}
a.cell{color:inherit;}
a.cell:hover h3{color:var(--primary);}
a.cell h3{transition:color .22s;}
a.cell .media{margin:2px 0 4px;}
.cell.tagonly{padding:22px clamp(20px,2.2vw,28px);justify-content:center;min-height:78px;}
.cell.tagonly .tag{margin-top:0;color:var(--ink-2);font-size:11px;letter-spacing:0.1em;}
.simtex .cell.tagonly .tag{color:var(--sim-text);}
@media (max-width:940px){ .grid3{grid-template-columns:1fr 1fr;} }
@media (max-width:600px){ .grid3,.grid2{grid-template-columns:1fr;} }

/* ---------------- SIMTEX BLOCK (inverted identity) ---------------- */
.simtex{
  background:var(--sim-bg);color:var(--sim-text);position:relative;overflow:hidden;
}
.simtex::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(780px 440px at 10% 0%, rgba(140,195,73,0.22), transparent 70%),
    radial-gradient(640px 420px at 90% 100%, rgba(30,46,108,0.10), transparent 70%);
}
.simtex .shell{position:relative;z-index:2;}
.simtex h1,.simtex h2,.simtex h3{color:var(--sim-text);}
.simtex .lede,.simtex p{color:var(--sim-mute);}
.simtex .eyebrow{color:var(--sim-accent);}
.simtex .eyebrow::before{background:var(--sim-accent);}
.sim-mark{height:104px;width:auto;margin-bottom:22px;}
.sim-chip{display:none;}

/* Attribution under the mark — a quiet rule and small caps rather
   than a boxed tag, which sat awkwardly beside the logo. */
.sim-attrib{
  display:flex;align-items:center;gap:12px;margin:4px 0 22px;
  font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:0.16em;
  text-transform:uppercase;color:var(--sim-mute);
}
.sim-attrib::before{content:"";width:30px;height:1px;background:var(--sim-accent);flex:none;}
.simtex .btn.line{border-color:var(--sim-line-2);color:var(--sim-text);}
.simtex .btn.line:hover{border-color:var(--sim-accent);color:var(--sim-accent);}
.simtex .measures{border-color:var(--sim-line);}
.simtex .measure{border-color:var(--sim-line);}
.simtex .measure .v{color:var(--sim-text);}
.simtex .measure .v em{color:var(--sim-accent);}
.simtex .measure .k{color:var(--sim-faint);}
.simtex .grid3,.simtex .grid2{background:var(--sim-line);border-color:var(--sim-line);}
.simtex .cell{background:var(--sim-surface);}
.simtex .cell:hover{background:#F3F8EA;}
.simtex .cell .ix{color:var(--sim-accent);}
.simtex .cell .tag{color:var(--sim-faint);}
.simtex .specs,.simtex .spec{border-color:var(--sim-line);}
.simtex .spec .ix{color:var(--sim-faint);}
.simtex .spec .thr{color:var(--sim-accent);}
.simtex .spec .thr small{color:var(--sim-faint);}
.simtex .rule-plum{background:var(--sim-accent);}
.sim-stage{
  position:relative;width:100%;aspect-ratio:1/0.9;min-height:340px;
  border:1px solid var(--sim-line);border-radius:var(--r);
  background:linear-gradient(180deg,#FBFDF7,#EFF5E6);overflow:hidden;
}
.sim-stage canvas{display:block;width:100%;height:100%;}
.sim-stage .frame-tag{
  position:absolute;left:14px;bottom:12px;font-family:'JetBrains Mono',monospace;
  font-size:9.5px;letter-spacing:0.14em;color:var(--sim-faint);text-transform:uppercase;
}

/* ---------------- FORM ---------------- */
.panel{border:1px solid var(--line-2);background:var(--surface);border-radius:var(--r);padding:clamp(26px,3vw,40px);}
.fld{margin-bottom:20px;}
.fld label{display:block;font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:0.13em;text-transform:uppercase;color:var(--faint);margin-bottom:9px;}
.fld input,.fld textarea,.fld select{
  width:100%;background:var(--bg);border:1px solid var(--line-2);border-radius:var(--r);
  padding:13px 14px;font-family:'Manrope',sans-serif;font-size:15px;color:var(--ink);transition:border-color .2s;
}
.fld textarea{min-height:130px;resize:vertical;}
.fld select{appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6'><path d='M0 0L5 6L10 0' fill='%235C5C78'/></svg>");background-repeat:no-repeat;background-position:right 15px center;}
.fld input:focus,.fld textarea:focus,.fld select:focus{border-color:var(--primary);}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:0 18px;}
@media (max-width:560px){ .f2{grid-template-columns:1fr;} }
.fmsg{display:none;font-size:13.5px;color:var(--primary);margin-top:15px;padding-left:12px;border-left:2px solid var(--plum);}

.info .r{display:flex;gap:18px;padding:17px 0;border-bottom:1px solid var(--line);font-size:14.5px;}
.info .r .k{width:96px;flex:none;font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:0.11em;text-transform:uppercase;color:var(--faint);padding-top:3px;}
.info .r .v{color:var(--ink-2);}

/* ---------------- FOOTER ---------------- */
.ftr{background:var(--ink);color:#D6D6E4;padding:clamp(56px,6vw,88px) 0 30px;position:relative;z-index:2;}
.ftr-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:clamp(26px,3vw,48px);padding-bottom:44px;}
.ftr h4{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:0.15em;text-transform:uppercase;color:#7676A0;margin-bottom:17px;font-weight:400;}
.ftr a,.ftr p{display:block;color:#A9A9C4;font-size:13.5px;margin-bottom:11px;line-height:1.55;}
.ftr a:hover{color:#fff;}
.ftr .fbrand{display:flex;align-items:center;gap:12px;margin-bottom:18px;}
.ftr .fbrand img{height:84px;width:84px;}
.ftr .fbrand strong{color:#fff;font-size:28px;letter-spacing:-0.025em;line-height:1.05;display:block;}
.ftr .fbrand strong em{font-style:normal;color:var(--brand-red-on-dark);}
.ftr .sk{color:var(--brand-red-on-dark);}
.ftr .fbrand .sub{display:block;font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:0.14em;color:#7676A0;margin-top:6px;text-transform:uppercase;}
.ftr .ents{color:#7676A0;font-size:12.5px;line-height:1.9;}
.ftr-btm{border-top:1px solid rgba(255,255,255,0.12);padding-top:24px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:0.09em;color:#6E6E96;}
@media (max-width:900px){ .ftr-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:540px){ .ftr-grid{grid-template-columns:1fr;} }

/* ---------------- REVEAL ----------------
   Deliberately inert. Any opacity/transform transition on a
   text block risks Chrome compositing the layer before the
   webfont swaps in, leaving fallback and Manrope glyphs
   superimposed. Content renders immediately instead. */
.rv,.rv.in{opacity:1;transform:none;transition:none;}

/* Guard: letter-spacing inherits as a COMPUTED length, so tracking set
   on a large-type container leaks into small child text and crushes the
   word spaces. Body copy always states its own tracking. */
p,li,td,th,label,input,textarea,select,.lede,.body-sm,.side,.cell p,.spec p,.row-inner p{
  letter-spacing:normal;
  word-spacing:normal;
}

.center{text-align:center;}
.mt-s{margin-top:16px;} .mt-m{margin-top:26px;} .mt-l{margin-top:42px;}

/* ============================================================
   BRAND PRESENCE
   The mark carries weight across the site rather than sitting
   once in the corner: oversized watermarks behind hero and
   footer, a monogram section divider, and a brand band.
   --logo-url / --simtex-url are set at runtime in main.js so
   paths resolve from both root and /products.
   ============================================================ */

.brandmark-wm{
  position:absolute;pointer-events:none;z-index:0;
  background-image:var(--logo-url);background-size:contain;
  background-repeat:no-repeat;background-position:center;
}
.hero{position:relative;}
.hero .brandmark-wm{
  width:min(56vw,720px);aspect-ratio:1/1;
  right:-16%;top:50%;transform:translateY(-50%);
  opacity:0.045;
}
@media (max-width:1000px){ .hero .brandmark-wm{right:-30%;width:96vw;opacity:0.035;} }

/* monogram divider between major sections */
.brand-div{
  display:flex;align-items:center;gap:22px;padding:0;
}
.brand-div::before,.brand-div::after{content:"";flex:1;height:1px;background:var(--line-2);}
.brand-div img{height:46px;width:46px;flex:none;opacity:0.85;}

/* brand band — group identity stated plainly */
.brand-band{
  border-top:1px solid var(--line-2);border-bottom:1px solid var(--line-2);
  padding:34px 0;display:grid;grid-template-columns:auto 1fr auto;gap:32px;align-items:center;
}
.brand-band .bb-mark{display:flex;align-items:center;gap:16px;}
.brand-band .bb-mark img{height:82px;width:82px;flex:none;}
.brand-band .bb-mark .t{font-weight:800;font-size:30px;letter-spacing:-0.025em;line-height:1.05;}
.brand-band .bb-mark .t em{font-style:normal;color:var(--brand-red);}
.brand-band .bb-mark .s{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:0.14em;color:var(--faint);text-transform:uppercase;margin-top:5px;}
.brand-band .bb-ents{
  font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:0.08em;
  color:var(--mute);text-transform:uppercase;line-height:2;text-align:center;
}
.brand-band .bb-since{
  font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:0.14em;color:var(--plum);text-transform:uppercase;
}
@media (max-width:900px){
  .brand-band{grid-template-columns:1fr;gap:20px;text-align:center;}
  .brand-band .bb-mark{justify-content:center;}
  .brand-band .bb-ents{text-align:center;}
}

/* footer watermark */
.ftr{overflow:hidden;}
.ftr .brandmark-wm{
  width:min(46vw,560px);aspect-ratio:1/1;right:-8%;bottom:-22%;opacity:0.05;
}

/* Simtex brand presence — original mark, no plate, no recolouring.
   The light ground is what makes it legible. */
.sim-plate{display:inline-flex;margin-bottom:24px;}
.sim-plate img{height:104px;width:auto;display:block;}
.sim-plate.lg img{height:140px;}
.sim-plate.sm{margin-bottom:0;}
.sim-plate.sm img{height:72px;}
.sim-mark{height:104px;width:auto;margin-bottom:22px;}
.simtex{position:relative;}
.simtex .brandmark-wm{
  background-image:var(--simtex-url);
  width:min(48vw,620px);aspect-ratio:1.36/1;
  left:-14%;bottom:-18%;opacity:0.06;
}
.sim-band{
  border-top:1px solid var(--sim-line);border-bottom:1px solid var(--sim-line);
  padding:30px 0;display:flex;align-items:center;justify-content:center;gap:26px;flex-wrap:wrap;
}
.sim-band img{height:82px;width:auto;}
.sim-band .t{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:0.16em;color:var(--sim-accent);text-transform:uppercase;}


/* header scales down progressively so the mark + burger always fit and
   the menu button is never pushed off-screen */
@media (max-width:1240px){
  .brand img{height:64px;width:64px;}
  .brand .nm{font-size:clamp(22px,3.2vw,32px);}
  .brand{gap:12px;}
  .hdr-in{gap:14px;}
  .burger{flex:none;}
}
@media (max-width:640px){
  .brand img{height:52px;width:52px;}
  .brand .nm{font-size:21px;}
  .brand{gap:10px;}
  .hdr-in{padding:12px 0;}
  html{scroll-padding-top:90px;}
  .msheet{inset:80px 0 0;}
}
@media (max-width:400px){
  .brand img{height:44px;width:44px;}
  .brand .nm{font-size:18px;}
  .burger{padding:8px 11px;font-size:10px;}
  .msheet{inset:74px 0 0;}
}


/* Simtex dedicated page — whole page adopts the brand ground */
body.page-sim{background:var(--sim-bg);}
body.page-sim .hdr{background:rgba(234,241,223,0.86);border-bottom-color:var(--sim-line);}
body.page-sim .hdr .nav > a.on{color:var(--sim-accent);}
body.page-sim .msheet{background:var(--sim-bg);}


/* ============================================================
   KEYWORD HIGHLIGHTING
   Used sparingly — a couple of terms per section, never a
   whole phrase. Inherits font weight from context so it reads
   as emphasis, not as a link.
   ============================================================ */
.kw{font-style:normal;color:var(--brand-red);}
p .kw,.lede .kw,.side .kw{font-weight:600;}

/* Simtex contexts swap the generic accent to the mark's navy */
.simtex .kw, body.page-sim .kw{color:var(--sim-accent);}

/* Wordmarks are context-independent: Shakti is always the brand red,
   Simtex always the Simtex navy, wherever either appears in copy. */
.sk{font-style:normal;color:var(--brand-red);font-weight:600;}
.sx{font-style:normal;color:var(--sim-accent);}
.simtex .sk, body.page-sim .sk{color:var(--brand-red);}

/* Primary button — indigo fill, white label (default). */
.btn.fill{background:var(--primary);color:#fff;border:1px solid var(--primary);}
.btn.fill:hover{background:var(--primary-lift);border-color:var(--primary-lift);color:#fff;}

/* Simtex is treated differently — its own accent-blue button, white label. */
.simtex .btn.fill, body.page-sim .btn.fill, body.page-sim .hdr .btn.fill{
  background:var(--sim-accent);color:#FFFFFF;border:1px solid var(--sim-accent);
}
.simtex .btn.fill:hover, body.page-sim .btn.fill:hover, body.page-sim .hdr .btn.fill:hover{
  background:#3F7A2A;border-color:#3F7A2A;color:#FFFFFF;
}




/* About — full-range product showcase grid */
.prod-grid{
  border-radius:var(--r);overflow:hidden;
}
.prod-grid img{width:100%;height:auto;display:block;}

/* Netlify honeypot — visually hidden anti-spam field */
.hp{position:absolute;left:-9999px;top:-9999px;height:0;overflow:hidden;}

/* Prevent the stage caption + hint from colliding on narrow screens */
@media (max-width:560px){
  .stage .frame-tag, .sim-stage .frame-tag{font-size:8px;letter-spacing:0.08em;max-width:55%;line-height:1.3;}
  .stage .hint, .sim-stage .hint{font-size:8px;letter-spacing:0.06em;max-width:42%;text-align:right;line-height:1.3;}
}
@media (max-width:380px){
  .stage .hint, .sim-stage .hint{display:none;}
}

/* ---- 3D stage fallback (shown only if WebGL is unavailable) ---- */
.stage-fallback{
  position:absolute;inset:0;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:26px;padding:32px;
}
.sf-stack{display:flex;flex-direction:column;gap:9px;width:min(78%,340px);}
.sf-stack span{display:block;height:16px;border-radius:5px;box-shadow:0 3px 10px -4px rgba(25,25,51,0.35);}
.sf-stack span:nth-child(1){background:#3A3A8C;height:22px;}
.sf-stack span:nth-child(2){background:#8A2333;height:10px;}
.sf-stack span:nth-child(3){background:#DAD9E8;height:34px;}
.sf-stack span:nth-child(4){background:#8A2333;height:10px;}
.sf-stack span:nth-child(5){background:#5C5CB4;height:24px;}
.sf-cap{
  font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:0.1em;
  text-transform:uppercase;color:var(--faint);text-align:center;line-height:1.5;max-width:34ch;
}
.stage-fallback.sim .sf-web{
  width:min(80%,320px);height:150px;border-radius:10px;
  background:
    repeating-linear-gradient(38deg, rgba(63,122,42,0.35) 0 2px, transparent 2px 11px),
    repeating-linear-gradient(-42deg, rgba(30,46,108,0.3) 0 2px, transparent 2px 13px),
    #FBFDF7;
  border:1px solid var(--sim-line);
}
body.page-sim .sf-cap, .simtex .sf-cap{color:var(--sim-mute);}
