@font-face{font-family:"Inter Tight";src:url(fonts/inter-tight-500.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Inter Tight";src:url(fonts/inter-tight-600.woff2) format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Inter Tight";src:url(fonts/inter-tight-700.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Inter";src:url(fonts/inter-400.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Inter";src:url(fonts/inter-500.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Inter";src:url(fonts/inter-600.woff2) format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url(fonts/plex-mono-400.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}

:root{
  --white:#FFFFFF;
  --paper:#FAFAF7;
  --navy:#0B1533;        /* ink + dark bands */
  --navy-2:#16224A;
  --text:#2B3550;
  --muted:#5D6680;
  --line:#E3E1DA;
  --orange:#FF5A1F;      /* signature accent */
  --orange-ink:#C2410C;  /* orange for small text on light (AA) */
  --blue:#2F5BFF;        /* electric cobalt */
  --blue-ink:#1F45E0;
  --sun:#FFC83D;         /* small highlights only */
  --peach:#FFF1E8;
  --sky:#EDF2FF;
  --display:"Inter Tight","Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --sans:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Consolas,monospace;
  --gutter:clamp(20px,5vw,64px);
  --max:1240px;
  --radius:18px;
  color-scheme:light;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:76px}
body{margin:0;background:var(--paper);color:var(--navy);font:400 17px/1.65 var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:inherit}
p{margin:0}
figure{margin:0}
img{display:block;max-width:100%;height:auto}
:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
::selection{background:var(--orange);color:var(--white)}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-9999px;top:0;background:var(--navy);color:var(--white);padding:10px 16px;z-index:20}
.skip:focus{left:16px;top:12px}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gutter)}

/* ---------- Type primitives ---------- */
.label{font:500 12px/1.4 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--blue-ink);display:flex;align-items:center;gap:12px;margin-bottom:20px}
.label::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--orange);flex:none}
.label--light{color:#9DB2FF}
.label--ink{color:var(--navy)}
.label--ink::before{background:var(--navy)}
.sublabel{font:500 11.5px/1.4 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:44px 0 6px}
.h2{font:700 clamp(36px,4.4vw,60px)/1.02 var(--display);letter-spacing:-.03em;margin:0 0 22px;color:inherit}
.prose-lead{font-size:clamp(17px,1.35vw,20px);line-height:1.65;color:var(--text);max-width:36em}
.prose p{color:var(--text);max-width:38em}
.prose p+p{margin-top:1em}
.prose--cols{display:grid;grid-template-columns:1fr 1fr;gap:28px 48px;margin-top:40px}
.prose--cols p+p{margin-top:0}
.hl{color:var(--orange)}
.u{background:linear-gradient(transparent 62%,rgba(255,200,61,.55) 62%)}

/* ---------- Brand ---------- */
.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--navy)}
.brand__mark{width:30px;height:30px;flex:none}
.m-stem{fill:var(--navy)}
.m-flag{fill:var(--orange)}
.brand__word{font:700 20px/1 var(--display);letter-spacing:-.02em}
.brand--light{color:var(--white)}
.brand--light .m-stem{fill:var(--white)}

/* ---------- Masthead ---------- */
.masthead{position:sticky;top:0;z-index:10;background:rgba(250,250,247,.86);-webkit-backdrop-filter:saturate(1.4) blur(12px);backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid var(--line)}
.masthead__row{display:flex;align-items:center;justify-content:space-between;height:70px}
.nav{display:flex;align-items:center;gap:30px;font-size:14.5px;font-weight:500}
.nav a{text-decoration:none;color:var(--text);transition:color .2s}
.nav a:hover{color:var(--orange-ink)}
.nav .nav__cta{color:var(--white);background:var(--navy);padding:10px 18px;border-radius:999px;transition:background .2s}
.nav .nav__cta:hover{background:var(--blue);color:var(--white)}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:10px;background:var(--orange);color:var(--navy);text-decoration:none;font:600 16px/1 var(--sans);padding:18px 28px;border-radius:999px;box-shadow:0 10px 24px -10px rgba(255,90,31,.7);transition:transform .25s,box-shadow .25s,background .25s}
.btn::after{content:"→";transition:transform .25s}
.btn:hover{transform:translateY(-2px);box-shadow:0 16px 30px -12px rgba(255,90,31,.8)}
.btn:hover::after{transform:translateX(3px)}
.link-arrow{font-size:16px;font-weight:500;color:var(--navy);text-decoration:none;border-bottom:2px solid var(--blue);padding-bottom:3px;transition:color .2s}
.link-arrow::after{content:" ↓";color:var(--blue)}
.link-arrow:hover{color:var(--blue-ink)}

