/* С286 блог idealio.ru — язык главной: графит, слоновая кость, золото; Cormorant Garamond + Jost */
:root{--bg:#14181d;--bg-deep:#0f1317;--bg-photo:#1b2026;--fg:#efe9df;--fg-dim:rgba(239,233,223,.62);--fg-faint:rgba(239,233,223,.38);
  --gold:#c9a96e;--gold-text:#c9a96e;--line:rgba(201,169,110,.32);--line-strong:rgba(201,169,110,.7);
  --serif:"Cormorant Garamond","Cormorant",Georgia,"Times New Roman",serif;--sans:"Jost","Helvetica Neue",Arial,sans-serif;
  --gutter:clamp(16px,5vw,96px);--ease:cubic-bezier(.22,.61,.36,1);color-scheme:dark}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:96px}
body{background:var(--bg);color:var(--fg);font-family:var(--sans);font-weight:300;font-size:17px;line-height:1.6;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
h1,h2,h3{font-family:var(--serif);font-weight:300;line-height:1.08;text-wrap:balance}
:focus-visible{outline:1px solid var(--gold);outline-offset:4px}
.caps{font-family:var(--sans);font-weight:400;font-size:11px;letter-spacing:.24em;text-transform:uppercase}
.gold{color:var(--gold-text)}
.wrap{padding-inline:var(--gutter)}
.section{padding-block:clamp(96px,11vw,180px);background:var(--bg);color:var(--fg)}
.light{--bg:#f4f1ea;--bg-photo:#e4dfd4;--fg:#1d252d;--fg-dim:#4f565e;--fg-faint:#767c83;--gold:#a3804a;--gold-text:#7d6035;
  --line:rgba(163,128,74,.5);--line-strong:rgba(163,128,74,.9);color-scheme:light;background:var(--bg);color:var(--fg)}
.section-head{display:grid;gap:24px;margin-bottom:clamp(48px,6vw,96px)}
.section-head h2{font-size:clamp(38px,5vw,72px);max-width:18ch}
.rule{height:1px;background:var(--line);width:100%}
.progress{position:fixed;inset:0 0 auto 0;height:2px;z-index:35;pointer-events:none}
.progress i{display:block;height:100%;background:var(--gold);transform:scaleX(0);transform-origin:left}

/* шапка и меню — как на главной */
.header{position:fixed;inset:0 0 auto 0;z-index:30;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
  padding:calc(22px + env(safe-area-inset-top,0px)) var(--gutter) 22px;color:#efe9df;border-bottom:1px solid transparent;
  transition:color .35s ease,background-color .45s ease,padding .45s ease,border-color .45s ease}
.header[data-on="light"]{color:#1d252d}
.header .logo{position:relative;display:inline-grid;place-items:center;font-family:var(--serif);font-size:26px;letter-spacing:.14em;text-transform:uppercase;font-weight:400}
.header .logo>*{grid-area:1/1;transition:opacity .6s ease,transform .6s var(--ease)}
.header .logo img{height:40px;width:auto;opacity:0;transform:scale(.85)}
.header.sc .logo span{opacity:0;transform:translateY(-6px)}
.header.sc .logo .lg-d{opacity:1;transform:none}
.header.sc[data-on="light"] .logo .lg-d{opacity:0}
.header.sc[data-on="light"] .logo .lg-l{opacity:1;transform:none}
.header.sc{background:rgba(20,24,29,.97);padding-top:calc(14px + env(safe-area-inset-top,0px));padding-bottom:14px;border-bottom-color:rgba(201,169,110,.18)}
.header.sc[data-on="light"]{background:rgba(244,241,234,.97);border-bottom-color:rgba(163,128,74,.25)}
.header .left,.header .right{display:flex;align-items:center;gap:36px}
.header .right{justify-content:flex-end}
.burger{display:flex;flex-direction:column;gap:7px;width:28px;padding:4px 0}
.burger i{display:block;height:1px;background:currentColor;width:100%}
.burger i:last-child{width:60%}
.lang{display:flex;gap:10px}.lang span{opacity:.45}.lang b{font-weight:400}
.header .cta{display:inline-flex;align-items:center;gap:12px}
.cta-ico{width:30px;height:30px;border:1px solid currentColor;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;flex:none}
.cta-ico svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:1.2}
@media (max-width:900px){.header .logo img{height:34px}.header .cta{display:none}.header{padding-block:calc(18px + env(safe-area-inset-top,0px)) 18px}.header .logo{font-size:22px}}
@media (max-width:420px){.lang{display:none}}
.menu{position:fixed;inset:0;z-index:40;background:#14181d;color:#efe9df;display:flex;flex-direction:column;justify-content:safe center;overflow-y:auto;padding:var(--gutter);
  visibility:hidden;pointer-events:none;clip-path:inset(0 0 100% 0);transition:clip-path .85s cubic-bezier(.76,0,.24,1),visibility 0s linear .85s}
.menu.open{visibility:visible;pointer-events:auto;clip-path:inset(0 0 0 0);transition:clip-path .85s cubic-bezier(.76,0,.24,1),visibility 0s}
.menu>a,.menu .foot,.menu .close{opacity:0;transform:translateY(32px);transition:opacity .35s ease,transform .5s var(--ease)}
.menu.open>a,.menu.open .foot,.menu.open .close{opacity:1;transform:none;transition:opacity .7s ease calc(.38s + var(--k,0)*.08s),transform .9s var(--ease) calc(.38s + var(--k,0)*.08s)}
.menu>a::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:rgba(201,169,110,.32);transform:scaleX(0);transform-origin:left;transition:transform .3s ease}
.menu.open>a::after{transform:scaleX(1);transition:transform 1.1s var(--ease) calc(.55s + var(--k,0)*.08s)}
.menu>a{position:relative;font-family:var(--serif);font-size:clamp(36px,min(7vw,9vh),96px);line-height:1.1;padding:10px 0;display:flex;justify-content:space-between;align-items:baseline;max-width:720px}
.menu>a span{font-family:var(--sans);font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:#c9a96e}
.menu .close{position:absolute;top:calc(22px + env(safe-area-inset-top,0px));right:var(--gutter);font-size:11px;letter-spacing:.24em;text-transform:uppercase}
.menu .foot{margin-top:48px;color:rgba(239,233,223,.62);font-size:14px;display:flex;gap:16px 40px;flex-wrap:wrap}

/* кнопки */
.btn{display:inline-flex;align-items:center;gap:18px;color:var(--fg);font-family:var(--sans);font-weight:400;font-size:11px;letter-spacing:.24em;text-transform:uppercase}
.btn .cta-ico{width:44px;height:44px;border-color:var(--gold);color:var(--gold);transition:background .6s var(--ease),color .6s var(--ease)}
.btn .cta-ico svg{width:14px;height:14px}
a:hover .btn .cta-ico,.btn:hover .cta-ico{background:var(--gold);color:var(--bg)}
.more{margin-top:clamp(56px,6vw,96px)}

.bl-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(48px,5vw,80px) clamp(24px,2.4vw,40px)}
.bc{display:grid;gap:22px;align-content:start;color:inherit;min-width:0}
.bc[hidden]{display:none!important}
.bc-ph{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:var(--bg-photo);--r:clamp(28px,3.4vw,52px);border-radius:var(--r) 0 var(--r) 0;transform:translateZ(0)}
.bc:nth-child(even) .bc-ph{border-radius:0 var(--r) 0 var(--r)}
.bc-ph img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s cubic-bezier(.22,.61,.36,1)}
.bc-ph::after{content:"";position:absolute;inset:0;border:1px solid var(--line);border-radius:inherit;pointer-events:none}
.bc:hover .bc-ph img{transform:scale(1.035)}
.fb{background:radial-gradient(120% 90% at var(--fx,30%) var(--fy,60%),rgba(201,169,110,.34) 0,rgba(201,169,110,.08) 38%,rgba(201,169,110,0) 62%),linear-gradient(135deg,#1b2026 0%,#14181d 55%,#0f1317 100%);color:#efe9df}
.fb::before{content:"";position:absolute;inset:14px;border:1px solid rgba(201,169,110,.32);border-radius:inherit;pointer-events:none}
.fb-in{position:absolute;inset:0;display:grid;place-items:center;align-content:center;gap:10px;text-align:center;padding:24px}
.fb-m{font-family:var(--serif);font-size:clamp(44px,4vw,64px);line-height:1;color:#c9a96e;font-weight:300;letter-spacing:.1em}
.fb-c{font-family:var(--sans);font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:rgba(239,233,223,.72)}
.bc-m{display:grid;gap:12px;min-width:0}
.bc-k{display:flex;gap:18px;flex-wrap:wrap;color:var(--fg-dim)}
.bc-k span+span::before{content:"·";margin-right:18px;color:var(--gold)}
.bc-t{font-family:var(--serif);font-weight:300;font-size:clamp(25px,2.1vw,32px);line-height:1.12;text-wrap:balance;margin:0}
.bc-d{color:var(--fg-dim);font-size:15.5px;line-height:1.6;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.bc-go{display:inline-flex;gap:12px;align-items:center;color:var(--gold-text)}
.bc-go i{font-style:normal;transition:transform .6s cubic-bezier(.22,.61,.36,1)}
.bc:hover .bc-go i{transform:translateX(6px)}
@media (max-width:1100px){.bl-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:700px){.bl-grid{grid-template-columns:1fr;gap:56px}}

/* крошки */
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:6px 0;color:var(--fg-dim)}
.crumbs li+li::before{content:"/";margin:0 12px;color:var(--gold)}
.crumbs a:hover{color:var(--fg)}

/* список статей */
.bl-hero{padding-top:clamp(140px,16vw,220px);padding-bottom:clamp(64px,8vw,120px);display:grid;gap:28px}
.bl-hero .crumbs{margin-bottom:clamp(12px,3vw,40px)}
.bl-hero h1{font-size:clamp(44px,6.6vw,104px);max-width:15ch}
.bl-hero p{max-width:56ch;color:var(--fg-dim);font-size:18px}
.bl-list{padding-top:clamp(64px,7vw,110px)}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:clamp(48px,6vw,88px)}
.chip{font-family:var(--sans);font-weight:400;font-size:12px;letter-spacing:.14em;text-transform:uppercase;padding:11px 18px;border:1px solid var(--line);border-radius:999px;color:var(--fg-dim);transition:background .4s var(--ease),color .4s var(--ease),border-color .4s}
.chip sup{font-size:9px;margin-left:6px;color:var(--gold-text);vertical-align:super}
.chip:hover{border-color:var(--gold);color:var(--fg)}
.chip[aria-pressed="true"]{background:var(--fg);border-color:var(--fg);color:var(--bg)}
.chip[aria-pressed="true"] sup{color:var(--bg);opacity:.7}
.bl-empty{color:var(--fg-dim);font-size:18px}
@media (max-width:700px){.chips{flex-wrap:nowrap;overflow-x:auto;margin-inline:calc(var(--gutter)*-1);padding-inline:var(--gutter);scrollbar-width:none}.chips::-webkit-scrollbar{display:none}.chip{flex:none}}

/* статья: шапка */
.ar-hero{padding-top:clamp(130px,14vw,200px);padding-bottom:clamp(56px,7vw,100px);display:grid;gap:clamp(22px,2.6vw,34px)}
.ar-hero h1{font-size:clamp(40px,5.4vw,84px);max-width:20ch;line-height:1.04}
.ar-desc{max-width:58ch;color:var(--fg-dim);font-size:clamp(17px,1.4vw,20px);line-height:1.6}
.ar-meta{display:flex;flex-wrap:wrap;row-gap:8px;color:var(--fg-dim);margin-left:-29px;clip-path:inset(0 0 0 29px)}
.ar-meta>*{position:relative;margin-left:29px}
.ar-meta>*::before{content:"·";position:absolute;left:-17px;color:var(--gold)}
.ar-cover{position:relative;display:block;aspect-ratio:21/9;overflow:hidden;margin-top:clamp(16px,3vw,40px);background:var(--bg-photo);--r:clamp(36px,5vw,88px);border-radius:var(--r) 0 var(--r) 0}
.ar-cover img{width:100%;height:100%;object-fit:cover}
.ar-cover::after{content:"";position:absolute;inset:0;border:1px solid var(--line);border-radius:inherit;pointer-events:none}
.ar-cover.fb{aspect-ratio:32/9}
.ar-cover.fb .fb-m{font-size:clamp(64px,8vw,128px)}
.ar-cover.fb .fb-c{font-size:12px}
@media (max-width:700px){.ar-cover{aspect-ratio:16/10}.ar-cover.fb{aspect-ratio:2/1}}

/* статья: тело */
.ar-body{padding-block:clamp(72px,8vw,130px)}
.ar-grid{display:grid;grid-template-columns:minmax(0,46rem);justify-content:center;gap:clamp(48px,6vw,112px)}
.toc-d{display:none}
@media (min-width:1100px){.ar-grid{grid-template-columns:minmax(200px,270px) minmax(0,46rem)}
  .toc-d{display:grid;gap:22px;align-content:start;position:sticky;top:112px;max-height:calc(100vh - 140px);overflow:auto;padding-right:8px}
  .toc-m{display:none}}
.toc ol{list-style:none;counter-reset:t;display:grid;gap:2px}
.toc li{counter-increment:t}
.toc ol a{display:grid;grid-template-columns:28px 1fr;gap:6px;padding:9px 0;font-size:14.5px;line-height:1.45;color:var(--fg-dim);border-bottom:1px solid transparent;transition:color .3s}
.toc ol a::before{content:counter(t,decimal-leading-zero);font-size:11px;letter-spacing:.12em;color:var(--gold);padding-top:3px}
.toc ol a:hover,.toc ol a.on{color:var(--fg)}
.toc ol a.on{border-bottom-color:var(--line)}
.toc-cta{display:inline-flex;gap:10px;color:var(--gold-text);margin-top:8px}
.toc-cta i{font-style:normal}
.toc-m{border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:44px}
.toc-m summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:18px 0;color:var(--gold-text)}
.toc-m summary::-webkit-details-marker{display:none}
.toc-m summary i,.qa summary i{position:relative;width:14px;height:14px;flex:none}
.toc-m summary i::before,.toc-m summary i::after,.qa summary i::before,.qa summary i::after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:currentColor;transition:transform .4s var(--ease)}
.toc-m summary i::after,.qa summary i::after{transform:rotate(90deg)}
.toc-m[open] summary i::after,.qa[open] summary i::after{transform:rotate(0)}
.toc-m ol{padding-bottom:16px}

