:root{
  --ink:#150c1e; --ink2:#1e1230; --gold:#e8b662; --gold-hi:#fdf2d8; --cream:#fbf6ed;
  --rose:#f2a3b8; --muted:rgba(251,246,237,.68); --line:rgba(232,182,98,.32);
  --veil:.38; --lift:brightness(1.16) saturate(1.05) contrast(1.02);
  --grad:linear-gradient(135deg,#fdf2d8 0%,#e8b662 38%,#c9963f 62%,#f8e2ac 100%);
  --r:26px; --r-sm:18px; --ease:cubic-bezier(.16,.84,.28,1);
  --serif:'Cormorant Garamond','Times New Roman',Times,serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;overflow-x:clip;scroll-padding-top:90px}
body{color:var(--cream);font-family:var(--serif);
  font-size:clamp(18px,1.05vw + 15px,22px);line-height:1.72;overflow-x:clip;
  background:
    radial-gradient(ellipse 95% 46% at 50% 0%,rgba(96,54,148,.5),transparent 62%),
    radial-gradient(ellipse 72% 46% at 4% 36%,rgba(70,40,106,.44),transparent 68%),
    radial-gradient(ellipse 72% 46% at 98% 66%,rgba(112,62,150,.4),transparent 68%),
    var(--ink);
  background-attachment:fixed}
img{max-width:100%;display:block}
a{color:var(--gold);text-decoration:none}
::selection{background:rgba(232,182,98,.34)}
:focus-visible{outline:2px solid var(--gold);outline-offset:4px}

.script{font-family:'Pinyon Script',cursive;font-weight:400}
.eyebrow{font-family:'Cinzel',serif;font-weight:500;
  font-size:clamp(.62rem,.3vw + .54rem,.8rem);letter-spacing:.5em;
  text-transform:uppercase;color:var(--gold)}
h1,h2,h3{font-weight:400;line-height:1.03;letter-spacing:-.005em}
h1{font-size:clamp(3rem,8.5vw,7.5rem)}
h2{font-size:clamp(2.5rem,6vw,5rem)}
h3{font-size:clamp(1.5rem,1.5vw + 1.1rem,2.1rem);line-height:1.16}
.gold{background:var(--grad);-webkit-background-clip:text;background-clip:text;
  color:transparent;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 3px 22px rgba(232,182,98,.3))}
.lede{font-size:clamp(1.15rem,.72vw + 1rem,1.5rem);color:rgba(251,246,237,.9);max-width:32em}
.small{font-size:.9rem;color:var(--muted);line-height:1.6}
.num{font-family:'Cinzel',serif;font-weight:600;font-variant-numeric:tabular-nums}
.rule{display:flex;align-items:center;gap:1.1em;color:var(--gold);margin:1.2em 0;font-size:.8em}
.rule::before,.rule::after{content:"";height:1px;flex:1;max-width:7em;
  background:linear-gradient(90deg,transparent,var(--gold),transparent)}
.center{text-align:center}
.center .rule{justify-content:center}
.center .lede{margin-inline:auto}
.wrap{width:min(1240px,90vw);margin-inline:auto;position:relative;z-index:3}
.narrow{width:min(820px,90vw);margin-inline:auto;position:relative;z-index:3}
.sec{padding:clamp(90px,11vw,170px) 0;position:relative;isolation:isolate}
.sec-head{max-width:22ch;margin-bottom:clamp(44px,5vw,76px)}
.sec-head.center{margin-inline:auto;max-width:24ch}
.sec-head h2{margin-top:.2em}
.sec-head p{margin-top:.9em;max-width:34em}

.hero{position:relative;min-height:100svh;display:flex;align-items:center;isolation:isolate;
  padding:clamp(130px,18vh,200px) 0 clamp(90px,12vh,140px)}
.hero .bgw{position:absolute;inset:0;overflow:hidden;z-index:0}
.hero .bgw .img{position:absolute;inset:-8% 0;background-size:cover;background-position:center;
  animation:heroIn 2.6s var(--ease) both, kb 44s ease-out 2.6s forwards}
@keyframes heroIn{from{transform:scale(1.16);filter:brightness(.4) blur(16px)}
  to{transform:scale(1.04);filter:brightness(1.16) saturate(1.05) blur(0)}}
@keyframes kb{to{transform:scale(1.13)}}
.hero .veil{position:absolute;inset:0;z-index:1;
  background:
    radial-gradient(ellipse 70% 60% at 50% 50%,rgba(18,9,28,.2),transparent 72%),
    linear-gradient(180deg,rgba(18,9,28,.6),rgba(18,9,28,var(--veil)) 40%,rgba(18,9,28,.72) 88%,var(--ink))}
.hero .wrap{z-index:3}
.lock{margin:.22em 0 0}
.lock .l1{display:block;font-family:'Pinyon Script',cursive;
  font-size:clamp(3.8rem,12vw,9rem);line-height:.9;text-shadow:0 10px 60px rgba(10,4,18,.8)}
.lock .l2{display:block;font-family:var(--serif);font-weight:300;
  font-size:clamp(1.3rem,3.6vw,2.8rem);letter-spacing:.56em;text-transform:uppercase;
  color:var(--cream);margin-top:.5em;padding-left:.56em;
  text-shadow:0 4px 26px rgba(10,4,18,.92)}
.hero .lede{margin-top:1.6em;text-shadow:0 2px 24px rgba(10,4,18,.95)}
.hero.center .lock .l2{padding-left:0}
.hero.center .lede{margin-inline:auto}
.cta-row{display:flex;flex-wrap:wrap;gap:1.2rem;margin-top:2.4em}
.hero.center .cta-row{justify-content:center}
.marks{display:flex;flex-wrap:wrap;gap:.7em 2.1em;margin-top:2.4em;
  font-family:'Cinzel',serif;font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--gold-hi)}
.hero.center .marks{justify-content:center}
.marks i{color:var(--gold);font-style:normal;margin-right:.5em}
.cue{position:absolute;left:50%;bottom:2rem;transform:translateX(-50%);z-index:4;text-align:center;
  font-family:'Cinzel',serif;font-size:.58rem;letter-spacing:.32em;text-transform:uppercase;
  color:var(--muted)}
.cue b{display:block;width:1px;height:46px;margin:.9em auto 0;
  background:linear-gradient(180deg,var(--gold),transparent);animation:drop 2.6s ease-in-out infinite}
@keyframes drop{0%,100%{opacity:.22;transform:scaleY(.45);transform-origin:top}
  50%{opacity:1;transform:scaleY(1);transform-origin:top}}

.showcase{position:relative;height:200vh}
.showcase .stick{position:sticky;top:0;height:100svh;overflow:hidden;display:grid;place-items:center}
.showcase .frame{position:relative;overflow:hidden;
  width:100%;height:100svh;border-radius:0;
  transform:scale(var(--sx,.62),var(--sy,.58));
  clip-path:inset(0 round var(--rad,42px));
  box-shadow:0 40px 120px rgba(6,3,12,.6);
  will-change:transform,clip-path}
.showcase .frame > *{transform:scale(calc(1/var(--sx,.62)),calc(1/var(--sy,.58)))}
.showcase .frame > .img{transform:none;scale:calc(1/var(--sx,.62)) calc(1/var(--sy,.58))}
.showcase .frame .img{position:absolute;inset:-6%;background-size:cover;background-position:center;
  filter:var(--lift);will-change:transform}
.showcase .frame .veil{position:absolute;inset:0;opacity:var(--vo,0);
  background:radial-gradient(ellipse 76% 72% at 50% 50%,rgba(18,9,28,.34),rgba(18,9,28,.68) 92%)}
.showcase .cap{position:absolute;inset:0;z-index:3;display:grid;place-items:center;
  text-align:center;padding:2rem;pointer-events:none}
.showcase .cap > div{max-width:24ch;opacity:var(--co,0);will-change:opacity,transform}
.showcase .cap h2{text-shadow:0 6px 40px rgba(10,4,18,.85)}
.showcase .cap p{margin-top:.8em;text-shadow:0 3px 22px rgba(10,4,18,.95)}
@media(max-width:760px){.showcase{height:160vh}.showcase .frame{--w:86%;--h:46svh}}

.bgsec{position:relative;isolation:isolate}
.bgsec .bgw{position:absolute;inset:0;overflow:hidden;z-index:0}
.bgsec .bgw .img{position:absolute;inset:-14% 0;background-size:cover;background-position:center;
  filter:var(--lift);will-change:transform}
.bgsec .bgw .veil{position:absolute;inset:0;background:rgba(18,9,28,var(--veil))}
.bgsec .bgw .fade{position:absolute;inset:0;
  background:linear-gradient(180deg,var(--ink),transparent 18%,transparent 82%,var(--ink))}
.glass{position:relative;border-radius:var(--r);padding:clamp(2rem,3.4vw,3.4rem);
  background:rgba(18,9,28,.42);backdrop-filter:blur(6px) saturate(1.2);
  border:1px solid rgba(232,182,98,.18);box-shadow:0 26px 80px rgba(6,3,12,.45)}

.cbtn{display:inline-flex;align-items:center;justify-content:center;position:relative;
  padding:1.2em 3em;border-radius:999px;overflow:hidden;isolation:isolate;cursor:pointer;
  border:1px solid rgba(232,182,98,.5);text-decoration:none;
  transition:transform .55s var(--ease),border-color .55s ease,box-shadow .55s ease}
.cbtn .stone{position:absolute;inset:0;z-index:0;background-size:cover;background-position:center;
  transform:scale(1.18);filter:brightness(.68) saturate(.8);
  transition:transform 1.5s var(--ease),filter .65s ease}
.cbtn .dim{position:absolute;inset:0;z-index:1;background:rgba(22,11,32,.56);
  transition:background .6s ease}
.cbtn .txt{position:relative;z-index:2;font-family:var(--serif);
  font-size:clamp(1.06rem,1.15vw,1.32rem);letter-spacing:.11em;white-space:nowrap;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;
  color:transparent;-webkit-text-fill-color:transparent}
.cbtn .sweep{position:absolute;top:0;left:-60%;width:45%;height:100%;z-index:2;
  transform:skewX(-18deg);pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(255,246,222,.42),transparent);
  transition:left 1.05s var(--ease)}
.cbtn::after{content:"";position:absolute;left:9%;right:9%;bottom:-2px;height:3px;z-index:3;
  border-radius:999px;background:var(--grad);opacity:0;filter:blur(3px);transform:scaleX(.25);
  transition:opacity .55s ease,transform .65s var(--ease)}
.cbtn:hover,.cbtn:focus-visible{transform:translateY(-5px);border-color:rgba(232,182,98,.95);
  box-shadow:0 24px 62px rgba(6,3,12,.6),0 0 84px rgba(232,182,98,.26)}
.cbtn:hover .stone,.cbtn:focus-visible .stone{transform:scale(1);filter:brightness(1.08) saturate(1.06)}
.cbtn:hover .dim,.cbtn:focus-visible .dim{background:rgba(22,11,32,.2)}
.cbtn:hover::after,.cbtn:focus-visible::after{opacity:1;transform:scaleX(1)}
.cbtn:hover .sweep{left:120%}
.cbtn.sm{padding:.9em 1.9em}
.cbtn.sm .txt{font-size:.98rem;letter-spacing:.08em}
.btn{display:inline-flex;align-items:center;justify-content:center;
  font-family:'Cinzel',serif;font-weight:600;font-size:.76rem;letter-spacing:.2em;
  text-transform:uppercase;padding:1.1em 2.5em;border-radius:999px;
  border:1px solid var(--gold);color:var(--gold-hi);background:transparent;cursor:pointer;
  position:relative;overflow:hidden;transition:color .45s ease,transform .45s var(--ease),
  box-shadow .45s ease,border-color .45s ease}
.btn span{position:relative;z-index:2}
.btn::before{content:"";position:absolute;inset:0;background:var(--grad);border-radius:999px;
  transform:scale(.2);opacity:0;z-index:1;transition:transform .55s var(--ease),opacity .4s ease}
.btn:hover{color:#3a2108;transform:translateY(-3px);border-color:transparent;
  box-shadow:0 18px 46px rgba(232,182,98,.34)}
.btn:hover::before{transform:scale(1);opacity:1}
.btn.solid{color:#3a2108;border-color:transparent}
.btn.solid::before{transform:scale(1);opacity:1}
.btn.sm{padding:.82em 1.7em;font-size:.66rem;letter-spacing:.14em}

.card{position:relative;border-radius:var(--r);overflow:hidden;
  background:linear-gradient(168deg,rgba(88,52,128,.44),rgba(30,18,44,.7));
  border:1px solid rgba(232,182,98,.2);box-shadow:0 16px 48px rgba(6,3,12,.36);
  transition:transform .65s var(--ease),border-color .65s ease,box-shadow .65s ease}
.card::after{content:"";position:absolute;top:0;left:-70%;width:55%;height:100%;z-index:4;
  pointer-events:none;transform:skewX(-18deg);
  background:linear-gradient(90deg,transparent,rgba(255,244,214,.16),transparent);
  transition:left 1s var(--ease)}
.card:hover{transform:translateY(-12px);border-color:rgba(232,182,98,.6);
  box-shadow:0 42px 96px rgba(6,3,12,.62),0 0 70px rgba(232,182,98,.14)}
.card:hover::after{left:120%}

#prog{position:fixed;top:0;left:0;height:2px;width:0;z-index:90;background:var(--grad)}
header{position:fixed;inset:0 0 auto 0;z-index:88;padding:1.2rem 0;
  transition:background .55s ease,padding .55s ease,box-shadow .55s ease}
header.stuck{background:rgba(21,12,30,.9);backdrop-filter:blur(20px);padding:.6rem 0;
  box-shadow:0 1px 0 var(--line),0 22px 48px rgba(0,0,0,.38)}
header .wrap{display:flex;align-items:center;justify-content:space-between;gap:1.2rem}
.brand{display:flex;align-items:baseline;gap:.5em;line-height:1;flex:0 0 auto}
.brand .mk{font-family:'Pinyon Script',cursive;font-size:clamp(1.6rem,2.3vw,2.3rem)}
.brand .sub{font-family:'Cinzel',serif;font-size:.54rem;letter-spacing:.34em;
  text-transform:uppercase;color:var(--muted)}
@media(max-width:640px){.brand .sub{display:none}}
nav{display:none}
@media(min-width:1060px){
  nav{display:flex;align-items:center;gap:clamp(1.1rem,2vw,2.2rem)}
  nav a{font-family:'Cinzel',serif;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;
    color:rgba(251,246,237,.84);position:relative;padding:.4em 0;transition:color .35s ease}
  nav a::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:0;
    background:var(--grad);transition:width .5s var(--ease)}
  nav a:hover,nav a[aria-current="page"]{color:var(--gold-hi)}
  nav a:hover::after,nav a[aria-current="page"]::after{width:100%}
}
.burger{display:grid;gap:5px;background:none;border:0;cursor:pointer;padding:.5em;flex:0 0 auto}
.burger b{display:block;width:28px;height:1.5px;background:var(--gold);border-radius:2px;
  transition:transform .45s var(--ease),opacity .3s ease}
.burger.on b:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.burger.on b:nth-child(2){opacity:0}
.burger.on b:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
.head-cta{display:none}
@media(min-width:1060px){.burger{display:none}.head-cta{display:inline-flex}}
#drawer{position:fixed;inset:0;z-index:85;background:rgba(21,12,30,.97);backdrop-filter:blur(22px);
  display:grid;place-content:center;gap:.3rem;text-align:center;
  opacity:0;visibility:hidden;transition:opacity .5s ease,visibility 0s .5s}
#drawer.on{opacity:1;visibility:visible;transition:opacity .5s ease}
#drawer a{font-family:var(--serif);font-size:clamp(1.7rem,5.5vw,2.6rem);color:var(--cream);
  padding:.3em 0;transition:color .3s ease}
#drawer a:hover{color:var(--gold)}
#drawer .cbtn{margin-top:1.6rem;justify-self:center}

#petals{position:absolute;inset:0;pointer-events:none;z-index:2;overflow:hidden}
#petals img{position:absolute;will-change:transform;filter:drop-shadow(0 4px 12px rgba(0,0,0,.4))}

.g3{display:grid;gap:clamp(24px,2.6vw,38px);grid-template-columns:1fr}
@media(min-width:880px){.g3{grid-template-columns:repeat(3,1fr)}}
.g2{display:grid;gap:clamp(34px,4vw,72px);grid-template-columns:1fr;align-items:center}
@media(min-width:920px){.g2{grid-template-columns:1fr 1fr}}
.step{padding:2.8rem 2.1rem}
.step .n{font-family:'Pinyon Script',cursive;font-size:4rem;line-height:1;display:block;
  margin-bottom:.06em}
.step h3{margin-bottom:.5em}
.step p{color:rgba(251,246,237,.8);font-size:1.02rem}
.portrait{border-radius:var(--r);overflow:hidden;position:relative;aspect-ratio:4/5;
  border:1px solid rgba(232,182,98,.24);box-shadow:0 34px 90px rgba(6,3,12,.55)}
.portrait img{width:100%;height:100%;object-fit:cover;filter:var(--lift);
  transition:transform 2.4s var(--ease)}
.portrait:hover img{transform:scale(1.07)}
.quote{font-family:'Pinyon Script',cursive;font-size:clamp(2rem,4vw,3.2rem);
  line-height:1.3;margin:1.1em 0 .2em}
.rosebox{display:grid;place-items:center;padding:1.6rem 0}
.rosebox img{width:min(300px,58vw);filter:drop-shadow(0 26px 66px rgba(0,0,0,.7));
  transition:transform 1.5s var(--ease),filter 1.5s ease}
.rosebox:hover img{transform:scale(1.07) rotate(-4deg);
  filter:drop-shadow(0 32px 80px rgba(0,0,0,.76)) brightness(1.12)}

