/* =========================================================
   VMG — India Operations Partner
   Version 1 design system
   ========================================================= */

/* ---------- Tokens ---------- */
:root{
  --ink:#0F1922;
  --ink-2:#1B2733;
  --ink-3:#2C3A48;
  --paper:#FFFFFF;
  --sand:#F8F6F2;
  --sand-2:#F0ECE5;
  --line:#E4DFD6;
  --line-2:#EFEBE4;
  --muted:#5C6773;
  --muted-2:#7C8794;
  --accent:#E96A1E;
  --accent-dk:#C9560F;
  --accent-soft:#FDF1E8;

  --wrap:1180px;
  --wrap-narrow:820px;
  --radius:14px;
  --radius-lg:20px;

  --ease:cubic-bezier(.22,.61,.36,1);

  --shadow-sm:0 1px 2px rgba(15,25,34,.05);
  --shadow:0 10px 30px -12px rgba(15,25,34,.18);
  --shadow-lg:0 24px 60px -24px rgba(15,25,34,.28);
}

/* ---------- Reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  font-feature-settings:"kern" 1,"liga" 1,"cv05" 1;
}
img,svg{max-width:100%; height:auto; display:block}
a{color:inherit}
button{font:inherit}
h1,h2,h3,h4{margin:0; font-weight:600; letter-spacing:-.021em; line-height:1.14; text-wrap:balance}
p{margin:0; text-wrap:pretty}
ul,ol{margin:0; padding:0}
hr{border:0; border-top:1px solid var(--line); margin:0}

/* ---------- Type ---------- */
.display{
  font-family:'Instrument Serif',Georgia,'Times New Roman',serif;
  font-weight:400;
  letter-spacing:-.012em;
  line-height:1.06;
}
.h1{font-size:clamp(2.5rem,1.4rem + 4.6vw,4.6rem)}
.h2{font-size:clamp(1.95rem,1.2rem + 2.9vw,3.15rem)}
.h3{font-size:clamp(1.35rem,1.05rem + 1.1vw,1.85rem); font-family:'Inter',sans-serif; font-weight:600; line-height:1.2}
.h4{font-size:1.0625rem; font-weight:600; letter-spacing:-.008em; line-height:1.35}

.eyebrow{
  font-size:.75rem; font-weight:600; letter-spacing:.13em; text-transform:uppercase;
  color:var(--accent); margin:0 0 1.1rem;
}
.eyebrow--muted{color:var(--muted-2)}
.lede{font-size:clamp(1.075rem,1rem + .45vw,1.3rem); line-height:1.6; color:var(--muted)}
.lede--light{color:rgba(255,255,255,.76)}
.small{font-size:.9375rem; line-height:1.6; color:var(--muted)}
.tiny{font-size:.8125rem; line-height:1.55; color:var(--muted-2)}
.measure{max-width:64ch}
.measure-sm{max-width:52ch}
.center{text-align:center}
.center .measure,.center .measure-sm{margin-left:auto; margin-right:auto}

