/* ============================================================ PLEATS — системный слой. Грузится последним, перекрывает старое. 01 токены · 02 шрифт · 03 знак · 04 выключка (переключатель) Чтобы откатить всё — снять один . ============================================================ */ /* ---------- 01 · ТОКЕНЫ ---------- */ :root{ --paper:#F4F1E8; --ink:#2A2822; --fam-mineral:#37596B; --fam-emeraude:#1E5641; --fam-iris:#6E6A86; --fam-epice:#B5462F; --fam-bois:#2A2822; /* что ушло — старые имена оставлены псевдонимами, чтобы ни одна прежняя декларация не осталась без значения */ --gold:var(--ink); --paper2:var(--paper); --emerald:var(--ink); --line:rgba(42,40,34,.14); --muted:rgba(42,40,34,.52); --on-dark:#F1ECDF; --gut:clamp(20px,5vw,64px); } /* акценты, которые были золотом и лежат на тёмном. INK на подвале #12140F не читается — там роль акцента берёт PAPER. */ .cookie a{color:var(--on-dark);} .cookie button{background:var(--paper);color:var(--ink);} .fnav a:hover,.flang a:hover,.flang a[aria-current]{color:var(--on-dark);} footer .news button{background:var(--on-dark);color:var(--ink);} footer .news input{color:var(--on-dark);border-bottom-color:rgba(241,236,223,.35);} footer .news input::placeholder{color:rgba(241,236,223,.5);} .card-tag,.card-tag.is-low,.card-tag.is-order{ background:var(--paper);color:var(--ink);border:none;} .card:focus-visible{outline:2px solid var(--ink);outline-offset:-2px;} .langsel option{color:var(--ink);} .buy{background:var(--ink);color:var(--paper);} .buy:hover{background:#3a382f;} .mail{border-color:var(--ink);color:var(--ink);} .mail:hover{background:var(--ink);color:var(--paper);} .notify input:focus{border-color:var(--ink);} .notify button{background:var(--ink);} .crumb a:hover,.morelinks a:hover,.backall:hover,.langrow a:hover{color:var(--ink);} .morelinks a:hover{border-bottom-color:var(--ink);} .morelinks h2{color:var(--ink);} .morelinks,.process{background:var(--paper);} .step::before{border-color:var(--ink);background:var(--paper);} .step.is-long::before,.step.is-end::before{background:var(--ink);} .step.is-long .step-d{color:var(--ink);} .pollen{display:none;} /* ---------- 02 · ШРИФТ ---------- */ /* Jost Light 300, единственная. Иерархия — кегль и трекинг, без курсива. */ body,body *{ font-family:'Jost','Noto Sans JP',sans-serif !important; font-style:normal !important; font-weight:300 !important; } body{font-size:16px;line-height:1.62;letter-spacing:.005em;} .poem{font-size:19px;line-height:1.5;letter-spacing:.015em;color:var(--ink);max-width:34ch;} .desc{font-size:15px;line-height:1.7;color:#54503f;max-width:44ch;} .house-body p{font-size:16.5px;line-height:1.75;} .house-body .lede{font-size:clamp(18px,2.3vw,23px);line-height:1.5;letter-spacing:.01em;} .house-body h2,.contact-body h2{ font-weight:300;text-transform:uppercase;letter-spacing:.22em; font-size:clamp(18px,2.4vw,26px);color:var(--ink);} .house-body .sig{color:var(--muted);font-size:15px;letter-spacing:.16em;text-transform:uppercase;} .quote blockquote p{font-weight:300;font-size:clamp(18px,2.2vw,26px); line-height:1.5;letter-spacing:.015em;color:var(--ink);} .comp h3,.process h2,.revs-t,.more-t{ font-weight:300;text-transform:uppercase;letter-spacing:.22em; font-size:clamp(15px,1.8vw,19px);color:var(--ink);} .numeral,.card-num{ font-size:11px;letter-spacing:.3em;color:var(--muted); text-transform:uppercase;margin-top:0;} .fam,.card-fam,.eyebrow,.comp .sub{color:var(--muted);} .vhero-txt p,.tile-txt p{letter-spacing:.02em;} /* ---------- 03 · ЗНАК ---------- */ .pleats-mark{display:block;overflow:visible;} .bar .brand{gap:14px;} .bar .brand .pleats-mark{color:var(--on-dark);} .emblem.pleats-mark{margin:0 auto 16px;opacity:1;width:auto;} .card .pleats-mark{margin:18px auto 10px;} .card-num{margin-top:0;} .crumb{padding-top:104px;} /* шапка выросла под знак 90 px */ /* ---------- 04 · ВЫКЛЮЧКА ВЛЕВО ---------- ВЫКЛЮЧЕНА. Тексты стоят по центру, как раньше. Включить: добавить класс на — Выключить обратно: убрать класс. Больше ничего трогать не нужно. */ .flush-left .tile,.flush-left .tile-txt,.flush-left .vhero,.flush-left .vhero-txt, .flush-left .panel,.flush-left .panel-in,.flush-left .house-body,.flush-left .contact-body, .flush-left .comp,.flush-left .quote,.flush-left .card,.flush-left .card-note, .flush-left .legal,.flush-left .desc,.flush-left .poem,.flush-left .detail, .flush-left .notify,.flush-left .tomenu,.flush-left .paneback,.flush-left .steps, .flush-left .step,.flush-left .sizes,.flush-left .pyr,.flush-left .cookie, .flush-left .fnav,.flush-left .flang,.flush-left .news,.flush-left .prog, .flush-left .revs,.flush-left .rev,.flush-left .rev q,.flush-left .rev cite, .flush-left .section-form,.flush-left .formnote,.flush-left .process, .flush-left .process-note,.flush-left .setsold,.flush-left .more,.flush-left .more-t, .flush-left .more-all,.flush-left .orderline,.flush-left .stockline, .flush-left .pricenote,.flush-left .morelinks,.flush-left .langrow, .flush-left footer{text-align:start;} .flush-left .vhero{justify-content:flex-start;} .flush-left .vhero-txt{padding-inline:var(--gut) 24px;} .flush-left .tile{justify-content:flex-start;} .flush-left .tile-txt{padding-inline:var(--gut) 24px;} .flush-left .panel{justify-content:flex-start;} .flush-left .panel-in{margin-inline:0;max-width:46ch;} .flush-left .house-body,.flush-left .contact-body,.flush-left .comp, .flush-left .morelinks,.flush-left .langrow, .flush-left footer{padding-inline:var(--gut);} .flush-left .quote,.flush-left .detail,.flush-left .notify,.flush-left .poem, .flush-left .desc,.flush-left .pricenote,.flush-left .news,.flush-left .prog, .flush-left .legal,.flush-left .steps{margin-inline:0;} .flush-left .quote blockquote:before{margin-inline:0;} .flush-left .tomenu{margin-inline-start:0;padding-inline:var(--gut);} .flush-left .pyr{justify-content:flex-start;gap:clamp(16px,3vw,38px);} .flush-left .steps,.flush-left .sizes,.flush-left .fnav,.flush-left .flang, .flush-left .cookie,.flush-left .more-row,.flush-left .morelinks ul, .flush-left .news .row{justify-content:flex-start;} .flush-left footer{align-items:flex-start;} /* трекинг оставляет хвост справа — компенсация нужна только при центре */ .flush-left .tile-txt h2,.flush-left .vhero-txt h1,.flush-left .panel h1, .flush-left .panel h3,.flush-left .card-name{padding-inline-start:0;} /* у центрованных блоков не было горизонтальных полей — при выключке нужны */ .flush-left .card>span:not(.card-ph){padding-inline:18px;} .flush-left .card .pleats-mark{margin:18px 18px 10px;} .flush-left .emblem.pleats-mark{margin:0 0 16px;} @media(min-width:861px){ .flush-left .step::before{left:0;transform:none;} .flush-left .steps::before{left:5px;right:calc(14.2857% - 5px);} } /* ---------- НОВЫЕ СНИМКИ ФЛАКОНОВ ---------- */ /* кадр квадратный, фон сведён к PAPER — подложка под ним плоская */ .card-ph img{aspect-ratio:1040/1024 !important;object-fit:contain !important; object-position:center !important;background:var(--paper);} .shot,.frag:nth-of-type(even) .shot{background:var(--paper);} .shot img{filter:none;width:min(92%,520px);} .card:hover{background:var(--paper);} .card:hover .card-ph img{transform:none;} @media(max-width:520px){ .card-ph img{aspect-ratio:1040/1024 !important;object-position:center !important;} } @media(max-width:640px){ body{font-size:15.5px;} .poem{font-size:17px;} /* 90 px знака на экране 390 — четверть ширины. Ступень ниже. */ .bar{padding:12px 18px;} .bar .brand .pleats-mark{width:56px;height:auto;} .crumb{padding-top:74px;} .flush-left .card>span:not(.card-ph){padding-inline:14px;} .flush-left .card .pleats-mark{margin:14px 14px 8px;} }