/* Kernelv5 — site styles. Plain CSS, no build step, no framework.
   Imported from the "Kernelv5 website design" Claude Design project. */

/* ---------- tokens ---------- */
:root{
  --bg:#0f1012;
  --surface:#17181b;
  --ink:#f3f2ec;
  --muted:#a7a9ad;
  --line:#2a2c30;
  --lime:#c6ff3d;
  --cyan:#5ee7ff;
  --pink:#ff5ca8;
  --amber:#ffb13d;
  --hov-bg:#c6ff3d;
  --hov-fg:#0f1012;
  --shell-pb:clamp(28px,1.8229vw,46.7px);
}
html.theme-pink{
  --bg:#ff5ca8;
  --ink:#0f1012;
  --line:#0f1012;
  --muted:#3a1226;
  --hov-bg:#0f1012;
  --hov-fg:#ff5ca8;
}

/* ---------- base ---------- */
*{box-sizing:border-box}
html{background:var(--bg);scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;padding:0;background:var(--bg);color:var(--ink);
  font-family:"Albert Sans",Helvetica,sans-serif;
  font-size:clamp(16px,1.0417vw,26.7px);
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
a{color:var(--ink);text-decoration:none}
a:hover{color:var(--lime)}
html.theme-pink a:hover{color:#0f1012;opacity:.7}
img{display:block;max-width:100%}
:focus-visible{outline:2px solid var(--lime);outline-offset:3px;border-radius:clamp(4px,0.2604vw,6.7px)}
html.theme-pink :focus-visible{outline-color:#0f1012}

.vh{position:absolute;width:clamp(1px,0.0651vw,1.7px);height:clamp(1px,0.0651vw,1.7px);padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0}

.skip{position:absolute;left:-9999px;top:0;z-index:100}
.skip:focus{left:clamp(8px,0.5208vw,13.3px);top:clamp(8px,0.5208vw,13.3px);padding:clamp(10px,0.6510vw,16.7px) clamp(14px,0.9115vw,23.3px);background:var(--lime);color:#0f1012;border-radius:999px;font-weight:700}

/* ---------- motion ---------- */
@keyframes flagwave{0%,100%{transform:rotate(-1.5deg)}50%{transform:rotate(1.5deg)}}
@keyframes flagwave-wide{0%,100%{transform:rotate(-2deg)}50%{transform:rotate(2deg)}}
@keyframes wiggle{0%,100%{transform:rotate(-10deg) scale(1)}50%{transform:rotate(8deg) scale(1.08)}}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(7px)}}

/* ---------- layout ---------- */
.shell{min-height:100vh;display:flex;flex-direction:column;align-items:center;gap:0;
  padding:clamp(clamp(20px,1.3021vw,33.3px),4vw,clamp(48px,3.1250vw,80px)) clamp(clamp(16px,1.0417vw,26.7px),5vw,clamp(64px,4.1667vw,106.7px)) var(--shell-pb)}
.wrap{width:100%;max-width:clamp(1100px,71.6146vw,1833.3px)}

h1{margin:0;font-weight:800;font-size:clamp(42px,9vw,clamp(128px,8.3333vw,213.3px));line-height:.95;letter-spacing:-.035em;text-wrap:balance}
.hero{text-align:center;margin-top:clamp(clamp(28px,1.8229vw,46.7px),5vh,clamp(56px,3.6458vw,93.3px));max-width:clamp(1100px,71.6146vw,1833.3px)}
.hero-title{font-size:clamp(44px,8.5vw,clamp(120px,7.8125vw,200px))}

.eyebrow{margin:0;font-size:clamp(12px,0.7812vw,20px);font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.eyebrow-strong{margin:0;font-size:clamp(12px,0.7812vw,20px);font-weight:700;letter-spacing:.14em;text-transform:uppercase}

/* ---------- sub-page top bar ---------- */
.topbar{width:100%;max-width:clamp(1100px,71.6146vw,1833.3px);display:flex;justify-content:space-between;align-items:center;gap:clamp(12px,0.7812vw,20px)}
.btn-ghost{display:inline-flex;align-items:center;height:clamp(44px,2.8646vw,73.3px);padding:0 clamp(18px,1.1719vw,30px);border:clamp(1px,0.0651vw,1.7px) solid var(--line);
  border-radius:999px;font-size:clamp(14px,0.9115vw,23.3px);font-weight:500;white-space:nowrap}
.btn-ghost:hover{border-color:var(--lime);color:var(--lime)}
html.theme-pink .btn-ghost:hover{border-color:#0f1012;color:#0f1012}
.btn-solid{display:inline-flex;align-items:center;height:clamp(44px,2.8646vw,73.3px);padding:0 clamp(18px,1.1719vw,30px);border-radius:999px;
  background:var(--c);color:#0f1012;font-size:clamp(14px,0.9115vw,23.3px);font-weight:700;white-space:nowrap}
.btn-solid:hover{background:var(--lime);color:#0f1012}

.page-head{text-align:center;margin-top:clamp(clamp(48px,3.1250vw,80px),10vh,clamp(110px,7.1615vw,183.3px));max-width:clamp(1000px,65.1042vw,1666.7px)}
.page-head h1{margin:clamp(18px,1.1719vw,30px) 0 0}
.lede{margin:clamp(clamp(20px,1.3021vw,33.3px),3vh,clamp(32px,2.0833vw,53.3px)) auto 0;max-width:var(--lede-w,540px);
  font-size:clamp(16px,1.5vw,clamp(20px,1.3021vw,33.3px));font-weight:300;line-height:1.5;color:var(--muted);text-wrap:pretty}

/* ---------- home nav ---------- */
.nav{z-index:50;border:clamp(1px,0.0651vw,1.7px) solid var(--line);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}
.nav-desktop{position:sticky;top:clamp(16px,1.0417vw,26.7px);display:flex;gap:clamp(4px,0.2604vw,6.7px);padding:clamp(6px,0.3906vw,10px);border-radius:999px;
  background:rgba(23,24,27,.78);box-shadow:0 14px 40px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.06)}
.nav-mobile{display:none;position:fixed;left:clamp(12px,0.7812vw,20px);right:clamp(12px,0.7812vw,20px);bottom:clamp(12px,0.7812vw,20px);grid-template-columns:repeat(5,1fr);
  gap:clamp(4px,0.2604vw,6.7px);padding:clamp(6px,0.3906vw,10px);border-radius:clamp(22px,1.4323vw,36.7px);background:rgba(23,24,27,.86);box-shadow:0 16px 40px rgba(0,0,0,.45)}
.nav a{font-weight:600;letter-spacing:.01em;color:var(--ink)}
.nav .dot{display:block;width:clamp(8px,0.5208vw,13.3px);height:clamp(8px,0.5208vw,13.3px);border-radius:50%;background:var(--c)}
.nav-desktop a{display:flex;align-items:center;gap:clamp(9px,0.5859vw,15px);padding:0 clamp(18px,1.1719vw,30px) 0 clamp(14px,0.9115vw,23.3px);height:clamp(42px,2.7344vw,70px);border-radius:999px;
  font-size:clamp(14px,0.9115vw,23.3px);transition:background .2s,color .2s,transform .2s}
.nav-desktop .dot{box-shadow:0 0 0 3px var(--r)}
.nav-desktop a:hover{background:#25272c;color:var(--ink);transform:translateY(-1px)}
.nav-mobile a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(5px,0.3255vw,8.3px);
  min-height:clamp(52px,3.3854vw,86.7px);border-radius:clamp(16px,1.0417vw,26.7px);font-size:clamp(11px,0.7161vw,18.3px)}
.nav-mobile a:hover{color:var(--lime)}
.nav a[aria-current]{background:var(--c);color:#0f1012}
.nav a[aria-current] .dot{background:#0f1012}
.nav-desktop a[aria-current] .dot{box-shadow:0 0 0 3px rgba(15,16,18,.15)}
.nav-desktop a[aria-current]:hover{background:var(--c);color:#0f1012}

/* ---------- home hero ---------- */
.flag{margin-top:clamp(clamp(20px,1.3021vw,33.3px),4vh,clamp(40px,2.6042vw,66.7px));display:inline-flex;align-items:center;gap:clamp(12px,0.7812vw,20px);
  padding:clamp(10px,0.6510vw,16.7px) clamp(18px,1.1719vw,30px) clamp(10px,0.6510vw,16.7px) clamp(12px,0.7812vw,20px);background:var(--pink);color:#0f1012;border-radius:clamp(4px,0.2604vw,6.7px) 999px 999px clamp(4px,0.2604vw,6.7px);
  font-size:clamp(14px,0.9115vw,23.3px);font-weight:700;letter-spacing:.02em;transform-origin:left center;
  animation:flagwave 3s ease-in-out infinite}
.flag:hover{background:var(--lime);color:#0f1012}
.flag .dot{display:block;width:clamp(10px,0.6510vw,16.7px);height:clamp(10px,0.6510vw,16.7px);border-radius:50%;background:#0f1012}

.cue{margin-top:clamp(clamp(28px,1.8229vw,46.7px),5vh,clamp(56px,3.6458vw,93.3px));display:flex;flex-direction:column;align-items:center;gap:clamp(14px,0.9115vw,23.3px);color:var(--muted)}
.cue:hover{color:var(--lime)}
.cue .pills{display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(8px,0.5208vw,13.3px)}
.pill{font-size:clamp(12px,0.7812vw,20px);font-weight:600;letter-spacing:.06em;padding:clamp(6px,0.3906vw,10px) clamp(12px,0.7812vw,20px);border-radius:999px;border:clamp(1px,0.0651vw,1.7px) solid var(--line)}
.cue .label{display:flex;align-items:center;gap:clamp(8px,0.5208vw,13.3px);font-size:clamp(12px,0.7812vw,20px);font-weight:500;letter-spacing:.14em;text-transform:uppercase}
.cue .arrow{display:inline-block;animation:bob 1.6s ease-in-out infinite}

/* ---------- sections ---------- */
.section{width:100%;max-width:clamp(1100px,71.6146vw,1833.3px);margin-top:clamp(clamp(72px,4.6875vw,120px),14vh,clamp(160px,10.4167vw,266.7px))}
.section-head{display:flex;align-items:baseline;justify-content:space-between;gap:clamp(16px,1.0417vw,26.7px);
  padding-bottom:clamp(14px,0.9115vw,23.3px);border-bottom:clamp(1px,0.0651vw,1.7px) solid var(--line)}
.section-head .count{font-size:clamp(12px,0.7812vw,20px);color:var(--muted)}

/* project cards */
.cards{display:grid;grid-template-columns:1fr;gap:clamp(14px,0.9115vw,23.3px);margin-top:clamp(18px,1.1719vw,30px)}
@media (min-width:640px){.cards{grid-template-columns:1fr 1fr}}
@media (min-width:1024px){.cards{grid-template-columns:repeat(3,minmax(0,1fr))}}
.card{display:flex;flex-direction:column;justify-content:space-between;min-height:clamp(220px,14.3229vw,366.7px);padding:clamp(22px,1.4323vw,36.7px);
  border-radius:clamp(20px,1.3021vw,33.3px);background:var(--c);color:#0f1012;transition:transform .2s}
.card:hover{transform:translateY(-4px);color:#0f1012}
.card .row{display:flex;justify-content:space-between;align-items:flex-start;gap:clamp(8px,0.5208vw,13.3px)}
.card .kind{font-size:clamp(12px,0.7812vw,20px);font-weight:500;letter-spacing:.1em;text-transform:uppercase;opacity:.7}
.card .soon{font-size:clamp(11px,0.7161vw,18.3px);font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  padding:clamp(5px,0.3255vw,8.3px) clamp(10px,0.6510vw,16.7px);border-radius:999px;background:#0f1012;color:#f3f2ec}
.card .name{margin:0;font-size:clamp(30px,3.4vw,clamp(44px,2.8646vw,73.3px));font-weight:800;letter-spacing:-.03em;line-height:1}
.card .host{margin-top:clamp(8px,0.5208vw,13.3px);font-size:clamp(14px,0.9115vw,23.3px);opacity:.75}

/* quote */
.quote{width:100%;max-width:clamp(1100px,71.6146vw,1833.3px);margin-top:clamp(clamp(72px,4.6875vw,120px),14vh,clamp(160px,10.4167vw,266.7px));display:flex;flex-direction:column;
  align-items:center;text-align:center;gap:clamp(clamp(18px,1.1719vw,30px),3vh,clamp(28px,1.8229vw,46.7px))}
.quote .rule{width:clamp(56px,3.6458vw,93.3px);height:clamp(4px,0.2604vw,6.7px);border-radius:clamp(2px,0.1302vw,3.3px);background:var(--pink)}
.quote p{margin:0;max-width:clamp(900px,58.5938vw,1500px);font-size:clamp(30px,5.2vw,clamp(76px,4.9479vw,126.7px));font-weight:300;font-style:italic;
  line-height:1.08;letter-spacing:-.03em;text-wrap:balance}
.mark{font-style:normal;font-weight:800;color:#0f1012;background:var(--lime);padding:0 .18em;
  border-radius:.12em;-webkit-box-decoration-break:clone;box-decoration-break:clone}

/* teams panel */
.panel{width:100%;max-width:clamp(1100px,71.6146vw,1833.3px);margin-top:clamp(clamp(72px,4.6875vw,120px),14vh,clamp(160px,10.4167vw,266.7px));border-radius:clamp(28px,1.8229vw,46.7px);
  padding:clamp(clamp(28px,1.8229vw,46.7px),5vw,clamp(64px,4.1667vw,106.7px));background:var(--cyan);color:#0f1012;
  display:grid;grid-template-columns:1fr;gap:clamp(clamp(24px,1.5625vw,40px),4vw,clamp(48px,3.1250vw,80px))}
@media (min-width:640px){.panel{grid-template-columns:clamp(160px,10.4167vw,266.7px) minmax(0,1fr)}}
.panel .side{display:flex;flex-direction:column;justify-content:space-between;gap:clamp(24px,1.5625vw,40px)}
.stack{display:flex}
.stack span{width:clamp(44px,2.8646vw,73.3px);height:clamp(44px,2.8646vw,73.3px);border-radius:50%;border:clamp(3px,0.1953vw,5px) solid var(--cyan)}
.stack span+span{margin-left:-12px}
.panel .body{display:flex;flex-direction:column;gap:clamp(clamp(24px,1.5625vw,40px),4vh,clamp(40px,2.6042vw,66.7px))}
.panel h2{margin:0;font-size:clamp(30px,4.4vw,clamp(60px,3.9062vw,100px));font-weight:800;line-height:1;letter-spacing:-.035em;text-wrap:balance}
.panel .copy{margin:0;max-width:clamp(560px,36.4583vw,933.3px);font-size:clamp(16px,1.5vw,clamp(20px,1.3021vw,33.3px));font-weight:400;line-height:1.5;
  text-wrap:pretty;opacity:.8}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(clamp(150px,9.7656vw,250px),1fr));gap:clamp(12px,0.7812vw,20px);
  padding-top:clamp(8px,0.5208vw,13.3px);border-top:clamp(1px,0.0651vw,1.7px) solid rgba(15,16,18,.2);margin:0}
.facts>div{padding-top:clamp(12px,0.7812vw,20px)}
.facts .k{font-size:clamp(12px,0.7812vw,20px);font-weight:700;letter-spacing:.1em;text-transform:uppercase;opacity:.6}
.facts .v{margin:clamp(4px,0.2604vw,6.7px) 0 0;font-size:clamp(15px,0.9766vw,25px);font-weight:500}
.actions{display:flex;flex-wrap:wrap;gap:clamp(10px,0.6510vw,16.7px)}
.btn-dark{display:inline-flex;align-items:center;gap:clamp(8px,0.5208vw,13.3px);height:clamp(50px,3.2552vw,83.3px);padding:0 clamp(24px,1.5625vw,40px);border-radius:999px;
  background:#0f1012;color:#f3f2ec;font-size:clamp(15px,0.9766vw,25px);font-weight:700;white-space:nowrap}
.btn-dark:hover{background:var(--lime);color:#0f1012}
.btn-outline{display:inline-flex;align-items:center;gap:clamp(8px,0.5208vw,13.3px);height:clamp(50px,3.2552vw,83.3px);padding:0 clamp(24px,1.5625vw,40px);border-radius:999px;
  border:clamp(1.5px,0.0977vw,2.5px) solid #0f1012;color:#0f1012;font-size:clamp(15px,0.9766vw,25px);font-weight:700;white-space:nowrap}
.btn-outline:hover{background:#0f1012;color:#f3f2ec}

/* contact panel */
.contact{width:100%;max-width:clamp(1100px,71.6146vw,1833.3px);margin-top:clamp(clamp(72px,4.6875vw,120px),14vh,clamp(160px,10.4167vw,266.7px));position:relative;overflow:hidden;
  border-radius:clamp(28px,1.8229vw,46.7px);background:var(--pink);color:#0f1012;padding:clamp(clamp(28px,1.8229vw,46.7px),5vw,clamp(64px,4.1667vw,106.7px));
  display:flex;flex-direction:column;gap:clamp(clamp(24px,1.5625vw,40px),4vh,clamp(40px,2.6042vw,66.7px))}
.contact .row{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:clamp(16px,1.0417vw,26.7px)}
.status{display:inline-flex;align-items:center;gap:clamp(8px,0.5208vw,13.3px);font-size:clamp(12px,0.7812vw,20px);font-weight:700;padding:clamp(6px,0.3906vw,10px) clamp(12px,0.7812vw,20px);
  border-radius:999px;background:#0f1012;color:#f3f2ec}
.status .dot{width:clamp(8px,0.5208vw,13.3px);height:clamp(8px,0.5208vw,13.3px);border-radius:50%;background:var(--lime)}
.contact h2{margin:0;font-size:clamp(36px,7vw,clamp(104px,6.7708vw,173.3px));font-weight:800;line-height:.95;letter-spacing:-.04em;text-wrap:balance}
.contact h2 em{font-style:italic;font-weight:300}
.contact .foot{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:clamp(16px,1.0417vw,26.7px);
  padding-top:clamp(18px,1.1719vw,30px);border-top:clamp(1px,0.0651vw,1.7px) solid rgba(15,16,18,.25)}
.contact address{font-style:normal;font-size:clamp(14px,0.9115vw,23.3px);line-height:1.6;font-weight:500}
.contact .note{font-size:clamp(13px,0.8464vw,21.7px);font-weight:600;opacity:.75}
.glyph{position:absolute;right:-.15em;bottom:-.35em;font-size:clamp(160px,30vw,clamp(420px,27.3438vw,700px));font-weight:800;
  line-height:1;color:rgba(15,16,18,.08);pointer-events:none;-webkit-user-select:none;user-select:none}

/* ---------- mail links (the address is never written in the markup) ---------- */
.sep{display:inline-block;width:.18em;height:.18em;border-radius:50%;background:currentColor;
  margin:0 .18em;vertical-align:.08em}
.mail-xl{align-self:flex-start;display:inline-flex;flex-wrap:wrap;align-items:center;
  gap:clamp(clamp(8px,0.5208vw,13.3px),1.2vw,clamp(16px,1.0417vw,26.7px));padding:clamp(clamp(10px,0.6510vw,16.7px),1.4vw,clamp(18px,1.1719vw,30px)) clamp(clamp(18px,1.1719vw,30px),2.4vw,clamp(32px,2.0833vw,53.3px));border-radius:999px;
  background:#0f1012;color:#f3f2ec;font-size:clamp(22px,3.6vw,clamp(52px,3.3854vw,86.7px));font-weight:800;letter-spacing:-.03em;line-height:1}
.mail-xl:hover{background:var(--lime);color:#0f1012}
.mail-xl .at{display:inline-flex;align-items:center;justify-content:center;width:1.15em;height:1.15em;
  border-radius:50%;background:var(--pink);color:#0f1012;font-size:.75em;font-weight:800;letter-spacing:0;
  animation:wiggle 2.2s ease-in-out infinite}
.mail-xl .sep{background:var(--pink)}
.mail-lg{display:inline-flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:clamp(clamp(8px,0.5208vw,13.3px),1.2vw,clamp(16px,1.0417vw,26.7px));
  font-size:clamp(28px,5vw,clamp(72px,4.6875vw,120px));font-weight:800;letter-spacing:-.035em;line-height:1;color:var(--ink)}
.mail-lg:hover{color:var(--pink)}
.mail-lg .at{display:inline-flex;align-items:center;justify-content:center;width:1.05em;height:1.05em;
  border-radius:50%;background:var(--lime);color:#0f1012;font-size:.7em;font-weight:700;letter-spacing:0;
  transform:rotate(-8deg)}
.mail-lg .sep{background:var(--lime)}
.mail-hero{display:inline-flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:clamp(clamp(8px,0.5208vw,13.3px),1.2vw,clamp(16px,1.0417vw,26.7px));
  font-size:clamp(30px,6vw,clamp(88px,5.7292vw,146.7px));font-weight:800;letter-spacing:-.035em;line-height:1;color:#0f1012}
.mail-hero:hover{color:#0f1012;opacity:.7}
.mail-hero .at{display:inline-flex;align-items:center;justify-content:center;width:1.05em;height:1.05em;
  border-radius:50%;background:#0f1012;color:var(--pink);font-size:.7em;font-weight:800;letter-spacing:0;
  transform:rotate(-8deg)}
.mail-hero .sep{background:#0f1012}
.mail-sm{display:inline-flex;align-items:center;gap:clamp(6px,0.3906vw,10px);font-size:clamp(14px,0.9115vw,23.3px);font-weight:600}
.mail-sm .at{display:inline-flex;align-items:center;justify-content:center;width:clamp(20px,1.3021vw,33.3px);height:clamp(20px,1.3021vw,33.3px);
  border-radius:50%;background:#0f1012;color:var(--pink);font-size:clamp(12px,0.7812vw,20px);font-weight:700}
.mail-inline{display:inline-flex;align-items:center;gap:clamp(5px,0.3255vw,8.3px)}
.mail-inline .at{display:inline-flex;align-items:center;justify-content:center;width:clamp(16px,1.0417vw,26.7px);height:clamp(16px,1.0417vw,26.7px);
  border-radius:50%;background:var(--lime);color:#0f1012;font-size:clamp(10px,0.6510vw,16.7px);font-weight:700}
html.theme-pink .mail-inline .at{background:#0f1012;color:var(--pink)}

/* ---------- download ---------- */
.dl-card{width:100%;max-width:clamp(720px,46.8750vw,1200px);margin-top:clamp(clamp(48px,3.1250vw,80px),8vh,clamp(88px,5.7292vw,146.7px));display:flex;flex-wrap:wrap;
  align-items:center;justify-content:space-between;gap:clamp(20px,1.3021vw,33.3px);padding:clamp(clamp(22px,1.4323vw,36.7px),4vw,clamp(36px,2.3438vw,60px));
  border-radius:clamp(24px,1.5625vw,40px);background:var(--lime);color:#0f1012;transition:transform .2s}
.dl-card:hover{transform:translateY(-4px);color:#0f1012}
.dl-card .meta{display:flex;flex-direction:column;gap:clamp(6px,0.3906vw,10px)}
.dl-card .os{font-size:clamp(12px,0.7812vw,20px);font-weight:700;letter-spacing:.1em;text-transform:uppercase;opacity:.7}
.dl-card h2{margin:0;font-size:clamp(30px,4vw,clamp(48px,3.1250vw,80px));font-weight:800;letter-spacing:-.03em;line-height:1}
.dl-card .host{font-size:clamp(14px,0.9115vw,23.3px);opacity:.75}
.dl-cta{display:inline-flex;align-items:center;gap:clamp(10px,0.6510vw,16.7px);height:clamp(52px,3.3854vw,86.7px);padding:0 clamp(22px,1.4323vw,36.7px);border-radius:999px;
  background:#0f1012;color:#f3f2ec;font-size:clamp(15px,0.9766vw,25px);font-weight:700;white-space:nowrap}
.play{width:0;height:0;border-top:clamp(7px,0.4557vw,11.7px) solid transparent;border-bottom:clamp(7px,0.4557vw,11.7px) solid transparent;
  border-left:clamp(12px,0.7812vw,20px) solid var(--lime)}

/* ---------- team ---------- */
/* Coin medallion: portrait in the hub, name and title curved around the rim.
   The SVG is decorative (aria-hidden); the real heading and role live in a
   visually hidden block so heading order and screen readers stay intact. */
.coin{position:relative;width:clamp(210px,13.6719vw,350px);aspect-ratio:1/1;display:grid;place-items:center;flex:none}
.coin-ring{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.coin-ring .rim{fill:none;stroke:var(--c);stroke-width:2}
.coin-ring .rim-in{fill:none;stroke:var(--line);stroke-width:1}
.coin-ring .hub{fill:var(--surface);stroke:var(--c);stroke-width:1.5}
.coin-ring .pip{fill:var(--c)}
.coin-ring text{font-family:"Albert Sans",Helvetica,sans-serif}
.coin-ring .nm{font-size:15px;font-weight:800;letter-spacing:.14em;fill:var(--ink)}
.coin-ring .rl{font-size:9.5px;font-weight:700;letter-spacing:.16em;fill:var(--c)}
.coin .avatar{width:62%;height:62%;border:0}
.coin:has(.avatar.has-photo) .hub{fill:#f3f2ec}

.team{width:100%;max-width:clamp(720px,46.8750vw,1200px);margin-top:clamp(clamp(64px,4.1667vw,106.7px),12vh,clamp(140px,9.1146vw,233.3px));display:grid;grid-template-columns:1fr;
  gap:clamp(clamp(24px,1.5625vw,40px),4vw,clamp(48px,3.1250vw,80px));justify-items:center}
@media (min-width:560px){.team{grid-template-columns:1fr 1fr}}
.member{display:flex;flex-direction:column;gap:clamp(18px,1.1719vw,30px);width:100%;max-width:clamp(300px,19.5312vw,500px);align-items:center;text-align:center}
.avatar{position:relative;width:clamp(150px,9.7656vw,250px);height:clamp(150px,9.7656vw,250px);max-width:100%;aspect-ratio:1/1;border-radius:50%;
  overflow:hidden;background:var(--surface);display:flex;align-items:center;justify-content:center}
/* layered over the initials, which are hidden once the photo loads */
.avatar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.avatar.has-photo{background:#f3f2ec}
.avatar.has-photo .initials{display:none}
.avatar .initials{font-size:clamp(38px,2.4740vw,63.3px);font-weight:800;letter-spacing:-.02em;color:#3a3d43}

/* ---------- career ---------- */
.roles{width:100%;max-width:clamp(1100px,71.6146vw,1833.3px);margin-top:clamp(clamp(64px,4.1667vw,106.7px),12vh,clamp(140px,9.1146vw,233.3px));display:grid;grid-template-columns:1fr;gap:clamp(14px,0.9115vw,23.3px)}
@media (min-width:640px){.roles{grid-template-columns:1fr 1fr}}
@media (min-width:1024px){.roles{grid-template-columns:repeat(3,minmax(0,1fr))}}
.role{padding:clamp(26px,1.6927vw,43.3px);border-radius:clamp(20px,1.3021vw,33.3px);background:var(--c);color:#0f1012;min-height:clamp(200px,13.0208vw,333.3px);
  display:flex;flex-direction:column;justify-content:space-between;gap:clamp(16px,1.0417vw,26.7px)}
.role h2{margin:0;font-size:clamp(12px,0.7812vw,20px);font-weight:700;letter-spacing:.1em;text-transform:uppercase;opacity:.7}
.role .what{font-size:clamp(22px,2.4vw,clamp(30px,1.9531vw,50px));font-weight:700;letter-spacing:-.02em;line-height:1.15}
.pitch{width:100%;max-width:clamp(1100px,71.6146vw,1833.3px);margin-top:clamp(clamp(64px,4.1667vw,106.7px),12vh,clamp(140px,9.1146vw,233.3px));text-align:center}
.pitch p{margin:0;font-size:clamp(20px,2.4vw,clamp(30px,1.9531vw,50px));font-weight:300;line-height:1.3;letter-spacing:-.01em}
.pitch .mailwrap{margin-top:clamp(16px,1.0417vw,26.7px);display:flex;justify-content:center}
.pitch address{display:block;margin-top:clamp(28px,1.8229vw,46.7px);font-style:normal;font-size:clamp(14px,0.9115vw,23.3px);line-height:1.6;color:var(--muted)}

/* ---------- partner ---------- */
.flagbar{margin-top:clamp(clamp(40px,2.6042vw,66.7px),8vh,clamp(80px,5.2083vw,133.3px));display:inline-flex;align-items:center;gap:clamp(12px,0.7812vw,20px);
  padding:clamp(12px,0.7812vw,20px) clamp(22px,1.4323vw,36.7px) clamp(12px,0.7812vw,20px) clamp(14px,0.9115vw,23.3px);background:#0f1012;color:#f3f2ec;border-radius:clamp(4px,0.2604vw,6.7px) 999px 999px clamp(4px,0.2604vw,6.7px);
  font-size:clamp(14px,0.9115vw,23.3px);font-weight:700;letter-spacing:.02em;transform-origin:left center;
  animation:flagwave-wide 3s ease-in-out infinite}
.flagbar .dot{display:block;width:clamp(10px,0.6510vw,16.7px);height:clamp(10px,0.6510vw,16.7px);border-radius:50%;background:var(--lime)}
.p-title{margin:clamp(clamp(28px,1.8229vw,46.7px),5vh,clamp(48px,3.1250vw,80px)) 0 0;max-width:clamp(1000px,65.1042vw,1666.7px);text-align:center}
.p-lede{margin:clamp(clamp(20px,1.3021vw,33.3px),3vh,clamp(32px,2.0833vw,53.3px)) 0 0;max-width:clamp(560px,36.4583vw,933.3px);text-align:center;
  font-size:clamp(16px,1.5vw,clamp(20px,1.3021vw,33.3px));font-weight:300;line-height:1.5;text-wrap:pretty}
.ask{width:100%;max-width:clamp(820px,53.3854vw,1366.7px);margin-top:clamp(clamp(48px,3.1250vw,80px),8vh,clamp(88px,5.7292vw,146.7px));display:flex;flex-direction:column;
  align-items:center;gap:clamp(clamp(22px,1.4323vw,36.7px),3.5vh,clamp(34px,2.2135vw,56.7px));text-align:center}
.ask .fine{margin:0;max-width:clamp(520px,33.8542vw,866.7px);font-size:clamp(14px,0.9115vw,23.3px);line-height:1.5;opacity:.8}
.steps{margin-top:clamp(clamp(48px,3.1250vw,80px),8vh,clamp(88px,5.7292vw,146.7px));max-width:clamp(720px,46.8750vw,1200px);width:100%;display:grid;grid-template-columns:1fr;gap:clamp(20px,1.3021vw,33.3px)}
@media (min-width:640px){.steps{grid-template-columns:repeat(3,minmax(0,1fr))}}
.step{border-top:clamp(2px,0.1302vw,3.3px) solid #0f1012;padding-top:clamp(14px,0.9115vw,23.3px)}
.step .n{font-size:clamp(12px,0.7812vw,20px);font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.step .t{margin:clamp(8px,0.5208vw,13.3px) 0 0;font-size:clamp(17px,1.1068vw,28.3px);font-weight:500;line-height:1.4}

/* ---------- footer ---------- */
.site-footer{width:100%;max-width:clamp(1100px,71.6146vw,1833.3px);margin-top:clamp(clamp(56px,3.6458vw,93.3px),9vh,clamp(100px,6.5104vw,166.7px));padding-top:clamp(18px,1.1719vw,30px);
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:clamp(12px,0.7812vw,20px) clamp(24px,1.5625vw,40px);
  border-top:clamp(1px,0.0651vw,1.7px) solid var(--line);font-size:clamp(13px,0.8464vw,21.7px);color:var(--muted)}
.site-footer .brand{display:flex;align-items:center;gap:clamp(10px,0.6510vw,16.7px)}
.site-footer .brand .name{font-weight:600;color:var(--ink)}
.badge-k5{display:inline-flex;align-items:center;justify-content:center;width:clamp(26px,1.6927vw,43.3px);height:clamp(26px,1.6927vw,43.3px);
  border-radius:50%;background:var(--lime);color:#0f1012;font-size:clamp(12px,0.7812vw,20px);font-weight:800;transform:rotate(-8deg)}
html.theme-pink .badge-k5{background:#0f1012;color:var(--pink)}
.footer-nav{display:flex;flex-wrap:wrap;gap:clamp(4px,0.2604vw,6.7px)}
.footer-nav a{padding:clamp(6px,0.3906vw,10px) clamp(12px,0.7812vw,20px);border-radius:999px;color:var(--ink)}
.footer-nav a:hover{background:var(--hov-bg);color:var(--hov-fg);opacity:1}
.footer-nav a:hover .at{background:#0f1012;color:var(--lime)}
html.theme-pink .footer-nav a:hover .at{background:var(--pink);color:#0f1012}
.footer-addr{flex-basis:100%;font-size:clamp(12px,0.7812vw,20px)}

/* ---------- mobile ---------- */
@media (max-width:639px){
  .nav-desktop{display:none}
  .nav-mobile{display:grid}
  .home{--shell-pb:clamp(110px,7.1615vw,183.3px)}
}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none !important;transition:none !important}
  .card:hover,.dl-card:hover,.nav-desktop a:hover{transform:none !important}
}
