
/* Макет: оформление «Линии» — почти чёрное небо, приглушённое золото, Cormorant + Manrope. Сайт из экранов-видов
   (переход между ними — завеса и подъём), за ними живое небо в три слоя с параллаксом. Смелый элемент — астролябия
   за заголовком; на страницах матрицы и таро — рисование фигуры и переворот карт. Один облик: ночь. */
:root{
  color-scheme:dark;
  --bg:#0a0b11; --bg2:#0c0d14; --panel:#0f1119cc;
  --gold:#C4A97D; --gold-bright:#E7D2A6; --gold-line:rgba(196,169,125,.5); --gold-faint:rgba(196,169,125,.16); --gold-wash:rgba(196,169,125,.06);
  --ink:#F2EDE5; --ink-soft:#bdb7aa; --dim:#8a8d9c; --faint:#565a6b; --faintest:#3a3d4c;
  --rose:#c98a8a; --sage:#8fb3a2;
  --c-violet:#8a6fc4; --c-blue:#5b7fd0; --c-cyan:#56a6c4; --c-green:#6fae84; --c-sun:#e2c467; --c-orange:#d9965a; --c-red:#c5544f;
  --serif:'Cormorant Garamond',Georgia,'Times New Roman',serif;
  --sans:'Manrope',system-ui,-apple-system,'Segoe UI',sans-serif;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-family:var(--sans);font-weight:300;font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3{font-family:var(--serif);font-weight:500;margin:0;text-wrap:balance;font-variant-numeric:lining-nums}
h1{font-size:clamp(2.7rem,7.4vw,5.6rem);line-height:.98;letter-spacing:-.01em}
h2{font-size:clamp(2rem,4.4vw,3.2rem);line-height:1.04}
h3{font-size:1.55rem;line-height:1.15}
p{margin:0;max-width:62ch}
a{color:inherit}
button{font:inherit;color:inherit}
:focus-visible{outline:1px solid var(--gold-bright);outline-offset:4px}
em{font-style:italic;color:var(--gold-bright)}

/* ── атмосфера ── */
.atmo{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
#sky{position:absolute;inset:0;width:100%;height:100%}
.band{position:absolute;left:-30%;right:-30%;top:-25%;bottom:-25%;opacity:.17;filter:blur(40px);
  background:linear-gradient(118deg,transparent 36%,rgba(196,169,125,.30) 46%,rgba(231,210,166,.72) 50%,rgba(196,169,125,.30) 54%,transparent 64%);
  animation:drift 240s linear infinite}
.glow{position:absolute;inset:0;animation:breathe 9s ease-in-out infinite;background:radial-gradient(120% 50% at 50% 38%,rgba(236,222,192,.13) 0%,rgba(10,11,17,0) 62%)}
.veil{position:absolute;inset:0;background:radial-gradient(120% 85% at 50% 45%,transparent 30%,rgba(10,11,17,.72) 100%)}
.grain{position:absolute;inset:0;opacity:.05;mix-blend-mode:soft-light;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='170' height='170'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.light{position:absolute;width:560px;height:560px;left:0;top:0;margin:-280px 0 0 -280px;border-radius:50%;opacity:0;transition:opacity 1.2s;
  background:radial-gradient(circle,rgba(231,210,166,.09),transparent 62%);will-change:transform}
@keyframes drift{0%,100%{transform:translateY(-1.6%) rotate(-.7deg)}50%{transform:translateY(1.6%) rotate(.7deg)}}
@keyframes breathe{0%,100%{opacity:.55}50%{opacity:1}}
@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes soften{from{opacity:0}to{opacity:1}}
@keyframes glyphIn{0%{opacity:0;filter:blur(6px);letter-spacing:.12em}100%{opacity:1;filter:none;letter-spacing:-.01em}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes spinBack{to{transform:rotate(-360deg)}}
@keyframes pathDraw{to{stroke-dashoffset:0}}
@keyframes bloom{from{opacity:0;transform:scale(.4)}to{opacity:1;transform:scale(1)}}
@keyframes halo{0%,100%{opacity:.5;transform:scale(1)}50%{opacity:.05;transform:scale(1.7)}}
@keyframes sheen{0%{transform:translateX(-140%) skewX(-16deg);opacity:0}20%{opacity:.5}80%{opacity:.5}100%{transform:translateX(170%) skewX(-16deg);opacity:0}}
@keyframes grow{from{transform:scaleX(0)}}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}

/* ── шапка ── */
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;background:linear-gradient(180deg,rgba(10,11,17,.94) 55%,rgba(10,11,17,0))}
.top-in{max-width:1180px;margin:0 auto;padding:0 20px;height:68px;display:flex;align-items:center;gap:18px}
.brand{font-family:var(--serif);font-size:1.7rem;font-weight:500;letter-spacing:.02em;background:none;border:none;cursor:pointer;padding:0;display:flex;align-items:center;gap:10px;flex:none}
.brand i{width:26px;height:1px;background:linear-gradient(90deg,var(--gold),transparent);display:block}
.nav{display:flex;gap:2px;overflow-x:auto;min-width:0;flex:1;scrollbar-width:none;justify-content:center}
.nav::-webkit-scrollbar{display:none}
.nav a{flex:none;background:none;border:none;cursor:pointer;font-size:.72rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--dim);padding:10px 12px;position:relative;transition:color .4s}
.nav a::after{content:"";position:absolute;left:12px;right:12px;bottom:4px;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.nav a:hover,.nav a.on{color:var(--gold-bright)}
.nav a.on::after,.nav a:hover::after{transform:scaleX(1)}
.cta{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--sans);font-weight:400;font-size:.86rem;letter-spacing:.06em;color:var(--gold-bright);
  border:.5px solid var(--gold-line);border-radius:28px;padding:13px 26px;background:transparent;cursor:pointer;text-decoration:none;position:relative;overflow:hidden;transition:background .4s,border-color .4s,box-shadow .5s}
.cta:hover{background:rgba(196,169,125,.09);border-color:var(--gold);box-shadow:0 0 34px rgba(196,169,125,.18)}
.cta.solid{background:var(--gold);color:var(--bg);font-weight:500;border-color:var(--gold)}
.cta.solid:hover{background:var(--gold-bright);box-shadow:0 0 44px rgba(231,210,166,.35)}
.cta.small{padding:9px 18px;font-size:.78rem;flex:none}
.cta.ghost{color:var(--dim);border-color:rgba(136,141,156,.3)}
.cta[disabled]{opacity:.4;cursor:not-allowed}

/* ── виды ── */
main{position:relative;z-index:2;max-width:1180px;margin:0 auto;padding-inline:20px;padding-block:8px 80px}
.view{display:none;flex-direction:column;gap:clamp(48px,7vw,92px)}
.view.on{display:flex}
.view.on>*{animation:rise 1s cubic-bezier(.2,.7,.2,1) both}
.view.on>*:nth-child(2){animation-delay:.12s}.view.on>*:nth-child(3){animation-delay:.24s}.view.on>*:nth-child(4){animation-delay:.36s}.view.on>*:nth-child(n+5){animation-delay:.48s}
.eyebrow{font-size:.68rem;font-weight:500;letter-spacing:.32em;text-transform:uppercase;color:var(--gold)}
.lead{font-family:var(--serif);font-size:clamp(1.25rem,2.1vw,1.6rem);line-height:1.4;color:var(--ink-soft);font-weight:400}
.rule{height:1px;background:linear-gradient(90deg,var(--gold-line),transparent);border:0;margin:0;width:100%}
.block{display:flex;flex-direction:column;gap:22px}
.head{display:flex;flex-direction:column;gap:16px;padding-top:clamp(20px,4vw,48px)}
.tool{gap:clamp(28px,4vw,48px)}
.tool .head{padding-top:8px;gap:10px}
.tool .head h1{font-size:clamp(2rem,4.4vw,3.3rem);line-height:1.04}
.tool .head .lead{font-size:1.15rem}
.soft{color:var(--ink-soft)}
.quote{font-family:var(--serif);font-style:italic;font-size:clamp(1.3rem,2.3vw,1.8rem);line-height:1.35;color:var(--ink-soft);border-left:1px solid var(--gold-line);padding-left:22px;max-width:36ch}

/* ── главная ── */
.hero{position:relative;overflow-x:clip;margin-inline:-20px;padding-inline:20px;min-height:min(82vh,760px);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:26px;padding-block:40px}
.astro{position:absolute;left:50%;top:50%;width:min(118vw,860px);aspect-ratio:1;transform:translate(-50%,-50%);pointer-events:none;opacity:.78}
.astro svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.astro .r1{animation:spin 420s linear infinite;transform-origin:50% 50%}
.astro .r2{animation:spinBack 260s linear infinite;transform-origin:50% 50%}
.astro .r3{animation:spin 160s linear infinite;transform-origin:50% 50%}
.astro circle,.astro line,.astro path{fill:none;stroke:var(--gold);vector-effect:non-scaling-stroke}
.astro .thin{stroke-width:.5;opacity:.5}.astro .mid{stroke-width:.8;opacity:.75}
.astro text{fill:var(--gold-bright);font-size:17px;text-anchor:middle;dominant-baseline:central;font-family:"Segoe UI Symbol","Noto Sans Symbols 2","Apple Symbols",serif;opacity:.85}
.astro .sun{fill:var(--gold-bright);stroke:none;filter:drop-shadow(0 0 12px rgba(231,210,166,.95));transition:cx 1.6s cubic-bezier(.3,.9,.3,1),cy 1.6s cubic-bezier(.3,.9,.3,1)}
.astro .sunhalo{fill:var(--gold-bright);stroke:none;opacity:.3;transform-box:fill-box;transform-origin:center;animation:halo 4s ease-in-out infinite;transition:cx 1.6s cubic-bezier(.3,.9,.3,1),cy 1.6s cubic-bezier(.3,.9,.3,1)}
.astro .sunray{stroke-width:.6;stroke-dasharray:2 5;opacity:.7}
.hero>*:not(.astro){position:relative}
.hero h1 span{display:inline-block;animation:glyphIn 1.6s cubic-bezier(.2,.7,.2,1) both}
.hero h1 span:nth-child(2){animation-delay:.25s}.hero h1 span:nth-child(3){animation-delay:.5s}.hero h1 span:nth-child(4){animation-delay:.75s}.hero h1 span:nth-child(5){animation-delay:1s}
.hero .lead{max-width:34ch}
.probe{display:flex;flex-direction:column;align-items:center;gap:10px;padding:18px 26px;border:.5px solid var(--gold-faint);border-radius:22px;background:rgba(10,11,17,.72);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);max-width:100%}
.probe-row{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center;justify-content:center}
.probe label{font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--dim);font-weight:500}
.probe output{font-family:var(--serif);font-size:1.7rem;color:var(--gold-bright);font-variant-numeric:lining-nums;min-height:1.2em}
.probe small{color:var(--faint);font-size:.76rem;max-width:44ch;line-height:1.5}
input[type=date],input[type=time],input[type=text],input[type=email],textarea{font-family:var(--sans);font-size:.95rem;font-weight:400;color:var(--ink);background:rgba(10,11,17,.6);border:.5px solid var(--gold-line);border-radius:14px;padding:11px 14px;min-width:0;width:100%;transition:border-color .3s,box-shadow .4s}
input:focus,textarea:focus{outline:none;border-color:var(--gold-bright);box-shadow:0 0 28px rgba(196,169,125,.2)}
.probe input{width:auto}