.pack{display:flex;flex-direction:column;padding:3rem 2rem 2.3rem;text-align:center}
.pack.hot{background:linear-gradient(168deg,rgba(108,64,158,.56),rgba(32,19,48,.78));
  border-color:rgba(232,182,98,.52)}
.pack .tag{position:absolute;top:1.3rem;right:1.3rem;z-index:5;
  font-family:'Cinzel',serif;font-size:.56rem;letter-spacing:.18em;text-transform:uppercase;
  padding:.55em 1.2em;background:var(--grad);color:#3a2108;border-radius:999px;white-space:nowrap}
.medal{position:relative;width:clamp(128px,12.5vw,172px);aspect-ratio:1;margin:0 auto 1.2rem;
  display:grid;place-items:center}
.medal .ring{position:absolute;inset:0;border-radius:50%;border:1px solid rgba(232,182,98,.55);
  background:radial-gradient(circle,rgba(232,182,98,.17),transparent 68%)}
.medal .ring::before{content:"";position:absolute;inset:9%;border-radius:50%;
  border:1px solid rgba(232,182,98,.28)}
.medal .obj{position:relative;z-index:2;width:58%;
  filter:drop-shadow(0 12px 30px rgba(0,0,0,.62));transition:transform .95s var(--ease)}
.medal .glint{position:absolute;inset:0;z-index:3;border-radius:50%;overflow:hidden;opacity:0;
  transition:opacity .4s ease}
.medal .glint b{position:absolute;top:-30%;left:-60%;width:40%;height:160%;display:block;
  transform:skewX(-20deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.52),transparent)}
.pack:hover .glint{opacity:1}
.pack:hover .glint b{animation:glint 1.15s ease-out}
@keyframes glint{to{left:130%}}
.pack:hover .medal .obj{transform:translateY(-7px) scale(1.08)}
.pack:hover .m-key .obj{transform:translateY(-5px) rotate(22deg) scale(1.06)}
.pack:hover .m-com .obj{transform:rotate(-14deg) scale(1.07)}
.pack:hover .m-mir .obj{transform:translateY(-7px) scale(1.09)}
.pack:hover .m-rose .obj{transform:translateY(-6px) rotate(-8deg) scale(1.07)}
.pack .pp{font-family:'Cinzel',serif;font-weight:600;font-size:2.3rem;margin:.6rem 0 .05rem}
.pack .pp s{font-size:.38em;letter-spacing:.1em;vertical-align:.42em;margin-left:.2em;
  text-decoration:none}
.pack .pe{font-size:.85rem;color:var(--muted);margin-bottom:1.5rem}
.pack ul{list-style:none;margin-bottom:2rem;flex:1;text-align:left}
.pack li{padding:.5em 0 .5em 1.7em;position:relative;font-size:1rem;color:rgba(251,246,237,.86)}
.pack li::before{content:"✦";position:absolute;left:0;top:.55em;color:var(--gold);font-size:.7em}
.pack .cbtn{width:100%}

.fanwrap{height:230vh;position:relative}
.fanpin{position:sticky;top:0;height:100svh;display:grid;place-items:center}
.fan{position:relative;width:min(600px,86vw);aspect-ratio:1.35}
.fan img{position:absolute;left:50%;top:50%;width:30%;border-radius:12px;
  box-shadow:0 30px 70px rgba(6,3,12,.72);transform-origin:50% 118%;
  transform:translate(-50%,-50%);will-change:transform}

.shots{display:grid;gap:clamp(16px,1.8vw,26px);grid-template-columns:repeat(3,1fr)}
.shot{position:relative;aspect-ratio:1;overflow:hidden;border-radius:var(--r-sm);
  border:1px solid rgba(232,182,98,.22);
  transition:transform .65s var(--ease),box-shadow .65s ease,border-color .65s ease}
.shot img{width:100%;height:100%;object-fit:cover;filter:var(--lift);
  transition:transform 2.2s var(--ease)}
.shot:hover{transform:translateY(-10px);border-color:rgba(232,182,98,.6);
  box-shadow:0 30px 70px rgba(6,3,12,.58)}
.shot:hover img{transform:scale(1.1)}
.shot::after{content:"";position:absolute;inset:0;
  background:radial-gradient(circle at 50% 45%,transparent 48%,rgba(18,9,28,.58) 96%)}

.vbox{position:relative;border-radius:var(--r-sm);overflow:hidden;background:#0d0714;
  aspect-ratio:16/9;cursor:pointer}
.vbox img,.vbox video,.vbox iframe{position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;border:0}
.vbox img{transition:transform 2s var(--ease),filter .65s ease}
.vbox:hover img{transform:scale(1.07);filter:brightness(1.12)}
.vbox .sh{position:absolute;inset:0;z-index:2;
  background:linear-gradient(180deg,rgba(12,6,18,.08),rgba(12,6,18,.58))}
.vbox .play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:3;
  width:clamp(66px,5.8vw,90px);aspect-ratio:1;border-radius:50%;display:grid;place-items:center;
  border:1px solid var(--gold);background:rgba(32,18,44,.5);backdrop-filter:blur(6px);
  color:var(--gold-hi);font-size:1.1rem;padding-left:.2em;cursor:pointer;
  transition:transform .55s cubic-bezier(.2,.9,.3,1.25),background .5s ease,box-shadow .5s ease}
.vbox:hover .play{transform:translate(-50%,-50%) scale(1.14);
  background:var(--gold);color:#3a2108;box-shadow:0 0 80px rgba(232,182,98,.55)}
.vbox .play::after{content:"";position:absolute;inset:-16px;border-radius:50%;
  border:1px solid rgba(232,182,98,.45);animation:ripple 3.2s ease-out infinite}
@keyframes ripple{0%{transform:scale(.9);opacity:.85}100%{transform:scale(1.55);opacity:0}}
.vbox .cap{position:absolute;left:0;right:0;bottom:0;z-index:3;padding:1.3rem 1.5rem;
  font-family:'Cinzel',serif;font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--gold-hi)}
.vwrap{padding:clamp(13px,1.3vw,20px)}

.form{display:grid;gap:1.4rem 1.6rem;grid-template-columns:1fr}
@media(min-width:740px){.form{grid-template-columns:1fr 1fr}.s2{grid-column:1/-1}}
.form label{display:block;font-family:'Cinzel',serif;font-size:.64rem;letter-spacing:.2em;
  text-transform:uppercase;color:var(--gold);margin-bottom:.65em}
.form label em{color:var(--rose);font-style:normal}
.form input,.form textarea{width:100%;font-family:var(--serif);font-size:1.08rem;
  color:var(--cream);background:rgba(14,7,22,.5);border:1px solid var(--line);
  border-radius:var(--r-sm);padding:.95em 1.15em;
  transition:border-color .4s ease,background .4s ease,box-shadow .4s ease}
.form input:focus,.form textarea:focus{border-color:var(--gold);outline:none;
  background:rgba(64,36,96,.4);box-shadow:0 0 0 4px rgba(232,182,98,.13)}
.form input::placeholder,.form textarea::placeholder{color:rgba(251,246,237,.3)}
.form textarea{resize:vertical;min-height:5.6em}
.hint{font-size:.85rem;color:var(--muted);margin-top:.6em;line-height:1.55}
.signout{min-height:1.8em;font-family:'Cinzel',serif;font-size:.8rem;letter-spacing:.14em;
  color:var(--gold-hi);opacity:0;transform:translateY(6px);transition:all .6s ease;margin-top:.5em}
.signout.on{opacity:1;transform:none}
.opts{display:flex;flex-wrap:wrap;gap:.7rem}
.opt{font-family:'Cinzel',serif;font-size:.72rem;letter-spacing:.09em;padding:.95em 1.4em;
  border:1px solid var(--line);background:rgba(14,7,22,.42);color:var(--cream);
  border-radius:999px;cursor:pointer;transition:all .4s ease;line-height:1.28;text-align:left}
.opt b{display:block;font-weight:600;margin-bottom:.22em}
.opt i{font-style:normal;opacity:.62;font-family:var(--serif);font-size:1.08em}
.opt:hover{border-color:rgba(232,182,98,.65);transform:translateY(-2px)}
.opt[aria-pressed="true"]{background:var(--grad);color:#3a2108;border-color:transparent;
  box-shadow:0 14px 34px rgba(232,182,98,.28)}
.opt[aria-pressed="true"] i{opacity:.74;color:#5a3410}
.check{display:flex;gap:.9em;align-items:flex-start;font-size:.98rem;color:rgba(251,246,237,.86);
  padding:1.15em 1.3em;border:1px solid var(--line);border-radius:var(--r-sm);
  background:rgba(14,7,22,.4);cursor:pointer;transition:border-color .4s ease,background .4s ease}
.check:hover{border-color:rgba(232,182,98,.55);background:rgba(64,36,96,.3)}
.check input{width:auto;flex:0 0 auto;margin-top:.42em;accent-color:var(--gold);transform:scale(1.18)}
.check.key{border-color:rgba(232,182,98,.5);background:rgba(64,36,96,.36)}
.total{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:.6em;
  padding:1.3em 1.5em;border:1px solid var(--line);border-radius:var(--r-sm);
  background:rgba(64,36,96,.36)}
.total .lbl{font-family:'Cinzel',serif;font-size:.68rem;letter-spacing:.2em;
  text-transform:uppercase;color:var(--gold)}
.total .v{font-family:'Cinzel',serif;font-weight:600;font-size:2.1rem}
.err{color:var(--rose);font-size:.9rem;min-height:1.4em;font-family:'Cinzel',serif;letter-spacing:.05em}
.fa{display:flex;flex-wrap:wrap;gap:1.1rem;align-items:center}
.queue{display:flex;flex-wrap:wrap;gap:.9em 2.2em;padding:1.2em 1.5em;border-radius:var(--r-sm);
  border:1px dashed var(--line);background:rgba(14,7,22,.36);margin-bottom:1.8rem;
  font-family:'Cinzel',serif;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gold-hi)}
.queue b{color:var(--gold);font-weight:600}
#done{display:none;text-align:center;padding:clamp(2.4rem,4.4vw,3.8rem) clamp(1.5rem,3vw,3rem)}
#done.on{display:block}
#done .oid{font-family:'Cinzel',serif;font-size:clamp(1.1rem,2vw,1.6rem);letter-spacing:.16em;
  padding:.75em 1.5em;border:1px dashed var(--line);border-radius:999px;display:inline-block;
  margin:.4em 0 1.5em;background:rgba(14,7,22,.4)}
#done .sum{max-width:32em;margin:0 auto 2.2rem;color:rgba(251,246,237,.88)}
#done .stepz{display:grid;gap:1.1rem;max-width:36em;margin:0 auto;text-align:left}
#done .stepz .row{display:flex;gap:1.2em;align-items:center;padding:1.25em 1.4em;
  border:1px solid var(--line);border-radius:var(--r-sm);background:rgba(14,7,22,.4);
  transition:border-color .4s ease,background .4s ease}
#done .stepz .row:hover{border-color:rgba(232,182,98,.55);background:rgba(64,36,96,.32)}
#done .stepz .k{flex:0 0 auto;width:2.2em;height:2.2em;border-radius:50%;display:grid;
  place-items:center;background:var(--grad);color:#3a2108;font-family:'Cinzel',serif;
  font-weight:600;font-size:.82rem}
#done .stepz .t{flex:1;font-size:1rem;line-height:1.45}
#done .stepz .t b{display:block;font-family:'Cinzel',serif;font-size:.72rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--gold);margin-bottom:.32em}
#done .back{margin-top:2rem;font-size:.9rem;color:var(--muted);cursor:pointer;
  text-decoration:underline;background:none;border:0;font-family:inherit}

.acc{max-width:48em;margin-inline:auto}
details{border-bottom:1px solid var(--line)}
summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:1.5em;
  padding:1.4em 0;font-size:1.2rem;transition:color .35s ease}
summary:hover{color:var(--gold-hi)}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";color:var(--gold);font-family:'Cinzel',serif;flex:0 0 auto;
  transition:transform .4s var(--ease)}
details[open] summary::after{transform:rotate(135deg)}
details .body{padding:0 0 1.5em;color:rgba(251,246,237,.82);font-size:1.05rem}
details .body ul{margin:.5em 0 0 1.3em}
details .body li{margin:.35em 0}

#gate{position:fixed;inset:0;z-index:200;display:none;
  background:rgba(12,6,20,.84);backdrop-filter:blur(16px);
  align-items:center;justify-content:center;padding:5vh 5vw;overflow-y:auto}
#gate.on{display:flex}
#gate .box{width:min(680px,100%);border-radius:var(--r);padding:clamp(2rem,4vw,3.2rem);
  background:linear-gradient(170deg,rgba(88,52,132,.92),rgba(28,16,40,.97));
  border:1px solid rgba(232,182,98,.42);box-shadow:0 44px 120px rgba(0,0,0,.68);
  text-align:center;animation:gateIn .9s var(--ease) both}
@keyframes gateIn{from{opacity:0;transform:translateY(28px) scale(.95);filter:blur(10px)}
  to{opacity:1;transform:none;filter:blur(0)}}
#gate .seal{width:clamp(78px,9vw,110px);margin:0 auto 1rem;
  filter:drop-shadow(0 14px 34px rgba(0,0,0,.58));animation:sealTurn 24s linear infinite}
@keyframes sealTurn{to{transform:rotate(360deg)}}
#gate h2{font-size:clamp(1.9rem,4vw,2.9rem);margin-bottom:.2em}
#gate .lede{font-size:1.05rem;margin:0 auto 1.5rem;max-width:34em}
#gate .terms{text-align:left;max-height:30vh;overflow-y:auto;padding:1.2em 1.4em;
  border:1px solid var(--line);border-radius:var(--r-sm);background:rgba(12,6,20,.5);
  font-size:.96rem;color:rgba(251,246,237,.86);margin-bottom:1.4rem;line-height:1.6}
#gate .terms b{color:var(--gold-hi)}
#gate .terms li{margin:.55em 0 .55em 1.1em}
#gate .row{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center}
#gate .decline{background:none;border:0;color:var(--muted);font-family:'Cinzel',serif;
  font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;cursor:pointer;
  padding:1.1em 1.6em;text-decoration:underline;transition:color .3s ease}
#gate .decline:hover{color:var(--rose)}
#gate .fine{margin-top:1.3rem;font-size:.8rem;color:var(--muted)}
body.locked{overflow:hidden}
body:not(.accepted) .needs-terms{display:none !important}
.terms-note{display:none;padding:1.6em 1.8em;border-radius:var(--r-sm);
  border:1px dashed var(--line);background:rgba(18,9,28,.5);text-align:center;
  max-width:36em;margin:0 auto}
body:not(.accepted) .terms-note{display:block}

footer{border-top:1px solid var(--line);padding:clamp(60px,7vw,96px) 0 2.6rem;
  background:rgba(30,18,48,.72);position:relative;z-index:3}
.fg{display:grid;gap:2.6rem;grid-template-columns:1fr;margin-bottom:3rem}
@media(min-width:780px){.fg{grid-template-columns:1.4fr 1fr 1fr}}
.fg h4{font-family:'Cinzel',serif;font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--gold);margin-bottom:1.1em}
.fg ul{list-style:none}
.fg li{margin:.55em 0}
.fg a{color:rgba(251,246,237,.78);transition:color .3s ease,padding-left .3s ease}
.fg a:hover{color:var(--gold-hi);padding-left:.35em}
.fbot{text-align:center;padding-top:2.2rem;border-top:1px solid rgba(232,182,98,.16)}
.fbot p{font-size:.82rem;color:var(--muted);margin:.45em 0}

.rv{opacity:0;transform:translateY(38px);
  transition:opacity 1.1s var(--ease),transform 1.1s var(--ease)}
.rv.in{opacity:1;transform:none}
.rv.blur{filter:blur(12px)}
.rv.blur.in{filter:blur(0);
  transition:opacity 1.25s ease,transform 1.25s var(--ease),filter 1.25s ease}
.wipe{display:inline-block;overflow:hidden;vertical-align:bottom}
.wipe > span{display:inline-block;transform:translateY(108%);transition:transform 1.2s var(--ease)}
.rv.in .wipe > span{transform:translateY(0)}
.draw{height:1px;width:0;background:var(--grad);margin:1.3em 0;transition:width 1.8s var(--ease)}
.rv.in .draw{width:100%}
#toast{position:fixed;left:50%;bottom:2rem;transform:translate(-50%,150%);z-index:99;
  background:rgba(64,36,96,.97);border:1px solid var(--gold);border-radius:999px;
  padding:1em 2em;font-family:'Cinzel',serif;font-size:.7rem;letter-spacing:.15em;
  text-transform:uppercase;color:var(--gold-hi);max-width:90vw;text-align:center;
  transition:transform .6s cubic-bezier(.2,.9,.3,1.1);box-shadow:0 30px 70px rgba(6,3,12,.6)}
#toast.on{transform:translate(-50%,0)}

@media(max-width:560px){
  .cbtn{padding:1.1em 1.7em;max-width:100%}
  .cbtn .txt{white-space:normal;text-align:center;font-size:1rem;letter-spacing:.06em}
  .cta-row{width:100%}
  .cta-row .cbtn{width:100%}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important}
  html{scroll-behavior:auto}
  .rv{opacity:1;transform:none;filter:none}
  .showcase{height:auto}
  .showcase .stick{position:static;height:auto}
  .showcase .frame{--w:100%;--h:60svh}
  .showcase .cap > div{opacity:1}
}

/* ══ SHIRITI I SCROLL-IT — vija e artë, jo shiriti gri i sistemit ══ */
html{scrollbar-width:thin;scrollbar-color:rgba(232,182,98,.55) transparent}
::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-track{background:rgba(21,12,30,.6)}
::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#e8b662,#a9762e);
  border-radius:999px;border:2px solid rgba(21,12,30,.9)}
::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#fdf2d8,#c9963f)}
::-webkit-scrollbar-corner{background:transparent}

