/* ===================================================================
   Matt Davies Author — "Storybook" design system
   Mockup 1 design applied site-wide. Static preview build.
   =================================================================== */
/* self-hosted fonts (latin subsets; Nunito files are variable 400-900) */
@font-face{font-family:'Chewy';font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/chewy.woff2") format("woff2")}
@font-face{font-family:'Patrick Hand';font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/patrick-hand.woff2") format("woff2")}
@font-face{font-family:'Nunito';font-style:normal;font-weight:400 900;font-display:swap;src:url("../fonts/nunito.woff2") format("woff2")}
@font-face{font-family:'Nunito';font-style:italic;font-weight:400 900;font-display:swap;src:url("../fonts/nunito-italic.woff2") format("woff2")}
:root{
  --paper:#fdf6e3;
  --paper-deep:#f7ecd2;
  --card:#fffdf6;
  --ink:#1a2d45;
  --soft:#8a7c61;
  --leaf:#2e72b8;
  --leaf-dark:#1a4d8a;
  --bee:#f4b942;
  --bee-deep:#e09c1a;
  --ladybird:#e8721e;
  --sky:#7db8d9;
  --sky-deep:#15394e;
  --lilac:#8b5fc7;
  --lilac-light:#f3eeff;
  --lilac-border:#b89de0;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:'Nunito',sans-serif;color:var(--ink);background:var(--paper);
  background-image:
    radial-gradient(ellipse at 15% 8%, rgba(125,184,217,.18), transparent 45%),
    radial-gradient(ellipse at 90% 90%, rgba(46,114,184,.10), transparent 50%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='.05'/%3E%3C/svg%3E");
  overflow-x:hidden;
}
h1,h2,h3{font-family:'Chewy',cursive;font-weight:400;line-height:1.08}
.hand{font-family:'Patrick Hand',cursive}
/* height:auto is load-bearing: <img> tags carry width/height attributes (CLS
   reservation), and without it the height attribute would defeat every CSS
   aspect-ratio/width rule */
img{max-width:100%;height:auto;display:block}

/* ---------- preview ribbon ---------- */
.preview-ribbon{background:var(--ink);color:var(--paper);font-family:'Patrick Hand';font-size:15px;text-align:center;padding:8px 14px}
.preview-ribbon a{color:var(--bee)}

/* ---------- nav ---------- */
nav.top{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:16px clamp(16px,4vw,48px);position:relative;z-index:20;flex-wrap:wrap}
.logo{font-family:'Chewy';font-size:clamp(22px,3vw,28px);color:var(--leaf-dark);text-decoration:none;transform:rotate(-2deg);display:inline-block;white-space:nowrap}
.logo span{color:var(--ladybird)}
nav.top ul{display:flex;gap:clamp(8px,1.8vw,20px);list-style:none;flex-wrap:wrap}
nav.top ul a{font-family:'Patrick Hand';font-size:18px;color:var(--ink);text-decoration:none;position:relative;white-space:nowrap}
nav.top ul a:hover,nav.top ul a.here{color:var(--leaf-dark)}
nav.top ul a.here::after,nav.top ul a:hover::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:3px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='6'%3E%3Cpath d='M0 3 Q 5 0, 10 3 T 20 3 T 30 3 T 40 3' stroke='%23e8721e' fill='none' stroke-width='2'/%3E%3C/svg%3E") repeat-x}
/* hamburger — hidden on desktop */
.nav-toggle,.nav-burger,.nav-scrim{display:none}
.nav-burger{appearance:none;background:none;border:none;cursor:pointer;width:44px;height:44px;padding:10px;border-radius:12px;flex-direction:column;justify-content:space-between}
.nav-burger span{display:block;height:3px;width:100%;background:var(--leaf-dark);border-radius:3px;transition:transform .25s ease,opacity .2s ease}
@media(max-width:820px){
  nav.top{flex-wrap:nowrap}
  nav.top .nav-burger{display:flex}
  nav.top ul{position:fixed;top:0;right:0;height:100dvh;width:min(78vw,300px);background:var(--card);flex-direction:column;flex-wrap:nowrap;gap:0;padding:84px 28px 28px;box-shadow:-8px 0 24px rgba(58,50,38,.18);transform:translateX(100%);transition:transform .28s ease;z-index:15;overflow-y:auto}
  nav.top ul li{width:100%;border-bottom:1px solid #e8dcbf}
  nav.top ul a{display:block;font-size:21px;padding:16px 4px}
  nav.top ul a.here::after,nav.top ul a:hover::after{display:none}
  nav.top ul a.here{color:var(--ladybird)}
  nav.top .nav-toggle:checked~ul{transform:translateX(0)}
  nav.top .nav-toggle:checked~.nav-scrim{display:block;position:fixed;inset:0;background:rgba(58,50,38,.4);z-index:14}
  nav.top .nav-toggle:checked~.nav-burger{position:fixed;right:clamp(16px,4vw,48px);top:20px;z-index:16}
  nav.top .nav-toggle:checked~.nav-burger span:nth-child(1){transform:translateY(8.5px) rotate(45deg)}
  nav.top .nav-toggle:checked~.nav-burger span:nth-child(2){opacity:0}
  nav.top .nav-toggle:checked~.nav-burger span:nth-child(3){transform:translateY(-8.5px) rotate(-45deg)}
}
@media(max-width:820px){body:has(.nav-toggle:checked){overflow:hidden}}

/* ---------- award marquee ---------- */
.marquee{background:var(--bee);overflow:hidden;white-space:nowrap;padding:9px 0;border-top:2px dashed #c98e12;border-bottom:2px dashed #c98e12}
.marquee .track{display:inline-block;animation:slide 26s linear infinite;font-family:'Patrick Hand';font-size:17px;color:#4a3408}
.marquee .track span{margin:0 26px}
@keyframes slide{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.marquee .track{animation:none}}

/* ---------- buttons ---------- */
.btn{font-family:'Chewy';font-size:20px;text-decoration:none;padding:12px 26px;border-radius:16px 22px 14px 24px;display:inline-block;transition:transform .15s ease;border:none;cursor:pointer}
.btn:hover{transform:scale(1.04)}
.btn-primary{background:var(--ladybird);color:#fff;box-shadow:0 5px 0 #b8511a}
.btn-leaf{background:var(--leaf);color:#fff;box-shadow:0 4px 0 var(--leaf-dark)}
.btn-ghost{background:transparent;color:var(--leaf-dark);border:3px dashed var(--leaf)}
.btn-sky{background:var(--sky-deep);color:#fff;box-shadow:0 5px 0 #0b2433}

/* ---------- layout ---------- */
.section{padding:clamp(44px,6vw,80px) clamp(16px,5vw,56px);max-width:1150px;margin:0 auto}
.section.tight{padding-top:clamp(24px,3vw,40px)}
.section-head{text-align:center;margin-bottom:clamp(28px,4vw,48px)}
.section-head h1,.section-head h2{font-size:clamp(32px,4.5vw,52px);color:var(--leaf-dark)}
.section-head p{font-family:'Patrick Hand';font-size:20px;color:#6b5f49;margin-top:8px}
.wave{display:block;width:100%;height:54px;margin-bottom:-1px}
.prose{max-width:680px;margin:0 auto;font-size:17.5px;line-height:1.75}
.prose p{margin-bottom:18px}
.prose a{color:var(--leaf-dark);font-weight:700}
.prose .big-quote{font-family:'Patrick Hand';font-size:24px;color:var(--leaf-dark);border-left:4px solid var(--bee);padding-left:18px;margin:26px 0}

/* ---------- page hero (subpages) ---------- */
.page-hero{text-align:center;padding:clamp(30px,5vw,60px) clamp(16px,5vw,56px) clamp(20px,3vw,36px);position:relative}
.page-hero h1{font-size:clamp(38px,5.5vw,64px);color:var(--leaf-dark)}
.page-hero h1 em{font-style:normal;color:var(--ladybird);display:inline-block}
.page-hero p{font-family:'Patrick Hand';font-size:21px;color:#6b5f49;margin-top:12px;max-width:60ch;margin-inline:auto}

/* ---------- home hero ---------- */
.hero{position:relative;padding:clamp(28px,5vw,64px) clamp(16px,5vw,56px) clamp(56px,8vw,100px);display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(20px,4vw,60px);align-items:center;max-width:1200px;margin:0 auto}
@media(max-width:820px){.hero{grid-template-columns:1fr;text-align:center}}
.hero h1{font-size:clamp(40px,6.5vw,76px);color:var(--leaf-dark)}
.hero h1 em{font-style:normal;color:var(--ladybird);display:inline-block}
.hero h1 .bee-word{color:var(--bee-deep);display:inline-block}
.hero p.sub{font-size:clamp(17px,2vw,20px);margin:20px 0 28px;max-width:48ch;line-height:1.65}
@media(max-width:820px){.hero p.sub{margin-inline:auto}}
.btn-row{display:flex;gap:14px;flex-wrap:wrap}
@media(max-width:820px){.btn-row{justify-content:center}}
.award{display:inline-flex;align-items:center;gap:8px;background:#fff;border:2px solid var(--bee);border-radius:999px;padding:6px 16px;font-family:'Patrick Hand';font-size:16px;margin-bottom:20px;box-shadow:3px 3px 0 var(--bee);text-decoration:none;color:var(--ink)}
.hero-books{position:relative;display:flex;justify-content:center;align-items:center;min-height:300px}
.hero-books .bookimg{width:clamp(170px,19vw,250px);aspect-ratio:1;border-radius:10px;box-shadow:8px 10px 0 rgba(58,50,38,.18);transition:transform .25s ease;object-fit:cover;background:#fff}
.hero-books .b1{transform:rotate(-6deg);z-index:2}
.hero-books .b2{transform:rotate(5deg) translateX(-34px) translateY(26px);z-index:1}
.hero-books .bookimg:hover{transform:translateY(-10px) rotate(0deg);z-index:3}

/* ---------- book cards ---------- */
.books-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(265px,1fr));gap:clamp(20px,3vw,34px)}
.book-card{background:var(--card);border:2px solid #e8dcbf;border-radius:22px;padding:26px;text-align:center;position:relative;transition:transform .2s ease,box-shadow .2s ease;display:flex;flex-direction:column}
.book-card:hover{transform:translateY(-6px) rotate(-.5deg);box-shadow:0 14px 30px rgba(58,50,38,.14)}
.book-card .coverlink{display:block}
.book-card .coverimg{width:min(200px,70%);aspect-ratio:1;object-fit:cover;margin:0 auto 18px;border-radius:8px;box-shadow:5px 6px 0 rgba(58,50,38,.15);transition:transform .2s ease}
.book-card .coverlink:hover .coverimg{transform:translateY(-6px) rotate(-1.5deg)}
.book-card .btn{position:relative;z-index:4}
.book-card h3{font-size:25px;color:var(--ink)}
.book-card h3 a{color:inherit;text-decoration:none}
.book-card .age{font-family:'Patrick Hand';color:var(--soft);font-size:16px;margin:4px 0 10px}
.book-card .spacer{flex:1}
.price{font-family:'Chewy';font-size:27px;color:var(--ladybird)}
.price s{color:#b3a787;font-size:18px;margin-right:8px}
.bundle-flag{position:absolute;top:-14px;right:-8px;background:var(--bee);color:var(--ink);font-family:'Chewy';font-size:15px;padding:7px 14px;border-radius:999px;transform:rotate(6deg);box-shadow:2px 3px 0 var(--bee-deep);z-index:4}

/* ---------- book feature rows (books page) ---------- */
.book-feature{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(22px,4vw,52px);align-items:center;background:var(--card);border:2px solid #e8dcbf;border-radius:26px;padding:clamp(24px,4vw,44px);margin-bottom:clamp(26px,4vw,40px);position:relative}
@media(max-width:780px){.book-feature{grid-template-columns:1fr}}
.book-feature.flip .media{order:2}
@media(max-width:780px){.book-feature.flip .media{order:0}}
.book-feature .media img{border-radius:12px;box-shadow:7px 8px 0 rgba(58,50,38,.15);transform:rotate(-2deg);transition:transform .25s ease}
.book-feature .media img:hover{transform:rotate(0)}
/* image carousel (book pages) */
.bookrousel{position:relative;transform:rotate(-2deg);transition:transform .25s ease}
.bookrousel:hover{transform:rotate(0)}
.bookrousel-track{position:relative;aspect-ratio:1/1}
.book-feature .media .bookrousel-track img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:none;box-shadow:7px 8px 0 rgba(58,50,38,.15);transition:opacity .45s ease}
.book-feature .media .bookrousel-track img:hover{transform:none}
.book-feature .media .bookrousel-track img.is-active{opacity:1}
.bookrousel-arrow{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;border:2px solid var(--lilac-border);background:var(--card);color:var(--lilac);font-size:24px;line-height:1;cursor:pointer;z-index:3;display:flex;align-items:center;justify-content:center;padding:0;box-shadow:0 3px 8px rgba(26,45,69,.2);transition:background .2s ease,color .2s ease}
.bookrousel-arrow:hover{background:var(--lilac);color:#fff}
.bookrousel-arrow.prev{left:-14px}
.bookrousel-arrow.next{right:-14px}
.bookrousel-thumbs{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:16px}
.bookrousel-thumb{width:54px;height:54px;padding:0;border:2px solid var(--lilac-border);border-radius:10px;background:none;cursor:pointer;overflow:hidden;opacity:.55;transition:opacity .2s ease,border-color .2s ease,transform .2s ease}
.bookrousel-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.bookrousel-thumb:hover{opacity:1;transform:translateY(-2px)}
.bookrousel-thumb.is-active{opacity:1;border-color:var(--lilac);box-shadow:0 2px 6px rgba(139,95,199,.35)}
.book-feature h2{font-size:clamp(28px,3.5vw,42px);color:var(--leaf-dark);margin-bottom:6px}
.book-feature .meta{font-family:'Patrick Hand';color:var(--soft);font-size:17px;margin-bottom:16px}
.rhyme{font-family:'Patrick Hand';font-size:clamp(18px,2vw,21px);line-height:1.65;color:#56492f;background:var(--paper);border:2px dashed var(--bee);border-radius:16px;padding:18px 22px;margin-bottom:18px;transform:rotate(-.4deg)}
.book-feature .small-note{font-size:14px;color:var(--soft);margin-top:12px;font-family:'Patrick Hand'}
.book-feature .small-note a{color:var(--leaf-dark)}
.buy-meta{font-family:'Patrick Hand';font-size:15px;color:var(--soft);margin-top:10px}
.buy-meta .stars{color:var(--bee-deep);letter-spacing:2px}
.buy-meta a{color:var(--leaf-dark)}
.option-pills{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.option-pills button{font-family:'Patrick Hand';font-size:15px;border:2px solid var(--leaf);border-radius:999px;padding:6px 16px;color:var(--leaf-dark);background:#fff;cursor:pointer;transition:background .15s,color .15s,box-shadow .15s}
.option-pills button:hover{background:var(--paper-deep)}
.option-pills button.active{background:var(--leaf);color:#fff;box-shadow:0 2px 0 var(--leaf-dark)}

/* ---------- character cursors (per-book) ---------- */
.cursor-hive{cursor:-webkit-image-set(url("../img/cursors/bee-32.png") 1x,url("../img/cursors/bee-64.png") 2x) 6 10,url("../img/cursors/bee-32.png") 6 10,auto}
.cursor-earwig{cursor:-webkit-image-set(url("../img/cursors/earwig-32.png") 1x,url("../img/cursors/earwig-64.png") 2x) 6 6,url("../img/cursors/earwig-32.png") 6 6,auto}
.cursor-bundle{cursor:-webkit-image-set(url("../img/cursors/rabbit-32.png") 1x,url("../img/cursors/rabbit-64.png") 2x) 6 6,url("../img/cursors/rabbit-32.png") 6 6,auto}

/* ---------- critters ---------- */
.flybee{position:absolute;width:60px;animation:flutter 9s ease-in-out infinite;z-index:4;pointer-events:none;filter:drop-shadow(0 2px 3px rgba(60,40,10,.18))}
@keyframes flutter{0%,100%{transform:translate(0,0) rotate(8deg)}25%{transform:translate(26px,-20px) rotate(-6deg)}50%{transform:translate(-12px,14px) rotate(10deg)}75%{transform:translate(20px,8px) rotate(-4deg)}}
.critter{position:absolute;pointer-events:none;z-index:3;filter:drop-shadow(0 2px 3px rgba(60,40,10,.18))}
.card-bee{width:48px;top:12px;right:14px;animation:bob 4s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translateY(0) rotate(7deg)}50%{transform:translateY(-10px) rotate(-7deg)}}
.card-earwig{width:72px;bottom:10px;left:14px;animation:pace 12s ease-in-out infinite}
.card-earwig.small{width:56px;animation-duration:9s}
.card-earwig.wide{animation-name:pacewide;animation-duration:22s}
@keyframes pace{0%{transform:translateX(0) scaleX(1)}44%{transform:translateX(140px) scaleX(1)}50%{transform:translateX(140px) scaleX(-1)}94%{transform:translateX(0) scaleX(-1)}100%{transform:translateX(0) scaleX(1)}}
@keyframes pacewide{0%{transform:translateX(0) scaleX(1)}44%{transform:translateX(min(46vw,420px)) scaleX(1)}50%{transform:translateX(min(46vw,420px)) scaleX(-1)}94%{transform:translateX(0) scaleX(-1)}100%{transform:translateX(0) scaleX(1)}}
@media(prefers-reduced-motion:reduce){.flybee,.card-bee,.card-earwig{animation:none}}

/* ---------- quote strip ---------- */
.quotes{background:var(--leaf-dark);color:var(--paper)}
.quotes .inner{max-width:900px;margin:0 auto;padding:clamp(44px,6vw,70px) clamp(16px,5vw,56px);text-align:center}
.quotes blockquote{font-family:'Patrick Hand';font-size:clamp(21px,2.8vw,28px);line-height:1.55}
.quotes cite{display:block;margin-top:16px;font-family:'Nunito';font-weight:700;font-size:15px;font-style:normal;color:var(--bee)}

/* ---------- panels ---------- */
.two-up{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,36px)}
@media(max-width:760px){.two-up{grid-template-columns:1fr}}
.panel{border-radius:26px;padding:clamp(24px,4vw,40px)}
.panel h3{font-size:clamp(25px,3vw,32px);margin-bottom:12px}
.panel p{line-height:1.6;margin-bottom:18px}
.panel.visits{background:var(--sky);color:var(--sky-deep)}
.panel.news{background:var(--bee);color:#4a3408}
.news-form{display:flex;gap:10px;flex-wrap:wrap}
.news-form input{flex:1;min-width:170px;font-family:'Patrick Hand';font-size:18px;padding:12px 16px;border:2px solid #4a3408;border-radius:14px;background:var(--card)}
.news-form button{font-family:'Chewy';font-size:19px;background:#4a3408;color:var(--bee);border:none;padding:12px 24px;border-radius:14px;cursor:pointer}
.form-note{font-family:'Patrick Hand';font-size:15px;margin-top:10px;display:none}

/* ---------- gallery ---------- */
.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;align-items:start}
@media(max-width:760px){.gallery-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.gallery-grid{grid-template-columns:1fr}}
.gallery-grid figure{margin:0;background:var(--card);border:2px solid #e8dcbf;border-radius:16px;padding:10px;transform:rotate(-.6deg);transition:transform .2s ease}
.gallery-grid figure:nth-child(even){transform:rotate(.7deg)}
.gallery-grid figure{cursor:zoom-in}
.gallery-grid figure:hover{transform:rotate(0) scale(1.02);box-shadow:0 12px 26px rgba(58,50,38,.16)}
.gallery-grid figure:focus-visible{outline:3px solid var(--accent,#e8853a);outline-offset:3px;transform:rotate(0)}
.gallery-grid img{border-radius:10px;width:100%}

/* ---------- gallery lightbox ---------- */
.lightbox{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;background:rgba(40,34,22,.93);opacity:0;visibility:hidden;transition:opacity .25s ease}
.lightbox.open{opacity:1;visibility:visible}
.lightbox figure{margin:0;display:flex;flex-direction:column;align-items:center;gap:14px;max-width:92vw}
.lightbox img{max-width:92vw;max-height:80vh;width:auto;height:auto;border-radius:12px;box-shadow:0 18px 50px rgba(0,0,0,.45);background:#fff}
.lightbox figcaption{font-family:'Patrick Hand',cursive;color:#fff;font-size:1.2rem;text-align:center;max-width:80vw}
.lb-btn{position:absolute;top:50%;transform:translateY(-50%);width:54px;height:54px;border:none;border-radius:50%;background:rgba(255,255,255,.15);color:#fff;font-size:2rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s ease}
.lb-btn:hover{background:rgba(255,255,255,.32)}
.lb-prev{left:max(12px,3vw)}
.lb-next{right:max(12px,3vw)}
.lb-close{position:absolute;top:max(12px,3vw);right:max(12px,3vw);width:46px;height:46px;font-size:1.5rem;line-height:1;border:none;border-radius:50%;background:rgba(255,255,255,.15);color:#fff;cursor:pointer;transition:background .2s ease}
.lb-close:hover{background:rgba(255,255,255,.32)}
.lb-count{position:absolute;bottom:max(14px,3vh);left:50%;transform:translateX(-50%);color:rgba(255,255,255,.82);font-family:'Nunito',sans-serif;font-size:.9rem;letter-spacing:.03em}
@media(max-width:600px){.lb-btn{width:44px;height:44px;font-size:1.6rem}.lb-close{width:42px;height:42px}}

/* ---------- resources ---------- */
.res-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:18px}
.res-card{background:var(--card);border:2px solid #e8dcbf;border-radius:18px;padding:14px;text-align:center;transition:transform .2s ease}
.res-card:hover{transform:translateY(-5px) rotate(-.6deg);box-shadow:0 10px 22px rgba(58,50,38,.14)}
.res-card img{border-radius:10px;aspect-ratio:1;object-fit:cover;margin-bottom:12px;border:1px solid #eee5cd}
.res-card .kind{font-family:'Nunito';font-weight:900;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ladybird)}
.res-card h3{font-family:'Patrick Hand';font-size:18px;font-weight:400;margin:4px 0 12px;color:var(--ink)}
.res-card a.dl{font-family:'Chewy';font-size:16px;background:var(--leaf);color:#fff;padding:8px 20px;border-radius:12px 16px 10px 18px;text-decoration:none;display:inline-block;box-shadow:0 3px 0 var(--leaf-dark)}
.res-card a.dl:hover{transform:rotate(-2deg)}

/* ---------- review / testimonial cards ---------- */
.review-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:20px}
.review{background:var(--lilac-light);border:2px solid var(--lilac-border);border-radius:18px;padding:24px;position:relative}
.review:nth-child(even){transform:none}
.review .stars{color:var(--bee-deep);letter-spacing:3px;margin-bottom:10px;font-size:18px}
.review p{font-size:16px;line-height:1.65;color:#56492f}
.review cite{display:block;margin-top:14px;font-style:normal;font-family:'Patrick Hand';font-size:16px;color:var(--soft)}
.review cite a{color:var(--leaf-dark)}
.review.school{border-color:var(--sky)}
.review.school::before{content:"🏫";position:absolute;top:-14px;left:18px;font-size:22px;background:var(--paper);padding:0 6px}

/* ---------- blog ---------- */
.post-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:clamp(20px,3vw,32px);max-width:900px;margin:0 auto}
.post-card{background:var(--card);border:2px solid #e8dcbf;border-radius:22px;overflow:hidden;text-decoration:none;color:var(--ink);transition:transform .2s ease,box-shadow .2s}
.post-card:hover{transform:translateY(-6px);box-shadow:0 14px 30px rgba(58,50,38,.14)}
.post-card img{aspect-ratio:16/10;object-fit:cover;width:100%}
.post-card .pad{padding:20px 24px 26px}
.post-card .date{font-family:'Patrick Hand';font-size:15px;color:var(--soft)}
.post-card h2{font-size:26px;color:var(--leaf-dark);margin:6px 0 8px}
.post-card p{font-size:15.5px;line-height:1.6}
.post{max-width:680px;margin:0 auto}
.post .date{font-family:'Patrick Hand';color:var(--soft);font-size:17px}
.post h1{font-size:clamp(34px,5vw,52px);color:var(--leaf-dark);margin:8px 0 22px}
.post img.lead{border-radius:18px;border:2px solid #e8dcbf;margin-bottom:26px}
.post p,.post li{font-size:17.5px;line-height:1.75;margin-bottom:16px}
.post ul{margin:0 0 16px 24px}
.post a{color:var(--leaf-dark);font-weight:700}
.post .back{font-family:'Patrick Hand';font-size:17px;text-decoration:none}

/* ---------- contact ---------- */
.contact-form{max-width:560px;margin:0 auto;display:grid;gap:14px}
.contact-form label{font-family:'Patrick Hand';font-size:18px}
.contact-form input,.contact-form textarea{font-family:'Nunito';font-size:16px;padding:13px 16px;border:2px solid #d8cba6;border-radius:14px;background:var(--card);width:100%}
.contact-form input:focus,.contact-form textarea:focus{outline:2px solid var(--bee)}

/* ---------- info box ---------- */
.info-box{max-width:680px;margin:0 auto;background:var(--card);border:2px dashed var(--sky);border-radius:20px;padding:26px 30px;font-size:16.5px;line-height:1.7}
.info-box h3{color:var(--sky-deep);font-size:24px;margin-bottom:8px}
.info-box a{color:var(--leaf-dark);font-weight:700}

/* ---------- footer ---------- */
footer{background:var(--paper-deep);border-top:2px dashed #d8cba6;margin-top:clamp(40px,6vw,70px)}
footer .inner{max-width:1150px;margin:0 auto;padding:36px clamp(16px,5vw,56px) 46px;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;align-items:center}
footer .fbrand{font-family:'Chewy';font-size:22px;color:var(--leaf-dark)}
footer .fbrand span{color:var(--ladybird)}
footer p{font-family:'Patrick Hand';font-size:16px;color:var(--soft)}
footer .flinks{display:flex;gap:18px;flex-wrap:wrap;font-family:'Patrick Hand';font-size:17px}
footer .flinks a{color:var(--leaf-dark);text-decoration:none;display:inline-flex;align-items:center;gap:6px}
footer .flinks .sicon{width:1em;height:1em}
footer .flinks a:hover{color:var(--ladybird)}

/* ---------- basket / cart drawer ---------- */
nav.top ul{margin-left:auto}
.cart-toggle{position:relative;appearance:none;background:none;border:none;cursor:pointer;width:44px;height:44px;padding:8px;border-radius:12px;color:var(--leaf-dark);display:inline-flex;align-items:center;justify-content:center}
.cart-toggle:hover{background:rgba(46,114,184,.1)}
.cart-toggle svg{width:26px;height:26px}
.cart-count{position:absolute;top:1px;right:0;min-width:18px;height:18px;padding:0 4px;border-radius:9px;background:var(--ladybird);color:#fff;font-family:'Nunito',sans-serif;font-weight:900;font-size:11px;line-height:18px;text-align:center}
.cart-count[hidden]{display:none}

.cart-scrim{position:fixed;inset:0;background:rgba(26,45,69,.45);z-index:60;opacity:0;transition:opacity .28s ease}
.cart-scrim.is-open{opacity:1}
.cart-drawer{position:fixed;top:0;right:0;height:100dvh;width:min(92vw,400px);background:var(--card);z-index:61;display:flex;flex-direction:column;box-shadow:-10px 0 30px rgba(26,45,69,.22);border-left:3px solid var(--bee);transform:translateX(100%);transition:transform .28s ease}
.cart-drawer.is-open{transform:translateX(0)}
.cart-head{display:flex;align-items:center;justify-content:space-between;padding:20px 22px;border-bottom:2px dashed #e8dcbf}
.cart-head h2{font-size:26px;color:var(--leaf-dark)}
.cart-close{appearance:none;background:none;border:none;font-size:30px;line-height:1;color:var(--soft);cursor:pointer;width:40px;height:40px;border-radius:10px}
.cart-close:hover{background:var(--paper-deep);color:var(--ink)}
.cart-body{flex:1;overflow-y:auto;padding:14px 22px}
.cart-empty{text-align:center;font-family:'Patrick Hand',cursive;font-size:20px;color:var(--soft);padding:48px 12px;line-height:1.5}
.cart-empty span{font-size:16px}
.cart-item{display:grid;grid-template-columns:54px 1fr auto auto;gap:12px;align-items:center;padding:14px 0;border-bottom:1px solid #efe6cf}
.cart-item img{width:54px;height:54px;object-fit:cover;border-radius:10px;border:2px solid #e8dcbf}
.cart-item-title{font-weight:800;font-size:15px;line-height:1.2}
.cart-item-variant{font-size:13px;color:var(--soft)}
.cart-item-price{font-weight:900;color:var(--leaf-dark);font-size:14px;margin-top:2px}
.cart-qty{display:flex;align-items:center;gap:8px}
.cart-qty button{width:26px;height:26px;border-radius:8px;border:2px solid var(--lilac-border);background:var(--lilac-light);color:var(--lilac);font-weight:900;cursor:pointer;line-height:1}
.cart-qty button:hover{background:var(--lilac);color:#fff}
.cart-qty span{min-width:18px;text-align:center;font-weight:800}
.cart-remove{appearance:none;background:none;border:none;font-size:20px;color:#c9b89a;cursor:pointer;line-height:1}
.cart-remove:hover{color:var(--ladybird)}
.cart-foot{padding:18px 22px;border-top:2px dashed #e8dcbf;background:var(--paper)}
.cart-subtotal{display:flex;justify-content:space-between;align-items:baseline;font-family:'Chewy',cursive;font-size:20px;color:var(--ink);margin-bottom:6px}
.cart-total{color:var(--leaf-dark)}
.cart-note{font-family:'Patrick Hand',cursive;font-size:13px;color:var(--soft);margin-bottom:12px}
.cart-checkout{width:100%;text-align:center;border:none}
.cart-checkout:disabled{opacity:.45;cursor:not-allowed;transform:none}
.cart-continue{display:block;width:100%;margin-top:10px;background:none;border:none;font-family:'Patrick Hand',cursive;font-size:16px;color:var(--leaf-dark);cursor:pointer;text-decoration:underline}
.cart-clear{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:12px;padding:11px;background:none;border:2px dashed var(--lilac-border);border-radius:12px;font-family:'Patrick Hand',cursive;font-size:17px;color:var(--soft);cursor:pointer;transition:color .2s ease,border-color .2s ease,background .2s ease}
.cart-clear svg{width:18px;height:18px}
.cart-clear:hover{color:var(--ladybird);border-color:var(--ladybird);background:#fff6ef}
.cart-clear[hidden]{display:none}
.cart-clear-confirm{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:12px;padding:11px;border:2px dashed var(--ladybird);border-radius:12px;background:#fff6ef;font-family:'Patrick Hand',cursive;font-size:16px;color:var(--ink)}
.cart-clear-confirm[hidden]{display:none}
.cart-clear-confirm button{font-family:'Patrick Hand',cursive;font-size:15px;padding:6px 14px;border-radius:999px;cursor:pointer}
.cart-clear-yes{background:var(--ladybird);color:#fff;border:none}
.cart-clear-no{background:#fff;color:var(--leaf-dark);border:2px solid var(--leaf)}
.cart-postco{font-family:'Patrick Hand',cursive;font-size:15px;color:#56492f;background:var(--lilac-light);border:2px dashed var(--lilac-border);border-radius:12px;padding:12px 14px;margin:10px 0 4px;line-height:1.5}
.cart-postco button{font-family:'Patrick Hand',cursive;font-size:15px;background:none;border:none;color:var(--leaf-dark);text-decoration:underline;cursor:pointer;padding:0}
.cart-postco button:hover{color:var(--ladybird)}