@font-face { font-family:"Mirinda Tajik"; src:url("assets/mirinda-tajik-regular.woff?v=20260909-2") format("woff"); font-style:normal; font-weight:400; font-display:swap; }
@font-face { font-family:"Mirinda Tajik"; src:url("assets/mirinda-tajik-bold.woff?v=20260909-2") format("woff"); font-style:normal; font-weight:700; font-display:swap; }
:root { --lime:#baff16; --acid:#93f300; --green:#01893e; --dark:#063824; --pink:#f12fe6; --orange:#ff742d; --cream:#f7ffd9; --white:#fff; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--cream); color:var(--dark); font-family:Arial,Helvetica,sans-serif; overflow-x:hidden; }
html[lang="tg"] body { font-family:"Mirinda Tajik",Arial,Helvetica,sans-serif; }
a { color:inherit; text-decoration:none; }
button { font:inherit; }
:focus-visible { outline:4px solid white; outline-offset:4px; }

.site-header { position:fixed; z-index:50; left:50%; top:18px; transform:translateX(-50%); width:min(1220px,calc(100% - 32px)); height:68px; padding:8px 10px 8px 18px; display:flex; align-items:center; justify-content:space-between; gap:18px; border:1px solid rgba(255,255,255,.42); border-radius:22px; background:rgba(4,92,48,.82); color:white; backdrop-filter:blur(16px); box-shadow:0 14px 44px rgba(0,58,25,.22); }
.brand { display:inline-flex; align-items:center; flex:0 0 auto; }
.brand-logo { display:block; width:134px; height:auto; filter:drop-shadow(0 4px 7px rgba(0,0,0,.18)); }
.nav { display:flex; align-items:center; gap:18px; font-size:14px; font-weight:800; }
.nav a:not(.nav-cta) { opacity:.82; transition:opacity .2s,transform .2s; }
.nav a:not(.nav-cta):hover { opacity:1; transform:translateY(-2px); }
.nav-rules { padding:10px 14px; border:1px solid rgba(255,255,255,.6); border-radius:12px; opacity:1!important; }
.nav-cta { display:inline-flex; align-items:center; gap:12px; padding:15px 18px; border-radius:14px; color:var(--dark); background:var(--lime); box-shadow:inset 0 -3px 0 rgba(0,0,0,.12); }
.nav-cta span { font-size:18px; }
.nav-cta span:first-child { font-size:14px; }
.language-switch { display:flex; align-items:center; padding:3px; border:1px solid rgba(255,255,255,.48); border-radius:12px; background:rgba(0,37,22,.22); }
.language-button { min-width:36px; height:34px; padding:0 8px; border:0; border-radius:9px; color:white; background:transparent; font-size:12px; font-weight:950; cursor:pointer; transition:background .2s,color .2s,transform .2s; }
.language-button:hover { transform:translateY(-1px); }
.language-button.is-active { color:var(--dark); background:var(--lime); box-shadow:0 3px 8px rgba(0,0,0,.16); }
.menu-toggle { display:none; border:0; background:transparent; width:46px; height:46px; border-radius:14px; padding:12px; }
.menu-toggle span { display:block; height:2px; margin:5px 0; background:white; transition:.25s; }

.hero { position:relative; min-height:850px; padding:152px max(24px,calc((100vw - 1180px)/2)) 92px; background:radial-gradient(circle at 72% 20%,rgba(255,255,255,.35) 0 2px,transparent 3px) 0 0/28px 28px,linear-gradient(135deg,#cfff32 0%,#a8fb08 46%,#7de400 100%); overflow:visible; }
.hero::before { content:""; position:absolute; width:540px; height:540px; left:-260px; bottom:-140px; border-radius:50%; border:80px solid var(--pink); opacity:.94; }
.hero::after { content:""; position:absolute; right:-105px; top:-85px; width:320px; height:320px; background:var(--pink); transform:rotate(18deg); border-radius:50px; }
.hero-copy { position:relative; z-index:3; max-width:650px; }
.eyebrow,.kicker { margin:0 0 18px; font-size:13px; font-weight:900; text-transform:uppercase; letter-spacing:.16em; }
.eyebrow { display:inline-flex; align-items:center; gap:9px; padding:10px 14px; color:white; background:var(--green); border-radius:100px; }
.eyebrow span { color:var(--lime); }
.hero h1,.section h2 { margin:0; font-size:clamp(54px,6vw,88px); line-height:.88; letter-spacing:-.07em; font-weight:950; text-transform:uppercase; }
.hero h1 em,.final-cta h2 em { color:var(--pink); font-style:normal; -webkit-text-stroke:1px white; text-shadow:3px 4px 0 white; }
.hero-text { max-width:590px; margin:30px 0 0; font-size:19px; line-height:1.55; font-weight:700; }
.hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:30px; }
.countdown { width:min(590px,100%); margin-top:34px; padding:18px; border:1px solid rgba(255,255,255,.62); border-radius:24px; color:white; background:rgba(0,92,43,.9); box-shadow:0 16px 34px rgba(0,79,35,.2); backdrop-filter:blur(10px); }
.countdown-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:14px; }
.countdown-heading p { margin:0; font-size:14px; font-weight:950; text-transform:uppercase; letter-spacing:.08em; }
.countdown-heading>span { color:rgba(255,255,255,.74); font-size:12px; font-weight:800; text-align:right; }
.countdown-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; }
.countdown-grid>div { min-width:0; padding:10px 8px 9px; border-radius:15px; text-align:center; background:rgba(255,255,255,.12); }
.countdown-grid strong { display:block; color:var(--lime); font-size:31px; line-height:1; font-variant-numeric:tabular-nums; letter-spacing:-.04em; }
.countdown-grid span { display:block; margin-top:5px; color:rgba(255,255,255,.78); font-size:11px; font-weight:850; text-transform:uppercase; }
.countdown.is-finished .countdown-grid { opacity:.55; }
.button { min-height:56px; padding:0 23px; display:inline-flex; align-items:center; justify-content:center; gap:18px; border-radius:16px; font-size:15px; font-weight:900; transition:transform .2s,box-shadow .2s; }
.button:hover { transform:translateY(-3px) rotate(-1deg); }
.button-primary { color:white; background:var(--green); box-shadow:0 8px 0 #006c31; }
.button-ghost { border:2px solid var(--dark); background:rgba(255,255,255,.22); }
.button-dark { background:var(--dark); color:white; box-shadow:0 8px 0 #001c11; }
.button-large { min-height:66px; padding:0 30px; }
.hero-sticker { position:absolute; z-index:4; right:max(30px,calc((100vw - 1180px)/2)); top:175px; width:150px; height:150px; border-radius:50%; display:grid; place-content:center; text-align:center; color:white; background:var(--pink); transform:rotate(12deg); box-shadow:0 0 0 10px rgba(255,255,255,.5); }
.hero-sticker span { font-size:13px; font-weight:900; }
.hero-sticker strong { font-size:23px; line-height:.9; }
.hero-icon { position:absolute; z-index:2; height:auto; pointer-events:none; user-select:none; filter:drop-shadow(0 16px 18px rgba(0,72,33,.18)); }
.hero-ball { width:190px; left:-62px; top:88px; transform:rotate(13deg); }
.hero-hand { width:110px; right:max(20px,calc((100vw - 1180px)/2 + 160px)); top:355px; transform:rotate(12deg); }
.hero-lightning { width:122px; right:max(18px,calc((100vw - 1180px)/2 - 22px)); top:104px; transform:rotate(-8deg); }
.hero-prizes { position:absolute; z-index:2; right:max(-55px,calc((100vw - 1180px)/2 - 55px)); bottom:-75px; width:min(650px,48vw); height:auto; object-fit:contain; filter:drop-shadow(0 28px 32px rgba(0,68,29,.28)); transition:transform .4s cubic-bezier(.2,.8,.2,1); }
.hero-prizes:hover { transform:translateY(-8px) scale(1.025); }
.scroll-note { position:absolute; z-index:3; left:50%; bottom:22px; transform:translateX(-50%); width:max-content; margin:0; font-size:12px; text-transform:uppercase; font-weight:900; letter-spacing:.18em; }
.scroll-note span { display:inline-block; width:36px; height:2px; background:currentColor; vertical-align:middle; margin-right:10px; }

.ticker { position:relative; z-index:6; padding:18px 0; overflow:hidden; background:var(--dark); color:white; transform:rotate(-1deg) scale(1.02); }
.ticker div { display:flex; justify-content:center; gap:38px; min-width:max-content; font-size:clamp(20px,2.6vw,38px); font-weight:950; text-transform:uppercase; }
.ticker b { color:var(--pink); }
.section { padding:112px max(24px,calc((100vw - 1180px)/2)); }
.section-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:50px; margin-bottom:46px; }
.section-heading h2 { font-size:clamp(48px,7vw,92px); }
.section-heading>p { max-width:420px; margin:0 0 6px; font-size:17px; line-height:1.55; font-weight:650; }
.kicker { color:var(--green); }
.kicker.pink { color:var(--pink); }
.prizes { background:var(--cream); }
.prize-grid { display:grid; grid-template-columns:repeat(12,1fr); gap:18px; }
.prize-card { position:relative; min-height:410px; grid-column:span 6; padding:26px; border-radius:32px; overflow:hidden; isolation:isolate; box-shadow:inset 0 0 0 1px rgba(0,0,0,.08); transition:transform .3s,box-shadow .3s; }
.prize-card:hover { transform:translateY(-9px); box-shadow:0 26px 46px rgba(1,70,34,.16); }
.prize-card.orange { background:linear-gradient(135deg,#ff963d,#ff572a); }
.prize-card.blue { color:white; background:linear-gradient(135deg,#4f4be9,#a276ff); }
.prize-card.white { background:linear-gradient(135deg,#fff,#d6ffd2); }
.prize-card.pink { color:white; background:linear-gradient(135deg,#f12fe6,#8c25cf); }
.prize-number { position:absolute; top:25px; left:27px; font-weight:900; opacity:.62; }
.card-arrow { position:absolute; top:22px; right:22px; width:46px; height:46px; display:grid; place-items:center; border-radius:50%; background:rgba(255,255,255,.75); color:var(--dark); font-size:22px; transition:transform .25s; }
.prize-card:hover .card-arrow { transform:rotate(45deg); }
.prize-visual { height:285px; display:grid; place-items:center; }
.prize-image { display:block; width:auto; height:auto; max-width:92%; max-height:270px; object-fit:contain; filter:drop-shadow(0 22px 24px rgba(16,25,18,.26)); transition:transform .38s cubic-bezier(.2,.8,.2,1),filter .38s; }
.prize-image.phone { max-width:78%; max-height:245px; }
.prize-image.console { max-height:275px; }
.prize-image.airpods { max-height:260px; }
.prize-image.speaker { max-width:86%; max-height:240px; }
.prize-card:hover .prize-image { transform:scale(1.1) rotate(-2deg); filter:drop-shadow(0 28px 28px rgba(16,25,18,.32)); }
.prize-copy p { margin:0 0 5px; font-size:13px; font-weight:850; text-transform:uppercase; letter-spacing:.12em; opacity:.65; }
.prize-copy h3 { margin:0; font-size:clamp(32px,4vw,52px); line-height:.95; letter-spacing:-.05em; }

.steps { display:grid; grid-template-columns:.9fr 1.1fr; gap:70px; background:var(--lime); }
.steps-intro { position:sticky; top:120px; align-self:start; }
.steps-intro h2 { font-size:clamp(48px,6.5vw,88px); }
.steps-intro>p:not(.kicker) { max-width:420px; margin:28px 0; font-size:18px; line-height:1.5; font-weight:700; }
.steps-list { display:grid; gap:16px; }
.step-card { position:relative; min-height:185px; display:grid; grid-template-columns:78px 1fr; align-items:center; gap:24px; padding:30px; border-radius:28px; background:rgba(255,255,255,.82); border:2px solid rgba(0,95,45,.15); box-shadow:0 10px 0 rgba(1,137,62,.12); transition:transform .25s; }
.step-card:hover { transform:translateX(8px); }
.step-number { width:65px; height:65px; display:grid; place-items:center; border-radius:50%; color:white; background:var(--green); font-weight:950; font-size:20px; }
.step-card h3 { margin:0 0 9px; font-size:28px; letter-spacing:-.04em; }
.step-card p { max-width:440px; margin:0; color:#35624c; line-height:1.5; font-weight:650; }
.step-icon { position:absolute; right:18px; top:14px; width:64px; height:64px; object-fit:contain; transform:rotate(10deg); filter:drop-shadow(0 8px 10px rgba(82,43,0,.16)); transition:transform .25s; }
.step-card:hover .step-icon { transform:rotate(-4deg) scale(1.12); }

.rules { position:relative; background:var(--dark); color:white; }
.rules::before { content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(circle,rgba(186,255,22,.1) 0 3px,transparent 4px) 0 0/36px 36px; opacity:.55; }
.rules-heading { position:relative; z-index:1; display:flex; align-items:flex-end; justify-content:space-between; gap:40px; margin-bottom:44px; }
.rules-heading h2 { font-size:clamp(48px,7vw,92px); }
.rules-heading .kicker { color:var(--lime); }
.rules-panel { position:relative; z-index:1; }
.rules-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-bottom:18px; }
.rules-summary>div { min-height:190px; padding:26px; border-radius:26px; background:linear-gradient(145deg,#04a94d,#01893e); border:1px solid rgba(255,255,255,.18); }
.rules-summary span { display:grid; place-items:center; width:42px; height:42px; margin-bottom:26px; border-radius:50%; color:var(--dark); background:var(--lime); font-size:14px; font-weight:950; }
.rules-summary strong { display:block; margin-bottom:9px; font-size:24px; letter-spacing:-.03em; }
.rules-summary p { margin:0; color:rgba(255,255,255,.8); font-size:15px; line-height:1.5; font-weight:650; }
.rules-groups { display:grid; grid-template-columns:1.15fr .85fr; gap:18px; }
.rule-group { padding:32px; border-radius:28px; color:var(--dark); background:var(--cream); }
.rule-group h3 { display:flex; align-items:center; gap:12px; margin:0 0 24px; font-size:26px; letter-spacing:-.035em; }
.rule-group h3>span:first-child,.additional-rules summary b { display:grid; place-items:center; flex:0 0 auto; width:42px; height:42px; border-radius:50%; color:white; background:var(--pink); font-size:13px; }
.rule-heading-text { display:inline; }
.rule-group ul { margin:0; padding:0; list-style:none; }
.rule-group li { position:relative; padding:13px 0 13px 28px; border-top:1px solid rgba(6,56,36,.13); font-size:16px; line-height:1.5; font-weight:650; }
.rule-group li::before { content:""; position:absolute; left:2px; top:21px; width:9px; height:9px; border-radius:50%; background:var(--green); }
.prizes-rule-group { background:var(--lime); }
.prize-rule-list { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.prize-rule-list li { min-height:92px; padding:18px; display:flex; flex-direction:column; justify-content:center; border:0; border-radius:18px; background:rgba(255,255,255,.65); }
.prize-rule-list li::before { display:none; }
.prize-rule-list strong { font-size:19px; }
.prize-rule-list small { margin-top:5px; color:var(--green); font-weight:900; text-transform:uppercase; letter-spacing:.08em; }
.additional-rules { grid-column:1/-1; padding:0; overflow:hidden; }
.additional-rules summary { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:28px 32px; cursor:pointer; list-style:none; font-size:26px; font-weight:900; letter-spacing:-.035em; }
.additional-rules summary::-webkit-details-marker { display:none; }
.additional-rules summary span { display:flex; align-items:center; gap:12px; }
.additional-rules summary i { display:grid; place-items:center; width:42px; height:42px; border-radius:50%; color:white; background:var(--green); font-size:28px; font-style:normal; transition:transform .25s; }
.additional-rules[open] summary i { transform:rotate(45deg); }
.additional-rules ul { padding:0 32px 30px; columns:2; column-gap:44px; }
.additional-rules li { break-inside:avoid; }

.final-cta { text-align:center; background:var(--pink); color:white; }
.final-cta>p { margin:0 0 20px; font-weight:900; text-transform:uppercase; letter-spacing:.16em; }
.final-cta h2 { font-size:clamp(47px,7.3vw,96px); }
.final-cta h2 em { color:var(--lime); text-shadow:3px 4px 0 var(--green); -webkit-text-stroke:1px var(--green); }
.final-cta .button { margin-top:38px; }
footer { min-height:130px; padding:30px max(24px,calc((100vw - 1180px)/2)); display:flex; align-items:center; justify-content:space-between; gap:24px; background:#001d12; color:white; }
footer p { opacity:.65; font-size:14px; }
footer>a:last-child { font-weight:900; }
.footer-logo { width:170px; }
.back-to-top { position:fixed; z-index:40; right:22px; bottom:22px; width:52px; height:52px; display:grid; place-items:center; border:2px solid white; border-radius:50%; background:var(--pink); color:white; font-size:25px; font-weight:950; box-shadow:0 10px 25px rgba(42,0,36,.26); transition:transform .2s; }
.back-to-top:hover { transform:translateY(-5px); }

@media (max-width:900px) {
  .site-header { top:10px; width:calc(100% - 20px); }
  .menu-toggle { display:block; position:relative; z-index:2; }
  .nav { position:absolute; left:0; right:0; top:77px; padding:22px; display:grid; gap:6px; border-radius:22px; background:#03472b; opacity:0; visibility:hidden; transform:translateY(-10px); transition:.25s; box-shadow:0 20px 40px rgba(0,0,0,.28); }
  .nav.is-open { opacity:1; visibility:visible; transform:translateY(0); }
  .nav a { padding:13px 10px; font-size:16px; }
  .language-switch { width:max-content; margin:8px 10px; }
  .language-button { min-width:48px; height:40px; font-size:13px; }
  .nav-cta { margin-top:8px; justify-content:space-between; }
  .menu-toggle.is-open span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
  .menu-toggle.is-open span:nth-child(2) { opacity:0; }
  .menu-toggle.is-open span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }
  .hero { min-height:820px; padding-top:130px; }
  .hero-copy { max-width:100%; }
  .hero-sticker { display:none; }
  .hero-ball { width:150px; left:-70px; top:90px; }
  .hero-hand { width:92px; right:20px; top:390px; }
  .hero-lightning { width:86px; right:16px; top:110px; }
  .hero-hand { display:none; }
  .hero-prizes { position:relative; z-index:3; right:auto; bottom:28px; display:block; width:min(760px,118%); max-width:none; margin:-90px -9% -105px auto; }
  .scroll-note { position:relative; left:auto; bottom:auto; transform:none; margin:28px auto 0; }
  .section-heading { align-items:flex-start; flex-direction:column; gap:24px; }
  .steps { grid-template-columns:1fr; gap:52px; }
  .steps-intro { position:static; }
  .rules-heading { align-items:flex-start; flex-direction:column; }
  .rules-summary { grid-template-columns:1fr; }
  .rules-summary>div { min-height:0; }
  .rules-groups { grid-template-columns:1fr; }
  .additional-rules ul { columns:1; }
}

@media (max-width:620px) {
  .site-header { height:62px; padding-left:14px; border-radius:18px; }
  .brand-logo { width:112px; }
  .nav { top:70px; }
  .hero { min-height:0; padding:120px 18px 48px; }
  .hero::before { width:340px; height:340px; border-width:48px; }
  .hero::after { width:220px; height:220px; right:-130px; }
  .eyebrow { font-size:10px; }
  .hero h1 { font-size:clamp(45px,14vw,68px); line-height:.9; }
  .hero-ball { width:120px; left:-64px; top:95px; }
  .hero-lightning { width:70px; right:-8px; top:110px; opacity:.85; }
  .hero-hand { width:78px; right:-12px; top:430px; opacity:.9; }
  .hero-text { margin-top:22px; font-size:16px; }
  .hero-actions { display:grid; }
  .button { width:100%; }
  .hero-prizes { width:124%; max-width:none; margin:-26px -12% -74px; }
  .countdown { margin-top:28px; padding:15px; border-radius:20px; }
  .countdown-heading { align-items:flex-start; flex-direction:column; gap:5px; }
  .countdown-heading>span { text-align:left; }
  .countdown-grid { grid-template-columns:repeat(2,1fr); }
  .countdown-grid strong { font-size:28px; }
  .scroll-note { margin-top:24px; }
  .ticker div { justify-content:flex-start; animation:ticker 14s linear infinite; }
  .section { padding:76px 18px; }
  .section-heading h2,.steps-intro h2,.rules-heading h2,.final-cta h2 { font-size:48px; }
  .prize-grid { grid-template-columns:1fr; }
  .prize-card { grid-column:auto; min-height:360px; }
  .prize-visual { height:230px; }
  .prize-image { max-height:220px; }
  .prize-image.phone { max-height:205px; max-width:86%; }
  .prize-image.console { max-height:225px; }
  .prize-image.airpods { max-height:215px; }
  .prize-image.speaker { max-height:190px; max-width:90%; }
  .step-card { min-height:220px; grid-template-columns:1fr; align-items:start; gap:18px; padding:24px; }
  .step-number { width:56px; height:56px; }
  .step-icon { right:18px; top:18px; width:58px; height:58px; }
  .rules-heading { margin-bottom:30px; }
  .rules-summary>div,.rule-group { padding:22px; border-radius:22px; }
  .rules-summary strong { font-size:22px; }
  .rule-group h3,.additional-rules summary { font-size:22px; }
  .prize-rule-list { grid-template-columns:1fr; }
  .additional-rules summary { padding:22px; }
  .additional-rules ul { padding:0 22px 24px; }
  .final-cta { padding-top:90px; padding-bottom:90px; }
  footer { flex-direction:column; text-align:center; padding:45px 22px; }
  .footer-logo { width:170px; }
}

@keyframes ticker { to { transform:translateX(-48%); } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; } }