/* ══ GJUHA ══ */
.langbtn{display:inline-flex;align-items:center;gap:.45em;background:none;cursor:pointer;
  border:1px solid var(--line);border-radius:999px;padding:.5em 1em;flex:0 0 auto;
  font-family:'Cinzel',serif;font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--muted);transition:border-color .35s ease,color .35s ease}
.langbtn:hover{border-color:rgba(232,182,98,.7);color:var(--gold-hi)}
.langbtn b{color:var(--gold);font-weight:600}
[data-en]{transition:opacity .25s ease}

/* ══ UDHËZUESIT ME VIDEO ══ */
.guide{display:grid;gap:clamp(26px,3vw,44px);grid-template-columns:1fr}
@media(min-width:900px){.guide{grid-template-columns:1fr 1fr}}
.guide .card{padding:clamp(16px,1.4vw,22px);display:flex;flex-direction:column}
.guide .gtxt{padding:1.5rem .6rem .4rem}
.guide .gtxt .num{font-family:'Pinyon Script',cursive;font-size:2.6rem;line-height:1;
  display:block;margin-bottom:.1em}
.guide .gtxt h3{margin-bottom:.4em}
.guide .gtxt p{font-size:1rem;color:rgba(251,246,237,.82)}

/* ══ RRJEDHA E APLIKIMIT ══ */
.flow{counter-reset:fl;display:grid;gap:0;max-width:52em;margin-inline:auto}
.flow .fl{position:relative;padding:1.9rem 0 1.9rem 4.6rem;
  border-left:1px solid var(--line);margin-left:1.4rem}
.flow .fl:last-child{border-left-color:transparent}
.flow .fl::before{counter-increment:fl;content:counter(fl);
  position:absolute;left:-1.45rem;top:1.7rem;width:2.9rem;height:2.9rem;border-radius:50%;
  display:grid;place-items:center;background:var(--grad);color:#3a2108;
  font-family:'Cinzel',serif;font-weight:600;font-size:.95rem;
  box-shadow:0 8px 24px rgba(232,182,98,.28)}
.flow .fl h3{margin-bottom:.35em}
.flow .fl p{font-size:1.02rem;color:rgba(251,246,237,.84)}
.flow .fl .tagline{display:inline-block;margin-top:.7em;font-family:'Cinzel',serif;
  font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);
  padding:.45em 1em;border:1px solid var(--line);border-radius:999px}

/* ══ FORMA — hapa ══ */
.fstep{display:none}
.fstep.on{display:grid;gap:1.4rem 1.6rem;grid-template-columns:1fr;
  animation:stepIn .7s var(--ease) both}
@media(min-width:740px){.fstep.on{grid-template-columns:1fr 1fr}}
@keyframes stepIn{from{opacity:0;transform:translateY(22px);filter:blur(6px)}
  to{opacity:1;transform:none;filter:blur(0)}}
.fbar{display:flex;gap:.5rem;margin-bottom:2.2rem;align-items:center;justify-content:center}
.fbar span{width:2.6rem;height:2px;border-radius:999px;background:rgba(232,182,98,.22);
  transition:background .5s ease,width .5s var(--ease)}
.fbar span.on{background:var(--grad);width:4.2rem}
.fnav{display:flex;flex-wrap:wrap;gap:1rem;align-items:center;justify-content:space-between;
  grid-column:1/-1;margin-top:.6rem}

/* ══ NDËRTUESI I POROSISË ══ */
.builder{display:grid;gap:clamp(30px,3.6vw,56px);grid-template-columns:1fr;align-items:start}
@media(min-width:980px){.builder{grid-template-columns:1fr .78fr}}
.bfield{margin-bottom:2.2rem}
.bfield .flabel{display:block;font-family:'Cinzel',serif;font-size:.68rem;letter-spacing:.24em;
  text-transform:uppercase;color:var(--gold);margin-bottom:.9em}
.bfield .why{font-size:.92rem;color:var(--muted);margin-top:.8em;line-height:1.6}
.recap{position:sticky;top:96px;padding:2rem 1.8rem;border-radius:var(--r);
  border:1px solid var(--line);background:rgba(18,9,28,.5);backdrop-filter:blur(8px);
  box-shadow:0 26px 70px rgba(6,3,12,.45)}
.recap ul{list-style:none;margin:1.4rem 0}
.recap li{display:flex;justify-content:space-between;gap:1.2em;padding:.62em 0;
  border-bottom:1px dashed rgba(232,182,98,.16);font-size:.98rem;color:rgba(251,246,237,.86)}
.recap li:last-child{border-bottom:0}
.recap li b{font-family:'Cinzel',serif;font-weight:500;font-size:.84em;color:var(--gold-hi);
  white-space:nowrap}
.recap .big{font-family:'Cinzel',serif;font-weight:600;font-size:clamp(2.4rem,5vw,3.2rem);
  line-height:1;margin-top:.4rem}
.recap .eur{font-family:'Cinzel',serif;font-size:.84rem;letter-spacing:.16em;
  color:var(--muted);margin-top:.6em}

/* ══ PETALET MBI ÇDO IMAZH ══ */
.showcase .frame .petals{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden}
.showcase .frame .petals img{position:absolute;will-change:transform;
  filter:drop-shadow(0 4px 12px rgba(0,0,0,.45))}

/* ══ RRJEDHA ME IMAZHE (jo kuti) ══ */
.imgflow{display:grid;gap:clamp(80px,10vw,170px)}
.iflow{position:relative;display:grid;gap:clamp(24px,3vw,54px);align-items:center;
  grid-template-columns:1fr}
@media(min-width:900px){
  .iflow{grid-template-columns:1.15fr .85fr}
  .iflow:nth-child(even) .ipic{order:2}
}
.ipic{position:relative;border-radius:var(--r);overflow:hidden;aspect-ratio:5/4;
  box-shadow:0 40px 100px rgba(6,3,12,.6)}
.ipic .img{position:absolute;inset:-8%;background-size:cover;background-position:center;
  filter:var(--lift) blur(0px);will-change:transform,filter}
.ipic .tint{position:absolute;inset:0;
  background:linear-gradient(140deg,rgba(96,54,148,.42),rgba(18,9,28,.5));
  mix-blend-mode:multiply}
.ipic .glow{position:absolute;inset:0;mix-blend-mode:screen;pointer-events:none;
  background:radial-gradient(ellipse 60% 55% at 30% 28%,rgba(255,206,140,.2),transparent 62%)}
.itxt .n{font-family:'Pinyon Script',cursive;font-size:clamp(3.4rem,7vw,5.4rem);
  line-height:.9;display:block;margin-bottom:.06em}
.itxt h3{font-size:clamp(1.8rem,3.2vw,2.8rem);margin-bottom:.4em}
.itxt p{font-size:clamp(1.05rem,.6vw + .9rem,1.28rem);color:rgba(251,246,237,.86)}
.itxt .tagline{display:inline-block;margin-top:1.1em;font-family:'Cinzel',serif;
  font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);
  padding:.55em 1.3em;border:1px solid var(--line);border-radius:999px}
.showcase .frame,.ipic{container-type:size}


/* ══════════════════════════════════════════════════════════════
   PËRMIRËSIME — animacione të lidhura me scroll-in NATIVISHT
   Kur shfletuesi i mbështet, lëvizja kalon te fija e kompozitorit
   dhe bëhet aq e butë sa vetë scroll-i. Përndryshe punon JS-i.
   ══════════════════════════════════════════════════════════════ */
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {

    /* kartat hyjnë duke u ngritur dhe rrotulluar lehtë */
    .rv{animation:riseIn linear both;animation-timeline:view();
      animation-range:entry 4% cover 32%}
    @keyframes riseIn{
      from{opacity:0;transform:translateY(46px) scale(.965)}
      to{opacity:1;transform:none}}

    /* imazhet e rrjedhës: zoom i kundërt + zbutje e blur-it */
    .ipic .img{animation:openImg linear both;animation-timeline:view();
      animation-range:entry 0% exit 100%}
    @keyframes openImg{
      from{transform:scale(1.22) translateY(-3%);filter:brightness(.86) saturate(.9) blur(5px)}
      45%,55%{transform:scale(1.04) translateY(0);filter:brightness(1.16) saturate(1.05) blur(0)}
      to{transform:scale(1.18) translateY(3%);filter:brightness(.9) saturate(.95) blur(4px)}}

    /* vija e artë vizatohet sipas scroll-it, jo sipas kohës */
    .draw{animation:drawLine linear both;animation-timeline:view();
      animation-range:entry 12% cover 40%}
    @keyframes drawLine{from{width:0}to{width:100%}}

    /* titujt e mëdhenj: shkronjat mblidhen nga hapësira */
    .itxt h3{animation:letterIn linear both;animation-timeline:view();
      animation-range:entry 6% cover 34%}
    @keyframes letterIn{
      from{opacity:0;letter-spacing:.24em;filter:blur(7px)}
      to{opacity:1;letter-spacing:normal;filter:blur(0)}}
  }
}



/* ══════════════════════════════════════════════════════════════
   1 · KALIMI MES FAQEVE — View Transitions API
   Dy rreshta që heqin pulsimin e bardhë kur klikon një link.
   Shfletuesat e vjetër thjesht kalojnë pa animacion.
   ══════════════════════════════════════════════════════════════ */
@view-transition{navigation:auto}
@media (prefers-reduced-motion: no-preference){
  ::view-transition-old(root){animation:vtOut .5s cubic-bezier(.4,0,1,1) both}
  ::view-transition-new(root){animation:vtIn .62s cubic-bezier(0,0,.2,1) both}
  @keyframes vtOut{to{opacity:0;transform:scale(1.04);filter:blur(8px)}}
  @keyframes vtIn{from{opacity:0;transform:scale(.97);filter:blur(10px)}}

  /* elementët e përbashkët morfojnë në vend që të pulsojnë */
  .brand .mk{view-transition-name:wordmark}
  header{view-transition-name:hdr}
  ::view-transition-group(wordmark),
  ::view-transition-group(hdr){animation-duration:.62s;
    animation-timing-function:cubic-bezier(.2,.8,.28,1)}
}

/* ══════════════════════════════════════════════════════════════
   2 · STATUJA E NGULITUR — qëndron, teksti kalon mbi hijen e saj
   ══════════════════════════════════════════════════════════════ */
.altar{position:relative;height:340vh;clip-path:inset(0)}
.altar .fix{position:fixed;inset:0;z-index:0;overflow:hidden;display:grid;place-items:center}
.altar .fix .sea{position:absolute;inset:0;background-size:cover;background-position:center;
  filter:brightness(1.1) saturate(1.04)}
.altar .fix .haze{position:absolute;inset:0;
  background:radial-gradient(ellipse 62% 58% at 50% 52%,rgba(20,10,30,.1),rgba(20,10,30,.72) 88%)}
.altar .fix .st{position:relative;z-index:2;height:min(78vh,720px);width:auto;
  filter:drop-shadow(0 40px 90px rgba(0,0,0,.72));
  transform:translateY(var(--sy,0px)) scale(var(--ss,1));will-change:transform}
.altar .fix .halo{position:absolute;z-index:1;width:min(60vh,560px);aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(255,226,178,.3),transparent 66%);filter:blur(24px);
  opacity:var(--ho,.4)}
.altar .fix .petals{position:absolute;inset:0;z-index:3;pointer-events:none;overflow:hidden}
.altar .fix .petals img{position:absolute;will-change:transform}
.altar::before,.altar::after{content:"";position:absolute;left:0;right:0;height:20vh;z-index:4;
  pointer-events:none}
.altar::before{top:0;background:linear-gradient(180deg,var(--ink),transparent)}
.altar::after{bottom:0;background:linear-gradient(0deg,var(--ink),transparent)}
.altar .words{position:relative;z-index:5;display:grid;gap:min(60vh,540px);padding:34vh 0}
.altar .words .w{width:min(30em,86vw);padding:clamp(1.8rem,3vw,2.8rem);border-radius:var(--r);
  background:rgba(18,9,28,.44);backdrop-filter:blur(7px) saturate(1.2);
  border:1px solid rgba(232,182,98,.2);box-shadow:0 30px 80px rgba(6,3,12,.5)}
.altar .words .w:nth-child(odd){margin-right:auto;margin-left:2vw}
.altar .words .w:nth-child(even){margin-left:auto;margin-right:2vw}
@media(max-width:820px){
  .altar{height:300vh}
  .altar .fix .st{height:52vh}
  .altar .words .w{margin-inline:auto!important;width:88vw}
}

/* ══════════════════════════════════════════════════════════════
   3 · VIDEO E TEMPULLIT
   ══════════════════════════════════════════════════════════════ */
.hero .bgw video.bgvid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}

/* ══════════════════════════════════════════════════════════════
   4 · TITULLI NGA MASKA — shkronjat zbulohen nga poshtë lart
   ══════════════════════════════════════════════════════════════ */
