:root{
  --bg:#F7FBFF; --ink:#1F2A33; --ink-muted:#5B6A75;
  --brand:#3FA7D6; --brand-dark:#338CBC;
  --gold:#FFD85B; --gold-light:#FFE680;
  --card:#FFFFFF; --border:#DCE8F2; --shadow:0 6px 24px rgba(0,0,0,.08);
  --sky1:#AEE2FF; --sky2:#46AEDD; --sea:#2E9CC3;
}
*{box-sizing:border-box} html,body{margin:0;padding:0}
body{font-family:'Outfit',system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:var(--ink);background:var(--bg);line-height:1.6}
.container{width:min(1100px,92vw);margin:0 auto}
.nav{position:sticky;top:0;z-index:20;background:#EAF4FE;border-bottom:1px solid var(--border);background-image:url('data:image/svg+xml;base64,CjxzdmcgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJyB3aWR0aD0nMjQwJyBoZWlnaHQ9JzM4JyB2aWV3Qm94PScwIDAgMjQwIDM4Jz4KICA8cmVjdCB3aWR0aD0nMjQwJyBoZWlnaHQ9JzM4JyBmaWxsPScjRUFGNEZFJy8+CiAgPHBhdGggZD0nTTAsMjIgUTMwLDEyIDYwLDIyIFQxMjAsMjIgVDE4MCwyMiBUMjQwLDIyIEwyNDAsMzggTDAsMzggWicgZmlsbD0nI2Q3ZWNmZicgLz4KICA8cGF0aCBkPSdNMCwyNCBRMzAsMTQgNjAsMjQgVDEyMCwyNCBUMTgwLDI0IFQyNDAsMjQgTDI0MCwzOCBMMCwzOCBaJyBmaWxsPScjY2JlNmZmJyBvcGFjaXR5PScwLjgnLz4KPC9zdmc+Cg==');background-repeat:repeat-x;background-position:0 100%;background-size:240px 38px;animation:headerWave 18s linear infinite}
@keyframes headerWave{from{background-position-x:0}to{background-position-x:240px}}
.nav__inner{display:flex;align-items:center;justify-content:space-between;padding:10px 0}
.brand{font-weight:700;text-decoration:none;color:#4C9EE3;font-size:1.2em;transition:color .3s ease}
.brand:hover{color:#2E9CC3}
.nav a{margin-left:18px;text-decoration:none;color:var(--ink);font-weight:500} .nav a.btn{margin-left:10px}
.hero{position:relative;padding:84px 0 48px;background:linear-gradient(180deg,var(--sky1) 0%,var(--sky2) 40%,var(--sea) 100%);overflow:hidden}
.hero__canvas{position:absolute;inset:0;z-index:0;opacity:.66;pointer-events:none;width:100%;height:100%;display:block}
.hero__inner{position:relative;z-index:2;display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center}
.hero__copy h1{font-size:clamp(32px,4vw,52px);line-height:1.1;margin:0 0 12px;color:#0f2630}
.lead{font-size:clamp(16px,2.2vw,20px);color:#0f2630d0}
.cta-row{display:flex;gap:12px;margin:16px 0 8px}
.btn{display:inline-block;border:2px solid var(--gold);padding:12px 18px;border-radius:12px;text-decoration:none;font-weight:800;letter-spacing:.2px}
.btn--primary{background:var(--gold);border-color:var(--gold);color:#2a2a2a}
.btn--primary:hover{background:var(--gold-light);border-color:var(--gold-light);color:#1a1a1a}
.btn--ghost{background:transparent;color:#7a6400;border-color:var(--gold)}
.btn--ghost:hover{background:var(--gold);color:#2a2a2a;border-color:var(--gold)}
.hero__cover img{width:100%;border-radius:16px;box-shadow:var(--shadow)}
.age-range{font-weight:600;color:#0e4760}
.section{padding:64px 0} .section h2{color:#2E9CC3;margin-top:0} .section.alt{background:#F2F8FE}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:start}
.card{background:var(--card);border-radius:16px;box-shadow:var(--shadow);padding:24px;border:1px solid var(--border)}
.details{list-style:none;padding:0;margin:0} .details li{padding:8px 0;border-bottom:1px dashed #d7e6f1} .details li:last-child{border-bottom:none}
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:20px}
.gallery img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:16px;box-shadow:var(--shadow);cursor:zoom-in;transition:transform .15s ease, box-shadow .15s ease}
.gallery img:hover{transform:translateY(-2px);box-shadow:0 8px 28px rgba(0,0,0,.12)}
.author-photo img{width:100%;border-radius:16px;box-shadow:var(--shadow)}
.quotes{display:grid;grid-template-columns:1fr;gap:16px}
blockquote{margin:0;padding:18px 18px 18px 22px;background:var(--card);border-left:6px solid #2E9CC3;border-radius:10px;box-shadow:var(--shadow)} cite{display:block;margin-top:6px;color:var(--ink-muted);font-style:normal}
.buy-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:12px}
.buy-card{display:block;background:var(--card);padding:18px;border-radius:14px;text-decoration:none;color:var(--ink);box-shadow:var(--shadow);border:1px solid var(--border)}
.buy-card:hover{transform:translateY(-2px);box-shadow:0 8px 28px rgba(0,0,0,.12)}
.muted{color:var(--ink-muted)} .small{font-size:.9rem}
.contact-form{margin-top:12px} .form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
input,textarea{width:100%;padding:12px 14px;border-radius:10px;border:1px solid #d7e6f1;background:#fff;font:inherit;color:var(--ink)} textarea{resize:vertical}
.footer{padding:28px 0;background:#EAF4FE;border-top:1px solid var(--border)} .footer__inner{display:flex;align-items:center;justify-content:space-between}
.toplink{text-decoration:none;color:#4C9EE3;transition:color .3s ease} .toplink:hover{color:#2E9CC3}
.lightbox{position:fixed;inset:0;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,.7);backdrop-filter:blur(2px);z-index:100}
.lightbox img{max-width:92vw;max-height:86vh;border-radius:14px;box-shadow:0 8px 30px rgba(0,0,0,.4)} .lightbox.show{display:flex}
.lightbox-close{position:absolute;top:16px;right:16px;border:0;background:#fff;border-radius:999px;width:40px;height:40px;font-size:24px;line-height:40px;cursor:pointer;box-shadow:var(--shadow)}
@media (max-width:840px){.hero__inner,.grid-2{grid-template-columns:1fr} .buy-grid{grid-template-columns:1fr} .form-row{grid-template-columns:1fr} .gallery{grid-template-columns:repeat(2,1fr)}}