/* IRREKLAR | Studio V3. One authored visual system, no inherited overrides.
   Brand palette (IRREKLAR Designsystem 1.4): #070B1E #FAFAFF #F93887 #3568FF #7935DA
   Experience thesis: a moment of wonder becomes a considered answer. */
:root{
  color-scheme:dark;
  --night:#070B1E;--paper:#FAFAFF;--magenta:#F93887;--blue:#3568FF;--violet:#7935DA;
  --surface:#0d132a;--surface-2:#111936;--mist:#d4d9e9;--quiet:#aeb5cd;
  --stroke:rgba(250,250,255,.15);--stroke-strong:rgba(250,250,255,.26);
  --max:1240px;--gutter:clamp(22px,5.5vw,80px);--space-section:clamp(88px,8.5vw,148px);
  --type-h1:clamp(2.45rem,3.5vw,3.45rem);--type-h2:clamp(2rem,2.7vw,2.8rem);
  --type-h3:clamp(1.22rem,1.55vw,1.56rem);
  font-family:Inter,'Helvetica Neue',Arial,system-ui,sans-serif;font-synthesis:none;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;background:var(--night);color:var(--paper);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body.modal-open{overflow:hidden}
[hidden]{display:none!important}
img,video{display:block;max-width:100%}
button,input{font:inherit}button{cursor:pointer}
a{color:inherit;text-decoration:none}
a,button{-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible{outline:3px solid var(--magenta);outline-offset:5px}
::selection{background:var(--magenta);color:var(--night)}
.container{width:min(calc(100% - 2*var(--gutter)),var(--max));margin-inline:auto}
.skip{position:fixed;top:-100px;left:16px;z-index:10000;padding:12px 18px;background:var(--paper);color:var(--night)}
.skip:focus{top:16px}
/* 01 | Identity and navigation */
.site-header{position:relative;z-index:60;background:rgba(7,11,30,.96);border-bottom:1px solid var(--stroke)}
.site-header__inner{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:32px}
.wordmark{font-size:24px;line-height:1;font-weight:880;letter-spacing:-.07em;white-space:nowrap}
.wordmark span{color:var(--magenta)}
.site-nav{display:flex;align-items:center;gap:clamp(23px,3vw,43px)}
.site-nav>a:not(.nav-out){font-size:13px;font-weight:650;color:#d7deec;transition:color .2s}
.site-nav>a:hover,.site-nav>a[aria-current="page"]{color:var(--magenta)}
.nav-out{display:inline-flex;align-items:center;gap:10px;min-height:39px;padding:8px 18px;border:1px solid var(--stroke-strong);border-radius:100px;font-size:12px;font-weight:700;transition:border-color .2s,background .2s}
.nav-out:hover{border-color:var(--magenta);background:rgba(249,56,135,.08)}
.menu{display:none;position:relative;align-self:center}
.menu summary{list-style:none;display:flex;align-items:center;gap:10px;border:1px solid var(--stroke-strong);border-radius:24px;padding:11px 16px;font-size:13px;font-weight:700;cursor:pointer}
.menu summary::-webkit-details-marker{display:none}
.menu summary::after{content:'+';font-size:19px;font-weight:400;line-height:.7;color:var(--magenta)}
.menu[open] summary::after{content:'\2212'}
.menu__links{position:absolute;top:54px;right:0;width:min(280px,calc(100vw - 32px));display:grid;gap:2px;border:1px solid var(--stroke-strong);padding:10px;background:#111830;border-radius:18px;box-shadow:0 28px 75px #000a}
.menu__links a{padding:14px 13px;font-size:14px;border-radius:9px;line-height:1.3}
.menu__links a:hover,.menu__links a:focus-visible{background:rgba(250,250,255,.08)}
/* 02 | Editorial type and actions */
h1,h2,h3,p{margin:0}
h1,h2,h3{font-weight:750;letter-spacing:-.045em;line-height:1.12;text-wrap:balance}
h1{font-size:var(--type-h1)}h2{font-size:var(--type-h2)}h3{font-size:var(--type-h3)}
h1 em,h2 em{color:var(--magenta);font-style:normal}
p{line-height:1.67;font-size:16px;color:var(--mist)}
.eyebrow{font-size:11px!important;font-weight:800;line-height:1.4!important;letter-spacing:.18em;text-transform:uppercase;color:var(--magenta)}
.eyebrow--light{color:#ced7f8}
.lead{font-size:clamp(17px,1.4vw,19px);line-height:1.6;color:var(--mist)}
.section-index{font-size:12px;color:var(--quiet);letter-spacing:.12em;font-variant-numeric:tabular-nums}
.button{min-height:49px;padding:13px 22px;border-radius:99px;border:1px solid transparent;display:inline-flex;align-items:center;justify-content:center;gap:16px;max-width:100%;font-size:13px;font-weight:780;text-align:center;line-height:1.25;transition:background .2s,color .2s,border-color .2s,transform .2s}
.button:hover{transform:translateY(-2px)}
.button--primary{background:var(--magenta);color:var(--night)}
.button--primary:hover{background:#ff6ca7}
.button--outline{background:transparent;border-color:rgba(250,250,255,.46);color:var(--paper)}
.button--outline:hover{border-color:var(--magenta)}
.button--text{border-radius:0;min-height:38px;padding:4px 0;border-bottom:1px solid var(--magenta);color:var(--paper)}
.button .arrow{font-size:18px;font-weight:400;line-height:1}
.actions{display:flex;align-items:center;flex-wrap:wrap;gap:13px;margin-top:32px}
.section{padding-block:var(--space-section);position:relative}
.section__topline{display:flex;align-items:center;justify-content:space-between;gap:15px;padding-top:20px;border-top:1px solid var(--stroke);margin-bottom:51px}
.section__topline .eyebrow{margin:0}
/* 03 | Cinematic first impression: the drawing provides motion, the type provides calm */
.hero{position:relative;isolation:isolate;overflow:hidden;min-height:clamp(650px,64vw,760px);display:flex;align-items:center}
.hero__visual{position:absolute;inset:0;z-index:-2}
.hero__visual picture,.hero__visual img{width:100%;height:100%}
.hero__visual img{object-fit:cover;object-position:center}
.hero__visual::after{content:'';pointer-events:none;position:absolute;inset:0;background:linear-gradient(90deg,var(--night) 0%,rgba(7,11,30,.98) 19%,rgba(7,11,30,.85) 32%,rgba(7,11,30,.23) 58%,transparent 84%),linear-gradient(0deg,var(--night) 0%,transparent 16%)}
.hero__inner{width:min(calc(100% - 2*var(--gutter)),var(--max));position:relative;padding-block:96px 130px}
.hero__copy{max-width:505px}
.hero .eyebrow{margin-bottom:24px}
.hero h1{max-width:580px;margin-bottom:24px}
.hero .lead{max-width:410px}
.hero__bottom{position:absolute;bottom:25px;left:0;right:0;display:flex;align-items:center;gap:22px;opacity:.9}
.hero__bottom::after{content:'';height:1px;flex:1;background:linear-gradient(90deg,var(--stroke-strong),transparent)}
.hero__bottom span{font-size:11px;font-weight:700;letter-spacing:.18em;color:#dce3f6}
.hero--quiz .hero__visual::after,.hero--books .hero__visual::after{background:linear-gradient(90deg,var(--night) 0%,rgba(7,11,30,.96) 23%,rgba(7,11,30,.65) 46%,transparent 82%),linear-gradient(0deg,var(--night),transparent 20%)}
.hero--quiz{min-height:630px}.hero--books{min-height:630px}
/* 04 | Film stage: a single authentic poster is the media interaction */
.film-section{padding-block:var(--space-section);overflow:hidden}
.film-layout{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(55px,8vw,135px);align-items:center}
.film-copy{max-width:410px}
.film-copy h2{margin:24px 0 22px;max-width:380px}
.film-copy p:not(.eyebrow){max-width:400px}
.film-foot{margin-top:60px;display:flex;align-items:center;gap:14px;font-size:12px;color:var(--quiet)}
.film-foot::before{content:'';width:38px;height:1px;background:var(--magenta)}
.film-stage{min-height:590px;display:grid;place-items:center;position:relative;background:radial-gradient(ellipse at 55% 48%,rgba(53,104,255,.12),transparent 65%),radial-gradient(ellipse at 60% 58%,rgba(121,53,218,.08),transparent 60%)}
.film-stage::before{content:'';position:absolute;height:1px;left:2%;right:2%;bottom:13%;background:linear-gradient(90deg,transparent,rgba(249,56,135,.6),transparent)}
.film-poster{position:relative;width:min(100%,316px);aspect-ratio:9/16;border-radius:16px;overflow:hidden;background:#161a2b;box-shadow:0 42px 100px #0008,0 0 0 1px rgba(250,250,255,.24)}
.film-poster img{width:100%;height:100%;object-fit:contain}
.film-play{position:absolute;inset:0;border:0;background:transparent;display:grid;place-items:center;color:var(--paper)}
.film-play__circle{display:grid;place-items:center;width:84px;height:84px;border-radius:50%;padding-left:5px;background:rgba(7,11,30,.85);border:1px solid rgba(250,250,255,.86);box-shadow:0 0 0 10px rgba(7,11,30,.2);font-size:25px;transition:transform .25s,background .25s}
.film-play:hover .film-play__circle{transform:scale(1.08);background:var(--magenta);color:var(--night)}
.film-stage__tag{position:absolute;bottom:6%;right:0;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--quiet)}
/* 05 | A large original octopus and a real four-way curiosity selector */
.discover{position:relative;isolation:isolate;padding-block:clamp(85px,8vw,130px);overflow:hidden;background:linear-gradient(180deg,var(--night),#0c1030 56%,var(--night))}
.discover::before{content:'';position:absolute;inset:15% -18% 10% 40%;z-index:-1;background:radial-gradient(ellipse,rgba(121,53,218,.15),transparent 68%);pointer-events:none}
.discover__grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(35px,5vw,95px);align-items:center}
.discover__text{position:relative;z-index:2}
.discover__text h2{max-width:500px;margin:22px 0 15px}
.discover__text>.lead{max-width:420px;margin-bottom:35px}
.series-selector{border-top:1px solid var(--stroke);max-width:480px}
.series-choice{width:100%;background:none;border:0;border-bottom:1px solid var(--stroke);padding:15px 0;display:grid;grid-template-columns:35px 1fr 21px;align-items:center;gap:12px;text-align:left;color:var(--quiet)}
.series-choice .num{font-size:11px;letter-spacing:.12em;color:var(--quiet)}
.series-choice .series-title{font-size:17px;letter-spacing:-.02em;font-weight:680;color:var(--paper)}
.series-choice .series-plus{font-size:18px;font-weight:300;color:var(--quiet);text-align:right}
.series-choice[aria-pressed="true"] .series-title,.series-choice[aria-pressed="true"] .series-plus{color:var(--magenta)}
.series-choice[aria-pressed="true"] .num{color:var(--magenta)}
.series-choice:hover .series-title{color:var(--magenta)}
.series-explain{min-height:60px;max-width:460px;padding-top:20px;font-size:15px;color:var(--mist)}
.discover__art{min-width:0;align-self:center;position:relative}
.discover__art img{width:min(100%,640px);height:auto;margin-inline:auto;filter:drop-shadow(0 45px 70px rgba(3,5,25,.6));-webkit-mask-image:radial-gradient(ellipse at 50% 53%,#000 69%,transparent 100%);mask-image:radial-gradient(ellipse at 50% 53%,#000 69%,transparent 100%)}
.discover__caption{margin-top:14px;text-align:right;font-size:11px;letter-spacing:.12em;color:var(--quiet)}
/* 06 | The quiz is a full-width scene, not a small card */
.quiz-scene{position:relative;isolation:isolate;min-height:clamp(520px,44vw,650px);display:flex;align-items:center;overflow:hidden;border-block:1px solid var(--stroke)}
.quiz-scene__art{position:absolute;inset:0;z-index:-2}
.quiz-scene__art picture,.quiz-scene__art img{width:100%;height:100%}
.quiz-scene__art img{object-fit:cover;object-position:50% 50%}
.quiz-scene__art::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,var(--night) 0%,rgba(7,11,30,.97) 19%,rgba(7,11,30,.8) 42%,transparent 85%)}
.quiz-scene__inner{padding-block:92px;position:relative}
.quiz-scene__copy{max-width:470px}
.quiz-scene h2{margin:23px 0 19px}.quiz-scene .lead{max-width:400px}
/* 07 | A curated growing bookshelf. The real covers carry the visual variation. */
.books-transition{padding-block:var(--space-section)}
.books-transition__head{display:grid;grid-template-columns:1.2fr .8fr;gap:35px;align-items:end;margin-bottom:64px}
.books-transition__head h2{max-width:620px;margin-top:22px}
.books-transition__head>p{max-width:345px;justify-self:end;margin-bottom:3px}
.shelf{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(16px,3.5vw,53px);align-items:end;padding:20px 9px 35px}
.shelf::after{content:'';position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--stroke-strong) 15%,var(--stroke-strong) 85%,transparent)}
.shelf__item{display:block;min-width:0;position:relative;transition:transform .25s}
.shelf__item:nth-child(even){transform:translateY(16px)}
.shelf__item:hover{transform:translateY(-7px)}
.shelf__item:nth-child(even):hover{transform:translateY(4px)}
.shelf__item img{width:100%;height:auto;aspect-ratio:3/4;object-fit:contain;box-shadow:0 21px 34px #0008}
.books-transition__action{margin-top:45px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.books-transition__action p{font-size:13px;color:var(--quiet)}
/* 08 | Final note and global footer */
.closing{padding:70px 0;border-top:1px solid var(--stroke)}
.closing__inner{display:flex;align-items:center;justify-content:space-between;gap:30px}
.closing h2{font-size:clamp(1.6rem,2.2vw,2.2rem);max-width:680px;margin-top:14px}
.site-footer{padding-block:42px;border-top:1px solid var(--stroke);background:#070a19}
.site-footer__inner{display:flex;align-items:center;justify-content:space-between;gap:34px}
.site-footer__meta{margin-top:11px;font-size:12px;color:var(--quiet)}
.site-footer__links{display:flex;gap:26px;flex-wrap:wrap;font-size:13px;color:var(--quiet)}
.site-footer__links a:hover{color:var(--paper)}
/* 09 | Real player in a focused, accessible dialog */
.modal{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;background:rgba(3,5,13,.975);padding:70px 20px 24px}
.modal__backdrop{position:absolute;inset:0;width:100%;height:100%;border:0;background:transparent;z-index:0}
.modal__close{position:absolute;right:24px;top:19px;z-index:3;border:1px solid var(--stroke-strong);border-radius:99px;padding:12px 19px;min-height:45px;background:#1a2140;color:var(--paper)}
.modal__close:hover{border-color:var(--magenta)}
.modal__video{position:relative;z-index:2;height:calc(100dvh - 110px);width:auto;max-width:100%;max-height:calc(100dvh - 110px);aspect-ratio:9/16;object-fit:contain;background:#000;border-radius:8px}
/* 10 | Dedicated book-world: one editorial language shared across two independent sites */
.book-world{padding-block:var(--space-section)}
.book-world__intro{display:grid;grid-template-columns:1fr .6fr;gap:40px;align-items:end;padding-top:22px;border-top:1px solid var(--stroke);margin-bottom:48px}
.book-world__intro h2{margin-top:20px}
.book-world__intro>p{max-width:360px;justify-self:end}
.books-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:60px 55px}
.book-card{display:grid;grid-template-columns:minmax(0,.72fr) minmax(0,1fr);gap:clamp(18px,2vw,34px);align-items:center;border-top:1px solid var(--stroke);padding-top:33px}
.book-card__cover{display:flex;align-items:center;justify-content:center;min-height:260px;padding:11px 5px 22px;background:radial-gradient(ellipse at 50% 70%,rgba(53,104,255,.11),transparent 76%)}
.book-card__cover img{width:100%;max-width:290px;height:auto;aspect-ratio:3/4;object-fit:contain;box-shadow:0 24px 38px #0008;transition:transform .25s}
.book-card__cover:hover img{transform:translateY(-7px)}
.book-card__meta{font-size:10px!important;letter-spacing:.13em;text-transform:uppercase;color:var(--magenta);font-weight:800}
.book-card h3{font-size:clamp(1.2rem,1.6vw,1.55rem);margin:12px 0 14px;line-height:1.18}
.book-card p:not(.book-card__meta){font-size:14px;max-width:275px}
.book-card .button{margin-top:19px}
.book-detail{min-height:65vh;display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:clamp(44px,8vw,130px);align-items:center;padding-block:clamp(85px,9vw,150px)}
.book-detail__copy{max-width:565px}.book-detail__copy h1{margin:24px 0}.book-detail__copy p{max-width:505px;margin-bottom:23px}
.book-detail__art{padding:30px;display:grid;place-items:center;background:radial-gradient(ellipse at center,rgba(53,104,255,.13),transparent 68%)}
.book-detail__art img{width:min(100%,370px);height:auto;box-shadow:0 30px 70px #0008}
.book-detail__note{font-size:13px!important;color:var(--quiet)}
/* 11 | Real quiz engine: no changes to question data or JS answer logic */
.quiz-area{padding-block:var(--space-section)}
.quiz-layout{width:min(calc(100% - 2*var(--gutter)),var(--max));margin-inline:auto;display:grid;grid-template-columns:minmax(0,.44fr) minmax(0,.8fr);gap:clamp(60px,8vw,130px);align-items:start}
.quiz-side{padding-top:17px}.quiz-side h2{font-size:clamp(1.9rem,2.6vw,2.65rem);max-width:320px}.quiz-side h2 em{color:var(--magenta);font-style:normal}
.quiz-side p{margin-top:20px;max-width:300px}
.quiz-frame{min-width:0;border:1px solid var(--stroke);border-radius:22px;padding:clamp(25px,3.8vw,53px);background:linear-gradient(165deg,#141b36,#0d132a);box-shadow:0 30px 80px #0002}
.quiz-status{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:11px;font-weight:800;color:var(--quiet);letter-spacing:.12em}
.quiz-progress{height:4px;background:#2c3352;margin:21px 0 35px;overflow:hidden;border-radius:9px}
.quiz-progress span{height:100%;width:0;display:block;background:var(--magenta);transition:width .3s}
.quiz-category{font-size:11px!important;text-transform:uppercase;letter-spacing:.14em;color:var(--magenta);font-weight:800;margin-bottom:13px}
.quiz-frame h3{font-size:clamp(1.4rem,2vw,1.95rem);margin-bottom:28px;line-height:1.26;letter-spacing:-.03em}
.quiz-answers{display:grid;gap:10px}
.quiz-answer{display:flex;align-items:center;gap:18px;min-height:58px;padding:14px 16px;text-align:left;width:100%;border:1px solid var(--stroke);border-radius:12px;background:#1b2342;color:var(--paper);line-height:1.4}
.quiz-answer:disabled{cursor:default}.quiz-answer:not(:disabled):hover{border-color:var(--magenta);background:#252342}
.quiz-answer.answer-correct{background:#15332f;border-color:#7bd9aa}.quiz-answer.answer-wrong{background:#3c1932;border-color:var(--magenta)}
.answer-marker{color:var(--magenta);font-weight:800;font-size:12px;flex:0 0 26px}
.quiz-feedback{border-left:2px solid var(--magenta);background:rgba(249,56,135,.065);padding:18px 22px;margin-top:24px}
.quiz-feedback p{margin:7px 0 9px;font-size:14px}.quiz-feedback strong,.quiz-feedback a{color:var(--paper)}.quiz-feedback a{text-decoration:underline;text-decoration-color:var(--magenta);font-size:13px}
.quiz-next{margin-top:24px}.primary-cta{min-height:49px;padding:13px 22px;border:1px solid transparent;border-radius:100px;background:var(--magenta);color:var(--night);font-size:13px;font-weight:800}
.primary-cta:hover{background:#ff6da7}.quiz-result-number{font-size:clamp(3rem,5vw,4rem);font-weight:850;line-height:1}.quiz-result-number span{font-size:.4em;color:var(--quiet)}
.cert-name-label{display:block;margin-top:24px;font-size:14px;font-weight:700}.cert-name-label span{font-weight:400;color:var(--quiet)}
#cert-name{width:min(100%,470px);padding:16px;margin-top:12px;border:1px solid var(--stroke-strong);border-radius:10px;background:#1a2240;color:var(--paper)}
.result-actions{display:flex;align-items:center;flex-wrap:wrap;gap:20px;margin-top:23px}
.text-cta{border:0;background:transparent;color:var(--paper);border-bottom:1px solid var(--magenta);padding:10px 0;font-weight:750}
.cert-disclaimer{font-size:12px;margin-top:20px}.certificate{border:2px solid var(--magenta);border-radius:18px;margin:46px auto;padding:30px;max-width:820px}
.certificate h2{font-size:2.2rem}.certificate p{margin:16px 0}
/* 12 | Breakpoints: deliberate mobile editorial rather than desktop stacking */
@media(max-width:1060px){
  .site-nav{gap:20px}
  .film-layout{gap:40px}
  .film-stage{min-height:580px}
  .discover__grid{gap:35px}
  .books-grid{gap:50px 24px}
  .book-card{grid-template-columns:1fr}.book-card__cover{max-width:340px}.book-card__copy{padding-bottom:12px}
}
@media(max-width:820px){
  :root{--space-section:85px}
  .site-nav{display:none}.menu{display:block}
  .hero{min-height:660px}
  .hero__visual::after{background:linear-gradient(90deg,var(--night) 0%,rgba(7,11,30,.88) 35%,rgba(7,11,30,.3) 73%,transparent),linear-gradient(0deg,var(--night),transparent 20%)}
  .film-layout,.discover__grid,.books-transition__head,.book-world__intro,.book-detail,.quiz-layout{grid-template-columns:1fr}
  .film-copy{max-width:620px}.film-copy h2{max-width:520px}.film-stage{min-height:560px}
  .discover__art{margin-top:10px;max-width:580px;margin-inline:auto}
  .quiz-scene{min-height:590px}
  .books-transition__head>p,.book-world__intro>p{justify-self:start;max-width:600px}
  .quiz-side h2{max-width:none}.quiz-side p{max-width:700px}
}
@media(max-width:600px){
  :root{--gutter:21px;--space-section:74px;--type-h1:clamp(2.18rem,9vw,2.63rem);--type-h2:clamp(1.75rem,7.2vw,2.12rem)}
  html{scroll-padding-top:68px}
  .site-header__inner{min-height:66px}.wordmark{font-size:23px}
  .eyebrow{font-size:10px!important}
  .hero,.hero--quiz,.hero--books{min-height:735px;align-items:flex-start}
  .hero__inner{padding-block:64px 350px}
  .hero__visual img{object-fit:cover;object-position:center bottom}
  .hero__visual::after,.hero--quiz .hero__visual::after,.hero--books .hero__visual::after{background:linear-gradient(180deg,var(--night) 0%,rgba(7,11,30,.95) 15%,rgba(7,11,30,.84) 32%,rgba(7,11,30,.25) 58%,rgba(7,11,30,0) 70%,var(--night) 100%)}
  .hero .eyebrow{margin-bottom:18px}.hero h1{max-width:390px;margin-bottom:17px}
  .hero .lead{font-size:15px;max-width:370px;line-height:1.62}
  .hero__bottom{bottom:29px}.hero__bottom span{font-size:10px}
  .button{min-height:46px;padding:12px 18px}
  .section__topline{margin-bottom:35px}
  .film-layout{gap:30px}.film-copy h2{margin:18px 0 14px}
  .film-foot{margin-top:28px}.film-stage{min-height:555px;margin-inline:-14px}
  .film-poster{width:min(73vw,288px)}.film-stage__tag{bottom:2%;right:12px;font-size:10px}
  .discover__text h2{margin:17px 0 15px}.discover__text>.lead{margin-bottom:26px;font-size:15px}
  .series-choice{padding:14px 0}.series-choice .series-title{font-size:16px}.series-explain{font-size:14px;min-height:72px}
  .discover__art{width:100%;max-width:500px}.discover__art img{width:100%}
  .quiz-scene{min-height:710px;align-items:flex-start}
  .quiz-scene__inner{padding-top:76px;padding-bottom:350px}
  .quiz-scene__art img{object-fit:cover;object-position:center bottom}
  .quiz-scene__art::after{background:linear-gradient(180deg,var(--night) 0%,rgba(7,11,30,.96) 18%,rgba(7,11,30,.86) 35%,rgba(7,11,30,.05) 64%,var(--night) 100%)}
  .quiz-scene h2{margin:17px 0 14px}.quiz-scene .lead{font-size:15px}
  .books-transition__head{margin-bottom:25px;gap:17px}.books-transition__head h2{margin-top:18px}
  .shelf{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;padding:20px 4px 30px}
  .shelf__item:nth-child(even){transform:none}.shelf__item:nth-child(even):hover{transform:translateY(-7px)}
  .books-transition__action{display:block;margin-top:27px}.books-transition__action .button{margin-top:18px}
  .closing__inner,.site-footer__inner{display:block}.closing .button{margin-top:25px}
  .site-footer__links{margin-top:25px}
  .books-grid{grid-template-columns:1fr;gap:53px}
  .book-card{grid-template-columns:minmax(0,.6fr) minmax(0,1fr);gap:18px}
  .book-card__cover{min-height:170px;padding:0}
  .book-card h3{font-size:1.15rem}.book-card p:not(.book-card__meta){font-size:13px}
  .book-world__intro{margin-bottom:35px}
  .book-detail{padding-block:75px}.book-detail__art{order:-1;padding:0}.book-detail__art img{width:min(60%,270px)}
  .quiz-area{padding-block:70px}.quiz-layout{gap:30px}
  .quiz-frame{padding:25px 20px}.quiz-answer{padding:14px}
  .modal{padding:62px 10px 12px}.modal__close{top:10px;right:10px}
  .modal__video{max-height:calc(100dvh - 82px);height:calc(100dvh - 82px)}
}
@media(max-width:390px){.book-card{grid-template-columns:1fr}.book-card__cover{max-width:260px}.book-card__copy{padding-bottom:0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
@media print{
  .site-header,.site-footer,.modal,.button,.quiz-side,.result-actions{display:none!important}
  body{background:white;color:black}.certificate{background:white;color:black;box-shadow:none}
  .certificate *{color:black!important}
}


/* 13 | Unified legal information pages: same navigation, same reading rhythm */
.legal-page{padding-block:clamp(72px,8vw,120px) clamp(92px,10vw,155px)}
.legal-heading{max-width:760px;margin-bottom:68px}
.legal-heading h1{margin:12px 0 21px;font-size:clamp(2.3rem,3.25vw,3.35rem)}
.legal-heading>p{font-size:18px;color:var(--quiet)}
.legal-grid{display:grid;grid-template-columns:minmax(180px,.28fr) minmax(0,.72fr);gap:clamp(35px,7vw,110px);align-items:start}
.legal-nav{display:grid;gap:14px;position:sticky;top:30px;border-top:1px solid var(--stroke);padding-top:22px}
.legal-nav a{font-size:14px;color:var(--quiet);padding:5px 0}
.legal-nav a:hover,.legal-nav a[aria-current]{color:var(--magenta)}
.legal-content{max-width:790px;min-width:0}
.legal-content h2{font-size:clamp(1.18rem,1.6vw,1.52rem);margin:38px 0 13px;line-height:1.3}
.legal-content h2:first-child{margin-top:0}
.legal-content p,.legal-content address,.legal-content li{font-size:15px;line-height:1.8;color:var(--mist)}
.legal-content p{margin-bottom:17px}
.legal-content address{font-style:normal;margin-bottom:20px}
.legal-content a{text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--magenta);overflow-wrap:anywhere}
.legal-content strong{color:var(--paper)}
.legal-content ul{padding-left:19px}
@media(max-width:820px){.legal-grid{grid-template-columns:1fr;gap:40px}.legal-nav{position:static;display:flex;flex-wrap:wrap;gap:18px}.legal-heading{margin-bottom:35px}}