:root{
  --ink:#0a0a0a;
  --paper:#FBF8F3;
  --soft:#F4EFE6;
  --coral:#FF5C39;
  --purple:#7C3AED;
  --mint:#00C896;
  --sun:#FCD34D;
  --grey:#67635d;
  --line:rgba(10,10,10,.12);
  --display:'Syne',system-ui,sans-serif;
  --body:'DM Sans',-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --serif:'Instrument Serif',Georgia,serif;
  --hand:'Caveat',cursive;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);line-height:1.65;-webkit-font-smoothing:antialiased}
a{color:inherit}
img,video{max-width:100%;display:block}
.top{position:sticky;top:0;z-index:20;background:rgba(251,248,243,.84);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
.nav{max-width:1180px;margin:auto;padding:18px 22px;display:flex;align-items:center;justify-content:space-between;gap:18px}
.brand img{width:min(230px,58vw);height:auto}
.nav-links{display:flex;gap:18px;align-items:center;font-size:.9rem}
.nav-links a{text-decoration:none;font-weight:700;color:#333}
.nav-links .btn{color:var(--paper)}
.wrap{max-width:1180px;margin:auto;padding:72px 22px}
.hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,.48fr);gap:42px;align-items:center}
.tag{display:inline-flex;align-items:center;gap:.5rem;background:var(--soft);padding:.42rem .75rem;border-radius:999px;font-family:var(--display);font-weight:800;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase}
.tag:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--coral)}
h1,h2,h3{font-family:var(--display);letter-spacing:-.04em;line-height:1;margin:0 0 18px}
h1{font-size:clamp(3rem,8vw,6.2rem)}
h2{font-size:clamp(2rem,5vw,3.9rem)}
h3{font-size:1.25rem}
.lead{font-size:1.16rem;color:var(--grey);max-width:760px}
.hand{font-family:var(--hand);color:var(--coral);font-weight:700}
.serif{font-family:var(--serif);font-style:italic;font-weight:400}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;padding:14px 20px;border-radius:999px;background:var(--ink);color:var(--paper);font-family:var(--display);font-weight:800;text-decoration:none;font-size:.85rem;letter-spacing:.04em}
.btn.alt{background:transparent;color:var(--ink);border:2px solid var(--ink)}
.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.card{background:white;border:1px solid var(--line);border-radius:24px;padding:26px;box-shadow:0 22px 70px rgba(10,10,10,.08)}
.metric{font-family:var(--display);font-size:clamp(2.5rem,6vw,4.5rem);line-height:.92;letter-spacing:-.07em;color:var(--coral);font-weight:900}
.metric small{display:block;margin-top:10px;font-size:.92rem;letter-spacing:0;color:var(--grey);font-family:var(--body);font-weight:700}
.band{background:var(--soft);border-block:1px solid var(--line)}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.grid.two{grid-template-columns:repeat(2,1fr)}
.tile{background:white;border:1px solid var(--line);border-radius:18px;padding:22px}
.tile strong{display:block;font-family:var(--display);line-height:1.15;margin-bottom:8px}
.tile p{margin:0;color:var(--grey)}
.split{display:grid;grid-template-columns:.8fr 1.2fr;gap:36px;align-items:start}
.list{display:grid;gap:12px;padding:0;margin:0;list-style:none}
.list li{display:flex;gap:10px;align-items:flex-start;color:var(--grey)}
.list li:before{content:"✓";color:var(--mint);font-weight:900;flex-shrink:0}
.media-card{position:relative;overflow:hidden;border-radius:26px;background:var(--ink);min-height:360px}
.media-card img,.media-card video{width:100%;height:100%;object-fit:cover;filter:brightness(.78)}
.media-card .overlay{position:absolute;inset:auto 0 0;padding:24px;color:var(--paper);background:linear-gradient(180deg,transparent,rgba(10,10,10,.78))}
.faq{display:grid;gap:12px}
details{background:white;border:1px solid var(--line);border-radius:16px;padding:18px}
summary{font-family:var(--display);font-weight:800;cursor:pointer}
details p{color:var(--grey);margin:.7rem 0 0}
.note{padding:16px 18px;border-radius:16px;background:var(--sun);font-weight:800}
.footer{border-top:1px solid var(--line);padding:34px 22px;color:var(--grey)}
.footer-inner{max-width:1180px;margin:auto;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
.footer a{font-weight:800;text-decoration:none;color:var(--ink)}
@media(max-width:860px){
  .nav-links{display:none}
  .wrap{padding:52px 20px}
  .hero,.split,.grid,.grid.two{grid-template-columns:1fr}
  h1{font-size:3.3rem}
  .actions{flex-direction:column}
  .btn{width:100%}
  .media-card{min-height:260px}
}