.doors{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px}
.door{position:relative;overflow:hidden;text-align:left;cursor:pointer;background:linear-gradient(180deg,rgba(196,169,125,.07),rgba(10,11,17,.5) 60%);border:.5px solid var(--gold-faint);border-radius:20px;
  padding:26px 24px 24px;display:flex;flex-direction:column;gap:12px;min-height:330px;transition:border-color .6s,transform .8s cubic-bezier(.2,.7,.2,1),box-shadow .8s}
.door::before{content:"";position:absolute;inset:0;width:45%;background:linear-gradient(90deg,transparent,rgba(231,210,166,.14),transparent);transform:translateX(-140%) skewX(-16deg);opacity:0}
.door:hover{border-color:var(--gold-line);transform:translateY(-6px);box-shadow:0 30px 70px -30px rgba(196,169,125,.35)}
.door:hover::before{animation:sheen 1.4s ease-out}
.door .art{height:118px;display:flex;align-items:center;justify-content:center;margin-bottom:6px}
.door .art svg{height:100%;overflow:visible}
.door .art *{fill:none;stroke:var(--gold);stroke-width:1;vector-effect:non-scaling-stroke}
.door .art .f{fill:var(--gold-bright);stroke:none}
.door:hover .art svg{animation:floaty 4s ease-in-out infinite}
.door p{color:var(--ink-soft);font-size:.92rem;flex:1}
.door .go{font-size:.7rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);font-weight:500;display:flex;align-items:center;gap:10px}
.door .go::after{content:"";height:1px;width:26px;background:var(--gold);transition:width .6s cubic-bezier(.2,.7,.2,1)}
.door:hover .go::after{width:56px}
.tag{align-self:flex-start;font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;font-weight:500;color:var(--bg);background:var(--gold);padding:3px 11px;border-radius:20px}
.tag.line{background:none;color:var(--gold);border:.5px solid var(--gold-line)}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:24px;border-top:.5px solid var(--gold-faint);border-bottom:.5px solid var(--gold-faint);padding:30px 0}
.facts div{display:flex;flex-direction:column;gap:2px;text-align:center}
.facts b{font-family:var(--serif);font-weight:500;font-size:3rem;line-height:1;color:var(--gold-bright);font-variant-numeric:lining-nums}
.facts span{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--dim);font-weight:500}

