/* ============ TOKENS (LOCKED) ============ */
:root{
  --h1: clamp(2.4rem, 5vw, 4rem);
  --h2: clamp(1.8rem, 3.2vw, 2.6rem);
  --h3: clamp(1.35rem, 2.2vw, 1.7rem);
  --h4: 1.2rem;  --h5: 1.05rem;  --h6: 0.95rem;
  --p: 1.05rem;  --small: 0.85rem;  --eyebrow: 0.72rem;
  --lh-tight: 1.12;  --lh-body: 1.6;

  --gutter: clamp(28px, 15vw, 200px);
  --sec-pad: clamp(72px, 10vw, 140px);

  /* ABV's REAL brand — sampled from their logo + live custom.css
     (logo: #0F9FDB / #005288 · site: #2AC4EA, #4564CC gradient, #FFB612 gold) */
  --canvas:#FAFCFE;
  --surface:#EFF5FA;
  --ink:#06263F;
  --muted:#3F5A70;
  --marine:#005288;      /* brand ink — CTAs, links, headings accent */
  --blue:#0F9FDB;        /* logo bright blue — graphic accent */
  --cyan:#2AC4EA;        /* live-site accent — graphic only */
  --indigo:#4564CC;      /* live footer gradient partner */
  --gold:#FFB612;        /* live-site gold — small committed marks */
  --band:#042A47;        /* deep marine band */
  --band-ink:#EAF3FA;
  --band-muted:#8FB0C9;
  --hairline:rgba(6,38,63,.12);
  --focus:#005288;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  font-family:"Archivo",system-ui,-apple-system,sans-serif;
  font-size:var(--p); line-height:var(--lh-body);
  color:var(--ink); background:var(--canvas);
  -webkit-font-smoothing:antialiased; overflow-x:clip;
}
h1{font-size:var(--h1)} h2{font-size:var(--h2)} h3{font-size:var(--h3)}
h4{font-size:var(--h4)} h5{font-size:var(--h5)} h6{font-size:var(--h6)}
h1,h2,h3{line-height:var(--lh-tight);letter-spacing:-0.025em;font-weight:600}
p{font-size:var(--p)}
img{max-width:100%;display:block}
a{color:var(--marine)}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:2px}
::selection{background:var(--blue);color:#fff}

.mono{font-family:"IBM Plex Mono",ui-monospace,monospace}
.eyebrow{
  font-family:"IBM Plex Mono",ui-monospace,monospace;
  font-size:var(--eyebrow); font-weight:600;
  letter-spacing:.18em; text-transform:uppercase;
  color:var(--marine); display:flex; align-items:center; gap:.65em;
}
.eyebrow::before{content:"";width:8px;height:8px;background:var(--gold);flex:none}
.eyebrow .n{color:var(--muted);font-weight:500}

.sec{padding:var(--sec-pad) var(--gutter)}
.skip{position:absolute;left:-9999px;top:0;background:var(--ink);color:#fff;padding:10px 16px;z-index:200}
.skip:focus{left:12px;top:12px}

/* ============ NAV ============ */
.nav{
  position:fixed;inset:0 0 auto 0;z-index:100;
  display:flex;align-items:center;justify-content:space-between;
  padding:18px var(--gutter);
  transition:background .3s,box-shadow .3s,padding .3s;
}
.nav.scrolled{background:rgba(250,252,254,.86);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--hairline);padding:12px var(--gutter)}
.nav .logo img{height:38px;width:auto}
.nav-links{display:flex;gap:clamp(14px,2vw,30px);align-items:center;list-style:none}
.nav-links a{
  font-size:var(--small);font-weight:500;color:var(--ink);
  text-decoration:none;letter-spacing:.01em;
}
.nav-links a:hover{color:var(--marine)}
.btn{
  display:inline-flex;align-items:center;gap:.55em;
  background:var(--marine);color:#fff;text-decoration:none;
  font-size:var(--small);font-weight:600;letter-spacing:.02em;
  padding:.8em 1.5em;border:0;cursor:pointer;
  transition:background .25s,transform .25s;
}
.btn:hover{background:#003D66;transform:translateY(-1px)}
.btn .a{transition:transform .25s}
.btn:hover .a{transform:translate(2px,-2px)}
.btn-ghost{
  display:inline-flex;align-items:center;gap:.5em;
  color:var(--marine);text-decoration:none;font-weight:600;font-size:var(--small);
  border-bottom:1px solid transparent;padding-bottom:2px;
}
.btn-ghost:hover{border-color:var(--marine)}
.burger{display:none;background:none;border:1px solid var(--hairline);width:42px;height:42px;cursor:pointer;flex-direction:column;gap:5px;align-items:center;justify-content:center}
.burger span{display:block;width:18px;height:2px;background:var(--ink)}
@media(max-width:900px){
  .nav-links{
    display:none;position:absolute;top:100%;left:0;right:0;
    background:var(--canvas);flex-direction:column;align-items:flex-start;
    padding:20px var(--gutter) 28px;gap:16px;box-shadow:0 12px 24px rgba(6,38,63,.08);
  }
  .nav-links.open{display:flex}
  .burger{display:flex}
}

/* ============ HERO ============ */
.hero{
  position:relative;min-height:94vh;display:flex;flex-direction:column;justify-content:flex-end;
  padding:0 var(--gutter);overflow:clip;background:var(--canvas);
}
#truss{position:absolute;inset:0;width:100%;height:100%;z-index:0}
.hero-fade{
  position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(100deg,var(--canvas) 22%,rgba(250,252,254,.55) 48%,rgba(250,252,254,0) 75%);
}
.hero-inner{position:relative;z-index:2;padding:150px 0 clamp(40px,6vh,72px);max-width:820px}
.hero .kicker{
  font-family:"IBM Plex Mono",ui-monospace,monospace;
  font-size:var(--eyebrow);font-weight:600;letter-spacing:.22em;text-transform:uppercase;
  color:var(--muted);margin:26px 0 14px;
}
.hero h1{font-weight:650;letter-spacing:-0.03em;color:var(--ink)}
.hero h1 .u{
  position:relative;white-space:nowrap;
}
.hero h1 .u svg{position:absolute;left:0;bottom:-.08em;width:100%;height:.16em;overflow:visible}
.hero h1 .u path{stroke:var(--gold);stroke-width:5;fill:none;stroke-linecap:round}
.hero .sub{color:var(--muted);max-width:56ch;margin:24px 0 34px}
.hero .sub strong{color:var(--ink);font-weight:600}
.hero-cta{display:flex;gap:26px;align-items:center;flex-wrap:wrap}
.hero-strip{
  position:relative;z-index:2;display:flex;flex-wrap:wrap;gap:0;
  border-top:1px solid var(--hairline);margin-top:clamp(36px,6vh,64px);
}
.hero-strip .cell{
  font-family:"IBM Plex Mono",ui-monospace,monospace;
  font-size:var(--eyebrow);letter-spacing:.14em;text-transform:uppercase;
  color:var(--muted);padding:16px 26px 22px 0;margin-right:26px;
  display:flex;align-items:center;gap:.7em;
}
.hero-strip .cell b{color:var(--ink);font-weight:600}
.hero-strip .cell::before{content:"";width:6px;height:6px;background:var(--blue);flex:none}
.hero-strip .cell:nth-child(2)::before{background:var(--gold)}
.hero-strip .cell:nth-child(3)::before{background:var(--indigo)}
.hero-strip .cell:nth-child(4)::before{background:var(--cyan)}

/* ============ REVEALS ============ */
.rv{opacity:0;transform:translateY(16px);transition:opacity .7s cubic-bezier(.2,.6,.2,1),transform .7s cubic-bezier(.2,.6,.2,1)}
.rv.in{opacity:1;transform:none}
.rv.d1{transition-delay:.08s}.rv.d2{transition-delay:.16s}.rv.d3{transition-delay:.24s}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}}
html.no-motion .rv{opacity:1 !important;transform:none !important;transition:none !important}

