/* SOLEIL — сайт. Журнальная типографика (Playfair + Inter), тёплая бумага и ночь, акцент — арбузный: цвет, который мы подобрали нашей модели */
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/PlayfairDisplay-400-cyrillic.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/PlayfairDisplay-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Playfair Display';font-style:italic;font-weight:400;font-display:swap;src:url(fonts/PlayfairDisplay-400i-cyrillic.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Playfair Display';font-style:italic;font-weight:400;font-display:swap;src:url(fonts/PlayfairDisplay-400i-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+2000-206F}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/PlayfairDisplay-500-cyrillic.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/PlayfairDisplay-500-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+2000-206F}
@font-face{font-family:Inter;font-style:normal;font-weight:400;font-display:swap;src:url(fonts/Inter-400-cyrillic.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Inter;font-style:normal;font-weight:400;font-display:swap;src:url(fonts/Inter-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+2000-206F,U+2190-2193,U+2212,U+20BD}
@font-face{font-family:Inter;font-style:normal;font-weight:500;font-display:swap;src:url(fonts/Inter-500-cyrillic.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Inter;font-style:normal;font-weight:500;font-display:swap;src:url(fonts/Inter-500-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+2000-206F,U+2190-2193,U+2212,U+20BD}
@font-face{font-family:Inter;font-style:normal;font-weight:600;font-display:swap;src:url(fonts/Inter-600-cyrillic.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Inter;font-style:normal;font-weight:600;font-display:swap;src:url(fonts/Inter-600-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+2000-206F,U+2190-2193,U+2212,U+20BD}
@font-face{font-family:Unbounded;font-style:normal;font-weight:500;font-display:swap;src:url(fonts2/Unbounded-500-cyrillic.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Unbounded;font-style:normal;font-weight:500;font-display:swap;src:url(fonts2/Unbounded-500-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+2000-206F}

:root{
  --paper:#F4EEE6;--paper2:#EDE4D8;--card:#FBF8F4;--ink:#17110E;--ink2:#3C3029;--mute:#85766B;--line:rgba(23,17,14,.12);
  --night:#110D0B;--night2:#1C1613;--cream:#F3EADF;--rose:#E8475A;--rose2:#F26B7A;--gold:#C9A27A;--ok:#4FB587;--wa:#E3A33B;--no:#E0655F;
  --serif:'Playfair Display',Georgia,'Times New Roman',serif;--sans:Inter,system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --r:22px;--gut:clamp(16px,4vw,56px);--max:1320px;--ease:cubic-bezier(.2,.7,.2,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{background:var(--paper);color:var(--ink);font:16px/1.6 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,video{display:block;max-width:100%}
a{color:inherit}
button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}
:focus-visible{outline:2px solid var(--rose);outline-offset:3px;border-radius:6px}
.wrap{max-width:var(--max);margin:0 auto;padding-inline:var(--gut)}
.serif{font-family:var(--serif)}
em{font-style:italic;font-family:var(--serif)}
.eyebrow{font-size:12px;letter-spacing:.28em;text-transform:uppercase;font-weight:600;color:var(--rose)}
.h1{font-family:var(--serif);font-weight:400;font-size:clamp(46px,7.6vw,118px);line-height:.98;letter-spacing:-.02em;text-wrap:balance}
.h2{font-family:var(--serif);font-weight:400;font-size:clamp(36px,5.2vw,78px);line-height:1.02;letter-spacing:-.015em;text-wrap:balance}
.h3{font-family:var(--serif);font-weight:400;font-size:clamp(24px,2.4vw,34px);line-height:1.12}
.h1 em,.h2 em{color:var(--rose)}
.lead{font-size:clamp(17px,1.45vw,20px);line-height:1.6;color:var(--ink2);max-width:58ch}
.muted{color:var(--mute)}
section{position:relative}
.sec{padding-block:clamp(84px,11vw,168px)}
.sec-head{display:grid;grid-template-columns:1fr auto;gap:24px 48px;align-items:end;margin-bottom:clamp(40px,5vw,72px)}
.sec-head .lead{grid-column:1/-1}
.num{font-family:var(--serif);font-style:italic;color:var(--rose);font-size:20px}

/* кнопки */
.btn{display:inline-flex;align-items:center;gap:12px;height:58px;padding:0 30px;border-radius:99px;background:var(--ink);color:var(--paper);font-weight:600;font-size:16px;letter-spacing:.01em;text-decoration:none;transition:transform .35s var(--ease),background .3s,box-shadow .3s;will-change:transform;white-space:nowrap}
.btn:hover{background:var(--rose);box-shadow:0 18px 40px -14px rgba(232,71,90,.6)}
.btn .ar{display:inline-block;transition:transform .35s var(--ease)}.btn:hover .ar{transform:translateX(4px)}
.btn.rose{background:var(--rose);color:#fff}.btn.rose:hover{background:#d23a4d}
.btn.ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}.btn.ghost:hover{background:var(--ink);color:var(--paper);box-shadow:none}
.btn.light{background:var(--cream);color:var(--ink)}.btn.light:hover{background:#fff}
.btn small{font-weight:500;opacity:.7}

/* шапка */
.nav{position:fixed;inset:0 0 auto;z-index:50;padding-top:env(safe-area-inset-top,0px);transition:background .4s,backdrop-filter .4s,box-shadow .4s}
.nav.stuck{background:rgba(244,238,230,.78);backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4);box-shadow:0 1px 0 var(--line)}
.nav .wrap{display:flex;align-items:center;gap:28px;height:76px}
.logo{display:inline-flex;align-items:center;text-decoration:none;color:var(--ink);white-space:nowrap}
.logo-img{height:44px;width:auto;display:block}
.lg{font:500 19px/1 Unbounded,var(--sans);letter-spacing:.02em;display:inline-flex;align-items:center}
.sun{display:inline-block;width:.76em;height:.76em;border-radius:50%;margin:0 .035em;background:radial-gradient(circle at 32% 28%,#FFD9C2 0%,#FF8F75 34%,#E8475A 64%,#B8284A 100%);box-shadow:0 0 .35em rgba(255,120,110,.45);flex:none}
.nav nav{display:flex;gap:26px;margin-left:auto;font-size:14px}
.nav nav a{text-decoration:none;color:var(--ink2);position:relative}
.nav nav a:after{content:'';position:absolute;left:0;right:0;bottom:-4px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.nav nav a:hover:after{transform:scaleX(1)}
.nav .btn{height:44px;padding:0 20px;font-size:14px}

/* герой */
.hero{min-height:100svh;padding-top:120px;padding-bottom:64px;display:flex;align-items:center;overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:1.08fr .92fr;gap:clamp(32px,5vw,90px);align-items:center;width:100%}
.hero .h1{margin:22px 0 28px}
.hero .cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:36px}
.facts{display:flex;flex-wrap:wrap;gap:10px 34px;margin-top:44px;padding-top:26px;border-top:1px solid var(--line)}
.facts div{font-size:13px;color:var(--mute);line-height:1.35}
.facts b{display:block;font-family:var(--serif);font-weight:400;font-size:34px;color:var(--ink);letter-spacing:-.01em}
.cover-zone{position:relative;perspective:1400px;justify-self:center;width:min(100%,520px)}
.cover{position:relative;aspect-ratio:3/4;border-radius:6px;overflow:hidden;box-shadow:0 60px 120px -40px rgba(60,30,20,.55),0 20px 40px -20px rgba(60,30,20,.4);transform:rotateY(-9deg) rotateX(3deg);transform-style:preserve-3d;transition:transform .8s var(--ease)}
.cover img{width:100%;height:100%;object-fit:cover;object-position:center 30%}
.cover:before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.12),transparent 28%,transparent 60%,rgba(20,10,8,.55));z-index:1}
.cover .mast{position:absolute;top:6%;left:0;right:0;display:flex;justify-content:center;align-items:center;font:500 clamp(34px,4.6vw,60px)/1 Unbounded,var(--sans);letter-spacing:.02em;color:#fff;z-index:2;text-shadow:0 4px 30px rgba(0,0,0,.18)}
.cover .mast img{height:clamp(30px,4.2vw,56px);width:auto;filter:drop-shadow(0 4px 24px rgba(0,0,0,.25))}
.cover .iss{position:absolute;top:17%;left:0;right:0;text-align:center;color:#fff;font-size:10px;letter-spacing:.34em;text-transform:uppercase;z-index:2}
.cover .cl{position:absolute;z-index:2;color:#fff;font-family:var(--serif);line-height:1.1;text-shadow:0 2px 16px rgba(0,0,0,.35)}
.cover .cl1{left:6%;bottom:30%;font-size:clamp(14px,1.5vw,19px)}.cover .cl1 b{display:block;font-size:clamp(44px,5vw,66px);font-weight:500;line-height:.9}
.cover .cl2{right:6%;bottom:31%;text-align:right;font-size:clamp(14px,1.5vw,19px)}.cover .cl2 i{font-size:1.2em}
.cover .cl3{left:6%;right:6%;bottom:6%;display:flex;justify-content:space-between;align-items:flex-end;font-size:clamp(12px,1.25vw,16px)}
.cover .cl3 span{letter-spacing:.14em;text-transform:uppercase;font-family:var(--sans);font-size:.72em;text-align:right}
.cover .cl3 span i{display:block;font-family:var(--serif);letter-spacing:.04em;text-transform:none;color:#ffd4cf;font-size:1.8em}
.float{position:absolute;z-index:3;background:#FBF8F4;border-radius:18px;padding:14px 16px;box-shadow:0 24px 50px -20px rgba(60,30,20,.45);font-size:13px;line-height:1.35;animation:bob 7s ease-in-out infinite}
.float b{display:block;font-family:var(--serif);font-weight:400;font-size:18px}
.f1{animation:none;left:-15%;top:37%;display:flex;gap:12px;align-items:center;max-width:250px}
.f1 img{width:52px;height:64px;border-radius:10px;object-fit:cover}
.f1 .pill{display:inline-block;margin-top:4px;font-size:10px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;background:var(--gold);color:#fff;border-radius:99px;padding:3px 8px}
.f2{right:-8%;top:-8%;animation-delay:-2.5s}
.f2 .dots{display:flex;gap:5px;margin-top:8px}.f2 .dots i{width:18px;height:18px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.06)}
.f3{left:-8%;bottom:-4%;animation-delay:-4.5s}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}

/* лента образов */
.strip{padding-block:36px 0;overflow:hidden}
.marquee{display:flex;gap:18px;width:max-content;animation:mq 70s linear infinite}
.marquee.rev{animation-direction:reverse;animation-duration:84s;margin-top:18px}
.strip:hover .marquee{animation-play-state:paused}
.mq{position:relative;width:clamp(180px,17vw,250px);aspect-ratio:3/4.2;border-radius:16px;overflow:hidden;flex:none;background:var(--paper2)}
.mq img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.mq:hover img{transform:scale(1.06)}
.mq span{position:absolute;left:12px;bottom:12px;right:12px;color:#fff;font-family:var(--serif);font-size:18px;line-height:1.1;text-shadow:0 2px 14px rgba(0,0,0,.4)}
.mq span small{display:block;font-family:var(--sans);font-size:10px;letter-spacing:.2em;text-transform:uppercase;opacity:.85;margin-bottom:4px}
@keyframes mq{to{transform:translateX(-50%)}}
.manifest{padding-block:clamp(90px,12vw,170px) clamp(40px,6vw,80px)}
.manifest p{font-family:var(--serif);font-size:clamp(28px,3.6vw,54px);line-height:1.18;letter-spacing:-.01em;max-width:22ch;text-wrap:balance}
.manifest p em{color:var(--rose)}
.manifest .wrap{display:grid;grid-template-columns:auto 1fr;gap:clamp(24px,6vw,110px)}
.manifest .side{font-size:14px;color:var(--mute);max-width:26ch;padding-top:14px}

/* примерочная */
.dark{background:var(--night);color:var(--cream)}
.dark .lead{color:#CDBFB2}.dark .muted{color:#9c8d80}
.dark .h2 em{color:var(--rose2)}
.studio{background:radial-gradient(120% 90% at 15% 0%,#2A1E17 0%,var(--night) 55%)}
.st{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(28px,5vw,80px);align-items:center}
.stage{position:relative;aspect-ratio:3/4;border-radius:26px;overflow:hidden;background:#221A15;box-shadow:0 50px 100px -30px rgba(0,0,0,.8),0 0 0 1px rgba(255,255,255,.06);touch-action:pan-y;user-select:none}
.stage .ly{position:absolute;inset:0;background-size:cover;background-position:center 30%;transition:opacity .7s var(--ease)}
.stage .ly.top{clip-path:inset(0 calc(100% - var(--p,100%)) 0 0)}
.stage .hd{position:absolute;top:0;bottom:0;left:var(--p,100%);width:2px;background:#fff;box-shadow:0 0 18px rgba(0,0,0,.5);opacity:0;transition:opacity .3s;cursor:ew-resize}
.stage .hd span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:52px;height:52px;border-radius:50%;background:#fff;color:var(--ink);display:grid;place-items:center;font-size:18px;box-shadow:0 10px 30px rgba(0,0,0,.35)}
.stage.cmp .hd{opacity:1}
.stage .tag{position:absolute;top:16px;font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;padding:7px 12px;border-radius:99px;background:rgba(17,13,11,.55);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:#fff;opacity:0;transition:opacity .3s}
.stage .tag.l{left:16px}.stage .tag.r{right:16px}
.stage.cmp .tag{opacity:1}
.stage .nm{position:absolute;left:22px;bottom:20px;right:22px;font-family:var(--serif);font-size:clamp(26px,3vw,40px);color:#fff;text-shadow:0 4px 24px rgba(0,0,0,.5);transition:opacity .3s}
.stage.cmp .nm{opacity:0}
.tabs{display:flex;flex-wrap:wrap;gap:8px;margin:34px 0 30px}
.tab{padding:11px 18px;border-radius:99px;font-size:14px;font-weight:500;color:#E8DDD1;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1);transition:all .3s}
.tab:hover{background:rgba(255,255,255,.12)}
.tab.on{background:var(--cream);color:var(--ink);box-shadow:none}
.sws{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:30px}
.sw{position:relative;width:52px;height:52px;border-radius:50%;background-size:cover;background-position:center 35%;box-shadow:0 0 0 1px rgba(255,255,255,.14);transition:transform .3s var(--ease),box-shadow .3s}
.sw:hover{transform:translateY(-3px)}
.sw.on{box-shadow:0 0 0 2px var(--night),0 0 0 4px var(--cream)}
.sw i{position:absolute;right:-3px;top:-3px;width:14px;height:14px;border-radius:50%;box-shadow:0 0 0 2px var(--night)}
.verdict{display:flex;align-items:center;gap:14px;margin-bottom:12px}
.vp{font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;padding:6px 12px;border-radius:99px;color:#fff}
.vp.go{background:var(--gold)}.vp.ok{background:var(--ok)}.vp.wa{background:var(--wa)}.vp.no{background:var(--no)}
.meter{display:flex;gap:4px;flex:1;max-width:220px}.meter i{flex:1;height:4px;border-radius:2px;background:rgba(255,255,255,.12);transition:background .4s}
.st-why{font-family:var(--serif);font-size:clamp(22px,2.2vw,30px);line-height:1.3;min-height:3.9em;color:#F4ECE3}
.st-btns{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.st-btns .btn{height:48px;padding:0 22px;font-size:14px}
.st-note{font-size:13px;color:#9c8d80;margin-top:26px;max-width:46ch}

/* что внутри */
.bento{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:clamp(150px,15vw,210px);gap:14px}
.bx{position:relative;border-radius:var(--r);overflow:hidden;background:var(--paper2);isolation:isolate;text-decoration:none;color:#fff}
.bx img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform 1.2s var(--ease)}
.bx:hover img{transform:scale(1.05)}
.bx:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 40%,rgba(17,11,8,.72))}
.bx .in{position:absolute;left:22px;right:22px;bottom:20px}
.bx .rn{font-family:var(--serif);font-style:italic;font-size:15px;opacity:.9}
.bx h3{font-family:var(--serif);font-weight:400;font-size:clamp(22px,2vw,30px);line-height:1.1;margin:2px 0 4px}
.bx p{font-size:13px;line-height:1.45;opacity:.85;max-width:38ch}
.b1{grid-column:span 5;grid-row:span 2}.b2{grid-column:span 3;grid-row:span 2}.b3{grid-column:span 4;grid-row:span 1}.b4{grid-column:span 4;grid-row:span 1}
.b5{grid-column:span 4;grid-row:span 2}.b6{grid-column:span 4;grid-row:span 2}.b7{grid-column:span 4;grid-row:span 1}.b8{grid-column:span 4;grid-row:span 1}
.b9{grid-column:span 7;grid-row:span 2}.b10{grid-column:span 5;grid-row:span 2}
.bx.pal{background:var(--card);color:var(--ink)}.bx.pal:after{display:none}
.bx.pal{display:flex;flex-direction:column;padding:22px}
.bx.pal .chips{position:static;display:grid;grid-template-columns:repeat(5,1fr);gap:8px;width:min(100%,300px);margin-top:44px}
.bx.pal .chips i{aspect-ratio:1;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.05)}
.bx.pal .in{position:static;margin-top:auto;padding-top:16px}
.bx.cap{background:var(--card);color:var(--ink)}.bx.cap:after{background:linear-gradient(180deg,transparent 55%,rgba(251,248,244,.96))}
.bx.cap .grid{position:absolute;inset:14px 14px auto;display:grid;grid-template-columns:repeat(6,1fr);align-content:start;gap:8px;z-index:-2}
.bx.cap .stat{top:auto;bottom:22px}
@media (min-width:641px){.bx.cap .in{max-width:62%}}
.bx.cap .grid img{position:static;border-radius:10px;aspect-ratio:1;height:auto}
.stat{position:absolute;right:20px;top:18px;font-family:var(--serif);font-size:15px;background:rgba(255,255,255,.18);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);padding:5px 11px;border-radius:99px;color:#fff}
.bx.pal .stat,.bx.cap .stat{background:var(--ink);color:var(--paper)}
.bx.pal .stat{left:22px;right:auto}

/* палитра */
.pal-sec{transition:background 1s var(--ease)}
.pal-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(32px,6vw,100px);align-items:start}
.season{font-family:var(--serif);font-size:clamp(48px,6vw,92px);line-height:1;letter-spacing:-.02em;margin:18px 0 22px}
.roles{display:flex;height:84px;border-radius:18px;overflow:hidden;margin-bottom:26px;box-shadow:0 20px 40px -24px rgba(60,30,20,.4)}
.role{position:relative;display:flex;align-items:flex-end;padding:12px 14px;color:#fff;font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;transition:flex .6s var(--ease),filter .3s;cursor:pointer;text-align:left}
.role:hover{filter:brightness(1.05)}
.role b{font-family:var(--serif);font-size:26px;font-weight:400;letter-spacing:0;margin-right:8px;text-transform:none}
.role.base{flex:60;background:linear-gradient(90deg,#C9A27A,#B5A898,#4A5E8C)}.role.sup{flex:30;background:linear-gradient(90deg,#FFB38A,#7FD4C8,#6C9BD8)}.role.acc{flex:10;background:linear-gradient(90deg,#F26B7A,#E8474C)}
.role.on{outline:3px solid var(--ink);outline-offset:-3px}
.chipset{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.chip{text-align:left}
.chip i{display:block;aspect-ratio:1;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.06),0 14px 26px -16px rgba(0,0,0,.45);transition:transform .4s var(--ease)}
.chip:hover i,.chip.on i{transform:scale(1.08)}
.chip span{display:block;font-size:13px;margin-top:10px;line-height:1.25}
.chip small{display:block;font-size:11px;color:var(--mute);font-variant-numeric:tabular-nums;letter-spacing:.04em}
.pal-note{margin-top:26px;font-size:15px;color:var(--ink2);max-width:52ch;min-height:3.2em}
.metals{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}
.metal{display:flex;align-items:center;gap:8px;font-size:13px;padding:6px 12px 6px 6px;border-radius:99px;background:var(--card);box-shadow:inset 0 0 0 1px var(--line)}
.metal i{width:22px;height:22px;border-radius:50%}
.metal.x{opacity:.5;text-decoration:line-through}

/* капсула */
.cap-wrap{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,90px);align-items:center}
.caps{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.ci{position:relative;border-radius:16px;overflow:hidden;background:var(--card);aspect-ratio:1;transition:opacity .5s,transform .5s var(--ease),box-shadow .5s}
.ci img{width:100%;height:100%;object-fit:cover}
.ci b{position:absolute;left:10px;top:8px;font-family:var(--serif);font-style:italic;font-weight:400;font-size:15px;color:var(--ink);background:rgba(255,255,255,.8);border-radius:99px;padding:0 8px}
.caps[data-stage] .ci{opacity:.22;transform:scale(.96)}
.caps[data-stage="1"] .ci.g1,.caps[data-stage="2"] .ci.g1,.caps[data-stage="2"] .ci.g2,.caps[data-stage="3"] .ci{opacity:1;transform:none}
.caps[data-stage="1"] .ci.g1,.caps[data-stage="2"] .ci.g2,.caps[data-stage="3"] .ci.g3{box-shadow:0 0 0 2px var(--rose)}
.counter{display:flex;align-items:baseline;gap:18px;margin:26px 0 8px}
.counter b{font-family:var(--serif);font-weight:400;font-size:clamp(90px,11vw,170px);line-height:.85;letter-spacing:-.04em;font-variant-numeric:tabular-nums;color:var(--rose)}
.counter span{font-size:15px;color:var(--mute);max-width:14ch;line-height:1.35}
.stages{display:flex;flex-direction:column;margin-top:26px;border-top:1px solid var(--line)}
.stg{display:grid;grid-template-columns:44px 1fr auto;gap:14px;align-items:center;padding:18px 4px;border-bottom:1px solid var(--line);text-align:left;transition:background .3s}
.stg:hover{background:rgba(255,255,255,.45)}
.stg .n{font-family:var(--serif);font-style:italic;color:var(--rose);font-size:20px}
.stg b{display:block;font-weight:600;font-size:15px}.stg span{font-size:14px;color:var(--mute)}
.stg em{font-size:24px;color:var(--ink)}
.stg.on{background:var(--card)}

/* с собой */
.pocket{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,3vw,40px);align-items:end}
.pk{text-align:center}
.pk h3{margin-top:26px}.pk p{font-size:14px;color:#CDBFB2;max-width:32ch;margin:8px auto 0}
.phone{position:relative;width:min(100%,250px);margin:0 auto;aspect-ratio:9/19.5;border-radius:42px;padding:10px;background:linear-gradient(145deg,#3a302a,#16110d);box-shadow:0 50px 90px -30px rgba(0,0,0,.9),inset 0 0 0 1px rgba(255,255,255,.12)}
.phone>*{width:100%;height:100%;border-radius:33px;object-fit:cover}
.phone:before{content:'';position:absolute;top:18px;left:50%;transform:translateX(-50%);width:82px;height:22px;border-radius:99px;background:#0b0907;z-index:2}
.card3d{width:min(100%,330px);margin:0 auto;aspect-ratio:85.6/54;perspective:1200px;cursor:pointer}
.card3d .inn{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform 1s var(--ease)}
.card3d:hover .inn,.card3d.flip .inn{transform:rotateY(180deg)}
.card3d img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:14px;backface-visibility:hidden;-webkit-backface-visibility:hidden;box-shadow:0 30px 60px -24px rgba(0,0,0,.8)}
.card3d img.bk{transform:rotateY(180deg)}
.pk .spacer{height:clamp(60px,9vw,150px)}

/* как это работает */
.steps3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.s3{background:var(--card);border-radius:var(--r);padding:30px 28px 32px;position:relative;overflow:hidden;min-height:340px;display:flex;flex-direction:column}
.s3 .n{font-family:var(--serif);font-size:88px;line-height:.8;color:var(--rose);letter-spacing:-.04em}
.s3 h3{margin:auto 0 10px}
.s3 p{font-size:15px;color:var(--ink2)}
.s3 .thumbs{position:absolute;right:22px;top:22px;display:flex}
.s3 .thumbs img{width:54px;height:70px;object-fit:cover;border-radius:10px;border:3px solid var(--card);margin-left:-16px;box-shadow:0 10px 20px -10px rgba(0,0,0,.4)}
.pipe{margin-top:14px;background:var(--ink);color:var(--cream);border-radius:var(--r);padding:28px;display:grid;grid-template-columns:auto 1fr;gap:18px 34px;align-items:center}
.pipe .t{font-family:var(--serif);font-size:24px;line-height:1.2;max-width:14ch}
.pipe ol{list-style:none;display:flex;flex-wrap:wrap;gap:8px;counter-reset:p}
.pipe li{counter-increment:p;font-size:13px;padding:9px 14px 9px 10px;border-radius:99px;background:rgba(255,255,255,.07);display:flex;gap:8px;align-items:center;animation:glow calc(var(--n,11)*.8s + 1.2s) linear infinite;animation-delay:calc(var(--i)*.8s)}
.pipe li:before{content:counter(p);width:20px;height:20px;border-radius:50%;background:rgba(255,255,255,.12);display:grid;place-items:center;font-size:11px}
/* волна по этапам: круг = число этапов × 0,8 с + пауза, каждый этап горит ~0,8 с — строго по порядку, без наложений */
@keyframes glow{0%,10%,100%{background:rgba(255,255,255,.07)}4%{background:rgba(232,71,90,.55)}}

/* честно */
.trust{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.tr{border-radius:var(--r);padding:30px;background:var(--card);box-shadow:inset 0 0 0 1px var(--line)}
.tr .ic{width:46px;height:46px;border-radius:14px;background:var(--paper2);display:grid;place-items:center;margin-bottom:22px}
.tr .ic svg{width:22px;height:22px;stroke:var(--rose);fill:none;stroke-width:1.6}
.tr p{font-size:15px;color:var(--ink2);margin-top:10px}
.vs{margin-top:14px;display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.vs figure{position:relative;border-radius:18px;overflow:hidden;aspect-ratio:3/4}
.vs figure img{width:100%;height:100%;object-fit:cover}
.vs figcaption{position:absolute;left:12px;bottom:12px;right:12px;color:#fff;font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;text-shadow:0 2px 10px rgba(0,0,0,.5)}
.vs figcaption b{display:block;font-family:var(--serif);font-size:19px;letter-spacing:0;text-transform:none;font-weight:400}

/* цена */
.price-wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:14px}
.price{background:var(--ink);color:var(--cream);border-radius:28px;padding:clamp(28px,4vw,56px);position:relative;overflow:hidden}
.price:before{content:'';position:absolute;right:-20%;top:-40%;width:70%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(232,71,90,.35),transparent 65%)}
.price .amt{display:flex;align-items:baseline;gap:16px;margin:18px 0 6px;flex-wrap:wrap}
.price .amt b{font-family:var(--serif);font-weight:400;font-size:clamp(72px,8vw,118px);line-height:.9;letter-spacing:-.03em}
.price .amt .was{color:#9c8d80;font-size:15px}
.price ul{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:12px 28px;margin:30px 0 36px}
.price li{display:flex;gap:10px;font-size:15px;line-height:1.4;color:#E8DDD1}
.price li:before{content:'';flex:none;width:18px;height:18px;margin-top:1px;border-radius:50%;background:var(--rose) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 10.5l3 3 7-7' stroke='white' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") center/12px no-repeat}
.gift{border-radius:28px;overflow:hidden;position:relative;min-height:420px;color:#fff;display:flex;align-items:flex-end}
.gift img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 30%}
.gift:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 30%,rgba(17,11,8,.8))}
.gift .in{position:relative;z-index:1;padding:clamp(24px,3vw,40px)}
.gift p{font-size:15px;opacity:.9;margin:10px 0 22px;max-width:36ch}

/* вопросы */
.faq{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(32px,6vw,100px)}
.qa{border-top:1px solid var(--line)}
.qa details{border-bottom:1px solid var(--line)}
.qa summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:20px;padding:24px 0;font-family:var(--serif);font-size:clamp(19px,1.8vw,24px);line-height:1.25}
.qa summary::-webkit-details-marker{display:none}
.qa summary:after{content:'+';font-family:var(--sans);font-weight:300;font-size:28px;line-height:.9;color:var(--rose);transition:transform .35s var(--ease)}
.qa details[open] summary:after{transform:rotate(45deg)}
.qa details p{padding:0 0 24px;color:var(--ink2);max-width:62ch}

/* финал */
.final{min-height:min(88svh,900px);display:flex;align-items:center;overflow:hidden;color:#fff;background:var(--night)}
.final>img{position:absolute;top:0;right:0;bottom:0;width:56%;height:100%;object-fit:cover;object-position:center 25%}
.final:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,var(--night) 44%,rgba(17,13,11,.55) 62%,rgba(17,13,11,0) 85%)}
.final .wrap{position:relative;z-index:1;width:100%}
.final .h1{max-width:12ch}.final .h1 em{color:#ffc2bc}
.final p{max-width:44ch;margin:22px 0 34px;font-size:18px;opacity:.92}
footer{background:var(--night);color:#9c8d80;font-size:13px;padding-block:44px calc(44px + env(safe-area-inset-bottom,0px))}
footer .wrap{display:flex;flex-wrap:wrap;gap:16px 40px;align-items:center}
footer .logo{color:var(--cream)}
footer a{text-decoration:none}footer a:hover{color:var(--cream)}

/* появление при прокрутке: без JS всё видно */
.js .rv{opacity:0;transform:translateY(34px);transition:opacity 1s var(--ease),transform 1s var(--ease)}
.js .rv.in{opacity:1;transform:none}
.js .rv.d1{transition-delay:.08s}.js .rv.d2{transition-delay:.16s}.js .rv.d3{transition-delay:.24s}

/* ═══ Оформление заказа ═══ */
.ord{position:fixed;inset:0;z-index:100;background:var(--paper);display:none;overflow:auto;overscroll-behavior:contain}
.ord.on{display:block;animation:ordIn .6s var(--ease)}
@keyframes ordIn{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
.ord-top{position:sticky;top:0;z-index:2;background:rgba(244,238,230,.9);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--line);padding-top:env(safe-area-inset-top,0px)}
.ord-top .wrap{display:flex;align-items:center;gap:20px;height:70px;max-width:1080px}
.ord-top .x{margin-left:auto;width:44px;height:44px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--line);font-size:18px}
.prog{display:flex;gap:6px;flex:1;max-width:420px}
.prog i{flex:1;height:4px;border-radius:2px;background:var(--line);overflow:hidden;position:relative}
.prog i:after{content:'';position:absolute;inset:0;background:var(--rose);transform:scaleX(0);transform-origin:left;transition:transform .6s var(--ease)}
.prog i.done:after{transform:scaleX(1)}
.ord-body{max-width:1080px;margin:0 auto;padding:clamp(28px,5vw,64px) var(--gut) 140px}
.stp{display:none}.stp.on{display:block;animation:ordIn .5s var(--ease)}
.stp .h2{font-size:clamp(34px,4.6vw,60px);margin:14px 0 14px}
.tips{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:30px 0}
.tip{background:var(--card);border-radius:18px;padding:18px;font-size:14px;line-height:1.4;box-shadow:inset 0 0 0 1px var(--line)}
.tip b{display:block;font-family:var(--serif);font-weight:400;font-size:19px;margin-bottom:6px}
.tip svg{width:26px;height:26px;stroke:var(--rose);fill:none;stroke-width:1.6;margin-bottom:12px}
.drop{position:relative;border-radius:24px;border:1.5px dashed rgba(23,17,14,.25);background:var(--card);padding:clamp(22px,3vw,34px);transition:border-color .3s,background .3s}
.drop.over{border-color:var(--rose);background:#fff}
.drop-cta{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.drop-cta .ic{width:58px;height:58px;border-radius:18px;background:var(--rose);display:grid;place-items:center;flex:none}
.drop-cta .ic svg{width:26px;height:26px;stroke:#fff;fill:none;stroke-width:1.8}
.drop-cta b{display:block;font-size:17px}.drop-cta span{font-size:14px;color:var(--mute)}
.drop-cta .btn{margin-left:auto;height:48px;font-size:14px}
.thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:10px;margin-top:22px}
.thumbs:empty{display:none}
.th{position:relative;aspect-ratio:3/4;border-radius:12px;overflow:hidden;background:var(--paper2);animation:ordIn .4s var(--ease)}
.th img{width:100%;height:100%;object-fit:cover}
.th button{position:absolute;right:6px;top:6px;width:26px;height:26px;border-radius:50%;background:rgba(17,11,8,.65);color:#fff;font-size:14px;line-height:1}
.count{font-size:14px;color:var(--mute);margin-top:14px;font-variant-numeric:tabular-nums}
.count b{color:var(--ink)}
.fgrp{background:var(--card);border-radius:24px;padding:clamp(20px,3vw,32px);margin-top:14px;box-shadow:inset 0 0 0 1px var(--line)}
.fgrp h3{font-family:var(--serif);font-weight:400;font-size:24px;margin-bottom:18px}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:14px 18px}
.fld{display:flex;flex-direction:column;gap:7px;font-size:13px;font-weight:500;color:var(--ink2)}
.fld.full{grid-column:1/-1}
.fld input,.fld textarea{font:inherit;font-size:16px;font-weight:400;color:var(--ink);background:var(--paper);border:1px solid transparent;border-radius:14px;padding:14px 16px;transition:border-color .25s,background .25s;width:100%}
.fld textarea{min-height:92px;resize:vertical}
.fld input:focus,.fld textarea:focus{outline:none;border-color:var(--rose);background:#fff}
.fld small{font-weight:400;color:var(--mute)}
.pills{display:flex;flex-wrap:wrap;gap:8px}
.pills button{padding:10px 15px;border-radius:99px;background:var(--paper);font-size:14px;transition:all .25s;box-shadow:inset 0 0 0 1px transparent}
.pills button:hover{box-shadow:inset 0 0 0 1px var(--line)}
.pills button.on{background:var(--ink);color:var(--paper)}
.chk{display:flex;gap:12px;align-items:flex-start;font-size:14px;line-height:1.5;color:var(--ink2);cursor:pointer;margin-top:14px}
.chk input{width:22px;height:22px;accent-color:var(--rose);flex:none;margin-top:1px}
.sum{display:grid;grid-template-columns:auto 1fr;gap:20px;align-items:center;background:var(--ink);color:var(--cream);border-radius:24px;padding:24px;margin-top:14px}
.sum .ph{display:flex}.sum .ph img{width:52px;height:68px;object-fit:cover;border-radius:10px;border:3px solid var(--ink);margin-left:-18px}.sum .ph img:first-child{margin-left:0}
.sum b{font-family:var(--serif);font-weight:400;font-size:22px;display:block}
.sum span{font-size:14px;color:#CDBFB2}
.ord-foot{position:fixed;left:0;right:0;bottom:0;z-index:3;background:rgba(244,238,230,.94);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom,0px)}
.ord-foot .wrap{max-width:1080px;display:flex;align-items:center;gap:14px;height:84px}
.ord-foot .hint{font-size:14px;color:var(--mute);margin-right:auto}
.ord-foot .hint.err{color:var(--no)}
.ord-foot .btn{height:54px}
.ord-foot .btn[disabled]{opacity:.35;pointer-events:none}
.up{height:6px;border-radius:3px;background:var(--line);overflow:hidden;margin-top:18px;display:none}
.up.on{display:block}.up i{display:block;height:100%;width:0;background:var(--rose);transition:width .3s}
.okd{text-align:center;max-width:640px;margin:0 auto;padding-top:clamp(20px,6vw,70px)}
.okd .ring{width:110px;height:110px;margin:0 auto 30px;border-radius:50%;background:var(--rose);display:grid;place-items:center;animation:pop .8s var(--ease)}
.okd .ring svg{width:46px;height:46px;stroke:#fff;fill:none;stroke-width:2.4}
@keyframes pop{0%{transform:scale(.4);opacity:0}60%{transform:scale(1.08)}100%{transform:none;opacity:1}}
.okd .no{display:inline-block;margin:20px 0;font-family:var(--serif);font-size:30px;letter-spacing:.1em;padding:10px 22px;border-radius:14px;background:var(--card);box-shadow:inset 0 0 0 1px var(--line)}
.okd ol{text-align:left;list-style:none;counter-reset:d;margin:26px auto 34px;max-width:470px}
.okd li{counter-increment:d;display:grid;grid-template-columns:36px 1fr;padding:14px 0;border-bottom:1px solid var(--line);font-size:15px}
.okd li:before{content:counter(d);font-family:var(--serif);font-style:italic;color:var(--rose);font-size:20px}

/* ═══ Адаптив ═══ */
@media (max-width:1080px){
  .nav nav{display:none}
  .hero .wrap,.st,.pal-grid,.cap-wrap,.faq,.price-wrap{grid-template-columns:1fr}
  .hero{padding-top:104px}
  .cover-zone{width:min(100%,440px);margin-top:10px}
  .f1{left:-4%}.f2{right:-3%}.f3{left:0}
  .bento{grid-template-columns:repeat(6,1fr)}
  .b1,.b9{grid-column:span 6}.b2,.b3,.b4,.b5,.b6,.b7,.b8,.b10{grid-column:span 3}
  .pocket{grid-template-columns:1fr 1fr}.pk.wide{grid-column:1/-1}
  .steps3,.trust{grid-template-columns:1fr}
  .s3{min-height:260px}
  .vs{grid-template-columns:repeat(2,1fr)}
  .tips{grid-template-columns:1fr 1fr}
  .pipe{grid-template-columns:1fr}
}
@media (max-width:640px){
  .final{align-items:flex-end;padding-bottom:56px;min-height:720px}.final>img{width:100%;height:62%;bottom:auto}.final:after{background:linear-gradient(180deg,rgba(17,13,11,0) 30%,var(--night) 62%)}
  body{font-size:15px}
  .nav .wrap{height:64px}.logo-img{height:36px}
  .nav .btn{height:40px;padding:0 16px;font-size:13px}
  .hero .cta .btn{width:100%;justify-content:center}
  .facts b{font-size:28px}
  .float{font-size:12px;padding:10px 12px;border-radius:14px}.float b{font-size:15px}
  .f1{top:40%;left:-2%;max-width:190px}.f1 img{width:40px;height:50px}
  .f2{right:-2%;top:41%}.f3{display:none}
  .manifest .wrap{grid-template-columns:1fr}
  .sec-head{grid-template-columns:1fr}
  .bento{grid-template-columns:1fr 1fr;grid-auto-rows:190px;gap:10px}
  .b1,.b9,.b5,.b6,.b10{grid-column:span 2}.b2,.b3,.b4,.b7,.b8{grid-column:span 1}.b10{grid-row:span 2}
  .bx.cap .grid{grid-template-columns:repeat(4,1fr)}.bx.cap .stat{top:auto;bottom:auto;display:none}
  .facts{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.facts b{font-size:26px}
  .f1{top:22%!important}
  .bx .in{left:14px;right:14px;bottom:14px}.bx p{display:none}.b1 p,.b9 p,.b5 p,.b6 p{display:block}
  .chipset{grid-template-columns:repeat(5,1fr);gap:8px}.chip span{font-size:11px}.chip small{display:none}
  .roles{height:70px}.role{font-size:10px;padding:10px}.role b{font-size:20px;margin-right:4px}.role.acc{flex:16}
  .caps{grid-template-columns:repeat(3,1fr);gap:8px}
  .pocket{grid-template-columns:1fr;gap:56px}
  .pk .spacer{display:none}
  .price ul{grid-template-columns:1fr}
  .vs{gap:10px}
  .tips{grid-template-columns:1fr}
  .fields{grid-template-columns:1fr}
  .drop-cta .btn{margin-left:0;width:100%;justify-content:center}
  .ord-foot .hint{display:none}.ord-foot .btn{flex:1;justify-content:center}
  .sum{grid-template-columns:1fr}
  .stage .nm{font-size:26px}
  .sw{width:44px;height:44px}
}
@media (prefers-reduced-motion:reduce){
  *,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .js .rv{opacity:1;transform:none}
}

/* ═══ Заставка ═══ */
.intro{display:none}
.intro-on .intro{display:grid;position:fixed;inset:0;z-index:300;background:var(--paper);place-items:center;transition:opacity .9s var(--ease),transform 1.1s var(--ease),visibility 0s .9s;cursor:pointer}
.intro-on body{overflow:hidden}
.intro.out{opacity:0;transform:translateY(-3%);visibility:hidden;pointer-events:none}
.intro-in{position:relative;width:min(74vw,500px);display:flex;flex-direction:column;align-items:center}
.i-glow{position:absolute;left:50%;top:44%;width:150%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(closest-side,rgba(255,190,160,.55),rgba(255,190,160,.18) 55%,rgba(255,190,160,0));opacity:0;pointer-events:none}
.i-mark{position:relative;width:86%;aspect-ratio:1014/536;--sw:0deg;-webkit-mask:conic-gradient(from -96deg at 36.1% 99.8%,#000 var(--sw),transparent calc(var(--sw) + 9deg));mask:conic-gradient(from -96deg at 36.1% 99.8%,#000 var(--sw),transparent calc(var(--sw) + 9deg))}
.i-mark img{position:absolute;inset:0;width:100%;height:100%;transform-origin:36.1% 99.8%;will-change:transform}
.i-sheen{position:absolute;inset:0;background:linear-gradient(105deg,transparent 40%,rgba(255,250,240,.75) 50%,transparent 60%) no-repeat;background-size:250% 100%;background-position:130% 0;-webkit-mask:url(brand/anim/mark.webp) center/100% 100% no-repeat;mask:url(brand/anim/mark.webp) center/100% 100% no-repeat;opacity:0}
.i-word{position:relative;width:100%;margin-top:9%;opacity:0}
.i-tag{position:relative;width:79%;margin-top:4.5%;opacity:0}

/* конструктор сочетания */
.mix{background:var(--card);border-radius:28px;padding:clamp(20px,3vw,32px);box-shadow:0 30px 60px -30px rgba(60,30,20,.35)}
.mix-top{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px}
.mix-rnd{font-size:13px;font-weight:600;padding:9px 16px;border-radius:99px;background:var(--ink);color:var(--paper);transition:background .3s}
.mix-rnd:hover{background:var(--rose)}
.mix-look{display:grid;grid-template-columns:6fr 3fr 1fr;height:150px;border-radius:18px;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(0,0,0,.05)}
.ml{position:relative;transition:background .6s var(--ease)}
.ml-p{position:absolute;left:12px;bottom:10px;font:400 22px/1 var(--serif);color:#fff;text-shadow:0 1px 8px rgba(0,0,0,.18)}
.ml.lt .ml-p{color:var(--ink);text-shadow:none}
.ml-a .ml-p{left:50%;transform:translateX(-50%);font-size:14px}
.mix-look.pop .ml{animation:mlpop .7s var(--ease) both}.mix-look.pop .ml-s{animation-delay:.06s}.mix-look.pop .ml-a{animation-delay:.12s}
@keyframes mlpop{from{filter:brightness(1.25) saturate(.6)}to{filter:none}}
.mix-name{font-family:var(--serif);font-size:clamp(20px,2vw,26px);line-height:1.25;margin:16px 0 18px;min-height:1.3em}
.mix-name em{color:var(--rose)}
.mix-rows{display:flex;flex-direction:column;gap:14px;border-top:1px solid var(--line);padding-top:18px}
.mx-h{display:flex;align-items:baseline;gap:10px;font-size:13px;margin-bottom:8px}
.mx-h b{font-weight:600;letter-spacing:.14em;text-transform:uppercase;font-size:11px}
.mx-pct{color:var(--mute);font-variant-numeric:tabular-nums}
.mx-cur{margin-left:auto;color:var(--ink2)}
.mx-sws{display:flex;gap:10px;flex-wrap:wrap}
.mx-sw{width:40px;height:40px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08);transition:transform .3s var(--ease),box-shadow .3s}
.mx-sw:hover{transform:translateY(-2px)}
.mx-sw.on{box-shadow:0 0 0 2px var(--card),0 0 0 4px var(--ink);transform:scale(1.06)}
.pal-note{margin-top:18px;font-size:14px;color:var(--ink2)}
/* этапы капсулы */
.stages{display:flex;flex-direction:column;gap:10px;margin-top:24px;border:0}
.stg{display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"n t c" "bar bar bar";align-items:center;gap:6px 16px;padding:16px 18px;border-radius:18px;background:rgba(255,255,255,.5);box-shadow:inset 0 0 0 1px var(--line);text-align:left;border:0;transition:background .3s,box-shadow .3s}
.stg:hover{background:rgba(255,255,255,.8)}
.stg.on{background:var(--card);box-shadow:0 16px 34px -20px rgba(60,30,20,.45),inset 0 0 0 1px rgba(232,71,90,.35)}
.stg .stg-n{grid-area:n;font:italic 400 18px/1 var(--serif);color:var(--rose)}
.stg .stg-t{grid-area:t;display:flex;flex-direction:column;gap:3px;min-width:0}
.stg .stg-t b{font-weight:600;font-size:15px}
.stg .stg-t small{font-size:13px;color:var(--mute);line-height:1.35}
.stg .stg-c{grid-area:c;font:400 30px/1 var(--serif);color:var(--ink);font-variant-numeric:tabular-nums}
.stg .stg-bar{grid-area:bar;display:block;height:3px;border-radius:2px;background:var(--line);overflow:hidden;margin-top:6px}
.stg-bar i{display:block;height:100%;width:0;background:var(--rose);transition:width .8s var(--ease)}
.stg.on .stg-bar i{width:var(--w)}
@media (max-width:640px){.mix-look{height:110px}.mx-sw{width:36px;height:36px}.bx.pal .chips{margin-top:40px;width:100%}}
.hero .h1{font-size:clamp(42px,6vw,90px)}

/* ═══ Основательница: тизер ═══ */
.founder{background:var(--paper)}
.fd{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(32px,6vw,100px);align-items:center}
.fd-ph{position:relative;display:block;border-radius:28px;overflow:hidden;aspect-ratio:4/5;cursor:pointer;box-shadow:0 50px 100px -40px rgba(60,30,20,.5)}
.fd-ph img{width:100%;height:100%;object-fit:cover;object-position:center 25%;transition:transform 1.4s var(--ease)}
.fd-ph:hover img{transform:scale(1.05)}
.fd-play{position:absolute;left:18px;bottom:18px;font-size:14px;font-weight:600;padding:12px 18px;border-radius:99px;background:rgba(251,248,244,.88);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:var(--ink)}
.fd .h2{margin:14px 0 20px}
.fd-sign{font-family:var(--serif);font-style:italic;font-size:22px;color:var(--rose);margin:22px 0 26px}

/* ═══ История: отдельный экран ═══ */
.story{position:fixed;inset:0;z-index:120;background:var(--paper);overflow:auto;overscroll-behavior:contain;visibility:hidden;clip-path:circle(0 at var(--ox,50%) var(--oy,50%));transition:clip-path .9s cubic-bezier(.7,0,.2,1),visibility 0s .9s}
.story.on{visibility:visible;clip-path:circle(150% at var(--ox,50%) var(--oy,50%));transition:clip-path .9s cubic-bezier(.7,0,.2,1)}
.st-bar{position:sticky;top:0;z-index:3;background:rgba(244,238,230,.86);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--line);padding-top:env(safe-area-inset-top,0px)}
.st-bar .wrap{display:flex;align-items:center;gap:18px;height:68px}
.st-crumb{font-size:12px;letter-spacing:.28em;text-transform:uppercase;color:var(--mute)}
.st-bar .x{margin-left:auto;width:44px;height:44px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--line);font-size:18px}
.st-prog{position:sticky;top:calc(68px + env(safe-area-inset-top,0px));z-index:3;height:2px}
.st-prog i{display:block;height:100%;width:0;background:var(--rose)}
.sy-hero{display:grid;grid-template-columns:1fr 1fr;min-height:min(calc(100svh - 70px),820px)}
.sy-hero-ph{position:relative;overflow:hidden}
.sy-hero-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 30%;transform:scale(1.08);transition:transform 2.4s var(--ease)}
.story.on .sy-hero-ph img{transform:none}
.sy-hero-t{display:flex;flex-direction:column;justify-content:center;padding:clamp(32px,6vw,96px)}
.sy-h1{font-family:var(--serif);font-weight:400;font-size:clamp(40px,5vw,78px);line-height:1.02;letter-spacing:-.015em;margin:16px 0 24px;text-wrap:balance}
.sy-h1 em{color:var(--rose)}
.sy-lead{font-size:clamp(17px,1.4vw,20px);line-height:1.6;color:var(--ink2);max-width:46ch}
.sy-scroll{margin-top:40px;font-size:12px;letter-spacing:.3em;text-transform:uppercase;color:var(--mute);animation:bob 3s ease-in-out infinite}
.sy-body{max-width:1120px;margin:0 auto;padding:clamp(60px,9vw,130px) var(--gut) 120px}
.sy-ch{display:grid;grid-template-columns:120px minmax(0,640px);gap:24px;margin:0 auto clamp(60px,8vw,110px);max-width:780px;position:relative}
.sy-n{font-family:var(--serif);font-style:italic;font-size:54px;line-height:1;color:var(--rose)}
.sy-tx h3,.sy-fr-t h3,.sy-end h3{font-family:var(--serif);font-weight:400;font-size:clamp(28px,3vw,42px);line-height:1.1;margin-bottom:18px;text-wrap:balance}
.sy-tx p,.sy-fr-t p,.sy-end p{font-size:17px;line-height:1.7;color:var(--ink2);margin-bottom:14px}
.sy-sw{grid-column:2;display:flex;gap:10px;margin-top:6px}
.sy-sw span{flex:1;height:64px;border-radius:14px;display:flex;align-items:flex-end;padding:10px 12px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#fff;font-weight:600}
.sy-wide{margin:0 auto clamp(60px,8vw,110px);position:relative;border-radius:28px;overflow:hidden;aspect-ratio:16/8}
.sy-wide img{width:100%;height:100%;object-fit:cover;object-position:center 30%}
.sy-wide figcaption{position:absolute;left:clamp(20px,4vw,48px);bottom:clamp(20px,4vw,40px);max-width:20ch;font-family:var(--serif);font-style:italic;font-size:clamp(22px,2.6vw,36px);line-height:1.2;color:#fff;text-shadow:0 2px 20px rgba(0,0,0,.35)}
.sy-fr{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(28px,5vw,72px);align-items:center;margin:0 auto clamp(60px,8vw,110px);background:var(--card);border-radius:32px;padding:clamp(18px,2.4vw,28px)}
.sy-fr-ph{border-radius:22px;overflow:hidden;aspect-ratio:4/5}
.sy-fr-ph img{width:100%;height:100%;object-fit:cover}
.sy-fr-t{padding:clamp(8px,2vw,24px) clamp(4px,2vw,24px) clamp(8px,2vw,24px) 0}
.sy-fr-t .sy-n{margin-bottom:14px}
.sy-note{margin-top:20px;padding:16px 18px;border-radius:16px;background:var(--paper);font-size:15px;line-height:1.55;color:var(--ink2);border-left:3px solid var(--rose)}
.sy-q{margin:0 auto clamp(60px,8vw,110px);background:var(--night);color:var(--cream);padding:clamp(60px,9vw,120px) var(--gut);text-align:center;border-radius:32px}
.sy-q p{font-family:var(--serif);font-size:clamp(30px,4.2vw,62px);line-height:1.15;letter-spacing:-.01em;max-width:20ch;margin:0 auto;text-wrap:balance}
.sy-q p:before{content:'«';color:var(--rose2)}.sy-q p:after{content:'»';color:var(--rose2)}
.sy-q cite{display:block;margin-top:26px;font-style:normal;font-size:13px;letter-spacing:.28em;text-transform:uppercase;color:#b9ab9d}
.sy-vals{margin:0 auto clamp(60px,8vw,110px)}
.sy-vh{font-family:var(--serif);font-weight:400;font-size:clamp(28px,3vw,42px);margin-bottom:24px;text-align:center}
.sy-vg{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.sy-vg div{background:var(--card);border-radius:22px;padding:26px;box-shadow:inset 0 0 0 1px var(--line)}
.sy-vg b{font-family:var(--serif);font-weight:400;font-size:24px;display:block;margin-bottom:10px}
.sy-vg p{font-size:15px;color:var(--ink2)}
.sy-end{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(28px,5vw,72px);align-items:center}
.sy-end-ph{border-radius:28px;overflow:hidden;aspect-ratio:4/5}
.sy-end-ph img{width:100%;height:100%;object-fit:cover}
.sy-end .sy-n{margin-bottom:14px}
.sy-sign{font-family:var(--serif);font-style:italic;font-size:22px!important;color:var(--ink)!important;margin:22px 0 28px!important}
.sy-sign span{font-size:1.5em;color:var(--rose)}
.story .rv2{opacity:0;transform:translateY(30px);transition:opacity 1s var(--ease),transform 1s var(--ease)}
.story .rv2.in{opacity:1;transform:none}
@media (max-width:900px){
  .fd,.sy-hero,.sy-fr,.sy-end{grid-template-columns:1fr}
  .sy-hero{min-height:0}.sy-hero-ph{aspect-ratio:4/5}
  .sy-ch{grid-template-columns:1fr;gap:10px}.sy-sw{grid-column:1}
  .sy-n{font-size:42px}
  .sy-vg{grid-template-columns:1fr}
  .sy-wide{aspect-ratio:4/5}
  .sy-fr-t{padding:6px 8px 12px}
}
@media (prefers-reduced-motion:reduce){.story,.story.on{clip-path:none;transition:none}}
@media (max-width:640px){.st-crumb{display:none}}
.phone>video{object-fit:contain;background:#000}

/* ═══ Шпаргалки ═══ */
.cheat{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,460px);gap:clamp(32px,6vw,110px);align-items:center}
.ch-list{display:flex;flex-direction:column;border-top:1px solid rgba(255,255,255,.08)}
.ch-it{display:grid;grid-template-columns:54px 1fr;gap:10px;align-items:center;text-align:left;padding:18px 8px;border-bottom:1px solid rgba(255,255,255,.08);color:#8f8176;transition:color .35s,padding .45s var(--ease)}
.ch-it:hover{color:#d8ccc0}
.ch-it.on{color:var(--cream);padding-left:18px}
.ch-n{font:italic 400 20px/1 var(--serif);color:inherit;transition:color .35s}
.ch-it.on .ch-n{color:var(--rose2)}
.ch-t b{display:block;font:400 clamp(22px,2vw,30px)/1.15 var(--serif);letter-spacing:-.005em}
.ch-t small{display:block;font-size:14px;line-height:1.4;margin-top:4px;max-height:0;opacity:0;overflow:hidden;transition:max-height .45s var(--ease),opacity .35s}
.ch-it.on .ch-t small{max-height:40px;opacity:1;color:#b9ab9d}
.ch-stage{position:relative;display:flex;flex-direction:column;align-items:center;gap:22px}
.ch-glow{position:absolute;left:50%;top:46%;width:150%;aspect-ratio:1;transform:translate(-50%,-50%);transition:background 1s var(--ease);pointer-events:none;filter:blur(10px)}
.ch-phone{position:relative;width:min(100%,330px);aspect-ratio:9/16.3;margin:0}
.ch-phone:before{display:none}
.ch-scr{position:relative;width:100%;height:100%;border-radius:34px;overflow:hidden;background:#F4EEE6}
.ch-scr>img,.ch-scr>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center top;border-radius:0;transition:opacity .6s var(--ease)}
.ch-scr>video{object-fit:contain;background:#000}
.ch-prog{width:min(100%,330px);height:2px;background:rgba(255,255,255,.1);border-radius:2px;overflow:hidden}
.ch-prog i{display:block;height:100%;background:var(--rose2);transform-origin:left;transform:scaleX(0)}
.today{position:absolute;inset:0;background:#F4EEE6;color:var(--ink);padding:38px 20px 20px;display:flex;flex-direction:column}
.today[hidden],.ch-scr>video[hidden]{display:none}
.td-k{font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--rose);font-weight:600}
.td-n{font:italic 400 15px var(--serif);color:var(--mute);margin-top:10px}
.td-t{font:400 28px/1.1 var(--serif);margin:4px 0 14px}
.td-g{display:grid;grid-template-columns:1fr 1fr;gap:10px;align-content:start;grid-auto-rows:min-content}
.td-g div{background:#fff;border-radius:16px;overflow:hidden}
.td-g img{display:block;width:100%;aspect-ratio:1;object-fit:cover}
.td-g span{display:block;font-size:11px;line-height:1.25;padding:7px 9px 9px;color:var(--ink2)}
.td-g.pop div{animation:chIn .5s var(--ease) both}.td-g.pop div:nth-child(2){animation-delay:.06s}.td-g.pop div:nth-child(3){animation-delay:.12s}.td-g.pop div:nth-child(4){animation-delay:.18s}
@keyframes chIn{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:none}}
.td-b{margin-top:auto;padding:14px;border-radius:99px;background:var(--ink);color:var(--paper);font-size:14px;font-weight:600}
@media (max-width:1080px){.cheat{grid-template-columns:1fr}.ch-stage{order:-1}}
@media (max-width:640px){.ch-phone,.ch-prog{width:min(78vw,300px)}.ch-t b{font-size:21px}.td-t{font-size:22px}.td-g span{font-size:10px}}

/* ═══ Ролик «Мой сезон» — главный в блоке ═══ */
.reelsec{background:radial-gradient(90% 70% at 25% 40%,#2A1A1C 0%,var(--night) 60%);padding-bottom:clamp(40px,6vw,80px)}
.rs{display:grid;grid-template-columns:minmax(0,440px) minmax(0,1fr);gap:clamp(36px,7vw,120px);align-items:center}
.rs-stage{position:relative;display:flex;flex-direction:column;align-items:center;gap:20px}
.rs-glow{position:absolute;left:50%;top:45%;width:170%;aspect-ratio:1;transform:translate(-50%,-50%);background:radial-gradient(closest-side,rgba(242,107,122,.35),transparent 70%);filter:blur(20px);pointer-events:none;animation:rsg 6s ease-in-out infinite}
@keyframes rsg{50%{opacity:.6;transform:translate(-50%,-50%) scale(1.06)}}
.rs-phone{position:relative;width:min(100%,380px);aspect-ratio:9/16;margin:0;padding:10px}
.rs-phone:before{display:none}
.rs-scr{position:relative;width:100%;height:100%;border-radius:34px;overflow:hidden;background:#000}
.rs-scr video{width:100%;height:100%;object-fit:cover;display:block}
.rs-sound{position:absolute;right:14px;bottom:14px;font-size:12px;font-weight:600;padding:8px 12px;border-radius:99px;background:rgba(0,0,0,.55);color:#fff;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.rs-bar{width:min(100%,380px);height:2px;background:rgba(255,255,255,.12);border-radius:2px;overflow:hidden}
.rs-bar i{display:block;height:100%;background:var(--rose2);transform-origin:left;transform:scaleX(0)}
.rs-t .h2{margin:14px 0 18px}
.rs-ch{list-style:none;margin-top:30px;border-top:1px solid rgba(255,255,255,.08);counter-reset:r}
.rs-ch li{counter-increment:r;display:grid;grid-template-columns:44px 1fr;align-items:baseline;padding:12px 6px;border-bottom:1px solid rgba(255,255,255,.08);cursor:pointer;color:#7f7268;transition:color .4s,padding .4s var(--ease)}
.rs-ch li:before{content:counter(r,decimal-leading-zero);font:italic 400 17px var(--serif)}
.rs-ch li b{font:400 21px/1.2 var(--serif);color:inherit}
.rs-ch li span{grid-column:2;font-size:13px;max-height:0;opacity:0;overflow:hidden;transition:max-height .4s var(--ease),opacity .3s}
.rs-ch li.done{color:#b3a699}
.rs-ch li.on{color:var(--cream);padding-left:14px}
.rs-ch li.on:before{color:var(--rose2)}
.rs-ch li.on span{max-height:30px;opacity:1;color:#b9ab9d;margin-top:3px}
.rs-ch li:hover{color:#d8ccc0}
#pocket{padding-top:clamp(40px,6vw,80px)}
#pocket .h2{font-size:clamp(30px,3.6vw,52px)}
@media (max-width:1080px){.rs{grid-template-columns:1fr}.rs-ch li b{font-size:19px}}
@media (max-width:640px){.rs-phone,.rs-bar{width:min(80vw,320px)}}

/* ═══════════ Телефон: отдельная вёрстка уровня лучших мобильных сайтов ═══════════ */
.sm-t,.i-whole{display:none}
@media (max-width:640px){
  :root{--gut:20px}
  body{font-size:15.5px}
  .sec{padding-block:72px}
  .sec-head{margin-bottom:28px;gap:16px}
  .h2{font-size:clamp(32px,9vw,40px);line-height:1.05}
  .lead{font-size:16px}
  .eyebrow{font-size:11px;letter-spacing:.24em}
  /* шапка: компактный логотип и короткая кнопка */
  .nav .wrap{height:60px;gap:12px}
  .logo-img{height:30px}
  .lg-t{display:none}.sm-t{display:inline}
  .nav .btn{height:38px;padding:0 16px;font-size:13px;margin-left:auto}
  /* первый экран: без 3D, аккуратная обложка, одна плашка */
  .hero{min-height:auto;padding-top:84px;padding-bottom:36px}
  .hero .h1{font-size:clamp(38px,11vw,46px);margin:14px 0 18px}
  .hero .cta{margin-top:26px;gap:10px}
  .hero .cta .btn{height:54px}
  .facts{margin-top:28px;padding-top:20px}
  .cover-zone{width:100%;margin-top:34px}
  .cover{transform:none!important;border-radius:22px;box-shadow:0 30px 60px -30px rgba(60,30,20,.55)}
  .cover .mast img{height:26px}
  .f1,.f3{display:none}
  .f2{top:auto!important;bottom:-18px;right:14px;left:auto;animation:none;padding:10px 14px}
  /* лента образов: одна строка, крупнее */
  .strip{padding-top:12px}
  .marquee.rev{display:none}
  .mq{width:62vw;border-radius:18px}
  .manifest{padding-block:64px 24px}
  .manifest p{font-size:26px}
  /* примерочная: вкладки и образцы — в одну ленту со свайпом */
  .tabs,.sws{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:calc(-1 * var(--gut));padding-inline:var(--gut);scroll-snap-type:x mandatory}
  .tabs::-webkit-scrollbar,.sws::-webkit-scrollbar{display:none}
  .tab,.sw{flex:none;scroll-snap-align:start}
  .tabs{margin-top:22px;margin-bottom:18px}.sws{padding-block:6px;margin-bottom:18px}
  .st-why{font-size:21px;min-height:0}
  .st-btns{flex-wrap:nowrap}.st-btns .btn{flex:1;height:46px;padding:0 12px;font-size:13px;justify-content:center}
  .st-note{display:none}
  /* «Что внутри»: карусель карточек со свайпом */
  .bento{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;grid-auto-rows:auto;margin-inline:calc(-1 * var(--gut));padding:4px var(--gut) 10px;scrollbar-width:none}
  .bento::-webkit-scrollbar{display:none}
  .bx{flex:none;width:78vw;height:440px;scroll-snap-align:center;border-radius:24px}
  .bx p{display:block!important}
  .bx.cap .grid{grid-template-columns:repeat(3,1fr)}
  .bx.cap .stat{display:inline-block;top:18px;bottom:auto;right:18px}
  #inside .sec-head .btn{display:none}
  /* капсула и палитра */
  .caps{grid-template-columns:repeat(4,1fr);gap:6px}.ci{border-radius:12px}.ci b{font-size:12px;left:6px;top:4px}
  .mix{border-radius:24px;padding:18px}
  /* ролик: телефон на всю ширину, главы компактно */
  .rs-phone,.rs-bar{width:min(86vw,340px)}
  .rs-ch li{padding:10px 4px}
  .rs-ch li b{font-size:18px}
  /* шпаргалки */
  .ch-phone,.ch-prog{width:min(86vw,340px)}
  .ch-t b{font-size:19px}
  /* как это работает: этапы — лентой */
  /* этапы на телефоне — переносятся строками, все видны сразу (лента вбок выглядела как «уехало за экран») */
  .pipe{padding:22px 18px}
  .pipe ol{flex-wrap:wrap;gap:7px}
  .pipe li{font-size:12.5px;padding:8px 12px 8px 8px}
  .s3{min-height:0;padding:24px}
  .s3 .n{font-size:64px}
  /* цена, подарок, вопросы */
  .price{border-radius:24px}.gift{min-height:380px;border-radius:24px}
  .qa summary{font-size:19px;padding:20px 0}
  .fd-ph{aspect-ratio:4/4.4}
  /* заставка на телефоне — та же, что на компьютере (веер, дуги, надпись из размытия, блик), чуть уже */
  .intro-in{width:min(80vw,340px)}
}
@keyframes sunrise{from{opacity:0;clip-path:inset(100% 0 0 0);transform:translateY(24px)}60%{opacity:1}to{opacity:1;clip-path:inset(0 0 0 0);transform:none}}
.st>div{min-width:0}
@media (max-width:640px){.s3 .thumbs{position:static;margin-bottom:14px;padding-left:16px}.s3 h3{margin-top:6px}}
/* ничто не должно расширять страницу вбок (свечения шире экрана) */
html,body{overflow-x:hidden}
@supports (overflow:clip){html,body{overflow-x:clip}}
main>section,.reelsec,#pocket{overflow-x:clip}
.rs-glow,.ch-glow{max-width:100vw}

.rs-dl{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600;padding:12px 20px;border-radius:99px;background:rgba(255,255,255,.08);color:var(--cream);text-decoration:none;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);transition:background .3s}
.rs-dl:hover{background:var(--rose2);color:#fff}

/* ── метод: стилист × ИИ (вместо перечня этапов) */
.pipe.mth{grid-template-columns:minmax(0,.8fr) minmax(0,2.6fr);align-items:stretch;padding:30px}
.mth .t{align-self:center;font-size:30px;max-width:none}.mth .t em{color:var(--rose2);font-style:normal}
.mth .t small{display:block;font:400 13px/1.45 var(--sans,Inter),sans-serif;color:#b9ab9d;margin-top:10px;max-width:22ch}
.mth-g{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.mth-c{position:relative;background:rgba(255,255,255,.06);border-radius:18px;padding:20px 20px 22px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.07);overflow:hidden}
.mth-c:after{content:'';position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,rgba(242,139,151,.16) 50%,transparent 65%) no-repeat;background-size:260% 100%;background-position:120% 0;animation:mthsh 9s ease-in-out infinite;pointer-events:none}
.mth-c:nth-child(2):after{animation-delay:3s}.mth-c:nth-child(3):after{animation-delay:6s}
@keyframes mthsh{0%,55%{background-position:120% 0}75%,100%{background-position:-60% 0}}
.mth-c span{font:italic 400 15px var(--serif);color:var(--rose2)}
.mth-c b{display:block;font:400 21px/1.2 var(--serif);margin:8px 0 8px;color:var(--cream)}
.mth-c p{font-size:13.5px;line-height:1.5;color:#c8bbae}
@media (max-width:900px){.pipe.mth{grid-template-columns:1fr;padding:24px 18px}.mth-g{grid-template-columns:1fr}.mth .t{font-size:26px}}

/* палитры в истории Даши: полоска цветов, подпись под ней (не поверх) */
.sy-pl div{flex:1;display:flex;flex-direction:column;gap:8px}
.sy-pl i{display:block;height:44px;border-radius:12px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.06)}
.sy-pl span{height:auto;padding:0;background:none!important;color:var(--ink2);font-size:12px;letter-spacing:.12em;text-transform:uppercase;font-weight:600}

/* телефон: подпись на мини-обложке читаемая; кнопка в финале на всю ширину, ровные поля */
@media (max-width:640px){
  .cover .cl1{font-size:13px!important;line-height:1.15}.cover .cl1 b{font-size:40px!important}
  .cover .cl2{font-size:13px!important}
  .cover .cl3 span{font-size:10px!important}.cover .iss{font-size:10px}
  .final .btn,.cta-end .btn,section:last-of-type .btn.rose{width:100%;justify-content:center}
}