/* ---------- Layout ---------- */
.wrap{width:100%; max-width:var(--wrap); margin:0 auto; padding:0 24px}
.wrap-narrow{width:100%; max-width:var(--wrap-narrow); margin:0 auto; padding:0 24px}
.section{padding:clamp(4rem,2.5rem + 6vw,7.5rem) 0}
.section--tight{padding:clamp(3rem,2rem + 4vw,5rem) 0}
.section--sand{background:var(--sand)}
.section--ink{background:var(--ink); color:#fff}
.section--ink .lede,.section--ink .small{color:rgba(255,255,255,.72)}
.section--line{border-top:1px solid var(--line)}
.stack>*+*{margin-top:1.1rem}
.stack-lg>*+*{margin-top:1.75rem}
.section-head{max-width:70ch; margin-bottom:clamp(2.25rem,1.5rem + 2vw,3.5rem)}
.section-head.center{margin-left:auto; margin-right:auto}

.grid{display:grid; gap:24px}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.split{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.15fr); gap:clamp(2rem,1rem + 4vw,4.5rem); align-items:start}
@media (max-width:960px){
  .grid-3,.grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .split{grid-template-columns:minmax(0,1fr); gap:2rem}
}
@media (max-width:620px){
  .grid-2,.grid-3,.grid-4{grid-template-columns:minmax(0,1fr)}
}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:.55em;
  padding:.95rem 1.6rem;
  border-radius:999px;
  font-size:.9375rem; font-weight:600; letter-spacing:-.005em;
  text-decoration:none; cursor:pointer;
  border:1px solid transparent;
  transition:background .2s var(--ease), color .2s var(--ease), border-color .2s var(--ease), transform .2s var(--ease);
}
.btn:hover{transform:translateY(-1px)}
.btn:focus-visible{outline:2px solid var(--accent); outline-offset:3px}
.btn--primary{background:var(--accent); color:#fff}
.btn--primary:hover{background:var(--accent-dk)}
.btn--ink{background:var(--ink); color:#fff}
.btn--ink:hover{background:var(--ink-2)}
.btn--ghost{border-color:var(--line); color:var(--ink); background:transparent}
.btn--ghost:hover{border-color:var(--ink); background:var(--paper)}
.btn--light{background:#fff; color:var(--ink)}
.btn--light:hover{background:var(--sand-2)}
.btn--outline-light{border-color:rgba(255,255,255,.32); color:#fff}
.btn--outline-light:hover{border-color:#fff; background:rgba(255,255,255,.08)}
.btn-row{display:flex; flex-wrap:wrap; gap:.75rem}
.btn .arw{transition:transform .2s var(--ease)}
.btn:hover .arw{transform:translateX(3px)}

.link{
  display:inline-flex; align-items:center; gap:.4em;
  font-weight:600; font-size:.9375rem; text-decoration:none; color:var(--ink);
  border-bottom:1px solid var(--accent); padding-bottom:2px;
  transition:color .2s var(--ease), gap .2s var(--ease);
}
.link:hover{color:var(--accent); gap:.65em}
.link--light{color:#fff; border-color:rgba(255,255,255,.5)}
.link--light:hover{color:#fff; border-color:#fff}

/* ---------- Header ---------- */
.site-header{
  position:sticky; top:0; z-index:100;
  background:rgba(255,255,255,.86);
  backdrop-filter:saturate(180%) blur(14px);
  -webkit-backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid transparent;
  transition:border-color .25s var(--ease), background .25s var(--ease);
}
.site-header.is-stuck{border-bottom-color:var(--line); background:rgba(255,255,255,.94)}
.nav{display:flex; align-items:center; gap:2rem; height:76px}
.brand{display:flex; align-items:center; gap:.7rem; text-decoration:none; flex:0 0 auto}
.brand img{width:88px}
.brand-sub{
  font-size:.6875rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase;
  color:var(--muted-2); border-left:1px solid var(--line); padding-left:.7rem; line-height:1.25; max-width:9.5rem;
}
.nav-main{display:flex; align-items:center; gap:.35rem; margin-left:auto}
.nav-link{
  position:relative; display:inline-flex; align-items:center; gap:.3em;
  padding:.55rem .8rem; border-radius:8px;
  font-size:.9375rem; font-weight:500; color:var(--ink-3); text-decoration:none;
  transition:color .18s var(--ease), background .18s var(--ease);
  white-space:nowrap;
}
.nav-link:hover{color:var(--ink); background:var(--sand)}
.nav-link[aria-current="page"]{color:var(--ink); font-weight:600}
.nav-link[aria-current="page"]::after{
  content:""; position:absolute; left:.8rem; right:.8rem; bottom:.15rem; height:2px; background:var(--accent); border-radius:2px;
}
.nav-cta{margin-left:.6rem; padding:.7rem 1.25rem; font-size:.875rem}

/* dropdown */
.nav-group{position:relative}
.nav-group>.nav-link{cursor:pointer; background:none; border:0}
.nav-group .chev{width:9px; height:9px; opacity:.55; transition:transform .2s var(--ease)}
.nav-group[data-open="true"] .chev{transform:rotate(180deg)}
.nav-menu{
  position:absolute; top:calc(100% + 8px); left:0; min-width:288px;
  background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  box-shadow:var(--shadow-lg); padding:.5rem; list-style:none;
  opacity:0; visibility:hidden; transform:translateY(-6px);
  transition:opacity .18s var(--ease), transform .18s var(--ease), visibility .18s;
}
.nav-group[data-open="true"] .nav-menu{opacity:1; visibility:visible; transform:translateY(0)}
.nav-menu a{display:block; padding:.7rem .85rem; border-radius:9px; text-decoration:none; transition:background .16s var(--ease)}
.nav-menu a:hover{background:var(--sand)}
.nav-menu strong{display:block; font-size:.9375rem; font-weight:600; color:var(--ink)}
.nav-menu span{display:block; font-size:.8125rem; color:var(--muted-2); line-height:1.45; margin-top:2px}

.nav-toggle{
  display:none; margin-left:auto; align-items:center; justify-content:center;
  width:44px; height:44px; border:1px solid var(--line); border-radius:10px;
  background:#fff; cursor:pointer;
}
.nav-toggle span{display:block; width:18px; height:1.5px; background:var(--ink); position:relative; transition:background .2s}
.nav-toggle span::before,.nav-toggle span::after{
  content:""; position:absolute; left:0; width:18px; height:1.5px; background:var(--ink);
  transition:transform .25s var(--ease), top .2s var(--ease);
}
.nav-toggle span::before{top:-6px}
.nav-toggle span::after{top:6px}
body.menu-open .nav-toggle span{background:transparent}
body.menu-open .nav-toggle span::before{top:0; transform:rotate(45deg)}
body.menu-open .nav-toggle span::after{top:0; transform:rotate(-45deg)}

.mobile-menu{
  display:none; position:fixed; top:76px; left:0; right:0; bottom:0; z-index:99;
  background:#fff; overflow-y:auto; padding:1.25rem 24px 3rem;
  border-top:1px solid var(--line);
}
body.menu-open .mobile-menu{display:block}
body.menu-open{overflow:hidden}
.mobile-menu a{display:block; text-decoration:none; padding:.9rem 0; border-bottom:1px solid var(--line-2); font-size:1.0625rem; font-weight:500}
.mobile-menu .mm-group-label{font-size:.6875rem; font-weight:700; letter-spacing:.13em; text-transform:uppercase; color:var(--muted-2); margin:1.75rem 0 .25rem}
.mobile-menu .btn{width:100%; justify-content:center; margin-top:1.75rem}

@media (max-width:1080px){
  .nav-main{display:none}
  .nav-toggle{display:inline-flex}
  .brand-sub{display:none}
}

/* ---------- Hero ---------- */
.hero{position:relative; overflow:hidden; background:var(--ink); color:#fff; isolation:isolate}
.hero::before{
  content:""; position:absolute; inset:0; z-index:-1;
  background:
    radial-gradient(120% 90% at 78% 8%, rgba(233,106,30,.20), transparent 58%),
    radial-gradient(90% 70% at 8% 100%, rgba(64,110,150,.20), transparent 60%);
}
.hero::after{
  content:""; position:absolute; inset:0; z-index:-1; opacity:.28;
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:88px 88px;
  mask-image:radial-gradient(120% 100% at 50% 0%,#000 30%,transparent 80%);
  -webkit-mask-image:radial-gradient(120% 100% at 50% 0%,#000 30%,transparent 80%);
}
.hero-inner{padding-top:clamp(4.5rem,2.5rem + 8vw,8.5rem); padding-bottom:clamp(3.5rem,2rem + 5vw,6rem)}
.hero h1{max-width:17ch}
.hero .lede{max-width:56ch; margin-top:1.6rem}
.hero .btn-row{margin-top:2.5rem}
.hero-eyebrow{
  display:inline-flex; align-items:center; gap:.65rem; margin-bottom:1.75rem;
  padding:.4rem .9rem .4rem .5rem; border-radius:999px;
  background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.14);
  font-size:.78125rem; font-weight:500; letter-spacing:.01em; color:rgba(255,255,255,.85);
}
.hero-eyebrow b{
  display:inline-block; padding:.15rem .5rem; border-radius:999px;
  background:var(--accent); color:#fff; font-size:.6875rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
}

/* trust strip */
.trust{border-top:1px solid rgba(255,255,255,.12); padding:1.75rem 0 2.25rem}
.trust ul{display:flex; flex-wrap:wrap; gap:.5rem 2.75rem; list-style:none}
.trust li{
  font-size:.875rem; color:rgba(255,255,255,.7); display:flex; align-items:center; gap:.6rem;
}
.trust li::before{content:""; width:5px; height:5px; border-radius:50%; background:var(--accent); flex:0 0 auto}

/* ---------- Cards ---------- */
.card{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg);
  padding:clamp(1.5rem,1.1rem + 1.2vw,2.25rem);
  transition:border-color .22s var(--ease), transform .22s var(--ease), box-shadow .22s var(--ease);
}
.card--hover:hover{border-color:#CFC7B9; transform:translateY(-3px); box-shadow:var(--shadow)}
.card h3,.card .h4{margin-bottom:.6rem}
.card p{color:var(--muted); font-size:.9375rem}
.card .link{margin-top:1.25rem}
.card--sand{background:var(--sand); border-color:transparent}
.card--ink{background:var(--ink-2); border-color:rgba(255,255,255,.1); color:#fff}
.card--ink p{color:rgba(255,255,255,.7)}

/* choice cards (two ways to work) */
.choice{
  display:flex; flex-direction:column;
  background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg);
  padding:clamp(1.75rem,1.2rem + 1.8vw,2.75rem);
  position:relative; overflow:hidden;
  transition:border-color .22s var(--ease), transform .22s var(--ease), box-shadow .22s var(--ease);
}
.choice::before{content:""; position:absolute; top:0; left:0; right:0; height:3px; background:var(--line)}
.choice:hover{transform:translateY(-4px); box-shadow:var(--shadow); border-color:#D8D0C2}
.choice--primary::before{background:var(--accent)}
.choice--primary{background:linear-gradient(180deg,var(--accent-soft),#fff 42%)}
.choice-tag{
  display:inline-block; font-size:.6875rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  color:var(--muted-2); margin-bottom:1rem;
}
.choice--primary .choice-tag{color:var(--accent)}
.choice h3{margin-bottom:.75rem}
.choice ul{list-style:none; margin:1.5rem 0 0; display:grid; gap:.6rem}
.choice li{position:relative; padding-left:1.5rem; font-size:.9375rem; color:var(--muted)}
.choice li::before{
  content:""; position:absolute; left:0; top:.55em; width:7px; height:7px; border-radius:2px;
  background:var(--accent); opacity:.75;
}
.choice .btn{margin-top:auto; align-self:flex-start}
.choice .btn-wrap{padding-top:2rem; margin-top:auto}

/* ---------- Journey / process ---------- */
.journey{display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:0; counter-reset:j}
.journey-step{position:relative; padding:2.5rem 1.25rem 0 0}
.journey-step::before{
  content:""; position:absolute; top:0; left:0; right:0; height:1px; background:var(--line);
}
.journey-step::after{
  content:""; position:absolute; top:-3.5px; left:0; width:8px; height:8px; border-radius:50%;
  background:var(--sand); border:1.5px solid var(--line);
}
.journey-step.is-on::after{background:var(--accent); border-color:var(--accent)}
.journey-num{font-size:.6875rem; font-weight:700; letter-spacing:.12em; color:var(--muted-2); display:block; margin-bottom:.5rem}
.journey-step h4{margin-bottom:.4rem}
.journey-step p{font-size:.875rem; color:var(--muted); line-height:1.55}
@media (max-width:1000px){.journey{grid-template-columns:repeat(3,minmax(0,1fr)); gap:0 0}}
@media (max-width:640px){
  .journey{grid-template-columns:minmax(0,1fr)}
  .journey-step{padding:1.5rem 0 1.5rem 1.75rem}
  .journey-step::before{top:0; bottom:auto; left:0; right:auto; width:1px; height:100%}
  .journey-step::after{top:1.65rem; left:-3.5px}
}

/* numbered process list */
.steps{list-style:none; counter-reset:s; display:grid; gap:0}
.steps li{
  counter-increment:s; display:grid; grid-template-columns:auto minmax(0,1fr); gap:1.5rem;
  padding:2rem 0; border-top:1px solid var(--line);
}
.steps li:last-child{border-bottom:1px solid var(--line)}
.steps li::before{
  content:"0" counter(s);
  font-family:'Instrument Serif',serif; font-size:1.75rem; color:var(--accent); line-height:1;
  padding-top:.3rem;
}
.steps h3{margin-bottom:.5rem}
.steps p{color:var(--muted); max-width:62ch}
@media (max-width:560px){.steps li{grid-template-columns:minmax(0,1fr); gap:.5rem}}

/* ---------- Feature list / capability chips ---------- */
.tick-list{list-style:none; display:grid; gap:.85rem}
.tick-list li{position:relative; padding-left:1.9rem; color:var(--muted); font-size:.9375rem}
.tick-list li::before{
  content:""; position:absolute; left:0; top:.42em; width:1.05rem; height:1.05rem; border-radius:50%;
  background:var(--accent-soft);
}
.tick-list li::after{
  content:""; position:absolute; left:.32rem; top:.72em; width:.42rem; height:.22rem;
  border-left:1.6px solid var(--accent); border-bottom:1.6px solid var(--accent);
  transform:rotate(-45deg);
}
.tick-list strong{color:var(--ink); font-weight:600}
.section--ink .tick-list li{color:rgba(255,255,255,.72)}
.section--ink .tick-list li::before{background:rgba(233,106,30,.2)}
.section--ink .tick-list strong{color:#fff}

.chips{display:flex; flex-wrap:wrap; gap:.6rem; list-style:none}
.chips li{
  padding:.6rem 1.1rem; border:1px solid var(--line); border-radius:999px;
  font-size:.875rem; font-weight:500; background:#fff; color:var(--ink-3);
}

/* capability grid */
.cap{border-top:1px solid var(--line); padding:1.75rem 0}
.cap h4{margin-bottom:.4rem}
.cap p{font-size:.9375rem; color:var(--muted)}

/* ---------- Stats ---------- */
.stats{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--radius-lg); overflow:hidden}
.stat{background:#fff; padding:clamp(1.5rem,1.1rem + 1vw,2rem)}
.section--ink .stats{background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.12)}
.section--ink .stat{background:var(--ink)}
.stat b{display:block; font-family:'Instrument Serif',serif; font-weight:400; font-size:clamp(2rem,1.4rem + 1.8vw,2.9rem); line-height:1; letter-spacing:-.01em}
.section--ink .stat b{color:#fff}
.stat span{display:block; margin-top:.7rem; font-size:.875rem; color:var(--muted); line-height:1.5}
.section--ink .stat span{color:rgba(255,255,255,.66)}
@media (max-width:760px){.stats{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ---------- Quote / pull ---------- */
.pull{
  font-family:'Instrument Serif',serif; font-weight:400;
  font-size:clamp(1.55rem,1.1rem + 2vw,2.5rem); line-height:1.24; letter-spacing:-.01em;
  max-width:22ch;
}
.pull-note{margin-top:1.5rem; font-size:.9375rem; color:var(--muted)}

/* ---------- CTA band ---------- */
.cta-band{background:var(--ink); color:#fff; position:relative; overflow:hidden; isolation:isolate}
.cta-band::before{
  content:""; position:absolute; inset:0; z-index:-1;
  background:radial-gradient(90% 130% at 85% 20%, rgba(233,106,30,.22), transparent 60%);
}
.cta-band .wrap{padding-top:clamp(3.5rem,2.5rem + 4vw,5.5rem); padding-bottom:clamp(3.5rem,2.5rem + 4vw,5.5rem)}
.cta-band h2{max-width:20ch}
.cta-band .lede{max-width:52ch; margin-top:1.1rem}
.cta-band .btn-row{margin-top:2.25rem}

/* ---------- Notice / callout ---------- */
.callout{
  border-left:3px solid var(--accent); background:var(--sand);
  padding:1.5rem 1.75rem; border-radius:0 var(--radius) var(--radius) 0;
}
.callout p{font-size:.9375rem; color:var(--muted)}
.callout strong{color:var(--ink)}

/* ---------- Page hero (interior) ---------- */
.page-hero{background:var(--sand); border-bottom:1px solid var(--line)}
.page-hero .wrap{padding-top:clamp(3rem,2rem + 4vw,5.25rem); padding-bottom:clamp(3rem,2rem + 4vw,5.25rem)}
.page-hero h1{max-width:20ch}
.page-hero .lede{max-width:60ch; margin-top:1.4rem}
.page-hero .btn-row{margin-top:2.25rem}
.crumbs{font-size:.8125rem; color:var(--muted-2); margin-bottom:1.4rem}
.crumbs a{text-decoration:none; color:var(--muted-2)}
.crumbs a:hover{color:var(--ink)}

/* ---------- Forms ---------- */
.form-card{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg);
  padding:clamp(1.5rem,1.1rem + 1.8vw,2.75rem); box-shadow:var(--shadow-sm);
}
.field{display:block; margin-bottom:1.35rem}
.field>span,.field>label,.legend{
  display:block; font-size:.8125rem; font-weight:600; letter-spacing:.02em;
  color:var(--ink); margin-bottom:.5rem;
}
.field .hint{display:block; font-weight:400; color:var(--muted-2); font-size:.78125rem; margin-top:.2rem}
.req{color:var(--accent)}
input[type=text],input[type=email],input[type=url],input[type=tel],select,textarea{
  width:100%; padding:.8rem .95rem; font:inherit; font-size:.9375rem;
  color:var(--ink); background:#fff;
  border:1px solid var(--line); border-radius:10px;
  transition:border-color .18s var(--ease), box-shadow .18s var(--ease);
}
textarea{min-height:130px; resize:vertical}
select{appearance:none; background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%235C6773' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 1rem center; background-size:12px; padding-right:2.5rem}
input:focus,select:focus,textarea:focus{outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(233,106,30,.14)}
input:user-invalid,textarea:user-invalid{border-color:#C0392B}
.field-row{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 1.25rem}
@media (max-width:600px){.field-row{grid-template-columns:minmax(0,1fr)}}
.radio-set{display:grid; gap:.6rem; margin-bottom:1.35rem}
.radio{
  display:flex; align-items:flex-start; gap:.7rem; padding:.85rem 1rem;
  border:1px solid var(--line); border-radius:10px; cursor:pointer; font-size:.9375rem;
  transition:border-color .18s var(--ease), background .18s var(--ease);
}
.radio:hover{border-color:#CFC7B9}
.radio input{margin:.28rem 0 0; accent-color:var(--accent); flex:0 0 auto}
.radio:has(input:checked){border-color:var(--accent); background:var(--accent-soft)}
.hp{position:absolute!important; left:-9999px!important; width:1px; height:1px; overflow:hidden}
.form-note{font-size:.8125rem; color:var(--muted-2); margin-top:1.25rem; line-height:1.6}
.form-status{margin-top:1.25rem; padding:.9rem 1.1rem; border-radius:10px; font-size:.9375rem; display:none}
.form-status.is-ok{display:block; background:#EDF7EE; border:1px solid #C6E5C9; color:#215B29}
.form-status.is-err{display:block; background:#FDEDEA; border:1px solid #F3C8C0; color:#8C2A19}

/* ---------- Contact side ---------- */
.contact-aside dl{margin:0}
.contact-aside dt{font-size:.6875rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--muted-2); margin-bottom:.35rem}
.contact-aside dd{margin:0 0 1.75rem; font-size:.9375rem; line-height:1.65}
.contact-aside a{color:var(--ink); text-decoration:none; border-bottom:1px solid var(--line)}
.contact-aside a:hover{border-color:var(--accent); color:var(--accent)}

/* ---------- Footer ---------- */
.site-footer{background:var(--ink); color:rgba(255,255,255,.66); padding:clamp(3.5rem,2.5rem + 3vw,5rem) 0 2.5rem; font-size:.9375rem}
.footer-top{display:grid; grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr)); gap:2.5rem}
@media (max-width:900px){.footer-top{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.footer-top{grid-template-columns:minmax(0,1fr); gap:2rem}}
.site-footer .brand img{width:84px; filter:brightness(0) invert(1); opacity:.92}
.footer-blurb{margin-top:1.25rem; max-width:34ch; font-size:.9375rem; line-height:1.65}
.footer-col h4{color:#fff; font-size:.6875rem; font-weight:700; letter-spacing:.13em; text-transform:uppercase; margin-bottom:1.1rem; color:rgba(255,255,255,.5)}
.footer-col ul{list-style:none; display:grid; gap:.65rem}
.footer-col a{text-decoration:none; color:rgba(255,255,255,.72); transition:color .18s var(--ease)}
.footer-col a:hover{color:#fff}
.footer-bottom{
  margin-top:3.5rem; padding-top:1.75rem; border-top:1px solid rgba(255,255,255,.12);
  display:flex; flex-wrap:wrap; gap:1rem 2rem; justify-content:space-between; font-size:.8125rem; color:rgba(255,255,255,.45);
}
.footer-bottom a{color:rgba(255,255,255,.55); text-decoration:none}
.footer-bottom a:hover{color:#fff}

/* ---------- Staging banner ---------- */
.staging{
  background:var(--ink-2); color:rgba(255,255,255,.8);
  font-size:.75rem; letter-spacing:.06em; text-transform:uppercase; font-weight:600;
  text-align:center; padding:.5rem 24px;
}
.staging b{color:var(--accent)}

/* ---------- Utilities ---------- */
.skip{
  position:absolute; left:-9999px; top:0; background:var(--ink); color:#fff;
  padding:.75rem 1.25rem; border-radius:0 0 8px 0; z-index:200; text-decoration:none;
}
.skip:focus{left:0}
.mt-0{margin-top:0}
.mt-1{margin-top:.75rem}
.mt-2{margin-top:1.5rem}
.mt-3{margin-top:2.25rem}
.mt-4{margin-top:3rem}

/* ---------- Reveal animation ---------- */
.reveal{opacity:0; transform:translateY(14px); transition:opacity .6s var(--ease), transform .6s var(--ease)}
.reveal.is-in{opacity:1; transform:none}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1; transform:none; transition:none}
  .btn:hover,.card--hover:hover,.choice:hover{transform:none}
}

/* ---------- Print ---------- */
@media print{
  .site-header,.mobile-menu,.staging,.cta-band,.site-footer{display:none}
  body{font-size:12pt}
}

/* ---------- Spacing refinements ---------- */
.section-head h2 + .lede,
.page-hero h1 + .lede{margin-top:1.15rem}

/* Sticky intro column beside a long list */
@media (min-width:961px){
  .split--sticky>*:first-child{position:sticky; top:104px}
}

/* Form label refinements */
.field>span{display:block}
.radio span strong{font-weight:600}
.radio .tiny{color:var(--muted-2)}

/* Staging banner: keep to one line on small screens */
@media (max-width:700px){
  .staging{font-size:.6875rem; letter-spacing:.04em}
  .staging .opt{display:none}
}
@media (max-width:560px){
  .hero-eyebrow .opt{display:none}
}

/* ---------- Case study cards ---------- */
.case-card{
  display:flex; flex-direction:column;
  background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg);
  padding:clamp(1.5rem,1.1rem + 1.2vw,2rem);
  text-decoration:none; color:inherit;
  transition:border-color .22s var(--ease), transform .22s var(--ease), box-shadow .22s var(--ease);
}
.case-card:hover{border-color:#CFC7B9; transform:translateY(-3px); box-shadow:var(--shadow)}
.case-meta{
  font-size:.75rem; font-weight:600; letter-spacing:.06em; text-transform:uppercase;
  color:var(--accent); margin-bottom:.9rem; line-height:1.5;
}
.case-card h3{margin-bottom:.6rem}
.case-card p{color:var(--muted); font-size:.9375rem}
.case-more{
  margin-top:auto; padding-top:1.5rem;
  font-size:.875rem; font-weight:600; color:var(--ink);
  display:inline-flex; align-items:center; gap:.4em;
  transition:gap .2s var(--ease), color .2s var(--ease);
}
.case-card:hover .case-more{color:var(--accent); gap:.65em}

/* Full case study entries */
.case{
  padding:clamp(2.25rem,1.5rem + 3vw,3.5rem) 0;
  border-top:1px solid var(--line);
  scroll-margin-top:120px;
}
.case:first-of-type{border-top:0; padding-top:0}
.case-head{margin-bottom:1.75rem}
.case-head .case-meta{margin-bottom:.7rem}
.case-body{display:grid; grid-template-columns:minmax(0,1.6fr) minmax(0,1fr); gap:clamp(2rem,1rem + 3vw,3.5rem); align-items:start}
@media (max-width:860px){.case-body{grid-template-columns:minmax(0,1fr); gap:1.75rem}}
.case-body p{color:var(--muted); font-size:1rem}
.case-body p+p{margin-top:1.1rem}
.case-tags{
  border-left:2px solid var(--accent-soft); padding-left:1.5rem;
}
.case-tags h4{
  font-size:.6875rem; font-weight:700; letter-spacing:.13em; text-transform:uppercase;
  color:var(--muted-2); margin-bottom:1rem;
}
.case-tags ul{list-style:none; display:grid; gap:.6rem}
.case-tags li{font-size:.875rem; font-weight:500; color:var(--ink-3)}

/* ---------- Scale ladder (SME positioning) ---------- */
.ladder{display:flex; flex-wrap:wrap; align-items:stretch; gap:.75rem; list-style:none; margin-top:2rem}
.ladder li{
  flex:1 1 130px; padding:1.1rem 1.25rem;
  border:1px solid var(--line); border-radius:var(--radius); background:#fff;
}
.ladder b{
  display:block; font-family:'Instrument Serif',serif; font-weight:400;
  font-size:1.75rem; line-height:1; color:var(--ink);
}
.ladder span{display:block; margin-top:.45rem; font-size:.8125rem; color:var(--muted)}
.ladder li:first-child{border-color:var(--accent); background:var(--accent-soft)}
.ladder li:first-child b{color:var(--accent-dk)}

/* Slightly wider desktop nav breakpoint (one more top-level item) */
@media (max-width:1180px){
  .nav-main{display:none}
  .nav-toggle{display:inline-flex}
  .brand-sub{display:none}
}
@media (min-width:1181px){
  .nav-link{padding-left:.7rem; padding-right:.7rem}
}

/* Contact: form column wider than the aside on desktop only.
   Declared in a min-width query (not inline) so the single-column
   stacking rule below 961px is not overridden. */
@media (min-width:961px){
  .split--form{grid-template-columns:minmax(0,1.55fr) minmax(0,1fr)}
}

/* ---------- Legal / policy pages ---------- */
.policy h2{margin-top:2.75rem; margin-bottom:.85rem}
.policy h2:first-child{margin-top:0}
.policy h3{margin-bottom:.6rem}
.policy p{color:var(--muted)}
.policy p+p{margin-top:1rem}
.policy>ul{margin:1rem 0 0}
.policy ul+h2{margin-top:2.75rem}
.policy a{color:var(--ink)}

/* ---------- Careers: embedded Google Form ---------- */
.form-embed{
  border:1px solid var(--line); border-radius:var(--radius-lg);
  background:#fff; overflow:hidden; margin-top:2rem;
}
.form-embed iframe{
  display:block; width:100%; border:0;
  height:1850px;             /* same height the previous careers page used */
}
@media (max-width:600px){
  .form-embed iframe{height:2080px}
}
.form-embed-fallback{
  padding:1.1rem 1.35rem; border-top:1px solid var(--line);
  background:var(--sand); font-size:.875rem; color:var(--muted);
}
.form-embed-fallback a{color:var(--ink); font-weight:600}

/* Trust notice (no recruitment fees) */
.notice{
  border:1px solid var(--accent); border-radius:var(--radius-lg);
  background:linear-gradient(180deg,var(--accent-soft),#fff 55%);
  padding:clamp(1.5rem,1.1rem + 1.4vw,2.25rem);
}
.notice h2,.notice h3{margin-bottom:.75rem}
.notice p{color:var(--muted); font-size:.9375rem}
.notice p+p{margin-top:.85rem}

/* Backward-compatible anchor aliases, offset for the sticky header */
.anchor{display:block; position:relative; top:-104px; height:0; visibility:hidden}

/* Careers prose blocks */
.prose h3{margin-top:2.5rem; margin-bottom:.85rem}
.prose h3:first-child{margin-top:0}
.prose p{color:var(--muted)}
.prose p+p{margin-top:1rem}
.prose ul{margin-top:1.1rem}

/* Keep the "SINCE 2005" badge on one line on narrow screens */
.hero-eyebrow b{white-space:nowrap}

/* ---------- Mobile menu CTA ----------
   ".mobile-menu a" (class + element) is more specific than ".btn", so it was
   overriding the button's display, padding, border and font-size. That left
   the CTA as a block element with no horizontal padding, which pushed its
   label to the left edge of the pill and made justify-content inert.
   Restore the button's own layout explicitly. */
.mobile-menu .btn{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.55em;
  width:100%;
  padding:1rem 1.6rem;
  margin-top:1.75rem;
  border-bottom:0;
  font-size:.9375rem;
  text-align:center;
}