@supports (animation-timeline: view()) and (mask-image: linear-gradient(#000,#000)) {
  @media (prefers-reduced-motion: no-preference){
    .maskin{
      -webkit-mask-image:linear-gradient(180deg,#000 0 var(--m,0%),transparent var(--m,0%) 100%);
      mask-image:linear-gradient(180deg,#000 0 var(--m,0%),transparent var(--m,0%) 100%);
      animation:maskUp linear both;animation-timeline:view();
      animation-range:entry 8% cover 34%}
    @keyframes maskUp{from{--m:0%}to{--m:130%}}
  }
}
@property --m{syntax:"<percentage>";inherits:false;initial-value:0%}

/* ══════════════════════════════════════════════════════════════
   5 · KURSORI — rreth ari që ndjek miun mbi elementët e ndjeshëm
   ══════════════════════════════════════════════════════════════ */
#cursor{position:fixed;top:0;left:0;width:34px;height:34px;border-radius:50%;z-index:95;
  pointer-events:none;border:1px solid rgba(232,182,98,.7);mix-blend-mode:screen;
  transform:translate3d(-100px,-100px,0);opacity:0;
  transition:opacity .4s ease,width .45s var(--ease),height .45s var(--ease),
             border-color .45s ease,background .45s ease}
#cursor.on{opacity:1}
#cursor.big{width:76px;height:76px;border-color:rgba(232,182,98,.95);
  background:radial-gradient(circle,rgba(232,182,98,.14),transparent 68%)}
@media(hover:none){#cursor{display:none}}

/* ══════════════════════════════════════════════════════════════
   HAPAT — imazh në ekran të plotë, teksti shkruhet në qendrën bosh
   ══════════════════════════════════════════════════════════════ */
.hap{position:relative;min-height:100svh;display:grid;place-items:center;isolation:isolate;
  padding:clamp(90px,12vh,150px) 0;overflow:clip}
.hap .bg{position:absolute;inset:-6% 0;background-size:cover;background-position:center;
  filter:var(--lift);will-change:transform;z-index:0}
.hap .scrim{position:absolute;inset:0;z-index:1}
/* vello e butë vetëm në qendër, që objektet në cepa mbeten të dukshme */
.hap.light .scrim{background:
  radial-gradient(ellipse 58% 54% at 50% 50%,rgba(24,12,34,.62),rgba(24,12,34,.28) 62%,transparent 82%),
  linear-gradient(180deg,rgba(24,12,34,.4),transparent 22%,transparent 78%,rgba(24,12,34,.5))}
.hap.dark .scrim{background:
  radial-gradient(ellipse 58% 54% at 50% 50%,rgba(12,6,20,.5),rgba(12,6,20,.2) 62%,transparent 82%),
  linear-gradient(180deg,rgba(12,6,20,.34),transparent 24%,transparent 76%,rgba(12,6,20,.44))}
.hap .inner{position:relative;z-index:3;width:min(660px,84vw);text-align:center}
.hap .rr{font-family:'Pinyon Script',cursive;font-size:clamp(3rem,6vw,4.6rem);line-height:1;
  display:block;margin-bottom:.06em;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;
  -webkit-text-fill-color:transparent;filter:drop-shadow(0 4px 26px rgba(12,6,20,.9))}
.hap h2{font-size:clamp(2.1rem,4.6vw,3.6rem);margin-bottom:.5em;
  text-shadow:0 6px 40px rgba(12,6,20,.9)}
.hap p{font-size:clamp(1.06rem,.6vw + .92rem,1.3rem);line-height:1.75;
  color:rgba(255,252,246,.95);text-shadow:0 3px 22px rgba(12,6,20,.96);margin-bottom:1em}
.hap p:last-of-type{margin-bottom:0}
.hap p b{color:var(--gold-hi);font-weight:400}
.hap .mark{display:inline-block;margin-top:1.8em;font-family:'Cinzel',serif;
  font-size:.64rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);
  padding:.7em 1.6em;border:1px solid rgba(232,182,98,.5);border-radius:999px;
  background:rgba(18,9,28,.42);backdrop-filter:blur(6px)}
.hap .orn{display:flex;align-items:center;justify-content:center;gap:1em;color:var(--gold);
  margin:1.1em 0 1.4em;font-size:.8em}
.hap .orn::before,.hap .orn::after{content:"";height:1px;flex:1;max-width:6em;
  background:linear-gradient(90deg,transparent,var(--gold),transparent)}
@media(max-width:760px){.hap{min-height:auto;padding:clamp(70px,14vh,110px) 0}
  .hap .inner{width:86vw}}

/* ══ BUTONAT — më të ndritshëm dhe me hapësirë ══ */
:root{--grad:linear-gradient(135deg,#fff8e4 0%,#f5cf83 34%,#e0a94b 60%,#fdefc9 100%)}
.cbtn{border-color:rgba(245,207,131,.72);padding:1.25em 3.2em}
.cbtn .dim{background:rgba(22,11,32,.44)}
.cbtn .txt{filter:drop-shadow(0 2px 10px rgba(12,6,20,.7))}
.cbtn:hover .dim{background:rgba(22,11,32,.12)}
.cbtn:hover{box-shadow:0 26px 66px rgba(6,3,12,.6),0 0 96px rgba(245,207,131,.34)}
.cta-row{gap:1.6rem;margin-top:2.8em}
.btn{padding:1.15em 2.8em}
.fa,.fnav{gap:1.4rem}
.opts{gap:.85rem}
.opt{padding:1em 1.5em}

/* ══════════════════════════════════════════════════════════════
   LEXUESHMËRIA — shkrim më i madh, hapësirë më e madhe
   Faqja lexohet nga njerëz 50+. Asnjë tekst nën 15px.
   ══════════════════════════════════════════════════════════════ */
body{font-size:clamp(19px,1.1vw + 16px,23px);line-height:1.78}

.lede{font-size:clamp(1.22rem,.8vw + 1.05rem,1.62rem);line-height:1.72}
.small{font-size:1rem;line-height:1.7}
.hint{font-size:.98rem;line-height:1.62;margin-top:.7em}
.eyebrow{font-size:clamp(.72rem,.32vw + .62rem,.9rem);letter-spacing:.36em}

/* navigimi */
@media(min-width:1060px){nav a{font-size:.8rem;letter-spacing:.14em}}
#drawer a{font-size:clamp(1.9rem,6vw,2.9rem)}

/* hapat */
.hap p{font-size:clamp(1.16rem,.66vw + 1rem,1.42rem);line-height:1.82;margin-bottom:1.15em}
.hap .mark{font-size:.8rem;letter-spacing:.18em;padding:.85em 1.9em}
.step p{font-size:1.14rem;line-height:1.72}
.itxt p{font-size:clamp(1.16rem,.62vw + 1rem,1.4rem)}

/* paketat */
.pack li{font-size:1.1rem;padding:.56em 0 .56em 1.8em}
.pack .pe{font-size:.98rem}
.pack .tag{font-size:.68rem;letter-spacing:.14em;padding:.6em 1.3em}

/* forma */
.form label{font-size:.78rem;letter-spacing:.16em;margin-bottom:.8em}
.form input,.form textarea{font-size:1.18rem;padding:1.05em 1.2em}
.form textarea{min-height:6em;line-height:1.7}
.opt{font-size:.86rem;letter-spacing:.06em;padding:1.05em 1.6em;line-height:1.4}
.opt i{font-size:1.02em}
.check{font-size:1.08rem;line-height:1.68;padding:1.3em 1.5em;gap:1em}
.check input{transform:scale(1.35);margin-top:.3em}
.total .lbl{font-size:.8rem}
.total .v{font-size:2.4rem}
.err{font-size:1rem}
.queue{font-size:.84rem;letter-spacing:.1em;gap:1em 2.4em;padding:1.4em 1.7em}
.bfield .flabel{font-size:.82rem;letter-spacing:.18em}
.bfield .why{font-size:1.04rem;line-height:1.72;margin-top:1em}
.recap li{font-size:1.08rem;padding:.72em 0}
.recap li b{font-size:.92em}

/* konfirmimi */
#done .stepz .t{font-size:1.1rem;line-height:1.6}
#done .stepz .t b{font-size:.82rem;letter-spacing:.13em}
#done .sum{font-size:1.14rem;line-height:1.74}
#done .oid{font-size:clamp(1.25rem,2.2vw,1.8rem)}
#done .back{font-size:1.02rem}

/* accordion */
summary{font-size:1.34rem;padding:1.5em 0}
details .body{font-size:1.14rem;line-height:1.8}
details .body li{margin:.55em 0}

/* video dhe footer */
.vbox .cap{font-size:.78rem;letter-spacing:.14em;padding:1.5rem 1.7rem}
.guide .gtxt p{font-size:1.1rem;line-height:1.72}
.fg h4{font-size:.78rem;letter-spacing:.18em}
.fg li{margin:.65em 0;font-size:1.04rem}
.fbot p{font-size:.96rem;line-height:1.7}
.brand .sub{font-size:.62rem;letter-spacing:.26em}
.flow .fl p{font-size:1.14rem}
.flow .fl .tagline{font-size:.74rem;letter-spacing:.15em}
.quote{font-size:clamp(2.2rem,4.4vw,3.5rem)}

/* hapësirë më e gjerë kudo */
.sec{padding:clamp(100px,12vw,180px) 0}
.sec-head{margin-bottom:clamp(50px,5.4vw,84px)}
.g3{gap:clamp(28px,3vw,44px)}
.step{padding:3rem 2.3rem}
.pack{padding:3.2rem 2.2rem 2.5rem}
.form{gap:1.7rem 1.8rem}

/* ══════════════════════════════════════════════════════════════
   BUTONI ME KRISTAL — guri duket, shkrimi lexohet
   Zgjidhja: hije e errët VETËM pas shkrimit, guri i lirë në buzë.
   ══════════════════════════════════════════════════════════════ */
.cbtn{padding:1.35em 3.4em;border-width:1.5px;
  border-color:rgba(250,222,158,.8)}
.cbtn .dim{background:rgba(20,10,30,.34)}
/* shtresa e re: vetëm pas tekstit */
.cbtn .core{position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(ellipse 74% 130% at 50% 50%,
    rgba(14,7,22,.78),rgba(14,7,22,.42) 58%,transparent 84%);
  transition:opacity .55s ease}
.cbtn .txt{
  font-size:clamp(1.2rem,1.35vw,1.55rem);
  letter-spacing:.05em;font-weight:500;
  /* ngjyrë e plotë, jo gradient — lexohet mbi çdo teksturë */
  background:none;-webkit-background-clip:initial;background-clip:initial;
  color:#fff6dd;-webkit-text-fill-color:#fff6dd;
  text-shadow:0 2px 4px rgba(8,4,14,.95),0 0 22px rgba(8,4,14,.8),
              0 0 42px rgba(8,4,14,.6)}
.cbtn:hover .dim,.cbtn:focus-visible .dim{background:rgba(20,10,30,.06)}
.cbtn:hover .core,.cbtn:focus-visible .core{opacity:.52}
.cbtn:hover .txt,.cbtn:focus-visible .txt{color:#fffdf6;-webkit-text-fill-color:#fffdf6}
.cbtn:hover{box-shadow:0 28px 70px rgba(6,3,12,.62),0 0 100px rgba(250,222,158,.4)}
.cbtn.sm{padding:1.05em 2.2em}
.cbtn.sm .txt{font-size:1.08rem}
@media(max-width:560px){
  .cbtn{padding:1.2em 1.8em}
  .cbtn .txt{font-size:1.12rem}
}

/* butoni i thjeshtë ari — më i madh dhe më i lexueshëm */
.btn{font-size:.88rem;letter-spacing:.16em;padding:1.25em 3em}
.btn.sm{font-size:.78rem;letter-spacing:.12em;padding:.95em 2em}

/* ══ rrënja rritet, që çdo rem të rritet bashkë me të ══ */
html{font-size:17.5px}

/* tri elementet që mbetën të vogla — specifikë më e lartë ══ */
.form label,.builder label{font-size:.98rem;letter-spacing:.14em;line-height:1.5}
.form label.check,.builder label.check{font-size:1.12rem;letter-spacing:normal;
  text-transform:none;font-family:var(--serif);color:rgba(251,246,237,.9)}
.opts .opt{font-size:1rem;letter-spacing:.04em;line-height:1.45}
.opts .opt b{font-size:1.04em;margin-bottom:.3em}
.opts .opt i{font-size:.96em}
.bfield .flabel,.field .flabel{font-size:.95rem;letter-spacing:.16em}

/* ══ elementet e fundit nën 15px ══ */
.brand .sub{font-size:.86rem;letter-spacing:.2em}
.langbtn{font-size:.88rem;letter-spacing:.12em;padding:.65em 1.2em}
.langbtn b{font-size:1.02em}
.fg h4{font-size:.94rem;letter-spacing:.16em}
.fg a,.fg li{font-size:1.06rem}
nav a{font-size:.9rem}
.marks{font-size:.86rem;letter-spacing:.14em;gap:.8em 2.2em}
.marks i{font-size:1.05em}
.vbox .cap{font-size:.92rem;letter-spacing:.11em}
.hap .mark{font-size:.92rem;letter-spacing:.14em}
.flow .fl .tagline,.itxt .tagline{font-size:.88rem;letter-spacing:.12em}
.pack .tag{font-size:.8rem;letter-spacing:.1em}
.total .lbl,.queue{font-size:.95rem;letter-spacing:.1em}
#done .stepz .t b,#done .eyebrow{font-size:.95rem;letter-spacing:.12em}
.cue{font-size:.86rem;letter-spacing:.2em}
#toast{font-size:.92rem;letter-spacing:.1em;padding:1.1em 2.2em}
.fbot p,.small{font-size:1.04rem}
.step .n,.flow .fl::before{font-size:inherit}
.flow .fl::before{font-size:1.1rem}
.recap .eur,.pack .pe,.total .small{font-size:1.02rem}

/* ══ KOKA E QENDRUAR ══ */
header .wrap{flex-wrap:wrap;justify-content:center;gap:.9rem 1.6rem}
@media(min-width:1060px){
  header .wrap{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1.4rem}
  header .brand{justify-self:start}
  header nav{justify-self:center;flex-wrap:wrap;justify-content:center}
  header .langbtn{justify-self:end;order:3}
  header .cbtn.head-cta{justify-self:end;order:4;grid-column:3;margin-left:.8rem}
  header .wrap>.langbtn{grid-column:3;justify-self:end;margin-right:12rem}
}

/* ══ FILXHANËT E GJALLË ══ */
.cupgrid{display:grid;gap:clamp(24px,3vw,48px);grid-template-columns:1fr}
@media(min-width:820px){.cupgrid{grid-template-columns:repeat(3,1fr)}}
.cupbox{position:relative;aspect-ratio:1;display:grid;place-items:center;cursor:pointer}
.cupbox .aura{position:absolute;width:78%;aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(232,182,98,.28),transparent 66%);
  filter:blur(16px);animation:auraB 6s ease-in-out infinite}
@keyframes auraB{0%,100%{opacity:.6;transform:scale(.96)}50%{opacity:1;transform:scale(1.06)}}
.cupbox img{position:relative;z-index:2;width:86%;object-fit:contain;
  filter:drop-shadow(0 30px 56px rgba(0,0,0,.66));
  animation:cupBob 7s ease-in-out infinite;
  transition:transform .8s var(--ease),filter .6s ease}
@keyframes cupBob{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-12px) scale(1.03)}}
.cupbox:nth-child(2) img{animation-delay:-2.3s}
.cupbox:nth-child(3) img{animation-delay:-4.6s}
.cupbox:hover img{transform:translateY(-16px) scale(1.07);
  filter:drop-shadow(0 40px 70px rgba(0,0,0,.72)) brightness(1.12)}
.cupbox:hover .aura{opacity:1;transform:scale(1.14)}
.cupbox .lab{position:absolute;bottom:-.4rem;left:0;right:0;text-align:center;z-index:3;
  font-family:'Cinzel',serif;font-size:.92rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--gold-hi);text-shadow:0 3px 18px rgba(8,4,14,.9)}

/* ══ HAPAT E RITUALIT ══ */
.ritual{counter-reset:rt;display:grid;gap:clamp(30px,3.4vw,52px);max-width:56em;margin-inline:auto}
.rt{display:grid;gap:1.4rem;grid-template-columns:auto 1fr;align-items:start}
.rt .n{counter-increment:rt;width:3.4rem;height:3.4rem;border-radius:50%;display:grid;
  place-items:center;background:var(--grad);color:#3a2108;font-family:'Cinzel',serif;
  font-weight:600;font-size:1.1rem;flex:0 0 auto;
  box-shadow:0 10px 28px rgba(232,182,98,.3)}
.rt .n::before{content:counter(rt)}
.rt h3{margin-bottom:.4em}
.rt p{font-size:1.14rem;line-height:1.76;color:rgba(251,246,237,.88)}

/* ══ HËNA QË MBUSHET ══ */
.moonpanel{position:sticky;top:110px;text-align:center;padding:2.4rem 2rem;
  border-radius:var(--r);border:1px solid var(--line);
  background:radial-gradient(ellipse at 50% 10%,rgba(88,50,132,.6),rgba(20,10,30,.6));
  box-shadow:0 30px 80px rgba(6,3,12,.5)}
.moonwrap{position:relative;width:min(200px,54vw);aspect-ratio:1;margin:0 auto 1.4rem}
.moonwrap svg{width:100%;height:100%;overflow:visible}
.moonglow{position:absolute;inset:-28%;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(253,242,216,.36),transparent 62%);
  filter:blur(12px);transition:opacity .6s ease}
.moonname{font-family:'Cinzel',serif;font-size:1rem;letter-spacing:.2em;
  text-transform:uppercase;color:var(--gold);margin-bottom:.3em}

/* dy filxhanë, të mëdhenj, që rrotullohen kundër akrepave */
.cupgrid.two{grid-template-columns:1fr;max-width:60em;margin-inline:auto}
@media(min-width:760px){.cupgrid.two{grid-template-columns:1fr 1fr;gap:clamp(40px,5vw,90px)}}
.cupgrid.two .cupbox img{width:92%;animation:cupBob 7s ease-in-out infinite,
  cupTurn 42s linear infinite reverse}
@keyframes cupTurn{to{rotate:360deg}}
.cupgrid.two .cupbox:nth-child(2) img{animation-delay:-3.4s,-14s}
.cupgrid.two .cupbox:hover img{animation-play-state:paused}
.cupgrid.two .aura{width:84%}

/* yjet rreth hënës — dalin te Nata e Yjeve */
.moonwrap .stars{position:absolute;inset:-18%;z-index:3;pointer-events:none;
  opacity:var(--so,0);transition:opacity .9s ease}
.moonwrap .stars i{position:absolute;display:block;color:#fdf2d8;font-style:normal;
  font-size:var(--sz,14px);text-shadow:0 0 12px rgba(253,242,216,.9);
  animation:twk var(--dur,3s) ease-in-out infinite var(--dl,0s)}
@keyframes twk{0%,100%{opacity:.35;transform:scale(.82)}50%{opacity:1;transform:scale(1.15)}}
/* yjet janë dekor, jo tekst — përjashtohen nga rregulli i lexueshmërisë */
.moonwrap .stars i{font-size:var(--sz,16px);min-width:16px;min-height:16px;
  display:grid;place-items:center;line-height:1}

/* ══════════════════════════════════════════════════════════════
   KOKA NË NJË VIJË — asgjë nuk thyhet, asgjë nuk zbret poshtë
   ══════════════════════════════════════════════════════════════ */
header .wrap{flex-wrap:nowrap}
.brand{flex:0 0 auto;white-space:nowrap;align-items:baseline}
.brand .mk{white-space:nowrap;font-size:clamp(1.35rem,1.6vw,1.85rem)}
.brand .sub{white-space:nowrap;font-size:.7rem;letter-spacing:.16em}
@media(max-width:1300px){.brand .sub{display:none}}

@media(min-width:1060px){
  header .wrap{display:flex;justify-content:space-between;align-items:center;
    gap:clamp(.8rem,1.4vw,1.8rem);flex-wrap:nowrap}
  header nav{display:flex;flex-wrap:nowrap;flex:1 1 auto;justify-content:center;
    gap:clamp(.7rem,1.5vw,1.7rem);white-space:nowrap;min-width:0}
  nav a{font-size:clamp(.74rem,.72vw,.86rem);letter-spacing:.1em;white-space:nowrap;
    padding:.35em 0}
  header .langbtn{flex:0 0 auto;margin:0}
  header .cbtn.head-cta{flex:0 0 auto;padding:.85em 1.7em;margin:0}
  header .cbtn.head-cta .txt{font-size:1rem;letter-spacing:.04em}
}
@media(min-width:1060px) and (max-width:1420px){
  nav a{font-size:.76rem;letter-spacing:.06em}
  header nav{gap:.85rem}
  .brand .mk{font-size:1.3rem}
}

/* ══════════════════════════════════════════════════════════════
   OPSIONET — pilula të ulëta në një vijë, jo sfera
   ══════════════════════════════════════════════════════════════ */
.opts{display:flex;flex-wrap:wrap;gap:.7rem;align-items:stretch}
.opts .opt{
  border-radius:14px;                    /* jo 999px — nuk bëhen sfera */
  padding:.85em 1.15em;
  display:flex;flex-direction:column;justify-content:center;
  min-width:0;flex:0 1 auto;
  text-align:left;line-height:1.32;
  box-shadow:none}
.opts .opt b{font-size:.98rem;font-weight:600;margin-bottom:.15em;white-space:nowrap;
  letter-spacing:.03em;text-transform:none}
.opts .opt br{display:none}
.opts .opt span{display:inline;font-size:.9em;opacity:.72}
.opts .opt i{font-size:.9rem;opacity:.66;letter-spacing:0;white-space:nowrap}
.opts .opt[aria-pressed="true"]{box-shadow:0 8px 22px rgba(232,182,98,.28)}
@media(max-width:560px){
  .opts{gap:.6rem}
  .opts .opt{flex:1 1 calc(50% - .3rem);padding:.8em .95em}
  .opts .opt b{font-size:.94rem}
}

/* paneli i djathtë: hëna pak më e vogël që të mos dominojë */
.moonwrap{width:min(160px,44vw)}
.recap{padding:1.9rem 1.6rem}
.recap .big{font-size:clamp(2.1rem,4vw,2.8rem)}

/* opsionet: emri dhe çmimi krah për krah, jo njëri mbi tjetrin */
.opts .opt{flex-direction:row;align-items:baseline;gap:.6em;
  padding:.72em 1.1em;border-radius:12px;line-height:1.25}
.opts .opt b{margin-bottom:0;font-size:.95rem}
.opts .opt i{font-size:.86rem;opacity:.62;white-space:nowrap;margin-left:auto;
  padding-left:.4em}