/* ============ RECORD BAND ============ */
.band{background:var(--band);color:var(--band-ink);position:relative;overflow:clip}
.band .eyebrow{color:var(--cyan)}
.band .eyebrow .n{color:var(--band-muted)}
.band h2{color:#fff;max-width:22ch;margin:18px 0 8px}
.band .lede{color:var(--band-muted);max-width:62ch}
.band-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(234,243,250,.14);
  border:1px solid rgba(234,243,250,.14);margin-top:52px;
}
.stat{background:var(--band);padding:clamp(22px,2.6vw,38px)}
.stat .num{
  font-size:var(--h1);font-weight:650;letter-spacing:-.03em;line-height:1;
  font-variant-numeric:tabular-nums;color:#fff;display:block;
}
.stat .num .fx{color:var(--cyan)}
.stat .lab{
  font-family:"IBM Plex Mono",ui-monospace,monospace;
  font-size:var(--eyebrow);letter-spacing:.14em;text-transform:uppercase;
  color:var(--band-muted);display:block;margin-top:14px;line-height:1.7;
}
.exits{
  display:flex;flex-wrap:wrap;align-items:baseline;gap:14px 0;
  margin-top:44px;border-top:1px solid rgba(234,243,250,.14);padding-top:26px;
}
.exits .t{
  font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:var(--eyebrow);
  letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin-right:30px;font-weight:600;
}
.exits .co{font-size:var(--h3);font-weight:600;letter-spacing:-.02em;color:#fff}
.exits .sep{color:var(--gold);margin:0 clamp(10px,1.4vw,22px);font-size:var(--h5)}
.band .fine{
  font-size:var(--small);color:var(--band-muted);margin-top:30px;max-width:70ch;
}
@media(max-width:900px){.band-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.band-grid{grid-template-columns:1fr}}

/* ============ ISSA ============ */
.issa-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(36px,6vw,90px);margin-top:54px}
.issa-card{
  position:relative;background:var(--band);color:#fff;overflow:clip;
  aspect-ratio:4/5;display:flex;flex-direction:column;justify-content:flex-end;
  padding:30px;align-self:start;position:sticky;top:110px;
}
.issa-card img.pic{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 16%;z-index:0}
.issa-card svg.lines{position:absolute;inset:0;width:100%;height:100%;z-index:1;mix-blend-mode:screen;opacity:.55;pointer-events:none}
.issa-card::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(to top,rgba(4,42,71,.94) 4%,rgba(4,42,71,.5) 34%,rgba(4,42,71,0) 62%)}
.issa-card .who{position:relative;z-index:2}
.issa-card .who b{display:block;font-size:var(--h4);letter-spacing:-.01em}
.issa-card .who span{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:var(--eyebrow);letter-spacing:.14em;text-transform:uppercase;color:var(--cyan)}
.issa-bio{color:var(--muted);max-width:60ch;margin-top:18px}
.issa-bio strong{color:var(--ink);font-weight:600}
.tl{list-style:none;margin-top:40px;position:relative;padding-left:34px}
.tl::before{content:"";position:absolute;left:8px;top:8px;bottom:8px;width:1px;background:var(--hairline)}
.tl li{position:relative;padding:0 0 26px}
.tl li::before{
  content:"";position:absolute;left:-30px;top:8px;width:9px;height:9px;border-radius:50%;
  background:var(--canvas);border:2px solid var(--marine);
}
.tl li.gold::before{background:var(--gold);border-color:var(--gold)}
.tl .yr{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:var(--eyebrow);letter-spacing:.16em;color:var(--marine);font-weight:600;text-transform:uppercase;display:block;margin-bottom:4px}
.tl b{font-weight:600}
.tl p{font-size:var(--small);color:var(--muted);margin-top:2px;max-width:52ch}
.edu{font-size:var(--small);color:var(--muted);border-top:1px solid var(--hairline);margin-top:8px;padding-top:18px;max-width:60ch}
@media(max-width:900px){.issa-grid{grid-template-columns:1fr}.issa-card{position:relative;top:auto;aspect-ratio:16/10}}