/* ---------- Photographs ---------- */
.hero__photo,.clients__photo,.approach__photo,.contact__photo{isolation:isolate;position:relative}
.frame{position:relative;border-radius:var(--radius)}
.frame::before{content:"";position:absolute;inset:22px -22px -22px 22px;border-radius:var(--radius);z-index:-1}
.frame--orange::before{background:var(--orange)}
.frame--blue::before{background:var(--blue);inset:22px 22px -22px -22px}
.frame img{width:100%;border-radius:var(--radius)}

/* ---------- Hero ---------- */
.hero{padding:clamp(48px,6.5vw,96px) 0 clamp(80px,9vw,128px);position:relative;overflow:hidden;background:
  radial-gradient(640px 420px at 88% 8%,rgba(47,91,255,.10),transparent 70%),
  radial-gradient(520px 380px at 4% 96%,rgba(255,90,31,.10),transparent 70%),var(--paper)}
.hero__grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(40px,6vw,96px);align-items:center}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font:600 13px/1 var(--sans);color:var(--navy);background:var(--white);border:1px solid var(--line);padding:9px 14px 9px 12px;border-radius:999px;margin-bottom:30px;box-shadow:0 4px 14px -8px rgba(11,21,51,.25)}
.dot{width:8px;height:8px;border-radius:50%;background:var(--orange);box-shadow:0 0 0 4px rgba(255,90,31,.18)}
.hero h1{font:700 clamp(50px,6.4vw,92px)/.98 var(--display);letter-spacing:-.04em;margin:0 0 30px;color:var(--navy)}
.hero h1 .hl{display:block}
.hero__lead{font-size:clamp(17px,1.4vw,20px);line-height:1.65;color:var(--text);max-width:32em}
.hero__actions{display:flex;flex-wrap:wrap;align-items:center;gap:20px 30px;margin-top:40px}
.hero__facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:clamp(44px,5vw,64px) 0 0}
.hero__facts div{background:var(--white);border:1px solid var(--line);border-radius:14px;padding:16px 18px}
.hero__facts div:nth-child(1){border-top:4px solid var(--orange)}
.hero__facts div:nth-child(2){border-top:4px solid var(--blue)}
.hero__facts div:nth-child(3){border-top:4px solid var(--navy)}
.hero__facts dt{font:500 11px/1.4 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.hero__facts dd{margin:0;font:600 17px/1.3 var(--display);letter-spacing:-.01em;color:var(--navy)}
.tag{position:absolute;font:600 13px/1 var(--sans);background:var(--navy);color:var(--white);padding:12px 16px;border-radius:999px;box-shadow:0 12px 26px -12px rgba(11,21,51,.6)}
.tag b{color:var(--orange);font-weight:600}
.tag--hero{left:-22px;bottom:56px}

/* ---------- Premise ---------- */
.premise{padding-bottom:clamp(80px,10vw,136px);background:var(--white)}
.bleed{position:relative}
.bleed img{width:100%;height:clamp(320px,47.6vw,720px);object-fit:cover;object-position:50% 50%}
.bleed::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(11,21,51,.78) 100%);pointer-events:none}
.bleed__cap{position:absolute;z-index:1;left:0;right:0;bottom:clamp(24px,4vw,56px);margin:0 auto;max-width:var(--max);padding:0 var(--gutter);color:var(--white);font:600 clamp(20px,2.4vw,34px)/1.2 var(--display);letter-spacing:-.02em}
.bleed__cap span{color:var(--orange)}
.premise .split{margin-top:clamp(64px,8vw,104px)}
.split{display:grid;grid-template-columns:220px minmax(0,1fr);gap:24px 56px;align-items:start}
.split .label{margin-top:12px}
.statement{font:600 clamp(28px,3.1vw,42px)/1.22 var(--display);letter-spacing:-.025em;color:var(--navy);max-width:25em}

