/* =========================================================
   Kantina Pupa — tema v4
   Frymëzim: Antinori, Ornellaia, Château Margaux, Cheval Blanc
   Bazë fildishi, panele të rrumbullakosura, shkrim dore si theks
   ========================================================= */
:root{
  --paper:#FBF8F3;
  --paper-2:#F3EDE4;
  --card:#FFFFFF;
  --ink:#2A1A1F;
  --muted:#6F6166;
  --night:#1E1317;
  --night-2:#271A1F;
  --wine:#8C080F;
  --gold:#C9A45E;
  --gold-l:#E2C98F;
  --gold-d:#9F7A35;
  --line-l:rgba(42,26,31,.12);

  --script:"Pinyon Script","Snell Roundhand","Segoe Script",cursive;
  --r-xl:36px;
  --r-lg:28px;
  --r-md:20px;
  --r-sm:14px;
  --inset:clamp(8px,1.1vw,14px);
  --soft:0 30px 60px -30px rgba(42,26,31,.25);
}
html{background:var(--bg)}
body{background:var(--bg);color:var(--ink)}

/* ---------- Shkrimi i dorës ---------- */
.kicker{font:400 clamp(1.7rem,1.3rem + 1.2vw,2.5rem)/1 var(--script);color:var(--accent);letter-spacing:0;margin-bottom:.6rem}
.kicker::before,.head--center .kicker::after{display:none}
.dark .kicker,.grapes .kicker,.cellar .kicker,.book .kicker,.timeline-panel .kicker{color:var(--gold-l)}
.script-line{font:400 clamp(2.4rem,1.8rem + 2.4vw,4.2rem)/1 var(--script);color:var(--gold-l);margin:0 auto .6rem;max-width:none}
.signature{font:400 clamp(2.2rem,1.8rem + 1.4vw,3rem)/1 var(--script);color:var(--accent);margin:2rem 0 1.4rem}
.hero__kicker,.phero .crumbs{font-family:var(--script);font-style:normal;font-size:clamp(1.8rem,1.4rem + 1.2vw,2.6rem);color:var(--gold-l);letter-spacing:0}
.phero .crumbs{font-size:clamp(1.5rem,1.2rem + 1vw,2.1rem);gap:.6rem;align-items:baseline}
.phero .crumbs a{font-family:var(--body);font-size:.82rem;letter-spacing:.08em}
.phero .crumbs span[aria-hidden]{font-family:var(--body);font-size:.82rem;color:rgba(251,248,243,.5)}
.stage__index,.day__n,.timeline__y,.next__k,.room__cap{font-family:var(--script);font-style:normal}
.stage__index{font-size:1.8rem;line-height:1}
.day__n{font-size:2.6rem;color:var(--accent)}
.timeline__y{font-size:clamp(2.6rem,2rem + 2vw,3.8rem);color:var(--gold-l)}
.next__k{font-size:clamp(1.8rem,1.4rem + 1.4vw,2.6rem);color:var(--gold-l)}
.room__cap{font-size:1.6rem;color:var(--gold-d)}
.footer__script{font:400 clamp(2rem,1.6rem + 1.6vw,3.2rem)/1 var(--script);color:var(--gold-l);text-align:center;margin:0 auto 1.6rem;max-width:none}

/* ---------- Butonat: kapsulë ---------- */
.btn{border-radius:999px;letter-spacing:.04em;padding-inline:1.9rem}
.btn--gold{background:var(--btn-bg);color:var(--btn-fg)}
.btn--gold::before{background:var(--btn-hover)}
.dark .btn--gold,.cellar .btn--gold,.book .btn--gold,.hero .btn--gold,.phero .btn--gold,.agegate .btn--gold,.site-header:not(.is-solid) .btn--gold,.menu .btn--gold,.site-footer .btn--gold{background:var(--gold);color:var(--night)}
.dark .btn--gold::before,.cellar .btn--gold::before,.book .btn--gold::before,.hero .btn--gold::before,.phero .btn--gold::before,.agegate .btn--gold::before,.site-header:not(.is-solid) .btn--gold::before,.menu .btn--gold::before,.site-footer .btn--gold::before{background:var(--gold-l)}
.btn--ghost{border-color:rgba(251,248,243,.45);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);background:rgba(255,255,255,.06)}
.btn--dark{background:var(--ink)}
.btn--dark::before{background:var(--btn-hover)}
.more{font-weight:400}
.more::after{background:var(--accent);height:1px}

