/* =========================================================
   GEMACODE RESEARCH — "Signal" design system (v4)
   Modern institutional · warm-neutral paper + indigo accent.
   Bricolage Grotesque (display) · Hanken Grotesk (body) · IBM Plex Mono (proofs)
   One stylesheet, inherited by every page.
   ========================================================= */
@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,400;12..96,500;12..96,600;12..96,700;12..96,800&family=Hanken+Grotesk:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root{
  --bg:#F4F3EE; --bg-2:#EFEDE5; --card:#FFFFFF; --sunk:#ECEAE2;
  --ink:#16181D; --ink-2:#494D56; --ink-3:#8A8F99; --ink-4:#B4B8C0;
  --line:#E4E2D9; --line-2:#EEECE4;
  --acc:#3B43B5; --acc-d:#2E3490; --acc-l:#5B63D6;
  --acc-bg:rgba(59,67,181,.07); --acc-bg2:rgba(59,67,181,.12);
  --pos:#3B43B5; --neg:#B0473C; --warn:#B0723C; --ok:#2E7D5B;
  --dark:#16182B; --dark-2:#1D2038; --dark-ink:#EDEDF5; --dark-ink-2:#A6A9C2; --dark-ink-3:#71748F; --dark-line:rgba(237,237,245,.12);
  --d:"Bricolage Grotesque",sans-serif;
  --s:"Hanken Grotesk",-apple-system,system-ui,sans-serif;
  --m:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  --max:1180px; --pad:40px;
  --sh-sm:0 1px 2px rgba(22,24,29,.05), 0 8px 20px -14px rgba(22,24,29,.20);
  --sh:0 2px 8px rgba(22,24,29,.06), 0 28px 56px -32px rgba(22,24,29,.40);
  --ease:cubic-bezier(.22,.61,.36,1);
}
@media (max-width:900px){ :root{ --pad:24px; } }
@media (max-width:540px){ :root{ --pad:18px; } }

*,*::before,*::after{ box-sizing:border-box; }
html,body{ margin:0; } html{ scroll-behavior:smooth; }
body{ background:var(--bg); color:var(--ink); font-family:var(--s);
  font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility; overflow-x:hidden; }
