/* svetvai.cz — Z nuly s AI. Vizuál „Svět v AI" (17. 9. 2026): teplý papír, EB Garamond + Inter, lokální fonty.
   Bez knihoven, bez backdrop-filter/blur/fixed pozadí/3D — lehké i pro slabé telefony. */

:root{
  --paper:#f7f2ea; --ink:#263f3e; --muted:#6c776c; --line:#dcd6c9; --sage:#dde2d1; --gold:#af764a; --white:#fffcf5;
  --btn:#294940; --btn-ink:#faf5e8; --accent:#798566; --copy:#667062; --dark-copy:#bdc8b8; --quiet:#5f6a5b;
  --serif:'EB Garamond',Georgia,'Times New Roman',serif;
  --sans:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;
  --ease:cubic-bezier(.22,.61,.21,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;overflow-x:clip}
body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.6 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:clip}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--gold);outline-offset:5px}
input:focus-visible{outline:none}
button,a{-webkit-tap-highlight-color:transparent}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
h1,h2,h3,p,ul{margin:0}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.02}
h2,h3{text-wrap:balance}
img{display:block;width:100%;height:auto}
[id]{scroll-margin-top:116px}
::selection{background:rgba(175,118,74,.22)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

.wrap{width:min(1256px,calc(100% - 112px));margin:auto}
.overline{font-size:10px;letter-spacing:2px;font-weight:600;text-transform:uppercase}
.quiet{color:var(--muted)}
.divider{height:1px;background:var(--line)}
.copy{font-size:13px;line-height:1.9;color:var(--copy);max-width:390px}
.copy b{font-weight:600;color:var(--ink)}
.copy+.copy{margin-top:16px}
.ar{display:inline-block;transition:transform .3s var(--ease)}
/* sazba: žádné jednoslovné poslední řádky (podporované prohlížeče; ostatní ignorují) */
.copy,.intro,.note,.card p,.closing p,.toc p,.toc-note,.qa .a,.audio p,.benefits li,.consent,.book p{text-wrap:pretty}

/* výkon: obrázky mimo hero lazy + srcset, žádné fixed pozadí/blur. content-visibility:auto záměrně NE — měřeno 17. 9.:
   výška dokumentu při scrollu kolísala o ~700 px (skákající posuvník, kotvy mimo cíl, rozbité fullpage snímky). */

/* ---------- hlavička ---------- */
.header{position:sticky;top:0;z-index:40;background:var(--paper);transition:box-shadow .35s var(--ease)}
.header .wrap{height:98px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}
.header.scrolled{box-shadow:0 1px 0 var(--line),0 12px 28px -20px rgba(38,63,62,.35)}
.brand{display:flex;align-items:center;gap:12px;font-size:14px;font-weight:650;letter-spacing:2px;white-space:nowrap}
.mark{width:30px;height:30px;display:grid;place-items:center;border:1px solid var(--ink);border-radius:50%;position:relative;flex:none;transition:transform .5s var(--ease)}
.mark:after{content:'';position:absolute;bottom:5px;left:5px;right:5px;border-top:1px solid var(--ink)}
.mark:before{content:'';height:9px;width:9px;border:1px solid var(--ink);border-radius:50%;margin-top:-6px}
.brand:hover .mark{transform:rotate(-12deg)}
.nav{display:flex;gap:32px;align-items:center;font-size:12px}
.nav a{position:relative;padding:13px 0}
.nav a:not(.outline):after{content:'';position:absolute;left:0;right:0;bottom:8px;height:1px;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
.nav a:not(.outline):hover:after{transform:scaleX(1)}
.nav .outline{border:1px solid #99a392;border-radius:50px;padding:0 21px;min-height:44px;display:inline-flex;align-items:center;gap:8px;white-space:nowrap;transition:background .3s var(--ease),border-color .3s var(--ease),color .3s var(--ease)}
.nav .outline:hover{background:var(--ink);border-color:var(--ink);color:var(--btn-ink)}
.nav .outline:hover .ar{transform:translate(2px,-2px)}

/* ---------- tlačítka ---------- */
.btn{display:inline-flex;justify-content:center;align-items:center;gap:20px;background:var(--btn);color:var(--btn-ink);border-radius:50px;padding:16px 25px;font-size:12px;font-weight:550;line-height:1.2;white-space:nowrap;transition:background .3s var(--ease),transform .3s var(--ease),box-shadow .3s var(--ease)}
.btn:hover{background:#1d3530;transform:translateY(-1px);box-shadow:0 14px 26px -16px rgba(38,63,62,.6)}
.btn:active{transform:translateY(0);box-shadow:none}
.btn:hover .ar{transform:translate(2px,-2px)}
.btn-light{background:#f0e7d4;color:var(--ink)}
.btn-light:hover{background:var(--white);box-shadow:0 14px 26px -16px rgba(0,0,0,.5)}
/* textový odkaz s linkou: dotyková plocha 44 px, linka zůstává těsně pod textem */
.secondary{position:relative;display:inline-block;font-size:12px;line-height:1.2;padding:15px 0}
.secondary:after{content:'';position:absolute;left:0;right:0;bottom:8px;border-top:1px solid #b2b8a5;transition:border-color .3s var(--ease)}
.secondary:hover:after{border-color:var(--ink)}
.line-link{display:inline-flex;align-items:center;gap:30px;font-size:11px;border-bottom:1px solid #a4ae96;padding:18px 0 9px;transition:border-color .3s var(--ease)}
.line-link:hover{border-color:var(--ink)}
.line-link:hover .ar{transform:translate(2px,-2px)}

/* ---------- hero ---------- */
.hero{min-height:682px;display:grid;grid-template-columns:1.12fr 1fr;align-items:center;position:relative;padding-top:26px;padding-bottom:42px}
/* titulek roste se sloupcem (wrap = 100 % − 112 px), ne s viewportem: kurzívní řádek „Měl notebook a AI." (≈7,1 × velikost − 36 px)
   musí zůstat ≥ 25 px od obálky na všech šířkách 801–1920 px; strop 88 px při wrapu 1256 px */
.hero h1{font-size:clamp(44px,calc(7.3vw - 12px),88px);letter-spacing:-2px;margin:21px 0 25px;line-height:.92}
.hero h1 i{font-style:italic;font-weight:400;color:var(--accent)}
.intro{font-size:15px;line-height:1.85;max-width:395px;color:#5e6c61}
.buttons{display:flex;align-items:center;gap:25px;margin:26px 0 19px;flex-wrap:wrap}
.note{font-size:12px;line-height:1.65;color:var(--quiet)}
.note b{font-weight:600;color:#4d5a4f}
.hero-visual{position:relative;align-self:stretch;display:flex;align-items:center;justify-content:flex-start;min-width:0}
.hero-visual img{width:112%;max-width:none;mix-blend-mode:multiply;margin-left:-45px}
.vertical{position:absolute;right:-1px;top:134px;writing-mode:vertical-rl;font-size:9px;letter-spacing:2.4px;color:#86907d}
.book-caption{position:absolute;bottom:30px;left:90px;color:#66705f;display:flex;align-items:center;gap:15px;font-size:10px;white-space:nowrap}
.book-caption:before{content:'';width:36px;border-top:1px solid #a7ad96}

/* vstup hera po načtení (jen opacity/transform) */
@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes cover-in{from{opacity:0;transform:translateY(26px) scale(1.02)}to{opacity:1;transform:none}}
.hero .overline,.hero h1,.hero .intro,.hero .buttons,.hero .note{animation:rise .9s var(--ease) both}
.hero .overline{animation-delay:.05s}
.hero h1{animation-delay:.14s}
.hero .intro{animation-delay:.26s}
.hero .buttons{animation-delay:.36s}
.hero .note{animation-delay:.46s}
.hero-visual img{animation:cover-in 1.1s var(--ease) .2s both}
.vertical,.book-caption{animation:rise .8s var(--ease) .75s both}

/* ---------- ticker ---------- */
.ticker{display:flex;justify-content:space-between;gap:18px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:19px 0;font-size:11px;letter-spacing:.3px;color:var(--quiet)}
.ticker span{display:flex;align-items:center;gap:12px;white-space:nowrap}
.ticker span:before{content:'✳';color:#ab7e4d;flex:none}

/* ---------- příběh ---------- */
.story{padding:89px 0 78px;display:grid;grid-template-columns:1fr 1fr;gap:86px;align-items:center}
.story-art{position:relative}
.story-art img{aspect-ratio:1.26;object-fit:cover;border-radius:150px 150px 8px 8px}
.image-note{position:absolute;left:22px;bottom:18px;color:#fff9eb;font-size:9px;letter-spacing:1.2px;text-transform:uppercase}
.story h2{font-size:55px;margin:20px 0}
.story .copy{max-width:470px}

/* ---------- co se naučíš ---------- */
.learn{padding:74px 0 82px}
.section-top{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:35px;gap:30px}
.section-top h2{font-size:51px;margin-top:18px}
.section-top .copy{max-width:270px;font-size:12px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:46px 28px}
.card .art{aspect-ratio:1.6;border-radius:7px;overflow:hidden;margin-bottom:20px;background:var(--sage)}
.card .art img{height:100%;object-fit:cover;transition:transform .4s var(--ease)}
.card:hover .art img{transform:scale(1.03)}
.card .num{font-size:9px;color:#8a6538;letter-spacing:2px;display:block;margin-bottom:9px;text-transform:uppercase}
.card h3{font-size:29px;margin-bottom:11px;line-height:1.05}
.card p{font-size:12px;line-height:1.85;color:#667263;max-width:320px}
/* typografická dlaždice = „stránka z knihy" (stejný dvojitý rámeček jako karta ukázky) */
.card .art.tile{position:relative;display:grid;place-items:center;padding:24px 22px 40px;background:var(--white);border:1px solid var(--line);font-family:var(--serif);color:var(--ink);text-align:center}
.tile:before{content:'';position:absolute;inset:10px;border:1px solid var(--line);border-radius:4px;pointer-events:none}
.tile-q{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;font-size:clamp(34px,3vw,46px);line-height:1;letter-spacing:-.5px;transition:transform .4s var(--ease)}
.tile-q i{font-style:normal;color:var(--gold);font-size:.6em}
.tile-q b{font-weight:400;color:var(--accent)}
.tile-sys{font-style:italic;font-size:clamp(28px,2.5vw,36px);line-height:1.1;letter-spacing:-.3px;color:var(--muted);transition:transform .4s var(--ease)}
.tile-note{position:absolute;left:22px;bottom:16px;font-family:var(--sans);font-size:9px;letter-spacing:1.2px;text-transform:uppercase;color:var(--muted)}
.card:hover .tile-q,.card:hover .tile-sys{transform:scale(1.03)}

/* ---------- ukázka (stránka z knihy) ---------- */
.excerpt{padding:80px 0 90px}
.excerpt .section-top{display:block;text-align:center;margin-bottom:44px}
.excerpt-art{position:relative;max-width:720px;margin:0 auto 18px;border-radius:8px;overflow:hidden;background:var(--sage)}
.excerpt-art img{aspect-ratio:2.2;object-fit:cover;object-position:50% 52%}
.excerpt-art .image-note,.audio-img .image-note{color:var(--ink)}
.excerpt-art .image-note{left:auto;right:22px}
.book{max-width:720px;margin:0 auto;background:var(--white);border:1px solid var(--line);border-radius:8px;padding:56px 64px 48px;position:relative}
.book:before{content:'';position:absolute;inset:10px;border:1px solid var(--line);border-radius:4px;pointer-events:none}
.book .ch{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--muted);font-weight:600;margin-bottom:28px;text-align:center}
.book p{font-family:var(--serif);font-size:19px;line-height:1.72;color:#334b48;margin:0 0 1.1em}
.book .ch+p::first-letter{float:left;font-size:66px;line-height:.78;padding:7px 10px 0 0;color:var(--ink)}
.book .chat{color:var(--ink);font-style:italic}
.book .sys{color:var(--muted);font-style:italic}
.book .fade{-webkit-mask-image:linear-gradient(180deg,#000 55%,transparent);mask-image:linear-gradient(180deg,#000 55%,transparent)}
.book .more{text-align:center;margin-top:10px}

/* ---------- obsah knihy ---------- */
.toc-sec{padding:80px 0}
.toc{margin-top:40px;border-top:1px solid var(--line)}
.toc .row{display:grid;grid-template-columns:96px 1fr;gap:24px;padding:30px 0;border-bottom:1px solid var(--line);align-items:start}
.toc .k{font-family:var(--serif);font-size:44px;line-height:1;color:var(--gold)}
.toc h3{font-size:27px;margin-bottom:8px}
.toc p{font-size:12px;line-height:1.85;color:var(--copy);max-width:640px}
.toc-note{margin-top:24px;font-family:var(--serif);font-style:italic;font-size:17px;color:var(--muted)}

/* ---------- cena (tmavý panel) ---------- */
.price{padding:80px 0 0}
.audio{background:var(--ink);color:#f0e7d4;border-radius:12px;overflow:hidden;display:grid;grid-template-columns:1.3fr 1fr;min-height:360px;margin-bottom:80px}
.audio-img{position:relative;min-height:320px}
.audio-img img{position:absolute;inset:0;height:100%;object-fit:cover;object-position:45% 50%}
.audio-copy{padding:40px 44px 34px}
.audio h2{font-size:40px;margin:14px 0 10px;color:#f7efe0}
.audio p{font-size:12px;line-height:1.85;max-width:370px;color:var(--dark-copy)}
.tags{display:flex;gap:10px;flex-wrap:wrap;margin-top:23px}
.tag{border:1px solid #657669;border-radius:50px;padding:6px 11px;font-size:9px;color:#d4dacb;letter-spacing:1px;text-transform:uppercase;display:inline-block}
.tag-strong{background:#f0e7d4;border-color:#f0e7d4;color:var(--ink);font-weight:600}
.price-line{display:flex;align-items:baseline;gap:12px;margin:0 0 22px}
.price-line .amount{font-family:var(--serif);font-size:58px;line-height:1;color:#f7efe0;letter-spacing:-1px}
.price-line .approx{font-size:12px;color:var(--dark-copy);white-space:nowrap}
.benefits{list-style:none;padding:0;margin:0 0 28px;display:flex;flex-direction:column;gap:10px}
.benefits li{position:relative;padding-left:22px;font-size:12px;line-height:1.7;color:#d4dacb}
.benefits li:before{content:'✳';position:absolute;left:0;top:0;color:var(--gold)}
.benefits b{color:#f7efe0;font-weight:600}
.audio .audio-note{margin-top:22px;font-size:11px;color:#a9b5aa}
/* odkaz v poznámce musí vypadat jako odkaz, jinak ho nikdo neklikne */
.audio .audio-note a{color:var(--white);border-bottom:1px solid #6d7d6f;padding-bottom:2px;transition:border-color .3s var(--ease)}
.audio .audio-note a:hover{border-color:var(--white)}

/* ---------- kapitola zdarma ---------- */
.zdarma{padding:0 0 80px}
.free{background:var(--sage);border-radius:12px;padding:56px;display:grid;grid-template-columns:1.1fr 1fr;gap:56px;align-items:center}
.free h2{font-size:40px;margin:16px 0 14px}
.free .copy{max-width:440px;color:#4f5a4d}
.lead-form{display:flex;flex-direction:column;gap:12px}
/* 16 px = práh, pod kterým iOS Safari při fokusu přizoomuje stránku (webs-no-zoom) */
.lead-form input{width:100%;padding:14px 22px;border-radius:50px;border:1px solid #b2b8a5;background:var(--white);color:var(--ink);font:inherit;font-size:16px;transition:border-color .3s var(--ease),box-shadow .3s var(--ease)}
.lead-form input::placeholder{color:#6c776c}
.lead-form input:focus{border-color:var(--ink);box-shadow:0 0 0 3px rgba(38,63,62,.12)}
.lead-form .btn{margin-top:4px}
.consent{font-size:12px;line-height:1.65;color:#4f5a4d;margin-top:14px}
.consent a{text-decoration:underline;text-underline-offset:3px;display:inline-block;padding:14px 0;margin:-14px 0}

/* ---------- závěr ---------- */
.closing{padding:0 0 80px;text-align:center}
.closing-art{border-radius:12px;overflow:hidden;margin-bottom:56px}
.closing-art img{aspect-ratio:2;object-fit:cover;object-position:50% 38%}
.closing .inner{max-width:780px;margin:0 auto;padding:0 24px}
.closing .overline{color:#9c784d}
.closing h2{font-size:52px;margin:20px 0 15px}
.closing p{font-size:12px;line-height:1.85;color:var(--copy);max-width:510px;margin:0 auto 26px}
.closing .buttons{justify-content:center;margin:0}

/* ---------- otázky ---------- */
.faq-sec{padding:0 0 90px}
.faq{max-width:820px;margin:36px auto 0;border-top:1px solid var(--line)}
.faq-sec .section-top{display:block;text-align:center;margin-bottom:0}
.qa{border-bottom:1px solid var(--line)}
.qa summary{list-style:none;cursor:pointer;padding:24px 0;font-family:var(--serif);font-size:24px;line-height:1.2;display:flex;justify-content:space-between;align-items:center;gap:20px}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:'+';color:var(--gold);font-family:var(--sans);font-size:22px;line-height:1;transition:transform .3s var(--ease);flex:none}
.qa summary:hover{color:#1d3530}
.qa summary:hover::after{transform:scale(1.2)}
.qa[open] summary::after{transform:rotate(45deg)}
.qa[open] summary:hover::after{transform:rotate(45deg) scale(1.2)}
.qa .a{padding:0 0 26px;font-size:13px;line-height:1.85;color:var(--copy);max-width:680px}

/* ---------- patička ---------- */
.footer{border-top:1px solid var(--line);padding:26px 0 33px;display:flex;justify-content:space-between;align-items:center;font-size:9px;color:var(--quiet);gap:20px}
.footer .brand{font-size:11px}
.footer .mark{width:24px;height:24px}
.footer .mark:before{width:7px;height:7px}
.footer .principle{font-family:var(--serif);font-style:italic;font-size:14px;color:var(--muted)}

/* ---------- reveal-on-scroll (jen opacity/translate; bez JS zůstává vše viditelné) ---------- */
html.js .reveal{opacity:0;transform:translateY(14px);transition:opacity .5s var(--ease),transform .5s var(--ease)}
html.js .reveal.d1{transition-delay:.08s}
html.js .reveal.d2{transition-delay:.16s}
html.js .reveal.in{opacity:1;transform:none}

/* ---------- tablet: ticker 2×2, ať nic nepřetéká; tmavý panel pod 1100 px v jednom sloupci (jinak obrázek úzký a uříznutý) ---------- */
@media(max-width:1200px){
  .ticker{display:grid;grid-template-columns:1fr 1fr;gap:14px 24px}
  .ticker span{white-space:normal;align-items:flex-start}
}
@media(max-width:1100px){
  .audio{grid-template-columns:1fr}
  .audio-img{min-height:0;aspect-ratio:1.9}
}

/* ---------- mobil ---------- */
@media(max-width:800px){
  .wrap{width:calc(100% - 40px)}
  [id]{scroll-margin-top:92px}
  .header .wrap{height:76px}
  .nav{gap:14px}
  .nav>a:not(.outline){display:none}
  .nav .outline{padding:0 16px;font-size:11px}
  .brand{font-size:11px;gap:9px}
  .hero{grid-template-columns:1fr;padding-top:38px;padding-bottom:16px;min-height:0}
  /* 3 řádky jako v návrhu — kurzívní pointa „Měl notebook a AI." se NIKDY neláme. Měřeno 17. 9.: jednořádková
     do 47 px @360, 52 px @390, 57 px @430 → 13,3 vw = 48/52/57 px; od 600 px strop 80 px (sloupec ≥ 560 px) */
  .hero h1{font-size:clamp(40px,13.3vw,80px);line-height:.95;margin-top:21px}
  .intro{font-size:14px;max-width:410px}
  .buttons{gap:20px}
  .hero-visual{display:block;margin:18px -20px 0;overflow:hidden;align-self:auto}
  .hero-visual img{width:112%;margin:0 0 0 -6%}
  .vertical{right:18px;top:32px}
  .book-caption{position:static;padding:12px 0 0 20px}
  .ticker{display:grid;grid-template-columns:1fr 1fr;font-size:11px;gap:14px 8px}
  .ticker span{white-space:normal;align-items:flex-start;gap:7px}
  .note,.consent{font-size:12px}
  .story{grid-template-columns:1fr;gap:35px;padding:52px 0}
  .story-art img{max-height:370px;aspect-ratio:1.3}
  .story h2{font-size:46px}
  .copy,.story .copy,.section-top .copy,.free .copy{font-size:13px;max-width:none}
  .learn{padding:50px 0}
  .section-top{display:block}
  .section-top h2{font-size:43px}
  .section-top .copy{margin-top:20px}
  .cards{grid-template-columns:1fr;gap:35px}
  .card .art{margin-bottom:16px}
  .card h3{font-size:31px}
  .card p{font-size:13px;max-width:none}
  .excerpt{padding:52px 0 60px}
  .excerpt .section-top{margin-bottom:30px}
  .excerpt-art img{aspect-ratio:1.6}
  .book{padding:34px 22px 30px}
  .book p{font-size:17px}
  .toc-sec{padding:52px 0}
  .toc .row{grid-template-columns:52px 1fr;gap:14px;padding:22px 0}
  .toc .k{font-size:34px}
  .toc h3{font-size:24px}
  .toc p{font-size:13px}
  .price{padding:52px 0 0}
  .audio{grid-template-columns:1fr;margin-bottom:50px}
  .audio-img{min-height:0;aspect-ratio:auto;height:250px}
  .audio-copy{padding:32px 25px 36px}
  .audio h2{font-size:38px}
  .zdarma{padding-bottom:50px}
  .free{grid-template-columns:1fr;padding:32px 22px;gap:28px}
  .free h2{font-size:34px}
  .closing{padding-bottom:50px}
  .closing-art{margin-bottom:36px}
  .closing-art img{aspect-ratio:1.45}
  .closing h2{font-size:42px}
  .closing .inner{padding:0}
  .faq-sec{padding-bottom:60px}
  .qa summary{font-size:20px;padding:18px 0}
  .footer{align-items:flex-start;gap:20px;flex-direction:column;font-size:10px}
}
@media(max-width:420px){
  .hero-visual img{width:118%;margin-left:-9%}
  .vertical{right:14px}
  .buttons .btn{width:100%}
}

/* ---------- bez pohybu ---------- */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  html.js .reveal{opacity:1;transform:none}
}

/* ---------- kolo 2 (2. 10. 2026) ---------- */
/* věta o platbě pod nákupními tlačítky (A3) */
.platba{margin:14px 0 0;font-size:14px;line-height:1.6;color:#4f5a4d;max-width:440px}
.audio .platba{font-size:14px;color:#d4dacb;max-width:370px}
/* v hero a závěru stojí věta v řadě tlačítek: na šíři pod oběma, na mobilu hned pod hlavním tlačítkem;
   max-width:none, aby byla vždy na vlastním řádku (s 440 px se kolem 800 px vešla vedle tlačítek) */
.buttons .platba{order:3;flex-basis:100%;max-width:none;margin:-12px 0 0}
.closing .buttons .platba{margin:-12px auto 0}
@media(max-width:420px){.buttons .platba{order:1;margin:-10px 0 0}.buttons .secondary{order:2}.closing .buttons .platba{margin:-10px auto 0}}
.book .more .platba{margin:12px auto 0;font-family:var(--sans);font-size:14px;line-height:1.6;color:#4f5a4d}
/* karta za 1 €: audiokniha a balíček ve vlastním rámečku, zřetelně odděleně od knihy (A1) */
.audio-extra{margin-top:30px;padding:20px 22px 22px;border:1px solid rgba(240,231,212,.3);border-radius:12px;background:rgba(240,231,212,.07)}
.audio-extra .tag{border-color:var(--gold);color:#f0e7d4}
.audio-extra .audio-note{margin-top:14px;font-size:13px;line-height:1.7;color:#d4dacb}
.audio-extra .audio-note b{color:#f7efe0;font-weight:650}
@media(max-width:420px){.audio-extra{padding:18px 16px 20px}}
/* jednotky ve verzálkovém štítku malými, stejně jako „Kč“ (A6) */
.malym{text-transform:none}
.nezlom{white-space:nowrap}
.line-link:hover .ar{transform:translateX(3px)}
/* popisy kapitol a podtext závěru: čitelně a s kontrastem AA (A8) */
.toc p,.closing p{font-size:15px;line-height:1.75;color:#4f5a4d}
/* svislý popisek na mobilu ležel přes obrázek knihy (A8) */
@media(max-width:800px){.vertical{display:none}}
/* na desktopu ležel přes pravý okraj obrázku knihy (A8): obrázek přesahuje sloupec o 12 % − 45 px,
   popisek (14 px) proto stojí 4 px za jeho pravým okrajem: right = 45 − 4 − 14 px − 12 % = 27 px − 12 % */
.vertical{right:calc(27px - 12%)}
/* 801–960 px: obrázek knihy přesahem 45 px doleva zajížděl pod text hero, pod úvodní odstavec a větu o platbě
   (oči 2d; měřeno 801–915 px, úvodní odstavec i na živém webu). Tady zůstává ve svém sloupci 20 px od textu
   a popisek stojí 4 px za jeho pravým okrajem: right = −4 − 14 px */
@media(min-width:801px) and (max-width:960px){.hero-visual img{width:calc(100% - 20px);margin-left:20px}.vertical{right:-18px}}
/* 1281–1380 px: okraj stránky je tu jen 56 až 62 px a obrázek ho přesahem 12 % − 45 px zabral až po 30 px od okraje okna,
   takže popisek za obrázkem stál jen 12 px od okraje (1368 px). Tady obrázek přesahuje sloupec nejvýš o 20 px
   a popisek stojí 4 px za ním: right = −20 − 4 − 14 px. Od okraje okna má tak aspoň 18 px */
@media(min-width:1281px) and (max-width:1380px){.hero-visual img{width:calc(100% + 65px)}.vertical{right:-38px}}
/* desktop: lístek byl přišpendlený ke spodku hero, ne ke kresbě. Na 801–960 px stál 142–166 px pod ní, na 961–1100 px 98–121 px
   a svislý popisek začínal až 78 px nad kresbou (oči 2f; na živém webu 121–147 px a 59 px). Sloupec se proto stáhne na výšku kresby.
   Lístek stojí 24 px + 7,5 % její výšky pod ní (38 px na 801 px, 55 px na 1440 px jako dosud). Popisek (218 px, nezalamuje se)
   začíná 34 px pod horní hranou kresby jako dosud na 1440 px, a kde je kresba nižší, stojí na jejím středu */
@media(min-width:801px){.hero-visual{align-self:center}.vertical{top:min(34px,calc(50% - 109px));white-space:nowrap}.book-caption{bottom:calc(-40px - 7.5%)}}
/* věta o platbě se láme do vyrovnaných řádků, ať na posledním nezůstane samotné slovo (oči 2f: „odkaz.“ na 900 px) */
.platba{text-wrap:balance}
/* od 961 px přesahuje obrázek knihy 45 px doleva do sloupce s textem. Jednořádková věta o platbě pod tlačítky (430 px)
   do něj na 1008–1010 px zasahovala o 1–2 px a na 1019–1024 px se o roh kresby opticky opírala (hustý průchod a oči 2f).
   Končí proto aspoň 35 px před kresbou, podobně jako nadpis: 100 % − 45 − 35 px. Kde se nevejde (961–1077 px), má dva řádky */
@media(min-width:961px){.hero .buttons .platba{max-width:calc(100% - 80px)}}
/* ilustrace v závěru: rám 2:1 usekl vrchol oblouku i květináč a sedák židle (A8); 1,6:1 je poměr kresby,
   nic se neusekne. Na mobilu (1,45) se ořezávají jen boky, nejvýš 4,7 % z každé strany, kde nic důležitého není */
@media(min-width:801px){.closing-art img{aspect-ratio:1.6}}