/* BLONSKY v3 — багатосторінковий незалежний концепт. Одна дизайн-система на всі сторінки:
   молоко (папір), кірка (охра), земля льоху (темний зі штрихуванням). Alegreya — заголовки, Arsenal — текст,
   IBM Plex Mono — етикетки. У кожної важливої сторінки — свій прийом (див. V3_ARCHITECTURE.md). */
:root{
  --paper:#F2EADC;--paper-2:#E8DCC6;--paper-3:#F8F3EA;--white:#FFFDF8;
  --ink:#1E1611;--ink-2:#45362A;--muted:#66554A;
  --line:rgba(30,22,17,.14);--line-2:rgba(30,22,17,.3);
  --earth:#211811;--earth-2:#2A1F16;--on-earth:#EFE6D6;--on-earth-2:#C4B6A0;--line-e:rgba(239,230,214,.18);
  --rind:#B4742F;--rind-ink:#87501C;--rind-lt:#DDA75E;
  --ok:#2F4A22;--bad:#9A2B12;
  --serif:'Alegreya',Georgia,'Times New Roman',serif;--sans:'Arsenal','Segoe UI',system-ui,sans-serif;--mono:'IBM Plex Mono',ui-monospace,Consolas,monospace;
  --wrap:1280px;--gut:clamp(16px,4vw,44px);--sec:clamp(64px,9vw,128px);
  --ease:cubic-bezier(.2,.7,.2,1);--r:14px;
}
@view-transition{navigation:auto}
::view-transition-old(root),::view-transition-new(root){animation-duration:.32s}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;background:var(--paper);color:var(--ink);font:400 18px/1.6 var(--sans);text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
/* Коротка сторінка не «обривається»: підвал завжди внизу вікна */
body{min-height:100vh;min-height:100svh;display:flex;flex-direction:column}
main{flex:1 0 auto}
img,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:.2em}
a:hover{text-decoration-thickness:2px}
h1,h2,h3,h4{font-family:var(--serif);font-weight:500;line-height:1.04;margin:0;letter-spacing:-.012em;text-wrap:balance}
h1 em,h2 em,h3 em{font-style:italic;font-weight:500;color:var(--rind-ink)}
p{margin:0 0 1em}
ul,ol{margin:0;padding:0}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--rind);outline-offset:3px}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gut)}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.skip{position:absolute;left:12px;top:-90px;z-index:200;background:var(--ink);color:var(--paper);padding:12px 16px;border-radius:8px}
.skip:focus{top:12px}
.muted{color:var(--muted)}
.small{font-size:15px}
.src{font:500 14px/1.35 var(--mono);color:var(--muted);margin:6px 0 0}
.eyebrow{font:500 14px/1.35 var(--mono);letter-spacing:.07em;text-transform:uppercase;color:var(--rind-ink);margin:0 0 14px}
.js .no-js-note{display:none}
html:not(.js) .js-only{display:none!important}
.no-js-note{font-size:15px;color:var(--muted)}
/* Відкрите меню/кошик: прокрутку вимкнено, але місце під смугу прокрутки лишається — сторінка не зсувається вбік (Windows) */
html.is-locked,html.is-locked body{overflow:hidden}
html.is-locked{scrollbar-gutter:stable}
.ic{width:22px;height:22px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.ic-lg{width:32px;height:32px}
.ic-xl{width:56px;height:56px;stroke-width:1.2}

/* Земляні розділи зі штрихуванням (як на розрізі) */
.earth{background-color:var(--earth);background-image:repeating-linear-gradient(135deg,rgba(239,230,214,.04) 0 1px,transparent 1px 13px);color:var(--on-earth)}
.earth h1 em,.earth h2 em,.earth h3 em{color:var(--rind-lt)}
.earth .eyebrow{color:var(--rind-lt)}
.earth .muted,.earth .src{color:var(--on-earth-2)}
.earth a{color:var(--on-earth)}

/* Кнопки й посилання */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 26px;border-radius:999px;border:1.5px solid transparent;font:700 16px/1.1 var(--sans);letter-spacing:.02em;text-decoration:none;cursor:pointer;transition:background-color .25s,color .25s,border-color .25s,transform .3s var(--ease)}
.btn:active{transform:translateY(1px)}
.btn-sm{min-height:46px;padding:0 18px;font-size:15px}
.btn-ink{background:var(--ink);color:var(--paper)}
.btn-ink:hover{background:#3A2A1E}
.btn-line{background:transparent;border-color:var(--ink);color:var(--ink)}
.btn-line:hover{background:var(--ink);color:var(--paper)}
.btn-rind{background:var(--rind-lt);color:#1E1611}
.btn-rind:hover{background:#E8B873}
.earth a.btn-rind{color:#1E1611}
.earth a.btn-ink{color:var(--paper)}
.earth .btn-line{border-color:var(--on-earth);color:var(--on-earth)}
.earth .btn-line:hover{background:var(--on-earth);color:var(--earth)}
.btn[aria-disabled="true"]{opacity:.45;pointer-events:none}
.link-arrow{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-weight:700;text-decoration:none;border-bottom:1.5px solid currentColor;padding-top:2px;line-height:1.2}
.link-arrow::after{content:'→';transition:transform .3s var(--ease)}
.link-arrow:hover::after{transform:translateX(4px)}
.link-btn{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border:1.5px solid var(--ink);border-radius:999px;background:transparent;font:700 15px/1.2 var(--sans);cursor:pointer}
.link-btn:hover{background:var(--ink);color:var(--paper)}
.hero-cta{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;margin:28px 0 0}
.round{width:46px;height:46px;border-radius:50%;border:1.5px solid var(--line-2);background:transparent;cursor:pointer;display:grid;place-items:center;font-size:18px}
.round:hover{border-color:var(--ink)}

/* Смужка «концепт» */
.concept-bar{margin:0;padding:9px var(--gut);background:#E3D3B8;color:var(--ink-2);font-size:14px;line-height:1.45;text-align:center}
.cb-short{display:none}
@media (max-width:600px){.cb-long{display:none}.cb-short{display:inline}}

/* Шапка */
.top{position:sticky;top:0;z-index:60;background:rgba(242,234,220,.94);border-bottom:1px solid transparent;transition:border-color .3s}
@supports (backdrop-filter:blur(8px)){.top{background:rgba(242,234,220,.84);backdrop-filter:saturate(1.2) blur(10px)}}
.top.is-scrolled{border-bottom-color:var(--line)}
.top-in{max-width:var(--wrap);margin:0 auto;padding:0 var(--gut);height:70px;display:flex;align-items:center;gap:20px}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;flex:none;min-height:48px;min-width:48px}
.mark{width:38px;height:38px;flex:none}
.mk-rind{fill:var(--rind)}.mk-paste{fill:#ECCB86}.mk-hand{stroke:var(--ink);stroke-width:2.6;stroke-linecap:round}.mk-dot{fill:var(--ink)}
.brand-t{display:flex;flex-direction:column;line-height:1;margin:0}
.brand-t small{font:400 14px/1.1 var(--sans);color:var(--muted)}
.brand-t b{font:italic 600 25px/1 var(--serif);letter-spacing:-.01em}
.nav{display:none;gap:clamp(12px,1.6vw,24px);margin-left:auto}
.nav a{font-size:16px;text-decoration:none;min-height:46px;min-width:44px;display:inline-flex;align-items:center;justify-content:center;border-bottom:1.5px solid transparent}
.nav a:hover{border-bottom-color:var(--line-2)}
.nav a[aria-current="page"]{border-bottom-color:var(--rind)}
.cart-btn{margin-left:auto;display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:0 8px 0 14px;border:1.5px solid var(--ink);border-radius:999px;text-decoration:none;font-weight:700;font-size:16px;background:var(--paper-3);transition:background-color .2s}
.cart-btn:hover{background:var(--white)}
.cart-n{min-width:28px;height:28px;padding:0 7px;border-radius:14px;background:var(--ink);color:var(--paper);font:500 14px/28px var(--mono);text-align:center;transition:transform .3s var(--ease)}
.cart-n.bump{transform:scale(1.3)}
.menu-btn{display:inline-flex;align-items:center;min-height:46px;padding:0 16px;border:1.5px solid var(--line-2);border-radius:999px;text-decoration:none;font-weight:700;font-size:16px}
@media (min-width:1180px){.nav{display:flex}.cart-btn{margin-left:8px}.menu-btn{display:none}}
@media (max-width:420px){.cb-t{display:none}.brand-t small{display:none}.top-in{gap:10px}}
@media (max-width:359px){.brand-t{display:none}.menu-btn{padding:0 12px}}

/* Діалоги */
dialog{color:var(--ink)}
dialog::backdrop{background:rgba(20,14,9,.55)}
.x-btn{width:46px;height:46px;border-radius:50%;border:1.5px solid var(--line-2);background:transparent;cursor:pointer;position:relative;flex:none}
.x-btn span::before,.x-btn span::after{content:'';position:absolute;left:12px;right:12px;top:21.5px;height:1.8px;background:currentColor;transform:rotate(45deg)}
.x-btn span::after{transform:rotate(-45deg)}
.menu{margin:0;width:100%;max-width:100%;height:100%;max-height:100%;border:0;padding:0;background:var(--paper)}
.menu-in{max-width:var(--wrap);margin:0 auto;padding:12px var(--gut) 40px}
.menu-top{display:flex;align-items:center;justify-content:space-between;height:58px;margin-bottom:8px}
.menu-nav{display:flex;flex-direction:column}
.menu-nav a{font:500 clamp(26px,6.5vw,38px)/1.15 var(--serif);text-decoration:none;padding:7px 0;border-bottom:1px solid var(--line)}
.menu-nav a[aria-current="page"]{color:var(--rind-ink);font-style:italic}
.drawer{margin:0 0 0 auto;width:min(440px,100vw);max-width:100vw;height:100%;max-height:100%;border:0;padding:0;background:var(--paper);box-shadow:-20px 0 60px rgba(20,14,9,.25)}
.drawer[open]{animation:slide-in .35s var(--ease)}
@keyframes slide-in{from{transform:translateX(40px);opacity:0}}
.drawer-in{padding:18px 22px 28px;display:flex;flex-direction:column;gap:14px;min-height:100%}
.drawer-top{display:flex;align-items:center;justify-content:space-between}
.drawer-top h2{font-size:32px}
.drawer-cta{display:flex;flex-direction:column;gap:10px;margin:6px 0 0}

/* Міні-список кошика (шухляда, оформлення) */
.mini-list{list-style:none;display:grid}
.mini-list li{display:grid;grid-template-columns:56px minmax(0,1fr) auto;gap:4px 12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}
.mini-list img,.mini-list .pi{width:56px;height:56px;object-fit:cover;border-radius:8px;grid-row:span 2}
.mini-list .m-name{font:600 18px/1.15 var(--serif);text-decoration:none}
.mini-list .m-name:hover{text-decoration:underline}
.mini-list small{display:block;font:400 14px/1.3 var(--sans);color:var(--muted)}
.mini-list .m-tot{font:600 17px/1 var(--serif);white-space:nowrap}
.mini-list .qty{grid-column:2/-1}
.mini-empty[hidden]{display:none}
.sum{margin:12px 0 0}
.sum div{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:6px 0}
.sum dt{font-size:16px;color:var(--muted)}
.sum dd{margin:0;font:600 20px/1 var(--serif);text-align:right}
.sum-total dd,.drawer .sum dd{font-size:32px}

/* Кількість */
.qty{display:inline-flex;align-items:center;gap:4px}
.qty button{width:44px;height:44px;border-radius:50%;border:1.5px solid var(--line-2);background:transparent;cursor:pointer;font:400 22px/1 var(--sans)}
.qty button:hover{border-color:var(--ink)}
.qty output{min-width:30px;text-align:center;font:500 16px/1 var(--mono)}
.earth .qty button{border-color:var(--line-e)}
.qty-pick{display:inline-flex;align-items:center;border:1.5px solid var(--line-2);border-radius:999px;padding:3px}
.qty-pick button{width:44px;height:44px;border:0;border-radius:50%;background:transparent;cursor:pointer;font-size:22px}
.qty-pick button:hover{background:var(--paper-2)}
.qty-pick input{width:48px;min-height:44px;border:0;background:transparent;text-align:center;font:500 17px/1 var(--mono);-moz-appearance:textfield;padding:0}
.qty-pick input::-webkit-inner-spin-button{appearance:none}

/* Кнопка «в кошик» */
.add{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;min-width:46px;padding:0 16px;border-radius:999px;border:1.5px solid var(--ink);background:transparent;cursor:pointer;font:700 15px/1 var(--sans);transition:background-color .2s,color .2s,border-color .2s}
.add:hover{background:var(--ink);color:var(--paper)}
.add.is-added{background:var(--rind-lt);border-color:var(--rind-lt);color:#1E1611}
.add-sm{width:46px;padding:0}
.add-sm span:empty{display:none}
.add-lg{min-height:54px;padding:0 26px;background:var(--ink);color:var(--paper);font-size:16px}
.add-lg:hover{background:#3A2A1E}
.earth .add{border-color:var(--on-earth);color:var(--on-earth)}
.earth .add:hover{background:var(--on-earth);color:var(--earth)}
.earth .add.is-added{background:var(--rind-lt);border-color:var(--rind-lt);color:#1E1611}
.fly{position:fixed;z-index:300;width:16px;height:16px;border-radius:50%;background:var(--rind);pointer-events:none;box-shadow:0 0 0 4px rgba(180,116,47,.25)}

/* Сповіщення */
.toasts{position:fixed;z-index:250;left:50%;bottom:18px;transform:translateX(-50%);display:grid;gap:8px;width:min(480px,calc(100vw - 24px))}
.toast{display:flex;align-items:center;gap:12px;padding:12px 14px 12px 18px;border-radius:14px;background:var(--ink);color:var(--paper);box-shadow:0 12px 30px rgba(0,0,0,.25);font-size:16px;animation:toast-in .3s var(--ease)}
.toast a,.toast button{margin-left:auto;color:var(--rind-lt);font-weight:700;background:none;border:0;cursor:pointer;min-height:44px;padding:0 6px;text-decoration:underline;text-underline-offset:.2em;flex:none}
@keyframes toast-in{from{transform:translateY(12px);opacity:0}}

/* Фото й підписи */
.ph{margin:0;position:relative;overflow:hidden;background:var(--paper-2)}
.ph img{width:100%;height:100%;object-fit:cover}
.ph-note{position:absolute;left:10px;bottom:10px;margin:0;padding:3px 9px;border-radius:999px;background:rgba(30,22,17,.74);color:#F2EADC;font-size:14px;line-height:1.35;max-width:calc(100% - 20px)}
.ph-slot{display:grid;place-items:center;background:radial-gradient(circle at 50% 42%,#FBF7EF 0,#EFE4D2 72%);aspect-ratio:4/5}
.slot-in{position:absolute;inset:0;display:grid;place-items:center}
.pi-slot{width:58%;height:auto;aspect-ratio:1;filter:drop-shadow(0 18px 18px rgba(60,35,15,.18))}
.crop{position:absolute;width:24px;height:24px;border:0 solid var(--ink-2)}
.crop-tl{left:14px;top:14px;border-left-width:1.5px;border-top-width:1.5px}.crop-tr{right:14px;top:14px;border-right-width:1.5px;border-top-width:1.5px}
.crop-bl{left:14px;bottom:14px;border-left-width:1.5px;border-bottom-width:1.5px}.crop-br{right:14px;bottom:14px;border-right-width:1.5px;border-bottom-width:1.5px}

/* Заголовки розділів і сторінок */
.sec-head{max-width:860px;margin-bottom:clamp(28px,4vw,52px)}
.sec-head h2{font-size:clamp(40px,5.6vw,80px)}
.sec-head h2+.sec-lead{margin-top:18px}
.sec-lead{font-size:clamp(18px,1.4vw,20px);max-width:38em;color:var(--ink-2)}
.earth .sec-lead{color:var(--on-earth-2)}
.sec-head-row{max-width:none;display:grid;gap:10px 60px;align-items:end}
@media (min-width:980px){.sec-head-row{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}.sec-head-row .sec-lead{margin-bottom:6px}}
.crumbs{display:flex;flex-wrap:wrap;gap:6px 8px;align-items:center;font-size:15px;color:var(--muted);padding:14px 0 10px}
.crumbs a{text-decoration:none;min-height:44px;min-width:44px;display:inline-flex;align-items:center}
.crumbs a:hover{text-decoration:underline}
.earth .crumbs{color:var(--on-earth-2)}
.page-head{padding:6px 0 clamp(28px,4vw,48px)}
.page-head-tight{padding-bottom:clamp(18px,3vw,32px)}
.page-head h1{font-size:clamp(48px,7vw,104px);line-height:.95}
.ph-row{display:grid;gap:14px 60px;align-items:end}
.ph-row .sec-lead{margin:0}
@media (min-width:980px){.ph-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.more-row{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px;margin:32px 0 0}
.link-row{display:flex;flex-wrap:wrap;gap:8px 24px}

/* Сітки й картки товарів */
.grid{display:grid;gap:clamp(16px,2vw,28px);grid-template-columns:minmax(0,1fr)}
@media (min-width:420px){.grid-4,.grid-shop,.grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:860px){.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-shop{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1100px){.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}.grid-shop{grid-template-columns:repeat(3,minmax(0,1fr))}}
.card{display:flex;flex-direction:column;background:var(--paper-3);border-radius:var(--r);overflow:hidden;box-shadow:0 1px 0 var(--line);transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.card:hover{transform:translateY(-3px);box-shadow:0 18px 36px rgba(60,35,15,.12)}
.card[hidden]{display:none}
.card-media{display:block;position:relative}
.card-media .ph{aspect-ratio:4/5}
.card-media .ph img{transition:transform 1.1s var(--ease)}
.card:hover .card-media .ph img{transform:scale(1.035)}
.card-set .card-media .ph{aspect-ratio:4/5}
.gifts .card-set .card-media .ph,.pp-sets .card-set .card-media .ph,.cart-empty .card-set .card-media .ph{aspect-ratio:3/2}
.badge{position:absolute;right:10px;top:10px;padding:4px 10px;border-radius:999px;background:var(--paper);color:var(--ink);font:500 14px/1.3 var(--mono)}
.card-body{display:flex;flex-direction:column;gap:6px;padding:16px 16px 18px;flex:1}
.card-meta{margin:0;font:500 14px/1.3 var(--mono);text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.card-t{font:600 clamp(22px,2vw,27px)/1.08 var(--serif)}
.card-t a{text-decoration:none;display:flex;align-items:center;min-height:44px}
.card-t a:hover{text-decoration:underline;text-decoration-thickness:1.5px}
.card-d{margin:0;font-size:16px;line-height:1.45;color:var(--ink-2)}
.card .tage{margin-top:auto;padding-top:4px}
.card .tage + .card-buy{margin-top:0}
.card-buy{margin-top:auto;padding-top:10px;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.price{margin:0;font:600 24px/1 var(--serif);white-space:nowrap}
.price small{font:500 14px/1 var(--mono);color:var(--muted);margin-left:4px}
/* Телефон: компактна сітка у дві колонки (як у хороших інтернет-крамницях) */
@media (min-width:340px) and (max-width:599px){
  .grid-shop,.grid-4{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .grid-shop .card-d,.grid-4 .card-d,.grid-shop .cap-l,.grid-4 .cap-l{display:none}
  .grid-shop .card-body,.grid-4 .card-body{padding:10px 10px 12px;gap:4px}
  .grid-shop .card-t,.grid-4 .card-t{font-size:19px}
  .grid-shop .card-meta,.grid-4 .card-meta{letter-spacing:0;text-transform:none;font-family:var(--sans)}
  .grid-shop .tage small,.grid-4 .tage small{display:none}
  .grid-shop .tbar,.grid-4 .tbar{min-width:0}
  .grid-shop .price,.grid-4 .price{font-size:20px}
  .grid-shop .price small,.grid-4 .price small{display:block;margin:4px 0 0}
  .grid-shop .card-buy,.grid-4 .card-buy{flex-wrap:nowrap}
  .grid-shop .add span,.grid-4 .add span{display:none}
  .grid-shop .add,.grid-4 .add{width:46px;padding:0;flex:none}
  .grid-shop .ph-note,.grid-4 .ph-note{left:6px;bottom:6px;padding:2px 8px}
  .grid-shop .badge,.grid-4 .badge{right:6px;top:6px;padding:2px 8px}
}
.earth .card{background:var(--earth-2);box-shadow:0 0 0 1px var(--line-e)}
.earth .card-d{color:var(--on-earth-2)}
.earth .card-meta,.earth .price small{color:var(--on-earth-2)}

/* Шкала витримки */
.tage{display:flex;align-items:center;gap:10px;min-width:0}
.tage small{font:500 14px/1 var(--mono);color:var(--muted);white-space:nowrap;min-width:60px}
.earth .tage small{color:var(--on-earth-2)}
.tbar{position:relative;flex:1;min-width:80px;height:14px;background:linear-gradient(var(--line-2),var(--line-2)) center/100% 1px no-repeat,linear-gradient(var(--line-2),var(--line-2)) 40.8% 50%/1px 9px no-repeat,linear-gradient(var(--line-2),var(--line-2)) 70.7% 50%/1px 9px no-repeat,linear-gradient(var(--line-2),var(--line-2)) 100% 50%/1px 9px no-repeat}
.earth .tbar{background:linear-gradient(var(--line-e),var(--line-e)) center/100% 1px no-repeat,linear-gradient(var(--line-e),var(--line-e)) 40.8% 50%/1px 9px no-repeat,linear-gradient(var(--line-e),var(--line-e)) 70.7% 50%/1px 9px no-repeat,linear-gradient(var(--line-e),var(--line-e)) 100% 50%/1px 9px no-repeat}
.tb{position:absolute;top:3px;height:8px;border-radius:4px;background:var(--rind);min-width:8px}
.tb-pt{width:0!important;min-width:0;background:none}
.tb-pt::after{content:'';position:absolute;left:-6px;top:-2px;width:12px;height:12px;border-radius:50%;background:var(--rind);box-shadow:0 0 0 3px var(--paper-3)}
.earth .tb-pt::after{box-shadow:0 0 0 3px var(--earth)}
.tb-fz::after{background:var(--paper-3);border:2px dashed var(--rind)}
.tb-fz-key{display:inline-block;width:12px;height:12px;border-radius:50%;border:2px dashed var(--rind);vertical-align:-1px;margin-right:4px}
.ks{position:relative;display:block;height:26px}
.ks i{position:absolute;top:4px;font:500 14px/1 var(--mono);font-style:normal;color:var(--muted);transform:translateX(-50%);white-space:nowrap}
.earth .ks i{color:var(--on-earth-2)}
.ks-0{left:5%}.ks-2{left:40.8%}.ks-6{left:70.7%}.ks-12{left:94%}

/* ═══ ГОЛОВНА ═══ */
/* Перший екран — рівно на висоту вікна мінус смуга «концепт» і шапка (--first-off; точне значення ставить home.js):
   текст, садиба на лінії землі й фото на всю висоту. Темна «земля» з цифрами починається вже після прокрутки. */
:root{--first-off:109px;--farm-h:clamp(96px,min(12vw,17svh),170px)}
@media (max-width:699px){:root{--first-off:130px}}
.hero{position:relative}
.hero-in{display:flex;flex-direction:column;gap:clamp(16px,2.6svh,26px);position:relative;min-height:calc(100svh - var(--first-off));padding-top:clamp(18px,3.5svh,44px);padding-bottom:var(--gut)}
.hero h1{font-size:clamp(50px,min(8.6vw,15.5svh),124px);line-height:.9;letter-spacing:-.025em;margin-bottom:clamp(14px,2.6svh,26px)}
.hero h1 em{display:block}
.hero .eyebrow{margin-bottom:clamp(8px,1.6svh,14px)}
.hero .hero-cta{margin-top:clamp(16px,3svh,28px)}
.lead{font-size:clamp(19px,1.55vw,22px);line-height:1.55;max-width:33em;color:var(--ink-2)}
.hero .lead{font-size:clamp(17px,min(1.55vw,3.1svh),22px);line-height:1.5}
.earth .lead{color:var(--on-earth)}
/* Фото заповнює все місце, що лишилось до низу першого екрана (на телефоні — під текстом, на компʼютері — колонка) */
.hero-photo{flex:1 1 auto;min-height:clamp(150px,26svh,320px)}
.hero-photo img{position:absolute;inset:0}
/* Вузькі телефони: підпис місцевості в один рядок, обидві кнопки в один ряд — фото лишається повністю на першому екрані */
@media (max-width:399px){
  .hero .eyebrow{letter-spacing:.02em}
  .hero .hero-cta{gap:10px}
  .hero .hero-cta .btn{padding:0 17px}
}
.ground{position:relative;border-bottom:1.6px solid var(--ink)}
.farm{width:auto;height:var(--farm-h);margin-left:var(--gut);max-width:calc(100% - var(--gut))}
.fm-line,.fm-thin,.fm-smoke{fill:none;stroke:var(--ink);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.fm-thin{stroke-width:1}
.fm-smoke{stroke-opacity:.45;stroke-dasharray:70;animation:smoke 6s ease-in-out infinite}
@keyframes smoke{0%,100%{stroke-dashoffset:0;opacity:.9}50%{stroke-dashoffset:24;opacity:.5}}
.fm-fill{fill:var(--paper);stroke:var(--ink);stroke-width:1.6;stroke-linejoin:round}
.fm-dark,.goat{fill:var(--ink)}
.goat-l{fill:none;stroke:var(--ink);stroke-width:1.6;stroke-linecap:round}
@media (min-width:900px){
  /* Дві колонки: текст по центру над садибою, фото від верху до лінії землі (низ першого екрана) */
  .hero-in{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:0 clamp(32px,5vw,90px);align-items:stretch;padding-bottom:0}
  .hero-copy{align-self:center;padding-bottom:calc(var(--farm-h) + 12px)}
  .hero-photo{grid-row:1;grid-column:2;min-height:0}
  .ground{margin-top:calc(-1 * var(--farm-h) - 1.6px)}
  .farm{margin-left:max(var(--gut),calc((100vw - var(--wrap)) / 2 + var(--gut)));max-width:calc(62% - var(--gut))}
}
.eb-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 40px;padding-top:26px;padding-bottom:28px}
.facts{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 28px;flex:1 1 560px}
.facts li{display:flex;flex-direction:column}
.facts b{font:500 clamp(30px,3.2vw,44px)/1 var(--serif)}
.facts span{font-size:15px;color:var(--on-earth-2);margin-top:4px}
@media (min-width:700px){.facts{grid-template-columns:repeat(4,minmax(0,1fr))}}
.descend{display:inline-flex;align-items:center;gap:12px;text-decoration:none;font-weight:700;min-height:48px}
.descend .ic{stroke:var(--rind-lt)}
.wt{padding:var(--sec) 0;background:var(--paper-2)}
.wt-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:28px 64px;align-items:center}
.wheel3d{width:100%;height:auto}
.wheel3d .wl{opacity:0;transition:opacity .7s var(--ease)}
[data-age="0"] .wl-0,[data-age="1"] .wl-1,[data-age="2"] .wl-2,[data-age="3"] .wl-3{opacity:1}
.wt-copy h2{font-size:clamp(40px,5vw,72px);margin-bottom:22px}
.tabs{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 18px}
.tabs[hidden]{display:none}
.tabs button{min-height:48px;padding:6px 14px;border-radius:12px;border:1.5px solid var(--line-2);background:transparent;cursor:pointer;display:flex;flex-direction:column;align-items:flex-start;font-weight:700;font-size:15px;line-height:1.15}
.tabs button small{font:500 14px/1 var(--mono);color:var(--muted)}
.tabs button[aria-selected="true"]{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.tabs button[aria-selected="true"] small{color:var(--on-earth-2)}
.wt-panel{margin-bottom:18px}
.wt-panel[hidden]{display:none}
/* Усі ступені лежать в одній клітинці: висота блоку = найвища ступінь, тож перемикання не змінює розмір фону */
.wt-panels.is-stacked{display:grid}
.wt-panels.is-stacked>.wt-panel{grid-area:1/1}
.wt-panels.is-stacked>.wt-panel[hidden]{display:block;visibility:hidden}
.wt-time{font-size:17px;margin-bottom:6px}
.wt-items{list-style:none;display:grid;gap:8px;margin:14px 0 0}
.wt-item{display:flex;align-items:center;gap:10px;padding:6px 6px 6px 6px;border-radius:14px;background:var(--paper-3)}
.wt-item a{flex:1;display:flex;align-items:center;gap:12px;text-decoration:none;min-height:56px}
.wt-item .ph{width:56px;height:56px;border-radius:10px;flex:none}
.wt-item b{display:block;font:600 19px/1.15 var(--serif)}
.wt-item small{font-size:15px;color:var(--muted)}
.wt-item a:hover b{text-decoration:underline}
@media (min-width:960px){.wt-grid{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr)}}
.first,.gifts,.party{padding:var(--sec) 0}
.party{background:var(--paper-2)}
.party-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:28px 64px;align-items:center}
.party-copy h2{font-size:clamp(40px,5vw,72px);margin-bottom:22px}
.guests{display:flex;align-items:center;gap:12px;margin:0 0 14px}
.step-btn{width:52px;height:52px;border-radius:50%;border:1.5px solid var(--ink);background:transparent;cursor:pointer;font-size:26px;line-height:1}
.step-btn:hover{background:var(--ink);color:var(--paper)}
.guests output{min-width:64px;text-align:center;font:500 52px/1 var(--serif)}
.guests-l{font-size:18px;color:var(--ink-2)}
.party-calc{font-size:19px;max-width:30em}
.party-fig .board-svg{width:100%;height:auto;filter:drop-shadow(0 18px 24px rgba(60,35,15,.16))}
@media (min-width:960px){.party-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr)}}
.visit{position:relative;display:grid}
.visit-photo{grid-area:1/1;height:clamp(460px,64vw,700px)}
.visit-in{grid-area:1/1;align-self:end;width:100%;padding-bottom:clamp(20px,4vw,56px);position:relative}
.visit-card{max-width:560px;padding:clamp(22px,3vw,36px);background:var(--paper);border-radius:var(--r);box-shadow:0 20px 50px rgba(0,0,0,.25)}
.visit-card h2{font-size:clamp(36px,4.4vw,60px);margin-bottom:14px}
.family-teaser{padding:var(--sec) 0}
.ft-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:32px 72px;align-items:center}
.ft-quote{margin:0}
.ft-quote p{font:italic 500 clamp(28px,3.2vw,46px)/1.15 var(--serif);margin-bottom:12px}
.ft-quote cite,.quote cite{font:500 14px/1 var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-style:normal}
.ft-copy h2{font-size:clamp(36px,4vw,56px);margin-bottom:22px}
.herd-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;align-items:end}
.herd-mini{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:12px}
.herd-col{margin:0}
.herd-dots{width:100%;max-width:170px;height:auto;margin-bottom:10px}
.hd{fill:none;stroke:var(--rind-ink);stroke-width:1.4}
.hd-d{fill:var(--rind)}
.hd-plus{stroke:var(--rind-ink);stroke-width:2.2;stroke-linecap:round}
.earth .hd{stroke:var(--rind-lt)}.earth .hd-d{fill:var(--rind-lt)}.earth .hd-plus{stroke:var(--rind-lt)}
.herd-col figcaption{display:flex;flex-direction:column;gap:3px}
.herd-col b{font:600 22px/1 var(--serif)}
.herd-col span{font-size:16px;line-height:1.35}
.herd-col small{font:500 14px/1.3 var(--mono);color:var(--muted)}
.earth .herd-col small{color:var(--on-earth-2)}
@media (min-width:900px){.ft-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.herd-sec .herd-row{grid-template-columns:repeat(4,minmax(0,1fr))}}
.book-band{padding:clamp(40px,6vw,72px) 0}
.bb-in{display:grid;grid-template-columns:minmax(0,1fr);gap:20px 40px;align-items:center}
.bb-in h2{font-size:clamp(34px,4vw,52px);margin-bottom:8px}
.bb-in p{margin:0;color:var(--on-earth-2)}
.kn-mini{width:120px;aspect-ratio:3/4;border-radius:3px 8px 8px 3px;background:linear-gradient(105deg,#E9DCC3 0 7%,#F4EBDB 8%,#EFE3CE);color:var(--ink);padding:12px;display:flex;flex-direction:column;justify-content:space-between;transform:rotate(-5deg);box-shadow:10px 14px 26px rgba(0,0,0,.4)}
.kn-mini .mark{width:34px;height:34px}
.kn-mini span{font:500 20px/.95 var(--serif)}
.kn-mini em{color:var(--rind-ink)}
@media (min-width:860px){.bb-in{grid-template-columns:140px minmax(0,1fr) auto}}
/* Обіцянки — внизу останнього екрана, під книгою (окремою вузькою смугою вони виглядали обрубаними) */
.promise-in{display:grid;grid-template-columns:minmax(0,1fr);gap:24px;padding-top:clamp(24px,4svh,40px);border-top:1px solid var(--line-e)}
.promise-in>div{display:grid;grid-template-columns:40px minmax(0,1fr);gap:2px 14px}
.promise-in .ic{grid-row:span 2;stroke:var(--rind-lt)}
.promise-in h3{font-size:24px;color:var(--paper)}
.promise-in p{margin:0;color:var(--on-earth-2);font-size:16px}
@media (min-width:860px){.promise-in{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* ═══ Розділи-«екрани» (побажання власника 22.10): кожен розділ — щонайменше на висоту вікна під шапкою,
   вміст по центру. Фон не буває «обрубаним» смужкою, а перемикачі всередині не змінюють розмір. ═══ */
:root{--head-h:71px}
.screen{min-height:calc(100svh - var(--head-h));display:flex;flex-direction:column;justify-content:center;padding-top:clamp(40px,7svh,96px);padding-bottom:clamp(40px,7svh,96px)}
.screen>.wrap{width:100%}
.visit.screen{display:grid;grid-template-columns:minmax(0,1fr);justify-content:normal;padding:0}
.visit.screen .visit-photo{height:auto;min-height:calc(100svh - var(--head-h))}
.visit-photo .ph-note{top:10px;bottom:auto} /* знизу її закриває картка (на телефоні й вузьких вікнах) */
.visit-photo img{position:absolute;inset:0}
.book-band.screen{gap:clamp(32px,6svh,72px)}
.book-band.screen .bb-in{margin-top:auto}
.book-band.screen .promise-in{margin-top:auto}
.book-band.screen .bb-in h2{font-size:clamp(40px,5vw,72px)}
.book-band.screen .kn-mini{width:clamp(120px,13vw,190px)}
.book-band.screen .kn-mini span{font-size:clamp(20px,2vw,28px)}
@media (min-width:860px){.book-band.screen .bb-in{grid-template-columns:clamp(140px,15vw,220px) minmax(0,1fr) auto}}

/* ═══ КРАМНИЦЯ ═══ */
.shop-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:20px 40px;align-items:start;padding-bottom:clamp(40px,6vw,80px)}
.fbox{border:1.5px solid var(--line-2);border-radius:var(--r);background:var(--paper-3)}
.fbox summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;min-height:54px;padding:0 18px;font-weight:700;font-size:17px}
.fbox summary::-webkit-details-marker{display:none}
.fbox summary::after{content:'+';font:300 28px/1 var(--sans);transition:transform .3s var(--ease)}
.fbox[open] summary::after{transform:rotate(45deg)}
.fbox summary b{margin-left:auto;margin-right:12px;font:500 14px/1 var(--mono);color:var(--rind-ink)}
.filters{padding:4px 18px 18px}
.filters fieldset{border:0;margin:0 0 16px;padding:0}
.filters legend{font:500 14px/1.3 var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-bottom:6px;padding:0}
.fopt{display:flex;align-items:center;gap:10px;min-height:44px;cursor:pointer;font-size:16px}
.fopt input{width:22px;height:22px;accent-color:var(--ink);flex:none;margin:0}
.fopt small{font:500 14px/1 var(--mono);color:var(--muted)}
.fopt i{margin-left:auto;font:500 14px/1 var(--mono);font-style:normal;color:var(--muted)}
.fopt.is-zero{opacity:.45}
.f-actions{margin:0}
@media (min-width:1000px){
  .fopt{min-height:36px}
  .filters fieldset{margin-bottom:12px}
  .shop-grid{grid-template-columns:260px minmax(0,1fr)}
  .fbox{position:sticky;top:90px;max-height:calc(100vh - 110px);overflow:auto}
  .fbox summary{cursor:default;pointer-events:none}
  .fbox summary::after{display:none}
}
.toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin-bottom:12px}
.count{margin:0;margin-right:auto;font:500 15px/1.3 var(--mono);color:var(--muted)}
.view-toggle{display:inline-flex;padding:3px;border:1.5px solid var(--line-2);border-radius:999px}
.view-toggle button{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 14px;border:0;border-radius:999px;background:transparent;cursor:pointer;font-weight:700;font-size:15px}
.view-toggle button[aria-pressed="true"]{background:var(--ink);color:var(--paper)}
.sort{display:inline-flex;align-items:center;gap:8px;font-size:15px}
.sort select{min-height:46px;border:1.5px solid var(--line-2);border-radius:999px;padding:0 14px;background:var(--paper-3);font-size:15px;max-width:100%}
.active-f{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.active-f:empty{display:none}
.active-f button{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border-radius:999px;border:0;background:var(--paper-2);cursor:pointer;font-size:15px}
.active-f button::after{content:'×';font-size:18px}
.empty{font-size:18px;padding:24px 0}
.empty[hidden]{display:none}
.k-foot{margin-top:22px;font-size:15px;max-width:60em}
.klist[hidden]{display:none}
.k-group{margin-top:28px}
.k-group:first-child{margin-top:4px}
.k-gh{display:flex;align-items:baseline;gap:14px;padding-bottom:10px;border-bottom:1.5px solid var(--ink);font:500 clamp(28px,3vw,38px)/1 var(--serif)}
.k-gh small{font:500 14px/1 var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.k-rows{list-style:none}
.k-row{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"name add" "meta price" "age age";gap:8px 14px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}
.k-row[hidden]{display:none}
.k-name{grid-area:name;display:flex;align-items:center;gap:14px;text-decoration:none;min-width:0}
.k-name .pi{width:52px;height:52px;flex:none}
.k-name b{display:block;font:600 clamp(22px,2vw,28px)/1.05 var(--serif)}
.k-name:hover b{text-decoration:underline}
.k-name small{display:block;margin-top:3px;font-size:15px;line-height:1.4;color:var(--muted)}
.k-meta{grid-area:meta;display:flex;flex-wrap:wrap;gap:4px 14px;font-size:15px;color:var(--ink-2)}
.k-meta>span{display:inline-flex;align-items:center;gap:6px}
.milk{width:11px;height:11px;border-radius:50%;flex:none;border:1.5px solid var(--ink-2)}
.milk-goat{background:#FBF8F1}.milk-cow{background:#D8B06A}.milk-mix{background:linear-gradient(90deg,#FBF8F1 50%,#D8B06A 50%)}
.k-size{font:500 15px/1 var(--mono);color:var(--muted)}
.k-price{grid-area:price;font:600 22px/1 var(--serif);text-align:right;white-space:nowrap}
.k-row .tage{grid-area:age}
.k-row .add{grid-area:add}
@media (min-width:880px){.k-row{grid-template-columns:minmax(0,2.4fr) minmax(0,1.4fr) minmax(0,1.3fr) 90px 50px;grid-template-areas:"name meta age price add";gap:16px}.k-meta{flex-direction:column;gap:3px}}
.shop-help,.next-sec{padding:clamp(36px,5vw,60px) 0;background:var(--paper-2)}
.help-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:14px}
.help{display:grid;grid-template-columns:40px minmax(0,1fr);gap:2px 14px;align-items:center;padding:18px;border-radius:var(--r);background:var(--paper-3);text-decoration:none;transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.help:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(60,35,15,.1)}
.help .ic{grid-row:span 2;stroke:var(--rind)}
.help b{font:600 22px/1.1 var(--serif)}
.help span{font-size:16px;color:var(--ink-2)}
@media (min-width:860px){.help-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* ═══ ТОВАР ═══ */
.pp{padding:4px 0 clamp(44px,6vw,80px)}
.pp-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:28px 64px;align-items:start}
.gallery{display:grid;gap:12px}
.g-main .ph{aspect-ratio:4/5;border-radius:var(--r)}
.g-open{display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in;border-radius:var(--r)}
.g-thumbs{display:flex;gap:10px;flex-wrap:wrap}
.thumb{width:80px;height:100px;padding:0;border:2px solid transparent;border-radius:10px;overflow:hidden;cursor:pointer;background:none}
.thumb img{width:100%;height:100%;object-fit:cover}
.thumb[aria-current="true"]{border-color:var(--rind)}
.g-note{font-size:15px;margin:0}
.pp-info h1{font-size:clamp(48px,6.4vw,92px);line-height:.95;margin-bottom:12px}
.badge-line{display:inline-block;margin:0 0 12px;padding:4px 12px;border-radius:999px;background:var(--ink);color:var(--paper);font:500 14px/1.4 var(--mono)}
.pp-short{font-size:clamp(19px,1.5vw,22px);color:var(--ink-2)}
.buy{display:flex;flex-wrap:wrap;align-items:center;gap:14px 16px;margin:22px 0 14px}
.buy .price{font-size:40px;width:100%}
.ship{display:flex;align-items:center;gap:10px;font-size:16px;color:var(--ink-2)}
.ship .ic{stroke:var(--rind)}
.facts-dl{margin:22px 0 0;border-top:1.5px solid var(--ink)}
.facts-dl div{display:grid;grid-template-columns:120px minmax(0,1fr);gap:14px;padding:12px 0;border-bottom:1px solid var(--line);align-items:center}
.facts-dl dt{font:500 14px/1.3 var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.facts-dl dd{margin:0;font-size:17px}
@media (min-width:900px){.pp-grid{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr)}.gallery{position:sticky;top:90px}}
.pp-time{padding:clamp(48px,7vw,96px) 0}
.ppt-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:20px 56px;align-items:center}
.ppt-wheel{max-width:520px}
.wheel-sm{width:100%;height:auto}
.pp-time h2{font-size:clamp(36px,4.4vw,60px);margin-bottom:14px}
.ppt-scale{max-width:520px;margin:18px 0 6px}
.ppt-scale .tage{display:block}
.ppt-scale .tbar{height:18px}
@media (min-width:900px){.ppt-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.pp-about{padding:clamp(48px,7vw,96px) 0}
.ppa-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:28px 64px}
.ppa-grid h2{font-size:30px;margin:0 0 10px}
.ppa-grid h2:not(:first-child){margin-top:26px}
.ppa-grid p{color:var(--ink-2)}
.story{padding:14px 16px;background:var(--paper-3);border-radius:10px}
.check{padding:12px 16px;border-left:3px solid #B8562A;background:#F6E2CF;border-radius:0 10px 10px 0;font-size:16px}
@media (min-width:900px){.ppa-grid{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}}
.pp-sets,.pp-related{padding:0 0 clamp(48px,7vw,96px)}
.pp-sets h2,.pp-related h2{font-size:clamp(32px,3.6vw,48px);margin-bottom:20px}
.buybar{position:fixed;left:0;right:0;bottom:0;z-index:55;background:rgba(242,234,220,.96);border-top:1px solid var(--line-2);transform:translateY(110%);transition:transform .35s var(--ease)}
.buybar.on{transform:none}
.bb-row{display:flex;align-items:center;gap:12px;min-height:66px}
.bb-name{font:600 19px/1.1 var(--serif);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.buybar .price{font-size:20px}
@media (min-width:900px){.buybar{display:none}}
.lightbox{margin:auto;width:min(980px,100vw);max-width:100vw;max-height:100vh;border:0;padding:0;background:transparent;color:#F2EADC}
.lightbox::backdrop{background:rgba(14,10,6,.9)}
.lb-in{position:relative;display:grid;gap:10px;justify-items:center;padding:12px}
.lb-img{max-height:78vh;width:auto;max-width:100%;border-radius:10px}
.lb-cap{margin:0;font-size:15px;color:#D9CDB8;text-align:center}
.lb-x{position:absolute;right:16px;top:16px;background:rgba(30,22,17,.6);border-color:rgba(242,234,220,.4);color:#F2EADC}
.lb-nav{display:flex;align-items:center;gap:16px}
.lb-nav .round{border-color:rgba(242,234,220,.5);color:#F2EADC}
.lb-count{font:500 14px/1 var(--mono)}
.set-draw{margin:6px 0 0}
.set-draw .board-svg{width:100%;height:auto}
.set-draw figcaption{font-size:15px;margin-top:8px}
.h-sm{font-size:28px;margin:22px 0 10px}

/* ═══ НАБОРИ ═══ */
.sets-hero{padding:6px 0 clamp(40px,6vw,80px);background:var(--paper-2)}
.sh-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:24px 64px;align-items:center}
.sets-hero h1{font-size:clamp(48px,7vw,100px);line-height:.95;margin-bottom:18px}
.sh-points{list-style:none;display:grid;gap:10px;margin-top:18px}
.sh-points li{display:flex;gap:12px;align-items:center;font-size:17px}
.sh-points .ic{stroke:var(--rind)}
.sh-fig .board-svg{width:100%;height:auto;filter:drop-shadow(0 22px 30px rgba(60,35,15,.2))}
@media (min-width:960px){.sh-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}}
.set-spread{padding:clamp(48px,7vw,96px) 0;border-bottom:1px solid var(--line)}
.set-spread.alt{background:var(--paper-3)}
.ss-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:28px 64px;align-items:center}
.ss-media{position:relative}
.ss-photo .ph{aspect-ratio:3/2;border-radius:var(--r)}
.ss-draw .board-svg{width:100%;height:auto}
.ss-draw[hidden],.ss-photo[hidden]{display:none}
/* Фото й «склад зверху» в одній клітинці: висота = більша з двох, кнопки під ними не стрибають */
.ss-media.is-stacked{display:grid;align-items:center}
.ss-media.is-stacked>.ss-photo,.ss-media.is-stacked>.ss-draw{grid-area:1/1}
.ss-media.is-stacked>.ss-photo[hidden],.ss-media.is-stacked>.ss-draw[hidden]{display:block;visibility:hidden}
.ss-media.is-stacked>.flip-btns{grid-area:2/1;justify-self:start}
.flip-btns{display:inline-flex;margin-top:12px;padding:3px;border:1.5px solid var(--line-2);border-radius:999px}
.flip-btns button{min-height:44px;padding:0 16px;border:0;border-radius:999px;background:transparent;cursor:pointer;font-weight:700;font-size:15px}
.flip-btns button[aria-pressed="true"]{background:var(--ink);color:var(--paper)}
.ss-copy h2{font-size:clamp(36px,4vw,56px);margin-bottom:12px}
.set-parts{list-style:none;display:grid;gap:6px;margin:14px 0}
.set-parts li{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:10px;align-items:baseline;font-size:17px}
/* Назви в складі: тонке підкреслення під текстом; поле дотику 44+ px за рахунок внутрішнього відступу, рядки не зсуваються */
.set-parts a,.cmp tbody th a{text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:.28em;padding:12px 0}
.set-parts a:hover,.cmp tbody th a:hover{text-decoration-color:currentColor}
.set-parts em{font-style:normal;color:var(--rind-ink);font-size:15px}
.set-parts small{font:500 14px/1.2 var(--mono);color:var(--muted);text-align:right}
.num{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--ink);color:var(--paper);font:600 14px/1 var(--mono)}
.num-o{background:transparent;color:var(--muted);border:1px solid var(--line-2)}
.set-meta{font-size:15px;color:var(--muted)}
.set-buy{display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px}
.set-buy .price{font-size:34px}
@media (min-width:900px){.ss-grid{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr)}.alt .ss-media{order:2}}
.compare{padding:var(--sec) 0}
.cmp-scroll{position:relative;overflow-x:auto;border:1.5px solid var(--ink);border-radius:var(--r);background:var(--paper-3)}
.cmp{width:100%;min-width:640px;border-collapse:collapse;font-size:16px}
.cmp th,.cmp td{padding:12px 14px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}
.cmp thead th{font:600 19px/1.15 var(--serif);background:var(--paper-2);position:sticky;top:0}
.cmp tbody th{font-weight:400}
.cmp tbody th em{font-style:normal;color:var(--rind-ink);font-size:14px;margin-left:4px}
.cmp td{text-align:center}
.cmp td small{display:block;font:500 14px/1.2 var(--mono);color:var(--muted);margin-top:4px}
.dot-yes{display:inline-block;width:14px;height:14px;border-radius:50%;background:var(--rind)}
.dot-no{color:var(--muted)}
.cmp tfoot th,.cmp tfoot td{border-bottom:0;background:var(--paper-2)}
.cmp tfoot b{font:600 22px/1 var(--serif)}
.own{padding:0 0 var(--sec)}
.own-in{display:grid;grid-template-columns:minmax(0,1fr);gap:28px 56px;align-items:center;padding:clamp(24px,4vw,48px);border-radius:var(--r);background:var(--paper-2)}
.own-box .ph-slot{max-width:280px;border-radius:var(--r)}
.own h2{font-size:clamp(34px,4vw,54px);margin-bottom:12px}
@media (min-width:860px){.own-in{grid-template-columns:280px minmax(0,1fr)}}

/* ═══ КОНСТРУКТОР ДОШКИ ═══ */
.app{display:grid;grid-template-columns:minmax(0,1fr);gap:24px;padding-bottom:var(--sec);grid-template-areas:"controls" "board" "sum" "palette"}
.app-controls{grid-area:controls;display:grid;gap:16px;align-content:start}
.ctl{border:0;margin:0;padding:0}
.ctl legend{font:500 14px/1.3 var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-bottom:8px;padding:0}
.app-board{grid-area:board}
.ab-fig .board-svg{width:100%;height:auto;filter:drop-shadow(0 18px 24px rgba(60,35,15,.16))}
.ab-legend{list-style:none;display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:10px;font-size:15px}
.ab-legend li{display:flex;align-items:center;gap:6px}
.ab-legend .num{width:22px;height:22px;font-size:14px}
.ab-empty{text-align:center;color:var(--muted)}
.ab-empty[hidden]{display:none}
.app-sum{grid-area:sum;padding:20px;border-radius:var(--r);background:var(--paper-3);box-shadow:0 0 0 1px var(--line)}
.app-sum h2{font-size:30px}
.as-cta{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0 0}
.as-done{margin:12px 0 0;padding:12px 14px;border-radius:10px;background:#DCE6CD;color:#22341A;font-size:16px}
.as-done[hidden]{display:none}
.app-palette{grid-area:palette}
.app-palette h2{font-size:30px;margin-bottom:10px}
.pal{list-style:none;display:grid;gap:6px}
.pal-row{display:grid;grid-template-columns:56px minmax(0,1fr) auto;gap:12px;align-items:center;padding:6px;border-radius:14px;background:var(--paper-3);transition:background-color .2s}
.pal-row.is-on{background:#F4E6CC;box-shadow:inset 3px 0 0 var(--rind)}
.pal-row .ph,.pal-row .pal-img{width:56px;height:56px;border-radius:10px}
.pal-name{text-decoration:none;min-width:0}
.pal-name b{display:block;font:600 18px/1.15 var(--serif)}
.pal-name small{font-size:14px;color:var(--muted)}
.pal-name:hover b{text-decoration:underline}
.b-box{display:flex;align-items:center;gap:12px;margin:14px 0 0;padding:12px 14px;border:1.5px solid var(--line-2);border-radius:12px;cursor:pointer;font-size:16px;background:var(--paper-3)}
.b-box input{width:22px;height:22px;accent-color:var(--ink);flex:none}
.b-box b{margin-left:auto;white-space:nowrap}
.seg{display:flex;flex-wrap:wrap;gap:8px;border:0;margin:0;padding:0}
.seg legend{width:100%}
.seg label{position:relative;cursor:pointer}
.seg input{position:absolute;opacity:0;width:1px;height:1px}
.seg span{display:inline-flex;align-items:center;min-height:46px;padding:0 16px;border-radius:999px;border:1.5px solid var(--line-2);font-weight:700;font-size:15px;transition:background-color .2s,color .2s,border-color .2s}
.seg input:checked+span{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.seg input:focus-visible+span{outline:2px solid var(--rind);outline-offset:2px}
.earth .seg span{border-color:var(--line-e)}
.earth .seg input:checked+span{background:var(--rind-lt);border-color:var(--rind-lt);color:#1E1611}
@media (min-width:1080px){
  /* Підсумок із ціною стоїть на місці (не «їде» за прокруткою) — побажання власника 22.10 */
  .app{grid-template-columns:300px minmax(0,1fr) 300px;grid-template-areas:"controls board sum" "palette palette palette";gap:28px 36px;align-items:start}
  .pal{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* ═══ КОШИК ═══ */
.cart-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:28px 48px;align-items:start;padding-bottom:var(--sec)}
.cart-tools{margin-bottom:10px}
.cart-list{list-style:none}
.cart-list li{display:grid;grid-template-columns:84px minmax(0,1fr) auto;grid-template-areas:"img name tot" "img qty rm";gap:6px 14px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}
.cart-list .ci-img{grid-area:img;width:84px;height:100px;border-radius:10px;overflow:hidden}
.cart-list .ci-img img,.cart-list .ci-img .pi{width:100%;height:100%;object-fit:cover}
.cart-list .ci-name{grid-area:name;font:600 21px/1.1 var(--serif);text-decoration:none}
.cart-list .ci-name small{display:block;font:400 15px/1.3 var(--sans);color:var(--muted);margin-top:3px}
.cart-list .ci-tot{grid-area:tot;font:600 21px/1 var(--serif);white-space:nowrap;text-align:right}
.cart-list .qty{grid-area:qty}
.cart-list .ci-rm{grid-area:rm;justify-self:end;min-height:44px;padding:0 8px;border:0;background:none;cursor:pointer;color:var(--muted);text-decoration:underline;text-underline-offset:.2em;font-size:15px}
.cart-board[hidden],.cart-list[hidden]{display:none}
.cart-views.is-stacked{display:grid;align-items:start}
.cart-views.is-stacked>*{grid-area:1/1}
.cart-views.is-stacked>[hidden]{display:block;visibility:hidden}
.cart-board .board-svg{width:100%;height:auto}
.cart-empty[hidden]{display:none}
.ce-t{font:500 clamp(30px,3.4vw,44px)/1.1 var(--serif);margin-bottom:8px}
.cart-empty .grid{margin-top:22px}
.cart-sum{padding:22px;border-radius:var(--r);background:var(--paper-3);box-shadow:0 0 0 1px var(--line)}
.cart-sum h2{font-size:30px}
.cs-cta{display:flex;flex-direction:column;gap:10px;margin:16px 0 0}
@media (min-width:960px){.cart-grid{grid-template-columns:minmax(0,1fr) 360px}}

/* ═══ ОФОРМЛЕННЯ ═══ */
.co-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:28px 56px;align-items:start;padding-bottom:var(--sec)}
.stepper{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-bottom:22px}
.stepper button{width:100%;min-height:52px;display:flex;align-items:center;gap:8px;padding:6px 10px;border:1.5px solid var(--line-2);border-radius:12px;background:transparent;cursor:pointer;font-size:15px;font-weight:700;text-align:left;line-height:1.1}
.stepper button b{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;border:1.5px solid currentColor;font:600 14px/1 var(--mono);flex:none}
.stepper button[aria-current="step"]{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.stepper button.done{border-color:var(--rind)}
.stepper button:disabled{cursor:not-allowed;opacity:.5}
@media (max-width:620px){.stepper button span{display:none}.stepper button{justify-content:center}}
.co-form{max-width:640px}
.co-step{border:0;margin:0 0 26px;padding:0;min-width:0}
.co-form .co-step legend{font:500 clamp(28px,3vw,38px)/1.1 var(--serif);margin-bottom:16px;padding:0}
.js .co-step[hidden]{display:none}
.step-nav{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 0}
.hint{font-size:15px;margin:6px 0 0}
.review{margin:0 0 18px;border-top:1.5px solid var(--ink)}
.review div{display:grid;grid-template-columns:140px minmax(0,1fr);gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}
.review dt{font:500 14px/1.3 var(--mono);text-transform:uppercase;color:var(--muted)}
.review dd{margin:0;font-size:17px}
.co-done{padding:clamp(22px,4vw,40px);border-radius:var(--r);background:var(--paper-3);box-shadow:0 0 0 1px var(--line)}
.co-done[hidden]{display:none}
.co-done h2{font-size:clamp(34px,4vw,54px);margin-bottom:12px}
.next-steps{list-style:none;display:grid;gap:10px;margin:18px 0}
.next-steps li{display:flex;gap:12px;align-items:center;font-size:17px}
.next-steps .ic{stroke:var(--rind)}
.co-sum{padding:22px;border-radius:var(--r);background:var(--paper-2)}
.co-sum h2{font-size:28px;margin-bottom:6px}
@media (min-width:980px){.co-grid{grid-template-columns:minmax(0,1fr) 380px}}

/* Форми */
.form{max-width:580px}
.form fieldset{border:0;margin:0 0 18px;padding:0;min-width:0}
.form legend{font-weight:700;font-size:16px;margin-bottom:8px;padding:0}
.field{margin:0 0 16px}
.field label{display:block;font-weight:700;font-size:16px;margin-bottom:6px}
.field-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 14px}
input,textarea,select{width:100%;min-height:50px;padding:12px 14px;border:1.5px solid var(--line-2);border-radius:10px;background:var(--white);color:var(--ink);font:400 17px/1.4 var(--sans)}
textarea{min-height:96px;resize:vertical}
input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--rind);outline-offset:1px;border-color:var(--ink)}
input[aria-invalid="true"],textarea[aria-invalid="true"]{border-color:var(--bad)}
.err{margin:6px 0 0;color:var(--bad);font-size:15px}
.err[hidden]{display:none}
.form-note{font-size:15px;color:var(--muted);margin:14px 0 0}
.consent{display:flex;gap:12px;align-items:flex-start;margin:4px 0 4px;font-size:16px;line-height:1.4;cursor:pointer;min-height:44px}
.consent input{width:22px;height:22px;min-height:0;padding:0;margin-top:1px;flex:none;accent-color:var(--ink)}
.consent-link{margin:0 0 12px;font-size:15px}
.consent-link a{display:inline-flex;align-items:center;min-height:44px}
.form-status{margin:16px 0 0;padding:14px 16px;border-radius:10px;background:#DCE6CD;color:#22341A;font-size:16px}
.form-status.is-warn{background:#F6E2CF;color:#5A2A10}
.form-status[hidden]{display:none}
.earth input,.earth textarea{background:#2E2219;border-color:var(--line-e);color:var(--on-earth)}
.earth input:focus-visible{outline-color:var(--rind-lt);border-color:var(--rind-lt)}
.earth .err{color:#F0A487}
.earth .form-status{background:#2E3A22;color:#E5EED6}
.earth .form-note{color:var(--on-earth-2)}
.earth .consent input{accent-color:var(--rind-lt)}
.pay{display:grid;gap:10px;margin-bottom:16px}
.opt{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border:1.5px solid var(--line-2);border-radius:12px;cursor:pointer;background:var(--paper-3)}
.opt input{width:22px;height:22px;min-height:0;margin-top:2px;accent-color:var(--ink);flex:none}
.opt span{display:flex;flex-direction:column;gap:2px;font-size:17px}
.opt small{font-size:15px;color:var(--muted)}
.opt:has(input:checked){border-color:var(--ink);background:var(--white)}

/* ═══ ВИРОБНИЦТВО ═══ */
.prod-hero{padding:6px 0 var(--sec)}
.prod-hero h1{font-size:clamp(48px,7vw,104px);line-height:.95}
.chain{list-style:none;display:grid;grid-template-columns:minmax(0,1fr);gap:22px;margin-top:clamp(32px,5vw,56px);counter-reset:ch}
.ch-step{display:flex;flex-direction:column;gap:8px}
.ch-media .ph{aspect-ratio:4/5;border-radius:12px}
.ch-ico{aspect-ratio:4/5;border-radius:12px;display:grid;place-items:center;background:var(--earth-2);box-shadow:inset 0 0 0 1px var(--line-e)}
.ch-ico .ic{stroke:var(--rind-lt)}
.ch-n{display:flex;align-items:center;gap:10px;margin:6px 0 0;font:600 24px/1.1 var(--serif)}
.ch-n b{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--rind-lt);color:#1E1611;font:600 14px/1 var(--mono)}
.ch-step p{margin:0;font-size:16px;line-height:1.5;color:var(--on-earth)}
.ch-step .src{margin:0}
.general{color:var(--on-earth-2)!important}
.general span{font-weight:700;color:var(--rind-lt)}
@media (min-width:600px){.chain{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1100px){.chain{grid-template-columns:repeat(6,minmax(0,1fr));gap:18px}}
.descent{padding:var(--sec) 0 calc(var(--sec) * .8);overflow:clip;border-top:1px solid var(--line-e)}
.descent .sec-head h2{font-size:clamp(44px,6vw,88px)}
.descent-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:0 clamp(32px,5vw,80px);position:relative}
.dv{position:sticky;top:70px;z-index:3;background:linear-gradient(var(--earth) 82%,rgba(33,24,17,0));padding:10px var(--gut) 18px;margin:0 calc(-1 * var(--gut))}
.dv-stage{display:grid;grid-template-columns:minmax(0,1fr) 60px;gap:10px;align-items:center}
.dv .wheel3d{max-height:26vh}
.gauge{position:relative;height:100%;min-height:140px;display:flex;flex-direction:column;align-items:center;justify-content:center}
.g-track{position:relative;width:4px;height:70%;min-height:110px;border-radius:2px;background:linear-gradient(var(--rind-lt),var(--rind-lt)) top/100% calc(var(--p,0) * 100%) no-repeat,rgba(239,230,214,.16)}
.g-track::before{content:'';position:absolute;left:-7px;right:-7px;top:0;bottom:0;background:repeating-linear-gradient(to bottom,rgba(239,230,214,.5) 0 1px,transparent 1px calc(100% / 6));background-size:100% calc(100% + 1px)}
.g-mark{position:absolute;left:50%;top:calc(var(--p,0) * 100%);width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:var(--rind-lt);box-shadow:0 0 0 4px rgba(221,167,94,.25)}
.g-lab{position:absolute;font:500 14px/1 var(--mono);color:var(--on-earth-2);right:calc(50% + 12px);white-space:nowrap}
.g-0{top:15%}.g-6{bottom:15%}
.g-val{display:none}
.dv-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-top:6px}
.dv-steps button{min-height:48px;padding:6px 4px;border:1px solid var(--line-e);border-radius:10px;background:transparent;color:var(--on-earth);cursor:pointer;font-weight:700;font-size:15px;line-height:1.15;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;transition:background-color .25s,border-color .25s,color .25s}
.dv-steps button small{font:500 14px/1 var(--mono);color:var(--on-earth-2)}
.dv-steps button[aria-pressed="true"]{background:var(--rind-lt);border-color:var(--rind-lt);color:#1E1611}
.dv-steps button[aria-pressed="true"] small{color:#3B2A1A}
.dsteps{list-style:none}
.dstep{padding:clamp(36px,6vw,72px) 0;border-top:1px solid var(--line-e)}
.dstep:first-child{border-top:0}
.d-depth{display:flex;align-items:baseline;gap:16px;margin-bottom:10px}
.d-depth b{font:italic 500 clamp(54px,7vw,96px)/.9 var(--serif);color:var(--rind-lt);letter-spacing:-.02em}
.d-depth span{font:500 14px/1.3 var(--mono);text-transform:uppercase;letter-spacing:.07em;color:var(--on-earth-2)}
.dstep h3{font-size:clamp(36px,4.2vw,58px);margin-bottom:16px}
.dstep>p{font-size:clamp(18px,1.4vw,20px);max-width:32em}
.d-note{font-size:16px!important;color:var(--on-earth-2);border-left:2px solid var(--rind-lt);padding-left:14px}
.d-photo{aspect-ratio:4/3;margin:24px 0 22px;max-width:560px;border-radius:2px}
.d-items{list-style:none;display:grid;gap:8px;max-width:560px}
.d-items li{display:flex;align-items:center;gap:10px;border:1px solid var(--line-e);border-radius:14px;padding:6px;background:rgba(239,230,214,.03)}
.d-items a{flex:1;display:grid;grid-template-columns:52px minmax(0,1fr);grid-template-rows:auto auto;column-gap:12px;align-items:center;text-decoration:none;min-height:52px}
.d-items .ph{grid-row:span 2;width:52px;height:52px;border-radius:10px}
.d-items span{font:600 20px/1.15 var(--serif)}
.d-items small{font-size:15px;color:var(--on-earth-2)}
.d-items a:hover span{text-decoration:underline}
@media (min-width:960px){
  .descent-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr)}
  .dv{grid-column:2;grid-row:1;top:96px;align-self:start;margin:0;padding:0;background:none}
  .dsteps{grid-column:1;grid-row:1}
  .dv-stage{grid-template-columns:minmax(0,1fr) 96px;gap:18px}
  .dv .wheel3d{max-height:none}
  .gauge{min-height:320px}
  .g-track{height:260px}
  .g-val{display:block;margin-top:14px;font:italic 500 30px/1 var(--serif);color:var(--on-earth);white-space:nowrap}
  .dv-steps{margin-top:22px;gap:10px}
  .dv-steps button{min-height:58px;font-size:16px}
  .dstep{min-height:78vh;display:flex;flex-direction:column;justify-content:center}
}
.cellar-fig{margin:clamp(56px,8vw,110px) 0 0}
.cellar{width:100%;height:auto}
.cl-ground{stroke:var(--on-earth);stroke-width:2}
.cl-thin{fill:none;stroke:var(--on-earth);stroke-opacity:.6}
.cl-house{fill:none;stroke:var(--on-earth);stroke-opacity:.55;stroke-width:1.5}
.cl-room,.cl-shaft{fill:#3A2A1C;stroke:#C99A55;stroke-width:1.5}
.cl-shelf{stroke:#C99A55;stroke-width:2}
.cl-step{fill:none;stroke:var(--on-earth);stroke-opacity:.8;stroke-width:1.5}
.cl-dim{fill:none;stroke:var(--on-earth);stroke-width:1.4}
.cl-dim-t{fill:var(--on-earth);font:italic 500 34px var(--serif)}
.cl-pin circle{fill:var(--rind-lt)}
.cl-pin text{fill:#1E1611;font:600 16px var(--mono)}
.cl-bulb{fill:#FFD796}
.cl-legend{list-style:none;display:grid;gap:12px 32px;margin-top:22px}
.cl-legend li{display:flex;gap:12px;align-items:baseline;font-size:17px}
.cl-legend b{flex:none;width:28px;height:28px;border-radius:50%;background:var(--rind-lt);color:#1E1611;display:grid;place-items:center;font:600 15px/1 var(--mono)}
@media (min-width:800px){.cl-legend{grid-template-columns:repeat(3,minmax(0,1fr))}}
.vyrist{padding:var(--sec) 0;border-top:1px solid var(--line-e)}
.vy-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:40px 64px;align-items:center}
.vy-copy h2{font-size:clamp(44px,6vw,86px);margin-bottom:20px}
.vy-copy>p{font-size:clamp(18px,1.4vw,20px);max-width:34em}
.eyebrow-warn{display:inline-block;padding:6px 10px;border:1px dashed var(--rind-lt);border-radius:8px}
.vy-visual{position:relative;max-width:620px;justify-self:center;width:100%}
.vy-tag{position:absolute;right:2%;top:2%;width:min(250px,56%);padding:14px 16px 16px;background:var(--paper);color:var(--ink);border-radius:6px;transform:rotate(3deg);box-shadow:0 14px 30px rgba(0,0,0,.35);display:flex;flex-direction:column;gap:4px;font-size:15px;line-height:1.35}
.vy-tag::before{content:'';position:absolute;left:16px;top:-9px;width:14px;height:14px;border-radius:50%;background:var(--earth);border:2px solid var(--paper)}
.vt-top{font:500 14px/1.2 var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--rind-ink)}
.vt-name{font:italic 600 28px/1.05 var(--serif);overflow-wrap:anywhere}
@media (min-width:960px){.vy-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr)}}
.composition{padding:var(--sec) 0}
.comp-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:32px 72px;align-items:center}
.comp-grid h2{font-size:clamp(38px,4.6vw,64px);margin-bottom:16px}
.quote{margin:0;padding:22px 0 0;border-top:1.5px solid var(--ink)}
.quote p{font:italic 500 clamp(24px,2.4vw,34px)/1.22 var(--serif);margin-bottom:10px}
@media (min-width:900px){.comp-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}

/* ═══ САДИБА ═══ */
.sd-hero{display:grid;position:relative}
.sd-hero-photo{grid-area:1/1;height:clamp(520px,68vw,760px)}
.sd-hero-in{grid-area:1/1;align-self:end;width:100%;padding-bottom:clamp(20px,4vw,56px);position:relative}
.sd-hero-card{max-width:640px;padding:clamp(18px,3vw,36px);background:var(--paper);border-radius:var(--r);box-shadow:0 22px 60px rgba(0,0,0,.25)}
.sd-hero-card h1{font-size:clamp(46px,6.4vw,92px);line-height:.95;margin-bottom:16px}
.plan-sec{padding:var(--sec) 0}
.plan-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:28px 56px;align-items:center}
.plan-fig{position:relative}
.plan{width:100%;height:auto;border-radius:var(--r);background:#EDE3CF}
.pl-field{stroke:#D9CBB0;stroke-width:1}
.pl-yard{fill:#E9DDC4;stroke:var(--ink-2);stroke-width:1.5;stroke-dasharray:8 6}
.pl-pad{fill:#DCCFA9;stroke:var(--ink-2);stroke-width:1.2}
.pl-goat{fill:var(--ink-2)}
.pl-bld{fill:var(--paper-3);stroke:var(--ink);stroke-width:1.6}
.pl-roof{stroke:var(--ink);stroke-width:1}
.pl-chim{fill:var(--ink)}
.pl-mound{fill:#D3C29C;stroke:var(--ink);stroke-width:1.4}
.pl-under{fill:none;stroke:var(--rind-ink);stroke-width:1.4;stroke-dasharray:6 5}
.pl-door{stroke:var(--ink);stroke-width:4;stroke-linecap:round}
.pl-table{fill:#E9DDC4;stroke:var(--ink-2)}
.pl-path{fill:none;stroke:var(--rind);stroke-width:4;stroke-dasharray:2 10;stroke-linecap:round}
.pl-tree{fill:#B9C29A;stroke:#6E7B57;stroke-width:1.2}
.pl-tree-l{stroke:#6E7B57;stroke-width:1}
.pl-pop{fill:#9FAE80;stroke:#6E7B57}
.pl-gate{fill:var(--ink)}
.pl-lab{fill:var(--ink-2);font:500 15px var(--mono)}
.pl-n circle{fill:var(--paper-3);stroke:var(--ink)}
.pl-n path{fill:var(--ink)}
.pl-n text{fill:var(--ink);font:500 14px var(--mono)}
.stop{position:absolute;transform:translate(-50%,-50%);width:48px;height:48px;border-radius:50%;border:2px solid var(--paper);background:var(--ink);color:var(--paper);font:600 20px/1 var(--serif);cursor:pointer;box-shadow:0 6px 14px rgba(0,0,0,.25);transition:transform .3s var(--ease),background-color .25s}
.stop:hover,.stop[aria-pressed="true"]{background:var(--rind);transform:translate(-50%,-50%) scale(1.12)}
.plan-note{margin:8px 0 0}
.stops{list-style:none;display:grid;gap:4px}
.stops li{display:grid;grid-template-columns:34px minmax(0,1fr);gap:14px;padding:14px;border-radius:12px;transition:background-color .25s}
.stops li.is-on{background:var(--paper-2)}
.stops .num{width:30px;height:30px}
.stops h3{font-size:26px;margin-bottom:4px}
.stops p{margin:0;color:var(--ink-2)}
@media (min-width:960px){.plan-grid{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);align-items:start}}
/* На телефоні підписи будівель ховаємо: план дрібний, а нумерований список зупинок іде одразу під ним */
@media (max-width:599px){.pl-lab-s{display:none}}
@media (max-width:520px){.stop{width:44px;height:44px;font-size:18px}}
.formats{padding:0 0 var(--sec)}
.fmt-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
.fmt{padding:22px;border-radius:var(--r);background:var(--paper-3);box-shadow:0 0 0 1px var(--line);display:flex;flex-direction:column;gap:6px}
.fmt h3{font-size:28px}
.fmt p{margin:0;color:var(--ink-2);font-size:16px}
.fmt .link-arrow{margin-top:auto;align-self:flex-start}
@media (min-width:640px){.fmt-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1100px){.fmt-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
.seasons-sec{padding:clamp(48px,7vw,96px) 0}
.seasons{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px;background:var(--line-e)}
.seasons li{background:var(--earth);padding:18px 18px 20px;display:flex;flex-direction:column;gap:6px}
.seasons b{font:600 26px/1 var(--serif)}
.seasons span{font-size:16px;line-height:1.4;color:var(--on-earth)}
.seasons small{font:500 14px/1.3 var(--mono);color:var(--on-earth-2)}
.seasons li.is-now{background:var(--earth-2);box-shadow:inset 0 3px 0 var(--rind-lt)}
.seasons li.is-now b::after{content:' · зараз';font:500 14px/1 var(--mono);color:var(--rind-lt)}
@media (min-width:860px){.seasons{grid-template-columns:repeat(4,minmax(0,1fr))}}
.booking{padding:var(--sec) 0;background:var(--paper-2)}
.bk-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:28px 64px;align-items:start}
.cal{padding:16px;border-radius:var(--r);background:var(--paper-3);box-shadow:0 0 0 1px var(--line);max-width:460px}
.cal-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.cal-m{margin:0;font:600 24px/1 var(--serif)}
.cal-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
.cal-dow{font:500 14px/1 var(--mono);color:var(--muted);text-align:center;padding:6px 0}
.cal-grid>span:not(.cal-dow){aspect-ratio:1;min-height:44px}
.cal-day{aspect-ratio:1;min-height:44px;border-radius:10px;border:1.5px solid transparent;background:transparent;cursor:pointer;font:500 16px/1 var(--sans)}
.cal-day:hover{border-color:var(--ink)}
.cal-day[aria-pressed="true"]{background:var(--ink);color:var(--paper)}
.cal-day:disabled{opacity:.3;cursor:not-allowed}
.cal-day.is-off{color:var(--muted);background:repeating-linear-gradient(135deg,transparent 0 5px,rgba(30,22,17,.05) 5px 6px)}
.cal-day.is-today{border-color:var(--rind)}
.cal-hint{margin:10px 0 0;font-size:15px;color:var(--ink-2);min-height:3.2em}
.bk-summary{font-size:16px;padding:12px 14px;border-radius:10px;background:var(--paper-3)}
.bk-summary:empty{display:none}
@media (min-width:960px){.bk-grid{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}}
.getting{padding:var(--sec) 0}
.get-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:28px 64px;align-items:center}
.get-map{margin:0}
.region{width:100%;height:auto;border-radius:var(--r);background:var(--paper-3);box-shadow:0 0 0 1px var(--line)}
.rg-river{fill:none;stroke:#9FB4C0;stroke-width:6;stroke-linecap:round;opacity:.6}
.rg-road{stroke:var(--ink-2);stroke-width:2;stroke-dasharray:10 8}
.rg-zone{fill:rgba(180,116,47,.1);stroke:var(--rind);stroke-width:1.5;stroke-dasharray:6 6}
.rg-city{fill:var(--ink)}
.rg-star{fill:var(--rind)}
.rg-t{fill:var(--ink-2);font:400 17px var(--sans)}
.rg-t-b{fill:var(--ink);font:600 24px var(--serif)}
.rg-n path{fill:var(--ink)}.rg-n text{fill:var(--ink);font:500 14px var(--mono)}
.rg-cap{margin:10px 0 0;font-size:14px;line-height:1.45;color:var(--muted)}
.region-wide{display:block}.region-narrow{display:none}
.region-narrow .rg-t{font-size:19px}.region-narrow .rg-t-b{font-size:24px}.region-narrow .rg-n text{font-size:16px}
@media (max-width:599px){.region-wide{display:none}.region-narrow{display:block}}
@media (min-width:900px){.get-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}}
.sd-faq{padding:0 0 var(--sec)}
.sdf-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:28px 56px;align-items:start}
.sd-photos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.sd-photos .ph:first-child{aspect-ratio:4/5}
.sd-photos .ph:last-child{aspect-ratio:4/5}
@media (min-width:900px){.sdf-grid{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}}

/* ═══ РОДИНА ═══ */
.fam-hero{padding:6px 0 var(--sec);background:var(--paper-2)}
.fh-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:28px 64px;align-items:end}
.fam-hero h1{font-size:clamp(48px,7vw,104px);line-height:.95;margin-bottom:20px}
.fh-photo{aspect-ratio:4/5;border-radius:2px}
@media (min-width:900px){.fh-grid{grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr)}}
.timeline{padding:var(--sec) 0}
.tl{list-style:none;position:relative;display:grid;gap:clamp(28px,4vw,48px)}
.tl::before{content:'';position:absolute;left:14px;top:8px;bottom:8px;width:1.5px;background:var(--line-2)}
.tl-i{position:relative;display:grid;grid-template-columns:minmax(0,1fr);gap:6px;padding-left:44px}
.tl-i::before{content:'';position:absolute;left:7px;top:10px;width:16px;height:16px;border-radius:50%;background:var(--paper);border:3px solid var(--rind)}
.tl-y{margin:0;font:italic 500 clamp(36px,5vw,72px)/.95 var(--serif);color:var(--rind-ink)}
.tl-place{margin:0 0 4px;font:500 14px/1.3 var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.tl-body h3{font-size:clamp(26px,2.6vw,36px);margin-bottom:8px}
.tl-body p{max-width:36em;color:var(--ink-2)}
@media (min-width:900px){
  .tl::before{left:50%}
  .tl-i{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 72px;padding-left:0;align-items:start}
  .tl-i::before{left:calc(50% - 8px)}
  .tl-y{text-align:right}
  .tl-r .tl-y{order:2;text-align:left}
  .tl-r .tl-body{text-align:right}
  .tl-r .tl-body p{margin-left:auto}
}
.herd-sec{padding:var(--sec) 0}
.people{padding:var(--sec) 0}
.ppl-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;margin-bottom:14px}
.person{padding:clamp(22px,3vw,36px);border-radius:var(--r);background:var(--paper-3);box-shadow:0 0 0 1px var(--line)}
.p-init{margin:0 0 12px;width:72px;height:72px;border-radius:50%;display:grid;place-items:center;background:var(--earth);color:var(--rind-lt);font:italic 600 38px/1 var(--serif)}
.person h3{font-size:32px}
.p-role{font:500 14px/1.3 var(--mono);text-transform:uppercase;letter-spacing:.05em;color:var(--rind-ink);margin:6px 0 12px}
.person p:not(.p-role):not(.p-init):not(.src){color:var(--ink-2)}
@media (min-width:860px){.ppl-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.values{padding:0 0 var(--sec)}
.val-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:28px 64px;align-items:center}
.val-grid .ph{aspect-ratio:2/1;border-radius:2px}
@media (min-width:900px){.val-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}

/* ═══ КНИГА ═══ */
.kn-hero{padding:6px 0 var(--sec)}
.kn-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:40px 72px;align-items:center}
.kn-book{position:relative;width:min(300px,70vw);aspect-ratio:3/4;justify-self:center;perspective:1200px}
.kn-cover{position:absolute;inset:0;z-index:2;padding:28px 26px;border-radius:3px 8px 8px 3px;background:linear-gradient(105deg,#E9DCC3 0 6%,#F4EBDB 7%,#EFE3CE 100%);color:var(--ink);transform:rotateY(-16deg);transform-origin:left center;box-shadow:inset 6px 0 10px rgba(0,0,0,.1),18px 22px 40px rgba(0,0,0,.45);display:flex;flex-direction:column;transition:transform .8s var(--ease)}
.kn-book:hover .kn-cover{transform:rotateY(-24deg)}
.kn-pages{position:absolute;inset:6px -10px 6px 8px;border-radius:2px 6px 6px 2px;background:repeating-linear-gradient(90deg,#F7F1E6 0 2px,#E4D8C4 2px 3px);transform:rotateY(-16deg);transform-origin:left center}
.mark-book{width:66px;height:66px}
.kn-t{margin:auto 0 8px;font:500 44px/.95 var(--serif)}
.kn-t em{font-style:italic;color:var(--rind-ink)}
.kn-s{margin:0;font:500 14px/1.3 var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.kn-copy h1{font-size:clamp(48px,7vw,100px);line-height:.95;margin-bottom:16px}
@media (min-width:900px){.kn-grid{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}}
.chapters{padding:var(--sec) 0}
.ch-grid{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.ch-grid li{position:relative;padding:22px 18px;border-radius:var(--r);background:var(--paper-3);box-shadow:0 0 0 1px var(--line);display:flex;flex-direction:column;gap:12px;min-height:180px}
.ch-num{font:italic 500 46px/1 var(--serif);color:var(--rind-ink)}
.ch-grid .ic{stroke:var(--rind)}
.ch-grid h3{font-size:24px;margin-top:auto}
@media (min-width:860px){.ch-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
.book-shop{padding:0 0 var(--sec)}

/* ═══ ДОСТАВКА ═══ */
.route-sec{padding:0 0 clamp(40px,6vw,80px)}
.route-line{list-style:none;display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
.route-line li{position:relative;display:grid;grid-template-columns:60px minmax(0,1fr);gap:2px 14px;align-items:center;padding:14px;border-radius:var(--r);background:var(--paper-3)}
.rl-ic{grid-row:span 2;width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:var(--earth)}
.rl-ic .ic{stroke:var(--rind-lt)}
.route-line b{font:600 22px/1.1 var(--serif)}
.route-line span:not(.rl-ic){font-size:16px;color:var(--ink-2)}
@media (min-width:1000px){
  .route-line{grid-template-columns:repeat(5,minmax(0,1fr));gap:0}
  .route-line li{grid-template-columns:minmax(0,1fr);justify-items:start;background:none;padding:0 16px 0 0}
  .route-line li::after{content:'';position:absolute;left:66px;right:8px;top:28px;border-top:1.5px dashed var(--line-2)}
  .route-line li:last-child::after{display:none}
  .rl-ic{grid-row:auto;margin-bottom:12px}
}
.pay-sec{padding:clamp(40px,6vw,80px) 0;background:var(--paper-2)}
.pay-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:18px 32px;align-items:start}
.pay-grid .sec-head{margin-bottom:0}
.pay-card{padding:22px;border-radius:var(--r);background:var(--paper-3);box-shadow:0 0 0 1px var(--line)}
.pay-card .ic{stroke:var(--rind);margin-bottom:10px}
.pay-card h3{font-size:28px;margin-bottom:6px}
.pay-card p{margin:0;color:var(--ink-2)}
@media (min-width:900px){.pay-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr)}}
.terms{padding:var(--sec) 0}
.tr-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:28px 56px;align-items:start}
.terms-list{list-style:none;display:grid;gap:12px}
.terms-list li{padding-left:22px;position:relative;color:var(--ink-2)}
.terms-list li::before{content:'';position:absolute;left:0;top:.6em;width:10px;height:10px;border-radius:50%;background:var(--rind)}
.terms-list b{color:var(--ink)}
.announce{padding:22px;border-radius:var(--r);background:var(--earth);color:var(--on-earth)}
.announce h3{font-size:30px;margin-bottom:10px}
.announce .eyebrow{color:var(--rind-lt)}
.announce .muted{color:var(--on-earth-2)}
@media (min-width:900px){.tr-grid{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}}
.d-faq{padding:0 0 var(--sec)}

/* ═══ КОНТАКТИ ═══ */
.ct-sec{padding:0 0 clamp(40px,6vw,72px)}
.ct-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
.ct{padding:22px;border-radius:var(--r);background:var(--paper-3);box-shadow:0 0 0 1px var(--line)}
.ct .ic{stroke:var(--rind);margin-bottom:10px}
.ct h2{font-size:26px;margin-bottom:6px}
.ct p{margin:0;font-size:17px;overflow-wrap:anywhere}
@media (min-width:700px){.ct-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1100px){.ct-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
.ct-map{padding:0 0 var(--sec)}
.cm-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:28px 56px;align-items:start}
.cm-grid figure{margin:0}
.ct-form h2{font-size:clamp(30px,3vw,42px);margin-bottom:16px}
@media (min-width:900px){.cm-grid{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}}

/* Питання */
.faq{max-width:900px}
.faq details{border-bottom:1px solid var(--line-2)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:60px;padding:12px 0;font:600 21px/1.25 var(--serif)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'+';font:300 30px/1 var(--sans);transition:transform .3s var(--ease);flex:none}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{color:var(--ink-2);padding:0 0 14px;margin:0;max-width:44em}

/* Прості сторінки */
.simple-main{padding:clamp(56px,8vw,110px) 0 var(--sec)}
.simple-main h1{font-size:clamp(40px,7vw,96px);margin-bottom:20px;overflow-wrap:anywhere}
.simple-main p{max-width:40em}
.nf{display:flex;align-items:center;gap:16px;margin-bottom:12px}
.mark-nf{width:96px;height:96px}

/* Підвал */
.foot{background:var(--earth);color:var(--on-earth);padding:clamp(56px,7vw,96px) 0 28px}
.foot-in{display:grid;grid-template-columns:minmax(0,1fr);gap:32px 48px}
.foot .eyebrow{color:var(--rind-lt)}
.foot p{font-size:16px;margin:0 0 8px}
.foot .muted{color:var(--on-earth-2)}
.mark-lg{width:56px;height:56px;margin-bottom:12px}
.foot .mk-hand{stroke:var(--on-earth)}.foot .mk-dot{fill:var(--on-earth)}
.foot .brand-t{margin-bottom:12px}
.foot .brand-t small{color:var(--on-earth-2)}
.foot-nav{display:flex;flex-direction:column;align-items:flex-start}
.foot-nav a{font-size:16px;text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
.foot-nav a:hover{text-decoration:underline}
.foot-nav a[aria-current="page"]{color:var(--rind-lt)}
.foot-src ul{list-style:none;display:grid;gap:8px}
.foot-src li{font-size:15px;line-height:1.4}
.foot-src span{color:var(--on-earth-2);display:block;font:500 14px/1.3 var(--mono)}
.foot-bottom{margin-top:40px}
.foot-bottom p{font-size:15px;color:var(--on-earth-2);margin:0;padding-top:20px;border-top:1px solid var(--line-e)}
@media (min-width:700px){.foot-in{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1100px){.foot-in{grid-template-columns:minmax(0,1.3fr) minmax(0,.8fr) minmax(0,.9fr) minmax(0,1.1fr)}}

/* Дошка зверху (символи предметів) */
.board-svg{display:block}
.bd-num circle{fill:var(--ink)}
.bd-num text{fill:var(--paper);font:600 14px var(--mono)}
.bd-qty,.bd-more{font:600 16px var(--mono);fill:var(--ink)}
.pi{width:48px;height:48px}

/* Без руху */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}
}