/* ============ APPROACH ============ */
.tri{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--hairline);border:1px solid var(--hairline);margin-top:52px}
.tri .cell{background:var(--canvas);padding:clamp(24px,2.6vw,40px)}
.tri .cell .idx{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:var(--eyebrow);letter-spacing:.16em;color:var(--gold);font-weight:600}
.tri .cell h3{font-size:var(--h4);margin:14px 0 12px;font-weight:600}
.tri .cell p{font-size:var(--small);color:var(--muted);line-height:1.7}
@media(max-width:900px){.tri{grid-template-columns:1fr}}
.look{margin-top:64px}
.look h3{font-size:var(--h3);max-width:26ch}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px;list-style:none}
.chips li{
  font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:var(--small);
  border:1px solid var(--hairline);padding:.55em 1em .55em .85em;
  display:inline-flex;align-items:center;gap:.6em;color:var(--ink);
  transition:border-color .25s,background .25s;
}
.chips li::before{content:"";width:7px;height:7px;background:var(--gold);flex:none}
.chips li:hover{border-color:var(--marine);background:var(--surface)}

/* ============ SECTORS ============ */
.sectors{background:var(--surface)}
.sector-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--hairline);border:1px solid var(--hairline);margin-top:52px}
.sector{
  background:var(--canvas);padding:clamp(26px,3vw,44px) clamp(22px,2.4vw,36px);
  min-height:170px;display:flex;flex-direction:column;justify-content:space-between;gap:26px;
  transition:background .3s;position:relative;overflow:clip;
}
.sector .idx{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:var(--eyebrow);letter-spacing:.16em;color:var(--muted);font-weight:600;transition:color .3s}
.sector h3{font-size:var(--h4);font-weight:600;letter-spacing:-.01em;transition:color .3s}
.sector::after{
  content:"";position:absolute;left:0;bottom:0;height:3px;width:0;
  background:linear-gradient(90deg,var(--cyan),var(--indigo));transition:width .35s;
}
.sector:hover{background:var(--band)}
.sector:hover h3{color:#fff}
.sector:hover .idx{color:var(--gold)}
.sector:hover::after{width:100%}
@media(max-width:900px){.sector-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.sector-grid{grid-template-columns:1fr}}

/* ============ PORTFOLIO ============ */
.pf-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
.pf-note{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:var(--eyebrow);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.pf-grid{display:grid;grid-template-columns:repeat(4,1fr);background:var(--canvas);border:1px solid var(--hairline);border-right:0;border-bottom:0;margin-top:44px}
.pf{
  position:relative;background:var(--canvas);min-height:134px;
  display:flex;align-items:center;justify-content:center;padding:20px;overflow:clip;
  text-decoration:none;color:var(--ink);cursor:pointer;
  border-right:1px solid var(--hairline);border-bottom:1px solid var(--hairline);
  transition:background .3s;
}
.pf.nolink{cursor:default}
.pf .nm{
  font-weight:600;font-size:var(--h6);letter-spacing:-.01em;text-align:center;position:relative;
  transition:opacity .32s cubic-bezier(.2,.6,.2,1),transform .32s cubic-bezier(.2,.6,.2,1);
}
.pf .lg{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-45%) scale(.9);
  max-width:74%;max-height:54%;width:auto;height:auto;object-fit:contain;
  opacity:0;transition:opacity .32s,transform .32s;pointer-events:none;
}
.pf .tag{
  position:absolute;top:13px;left:16px;z-index:2;
  font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:.6rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--band);background:var(--gold);
  padding:.3em .68em;font-weight:600;
}
.pf .go{
  position:absolute;top:12px;right:14px;font-size:var(--small);color:var(--marine);line-height:1;
  opacity:0;transform:translate(-3px,3px);transition:opacity .3s,transform .3s;pointer-events:none;
}
.pf:hover{background:var(--surface)}
.pf:hover .nm{opacity:0;transform:translateY(-8px)}
.pf:hover .lg{opacity:1;transform:translate(-50%,-50%) scale(1)}
.pf:not(.nolink):hover .go{opacity:1;transform:none}
.pf:focus-visible{outline:2px solid var(--focus);outline-offset:-2px}
.pf:focus-visible .nm{opacity:0}
.pf:focus-visible .lg{opacity:1;transform:translate(-50%,-50%) scale(1)}
.pf.more{grid-column:span 2;align-items:center;justify-content:flex-start}
.pf.more .nm{
  font-family:"IBM Plex Mono",ui-monospace,monospace;font-weight:500;
  font-size:var(--small);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);
  display:inline-flex;align-items:center;gap:.7em;text-align:left;
}
.pf.more .nm::before{content:"";width:7px;height:7px;background:var(--gold)}
.pf.more:hover{background:var(--surface)}
.pf.more:hover .nm,.pf.more:focus-visible .nm{color:var(--marine);opacity:1;transform:none}
@media(max-width:1000px){.pf-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:640px){.pf-grid{grid-template-columns:repeat(2,1fr)}}

