/* Bedtime By Name – brand: Midnight Navy #1F2A4A, Moon Gold #F2C14E, Lavender Dusk #B8A9D9, Cream Pillow #FFF6E5, Soft Rose #E8A0A8
   Fonts: Fraunces (headings), Nunito (UI/body), Lora (story text). TODO before launch: self-host the font files
   in /public/fonts to avoid sending visitor IPs to Google Fonts (otherwise list Google Fonts in the privacy policy). */
@import url("https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,600;9..144,700&family=Lora:wght@400;600&family=Nunito:wght@400;700&display=swap");
:root{--navy:#1F2A4A;--gold:#F2C14E;--lav:#B8A9D9;--cream:#FFF6E5;--rose:#E8A0A8}
*{box-sizing:border-box}
body{margin:0;background:var(--cream);color:var(--navy);font:1.05rem/1.6 Nunito,system-ui,sans-serif}
h1,h2,h3{font-family:Fraunces,Georgia,serif;line-height:1.2}
a{color:var(--navy)}
.top{background:var(--navy);padding:14px 20px}.brand{color:var(--gold);font:700 1.3rem Fraunces,Georgia,serif;text-decoration:none}
.wrap{max-width:760px;margin:auto;padding:20px}
.hero{background:linear-gradient(180deg,var(--navy),#2c3a63);color:var(--cream);text-align:center;padding:60px 20px 70px}
.hero h1{font-size:2.5rem;margin:0 0 10px;color:var(--cream)}.hero p{font-size:1.2rem;color:var(--lav)}
.btn,button.primary,.cta{display:inline-block;background:var(--gold);color:var(--navy);font:700 1.1rem Nunito,sans-serif;padding:14px 26px;border-radius:999px;border:0;text-decoration:none;cursor:pointer}
button{font:inherit;padding:10px 16px;border-radius:10px;border:1px solid var(--lav);background:#fff;color:var(--navy);cursor:pointer}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}
.card{background:#fff;border-radius:18px;padding:20px 22px;box-shadow:0 2px 10px rgba(31,42,74,.08);margin:16px 0}
.price{text-align:center}.price .amt{font:700 2.4rem Fraunces,serif}
.sample{font-family:Lora,Georgia,serif;background:#fff;border-left:5px solid var(--lav);padding:16px 22px;border-radius:12px}
.label{font-size:.85rem;background:var(--rose);color:var(--navy);padding:2px 10px;border-radius:999px}
details{background:#fff;border-radius:12px;padding:12px 16px;margin:8px 0}summary{font-weight:700;cursor:pointer}
form label{display:block;margin:10px 0}
input[type=text],input[type=tel],input[type=email],input[type=time],select,textarea,form input:not([type]){width:100%;padding:11px;border-radius:10px;border:1px solid var(--lav);font:inherit;background:#fff}
fieldset{border:1px solid var(--lav);border-radius:14px;margin:16px 0;padding:12px 16px}legend{font:700 1.1rem Fraunces,serif;padding:0 6px}
.chip{display:inline-block;margin:4px;padding:6px 12px;border-radius:999px;background:var(--cream);border:1px solid var(--lav)}
.check{display:flex;gap:10px;align-items:flex-start}.check input{margin-top:6px;transform:scale(1.3)}
.note{font-size:.95rem;background:var(--cream);padding:10px 14px;border-radius:10px}
.draft{background:var(--rose);padding:12px 16px;border-radius:12px;font-weight:700}
.ph{background:#fde7a6;padding:0 4px;border-radius:4px}
.foot{text-align:center;padding:30px;font-size:.9rem;color:#56607d}
/* read-aloud story page: dark by default, big comfy text */
body.reading{background:var(--navy);color:var(--cream)}body.reading .foot a{color:var(--lav)}
body.reading.light{background:var(--cream);color:var(--navy)}
.story{font:1.45rem/1.8 Lora,Georgia,serif;max-width:680px;margin:auto}body.big .story{font-size:1.8rem}
.story h1{color:var(--gold);font-size:2.1rem}body.light .story h1{color:var(--navy)}
.banner{font:.9rem Nunito,sans-serif;background:var(--lav);color:var(--navy);padding:8px 12px;border-radius:8px}
.story-actions{max-width:680px;margin:30px auto;display:flex;flex-wrap:wrap;gap:10px;align-items:flex-start}
.story-actions .report{color:var(--navy)}
