/* =====================================================================
   ANIMECITY × KINOEBI INN — ჩატვირთვის ინტრო + "რომელი დიზაინი მოგწონს?" პოპაპი
   იტვირთება <head>-ში (render-blocking განზრახ: საიტი ინტროს გარეშე არ უნდა აციმციმდეს).
   ფაილები: css/intro.css + js/intro.js · კონფიგი: main.tpl-ის <head>-ში (window.ACI)
   ===================================================================== */

.aci,.aciv,.aci-toast{font-family:'FiraGO','Segoe UI',system-ui,sans-serif}

/* ---------- ინტრო: ნაგულისხმევად დამალულია (JS-გარეშე / ბოტებისთვის) ---------- */
#acIntro{display:none}
html.ac-intro-on #acIntro{display:flex}
html.ac-intro-on,html.ac-intro-on body{overflow:hidden!important}

#acIntro{
  --D:clamp(120px,26vmin,200px);        /* რგოლის დიამეტრი */
  --far:min(46vw,420px);                /* საიდან შემოფრინდებიან */
  --sep:calc(var(--D)*.68);             /* ცენტრებს შორის მანძილი (გადაფარვა ≈32%) */
  --lav:#b79cff;--pink:#ff8ac2;--amb:#ffb86b;--cor:#ff7a59;
  position:fixed;inset:0;z-index:10000;flex-direction:column;align-items:center;justify-content:center;
  background:#0b0418;color:#f5f0ff;overflow:hidden;
}