/* ============ TESTIMONIALS ============ */
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2vw,28px);margin-top:52px}
.qt{background:var(--surface);padding:clamp(24px,2.6vw,38px);display:flex;flex-direction:column;gap:20px;border-top:3px solid var(--blue)}
.qt:nth-child(2){border-top-color:var(--gold)}
.qt:nth-child(3){border-top-color:var(--indigo)}
.qt .mark{font-size:2.4rem;line-height:.6;color:var(--blue);font-weight:700}
.qt:nth-child(2) .mark{color:var(--gold)}
.qt:nth-child(3) .mark{color:var(--indigo)}
.qt blockquote{font-size:var(--small);line-height:1.75;color:var(--ink)}
.qt figcaption{margin-top:auto}
.qt figcaption b{display:block;font-size:var(--h6);font-weight:600}
.qt figcaption span{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:var(--eyebrow);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
@media(max-width:900px){.quotes{grid-template-columns:1fr}}

/* ============ TEAM ============ */
.team{background:var(--surface)}
.tm-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,1.8vw,24px);margin-top:52px}
.tm{background:var(--canvas);padding:26px 24px 28px;border:1px solid var(--hairline)}
.tm .av{
  width:clamp(80px,7vw,100px);height:clamp(80px,7vw,100px);border-radius:50%;overflow:hidden;
  margin-bottom:22px;background:var(--surface);
  box-shadow:inset 0 0 0 1px var(--hairline),0 8px 20px rgba(6,38,63,.10);
}
.tm .av img{width:100%;height:100%;object-fit:cover;object-position:50% 14%}
.tm b{display:block;font-size:var(--h5);font-weight:600;letter-spacing:-.01em}
.tm span{font-size:var(--small);color:var(--muted);display:block;margin-top:6px;line-height:1.5}
.tm-sub{margin-top:44px}
.tm-sub .eyebrow{margin-bottom:22px}
.tm-row{display:flex;flex-wrap:wrap;gap:14px}
.tm-min{
  display:inline-flex;align-items:center;gap:12px;background:var(--canvas);
  border:1px solid var(--hairline);padding:12px 20px 12px 12px;
}
.tm-min .av{width:46px;height:46px;margin:0;border-radius:50%;overflow:hidden;flex:none;background:var(--surface);box-shadow:inset 0 0 0 1px var(--hairline)}
.tm-min .av img{width:100%;height:100%;object-fit:cover;object-position:50% 14%}
.tm-min b{font-size:var(--h6);font-weight:600}
.tm-min i{font-family:"IBM Plex Mono",ui-monospace,monospace;font-style:normal;font-size:var(--eyebrow);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);display:block}
@media(max-width:1000px){.tm-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.tm-grid{grid-template-columns:1fr}}

