:root{--navy:#1f2f4d;--sage:#9caf88;--blush:#f2d3cf;--cream:#fbf8f5}
*{box-sizing:border-box}body{margin:0;font-family:-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:var(--navy);background:var(--cream);line-height:1.6}
a{color:var(--navy)}.nav{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;padding:14px 5%;background:#fff;border-bottom:3px solid var(--blush)}
.logo{font-weight:800;font-size:1.5rem;text-decoration:none}.logo span{color:var(--sage)}nav a{margin-left:16px;text-decoration:none;font-weight:600}
section,main{padding:48px 5%;max-width:1150px;margin:auto}h1,h2{line-height:1.2}
.hero{max-width:none;background:linear-gradient(135deg,var(--navy),#34507d);color:#fff;text-align:center;padding:80px 5%}.hero h1{font-size:clamp(2rem,5vw,3.2rem);margin:0 0 12px}.hero p{max-width:640px;margin:0 auto 24px;font-size:1.15rem}
.btn{display:inline-block;background:var(--blush);color:var(--navy);padding:12px 24px;border-radius:30px;font-weight:700;text-decoration:none;margin:6px}.btn.alt{background:var(--sage);color:#fff}
.story{max-width:780px;text-align:center}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:22px}
.card{background:#fff;border-radius:14px;overflow:hidden;text-decoration:none;box-shadow:0 2px 10px rgba(31,47,77,.08);display:flex;flex-direction:column;padding-bottom:14px}.card img{width:100%;aspect-ratio:4/3;object-fit:contain;background:#fff}
.card h3,.card p,.card span{margin:8px 16px 0}.card p{font-size:.92rem;flex:1}.card span{color:var(--sage);font-weight:700}.ph{aspect-ratio:1;background:var(--blush);display:grid;place-items:center}
.center{text-align:center}.free{display:flex;gap:32px;align-items:center;background:var(--blush);border-radius:18px;margin:24px auto}.free img{width:240px;max-width:40%;border-radius:10px;box-shadow:0 4px 14px rgba(0,0,0,.15)}.free .btn{background:var(--navy);color:#fff}
.shops{text-align:center}.small{font-size:.85rem;opacity:.85}.doc{max-width:800px}
footer{background:var(--navy);color:#fff;text-align:center;padding:28px 5%}footer a{color:var(--blush)}
@media(max-width:640px){.free{flex-direction:column}.free img{max-width:70%}nav a{margin:0 12px 0 0}}