/* ---------- Header: kapsulë lundruese ---------- */
.site-header{padding:calc(var(--inset) + 6px + env(safe-area-inset-top,0px)) calc(var(--inset) + 8px) 0;background:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.site-header::after{display:none}
.site-header__in{height:68px;max-width:1360px;margin:0 auto;border-radius:999px;padding-inline:1.4rem 1rem;background:rgba(30,19,23,.22);border:1px solid rgba(251,248,243,.14);backdrop-filter:blur(14px) saturate(1.2);-webkit-backdrop-filter:blur(14px) saturate(1.2);transition:background .5s var(--ease),border-color .5s,box-shadow .5s,color .4s}
.site-header.is-solid .site-header__in{background:var(--header-solid);border-color:var(--line-l);box-shadow:0 18px 40px -24px rgba(42,26,31,.35);color:var(--ink)}
.site-header.is-solid{color:var(--ink);--logo-gold:var(--logo-gold-s);--logo-word:var(--logo-word-s)}
.site-header.is-solid .lang{color:var(--ink);border-color:var(--line-l)}
.site-header.is-solid .burger span{background:var(--ink)}
.lang{border-radius:999px}
.brand__logo{height:50px}
.site-header.is-solid .brand__logo{height:44px}
.nav a:not(.btn)::after{background:currentColor;opacity:.6}

/* Menyja në celular */
.menu{background:var(--bg);color:var(--ink)}
.menu nav a{border-bottom-color:var(--line-l)}
.menu nav a small{font:400 1.6rem var(--script);color:var(--gold-d)}
.menu nav a[aria-current="page"]{color:var(--accent)}
.menu .lang{color:var(--ink);border-color:var(--line-l)}
body:has(.menu.is-open) .site-header{color:var(--ink);--logo-gold:var(--logo-gold-s);--logo-word:var(--logo-word-s)}
body:has(.menu.is-open) .burger span{background:var(--ink)}

/* ---------- Panelet e rrumbullakosura ---------- */
.hero,.phero{margin:var(--inset);border-radius:var(--r-xl);min-height:calc(100svh - 2*var(--inset))}
.phero{min-height:calc(86svh - 2*var(--inset))}
.grapes,.cellar,.quote,.day,.book,.dark,.next,.marquee{margin:var(--inset);border-radius:var(--r-xl);overflow:hidden}
.site-footer{margin:var(--inset) var(--inset) 0;border-radius:var(--r-xl) var(--r-xl) 0 0}
.next{border-top:0}

/* Rrushi: panel i çelët me karta */
.grapes{background:var(--bg-2);color:var(--ink)}
.grapes .kicker{color:var(--accent)}
.grapes .head__lead{color:var(--muted)}
.grapes__grid,.grapes__grid--6{border-top:0;gap:clamp(.8rem,1.5vw,1.2rem)}
.grapes .grape,.grapes .grape:nth-child(n){background:var(--card);border:0!important;border-radius:var(--r-lg);padding:2.6rem 1.6rem 1.8rem!important;box-shadow:var(--soft);transition:transform .6s var(--ease),box-shadow .6s}
.grapes .grape:hover{transform:translateY(-6px);box-shadow:0 40px 70px -36px rgba(42,26,31,.35)}
.grape h3{color:var(--ink);font-style:normal}
.grape__type{color:var(--gold-d)}
.grape p:last-child{color:var(--muted)}

/* Marquee: shkrim dore */
.marquee{background:var(--bg);border:0;padding-block:clamp(1.4rem,3vw,2.2rem)}
.marquee span{font:400 clamp(3.4rem,8vw,7.2rem)/1.15 var(--script);color:var(--gold-d);-webkit-text-stroke:0}
.marquee__sep{border-color:var(--accent);width:9px;height:9px}

/* Kantina / verërat */
.cellar{background:radial-gradient(120% 90% at 50% 0%,#2E1C22,var(--night) 70%)}
.stage__ghost{font-family:var(--script);font-style:normal;-webkit-text-stroke:0;color:rgba(201,164,94,.10)}
.stage__specs div{border-top-color:rgba(201,164,94,.2)}
.tab{border-radius:999px;font-style:normal;font-family:var(--body);font-size:.92rem;letter-spacing:.03em;padding:.7rem 1.2rem;border:1px solid transparent}
.tab::after{display:none}
.tab[aria-selected="true"]{background:rgba(201,164,94,.14);border-color:rgba(201,164,94,.4);color:var(--gold-l)}
.arrow{border-radius:50%}

/* Foto */
.photo,.panel__photo,.room .photo,.gallery figure,.mapframe{border-radius:var(--r-lg);overflow:hidden}
.photo{background:radial-gradient(90% 70% at 30% 20%,#3A2329,var(--night) 75%)}
.photo--small{border:8px solid var(--bg);border-radius:var(--r-lg)}
.story__media .photo--portrait{box-shadow:var(--soft)}
.reveal::after{border-radius:inherit}
.dark .reveal,.grapes .reveal{--cover:var(--bg-2)}
.phero__bg,.hero__media{border-radius:inherit;overflow:hidden}

/* Përvoja */
.panel__body h3{font-size:var(--s2)}
.exp__grid .panel{background:var(--card);border-radius:var(--r-xl);padding:var(--inset);box-shadow:var(--soft)}
.exp__grid .panel__body{padding:1.6rem 1rem 1.2rem}
.exp__grid .panel__photo{border-radius:calc(var(--r-xl) - 8px)}

/* Numrat dhe faktet */
.numbers{border:0;gap:clamp(.6rem,1.2vw,1rem)}
.numbers div,.numbers div+div{background:var(--card);border:0;border-radius:var(--r-lg);box-shadow:var(--soft)}
.facts{border-top:0;gap:.8rem}
.facts div,.facts div+div{background:var(--card);border:0;border-radius:var(--r-md);padding:1.2rem 1.2rem 1rem;box-shadow:var(--soft)}

/* Dita */
.day{background:var(--bg-2)}
.day__steps{border-top:0;gap:clamp(.6rem,1.2vw,1rem)}
.day__steps li,.day__steps li+li{background:var(--card);border:0;border-radius:var(--r-lg);padding:1.8rem 1.4rem 1.2rem;box-shadow:var(--soft)}

/* Kronologjia */
.timeline{border-top:0;gap:clamp(.6rem,1.2vw,1rem)}
.timeline li,.timeline li+li{background:rgba(255,255,255,.04);border:1px solid rgba(201,164,94,.18);border-radius:var(--r-lg);padding:2rem 1.6rem 1.4rem}

/* Dhomat dhe të përfshirat */
.room{background:var(--card);border-radius:var(--r-xl);padding:var(--inset);box-shadow:var(--soft)}
.room .photo{border-radius:calc(var(--r-xl) - 8px)}
.room__body{padding:1.4rem 1rem 1rem}
.included{border:0;background:var(--bg-2);border-radius:999px;padding:1.4rem 2rem}

/* Restoranti */
.dishes li{border-bottom-color:rgba(201,164,94,.18)}

/* Citati */
.quote blockquote{font-style:normal}
.quote__bg::after{background:linear-gradient(180deg,rgba(30,19,23,.55),rgba(30,19,23,.75))}

/* Rezervimi */
.form__choice span{border-radius:999px;padding:.8rem 1.4rem}
.field input,.field textarea{background:rgba(255,255,255,.05);border:1px solid rgba(251,248,243,.16);border-radius:var(--r-sm);padding:.85rem 1rem;transition:border-color .3s,background .3s}
.field input:focus,.field textarea:focus{border-color:var(--gold);background:rgba(255,255,255,.08)}
.field input[aria-invalid="true"]{border-color:#E07A86}
.book__contact li{border-top-color:rgba(201,164,94,.2)}

/* Kontakt */
.info div{border-top-color:var(--line-l)}
.mapframe{box-shadow:var(--soft)}

/* Faqja tjetër dhe CTA */
.next{background:var(--night)}
.cta-band h2{color:var(--paper)}

/* Footer */
.site-footer{background:var(--night)}
.footer__row{border-top-color:rgba(201,164,94,.18)}

/* Mosha, loader, perdja: fildish me logon me ngjyra */
.agegate{background:rgba(30,19,23,.55)}
.agegate__box{background:var(--bg);color:var(--ink);border:0;border-radius:var(--r-xl);box-shadow:0 50px 100px -40px rgba(0,0,0,.6);--logo-gold:var(--logo-gold-s);--logo-word:var(--logo-word-s)}
.agegate p{color:var(--muted)}
.agegate .btn--gold{background:var(--btn-bg);color:var(--btn-fg)}
.agegate .btn--gold::before{background:var(--btn-hover)}
.agegate .btn--ghost{color:var(--ink);border-color:var(--line-l);background:none}
.agegate .btn--ghost:hover{color:#fff}
.agegate .btn--ghost::before{background:var(--ink)}
.loader__panel{background:var(--bg)}
.loader .loader__inner{--logo-gold:var(--logo-gold-s);--logo-word:var(--logo-word-s)}
.loader__sub{font-family:var(--script);font-style:normal;font-size:clamp(1.6rem,1.3rem + 1vw,2.2rem);color:var(--gold-d)}
.loader__bar{background:var(--line-l)}
.loader__bar i{background:var(--accent)}
.loader__count{color:var(--muted)}
.loader__panel--t::after{background:var(--gold-d)}
.curtain{background:var(--bg);--logo-gold:var(--logo-gold-s);--logo-word:var(--logo-word-s)}

/* Kursori */
.cursor__dot{background:var(--accent)}
.cursor__ring{border-color:rgba(140,8,15,.45)}
.cursor.is-label .cursor__ring{background:var(--accent);border-color:var(--accent)}
.cursor.is-label .cursor__ring span{color:var(--btn-fg)}
.dark .cursor__ring{border-color:var(--gold)}

/* Celular */
@media (max-width:1100px){
  .site-header__in{padding-inline:1.1rem .6rem}
  .grapes__grid--6 .grape:nth-child(n){border-right:0}
  .day__steps li,.day__steps li+li{grid-template-columns:3.4rem 1fr}
}
@media (max-width:820px){
  :root{--r-xl:26px;--r-lg:20px}
  .site-header__in{height:60px}
  .brand__logo,.site-header.is-solid .brand__logo{height:40px}
  .included{border-radius:var(--r-lg)}
}
@media (max-width:560px){
  .facts div:nth-child(3){border-top:0;margin-top:0;padding-left:1.2rem}
  .grapes__grid--6 .grape:nth-child(n),.grapes .grape:nth-child(n){padding:2.2rem 1.4rem 1.6rem!important}
}

/* Fundi i faqes: më pak panele të errëta njëri pas tjetrit */
.cta-band{background:var(--bg-2);margin:var(--inset);border-radius:var(--r-xl)}
.cta-band h2{color:var(--ink)}
.cta-band .script-line{color:var(--accent)}
.next{background:transparent;color:var(--ink);margin-block:0}
.next__k{color:var(--accent)}
.next:hover .next__t{color:var(--accent)}
.next__line{background:var(--accent)}
.site-header.is-hidden{transform:translateY(calc(-100% - 60px))}
.site-header.is-hidden .site-header__in{box-shadow:none}
.prose p.kicker{font:400 clamp(1.7rem,1.3rem + 1.2vw,2.5rem)/1 var(--script);color:var(--accent);max-width:none}
.dark .prose p.kicker{color:var(--gold-l)}
.prose .kicker + p{font:400 var(--s2)/1.35 var(--display);color:var(--ink);max-width:28ch}

/* =========================================================
   v5 — Tema e çelët / e errët (e errëta: bordo, parazgjedhje)
   ========================================================= */
:root,[data-theme="light"]{
  --bg:#FBF8F3; --bg-2:#F3EDE4; --card:#FFFFFF;
  --ink:#2A1A1F; --muted:#6F6166; --line-l:rgba(42,26,31,.12);
  --accent:#8C080F; --gold-d:#9F7A35;
  --btn-bg:#8C080F; --btn-fg:#FFFFFF; --btn-hover:#6F060C;
  --logo-gold-s:#9F7A35; --logo-word-s:#8C080F;
  --header-solid:rgba(251,248,243,.86);
  --soft:0 30px 60px -30px rgba(42,26,31,.25);
  --night:#1E1317; --night-2:#271A1F;
  --hero-a:#3A1A27; --hero-b:#1A0E13; --panel-a:#2E1C22;
  color-scheme:light;
}
[data-theme="dark"]{
  --bg:#2A0B12; --bg-2:#330E16; --card:#3D121B;
  --ink:#F4ECE3; --muted:rgba(244,236,227,.7); --line-l:rgba(244,236,227,.14);
  --accent:#E2C98F; --gold-d:#D2B06E;
  --btn-bg:#C9A45E; --btn-fg:#2A0B12; --btn-hover:#E2C98F;
  --logo-gold-s:#C9A45E; --logo-word-s:#F4ECE3;
  --header-solid:rgba(42,11,18,.86);
  --soft:0 30px 60px -30px rgba(0,0,0,.6);
  --night:#170508; --night-2:#1E070C;
  --hero-a:#5C1524; --hero-b:#170508; --panel-a:#4A0F1C;
  color-scheme:dark;
}
html{background:var(--bg);transition:background-color .5s ease}
body{background:var(--bg);color:var(--ink);transition:background-color .5s ease,color .5s ease}
.hero{background:radial-gradient(120% 90% at 72% 30%,var(--hero-a) 0%,var(--hero-b) 62%)}
.phero{background:var(--night)}
.cellar{background:radial-gradient(120% 90% at 50% 0%,var(--panel-a),var(--night) 70%)}
.photo{background:radial-gradient(90% 70% at 30% 20%,var(--hero-a),var(--night) 75%)}
.reveal::after{background:var(--cover,var(--bg))}
.btn--dark{background:var(--ink);color:var(--bg)}
.label-brand,.label-type{fill:#2A1520}
.facts dt,.numbers dt{color:var(--ink)}
.facts dd,.numbers dd,.story__text>p,.prose p{color:var(--muted)}
.prose .kicker + p,.prose p:first-of-type:not(.kicker){color:var(--ink)}
.site-header.is-solid .site-header__in{box-shadow:var(--soft)}
[data-theme="dark"] .agegate__box{box-shadow:0 50px 100px -40px rgba(0,0,0,.8)}
[data-theme="dark"] .mapframe{filter:grayscale(1) invert(.88) sepia(.35) hue-rotate(-20deg) contrast(.95)}
[data-theme="dark"] ::selection{background:var(--gold);color:#2A0B12}

/* Çelësi i temës */
.theme-toggle{position:relative;width:44px;height:42px;border-radius:999px;border:1px solid var(--line-d);background:none;color:inherit;cursor:pointer;display:grid;place-items:center;transition:border-color .3s}
.theme-toggle:hover{border-color:var(--gold)}
.site-header.is-solid .theme-toggle,.menu .theme-toggle{border-color:var(--line-l)}
.theme-toggle svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;position:absolute;transition:opacity .4s,transform .6s var(--ease)}
.theme-toggle .i-sun{opacity:0;transform:rotate(-90deg) scale(.6)}
[data-theme="light"] .theme-toggle .i-sun{opacity:1;transform:none}
[data-theme="light"] .theme-toggle .i-moon{opacity:0;transform:rotate(90deg) scale(.6)}
.menu .theme-toggle{color:var(--ink)}

/* Kthehu lart: me unazë progresi */
.totop{position:fixed;right:calc(var(--inset) + 14px);bottom:calc(var(--inset) + 14px + env(safe-area-inset-bottom,0px));z-index:80;width:54px;height:54px;border-radius:50%;border:0;cursor:pointer;background:var(--card);color:var(--ink);box-shadow:0 16px 36px -14px rgba(0,0,0,.45);display:grid;place-items:center;opacity:0;visibility:hidden;transform:translateY(16px) scale(.9);transition:opacity .4s,transform .5s var(--ease),visibility .4s,background .3s}
.totop.is-on{opacity:1;visibility:visible;transform:none}
.totop:hover{background:var(--btn-bg);color:var(--btn-fg)}
.totop svg{position:absolute;inset:0;width:100%;height:100%}
.totop .ring{fill:none;stroke:var(--accent);stroke-width:2;stroke-linecap:round;transform:rotate(-90deg);transform-origin:center;stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--p,0));transition:stroke-dashoffset .15s linear}
.totop .track{fill:none;stroke:var(--line-l);stroke-width:2}
.totop .arrow-up{position:relative;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.totop:focus-visible{outline:2px solid var(--gold);outline-offset:4px}

/* =========================================================
   Rreshtimi dhe përdorshmëria
   ========================================================= */
/* Header i rreshtuar me kolonat e përmbajtjes */
.site-header__in{max-width:calc(var(--wrap) + 2.8rem);gap:1rem}
.nav--right{gap:1.2rem}
.nav--right .btn{margin-left:.2rem}
.site-header__tools,.nav{align-items:center}

/* Kokat e seksioneve: titulli majtas, hyrja poshtë djathtas */
.head{align-items:end;row-gap:1rem}
.head h2{max-width:18ch}
.head__lead{max-width:46ch;justify-self:end}
.head--center .head__lead{justify-self:center}

/* Kartat me lartësi të barabarta dhe lidhja poshtë */
.exp__grid{align-items:stretch}
.panel:nth-child(2){margin-top:0}
.exp__grid .panel{display:flex;flex-direction:column}
.exp__grid .panel>a{flex:none}
.exp__grid .panel__body{display:flex;flex-direction:column;flex:1}
.exp__grid .panel__body p{flex:1}
.exp__grid .more{align-self:flex-start}
.rooms{align-items:stretch}
.room{display:flex;flex-direction:column}
.room__body{flex:1}
.grapes .grape{height:100%}
.grapes__grid{align-items:stretch}
.day__steps,.timeline{align-items:stretch}
.day__steps li,.timeline li{height:100%}

/* Faktet: tre në rresht edhe në celular */
.facts{grid-template-columns:repeat(3,1fr)}
.facts dt{font-size:clamp(1.6rem,1.1rem + 2vw,3rem)}
.facts div,.facts div+div{display:flex;flex-direction:column;justify-content:space-between}

/* Lidhjet: zonë prekjeje 44px */
.more{min-height:44px}
.footer__cols ul{gap:.15rem}
.footer__cols a:not(.btn){display:inline-flex;align-items:center;min-height:36px}
.crumbs a{min-height:32px;display:inline-flex;align-items:center}

/* Prezantimi i verërave: skedat në një rresht të rrëshqitshëm */
.stage__nav{gap:.5rem}
@media (max-width:820px){
  .stage__nav{flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding:.4rem var(--gut) .8rem;margin-inline:calc(-1 * var(--gut));scrollbar-width:none;mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
  .stage__nav::-webkit-scrollbar{display:none}
  .stage__nav .tab{flex:none;scroll-snap-align:center;white-space:nowrap}
  .stage__nav .arrow{display:none}
  .head__lead{justify-self:start}
  .facts{grid-template-columns:repeat(3,1fr)!important}
  .facts div:nth-child(3){grid-column:auto!important;margin-top:0!important;border-top:0!important;padding-left:1rem!important}
  .facts div,.facts div+div{padding:1rem .9rem .9rem}
  .facts dd{font-size:.78rem}
  .footer__cols{grid-template-columns:1fr 1fr}
  .totop{width:48px;height:48px}
}
@media (max-width:420px){
  .footer__cols{grid-template-columns:1fr}
}

/* Formulari: etiketat dhe fushat të rreshtuara */
.form__grid{align-items:end}
.field>span{min-height:1.2em}
.form__actions{align-items:center}

/* Fokus i dukshëm në të dyja temat */
:focus-visible{outline-color:var(--accent)}