:root {
  --field: #90F679;
  --ink: #090B10;
  --blue: #063F84;
  --magenta: #A7115E;
  --paper: #F4EEDC;
  --glass: rgba(255,255,255,.28);
  --bronze: #6b5028;
  --line: 1px solid rgba(9,11,16,.68);
  --serif: Georgia, 'Times New Roman', serif;
  --sans: Arial, Helvetica, sans-serif;
  --s1: clamp(.5rem, .4rem + .3vw, .8rem);
  --s2: clamp(.85rem, .7rem + .45vw, 1.2rem);
  --s3: clamp(1.2rem, .95rem + .9vw, 2rem);
  --s4: clamp(2rem, 1.4rem + 2.8vw, 4.8rem);
  --s5: clamp(3.2rem, 2rem + 5vw, 8rem);
  --motion: 420ms;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--field); }
body { margin:0; min-width:320px; color:var(--ink); background:var(--field); font-family:var(--serif); line-height:1.55; overflow-x:hidden; }
body::before, body::after { content:""; position:fixed; inset-block:0; width:clamp(12px,2.3vw,34px); pointer-events:none; z-index:0; border-inline:1px solid rgba(9,11,16,.45); background:linear-gradient(180deg, transparent 0 8%, rgba(255,255,255,.18) 8% 20%, transparent 20% 44%, rgba(6,63,132,.14) 44% 65%, transparent 65%); }
body::before { left:0; }
body::after { right:0; transform:scaleX(-1); }
a { color:inherit; text-underline-offset:.18em; text-decoration-thickness:1px; }
a:hover { color:var(--blue); }
button,input,textarea { font:inherit; }
button,a,input,textarea { -webkit-tap-highlight-color: transparent; }
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible { outline:3px solid var(--magenta); outline-offset:3px; }
img,svg { max-width:100%; }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.skip-link { position:fixed; left:1rem; top:1rem; z-index:100; background:var(--ink); color:var(--field); padding:.7rem 1rem; transform:translateY(-160%); }
.skip-link:focus { transform:none; }
.conservatory-frame { position:fixed; inset:0; z-index:0; pointer-events:none; background:
  linear-gradient(72deg, transparent 0 4%, rgba(9,11,16,.08) 4.2% 4.35%, transparent 4.5% 100%),
  linear-gradient(108deg, transparent 0 94%, rgba(9,11,16,.08) 94.1% 94.25%, transparent 94.4% 100%); }
