@font-face{font-family:"Lora";src:url(fonts/Lora-Regular.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Lora";src:url(fonts/Lora-Italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Lora";src:url(fonts/Lora-SemiBold.woff2) format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Lora";src:url(fonts/Lora-Bold.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Plex";src:url(fonts/IBMPlexSans-Regular.woff) format("woff");font-weight:400;font-display:swap}
@font-face{font-family:"Plex";src:url(fonts/IBMPlexSans-Medium.woff) format("woff");font-weight:500;font-display:swap}
@font-face{font-family:"Plex";src:url(fonts/IBMPlexSans-SemiBold.woff) format("woff");font-weight:600;font-display:swap}

:root{
  --paper:#F5EEDF; --paper-2:#ECE1CB; --card:#FBF6EC; --ink:#2A211B; --ink-2:#5B4B3E;
  --rust:#8C2F1C; --rust-d:#71230F; --moss:#2F4426; --moss-2:#4E6B3A; --line:#D8C8AA;
  --serif:"Lora",Georgia,"Times New Roman",serif; --sans:"Plex",-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --wrap:1120px; --r:16px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}
body{margin:0;background:var(--paper);color:var(--ink);font:400 18px/1.6 var(--sans);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--rust);text-underline-offset:3px;text-decoration-thickness:1px}
a:hover{color:var(--rust-d)}
::selection{background:var(--rust);color:var(--paper)}
:focus-visible{outline:3px solid var(--rust);outline-offset:3px;border-radius:6px}
html{scrollbar-color:#B9A584 var(--paper)}
h1,h2,h3{font-family:var(--serif);font-weight:600;line-height:1.12;margin:0;text-wrap:balance;color:var(--ink)}
h2{font-size:clamp(30px,4.2vw,46px);letter-spacing:-.01em}
h3{font-size:22px}
p{margin:0 0 1em}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 20px}
.lead{font-size:20px;color:var(--ink-2);max-width:62ch}
.sec{padding:96px 0}
.sec-head{max-width:720px;margin-bottom:40px}
.sec-head p{margin-top:14px}
@media (max-width:720px){.sec{padding:60px 0}.sec-head{margin-bottom:28px}body{font-size:17px}.lead{font-size:18px}}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:var(--rust);color:#FBF3E6;border:0;border-radius:12px;padding:18px 30px;font:600 19px/1.2 var(--sans);text-decoration:none;cursor:pointer;box-shadow:0 6px 18px -8px rgba(113,35,15,.55);transition:background .15s,transform .1s}
.btn:hover{background:var(--rust-d);color:#FBF3E6}
.btn:active{transform:translateY(1px)}
.btn.light{background:var(--paper);color:var(--rust);box-shadow:none}
.btn.light:hover{background:#fff}
.textlink{font-weight:500;color:var(--ink);text-decoration:underline;text-decoration-color:var(--line)}
/* главная кнопка: крупная, с ценником-биркой и редким бликом */
.btn-xl{position:relative;overflow:hidden;isolation:isolate;min-height:76px;padding:10px 10px 10px 32px;gap:24px;border-radius:18px;font-size:23px;justify-content:space-between;box-shadow:0 18px 34px -14px rgba(113,35,15,.75),0 2px 0 var(--rust-d)}
.btn-xl .tag{background:var(--paper);color:var(--rust-d);border-radius:12px;padding:16px 18px;font:600 24px/1 var(--serif);white-space:nowrap;outline:1.5px dashed rgba(140,47,28,.5);outline-offset:-6px}
.btn-xl::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(105deg,transparent 35%,rgba(255,236,214,.32) 50%,transparent 65%);transform:translateX(-100%);animation:shine 6s ease-in-out 1.5s infinite}
.btn-xl:hover .tag{background:#fff}
.btn-xl:disabled{opacity:.8;cursor:progress;justify-content:center}
@keyframes shine{0%{transform:translateX(-100%)}16%,100%{transform:translateX(100%)}}
@media (max-width:440px){.btn-xl{min-height:68px;padding-left:22px;gap:14px;font-size:20px}.btn-xl .tag{font-size:21px;padding:14px 14px}}

/* header */
.top{position:relative;z-index:2}
.top .wrap{display:flex;align-items:center;justify-content:space-between;height:72px}
.brand{font:600 22px/1 var(--serif);color:var(--ink);text-decoration:none}
.brand small{display:block;font:400 13px/1.3 var(--sans);color:var(--ink-2);margin-top:4px}
.top .buy{font-weight:600;color:#FBF3E6;background:var(--rust);text-decoration:none;border-radius:12px;padding:11px 20px;font-size:17px;box-shadow:0 8px 18px -10px rgba(113,35,15,.7)}
.top .buy:hover{background:var(--rust-d);color:#FBF3E6}
@media (max-width:520px){.top .buy span{display:none}}

/* hero */
.hero{padding:28px 0 88px}
.hero .wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
.hero h1{font-size:clamp(46px,7.2vw,88px);line-height:1.0;letter-spacing:-.02em;font-weight:600}
.hero .promise{font:400 clamp(20px,2.2vw,25px)/1.45 var(--serif);margin:20px 0 28px;max-width:30ch}
.hero .quote{font:italic 400 19px/1.5 var(--serif);color:var(--moss-2);margin:34px 0 0;padding-top:22px;border-top:1px solid var(--line);max-width:30ch}
.hero .quote span{display:block;font:400 15px/1.4 var(--sans);font-style:normal;color:var(--ink-2);margin-top:4px}
.hero .actions{display:flex;flex-direction:column;align-items:flex-start;gap:14px;max-width:470px}
.hero .actions .btn-xl{width:100%}
.hero .note{font-size:15px;color:var(--ink-2);margin:0;max-width:46ch}
.hero-pic{position:relative;margin:0 0 0 auto;max-width:500px}
.hero-pic .photo{border-radius:22px;overflow:hidden;aspect-ratio:4/5;box-shadow:0 30px 60px -30px rgba(42,33,27,.45)}
.hero-pic .photo img{width:100%;height:100%;object-fit:cover;object-position:50% 25%}
.hero-pic .book{position:absolute;left:-46px;bottom:-34px;width:44%;transform:rotate(-5deg);border-radius:4px;box-shadow:0 2px 3px rgba(42,33,27,.25),0 22px 40px -12px rgba(42,33,27,.55);border:1px solid rgba(0,0,0,.08)}
@media (max-width:900px){
  .hero{padding:8px 0 64px}
  .hero .wrap{grid-template-columns:1fr;gap:40px}
  .hero-pic{margin:0 auto;max-width:440px;padding-left:22px}
  .hero-pic .book{left:0;bottom:-26px;width:42%}
}

/* recognise */
.know ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0 48px;border-top:1px solid var(--line)}
.know li{padding:22px 0 22px 34px;border-bottom:1px solid var(--line);font:400 21px/1.45 var(--serif);position:relative}
.know li::before{content:"";position:absolute;left:4px;top:33px;width:12px;height:12px;border:2px solid var(--rust);transform:rotate(45deg)}
.know .after{margin-top:34px;font-size:20px;max-width:64ch}
@media (max-width:720px){.know ul{grid-template-columns:1fr}.know li{font-size:19px;padding:18px 0 18px 30px}.know li::before{top:27px}}

/* contents: map + sections */
.contents{background:var(--paper-2)}
.map-grid{display:grid;grid-template-columns:300px 1fr;gap:56px;align-items:start}
.figure{position:sticky;top:24px}
.figure svg{width:100%;height:auto;max-height:78vh}
.figure .cap{font-size:15px;color:var(--ink-2);text-align:center;margin-top:8px}
.dot circle{fill:var(--moss-2);stroke:var(--paper-2);stroke-width:2;transition:fill .15s}
.dot text{fill:#fff;font:600 11px var(--sans);text-anchor:middle;dominant-baseline:central;pointer-events:none}
.dot:hover circle,.dot:focus-visible circle{fill:var(--rust)}
.dot:focus-visible{outline:none}
.secs{list-style:none;margin:0;padding:0}
.secs li{display:grid;grid-template-columns:150px 1fr;gap:22px;padding:22px;scroll-margin-top:24px;transition:background .2s;border-top:1px solid var(--line)}
.secs li:first-child{border-top-color:transparent}
.secs li:target{background:var(--card);border-radius:var(--r);border-top-color:transparent;box-shadow:0 0 0 2px var(--rust) inset}
.secs li:target+li{border-top-color:transparent}
.secs img{border-radius:12px;aspect-ratio:16/10;object-fit:cover;width:100%}
.secs .n{display:inline-flex;width:28px;height:28px;border-radius:50%;background:var(--moss-2);color:#fff;font:600 14px/28px var(--sans);justify-content:center;margin-right:10px;vertical-align:3px}
.secs h3{display:inline}
.secs .count{font-size:15px;color:var(--ink-2);margin:6px 0 8px}
.secs .ex{margin:0;font-size:17px}
@media (max-width:900px){
  .map-grid{grid-template-columns:1fr;gap:20px}
  .figure{position:relative;top:0;max-width:300px;margin:0 auto}
  .figure svg{max-height:360px}
  .secs li{grid-template-columns:96px 1fr;gap:16px;padding:16px 8px}
  .secs h3{font-size:20px}
}

/* extras */
.extras-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:34px 28px}
.extra img{border-radius:4px;box-shadow:0 2px 3px rgba(42,33,27,.18),0 18px 34px -16px rgba(42,33,27,.45);margin-bottom:18px;aspect-ratio:1/1.414;object-fit:cover;background:#fff}
.extra h3{font-size:20px;margin-bottom:6px}
.extra p{font-size:16px;color:var(--ink-2);margin:0}
.gift{display:grid;grid-template-columns:220px 1fr;gap:28px;align-items:center;margin-top:56px;padding-top:40px;border-top:1px solid var(--line)}
.gift img{border-radius:6px;box-shadow:0 14px 30px -14px rgba(42,33,27,.5)}
.gift h3{margin-bottom:6px}
.gift p{margin:0;color:var(--ink-2)}
@media (max-width:900px){.extras-grid{grid-template-columns:1fr 1fr;gap:28px 18px}.extra h3{font-size:18px}.extra p{font-size:15px}.gift{grid-template-columns:120px 1fr;gap:18px}}

/* pages preview */
.pages{background:var(--paper-2)}
.pages-row{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
.pages-row figure{margin:0}
.pages-row a{display:block;border-radius:4px;overflow:hidden;box-shadow:0 2px 3px rgba(42,33,27,.18),0 22px 40px -18px rgba(42,33,27,.5);background:#fff}
.pages-row a img{transition:transform .3s}
.pages-row a:hover img{transform:scale(1.02)}
.pages-row figcaption{margin-top:14px;font-size:16px;color:var(--ink-2)}
.pages-row figcaption b{display:block;color:var(--ink);font:600 18px/1.3 var(--serif);margin-bottom:2px}
@media (max-width:900px){.pages-row{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:18px;padding:4px 20px 18px;margin:0 -20px}.pages-row figure{flex:0 0 74%;scroll-snap-align:center}}

/* strip */
.strip{background:var(--moss);color:#F2EBDC;border-radius:20px;padding:34px 40px;display:flex;gap:28px;align-items:center;justify-content:space-between;margin-top:64px}
.strip p{margin:0;font:400 21px/1.45 var(--serif);max-width:54ch}
@media (max-width:720px){.strip{flex-direction:column;align-items:flex-start;padding:26px 22px}.strip p{font-size:19px}}

/* price */
.price-sec{padding-top:110px}
.ticket{background:var(--card);border:1px solid var(--line);border-radius:22px;position:relative;overflow:hidden;box-shadow:0 30px 60px -40px rgba(42,33,27,.45)}
.ticket::before{content:"";display:block;height:27px;background:url(img/stitch.svg) repeat-x center/auto 27px;border-bottom:1px solid var(--line);opacity:.9}
.ticket-body{display:grid;grid-template-columns:1.1fr .9fr;gap:0}
.ticket .what{padding:40px 44px;border-right:1px dashed var(--line)}
.ticket .what h2{margin-bottom:22px}
.checks{list-style:none;margin:0;padding:0}
.checks li{position:relative;padding:9px 0 9px 36px;font-size:17px;border-bottom:1px solid #E7DCC6}
.checks li:last-child{border-bottom:0}
.checks li::before{content:"";position:absolute;left:2px;top:15px;width:18px;height:10px;border-left:2.5px solid var(--moss-2);border-bottom:2.5px solid var(--moss-2);transform:rotate(-45deg)}
.checks b{font-weight:600}
.ticket .pay{padding:40px 44px;display:flex;flex-direction:column}
.amount{font:600 68px/1 var(--serif);letter-spacing:-.02em;color:var(--ink)}
.amount small{font-size:.5em;font-weight:400;margin-left:4px}
.once{font-size:16px;color:var(--ink-2);margin:10px 0 26px}
.field label{display:block;font-weight:600;font-size:16px;margin-bottom:8px}
.field input{width:100%;font:400 19px/1.3 var(--sans);padding:15px 16px;border:1.5px solid #BFAE8E;border-radius:12px;background:#fff;color:var(--ink)}
.field input:focus{outline:none;border-color:var(--rust);box-shadow:0 0 0 3px rgba(140,47,28,.18)}
.agree{display:flex;gap:12px;align-items:flex-start;font-size:15px;line-height:1.45;margin:16px 0 22px;color:var(--ink-2)}
.agree input{width:22px;height:22px;flex:0 0 22px;margin:1px 0 0;accent-color:var(--rust)}
.pay .btn{width:100%}
.err{display:none;color:#A1261A;font-size:15px;margin:8px 0 4px}
.err.on{display:block}
.fine{font-size:15px;color:var(--ink-2);margin:18px 0 0}
.fine p{margin:0 0 8px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
@media (max-width:900px){.ticket-body{grid-template-columns:1fr}.ticket .what{border-right:0;border-bottom:1px dashed var(--line);padding:28px 22px}.ticket .pay{padding:28px 22px}.amount{font-size:56px}}

/* letter */
.letter .wrap{display:grid;grid-template-columns:.8fr 1.2fr;gap:64px;align-items:center}
.letter .pic{border-radius:22px;overflow:hidden;aspect-ratio:4/5}
.letter .pic img{width:100%;height:100%;object-fit:cover}
.letter h2{margin-bottom:22px}
.letter .body p{font:400 21px/1.6 var(--serif)}
.letter .body .sig{font:italic 400 22px/1.45 var(--serif);color:var(--moss-2);margin-top:6px}
.letter .body .ai{font:400 15px/1.5 var(--sans);color:var(--ink-2);margin-top:26px}
@media (max-width:900px){.letter .wrap{grid-template-columns:1fr;gap:28px}.letter .pic{max-width:420px;aspect-ratio:1/1}.letter .body p{font-size:19px}}

/* faq */
.faq{background:var(--paper-2)}
.faq .wrap{max-width:860px}
details{border-bottom:1px solid var(--line)}
details:first-of-type{border-top:1px solid var(--line)}
summary{list-style:none;cursor:pointer;padding:22px 48px 22px 0;font:600 20px/1.35 var(--serif);position:relative}
summary::-webkit-details-marker{display:none}
summary::after,summary::before{content:"";position:absolute;right:8px;top:50%;width:18px;height:2px;background:var(--rust);transition:transform .2s}
summary::before{transform:rotate(90deg)}
details[open] summary::before{transform:rotate(0)}
details .a{padding:0 0 22px;max-width:68ch}
details .a p:last-child{margin:0}
.help{margin-top:48px;border:1.5px solid var(--ink);border-radius:18px;padding:30px 32px;background:var(--card)}
.help h3{margin-bottom:8px}
.help form{display:flex;gap:12px;margin-top:16px;flex-wrap:wrap}
.help input{flex:1 1 260px;font:400 18px var(--sans);padding:14px 16px;border:1.5px solid #BFAE8E;border-radius:12px;background:#fff}
.help .btn{padding:14px 22px;font-size:17px}
.help .msg{font-size:16px;margin-top:12px}
@media (max-width:720px){summary{font-size:18px}.help{padding:22px 18px}}

/* footer */
.foot{background:var(--moss);color:#E9E1CF;padding:56px 0 40px;font-size:16px}
.foot .wrap{display:grid;grid-template-columns:1.2fr 1fr;gap:36px}
.foot .name{font:600 30px/1.1 var(--serif);color:#FBF3E6;margin-bottom:14px}
.foot a{color:#FBF3E6}
.foot p{margin:0 0 6px}
.foot .small{font-size:14px;color:#C9C0AC;margin-top:16px}
@media (max-width:720px){.foot .wrap{grid-template-columns:1fr}}

/* sticky buy bar (mobile) */
.bar{position:fixed;left:0;right:0;bottom:0;z-index:20;background:rgba(245,238,223,.97);border-top:1px solid var(--line);padding:10px 16px calc(10px + env(safe-area-inset-bottom));display:flex;align-items:center;justify-content:space-between;gap:14px;transform:translateY(110%);transition:transform .25s ease-out;box-shadow:0 -10px 30px -18px rgba(42,33,27,.35)}
.bar.on{transform:none}
.bar .t{font:600 17px/1.2 var(--serif)}
.bar .t small{display:block;font:400 14px var(--sans);color:var(--ink-2)}
.bar .btn{padding:15px 26px;font-size:18px;border-radius:14px}
@media (min-width:901px){.bar{display:none}}

/* lightbox */
dialog.lb{border:0;padding:0;background:transparent;max-width:min(92vw,760px);max-height:92vh}
dialog.lb::backdrop{background:rgba(30,24,19,.82)}
dialog.lb img{max-height:88vh;width:auto;margin:0 auto;border-radius:4px}
dialog.lb button{position:fixed;top:14px;right:14px;width:46px;height:46px;border-radius:50%;border:0;background:var(--paper);color:var(--ink);font:600 24px/1 var(--sans);cursor:pointer}

/* legal pages */
.doc{max-width:780px;margin:0 auto;padding:40px 20px 80px}
.doc h1{font-size:clamp(30px,4vw,42px);margin-bottom:10px}
.doc h2{font-size:24px;margin:34px 0 12px}
.doc p,.doc li{font-size:17px}
.doc .meta{color:var(--ink-2);font-size:15px;margin-bottom:28px}
.doc table{border-collapse:collapse;width:100%;font-size:16px;margin:10px 0 18px}
.doc td{border:1px solid var(--line);padding:8px 10px;vertical-align:top}

/* pay pages */
.paypage{max-width:720px;margin:0 auto;padding:40px 20px 90px}
.paypage h1{font-size:clamp(32px,5vw,48px);margin-bottom:16px}
.files{list-style:none;padding:0;margin:26px 0}
.files li{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 0;border-bottom:1px solid var(--line)}
.files li b{font:600 19px/1.3 var(--serif);display:block}
.files li span{font-size:15px;color:var(--ink-2)}
.files .btn{padding:12px 18px;font-size:16px;white-space:nowrap}
@media (max-width:560px){.files li{flex-direction:column;align-items:flex-start}}