a{ color:inherit; text-decoration:none; }
svg{ display:block; } img{ max-width:100%; }
::selection{ background:var(--acc); color:#fff; }
.wrap{ max-width:var(--max); margin:0 auto; padding:0 var(--pad); }
.mono{ font-family:var(--m); }

/* ---------- buttons ---------- */
.btn{ display:inline-flex; align-items:center; gap:9px; font-family:var(--s); font-weight:600; font-size:14.5px; padding:11px 20px; border-radius:10px; border:1px solid transparent; cursor:pointer; transition:.2s var(--ease); }
.btn .arr{ transition:transform .2s var(--ease); } .btn:hover .arr{ transform:translateX(3px); }
.btn-acc{ background:var(--acc); color:#fff; box-shadow:var(--sh-sm); }
.btn-acc:hover{ background:var(--acc-d); transform:translateY(-1px); box-shadow:var(--sh); }
.btn-ghost{ background:var(--card); color:var(--ink); border-color:var(--line); }
.btn-ghost:hover{ border-color:var(--acc); color:var(--acc); transform:translateY(-1px); }
.btn-mini{ font-size:13px; padding:9px 15px; }

/* ---------- eyebrow / labels ---------- */
.eye{ display:inline-flex; align-items:center; gap:9px; font-family:var(--m); font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--acc); background:var(--acc-bg); padding:7px 13px; border-radius:100px; }
.eye .d{ width:6px; height:6px; border-radius:50%; background:var(--acc); }

/* ---------- ribbon ---------- */
.ribbon{ background:var(--dark); color:var(--dark-ink-2); }
.ribbon .wrap{ display:flex; align-items:center; gap:12px; height:38px; font-size:12.5px; }
.ribbon .pulse{ width:7px; height:7px; border-radius:50%; background:var(--acc-l); animation:pulse 2.6s infinite; flex:none; }
.ribbon b{ color:var(--dark-ink); font-weight:600; }
.ribbon .right{ margin-left:auto; color:var(--dark-ink); font-weight:600; }
.ribbon .hide{ color:var(--dark-ink-3); }
@keyframes pulse{ 0%{box-shadow:0 0 0 0 rgba(91,99,214,.6)} 70%{box-shadow:0 0 0 7px rgba(91,99,214,0)} 100%{box-shadow:0 0 0 0 rgba(91,99,214,0)} }
@media (max-width:680px){ .ribbon .hide{ display:none; } }

/* ---------- header ---------- */
header.top{ position:sticky; top:0; z-index:50; background:rgba(244,243,238,.82); backdrop-filter:saturate(150%) blur(12px); border-bottom:1px solid var(--line); }
.top .wrap{ display:flex; align-items:center; gap:24px; height:74px; }
.brand{ display:flex; align-items:center; gap:11px; }
.brand .logo{ width:30px; height:30px; border-radius:8px; background:var(--acc); display:grid; place-items:center; flex:none; }
.brand .logo i{ width:11px; height:11px; background:#fff; border-radius:3px; transform:rotate(45deg); display:block; }
.brand .nm{ display:flex; flex-direction:column; line-height:1; }
.brand .nm b{ font-family:var(--d); font-weight:700; font-size:20px; letter-spacing:-.02em; }
.brand .nm span{ font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-3); margin-top:3px; }
nav.main{ display:flex; gap:2px; margin-left:auto; }
nav.main a{ font-size:14.5px; font-weight:500; color:var(--ink-2); padding:9px 13px; border-radius:8px; transition:.18s; }
nav.main a:hover{ background:var(--acc-bg); color:var(--acc); }
nav.main a.active{ color:var(--acc); background:var(--acc-bg); }
.lang{ font-size:12px; color:var(--ink-3); display:flex; gap:6px; padding:0 4px; }
.lang a.on{ color:var(--ink); font-weight:600; }
.nav-toggle{ display:none; width:42px; height:42px; border-radius:10px; border:1px solid var(--line); background:var(--card); margin-left:auto; position:relative; }
.nav-toggle span{ position:absolute; left:11px; right:11px; height:1.8px; background:var(--ink); transition:.2s; }
.nav-toggle span:nth-child(1){ top:15px } .nav-toggle span:nth-child(2){ top:20px } .nav-toggle span:nth-child(3){ top:25px }
@media (max-width:920px){
  nav.main,.lang{ display:none; } .nav-toggle{ display:block; }
  header.top.open nav.main{ display:flex; position:fixed; top:74px; left:0; right:0; bottom:0; flex-direction:column; align-items:stretch; gap:2px; padding:14px; background:var(--bg); border-top:1px solid var(--line); z-index:60; overflow-y:auto; }
  header.top.open nav.main a{ font-size:18px; padding:16px; }
  header.top.open .nav-toggle span:nth-child(1){ top:20px; transform:rotate(45deg) }
  header.top.open .nav-toggle span:nth-child(2){ opacity:0 }
  header.top.open .nav-toggle span:nth-child(3){ top:20px; transform:rotate(-45deg) }
}

/* ---------- reveal ---------- */
[data-reveal]{ opacity:0; transform:translateY(16px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
[data-reveal].in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){ [data-reveal]{ opacity:1; transform:none; transition:none; } }

/* dot-grid background helper */
.dotbg{ position:relative; overflow:hidden; }
.dotbg::before{ content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:radial-gradient(var(--line) 1.1px, transparent 1.1px); background-size:26px 26px;
  -webkit-mask-image:radial-gradient(70% 60% at 80% 14%, #000, transparent 72%);
          mask-image:radial-gradient(70% 60% at 80% 14%, #000, transparent 72%); opacity:.8; }
.dotbg > .wrap{ position:relative; z-index:1; }

/* ---------- hero (home) ---------- */
.hero{ padding:80px 0 76px; }
.hero-grid{ display:grid; grid-template-columns:1.5fr 1fr; gap:54px; align-items:center; }
.hero h1{ font-family:var(--d); font-weight:700; font-size:clamp(42px,6vw,72px); line-height:.99; letter-spacing:-.035em; margin:24px 0 0; }
.hero h1 .u{ color:var(--acc); }
.hero .lead{ font-size:19px; line-height:1.6; color:var(--ink-2); max-width:600px; margin:26px 0 0; }
.hero .lead b{ color:var(--ink); font-weight:600; }
.hero .acts{ display:flex; gap:12px; flex-wrap:wrap; margin-top:34px; }
@media (max-width:920px){ .hero-grid{ grid-template-columns:1fr; gap:40px; } }

/* trust card */
.tcard{ background:var(--card); border:1px solid var(--line); border-radius:18px; padding:26px; box-shadow:var(--sh); }
.tcard .h{ display:flex; align-items:center; gap:12px; padding-bottom:18px; border-bottom:1px solid var(--line-2); }
.tcard .h .logo{ width:34px; height:34px; border-radius:9px; background:var(--acc-bg2); display:grid; place-items:center; color:var(--acc); flex:none; }
.tcard .h .logo svg{ width:18px; height:18px; }
.tcard .h .t{ font-family:var(--d); font-weight:600; font-size:16px; line-height:1.15; }
.tcard .h .t span{ display:block; font-family:var(--s); font-size:11px; letter-spacing:.13em; text-transform:uppercase; color:var(--ink-3); font-weight:500; margin-top:3px; }
.trow{ display:flex; gap:12px; align-items:flex-start; padding:13px 0; border-bottom:1px solid var(--line-2); }
.trow:last-of-type{ border-bottom:0; }
.trow .ic{ width:19px; height:19px; flex:none; color:var(--acc); margin-top:2px; }
.trow .tt{ font-size:14px; font-weight:600; }
.trow .dd{ font-size:12.5px; color:var(--ink-3); margin-top:1px; }
.tcard .foot{ margin-top:14px; font-family:var(--m); font-size:11px; color:var(--ink-3); display:flex; justify-content:space-between; }

/* ---------- interior page header ---------- */
.pagehead{ padding:74px 0 60px; border-bottom:1px solid var(--line); }
.pagehead h1{ font-family:var(--d); font-weight:700; font-size:clamp(40px,6vw,78px); line-height:.96; letter-spacing:-.04em; margin:22px 0 0; }
.pagehead .lead{ font-size:19px; line-height:1.6; color:var(--ink-2); max-width:720px; margin:24px 0 0; }
.pagehead .lead b{ color:var(--ink); font-weight:600; }

/* ---------- section scaffold ---------- */
.section{ padding:94px 0; }
.section.line{ border-top:1px solid var(--line); }
.section.tint{ background:var(--bg-2); border-top:1px solid var(--line); }
.sec-head{ max-width:760px; margin-bottom:46px; }
.sec-head .k{ font-family:var(--m); font-size:12px; letter-spacing:.06em; color:var(--acc); }
.sec-head h2{ font-family:var(--d); font-weight:700; font-size:clamp(30px,4vw,46px); line-height:1.04; letter-spacing:-.03em; margin:12px 0 0; }
.sec-head p{ font-size:18px; color:var(--ink-2); margin:18px 0 0; max-width:640px; }
.sec-head p em{ font-style:normal; color:var(--ink); font-weight:600; }
.lead{ font-size:18px; color:var(--ink-2); line-height:1.6; }
.lead b{ color:var(--ink); font-weight:600; }

/* ---------- method / feature cards ---------- */
.cards4{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.cards2{ display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.mc{ background:var(--card); border:1px solid var(--line); border-radius:16px; padding:26px 24px; transition:.24s var(--ease); }
.mc:hover{ transform:translateY(-4px); box-shadow:var(--sh); border-color:var(--acc); }
.mc .badge{ width:44px; height:44px; border-radius:12px; background:var(--acc-bg); color:var(--acc); display:grid; place-items:center; margin-bottom:18px; }
.mc .badge svg{ width:22px; height:22px; }
.mc h3{ font-family:var(--d); font-weight:600; font-size:20px; letter-spacing:-.02em; margin:0 0 8px; }
.mc p{ margin:0; font-size:14px; line-height:1.6; color:var(--ink-2); }
.mc p em{ font-style:normal; color:var(--ink); font-weight:600; }
@media (max-width:980px){ .cards4{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px){ .cards4,.cards2{ grid-template-columns:1fr; } }

/* ---------- pillars (what it answers / not) ---------- */
.pillar-grid{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.pillar{ background:var(--card); border:1px solid var(--line); border-radius:16px; padding:30px; }
.pillar.sunk{ background:var(--sunk); }
.pillar h3{ font-family:var(--d); font-weight:600; font-size:21px; letter-spacing:-.02em; margin:0 0 12px; }
.pillar p{ margin:0; color:var(--ink-2); font-size:15px; line-height:1.62; }
@media (max-width:720px){ .pillar-grid{ grid-template-columns:1fr; } }

/* ---------- stack layers ---------- */
.stack{ display:flex; flex-direction:column; gap:16px; }
.layer{ display:grid; grid-template-columns:210px 1fr auto; gap:30px; align-items:center; background:var(--card); border:1px solid var(--line); border-radius:18px; padding:30px 32px; transition:.24s var(--ease); }
.layer:hover{ transform:translateY(-3px); box-shadow:var(--sh); border-color:var(--acc); }
.layer .lk{ display:flex; flex-direction:column; gap:8px; }
.layer .lk .tag{ font-family:var(--m); font-size:11px; letter-spacing:.06em; color:var(--acc); }
.layer .lk .nm{ font-family:var(--d); font-weight:700; font-size:30px; letter-spacing:-.03em; line-height:1; }
.layer .lb h3{ font-family:var(--d); font-weight:600; font-size:21px; letter-spacing:-.02em; margin:0 0 7px; }
.layer .lb p{ margin:0; color:var(--ink-2); font-size:15px; max-width:560px; }
.layer .lb .q{ margin-top:11px; font-family:var(--m); font-size:12px; color:var(--ink-3); }
.layer .go{ font-weight:600; font-size:14px; color:var(--acc); display:inline-flex; align-items:center; gap:8px; white-space:nowrap; transition:.2s; }
.layer:hover .go{ gap:12px; }
@media (max-width:860px){ .layer{ grid-template-columns:1fr; gap:18px; } .layer .go{ justify-self:start; } }

/* ---------- principle band (deep indigo) ---------- */
.band{ background:var(--dark); color:var(--dark-ink); position:relative; overflow:hidden; }
.band::before{ content:""; position:absolute; inset:0; pointer-events:none; opacity:.6;
  background:radial-gradient(70% 120% at 100% 0%, rgba(91,99,214,.22), transparent 60%); }
.band::after{ content:""; position:absolute; inset:0; pointer-events:none;
  background-image:radial-gradient(rgba(237,237,245,.06) 1px, transparent 1px); background-size:24px 24px;
  -webkit-mask-image:radial-gradient(60% 80% at 12% 100%, #000, transparent 70%); mask-image:radial-gradient(60% 80% at 12% 100%, #000, transparent 70%); }
.band .wrap{ position:relative; z-index:1; padding:96px var(--pad); }
.band .mk{ display:inline-flex; align-items:center; gap:10px; margin-bottom:24px; font-family:var(--m); font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--dark-ink-3); }
.band .mk .ln{ width:32px; height:1px; background:var(--dark-line); }
.band .q{ font-family:var(--d); font-weight:600; font-size:clamp(28px,4.4vw,52px); line-height:1.08; letter-spacing:-.03em; max-width:980px; }
.band .q em{ font-style:normal; color:var(--acc-l); }
.band .sub{ margin-top:24px; max-width:660px; font-size:17px; color:var(--dark-ink-2); }

/* ---------- routes ---------- */
.routes{ display:flex; flex-direction:column; }
.route{ display:grid; grid-template-columns:170px 1fr auto; gap:26px; align-items:center; padding:24px 8px; border-bottom:1px solid var(--line); transition:.18s; }
.route:first-child{ border-top:1px solid var(--line); }
.route:hover{ background:var(--card); border-radius:12px; padding-left:18px; padding-right:18px; box-shadow:var(--sh-sm); }
.route .rk{ font-family:var(--m); font-size:11px; letter-spacing:.06em; color:var(--acc); }
.route .rt{ display:block; font-family:var(--d); font-weight:600; font-size:21px; letter-spacing:-.02em; }
.route .rd{ display:block; color:var(--ink-2); font-size:14.5px; margin-top:2px; }
.route .rl{ font-weight:600; color:var(--acc); display:inline-flex; gap:8px; white-space:nowrap; transition:.2s; }
.route:hover .rl{ gap:12px; }
@media (max-width:760px){ .route{ grid-template-columns:1fr; gap:6px; } .route .rl{ justify-self:start; } }
.note{ margin-top:30px; border-left:3px solid var(--acc); background:var(--card); border-radius:0 12px 12px 0; padding:18px 22px; color:var(--ink-2); font-size:14.5px; }
.cta-row{ display:flex; gap:12px; flex-wrap:wrap; margin-top:30px; }

/* ---------- KPIs (Atlas) ---------- */
.kpis{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.kpi{ background:var(--card); border:1px solid var(--line); border-radius:14px; padding:24px; }
.kpi .n{ font-family:var(--d); font-weight:700; font-size:38px; letter-spacing:-.04em; line-height:1; }
.kpi .l{ font-size:13px; color:var(--ink-3); margin-top:10px; line-height:1.45; }
@media (max-width:900px){ .kpis{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:460px){ .kpis{ grid-template-columns:1fr; } }

/* ---------- chain flow ---------- */
.chain{ display:flex; flex-wrap:wrap; gap:14px; }
.chain-step{ flex:1 1 0; min-width:160px; background:var(--card); border:1px solid var(--line); border-radius:14px; padding:20px; position:relative; }
.chain-step .cs-k{ font-family:var(--m); font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:var(--acc); }
.chain-step .cs-t{ font-family:var(--d); font-weight:600; font-size:19px; letter-spacing:-.02em; margin:9px 0 8px; }
.chain-step p{ margin:0; font-size:12.5px; line-height:1.55; color:var(--ink-2); }
.chain-step::after{ content:"→"; position:absolute; right:-12px; top:50%; transform:translateY(-50%); color:var(--ink-4); font-family:var(--m); z-index:2; }
.chain-step:last-child::after{ display:none; }
@media (max-width:860px){ .chain-step{ flex:1 1 100%; } .chain-step::after{ content:"↓"; right:50%; top:auto; bottom:-13px; transform:translateX(50%); } }

/* ---------- source list (Atlas provenance) ---------- */
.src-list{ border-top:1px solid var(--line); }
.src-row{ display:grid; grid-template-columns:160px 1fr; gap:24px; padding:22px 0; border-bottom:1px solid var(--line); }
.src-row .sl-k{ font-family:var(--m); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--acc); }
.src-row .sl-b b{ font-family:var(--d); font-weight:600; font-size:18px; letter-spacing:-.01em; }
.src-row .sl-b p{ margin:6px 0 0; font-size:14px; color:var(--ink-2); max-width:640px; }
@media (max-width:640px){ .src-row{ grid-template-columns:1fr; gap:8px; } }

/* ---------- split (certifies / not) ---------- */
.split2{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.split2 .col{ background:var(--card); border:1px solid var(--line); border-radius:16px; padding:28px; }
.split2 .col.neg{ background:var(--sunk); }
.split2 .col h3{ font-family:var(--d); font-weight:600; font-size:20px; margin:0 0 16px; }
.split2 .col ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:11px; }
.split2 .col li{ font-size:14.5px; color:var(--ink-2); padding-left:24px; position:relative; }
.split2 .col li::before{ position:absolute; left:0; font-weight:700; font-family:var(--m); }
.split2 .col.pos li::before{ content:"+"; color:var(--pos); }
.split2 .col.neg li::before{ content:"–"; color:var(--neg); }
@media (max-width:720px){ .split2{ grid-template-columns:1fr; } }

/* ---------- evidence scale ---------- */
.evidence{ border:1px solid var(--line); border-radius:16px; overflow:hidden; background:var(--card); }
.ev-row{ display:grid; grid-template-columns:70px 1fr; border-bottom:1px solid var(--line); }
.ev-row:last-child{ border-bottom:0; }
.ev-row .ev-code{ font-family:var(--m); font-weight:600; font-size:15px; display:flex; align-items:center; justify-content:center; background:var(--bg-2); color:var(--acc); border-right:1px solid var(--line); }
.ev-row .ev-b{ padding:16px 20px; }
.ev-row .ev-b b{ font-family:var(--d); font-weight:600; font-size:16px; }
.ev-row .ev-b p{ margin:4px 0 0; font-size:13.5px; color:var(--ink-2); }
.ev-row[data-g="0"] .ev-code{ color:var(--ink-3); }

/* ---------- warning block ---------- */
.warning{ border:1px solid var(--line); border-left:3px solid var(--warn); background:var(--card); border-radius:0 16px 16px 0; padding:28px 30px; }
.warning h3{ font-family:var(--d); font-weight:600; font-size:22px; letter-spacing:-.02em; margin:0 0 10px; }
.warning p{ margin:0; color:var(--ink-2); font-size:15px; line-height:1.62; }
.warning code{ font-family:var(--m); font-size:13px; background:var(--bg-2); padding:1px 6px; border-radius:4px; }

/* ---------- GOVP record (dark mono card) ---------- */
.record{ border-radius:16px; overflow:hidden; background:var(--dark); color:var(--dark-ink); border:1px solid var(--dark); font-family:var(--m); font-size:13px; line-height:1.85; }
.record .h{ display:flex; justify-content:space-between; padding:14px 20px; border-bottom:1px solid var(--dark-line); color:var(--dark-ink-3); font-size:11px; letter-spacing:.08em; text-transform:uppercase; }
.record .b{ padding:18px 20px; white-space:pre; overflow-x:auto; }
.record .gk{ color:#9DA6F2; } .record .gs{ color:#7FD3AE; } .record .gc{ color:var(--dark-ink-3); }
.record .f{ display:flex; gap:10px; align-items:center; padding:14px 20px; border-top:1px solid var(--dark-line); }
.record .f .ok{ color:#7FD3AE; font-weight:600; }
.record .f span:last-child{ color:var(--dark-ink-2); }
.note-line{ font-family:var(--m); font-size:12px; color:var(--ink-3); line-height:1.7; margin-top:18px; }
.note-line code{ background:var(--bg-2); padding:1px 6px; border-radius:4px; }

/* ---------- cert card (BiologicalSecure) ---------- */
.cert{ background:var(--dark); color:var(--dark-ink); border-radius:18px; padding:48px; text-align:center; position:relative; overflow:hidden; }
.cert::before{ content:""; position:absolute; inset:0; opacity:.6; background:radial-gradient(60% 120% at 100% 0%, rgba(91,99,214,.22), transparent 60%); }
.cert > *{ position:relative; }
.cert .mk{ font-family:var(--m); font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--dark-ink-3); }
.cert .nm{ font-family:var(--d); font-weight:700; font-size:clamp(34px,5vw,56px); letter-spacing:-.04em; margin:16px 0 4px; }
.cert .st{ display:inline-flex; align-items:center; gap:9px; font-family:var(--m); font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:#9DA6F2; border:1px solid currentColor; padding:8px 16px; border-radius:100px; margin-top:8px; }
.cert .st .d{ width:7px; height:7px; border-radius:50%; background:currentColor; }
.cert .dsc{ margin:20px auto 0; max-width:560px; font-size:14px; color:var(--dark-ink-2); line-height:1.6; }

/* ---------- footer ---------- */
footer.ft{ background:var(--dark); color:var(--dark-ink-2); }
footer.ft .wrap{ padding:72px var(--pad) 40px; }
.ftg{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:40px; }
.ftb .nm{ display:flex; align-items:center; gap:11px; font-family:var(--d); font-weight:700; font-size:20px; color:var(--dark-ink); }
.ftb .nm .logo{ width:30px; height:30px; border-radius:8px; background:var(--acc); display:grid; place-items:center; flex:none; }
.ftb .nm .logo i{ width:11px; height:11px; background:#fff; border-radius:3px; transform:rotate(45deg); display:block; }
.ftb p{ margin:18px 0 0; max-width:330px; font-size:14px; line-height:1.7; }
.ftc h6{ font-family:var(--m); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--dark-ink-3); margin:0 0 16px; }
.ftc a,.ftc span{ display:block; font-size:14px; color:var(--dark-ink-2); padding:5px 0; }
.ftc a:hover{ color:var(--acc-l); }
.ft-bot{ margin-top:48px; padding-top:24px; border-top:1px solid var(--dark-line); display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; font-size:12.5px; color:var(--dark-ink-3); }
@media (max-width:860px){ .ftg{ grid-template-columns:1fr 1fr; gap:32px; } }
@media (max-width:520px){ .ftg{ grid-template-columns:1fr; } }

/* ---------- additions: 3-card portfolio grid + arch flow ---------- */
.cards3{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
@media (max-width:880px){ .cards3{ grid-template-columns:1fr; } }
.pcard{ background:var(--card); border:1px solid var(--line); border-radius:16px; padding:28px; display:flex; flex-direction:column; transition:.24s var(--ease); }
.pcard:hover{ transform:translateY(-4px); box-shadow:var(--sh); border-color:var(--acc); }
.pcard .tag{ font-family:var(--m); font-size:11px; letter-spacing:.06em; color:var(--acc); }
.pcard h3{ font-family:var(--d); font-weight:700; font-size:26px; letter-spacing:-.03em; margin:12px 0 10px; }
.pcard p{ margin:0 0 16px; font-size:14.5px; line-height:1.6; color:var(--ink-2); }
.pcard ul{ list-style:none; margin:0; padding:0; font-family:var(--m); font-size:11.5px; color:var(--ink-3); line-height:1.95; }
.pcard ul li::before{ content:"/ "; color:var(--acc); }
.pcard .go{ margin-top:auto; padding-top:18px; font-weight:600; font-size:14px; color:var(--acc); display:inline-flex; gap:8px; align-items:center; }
.pcard:hover .go{ gap:12px; }
.arch{ font-family:var(--m); font-size:13px; line-height:2.0; color:var(--ink-2); }
.arch b{ color:var(--ink); }