@font-face{font-family:"Fredoka";src:url("/fonts/Fredoka-Bold.ttf") format("truetype");font-weight:700;font-display:swap}
:root{--cream:#fbf6ee;--paper:#fff;--red:#b23a34;--brown:#5c3428;--text:#3b2a24;--muted:#7a6459;--sky:#d3ebf4;--sage:#dfe9df;--line:#ecdfd0}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;color:var(--text);background:var(--cream);line-height:1.6;font-size:18px}
h1,h2,h3,.brand-name{font-family:"Fredoka","Arial Rounded MT Bold",system-ui,sans-serif;font-weight:700;line-height:1.12;margin:0;color:var(--brown)}
a{color:var(--red)}
img{max-width:100%}
.wrap{width:min(1080px,100% - 32px);margin-inline:auto}
/* header */
.top{background:var(--cream);border-bottom:1px solid var(--line)}
.top .wrap{display:flex;align-items:center;gap:12px;padding:12px 0}
.top .home{display:flex;align-items:center;gap:12px;text-decoration:none}
.top img{width:42px;height:42px;border-radius:50%;display:block}
.brand-name{font-size:1.3rem;color:var(--red)}
.top nav{margin-left:auto;display:flex;gap:22px;font-size:.95rem}
.top nav a{color:var(--brown);text-decoration:none}.top nav a:hover{text-decoration:underline}
/* hero */
.hero{background:var(--sky)}
.hero .wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center;padding:60px 0 68px}
.eyebrow{display:inline-block;background:var(--paper);color:var(--brown);border-radius:999px;padding:5px 16px;font-weight:600;font-size:.9rem;margin-bottom:18px}
.hero h1{font-size:clamp(2.5rem,6vw,4.2rem);color:var(--red)}
.hero h1 small{display:block;font-size:.42em;color:var(--brown);margin-top:10px}
.lead{font-size:1.2rem;margin:20px 0 28px;max-width:36ch}
.btns{display:flex;flex-wrap:wrap;gap:12px}
.btn{display:inline-block;text-decoration:none;font-weight:700;font-size:1.02rem;padding:13px 24px;border-radius:999px;border:2px solid var(--red);transition:background .15s,color .15s}
.btn.primary{background:var(--red);color:#fff}
.btn.primary:hover{background:#962f2a;border-color:#962f2a}
.btn.secondary{background:transparent;color:var(--red)}
.btn.secondary:hover{background:var(--paper)}
.btn.soon{border-color:var(--muted);color:var(--muted);cursor:default}
.cover{justify-self:center;max-width:430px;width:100%}
.cover img{width:100%;height:auto;display:block;border-radius:6px;box-shadow:0 18px 40px rgba(60,40,30,.22)}
/* sections */
section{padding:68px 0}
h2{font-size:clamp(1.8rem,4vw,2.4rem);margin-bottom:12px}
.sub{max-width:60ch;margin:0 0 32px;color:var(--muted)}
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.gallery figure{margin:0;background:var(--paper);border-radius:14px;padding:12px;box-shadow:0 4px 14px rgba(60,40,30,.08)}
.gallery img{width:100%;height:auto;display:block;border-radius:8px}
.gallery figcaption{font-size:.95rem;margin-top:8px;display:flex;justify-content:space-between;gap:8px;color:var(--brown)}
.gallery figcaption a{font-weight:700}
.gallery a.thumb{display:block}
.dl{margin-top:34px}
.note{font-size:.9rem;color:var(--muted);margin-top:22px;max-width:62ch}
.alt{background:var(--paper)}
.green{background:var(--sage)}
.features{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,1fr);gap:16px 36px}
.features li{padding-left:32px;position:relative}
.features li::before{content:"";position:absolute;left:0;top:.45em;width:14px;height:14px;border-radius:50%;background:var(--red)}
.split{display:grid;grid-template-columns:auto 1fr;gap:36px;align-items:center}
.split .round{width:180px;height:180px;border-radius:50%;display:block;object-fit:cover}
.split p{margin:0 0 12px;max-width:62ch}
.cta{text-align:center}
.cta p{margin:0 auto 24px;max-width:48ch}
footer{background:var(--brown);color:#f1e3d6;padding:26px 0;font-size:.9rem;text-align:center}
footer a{color:#fff}
@media (max-width:820px){
 body{font-size:17px}
 .hero .wrap{grid-template-columns:1fr;padding:32px 0 48px;gap:30px}
 .cover{max-width:320px;order:-1}
 .gallery{grid-template-columns:1fr 1fr;gap:12px}
 .gallery figure{padding:8px}
 .features{grid-template-columns:1fr}
 .split{grid-template-columns:1fr;text-align:center;justify-items:center}
 .top nav{display:none}
 section{padding:48px 0}
}