/* ── сетки и карточки ── */
.cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:30px}
.item{display:flex;flex-direction:column;gap:10px;min-width:0;padding-top:18px;border-top:.5px solid var(--gold-line)}
.item p{color:var(--ink-soft);font-size:.95rem}
.kick{font-size:.64rem;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);font-weight:500}
.versus{display:flex;flex-direction:column}
.vs{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);border-top:.5px solid var(--gold-faint)}
.vs>div{padding:20px 22px 20px 0;min-width:0}
.vs>div+div{padding-left:26px;border-left:.5px solid var(--gold-line);background:linear-gradient(90deg,var(--gold-wash),transparent 70%);font-family:var(--serif);font-size:1.3rem;line-height:1.35;color:var(--ink)}
.vs .kick{display:block;margin-bottom:6px}
.vs .them{color:var(--dim)}.vs .them .kick{color:var(--faint)}
.two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,64px);align-items:start}

/* ── матрица ── */
.m-wrap{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(20px,4vw,56px);align-items:start}
.m-ctl{display:flex;flex-wrap:wrap;gap:12px;align-items:end}
.m-ctl label{display:flex;flex-direction:column;gap:6px;font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--dim);font-weight:500;flex:1 1 180px}
#mx{width:100%;max-width:620px;aspect-ratio:1;display:block;margin:0 auto;overflow:visible}
#mx .ln{fill:none;stroke:var(--gold);stroke-width:.8;opacity:.6;stroke-dasharray:1;stroke-dashoffset:1;animation:pathDraw 1.6s cubic-bezier(.4,0,.2,1) forwards;animation-delay:var(--d,0s)}
#mx .ln.bold{stroke-width:1.3;opacity:.85}#mx .ln.well{stroke:var(--c-red);opacity:.8;stroke-width:1}
#mx .pt{transform-box:fill-box;transform-origin:center;opacity:0;animation:bloom .8s cubic-bezier(.2,.9,.3,1.3) forwards;animation-delay:var(--d,0s)}
#mx .pt circle.o{stroke:var(--gold-line);stroke-width:.8;fill:#0c0d14}
#mx .pt text{font-family:var(--sans);font-weight:500;text-anchor:middle;dominant-baseline:central;fill:var(--ink);font-variant-numeric:lining-nums;pointer-events:none}
#mx .pt.dark text{fill:#0a0b11}
#mx .pt.hit{cursor:pointer}
#mx .pt.hit .ring{fill:none;stroke:var(--gold-bright);stroke-width:1;opacity:0;transform-box:fill-box;transform-origin:center}
#mx .pt.hit:hover .ring,#mx .pt.sel .ring{opacity:.5;animation:halo 2.6s ease-in-out infinite}
#mx .age{font-family:var(--sans);font-size:11px;letter-spacing:.14em;fill:var(--faint);text-anchor:middle;text-transform:uppercase}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips button{background:none;border:.5px solid var(--gold-faint);border-radius:20px;padding:7px 15px;font-size:.74rem;letter-spacing:.08em;color:var(--ink-soft);cursor:pointer;display:flex;align-items:center;gap:8px;transition:all .35s}
.chips button i{width:9px;height:9px;border-radius:50%;display:block}
.chips button:hover,.chips button[aria-pressed=true]{border-color:var(--gold);color:var(--gold-bright);background:var(--gold-wash)}
.m-panel{display:flex;flex-direction:column;gap:18px;border:.5px solid var(--gold-faint);border-radius:20px;padding:26px;background:var(--panel);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.m-panel .num{font-family:var(--serif);font-size:4.4rem;line-height:.9;color:var(--gold-bright);font-variant-numeric:lining-nums}
.m-panel .row{display:flex;gap:18px;align-items:flex-end}
.m-panel dl{margin:0;display:flex;flex-direction:column;gap:14px}
.m-panel dt{font-size:.64rem;letter-spacing:.26em;text-transform:uppercase;color:var(--gold);font-weight:500;margin-bottom:3px}
.m-panel dd{margin:0;color:var(--ink-soft);font-size:.95rem}
.swap{animation:rise .7s cubic-bezier(.2,.7,.2,1) both}

/* ── таро ── */
.t-modes{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.slots{display:flex;flex-wrap:wrap;gap:clamp(14px,3vw,34px);justify-content:center;perspective:1400px}
.slot{display:flex;flex-direction:column;align-items:center;gap:12px;width:min(42vw,196px)}
.slots.celtic{--w:min(20vw,128px);display:flex;flex-wrap:nowrap;gap:clamp(14px,3.5vw,44px);justify-content:center;align-items:center}
.celtic .cross{display:grid;grid-template-columns:repeat(3,var(--w));gap:clamp(6px,1.4vw,14px);align-items:center}
.celtic .staff{display:flex;flex-direction:column;gap:clamp(4px,1vw,10px);width:calc(var(--w)*.72)}
.celtic .slot{width:100%;gap:5px}
.celtic .slot .pos{font-size:.52rem;letter-spacing:.12em;text-align:center;line-height:1.25;min-height:2.5em;display:flex;align-items:flex-end}
.celtic .staff .slot .pos{min-height:0}
.celtic .slot .nm{display:none}
.celtic #slot0,.celtic #slot1{grid-area:2/2}
.celtic #slot1{transform:rotate(90deg) scale(.84) translateX(8%);z-index:2}
.celtic #slot1 .pos{visibility:hidden}
.celtic #slot2{grid-area:1/2}.celtic #slot3{grid-area:3/2}.celtic #slot4{grid-area:2/1}.celtic #slot5{grid-area:2/3}
.slot .pos{font-size:.64rem;letter-spacing:.26em;text-transform:uppercase;color:var(--dim);font-weight:500}
.tcard{position:relative;width:100%;aspect-ratio:320/548;transform-style:preserve-3d;transition:transform 1.5s cubic-bezier(.3,.7,.2,1);border-radius:10px}
.tcard.flip{transform:rotateY(180deg)}
.tcard>*{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:10px;overflow:hidden}
.tcard .empty{border:.5px dashed var(--gold-faint);display:flex;align-items:center;justify-content:center;color:var(--faintest);font-family:var(--serif);font-size:2.4rem}
.tcard .face{transform:rotateY(180deg);background:#f4efe2;box-shadow:0 0 0 .5px var(--gold-line),0 26px 70px -18px rgba(231,210,166,.5)}
.tcard .face img{width:100%;height:100%;object-fit:cover;display:block}
.slot .nm{font-family:var(--serif);font-size:1.35rem;text-align:center;min-height:1.4em;opacity:0;transition:opacity 1s .9s}
.slot.done .nm{opacity:1}
.fan{display:flex;justify-content:center;padding:34px 0 20px;min-height:230px}
.fan-scroll{overflow-x:auto;scrollbar-width:none}
.fan-scroll::-webkit-scrollbar{display:none}
.fcard{flex:none;width:92px;aspect-ratio:320/548;margin:0 -27px;border-radius:8px;cursor:pointer;border:none;padding:0;position:relative;
  transform:rotate(calc(var(--i)*3.4deg)) translateY(calc(var(--a)*var(--a)*1.3px));transform-origin:50% 160%;
  transition:transform .6s cubic-bezier(.2,.7,.2,1),opacity .6s,box-shadow .6s;animation:soften 1s both;animation-delay:calc((var(--n))*45ms);
  background:radial-gradient(circle at 50% 50%,#1b1d2b 0%,#0c0d14 70%);box-shadow:0 0 0 .5px var(--gold-line),0 10px 26px rgba(0,0,0,.6)}
.fcard::before{content:"";position:absolute;inset:6px;border:.5px solid var(--gold-faint);border-radius:5px;
  background:repeating-conic-gradient(from 0deg at 50% 50%,rgba(196,169,125,.16) 0 4deg,transparent 4deg 15deg);mask:radial-gradient(circle,#000 0 34%,transparent 35%);-webkit-mask:radial-gradient(circle,#000 0 34%,transparent 35%)}
.fcard::after{content:"✦";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--gold);font-size:15px}
.fcard:hover,.fcard:focus-visible{transform:rotate(calc(var(--i)*3.4deg)) translateY(calc(var(--a)*var(--a)*1.3px - 26px));box-shadow:0 0 0 .5px var(--gold-bright),0 0 40px rgba(231,210,166,.4);z-index:3}
.fcard.gone{opacity:0;pointer-events:none;transform:rotate(calc(var(--i)*3.4deg)) translateY(-120px) scale(.8)}
.fan{transition:opacity 1.2s,min-height 1.2s,padding 1.2s;overflow:hidden}
.fan.locked{opacity:0;min-height:0;height:0;padding:0;pointer-events:none}
.reading{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:26px}
.reading .item h3{color:var(--gold-bright)}

/* ── фон дня ── */
.fon{display:grid;grid-template-columns:minmax(120px,220px) minmax(0,1fr);gap:clamp(20px,5vw,64px);align-items:center;border:.5px solid var(--gold-faint);border-radius:24px;padding:clamp(22px,4vw,48px);
  background:radial-gradient(90% 120% at 0% 50%,rgba(196,169,125,.1),transparent 60%),var(--panel);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
#moon{width:100%;max-width:220px;margin:0 auto;display:block;filter:drop-shadow(0 0 34px rgba(231,210,166,.4));animation:floaty 9s ease-in-out infinite}
#moon .dark{fill:#12141f;stroke:var(--gold-line);stroke-width:.6}
#moon .lit{fill:var(--gold-bright)}
#moon .ring{fill:none;stroke:var(--gold);stroke-width:.4;opacity:.5;transform-origin:60px 60px;animation:spin 120s linear infinite;stroke-dasharray:1 5}
.fon-main{display:flex;flex-direction:column;gap:16px;min-width:0}
.fon-two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:22px;border-top:.5px solid var(--gold-faint);padding-top:16px}
.fon-two p{color:var(--ink-soft);font-size:.98rem;margin-top:4px}
@media (max-width:700px){.fon{grid-template-columns:minmax(0,1fr)}#moon{max-width:140px}.fon-two{grid-template-columns:minmax(0,1fr)}}

/* ── день ── */
.day{display:grid;grid-template-columns:minmax(0,1fr) minmax(170px,210px) minmax(0,.95fr);gap:clamp(20px,4vw,56px);align-items:start}
.day-main{display:flex;flex-direction:column;gap:24px;min-width:0}
.day-num{font-family:var(--serif);font-size:clamp(5rem,11vw,8.5rem);line-height:.8;color:var(--gold-bright);font-variant-numeric:lining-nums;text-shadow:0 0 50px rgba(231,210,166,.35)}
.week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}
.week button{background:none;border:.5px solid var(--gold-faint);border-radius:14px;padding:10px 2px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:2px;transition:all .4s;min-width:0}
.week button span{max-width:100%;overflow:hidden;font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);font-weight:500}
.week button b{font-family:var(--serif);font-weight:500;font-size:1.7rem;line-height:1.1;color:var(--ink);font-variant-numeric:lining-nums}
.week button:hover{border-color:var(--gold-line)}
.week button[aria-pressed=true]{border-color:var(--gold);background:var(--gold-wash)}.week button[aria-pressed=true] b{color:var(--gold-bright)}
.dcard{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;perspective:1200px}
.dcard .tcard{width:100%;max-width:200px;background:none;border:none;padding:0;cursor:pointer}
.dcard .tcard:not(.flip):hover{transform:translateY(-8px) rotateY(8deg)}
.dcard h3{font-size:1.4rem}.dcard p{font-size:.9rem}
.fback{background:radial-gradient(circle at 50% 50%,#1b1d2b 0%,#0c0d14 70%);box-shadow:0 0 0 .5px var(--gold-line),0 18px 50px -14px rgba(231,210,166,.35)}
.fback::before{content:"";position:absolute;inset:9px;border:.5px solid var(--gold-faint);border-radius:6px;background:repeating-conic-gradient(from 0deg at 50% 50%,rgba(196,169,125,.18) 0 4deg,transparent 4deg 15deg);mask:radial-gradient(circle,#000 0 36%,transparent 37%);-webkit-mask:radial-gradient(circle,#000 0 36%,transparent 37%)}
.fback::after{content:"✦";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--gold);font-size:22px;animation:breathe 4s ease-in-out infinite}
@media (max-width:1000px){.day{grid-template-columns:minmax(0,1fr) minmax(160px,200px)}.day .m-panel{grid-column:1/-1}}
@media (max-width:620px){.day{grid-template-columns:minmax(0,1fr)}}

/* ── баннеры статей на главной ── */
.banners{display:grid;grid-template-columns:1.35fr 1fr 1fr;gap:18px}
.banner{position:relative;overflow:hidden;text-align:left;cursor:pointer;border:.5px solid var(--gold-faint);border-radius:20px;padding:28px 26px;min-height:250px;display:flex;flex-direction:column;gap:12px;justify-content:flex-end;
  background:radial-gradient(120% 90% at 100% 0%,rgba(196,169,125,.16),transparent 55%),linear-gradient(180deg,rgba(15,17,25,.4),rgba(10,11,17,.85));transition:border-color .6s,transform .8s cubic-bezier(.2,.7,.2,1),box-shadow .8s}
.banner::before{content:"";position:absolute;inset:0;width:45%;background:linear-gradient(90deg,transparent,rgba(231,210,166,.12),transparent);transform:translateX(-140%) skewX(-16deg);opacity:0}
.banner:hover{border-color:var(--gold-line);transform:translateY(-5px);box-shadow:0 30px 70px -30px rgba(196,169,125,.35)}
.banner:hover::before{animation:sheen 1.4s ease-out}
.banner .big{position:absolute;right:18px;top:2px;font-family:var(--serif);font-size:7rem;line-height:1;color:var(--gold);opacity:.14;font-variant-numeric:lining-nums;pointer-events:none}
.banner h3{font-size:1.75rem}.banner:first-child h3{font-size:2.3rem}
.banner p{color:var(--ink-soft);font-size:.9rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.banner .go{font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);font-weight:500}
@media (max-width:900px){.banners{grid-template-columns:minmax(0,1fr)}.banner{min-height:0}}

/* ── статьи ── */
.j-list{display:flex;flex-direction:column}
.j-row{display:grid;grid-template-columns:150px minmax(0,1fr) auto;gap:8px 28px;align-items:baseline;text-align:left;background:none;border:none;border-top:.5px solid var(--gold-faint);padding:26px 0;cursor:pointer;transition:background .5s,padding .5s}
.j-row:last-child{border-bottom:.5px solid var(--gold-faint)}
.j-row:hover{background:linear-gradient(90deg,var(--gold-wash),transparent);padding-left:14px}
.j-row .meta{display:flex;flex-direction:column;gap:4px;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--dim);font-weight:500}
.j-row .meta b{color:var(--gold);font-weight:500}
.j-row h3{font-size:1.9rem;transition:color .4s}.j-row:hover h3{color:var(--gold-bright)}
.j-row p{grid-column:2;color:var(--ink-soft);font-size:.95rem}
.j-row .arr{color:var(--gold);font-size:.7rem;letter-spacing:.24em;text-transform:uppercase;font-weight:500}
.j-read{max-width:680px;margin:0 auto;display:flex;flex-direction:column;gap:22px;width:100%}
.j-read h2{font-size:clamp(2.2rem,5vw,3.6rem)}
.j-read p{font-family:var(--serif);font-size:1.4rem;line-height:1.5;color:var(--ink);max-width:none;white-space:pre-line}
.j-read p:first-of-type{font-size:1.7rem;color:var(--gold-bright)}
@media (max-width:820px){.j-row{grid-template-columns:minmax(0,1fr)}.j-row p{grid-column:1}.j-row .arr{display:none}}

/* ── шкала периодов ── */
.tl{overflow-x:auto;padding-bottom:6px}
.tl-in{min-width:640px;display:flex;flex-direction:column;gap:12px}
.tl-axis,.tl-track{display:grid;grid-template-columns:repeat(18,1fr)}
.tl-axis span{font-size:.66rem;letter-spacing:.08em;color:var(--faint);border-left:.5px solid var(--faintest);padding-left:5px;font-variant-numeric:tabular-nums;text-transform:uppercase}
.tl-track{height:46px;border:.5px solid var(--gold-faint);border-radius:30px;overflow:hidden;background:rgba(10,11,17,.6)}
.bar{display:flex;align-items:center;padding:0 16px;font-size:.78rem;letter-spacing:.06em;font-weight:500;color:var(--bg);transform-origin:left;white-space:nowrap;overflow:hidden;border-radius:30px;animation:grow 1.6s cubic-bezier(.3,.9,.3,1) both;animation-delay:var(--d,0s)}
.bar.t{background:linear-gradient(90deg,var(--rose),#a56d6d)}.bar.o{background:linear-gradient(90deg,var(--sage),#6f9383)}
.legend{display:flex;flex-wrap:wrap;gap:6px 22px;font-size:.82rem;color:var(--dim)}
.legend i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:8px}

/* ── цены и заказ ── */
.prod{display:flex;flex-direction:column;gap:12px;min-width:0;border:.5px solid var(--gold-faint);border-radius:20px;padding:26px;background:linear-gradient(180deg,var(--gold-wash),transparent);transition:border-color .5s,box-shadow .6s}
.prod:hover{border-color:var(--gold-line);box-shadow:0 0 60px -20px rgba(196,169,125,.4)}
.prod p{color:var(--ink-soft);font-size:.93rem;flex:1}
.price{font-family:var(--serif);font-size:2.5rem;line-height:1;color:var(--gold-bright);font-variant-numeric:lining-nums}
.steps{display:flex;gap:10px;flex-wrap:wrap;font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;font-weight:500}
.steps span{padding:7px 16px;border:.5px solid var(--faintest);border-radius:20px;color:var(--faint);transition:all .5s}
.steps span.on{border-color:var(--gold);color:var(--bg);background:var(--gold)}
.pick{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px}
.pick button{text-align:left;background:rgba(10,11,17,.5);border:.5px solid var(--gold-faint);border-radius:16px;padding:16px 18px;cursor:pointer;display:flex;flex-direction:column;gap:2px;transition:all .4s}
.pick button:hover{border-color:var(--gold);box-shadow:0 0 30px rgba(196,169,125,.18)}
.pick button[aria-pressed=true]{background:var(--gold);color:var(--bg);border-color:var(--gold)}
.pick button b{font-family:var(--serif);font-size:1.35rem;font-weight:500}
.pick button span{font-size:.8rem;opacity:.75}
.form{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.form label,.wide label{display:flex;flex-direction:column;gap:6px;font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--dim);font-weight:500;min-width:0}
.check{display:flex;align-items:center;gap:10px;color:var(--ink-soft);font-size:.9rem;cursor:pointer}
.check input{width:17px;height:17px;accent-color:var(--gold)}
.row{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.err{color:var(--rose);font-size:.9rem;min-height:1.4em}
.order{font-family:var(--serif);font-size:1.25rem;line-height:1.7;background:rgba(10,11,17,.6);border:.5px dashed var(--gold-line);border-radius:16px;padding:20px 24px;white-space:pre-wrap;overflow-wrap:anywhere;user-select:all;font-variant-numeric:lining-nums}
.note{font-size:.86rem;color:var(--dim);border-left:1px solid var(--gold-line);padding-left:16px;max-width:62ch}
.todo{border:.5px dashed var(--gold-line);border-radius:6px;padding:1px 9px;font-size:.8rem;color:var(--gold)}
details{border-top:.5px solid var(--gold-faint);padding:18px 0}
details:last-of-type{border-bottom:.5px solid var(--gold-faint)}
summary{cursor:pointer;font-family:var(--serif);font-size:1.5rem;line-height:1.2;list-style:none;display:flex;justify-content:space-between;gap:16px;transition:color .3s}
summary:hover{color:var(--gold-bright)}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";color:var(--gold);font-family:var(--sans);font-weight:300;transition:transform .5s}
details[open] summary::after{transform:rotate(45deg)}
details p{margin-top:10px;color:var(--ink-soft)}
ul.plain{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px;max-width:62ch;color:var(--ink-soft)}
footer{position:relative;z-index:2;max-width:1180px;margin:0 auto;padding:0 20px 44px;font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between}

@media (max-width:820px){
  .m-wrap,.two{grid-template-columns:minmax(0,1fr)}
  .vs{grid-template-columns:minmax(0,1fr)}.vs>div{padding:14px 0}.vs>div+div{padding:14px 18px}
  .top-in .cta.small{display:none}.nav{justify-content:flex-start}
  .hero{min-height:0;padding-block:56px 30px}.astro{width:150vw;opacity:.5}
  .fcard{width:70px;margin:0 -22px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001s!important;animation-delay:0s!important;animation-iteration-count:1!important;transition-duration:.001s!important}
}

/* ── сборка в страницы: ссылки вместо кнопок, подвал, хлебные крошки, текстовые блоки ── */
a.brand,a.door,a.banner,a.j-row,.nav a{text-decoration:none;color:inherit}
.nav a{color:var(--dim)}
a.door,a.banner{display:flex}
.crumbs{font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--faint);display:flex;flex-wrap:wrap;gap:8px;padding-top:6px}
.crumbs a{color:var(--dim);text-decoration:none}.crumbs a:hover{color:var(--gold)}
.prose{display:flex;flex-direction:column;gap:14px;max-width:70ch}.prose p,.prose li{color:var(--ink-soft)}
.prose ol,.prose ul{margin:0;padding-left:1.2em;display:flex;flex-direction:column;gap:6px}
.long{max-width:720px}
.long p{font-size:1.24rem;line-height:1.55}.long p:first-of-type{font-size:1.24rem;color:var(--ink)}
.long .lead-in{display:flex;flex-direction:column;gap:14px}.long .lead-in p{font-size:1.32rem;color:var(--gold-bright)}@media(max-width:640px){.long p,.long ul,.long ol{font-size:1.14rem}.long .lead-in p{font-size:1.2rem}}
.long h2{font-size:clamp(1.7rem,3.4vw,2.3rem);margin-top:18px}
.long h3{margin-top:10px}
.long ul,.long ol{margin:0;padding-left:1.3em;display:flex;flex-direction:column;gap:8px;font-family:var(--serif);font-size:1.24rem;line-height:1.5}
.long blockquote{margin:0;border-left:1px solid var(--gold-line);padding-left:20px;font-style:italic;color:var(--ink-soft)}
.long a:not(.cta){color:var(--gold-bright);text-decoration:underline;text-decoration-color:var(--gold-line);text-underline-offset:3px}
.long hr{height:1px;border:0;width:100%;background:linear-gradient(90deg,var(--gold-line),transparent);margin:8px 0}
.long em{color:inherit}.long strong{font-weight:600;color:var(--ink)}
.long .cta{align-self:flex-start}
.long .faq-q{font-family:var(--serif);font-size:1.4rem;color:var(--ink);margin-top:10px}
.long .by{font-family:var(--sans);font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}
.j-group{margin-top:26px;margin-bottom:-30px}
.foot{position:relative;z-index:2;max-width:1180px;margin:0 auto;padding:30px 20px 48px;border-top:.5px solid var(--gold-faint);display:flex;flex-wrap:wrap;gap:18px 40px;justify-content:space-between;font-size:.8rem;color:var(--dim)}
.foot nav{display:flex;flex-wrap:wrap;gap:8px 20px}.foot a{color:var(--ink-soft);text-decoration:none}.foot a:hover{color:var(--gold-bright)}