/* ---------- Bands ---------- */
.band{padding:clamp(88px,10vw,140px) 0}
.band--peach{background:var(--peach)}
.band--sky{background:var(--sky)}
.band--navy{background:var(--navy);color:var(--white);position:relative;overflow:hidden}
.band--navy::before{content:"";position:absolute;width:720px;height:720px;right:-240px;top:-260px;border-radius:50%;background:radial-gradient(circle,rgba(47,91,255,.35),transparent 65%);pointer-events:none}
.band--navy .prose-lead{color:#C9D2EE}
.band--orange{background:var(--orange);color:var(--navy)}
.section-head{max-width:46em;position:relative}

/* ---------- Clients ---------- */
.clients{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(48px,7vw,112px);align-items:start}
.clients__photo{position:sticky;top:110px}
.criteria{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:40px 0 0}
.criteria div{background:var(--white);border-radius:14px;padding:22px 22px 24px;box-shadow:0 1px 0 rgba(11,21,51,.04),0 10px 24px -18px rgba(11,21,51,.35)}
.criteria dt{font:700 21px/1.2 var(--display);letter-spacing:-.02em;color:var(--navy);margin-bottom:6px;display:flex;align-items:center;gap:10px}
.criteria dt::before{content:"";width:12px;height:12px;border-radius:3px;background:var(--orange);flex:none}
.criteria div:nth-child(2) dt::before{background:var(--blue)}
.criteria div:nth-child(3) dt::before{background:var(--sun)}
.criteria div:nth-child(4) dt::before{background:var(--navy)}
.criteria dd{margin:0;font-size:15px;line-height:1.6;color:var(--muted)}
.moments{list-style:none;margin:0;padding:0}
.moments li{position:relative;padding:15px 0 15px 32px;border-bottom:1px solid rgba(11,21,51,.12);color:var(--text);font-weight:500}
.moments li::before{content:"→";position:absolute;left:0;top:15px;color:var(--orange-ink);font-weight:600}

/* ---------- Practice ---------- */
.practice{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(40px,6vw,96px);margin-top:clamp(48px,6vw,80px);align-items:start}
.venn{position:sticky;top:110px;background:var(--white);border:1px solid var(--line);border-radius:24px;padding:clamp(20px,3vw,40px)}
.venn svg{display:block;width:100%;height:auto}
.venn__a{fill:var(--blue);mix-blend-mode:multiply;opacity:.95}
.venn__b{fill:var(--orange);mix-blend-mode:multiply;opacity:.95}
.venn__ab{fill:var(--navy)}
.venn__t{font:700 13px var(--display);letter-spacing:.1em;fill:var(--white)}
.venn__t--sm{font-size:12.5px}
.venn__s{font:500 12.5px var(--sans);fill:rgba(255,255,255,.88)}
.js .venn circle,.js .venn path{transform-box:fill-box;transform-origin:center;transform:scale(.6);opacity:0;transition:transform 1s cubic-bezier(.2,.8,.2,1),opacity .8s}
.js .venn .venn__b{transition-delay:.15s}
.js .venn .venn__ab{transition-delay:.45s}
.js .venn text{opacity:0;transition:opacity .6s .8s}
.js .venn.is-in circle,.js .venn.is-in path{transform:none;opacity:1}
.js .venn.is-in .venn__a,.js .venn.is-in .venn__b{opacity:.95}
.js .venn.is-in text{opacity:1}
.practice__cols{display:grid;gap:clamp(48px,5vw,64px)}
.practice__head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding-bottom:14px;border-bottom:3px solid var(--blue)}
.practice__col--orange .practice__head{border-color:var(--orange)}
.practice__name{font:700 clamp(32px,3vw,42px)/1 var(--display);letter-spacing:-.03em}
.practice__sub{font:500 11.5px/1.4 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--blue-ink)}
.practice__col--orange .practice__sub{color:var(--orange-ink)}
.caps{margin:0;display:grid;grid-template-columns:1fr 1fr}
.caps div{padding:22px 24px 22px 0;border-bottom:1px solid var(--line)}
.caps div:nth-child(even){padding-left:24px;border-left:1px solid var(--line)}
.caps dt{font:600 17px/1.35 var(--display);letter-spacing:-.01em;margin-bottom:6px;color:var(--navy)}
.caps dd{margin:0;font-size:15px;line-height:1.6;color:var(--muted)}