/* ============ SUBMIT ============ */
.submit{background:var(--band);color:var(--band-ink);position:relative;overflow:clip}
.submit .eyebrow{color:var(--cyan)}
.submit .eyebrow .n{color:var(--band-muted)}
.submit h2{color:#fff;max-width:20ch}
.submit .lede{color:var(--band-muted);max-width:56ch;margin-top:16px}
.sub-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(40px,6vw,100px);margin-top:20px}
.loc{display:flex;gap:12px;margin-top:36px}
.loc span{
  font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:var(--eyebrow);
  letter-spacing:.16em;text-transform:uppercase;color:var(--band-ink);
  border:1px solid rgba(234,243,250,.25);padding:.6em 1.1em;display:inline-flex;align-items:center;gap:.6em;
}
.loc span::before{content:"";width:6px;height:6px;background:var(--gold)}
form{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.f-full{grid-column:1/-1}
label{display:block}
label .lt{
  font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:var(--eyebrow);
  letter-spacing:.14em;text-transform:uppercase;color:var(--band-muted);display:block;margin-bottom:8px;
}
input,textarea{
  width:100%;background:rgba(234,243,250,.06);border:1px solid rgba(234,243,250,.22);
  color:#fff;font:inherit;font-size:var(--small);padding:.85em 1em;transition:border-color .25s;
}
input:hover,textarea:hover{border-color:rgba(234,243,250,.45)}
input::placeholder,textarea::placeholder{color:rgba(234,243,250,.55)}
input:focus-visible,textarea:focus-visible{outline:2px solid var(--cyan);outline-offset:1px;border-color:transparent}
textarea{min-height:110px;resize:vertical}
.submit .btn{background:var(--gold);color:var(--band);justify-self:start}
.submit .btn:hover{background:#FFC845}
@media(max-width:900px){.sub-grid{grid-template-columns:1fr}form{grid-template-columns:1fr}}

/* ============ FOOTER ============ */
footer{background:var(--canvas)}
.ft{padding:64px var(--gutter) 0;display:flex;justify-content:space-between;gap:40px;flex-wrap:wrap}
.ft .logo img{height:40px;width:auto}
.ft .tag{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:var(--eyebrow);letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-top:16px}
.ft nav ul{list-style:none;display:flex;flex-direction:column;gap:10px}
.ft nav a{font-size:var(--small);text-decoration:none;color:var(--ink)}
.ft nav a:hover{color:var(--marine)}
.ft .col h4{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:var(--eyebrow);letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:16px;font-weight:600}
.facts{
  margin:56px var(--gutter) 0;border:1px solid var(--hairline);padding:26px 30px;
  font-size:var(--small);color:var(--muted);line-height:1.75;
}
.facts b{color:var(--ink)}
.ft-bar{
  margin-top:40px;border-top:1px solid var(--hairline);
  padding:22px var(--gutter);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
  font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:var(--eyebrow);letter-spacing:.1em;color:var(--muted);
}
.ft-bar a{color:var(--marine);text-decoration:none}
.ft-bar a:hover{text-decoration:underline}

/* ============ RIBBON ============ */
.ribbon{
  position:fixed;left:14px;bottom:14px;z-index:120;
  font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:.62rem;letter-spacing:.14em;
  text-transform:uppercase;background:var(--band);color:var(--gold);
  padding:.6em 1em;box-shadow:0 6px 18px rgba(4,42,71,.3);
}


/* ========================================================= */
/* ============ SHARED SUB-PAGE COMPONENTS ================= */
/* ========================================================= */

/* current page marker in nav */
.nav-links a[aria-current="page"]{color:var(--marine)}
.nav-links a[aria-current="page"]::after{content:"";display:block;height:2px;background:var(--gold);margin-top:3px}

/* page header band */
.page-hero{padding:calc(var(--sec-pad) + 46px) var(--gutter) var(--sec-pad);background:var(--surface);border-bottom:1px solid var(--hairline);position:relative;overflow:clip}
.page-hero .crumb{
  font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:var(--eyebrow);
  letter-spacing:.14em;text-transform:uppercase;color:var(--muted);display:flex;gap:.7em;align-items:center;
}
.page-hero .crumb a{color:var(--muted);text-decoration:none}
.page-hero .crumb a:hover{color:var(--marine)}
.page-hero .crumb .sep{color:var(--gold)}
.page-hero h1{font-size:var(--h1);max-width:20ch;margin:20px 0 0;letter-spacing:-.03em;color:var(--ink);font-weight:650}
.page-hero .lede{color:var(--muted);max-width:62ch;margin-top:22px}
.page-hero .lede strong{color:var(--ink);font-weight:600}
.page-hero .ph-stats{display:flex;flex-wrap:wrap;gap:0;margin-top:38px;border-top:1px solid var(--hairline);padding-top:8px}
.page-hero .ph-stats .cell{
  font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:var(--eyebrow);letter-spacing:.14em;
  text-transform:uppercase;color:var(--muted);padding:16px 26px 0 0;margin-right:26px;display:flex;align-items:center;gap:.7em;
}
.page-hero .ph-stats .cell b{color:var(--ink);font-weight:600}
.page-hero .ph-stats .cell::before{content:"";width:6px;height:6px;background:var(--gold);flex:none}

/* ===== PORTFOLIO WALL (logos always visible) ===== */
.wall{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,1.6vw,22px);margin-top:8px}
.pcard{
  position:relative;display:flex;flex-direction:column;background:var(--canvas);
  border:1px solid var(--hairline);padding:28px 28px 24px;min-height:196px;
  text-decoration:none;color:var(--ink);
  transition:border-color .28s,box-shadow .28s,transform .28s;
}
.pcard:hover{border-color:var(--marine);box-shadow:0 16px 34px rgba(6,38,63,.10);transform:translateY(-3px)}
.pcard:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.pcard .logo-wrap{height:62px;display:flex;align-items:center;justify-content:flex-start;margin-bottom:22px}
.pcard .logo-wrap img{max-height:54px;max-width:78%;width:auto;height:auto;object-fit:contain}
.pcard .pname{font-size:var(--h5);font-weight:600;letter-spacing:-.01em}
.pcard .pdesc{font-size:var(--small);color:var(--muted);margin-top:8px;line-height:1.55;flex:1}
.pcard .pgo{
  display:inline-flex;align-items:center;gap:.5em;margin-top:18px;
  font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:var(--eyebrow);letter-spacing:.08em;
  text-transform:lowercase;color:var(--marine);transition:gap .25s;
}
.pcard:hover .pgo{gap:.9em}
.pcard .ptag{
  position:absolute;top:20px;right:20px;
  font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:.6rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--band);background:var(--gold);padding:.3em .68em;font-weight:600;
}
.pcard.nolink{cursor:default}
.pcard.nolink:hover{border-color:var(--hairline);box-shadow:none;transform:none}
.pcard.nolink .pgo{color:var(--muted)}
@media(max-width:900px){.wall{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.wall{grid-template-columns:1fr}}

/* ===== ABOUT page tweaks ===== */
.about-issa .issa-card{position:sticky;top:110px}
.prose p{color:var(--muted);max-width:64ch;margin-top:18px}
.prose p strong{color:var(--ink);font-weight:600}
.prose p:first-child{margin-top:0}
@media(max-width:900px){.about-issa .issa-card{position:relative;top:auto}}

/* back-to-home link */
.backlink{
  display:inline-flex;align-items:center;gap:.55em;margin-top:8px;
  font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:var(--small);letter-spacing:.06em;
  color:var(--marine);text-decoration:none;
}
.backlink:hover{gap:.85em}