.opts .opt span{font-size:.88em;opacity:.68}
@media(max-width:560px){
  .opts .opt{flex:1 1 100%;justify-content:space-between}
}

/* opsionet: rrjetë e barabartë, pa thyerje të parregullt */
.opts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}
@media(min-width:640px){.opts{grid-template-columns:repeat(3,minmax(0,1fr))}}
.opts .opt{width:100%;justify-content:space-between}
.opts .opt b{overflow:hidden;text-overflow:ellipsis}
/* koha është e shkurtër — katër në rresht */
#optGjatesi{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(min-width:640px){#optGjatesi{grid-template-columns:repeat(5,minmax(0,1fr))}}
#optGjatesi .opt{flex-direction:column;align-items:center;justify-content:center;gap:.15em}
#optGjatesi .opt i{margin-left:0;padding-left:0}
#optOracle{grid-template-columns:minmax(0,1fr)}

/* rikthimi i madhësive pas ngjeshjes së kokës */
.brand .sub{font-size:.86rem}
@media(min-width:1060px){nav a{font-size:.88rem;letter-spacing:.08em}}
@media(min-width:1060px) and (max-width:1420px){nav a{font-size:.86rem;letter-spacing:.05em}}
@media(min-width:1060px) and (max-width:1200px){header nav{gap:.7rem}}
.opts .opt span{font-size:.96rem;opacity:.7}

/* ══════════════════════════════════════════════════════════════
   KOKA — rregulli PËRFUNDIMTAR, mbivendos çdo rregull të mëparshëm
   ══════════════════════════════════════════════════════════════ */
header .wrap{
  display:flex !important;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  flex-wrap:nowrap;
}
header .brand{
  flex:0 1 auto;min-width:0;
  display:flex;align-items:baseline;gap:.5em;
  white-space:nowrap;overflow:hidden;
}
header .brand .mk{font-size:clamp(1.2rem,1.5vw,1.7rem);flex:0 0 auto}
header .brand .sub{flex:0 0 auto}
header nav{
  flex:1 1 auto;min-width:0;
  display:none;
}
header .langbtn{flex:0 0 auto}
header .cbtn.head-cta{flex:0 0 auto}
header .burger{flex:0 0 auto}

/* menuja e plotë vetëm kur ka vend vërtet */
@media(min-width:1180px){
  header nav{
    display:flex;flex-wrap:nowrap;justify-content:center;
    gap:clamp(.6rem,1.3vw,1.5rem);white-space:nowrap;
  }
  header nav a{font-size:clamp(.8rem,.68vw,.9rem);letter-spacing:.06em;padding:.35em 0}
  header .burger{display:none}
  header .cbtn.head-cta{display:inline-flex}
}
@media(max-width:1179px){
  header nav{display:none}
  header .burger{display:grid}
  header .cbtn.head-cta{display:none}
}
@media(max-width:1340px){header .brand .sub{display:none}}

/* te gjerësitë e mesme logoja duhet të tkurret, jo të shtypë butonat */
@media(max-width:1179px){
  header .wrap{gap:.8rem}
  header .brand{flex:1 1 auto;min-width:0;overflow:hidden}
  header .brand .mk{overflow:hidden;text-overflow:clip;max-width:100%}
}
@media(max-width:820px){header .brand .mk{font-size:1.15rem}}
@media(max-width:430px){header .brand .mk{font-size:1.05rem}}

/* pastro mbetjet e versionit grid të kokës */
header .wrap>.langbtn,header .langbtn{margin:0 !important;justify-self:auto}
header .cbtn.head-cta{margin:0 !important;justify-self:auto}
header .brand{justify-self:auto}
header nav{justify-self:auto}

/* rendi i kokës: logo · menu · gjuhë · buton · hamburger */
header .wrap>*{order:0 !important}
header .brand{order:1 !important}
header nav{order:2 !important}
header .langbtn{order:3 !important}
header .cbtn.head-cta{order:4 !important}
header .burger{order:5 !important}

/* rendi — pa reset universal që merr përparësi mbi selektorët e klasave */
header .wrap>.brand{order:1 !important}
header .wrap>nav{order:2 !important}
header .wrap>.langbtn{order:3 !important}
header .wrap>.cbtn{order:4 !important}
header .wrap>.burger{order:5 !important}

/* linqet e menusë kurrë nën 15px */
@media(min-width:1180px){
  header nav a{font-size:clamp(.88rem,.72vw,.95rem) !important;letter-spacing:.05em}
  header nav{gap:clamp(.55rem,1.15vw,1.4rem)}
}

/* ══════════════════════════════════════════════════════════════
   KOKA — tri kolona të ndara, pa mundësi përplasjeje
   ══════════════════════════════════════════════════════════════ */
header .wrap{
  display:grid !important;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  column-gap:clamp(1.4rem,3vw,3.4rem);
}
header .brand{grid-column:1;justify-self:start;flex:0 0 auto;overflow:visible;
  display:flex;align-items:baseline;gap:.55em;white-space:nowrap}
header nav{grid-column:2;justify-self:center;min-width:0}
header .hact{grid-column:3;justify-self:end;
  display:flex;align-items:center;gap:clamp(.7rem,1.2vw,1.3rem);flex:0 0 auto}

/* logoja më e madhe dhe e plotë */
header .brand .mk{font-size:clamp(1.55rem,2vw,2.3rem) !important;line-height:1}
header .brand .sub{font-size:.8rem;letter-spacing:.2em;white-space:nowrap;opacity:.85}
@media(max-width:1500px){header .brand .sub{display:none}}

/* menuja */
@media(min-width:1180px){
  header nav{display:flex;flex-wrap:nowrap;white-space:nowrap;
    gap:clamp(.7rem,1.4vw,1.7rem)}
  header nav a{font-size:clamp(.88rem,.74vw,.98rem) !important;letter-spacing:.05em}
}
@media(max-width:1179px){header nav{display:none}}

/* butoni djathtas, me hapësirë reale nga gjuha */
header .hact .cbtn.head-cta{padding:.9em 2.1em;margin-left:.4rem}
header .hact .cbtn.head-cta .txt{font-size:1.05rem;letter-spacing:.05em}
@media(max-width:1179px){header .hact .cbtn.head-cta{display:none}}
@media(min-width:1180px){header .hact .burger{display:none}}

/* në telefon logoja mbetet e lexueshme */
@media(max-width:560px){header .brand .mk{font-size:1.4rem !important}}
@media(max-width:400px){header .brand .mk{font-size:1.22rem !important}}

/* ══════════════════════════════════════════════════════════════
   KOKA — rregullimi përfundimtar
   Të tre elementet në rreshtin 1, pa 'order' që prish rrjetën.
   ══════════════════════════════════════════════════════════════ */
header .wrap>*{order:0 !important;grid-row:1 !important}
header .wrap>.brand{grid-column:1 !important;justify-self:start !important}
header .wrap>nav   {grid-column:2 !important;justify-self:center !important;
                    min-width:0 !important;overflow:hidden}
header .wrap>.hact {grid-column:3 !important;justify-self:end !important}

/* menuja rri brenda kolonës së saj pa dalë kurrë jashtë */
@media(min-width:1180px){
  header nav{gap:clamp(.5rem,1.05vw,1.25rem) !important}
  header nav a{font-size:clamp(.88rem,.66vw,.96rem) !important;letter-spacing:.03em !important}
}
@media(min-width:1180px) and (max-width:1400px){
  header nav{gap:.55rem !important}
  header nav a{font-size:.88rem !important;letter-spacing:.01em !important}
}

/* menuja mbush kolonën e vet dhe qendërzohet brenda — nuk del jashtë saj */
header .wrap>nav{
  justify-self:stretch !important;
  display:flex;justify-content:center;align-items:center;
  min-width:0 !important;max-width:100%;
}
@media(min-width:1180px){
  header nav a{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis}
}

/* në telefon logoja tkurret në vend që të shtypë butonat */
@media(max-width:1179px){
  header .wrap{grid-template-columns:minmax(0,1fr) auto;column-gap:.9rem}
  header .wrap>.brand{grid-column:1 !important;min-width:0 !important;overflow:hidden}
  header .wrap>.brand .mk{overflow:hidden;text-overflow:ellipsis;display:block}
  header .wrap>nav{display:none !important}
  header .wrap>.hact{grid-column:2 !important;flex-wrap:nowrap;white-space:nowrap}
  header .hact .langbtn{padding:.55em .95em}
}
@media(max-width:430px){
  header .wrap{column-gap:.6rem}
  header .hact{gap:.5rem}
  header .hact .langbtn{padding:.5em .8em;font-size:.82rem}
}

/* ══════════════════════════════════════════════════════════════
   KOKA PA EMËR — vetëm hëna, menuja merr gjithë hapësirën
   ══════════════════════════════════════════════════════════════ */
header .wrap{
  display:grid !important;
  grid-template-columns:auto minmax(0,1fr) auto !important;
  align-items:center !important;
  column-gap:clamp(1rem,2.4vw,2.6rem) !important;
}
header .brand{
  grid-column:1 !important;justify-self:start !important;
  display:grid !important;place-items:center;
  width:3rem;height:3rem;border-radius:50%;overflow:visible !important;
  border:1px solid rgba(232,182,98,.4);background:rgba(20,10,30,.4);
  transition:border-color .4s ease,background .4s ease,transform .4s var(--ease)}
header .brand:hover{border-color:var(--gold);background:rgba(64,36,96,.4);transform:scale(1.06)}
header .brand .glyph{font-size:1.5rem;line-height:1;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;
  color:transparent;-webkit-text-fill-color:transparent}
header .brand .mk,header .brand .sub{display:none !important}

header .wrap>nav{grid-column:2 !important;justify-self:center !important;
  display:flex !important;flex-wrap:nowrap !important;white-space:nowrap !important;
  justify-content:center;align-items:center;min-width:0 !important}
header .wrap>.hact{grid-column:3 !important;justify-self:end !important;
  display:flex;align-items:center;gap:clamp(.7rem,1.2vw,1.2rem);flex-wrap:nowrap}

@media(min-width:1100px){
  header nav a{font-size:clamp(.88rem,.72vw,1rem) !important;letter-spacing:.05em !important}
  header nav{gap:clamp(.8rem,1.6vw,2rem) !important}
  header .hact .burger{display:none !important}
  header .hact .cbtn.head-cta{display:inline-flex !important}
}
@media(max-width:1099px){
  header .wrap{grid-template-columns:auto minmax(0,1fr) !important}
  header .wrap>nav{display:none !important}
  header .wrap>.hact{grid-column:2 !important}
  header .hact .burger{display:grid !important}
  header .hact .cbtn.head-cta{display:none !important}
}
@media(max-width:430px){header .brand{width:2.6rem;height:2.6rem}
  header .brand .glyph{font-size:1.3rem}}

/* ══ EMRI MBI IMAZH ══ */
.wordmark{text-align:center;margin-bottom:clamp(1.2rem,2.6vw,2.4rem)}
.hero:not(.center) .wordmark{text-align:left}
.wordmark .wm{display:block;font-family:'Pinyon Script',cursive;
  font-size:clamp(2.4rem,5.4vw,4.6rem);line-height:1;
  filter:drop-shadow(0 6px 34px rgba(10,4,18,.9))}
.wordmark .wmsub{display:block;font-family:'Cinzel',serif;
  font-size:clamp(.8rem,.9vw,1rem);letter-spacing:.44em;text-transform:uppercase;
  color:rgba(251,246,237,.82);margin-top:.7em;
  text-shadow:0 3px 20px rgba(10,4,18,.95)}
.wordmark .wmsub{font-size:clamp(.92rem,1vw,1.1rem)}

/* ══════════════════════════════════════════════════════════════
   KATEGORITË + TABELA E ZGJEDHJES
   ══════════════════════════════════════════════════════════════ */
.katrow{display:grid;gap:.8rem;grid-template-columns:1fr;margin-bottom:2.4rem}
@media(min-width:720px){.katrow{grid-template-columns:repeat(3,1fr)}}
.katbtn{padding:1.25em 1.2em;border-radius:14px;cursor:pointer;
  border:1px solid var(--line);background:rgba(14,7,22,.45);color:var(--cream);
  font-family:'Cinzel',serif;font-size:.98rem;letter-spacing:.06em;line-height:1.4;
  transition:all .35s ease}
.katbtn:hover{border-color:rgba(232,182,98,.7);transform:translateY(-2px)}
.katbtn[aria-pressed="true"]{background:var(--grad);color:#3a2108;border-color:transparent;
  box-shadow:0 12px 30px rgba(232,182,98,.3)}

.ptable{display:grid;gap:.6rem;margin-bottom:.9rem}
.prow{display:grid;align-items:center;gap:.9rem;width:100%;cursor:pointer;text-align:left;
  grid-template-columns:auto 1fr auto;
  padding:1.15em 1.3em;border-radius:14px;
  border:1px solid var(--line);background:rgba(14,7,22,.45);color:var(--cream);
  font-family:var(--serif);transition:all .35s ease}
@media(min-width:640px){.prow{grid-template-columns:auto 1.1fr 1fr auto auto}}
.prow:hover{border-color:rgba(232,182,98,.65);transform:translateY(-2px);
  background:rgba(64,36,96,.4)}
.prow .tick{width:1.5rem;height:1.5rem;border-radius:6px;flex:0 0 auto;
  border:1.5px solid rgba(232,182,98,.55);display:grid;place-items:center;
  transition:all .3s ease}
.prow .tick::after{content:"✓";font-size:.95rem;color:#3a2108;opacity:0;
  transition:opacity .3s ease;line-height:1}
.prow.on{border-color:var(--gold);background:rgba(96,56,142,.42);
  box-shadow:0 10px 28px rgba(232,182,98,.18)}
.prow.on .tick{background:var(--grad);border-color:transparent}
.prow.on .tick::after{opacity:1}
.prow .c1{font-size:1.12rem}
.prow .c1 b{font-family:'Cinzel',serif;font-weight:600;font-size:1.15em;color:var(--gold-hi)}
.prow .c2{font-size:1rem;color:var(--muted)}
.prow .c3{font-family:'Cinzel',serif;font-weight:600;font-size:1.25rem;
  color:var(--gold-hi);white-space:nowrap;text-align:right}
.prow .c4{font-size:.98rem;color:var(--muted);white-space:nowrap;text-align:right}
@media(max-width:639px){
  .prow{grid-template-columns:auto 1fr auto}
  .prow .c2{grid-column:2;font-size:.94rem}
  .prow .c3{grid-column:3;grid-row:1}
  .prow .c4{grid-column:3;grid-row:2;font-size:.9rem}
}
.pbox{margin-bottom:2.6rem}
.pbox h3{font-size:1.35rem;margin-bottom:.3em}
.pbox .note{font-size:1.02rem;color:var(--muted);margin-bottom:1.1em;line-height:1.65}
.zbritje{display:inline-block;font-family:'Cinzel',serif;font-size:.9rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--gold);padding:.6em 1.3em;border-radius:999px;
  border:1px dashed var(--line);background:rgba(18,9,28,.5);margin-top:.4rem}

/* Dielli · Hëna · Ashendenti */
.astro{display:grid;gap:1rem;margin:1.4rem 0 .4rem}
.astro .ai{display:grid;grid-template-columns:auto 1fr;gap:1.1rem;align-items:start;
  padding:1.2em 1.3em;border-radius:14px;border:1px solid var(--line);
  background:rgba(14,7,22,.4)}
.astro .s{width:2.6rem;height:2.6rem;border-radius:50%;display:grid;place-items:center;
  background:var(--grad);color:#3a2108;font-size:1.3rem;line-height:1;flex:0 0 auto}
.astro b{display:block;font-family:'Cinzel',serif;font-size:1.02rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--gold-hi);margin-bottom:.35em;font-weight:600}
.astro span:not(.s){font-size:1.06rem;line-height:1.68;color:rgba(251,246,237,.88)}

/* ══════════════════════════════════════════════════════════════
   RAFINIMET — stilet e animacioneve të reja
   ══════════════════════════════════════════════════════════════ */

/* ── YJET NË HERO — vezullim i qetë mbi pjesën e sipërme ── */
.starsky{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden}
.starsky i{position:absolute;width:var(--sz,2px);height:var(--sz,2px);border-radius:50%;
  background:#fdf2d8;opacity:0;
  box-shadow:0 0 6px 1px rgba(253,242,216,.75);
  animation:starTw var(--dur,3.4s) ease-in-out var(--dl,0s) infinite}
@keyframes starTw{0%,100%{opacity:0;transform:scale(.6)}
  50%{opacity:.85;transform:scale(1.1)}}
@media (prefers-reduced-motion:reduce){.starsky{display:none}}

/* ── SHOWCASE — korniza tani drejtohet nga scroll-i (JS) ── */
.showcase .frame{transition:none}
.showcase .cap > div{opacity:var(--co,0);transform:translateY(var(--cy,34px))}
@media (prefers-reduced-motion:reduce){
  .showcase .cap > div{opacity:1;transform:none}
}

/* ── FRESKORJA E LETRAVE — hije e artë poshtë saj ───────── */
.fan::after{content:"";position:absolute;left:50%;top:58%;width:70%;aspect-ratio:2.6;
  transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;
  background:radial-gradient(ellipse,rgba(232,182,98,.30),transparent 68%);
  filter:blur(28px);opacity:var(--glow,0);transition:opacity .3s linear}
.fan img{transition:box-shadow .5s ease}
@media (prefers-reduced-motion:reduce){
  .fanwrap{height:auto;padding:clamp(50px,7vw,90px) 0}
  .fanpin{position:static;height:auto;display:grid;place-items:center}
  .fan::after{opacity:1}
}

