:root{
    --bg:#10231d;
    --cream:#f4ecd8;
    --cream-dim:rgba(244,236,216,0.68);
    --cream-faint:rgba(244,236,216,0.36);
    --ink:#17241d;
    --coral:#ff6f52;
    --marigold:#eaac2e;
    --mint:#8fd6b4;
    --rose:#ec93a6;
    --periwinkle:#9aa4f2;
    --rule:rgba(244,236,216,0.14);
  }
  *{ box-sizing:border-box; }
  body{
    margin:0;
    background:var(--bg);
    background-image:
      radial-gradient(ellipse 900px 520px at 85% -8%, rgba(255,111,82,0.14), transparent 60%),
      radial-gradient(ellipse 800px 600px at -5% 40%, rgba(143,214,180,0.10), transparent 55%),
      radial-gradient(ellipse 700px 500px at 60% 95%, rgba(154,164,242,0.10), transparent 55%);
    color:var(--cream);
    font-family:'Public Sans', sans-serif;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  :focus-visible{ outline:2px solid var(--coral); outline-offset:3px; }
  a{ color:inherit; }
  .wrap{ max-width:1180px; margin:0 auto; padding:0 28px; width:100%; }

  @keyframes fadeUp{ from{ opacity:0; transform:translateY(14px);} to{ opacity:1; transform:translateY(0);} }
  @keyframes floatIn{ from{ opacity:0; transform:scale(.94) rotate(-6deg);} to{ opacity:1; transform:scale(1) rotate(-4deg);} }
  @media (prefers-reduced-motion: reduce){ .fade,.pop{ animation:none !important; opacity:1 !important; } }
  .fade{ opacity:0; animation:fadeUp .7s ease-out forwards; }
  .pop{ opacity:0; animation:floatIn .7s cubic-bezier(.2,.8,.3,1.2) forwards; }
  .d1{ animation-delay:.05s; } .d2{ animation-delay:.16s; } .d3{ animation-delay:.28s; }
  .d4{ animation-delay:.4s; } .d5{ animation-delay:.5s; }

  /* ---------- HEADER ---------- */
  header.site{
    display:flex; align-items:center; justify-content:space-between;
    padding:30px 0 0;
  }
  header.site img.logo-sm{ height:22px; width:auto; display:block; }
  .site-tag{
    font-family:'JetBrains Mono', monospace;
    font-size:11px; letter-spacing:0.08em; color:var(--cream-faint);
  }
  @media (max-width:600px){ .site-tag{ display:none; } }

  /* ---------- HERO ---------- */
  .hero{ position:relative; padding:56px 0 30px; }
  .hero-logo-big{
    display:flex; justify-content:center; margin-bottom:44px;
  }
  .hero-logo-big img{
    height:76px; width:auto;
    filter:drop-shadow(0 12px 34px rgba(255,111,82,0.22));
  }
  @media (max-width:560px){ .hero-logo-big img{ height:52px; } }

  .badge{
    position:absolute;
    top:2px; right:28px;
    width:128px; height:128px;
    border-radius:50%;
    background:var(--coral);
    color:var(--ink);
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    text-align:center;
    font-family:'Space Grotesk', sans-serif;
    font-weight:700;
    letter-spacing:0.01em;
    transform:rotate(9deg);
    box-shadow:0 14px 30px rgba(255,111,82,0.35);
    padding:14px;
  }
  .badge span{ display:block; font-size:12.5px; line-height:1.3; }
  .badge span.year{ font-size:10px; opacity:0.7; margin-top:3px; font-weight:600; }
  @media (max-width:760px){ .badge{ position:static; margin:0 auto 30px; transform:rotate(-6deg);} }

  h1{
    font-family:'Space Grotesk', sans-serif;
    font-weight:700;
    font-size:clamp(38px, 7.4vw, 84px);
    line-height:1.02;
    letter-spacing:-0.02em;
    text-align:center;
    max-width:16ch;
    margin:0 auto 30px;
  }
  h1 em{
    font-family:'Instrument Serif', serif;
    font-style:italic;
    font-weight:400;
    color:var(--coral);
  }
  .lede{
    font-size:18px;
    line-height:1.72;
    color:var(--cream-dim);
    max-width:52ch;
    margin:0 auto 34px;
    text-align:center;
  }
  .lede strong{ color:var(--cream); font-weight:600; }

  .cta-row{ display:flex; justify-content:center; gap:16px; flex-wrap:wrap; margin-bottom:20px; }
  .btn-primary{
    display:inline-flex; align-items:center; gap:10px;
    background:var(--coral);
    color:var(--ink);
    font-family:'Space Grotesk', sans-serif;
    font-weight:600;
    font-size:15px;
    padding:15px 28px;
    border-radius:999px;
    text-decoration:none;
    box-shadow:0 12px 26px rgba(255,111,82,0.28);
    transition:transform .18s ease, box-shadow .18s ease;
  }
  .btn-primary:hover{ transform:translateY(-2px); box-shadow:0 16px 32px rgba(255,111,82,0.4); }
  .btn-secondary{
    display:inline-flex; align-items:center; gap:8px;
    font-family:'JetBrains Mono', monospace;
    font-size:13px;
    color:var(--cream-dim);
    text-decoration:none;
    padding:15px 6px;
    border-bottom:1px solid var(--rule);
    transition:color .18s ease, border-color .18s ease;
  }
  .btn-secondary:hover{ color:var(--cream); border-color:var(--cream-faint); }

  /* ---------- CAPABILITIES ---------- */
  .capabilities{ padding:80px 0 20px; }
  .cap-heading{ text-align:center; margin-bottom:44px; }
  .cap-heading p.eyebrow{
    font-family:'JetBrains Mono', monospace;
    font-size:11.5px; letter-spacing:0.16em; text-transform:uppercase;
    color:var(--mint); margin:0 0 12px;
  }
  .cap-heading h2{
    font-family:'Instrument Serif', serif;
    font-style:italic;
    font-weight:400;
    font-size:clamp(26px,3.6vw,38px);
    margin:0;
  }

  .cap-grid{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:20px;
  }
  @media (max-width:900px){ .cap-grid{ grid-template-columns:repeat(2, 1fr); } }
  @media (max-width:520px){ .cap-grid{ grid-template-columns:1fr; } }

  .chip{
    border-radius:22px;
    padding:26px 22px;
    color:var(--ink);
    transition:transform .22s ease, box-shadow .22s ease;
    box-shadow:0 10px 0 rgba(0,0,0,0.12);
    opacity:0;
    transform:translateY(16px);
  }
  .chip.visible{ opacity:1; transform:none; transition:opacity .5s ease, transform .5s ease; }
  .chip:hover{ transform:translateY(-6px) rotate(0deg) !important; box-shadow:0 16px 0 rgba(0,0,0,0.14); }
  .chip:nth-child(8n+1){ background:var(--coral); }
  .chip:nth-child(8n+1).visible{ transform:translateY(0) rotate(-2deg); }
  .chip:nth-child(8n+2){ background:var(--marigold); }
  .chip:nth-child(8n+2).visible{ transform:translateY(0) rotate(1.5deg); }
  .chip:nth-child(8n+3){ background:var(--mint); }
  .chip:nth-child(8n+3).visible{ transform:translateY(0) rotate(-1.5deg); }
  .chip:nth-child(8n+4){ background:var(--rose); }
  .chip:nth-child(8n+4).visible{ transform:translateY(0) rotate(2deg); }
  .chip:nth-child(8n+5){ background:var(--periwinkle); }
  .chip:nth-child(8n+5).visible{ transform:translateY(0) rotate(-2deg); }
  .chip:nth-child(8n+6){ background:var(--marigold); }
  .chip:nth-child(8n+6).visible{ transform:translateY(0) rotate(2deg); }
  .chip:nth-child(8n+7){ background:var(--coral); }
  .chip:nth-child(8n+7).visible{ transform:translateY(0) rotate(-1.5deg); }
  .chip:nth-child(8n+8){ background:var(--mint); }
  .chip:nth-child(8n+8).visible{ transform:translateY(0) rotate(1.5deg); }

  @media (prefers-reduced-motion: reduce){
    .chip{ opacity:1; transform:none !important; }
  }

  .chip .num{
    font-family:'JetBrains Mono', monospace;
    font-size:11px; font-weight:500; letter-spacing:0.06em;
    opacity:0.55; margin-bottom:14px;
  }
  .chip h3{
    font-family:'Space Grotesk', sans-serif;
    font-weight:700;
    font-size:18.5px;
    margin:0 0 8px;
    line-height:1.2;
  }
  .chip p{
    font-size:13.5px;
    line-height:1.55;
    margin:0;
    opacity:0.82;
  }

  /* ---------- CLOSE ---------- */
  .close{
    margin-top:90px;
    border-top:1px solid var(--rule);
    padding:60px 0 50px;
    text-align:center;
  }
  .close h2{
    font-family:'Space Grotesk', sans-serif;
    font-weight:700;
    font-size:clamp(24px,3.4vw,34px);
    margin:0 0 14px;
  }
  .close h2 em{ font-family:'Instrument Serif', serif; font-style:italic; font-weight:400; color:var(--coral); }
  .close p{ color:var(--cream-dim); font-size:15px; max-width:44ch; margin:0 auto 26px; line-height:1.65; }

  footer{
    padding:30px 0 44px;
    display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;
    font-family:'JetBrains Mono', monospace;
    font-size:10.5px; letter-spacing:0.06em; color:var(--cream-faint);
  }