.prose{min-width:0;font-weight:400;font-size:clamp(17px,1.25vw,19px);line-height:1.75;color:#2a3239;counter-reset:h2}
.prose>p,.prose .outro p{margin:0 0 1.15em}
.prose p.lead{font-family:var(--serif);font-weight:400;font-size:clamp(23px,2vw,28px);line-height:1.45;color:var(--fg);margin-bottom:1.4em}
.prose h2{font-size:clamp(32px,3.2vw,46px);margin:2.1em 0 .7em;color:var(--fg);counter-increment:h2;display:grid;gap:14px}
.prose h2::before{content:counter(h2,decimal-leading-zero);font-family:var(--sans);font-size:11px;letter-spacing:.24em;color:var(--gold-text);font-weight:400}
.prose .faq h2::before{content:"FAQ"}
.prose h3{font-size:clamp(24px,2vw,29px);font-weight:400;margin:1.7em 0 .5em;color:var(--fg)}
.prose strong{font-weight:500;color:var(--gold-text)}
.prose em{font-style:italic}
.prose a{color:var(--fg);text-decoration:underline;text-decoration-color:var(--gold);text-decoration-thickness:1px;text-underline-offset:4px;transition:color .3s}
.prose a:hover{color:var(--gold-text)}
.prose ul,.prose ol{margin:0 0 1.3em;padding:0;list-style:none;display:grid;gap:.55em}
.prose li{position:relative;padding-left:34px}
.prose ul>li::before{content:"";position:absolute;left:2px;top:.85em;width:16px;height:1px;background:var(--gold)}
.prose ol{counter-reset:li}
.prose ol>li{counter-increment:li}
.prose ol>li::before{content:counter(li);position:absolute;left:0;top:-.05em;font-family:var(--serif);font-size:1.3em;color:var(--gold-text)}
.prose li>ul,.prose li>ol{margin:.5em 0 0}
.prose blockquote{position:relative;margin:2.2em 0;padding:clamp(26px,3vw,40px) clamp(22px,3vw,44px);background:#ebe6dc;border-left:1px solid var(--gold);border-radius:0 clamp(24px,3vw,44px) 0 clamp(24px,3vw,44px);display:grid;gap:14px}
.prose blockquote p{margin:0;font-family:var(--serif);font-size:clamp(21px,1.75vw,25px);line-height:1.45;color:var(--fg)}
.prose blockquote strong{color:var(--fg);font-weight:500}
.q-l{color:var(--gold-text);display:flex;align-items:center;gap:14px}
.q-l::before{content:"";width:28px;height:1px;background:var(--gold)}
.tbl{margin:2em 0 2.2em;border-top:1px solid var(--line-strong)}
.tbl table{width:100%;border-collapse:collapse;font-size:15.5px;line-height:1.5}
.tbl th{font-family:var(--sans);font-weight:400;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-text);text-align:left;padding:16px 16px 14px 0;border-bottom:1px solid var(--line);vertical-align:bottom}
.tbl td{padding:16px 16px 16px 0;border-bottom:1px solid var(--line);vertical-align:top}
.tbl td:first-child{font-weight:500;color:var(--fg)}
@media (max-width:700px){
  .tbl{border-top:0}
  .tbl thead{display:none}
  .tbl table,.tbl tbody,.tbl tr,.tbl td{display:block;width:100%}
  .tbl tr{padding:18px 0;border-top:1px solid var(--line)}
  .tbl tr:last-child{border-bottom:1px solid var(--line)}
  .tbl td{border:0;padding:4px 0;display:grid;grid-template-columns:minmax(92px,38%) 1fr;gap:14px}
  .tbl td::before{content:attr(data-label);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-text);font-weight:400;padding-top:3px}
  .tbl td:first-child{display:block;font-family:var(--serif);font-size:22px;font-weight:400;padding-bottom:8px}
  .tbl td:first-child::before{display:none}
}
.prose .toc ol{counter-reset:t;display:grid;gap:2px;margin:0}
.prose .toc li{counter-increment:t;padding-left:0}
.prose .toc li::before{display:none}
.prose .toc a{text-decoration:none}
.toc-m ol{padding-bottom:16px!important}
.prose hr{border:0;height:1px;background:var(--line);margin:2.4em 0}
.prose img{margin:2em 0}
.faq{margin-top:1em}
.qa{border-top:1px solid var(--line)}
.qa:last-child{border-bottom:1px solid var(--line)}
.qa summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:22px 0;font-family:var(--serif);font-size:clamp(21px,1.7vw,25px);line-height:1.3;color:var(--fg)}
.qa summary::-webkit-details-marker{display:none}
.qa summary i{color:var(--gold)}
.qa summary:hover{color:var(--gold-text)}
.qa-a{padding:0 0 24px;color:#2a3239}
.qa-a p{margin:0 0 .8em}
.outro{margin-top:2.4em}
.ar-end{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-top:3em;color:var(--fg-dim)}
.ar-end a{color:var(--gold-text);display:inline-flex;gap:10px;text-decoration:none}
.ar-end i{font-style:normal}

/* CTA */
.bl-cta .section-head h2{max-width:20ch}
.cta-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(20px,2.4vw,40px)}
.cta-grid.one{grid-template-columns:minmax(0,860px)}
.cta-card{position:relative;display:grid;align-content:start;border:1px solid var(--line);--r:clamp(28px,3.4vw,56px);border-radius:var(--r) 0 var(--r) 0;overflow:hidden;transition:border-color .6s var(--ease),background .6s var(--ease);min-width:0}
.cta-card.alt{border-radius:0 var(--r) 0 var(--r)}
.cta-card:hover{border-color:var(--line-strong);background:rgba(201,169,110,.04)}
.cta-b{display:grid;gap:18px;padding:clamp(28px,3.4vw,52px);align-content:start}
.cta-t{font-family:var(--serif);font-size:clamp(28px,2.6vw,40px);line-height:1.1;font-weight:300}
.cta-d{color:var(--fg-dim);max-width:46ch}
.cta-b .btn{margin-top:10px}
.cta-ph{display:block;aspect-ratio:16/9;overflow:hidden;border-bottom:1px solid var(--line)}
.cta-ph img{width:100%;height:100%;object-fit:cover;object-position:top center;transition:transform 1.4s var(--ease)}
.cta-card:hover .cta-ph img{transform:scale(1.03)}
@media (max-width:900px){.cta-grid{grid-template-columns:1fr}}