/* ── FLAKA E QIRIRIT — pulsim i lehtë te titujt e artë ──── */
@media (prefers-reduced-motion:no-preference){
  .hap .rr{animation:candle 5.5s ease-in-out infinite}
  @keyframes candle{
    0%,100%{filter:drop-shadow(0 4px 26px rgba(12,6,20,.9))
            drop-shadow(0 0 18px rgba(232,182,98,.16))}
    50%    {filter:drop-shadow(0 4px 26px rgba(12,6,20,.9))
            drop-shadow(0 0 34px rgba(232,182,98,.36))}}
}

/* ── PRIRJA 3D E KARTAVE ────────────────────────────────── */
.pack,.guide .card,.vwrap{transform-style:preserve-3d;perspective:900px}
.pack.tilting,.guide .card.tilting,.vwrap.tilting{
  transform:translateY(-12px) rotateY(var(--tx,0deg)) rotateX(var(--ty,0deg));
  transition:transform .18s ease-out}
@media (hover:none),(prefers-reduced-motion:reduce){
  .pack.tilting,.guide .card.tilting,.vwrap.tilting{transform:none}
}

/* ── TREGUESI I SCROLL-IT (cue) — rikthyer në përdorim ──── */
.hero .cue{text-shadow:0 2px 14px rgba(10,4,18,.9)}

/* ── HERO — hyrje me shkallëzim edhe për emrin ──────────── */
@media (prefers-reduced-motion:no-preference){
  .wordmark .wm{animation:wmIn 1.6s var(--ease) .15s both}
  .wordmark .wmsub{animation:wmIn 1.6s var(--ease) .4s both}
  @keyframes wmIn{from{opacity:0;transform:translateY(18px);filter:blur(8px)}
    to{opacity:1;transform:none;filter:blur(0)}}
}

/* ── BUTONI — puls i ngadaltë i unazës kur rri i qetë ───── */
@media (prefers-reduced-motion:no-preference){
  .cbtn:not(:hover)::after{animation:btnPulse 4.2s ease-in-out infinite}
  @keyframes btnPulse{0%,100%{opacity:0}50%{opacity:.35;transform:scaleX(.7)}}
}

/* ============================================================
   FLUTURAT & ZBULIMET "HËNORE" — shtuar në rishikimin e dytë
   ============================================================ */

/* ---------- FLUTURA E FAQES (3 shtresa: krah · trup · krah) ---------- */
.mflutur{position:absolute;z-index:5;pointer-events:auto;cursor:pointer;
  width:clamp(76px,9vw,132px);right:clamp(4%,8vw,11%);top:clamp(12%,16vh,20%);
  opacity:var(--fo,1);transform:translateY(var(--fy,0px));
  transition:opacity .5s ease;will-change:opacity,transform}
@media(max-width:720px){.mflutur{width:64px;right:5%;top:9%}}
.mflutur .mfly-in{opacity:0;animation:mflyIn 2.6s cubic-bezier(.26,.7,.22,1) .9s both}
.mflutur .bfly{display:block;width:100%;aspect-ratio:1719/1468;position:relative;
  perspective:920px;animation:mflyFloat 5.4s ease-in-out infinite 3.4s}
.mflutur .wg{position:absolute;inset:0;z-index:2;pointer-events:none;display:block;
  background-size:100% 100%;background-repeat:no-repeat;background-position:center;
  backface-visibility:visible;will-change:transform}
.mflutur .wl{transform-origin:49.97% 50%;animation:mflapL 4.4s ease-in-out infinite 3.4s}
.mflutur .wr{transform-origin:49.97% 50%;animation:mflapR 4.4s ease-in-out infinite 3.4s}
.mflutur .wb{z-index:3;filter:drop-shadow(0 5px 9px rgba(8,3,16,.45))}
.mflutur .aura{position:absolute;inset:-34%;z-index:0;border-radius:50%;pointer-events:none;
  filter:blur(18px);
  background:radial-gradient(closest-side,
    color-mix(in srgb, var(--bc,#e8b662) 55%, transparent) 0%,
    color-mix(in srgb, var(--bc,#e8b662) 20%, transparent) 46%, transparent 74%);
  opacity:.45;animation:mauraIdle 5s ease-in-out infinite 3.4s}
.mflutur .core{position:absolute;left:49.97%;top:52%;width:54%;aspect-ratio:1;z-index:0;
  transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;filter:blur(12px);
  background:radial-gradient(circle,
    color-mix(in srgb, var(--bc,#e8b662) 74%, white) 0%,
    color-mix(in srgb, var(--bc,#e8b662) 36%, transparent) 44%, transparent 72%);
  opacity:.35;animation:mcoreIdle 5s ease-in-out infinite 3.8s}
.mflutur .shade{position:absolute;left:50%;bottom:-9%;width:64%;height:11%;z-index:0;
  transform:translateX(-50%);border-radius:50%;pointer-events:none;filter:blur(8px);
  background:radial-gradient(ellipse, rgba(10,4,18,.45), transparent 72%);
  animation:mshadeIdle 5.4s ease-in-out infinite 3.4s}
@keyframes mflyFloat{0%,100%{transform:translateY(0) rotate(-.8deg)}50%{transform:translateY(-6%) rotate(1.2deg)}}
@keyframes mflapL{0%,100%{transform:rotateY(2deg)}50%{transform:rotateY(21deg)}}
@keyframes mflapR{0%,100%{transform:rotateY(-2deg)}50%{transform:rotateY(-21deg)}}
@keyframes mauraIdle{0%,100%{opacity:.36;transform:scale(.96)}50%{opacity:.6;transform:scale(1.05)}}
@keyframes mcoreIdle{0%,100%{opacity:.26;transform:translate(-50%,-50%) scale(.96)}
  50%{opacity:.48;transform:translate(-50%,-50%) scale(1.06)}}
@keyframes mshadeIdle{0%,100%{opacity:.45;transform:translateX(-50%) scale(1)}
  50%{opacity:.28;transform:translateX(-50%) scale(.88)}}
/* hyrja: fluturon nga qoshja poshtë-majtas, zvogëlohet, ulet */
@keyframes mflyIn{
  0%  {opacity:0;transform:translate(-560%,420%) scale(3.6) rotate(-19deg)}
  6%  {opacity:1}
  42% {transform:translate(-210%,140%) scale(2.3) rotate(9deg)}
  70% {transform:translate(26%,-14%)  scale(1.24) rotate(-8deg)}
  88% {transform:translate(-8%,12%)   scale(.95)  rotate(4deg)}
  100%{opacity:1;transform:translate(0,0) scale(1) rotate(0)}
}
/* kur e prek: rrahje e ngazëllyer */
.mflutur.zgjuar .wl{animation:mbeatL 1.05s cubic-bezier(.42,0,.3,1) infinite}
.mflutur.zgjuar .wr{animation:mbeatR 1.05s cubic-bezier(.42,0,.3,1) infinite}
.mflutur.zgjuar .aura{animation:mauraBeat 1.05s cubic-bezier(.42,0,.3,1) infinite;filter:blur(15px)}
.mflutur.zgjuar .core{animation:mcoreBeat 1.05s cubic-bezier(.42,0,.3,1) infinite;filter:blur(10px)}
@keyframes mbeatL{0%{transform:rotateY(3deg)}36%{transform:rotateY(64deg)}
  70%{transform:rotateY(8deg)}86%{transform:rotateY(16deg)}100%{transform:rotateY(3deg)}}
@keyframes mbeatR{0%{transform:rotateY(-3deg)}36%{transform:rotateY(-64deg)}
  70%{transform:rotateY(-8deg)}86%{transform:rotateY(-16deg)}100%{transform:rotateY(-3deg)}}
@keyframes mauraBeat{0%{opacity:.6;transform:scale(1)}36%{opacity:.95;transform:scale(1.14)}
  70%{opacity:.68;transform:scale(1.02)}100%{opacity:.6;transform:scale(1)}}
@keyframes mcoreBeat{0%{opacity:.4;transform:translate(-50%,-50%) scale(1)}
  36%{opacity:.85;transform:translate(-50%,-50%) scale(1.16)}
  100%{opacity:.4;transform:translate(-50%,-50%) scale(1)}}

/* ---------- DYERT QË HAPEN — zbulimi i fotove të tavolinës (.hap) ---------- */
.hap{--hp:1} /* pa JS gjithçka mbetet e hapur */
.hap .porta{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden}
.hap .porta i{position:absolute;top:0;bottom:0;width:50.5%;display:block;
  background:linear-gradient(180deg,#171026 0%,#100a1c 55%,#0c0716 100%);
  will-change:transform}
.hap .porta .pl{left:-.5%;transform:translateX(calc(var(--hp) * -102%));
  border-right:1px solid color-mix(in srgb, var(--gold) 45%, transparent);
  box-shadow:inset -34px 0 60px -30px rgba(232,182,98,.28)}
.hap .porta .pr{right:-.5%;transform:translateX(calc(var(--hp) * 102%));
  border-left:1px solid color-mix(in srgb, var(--gold) 45%, transparent);
  box-shadow:inset 34px 0 60px -30px rgba(232,182,98,.28)}
/* rrezja e dritës në mes, si hëna që depërton nga çarja */
.hap .porta .rreze{position:absolute;left:50%;top:-6%;bottom:-6%;width:3px;
  transform:translateX(-50%);filter:blur(2px);
  background:linear-gradient(180deg,transparent,rgba(255,238,196,.95) 18%,
    rgba(255,238,196,.95) 82%,transparent);
  box-shadow:0 0 26px 8px rgba(232,182,98,.55), 0 0 90px 30px rgba(232,182,98,.22);
  opacity:calc( (1 - var(--hp)) * var(--hp) * 4 );will-change:opacity}
/* zbukurim i vogël: teksti brenda ngrihet me hapjen */
.hap .inner{opacity:calc(.25 + var(--hp) * .75);
  transform:translateY(calc((1 - var(--hp)) * 26px));will-change:opacity,transform}

/* ---------- IRIS "HËNOR" — kornizat showcase çelen si hënë e plotë ---------- */
.showcase .frame .img{
  clip-path:circle(calc(var(--ir,1) * 82% + 16%) at 50% 44%);
  will-change:clip-path}
.showcase .frame::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  border-radius:inherit;
  background:radial-gradient(circle at 50% 44%,
    transparent calc(var(--ir,1) * 78% + 10%),
    rgba(232,182,98,calc((1 - var(--ir,1)) * .5)) calc(var(--ir,1) * 80% + 13%),
    transparent calc(var(--ir,1) * 84% + 18%));
  opacity:calc(1 - var(--ir,1) * .9)}

/* ---------- IRIS mbi imazhe të vetme (portrete, trëndafili, filxhanët) ---------- */
.irisrv{--ir:0}
.irisrv img{clip-path:circle(calc(var(--ir) * 78% + 14%) at 50% 46%);
  filter:brightness(calc(.55 + var(--ir) * .45)) saturate(calc(.6 + var(--ir) * .4));
  will-change:clip-path,filter;transition:none}

/* ---------- Reduced motion: gjithçka e hapur, fluturat të qeta ---------- */
@media (prefers-reduced-motion: reduce){
  .mflutur .mfly-in{animation:none;opacity:1}
  .mflutur .bfly,.mflutur .wl,.mflutur .wr,.mflutur .aura,
  .mflutur .core,.mflutur .shade{animation:none}
  .hap .porta{display:none}
  .hap .inner{opacity:1;transform:none}
  .showcase .frame .img{clip-path:none}
  .showcase .frame::after{display:none}
  .irisrv img{clip-path:none;filter:none}
}

/* ══════════════════════════════════════════════════════════════
   SHTESAT E REJA · v2
   ══════════════════════════════════════════════════════════════ */

/* ── PORTA E PRANIMIT ── */
#gate{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:20px;
  background:rgba(13,7,20,.72);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  opacity:0;transition:opacity .55s ease}
#gate.on{opacity:1}
body.gated{overflow:hidden}
#gate .gbox{position:relative;max-width:35em;width:100%;padding:clamp(30px,5vw,54px);
  background:linear-gradient(160deg,rgba(41,24,58,.985),rgba(22,13,32,.99));
  border:1px solid rgba(232,182,98,.42);border-radius:24px;text-align:center;
  box-shadow:0 30px 90px rgba(0,0,0,.65),0 0 0 1px rgba(255,255,255,.04) inset,
             0 0 80px rgba(166,120,224,.16) inset;
  transform:translateY(22px) scale(.97);transition:transform .6s cubic-bezier(.2,.9,.25,1.05)}
#gate .gbox p{color:#efe7fa;font-size:1.04rem}
#gate .gbox h2{font-size:clamp(1.7rem,4vw,2.3rem)}
#gate.on .gbox{transform:none}
#gate p{margin:.8em 0;line-height:1.65}
#gate .gbtns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:1.4em}
#gate .gsm{margin-top:1.3em;opacity:.72}
#gate .gbtn{position:relative;overflow:hidden;border-radius:999px;cursor:pointer;
  padding:1.02em 2.1em;border:1px solid rgba(232,182,98,.6);
  font-family:"Cinzel",serif;font-size:.86rem;letter-spacing:.12em;text-transform:uppercase;
  background:#241533;transition:transform .35s ease,box-shadow .45s ease,border-color .35s ease}
#gate .gbtn .krz{position:absolute;inset:0;background-size:cover;background-position:center;
  opacity:.9;transition:transform 1.2s ease}
#gate .gbtn .vel{position:absolute;inset:0;background:linear-gradient(160deg,rgba(20,10,30,.28),rgba(20,10,30,.55))}
#gate .gbtn .tx{position:relative;z-index:2;color:#fdf3dd;
  text-shadow:0 1px 3px rgba(10,4,18,.85),0 0 14px rgba(10,4,18,.6)}
#gate .gbtn.go{border-color:rgba(255,222,150,.85);
  box-shadow:0 0 22px rgba(232,182,98,.28),0 8px 26px rgba(0,0,0,.45)}
#gate .gbtn.go .tx{color:#fff6e2}
#gate .gbtn.jo{opacity:.88}
#gate .gbtn:hover{transform:translateY(-2px);border-color:rgba(255,228,170,.95);
  box-shadow:0 0 30px rgba(232,182,98,.45),0 10px 30px rgba(0,0,0,.5)}
#gate .gbtn:hover .krz{transform:scale(1.12)}
#gate .gbtn:active{transform:translateY(0) scale(.98)}}

/* ── FLUTURA · fluturimi bëhet me JS (Web Animations) ── */
.mflutur.sflight .wl{animation:mflapL .5s ease-in-out infinite 0s!important}
.mflutur.sflight .wr{animation:mflapR .5s ease-in-out infinite 0s!important}
.mflutur.uler .wl{animation:mflapL 1.7s ease-in-out infinite 0s!important}
.mflutur.uler .wr{animation:mflapR 1.7s ease-in-out infinite 0s!important}
.cbtn.thirrje .core{animation:thirrje 3.2s ease-in-out infinite}
@keyframes thirrje{0%,100%{box-shadow:0 0 0 rgba(232,182,98,0)}
  50%{box-shadow:0 0 26px rgba(232,182,98,.5)}}

/* ── STATUJA ── */
.statue{position:relative;padding:clamp(60px,10vw,130px) 20px;overflow:hidden;text-align:center}
.statue .st-wrap{position:relative;display:inline-block;max-width:min(78vw,430px)}
.statue .st-img{width:100%;display:block;opacity:0;transform:translateY(60px) scale(.94);
  transition:opacity 1.2s ease,transform 1.4s cubic-bezier(.16,.8,.3,1);
  filter:drop-shadow(0 34px 60px rgba(0,0,0,.55)) drop-shadow(0 0 46px rgba(232,182,98,.13));
  will-change:transform}
.statue.in .st-img{opacity:1;transform:none}
.statue .st-halo{position:absolute;inset:-14% -30%;z-index:-1;border-radius:50%;
  background:radial-gradient(closest-side,rgba(166,120,224,.24),rgba(232,182,98,.10) 55%,transparent 75%);
  opacity:0;transition:opacity 1.6s ease .3s}
.statue.in .st-halo{opacity:1}
.statue .st-sweep{position:absolute;inset:0;overflow:hidden;pointer-events:none;
  -webkit-mask-image:var(--stmask);mask-image:var(--stmask);
  -webkit-mask-size:contain;mask-size:contain;
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-position:center;mask-position:center}
.statue .st-sweep::after{content:"";position:absolute;top:-20%;bottom:-20%;width:34%;left:-50%;
  background:linear-gradient(78deg,transparent,rgba(255,236,190,.55),transparent);
  transform:skewX(-14deg)}
.statue.in .st-sweep::after{animation:rreze 2.2s ease .55s both}
@keyframes rreze{to{left:130%}}
.statue h2{margin-top:1.1em}
@media(prefers-reduced-motion:reduce){
  .mflutur.sflight,.mflutur.uler,.cbtn.thirrje .core,.statue.in .st-sweep::after{animation:none}
  .statue .st-img{opacity:1;transform:none;transition:none}
}

/* ── ZBULIME DY-DREJTIMËSHE ── */
.rv2{opacity:0;transform:translateY(34px);transition:opacity .9s ease,transform .95s cubic-bezier(.18,.8,.3,1)}
.rv2.in{opacity:1;transform:none}

/* ── FILXHANI · gota më të vogla, më elegante ── */
.cupgrid.two{grid-template-columns:1fr 1fr;max-width:760px;margin-inline:auto;gap:clamp(22px,4vw,52px)}
.cupgrid.two .cupbox{position:relative}
.cupgrid.two .cupbox img{max-width:270px;width:100%;margin-inline:auto;display:block;position:relative;z-index:2;
  animation:cupLundro 6.5s ease-in-out infinite;
  filter:drop-shadow(0 22px 34px rgba(0,0,0,.55)) drop-shadow(0 0 26px rgba(232,182,98,.18))}
.cupgrid.two .cupbox:nth-child(2) img{animation-delay:3.2s}
.cupgrid.two .cupbox .aura{position:absolute;left:50%;top:46%;width:120%;aspect-ratio:1;z-index:1;
  transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;
  background:radial-gradient(closest-side,rgba(232,182,98,.26),rgba(166,120,224,.12) 55%,transparent 75%);
  animation:cupDrite 5.2s ease-in-out infinite}
.cupgrid.two .cupbox:nth-child(2) .aura{animation-delay:2.6s}
@keyframes cupLundro{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-12px) rotate(-1.4deg)}}
@keyframes cupDrite{0%,100%{opacity:.55;transform:translate(-50%,-50%) scale(.94)}
  50%{opacity:1;transform:translate(-50%,-50%) scale(1.06)}}
@media(max-width:520px){.cupgrid.two .cupbox img{max-width:200px}}
@media(prefers-reduced-motion:reduce){.cupgrid.two .cupbox img,.cupgrid.two .cupbox .aura{animation:none}}

/* ── MEDALJONET me foto reale (kutia, busti) ── */
.medal img.obj{object-fit:contain}
.m-box img.obj,.m-full img.obj{width:74%;height:74%}
.m-box .ring{border-color:rgba(232,182,98,.55)}
.m-full .ring{border-color:rgba(230,226,245,.55)}

/* g3 me 6 karta: 3 kolona në desktop, 2 në tablet */
@media(min-width:640px) and (max-width:1019px){#tarotPacks.g3{grid-template-columns:repeat(2,1fr)}}

/* ══ RREGULLIMET v5 ══ */

/* teksti i "showcase" jo më si kolonë e hollë */
.showcase .cap > div{max-width:min(46ch,88vw)}

/* germat script nuk mbulohen më nga rreshti poshtë */
.lock .l1{line-height:1.16;padding-bottom:.12em}
.lock .l2{margin-top:.04em}
h1 .script,h2 .script{line-height:1.28;display:inline-block;padding-bottom:.08em}
.maskin{padding-bottom:.14em;margin-bottom:-.14em}

/* statuja pak më poshtë, me frymëmarrje */
.statue{padding-top:clamp(90px,13vw,170px)}
.statue .st-wrap{margin-top:clamp(16px,4vw,44px)}
.statue h2{margin-top:1.35em}

/* filxhanët: pa hapësirë boshe, flutura përreth */
.cupgrid.two .cupbox{aspect-ratio:auto;padding:2.4rem 0 1.2rem}
.cupgrid.two{position:relative;padding:1rem 0 2rem}
.minib{position:absolute;width:clamp(40px,5vw,62px);z-index:4;pointer-events:none;
  filter:drop-shadow(0 6px 10px rgba(8,3,16,.5))}
.minib img{position:absolute;inset:0;width:100%;display:block}
.minib .b{position:relative}
.minib .w{transform-origin:50% 50%}
.minib .wl{animation:mflapL 1.1s ease-in-out infinite}
.minib .wr{animation:mflapR 1.1s ease-in-out infinite}
.mb1{left:6%;top:-4%;animation:mbOrb1 11s ease-in-out infinite}
.mb2{right:8%;top:22%;animation:mbOrb2 13s ease-in-out infinite 1.2s}
.mb3{left:44%;bottom:-6%;animation:mbOrb3 12s ease-in-out infinite 2.4s}
@keyframes mbOrb1{0%,100%{transform:translate(0,0) rotate(-8deg)}
  33%{transform:translate(26px,-20px) rotate(6deg)}66%{transform:translate(-14px,-32px) rotate(-4deg)}}
@keyframes mbOrb2{0%,100%{transform:translate(0,0) rotate(7deg)}
  40%{transform:translate(-30px,22px) rotate(-6deg)}75%{transform:translate(18px,-16px) rotate(9deg)}}
@keyframes mbOrb3{0%,100%{transform:translate(0,0) rotate(-5deg)}
  30%{transform:translate(22px,-26px) rotate(8deg)}65%{transform:translate(-26px,-10px) rotate(-9deg)}}
@media(max-width:520px){.mb2{right:2%}.mb1{left:2%}}
@media(prefers-reduced-motion:reduce){.minib,.minib .w{animation:none}}

/* ══ PORTA v6 — gjuha, linjat, butonat e barabartë ══ */
#gate .glang{position:absolute;top:16px;right:20px;display:flex;align-items:center;gap:8px;
  font-family:"Cinzel",serif;font-size:.74rem;letter-spacing:.1em}
#gate .glang i{color:rgba(232,182,98,.55);font-style:normal}
#gate .glang button{background:none;border:none;cursor:pointer;padding:4px 2px;
  color:rgba(238,228,250,.62);letter-spacing:.1em;font-family:inherit;font-size:inherit;
  border-bottom:1px solid transparent;transition:color .3s,border-color .3s}
#gate .glang button.on{color:#f2d9a4;border-bottom-color:rgba(232,182,98,.75)}
#gate .glang button:hover{color:#ffe9bd}
#gate .gbox p{text-wrap:pretty;max-width:33em;margin-inline:auto}
#gate .gbtns{align-items:stretch}
#gate .gbtn{min-height:3.4em;display:inline-flex;align-items:center;justify-content:center}
#gate .gbtn.go{min-width:min(64vw,270px)}
#gate .gbtn.jo{min-width:132px}
@media(max-width:560px){
  #gate .gbtns{flex-direction:column}
  #gate .gbtn.go,#gate .gbtn.jo{width:100%;min-width:0}
  #gate .glang{position:static;justify-content:center;margin-bottom:10px}
}

/* ══ v7 ══ */

/* statuja e altarit pak më poshtë; karta nuk pritet më */
.altar .fix .st{margin-top:7vh}
.altar .fix .halo{margin-top:7vh}
.altar{height:350vh}
.altar .words{padding:30vh 0 46vh}

/* flutura e kryefaqes: cikli i frymëmarrjes */
.mflutur.uler.gjalle .wl{animation-duration:.55s!important}
.mflutur.uler.gjalle .wr{animation-duration:.55s!important}

/* filxhanët: më të mëdhenj, më larg, pa hapësirë boshe */
.cupgrid.two{max-width:1000px;gap:clamp(40px,8vw,130px);padding:.6rem 0 1.2rem}
.cupgrid.two .cupbox{padding:1.6rem 0 1rem}
.cupgrid.two .cupbox img{max-width:340px}
@media(max-width:560px){.cupgrid.two{gap:26px}.cupgrid.two .cupbox img{max-width:220px}}

/* fluturat te filxhanët: rrahje e vazhdueshme, e dukshme, jo e shpejtë */
.minib{perspective:520px}
.minib .wl{transform-origin:49.97% 50%;animation:mflapL 1s ease-in-out infinite}
.minib .wr{transform-origin:49.97% 50%;animation:mflapR 1s ease-in-out infinite}
.mb1{top:2%}.mb2{top:30%}.mb3{bottom:-2%}
@media(prefers-reduced-motion:reduce){.minib .wl,.minib .wr{animation:none}}

/* ══ v8 — porta, tableta, telefonat ══ */
#gate .gck{margin-top:.55em;opacity:.6;font-size:.8rem}
#gate .gbtn:focus{outline:none}
#gate .gbtn:focus-visible{outline:2px solid rgba(255,228,170,.9);outline-offset:3px}
#gate .glang{top:18px;right:22px}
#gate .glang button{padding:4px 3px 6px}
#gate .gbox{max-height:92svh;overflow:auto;scrollbar-width:thin}

/* krahët e fluturave te filxhanët — kënd i dukshëm, kurrë shirit */
@keyframes minibFlapL{0%,100%{transform:rotateY(6deg)}50%{transform:rotateY(58deg)}}
@keyframes minibFlapR{0%,100%{transform:rotateY(-6deg)}50%{transform:rotateY(-58deg)}}
.minib .wl{animation:minibFlapL 1s ease-in-out infinite!important}
.minib .wr{animation:minibFlapR 1s ease-in-out infinite!important}

/* tableta: menyja në një rresht, pa shtypje */
@media(min-width:761px) and (max-width:1280px){
  header nav{gap:clamp(8px,1.5vw,20px)}
  header nav a{font-size:.8rem;letter-spacing:.07em}
  .head-cta{transform:scale(.92)}
}
@media(max-width:900px){
  .statue .st-wrap{max-width:min(70vw,360px)}
  .altar .fix .st{height:46vh;margin-top:5vh}
}
@media(max-width:560px){
  #gate .gbox{padding:26px 18px}
  #gate .gbox p{font-size:.98rem}
  .cupgrid.two{grid-template-columns:1fr}
  .cupgrid.two .cupbox img{max-width:250px}
}

/* ══ v9 — vija e artë simetrike te porta, germat script me frymë ══ */
#gate .rule{display:flex;align-items:center;justify-content:center;gap:16px;border:none}
#gate .rule::before,#gate .rule::after{content:"";height:1px;flex:0 0 min(120px,24%)}
#gate .rule::before{background:linear-gradient(90deg,transparent,rgba(232,182,98,.75))}
#gate .rule::after{background:linear-gradient(270deg,transparent,rgba(232,182,98,.75))}
.lock .l1{padding-bottom:.18em}
.wm{display:inline-block;padding-bottom:.14em}
.script{line-height:1.32}

/* ══ xixat e arta rreth statujës ══ */
.statue .xixa{position:absolute;color:#f2d9a4;pointer-events:none;z-index:3;
  text-shadow:0 0 10px rgba(232,182,98,.9);animation:xixon 3.6s ease-in-out infinite;opacity:0}
.statue.in .xixa{opacity:1}
.x1{top:6%;left:-8%;font-size:15px}
.x2{top:22%;right:-10%;font-size:11px;animation-delay:.8s}
.x3{top:52%;left:-13%;font-size:12px;animation-delay:1.6s}
.x4{bottom:18%;right:-7%;font-size:16px;animation-delay:2.3s}
.x5{top:-4%;right:14%;font-size:10px;animation-delay:3s}
@keyframes xixon{0%,100%{opacity:.15;transform:scale(.8) rotate(0)}
  50%{opacity:1;transform:scale(1.25) rotate(20deg)}}
@media(prefers-reduced-motion:reduce){.statue .xixa{animation:none;opacity:.6}}

/* ══ F-ja e Afërditës — hapësirë lart e poshtë për germat script, kudo ══ */
.lock .l2{padding-top:.16em;margin-top:-.05em;padding-bottom:.18em}
h1 .script,h2 .script,.wm,.l1,.l2{line-height:1.34}
.maskin{padding-top:.13em;margin-top:-.13em}
.wm{padding-top:.1em}

/* ══ Kodi i porosisë — i dukshëm + butoni Kopjo ══ */
.oidwrap{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;margin:.4em 0 1.5em}
#done .oid{color:#f2d9a4!important;-webkit-text-fill-color:#f2d9a4!important;background:rgba(14,7,22,.55)!important;
  text-shadow:0 0 18px rgba(232,182,98,.35);margin:0}
