:root{
  --ink:#070B10;
  --ink-2:#0D141D;
  --ink-3:#1B2532;
  --pale:#E9EBEF;
  --pale-2:#D7DCE3;
  --amber:#F0A63C;
  --sea:#79BCB4;
  --muted:#A8B4BE;
  --muted-dark:#788896;
  --label:#9AABB8;
  --display:"Bricolage Grotesque",system-ui,sans-serif;
  --body:"Public Sans",system-ui,sans-serif;
  --gut:clamp(20px,5vw,72px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--ink);color:var(--pale);
  font-family:var(--body);font-size:17px;line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit}
img,svg{max-width:100%}
:focus-visible{outline:2px solid var(--amber);outline-offset:3px;border-radius:2px}

.wrap{max-width:1180px;margin:0 auto;padding-left:var(--gut);padding-right:var(--gut)}
.eyebrow{
  font-family:var(--body);font-size:13px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  color:var(--sea);margin:0 0 18px;
}
.section-light .eyebrow{color:#2F5E56}
h1,h2,h3{font-family:var(--display);font-weight:700;letter-spacing:-.02em;line-height:1.05;margin:0}
h1{font-size:clamp(38px,6.4vw,72px);font-weight:800}
h2{font-size:clamp(28px,4vw,44px)}
h3{font-size:20px;letter-spacing:-.01em}
p{margin:0 0 16px}

/* ---------- header ---------- */
.site-head{
  position:sticky;top:0;z-index:40;background:rgba(7,11,16,.88);
  backdrop-filter:blur(10px);border-bottom:1px solid var(--ink-3);
}
.head-in{display:flex;align-items:center;gap:24px;height:72px}
@media(max-width:640px){.head-in{height:62px}}
.mark{display:flex;flex-direction:column;align-items:flex-start;gap:6px;text-decoration:none;min-width:0}
.mark-tag{
  font-family:var(--body);font-size:12px;font-weight:500;letter-spacing:.03em;
  color:var(--pale-2);white-space:nowrap;
}
@media(max-width:430px){.mark-tag{font-size:11px;letter-spacing:.02em}}
.logo-shell{position:relative;display:flex;align-items:center;isolation:isolate}
.logo-shell:before{
  content:"";position:absolute;inset:-8px -14px;z-index:-1;border-radius:999px;
  background:
    radial-gradient(58% 78% at 22% 50%, rgba(240,166,60,.26), transparent 72%),
    radial-gradient(58% 78% at 78% 50%, rgba(121,188,180,.24), transparent 72%);
  filter:blur(8px);
}
.mark-img{
  display:block;height:40px;width:auto;
  filter:drop-shadow(0 2px 10px rgba(0,0,0,.55));
  transition:transform .25s ease,filter .25s ease;
}
.mark:hover .mark-img{
  transform:translateY(-1px);
  filter:drop-shadow(0 2px 14px rgba(0,0,0,.6));
}
@media(max-width:640px){.mark-img{height:31px}}
.mark-txt{display:none;font-family:var(--display);font-weight:800;letter-spacing:.02em;font-size:26px}
.mark-txt span{color:var(--sea)}
.nav{margin-left:auto;display:flex;gap:26px;align-items:center}
.nav a{font-size:15px;text-decoration:none;color:var(--label)}
.nav a:hover{color:var(--pale)}
.nav-toggle{
  display:none;margin-left:auto;background:none;cursor:pointer;color:var(--pale);
  border:1px solid var(--ink-3);border-radius:2px;padding:11px 12px;line-height:0;
}
.nav-toggle i{display:block;width:20px;height:2px;background:currentColor;margin:4px 0;
  transition:transform .22s ease,opacity .22s ease}
.nav-toggle[aria-expanded="true"] i:nth-child(1){transform:translateY(6px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] i:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

@media(max-width:959px){
  .nav-toggle{display:block}
  .nav{
    display:none;position:absolute;left:0;right:0;top:100%;
    flex-direction:column;align-items:stretch;gap:0;
    background:var(--ink);border-bottom:1px solid var(--ink-3);
    padding:4px var(--gut) 24px;max-height:calc(100vh - 62px);overflow-y:auto;
  }
  .nav.open{display:flex}
  .nav a{font-size:16.5px;color:var(--pale);padding:16px 2px;border-top:1px solid var(--ink-3)}
  .nav .btn{margin-top:18px;text-align:center;padding:15px 20px;font-size:16px;border-top:0}
}
.btn{
  display:inline-block;font-family:var(--body);font-weight:600;font-size:15px;
  padding:11px 20px;border-radius:2px;text-decoration:none;border:1px solid transparent;
  transition:transform .15s ease,background .15s ease,color .15s ease;
}
.btn-solid{background:var(--amber);color:var(--ink)}
.btn-solid:hover{transform:translateY(-1px);background:#FFB855;color:var(--ink)}
.nav a.btn-solid,.nav a.btn-solid:hover{color:var(--ink)}
.btn-line{border-color:var(--ink-3);color:var(--pale)}
.btn-line:hover{border-color:var(--sea);color:var(--sea)}
.nav-cta{display:inline-block}

/* ---------- hero ---------- */
.hero{padding:clamp(52px,8vw,96px) 0 clamp(56px,8vw,88px)}
.hero-grid{display:grid;gap:clamp(36px,6vw,60px);grid-template-columns:1fr}
@media(min-width:980px){.hero-grid{grid-template-columns:1.02fr .98fr;align-items:center}}
.hero h1 span{color:var(--amber)}
.hero-lede{font-size:clamp(17px,1.5vw,19px);color:var(--pale-2);max-width:34em;margin-top:22px}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.hero-meta{
  margin-top:34px;padding-top:20px;border-top:1px solid var(--ink-3);
  display:flex;flex-wrap:wrap;gap:10px;
}
.chip{
  font-family:var(--body);font-size:12px;font-weight:500;color:var(--pale-2);
  border:1px solid var(--ink-3);border-radius:2px;padding:5px 9px;
}

/* ---------- signature: trace panel ---------- */
.trace{
  background:var(--ink-2);border:1px solid var(--ink-3);border-radius:3px;overflow:hidden;
}
.trace-bar{
  display:flex;align-items:center;gap:10px;padding:11px 16px;
  border-bottom:1px solid var(--ink-3);font-family:var(--body);font-size:12px;font-weight:600;
  letter-spacing:.06em;text-transform:uppercase;color:var(--pale-2);
}
.live{width:7px;height:7px;border-radius:50%;background:var(--amber);flex:none;
  animation:blip 2.2s ease-in-out infinite}
@keyframes blip{0%,100%{opacity:1}50%{opacity:.25}}
.trace-svg{display:block;width:100%;padding:26px 16px 6px}
.flowline{stroke:var(--ink-3);stroke-width:1.5;fill:none}
.flowdash{stroke:var(--amber);stroke-width:1.5;fill:none;
  stroke-dasharray:5 13;animation:flow 1.6s linear infinite}
@keyframes flow{to{stroke-dashoffset:-36}}
.node-box{fill:var(--ink);stroke:var(--ink-3);stroke-width:1}
.node-label{fill:var(--pale);font-family:"Bricolage Grotesque",sans-serif;font-size:12.5px;font-weight:700}
.node-sub{fill:var(--pale-2);font-family:"Public Sans",system-ui,sans-serif;font-size:10px;font-weight:500}
.topic-txt{fill:var(--sea);font-family:"Public Sans",system-ui,sans-serif;font-size:11px;font-weight:600}
.trace-log{
  font-family:var(--body);font-size:13px;line-height:2.05;
  padding:10px 16px 18px;min-height:132px;
}
.log-line{display:flex;gap:12px;opacity:0;animation:fadein .4s ease forwards}
@keyframes fadein{to{opacity:1}}
.log-k{color:var(--amber);width:62px;flex:none;font-weight:600}
.log-v{color:var(--pale-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.log-v b{color:var(--pale);font-weight:600}
.trace-note{
  border-top:1px solid var(--ink-3);padding:11px 16px;
  font-family:var(--body);font-size:12px;color:var(--label);
}
@media(prefers-reduced-motion:reduce){
  .flowdash,.live{animation:none}
  .log-line{opacity:1;animation:none}
  html{scroll-behavior:auto}
}

/* ---------- generic sections ---------- */
.section{padding:clamp(56px,8vw,100px) 0}
.section,.brandband,.contact{scroll-margin-top:80px}
@media(max-width:640px){.section,.brandband,.contact{scroll-margin-top:66px}}
.section-light{background:var(--pale);color:var(--ink)}
.section-light p{color:#3B4C4E}
.section-head{max-width:46em;margin-bottom:clamp(32px,4vw,48px)}
.section-head p{font-size:17.5px;color:var(--pale-2)}
.section-light .section-head p{color:#3B4C4E}

/* services */
.grid-4{display:grid;gap:1px;background:var(--pale-2);border:1px solid var(--pale-2)}
@media(min-width:700px){.grid-4{grid-template-columns:1fr 1fr}}
@media(min-width:1060px){.grid-4{grid-template-columns:repeat(4,1fr)}}
.svc{background:var(--pale);padding:28px 24px 30px;display:flex;flex-direction:column;gap:14px}
.svc-tag{font-family:var(--body);font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#3D4F5F;display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.svc-soon{font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#22160A;background:var(--amber);padding:3px 8px;border-radius:2px;line-height:1.2}
.svc h3{color:var(--ink)}
.svc p{font-size:15.5px;margin:0}
.svc ul{list-style:none;margin:4px 0 0;padding:0;font-size:14.5px;color:#3B4C4E}
.svc li{padding:7px 0 7px 16px;border-top:1px solid var(--pale-2);position:relative}
.svc li:before{content:"";position:absolute;left:0;top:15px;width:6px;height:1px;background:var(--muted-dark)}

/* engagement models */
.grid-3{display:grid;gap:20px}
@media(min-width:820px){.grid-3{grid-template-columns:repeat(3,1fr)}}
.model{border:1px solid var(--ink-3);border-radius:3px;padding:26px 24px 28px;background:var(--ink-2)}
.model-tag{font-family:var(--body);font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  color:var(--amber);margin-bottom:14px}
.model h3{margin-bottom:10px}
.model p{font-size:15.5px;color:var(--pale-2);margin:0}

/* partners */
.partners{display:grid;gap:24px}
@media(min-width:760px){.partners{grid-template-columns:1fr 1fr}}
.partner{
  border:1px solid var(--pale-2);border-radius:3px;padding:28px 26px;background:#fff;
}
.partner-name{font-family:var(--display);font-weight:800;font-size:30px;letter-spacing:-.02em;color:var(--ink)}
.partner-role{font-family:var(--body);font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  color:#3D4F5F;margin:6px 0 14px}
.partner p{font-size:15.5px;margin:0}

/* regulated band */
.reg{display:grid;gap:26px}
@media(min-width:860px){.reg{grid-template-columns:repeat(4,1fr)}}
.reg-item h3{font-size:17px;margin-bottom:8px}
.reg-item p{font-size:15px;color:var(--pale-2);margin:0}
.reg-num{font-family:var(--body);font-size:12px;font-weight:600;color:var(--sea);display:block;margin-bottom:12px}

/* about */
.about-grid{display:grid;gap:clamp(32px,5vw,56px)}
@media(min-width:940px){.about-grid{grid-template-columns:1.25fr .75fr;align-items:start}}
.about-body p{font-size:17.5px;color:var(--pale-2);max-width:38em}
.about-body p strong{color:var(--pale);font-weight:600}
.about-pull{
  font-family:var(--display);font-weight:700;letter-spacing:-.015em;
  font-size:clamp(19px,2.2vw,24px);line-height:1.35;color:var(--pale);
  border-left:3px solid var(--sea);padding-left:20px;margin:28px 0 26px;max-width:26em;
}
.glance{border:1px solid var(--ink-3);border-radius:3px;background:var(--ink-2);padding:6px 24px 12px}
.glance-k{font-family:var(--body);font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  color:var(--sea);padding:20px 0 4px;margin:0}
.glance dl{margin:0}
.glance div{display:flex;gap:16px;padding:14px 0;border-top:1px solid var(--ink-3)}
.glance dt{font-family:var(--body);font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;
  color:var(--label);width:96px;flex:none;padding-top:3px}
.glance dd{margin:0;font-size:15.5px;color:var(--pale)}

/* name + vision */
.brandband{border-top:1px solid var(--ink-3);border-bottom:1px solid var(--ink-3);
  padding:clamp(52px,7vw,92px) 0}
.name-head{max-width:32em;margin-bottom:clamp(36px,5vw,56px)}
.name-head h2 em{font-style:normal;color:var(--amber)}
.brand-line{line-height:1.15}
.brand-line b{font-weight:800;color:var(--amber)}
.brand-line b:nth-of-type(2),.brand-line b:nth-of-type(4){color:var(--sea)}
.name-head p{color:var(--pale-2);font-size:17.5px;margin-top:18px;max-width:38em}
.letters{display:grid;gap:1px;background:var(--ink-3);border:1px solid var(--ink-3)}
@media(min-width:640px){.letters{grid-template-columns:1fr 1fr}}
@media(min-width:1020px){.letters{grid-template-columns:repeat(4,1fr)}}
.letter{background:var(--ink);padding:26px 24px 30px}
.letter-glyph{
  font-family:var(--display);font-weight:800;font-size:clamp(48px,6vw,68px);line-height:.9;
  color:var(--amber);display:block;margin-bottom:16px;
}
.letter:nth-child(2) .letter-glyph,.letter:nth-child(4) .letter-glyph{color:var(--sea)}
.letter-word{font-family:var(--display);font-weight:700;font-size:21px;letter-spacing:-.01em;
  color:var(--pale);display:block;margin-bottom:10px}
.letter-desc{font-size:15px;color:var(--pale-2);margin:0}
.vision{
  margin-top:clamp(38px,5vw,56px);border-left:3px solid var(--amber);
  padding:6px 0 6px clamp(20px,3vw,32px);max-width:56em;
}
.vision-k{font-family:var(--body);font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  color:var(--sea);margin:0 0 16px}
.vision-stmt{font-family:var(--display);font-weight:500;letter-spacing:-.015em;
  font-size:clamp(20px,2.6vw,28px);line-height:1.35;color:var(--pale);margin:0}
.vision-stmt b{font-weight:800;color:#FFFFFF}
.vision-body{font-size:17px;color:var(--pale-2);margin:20px 0 0;max-width:44em}
.vision-body b{color:var(--pale);font-weight:600}
.vision-sub{font-family:var(--body);font-size:16px;font-weight:500;letter-spacing:.02em;
  color:var(--pale-2);margin:26px 0 0;line-height:1.7}

/* contact */
.contact{background:var(--ink-2);border-top:1px solid var(--ink-3)}
.contact-grid{display:grid;gap:36px}
@media(min-width:900px){.contact-grid{grid-template-columns:1.1fr .9fr;align-items:start}}
.contact h2{max-width:14em}
.contact-lede{color:var(--pale-2);max-width:34em;margin-top:18px}
.detail{border-top:1px solid var(--ink-3);padding:16px 0;display:flex;gap:20px;align-items:baseline}
.detail-k{font-family:var(--body);font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;
  color:var(--label);width:92px;flex:none}
.detail-v{font-size:16px;color:var(--pale);text-decoration:none;word-break:break-word}
.detail-v:hover{color:var(--amber)}

/* footer */
.site-foot{padding:34px 0;border-top:1px solid var(--ink-3);font-size:14px;color:var(--label)}
.foot-in{display:flex;flex-wrap:wrap;gap:14px 28px;align-items:center}
.foot-in p{margin:0;color:var(--pale-2)}
.foot-logo{
  height:33px;width:auto;display:block;
  filter:drop-shadow(0 2px 8px rgba(0,0,0,.5));
}
@media(max-width:640px){.foot-logo{height:26px}}
.foot-tag{color:#FFFFFF;font-size:14.5px}
.foot-tm{font-family:var(--body);font-size:12px;line-height:1.7;margin-top:14px;color:var(--label)}
