.svg-sprite{position:absolute;width:0;height:0;overflow:hidden}.page-atmosphere{position:fixed;inset:0;z-index:-2;background:linear-gradient(rgba(3,21,39,.8),rgba(4,28,48,.9)),url('assets/illustrations/app-forest.webp') center/cover no-repeat;filter:saturate(.85)}.page-atmosphere:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 30% 26%,rgba(54,123,166,.24),transparent 35%),linear-gradient(to bottom,transparent 35%,rgba(3,20,36,.65) 100%)}
svg{display:block;width:1.25em;height:1.25em;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.button svg,.play-small svg,.phone-screen button svg{fill:currentColor;stroke:none}

.site-header{height:112px;display:grid;grid-template-columns:auto 1fr auto auto;gap:clamp(18px,1.8vw,28px);align-items:center;position:absolute;z-index:20;left:50%;transform:translateX(-50%);top:0}.nav{display:flex;justify-content:center;gap:clamp(24px,3vw,46px);font-size:var(--font-nav);font-weight:700}.nav a{position:relative;text-shadow:0 2px 10px rgba(0,0,0,.6)}.nav a:after{content:"";position:absolute;left:0;right:100%;bottom:-8px;height:1px;background:var(--gold);transition:.25s}.nav a:hover:after{right:0}.icon-button{border:0;background:transparent;padding:9px}.icon-button svg{width:var(--icon-sm);height:var(--icon-sm)}.button-gold{color:#102b49;background:linear-gradient(180deg,#ffe395,#f1b941);box-shadow:0 12px 30px rgba(242,184,63,.32),inset 0 1px rgba(255,255,255,.75)}.button-outline{border:1.5px solid rgba(255,255,255,.9);box-shadow:inset 0 0 0 3px rgba(255,255,255,.04);background:rgba(4,30,56,.2);backdrop-filter:blur(7px)}.header-cta{min-height:calc(var(--button-height) - .25rem);padding-inline:var(--button-padding-x)}.menu-button{display:none}
.search-panel{position:fixed;z-index:50;top:18px;left:50%;transform:translate(-50%,-160%);width:min(640px,calc(100% - 32px));padding:22px 24px;border-radius:20px;background:rgba(255,248,233,.97);color:var(--ink);box-shadow:0 24px 60px rgba(0,0,0,.4);transition:transform .25s}.search-panel.open{transform:translate(-50%,0)}.search-panel label{font:700 18px var(--serif)}.search-panel>div{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;margin-top:12px;background:#fff;border:1px solid #e7d9c2;border-radius:12px;padding:10px 12px}.search-panel input{border:0;outline:0;background:transparent;color:var(--ink);font-size:16px}.search-panel button{border:0;background:none}.search-panel svg{width:20px;height:20px}

.hero{height:700px;position:relative;overflow:hidden;background:#082c50}.hero-scene{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:var(--hero-art-x) center}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,25,48,.94) 0%,rgba(4,27,50,.84) 25%,rgba(5,29,52,.22) 53%,rgba(3,20,38,.04) 76%),linear-gradient(180deg,rgba(1,13,26,.25),transparent 24%,rgba(3,23,43,.1) 75%,rgba(3,23,43,.92));box-shadow:inset 0 -30px 80px rgba(3,22,39,.85)}.hero-copy{position:relative;z-index:3;padding-top:182px}.hero h1{font:700 clamp(58px,5vw,82px)/.98 var(--serif);letter-spacing:-3px;color:#ffe5aa;margin:0 0 18px;text-shadow:0 5px 28px rgba(0,0,0,.45)}.hero-lead{font:600 clamp(23px,2vw,31px)/1.25 var(--serif);margin:0 0 17px;text-shadow:0 3px 18px rgba(0,0,0,.65)}.hero-text{font-size:18px;line-height:1.58;color:#e0ebf2;margin:0 0 28px;text-shadow:0 2px 12px rgba(0,0,0,.72)}.hero-actions{display:flex;gap:15px}.trust-row{display:flex;gap:43px;margin-top:38px}.trust-row span{display:flex;align-items:center;gap:11px;font-size:13px;line-height:1.45}.trust-row i{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:rgba(29,77,116,.66);box-shadow:0 0 20px rgba(106,172,207,.22),inset 0 0 0 1px rgba(255,255,255,.1);color:#ffe7ab;font-style:normal}.trust-row svg{width:23px;height:23px}.moon-note,.hero-note{position:absolute;z-index:4;font:600 28px/1.05 var(--hand);margin:0}.moon-note{top:59px;left:78.2%;width:220px;color:#17324d;text-align:center;font-size:31px;line-height:.92;transform:translateX(-50%) rotate(-6deg);text-shadow:0 1px rgba(255,255,255,.3)}.moon-note span{white-space:nowrap}.hero-note{right:2.5%;bottom:27px;color:#ffe8b0;text-align:left;font-size:27px;line-height:1.08;transform:rotate(-6deg);text-shadow:0 2px 12px rgba(0,0,0,.8)}

.light-panel{background:linear-gradient(135deg,rgba(255,251,242,.99),rgba(245,235,218,.98));color:var(--ink);border:1px solid rgba(255,255,255,.85);box-shadow:var(--paper-shadow)}.finder{position:relative;z-index:8;margin-top:-28px;border-radius:24px;padding:24px 38px 30px}.section-heading{display:flex;justify-content:space-between;align-items:flex-start}.section-heading h2,.title-row h2,.benefits h2{font:700 35px/1.1 var(--serif);letter-spacing:-1.2px;margin:0}.section-heading p{font:600 17px/1.02 var(--hand);color:#a28b73;text-align:right;transform:rotate(-4deg);margin:-3px 4px 0 0}.finder-grid{display:grid;grid-template-columns:1.02fr 1.45fr 1fr;gap:30px;margin-top:9px}.filter-group h3{font:700 15px var(--serif);margin:0 0 10px}.chips{display:flex;flex-wrap:wrap;gap:9px}.chip{min-height:43px;display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(33,62,78,.05);border-radius:12px;padding:8px 13px;background:rgba(255,255,255,.84);color:#243b4e;font-size:12px;font-weight:800;box-shadow:0 6px 14px rgba(59,42,23,.07),inset 0 1px rgba(255,255,255,.8);transition:.18s}.chip:hover,.chip.active{transform:translateY(-2px);box-shadow:0 9px 18px rgba(40,54,66,.13),0 0 0 2px rgba(72,126,160,.14)}.age-chips{flex-wrap:nowrap}.age-chips .chip{min-height:74px;min-width:96px;flex-direction:column;justify-content:center;padding:7px}.age-pink{background:#ffe8e7}.age-mint{background:#e0f0e6}.age-blue{background:#e3e7fa}.age-icon{width:31px;height:31px;border-radius:50%;display:grid;place-items:center;color:#a6555f;background:rgba(255,255,255,.42)}.age-mint .age-icon{color:#39755b}.age-blue .age-icon{color:#485998}.age-icon svg{width:22px;height:22px}.flag{display:inline-block;width:22px;height:15px;border-radius:50%;box-shadow:0 0 0 1px rgba(8,35,59,.12);position:relative;overflow:hidden;vertical-align:-2px;flex:none}.flag-ua{background:linear-gradient(#2681cf 0 50%,#ffd646 50%)}.flag-jp{background:radial-gradient(circle,#d84a56 0 28%,transparent 30%),#fff}.flag-cn{background:#dc3340}.flag-cn:after{content:"★";font-size:8px;color:#ffd856;position:absolute;left:4px;top:1px}.flag-in{background:linear-gradient(#f3a23b 0 33%,#fff 33% 66%,#3a9b5b 66%)}.flag-in:after{content:"";position:absolute;width:3px;height:3px;border:1px solid #466da1;border-radius:50%;left:9px;top:5px}.flag-fr{background:linear-gradient(90deg,#2e55a2 0 33%,#fff 33% 66%,#df4652 66%)}.flag-se{background:linear-gradient(90deg,transparent 0 30%,#f3d74f 30% 43%,transparent 43%),linear-gradient(transparent 0 42%,#f3d74f 42% 58%,transparent 58%),#4385b4}.mood-icon{width:24px;height:24px;border-radius:50%;display:grid;place-items:center}.mood-icon svg{width:18px;height:18px}.mood-icon.moon{color:#6a62d2;background:#eceaff}.mood-icon.paw{color:#b56d32;background:#f8eadc}.mood-icon.star{color:#e6a526;background:#fff3cd}.mood-icon.leaf{color:#35805c;background:#e6f4eb}

.stories{padding:27px 0 24px}.title-row{display:flex;align-items:flex-end;justify-content:space-between;padding:0 4px}.title-row>div{display:flex;align-items:flex-end;gap:20px}.title-row p{color:#cdddea;margin:0 0 4px;font-size:13px}.title-row a{font-size:12px;text-decoration:underline;text-underline-offset:4px}.story-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;margin-top:18px}.story-card{overflow:hidden;border-radius:15px;background:#fff7e7;color:var(--ink);box-shadow:0 18px 32px rgba(0,13,31,.3),0 0 0 1px rgba(255,232,185,.55);cursor:pointer;transition:transform .22s,box-shadow .22s}.story-card:hover,.story-card:focus-visible{transform:translateY(-7px);box-shadow:0 22px 40px rgba(0,13,31,.43),0 0 24px rgba(255,218,135,.2);outline:none}.story-card.filtered-out{display:none}.story-card>img,.story-card-link>img{display:block;width:100%;height:232px;object-fit:cover}.card-body{position:relative;padding:14px 15px 13px;min-height:128px}.card-body h3{font:700 17px/1.15 var(--serif);margin:0 42px 9px 0;min-height:39px}.card-body p{display:flex;align-items:center;gap:8px;font-size:11px;margin:0 0 15px;font-weight:700}.card-body small{display:flex;gap:17px;color:#66727a;font-size:10px}.card-body small span{display:flex;gap:5px;align-items:center}.card-body small svg{width:14px;height:14px}.play-small{position:absolute;right:13px;top:14px;width:39px;height:39px;border:0;border-radius:50%;display:grid;place-items:center;background:#17487f;color:#fff;box-shadow:0 7px 15px rgba(12,50,88,.25)}.play-small svg{width:16px;height:16px;margin-left:2px}.empty-state{text-align:center;padding:35px;background:rgba(255,255,255,.08);border-radius:18px}

.player{min-height:164px;border-radius:22px;margin-top:0;padding:19px 26px;display:grid;grid-template-columns:1.27fr 1.04fr 1fr;gap:32px;align-items:center}.now-playing{display:flex;gap:20px;align-items:center}.now-playing>img{width:112px;height:112px;border-radius:13px;object-fit:cover;box-shadow:0 9px 20px rgba(18,33,47,.2)}.now-playing>div>span{display:inline-block;background:#fff;border-radius:999px;padding:6px 18px;font:700 13px var(--serif);margin-bottom:11px;box-shadow:0 4px 10px rgba(25,45,58,.07)}.now-playing h3{font:700 16px/1.2 var(--serif);margin:0 0 10px}.now-playing p{display:flex;align-items:center;gap:7px;font-size:10px;margin:0}.now-playing p i{width:3px;height:3px;border-radius:50%;background:#73808b}.control-buttons{display:flex;align-items:center;justify-content:center;gap:18px}.control-buttons button,.player-tools button{border:0;background:none;color:#0e3a6e;padding:6px}.control-buttons svg{width:22px;height:22px}.control-buttons .main-play{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:#123f75;color:#fff;box-shadow:0 8px 20px rgba(12,53,95,.25)}.control-buttons .main-play svg{width:25px;height:25px}.progress{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;margin-top:9px;font-size:9px}.progress input,.volume input{accent-color:#174878;width:100%}.player-side{align-self:stretch;display:grid;grid-template-rows:auto 1fr auto}.player-side p{font:600 20px/1.05 var(--hand);color:#a4876f;text-align:center;transform:rotate(-3deg);margin:4px 0}.player-tools{display:flex;justify-content:flex-end;gap:8px}.player-tools svg{width:21px;height:21px}.volume{display:flex;align-items:center;gap:10px;max-width:185px;margin-left:auto}.volume svg{width:20px;height:20px;color:#113e70}

.benefits{padding:27px 0 32px}.benefit-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:23px;margin-top:18px}.benefit-grid article{display:grid;grid-template-columns:52px 1fr;gap:12px}.benefit-grid i{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 35% 30%,rgba(95,151,197,.7),rgba(25,70,112,.7));color:#ffe7ac;font-style:normal;box-shadow:0 0 24px rgba(99,169,212,.26),inset 0 0 0 1px rgba(255,255,255,.1)}.benefit-grid svg{width:25px;height:25px}.benefit-grid h3{font:700 14px/1.2 var(--serif);margin:4px 0 7px}.benefit-grid p{font-size:10px;line-height:1.5;color:#d1dfea;margin:0}

.app-banner{height:380px;border:1px solid rgba(226,205,157,.63);border-radius:28px;position:relative;overflow:hidden;box-shadow:0 24px 60px rgba(0,10,27,.35),0 0 40px rgba(44,115,155,.15)}.app-forest{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}.app-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,29,52,.93) 0%,rgba(4,32,57,.72) 39%,rgba(4,28,51,.12) 70%,rgba(4,28,51,.05)),linear-gradient(0deg,rgba(2,22,39,.38),transparent 60%)}.app-copy{position:relative;z-index:3;width:45%;padding:42px 0 0 52px}.app-copy>span{font:700 35px var(--serif);color:#ffe0a0}.app-copy h2{font:600 25px var(--serif);margin:4px 0 13px}.app-copy p{font-size:14px;line-height:1.6;color:#dce8f0;max-width:530px;margin:0}.store-row{display:flex;gap:12px;margin-top:23px}.store-row button{min-width:150px;height:51px;display:flex;align-items:center;gap:10px;border:1px solid #777;border-radius:8px;background:#030303;color:#fff;padding:6px 13px}.store-row svg{width:26px;height:26px;fill:#fff;stroke:none}.store-row span{font-weight:700;text-align:left;line-height:1}.store-row small{display:block;font-size:8px;margin-bottom:4px;font-weight:600}.phone{position:absolute;z-index:4;width:194px;height:373px;left:53%;bottom:-35px;border:8px solid #e9d9bd;border-radius:34px;background:#06162a;box-shadow:0 24px 45px rgba(0,0,0,.55);transform:rotate(5deg)}.phone-speaker{position:absolute;z-index:2;width:65px;height:12px;border-radius:0 0 9px 9px;top:-2px;left:57px;background:#0d1117}.phone-screen{height:100%;border-radius:25px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:linear-gradient(rgba(5,32,59,.38),rgba(5,32,59,.72)),url('assets/illustrations/hero-forest.webp') 65% center/auto 100%}.phone-screen p{font-size:10px;font-weight:700}.phone-screen button{width:51px;height:51px;border:0;border-radius:50%;display:grid;place-items:center;background:var(--gold);color:var(--ink);box-shadow:0 0 20px rgba(255,201,87,.45)}.phone-screen button svg{margin-left:3px}.app-note{position:absolute;z-index:3;right:5.5%;top:59px;width:285px;background:#efe1c7;color:#6c5a4d;padding:24px 28px;box-shadow:0 15px 30px rgba(0,0,0,.28);transform:rotate(-6deg);font:600 23px/1.05 var(--hand)}.app-note:before{content:"";position:absolute;width:34px;height:54px;border:4px solid #8d98a4;border-bottom:0;border-radius:18px 18px 0 0;top:-28px;left:48px;transform:rotate(8deg)}

.footer{margin-top:0;background:linear-gradient(rgba(3,22,40,.86),rgba(2,17,31,.95)),url('assets/illustrations/app-forest.webp') center bottom/cover;border-top:1px solid rgba(255,229,171,.18)}.footer-grid{min-height:126px;display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:35px}.footer nav{display:flex;justify-content:center;gap:25px;font-size:10px}.footer nav a:hover{color:var(--gold-light)}.socials{display:flex;gap:20px;align-items:center;font-weight:800;font-size:17px}.socials a{width:24px;height:24px;display:grid;place-items:center}.footer>div>p{font-size:9px;line-height:1.6;text-align:right;color:#dae5ec}.footer p .flag{width:18px;height:12px;margin-left:3px}

/* Homepage integration with the reusable Bembi design system */
.hero h1{font-size:var(--font-display)}
.hero-text{font-size:var(--font-body-lg);max-width:var(--content-width)}
.trust-row span{font-size:var(--font-small)}
.moon-note{left:76.6%}
.section-heading h2,.title-row h2,.benefits h2{font-size:var(--font-h2)}
.section-heading p{font-size:var(--font-note)}
.finder{border-radius:var(--radius-panel);padding:clamp(24px,1.5vw,30px) clamp(24px,2.4vw,38px)}
.finder-grid{gap:clamp(22px,2vw,32px)}
.filter-group h3{font-size:var(--font-h3)}
.chips{gap:clamp(8px,.65vw,11px)}
.chip{min-height:46px;padding:9px 14px;border-radius:calc(var(--radius-card) - .25rem);font-size:var(--font-small)}
.age-chips .chip{min-height:78px;min-width:102px}
.stories{padding-block:var(--section-space)}
.title-row p{font-size:var(--font-body)}
.title-row a{font-size:var(--font-small)}
.story-grid{gap:var(--card-gap)}
.story-card{border-radius:var(--radius-card);box-shadow:var(--shadow-card)}
.card-body{padding:16px;min-height:146px}
.card-body h3{font-size:var(--font-h3);min-height:42px}
.card-body p{font-size:var(--font-small);margin-bottom:16px}
.card-body small{font-size:var(--font-caption);gap:clamp(10px,1vw,17px)}
.player{min-height:180px;border-radius:var(--radius-panel);padding:clamp(20px,1.5vw,26px);gap:clamp(24px,2vw,34px)}
.now-playing>div>span{font-size:var(--font-small)}
.now-playing h3{font-size:var(--font-h3)}
.now-playing p,.progress{font-size:var(--font-caption)}
.player-side p{font-size:var(--font-note)}
.benefits{padding-block:var(--section-space)}
.benefit-grid{gap:var(--card-gap);margin-top:clamp(18px,1.5vw,24px)}
.benefit-grid h3{font-size:var(--font-h3)}
.benefit-grid p{font-size:var(--font-small);line-height:1.5}
.app-banner{border-radius:var(--radius-panel);box-shadow:var(--shadow-panel)}
.app-copy>span{font-size:clamp(2rem,1.75rem + .75vw,2.625rem)}
.app-copy h2{font-size:clamp(1.375rem,1.2rem + .5vw,1.75rem)}
.app-copy p{font-size:var(--font-body);max-width:var(--content-width)}
.store-row button{min-width:164px;height:56px;padding:7px 14px}
.store-row small{font-size:var(--font-caption)}
.phone-screen p{font-size:var(--font-caption)}
.app-note{font-size:var(--font-note)}
.footer-grid{min-height:clamp(140px,9vw,164px);gap:clamp(22px,2.2vw,36px)}
.footer nav{gap:clamp(16px,1.6vw,25px);font-size:var(--font-nav)}
.footer>div>p{font-size:var(--font-caption);line-height:1.55}
.socials{font-size:clamp(1.125rem,1rem + .25vw,1.375rem)}
.hero-note{top:300px;right:1.6%;bottom:auto;width:172px}
.phone-screen{position:relative}
.brand--phone{--brand-fawn-size:2.55rem;--brand-wordmark-size:1.2rem;position:absolute;top:1.45rem;left:1rem;flex-direction:row;align-items:center;gap:.15rem;min-width:0;text-align:left}

/*
 * The overlay plane matches the full 1983 × 793 artwork, including the part
 * cropped by object-fit: cover. The image and overlay share the same focus.
 * Each title is anchored to its own leather spine in source-image coordinates.
 */
.hero {
  --hero-art-x: 56%;
  container-type: size;
}
.hero-art {
  position: absolute;
  z-index: 4;
  width: max(100cqw, calc(100cqh * 1983 / 793));
  aspect-ratio: 1983 / 793;
  left: var(--hero-art-x);
  top: 50%;
  transform: translate(calc(-1 * var(--hero-art-x)), -50%);
  container-type: inline-size;
  pointer-events: none;
}
.book-label {
  position: absolute;
  display: grid;
  place-items: center;
  width: 9%;
  height: 3.6%;
  margin: 0;
  color: #c9aa67;
  font: 600 .85cqw/1 var(--serif);
  letter-spacing: .1em;
  white-space: nowrap;
  transform-origin: center;
  text-shadow: 0 .035em .06em rgba(25, 17, 13, .8),
               0 -.025em .035em rgba(255, 238, 181, .25);
  opacity: .85;
}
.book-label.kindness {
  left: 69.0872%; /* 1370 / 1983 */
  top: 69.6091%;  /* 552 / 793 */
  transform: translate(-50%, -50%) rotate(4.4deg) skewX(-9deg) scale(.96, .88);
}
.book-label.imagination {
  left: 67.4735%; /* 1338 / 1983 */
  top: 77.932%;   /* 618 / 793 */
  transform: translate(-50%, -50%) rotate(5.7deg) skewX(-7deg) scale(.96, .9);
}
.book-label.dreams {
  left: 66.3641%; /* 1316 / 1983 */
  top: 87.1375%;  /* 691 / 793 */
  transform: translate(-50%, -50%) rotate(6.4deg) skewX(-10deg) scale(.94, .87);
}

.reveal{opacity:1;transform:none}
@media(max-width:1200px){.shell{width:min(1100px,calc(100% - 42px))}.nav{gap:25px}.hero{height:650px}.hero-copy{padding-top:165px}.hero h1{font-size:60px}.moon-note{left:78%;top:62px;font-size:28px}.hero-note{display:none}.finder-grid{grid-template-columns:1fr 1.35fr}.filter-group:last-child{grid-column:1/-1}.story-card>img,.story-card-link>img{height:195px}.card-body h3{font-size:15px}.player{grid-template-columns:1.25fr 1fr}.player-side{display:none}.benefit-grid{gap:13px}.benefit-grid article{grid-template-columns:45px 1fr}.benefit-grid i{width:45px;height:45px}.app-note{right:3%;width:245px}}
@media(max-width:900px){.shell{width:min(100% - 32px,760px)}.site-header{height:88px;grid-template-columns:auto 1fr auto}.header-fawn{width:58px;height:65px}.header-fawn img{width:65px;height:65px}.header-brand .brand-copy strong{font-size:33px}.header-brand .brand-copy small{font-size:10px}.brand-copy strong{font-size:35px}.brand-mark{width:42px;height:48px}.brand-mark svg{width:46px;height:46px}.brand-copy small{font-size:9px}.nav{position:absolute;top:78px;left:0;right:0;display:none;flex-direction:column;gap:0;padding:12px;border-radius:18px;background:rgba(7,35,62,.97);box-shadow:0 20px 40px rgba(0,0,0,.35)}.nav.open{display:flex}.nav a{padding:13px 16px}.header-cta,.search-button{display:none}.menu-button{display:block;justify-self:end}.hero{height:720px}.hero{--hero-art-x:62%}.hero-shade{background:linear-gradient(90deg,rgba(3,25,48,.92),rgba(3,25,48,.7) 45%,rgba(3,25,48,.08) 86%),linear-gradient(0deg,rgba(3,23,43,.92),transparent 40%)}.hero-copy{padding-top:145px}.hero h1{font-size:56px}.hero-lead{font-size:23px}.hero-text{font-size:16px}.moon-note{top:78px;left:auto;right:7%;font-size:23px;transform:rotate(-6deg)}.trust-row{gap:20px}.finder{margin-top:-24px;padding:24px}.finder-grid{grid-template-columns:1fr}.filter-group:last-child{grid-column:auto}.story-grid{grid-template-columns:repeat(2,1fr)}.story-card>img,.story-card-link>img{height:285px}.player{grid-template-columns:1fr;gap:18px}.benefit-grid{grid-template-columns:repeat(2,1fr)}.app-banner{height:510px}.app-copy{width:72%;padding:35px 0 0 32px}.phone{left:auto;right:9%;transform:rotate(5deg) scale(.82);transform-origin:bottom right}.app-note{display:none}.footer-grid{grid-template-columns:1fr;text-align:center;padding:30px 0}.footer .brand{justify-content:center}.footer nav{flex-wrap:wrap}.socials{justify-content:center}.footer>div>p{text-align:center}}
@media(max-width:560px){html{scroll-padding-top:70px}.shell{width:min(100% - 22px,500px)}.site-header{height:72px}.brand-copy strong{font-size:30px}.brand-copy small{display:none}.brand-mark{width:37px}.hero{height:760px}.hero{--hero-art-x:69%}.hero-shade{background:linear-gradient(180deg,rgba(3,24,46,.66) 0,rgba(3,24,46,.43) 39%,rgba(3,24,46,.85) 68%,rgba(3,24,46,.98) 100%)}.hero-copy{padding-top:112px}.hero h1{font-size:48px;letter-spacing:-2px;max-width:350px}.hero-lead{font-size:21px;max-width:360px}.hero-lead br,.hero-text br{display:none}.hero-text{font-size:15px;max-width:330px}.hero-actions{flex-direction:column;align-items:flex-start}.hero-actions .button{min-width:210px}.trust-row{margin-top:28px;display:grid;grid-template-columns:1fr 1fr;gap:13px}.trust-row span:last-child{grid-column:1/-1}.moon-note{display:none}.finder{padding:22px 17px;border-radius:20px}.section-heading h2,.title-row h2,.benefits h2{font-size:29px}.section-heading p{display:none}.age-chips{display:grid;grid-template-columns:repeat(3,1fr)}.age-chips .chip{min-width:0;padding:6px 3px}.chips{gap:7px}.chip{padding:8px 10px}.title-row>div{display:block}.title-row p{font-size:11px;margin-top:6px}.title-row>a{display:none}.story-grid{gap:11px}.story-card>img,.story-card-link>img{height:195px}.card-body{padding:11px;min-height:120px}.card-body h3{font-size:13px;margin-right:32px}.play-small{right:9px;top:10px;width:32px;height:32px}.card-body small{display:grid;gap:4px}.player{padding:17px}.now-playing{gap:13px}.now-playing>img{width:83px;height:83px}.now-playing h3{font-size:14px}.now-playing>div>span{font-size:11px;padding:5px 11px}.control-buttons .main-play{width:52px;height:52px}.benefit-grid{grid-template-columns:1fr}.benefit-grid p{font-size:11px}.app-banner{height:600px}.app-forest{object-position:right center}.app-overlay{background:linear-gradient(180deg,rgba(3,29,52,.94) 0%,rgba(3,29,52,.72) 51%,rgba(3,29,52,.08) 78%)}.app-copy{width:100%;padding:29px 22px 0}.app-copy>span{font-size:29px}.app-copy h2{font-size:21px}.app-copy p{font-size:13px}.store-row{flex-wrap:wrap}.store-row button{min-width:138px}.phone{left:40%;right:auto;height:340px;bottom:-55px}.footer nav{gap:15px}}
@media(max-width:390px){.hero h1{font-size:42px}.story-card>img,.story-card-link>img{height:170px}.card-body h3{min-height:34px}.store-row button{min-width:128px;padding-inline:9px}.phone{right:-3%}}

/* Responsive integration overrides legacy homepage measurements with shared tokens. */
@media(max-width:1200px){.shell{width:min(var(--container-max),calc(100% - var(--page-padding) - var(--page-padding)))}.moon-note{left:76%;top:62px}.card-body h3{font-size:var(--font-h3)}.benefit-grid h3{font-size:var(--font-h3)}.benefit-grid p{font-size:var(--font-small)}}
@media(max-width:1100px){.search-button{display:none}.site-header{grid-template-columns:auto 1fr auto}.footer-grid{grid-template-columns:auto 1fr auto}.footer>div>p{grid-column:2/3;text-align:center;margin:0}.socials{grid-column:3;grid-row:1/3}}
@media(max-width:900px){.shell{width:min(var(--container-max),calc(100% - var(--page-padding) - var(--page-padding)))}.brand--header .brand-copy strong,.brand--footer .brand-copy strong,.brand--phone .brand-copy strong{font-size:var(--brand-wordmark-size)}.brand--header .brand-copy small,.brand--footer .brand-copy small{font-size:var(--brand-tagline-size)}.hero-text{font-size:var(--font-body-lg)}.moon-note{top:48px;left:auto;right:5%;font-size:23px}.card-body h3{font-size:var(--font-h3)}.now-playing h3{font-size:var(--font-h3)}.now-playing>div>span{font-size:var(--font-small)}.footer-grid{grid-template-columns:1fr}.footer>div>p,.socials{grid-column:auto;grid-row:auto}}
@media(max-width:560px){.shell{width:min(var(--container-max),calc(100% - var(--page-padding) - var(--page-padding)))}.brand--header .brand-copy strong,.brand--footer .brand-copy strong,.brand--phone .brand-copy strong{font-size:var(--brand-wordmark-size)}.brand--footer .brand-copy small{display:block;font-size:var(--brand-tagline-size)}.hero-copy{padding-top:130px}.hero h1{font-size:var(--font-display)}.hero-text{font-size:var(--font-body)}.moon-note{display:block;top:55px;right:10px;width:150px;font-size:18px;line-height:.9}.moon-note br:first-of-type{display:none}.trust-row span{font-size:var(--font-small)}.section-heading h2,.title-row h2,.benefits h2{font-size:var(--font-h2)}.chip{font-size:var(--font-small)}.title-row p{font-size:var(--font-body)}.card-body{min-height:140px}.card-body h3{font-size:var(--font-h3);min-height:38px}.card-body p{font-size:var(--font-small)}.card-body small{font-size:var(--font-caption)}.now-playing h3{font-size:var(--font-h3)}.now-playing>div>span{font-size:var(--font-small)}.now-playing p,.progress{font-size:var(--font-caption)}.benefit-grid p{font-size:var(--font-small)}.app-copy p{font-size:var(--font-body)}.store-row button{min-width:145px}.store-row small{font-size:var(--font-caption)}.footer nav{font-size:var(--font-nav)}.footer>div>p{font-size:var(--font-caption)}}
@media(min-width:1600px){.hero{height:740px}.hero-copy{padding-top:195px}.moon-note{top:68px;left:76.3%}.hero-note{top:420px;right:3.5%;width:190px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.button,.story-card,.chip{transition:none}}
/* Mobile-only opening screen. The supplied vertical artwork is deliberately isolated from the desktop hero. */
.mobile-splash{display:none}
@media(max-width:560px){.site-header{display:none}.hero{height:100svh;min-height:730px;max-height:920px;background:#071f39}.hero>.hero-scene,.hero>.hero-shade,.hero>.hero-copy,.hero>.moon-note{display:none}.mobile-splash{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;justify-content:flex-end;align-items:stretch;padding:0 16px calc(18px + env(safe-area-inset-bottom));background:center 45%/cover no-repeat url('assets/illustrations/mobile-home-splash.webp')}.mobile-splash:after{content:"";position:absolute;left:0;right:0;bottom:0;height:36%;background:linear-gradient(0deg,rgba(3,23,43,.78),rgba(3,23,43,0));pointer-events:none}.mobile-splash-actions,.mobile-splash-note{position:relative;z-index:1}.mobile-splash-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.mobile-splash-button{min-height:82px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;border:1px solid rgba(255,239,193,.78);border-radius:18px;background:rgba(255,248,230,.91);color:#153756;box-shadow:0 10px 24px rgba(0,0,0,.23);font:800 14px var(--sans)}.mobile-splash-button span{font-size:31px;line-height:1;filter:drop-shadow(0 2px 1px rgba(0,0,0,.12))}.mobile-splash-note{margin:14px 0 0;text-align:center;color:#fff4d0;font:600 23px/1.08 var(--hand);text-shadow:0 2px 9px rgba(0,0,0,.9)}}


/* Shared home cards: covers are nested inside the story link. */
.story-card{position:relative;display:flex;flex-direction:column}
.story-card-link{display:flex;flex:1;flex-direction:column;min-width:0}
.story-card-link>.card-body{display:flex;flex:1;flex-direction:column;gap:12px}
.story-card-link h3{overflow-wrap:anywhere;margin-bottom:0}
.story-card-link .card-body p{margin-top:auto;margin-bottom:0}
.story-card-link .card-body small{min-height:36px;padding-right:40px;flex-wrap:wrap;align-items:center;gap:4px 10px}
.story-card>.share-story{position:absolute;right:12px;bottom:12px;width:34px;height:34px;padding:0;border:0;border-radius:50%;display:grid;place-items:center;background:#fff;color:#234e77;cursor:pointer}
.story-card>.share-story svg{width:18px;height:18px}
.story-card>.share-story:hover,.story-card>.share-story:focus-visible{background:#d87944;color:#fff;outline:2px solid #f8cf73;outline-offset:2px}
.story-card>.share-story.is-copied{background:#3f7c60;color:#fff}
.story-card-link:focus-visible{outline:3px solid #f8cf73;outline-offset:-3px}