/* ---------- Approach ---------- */
.approach__top{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(48px,6vw,96px);align-items:center;position:relative}
.tenets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:clamp(72px,8vw,112px);position:relative}
.tenet{background:var(--navy-2);border:1px solid rgba(255,255,255,.08);border-radius:20px;padding:30px 28px 32px;border-top:6px solid var(--orange)}
.tenet--blue{border-top-color:var(--blue)}
.tenet--sun{border-top-color:var(--sun)}
.tenet__k{font:700 clamp(23px,2vw,28px)/1.15 var(--display);letter-spacing:-.025em;margin-bottom:14px;color:var(--white)}
.tenet__v{font-size:15.5px;line-height:1.7;color:#C9D2EE}

/* ---------- Standard ---------- */
.spec{width:100%;border-collapse:separate;border-spacing:0;margin-top:16px;background:var(--white);border-radius:20px;overflow:hidden;box-shadow:0 18px 40px -28px rgba(11,21,51,.45)}
.spec th,.spec td{text-align:left;vertical-align:baseline;padding:24px 28px;border-bottom:1px solid var(--line)}
.spec tr:last-child th,.spec tr:last-child td{border-bottom:0}
.spec th{width:200px;font:500 12px/1.5 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--blue-ink)}
.spec td{font:600 clamp(18px,1.6vw,22px)/1.4 var(--display);letter-spacing:-.015em;color:var(--navy)}

/* ---------- Founder ---------- */
.founder__quote{margin:0 0 36px;padding:0}
.founder__quote p{font:700 clamp(34px,4.2vw,60px)/1.06 var(--display);letter-spacing:-.035em;color:var(--navy);max-width:18em}
.founder__quote p::before{content:"“"}
.founder__quote p::after{content:"”"}
.founder__sig{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;padding:18px 0;border-top:2px solid var(--navy);border-bottom:1px solid rgba(11,21,51,.3);margin-bottom:28px;max-width:40em}
.founder__name{font:700 26px/1.1 var(--display);letter-spacing:-.02em}
.founder__role{font:500 12px/1.4 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--navy)}
.band--orange .prose p{color:var(--navy);font-size:18px}