/* подвал */
.footer{background:var(--bg-deep);padding-block:clamp(72px,8vw,120px) 40px;display:grid;gap:64px}
.footer .top{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px}
.footer .ft-logo{width:220px;height:auto;justify-self:center}
.footer .cols{display:grid;grid-template-columns:repeat(4,1fr);gap:32px}
.footer .col{display:grid;gap:14px;align-content:start}
.footer .col .caps{color:var(--gold-text);margin-bottom:6px}
.footer .col a,.footer .ft-t{color:var(--fg-dim);font-size:15px}
.footer .col a:hover{color:var(--fg)}
.footer .soc{display:flex;gap:14px}
.footer .soc a{width:36px;height:36px;border:1px solid var(--line-strong);border-radius:50%;display:inline-flex;align-items:center;justify-content:center}
.footer .soc svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.2}
.footer .bottom{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;color:var(--fg-faint);font-size:13px;border-top:1px solid var(--line);padding-top:28px}
.footer .req{margin-top:14px;color:var(--fg-faint);font-size:12px;letter-spacing:.02em}
.footer .req a{color:var(--fg-dim);text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:3px;white-space:nowrap}
.footer .req a:hover{color:var(--fg)}
@media (max-width:700px){.footer{padding-bottom:110px}} /* реквизиты и ссылка на политику не под кружком Иделии */
.prose.legal h2{font-size:clamp(28px,2.6vw,38px)}
.prose.legal{overflow-wrap:anywhere}
@media (max-width:900px){.footer .cols{grid-template-columns:1fr 1fr}.footer .ft-logo{width:170px}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition-duration:.01ms!important}}