/* ფონი: ორი ფერადი ნისლი + ვარსკვლავები */
.aci-bg{position:absolute;inset:0;pointer-events:none}
.aci-glow{position:absolute;width:70vmax;height:70vmax;border-radius:50%;filter:blur(60px);opacity:0;animation:aciGlowIn 1.6s ease .1s forwards}
.aci-glow--a{left:-30vmax;top:-10vmax;background:radial-gradient(circle,rgba(157,123,255,.38),transparent 62%)}
.aci-glow--b{right:-30vmax;bottom:-18vmax;background:radial-gradient(circle,rgba(255,140,80,.26),transparent 62%);animation-delay:.3s}
.aci-stars{position:absolute;inset:0}
.aci-stars i{position:absolute;width:2px;height:2px;border-radius:50%;background:#fff;opacity:0;animation:aciTw 3.2s ease-in-out infinite}
@keyframes aciGlowIn{to{opacity:1}}
@keyframes aciTw{0%,100%{opacity:0;transform:scale(.6)}50%{opacity:.85;transform:scale(1.4)}}

/* სცენა */
.aci-stage{position:relative;width:min(92vw,760px);height:calc(var(--D)*1.9);margin-bottom:calc(var(--D)*.42 + 14px);isolation:isolate}

/* რგოლები */
.aci-orb{position:absolute;left:50%;top:50%;width:var(--D);height:var(--D);margin:calc(var(--D)/-2) 0 0 calc(var(--D)/-2);z-index:1;opacity:0;will-change:transform,opacity}
.aci-orb::before{content:"";position:absolute;inset:0;border-radius:50%;
  background:radial-gradient(circle at 32% 28%,rgba(255,255,255,.26),transparent 52%),var(--fill);
  border:1.5px solid var(--c);box-shadow:0 0 46px var(--g),inset 0 0 34px var(--g);mix-blend-mode:screen}
.aci-orb--a{--c:var(--lav);--g:rgba(183,156,255,.5);--fill:rgba(157,123,255,.30);animation:aciInA 1.5s cubic-bezier(.22,.9,.25,1) .5s both}
.aci-orb--b{--c:var(--amb);--g:rgba(255,160,90,.5);--fill:rgba(255,140,70,.26);animation:aciInB 1.5s cubic-bezier(.22,.9,.25,1) .5s both}
@keyframes aciInA{
  0%{opacity:0;transform:translateX(calc(var(--far)*-1)) scale(.55)}
  25%{opacity:1}
  100%{opacity:1;transform:translateX(calc(var(--D)*-.34)) scale(1)}}
@keyframes aciInB{
  0%{opacity:0;transform:translateX(var(--far)) scale(.55)}
  25%{opacity:1}
  100%{opacity:1;transform:translateX(calc(var(--D)*.34)) scale(1)}}

/* კომეტის კუდი */
.aci-tail{position:absolute;top:50%;height:3px;width:var(--far);margin-top:-1.5px;border-radius:3px;opacity:0;pointer-events:none}
.aci-orb--a .aci-tail{right:50%;transform-origin:100% 50%;background:linear-gradient(to left,var(--lav),rgba(183,156,255,0));animation:aciTail 1.5s ease-out .5s both}
.aci-orb--b .aci-tail{left:50%;transform-origin:0 50%;background:linear-gradient(to right,var(--amb),rgba(255,184,107,0));animation:aciTail 1.5s ease-out .5s both}
@keyframes aciTail{0%{opacity:0;transform:scaleX(.2)}20%{opacity:.95;transform:scaleX(1)}100%{opacity:0;transform:scaleX(.05)}}

/* ლოგოები რგოლებში (გადაფარვის გარეთ, "ნახევარმთვარეებში") */
.aci-mark{position:absolute;top:50%;width:calc(var(--D)*.4);height:calc(var(--D)*.4);transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;opacity:0;animation:aciMark .7s ease 1.6s both}
.aci-orb--a .aci-mark{left:calc(50% - var(--D)*.17)}
.aci-orb--b .aci-mark{left:calc(50% + var(--D)*.17)}
.aci-mark img,.aci-mark svg{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 0 10px rgba(255,255,255,.35))}
@keyframes aciMark{from{opacity:0;transform:translate(-50%,-50%) scale(.6)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}

/* გადაკვეთა (lens) — ზუსტად ორი წრის თანაკვეთა */
.aci-lens{position:absolute;left:50%;top:50%;width:var(--D);height:var(--D);margin:calc(var(--D)/-2) 0 0 calc(var(--D)/-2);z-index:2;pointer-events:none;border-radius:50%;
  transform:translateX(calc(var(--D)*-.34));
  clip-path:circle(calc(var(--D)*.5) at calc(50% + var(--sep)) 50%);
  background:radial-gradient(circle at 78% 50%,#fff 0,#ffe6f3 22%,var(--pink) 55%,var(--amb) 100%);
  opacity:0;animation:aciLens 1.1s ease 1.95s both}
@keyframes aciLens{0%{opacity:0}18%{opacity:1;filter:brightness(1.6)}100%{opacity:.62;filter:brightness(1)}}
.aci-star{position:absolute;left:50%;top:50%;width:calc(var(--D)*.3);height:calc(var(--D)*.3);margin:calc(var(--D)*-.15) 0 0 calc(var(--D)*-.15);z-index:4;opacity:0;
  animation:aciStar 1s cubic-bezier(.2,1.4,.3,1) 2s both,aciSpin 6s linear 3s infinite}
.aci-star svg{width:100%;height:100%;filter:drop-shadow(0 0 12px #fff)}
@keyframes aciStar{0%{opacity:0;transform:scale(0) rotate(-90deg)}100%{opacity:1;transform:scale(1) rotate(0)}}
@keyframes aciSpin{to{transform:rotate(360deg)}}

/* დარტყმის ტალღები */
.aci-ring{position:absolute;left:50%;top:50%;width:var(--D);height:var(--D);margin:calc(var(--D)/-2) 0 0 calc(var(--D)/-2);border-radius:50%;border:2px solid #fff;z-index:3;opacity:0;pointer-events:none;animation:aciRing 1.3s cubic-bezier(.1,.7,.2,1) 1.95s both}
.aci-ring--2{border-color:var(--pink);animation-delay:2.1s}
@keyframes aciRing{0%{opacity:.95;transform:scale(.25)}100%{opacity:0;transform:scale(3.4)}}

/* ნაპერწკლები (JS ქმნის) */
.aci-sparks{position:absolute;left:50%;top:50%;width:0;height:0;z-index:4;pointer-events:none}
.aci-sparks i{position:absolute;left:0;top:0;width:6px;height:6px;margin:-3px;border-radius:50%;background:var(--sc,#fff);box-shadow:0 0 10px var(--sc,#fff);opacity:0;
  animation:aciSpark 1.1s cubic-bezier(.1,.7,.2,1) 1.95s both}
@keyframes aciSpark{0%{opacity:1;transform:rotate(var(--a)) translateX(0) scale(1.2)}100%{opacity:0;transform:rotate(var(--a)) translateX(var(--r)) scale(.2)}}

/* წარწერები */
.aci-label{position:absolute;top:calc(50% + var(--D)*.5 + 14px);z-index:5;transform:translateX(-50%);text-align:center;white-space:nowrap;opacity:0;animation:aciUp .7s ease 2.25s both}
.aci-label--a{left:calc(50% - var(--D)*.5)}
.aci-label--b{left:calc(50% + var(--D)*.5);animation-delay:2.4s}
.aci-label b{display:block;font-size:clamp(11px,1.2vmin + 7px,15px);font-weight:800;letter-spacing:.16em}
.aci-label--a b{color:var(--lav)}
.aci-label--b b{color:var(--amb)}
.aci-label small{display:block;margin-top:4px;font-size:10px;letter-spacing:.04em;color:#a99ac9}
@keyframes aciUp{from{opacity:0;transform:translate(-50%,10px)}to{opacity:1;transform:translate(-50%,0)}}

/* სათაური */
.aci-text{position:relative;z-index:5;text-align:center;padding:0 22px;max-width:640px}
.aci-title{margin:0;font-size:clamp(24px,4vmin + 10px,44px);font-weight:800;line-height:1.15;
  background:linear-gradient(90deg,var(--lav),var(--pink) 50%,var(--amb));-webkit-background-clip:text;background-clip:text;color:transparent;
  opacity:0;animation:aciUp2 .8s ease 2.5s both}
.aci-sub{margin:12px 0 0;font-size:clamp(12px,1vmin + 9px,16px);line-height:1.6;color:#cdbfe8;opacity:0;animation:aciUp2 .8s ease 2.7s both}
@keyframes aciUp2{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}

/* პროგრესი */
.aci-prog{position:relative;z-index:5;width:min(320px,72vw);margin-top:26px;opacity:0;animation:aciUp2 .6s ease 1s both}
.aci-track{height:4px;border-radius:4px;background:rgba(190,160,255,.16);overflow:hidden}
.aci-track i{display:block;height:100%;width:0;border-radius:4px;background:linear-gradient(90deg,var(--lav),var(--pink),var(--amb));box-shadow:0 0 14px rgba(255,138,194,.7)}
.aci-meta{display:flex;justify-content:space-between;gap:12px;margin-top:9px;font-size:12px;color:#a99ac9}
.aci-meta b{color:#f5f0ff;font-variant-numeric:tabular-nums}

/* გამოტოვება */
.aci-skip{position:absolute;right:clamp(14px,3vw,32px);bottom:clamp(14px,3vh,28px);z-index:6;display:inline-flex;align-items:center;gap:8px;
  height:40px;padding:0 18px;border:1px solid rgba(190,160,255,.28);border-radius:999px;background:rgba(27,14,47,.6);backdrop-filter:blur(8px);
  color:#d9ccf5;font:600 13px/1 'FiraGO',system-ui,sans-serif;cursor:pointer;opacity:0;animation:aciUp2 .5s ease 1s both;transition:background .2s,color .2s}
.aci-skip:hover,.aci-skip:focus-visible{background:#b79cff;color:#1a0b33;outline:none}

/* გასვლა: წრიული "გაპობა" JS-ით (mask), აქ — შიგთავსის გაქრობა */
#acIntro.aci-leave .aci-stage,#acIntro.aci-leave .aci-text,#acIntro.aci-leave .aci-prog,#acIntro.aci-leave .aci-skip{transition:transform .55s cubic-bezier(.5,0,.2,1),opacity .4s ease;transform:scale(1.14);opacity:0}
#acIntro.aci-leave .aci-glow{transition:opacity .6s;opacity:0}
.aci-wipe{position:fixed;left:50%;top:50%;z-index:10002;border-radius:50%;pointer-events:none;border:2px solid rgba(255,255,255,.85);
  box-shadow:0 0 40px 6px rgba(183,156,255,.7),0 0 90px 12px rgba(255,138,194,.35),inset 0 0 40px 4px rgba(183,156,255,.4);transform:translate(-50%,-50%)}

/* საიტის "pop" ინტროს შემდეგ (მხოლოდ opacity/transform — fixed დოკი არ ირღვევა) */
html.ac-pop .stage__body{animation:aciPop .85s cubic-bezier(.2,.9,.2,1) both}
html.ac-pop .rail{animation:aciFadeOnly .9s ease both}
@keyframes aciPop{from{opacity:0;transform:translateY(22px) scale(.985)}to{opacity:1;transform:none}}
@keyframes aciFadeOnly{from{opacity:0}to{opacity:1}}

/* შემცირებული მოძრაობა */
html.aci-reduced #acIntro *{animation-duration:.01s!important;animation-delay:0s!important}
html.aci-reduced .aci-orb{opacity:1}
@media(prefers-reduced-motion:reduce){html.ac-pop .stage__body,html.ac-pop .rail{animation:none}}

@media(max-width:480px){.aci-label small{display:none}.aci-label{top:calc(50% + var(--D)*.5 + 10px)}}

/* =====================================================================
   პოპაპი: "ახალი დიზაინი თუ ძველი?"
   ===================================================================== */
#acVote{position:fixed;inset:0;z-index:10001;display:none;align-items:center;justify-content:center;padding:16px;
  background:rgba(8,3,18,.64);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
#acVote.is-open{display:flex;animation:aciFade .3s ease both}
@keyframes aciFade{from{opacity:0}to{opacity:1}}
.aciv-card{position:relative;width:min(760px,100%);max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);overflow:auto;
  border-radius:28px;padding:clamp(20px,3.2vw,34px);color:#f5f0ff;
  background:radial-gradient(500px 240px at 85% -10%,rgba(157,123,255,.28),transparent 70%),linear-gradient(160deg,#241046,#150a2b);
  border:1px solid rgba(190,160,255,.28);box-shadow:0 40px 120px rgba(0,0,0,.65),0 0 80px rgba(157,123,255,.16);
  animation:acivPop .5s cubic-bezier(.2,1.15,.3,1) both}
@keyframes acivPop{from{opacity:0;transform:translateY(24px) scale(.94)}to{opacity:1;transform:none}}
.aciv-badge{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:999px;font-size:11px;font-weight:800;letter-spacing:.14em;
  color:#1a0b33;background:linear-gradient(135deg,#b79cff,#ff8ac2)}
.aciv-title{margin:14px 0 6px;font-size:clamp(22px,3.4vw,30px);font-weight:800;line-height:1.2}
.aciv-sub{margin:0 0 22px;font-size:14px;line-height:1.65;color:#bfb0dc;max-width:560px}
.aciv-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.aciv-opt{position:relative;display:flex;flex-direction:column;gap:14px;text-align:left;padding:12px 12px 16px;border-radius:20px;cursor:pointer;
  background:rgba(37,20,66,.7);border:1.5px solid rgba(190,160,255,.18);color:inherit;font:inherit;
  transition:transform .2s,border-color .2s,box-shadow .2s,background .2s}
.aciv-opt:hover,.aciv-opt:focus-visible{transform:translateY(-4px);border-color:#b79cff;box-shadow:0 18px 44px rgba(157,123,255,.35);outline:none;background:rgba(51,25,92,.85)}
.aciv-opt--new:hover,.aciv-opt--new:focus-visible{border-color:#ff8ac2;box-shadow:0 18px 44px rgba(255,138,194,.3)}
.aciv-name{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 6px;font-size:16px;font-weight:800}
.aciv-tag{padding:3px 10px;border-radius:999px;font-size:10px;font-weight:800;letter-spacing:.08em;color:#1a0b33;background:linear-gradient(135deg,#b79cff,#ff8ac2)}
.aciv-desc{padding:0 6px;font-size:12.5px;line-height:1.55;color:#a99ac9}
.aciv-later{display:block;margin:20px auto 0;padding:8px 14px;border:0;background:none;color:#a99ac9;font:600 13px/1 'FiraGO',system-ui,sans-serif;cursor:pointer;border-radius:999px;transition:color .2s,background .2s}
.aciv-later:hover,.aciv-later:focus-visible{color:#fff;background:rgba(190,160,255,.12);outline:none}

/* მინი-პრევიუები */
.aciv-prev{position:relative;aspect-ratio:16/10;border-radius:12px;overflow:hidden;border:1px solid rgba(255,255,255,.08)}
.aciv-prev i,.aciv-prev span{display:block}
/* ახალი */
.aciv-prev--new{background:radial-gradient(120px 70px at 85% 0,rgba(157,123,255,.4),transparent 70%),#0f0620}
.aciv-prev--new .p-top{position:absolute;left:6%;right:6%;top:7%;height:9%;border-radius:8px;background:rgba(190,160,255,.16)}
.aciv-prev--new .p-hero{position:absolute;left:6%;right:6%;top:21%;height:33%;border-radius:10px;background:linear-gradient(110deg,#33195c,#7a52e0 60%,#ff8ac2)}
.aciv-prev--new .p-row{position:absolute;left:6%;right:6%;top:60%;display:grid;grid-template-columns:repeat(5,1fr);gap:4%}
.aciv-prev--new .p-row i{aspect-ratio:2/2.4;border-radius:7px;background:linear-gradient(160deg,#3d2370,#251442)}
.aciv-prev--new .p-dock{position:absolute;left:50%;bottom:5%;width:46%;height:9%;transform:translateX(-50%);border-radius:999px;background:rgba(190,160,255,.22);border:1px solid rgba(190,160,255,.35)}
/* ძველი */
.aciv-prev--old{background:#09090c}
.aciv-prev--old .p-nav{position:absolute;left:0;right:0;top:0;height:13%;background:#15151d;border-bottom:1px solid rgba(255,255,255,.07)}
.aciv-prev--old .p-nav::before{content:"";position:absolute;left:5%;top:30%;width:14%;height:40%;border-radius:3px;background:#8b5cf6}
.aciv-prev--old .p-nav::after{content:"";position:absolute;right:5%;top:30%;width:22%;height:40%;border-radius:3px;background:#222230}
.aciv-prev--old .p-side{position:absolute;left:0;top:13%;bottom:0;width:17%;background:#0e0e14;border-right:1px solid rgba(255,255,255,.06)}
.aciv-prev--old .p-grid{position:absolute;left:21%;right:4%;top:21%;display:grid;grid-template-columns:repeat(4,1fr);gap:5%}
.aciv-prev--old .p-grid i{aspect-ratio:2/3;border-radius:3px;background:#1d1d29;border:1px solid rgba(255,255,255,.06)}
.aciv-prev--old .p-grid i:nth-child(2){background:#2a1f4d}

@media(max-width:520px){
  .aciv-grid{grid-template-columns:minmax(0,1fr);gap:12px}
  .aciv-opt{flex-direction:row;align-items:center;gap:12px;padding:10px}
  .aciv-prev{flex:0 0 42%;aspect-ratio:16/11}
  .aciv-txt{flex:1;min-width:0}
  .aciv-name,.aciv-desc{padding:0}
}
@media(min-width:521px){.aciv-txt{display:flex;flex-direction:column;gap:6px}}

/* ტოსტი */
.aci-toast{position:fixed;left:50%;bottom:calc(96px + env(safe-area-inset-bottom,0px));z-index:10003;transform:translate(-50%,20px);opacity:0;pointer-events:none;
  max-width:calc(100vw - 32px);padding:12px 20px;border-radius:999px;font-size:14px;font-weight:600;color:#f5f0ff;
  background:rgba(37,20,66,.92);border:1px solid rgba(190,160,255,.35);box-shadow:0 14px 40px rgba(0,0,0,.5);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  transition:opacity .35s,transform .35s}
.aci-toast.is-on{opacity:1;transform:translate(-50%,0)}

/* ფუტერის ბმული */
.aci-reopen{color:inherit;opacity:.75;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.aci-reopen:hover{opacity:1;color:#b79cff}

/* ---------- დაცვა საიტის გლობალური `button{height:40px;nowrap;uppercase…}` წესისგან ---------- */
.aciv-opt,.aciv-later,.aci-skip{height:auto;white-space:normal;text-transform:none;letter-spacing:normal;font-feature-settings:normal;box-shadow:none}
.aciv-opt{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;padding:12px 12px 16px;border-radius:20px;font-size:inherit;font-weight:inherit;width:100%;min-width:0}
.aciv-later{display:block;height:auto;padding:8px 14px;border-radius:999px;background:none;font-size:13px}
.aci-skip{height:40px;white-space:nowrap;padding:0 18px;font-size:13px;letter-spacing:0}
.aciv-opt,.aciv-opt *{text-transform:none}
.aciv-opt:hover,.aciv-opt:focus-visible{color:#f5f0ff}
.aciv-later:hover,.aciv-later:focus-visible{color:#fff}
@media(max-width:520px){.aciv-opt{flex-direction:row;align-items:center}}