/* ---------- Contact ---------- */
.contact{padding:clamp(88px,10vw,140px) 0;background:var(--white)}
.contact__grid{display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);gap:clamp(48px,7vw,112px);align-items:center}
.contact__title{font:700 clamp(44px,5.6vw,80px)/1 var(--display);letter-spacing:-.04em;margin:0 0 22px}
.contact__lead{font-size:clamp(17px,1.35vw,20px);color:var(--text);max-width:30em}
.contact__card{margin-top:44px;background:var(--paper);border:1px solid var(--line);border-radius:22px;overflow:hidden}
.contact__row{padding:28px 32px}
.contact__row+.contact__row{border-top:1px solid var(--line)}
.contact__k{font:500 11.5px/1.4 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.contact__email{font:700 clamp(24px,2.8vw,38px)/1.15 var(--display);letter-spacing:-.025em;word-break:break-word}
.contact__email a{text-decoration:none;background:linear-gradient(var(--orange),var(--orange)) 0 100%/0 3px no-repeat;transition:background-size .35s}
.contact__email a:hover{background-size:100% 3px}
.contact__v{font:600 20px/1.3 var(--display);letter-spacing:-.01em}
.copy{margin-top:16px;background:var(--navy);border:0;color:var(--white);font:600 13px/1 var(--sans);padding:11px 16px;border-radius:999px;cursor:pointer;transition:background .2s}
.copy:hover{background:var(--blue)}

/* ---------- Footer ---------- */
.foot{background:var(--navy);color:#C9D2EE;padding:clamp(64px,7vw,96px) 0 32px;font-size:14.5px;position:relative;overflow:hidden}
.foot::before{content:"";position:absolute;left:0;right:0;top:0;height:6px;background:linear-gradient(90deg,var(--orange) 0 50%,var(--blue) 50% 100%)}
.foot__grid{display:grid;grid-template-columns:1.4fr 1fr 1fr .8fr;gap:40px 48px}
.foot__tag{margin-top:16px;max-width:22em;line-height:1.6}
.foot__k{font:500 11px/1.4 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--orange);margin-bottom:12px}
.foot__v{font-style:normal;line-height:1.7;color:var(--white)}
.foot__muted{color:#C9D2EE}
.foot a{text-decoration:none;transition:color .2s}
.foot a:hover{color:var(--orange)}
.foot__links{list-style:none;margin:0;padding:0;line-height:1.9;color:var(--white)}
.foot__base{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 32px;margin-top:clamp(48px,5vw,72px);padding-top:22px;border-top:1px solid rgba(255,255,255,.14);font-size:12.5px;color:#9AA6C9}

/* ---------- Motion (progressive; content is visible without JS) ---------- */
.js .reveal{opacity:0;transform:translateY(22px);transition:opacity .9s cubic-bezier(.2,.6,.2,1),transform .9s cubic-bezier(.2,.6,.2,1)}
.js .reveal.is-in{opacity:1;transform:none}
.hero__copy>*{animation:rise 1s cubic-bezier(.2,.6,.2,1) both}
.hero__copy>:nth-child(2){animation-delay:.08s}
.hero__copy>:nth-child(3){animation-delay:.16s}
.hero__copy>:nth-child(4){animation-delay:.24s}
.hero__copy>:nth-child(5){animation-delay:.32s}
.hero__photo{animation:rise 1.2s cubic-bezier(.2,.6,.2,1) .15s both}
@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .hero__copy>*,.hero__photo{animation:none}
  .js .reveal{opacity:1;transform:none;transition:none}
  .js .venn circle,.js .venn path,.js .venn text{opacity:1;transform:none;transition:none}
  .js .venn .venn__a,.js .venn .venn__b{opacity:.95}
  .btn,.btn::after{transition:none}
}

/* ---------- Responsive ---------- */
@media (max-width:1080px){
  .caps{grid-template-columns:1fr}
  .caps div:nth-child(even){padding-left:0;border-left:0}
}
@media (max-width:960px){
  .split{grid-template-columns:1fr;gap:0}
  .hero__grid,.clients,.practice,.approach__top,.contact__grid{grid-template-columns:1fr}
  .hero__photo{max-width:540px}
  .clients__photo,.venn{position:static}
  .clients__photo,.contact__photo{max-width:460px}
  .venn{max-width:560px}
  .tenets{grid-template-columns:1fr}
  .foot__grid{grid-template-columns:1fr 1fr}
  .foot__brand{grid-column:1/-1}
}
@media (max-width:720px){
  body{font-size:16px}
  .nav a:not(.nav__cta){display:none}
  .masthead__row{height:62px}
  .hero__facts{grid-template-columns:1fr}
  .criteria{grid-template-columns:1fr}
  .prose--cols{grid-template-columns:1fr;gap:16px}
  .spec th,.spec td{display:block;width:auto}
  .spec th{padding:20px 22px 4px;border-bottom:0}
  .spec td{padding:0 22px 20px}
  .frame::before{inset:12px -12px -12px 12px}
  .frame--blue::before{inset:12px 12px -12px -12px}
  .tag--hero{left:12px;bottom:24px}
  .contact__row{padding:22px 20px}
  .foot__grid{grid-template-columns:1fr}
}
@media (max-width:480px){
  .contact__email{font-size:clamp(17px,5.4vw,22px);letter-spacing:-.02em}
}