.oidcopy{font-family:'Cinzel',serif;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;
  color:#f2d9a4;background:rgba(232,182,98,.1);border:1px solid rgba(232,182,98,.5);
  border-radius:999px;padding:.68em 1.3em;cursor:pointer;transition:all .3s ease}
.oidcopy:hover{background:rgba(232,182,98,.22);border-color:rgba(255,222,150,.9);transform:translateY(-1px)}
.oidcopy.ok{background:rgba(232,182,98,.35);color:#fff6e2}

/* ══ Butoni gjatë dërgimit ══ */
.btn.duke{opacity:.72;cursor:wait;pointer-events:none;position:relative}
.btn.duke span{animation:dukePuls 1.1s ease-in-out infinite}
@keyframes dukePuls{0%,100%{opacity:.6}50%{opacity:1}}
.btn:disabled{opacity:.72;cursor:not-allowed}

/* ══ Hapësirë në fund të seksioneve me tekst të gjatë ══ */
.showcase .cap{padding-bottom:clamp(30px,6vw,70px)}
.showcase .cap > div{max-width:min(52ch,90vw)}
.showcase p.lede{font-size:clamp(1.02rem,.5vw + .9rem,1.24rem);line-height:1.72}
#done, .sec:last-of-type{padding-bottom:clamp(40px,7vw,90px)}

/* ══ Data e lindjes — DD / MM / VVVV ══ */
.datbox{display:flex;align-items:flex-end;gap:8px}
.datbox i{font-style:normal;color:rgba(232,182,98,.6);font-size:1.3rem;padding-bottom:.62em}
.datf{display:flex;flex-direction:column;gap:4px;flex:0 0 4.6em}
.datf.datv{flex:0 0 6.4em}
.datl{font-family:'Cinzel',serif;font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;
  color:rgba(232,182,98,.72);padding-left:.2em}
.datbox input{width:100%;text-align:center;letter-spacing:.12em;font-variant-numeric:tabular-nums}
.datbox input.gab{border-color:rgba(220,90,90,.8);box-shadow:0 0 0 2px rgba(220,90,90,.18)}

/* ══ hCaptcha ══ */
.hcap{display:flex;justify-content:center;margin:1.4rem 0 1rem}
.hcap iframe{border-radius:10px}
@media(max-width:400px){.hcap{transform:scale(.88);transform-origin:center}}

/* ══════════════════════════════════════════════════════
   TELEFONI — rregullime pamjeje (nuk prek desktopin)
   ══════════════════════════════════════════════════════ */
@media(max-width:720px){

  /* asnjë shirit i bardhë anash */
  html,body{overflow-x:hidden;max-width:100%}
  section,header,footer,.wrap,.sec{max-width:100%;overflow-x:clip}
  img,video,iframe,canvas{max-width:100%;height:auto}

  /* flutura më e vogël dhe pa dalë jashtë */
  .mflutur{width:56px}

  /* hero: tituj që nuk dalin jashtë */
  .lock .l1,.lock .l2{font-size:clamp(2.1rem,13vw,3.6rem);line-height:1.2}
  .hero .sub{font-size:.72rem;letter-spacing:.28em}
  .hero .lede{font-size:1.02rem;line-height:1.62;padding:0 4px}

  /* butonat e hero-s njëri poshtë tjetrit, gjerësi e plotë */
  .cta-row{flex-direction:column;gap:12px;width:100%;align-items:stretch}
  .cta-row .cbtn,.cta-row .btn{width:100%}
  .marks{flex-direction:column;gap:8px;font-size:.68rem}

  /* seksionet: hapësirë e njëtrajtshme */
  .sec{padding-left:18px;padding-right:18px}
  .showcase .cap{padding:34px 20px 46px}
  .showcase .cap > div{max-width:100%}

  /* kartat e paketave */
  .pack{padding:2.2rem 1.4rem 1.8rem}
  .pack .pp{font-size:2.6rem}

  /* tabela e porosisë */
  .rowline{grid-template-columns:1fr auto;gap:6px}
  .rowline .c2{grid-column:1/-1;font-size:.82rem;opacity:.8}

  /* formulari: fusha të mëdha sa gishti */
  .frm input,.frm select,.frm textarea{font-size:16px;padding:.86em .9em}
  .datbox{gap:6px}
  .datf{flex:1 1 0}
  .datf.datv{flex:1.4 1 0}

  /* porta e pranimit */
  #gate .gbox{padding:24px 16px;border-radius:18px}
  #gate .gbox h2{font-size:1.5rem}
  #gate .gbox p{font-size:.95rem;line-height:1.6}

  /* kartela e mbarimit */
  #done .oid{font-size:1.02rem;letter-spacing:.1em;padding:.7em 1em}
  .oidwrap{gap:10px}

  /* footer */
  footer .cols{grid-template-columns:1fr;gap:26px;text-align:center}
  footer .cols ul{padding:0}
}

/* ekrane shumë të vogla */
@media(max-width:380px){
  .lock .l1,.lock .l2{font-size:clamp(1.9rem,12vw,2.8rem)}
  .mflutur{width:48px}
  .pack .pp{font-size:2.2rem}
  #gate .gbox{padding:20px 13px}
}

/* ══ Rregullime pamjeje — telefon (parë me sy) ══ */
@media(max-width:720px){
  /* flutura kurrë mbi menynë */
  header{z-index:60}
  .mflutur{z-index:4}

  /* "TË PRET" të mos thyhet shëmtueshëm */
  .lock .l2,.hero .capsline,.lock .l3{letter-spacing:.10em !important;
    font-size:clamp(1.55rem,8.4vw,2.4rem) !important;
    white-space:normal;word-break:normal;overflow-wrap:break-word;
    max-width:100%;padding-left:6px;padding-right:6px}
  .hero .caps{letter-spacing:.10em;max-width:100%}
  .lock{max-width:100%;overflow:hidden}

  /* hapësirë nën hero që butonat të mos ngjiten */
  .hero .cta-row{margin-top:26px}
}

/* ═══════════════════════════════════════════════════════════════
   RREGULLIME v51 — VETËM TELEFONI (desktop-i NUK preket)
   Bazuar në 13 screenshot-et e 5 gushtit 2026
   ═══════════════════════════════════════════════════════════════ */

/* ── 1 · TOAST-i (pilula vjollcë që dilte te fundi i ekranit) ──
   Gabimi: translate(150%) s'e fshihte dot kur toast-i dilte në
   dy rreshta (telefon). Tani është i PADUKSHËM derisa të thirret.
   Në desktop s'ndryshon asgjë — ai gjithsesi rrinte i fshehur.  */
#toast{visibility:hidden;opacity:0;
  transition:transform .6s cubic-bezier(.2,.9,.3,1.1),opacity .45s ease,visibility 0s .6s}
#toast.on{visibility:visible;opacity:1;transition:transform .6s cubic-bezier(.2,.9,.3,1.1),opacity .3s ease}

