:root{
    --bg:#0c0713; --bg-2:#0e0816; --surface:#160b1c; --surface-2:#1c0f26;
    --line:rgba(255,255,255,.07); --line-2:rgba(255,255,255,.12);
    --blue:#ff2f86; --blue-2:#e01f70; --violet:#a56bff; --violet-2:#7d4bff; --cyan:#ff7ab0;
    --accent:#ff2f86; --accent-2:#e01f70; --on-accent:#2a0416;
    --text:#fdeff7; --muted:#b088a3; --muted-2:#7a5f70;
    --grad:linear-gradient(120deg,var(--violet),var(--accent));
    --font:'Geist',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
    --mono:'Geist Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
    --radius:18px; --shadow:0 34px 70px -34px rgba(0,0,0,.85);
    --maxw:1200px;
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth;overflow-x:hidden}
  html.intro-lock,html.intro-lock body{overflow:hidden;height:100%}
  html.intro-skip #intro{display:none!important}
  html.intro-skip.intro-lock,html.intro-skip.intro-lock body{overflow:auto;height:auto}
  body{background:var(--bg);color:var(--text);font-family:var(--font);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
  body::after{content:"";position:fixed;inset:0;z-index:150;pointer-events:none;opacity:.04;mix-blend-mode:overlay;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
  a{color:inherit;text-decoration:none}
  img{display:block;max-width:100%}
  ::selection{background:rgba(155,109,255,.35);color:#fff}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 26px}
  .grad-text{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
  .star4{display:inline-block;vertical-align:middle}
  .brandlogo{aspect-ratio:1345/733;background:url("/img/logo.webp") center/contain no-repeat;display:block;flex:none}
  .usd{display:none}
  html[data-cur="usd"] .pkr{display:none}
  html[data-cur="usd"] .usd{display:inline}
  @keyframes marq{to{transform:translateX(-50%)}}
  @keyframes marqr{from{transform:translateX(-50%)}to{transform:translateX(0)}}

  /* ===== CINEMATIC INTRO ===== */
  .intro{position:fixed;inset:0;z-index:1000;background:radial-gradient(120% 90% at 50% 40%,#1a0b22,#0a0510 70%);display:grid;place-items:center;overflow:hidden}
  .intro.done{animation:introOut .95s cubic-bezier(.65,0,.2,1) forwards}
  @keyframes introOut{to{opacity:0;transform:scale(1.55);visibility:hidden}}
  #warp{position:absolute;inset:0;width:100%;height:100%;z-index:0}
  .intro-stars{position:absolute;inset:0;z-index:0;pointer-events:none;background-image:radial-gradient(1.6px 1.6px at 18% 28%,rgba(255,255,255,.8),transparent),radial-gradient(1.4px 1.4px at 72% 18%,rgba(190,205,255,.7),transparent),radial-gradient(2px 2px at 42% 72%,rgba(200,185,255,.7),transparent),radial-gradient(1.5px 1.5px at 86% 62%,rgba(255,255,255,.65),transparent),radial-gradient(1.5px 1.5px at 58% 44%,rgba(180,200,255,.6),transparent),radial-gradient(1.3px 1.3px at 30% 82%,rgba(255,255,255,.55),transparent),radial-gradient(1.7px 1.7px at 90% 34%,rgba(210,190,255,.6),transparent);animation:twinkle 4.5s ease-in-out infinite}
  @keyframes twinkle{0%,100%{opacity:.35}50%{opacity:.8}}
  .intro.done .intro-stars{opacity:0;transition:opacity .5s}
  .intro::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(58% 58% at 50% 50%,transparent 28%,rgba(7,7,14,.78) 100%)}
  .intro-halo{position:absolute;left:50%;top:50%;width:min(94vw,860px);height:min(94vw,860px);transform:translate(-50%,-50%);border-radius:50%;z-index:1;pointer-events:none;background:conic-gradient(from 0deg,transparent 0deg,rgba(255,47,134,.40) 55deg,transparent 150deg,rgba(165,107,255,.38) 235deg,transparent 330deg);filter:blur(40px);animation:halospin 14s linear infinite,hueroll 9s ease-in-out infinite}
  @keyframes halospin{to{transform:translate(-50%,-50%) rotate(360deg)}}
  .intro.done .intro-halo{opacity:0;transition:opacity .5s}
  .intro-flash{position:absolute;inset:0;z-index:6;background:#fff;opacity:0;pointer-events:none}
  .intro.flash .intro-flash{animation:flashk .5s ease-out}
  @keyframes flashk{0%{opacity:0}18%{opacity:.5}100%{opacity:0}}
  .lb{position:absolute;left:0;right:0;height:0;background:#000;z-index:4;transition:height .6s cubic-bezier(.7,0,.3,1)}
  .lb-top{top:0;box-shadow:inset 0 -1px 0 rgba(255,255,255,.06)}
  .lb-bottom{bottom:0;box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
  .intro.bars .lb{height:0}
  .intro.done .lb{height:0}
  .intro-inner{position:relative;z-index:2;width:100%;padding:0 24px}
  .scene-brand,.scene-text{position:absolute;left:0;right:0;top:50%;text-align:center;opacity:0;pointer-events:none;transform:translateY(calc(-50% + 16px)) scale(.97);filter:blur(7px);transition:opacity .55s ease,transform .55s cubic-bezier(.2,.7,.2,1),filter .55s ease}
  .scene-brand::before{content:"";position:absolute;left:50%;top:50%;width:min(82vw,780px);height:min(48vw,440px);transform:translate(-50%,-50%);z-index:-1;pointer-events:none;background:radial-gradient(ellipse at center,rgba(255,47,134,.26),rgba(165,107,255,.16) 45%,transparent 72%);filter:blur(24px);animation:glowbreath 4.2s ease-in-out infinite,hueroll 9s ease-in-out infinite}
  @keyframes glowbreath{0%,100%{opacity:.55;transform:translate(-50%,-50%) scale(1)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.09)}}
  .scene-brand.in,.scene-text.in{opacity:1;transform:translateY(-50%);filter:none}
  .scene-brand.out{opacity:0;transform:translateY(calc(-50% - 12px)) scale(1.03);filter:blur(7px)}
  .brandlogo.intro-logo{width:min(84vw,900px,84vh);height:auto;margin:0 auto;filter:drop-shadow(0 0 48px rgba(255,47,134,.6)) drop-shadow(0 0 110px rgba(165,107,255,.4));animation:logopulse 4.2s ease-in-out infinite,logohue 7s ease-in-out infinite}
  @keyframes logopulse{0%,100%{transform:scale(1)}50%{transform:scale(1.035)}}
  @keyframes logohue{0%,100%{filter:drop-shadow(0 0 48px rgba(255,47,134,.6)) drop-shadow(0 0 110px rgba(165,107,255,.4))}50%{filter:drop-shadow(0 0 56px rgba(165,107,255,.62)) drop-shadow(0 0 120px rgba(255,47,134,.42))}}
  @keyframes hueroll{0%,100%{filter:hue-rotate(0deg) blur(40px)}50%{filter:hue-rotate(28deg) blur(44px)}}
  @keyframes tagshift{to{background-position:200% 0}}
  @keyframes wordshimmer{0%{background-position:120% 0}100%{background-position:-20% 0}}
  .intro-tag{font-family:var(--mono);text-transform:uppercase;letter-spacing:.42em;font-size:15px;color:#ff7ab0;margin-top:34px;background:linear-gradient(90deg,#a56bff,#ff2f86,#a56bff);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:tagshift 4s linear infinite}
  .scene-word{font-weight:800;font-size:clamp(30px,7vw,78px);letter-spacing:-.025em;line-height:1.02;color:#fff;max-width:900px;margin:0 auto;background:linear-gradient(100deg,#ffffff 30%,#ffc6e2 50%,#ffffff 70%);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:wordshimmer 5s linear infinite}
  .scene-sub{font-family:var(--mono);text-transform:uppercase;letter-spacing:.24em;font-size:clamp(11px,1.5vw,14px);color:var(--muted);margin-top:20px}

  /* ===== ANNOUNCEMENT BAR ===== */
  .announce{background:linear-gradient(90deg,rgba(91,141,255,.12),rgba(155,109,255,.12));border-bottom:1px solid var(--line);height:38px;display:flex;align-items:center;overflow:hidden}
  .announce .track{display:flex;gap:0;white-space:nowrap;animation:marq 30s linear infinite;width:max-content}
  .announce .it{display:inline-flex;align-items:center;gap:9px;padding:0 30px;font-family:var(--mono);font-size:11.5px;color:var(--muted);letter-spacing:.03em}
  .announce .it i{width:5px;height:5px;border-radius:50%;background:var(--grad)}
  .announce .it b{color:var(--text);font-weight:500}

  /* ===== HEADER ===== */
  header{position:sticky;top:0;z-index:80;background:linear-gradient(180deg,rgba(10,10,18,.94),rgba(10,10,18,.78));backdrop-filter:blur(18px) saturate(1.2);border-bottom:1px solid var(--line)}
  .bar{display:flex;align-items:center;gap:20px;height:74px}
  .logo{flex:none}.logo .brandlogo{height:46px}
  .search{flex:1;position:relative;max-width:560px;margin:0 auto}
  .search input{width:100%;height:46px;border-radius:13px;border:1px solid var(--line);background:rgba(255,255,255,.03);color:var(--text);padding:0 44px;font-size:14.5px;outline:none;transition:.2s;font-family:inherit}
  .search input::placeholder{color:var(--muted-2)}
  .search input:focus{border-color:rgba(91,141,255,.6);background:rgba(255,255,255,.05);box-shadow:0 0 0 4px rgba(91,141,255,.1)}
  .search .si{position:absolute;left:15px;top:50%;transform:translateY(-50%);color:var(--muted)}
  .search kbd{position:absolute;right:12px;top:50%;transform:translateY(-50%);font-family:var(--mono);font-size:11px;color:var(--muted);border:1px solid var(--line-2);border-radius:6px;padding:2px 7px}
  .actions{display:flex;align-items:center;gap:11px;flex:none}
  .cur{display:inline-flex;border:1px solid var(--line);border-radius:11px;overflow:hidden;font-family:var(--mono);font-size:12px;font-weight:500}
  .cur button{background:transparent;color:var(--muted);border:0;padding:9px 12px;cursor:pointer;font-family:inherit;transition:.15s}
  .cur button.on{background:rgba(255,255,255,.08);color:#fff}
  .icon-btn{width:42px;height:42px;display:grid;place-items:center;border-radius:12px;border:1px solid var(--line);color:var(--text);background:rgba(255,255,255,.02);cursor:pointer;position:relative;transition:.15s}
  .icon-btn:hover{border-color:var(--line-2);background:rgba(255,255,255,.05)}
  .icon-btn .dot{position:absolute;top:-5px;right:-5px;min-width:17px;height:17px;border-radius:9px;background:var(--grad);color:#fff;font-size:10px;font-weight:600;display:grid;place-items:center;padding:0 4px;font-family:var(--mono)}
  .signin{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 16px;border-radius:12px;background:#fff;color:#0a0a12;font-weight:600;font-size:13.5px;white-space:nowrap}
  .burger{display:none}
  .catbar{border-top:1px solid var(--line)}
  .catbar .row{display:flex;gap:2px;height:48px;align-items:center;overflow-x:auto;scrollbar-width:none}
  .catbar .row::-webkit-scrollbar{display:none}
  .catbar a{font-size:13px;font-weight:500;color:var(--muted);padding:9px 10px;border-radius:9px;white-space:nowrap;transition:.15s}
  .catbar a:hover{color:var(--text);background:rgba(255,255,255,.04)}
  .catbar a.all{color:var(--text);font-weight:600;display:inline-flex;align-items:center;gap:8px}

  /* ===== HERO (full-screen, centered, commerce) ===== */
  .hero{position:relative;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;overflow:hidden;border-bottom:1px solid var(--line)}
  .hero-bg{position:absolute;inset:0;z-index:0;pointer-events:none}
  .hero-bg .g1{position:absolute;width:760px;height:760px;top:-320px;left:50%;transform:translateX(-50%);background:radial-gradient(circle,rgba(124,77,255,.2),transparent 62%);filter:blur(10px)}
  .hero-bg .g2{position:absolute;width:520px;height:520px;bottom:40px;left:4%;background:radial-gradient(circle,rgba(63,116,245,.14),transparent 62%);filter:blur(10px)}
  .hero-center{position:relative;z-index:3;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:70px 26px 24px}
  .eyebrow{display:inline-flex;align-items:center;gap:9px;font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--cyan)}
  .hero h1{font-weight:700;line-height:1.04;letter-spacing:-.03em;font-size:clamp(33px,6.4vw,80px);margin:22px auto 20px;max-width:960px}
  .hero .lede{font-size:clamp(15.5px,1.6vw,18.5px);color:var(--muted);max-width:620px;margin:0 auto;line-height:1.65}
  .hero-search{position:relative;width:100%;max-width:660px;margin:36px auto 0}
  .hero-search input{width:100%;height:60px;border-radius:16px;border:1px solid var(--line-2);background:rgba(255,255,255,.04);color:var(--text);padding:0 132px 0 54px;font-size:16px;font-family:inherit;outline:none;transition:.2s}
  .hero-search input::placeholder{color:var(--muted-2)}
  .hero-search input:focus{border-color:rgba(91,141,255,.6);box-shadow:0 0 0 4px rgba(91,141,255,.12)}
  .hero-search .si{position:absolute;left:20px;top:50%;transform:translateY(-50%);color:var(--muted)}
  .hero-search .go{position:absolute;right:8px;top:8px;height:44px;padding:0 22px;border:0;border-radius:12px;background:#fff;color:#0a0a12;font-weight:600;font-family:inherit;cursor:pointer;font-size:14.5px}
  .hero-chips{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:22px}
  .chip{font-family:var(--mono);font-size:12.5px;color:var(--muted);border:1px solid var(--line);border-radius:100px;padding:8px 15px;background:rgba(255,255,255,.02);transition:.15s;cursor:pointer}
  .chip:hover{border-color:var(--line-2);color:var(--text)}
  .hero-stats{display:flex;gap:30px;justify-content:center;margin-top:34px;flex-wrap:wrap}
  .hero-stats div{font-family:var(--mono);font-size:12.5px;color:var(--muted)}
  .hero-stats b{font-family:var(--font);font-weight:700;font-size:20px;color:var(--text);display:block;letter-spacing:-.02em}

  /* hero brand marquee */
  .hero-marquee{position:relative;z-index:2;padding:14px 0 42px;display:flex;flex-direction:column;gap:13px;overflow:hidden;
    -webkit-mask:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
  .mrow{display:flex;gap:13px;width:max-content;animation:marq 44s linear infinite}
  .mrow.rev{animation:marqr 50s linear infinite}
  .mtile{display:inline-flex;align-items:center;gap:11px;padding:11px 17px;border:1px solid var(--line);border-radius:13px;background:rgba(255,255,255,.025)}
  .mtile .mi{width:36px;height:36px;border-radius:9px;display:grid;place-items:center;font-weight:700;font-size:13px;color:#fff;flex:none;overflow:hidden}
  .mtile .mi.has-img{background:#0d0d16 !important}
  .mtile .mi img{width:100%;height:100%;object-fit:cover;display:block}
  .mtile b{font-size:14px;font-weight:600;white-space:nowrap}
  .mtile span{font-family:var(--mono);font-size:10.5px;color:var(--muted);white-space:nowrap}

  /* ===== SECTIONS ===== */
  section.blk{padding:70px 0}
  .head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:30px}
  .head .tt{display:flex;align-items:center;gap:12px}
  .head h2{font-weight:700;font-size:clamp(24px,3vw,34px);letter-spacing:-.03em;line-height:1.1}
  .head .fire{font-size:22px}
  .head p{color:var(--muted);font-size:14px;margin-top:6px}
  .head .more{font-family:var(--mono);font-size:12.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--text);display:inline-flex;align-items:center;gap:7px;white-space:nowrap;border:1px solid var(--line);padding:10px 16px;border-radius:11px;transition:.15s}
  .head .more:hover{border-color:var(--line-2);background:rgba(255,255,255,.04)}

  /* product cards */
  .grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
  .card{position:relative;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--surface);transition:.22s;cursor:pointer;display:flex;flex-direction:column}
  .card:hover{border-color:rgba(255,47,134,.4);transform:translateY(-6px);box-shadow:var(--shadow),0 24px 60px -24px rgba(255,47,134,.42)}
  .thumb{aspect-ratio:16/11;position:relative;display:grid;place-items:center;overflow:hidden}
  .thumb::after{content:"";position:absolute;inset:0;box-shadow:inset 0 -60px 50px -30px rgba(16,16,32,.9)}
  .thumb .init{font-size:48px;font-weight:800;color:#fff;opacity:.9;z-index:2}
  .badge{position:absolute;top:12px;left:12px;font-family:var(--mono);font-size:10px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--text);background:rgba(10,10,18,.55);border:1px solid var(--line-2);border-radius:8px;padding:4px 9px;z-index:3;backdrop-filter:blur(6px)}
  .off-tag{position:absolute;top:12px;right:12px;font-family:var(--mono);font-size:11px;font-weight:500;color:#fff;background:rgba(10,10,18,.5);border:1px solid rgba(255,120,140,.5);border-radius:8px;padding:4px 9px;z-index:3;backdrop-filter:blur(6px)}
  .rank{position:absolute;top:12px;left:12px;z-index:4;width:30px;height:30px;border-radius:9px;display:grid;place-items:center;font-weight:800;font-size:14px;color:#0a0a12;background:linear-gradient(135deg,#ffd76a,#ffb020);box-shadow:0 6px 18px -6px rgba(255,180,40,.6)}
  .rank.r2{background:linear-gradient(135deg,#d7dbe6,#a8adbe)}
  .rank.r3{background:linear-gradient(135deg,#e8a06a,#c67a3e);color:#fff}
  .card .body{padding:16px 16px 18px;display:flex;flex-direction:column;gap:7px;flex:1}
  .card h3{font-size:15px;font-weight:600;line-height:1.3;letter-spacing:-.01em}
  .plat{font-family:var(--mono);font-size:11.5px;color:var(--muted);display:flex;align-items:center;gap:6px}
  .plat .rt{color:#f5c451;font-weight:500}
  .pricerow{margin-top:auto;display:flex;align-items:baseline;gap:8px;padding-top:8px;font-family:var(--font)}
  .pricerow .from{font-size:11px;color:var(--muted-2)}
  .pricerow .now{font-size:20px;font-weight:700;letter-spacing:-.02em;color:var(--text)}
  .pricerow .was{font-size:12px;color:var(--muted-2);text-decoration:line-through}
  .buy{margin-top:14px;height:42px;border-radius:11px;border:1px solid var(--line-2);background:rgba(255,255,255,.03);color:var(--text);font-weight:600;font-size:13.5px;display:grid;place-items:center;transition:.18s;font-family:inherit;cursor:pointer}
  .card:hover .buy{background:#fff;border-color:#fff;color:#0a0a12}

  /* category banner */
  .cat-banner{position:relative;overflow:hidden;border:1px solid var(--line-2);border-radius:18px;padding:22px 26px;margin-bottom:22px;display:flex;align-items:center;justify-content:space-between;gap:18px}
  .cat-banner::before{content:"";position:absolute;width:340px;height:340px;right:-110px;top:-130px;background:radial-gradient(circle,rgba(255,255,255,.16),transparent 60%);pointer-events:none}
  .cbl{display:flex;align-items:center;gap:16px;position:relative;z-index:2}
  .cbic{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.22);color:#fff;flex:none}
  .cbl h2{font-weight:700;font-size:clamp(20px,2.6vw,27px);letter-spacing:-.02em;color:#fff}
  .cbl p{font-size:13px;color:rgba(255,255,255,.8);margin-top:2px}
  .cbmore{position:relative;z-index:2;display:inline-flex;align-items:center;gap:7px;height:40px;padding:0 18px;border-radius:11px;background:rgba(0,0,0,.28);border:1px solid rgba(255,255,255,.2);color:#fff;font-weight:600;font-size:13.5px;white-space:nowrap;transition:.15s}
  .cbmore:hover{background:rgba(0,0,0,.45)}

  /* trust */
  .trust{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:rgba(255,255,255,.012)}
  .trust .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;padding:34px 26px}
  .tr{display:flex;gap:14px;align-items:center}
  .tr .ic{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;flex:none;background:rgba(255,255,255,.04);border:1px solid var(--line);color:var(--cyan)}
  .tr b{font-weight:600;font-size:14.5px;display:block;letter-spacing:-.01em}
  .tr span{font-size:12.5px;color:var(--muted)}

  /* promo */
  .promo{position:relative;border:1px solid var(--line-2);border-radius:22px;overflow:hidden;background:linear-gradient(105deg,#14142e,#0b0b18 58%);padding:50px;display:flex;align-items:center;justify-content:space-between;gap:26px}
  .promo::before{content:"";position:absolute;width:480px;height:480px;right:-120px;top:-160px;background:radial-gradient(circle,rgba(125,75,255,.3),transparent 60%);pointer-events:none;filter:blur(8px)}
  .promo .pt{position:relative;z-index:2;max-width:580px}
  .promo .eyebrow{margin-bottom:16px}
  .promo h2{font-weight:700;font-size:clamp(28px,3.4vw,40px);line-height:1.06;margin-bottom:12px;letter-spacing:-.03em}
  .promo p{color:var(--muted);font-size:15px}
  .btn{display:inline-flex;align-items:center;gap:10px;height:52px;padding:0 26px;border-radius:13px;font-weight:600;font-size:15px;cursor:pointer;border:1px solid transparent;font-family:inherit;background:#fff;color:#0a0a12;transition:.18s}
  .btn:hover{transform:translateY(-2px)}
  .btn-trial{display:inline-flex;align-items:center;gap:10px;height:52px;padding:0 24px;border-radius:13px;font-weight:600;font-size:15px;cursor:pointer;border:0;font-family:inherit;color:#fff;position:relative;background:linear-gradient(105deg,#a56bff,#ff2f86,#7d4bff,#a56bff);background-size:280% 100%;animation:trialshift 7s linear infinite;box-shadow:0 14px 34px -14px rgba(255,47,134,.55);transition:.18s}
  @keyframes trialshift{to{background-position:280% 0}}
  .btn-trial:hover{transform:translateY(-2px);filter:brightness(1.08)}
  .btn-trial svg{flex:none}
  .hero-cta{margin-top:24px}
  .cbbtns{display:flex;gap:10px;align-items:center;position:relative;z-index:2;flex-wrap:wrap}
  .btn-trial.sm{height:40px;padding:0 16px;font-size:13.5px;box-shadow:none}
  .promo .btn{position:relative;z-index:2;flex:none}

  /* reviews */
  .reviews{background:rgba(255,255,255,.012);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
  .rev-marquee{overflow:hidden;padding:6px 0;-webkit-mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
  .rev-track{display:flex;gap:18px;width:max-content;animation:marq 60s linear infinite}
  .rev-track:hover{animation-play-state:paused}
  .rcard{border:1px solid var(--line);border-radius:16px;background:var(--surface);padding:22px}
  .rev-track .rcard{width:346px;flex:none}
  .rcard .stars{color:#f5c451;font-size:13px;letter-spacing:3px;margin-bottom:12px}
  .rcard p{font-size:14px;color:var(--text);line-height:1.62;margin-bottom:16px}
  .rcard .who{display:flex;align-items:center;gap:12px}
  .rcard .av{width:40px;height:40px;border-radius:50%;background:var(--grad);display:grid;place-items:center;font-weight:700;color:#fff;flex:none}
  .rcard .who b{font-size:13.5px;display:block}
  .rcard .who span{font-family:var(--mono);font-size:11px;color:var(--muted)}

  /* footer */
  footer{border-top:1px solid var(--line);background:var(--bg-2)}
  .foot{display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr 1fr;gap:32px;padding:58px 0 34px}
  .foot .brand .brandlogo{height:44px;margin-bottom:16px}
  .foot .brand p{font-size:13.5px;color:var(--muted);max-width:310px;margin-bottom:18px;line-height:1.6}
  .socials{display:flex;gap:11px}
  .socials a{width:40px;height:40px;border-radius:11px;display:grid;place-items:center;border:1px solid var(--line);color:var(--muted);transition:.15s}
  .socials a:hover{color:#fff;border-color:var(--line-2);background:rgba(255,255,255,.04)}
  .foot h5{font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--text);margin-bottom:16px}
  .foot ul{list-style:none;display:flex;flex-direction:column;gap:10px}
  .foot ul a{font-size:13.5px;color:var(--muted)}.foot ul a:hover{color:var(--text)}
  .paybar{border-top:1px solid var(--line);padding:22px 0;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
  .paybar .copy{font-family:var(--mono);font-size:12px;color:var(--muted-2)}
  .pays{display:flex;gap:9px;flex-wrap:wrap;font-family:var(--mono)}
  .pays span{font-size:11px;font-weight:500;color:var(--muted);border:1px solid var(--line);border-radius:8px;padding:5px 11px}

  /* floating whatsapp bottom-left */
  .wa-float{position:fixed;left:22px;bottom:22px;z-index:300;display:flex;align-items:center;height:58px;background:linear-gradient(105deg,#21c45c,#149a46);border-radius:30px;box-shadow:0 14px 34px -10px rgba(20,180,80,.55);cursor:pointer;overflow:hidden;transition:.28s}
  .wa-float .ico{width:58px;height:58px;display:grid;place-items:center;flex:none;color:#fff;z-index:2}
  .wa-float .lbl{max-width:0;opacity:0;white-space:nowrap;color:#fff;font-weight:600;font-size:14px;transition:.28s;overflow:hidden;z-index:2}
  .wa-float:hover .lbl{max-width:200px;opacity:1;padding-right:22px}
  .wa-float::after{content:"";position:absolute;left:0;top:0;width:58px;height:58px;border-radius:50%;animation:wapulse 2.6s ease-out infinite;pointer-events:none}
  @keyframes wapulse{0%{box-shadow:0 0 0 0 rgba(33,196,92,.5)}70%{box-shadow:0 0 0 15px rgba(33,196,92,0)}100%{box-shadow:0 0 0 0 rgba(33,196,92,0)}}

  .reveal{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
  .reveal.reveal-in{opacity:1;transform:none}

  /* responsive */
  @media(max-width:1080px){.grid{grid-template-columns:repeat(3,1fr)}}
  @media(max-width:860px){
    .trust .wrap{grid-template-columns:repeat(2,1fr)}.promo{flex-direction:column;align-items:flex-start;padding:36px}
    .foot{grid-template-columns:1fr 1fr}.grid{grid-template-columns:repeat(2,1fr)}
    .cat-banner{flex-direction:column;align-items:flex-start}.hero-stats{gap:22px}
  }
  @media(max-width:680px){
    .bar{height:auto;flex-wrap:wrap;padding:13px 0;gap:13px}.search{order:3;flex-basis:100%;max-width:none}
    .cur{display:none}.signin span{display:none}.signin{padding:0 13px}
    .foot{grid-template-columns:1fr}section.blk{padding:52px 0}.hero-center{padding:60px 20px 20px}.hero-stats{gap:16px 22px}.wa-float{left:16px;bottom:16px}.mtile b{font-size:13px}.hero-cta{width:100%}.hero-cta .btn-trial{width:100%;justify-content:center;font-size:13.5px;padding:0 16px}
    .brandlogo.intro-logo{width:min(88vw,560px);height:auto}.hero-search input{padding:0 100px 0 48px;font-size:15px}.hero-search .go{padding:0 16px;height:42px}
  }
  @media(prefers-reduced-motion:reduce){
    .mrow,.rev-track,.announce .track,.wa-float::after,.btn-trial,.intro-halo,.brandlogo.intro-logo{animation:none!important}
    .reveal{opacity:1;transform:none;transition:none}*{scroll-behavior:auto}
  }

/* ===== flash offer bar + section ===== */
.flash-bar{background:linear-gradient(90deg,#ff2f86,#a536ff,#ff2f86);background-size:220% 100%;border-bottom:1px solid rgba(255,255,255,.16);overflow:hidden;position:relative;animation:fbarShift 4s linear infinite,fbarGlow 1.7s ease-in-out infinite}
@keyframes fbarShift{to{background-position:220% 0}}
@keyframes fbarGlow{0%,100%{box-shadow:inset 0 0 0 rgba(255,120,150,0)}50%{box-shadow:0 0 22px rgba(255,70,110,.5),inset 0 0 46px rgba(255,120,150,.14)}}
.flash-badge{font-weight:800;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:#2a0416;background:#fff;padding:3px 8px;border-radius:6px;white-space:nowrap;display:inline-flex;align-items:center;gap:6px;box-shadow:0 4px 12px -4px rgba(0,0,0,.4)}
@keyframes badgeGlow{0%,100%{text-shadow:0 0 0 rgba(255,215,106,0);transform:scale(1)}50%{text-shadow:0 0 13px rgba(255,215,106,.95);transform:scale(1.04)}}
.flash-sub{font-size:13px;font-weight:700;color:#fff;white-space:nowrap;text-shadow:0 1px 6px rgba(0,0,0,.35)}
.flash-count{font-family:var(--mono);font-weight:700;font-size:13px;color:#fff;white-space:nowrap;background:rgba(0,0,0,.22);padding:5px 10px;border-radius:8px}
.flash-count b{color:#ffe08a}
.flash-cta{background:#fff;color:#0a0a12;font-weight:700;font-size:12.5px;padding:7px 14px;border-radius:9px;white-space:nowrap;animation:ctaPulse 1.25s ease-in-out infinite}
@keyframes ctaPulse{0%,100%{transform:scale(1);box-shadow:0 0 0 rgba(255,255,255,0)}50%{transform:scale(1.07);box-shadow:0 0 16px rgba(255,255,255,.65)}}
.cd-pill{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:12.5px;color:#fff;background:linear-gradient(105deg,#7d1f3a,#5a1f6e);border:1px solid var(--line-2);padding:9px 15px;border-radius:100px}
.cd-pill b{color:#ffd76a}


/* ===== interior pages (category / product / search) ===== */
.pagehead{padding:44px 0 6px}
.pagehead .wrap{max-width:1200px}
.crumb{font-size:13px;color:var(--muted);margin-bottom:12px}
.crumb a{color:var(--muted)}.crumb a:hover{color:var(--text)}
.pagehead h1{font-size:clamp(26px,3.4vw,40px);font-weight:700;letter-spacing:-.02em}
.pagehead p{color:var(--muted);margin-top:8px;max-width:640px}
.empty{padding:60px 0;text-align:center;color:var(--muted)}
.empty h2{color:var(--text);font-size:22px;margin-bottom:8px}

.pd-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:38px;align-items:start}
.pd-media{position:sticky;top:96px}
.pd-main{aspect-ratio:16/11;border-radius:18px;overflow:hidden;border:1px solid var(--line);display:grid;place-items:center;position:relative}
.pd-main img{width:100%;height:100%;object-fit:cover}
.pd-main .init{font-size:64px;font-weight:800;color:#fff;opacity:.9;font-family:var(--font)}
.pd-thumbs{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap}
.pd-thumbs img{width:74px;height:56px;object-fit:cover;border-radius:10px;border:1px solid var(--line);cursor:pointer;opacity:.7;transition:.15s}
.pd-thumbs img:hover,.pd-thumbs img.on{opacity:1;border-color:var(--accent)}
.pd-info h1{font-size:clamp(24px,3vw,34px);font-weight:700;letter-spacing:-.02em;margin:6px 0 10px}
.pd-info .plat{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:13.5px;margin-bottom:16px}
.pd-info .plat .rt{color:#ffd76a}
.pd-info .badge-pill{display:inline-block;background:var(--chip);border:1px solid var(--line-2);color:var(--text);font-size:12px;padding:3px 10px;border-radius:100px;margin-left:2px}
.desc{color:var(--soft);line-height:1.65;font-size:15px;margin-bottom:24px}
.plan-pick h4{font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:12px}
.plan-opt{display:flex;align-items:center;gap:14px;border:1px solid var(--line);border-radius:13px;padding:14px 16px;margin-bottom:10px;cursor:pointer;transition:.15s;background:var(--card)}
.plan-opt:hover{border-color:var(--line-2)}
.plan-opt input{accent-color:var(--accent);width:17px;height:17px;flex:none}
.plan-opt.sel{border-color:var(--accent);box-shadow:0 0 0 3px rgba(125,75,255,.12)}
.pl-l{font-weight:600;font-size:15px}
.pl-p{margin-left:auto;text-align:right;font-family:var(--font)}
.pl-p .now{font-weight:700;font-size:18px}
.pl-p .was{color:var(--muted);text-decoration:line-through;font-size:13px;margin-left:7px}
.pl-stock{font-size:11.5px;color:#25c268;margin-top:2px}
.pl-stock.out{color:#ff6a6a}
.order-btn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;height:54px;margin-top:8px;border-radius:13px;background:linear-gradient(105deg,#25d366,#1eb257);color:#062012;font-weight:700;font-size:16px;box-shadow:0 16px 36px -16px rgba(37,211,102,.7);transition:.16s}
.order-btn:hover{transform:translateY(-2px);filter:brightness(1.05)}
.pd-assure{display:flex;gap:18px;flex-wrap:wrap;margin-top:16px;color:var(--muted);font-size:12.5px}
.pd-assure span{display:inline-flex;align-items:center;gap:6px}
@media(max-width:860px){.pd-grid{grid-template-columns:1fr;gap:24px}.pd-media{position:static}}

/* ============ product page additions ============ */
.prod-wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px 60px}
.crumb{color:var(--muted-2);font-size:13px;padding:22px 2px 20px}
.crumb a{color:var(--muted)}.crumb a:hover{color:var(--text)}

.prod-top{display:grid;grid-template-columns:1.05fr 1fr;gap:40px;align-items:start}

/* gallery */
.gallery{position:sticky;top:20px}
.gmain{position:relative;aspect-ratio:16/11;border-radius:var(--radius);border:1px solid var(--line);overflow:hidden;display:flex;align-items:center;justify-content:center;background:radial-gradient(135% 120% at 25% 12%,#7d4bff4a,#101020 62%)}
.gmain .ginit{font-family:var(--mono);font-size:78px;font-weight:600;color:#fff;opacity:.9;letter-spacing:-.02em}
.gmain img{width:100%;height:100%;object-fit:cover}
.gbadges{position:absolute;top:16px;left:16px;display:flex;gap:8px;z-index:2}
.gbadges .badge{background:rgba(10,10,18,.62);backdrop-filter:blur(6px);border:1px solid var(--line-2);color:#fff;font-size:12px;font-weight:600;padding:6px 12px;border-radius:100px}
.gbadges .off{background:linear-gradient(105deg,#ff5a7a,#ff2d55);color:#fff;font-size:12px;font-weight:700;padding:6px 12px;border-radius:100px}
.gthumbs{display:flex;gap:10px;margin-top:12px}
.gthumb{width:74px;height:60px;border-radius:12px;border:1px solid var(--line);cursor:pointer;overflow:hidden;flex:none;opacity:.6;transition:.15s}
.gthumb.on,.gthumb:hover{opacity:1;border-color:var(--blue)}

/* buy panel */
.buybox{padding-top:4px}
.pcat{color:var(--blue);font-size:12.5px;font-weight:600;letter-spacing:.04em;text-transform:uppercase}
.buybox h1{font-size:clamp(26px,3vw,36px);font-weight:700;letter-spacing:-.02em;line-height:1.12;margin:10px 0 12px}
.prate{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:13.5px;margin-bottom:14px}
.prate .stars{color:#ffcc4d;letter-spacing:2px}
.pshort{color:var(--muted);font-size:15px;line-height:1.6;margin-bottom:22px}

.plan-lbl{font-size:13px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.03em;margin-bottom:10px}
.plan-select{width:100%;height:54px;border-radius:14px;border:1.5px solid var(--line-2);background:var(--surface);color:var(--text);font-family:inherit;font-size:15px;font-weight:600;padding:0 44px 0 16px;cursor:pointer;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%239a9db8' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;transition:.15s;margin-bottom:2px}
.plan-select:hover,.plan-select:focus{border-color:var(--blue);outline:none}
.plan-select option{background:#12121f;color:var(--text)}
.pricebar{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:8px;margin:22px 0 18px;padding:16px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.pricebar .now{font-size:30px;font-weight:700;letter-spacing:-.02em}
.pricebar .was{font-size:17px;color:var(--muted-2);text-decoration:line-through;margin-left:10px}
.pricebar .save{color:#37d67a;font-size:13px;font-weight:600;background:rgba(55,214,122,.1);padding:6px 12px;border-radius:100px}

.buy-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.add-cart{height:54px;border-radius:14px;border:0;font-family:inherit;font-weight:600;font-size:15px;cursor:pointer;background:#fff;color:#0a0a12;display:inline-flex;align-items:center;justify-content:center;gap:9px;transition:.16s}
.add-cart:hover{transform:translateY(-2px);box-shadow:0 16px 34px -16px rgba(255,255,255,.4)}
.buy-wa{height:54px;border-radius:14px;font-weight:600;font-size:15px;cursor:pointer;background:linear-gradient(105deg,#25d366,#128c4a);color:#fff;display:inline-flex;align-items:center;justify-content:center;gap:9px;transition:.16s}
.buy-wa:hover{transform:translateY(-2px);box-shadow:0 16px 34px -16px rgba(37,211,102,.6)}

.mini-trust{display:flex;flex-wrap:wrap;gap:16px;margin-top:20px}
.mini-trust span{display:inline-flex;align-items:center;gap:7px;color:var(--muted);font-size:12.5px}
.mini-trust svg{color:var(--blue)}

/* IPTV extra action buttons */
.iptv-actions{display:flex;flex-wrap:wrap;gap:12px;margin:34px 0 0}
.ia{display:inline-flex;align-items:center;gap:9px;height:48px;padding:0 18px;border-radius:13px;border:1px solid var(--line-2);background:var(--surface);color:var(--text);font-family:inherit;font-weight:500;font-size:14px;cursor:pointer;transition:.15s}
.ia:hover{border-color:var(--blue);background:var(--surface-2);transform:translateY(-1px)}
.ia .iaic{font-size:17px}
.ia.trial{border:0;color:#fff;background:linear-gradient(105deg,#a56bff,#ff2f86,#7d4bff,#a56bff);background-size:280% 100%;animation:trialshift 7s linear infinite;box-shadow:0 14px 30px -16px rgba(255,47,134,.55)}
.ia.trial:hover{filter:brightness(1.08);transform:translateY(-2px)}
.ia.open{border-color:var(--blue);background:var(--surface-2)}

.panel{max-height:0;overflow:hidden;transition:max-height .35s ease;border-radius:16px}
.panel.show{max-height:640px;margin-top:14px}
.panel-in{border:1px solid var(--line);border-radius:16px;background:var(--surface);padding:22px 24px}
.panel-in h4{font-size:15px;margin-bottom:14px}
.chips{display:flex;flex-wrap:wrap;gap:9px}
.chips span{background:var(--surface-2);border:1px solid var(--line);border-radius:100px;padding:8px 15px;font-size:13px;color:var(--text)}
.steps{display:grid;gap:14px}
.step{display:flex;gap:14px;align-items:flex-start}
.step .n{flex:none;width:28px;height:28px;border-radius:50%;background:var(--grad);color:#fff;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700}
.step p{color:var(--muted);font-size:14px;line-height:1.5}
.chan-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.chan{background:var(--surface-2);border:1px solid var(--line);border-radius:12px;padding:12px 14px}
.chan b{font-size:14px}.chan span{display:block;color:var(--muted-2);font-size:12px;margin-top:2px}

/* section blocks */
.psec{margin-top:48px}
.psec > h2{font-size:22px;font-weight:700;letter-spacing:-.01em;margin-bottom:8px}
.psec > .sub{color:var(--muted);font-size:14.5px;margin-bottom:22px}
.pbody{color:var(--muted);font-size:15px;line-height:1.7;max-width:760px}
.features{display:grid;grid-template-columns:1fr 1fr;gap:12px 26px;margin-top:22px;max-width:820px}
.feat{display:flex;gap:11px;align-items:flex-start;color:var(--text);font-size:14.5px}
.feat svg{flex:none;color:#37d67a;margin-top:2px}

/* DOWNLOADS section */
.downloads{margin-top:52px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(180deg,rgba(91,141,255,.05),transparent);padding:30px 30px 32px}
.dl-head{display:flex;align-items:center;gap:14px;margin-bottom:24px}
.dl-head .dlic{width:46px;height:46px;flex:none;border-radius:13px;background:var(--grad);display:flex;align-items:center;justify-content:center;color:#fff}
.dl-head h2{font-size:21px;font-weight:700}
.dl-head p{color:var(--muted);font-size:14px;margin-top:2px}
.dl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.dl-card{display:flex;align-items:center;gap:14px;padding:16px;border:1px solid var(--line);border-radius:15px;background:var(--surface);transition:.15s}
.dl-card:hover{border-color:var(--blue);transform:translateY(-2px)}
.dl-ic{width:46px;height:46px;flex:none;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:22px;background:var(--surface-2);border:1px solid var(--line)}
.dl-meta{flex:1;min-width:0}
.dl-meta b{font-size:14.5px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dl-meta span{color:var(--muted-2);font-size:12px}
.dl-btn{flex:none;width:40px;height:40px;border-radius:11px;border:1px solid var(--line-2);background:var(--surface-2);color:var(--text);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:.15s}
.dl-btn:hover{background:var(--blue);border-color:var(--blue);color:#fff}

@media(max-width:900px){
  .prod-top{grid-template-columns:1fr;gap:26px}
  .gallery{position:static}
  .features{grid-template-columns:1fr}
}
@media(max-width:560px){
  .prod-wrap{padding:0 16px 48px}
  .plans{grid-template-columns:1fr}
  .buy-actions{grid-template-columns:1fr}
  .downloads{padding:22px 18px}
}

/* ============ cart / checkout / order ============ */
.shop-wrap{max-width:var(--maxw);margin:0 auto;padding:34px 24px 70px}
.shop-wrap h1{font-size:clamp(24px,3vw,32px);font-weight:700;letter-spacing:-.02em;margin-bottom:6px}
.shop-wrap .lead{color:var(--muted);margin-bottom:26px}
.shop-grid{display:grid;grid-template-columns:1fr 360px;gap:26px;align-items:start}
.card-box{border:1px solid var(--line);border-radius:18px;background:var(--surface);padding:8px 18px}
.summary{border:1px solid var(--line);border-radius:18px;background:var(--surface);padding:22px;position:sticky;top:20px}
.summary h3{font-size:16px;margin-bottom:16px}
.sum-row{display:flex;justify-content:space-between;color:var(--muted);font-size:14px;padding:7px 0}
.sum-row.total{color:var(--text);font-weight:700;font-size:19px;border-top:1px solid var(--line);margin-top:8px;padding-top:14px}
.sum-row .usd,.sum-row .pkr{font-family:var(--font)}
.citem{display:flex;align-items:center;gap:14px;padding:16px 0;border-bottom:1px solid var(--line)}
.citem:last-child{border-bottom:0}
.citem .ci-img{width:60px;height:60px;flex:none;border-radius:12px;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-family:var(--mono);color:#fff;font-size:18px;overflow:hidden}
.citem .ci-img img{width:100%;height:100%;object-fit:cover}
.ci-main{flex:1;min-width:0}
.ci-main b{font-size:14.5px;display:block}
.ci-main span{color:var(--muted);font-size:12.5px}
.ci-price{font-weight:700;white-space:nowrap}
.qtybox{display:inline-flex;align-items:center;border:1px solid var(--line-2);border-radius:10px;overflow:hidden}
.qtybox button{width:30px;height:32px;border:0;background:var(--surface-2);color:var(--text);cursor:pointer;font-size:16px}
.qtybox input{width:38px;height:32px;border:0;background:transparent;color:var(--text);text-align:center;font-family:var(--font)}
.ci-rm{background:none;border:0;color:var(--muted-2);cursor:pointer;font-size:13px}
.ci-rm:hover{color:#ff6b81}
.empty{text-align:center;padding:60px 20px;color:var(--muted)}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.f label{display:block;font-size:13px;color:var(--muted);margin-bottom:7px;font-weight:500}
.f{margin-bottom:16px}
.f input{width:100%;height:50px;border:1px solid var(--line-2);border-radius:12px;background:var(--surface-2);color:var(--text);padding:0 15px;font-family:inherit;font-size:15px}
.f input:focus{outline:none;border-color:var(--blue)}
.pay-methods{display:grid;gap:12px;margin:6px 0 4px}
.pay{display:flex;align-items:center;gap:13px;padding:16px;border:1.5px solid var(--line-2);border-radius:14px;cursor:pointer;transition:.15s}
.pay:hover{border-color:var(--muted)}
.pay.sel{border-color:var(--blue);background:linear-gradient(180deg,rgba(91,141,255,.1),transparent);box-shadow:0 0 0 3px rgba(91,141,255,.13)}
.pay input{position:absolute;opacity:0}
.pay .pic{width:42px;height:42px;flex:none;border-radius:10px;background:var(--surface-2);display:flex;align-items:center;justify-content:center;font-size:20px}
.pay b{font-size:14.5px}.pay span{color:var(--muted);font-size:12.5px}
.co-btn{width:100%;height:54px;border:0;border-radius:14px;background:#fff;color:#0a0a12;font-weight:700;font-size:15px;cursor:pointer;margin-top:8px;transition:.16s}
.co-btn:hover{transform:translateY(-2px);box-shadow:0 16px 34px -16px rgba(255,255,255,.4)}
.ostatus{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;border-radius:100px;font-size:13px;font-weight:600}
.ostatus.pending,.ostatus.submitted{background:rgba(255,193,80,.14);color:#ffcc55}
.ostatus.paid{background:rgba(255,47,134,.15);color:#ff9dc4}
.ostatus.delivered{background:rgba(55,214,122,.14);color:#37d67a}
.ostatus.cancelled{background:rgba(255,90,120,.14);color:#ff6b81}
.paybox{border:1px solid var(--line);border-radius:16px;background:var(--surface-2);padding:20px;margin:18px 0}
.paybox h4{font-size:15px;margin-bottom:12px}
.payrow{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px dashed var(--line);font-size:14px}
.payrow:last-child{border-bottom:0}
.payrow .k{color:var(--muted)}.payrow .val{font-family:var(--mono);color:var(--text);text-align:right;word-break:break-all}
.copy{cursor:pointer;color:var(--blue);font-size:12px;margin-left:8px}
.wa-contact{display:inline-flex;align-items:center;justify-content:center;gap:9px;height:50px;padding:0 22px;border-radius:13px;background:linear-gradient(105deg,#25d366,#128c4a);color:#fff;font-weight:600;font-size:14.5px}
@media(max-width:860px){ .shop-grid{grid-template-columns:1fr} .summary{position:static} .field-row{grid-template-columns:1fr} }
.cart-ic{position:relative}
.cart-badge{position:absolute;top:-5px;right:-5px;min-width:18px;height:18px;padding:0 5px;border-radius:100px;background:var(--blue);color:#fff;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;font-family:var(--font)}

@media (prefers-reduced-motion: reduce){ .flash-bar,.flash-badge,.flash-cta{animation:none!important} }

/* Batch 1 — card blurb + country flags */
.card .card-desc{margin:6px 0 0;color:var(--muted);font-size:12px;line-height:1.55;white-space:pre-line;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
.ctry-flags{position:absolute;top:10px;left:10px;z-index:4;display:flex;gap:4px}
.ctry-flags .cf{font-size:14px;line-height:1;background:rgba(6,6,14,.6);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.16);border-radius:7px;padding:3px 6px}
.ctry-flags.has-rank{top:50px}
.ctry-flags .cf.more{font-size:11px;font-weight:700;color:#fff;display:inline-flex;align-items:center}

.tp-stars .tps{width:22px;height:22px;font-size:14px}}

.tp-badge{flex-wrap:wrap;justify-content:center;gap:6px;text-align:center}}

/* 3D stat counter cards */
.stats3d{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:30px;perspective:1000px}
.stat3d{position:relative;border-radius:16px;padding:18px 16px;text-align:center;background:linear-gradient(160deg,rgba(165,107,255,.12),rgba(255,47,134,.06)),var(--surface);border:1px solid var(--line-2);transform:rotateX(8deg);transform-style:preserve-3d;box-shadow:0 22px 40px -24px rgba(0,0,0,.8),inset 0 1px 0 rgba(255,255,255,.06);transition:transform .35s cubic-bezier(.2,.7,.3,1)}
.stat3d::before{content:"";position:absolute;inset:0;border-radius:16px;background:radial-gradient(80% 60% at 50% 0,rgba(255,47,134,.18),transparent 70%);opacity:0;transition:.35s;pointer-events:none}
.stat3d:hover{transform:rotateX(0) translateY(-4px)}
.stat3d:hover::before{opacity:1}
.stat3d b{display:block;font-family:var(--mono);font-weight:700;font-size:30px;line-height:1;background:linear-gradient(120deg,var(--violet),var(--accent));-webkit-background-clip:text;background-clip:text;color:transparent}
.stat3d span{display:block;margin-top:8px;font-size:12.5px;color:var(--muted);letter-spacing:.01em}
@media(max-width:760px){.stats3d{grid-template-columns:1fr 1fr;gap:11px;margin-top:22px}.stat3d b{font-size:25px}}
@media(prefers-reduced-motion:reduce){.stat3d{transform:none;transition:none}}

/* Trustpilot — subtle, inside the footer brand column */
.tp-inline{margin-top:16px}
.tp-badge{display:inline-flex;align-items:center;gap:9px;text-decoration:none}
.tp-badge .tp-stars{display:inline-flex;gap:2px}
.tp-badge .tps{width:17px;height:17px;display:grid;place-items:center;background:#43434f;color:#fff;font-size:10px;border-radius:3px}
.tp-badge .tps.on{background:#00b67a}
.tp-badge .tps.half{background:linear-gradient(90deg,#00b67a 50%,#43434f 50%)}
.tp-txt{font-size:12.5px;color:var(--muted)}
.tp-txt b{color:var(--text)}
.tp-name{color:var(--text);font-weight:600;white-space:nowrap}
.tp-name .tp-star{color:#00b67a}
.tp-real{margin-top:14px}
/* payment method logos in footer */
.paybar .pays .pay-logo{display:inline-flex;align-items:center;background:#fff;border-radius:6px;padding:5px 9px;height:30px}
.paybar .pays .pay-logo img{height:20px;width:auto;display:block;object-fit:contain}

/* rotating flash offers — 3D flip swap */
.flash-bar{position:relative}
.flash-stage{position:relative;min-height:38px;perspective:900px;display:flex;justify-content:center}
.flash-slide{display:flex;align-items:center;justify-content:center;gap:14px;min-height:38px;flex-wrap:wrap;padding:4px 44px;position:absolute;inset:0;opacity:0;pointer-events:none;transform:rotateX(-90deg);transform-origin:top center;backface-visibility:hidden;transition:transform .6s cubic-bezier(.4,.15,.2,1),opacity .5s}
.flash-slide.active{position:relative;inset:auto;transform:none;opacity:1;pointer-events:auto}
.flash-slide::-webkit-scrollbar{display:none}
.flash-slide.active{opacity:1;pointer-events:auto;transform:rotateX(0)}
.flash-slide.leaving{opacity:0;transform:rotateX(90deg);transform-origin:bottom center}
.flash-dots{position:absolute;right:38px;top:50%;transform:translateY(-50%);display:flex;gap:5px;z-index:3}
.flash-dots .fdot{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.4);transition:.25s}
.flash-dots .fdot.on{background:#fff;width:16px;border-radius:3px}
@media(max-width:680px){.flash-dots{display:none}}
@media(prefers-reduced-motion:reduce){.flash-slide{transition:opacity .3s}.flash-slide.active{transform:none}.flash-slide.leaving{transform:none}}

/* CMS page */
.page-wrap{padding:36px 20px 60px;max-width:820px}
.crumb{font-size:13px;color:var(--muted);margin-bottom:20px}
.crumb a{color:var(--muted);text-decoration:none}.crumb a:hover{color:var(--text)}
.crumb span{margin:0 6px;opacity:.6}
.page-content h1{font-size:30px;font-weight:800;letter-spacing:-.02em;margin:0 0 20px}
.page-content h2{font-size:20px;font-weight:700;margin:26px 0 10px}
.page-content h3{font-size:16px;font-weight:600;margin:20px 0 8px}
.page-content p{color:var(--soft,#c9c9d8);font-size:15px;line-height:1.75;margin:0 0 14px}
.page-content ul,.page-content ol{color:var(--soft,#c9c9d8);font-size:15px;line-height:1.75;padding-left:22px;margin:0 0 14px}
.page-content li{margin-bottom:6px}
.page-content a{color:#ff7ab0}
@media(max-width:640px){.page-wrap{padding:24px 16px 44px}.page-content h1{font-size:24px}}

/* ================= MOBILE NAV DRAWER ================= */
.mnav-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.55);backdrop-filter:blur(2px);z-index:120;opacity:0;visibility:hidden;transition:.25s}
.mnav-backdrop.open{opacity:1;visibility:visible}
.mnav{position:fixed;top:0;right:0;height:100%;width:min(84vw,340px);background:var(--surface);border-left:1px solid var(--line-2);z-index:121;transform:translateX(100%);transition:transform .28s cubic-bezier(.4,0,.2,1);padding:18px;display:flex;flex-direction:column;gap:16px;overflow-y:auto}
.mnav.open{transform:translateX(0)}
.mnav-head{display:flex;align-items:center;justify-content:space-between}
.mnav-head .brandlogo{height:34px}
.mnav-close{background:none;border:0;color:var(--muted);font-size:20px;cursor:pointer;width:38px;height:38px;border-radius:10px}
.mnav-close:hover{background:rgba(255,255,255,.06);color:var(--text)}
.mnav-search input{width:100%;height:46px;border-radius:12px;border:1px solid var(--line-2);background:var(--surface-2);color:var(--text);padding:0 14px;font-family:inherit;font-size:15px}
.mnav-cur{display:flex;border:1px solid var(--line-2);border-radius:11px;overflow:hidden;font-family:var(--mono);font-size:13px}
.mnav-cur button{flex:1;background:transparent;color:var(--muted);border:0;padding:11px 0;cursor:pointer;font-family:inherit}
.mnav-cur button.on{background:rgba(255,255,255,.08);color:#fff}
.mnav-links{display:flex;flex-direction:column;gap:2px}
.mnav-links a{padding:13px 12px;border-radius:10px;color:var(--text);font-size:15.5px;font-weight:500}
.mnav-links a:active,.mnav-links a:hover{background:rgba(255,47,134,.1)}
.mnav-cart{margin-top:auto;text-align:center;background:var(--accent);color:var(--on-accent);font-weight:700;padding:14px;border-radius:12px}

/* ================= RESPONSIVE SYSTEM ================= */
html,body{max-width:100%;overflow-x:hidden}
img{max-width:100%}
*{-webkit-tap-highlight-color:transparent}

@media(max-width:1080px){ .grid{grid-template-columns:repeat(3,1fr)} }

/* ---- tablet ---- */
@media(max-width:900px){
  .trust .wrap{grid-template-columns:repeat(2,1fr)}
  .promo{flex-direction:column;align-items:flex-start;padding:34px}
  .pd-grid{grid-template-columns:1fr;gap:24px}.pd-media{position:static}
  .shop-grid{grid-template-columns:1fr}.summary{position:static}
}

/* ---- phones: header becomes logo + search + cart + burger ---- */
@media(max-width:760px){
  .bar{height:60px;gap:12px}
  .logo .brandlogo{height:38px}
  .search{display:none}                 /* search lives in the drawer on phones */
  .actions{gap:8px;margin-left:auto}
  .cur{display:none}
  .signin{display:none}                 /* moved into drawer; keeps header clean */
  .burger{display:grid}
  .catbar{display:none}                 /* categories live in the drawer */
  header .cart-ic{width:40px;height:40px}

  /* flash bar: keep visible height on phones, single readable line */
  .flash-bar{padding:0 10px}
  .flash-stage{min-height:40px}
  .flash-slide{gap:6px 8px;padding:7px 26px;flex-wrap:wrap;justify-content:center;position:absolute;inset:0;align-content:center}
  .flash-badge{font-size:9.5px;padding:3px 7px;flex:none;letter-spacing:.03em}
  .flash-sub{font-size:11.5px;font-weight:700;line-height:1.25;white-space:normal;text-align:center}
  .flash-count{font-size:10.5px;padding:3px 8px;flex:none}
  .flash-cta{font-size:10.5px;padding:6px 11px;flex:none}
  .flash-dots{display:none}

  /* hero */
  .hero{min-height:auto}
  .hero-center{padding:44px 18px 28px}
  .hero h1{font-size:clamp(28px,8.5vw,42px);line-height:1.08}
  .hero .lede{font-size:14.5px}
  .hero-search{margin-top:24px}
  .hero-search input{height:52px;font-size:15px;padding:0 92px 0 46px}
  .hero-search .go{height:40px;top:6px;right:6px;padding:0 15px;font-size:14px}
  .hero-chips{margin-top:16px;gap:8px}
  .hero-chips .chip{font-size:12.5px;padding:7px 12px}
  .hero-cta{width:100%}.hero-cta .btn-trial{width:100%;justify-content:center;font-size:13.5px;padding:0 14px;height:50px}
  .hero-marquee{display:none}           /* the floating brand marquee is noisy on phones */

  /* product cards: 2-up */
  .grid{grid-template-columns:repeat(2,1fr)!important;gap:12px}
  .card .body h3{font-size:14px}
  .card .card-desc{-webkit-line-clamp:4;font-size:11.5px}
  .card .buy{font-size:12px}

  /* section spacing */
  section.blk{padding:40px 0}
  .blk .head h2{font-size:19px}
  .wrap{padding-left:16px;padding-right:16px}

  /* stat cards */
  .stats3d{grid-template-columns:1fr 1fr;gap:10px;margin-top:22px}
  .stat3d{padding:15px 12px}.stat3d b{font-size:23px}

  /* product detail */
  .pd-media{position:static!important}
  .buybar,.pd-buy{flex-wrap:wrap}
  .psec .grid{grid-template-columns:1fr!important}
  .rcard{width:auto}

  /* cart / checkout */
  .shop-grid{grid-template-columns:1fr}.field-row{grid-template-columns:1fr}

  /* footer */
  .foot{grid-template-columns:1fr 1fr;gap:22px}
  .foot .brand{grid-column:1/-1}
  .paybar{flex-direction:column;align-items:flex-start;gap:12px}
  .paybar .pays{flex-wrap:wrap}

  /* whatsapp float compact */
  .wa-float{left:14px;bottom:14px;height:50px}
  .wa-float .lbl{display:none}

  /* tables scroll */
  .tbl{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
}

/* ---- small phones ---- */
@media(max-width:430px){
  .hero h1{font-size:25px}
  .grid{grid-template-columns:repeat(2,1fr);gap:10px}
  .stat3d b{font-size:20px}.stat3d span{font-size:10px}
  .foot{grid-template-columns:1fr}
  .blk .head{flex-wrap:wrap;gap:8px}

}

/* ================= CUSTOMER ACCOUNTS ================= */
.btn-primary{display:inline-flex;align-items:center;justify-content:center;height:50px;padding:0 24px;border-radius:12px;border:0;cursor:pointer;font-family:inherit;font-size:15px;font-weight:700;color:var(--on-accent,#2a0416);background:linear-gradient(105deg,#ff2f86,#a56bff);box-shadow:0 12px 30px -14px rgba(255,47,134,.6);transition:.16s;text-decoration:none}
.btn-primary:hover{filter:brightness(1.05);transform:translateY(-1px)}
.btn-primary.full{width:100%}
.btn-ghost{display:inline-flex;align-items:center;justify-content:center;height:42px;padding:0 18px;border-radius:11px;border:1px solid var(--line-2);background:transparent;color:var(--text);font-family:inherit;font-size:14px;font-weight:600;cursor:pointer;text-decoration:none;transition:.15s}
.btn-ghost:hover{background:rgba(255,255,255,.05)}

.auth-wrap{min-height:70vh;display:flex;align-items:center;justify-content:center;padding:48px 18px 70px}
.auth-card{width:100%;max-width:420px;background:var(--surface);border:1px solid var(--line-2);border-radius:18px;padding:34px 30px}
.auth-card h1{font-size:24px;font-weight:800;letter-spacing:-.02em;margin:0 0 6px}
.auth-sub{color:var(--muted);font-size:14px;margin:0 0 22px}
.auth-card label{display:block;font-size:13px;font-weight:600;color:var(--muted-2,#b7b2c6);margin-bottom:14px}
.auth-card label .opt{font-weight:400;color:var(--muted);font-size:12px}
.auth-card input{display:block;width:100%;height:48px;margin-top:7px;border-radius:11px;border:1px solid var(--line-2);background:var(--surface-2,rgba(255,255,255,.03));color:var(--text);padding:0 14px;font-family:inherit;font-size:15px;outline:none;transition:.15s}
.auth-card input:focus{border-color:#ff2f86;box-shadow:0 0 0 4px rgba(255,47,134,.12)}
.auth-row{display:flex;justify-content:flex-end;margin:-4px 0 18px}
.auth-row a,.auth-alt a{color:#ff7ab0;font-size:13px;text-decoration:none}
.auth-alt{text-align:center;color:var(--muted);font-size:14px;margin:20px 0 0}
.auth-err{background:rgba(255,60,90,.12);border:1px solid rgba(255,60,90,.35);color:#ff9db0;font-size:13.5px;padding:11px 14px;border-radius:11px;margin-bottom:18px}
.auth-ok{background:rgba(70,220,140,.1);border:1px solid rgba(70,220,140,.3);color:#8ee6b4;font-size:14px;line-height:1.55;padding:14px 16px;border-radius:12px;margin-bottom:18px}

.acct-wrap{max-width:820px;padding:40px 18px 70px}
.acct-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:8px}
.acct-head h1{font-size:26px;font-weight:800;letter-spacing:-.02em;margin:0}
.acct-sub{color:var(--muted);font-size:13.5px;margin:4px 0 0;font-family:var(--mono)}
.acct-h2{font-size:16px;font-weight:700;margin:30px 0 16px;color:var(--muted-2,#c9c4d6)}
.acct-empty{border:1px dashed var(--line-2);border-radius:16px;padding:40px 24px;text-align:center;color:var(--muted)}
.acct-empty p{margin:0 0 16px}
.acct-orders{display:flex;flex-direction:column;gap:14px}
.ao{border:1px solid var(--line-2);border-radius:16px;background:var(--surface);overflow:hidden}
.ao-top{display:flex;align-items:center;justify-content:space-between;padding:15px 18px;border-bottom:1px solid var(--line)}
.ao-ref{font-family:var(--mono);font-weight:700;font-size:14px;margin-right:12px}
.ao-date{color:var(--muted);font-size:12.5px}
.ao-status{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;padding:5px 10px;border-radius:20px}
.s-pending{background:rgba(255,190,60,.14);color:#ffcf7a}
.s-paid,.s-processing{background:rgba(90,150,255,.14);color:#8fb4ff}
.s-delivered{background:rgba(70,220,140,.14);color:#8ee6b4}
.s-cancelled,.s-refunded{background:rgba(255,80,110,.12);color:#ff9db0}
.ao-items{padding:14px 18px;display:flex;flex-direction:column;gap:10px}
.ao-name{font-size:14px;font-weight:600}
.ao-plan{color:var(--muted);font-weight:400}
.ao-creds{background:rgba(165,107,255,.07);border:1px solid rgba(165,107,255,.2);border-radius:11px;padding:11px 13px;margin-top:2px}
.ao-creds-h{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:#c79bff;font-weight:700;margin-bottom:7px}
.ao-cred{display:flex;justify-content:space-between;gap:14px;font-size:13px;padding:3px 0}
.ao-cred span{color:var(--muted)}
.ao-cred b{font-family:var(--mono);word-break:break-all;text-align:right}
.ao-foot{display:flex;align-items:center;justify-content:space-between;padding:13px 18px;border-top:1px solid var(--line)}
.ao-total{font-weight:800;font-size:16px}
.ao-view{color:#ff7ab0;font-size:13.5px;font-weight:600;text-decoration:none}

/* ================= PAGINATION ================= */
.pager{display:flex;gap:6px;justify-content:center;align-items:center;margin:30px 0 4px;flex-wrap:wrap}
.pager .pg{min-width:38px;height:38px;padding:0 12px;display:inline-flex;align-items:center;justify-content:center;border-radius:10px;border:1px solid var(--line-2);background:var(--surface);color:var(--text);font-size:13.5px;font-weight:600;text-decoration:none;font-family:var(--mono);transition:.14s}
.pager .pg:hover{border-color:#ff2f86;color:#ff7ab0}
.pager .pg.cur{background:linear-gradient(105deg,#ff2f86,#a56bff);color:#2a0416;border-color:transparent}
.pager .pg.off{opacity:.4;pointer-events:none}
.pager .pg.gap{border:0;background:none;pointer-events:none;color:var(--muted)}
.mnav-acct{text-align:center;border:1px solid var(--line-2);border-radius:12px;padding:13px;color:var(--text);font-weight:600}

@media(max-width:640px){
  .auth-card{padding:26px 20px}
  .acct-head h1{font-size:22px}
  .ao-cred{flex-direction:column;gap:1px}.ao-cred b{text-align:left}
  .pager .pg.nav{font-size:12px;padding:0 9px}
}

/* ============ UPGRADED CUSTOMER DASHBOARD ============ */
.acct-wrap{max-width:860px;padding:38px 18px 72px}
.acct-hero{display:flex;align-items:center;gap:16px;margin-bottom:24px}
.acct-ava{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;font-size:24px;font-weight:800;color:#fff;background:linear-gradient(135deg,#ff2f86,#a56bff);box-shadow:0 12px 30px -12px rgba(255,47,134,.6);flex:none}
.acct-hero-txt{flex:1;min-width:0}
.acct-hero-txt h1{font-size:24px;font-weight:800;letter-spacing:-.02em;margin:0}
.acct-hero-txt .acct-sub{color:var(--muted);font-size:13.5px;margin:3px 0 0;font-family:var(--mono);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.acct-logout{flex:none}

.acct-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:30px}
.astat{border:1px solid var(--line-2);border-radius:14px;background:var(--surface);padding:16px 18px;text-align:center}
.astat b{display:block;font-size:26px;font-weight:800;background:linear-gradient(120deg,#ff2f86,#a56bff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;line-height:1}
.astat span{display:block;color:var(--muted);font-size:12px;margin-top:6px}

.acct-bar{display:flex;align-items:center;justify-content:space-between;margin:0 0 16px}
.acct-h2{font-size:16px;font-weight:700;margin:0;color:var(--muted-2,#c9c4d6)}
.btn-ghost.sm{height:36px;padding:0 14px;font-size:13px}

.acct-empty{border:1px dashed var(--line-2);border-radius:18px;padding:48px 24px;text-align:center;color:var(--muted)}
.ae-ic{font-size:40px;margin-bottom:10px}
.acct-empty p{margin:0 0 18px}

.acct-orders{display:flex;flex-direction:column;gap:16px}
.ao{border:1px solid var(--line-2);border-radius:18px;background:var(--surface);overflow:hidden}
.ao-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px 14px}
.ao-id{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.ao-ref{font-family:var(--mono);font-weight:700;font-size:14.5px}
.ao-date{color:var(--muted);font-size:12.5px}
.ao-status{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;padding:5px 11px;border-radius:20px;white-space:nowrap}
.s-pending,.s-submitted{background:rgba(255,190,60,.14);color:#ffcf7a}
.s-paid{background:rgba(90,150,255,.16);color:#8fb4ff}
.s-delivered{background:rgba(70,220,140,.16);color:#8ee6b4}
.s-cancelled,.s-refunded{background:rgba(255,80,110,.13);color:#ff9db0}

/* progress steps */
.ao-steps{display:flex;align-items:center;padding:4px 20px 16px}
.ao-step{display:flex;align-items:center;gap:7px;font-size:11.5px;font-weight:600;color:var(--muted);white-space:nowrap}
.ao-step .dot{width:11px;height:11px;border-radius:50%;background:var(--line-2);border:2px solid var(--line-2);transition:.2s}
.ao-step.done{color:#8ee6b4}
.ao-step.done .dot{background:#37d67a;border-color:#37d67a;box-shadow:0 0 0 4px rgba(55,214,122,.15)}
.ao-line{flex:1;height:2px;background:var(--line-2);margin:0 8px;min-width:16px}
.ao-line.on{background:linear-gradient(90deg,#37d67a,#8ee6b4)}

.ao-items{padding:2px 18px 4px;display:flex;flex-direction:column;gap:12px;border-top:1px solid var(--line)}
.ao-items:first-child{border-top:0}
.ao-item{padding-top:12px}
.ao-name{font-size:14px;font-weight:600}
.ao-plan{color:var(--muted);font-weight:400}

.ao-creds{background:rgba(165,107,255,.07);border:1px solid rgba(165,107,255,.22);border-radius:13px;padding:13px 14px;margin:2px 0 4px}
.ao-creds-h{font-size:11.5px;text-transform:uppercase;letter-spacing:.06em;color:#c79bff;font-weight:700;margin-bottom:9px}
.ao-cred{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:6px 0;border-top:1px solid rgba(165,107,255,.12)}
.ao-cred:first-of-type{border-top:0}
.ao-cred-k{color:var(--muted);font-size:12.5px;flex:none}
.ao-cred-v{display:flex;align-items:center;gap:9px;min-width:0;flex:1;justify-content:flex-end}
.ao-cred-v b{font-family:var(--mono);font-size:13px;word-break:break-all;text-align:right}
.copybtn{flex:none;border:1px solid rgba(165,107,255,.4);background:rgba(165,107,255,.12);color:#c79bff;font-size:11px;font-weight:600;padding:4px 10px;border-radius:8px;cursor:pointer;font-family:inherit;transition:.14s}
.copybtn:hover{background:rgba(165,107,255,.22)}
.copybtn.ok{background:rgba(55,214,122,.16);border-color:rgba(55,214,122,.5);color:#8ee6b4}
.ao-instr{margin-top:10px;padding:10px 12px;background:rgba(0,0,0,.18);border-radius:10px;color:var(--soft,#c9c4d6);font-size:12.5px;line-height:1.6;white-space:pre-wrap}
.ao-note{margin:0 18px 12px;padding:11px 14px;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:11px;color:var(--soft,#c9c4d6);font-size:13px;line-height:1.55;white-space:pre-wrap}

.ao-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 18px;border-top:1px solid var(--line)}
.ao-total{font-weight:800;font-size:16px}
.ao-actions{display:flex;align-items:center;gap:14px}
.ao-wa{color:#37d67a;font-size:13px;font-weight:600;text-decoration:none}
.ao-wa:hover{text-decoration:underline}
.ao-view{color:#ff7ab0;font-size:13.5px;font-weight:600;text-decoration:none}

@media(max-width:640px){
  .acct-hero-txt h1{font-size:21px}
  .acct-stats{gap:8px}
  .astat{padding:13px 8px}.astat b{font-size:21px}.astat span{font-size:10.5px}
  .ao-steps{padding:4px 14px 14px}.ao-step{font-size:10.5px}.ao-step .dot{width:9px;height:9px}
  .ao-cred{flex-direction:column;align-items:flex-start;gap:5px}
  .ao-cred-v{justify-content:flex-start;width:100%}.ao-cred-v b{text-align:left}
}

/* ============ PREMIUM DASHBOARD POLISH ============ */
.acct-wrap{position:relative}
.acct-hero{position:relative;padding:22px 22px;border-radius:20px;background:
  radial-gradient(120% 160% at 0% 0%, rgba(255,47,134,.14), transparent 55%),
  radial-gradient(120% 160% at 100% 0%, rgba(165,107,255,.16), transparent 55%),
  var(--surface);
  border:1px solid var(--line-2);overflow:hidden;margin-bottom:20px}
.acct-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,.04) 50%,transparent 60%);pointer-events:none}
.acct-ava{box-shadow:0 12px 30px -10px rgba(255,47,134,.55),0 0 0 1px rgba(255,255,255,.08) inset}
.astat{position:relative;background:linear-gradient(180deg,var(--surface),rgba(255,255,255,.015));transition:.18s}
.astat:hover{transform:translateY(-2px);border-color:rgba(165,107,255,.4)}
.ao{position:relative;transition:.18s;background:linear-gradient(180deg,var(--surface),rgba(255,255,255,.012))}
.ao:hover{border-color:rgba(165,107,255,.32);box-shadow:0 18px 44px -26px rgba(165,107,255,.5)}
.ao-creds{position:relative;background:
  radial-gradient(120% 120% at 100% 0%, rgba(255,47,134,.06), transparent 60%),
  rgba(165,107,255,.07)}
.copybtn:active{transform:scale(.94)}
/* delivered orders get a subtle glow ring */
.ao:has(.s-delivered){border-color:rgba(55,214,122,.28)}

/* ---- product option pills (e.g. Family / Adult) ---- */
.opt-pills{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
.opt-pill{position:relative;cursor:pointer;display:inline-flex;align-items:center;gap:7px;border:1.5px solid var(--line-2);background:var(--surface);border-radius:11px;padding:7px 13px 7px 11px;font-size:13px;font-weight:600;color:var(--muted);transition:.15s;user-select:none;line-height:1}
.opt-pill input{position:absolute;opacity:0;width:0;height:0;pointer-events:none}
.opt-pill .op-tick{width:15px;height:15px;border-radius:50%;border:2px solid var(--line-2);flex:none;transition:.15s;position:relative}
.opt-pill .op-txt{white-space:nowrap}
.opt-pill:hover{border-color:rgba(165,107,255,.55);color:var(--text)}
.opt-pill.sel{border-color:#ff2f86;color:#fff;background:linear-gradient(180deg,rgba(255,47,134,.12),rgba(165,107,255,.06))}
.opt-pill.sel .op-tick{border-color:#ff2f86;background:#ff2f86}
.opt-pill.sel .op-tick::after{content:"";position:absolute;left:3px;top:1px;width:4px;height:8px;border:solid #2a0416;border-width:0 2px 2px 0;transform:rotate(45deg)}
.opt-pill.adult.sel{border-color:#ff5c6e;background:linear-gradient(180deg,rgba(255,92,110,.14),rgba(255,47,134,.06))}
.opt-pill.adult.sel .op-tick{border-color:#ff5c6e;background:#ff5c6e}
.opt-hint{color:var(--muted);font-size:11.5px;margin:9px 0 0;line-height:1.5}

/* ---- premium delivery message block (from bot / manual) ---- */
.ao-delivbox{margin:4px 0 6px;border:1px solid rgba(55,214,122,.3);border-radius:14px;overflow:hidden;background:
  radial-gradient(120% 120% at 0% 0%, rgba(55,214,122,.08), transparent 60%), rgba(255,255,255,.015)}
.ao-delivbox .adh{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 14px;background:rgba(55,214,122,.1);border-bottom:1px solid rgba(55,214,122,.18)}
.ao-delivbox .adh b{font-size:12.5px;color:#8ee6b4;text-transform:uppercase;letter-spacing:.05em}
.ao-delivmsg{margin:0;padding:14px;font-family:var(--mono);font-size:12.5px;line-height:1.6;color:var(--text);white-space:pre-wrap;word-break:break-word}
.ao-item .opt-tag{display:inline-block;font-size:11px;font-weight:700;color:#c79bff;background:rgba(165,107,255,.14);border:1px solid rgba(165,107,255,.3);border-radius:6px;padding:1px 7px;margin-left:6px;vertical-align:middle}

/* option pill: default badge + adult styling */
.opt-pill .opt-def{font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:#8ee6b4;background:rgba(55,214,122,.16);padding:1px 6px;border-radius:20px;margin-left:5px;font-style:normal;vertical-align:middle}
.opt-pill.adult.sel{border-color:#ff5c6e;background:linear-gradient(180deg,rgba(255,92,110,.16),rgba(255,47,134,.08));box-shadow:0 8px 22px -12px rgba(255,92,110,.5)}
.opt-hint{color:var(--muted);font-size:12px;margin:9px 0 0;line-height:1.5}

/* ============ PRO ACCOUNT DASHBOARD (sidebar) ============ */
.acct2{display:grid;grid-template-columns:248px 1fr;gap:24px;align-items:start;padding:34px 18px 70px;max-width:1080px}
.acct-side{position:sticky;top:86px;border:1px solid var(--line-2);border-radius:18px;background:
  radial-gradient(120% 140% at 0% 0%, rgba(255,47,134,.1), transparent 55%),
  radial-gradient(120% 140% at 100% 0%, rgba(165,107,255,.12), transparent 55%), var(--surface);
  padding:18px;overflow:hidden}
.acct-me{display:flex;align-items:center;gap:12px;padding:2px 4px 16px;border-bottom:1px solid var(--line);margin-bottom:12px}
.acct-me .acct-ava{width:44px;height:44px;border-radius:13px;font-size:19px}
.acct-me-txt{min-width:0}
.acct-me-txt b{display:block;font-size:14.5px;font-weight:700}
.acct-me-txt span{display:block;font-size:11.5px;color:var(--muted);font-family:var(--mono);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.acct-menu{display:flex;flex-direction:column;gap:3px}
.am{display:flex;align-items:center;gap:11px;padding:11px 12px;border-radius:11px;color:var(--muted-2,#c9c4d6);font-size:14px;font-weight:600;text-decoration:none;transition:.14s}
.am svg{width:18px;height:18px;flex:none}
.am:hover{background:rgba(255,255,255,.04);color:var(--text)}
.am.on{background:linear-gradient(100deg,rgba(255,47,134,.16),rgba(165,107,255,.12));color:#fff;box-shadow:inset 0 0 0 1px rgba(255,47,134,.25)}
.acct-out{margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}
.acct-out button{display:flex;align-items:center;gap:11px;width:100%;padding:11px 12px;border-radius:11px;border:0;background:transparent;color:var(--muted);font-family:inherit;font-size:14px;font-weight:600;cursor:pointer;transition:.14s}
.acct-out button svg{width:18px;height:18px}
.acct-out button:hover{background:rgba(255,80,110,.1);color:#ff9db0}

.acct-main{min-width:0}
.am-head{margin-bottom:20px}
.am-head h1{font-size:24px;font-weight:800;letter-spacing:-.02em;margin:0}
.am-back{margin-bottom:14px}
.lnk{color:#ff7ab0;font-size:13.5px;font-weight:600;text-decoration:none}
.am-bar{display:flex;align-items:center;justify-content:space-between;margin:26px 0 14px}
.am-bar h2{font-size:15px;font-weight:700;margin:0;color:var(--muted-2,#c9c4d6)}

/* tappable order rows */
.ord-list{display:flex;flex-direction:column;gap:10px}
.ord-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:15px 16px;border:1px solid var(--line-2);border-radius:14px;background:var(--surface);text-decoration:none;color:var(--text);transition:.15s}
.ord-row:hover{border-color:rgba(165,107,255,.4);transform:translateY(-1px);box-shadow:0 14px 34px -22px rgba(165,107,255,.6)}
.ord-row-l{min-width:0}
.ord-ref{display:block;font-family:var(--mono);font-weight:700;font-size:14px}
.ord-date{color:var(--muted);font-weight:400;font-size:12px}
.ord-sub{display:block;color:var(--muted);font-size:12.5px;margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:46ch}
.ord-row-r{display:flex;align-items:center;gap:12px;flex:none}
.ord-amt{font-weight:700;font-size:14px}
.ord-chev{color:var(--muted);font-size:22px;line-height:1}

/* order detail */
.ov-top{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:18px}
.ov-top h1{font-size:22px;font-weight:800;margin:0}
.ov-date{color:var(--muted);font-size:13px;margin:4px 0 0}
.ov-steps{padding:6px 0 20px}
.ov-deliv{margin:0 0 18px}
.ov-card{border:1px solid var(--line-2);border-radius:16px;background:var(--surface);padding:18px 20px;margin-bottom:16px}
.ov-card h3{font-size:14px;font-weight:700;margin:0 0 14px;color:var(--muted-2,#c9c4d6)}
.ov-item{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:10px 0;border-top:1px solid var(--line)}
.ov-item:first-of-type{border-top:0;padding-top:0}
.ov-item-main b{font-size:14px}.ov-item-main span{display:block;color:var(--muted);font-size:12.5px;margin-top:3px}
.ov-item-price{font-weight:700;font-size:14px;white-space:nowrap}
.ov-total{display:flex;align-items:center;justify-content:space-between;margin-top:14px;padding-top:14px;border-top:1px solid var(--line);font-size:15px}
.ov-total b{font-size:18px;font-weight:800}
.ov-actions{margin-top:4px}

/* profile forms */
.pf-form{display:flex;flex-direction:column;gap:14px;max-width:420px}
.pf-form label{display:block;font-size:13px;font-weight:600;color:var(--muted-2,#b7b2c6)}
.pf-form label .opt{font-weight:400;color:var(--muted);font-size:12px}
.pf-form input{display:block;width:100%;height:46px;margin-top:7px;border-radius:11px;border:1px solid var(--line-2);background:var(--surface-2,rgba(255,255,255,.03));color:var(--text);padding:0 14px;font-family:inherit;font-size:15px;outline:none;transition:.15s}
.pf-form input:focus{border-color:#ff2f86;box-shadow:0 0 0 4px rgba(255,47,134,.12)}
.pf-form input:disabled{opacity:.6}
.pf-form button{align-self:flex-start;margin-top:4px}

/* mobile: sidebar becomes a top tab bar */
@media(max-width:820px){
  .acct2{grid-template-columns:1fr;gap:16px;padding:22px 14px 60px}
  .acct-side{position:static;padding:12px}
  .acct-me{padding-bottom:12px;margin-bottom:10px}
  .acct-menu{flex-direction:row;overflow-x:auto;gap:6px;-webkit-overflow-scrolling:touch}
  .am{white-space:nowrap;padding:9px 13px;font-size:13px}
  .am span{display:inline}
  .acct-out{margin-top:10px;padding-top:10px}
  .ord-sub{max-width:30ch}
}

/* order detail: meta rows */
.ov-meta{margin-top:12px;padding-top:12px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:7px}
.ov-meta-row{display:flex;align-items:center;justify-content:space-between;font-size:13px}
.ov-meta-row span{color:var(--muted)}
.ov-meta-row b{font-weight:600;font-family:var(--mono);font-size:12.5px}

/* ============ SEO content blocks (category intro + FAQ) ============ */
.seo-intro{margin:40px 0 8px;padding:26px 28px;border:1px solid var(--line-2);border-radius:18px;background:var(--surface);color:var(--muted-2,#c9c4d6);line-height:1.75;font-size:14.5px}
.seo-intro h2,.seo-intro h3{color:var(--text);font-weight:700;letter-spacing:-.01em;margin:22px 0 10px}
.seo-intro h2:first-child,.seo-intro h3:first-child{margin-top:0}
.seo-intro p{margin:0 0 12px}
.seo-intro ul{margin:0 0 12px;padding-left:20px}
.seo-intro li{margin:5px 0}
.seo-intro a{color:#ff7ab0;text-decoration:none}
.seo-intro strong{color:var(--text)}
.seo-faq{margin:28px 0 8px}
.seo-faq h2{font-size:20px;font-weight:800;letter-spacing:-.02em;margin:0 0 14px}
.faq-item{border:1px solid var(--line-2);border-radius:14px;background:var(--surface);margin-bottom:10px;overflow:hidden}
.faq-item summary{cursor:pointer;padding:16px 18px;font-weight:600;font-size:14.5px;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";font-size:20px;color:var(--muted);font-weight:400;flex:none;transition:.2s}
.faq-item[open] summary::after{transform:rotate(45deg)}
.faq-item summary:hover{color:#ff7ab0}
.faq-a{padding:0 18px 16px;color:var(--muted);font-size:14px;line-height:1.7}

/* ============ location landing pages ============ */
.loc-hero{padding:34px 30px;border:1px solid var(--line-2);border-radius:20px;margin-bottom:26px;background:
  radial-gradient(130% 150% at 0% 0%, rgba(255,47,134,.12), transparent 55%),
  radial-gradient(130% 150% at 100% 100%, rgba(165,107,255,.14), transparent 55%), var(--surface)}
.loc-hero h1{font-size:30px;font-weight:800;letter-spacing:-.02em;margin:0 0 10px;line-height:1.1}
.loc-sub{color:var(--muted-2,#c9c4d6);font-size:15px;line-height:1.6;margin:0 0 20px;max-width:60ch}
.loc-hero-btns{display:flex;gap:12px;flex-wrap:wrap}
.loc-h2{font-size:20px;font-weight:800;letter-spacing:-.02em;margin:6px 0 16px}
@media(max-width:600px){ .loc-hero{padding:24px 20px} .loc-hero h1{font-size:24px} }

/* footer location column: compact 2-col so links stay tidy, not one long stack */

/* footer location strip: subtle full-width row under the columns */
.foot-loc{border-top:1px solid var(--line);margin-top:8px;padding:20px 0 4px;display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 4px;font-size:12.5px;line-height:1.9}
.foot-loc .foot-loc-lbl{font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-right:6px}
.foot-loc a{color:var(--muted);transition:.15s}
.foot-loc a:hover{color:var(--text)}
.foot-loc .sep{color:var(--line-2);margin:0 4px}
@media(max-width:600px){ .foot-loc{font-size:12px;padding-top:16px} }

/* ============ coupon box ============ */
.coupon-box{margin:14px 0}
.coupon-form{display:flex;gap:8px}
.coupon-form input{flex:1;min-width:0;height:42px;background:var(--surface-2,rgba(255,255,255,.03));border:1px solid var(--line-2);border-radius:10px;color:var(--text);padding:0 12px;font-family:inherit;font-size:14px;text-transform:uppercase}
.coupon-form input:focus{outline:none;border-color:#ff2f86;box-shadow:0 0 0 3px rgba(255,47,134,.12)}
.coupon-form button{height:42px;padding:0 18px;border:0;border-radius:10px;background:var(--surface-2,rgba(255,255,255,.06));border:1px solid var(--line-2);color:var(--text);font-family:inherit;font-weight:600;font-size:14px;cursor:pointer;transition:.15s}
.coupon-form button:hover{border-color:#ff2f86;color:#fff}
.coupon-on{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 14px;border:1px solid rgba(55,214,122,.4);background:rgba(55,214,122,.1);border-radius:10px;font-size:13.5px;color:#8ee6b4}
.coupon-on b{color:#fff;font-family:var(--mono)}
.coupon-rm{background:none;border:0;color:var(--muted);font-size:12.5px;cursor:pointer;text-decoration:underline}
.coupon-rm:hover{color:#ff8098}
.coupon-msg{margin-top:8px;font-size:12.5px;color:#ff9db0}
.sum-row.disc{color:#8ee6b4}
.sum-row.disc .usd,.sum-row.disc .pkr{color:#8ee6b4}

/* ============ dashboard review form ============ */
.rev-card h3{margin:0 0 4px}
.rev-thanks{color:#8ee6b4;font-size:13.5px;margin:6px 0 0}
.rev-form{display:flex;flex-direction:column;gap:12px;max-width:460px}
.rev-stars{display:inline-flex;flex-direction:row-reverse;justify-content:flex-end;gap:4px}
.rev-stars input{position:absolute;opacity:0;width:0;height:0}
.rev-stars label{font-size:30px;color:var(--line-2);cursor:pointer;transition:.12s;line-height:1}
.rev-stars label:hover,.rev-stars label:hover ~ label,.rev-stars input:checked ~ label{color:#ffc83d}
.rev-form textarea,.rev-form input[type=text]{background:var(--surface-2,rgba(255,255,255,.03));border:1px solid var(--line-2);border-radius:10px;color:var(--text);padding:11px 13px;font-family:inherit;font-size:14px;resize:vertical}
.rev-form textarea:focus,.rev-form input[type=text]:focus{outline:none;border-color:#ff2f86;box-shadow:0 0 0 3px rgba(255,47,134,.12)}
.rev-form button{align-self:flex-start}

/* ============ product trust badges ============ */
.trust-badges{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:20px;padding-top:18px;border-top:1px solid var(--line)}
.tb{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--line-2);border-radius:12px;background:var(--surface)}
.tb-ic{font-size:18px;flex:none;line-height:1}
.tb b{display:block;font-size:12.5px;font-weight:700;color:var(--text);line-height:1.2}
.tb small{display:block;font-size:11px;color:var(--muted);margin-top:2px;line-height:1.3}
@media(max-width:600px){ .trust-badges{grid-template-columns:1fr} }

/* ============ mobile polish pass ============ */
@media(max-width:600px){
  /* flash bar: let it breathe, never clip the countdown */
  .flash-stage{min-height:42px}
  .flash-slide{padding:7px 22px}
  .flash-sub{max-width:100%}
  /* comfortable tap targets everywhere */
  .btn,.add-cart,.buy-wa,.co-btn,.ia,.signin{min-height:44px}
  /* respect iPhone notch / home-bar safe areas */
  .wa-float{bottom:calc(16px + env(safe-area-inset-bottom))}
  .foot{padding-bottom:calc(34px + env(safe-area-inset-bottom))}
  /* stop any wide element from forcing sideways scroll */
  .promo,.cat-banner,.loc-hero,.summary,.buybox{max-width:100%}
  /* product title never overflows */
  .pd-title,.product h1{word-break:break-word}
}
/* extra-small phones */
@media(max-width:380px){
  .flash-badge{font-size:9px;padding:2px 6px}
  .flash-sub{font-size:11px}
  .flash-count{font-size:10px}
}

/* ============ premium intro upgrades: shine sweep + shockwave rings ============ */
.intro-logo-wrap{position:relative;display:inline-block}
.logo-shine{position:absolute;top:0;left:-45%;width:45%;height:100%;z-index:3;pointer-events:none;opacity:0;transform:skewX(-18deg);background:linear-gradient(105deg,transparent,rgba(255,255,255,.55),transparent);-webkit-mask:url("/img/logo.webp") center/contain no-repeat;mask:url("/img/logo.webp") center/contain no-repeat}
.logo-shine.sweep{opacity:1;animation:logoSweep .75s ease-in-out forwards}
@keyframes logoSweep{from{left:-45%}to{left:145%}}
.intro-ring{position:absolute;left:50%;top:50%;width:220px;height:220px;transform:translate(-50%,-50%) scale(.35);border-radius:50%;z-index:1;pointer-events:none;opacity:0}
.intro-ring#ring1{border:1.5px solid rgba(255,120,200,.55)}
.intro-ring#ring2{border:1px solid rgba(165,140,255,.45)}
.intro-ring.burst{animation:ringBurst 1.1s cubic-bezier(.2,.7,.2,1) forwards}
@keyframes ringBurst{0%{opacity:.7;transform:translate(-50%,-50%) scale(.35)}70%{opacity:.25}100%{opacity:0;transform:translate(-50%,-50%) scale(2.6)}}
.intro.done .intro-ring{opacity:0}


/* ============ bestsellers marquee (compact cards, auto-scroll) ============ */
.best-marquee{overflow:hidden;padding:6px 0;-webkit-mask:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);mask:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.best-track{display:flex;gap:16px;width:max-content;padding:6px 24px;animation:bestMarq 55s linear infinite}
.best-track:hover{animation-play-state:paused}
@keyframes bestMarq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.card-mini{width:220px;flex:none}
.card-mini .thumb{height:120px}
.card-mini .body{padding:12px 13px 14px}
.card-mini h3{font-size:14px;margin-bottom:6px}
.card-mini .plat{font-size:11.5px;margin-bottom:8px}
.card-mini .pricerow{margin-top:2px}
.card-mini .buy,.card-mini .card-desc,.card-mini .was{display:none}
.card-mini .rank{width:26px;height:26px;font-size:13px}
@media(prefers-reduced-motion:reduce){.best-track{animation:none;overflow-x:auto}}
@media(max-width:600px){.card-mini{width:170px}.card-mini .thumb{height:100px}.best-track{animation-duration:40s}}

/* ============ product page quick-facts list ============ */
.quick-facts{list-style:none;margin:14px 0 16px;padding:0;display:grid;gap:9px}
.quick-facts li{display:flex;align-items:flex-start;gap:9px;font-size:14px;line-height:1.4;color:var(--text)}
.quick-facts li:before{content:"";flex:none;width:6px;height:6px;margin-top:7px;border-radius:50%;background:linear-gradient(135deg,#ff2f86,#a536ff)}
.quick-facts .qf-k{font-weight:600;color:var(--text)}
.quick-facts .qf-v{color:var(--muted)}
@media(max-width:600px){ .quick-facts li{font-size:13.5px} }

/* ============ trial strip (gives the free-trial button a proper home) ============ */
.trial-strip{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:30px 0 0;padding:16px 18px;border-radius:16px;border:1px solid rgba(165,107,255,.3);background:linear-gradient(120deg,rgba(165,107,255,.08),rgba(255,47,134,.06))}
.trial-strip .trial-copy{display:flex;flex-direction:column;gap:2px}
.trial-strip .trial-copy b{font-size:15px;color:var(--text)}
.trial-strip .trial-copy span{font-size:12.5px;color:var(--muted)}
.trial-strip .ia.trial{flex:none}
@media(max-width:520px){ .trial-strip{flex-direction:column;align-items:stretch;text-align:center} .trial-strip .ia.trial{justify-content:center} }

/* ============ scam-alerts / buy-safe links ============ */
.nav-safe{margin-left:auto;display:inline-flex;align-items:center;gap:5px;font-size:12.5px!important;color:#ff9db5!important;border:1px solid rgba(255,157,181,.3);border-radius:20px;padding:4px 12px!important;transition:background .2s}
.nav-safe:hover{background:rgba(255,157,181,.1)}
.pay-safe-line{display:flex;align-items:center;gap:7px;margin-top:12px;padding:9px 11px;font-size:12px;color:#ffce80;background:rgba(255,206,128,.07);border:1px solid rgba(255,206,128,.24);border-radius:8px;text-decoration:none}
.pay-safe-line:hover{background:rgba(255,206,128,.12)}

/* ============ social widgets: follow-band + floating rail ============ */
/* footer icons color on hover */
.socials a{transition:color .2s,background .2s}
.socials a:hover{color:var(--sc,#fff)!important}

/* homepage "Follow us" band */
.follow-band{padding:8px 0 30px}
.follow-inner{max-width:1180px;margin:0 auto;border-radius:20px;background:radial-gradient(130% 120% at 50% 0%,#1c1030,var(--surface,#12101f));border:1px solid var(--line-2);padding:26px 28px;display:flex;align-items:center;justify-content:space-between;gap:22px;flex-wrap:wrap}
.follow-copy h2{font-size:21px;font-weight:600;margin:0 0 4px}
.follow-copy p{color:var(--muted);font-size:13.5px;margin:0}
.follow-btns{display:flex;gap:11px;flex-wrap:wrap}
.soc-band-btn{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:12px;font-size:13.5px;font-weight:500;text-decoration:none;color:var(--text);background:color-mix(in srgb,var(--sc) 12%,transparent);border:1px solid color-mix(in srgb,var(--sc) 32%,transparent);transition:transform .18s,background .18s}
.soc-band-btn:hover{transform:translateY(-2px);background:color-mix(in srgb,var(--sc) 20%,transparent);color:#fff}
.soc-band-btn svg{color:var(--sc)}
@media(max-width:640px){.follow-inner{flex-direction:column;text-align:center;padding:22px 18px}.follow-btns{justify-content:center}}

/* floating social rail (left edge, vertically centered, above WA float which is bottom-right) */
.soc-rail{position:fixed;left:0;top:50%;transform:translateY(-50%);z-index:60;display:flex;flex-direction:column;gap:3px;background:var(--surface,#12101f);border:1px solid var(--line-2);border-left:none;border-radius:0 14px 14px 0;padding:7px 6px;box-shadow:0 8px 26px -10px rgba(0,0,0,.6)}
.soc-rail-btn{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;color:var(--muted);text-decoration:none;transition:color .2s,background .2s,transform .2s}
.soc-rail-btn:hover{color:var(--sc);background:color-mix(in srgb,var(--sc) 15%,transparent);transform:scale(1.08)}
/* hide the rail on small screens so it never crowds the WhatsApp button or content */
@media(max-width:900px){.soc-rail{display:none}}

/* ============ footer "also by us" cross-link ============ */
.foot-otherbrand{display:inline-flex;align-items:center;gap:7px;margin-top:12px;padding:8px 13px;border-radius:10px;font-size:12.5px;color:var(--muted);background:rgba(165,107,255,.08);border:1px solid rgba(165,107,255,.25);text-decoration:none;transition:background .2s,color .2s}
.foot-otherbrand:hover{background:rgba(165,107,255,.15);color:var(--text)}
.foot-otherbrand .ob-dot{color:#a56bff}
.foot-otherbrand b{color:var(--text);font-weight:600}
.foot-network{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px 14px;padding:14px 0;border-top:1px solid var(--line);margin-top:4px}
.foot-network .fn-lbl{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.foot-network .fn-sites{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px 14px}
.foot-network .fn-sites a{display:inline-flex;align-items:baseline;gap:6px;font-size:12.5px;font-weight:600;color:var(--text);text-decoration:none;transition:color .18s}
.foot-network .fn-sites a:hover{color:#a56bff}
.foot-network .fn-sites a small{font-size:10.5px;font-weight:400;color:var(--muted)}
.foot-network .fn-current{color:#a56bff}
@media(max-width:560px){.foot-network{gap:6px 10px}.foot-network .fn-sites{flex-direction:column;gap:6px}}

/* Free Trial nav pill */
.catbar .nav-trial{color:#7dffb0!important;font-weight:600}
.catbar .nav-trial:hover{color:#a9ffca!important}

/* ---- Product page: universal info stack under the photo ---- */
.gside{margin-top:14px;display:flex;flex-direction:column;gap:10px}
.gs-card{border:1px solid var(--line-2);border-radius:14px;background:linear-gradient(160deg,rgba(28,20,44,.55),rgba(13,10,21,.55));padding:14px 15px}
.gs-title{font-size:12px;font-weight:700;letter-spacing:.02em;color:var(--text);margin-bottom:11px}
.gs-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px}
.gs-steps li{display:flex;gap:11px;align-items:flex-start}
.gs-steps li span{flex:none;width:20px;height:20px;border-radius:50%;background:linear-gradient(135deg,#a536ff,#ff2f86);color:#fff;font-size:11px;font-weight:700;display:grid;place-items:center;margin-top:1px}
.gs-steps li b{display:block;font-size:12.5px;font-weight:600;color:var(--text);line-height:1.35}
.gs-steps li em{display:block;font-style:normal;font-size:11.5px;color:var(--muted);line-height:1.45;margin-top:1px}
.gs-pays{display:flex;flex-wrap:wrap;gap:6px}
.gs-pay{font-size:11.5px;color:var(--muted);background:rgba(255,255,255,.04);border:1px solid var(--line-2);border-radius:8px;padding:5px 9px}
.gs-link{display:flex;align-items:center;gap:8px;border:1px solid var(--line-2);border-radius:12px;padding:11px 14px;font-size:12.5px;font-weight:600;color:var(--text);text-decoration:none;transition:border-color .16s,transform .16s}
.gs-link:hover{border-color:#a56bff;transform:translateY(-1px)}
.gs-help{display:flex;align-items:center;gap:11px;border:1px solid rgba(37,211,102,.28);border-radius:12px;background:rgba(37,211,102,.07);padding:12px 14px;text-decoration:none;transition:transform .16s,border-color .16s}
.gs-help:hover{transform:translateY(-1px);border-color:rgba(37,211,102,.5)}
.gs-help-ic{font-size:19px;flex:none}
.gs-help b{display:block;font-size:12.5px;font-weight:600;color:var(--text);line-height:1.35}
.gs-help em{display:block;font-style:normal;font-size:11.5px;color:var(--muted);line-height:1.45;margin-top:1px}
@media(max-width:900px){.gside{margin-top:16px}}
@media(prefers-reduced-motion:reduce){.gs-link,.gs-help{transition:none}}

/* Auto internal links (from the keyword map) */
.seo-intro .auto-link,.post-body .auto-link,.page-body .auto-link{color:#c8a8ff;text-decoration:none;border-bottom:1px dotted rgba(200,168,255,.45)}
.seo-intro .auto-link:hover,.post-body .auto-link:hover,.page-body .auto-link:hover{color:#e0ccff;border-bottom-color:rgba(224,204,255,.8)}

/* ---- Location pages: approx local currency ---- */
.loc-fx{display:flex;align-items:center;gap:13px;border:1px solid var(--line-2);border-radius:14px;background:linear-gradient(120deg,rgba(91,141,255,.1),rgba(165,107,255,.06));padding:14px 16px;margin:0 0 18px}
.loc-fx-ic{font-size:22px;flex:none}
.loc-fx b{display:block;font-size:13px;font-weight:700;color:var(--text);line-height:1.35}
.loc-fx span{display:block;font-size:12px;color:var(--muted);line-height:1.5;margin-top:2px}
.loc-card-wrap{position:relative;display:flex;flex-direction:column}
.loc-approx{margin-top:-4px;padding:7px 11px;border:1px dashed var(--line-2);border-top:none;border-radius:0 0 12px 12px;font-size:12.5px;font-weight:700;color:#c8a8ff;text-align:center}
.loc-approx small{font-weight:500;color:var(--muted);font-size:11px;margin-left:4px}
@media(max-width:560px){.loc-fx{align-items:flex-start}}

/* Location pages: country compatibility note */
.loc-cc{display:flex;align-items:center;gap:13px;border:1px solid rgba(55,214,122,.28);border-radius:14px;background:rgba(55,214,122,.07);padding:14px 16px;margin:0 0 14px}
.loc-cc-ic{font-size:20px;flex:none}
.loc-cc b{display:block;font-size:13px;font-weight:700;color:var(--text);line-height:1.35}
.loc-cc span{display:block;font-size:12px;color:var(--muted);line-height:1.5;margin-top:2px}

/* Country price (his own price for that market) */
.loc-cur{display:inline}
html[data-cur="usd"] .loc-cur,html[data-cur="pkr"] .loc-cur{display:inline}

/* Amount due per payment method */
.pay-amt{margin-left:auto;font-weight:800;font-size:14px;color:#7dffb0;white-space:nowrap}
.pay-conv{margin:10px 0 0;padding:11px 13px;border-radius:10px;background:rgba(125,255,176,.07);border:1px solid rgba(125,255,176,.22);font-size:12.5px;line-height:1.6;color:var(--muted)}
.pay-conv b{color:#7dffb0}
.pay-conv .rate{display:block;margin-top:5px;font-size:11.5px;opacity:.75}

/* IPTV stat pills on product cards — Supernova theme (matches zayron layout) */
.lc-stats{display:flex;gap:6px;margin:4px 0 2px}
.lc-stats span{flex:1;text-align:center;background:linear-gradient(160deg,rgba(165,107,255,.10),rgba(255,47,134,.08));border:1px solid rgba(255,47,134,.18);border-radius:10px;padding:7px 3px;font-size:9px;color:var(--muted);text-transform:uppercase;letter-spacing:.03em;line-height:1.5}
.lc-stats b{display:block;font-size:13px;font-weight:800;background:linear-gradient(120deg,var(--violet),var(--accent));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:1px}

/* Hover-reveal plans + trial button on IPTV cards (Supernova) */
.card-hover{position:absolute;left:0;right:0;bottom:0;background:linear-gradient(to top,rgba(12,7,19,.98) 60%,rgba(12,7,19,.82) 85%,transparent);backdrop-filter:blur(3px);padding:16px 15px 15px;opacity:0;transform:translateY(14px);transition:opacity .26s ease,transform .26s ease;pointer-events:none;z-index:5;border-top:1px solid rgba(255,47,134,.2)}
.card:hover .card-hover{opacity:1;transform:translateY(0);pointer-events:auto}
.ch-plans{display:flex;flex-direction:column;gap:5px;margin-bottom:11px}
.ch-plan{display:flex;justify-content:space-between;align-items:center;padding:6px 10px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:9px;transition:.15s}
.ch-plan:hover{border-color:rgba(255,47,134,.4);background:rgba(255,47,134,.08)}
.ch-lbl{font-size:12px;color:var(--muted);font-weight:500}
.ch-price{font-size:13px;font-weight:800;background:linear-gradient(120deg,var(--violet),var(--accent));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.ch-btns{display:flex;gap:8px}
.ch-trial{flex:1;border:none;border-radius:10px;padding:10px;font-size:12.5px;font-weight:800;color:#fff;cursor:pointer;background:linear-gradient(120deg,var(--violet),var(--accent));box-shadow:0 8px 20px -6px rgba(255,47,134,.5);font-family:inherit;transition:.16s}
.ch-trial:hover{filter:brightness(1.08);transform:translateY(-1px)}
.ch-choose{flex:1;text-align:center;border-radius:10px;padding:10px;font-size:12.5px;font-weight:700;color:var(--text);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);display:flex;align-items:center;justify-content:center}
.ch-choose.solo{flex:1}
@media (hover:none){.card-hover{display:none}}
/* v1784803793 */

/* ---- customer order-view: profile-aware access cards ---- */
.ov-access{border:1px solid rgba(165,107,255,.2);border-radius:12px;padding:14px;margin:12px 0;background:rgba(165,107,255,.05)}
.ov-access-h{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:10px}
.ov-access-h b{font-size:14.5px;color:var(--text)}
.ov-access-h span{font-size:12px;color:var(--muted)}
.ov-creds{display:flex;flex-direction:column;gap:7px}
.ov-cred{display:flex;justify-content:space-between;align-items:center;gap:10px;background:rgba(8,4,16,.4);border:1px solid rgba(165,107,255,.15);border-radius:8px;padding:8px 11px}
.ov-cred .ck{font-size:11.5px;color:var(--muted);text-transform:capitalize;white-space:nowrap}
.ov-cred .cv{font-family:ui-monospace,monospace;font-size:13px;color:var(--text);word-break:break-all;text-align:right;display:flex;align-items:center;gap:8px}
.cbtn{border:1px solid rgba(165,107,255,.35);background:rgba(165,107,255,.1);border-radius:6px;padding:2px 9px;font-size:10.5px;color:#c9b3ff;cursor:pointer;flex-shrink:0}
.cbtn:hover{background:rgba(165,107,255,.2)}
.ov-hint{font-size:12.5px;color:var(--muted);margin:8px 0 0;line-height:1.5}
.ov-netflix{margin-top:6px}
.ov-code-btn{display:inline-block;margin-top:8px}
.ov-activation{margin-top:8px}
.ov-instr{margin-top:10px;padding-top:10px;border-top:1px solid rgba(165,107,255,.12);font-size:12.5px;color:var(--muted);line-height:1.5}

/* Buy Now button gradient style */
.btn-buy.gx2-gradient{background:linear-gradient(120deg,#a56bff,#ff2f86);color:#fff;border:none;border-radius:12px;padding:14px 28px;font-size:15px;font-weight:800;cursor:pointer;font-family:inherit;box-shadow:0 8px 24px -6px rgba(255,47,134,.45);letter-spacing:.02em;transition:transform .15s,box-shadow .15s;width:100%}
.btn-buy.gx2-gradient:hover{transform:translateY(-2px);box-shadow:0 12px 28px -6px rgba(255,47,134,.55)}
.btn-buy.gx2-gradient:active{transform:translateY(0)}

/* ===== customer subscriptions dashboard (accordion) ===== */
.subs .olist{display:grid;grid-template-columns:1fr 1fr;gap:11px;align-items:start;margin-top:4px}
.subs .oitem{border:1px solid var(--line);border-radius:14px;background:var(--surface,rgba(255,255,255,.02));overflow:hidden;transition:.15s}
.subs .oitem.open{border-color:rgba(165,107,255,.4)}
.subs .orow{display:flex;align-items:center;gap:12px;padding:13px 15px;cursor:pointer;transition:.14s}
.subs .orow:hover{background:rgba(165,107,255,.05)}
.subs .orow-ic{width:40px;height:40px;border-radius:11px;background:rgba(165,107,255,.12);display:grid;place-items:center;font-size:19px;flex:none}
.subs .orow-main{flex:1;min-width:0}
.subs .orow-main b{font-size:14px;font-weight:700;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.subs .orow-main span{font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
.subs .orow-chev{color:var(--muted-2,#8a7aa8);font-size:20px;transition:.2s;flex:none}
.subs .oitem.open .orow-chev{transform:rotate(90deg);color:#a56bff}
.subs .odetail{display:none;padding:2px 15px 15px;border-top:1px solid var(--line)}
.subs .oitem.open .odetail{display:block}
.subs .di{padding-top:13px}
.subs .badge{font-size:10px;font-weight:700;padding:3px 8px;border-radius:20px;display:inline-flex;align-items:center;gap:4px;flex:none;white-space:nowrap}
.subs .b-del{background:rgba(55,214,122,.14);color:#4ade80;border:1px solid rgba(55,214,122,.3)}
.subs .b-wait{background:rgba(255,178,60,.14);color:#ffb23c;border:1px solid rgba(255,178,60,.3)}
.subs .b-can{background:rgba(255,90,120,.12);color:#ff9db0;border:1px solid rgba(255,90,120,.25)}
.subs .crow{display:flex;justify-content:space-between;align-items:center;gap:9px;padding:8px 11px;border-radius:9px;background:rgba(165,107,255,.06);border:1px solid var(--line);margin-bottom:7px}
.subs .crow .k{font-size:11px;color:var(--muted);font-weight:600;flex:none}
.subs .crow .v{font-family:var(--mono,monospace);font-size:12px;color:var(--text);flex:1;text-align:right;word-break:break-all}
.subs .crow .copybtn{font-size:10px;color:#a56bff;cursor:pointer;padding:3px 8px;border:1px solid var(--line);border-radius:6px;flex:none}
.subs .crow .copybtn:hover{background:rgba(165,107,255,.14)}
.subs .bundle-tag{margin:11px 0 7px;font-size:10.5px;font-weight:700;color:#c9a6ff;text-transform:uppercase;letter-spacing:.05em}
.subs .otp-btn{width:100%;padding:11px;border:none;border-radius:10px;background:linear-gradient(120deg,#a56bff,#ff2f86);color:#fff;font-weight:700;font-size:13px;cursor:pointer;margin-top:4px}
.subs .otp-out{margin-top:10px;text-align:center;font-size:12.5px;color:var(--muted)}
.subs .otp-code{font-family:var(--mono,monospace);font-size:22px;font-weight:800;letter-spacing:4px;color:#4ade80;display:inline-block;vertical-align:middle;margin-right:8px}
.subs .nf-link{display:inline-block;margin-top:4px;font-size:13px;font-weight:700;color:#c9a6ff;text-decoration:none;background:rgba(165,107,255,.1);border:1px solid var(--line);border-radius:10px;padding:10px 14px}
.subs .actbox{padding:11px 13px;border-radius:11px;background:rgba(55,214,122,.08);border:1px solid rgba(55,214,122,.25)}
.subs .actbox .ok{font-size:12.5px;font-weight:700;color:#4ade80}
.subs .actbox .em{font-family:var(--mono,monospace);font-size:12.5px;margin-top:5px;color:var(--text)}
.subs .di-wait{font-size:12px;color:var(--muted);padding:6px 0}
.subs .inst{font-size:11.5px;color:var(--muted);margin-top:10px;padding-top:10px;border-top:1px dashed var(--line);white-space:pre-wrap}
.subs .cardfoot{display:flex;gap:8px;margin-top:11px}
.subs .cf{flex:1;text-align:center;font-size:11.5px;font-weight:600;color:var(--muted);border:1px solid var(--line);border-radius:9px;padding:8px;text-decoration:none}
.subs .cf:hover{color:var(--text);border-color:#a56bff}
@media(max-width:720px){.subs .olist{grid-template-columns:1fr}}

.dash-anns{display:flex;flex-direction:column;gap:9px;margin:14px 0 6px}
.dann{display:flex;gap:11px;align-items:flex-start;padding:12px 15px;border-radius:13px;background:linear-gradient(100deg,rgba(255,47,134,.1),rgba(165,107,255,.08));border:1px solid rgba(255,47,134,.22)}
.dann.prod{background:rgba(77,141,255,.08);border-color:rgba(77,141,255,.25)}
.dann-ic{font-size:18px;line-height:1.3}
.dann b{font-size:13px;display:block}
.dann p{font-size:12.5px;color:var(--muted,#9d8fbf);margin:2px 0 0}