@import url("https://fonts.googleapis.com/css2?family=Cinzel:wght@500;600&family=IM+Fell+English:ital@0;1&display=swap");

:root {
  --ink: #17231f;
  --cream: #fffaf1;
  --paper: #fffdf8;
  --pink: #f6acc2;
  --rose: #ef6c75;
  --coral: #ff806b;
  --blue: #9ad9e8;
  --deep-blue: #25234f;
  --yellow: #ffd75e;
  --lavender: #9b84da;
  --plum: #50285f;
  --story-plum: #2b0c35;
  --story-gold: #e7bd62;
  --story-cream: #fff0c2;
  --mint: #bee5d3;
  --line: rgba(23, 35, 31, .2);
  --display: "Fraunces", Georgia, serif;
  --sans: "DM Sans", Arial, sans-serif;
  --mono: "DM Mono", monospace;
  --shadow: 7px 8px 0 var(--ink);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; overflow-x: clip; }
body { margin: 0; overflow-x: clip; background: var(--cream); color: var(--ink); font: 400 16px/1.6 var(--sans); }
body::before { content: ""; position: fixed; inset: 0; z-index: 99; pointer-events: none; opacity: .028; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
img, video { display: block; max-width: 100%; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; }
.skip-link { position: fixed; left: -999px; top: 1rem; z-index: 200; background: white; padding: .75rem 1rem; }
.skip-link:focus { left: 1rem; }
.section-pad { padding: 8rem max(6vw, 2rem); }
.chapter-label, .kicker { margin: 0 0 1.3rem; font: 500 .68rem/1.3 var(--mono); letter-spacing: .11em; text-transform: uppercase; }
.chapter-label::before { content: "✦"; color: var(--rose); margin-right: .55rem; font-size: .9rem; }
.light { color: var(--cream); }
h1, h2, h3, p { overflow-wrap: anywhere; }
h1, h2, h3 { font-family: var(--display); letter-spacing: -.055em; }
h1, h2 { margin: 0; line-height: .98; }
h1 em, h2 em { color: var(--rose); font-weight: 600; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 1rem; min-height: 48px; padding: .85rem 1.25rem; border: 1.5px solid var(--ink); border-radius: 99px; text-decoration: none; font-weight: 700; font-size: .82rem; transition: transform .2s, box-shadow .2s, background .2s; }
.button:hover { transform: translateY(-3px); box-shadow: 4px 5px 0 var(--ink); }
.primary { background: var(--ink); color: var(--cream); }
.text-button { border: 0; border-radius: 0; border-bottom: 1px solid var(--ink); padding-inline: 0; min-height: auto; }
.text-button:hover { box-shadow: none; color: var(--rose); }
.light-button { color: var(--ink); background: var(--cream); border-color: var(--cream); }
.section-heading h2 { font-size: clamp(3rem, 6.2vw, 6.7rem); }
.section-heading > p, .split-heading > p { max-width: 390px; }
.split-heading { display: grid; grid-template-columns: 1.4fr .6fr; align-items: end; gap: 3rem; margin-bottom: 4.5rem; }
.centered { max-width: 850px; margin: 0 auto 4.5rem; text-align: center; }
.centered > p { margin-inline: auto; }
.motion-ready .reveal { opacity: 0; transform: translateY(22px); transition: opacity .75s ease, transform .75s ease; }
.motion-ready .reveal.is-visible { opacity: 1; transform: none; }
.motion-ready .delay-1 { transition-delay: .12s; }
.motion-ready .delay-2 { transition-delay: .24s; }

/* Header */
.site-header { position: relative; z-index: 30; display: flex; align-items: center; justify-content: space-between; min-height: 82px; padding: .8rem max(4vw, 1.25rem); background: linear-gradient(90deg, rgba(29,5,36,.96), rgba(78,27,87,.9), rgba(29,5,36,.96)), url("assets/images/opening/enchanted-watercolor-curtain.jpg") center 42% / cover; border-bottom: 1px solid rgba(231,189,98,.7); color: var(--story-cream); box-shadow: 0 5px 20px rgba(32,7,39,.2); }
.brand { display: flex; flex-direction: column; line-height: 1; text-decoration: none; }
.brand span { color: var(--story-cream); font: 400 1.55rem/1 "IM Fell English", Georgia, serif; letter-spacing: -.025em; }
.brand small { margin-top: .35rem; color: var(--story-gold); font: 600 .5rem/1.25 "Cinzel", Georgia, serif; letter-spacing: .08em; text-transform: uppercase; }
.site-nav { display: flex; align-items: center; gap: clamp(.35rem, 1vw, .85rem); }
.site-nav a, .site-nav summary { position: relative; padding: .52rem .7rem; border: 1px solid transparent; border-radius: 3px; color: #f9ebc8; text-decoration: none; font: 400 .95rem/1 "IM Fell English", Georgia, serif; transition: color .2s, border-color .2s, background .2s, transform .2s; }
.site-nav summary { display: flex; align-items: center; gap: .45rem; list-style: none; cursor: pointer; }
.site-nav summary:focus-visible { outline: 2px solid var(--story-gold); outline-offset: 3px; }
.site-nav summary::-webkit-details-marker { display: none; }
.site-nav summary span { color: var(--story-gold); font-size: .72rem; transition: transform .2s; }
.nav-group { position: relative; }
.nav-group[open] summary span { transform: rotate(180deg); }
.site-nav a:not(.nav-contact)::after { content: none; }
.site-nav a:hover, .site-nav a.active, .site-nav summary:hover, .nav-group.active > summary, .nav-group[open] > summary { border-color: rgba(231,189,98,.58); background: rgba(255,238,185,.1); color: #ffe09a; transform: translateY(-1px); }
.nav-dropdown { position: absolute; z-index: 50; top: calc(100% + .75rem); left: 50%; display: none; width: max-content; min-width: 210px; padding: .5rem; border: 1px solid rgba(231,189,98,.62); background: linear-gradient(rgba(45,9,53,.97), rgba(28,4,35,.99)), url("assets/images/opening/enchanted-watercolor-curtain.jpg") center / cover; box-shadow: 0 14px 30px rgba(13,1,17,.3); transform: translateX(-50%); }
.nav-group[open] .nav-dropdown { display: grid; }
.nav-dropdown a { display: block; padding: .72rem .85rem; border: 0; border-bottom: 1px solid rgba(231,189,98,.18); border-radius: 0; white-space: nowrap; }
.nav-dropdown a:last-child { border-bottom: 0; }
.nav-dropdown a:hover, .nav-dropdown a.active { border-color: rgba(231,189,98,.18); background: rgba(255,238,185,.1); transform: none; }
.site-nav .nav-contact { padding: .58rem .85rem; border: 1px solid #d8ad54; border-radius: 3px; background: linear-gradient(145deg, #f3e3b9, #d5af6c 60%, #efd79e); color: #3a1c27; box-shadow: inset 0 0 0 2px rgba(255,246,218,.35), 0 4px 12px rgba(15,2,19,.22); }
.site-nav .nav-contact:hover, .site-nav .nav-contact.active { border-color: #f0d184; background: linear-gradient(145deg, #fff0c6, #e1bc73 60%, #f4dfa9); color: #32123d; }
.menu-toggle { display: none; width: 44px; height: 44px; border: 0; background: transparent; padding: 12px; }
.menu-toggle span { display: block; height: 2px; margin: 6px 0; background: var(--story-gold); transition: transform .2s; }

/* Opening curtain */
.stage-opening { position: fixed; inset: 0; z-index: 120; display: grid; place-items: center; min-height: 100vh; min-height: 100dvh; overflow: hidden; background: transparent; color: var(--cream); transition: visibility 0s .8s; }
.stage-opening.is-gone { visibility: hidden; pointer-events: none; }
.watercolor-curtain { position: absolute; z-index: 0; inset: -2vh -2vw; background-image: linear-gradient(180deg, rgba(30,5,35,.08), rgba(12,1,19,.22)), url("assets/images/opening/enchanted-watercolor-curtain.jpg"); background-position: center; background-repeat: no-repeat; background-size: cover; box-shadow: inset 0 0 105px rgba(6,0,9,.34); opacity: 1; will-change: transform, opacity; transition: transform .78s cubic-bezier(.67,.01,.23,1), opacity .48s ease .12s; }
.curtain-left { clip-path: polygon(-2% -2%, 50.2% -2%, 50.2% 102%, -2% 102%); }
.curtain-right { clip-path: polygon(49.8% -2%, 102% -2%, 102% 102%, 49.8% 102%); }
.stage-opening.is-open .curtain-left { opacity: 0; transform: translateX(-100%); }
.stage-opening.is-open .curtain-right { opacity: 0; transform: translateX(100%); }
.opening-copy { position: relative; top: -3vh; z-index: 3; width: min(82%, 760px); padding: clamp(1.35rem, 2.8vw, 2.2rem) clamp(1.2rem, 4vw, 3.4rem) clamp(1.25rem, 2.6vw, 1.9rem); border: 1px solid rgba(229,181,77,.48); outline: 1px solid rgba(244,211,137,.25); outline-offset: 6px; background: radial-gradient(ellipse at 50% 15%, rgba(255,235,178,.08), transparent 58%), rgba(35,7,42,.12); color: #fff0c7; box-shadow: inset 0 0 35px rgba(246,211,130,.035), 0 12px 40px rgba(14,0,18,.12); text-align: center; text-shadow: 0 2px 16px rgba(12,0,18,.45); transition: opacity .24s ease, transform .24s ease; }
.opening-copy::before, .opening-copy::after { position: absolute; left: 50%; padding: 0 .65rem; background: #4e1c59; color: #e7b94e; font: 400 1.35rem/1 "IM Fell English", Georgia, serif; transform: translateX(-50%); }
.opening-copy::before { content: "❦"; top: -.72rem; }
.opening-copy::after { content: "✦"; bottom: -.62rem; font-size: .8rem; }
.stage-opening.is-open .opening-copy { opacity: 0; transform: scale(.97); pointer-events: none; }
.stage-opening.is-open .opening-stars { opacity: 0; }
.opening-eyebrow { margin: 0 0 .85rem; color: #f7dc98; font: 600 clamp(.6rem, .9vw, .76rem)/1.4 "Cinzel", serif; letter-spacing: .2em; text-transform: uppercase; }
.opening-copy h1 { margin: 0; }
.opening-name { display: block; color: #fff1be; font: 400 clamp(3.4rem, 6.7vw, 6.35rem)/.9 "IM Fell English", Georgia, serif; letter-spacing: -.035em; text-shadow: 0 3px 18px rgba(22,2,26,.55), 0 0 24px rgba(255,219,120,.12); }
.opening-welcome { display: block; margin-top: .18em; color: #f6d477; font: italic 400 clamp(2rem, 4vw, 3.55rem)/.96 "IM Fell English", Georgia, serif; letter-spacing: -.02em; }
.opening-intro { max-width: 560px; margin: 1.2rem auto 1.45rem; color: #ffe9ad; font-size: clamp(.86rem, 1.15vw, 1rem); line-height: 1.5; }
.opening-button { position: relative; display: inline-flex; align-items: center; gap: .9rem; min-width: 260px; padding: .72rem 1.2rem; overflow: hidden; border: 1px solid #7d5528; border-radius: 3px; outline: 1px solid rgba(241,211,147,.58); outline-offset: 4px; background: radial-gradient(circle at 18% 22%, rgba(255,255,255,.46), transparent 25%), radial-gradient(circle at 82% 78%, rgba(126,77,29,.19), transparent 33%), linear-gradient(145deg,#f3e3b9,#d5af6c 58%,#efd79e); color: #3a1c27; box-shadow: 0 10px 24px rgba(0,0,0,.31), inset 0 0 20px rgba(116,67,22,.15), inset 0 0 0 2px rgba(255,246,218,.4); cursor: pointer; transition: transform .2s, box-shadow .2s; }
.opening-button::before, .opening-button::after { content: ""; position: absolute; top: 50%; width: 14px; height: 14px; border-radius: 50%; background: #4a1d58; transform: translateY(-50%); }
.opening-button::before { left: -8px; }.opening-button::after { right: -8px; }
.opening-button:hover { transform: translateY(-3px); box-shadow: 0 13px 28px rgba(0,0,0,.36), inset 0 0 0 2px rgba(255,248,220,.58); }
.opening-button > span:last-child { display: grid; text-align: left; font: 400 1.1rem/1.05 "IM Fell English", Georgia, serif; letter-spacing: .01em; }
.opening-button small { margin-bottom: .25rem; font: 600 .48rem/1 "Cinzel", serif; letter-spacing: .16em; text-transform: uppercase; }
.play-glyph { display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid #32123d; background: radial-gradient(circle at 35% 30%, #7b4785, #42174f 70%); color: #f2d591; box-shadow: inset 0 0 0 2px rgba(240,207,127,.16); padding: 0 0 1px 2px; transform: rotate(45deg); }
.opening-button .play-glyph { font-size: 0; }
.opening-button .play-glyph::after { content: "▶"; font-size: .8rem; transform: rotate(-45deg); }
.opening-skip { display: block; margin: 1.25rem auto 0; padding: .25rem 0; border: 0; border-bottom: 1px solid rgba(255,232,170,.72); background: transparent; color: #fff3cf; font: 500 .66rem "Cinzel", serif; letter-spacing: .08em; cursor: pointer; }
.opening-skip:hover { color: white; border-color: white; }
.opening-audio-stop { position: fixed; z-index: 110; top: max(5.8rem, 9vh); right: max(1rem,3vw); display: inline-flex; align-items: center; gap: .65rem; padding: .72rem 1rem; border: 1px solid #ddb956; border-radius: 99px; background: #32103d; color: #fff0bc; box-shadow: 0 7px 20px rgba(25,4,30,.28), inset 0 0 0 2px rgba(255,223,135,.08); font: 600 .62rem "Cinzel", serif; letter-spacing: .06em; cursor: pointer; animation: stopControlIn .28s ease both; }
.opening-audio-stop[hidden] { display: none; }
.opening-audio-stop span { color: #f4cf72; font-size: .58rem; }
.opening-stars { position: absolute; inset: 0; z-index: 2; pointer-events: none; transition: opacity .58s ease; }
.opening-stars i { position: absolute; font-style: normal; color: #f6d680; text-shadow: 0 0 18px rgba(255,220,123,.46); animation: twinkle 2.2s ease-in-out infinite alternate; }
.opening-stars i:nth-child(1) { left: 12%; top: 17%; font-size: 2rem; }.opening-stars i:nth-child(2) { right: 16%; top: 24%; font-size: 3rem; animation-delay: .7s; }.opening-stars i:nth-child(3) { left: 18%; bottom: 13%; font-size: 4rem; animation-delay: 1.2s; }.opening-stars i:nth-child(4) { right: 12%; bottom: 16%; font-size: 1.6rem; }
.opening-stars .opening-moon { right: 8%; top: 8%; color: #ffe5a1; font-size: clamp(3.2rem, 5vw, 5rem); line-height: 1; text-shadow: 0 0 22px rgba(255,221,126,.58); animation-delay: .35s; }
@keyframes twinkle { to { transform: scale(.55) rotate(20deg); opacity: .3; } }
@keyframes stopControlIn { from { opacity: 0; transform: translateY(10px); } }

/* Shared audio player */
.audio-player { display: flex; align-items: center; gap: 1rem; min-width: 250px; }
.audio-toggle { flex: 0 0 auto; display: grid; place-items: center; width: 55px; height: 55px; border: 1.5px solid var(--ink); border-radius: 50%; background: var(--ink); color: var(--cream); cursor: pointer; transition: transform .2s, background .2s; }
.audio-toggle:hover { transform: scale(1.06); background: var(--rose); }
.audio-toggle span { padding-left: 2px; }
.audio-player.is-playing .audio-toggle span { font-size: 0; padding: 0; }
.audio-player.is-playing .audio-toggle span::after { content: "Ⅱ"; font-size: .85rem; }
.audio-info { flex: 1; min-width: 0; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: .3rem .8rem; }
.audio-info strong { grid-column: 1/-1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .8rem; }
.audio-info small { font: 500 .6rem var(--mono); }
.audio-track { position: relative; height: 5px; overflow: hidden; border-radius: 9px; background: rgba(23,35,31,.18); cursor: pointer; }
.audio-track i { position: absolute; inset: 0 auto 0 0; width: 0; border-radius: inherit; background: var(--ink); pointer-events: none; }

/* Home */
.home-hero { min-height: calc(100vh - 78px); display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; gap: 5vw; padding: 5rem max(7vw, 2rem) 6rem; background: radial-gradient(circle at 12% 20%, rgba(255,215,94,.42), transparent 24%), radial-gradient(circle at 88% 15%, rgba(246,172,194,.4), transparent 23%), var(--cream); }
.hero-copy { position: relative; z-index: 2; }
.hero-copy h1 { max-width: 770px; font-size: clamp(4rem, 7.5vw, 8rem); }
.hero-lead { max-width: 570px; margin: 2rem 0; font-size: 1.08rem; }
.hero-actions { display: flex; align-items: center; gap: 1.3rem; flex-wrap: wrap; }
.hero-meta { margin-top: 2.5rem; font: 500 .62rem var(--mono); text-transform: uppercase; letter-spacing: .05em; }
.status-dot { display: inline-block; width: 8px; height: 8px; margin-right: .45rem; border-radius: 50%; background: #39a667; box-shadow: 0 0 0 5px rgba(57,166,103,.13); }
.hero-portrait { position: relative; width: min(100%, 520px); justify-self: center; padding: 2rem; }
.portrait-frame { position: relative; z-index: 2; aspect-ratio: .82; overflow: hidden; border: 2px solid var(--ink); border-radius: 48% 48% 44% 44% / 38% 42% 55% 58%; box-shadow: 12px 13px 0 var(--blue); background: var(--blue); }
.portrait-frame img { width: 100%; height: 100%; object-fit: cover; }
.doodle { position: absolute; z-index: 4; font-family: var(--display); }.doodle-star { top: 3%; right: 0; color: var(--rose); font-size: 3.2rem; }.doodle-moon { left: 0; bottom: 12%; color: var(--lavender); font-size: 4rem; transform: rotate(-20deg); }
.portrait-note { position: absolute; z-index: 5; right: -1rem; bottom: 7%; padding: .55rem .85rem; background: var(--yellow); border: 1px solid var(--ink); transform: rotate(-6deg); font: italic 700 .9rem var(--display); }
.voice-orbit { position: absolute; z-index: 1; inset: 18% -7% auto auto; width: 114%; height: 55%; border: 1px solid var(--ink); border-radius: 50%; transform: rotate(-13deg); }
.voice-orbit span, .voice-orbit i { position: absolute; font: 500 .53rem var(--mono); font-style: normal; }.voice-orbit span:nth-child(1){left:4%;top:25%}.voice-orbit i:nth-child(2){left:14%;bottom:10%;color:var(--rose)}.voice-orbit span:nth-child(3){right:13%;top:2%}.voice-orbit i:nth-child(4){right:0;top:44%;color:var(--rose)}.voice-orbit span:nth-child(5){right:23%;bottom:1%}.voice-orbit i:nth-child(6){left:50%;top:-8%;color:var(--rose)}
.promise-strip { display: flex; align-items: center; justify-content: center; gap: clamp(1rem, 3vw, 3rem); padding: 1rem 2rem; overflow: hidden; background: var(--ink); color: var(--cream); white-space: nowrap; font: 700 clamp(.72rem, 1.1vw, .95rem) var(--display); text-transform: uppercase; letter-spacing: .08em; }
.promise-strip i { color: var(--yellow); font-style: normal; }
.home-demos { background: var(--paper); }
.world-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.4rem; }
.world-card { position: relative; display: flex; flex-direction: column; min-height: 520px; padding: 1.6rem; border: 1.5px solid var(--ink); box-shadow: var(--shadow); }
.world-commercial { background: var(--pink); }.world-audiobook { background: var(--deep-blue); color: var(--cream); transform: translateY(2rem); }.world-animation { background: var(--blue); }
.world-number { font: 500 .65rem var(--mono); }.world-icon { margin: 3rem 0 1rem; font-size: 3.4rem; line-height: 1; }.world-card h3 { margin: 0; font-size: clamp(2.5rem, 4vw, 4.3rem); }.world-card > p:not(.world-icon) { max-width: 300px; font-size: .88rem; }
.world-card .audio-player { margin-top: auto; padding: 1rem 0; border-top: 1px solid currentColor; border-bottom: 1px solid currentColor; }
.world-audiobook .audio-toggle { background: var(--yellow); color: var(--ink); border-color: var(--yellow); }.world-audiobook .audio-track { background: rgba(255,255,255,.2); }.world-audiobook .audio-track i { background: var(--cream); }
.card-link { margin-top: 1.2rem; text-decoration: none; font-size: .75rem; font-weight: 700; }.card-link span { float: right; }
.published-work { background: var(--yellow); }
.book-list { max-width: 1040px; margin: 0 auto; border-top: 1px solid var(--ink); }
.book-row { display: grid; grid-template-columns: 50px 1.6fr 1fr auto; align-items: center; gap: 1rem; padding: 1.4rem .5rem; border-bottom: 1px solid var(--ink); text-decoration: none; transition: padding .2s, background .2s; }
.book-row:hover { padding-inline: 1rem; background: rgba(255,255,255,.35); }.book-row span { font: 500 .62rem var(--mono); }.book-row strong { font: 700 clamp(1.15rem, 2vw, 1.7rem) var(--display); }.book-row em { font-size: .8rem; }.book-row b { font-size: .68rem; text-transform: uppercase; }
.coming-soon { max-width: 800px; margin: 2rem auto; text-align: center; font-size: .78rem; }
.publisher-cloud { display: flex; align-items: center; justify-content: center; gap: 3rem; flex-wrap: wrap; margin-top: 4rem; padding: 2rem; border-radius: 999px; background: var(--cream); }
.publisher-cloud img { width: auto; max-width: 145px; max-height: 42px; object-fit: contain; mix-blend-mode: multiply; }
.home-authors-teaser { display: grid; grid-template-columns: 1fr 1fr; gap: 8vw; align-items: center; background: var(--plum); color: var(--cream); }.home-authors-teaser h2 { font-size: clamp(3.2rem, 5.6vw, 6.2rem); }.home-authors-teaser h2 em { color: var(--yellow); }.home-authors-teaser > div:first-child > p:not(.chapter-label) { max-width: 560px; margin: 1.5rem 0 2rem; }.home-author-links { border-top: 1px solid rgba(255,255,255,.55); }.home-author-links a { display: grid; grid-template-columns: 110px 1fr auto; align-items: center; gap: 1rem; padding: 1.5rem .5rem; border-bottom: 1px solid rgba(255,255,255,.55); color: var(--cream); text-decoration: none; transition: padding .2s, background .2s; }.home-author-links a:hover { padding-inline: 1rem; background: rgba(255,255,255,.07); }.home-author-links span { color: var(--yellow); font: 500 .58rem var(--mono); }.home-author-links strong { font: 700 clamp(1.3rem, 2.4vw, 2.2rem) var(--display); }.home-author-links i { color: var(--yellow); font-style: normal; }
.studio-section { display: grid; grid-template-columns: .9fr 1.1fr; gap: 8vw; align-items: center; background: var(--mint); }
.studio-image { position: relative; max-width: 520px; transform: rotate(-2deg); box-shadow: 12px 12px 0 var(--ink); }.studio-image img { width: 100%; aspect-ratio: .9; object-fit: cover; border: 2px solid var(--ink); }.tape { position: absolute; width: 85px; height: 26px; background: rgba(255,241,181,.8); }.tape-one { left: -25px; top: 12px; transform: rotate(-28deg); }.tape-two { right: -25px; bottom: 14px; transform: rotate(-28deg); }
.studio-copy h2 { font-size: clamp(3.2rem, 5.5vw, 6.1rem); }.studio-copy > p:not(.chapter-label) { max-width: 520px; }
.equipment-list { list-style: none; padding: 0; margin: 2rem 0; border-top: 1px solid var(--ink); }.equipment-list li { display: grid; grid-template-columns: 110px 1fr; padding: .8rem 0; border-bottom: 1px solid var(--ink); font-weight: 600; }.equipment-list span { font: 500 .62rem var(--mono); text-transform: uppercase; }
.studio-player { max-width: 500px; padding: 1rem; background: var(--cream); border: 1px solid var(--ink); box-shadow: 4px 4px 0 var(--ink); }
.finale-cta, .page-next { position: relative; padding: 8rem 2rem; overflow: hidden; background: var(--plum); color: var(--cream); text-align: center; }.finale-cta h2, .page-next h2 { font-size: clamp(3.5rem, 7vw, 7.4rem); }.finale-cta h2 em, .page-next h2 em { color: var(--yellow); }.finale-cta > p:not(.chapter-label), .page-next > p:not(.chapter-label) { max-width: 650px; margin: 1.5rem auto 2rem; }.finale-stars { color: var(--yellow); font-size: 2rem; margin-bottom: 1rem; }

/* About */
.story-hero { min-height: 720px; display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; gap: 6vw; padding: 6rem max(7vw, 2rem); background: linear-gradient(135deg, var(--blue), #d5f1f4 65%, var(--yellow)); }
.page-hero-copy h1 { font-size: clamp(3.6rem, 6.4vw, 7rem); }.page-hero-copy > p:last-child { max-width: 520px; font-size: 1.05rem; }
.childhood-video { position: relative; }.video-frame { overflow: hidden; border: 2px solid var(--ink); border-radius: 45% 45% 8px 8px; box-shadow: 10px 10px 0 var(--pink); background: var(--ink); }.video-frame video { width: 100%; aspect-ratio: 4/3; object-fit: cover; }.video-caption { display: block; width: fit-content; margin: 1rem auto 0; padding: .4rem .7rem; background: var(--yellow); border: 1px solid var(--ink); transform: rotate(-2deg); font: 600 .67rem var(--mono); }
.origin-story { display: grid; grid-template-columns: 80px 1.15fr .85fr; gap: 5vw; align-items: center; }.origin-number { align-self: start; font: 800 6rem/1 var(--display); color: var(--pink); }.origin-copy h2 { font-size: clamp(3rem, 5vw, 5.5rem); }.lead-story { margin-top: 2rem; font: 600 1.35rem/1.4 var(--display); }.origin-copy blockquote { margin: 2rem 0 0; padding: 1.4rem; background: var(--yellow); border: 1px solid var(--ink); box-shadow: 5px 5px 0 var(--ink); font: italic 600 1.15rem var(--display); transform: rotate(-1deg); }.origin-photo { position: relative; }.origin-photo img { width: 100%; aspect-ratio: .78; object-fit: cover; border-radius: 48% 48% 8px 8px; border: 2px solid var(--ink); }.hand-note { position: absolute; right: -2rem; bottom: 2rem; padding: .65rem; background: var(--pink); transform: rotate(-8deg); font: italic 700 .9rem var(--display); }
.life-path { background: var(--deep-blue); color: var(--cream); }.life-path h2 em { color: var(--yellow); }.path-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1rem; max-width: 1250px; margin: 0 auto; }.path-card { position: relative; min-height: 280px; padding: 1.3rem; border: 1px solid rgba(255,255,255,.5); border-radius: 120px 120px 8px 8px; }.path-card span { font: 500 .58rem var(--mono); color: var(--yellow); }.path-card h3 { margin-top: 4rem; font-size: 1.7rem; }.path-card p { font-size: .75rem; }.path-card.current { background: var(--lavender); color: var(--ink); border-color: var(--cream); }.path-card.current span { color: var(--ink); }
.person-section { background: var(--paper); }.scrapbook-grid { display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: 230px; gap: 1rem; }.scrap { position: relative; margin: 0; overflow: hidden; border: 1.5px solid var(--ink); background: white; }.scrap img { width: 100%; height: 100%; object-fit: cover; }.scrap figcaption { position: absolute; left: .65rem; bottom: .65rem; padding: .35rem .55rem; background: var(--cream); border: 1px solid var(--ink); font: 600 .58rem var(--mono); transform: rotate(-2deg); }.scrap-e { grid-column: span 2; }.scrap-a, .scrap-f { transform: rotate(-1.5deg); }.scrap-c, .scrap-h { transform: rotate(1.5deg); }
.video-diary { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; margin-top: 5rem; }.video-diary article { padding: 1rem; background: var(--blue); border: 1.5px solid var(--ink); box-shadow: var(--shadow); }.video-diary article:nth-child(2) { background: var(--pink); transform: translateY(2rem) rotate(1deg); }.video-diary video { width: 100%; aspect-ratio: 16/9; object-fit: cover; background: var(--ink); }.video-diary p { margin: .8rem 0 0; font: italic 700 .9rem var(--display); }
.credentials { display: grid; grid-template-columns: .65fr 1.35fr; gap: 6vw; background: var(--yellow); }.credential-intro h2 { font-size: clamp(3rem, 5vw, 5.6rem); }.credential-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem; }.credential-card { padding: 1.4rem; background: var(--cream); border: 1.5px solid var(--ink); box-shadow: 5px 5px 0 var(--ink); }.credential-card h3 { font-size: 1.9rem; }.credential-card ul { list-style: none; padding: 0; margin: 0; }.credential-card li { padding: .75rem 0; border-top: 1px solid var(--line); }.credential-card strong, .credential-card span { display: block; }.credential-card strong { font-size: .8rem; }.credential-card span { font-size: .7rem; }
.esme-corner { display: grid; grid-template-columns: .8fr 1.2fr; gap: 7vw; align-items: center; background: var(--pink); }.esme-photo { position: relative; max-width: 500px; }.esme-photo img { width: 100%; aspect-ratio: .8; object-fit: cover; border: 2px solid var(--ink); border-radius: 50% 50% 10px 10px; box-shadow: 12px 12px 0 var(--yellow); }.esme-badge { position: absolute; right: -2rem; top: 12%; display: grid; place-items: center; width: 105px; height: 105px; border: 1.5px solid var(--ink); border-radius: 50%; background: var(--yellow); text-align: center; font: 800 .72rem/1.15 var(--display); transform: rotate(9deg); }.esme-copy h2 { font-size: clamp(3.2rem, 5.4vw, 6rem); }.esme-intro { max-width: 550px; font-size: 1.05rem; }.esme-copy blockquote { margin: 2rem 0 1rem; padding-left: 1.3rem; border-left: 4px solid var(--ink); font: italic 600 1.2rem/1.45 var(--display); }.esme-signoff { font-weight: 700; }
.page-next > div { display: flex; justify-content: center; gap: .8rem; flex-wrap: wrap; margin-top: 2rem; }

/* Demo pages */
.demo-hero { min-height: 690px; display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; gap: 6vw; padding: 6rem max(7vw, 2rem); }.demo-hero-copy h1 { font-size: clamp(4.8rem, 9vw, 10rem); }.demo-hero-copy > p:not(.chapter-label,.demo-adjectives) { max-width: 560px; margin: 1.4rem 0 2rem; }.demo-adjectives { margin: 1rem 0; font: italic 700 clamp(1.3rem, 2vw, 2rem) var(--display); }.demo-hero-art { position: relative; min-height: 480px; overflow: hidden; border: 2px solid var(--ink); border-radius: 48% 48% 8px 8px; box-shadow: 10px 10px 0 var(--ink); }
.demo-commercial .demo-hero { background: var(--pink); }.demo-commercial .demo-hero-art { background: var(--yellow); }.ad-sun { position: absolute; width: 260px; height: 260px; right: -50px; top: -40px; border-radius: 50%; background: var(--rose); }.ad-bottle { position: absolute; left: 24%; bottom: -5%; display: grid; place-items: center; width: 180px; height: 350px; border: 2px solid var(--ink); border-radius: 85px 85px 12px 12px; background: var(--blue); text-align: center; font: italic 700 2.3rem/1 var(--display); transform: rotate(-8deg); }.ad-spark { position: absolute; left: 13%; top: 16%; font-size: 4rem; color: var(--plum); }.ad-line { position: absolute; right: 10%; bottom: 16%; font: 700 1.1rem/1 var(--display); transform: rotate(7deg); }
.demo-audiobook .demo-hero { background: var(--deep-blue); color: var(--cream); }.demo-audiobook .demo-hero h1 em { color: var(--yellow); }.demo-audiobook .demo-hero-art { background: linear-gradient(#7066aa,#292651); border-color: var(--cream); box-shadow: 10px 10px 0 var(--yellow); }.open-book { position: absolute; left: 50%; bottom: 14%; width: 76%; height: 45%; transform: translateX(-50%); }.open-book i { position: absolute; width: 51%; height: 100%; background: var(--cream); border: 2px solid var(--ink); }.open-book i:first-child { left: 0; border-radius: 12px 0 5px 75%; transform: skewY(7deg); }.open-book i:last-child { right: 0; border-radius: 0 12px 75% 5px; transform: skewY(-7deg); }.book-star { position: absolute; color: var(--yellow); }.s1 { left: 16%; top: 15%; font-size: 4rem; }.s2 { right: 17%; top: 9%; font-size: 2.5rem; }.s3 { right: 12%; top: 35%; font-size: 4rem; }.book-whisper { position: absolute; left: 50%; top: 35%; z-index: 2; transform: translateX(-50%) rotate(-4deg); font: italic 700 1.4rem/1 var(--display); text-align: center; }
.demo-animation .demo-hero { background: var(--blue); }.demo-animation .demo-hero-art { background: var(--yellow); }.character-face { position: absolute; left: 50%; bottom: -8%; width: 290px; height: 390px; transform: translateX(-50%); border: 2px solid var(--ink); border-radius: 50% 50% 20% 20%; background: var(--lavender); }.character-face::before, .character-face::after { content: ""; position: absolute; top: 41%; width: 18px; height: 28px; border-radius: 50%; background: var(--ink); }.character-face::before { left: 29%; }.character-face::after { right: 29%; }.character-face i { position: absolute; left: 50%; top: 60%; width: 70px; height: 35px; transform: translateX(-50%); border-bottom: 5px solid var(--ink); border-radius: 50%; }.character-face b, .character-face span { position: absolute; top: -55px; width: 80px; height: 120px; border: 2px solid var(--ink); background: var(--coral); }.character-face b { left: 20px; border-radius: 100% 10px 0 0; transform: rotate(-25deg); }.character-face span { right: 20px; border-radius: 10px 100% 0 0; transform: rotate(25deg); }.speech { position: absolute; padding: .55rem .8rem; border: 1px solid var(--ink); border-radius: 50%; background: var(--cream); font: italic 800 1.2rem var(--display); }.speech.one { left: 5%; top: 18%; transform: rotate(-10deg); }.speech.two { right: 6%; top: 30%; transform: rotate(9deg); }.character-star { position: absolute; right: 12%; top: 7%; color: var(--rose); font-size: 4rem; }
.demo-list-section { background: var(--paper); }.large-player-list { border-top: 1px solid var(--ink); }.large-player { display: grid; grid-template-columns: 60px 1fr minmax(280px,.75fr); align-items: center; gap: 2rem; padding: 2rem .5rem; border-bottom: 1px solid var(--ink); }.player-index { font: 500 .65rem var(--mono); }.player-copy span, .sample-card > span { font: 500 .58rem var(--mono); letter-spacing: .07em; }.player-copy h3 { margin: .3rem 0; font-size: clamp(1.7rem, 3vw, 2.8rem); }.player-copy p { margin: 0; font-size: .72rem; }
.voice-palette { display: grid; grid-template-columns: 1fr 1fr; gap: 7vw; align-items: center; background: var(--rose); }.voice-palette h2, .purpose-copy h2 { font-size: clamp(3rem, 5vw, 5.7rem); }.voice-palette h2 em { color: var(--cream); }.tone-cloud { display: flex; flex-wrap: wrap; justify-content: center; gap: .7rem; }.tone-cloud span { padding: .7rem 1rem; border: 1.5px solid var(--ink); border-radius: 99px; background: var(--cream); font: 700 .82rem var(--display); }.tone-cloud span:nth-child(3n) { background: var(--yellow); transform: rotate(4deg); }.tone-cloud span:nth-child(4n) { background: var(--blue); transform: rotate(-4deg); }
.demo-purpose { display: grid; grid-template-columns: 1fr 1fr; gap: 7vw; align-items: center; background: var(--mint); }.purpose-copy > p:last-child { max-width: 550px; }.purpose-list { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; }.purpose-list p { margin: 0; padding: 1.4rem; border: 1px solid var(--ink); background: var(--cream); font: 700 1.15rem var(--display); }
.featured-audio { background: var(--cream); }.hero-audio-card { display: grid; grid-template-columns: 1fr minmax(300px,.8fr); align-items: center; gap: 3rem; max-width: 1050px; margin: 0 auto; padding: 2rem; border: 1.5px solid var(--ink); background: var(--lavender); box-shadow: var(--shadow); }.hero-audio-card > div:first-child > span { font: 500 .58rem var(--mono); }.hero-audio-card h3 { margin: .5rem 0; font-size: clamp(2rem, 4vw, 4rem); }.hero-audio-card p { margin: 0; font-size: .78rem; }
.sample-library { background: var(--deep-blue); color: var(--cream); }.sample-library h2 em { color: var(--yellow); }.sample-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }.sample-card { display: flex; flex-direction: column; min-height: 295px; padding: 1.4rem; border: 1px solid rgba(255,255,255,.55); background: rgba(255,255,255,.05); }.sample-card h3 { margin: 1.4rem 0 .25rem; font-size: 1.7rem; }.sample-card p { margin: 0; font-size: .72rem; }.sample-card .audio-player { margin-top: auto; padding-top: 1rem; border-top: 1px solid rgba(255,255,255,.4); }.sample-card .audio-toggle { background: var(--yellow); color: var(--ink); border-color: var(--yellow); }.sample-card .audio-track { background: rgba(255,255,255,.2); }.sample-card .audio-track i { background: var(--cream); }
.mini-published { background: var(--yellow); }
.author-production-callout { display: grid; grid-template-columns: 1fr 1fr; gap: 8vw; align-items: center; background: var(--plum); color: var(--cream); }.author-production-callout h2 { font-size: clamp(3rem, 5.2vw, 5.8rem); }.author-production-callout h2 em { color: var(--yellow); }.author-production-callout > div:last-child { max-width: 560px; }.author-production-callout .button { margin-top: 1rem; }
.character-cast { background: var(--plum); color: var(--cream); }.character-cast h2 em { color: var(--yellow); }.cast-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }.cast-card { min-height: 240px; padding: 1.4rem; border: 1px solid var(--cream); border-radius: 100px 100px 8px 8px; }.cast-card span { font-size: 2.5rem; color: var(--yellow); }.cast-card h3 { margin: 2.3rem 0 .3rem; font-size: 1.7rem; }.cast-card p { font-size: .75rem; }.c2,.c5 { background: var(--lavender); }.c3 { background: var(--rose); }.c4 { background: var(--deep-blue); }.c6 { background: var(--blue); color: var(--ink); }
.animation-process { display: grid; grid-template-columns: .8fr 1.2fr; gap: 7vw; align-items: center; background: var(--yellow); }.process-art { display: grid; place-items: center; min-height: 420px; }.magic-circle { display: grid; place-items: center; width: 310px; height: 310px; border: 2px solid var(--ink); border-radius: 50%; background: var(--blue); box-shadow: 15px 15px 0 var(--rose); font-size: 6rem; color: var(--plum); transform: rotate(-8deg); }.magic-circle span { font: italic 700 1.3rem var(--display); color: var(--ink); }.spark-list { list-style: none; padding: 0; }.spark-list li { padding: .7rem 0; border-top: 1px solid var(--ink); font-size: .85rem; }.spark-list li::before { content: "✦"; margin-right: .6rem; color: var(--rose); }

/* For Authors */
.author-hero, .production-hero, .reading-hero { min-height: 720px; display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; gap: 6vw; padding: 6rem max(7vw, 2rem); }
.author-hero { background: radial-gradient(circle at 8% 10%, rgba(255,215,94,.54), transparent 26%), radial-gradient(circle at 92% 12%, rgba(155,132,218,.38), transparent 29%), var(--cream); }
.author-hero-copy h1, .production-hero-copy h1, .reading-hero-copy h1 { font-size: clamp(3.8rem, 6.5vw, 7.2rem); }
.author-hero-copy > p:not(.chapter-label), .production-hero-copy > p:not(.chapter-label), .reading-hero-copy > p:not(.chapter-label) { max-width: 610px; margin: 1.7rem 0 2rem; font-size: 1.02rem; }
.author-hero-art { position: relative; display: grid; place-items: center; min-height: 520px; overflow: hidden; border: 2px solid var(--ink); border-radius: 48% 48% 10px 10px; background: linear-gradient(145deg, #b39de4, #5e3470); box-shadow: 11px 11px 0 var(--yellow); }
.author-hero-art::before { content: ""; position: absolute; inset: 9%; border: 1px solid rgba(255,240,194,.56); border-radius: 48% 48% 8px 8px; }
.author-hero-art > p { position: absolute; right: 7%; bottom: 7%; margin: 0; color: var(--story-cream); font: italic 700 1.25rem/1.05 var(--display); text-align: right; transform: rotate(-5deg); }
.author-moon { position: absolute; left: 10%; top: 9%; color: var(--yellow); font-size: 5rem; line-height: 1; }
.author-pages { position: relative; width: 72%; height: 220px; margin-top: 5rem; }
.author-pages span { position: absolute; bottom: 0; width: 51%; height: 100%; border: 2px solid var(--ink); background: var(--cream); }
.author-pages span:first-child { left: 0; border-radius: 10px 0 5px 75%; transform: skewY(7deg); }.author-pages span:nth-child(2) { right: 0; border-radius: 0 10px 75% 5px; transform: skewY(-7deg); }
.author-pages i { position: absolute; z-index: 2; left: 50%; top: -38%; color: var(--yellow); font-size: 5rem; font-style: normal; transform: translateX(-50%); }
.author-services { background: var(--paper); }
.author-service-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; max-width: 1180px; margin: 0 auto; }
.author-service-card { display: flex; flex-direction: column; min-height: 530px; padding: clamp(1.6rem, 3vw, 2.4rem); border: 1.5px solid var(--ink); color: var(--ink); text-decoration: none; box-shadow: var(--shadow); transition: transform .25s, box-shadow .25s; }
.author-service-card:hover { transform: translateY(-7px) rotate(-.4deg); box-shadow: 10px 13px 0 var(--ink); }
.service-audio { background: var(--deep-blue); color: var(--cream); }.service-reading { background: var(--pink); }
.author-service-card > span { font: 500 .62rem var(--mono); letter-spacing: .08em; }.service-symbol { margin: 2rem 0 auto; color: var(--yellow); font-size: 5rem; line-height: 1; }
.author-service-card h3 { margin: 1rem 0; font-size: clamp(2.8rem, 4.6vw, 5rem); line-height: .92; }.author-service-card p { max-width: 470px; }.author-service-card strong { margin-top: 1.5rem; padding-top: 1rem; border-top: 1px solid currentColor; font-size: .76rem; }.author-service-card strong i { float: right; font-style: normal; }
.author-philosophy { display: grid; grid-template-columns: 1fr 1fr; gap: 8vw; align-items: center; background: var(--plum); color: var(--cream); }.author-philosophy h2 { font-size: clamp(3.2rem, 5.4vw, 6rem); }.author-philosophy h2 em { color: var(--yellow); }.author-philosophy > div:last-child { max-width: 560px; }

/* Audiobook production */
.production-hero { overflow: hidden; background: radial-gradient(circle at 83% 18%, rgba(255,215,94,.25), transparent 22%), linear-gradient(135deg, #26234f, #50285f); color: var(--cream); }
.production-hero h1 em { color: var(--yellow); }.production-visual { position: relative; display: grid; place-items: center; min-height: 520px; }.production-visual > p { position: absolute; right: 4%; bottom: 6%; margin: 0; padding: .55rem .75rem; border: 1px solid var(--ink); background: var(--yellow); color: var(--ink); font: italic 700 1rem/1.1 var(--display); transform: rotate(-5deg); }
.sound-rings { position: absolute; inset: 8%; }.sound-rings i { position: absolute; inset: 0; border: 1px solid rgba(255,250,241,.54); border-radius: 50%; transform: rotate(-15deg); }.sound-rings i:nth-child(2) { inset: 12%; transform: rotate(9deg); }.sound-rings i:nth-child(3) { inset: 24%; transform: rotate(-5deg); }
.production-book { position: relative; z-index: 2; width: min(85%, 430px); height: 250px; }.production-book span { position: absolute; bottom: 0; width: 51%; height: 100%; border: 2px solid var(--ink); background: var(--cream); }.production-book span:first-child { left: 0; border-radius: 12px 0 5px 75%; transform: skewY(7deg); }.production-book span:nth-child(2) { right: 0; border-radius: 0 12px 75% 5px; transform: skewY(-7deg); }.production-book b { position: absolute; z-index: 3; left: 50%; top: -37%; color: var(--yellow); font-size: 5rem; transform: translateX(-50%); }
.why-audio { background: var(--paper); }.audio-benefits { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }.audio-benefits article { min-height: 285px; padding: 1.4rem; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }.audio-benefits article:nth-child(odd) { background: rgba(154,217,232,.36); }.audio-benefits article:nth-child(even) { background: rgba(246,172,194,.36); }.audio-benefits span { font: 500 .6rem var(--mono); }.audio-benefits h3 { margin: 3.5rem 0 .7rem; font-size: 1.65rem; line-height: 1; }.audio-benefits p { margin: 0; font-size: .8rem; }
.production-process { background: var(--deep-blue); color: var(--cream); }.production-process h2 em { color: var(--yellow); }.process-steps { max-width: 1000px; margin: 0 auto; padding: 0; list-style: none; border-top: 1px solid rgba(255,255,255,.45); }.process-steps li { display: grid; grid-template-columns: 90px 1fr; gap: 2rem; padding: 1.7rem .5rem; border-bottom: 1px solid rgba(255,255,255,.45); }.process-steps li > span { color: var(--yellow); font: 500 .65rem var(--mono); }.process-steps h3 { margin: 0 0 .3rem; font-size: clamp(1.6rem, 2.8vw, 2.6rem); }.process-steps p { max-width: 680px; margin: 0; color: rgba(255,250,241,.8); }
.production-options { background: var(--yellow); }.production-option-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; max-width: 1150px; margin: 0 auto; }.option-card { display: flex; flex-direction: column; min-height: 570px; padding: clamp(1.5rem, 3vw, 2.3rem); border: 1.5px solid var(--ink); box-shadow: 7px 8px 0 var(--ink); }.option-narration { background: var(--cream); }.option-full { background: var(--lavender); }.option-card > span { font: 500 .62rem var(--mono); letter-spacing: .08em; }.option-card h3 { margin: 2.4rem 0 1rem; font-size: clamp(2.2rem, 3.7vw, 3.8rem); line-height: .96; }.option-card ul { margin: 1.5rem 0 2rem; padding: 0; list-style: none; }.option-card li { padding: .65rem 0; border-top: 1px solid rgba(23,35,31,.34); font-size: .84rem; }.option-card li::before { content: "✦"; margin-right: .55rem; color: var(--rose); }.option-card .button { width: fit-content; margin-top: auto; }.production-note, .service-boundary { max-width: 900px; margin: 2.5rem auto 0; font-size: .72rem; text-align: center; }

/* Alpha & beta reading */
.reading-hero { background: radial-gradient(circle at 10% 10%, rgba(255,215,94,.48), transparent 25%), linear-gradient(135deg, var(--pink), var(--cream) 68%, var(--blue)); }
.reading-art { position: relative; min-height: 530px; }.reading-page { position: absolute; inset: 7% 8%; display: grid; place-items: center; padding: 3rem; border: 2px solid var(--ink); background: #fff8e6; box-shadow: 12px 13px 0 var(--plum); transform: rotate(2deg); }.reading-page::after { content: ""; position: absolute; inset: 1.1rem; border: 1px solid rgba(80,40,95,.32); }.reading-page i { position: relative; z-index: 2; display: block; width: 62%; height: 7px; margin: .4rem; background: rgba(23,35,31,.17); }.reading-page b { position: relative; z-index: 2; margin: 1.2rem 0; color: var(--plum); font: italic 700 clamp(2rem, 4vw, 4rem)/.95 var(--display); text-align: center; }.margin-notes span { position: absolute; z-index: 4; padding: .4rem .6rem; border: 1px solid var(--ink); background: var(--yellow); font: italic 700 .8rem var(--display); }.margin-notes span:nth-child(1) { left: 0; top: 15%; transform: rotate(-8deg); }.margin-notes span:nth-child(2) { right: 0; top: 43%; background: var(--blue); transform: rotate(7deg); }.margin-notes span:nth-child(3) { left: 4%; bottom: 12%; background: var(--pink); transform: rotate(4deg); }
.reading-options { background: var(--paper); }.reading-option-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; max-width: 1150px; margin: 0 auto; }.reading-card { min-height: 520px; padding: clamp(1.5rem, 3vw, 2.3rem); border: 1.5px solid var(--ink); box-shadow: 7px 8px 0 var(--ink); }.alpha-card { background: var(--blue); }.beta-card { background: var(--pink); }.reading-card > span { font: 500 .62rem var(--mono); }.reading-card h3 { margin: 3rem 0 1rem; font-size: clamp(3rem, 5vw, 5rem); }.reading-card ul { margin: 2rem 0 0; padding: 0; list-style: none; }.reading-card li { padding: .65rem 0; border-top: 1px solid rgba(23,35,31,.4); font-size: .85rem; }.reading-card li::before { content: "→"; margin-right: .6rem; }
.reader-lens { display: grid; grid-template-columns: 1fr 1fr; gap: 8vw; align-items: center; background: var(--plum); color: var(--cream); }.reader-lens h2 { font-size: clamp(3.2rem, 5.5vw, 6rem); }.reader-lens h2 em { color: var(--yellow); }.reader-lens-copy > p:last-child { max-width: 570px; }.lens-list { border-top: 1px solid rgba(255,255,255,.5); }.lens-list p { display: grid; grid-template-columns: 55px 1fr; margin: 0; padding: 1rem 0; border-bottom: 1px solid rgba(255,255,255,.5); font: 700 1.1rem var(--display); }.lens-list span { color: var(--yellow); font: 500 .6rem var(--mono); }
.feedback-delivery { background: var(--mint); }.delivery-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }.delivery-grid article { min-height: 270px; padding: 1.4rem; border: 1.5px solid var(--ink); background: var(--cream); box-shadow: 5px 5px 0 var(--ink); }.delivery-grid span { color: var(--rose); font-size: 2rem; }.delivery-grid h3 { margin: 3rem 0 .7rem; font-size: 1.8rem; }.delivery-grid p { font-size: .8rem; }

/* Language services */
.language-hero { min-height: 720px; display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; gap: 6vw; padding: 6rem max(7vw, 2rem); background: radial-gradient(circle at 8% 10%, rgba(255,215,94,.55), transparent 26%), linear-gradient(135deg, var(--mint), var(--cream) 58%, var(--blue)); }
.language-hero-copy h1 { font-size: clamp(3.8rem, 6.5vw, 7.2rem); }.language-hero-copy > p:not(.chapter-label) { max-width: 610px; margin: 1.7rem 0 2rem; font-size: 1.02rem; }
.language-hero-art { position: relative; display: grid; place-items: center; min-height: 520px; overflow: hidden; border: 2px solid var(--ink); border-radius: 48% 48% 10px 10px; background: linear-gradient(145deg, var(--deep-blue), var(--plum)); box-shadow: 11px 11px 0 var(--yellow); }.language-hero-art::before { content: ""; position: absolute; inset: 9%; border: 1px solid rgba(255,240,194,.52); border-radius: 48% 48% 8px 8px; }.language-hero-art > p { position: absolute; right: 8%; bottom: 7%; margin: 0; color: var(--story-cream); font: italic 700 1.2rem/1.05 var(--display); text-align: right; transform: rotate(-5deg); }.language-hero-art > b { position: absolute; left: 50%; top: 50%; z-index: 3; color: var(--yellow); font: 700 2.5rem/1 var(--display); transform: translate(-50%,-50%); }
.language-orbit { position: relative; z-index: 2; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 1.5rem; width: 78%; }.language-orbit span { display: grid; place-items: center; aspect-ratio: 1; border: 2px solid var(--story-cream); border-radius: 50%; color: var(--story-cream); font: 700 clamp(3rem, 6vw, 5rem)/1 var(--display); }.language-orbit i { color: var(--yellow); font-size: 1.8rem; font-style: normal; }
.translation-service, .interpretation-service { display: grid; grid-template-columns: 1fr 1fr; gap: 8vw; align-items: center; scroll-margin-top: 2rem; }.translation-service { background: var(--paper); }.language-service-heading h2 { font-size: clamp(3.2rem, 5.5vw, 6rem); }.language-service-heading > p:not(.chapter-label) { max-width: 610px; margin: 1.5rem 0 2rem; }.language-scope { padding: clamp(1.5rem, 3vw, 2.4rem); border: 1.5px solid var(--ink); background: var(--yellow); box-shadow: var(--shadow); }.language-scope > span { font: 500 .62rem var(--mono); letter-spacing: .08em; }.language-scope ul { margin: 2rem 0 0; padding: 0; list-style: none; }.language-scope li { padding: 1rem 0; border-top: 1px solid rgba(23,35,31,.48); font: 700 clamp(1.1rem, 2vw, 1.55rem) var(--display); }.language-scope li::before { content: "✦"; margin-right: .65rem; color: var(--rose); }
.interpretation-service { background: var(--plum); color: var(--cream); }.interpretation-service h2 em { color: var(--yellow); }.interpretation-art { position: relative; min-height: 440px; }.speech-card { position: absolute; z-index: 2; min-width: 230px; padding: 1.4rem; border: 2px solid var(--ink); border-radius: 50%; text-align: center; font: italic 700 clamp(1.4rem, 3vw, 2.2rem) var(--display); }.speech-en { left: 3%; top: 10%; background: var(--blue); color: var(--ink); transform: rotate(-5deg); }.speech-ko { right: 3%; bottom: 9%; background: var(--yellow); color: var(--ink); transform: rotate(5deg); }.speech-line { position: absolute; left: 23%; top: 29%; width: 54%; height: 45%; border: 1px solid rgba(255,255,255,.7); border-radius: 50%; transform: rotate(19deg); }.interpretation-art > span { position: absolute; left: 48%; top: 46%; color: var(--yellow); font-size: 4rem; }.interpretation-list { margin: 1.8rem 0 2rem; border-top: 1px solid rgba(255,255,255,.42); }.interpretation-list p { margin: 0; padding: .8rem 0; border-bottom: 1px solid rgba(255,255,255,.42); font-size: .86rem; }.interpretation-list span { margin-right: .55rem; color: var(--yellow); }
.language-process { background: var(--mint); }.language-process-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1rem; }.language-process-grid article { min-height: 285px; padding: 1.4rem; border: 1.5px solid var(--ink); background: var(--cream); box-shadow: 5px 5px 0 var(--ink); }.language-process-grid span { font: 500 .62rem var(--mono); }.language-process-grid h3 { margin: 3.5rem 0 .7rem; font-size: 1.9rem; }.language-process-grid p { font-size: .8rem; }.language-boundary { max-width: 900px; margin: 2.5rem auto 0; font-size: .72rem; text-align: center; }

/* Contact */
.contact-hero { min-height: 760px; display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 5vw; padding: 5rem max(7vw, 2rem); background: linear-gradient(135deg, var(--pink), var(--cream) 50%, var(--blue)); }.contact-copy h1 { font-size: clamp(4rem, 7vw, 7.6rem); }.contact-copy > p:not(.chapter-label,.response-note) { max-width: 530px; }.contact-email { display: block; width: fit-content; margin: 2rem 0; border-bottom: 2px solid var(--ink); text-decoration: none; font: 700 clamp(1rem, 1.8vw, 1.5rem) var(--display); }.response-note { font: 500 .62rem var(--mono); text-transform: uppercase; }
.contact-collage { position: relative; min-height: 560px; }.contact-pic { position: absolute; width: 40%; height: 45%; object-fit: cover; border: 1.5px solid var(--ink); box-shadow: 5px 5px 0 var(--ink); }.p1 { left: 9%; top: 4%; transform: rotate(-6deg); }.p2 { right: 5%; top: 8%; transform: rotate(5deg); }.p3 { left: 0; bottom: 2%; transform: rotate(3deg); }.p4 { left: 34%; bottom: 7%; transform: rotate(-2deg); }.p5 { right: 0; bottom: 1%; transform: rotate(7deg); }.collage-note { position: absolute; z-index: 4; left: 37%; top: 42%; padding: .7rem; border: 1px solid var(--ink); background: var(--yellow); font: italic 800 1rem/1 var(--display); transform: rotate(-7deg); }
.project-note { background: var(--paper); }.brief-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }.brief-card { min-height: 260px; padding: 1.4rem; border: 1.5px solid var(--ink); box-shadow: 5px 5px 0 var(--ink); }.brief-card:nth-child(1){background:var(--pink)}.brief-card:nth-child(2){background:var(--blue)}.brief-card:nth-child(3){background:var(--yellow)}.brief-card > span { font: 500 .65rem var(--mono); }.brief-card h3 { margin-top: 3.2rem; font-size: 2rem; }.brief-card p { font-size: .8rem; }.email-launch { display: flex; justify-content: center; align-items: center; gap: 1.5rem; margin-top: 4rem; }.email-launch p { font: italic 700 1.3rem var(--display); }.contact-final { position: relative; padding: 8rem 2rem; background: var(--blue); text-align: center; }.contact-final > span { font-size: 3rem; color: var(--rose); }.contact-final h2 { font-size: clamp(3.5rem, 7vw, 7rem); }.contact-final > a { font-weight: 700; }

/* Footer */
.site-footer { display: grid; grid-template-columns: 1fr 1fr 1.2fr; gap: 2.5rem 3rem; padding: 3.5rem max(5vw, 1.5rem) 2rem; background: linear-gradient(rgba(27,5,34,.93), rgba(15,2,20,.98)), url("assets/images/opening/enchanted-watercolor-curtain.jpg") center 66% / cover; border-top: 1px solid rgba(231,189,98,.72); color: var(--story-cream); }.footer-brand { color: var(--story-cream); }.footer-nav { display: grid; grid-template-columns: 1fr 1fr; gap: .45rem 1rem; }.footer-nav a { color: #f7e8c4; text-decoration: none; font: 400 .94rem/1.25 "IM Fell English", Georgia, serif; }.footer-nav a:hover { color: var(--story-gold); }.footer-contact a { color: var(--story-cream); font: 400 1.15rem/1.2 "IM Fell English", Georgia, serif; }.footer-contact p { margin: .6rem 0 0; color: rgba(255,240,194,.76); font: 500 .6rem var(--mono); }.legal { grid-column: 1/-1; margin: .5rem 0 0; padding-top: 1rem; border-top: 1px solid rgba(231,189,98,.3); color: rgba(255,240,194,.62); font: 400 .52rem/1.5 var(--mono); text-transform: uppercase; }
.ai-protection { grid-column: 1/-1; position: relative; margin-top: .25rem; padding: clamp(1.35rem, 3vw, 2.25rem); border: 1px solid rgba(228,184,87,.66); outline: 1px solid rgba(244,211,137,.25); outline-offset: 5px; background: radial-gradient(circle at 12% 10%, rgba(255,255,255,.44), transparent 30%), linear-gradient(145deg, rgba(255,244,212,.96), rgba(228,198,141,.93)); color: #34133c; box-shadow: inset 0 0 28px rgba(106,58,29,.12), 0 10px 26px rgba(11,1,14,.2); }
.ai-protection::before { content: "❦"; position: absolute; left: 50%; top: -.72rem; padding: 0 .65rem; background: #391144; color: var(--story-gold); font: 400 1.2rem/1 "IM Fell English", Georgia, serif; transform: translateX(-50%); }
.ai-protection > span { display: block; margin-bottom: .65rem; color: #6a2b70; font: 600 .58rem/1.2 "Cinzel", Georgia, serif; letter-spacing: .16em; text-transform: uppercase; }
.ai-protection p { max-width: 1500px; margin: 0; font: 400 clamp(1rem, 1.45vw, 1.25rem)/1.55 "IM Fell English", Georgia, serif; }

@media (max-width: 980px) {
  .site-nav { gap: .2rem; }.site-nav a, .site-nav summary { padding-inline: .45rem; font-size: .86rem; }
  .home-hero, .story-hero, .demo-hero, .contact-hero, .author-hero, .production-hero, .reading-hero, .language-hero { grid-template-columns: 1fr; }
  .home-hero { padding-top: 4rem; }.hero-portrait { width: min(100%, 480px); }
  .world-cards { grid-template-columns: 1fr; max-width: 680px; margin: auto; }.world-card { min-height: 420px; }.world-audiobook { transform: none; }
  .studio-section, .credentials, .esme-corner, .voice-palette, .demo-purpose, .animation-process, .author-philosophy, .reader-lens, .home-authors-teaser, .author-production-callout, .translation-service, .interpretation-service { grid-template-columns: 1fr; }
  .origin-story { grid-template-columns: 60px 1fr; }.origin-photo { grid-column: 2; max-width: 500px; }
  .path-grid { grid-template-columns: repeat(3, 1fr); }
  .scrapbook-grid { grid-template-columns: repeat(3, 1fr); }.scrap-e { grid-column: span 1; }
  .contact-collage { min-height: 620px; }
  .audio-benefits { grid-template-columns: 1fr 1fr; }
}

@media (min-width: 761px) and (max-width: 980px) {
  .site-header { min-height: 72px; }.brand span { font-size: 1.2rem; }.brand small { max-width: 190px; font-size: .43rem; letter-spacing: .06em; }
  .menu-toggle { display: block; position: relative; z-index: 42; cursor: pointer; }
  .site-nav { position: fixed; inset: 0; z-index: 40; display: flex; flex-direction: column; align-items: stretch; justify-content: flex-start; gap: .35rem; overflow-y: auto; padding: 6rem 2rem 3rem; background: linear-gradient(rgba(34,6,42,.88), rgba(28,4,35,.96)), url("assets/images/opening/enchanted-watercolor-curtain.jpg") center / cover; transform: translateX(102%); transition: transform .35s ease; }.site-nav.is-open { transform: none; }.site-nav > a, .site-nav summary { width: 100%; padding: .7rem .85rem; font: 400 1.85rem/1 "IM Fell English", Georgia, serif; }.site-nav summary { justify-content: space-between; }.nav-dropdown { position: static; width: 100%; min-width: 0; margin: .25rem 0 .55rem; padding: .25rem .65rem; border-color: rgba(231,189,98,.34); background: rgba(17,2,23,.3); box-shadow: none; transform: none; }.nav-dropdown a { padding: .65rem .75rem; font-size: 1.15rem; }.site-nav .nav-contact { margin-top: .8rem; padding: .8rem 1rem; text-align: center; }.menu-toggle.is-open span:first-child { transform: translateY(4px) rotate(45deg); }.menu-toggle.is-open span:last-child { transform: translateY(-4px) rotate(-45deg); }
}

@media (max-width: 480px) {
  .language-hero-art { min-height: 380px; }
  .language-orbit { width: 88%; gap: .7rem; }
  .speech-card { min-width: 180px; padding: 1rem; }
}

@media (max-width: 760px) {
  .section-pad { padding: 5rem 1.25rem; }
  .site-header { min-height: 72px; }.brand span { font-size: 1.2rem; }.brand small { max-width: 190px; font-size: .43rem; letter-spacing: .06em; }
  .menu-toggle { display: block; position: relative; z-index: 42; cursor: pointer; }
  .site-nav { position: fixed; inset: 0; z-index: 40; display: flex; flex-direction: column; align-items: stretch; justify-content: flex-start; gap: .35rem; overflow-y: auto; padding: 6rem 2rem 3rem; background: linear-gradient(rgba(34,6,42,.88), rgba(28,4,35,.96)), url("assets/images/opening/enchanted-watercolor-curtain.jpg") center / cover; transform: translateX(102%); transition: transform .35s ease; }.site-nav.is-open { transform: none; }.site-nav > a, .site-nav summary { width: 100%; padding: .7rem .85rem; font: 400 1.85rem/1 "IM Fell English", Georgia, serif; }.site-nav summary { justify-content: space-between; }.nav-dropdown { position: static; width: 100%; min-width: 0; margin: .25rem 0 .55rem; padding: .25rem .65rem; border-color: rgba(231,189,98,.34); background: rgba(17,2,23,.3); box-shadow: none; transform: none; }.nav-dropdown a { padding: .65rem .75rem; font-size: 1.15rem; }.site-nav .nav-contact { margin-top: .8rem; padding: .8rem 1rem; text-align: center; }.menu-toggle.is-open span:first-child { transform: translateY(4px) rotate(45deg); }.menu-toggle.is-open span:last-child { transform: translateY(-4px) rotate(-45deg); }
  .split-heading { grid-template-columns: 1fr; align-items: start; gap: 1rem; margin-bottom: 2.8rem; }.section-heading h2 { font-size: clamp(2.8rem, 14vw, 4.5rem); }
  .home-hero { min-height: auto; padding: 4rem 1.25rem; }.hero-copy h1 { font-size: clamp(3.4rem, 17vw, 5.2rem); }.hero-lead { font-size: .95rem; }.portrait-note { right: 0; }
  .promise-strip { justify-content: flex-start; }
  .publisher-cloud { border-radius: 20px; gap: 1.5rem; }.publisher-cloud img { max-width: 100px; max-height: 30px; }
  .studio-section { gap: 4rem; }.equipment-list li { grid-template-columns: 85px 1fr; }
  .book-row { grid-template-columns: 35px 1fr auto; }.book-row em { grid-column: 2; }.book-row b { grid-row: 1/3; grid-column: 3; }
  .finale-cta, .page-next { padding: 6rem 1.25rem; }.finale-cta h2, .page-next h2 { font-size: clamp(3rem, 14vw, 5rem); }
  .story-hero, .demo-hero, .contact-hero, .author-hero, .production-hero, .reading-hero, .language-hero { min-height: auto; padding: 4rem 1.25rem; }.page-hero-copy h1, .demo-hero-copy h1, .contact-copy h1, .author-hero-copy h1, .production-hero-copy h1, .reading-hero-copy h1, .language-hero-copy h1 { font-size: clamp(3.4rem, 16vw, 5.4rem); }.demo-hero-art { min-height: 390px; }
  .origin-story { grid-template-columns: 1fr; }.origin-number { font-size: 4rem; }.origin-photo { grid-column: auto; }.hand-note { right: 0; }
  .path-grid { grid-template-columns: 1fr 1fr; }.path-card { min-height: 240px; }
  .scrapbook-grid { grid-template-columns: 1fr 1fr; grid-auto-rows: 200px; }.video-diary { grid-template-columns: 1fr; }.video-diary article:nth-child(2) { transform: none; }
  .credential-columns { grid-template-columns: 1fr; }
  .esme-badge { right: 0; }
  .large-player { grid-template-columns: 40px 1fr; gap: 1rem; }.large-player .audio-player { grid-column: 2; }
  .hero-audio-card { grid-template-columns: 1fr; padding: 1.3rem; }
  .sample-grid, .cast-grid, .brief-grid, .author-service-grid, .production-option-grid, .reading-option-grid, .delivery-grid, .language-process-grid { grid-template-columns: 1fr; }
  .author-hero-art, .production-visual, .reading-art, .language-hero-art { min-height: 420px; }.author-pages { height: 180px; }.production-book { height: 210px; }
  .author-service-card, .option-card, .reading-card { min-height: auto; }
  .audio-benefits { grid-template-columns: 1fr; }.audio-benefits article { min-height: 220px; }.audio-benefits h3 { margin-top: 2rem; }
  .process-steps li { grid-template-columns: 50px 1fr; gap: 1rem; }
  .purpose-list { grid-template-columns: 1fr; }
  .magic-circle { width: 250px; height: 250px; }
  .contact-collage { min-height: 470px; }.contact-pic { width: 46%; height: 40%; }.p4 { left: 25%; }.p5 { right: 0; }.collage-note { left: 30%; }
  .email-launch { flex-direction: column; }
  .site-footer { grid-template-columns: 1fr; gap: 2rem; }.legal, .ai-protection { grid-column: auto; }.ai-protection { margin-top: .5rem; padding: 1.35rem; }.ai-protection p { font-size: .98rem; }
}

@media (max-width: 480px) {
  .opening-copy { width: min(90%, 390px); }.opening-name { font-size: 3.2rem; }.opening-welcome { font-size: 1.9rem; }.opening-button { min-width: min(280px, 82vw); }.opening-stars { display: none; }
  .hero-actions { align-items: flex-start; flex-direction: column; }.hero-actions .button { width: auto; }
  .world-card { min-height: 440px; }.world-card h3 { font-size: 3rem; }
  .path-grid { grid-template-columns: 1fr; }.path-card { min-height: 210px; border-radius: 100px 100px 8px 8px; }.path-card h3 { margin-top: 2.5rem; }
  .scrapbook-grid { grid-template-columns: 1fr; }.scrap { transform: none; }
  .large-player { grid-template-columns: 1fr; }.large-player .audio-player { grid-column: auto; }.player-index { display: none; }
  .audio-player { min-width: 0; }.audio-toggle { width: 49px; height: 49px; }.audio-info strong { font-size: .72rem; }
  .contact-collage { min-height: 380px; }.contact-pic { width: 43%; }.collage-note { left: 25%; top: 45%; font-size: .75rem; }
  .home-author-links a { grid-template-columns: 1fr auto; }.home-author-links span { grid-column: 1/-1; }.home-author-links strong { font-size: 1.35rem; }
}

@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; } }