@media(max-width:768px){

  /* ── 2 · FLUTURA — kurrë më e prerë në cep, kurrë mbi logon ──
     Ulet e qetë djathtas, poshtë kokës së faqes, brenda ekranit.
     !important mund të mposhtë edhe stilet inline të JS-së.      */
  .mflutur{left:auto !important;right:14px !important;top:88px !important;
    width:46px !important;z-index:4}
  .mflutur .mfly-in{animation:none;opacity:1}         /* pa fluturim hyrës nëpër ekran */
  .mflutur .aura{inset:-22%;filter:blur(10px)}
  header{z-index:88}

  /* ── 3 · PETALET — më pak, më të vogla, PAS tekstit ── */
  #petals{z-index:1;opacity:.55}
  #petals img{max-width:30px !important;filter:drop-shadow(0 2px 6px rgba(0,0,0,.3))}

  /* ── 4 · "ZBRIT" — hiqet në telefon (përplasej me ✦-listën) ── */
  .cue{display:none}

  /* ── 5 · SEKSIONET E ÇELËTA (mëndafshi i argjendtë te
     «Si funksionon» / «Aplikimi është falas») — velloja forcohet
     dhe teksti merr hije, që të lexohet mbi çdo sfond të ndritshëm */
  .bgsec .bgw .veil{background:
    linear-gradient(180deg,rgba(18,9,28,.82),rgba(18,9,28,.58) 26%,
      rgba(18,9,28,.58) 74%,rgba(18,9,28,.84)),
    rgba(18,9,28,var(--veil))}
  .bgsec p,.bgsec li,.bgsec h2,.bgsec h3,.bgsec .lede,.bgsec .small{
    text-shadow:0 1px 3px rgba(10,4,18,.85),0 4px 18px rgba(10,4,18,.65)}
  .bgsec .gold{filter:drop-shadow(0 2px 10px rgba(10,4,18,.9))}
  .hero .veil::after{content:"";position:absolute;inset:0;background:rgba(18,9,28,.14)}
  .hero .lede,.hero .wordmark,.lock{text-shadow:0 1px 3px rgba(10,4,18,.7),0 4px 16px rgba(10,4,18,.5)}

  /* ── 6 · Teksti të mos e prekë buzën e ekranit ── */
  .hero .lede{padding:0 12px}
  .narrow,.wrap{width:min(1240px,100vw - 36px)}

  /* ── 7 · Butoni «Apliko për lexim» te menyja — teksti brenda pilulës ── */
  #drawer .cbtn{padding:1.05em 2.1em;max-width:86vw}
  #drawer .cbtn .txt{font-size:.98rem;letter-spacing:.07em;white-space:nowrap}

  /* ── 8 · ✦-lista e hero-s: e qendërzuar, me frymëmarrje,
       dhe hero-ja merr pak hapësirë poshtë që asgjë të mos puqet ── */
  .marks{align-items:center;text-align:center;margin-top:2em}
  .hero{padding-bottom:clamp(70px,10vh,110px)}
}

/* ekrane shumë të vogla */
@media(max-width:380px){
  .mflutur{width:40px !important;top:80px !important}
}

/* ═══════════════════════════════════════════════════════════════
   RREGULLIME v52 — TELEFON + TABLET (nën 1060px)
   Desktop-i (1060px e sipër, ku del menyja e plotë) NUK preket.
   ═══════════════════════════════════════════════════════════════ */
@media(max-width:1059px){

  /* ── 1 · KOKA E FAQES: butoni «Apliko» kthehet, gjithçka kompakte ──
     Radha: hëna e artë · Apliko · SQ/EN · menuja  */
  header .hact{gap:.45rem}
  header .hact .cbtn.head-cta{display:inline-flex !important;
    padding:.62em 1.15em;margin:0}
  header .hact .cbtn.head-cta .txt{font-size:.86rem;letter-spacing:.05em;white-space:nowrap}
  header .hact .langbtn{padding:.5em .75em;font-size:.72rem;letter-spacing:.1em;gap:.35em}
  header .brand .glyph{font-size:1.35rem}

  /* ── 2 · FLUTURA: e qetë, brenda ekranit, kurrë mbi logon ── */
  .mflutur{left:auto !important;right:14px !important;top:86px !important;
    width:46px !important;z-index:4}
  .mflutur .mfly-in{animation:none;opacity:1}
  .mflutur .aura{inset:-22%;filter:blur(10px)}

  /* ── 3 · «ZBRIT» hiqet — përplasej me listën ✦ ── */
  .cue{display:none !important}

  /* ── 4 · FRESKORJA E LETRAVE: e hapur që në fillim,
     pa «ngjitjen» 230vh që linte vetëm një drejtkëndësh jeshil ── */
  .fanwrap{height:auto;padding:clamp(46px,7vw,90px) 0}
  .fanpin{position:static;height:auto;display:grid;place-items:center}
  .fan{width:min(480px,88vw)}
  .fan::after{opacity:.8}

  /* ── 5 · SEKSIONET MBI FOTO TË ÇELËTA (mermer rozë «Vendi bëhet
     i yti», mëndafsh i argjendtë etj.) — vello më e fortë + hije ── */
  .hap.light .scrim{background:
    radial-gradient(ellipse 78% 66% at 50% 50%,rgba(24,12,34,.72),rgba(24,12,34,.42) 64%,rgba(24,12,34,.18) 84%),
    linear-gradient(180deg,rgba(24,12,34,.55),rgba(24,12,34,.16) 24%,rgba(24,12,34,.16) 76%,rgba(24,12,34,.6))}
  .hap p,.hap li,.hap h2,.hap h3,.hap .lede,.hap .small,.hap .mark{
    text-shadow:0 1px 3px rgba(10,4,18,.9),0 4px 20px rgba(10,4,18,.7)}
  .hap .gold,.hap .rr{filter:drop-shadow(0 2px 12px rgba(10,4,18,.95))}
  .bgsec .bgw .veil{background:
    linear-gradient(180deg,rgba(18,9,28,.82),rgba(18,9,28,.58) 26%,
      rgba(18,9,28,.58) 74%,rgba(18,9,28,.84)),
    rgba(18,9,28,var(--veil))}
  .bgsec p,.bgsec li,.bgsec h2,.bgsec h3,.bgsec .lede,.bgsec .small{
    text-shadow:0 1px 3px rgba(10,4,18,.85),0 4px 18px rgba(10,4,18,.65)}
  .bgsec .gold{filter:drop-shadow(0 2px 10px rgba(10,4,18,.9))}
}

/* telefonat e ngushtë: që të katërta elementet e kokës të nxënë ── */
@media(max-width:420px){
  header .hact{gap:.35rem}
  header .hact .cbtn.head-cta{padding:.56em .9em}
  header .hact .cbtn.head-cta .txt{font-size:.78rem}
  header .hact .langbtn{padding:.46em .6em;font-size:.66rem}
  header .brand .glyph{font-size:1.2rem}
  .burger b{width:24px}
}

/* ═══════════════════════════════════════════════════════════════
   RREGULLIME v53
   ═══════════════════════════════════════════════════════════════ */

/* ── GLOBALE (të sigurta, pa ndryshim pamjeje në desktop) ── */

/* Faqja deklarohet «e errët» — ndalon browser-at (Gmail WebView,
   Samsung Internet me «dark mode» të detyruar) të na i kthejnë
   ngjyrat e arta në të kuqe/kafe. */
:root{color-scheme:dark}

/* SVG-hëna e kokës: e fshehur në desktop (aty punon shkronja) */
.brand .gsvg{display:none}
.astro .ssvg{display:none}

/* Kapaku i showcase-it: pak më i gjerë e me shkronja pakëz më të
   vogla, që lista 1–6 te «Kur e hap videon» të mos pritet as në
   desktop me dritare të shkurtër (defekti që vure re në Chrome). */
.showcase .cap > div{max-width:min(30em,94%)}
.showcase .cap .lede{font-size:clamp(1rem,.55vw + .92rem,1.3rem);line-height:1.58}

/* ── TELEFON + TABLET (nën 1060px) ── */
@media(max-width:1059px){

  /* 1 · LOGOJA: Samsung-u e kthen shkronjën ☾ në emoji vjollcë
     dhe gradienti mbetet katror ari. Në telefon shkronja fshihet
     dhe del hëna SVG e artë — identike me atë të desktop-it. */
  .brand .glyph{display:none}
  .brand .gsvg{display:block;width:22px;height:22px}

  /* 2 · Butoni i gjuhës: pa hënëz — thjesht SQ/EN, i pastër */
  .langbtn .lmoon{display:none}

  /* 3 · Ikona e Hënës te Dielli/Hëna/Ashendenti: SVG në vend
     të emoji-t vjollcë */
  .astro .s .schar{display:none}
  .astro .s .ssvg{display:block;width:1.15rem;height:1.15rem}

  /* 4 · SHOWCASE → kartë e qetë me foto: pa «ngjitje» 160vh,
     pa prerje teksti KURRË — korniza rritet me përmbajtjen */
  .showcase{height:auto}
  .showcase .stick{position:static;height:auto;display:block;padding:0 16px}
  .showcase .frame{--sx:1;--sy:1;--ir:1;position:relative;width:100%;height:auto;
    min-height:0;border-radius:22px;overflow:hidden}
  .showcase .frame > *{transform:none}
  .showcase .frame > .img{transform:none;scale:1;clip-path:none !important;
    position:absolute;inset:0}
  .showcase .frame .veil{opacity:1;
    background:linear-gradient(180deg,rgba(18,9,28,.72),rgba(18,9,28,.5) 30%,
      rgba(18,9,28,.5) 70%,rgba(18,9,28,.78))}
  .showcase .cap{position:relative;inset:auto;pointer-events:auto;
    padding:clamp(30px,7vw,48px) 20px;min-height:46svh;place-items:center}
  .showcase .cap > div{opacity:1 !important;transform:none !important;max-width:100%}
  .showcase .cap p,.showcase .cap h2{text-shadow:0 1px 3px rgba(10,4,18,.9),
    0 4px 18px rgba(10,4,18,.7)}

  /* 5 · ZBULIMET (reveal): në telefon gjithçka e dukshme MENJËHERË —
     asnjë titull a paragraf s'mbetet kurrë gjysmë i fshehur */
  .rv{opacity:1 !important;transform:none !important}
  .rv.blur{filter:none !important}
  .wipe > span{transform:none !important}
  .draw{width:100% !important}

  /* 6 · BUTONAT E VENITUR (guri i bardhë i mermerit i zbehte):
     velloja e brendshme forcohet dhe ari merr hije — çdo buton
     lexohet mbi çdo kristal */
  .cbtn .dim{background:rgba(22,11,32,.74)}
  .cbtn .txt{filter:drop-shadow(0 1px 5px rgba(12,6,20,.95))
             drop-shadow(0 3px 12px rgba(12,6,20,.7))}
}

/* v53b · maska «maskUp» e titujve (animacion scroll-driven):
   Samsung Internet e lë ndonjëherë përgjysmë → titulli pritej
   («Letrat ose filxhani»). Në telefon/tablet hiqet fare. */
@media(max-width:1059px){
  .maskin{-webkit-mask-image:none !important;mask-image:none !important;
    animation:none !important}
}

/* ═══ v54 ═══ */
/* «ZBRIT» hiqet KUDO — edhe në desktop (përplasej me listën ✦) */
.cue{display:none !important}
/* hëna SVG: e fshehur inline në HTML (që të mos dalin kurrë dy hëna
   as me CSS të vjetër në cache); në telefon/tablet shfaqet me forcë */
@media(max-width:1059px){
  .brand .glyph{display:none !important}
  .brand .gsvg{display:block !important;width:22px;height:22px}
}

/* ═══ v55 · telefon/tablet: dyert dhe iriset gjithmonë të hapura
   (rrjetë sigurie edhe në CSS, përveç JS-së) ═══ */
@media(max-width:1059px){
  .hap{--hp:1 !important}
  .hap .porta{display:none !important}
  .hap .inner{opacity:1 !important;transform:none !important}
  .irisrv,.showcase .frame{--ir:1 !important}
}

/* ═══ v56 · telefon/tablet: butonat në qendër, simetrikë ═══ */
@media(max-width:1059px){
  .cta-row{justify-content:center}
  .card .cbtn,.card .btn,form .btn,#send,.paketa .cbtn,.pack .cbtn{
    display:flex;margin-left:auto;margin-right:auto}
  button.btn,a.btn{text-align:center;justify-content:center}
  .hcap{justify-content:center;margin:1.6rem auto 1.2rem;width:100%}
  .form-actions,.frow-actions{display:grid;place-items:center}
  .narrow > .cbtn,.wrap > .cbtn{margin-left:auto;margin-right:auto}
}

/* ═══ v57 · .static-show — showcase si kartë e qetë NË ÇDO EKRAN
   (lista 1–6 te «Si funksionon» s'mbulohet kurrë, as në desktop) ═══ */
.showcase.static-show{height:auto}
.showcase.static-show .stick{position:static;height:auto;display:block;
  padding:clamp(20px,4vw,60px) 16px}
.showcase.static-show .frame{--sx:1;--sy:1;--ir:1 !important;position:relative;
  width:min(1100px,94vw);margin:0 auto;height:auto;min-height:0;
  border-radius:26px;overflow:hidden}
.showcase.static-show .frame > *{transform:none}
.showcase.static-show .frame > .img{transform:none;scale:1;
  clip-path:none !important;position:absolute;inset:0}
.showcase.static-show .frame .veil{opacity:1;
  background:linear-gradient(180deg,rgba(18,9,28,.74),rgba(18,9,28,.52) 28%,
    rgba(18,9,28,.52) 72%,rgba(18,9,28,.8))}
.showcase.static-show .cap{position:relative;inset:auto;pointer-events:auto;
  padding:clamp(36px,6vw,72px) clamp(18px,4vw,56px);min-height:52svh;
  place-items:center}
.showcase.static-show .cap > div{opacity:1 !important;transform:none !important}
.showcase.static-show .cap p,.showcase.static-show .cap h2{
  text-shadow:0 1px 3px rgba(10,4,18,.85),0 4px 18px rgba(10,4,18,.6)}

/* ═══ v57b · Ikona e HËNËS te Dielli/Hëna/Ashendenti — hëna SVG
   e pastër KUDO (desktop + telefon): gjysmëhënë e errët elegante
   mbi rrethin e artë, si motrat e saj Dielli dhe Ashendenti ═══ */
.astro .s .ssvg{display:block;width:1.05rem;height:1.05rem;margin:auto}

/* ═══ v58b · Shënimi «një çast durim» nën butonin Dërgo ═══ */
.prit-note{margin:1.2rem auto 0;max-width:34em;text-align:center;
  font-size:.95rem;line-height:1.6;color:#cdbfa8;
  padding:.85em 1.2em;border:1px solid rgba(232,182,98,.28);border-radius:14px;
  background:linear-gradient(180deg,rgba(232,182,98,.07),rgba(232,182,98,.03))}
.prit-note b{color:var(--gold,#e8b662);font-weight:600}
@media(max-width:1059px){
  .prit-note{font-size:.9rem;margin:1.1rem auto 0;max-width:92%}
}

/* ═══ v60 · kartat e dy videove udhëzuese (desktop + telefon) ═══ */
.vguida{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2.6vw,34px);
  margin:clamp(26px,4vw,46px) auto}
.vgcard{position:relative;display:block;border-radius:18px;overflow:hidden;
  border:1px solid rgba(232,182,98,.4);box-shadow:0 18px 50px rgba(10,4,18,.5);
  transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease}
.vgcard:hover{transform:translateY(-5px);border-color:rgba(232,182,98,.85);
  box-shadow:0 26px 70px rgba(10,4,18,.65),0 0 40px rgba(232,182,98,.18)}
.vgcard img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;
  transition:transform .6s ease}
.vgcard:hover img{transform:scale(1.035)}
.vgplay{position:absolute;top:50%;left:50%;transform:translate(-50%,-58%);
  width:clamp(52px,6vw,70px);height:clamp(52px,6vw,70px);border-radius:50%;
  display:grid;place-items:center;font-size:clamp(1.1rem,1.8vw,1.5rem);
  color:#1c1026;background:radial-gradient(circle at 32% 28%,#fdf2d8,#e8b662 62%,#c9963f);
  box-shadow:0 8px 26px rgba(10,4,18,.55),0 0 30px rgba(232,182,98,.4);
  transition:transform .35s ease;padding-left:4px}
.vgcard:hover .vgplay{transform:translate(-50%,-58%) scale(1.12)}
.vgcap{position:absolute;left:0;right:0;bottom:0;padding:.9em 1.1em;
  font-family:Cinzel,serif;font-size:clamp(.72rem,1vw,.92rem);letter-spacing:.14em;
  color:var(--cream,#f3e7d3);text-transform:uppercase;
  background:linear-gradient(180deg,transparent,rgba(10,4,16,.9));
  text-shadow:0 1px 4px rgba(10,4,16,.9)}
@media(max-width:760px){.vguida{grid-template-columns:1fr;gap:18px}}

/* ═══ v61 · kartat e videove — të pathyeshme edhe pa imazhe ═══ */
.vglede{text-align:center;max-width:44em;margin:1.4em auto .2em}
.vgcard{min-height:200px;
  background:radial-gradient(120% 120% at 30% 20%,#2c1943,#150c1e 70%)}
.vgcard::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(60% 60% at 50% 42%,rgba(232,182,98,.12),transparent 70%)}
@media(max-width:760px){.vgcard{min-height:190px}}

/* ═══ v63 · shënimi mbi pyetjet e formularit ═══ */
.formnote{margin:0 0 1.4rem;padding:.95em 1.2em;line-height:1.65;color:#d9cbb4;
  border-left:2px solid rgba(232,182,98,.55);border-radius:0 12px 12px 0;
  background:linear-gradient(90deg,rgba(232,182,98,.07),transparent 80%)}
.formnote b{color:var(--gold,#e8b662)}


/* ═══ v70 · ora e lindjes — vetëm dy kuti si data ═══ */
#oraH,#oraM{text-align:center;letter-spacing:.08em}

/* ═══ v75 · pyetja e pashkruar — kornizë kuqe e butë ═══ */
textarea.mungon{border-color:#c0392b!important;box-shadow:0 0 0 3px rgba(192,57,43,.18)}