/* =====================================================================
   OY-OY TEAM · Landing v2 (2026-10) — landing.css'in ÜZERİNE gelen modern katman.
   Geri almak için index.php'deki landing-v2.css satırını silmek yeterli.
   ===================================================================== */
:root{
  --v2-bg:#060d1a; --v2-bg2:#0a1628;
  --v2-violet:#7c5cff; --v2-cyan:#22d3ee; --v2-lime:#c6f24e;
  --v2-head:'Plus Jakarta Sans','Inter',system-ui,sans-serif;
  --v2-border:linear-gradient(135deg,rgba(46,167,255,.55),rgba(124,92,255,.35) 45%,rgba(245,179,1,.45));
}
.lp h1,.lp h2,.lp .lp-h2,.lp h3{font-family:var(--v2-head)}
.lp-h2{letter-spacing:-.035em}
.lp-sub{line-height:1.65}

/* ---- Üst menü: yüzen cam, kaydırınca daralır ---- */
.lp-header{background:linear-gradient(180deg,#07111F,#0a1628);border-bottom:1px solid rgba(255,255,255,.06);backdrop-filter:none;-webkit-backdrop-filter:none;transition:box-shadow .25s}
.lp-header .lp-wrap{transition:height .25s}
.lp-header.scrolled{background:linear-gradient(180deg,#07111F,#0a1628);box-shadow:0 8px 28px rgba(4,10,22,.45);border-bottom-color:rgba(46,167,255,.18)}
.lp-header.scrolled .lp-wrap{height:60px}
.lp-nav a.lp-link{position:relative}
.lp-nav a.lp-link::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--lp-blue2),var(--lp-yellow));
  transform:scaleX(0);transition:transform .2s}
.lp-nav a.lp-link:hover::after{transform:scaleX(1)}

/* ---- HERO: hareketli aurora + ızgara ---- */
.lp-hero{background:var(--v2-bg);isolation:isolate;padding-top:clamp(56px,8vw,104px)}
.lp-hero::before{content:"";position:absolute;inset:-30%;z-index:-2;
  background:
    radial-gradient(40% 38% at 78% 18%,rgba(46,167,255,.45),transparent 70%),
    radial-gradient(34% 34% at 14% 22%,rgba(124,92,255,.42),transparent 70%),
    radial-gradient(30% 30% at 60% 88%,rgba(245,179,1,.22),transparent 70%);
  filter:blur(10px);animation:v2Aurora 18s ease-in-out infinite alternate}
.lp-hero::after{inset:0;height:auto;z-index:-1;background:
  linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px) 0 0/44px 44px,
  linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px) 0 0/44px 44px;
  -webkit-mask-image:radial-gradient(70% 60% at 50% 30%,#000,transparent);mask-image:radial-gradient(70% 60% at 50% 30%,#000,transparent)}
@keyframes v2Aurora{0%{transform:translate3d(0,0,0) rotate(0)}50%{transform:translate3d(3%,-2%,0) rotate(6deg)}100%{transform:translate3d(-3%,2%,0) rotate(-4deg)}}
.lp-hero h1{font-size:clamp(36px,5.8vw,66px);letter-spacing:-.045em;line-height:1.04}
.lp-hero h1 .grad{background:linear-gradient(100deg,var(--v2-cyan),var(--lp-blue2) 35%,var(--lp-yellow) 70%,var(--v2-cyan));
  background-size:220% auto;-webkit-background-clip:text;background-clip:text;color:transparent;animation:v2Shine 7s linear infinite}
@keyframes v2Shine{to{background-position:220% center}}
.lp-pill{backdrop-filter:blur(8px)}
.lp-pill-new{font-style:normal;margin-left:4px;font-size:11px;font-weight:900;letter-spacing:.04em;color:#1d2a00;background:var(--v2-lime);
  padding:3px 9px;border-radius:999px;box-shadow:0 0 18px rgba(198,242,78,.45)}
.lp-hero-note{backdrop-filter:blur(6px)}

/* Işıltılı kenarlı cam kartlar (hero, OY-POINT, örnek, panel) */
.lp-hero-card{position:relative;background:linear-gradient(160deg,rgba(255,255,255,.08),rgba(255,255,255,.025));
  border:1px solid transparent;border-radius:26px;backdrop-filter:blur(16px);box-shadow:0 30px 70px rgba(0,0,0,.45)}
.lp-hero-card::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:var(--v2-border);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.lp-hero .lp-hero-card{animation:v2Float 7s ease-in-out infinite}
@keyframes v2Float{50%{transform:translateY(-8px)}}
.hc-stat{background:rgba(255,255,255,.06)}
.hc-stat .n{background:linear-gradient(120deg,var(--v2-cyan),var(--lp-yellow));-webkit-background-clip:text;background-clip:text;color:transparent}

/* ---- Kayan oyun şeridi ---- */
.lp-marquee{position:relative;background:linear-gradient(90deg,#0b1830,#101d3a 50%,#0b1830);border-block:1px solid rgba(255,255,255,.07);overflow:hidden;padding:14px 0}
.lp-marquee::before,.lp-marquee::after{content:"";position:absolute;top:0;bottom:0;width:90px;z-index:2;pointer-events:none}
.lp-marquee::before{left:0;background:linear-gradient(90deg,#0b1830,transparent)}
.lp-marquee::after{right:0;background:linear-gradient(-90deg,#0b1830,transparent)}
.lp-marquee-track{display:flex;gap:12px;width:max-content;animation:v2Marquee 48s linear infinite}
.lp-marquee:hover .lp-marquee-track{animation-play-state:paused}
.lp-marquee-track span{flex:none;color:#e9f2ff;font-weight:700;font-size:14.5px;padding:9px 16px;border-radius:999px;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);white-space:nowrap}
@keyframes v2Marquee{to{transform:translateX(-50%)}}

/* ---- Bölümler ---- */
.lp-soft{background:linear-gradient(180deg,#f6f9fe,#eef3fb)}
.lp-dark{background:radial-gradient(60% 50% at 85% 0%,rgba(124,92,255,.16),transparent 70%),var(--v2-bg)}
.lp-dark2{background:radial-gradient(60% 50% at 10% 0%,rgba(46,167,255,.16),transparent 70%),linear-gradient(180deg,var(--v2-bg),var(--v2-bg2))}
.lp-eyebrow{letter-spacing:.16em;font-size:12px;box-shadow:inset 0 0 0 1px rgba(22,119,255,.18)}
.lp-dark .lp-eyebrow,.lp-dark2 .lp-eyebrow{box-shadow:inset 0 0 0 1px rgba(46,167,255,.3)}

/* Adımlar: bağlayan çizgi + numara parıltısı */
.lp-steps{position:relative}
.lp-steps::before{content:"";position:absolute;left:8%;right:8%;top:45px;height:2px;z-index:0;
  background:linear-gradient(90deg,transparent,rgba(22,119,255,.35),rgba(245,179,1,.35),transparent)}
.lp-step{z-index:1;border-radius:22px;border-color:#e3eaf5}
.lp-step .num{width:44px;height:44px;border-radius:14px;font-size:15px;box-shadow:0 10px 22px rgba(22,119,255,.35)}
.lp-step .arrow{display:none}
.lp-step:hover{border-color:rgba(22,119,255,.35)}

/* Kartlar: ince degrade kenar, yumuşak gölge */
.lp-card{border-radius:22px;border-color:#e3eaf5;box-shadow:0 1px 0 rgba(255,255,255,.8) inset,0 10px 30px rgba(10,30,70,.06)}
.lp-card:hover{border-color:rgba(22,119,255,.3);box-shadow:0 22px 50px rgba(10,30,70,.12)}
.lp-card .ic{border-radius:16px;font-size:25px}
.lp-dark .lp-card,.lp-dark2 .lp-card{background:linear-gradient(160deg,rgba(255,255,255,.07),rgba(255,255,255,.02));border-color:rgba(255,255,255,.1)}
.lp-dark .lp-card:hover,.lp-dark2 .lp-card:hover{border-color:rgba(46,167,255,.4);box-shadow:0 22px 50px rgba(0,0,0,.35)}
.lp-dark2 .lp-card{color:#fff}.lp-dark2 .lp-card p{color:rgba(255,255,255,.78)}.lp-dark2 .lp-card p small{color:rgba(255,255,255,.6)!important;opacity:1!important}
.lp-dark2 .lp-card .ic{background:linear-gradient(135deg,rgba(46,167,255,.2),rgba(245,179,1,.14));color:#fff}
/* "OY-OY neden" bento: ilk satırda geniş oyun kartı */
.lp-bento{grid-template-columns:repeat(3,1fr)}
.lp-card-wide{grid-column:span 2;background:linear-gradient(135deg,#0f2a5c,#1677ff 70%,#2ea7ff);color:#fff;border-color:transparent;position:relative;overflow:hidden}
.lp-card-wide::after{content:"🎲 🀄 🃏 👑 🎯";position:absolute;right:-8px;bottom:-14px;font-size:44px;opacity:.16;letter-spacing:6px;white-space:nowrap}
.lp-card-wide p{color:rgba(255,255,255,.86)!important}.lp-card-wide p b{color:#fff}
.lp-card-wide .ic{background:rgba(255,255,255,.16);color:#fff}
.lp-new{display:inline-block;vertical-align:middle;margin-left:6px;font-size:10.5px;font-weight:900;letter-spacing:.06em;padding:3px 8px;border-radius:999px;
  background:var(--v2-lime);color:#1d2a00;font-family:'Inter',sans-serif}

/* Vurgu (komisyon) kartı */
.lp-highlight{border-radius:28px;background:linear-gradient(135deg,#1677ff,#3b3fd8 60%,#5b2fd0);box-shadow:0 30px 60px rgba(22,70,200,.35)}
.lp-highlight .big{background:linear-gradient(120deg,#ffe27a,var(--lp-yellow));-webkit-background-clip:text;background-clip:text;color:transparent}

/* Fiyat kartları */
.lp-price{border-radius:22px}
.lp-price.vip{box-shadow:0 0 0 1px rgba(22,119,255,.4),0 14px 34px rgba(22,119,255,.12)}
.lp-price.platinum{box-shadow:0 0 0 1px rgba(245,179,1,.55),0 18px 40px rgba(245,179,1,.18)}
.lp-price .tag{box-shadow:0 6px 14px rgba(245,179,1,.4)}

/* Rütbeler */
.lp-rank{border-radius:20px;background:linear-gradient(170deg,rgba(255,255,255,.07),rgba(255,255,255,.02))}
.lp-rank:hover{border-color:rgba(245,179,1,.45);box-shadow:0 20px 40px rgba(0,0,0,.35)}
.lp-rank .medal{font-size:34px;filter:drop-shadow(0 6px 12px rgba(245,179,1,.35))}

/* SSS */
.lp-faq-item{border-radius:16px;transition:box-shadow .2s,border-color .2s}
.lp-faq-item.open{border-color:rgba(22,119,255,.35);box-shadow:0 14px 34px rgba(10,30,70,.08)}

/* Son CTA */
.lp-cta-final{position:relative;overflow:hidden;border-radius:32px;background:
  radial-gradient(50% 60% at 20% 0%,rgba(124,92,255,.45),transparent 70%),
  radial-gradient(50% 60% at 85% 100%,rgba(46,167,255,.4),transparent 70%),var(--v2-bg)}
.lp-cta-final h2{letter-spacing:-.04em}

/* Alt bilgi */
.lp-footer{background:#040a14}
.lp-legal{margin:16px 0 0;padding-top:14px;border-top:1px solid rgba(255,255,255,.07);font-size:12px;line-height:1.7;color:rgba(255,255,255,.45)}
.lp-legal b{color:rgba(255,255,255,.7)}.lp-legal a{display:inline;padding:0;font-size:12px}

/* ---- Mobil sabit alt CTA ---- */
.lp-sticky-cta{display:none}
@media (max-width:640px){
  .lp-sticky-cta{display:flex;gap:8px;position:fixed;left:10px;right:10px;bottom:max(10px,env(safe-area-inset-bottom));z-index:70;
    padding:8px;border-radius:20px;background:rgba(6,13,26,.88);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.12);
    box-shadow:0 14px 34px rgba(0,0,0,.45);transform:translateY(140%);transition:transform .3s cubic-bezier(.2,.8,.2,1)}
  .lp-sticky-cta.show{transform:none}
  .lp-sticky-cta .lp-btn{flex:1;padding:12px 10px;font-size:14.5px}
  .lp-sticky-cta .lp-btn-ghost{flex:0 0 auto;padding:12px 18px}
  .lp-bento{grid-template-columns:1fr}
  .lp-card-wide{grid-column:auto}
  .lp-steps::before{display:none}
  .lp-hero h1{font-size:clamp(34px,10vw,44px)}
}
@media (max-width:960px) and (min-width:641px){.lp-bento{grid-template-columns:repeat(2,1fr)}.lp-card-wide{grid-column:span 2}.lp-steps::before{display:none}}
@media (prefers-reduced-motion:reduce){
  .lp-hero::before,.lp-hero h1 .grad,.lp-hero .lp-hero-card,.lp-marquee-track{animation:none}
}

/* ---- Tablet: menü yazıları kırılmasın → açılır menü (641–960 px) ---- */
.lp-nav a.lp-link,.lp-nav-cta .lp-link{white-space:nowrap}
@media (max-width:960px) and (min-width:641px){
  .lp-nav{display:none}
  .lp-burger{display:grid}
  .lp-mobile-nav{display:none;position:fixed;inset:0 0 0 auto;width:min(60%,340px);z-index:80;background:var(--lp-navy2);border-left:1px solid var(--lp-line);
    padding:20px;flex-direction:column;gap:6px}
  .lp-mobile-nav.show{display:flex}
  .lp-mobile-nav a{color:rgba(255,255,255,.85);padding:14px 12px;border-radius:12px;font-weight:600}
  .lp-mobile-nav a:hover{background:rgba(255,255,255,.06)}
  .lp-mobile-nav .lp-btn{margin-top:8px}
  .lp-mobile-backdrop{display:none;position:fixed;inset:0;background:rgba(4,10,20,.6);z-index:75}
  .lp-mobile-backdrop.show{display:block}
}
.lp-bento{grid-auto-flow:dense}
.lp-card-wide.alt{background:linear-gradient(135deg,#2a1a5e,#5b2fd0 60%,#7c5cff)}
.lp-card-wide.alt::after{content:"📣 ✨ 🏷️"}

/* .lp a{color:inherit} butonların kendi yazı rengini ezmesin (koyu bölümlerde "Partner Girişi" okunmuyordu) */
.lp a.lp-btn-ghost{color:#fff}
.lp a.lp-btn-ghost:hover{color:#fff}

/* ---- Çok sayfalı yapı (2026-10-05): alt sayfa başlığı, aktif menü, "devamı" kartları ---- */
.lp-pagehero{padding:clamp(44px,6vw,80px) 0 clamp(40px,5vw,64px)}
.lp-pagehero h1{font-size:clamp(30px,4.6vw,52px);max-width:820px}
.lp-pagehero .lp-lead{max-width:680px;margin-bottom:0}
.lp-nav a.lp-link.on{color:#fff}
.lp-nav a.lp-link.on::after{transform:scaleX(1)}
.lp-mobile-nav a.on{background:rgba(46,167,255,.14);color:#fff}
.lp-more .lp-card{text-decoration:none;color:inherit;display:flex;flex-direction:column;transition:transform .2s,box-shadow .2s}
.lp-more .lp-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(4,15,30,.12)}
.lp-more .lp-card .go{margin-top:auto;padding-top:10px;color:var(--lp-blue)}