.site-header,.site-footer,main { position:relative; z-index:1; }
.site-header { padding:clamp(1rem,2vw,2rem) clamp(2.1rem,5vw,6rem) 0; min-height:10rem; display:grid; grid-template-columns:minmax(180px,.75fr) minmax(0,2fr); gap:2rem; align-items:start; }
.room-label { border-top:2px solid var(--ink); padding-top:.5rem; font-family:var(--sans); font-size:.78rem; letter-spacing:.02em; text-transform:uppercase; }
.brand { font-family:var(--serif); font-size:1.4rem; text-transform:none; font-weight:700; text-decoration:none; display:block; margin-bottom:.25rem; }
.floor-plan { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); border-top:var(--line); position:relative; z-index:2; }
.floor-plan a { min-height:52px; padding:.6rem .7rem .5rem 0; font:700 .74rem/1.25 var(--sans); text-decoration:none; border-right:1px solid rgba(9,11,16,.25); }
.floor-plan a span { color:var(--blue); display:block; font-weight:400; margin-bottom:.25rem; }
.cart-link strong { display:inline-grid; place-items:center; min-width:1.65rem; min-height:1.65rem; margin-left:.25rem; border:1px solid currentColor; border-radius:50%; }
.vine-route { fill:none; stroke:var(--ink); stroke-width:2; vector-effect:non-scaling-stroke; }
.vine-route path + path { fill:var(--field); stroke:var(--magenta); }
.vine-route-header { grid-column:1/-1; width:min(760px,80vw); margin:-2.1rem 0 -1.5rem 8vw; pointer-events:none; }
.cart-live { position:fixed; z-index:40; right:1rem; bottom:1rem; background:var(--ink); color:var(--field); padding:.6rem .8rem; min-height:0; font:700 .8rem var(--sans); }
.cart-live:empty { display:none; }
main { width:100%; }
.route-section { position:relative; padding:clamp(4rem,9vw,10rem) clamp(2.1rem,7vw,8rem); }
.route-section::before { content:attr(data-room); position:absolute; left:clamp(1.3rem,3.4vw,4rem); top:clamp(2rem,5vw,4rem); font:700 .8rem var(--sans); color:var(--blue); writing-mode:vertical-rl; letter-spacing:.12em; }
.route-section::after { content:""; position:absolute; left:clamp(2rem,4vw,4.7rem); top:0; bottom:0; border-left:1px solid rgba(9,11,16,.28); }
.eyebrow,.meta { font:700 .74rem/1.3 var(--sans); letter-spacing:.09em; text-transform:uppercase; }
.eyebrow { color:var(--blue); }
h1,h2,h3 { font-family:var(--serif); line-height:.98; margin:0 0 .7em; font-weight:500; }
h1 { font-size:var(--s5); letter-spacing:-.045em; }
h2 { font-size:var(--s4); letter-spacing:-.035em; }
h3 { font-size:clamp(1.45rem,1.1rem + 1.2vw,2.6rem); }
p { max-width:68ch; }
.lede { font-size:clamp(1.2rem,1rem + .8vw,1.9rem); max-width:42ch; }
.text-link,.catalog-action,.primary-action,.secondary-action { min-height:44px; display:inline-flex; align-items:center; gap:.45rem; font:700 .84rem var(--sans); }
.primary-action { background:var(--ink); color:var(--field); text-decoration:none; padding:.8rem 1.1rem; border:1px solid var(--ink); }
.primary-action:hover { color:#fff; }
.secondary-action { border-bottom:2px solid var(--ink); text-decoration:none; }
.hero { min-height:calc(100vh - 8rem); padding-top:clamp(1rem,4vw,4rem); display:grid; grid-template-columns:minmax(0,1.05fr) minmax(240px,.6fr) minmax(160px,.35fr); grid-template-rows:auto 1fr; gap:clamp(1rem,3vw,3rem); align-items:start; }
.hero-copy { grid-column:1/2; padding-left:clamp(1rem,4vw,4rem); }
.hero h1 span { color:var(--magenta); font-style:italic; }
.hero-note { grid-column:2; margin-top:10vh; padding:1.3rem 1.4rem 2rem; background:var(--paper); clip-path:polygon(0 0,92% 0,100% 14%,100% 100%,0 100%); box-shadow:10px 12px 0 rgba(6,63,132,.16); transform:rotate(-1.2deg); }
.hero-note::before { content:"КУРАТОРСЬКА НОТАТКА"; display:block; border-bottom:1px solid var(--bronze); padding-bottom:.5rem; margin-bottom:1rem; font:700 .68rem var(--sans); letter-spacing:.1em; }
.hero-object { grid-column:3; grid-row:1/3; min-height:70vh; display:flex; align-items:center; justify-content:center; position:relative; }
.hero-object::before { content:""; width:min(18vw,230px); aspect-ratio:.72; border:2px solid var(--ink); border-radius:50% 50% 16% 16% / 28% 28% 8% 8%; background:rgba(255,255,255,.18); box-shadow:inset 0 0 0 12px rgba(6,63,132,.12); transform:translateY(2rem); }
.hero-object::after { content:""; position:absolute; width:min(10vw,128px); aspect-ratio:1; border-radius:50%; background:var(--magenta); border:2px solid var(--ink); box-shadow:0 6rem 0 -2rem var(--blue), -5rem 11rem 0 -3rem var(--paper); }
.hero-actions { display:flex; gap:1.3rem; flex-wrap:wrap; margin-top:2rem; }
.route-caption { grid-column:1/3; align-self:end; border-top:1px solid var(--ink); padding-top:.6rem; font:700 .75rem var(--sans); display:flex; justify-content:space-between; gap:1rem; }
.relay-grid { display:grid; grid-template-columns:1.2fr .55fr 1fr; gap:clamp(1.4rem,4vw,5rem); align-items:start; }
.problem-room .lead-object { grid-column:1; min-height:430px; position:relative; border-top:2px solid var(--ink); border-bottom:2px solid var(--ink); display:grid; align-items:end; padding:2rem 0; }
.problem-room .lead-object::before { content:""; position:absolute; inset:12% 6% 22% 20%; border:2px solid var(--blue); border-radius:50% 50% 8% 8% / 18% 18% 4% 4%; transform:skewX(-5deg); }
.problem-room .lead-object::after { content:""; position:absolute; width:36%; height:1px; background:var(--magenta); left:45%; top:48%; box-shadow:-7rem 5rem 0 var(--magenta), 4rem -7rem 0 var(--blue); }
.wall-label { font-size:1.12rem; max-width:28ch; }
.wall-label strong { font-family:var(--sans); font-size:.72rem; text-transform:uppercase; letter-spacing:.09em; display:block; color:var(--blue); margin-bottom:1rem; }
.problem-room .wall-label { grid-column:2/4; margin-top:9rem; }
.mechanism { display:grid; grid-template-columns:.5fr 1fr .8fr 1.2fr; gap:clamp(1rem,3vw,4rem); align-items:start; }
.chronology { border-top:1px solid var(--ink); padding-top:1rem; }
.chronology .step { min-height:160px; padding:1rem 0; border-bottom:1px solid rgba(9,11,16,.35); }
.step b { display:block; font:700 .72rem var(--sans); color:var(--magenta); margin-bottom:2rem; }
.mechanism .essay-excerpt { grid-column:2/4; font-size:clamp(1.5rem,1.1rem + 1.3vw,2.7rem); line-height:1.16; margin-top:4rem; }
.mechanism .chronology { grid-column:4; }
.benefit-spread { display:grid; grid-template-columns:1.2fr .75fr .48fr; grid-template-rows:auto auto; gap:2rem 4vw; }
.benefit-spread h2 { grid-column:1/3; }
.benefit-spread .benefit-a { grid-column:1; font-size:1.15rem; }
.benefit-spread .benefit-b { grid-column:2; margin-top:6rem; }
.benefit-spread .benefit-c { grid-column:3; margin-top:-3rem; writing-mode:vertical-rl; font-size:1rem; border-right:2px solid var(--magenta); padding-right:1rem; }
.feature-rail { display:grid; grid-template-columns:2fr .65fr 1fr; gap:4vw; }
.feature-rail ul { list-style:none; padding:0; margin:0; border-top:2px solid var(--ink); }
.feature-rail li { padding:1rem 0; border-bottom:1px solid rgba(9,11,16,.35); display:flex; justify-content:space-between; gap:1rem; }
.feature-rail li::after { content:"●"; color:var(--blue); font-size:.65rem; }
.offer-room { background:var(--ink); color:var(--field); margin:5rem clamp(2rem,6vw,7rem); padding:clamp(2rem,5vw,5rem); display:grid; grid-template-columns:1.2fr .8fr; gap:4rem; position:relative; }
.offer-room::after { content:"ВИХІД / КРАМНИЦЯ"; position:absolute; right:1rem; top:1rem; color:#fff; font:700 .7rem var(--sans); letter-spacing:.12em; }
.offer-room h2 { color:var(--field); }
.offer-room a { color:var(--field); }
.offer-room .primary-action { background:var(--field); color:var(--ink); border-color:var(--field); }
.product-relay { display:grid; grid-template-columns:1.35fr .7fr 1fr; gap:clamp(1.4rem,4vw,4rem); align-items:start; }
.product-plate { container-type:inline-size; position:relative; padding-top:1rem; border-top:2px solid currentColor; }
.product-plate:nth-child(2) { margin-top:8rem; }
.product-plate:nth-child(3) { margin-top:3rem; }
.product-image { display:grid; place-items:center; min-height:260px; margin-bottom:1rem; }
.product-image img { width:100%; max-height:330px; object-fit:contain; filter:saturate(.86) contrast(1.05); }
.product-price { font:700 1rem var(--sans); color:var(--blue); }
.product-form { display:flex; align-items:center; gap:.7rem; margin-top:1rem; border-top:1px solid currentColor; padding-top:.7rem; }
.quantity-label input { width:58px; min-height:44px; border:1px solid currentColor; background:transparent; color:inherit; padding:.4rem; }
.catalog-action { border:0; border-bottom:2px solid currentColor; background:transparent; color:inherit; cursor:pointer; padding:.45rem 0; }
.stock-note { font:700 .82rem var(--sans); color:var(--magenta); }
.faq-list { max-width:920px; margin-left:auto; }
.faq-list details { border-top:1px solid var(--ink); padding:1rem 0; }
.faq-list details:last-child { border-bottom:1px solid var(--ink); }
.faq-list summary { cursor:pointer; min-height:44px; font:700 1rem var(--sans); display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.faq-list summary::after { content:"↘"; color:var(--blue); }
.faq-list details[open] summary::after { content:"↖"; }
.archive-head { display:grid; grid-template-columns:1fr 1fr; gap:4vw; padding-top:4rem; }
.archive-groups { display:grid; gap:6rem; }
.archive-room { display:grid; grid-template-columns:.45fr 1.2fr .9fr; gap:3vw; border-top:2px solid var(--ink); padding-top:1rem; }
.archive-room .archive-index { font:700 .72rem var(--sans); color:var(--blue); }
.archive-room h2 { font-size:clamp(2rem,1.4rem + 2vw,4rem); }
.article-link { display:block; padding:1rem 0 1.5rem; border-bottom:1px solid rgba(9,11,16,.35); text-decoration:none; }
.article-link .meta { color:var(--magenta); }
.article-link p { max-width:50ch; }
.article-spread { display:grid; grid-template-columns:minmax(260px,.85fr) minmax(0,1.2fr); gap:clamp(2rem,7vw,8rem); align-items:start; }
.object-plate { position:sticky; top:2rem; min-height:68vh; border-top:2px solid var(--ink); border-bottom:1px solid var(--ink); display:grid; place-items:center; padding:2rem; }
.object-plate .botanical-figure { width:70%; aspect-ratio:.68; border:2px solid var(--ink); border-radius:50% 50% 12% 12% / 23% 23% 7% 7%; position:relative; background:rgba(255,255,255,.14); }
.object-plate .botanical-figure::before,.object-plate .botanical-figure::after { content:""; position:absolute; border:2px solid var(--magenta); width:42%; aspect-ratio:1; border-radius:80% 0 80% 0; transform:rotate(38deg); left:16%; top:24%; }
.object-plate .botanical-figure::after { left:43%; top:49%; border-color:var(--blue); transform:rotate(210deg); }
.text-plate { max-width:760px; }
.article-chapter { padding:2.2rem 0 4rem; border-top:1px solid var(--ink); }
.article-chapter h2 { font-size:clamp(2rem,1.4rem + 2vw,3.8rem); }
.notice { border-left:5px solid var(--magenta); padding:.7rem 0 .7rem 1.2rem; margin:2rem 0; }
.sources { margin-top:3rem; font-size:.95rem; }
.catalog-grid { display:grid; grid-template-columns:1.2fr .72fr 1fr; gap:5rem 3vw; align-items:start; }
.catalog-grid .product-plate:nth-child(3n+2) { margin-top:6rem; }
.catalog-grid .product-plate:nth-child(3n+3) { margin-top:2rem; }
.cart-layout,.checkout-layout { display:grid; grid-template-columns:1.45fr .7fr; gap:clamp(2rem,7vw,8rem); align-items:start; }
.cart-row { display:grid; grid-template-columns:52px 1fr auto auto auto; gap:1rem; align-items:center; border-top:1px solid var(--ink); padding:1.1rem 0; }
.cart-row:last-child { border-bottom:1px solid var(--ink); }
.cart-row h2 { font-size:1.35rem; margin:0 0 .2rem; }
.cart-row p { margin:0; font:400 .75rem var(--sans); color:var(--blue); }
.accession { font:700 .8rem var(--sans); color:var(--magenta); }
.qty-stepper { display:flex; border:1px solid var(--ink); }
.qty-stepper button,.qty-stepper input { width:44px; height:44px; border:0; background:transparent; text-align:center; color:var(--ink); }
.qty-stepper button { cursor:pointer; font-size:1.3rem; }
.remove-link { border:0; background:transparent; text-decoration:underline; cursor:pointer; min-height:44px; }
.cart-summary,.checkout-summary { border-top:3px solid var(--ink); padding-top:1rem; position:sticky; top:1.5rem; }
.cart-summary .total,.checkout-summary .total { display:flex; justify-content:space-between; font:700 1.15rem var(--sans); margin:1.4rem 0; }
.is-disabled { pointer-events:none; opacity:.45; }
.empty-state { padding:4rem 0; }
.checkout-line { display:flex; justify-content:space-between; gap:1rem; padding:.8rem 0; border-bottom:1px solid rgba(9,11,16,.25); }
.checkout-form { display:grid; grid-template-columns:1fr 1fr; gap:1rem 1.4rem; }
.field { display:grid; gap:.35rem; font:700 .78rem var(--sans); }
.field.full { grid-column:1/-1; }
.field input,.field textarea { width:100%; border:1px solid var(--ink); background:rgba(255,255,255,.2); min-height:48px; padding:.7rem; color:var(--ink); border-radius:0; }
.field textarea { min-height:110px; resize:vertical; }
.field-error { min-height:1.1em; color:#6f003c; font-weight:700; }
.checkbox { grid-column:1/-1; display:grid; grid-template-columns:24px 1fr; gap:.65rem; align-items:start; font-family:var(--sans); font-size:.86rem; }
.checkbox input { width:22px; height:22px; accent-color:var(--blue); }
.global-error { grid-column:1/-1; color:#6f003c; font:700 .9rem var(--sans); min-height:1.2em; }
.checkout-form .primary-action { grid-column:1/-1; justify-content:center; cursor:pointer; }
.info-page { display:grid; grid-template-columns:.55fr 1.4fr; gap:6vw; }
.info-page aside { font:700 .78rem var(--sans); color:var(--blue); }
.prose { max-width:820px; }
.prose h2 { margin-top:2.4rem; font-size:clamp(1.8rem,1.3rem + 1.6vw,3.2rem); border-top:1px solid var(--ink); padding-top:.5rem; }
.prose li { margin:.6rem 0; }
.cookie-options { border-top:2px solid var(--ink); padding-top:1rem; display:grid; gap:1rem; }
.cookie-options label { display:flex; gap:.7rem; font-family:var(--sans); }
.site-footer { margin:clamp(5rem,10vw,10rem) clamp(2rem,5vw,6rem) 0; padding:3rem 0 2rem; border-top:2px solid var(--ink); font-family:var(--sans); font-size:.78rem; }
.vine-route-footer { width:min(680px,90vw); margin:-4rem 0 1rem auto; }
.colophon-line { margin:.4rem 0; }
.legal-foot { font-size:.72rem; max-width:105ch; opacity:.82; }
@container (max-width: 300px) { .product-form { display:grid; } .catalog-action { justify-content:flex-start; } }
@media (max-width: 900px) {
  .site-header { grid-template-columns:1fr; padding-inline:2rem; }
  .floor-plan { grid-template-columns:1fr 1fr; }
  .vine-route-header { margin:.2rem 0 -1rem; }
  .route-section { padding-inline:3rem 2rem; }
  .hero { grid-template-columns:1fr; grid-template-rows:auto; min-height:auto; }
  .hero-copy,.hero-note,.hero-object,.route-caption { grid-column:1; grid-row:auto; }
  .hero-note { margin:0 0 1rem 10vw; max-width:70%; }
  .hero-object { min-height:48vh; }
  .hero-object::before { width:190px; }
  .hero-object::after { width:100px; }
  .relay-grid,.mechanism,.benefit-spread,.feature-rail,.product-relay,.archive-head,.archive-room,.article-spread,.catalog-grid,.cart-layout,.checkout-layout,.info-page { grid-template-columns:1fr; }
  .problem-room .lead-object,.problem-room .wall-label,.mechanism .essay-excerpt,.mechanism .chronology,.benefit-spread h2,.benefit-spread .benefit-a,.benefit-spread .benefit-b,.benefit-spread .benefit-c { grid-column:1; }
  .problem-room .wall-label,.benefit-spread .benefit-b,.benefit-spread .benefit-c,.product-plate:nth-child(2),.product-plate:nth-child(3),.catalog-grid .product-plate:nth-child(3n+2),.catalog-grid .product-plate:nth-child(3n+3) { margin-top:0; }
  .benefit-spread .benefit-c { writing-mode:horizontal-tb; border-right:0; border-left:2px solid var(--magenta); padding-left:1rem; }
  .offer-room { grid-template-columns:1fr; margin-inline:2rem; }
  .object-plate { position:relative; min-height:50vh; top:auto; order:-1; }
  .cart-summary,.checkout-summary { position:relative; top:auto; }
}
@media (max-width: 620px) {
  .site-header { padding-inline:1.35rem; }
  .floor-plan { grid-template-columns:1fr; }
  .floor-plan a { border-right:0; border-bottom:1px solid rgba(9,11,16,.2); }
  .route-section { padding:4rem 1.35rem 4rem 2.4rem; }
  .route-section::before { left:.7rem; }
  .route-section::after { left:1.5rem; }
  h1 { font-size:clamp(3rem,17vw,5rem); }
  .hero-note { max-width:88%; margin-left:5%; }
  .route-caption { display:grid; }
  .product-relay,.catalog-grid { gap:3.5rem; }
  .cart-row { grid-template-columns:36px 1fr; }
  .cart-row .qty-stepper,.cart-row .line-total,.cart-row .remove-link { grid-column:2; justify-self:start; }
  .checkout-form { grid-template-columns:1fr; }
  .field,.field.full,.checkbox,.global-error,.checkout-form .primary-action { grid-column:1; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation-duration:.01ms!important; transition-duration:.01ms!important; }
}