/* ==========================================================================
   kazanıyor muyum? — LANDING (index.php)  ·  AÇIK / PROFESYONEL TEMA
   Tamamen kapsüllü: tüm kurallar `body.lp-page` ve `.lp-*` altında.
   Ürünün gerçek paletiyle hizalı (paper / ink / profit-green / brand-teal).
   Mevcut app.css sınıflarına (.hero/.how/.btn/.card/.foot ...) DOKUNMAZ.
   ========================================================================== */

html:has(body.lp-page){scroll-behavior:smooth}

body.lp-page{
  color-scheme: only light;   /* tur96: zorla-koyu-mod (Auto Dark) opt-out — menü/kart renkleri korunur */
  --bg:#F6F5F0; --card:#FFFFFF;
  --ink:#15171C; --muted:#5B6068; --faint:#9499A0;
  --line:#E7E5DC; --line-2:#EFEEE7;
  --green:#0E9F6E; --green-deep:#0A7A53; --green-soft:#E6F6EF;
  --brand:#0F3D3E; --amber:#B97214; --amber-soft:#FBF1E0; --loss:#D8443B;
  --sh-sm:0 1px 2px rgba(20,23,28,.05);
  --sh:0 1px 2px rgba(20,23,28,.04), 0 10px 30px rgba(20,23,28,.06);
  --sh-lg:0 2px 6px rgba(20,23,28,.05), 0 24px 60px rgba(20,23,28,.10);
  background:var(--bg); color:var(--ink);
  font-family:'Inter',system-ui,-apple-system,sans-serif; line-height:1.5;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
/* çok hafif, profesyonel atmosfer */
body.lp-page::before{
  content:""; position:fixed; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(680px 380px at 88% -8%, rgba(14,159,110,.06), transparent 70%),
    radial-gradient(720px 460px at -6% 4%, rgba(15,61,62,.05), transparent 70%);
}
body.lp-page > *{position:relative; z-index:1}

.lp-page ::selection{background:rgba(14,159,110,.18)}
.lp-page a{color:inherit; text-decoration:none}
.lp-page a:focus-visible,.lp-page button:focus-visible,.lp-page summary:focus-visible{
  outline:2px solid var(--green); outline-offset:3px; border-radius:8px}

.lp-container{max-width:1180px; margin:0 auto; padding:0 24px}
.lp-section{padding:94px 0; scroll-margin-top:84px}
.lp-eyebrow{font-size:12.5px; font-weight:700; letter-spacing:.13em; text-transform:uppercase;
  color:var(--green-deep); margin-bottom:14px; text-align:center}
.lp-h2{font-family:'Fraunces',serif; font-weight:600; font-size:clamp(28px,4vw,42px);
  line-height:1.12; letter-spacing:-.02em; color:var(--ink); text-align:center}
.lp-sub{max-width:580px; margin:16px auto 0; text-align:center; color:var(--muted);
  font-size:16.5px; line-height:1.6}

/* ---------- kart temeli ---------- */
.lp-glass{background:var(--card); border:1px solid var(--line); border-radius:16px; box-shadow:var(--sh)}
.lp-lift{transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease}
.lp-lift:hover{transform:translateY(-4px); box-shadow:var(--sh-lg); border-color:#DAD8CE}

/* ---------- butonlar ---------- */
.lp-btn{display:inline-flex; align-items:center; justify-content:center; gap:9px;
  font-family:'Inter'; font-weight:600; font-size:15px; line-height:1; white-space:nowrap;
  padding:12px 22px; border-radius:12px; border:1px solid transparent; cursor:pointer;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease}
.lp-btn-ghost{background:#fff; color:var(--ink); border-color:var(--line)}
.lp-btn-ghost:hover{border-color:#CFCDC2; box-shadow:var(--sh-sm)}
.lp-btn-outline{background:#fff; color:var(--brand); border-color:#CBD7D2}
.lp-btn-outline:hover{border-color:var(--green); color:var(--green-deep); box-shadow:var(--sh-sm)}
.lp-btn-neon{background:var(--green); color:#fff; border-color:var(--green);
  box-shadow:0 1px 2px rgba(10,122,83,.25)}
.lp-btn-neon:hover{background:var(--green-deep); transform:translateY(-2px);
  box-shadow:0 8px 22px rgba(14,159,110,.28)}
.lp-btn-lg{padding:15px 30px; font-size:16.5px; border-radius:14px}
.lp-btn-block{width:100%}

/* ---------- header ---------- */
.lp-header{position:sticky; top:0; z-index:50;
  background:rgba(255,255,255,.82); -webkit-backdrop-filter:saturate(160%) blur(12px);
  backdrop-filter:saturate(160%) blur(12px); border-bottom:1px solid var(--line)}
.lp-header-in{max-width:1180px; margin:0 auto; padding:13px 24px; position:relative;
  display:flex; align-items:center; gap:26px}

.lp-logo{display:flex; align-items:center; gap:11px}
.lp-logo-mark{display:flex}
.lp-logo-wm{display:flex; flex-direction:column; line-height:1}
.lp-logo-1{font-family:'Inter'; font-weight:800; font-size:18px; letter-spacing:.04em;
  text-transform:uppercase; color:var(--ink)}
.lp-logo-2{align-self:flex-end; margin-top:3px; font-family:'Inter'; font-weight:500;
  font-size:12.5px; letter-spacing:.01em; color:var(--faint)}
.lp-logo-2 .q{color:var(--green); font-weight:700}

.lp-menu{flex:1; display:flex; align-items:center; gap:24px}
.lp-nav{display:flex; gap:2px}
.lp-nav a{font-size:14px; font-weight:500; color:var(--muted); padding:8px 13px;
  border-radius:10px; transition:color .15s, background .15s}
.lp-nav a:hover{color:var(--ink); background:rgba(20,23,28,.045)}
.lp-actions{margin-left:auto; display:flex; align-items:center; gap:10px}

.lp-menu-toggle{display:none}
.lp-burger{display:none; width:42px; height:42px; border-radius:11px; cursor:pointer;
  align-items:center; justify-content:center; background:#fff; border:1px solid var(--line)}
.lp-burger span{display:block; width:18px; height:2px; background:var(--ink); position:relative; transition:.2s}
.lp-burger span::before,.lp-burger span::after{content:""; position:absolute; left:0;
  width:18px; height:2px; background:var(--ink); transition:.2s}
.lp-burger span::before{top:-6px}.lp-burger span::after{top:6px}

/* ---------- hero ---------- */
.lp-hero{padding-top:104px; padding-bottom:80px}
.lp-hero-grid{display:grid; grid-template-columns:1.05fr .95fr; gap:54px; align-items:center}
.lp-h1{font-family:'Fraunces',serif; font-weight:600; font-size:clamp(38px,5.2vw,62px);
  line-height:1.05; letter-spacing:-.025em; color:var(--ink)}
.lp-h1 .accent{color:var(--green-deep)}
.lp-hero-lead{margin-top:22px; max-width:520px; font-size:18px; line-height:1.62; color:var(--muted)}
.lp-hero-actions{margin-top:32px; display:flex; align-items:center; gap:14px; flex-wrap:wrap}
.lp-hero-trust{margin-top:22px; font-size:13.5px; color:var(--faint); display:flex; align-items:center; gap:8px}
.lp-hero-trust b{color:var(--ink); font-weight:600}

.lp-hero-visual{position:relative; min-height:430px}
.lp-orb{position:absolute; width:280px; height:280px; right:6%; top:14%;
  background:radial-gradient(circle, rgba(14,159,110,.12), transparent 66%); filter:blur(6px)}
.lp-stat{position:absolute; padding:20px 22px; width:266px; background:var(--card);
  border:1px solid var(--line); border-radius:16px; box-shadow:var(--sh-lg)}
.lp-stat .lp-stat-lab{display:flex; align-items:center; gap:9px; font-size:13px; color:var(--muted); font-weight:500}
.lp-stat .lp-stat-val{margin-top:8px; font-weight:700; font-size:27px; letter-spacing:-.01em;
  font-variant-numeric:tabular-nums}
.lp-stat .lp-stat-sub{margin-top:5px; font-size:12.5px; color:var(--faint)}
.lp-stat-dot{width:9px; height:9px; border-radius:50%; flex:none}
.lp-stat-1{top:8px; left:0; z-index:3}     .lp-stat-1 .lp-stat-val{color:var(--green-deep)}
.lp-stat-2{top:150px; right:0; z-index:2}  .lp-stat-2 .lp-stat-val{color:var(--ink)}
.lp-stat-3{bottom:4px; left:36px; z-index:3; width:290px} .lp-stat-3 .lp-stat-val{color:var(--amber); font-size:23px}
.lp-float{animation:lp-float 6s ease-in-out infinite}
.lp-float-2{animation:lp-float 7s ease-in-out infinite .8s}
.lp-float-3{animation:lp-float 6.5s ease-in-out infinite .4s}
@keyframes lp-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}

.lp-bars{display:flex; align-items:flex-end; gap:5px; height:34px; margin-top:12px}
.lp-bars i{flex:1; background:var(--green-soft); border-radius:3px 3px 0 0; display:block;
  box-shadow:inset 0 -2px 0 rgba(14,159,110,.35)}

/* ---------- problem kartları ---------- */
.lp-cards-3{display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:50px}
.lp-pcard{padding:30px 26px}
.lp-pcard-ico{width:50px; height:50px; border-radius:13px; display:grid; place-items:center;
  background:var(--green-soft); border:1px solid #CFEBDD; margin-bottom:20px}
.lp-pcard h3{font-family:'Fraunces',serif; font-weight:600; font-size:21px; color:var(--ink); margin-bottom:11px}
.lp-pcard p{font-size:15px; line-height:1.62; color:var(--muted)}

/* ---------- çözüm / nasıl çalışır (zikzak) ---------- */
.lp-steps{margin-top:54px; display:flex; flex-direction:column; gap:28px}
.lp-step{display:flex; align-items:center; gap:40px}
.lp-step:nth-child(even){flex-direction:row-reverse}
.lp-step-text{flex:1}
.lp-step-n{display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px;
  border-radius:12px; background:var(--green-soft); border:1px solid #CFEBDD;
  color:var(--green-deep); font-weight:700; font-size:16px; margin-bottom:16px}
.lp-step-text h3{font-family:'Fraunces',serif; font-weight:600; font-size:24px; color:var(--ink); margin-bottom:10px}
.lp-step-text p{font-size:16px; line-height:1.62; color:var(--muted); max-width:460px}
.lp-step-visual{flex:1; min-height:168px; display:grid; place-items:center; padding:26px}
.lp-plats{display:flex; flex-wrap:wrap; gap:10px; justify-content:center}
.lp-plat{display:inline-flex; align-items:center; gap:8px; font-size:13.5px; font-weight:600;
  color:var(--ink); background:#fff; border:1px solid var(--line); border-radius:11px; padding:9px 15px;
  box-shadow:var(--sh-sm)}
.lp-plat .lp-plat-dot{width:8px; height:8px; border-radius:50%; background:var(--green)}
.lp-mini-rows{width:100%; max-width:300px; display:flex; flex-direction:column; gap:9px}
.lp-mini-row{display:flex; justify-content:space-between; align-items:center; font-size:13.5px;
  color:var(--muted); padding:10px 14px; border-radius:10px; background:#fff; border:1px solid var(--line-2)}
.lp-mini-row b{color:var(--ink); font-variant-numeric:tabular-nums; font-weight:700}
.lp-mini-row b.pos{color:var(--green-deep)} .lp-mini-row b.neg{color:var(--loss)}
.lp-runway{width:100%; max-width:300px; text-align:center}
.lp-runway-track{height:10px; border-radius:999px; background:#EEEDE6; overflow:hidden; margin:14px 0 10px}
.lp-runway-fill{height:100%; width:62%; background:linear-gradient(90deg, var(--green), var(--amber)); border-radius:999px}
.lp-runway small{color:var(--muted); font-size:12.5px} .lp-runway b{color:var(--amber)}

/* ---------- fiyatlandırma ---------- */
.lp-pricing-grid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px;
  align-items:center; max-width:900px; margin:54px auto 0}
.lp-price{padding:34px 32px; display:flex; flex-direction:column}
.lp-price-tag{font-size:12.5px; font-weight:700; letter-spacing:.10em; text-transform:uppercase; color:var(--faint)}
.lp-price-name{font-family:'Fraunces',serif; font-weight:600; font-size:25px; color:var(--ink); margin:6px 0 4px}
.lp-price-aud{font-size:14px; color:var(--muted); line-height:1.5}
.lp-price-soon{margin:22px 0 4px; font-family:'Fraunces',serif; font-weight:600; font-size:24px; color:var(--faint)}
.lp-price hr{border:0; border-top:1px solid var(--line); margin:22px 0}
.lp-feats{list-style:none; display:flex; flex-direction:column; gap:12px; margin:0 0 26px}
.lp-feat{display:flex; align-items:flex-start; gap:11px; font-size:14.5px; color:#3A4039; line-height:1.45}
.lp-feat svg{flex:none; margin-top:1px}
.lp-price .lp-btn{margin-top:auto}
.lp-price-premium{position:relative; z-index:2; transform:scale(1.045);
  border-color:#BFE6D5; box-shadow:0 0 0 1px rgba(14,159,110,.25), 0 24px 56px rgba(14,159,110,.12)}
.lp-price-premium .lp-price-name{color:var(--green-deep)}
.lp-badge{position:absolute; top:-14px; left:50%; transform:translateX(-50%);
  background:var(--green); color:#fff; font-size:12px; font-weight:700; letter-spacing:.01em;
  padding:6px 16px; border-radius:999px; white-space:nowrap; box-shadow:0 6px 16px rgba(14,159,110,.30)}

/* ---------- SSS ---------- */
.lp-faq{max-width:760px; margin:46px auto 0; display:flex; flex-direction:column; gap:13px}
.lp-faq-item{overflow:hidden}
.lp-faq-item summary{list-style:none; cursor:pointer; padding:20px 24px; display:flex;
  align-items:center; justify-content:space-between; gap:16px;
  font-family:'Inter'; font-weight:600; font-size:16.5px; color:var(--ink)}
.lp-faq-item summary::-webkit-details-marker{display:none}
.lp-faq-plus{flex:none; width:24px; height:24px; position:relative; transition:transform .25s ease}
.lp-faq-plus::before,.lp-faq-plus::after{content:""; position:absolute; top:50%; left:50%;
  background:var(--green); border-radius:2px; transform:translate(-50%,-50%)}
.lp-faq-plus::before{width:13px; height:2px}
.lp-faq-plus::after{width:2px; height:13px; transition:opacity .25s ease}
.lp-faq-item[open] .lp-faq-plus::after{opacity:0}
.lp-faq-item[open] .lp-faq-plus{transform:rotate(180deg)}
.lp-faq-body{padding:0 24px 22px; color:var(--muted); font-size:15px; line-height:1.65; max-width:640px}

/* ---------- footer ---------- */
.lp-footer{border-top:1px solid var(--line); margin-top:36px; background:#FBFAF6}
.lp-footer-in{max-width:1180px; margin:0 auto; padding:52px 24px 38px;
  display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:36px}
.lp-foot-slogan{margin-top:16px; color:var(--muted); font-size:14.5px; max-width:280px; line-height:1.6}
.lp-foot-col h4{font-size:12.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  color:var(--faint); margin-bottom:14px}
.lp-foot-col a{display:block; color:var(--muted); font-size:14.5px; padding:6px 0; transition:color .15s}
.lp-foot-col a:hover{color:var(--ink)}
.lp-foot-rehber{color:var(--green-deep) !important; font-weight:600}
.lp-foot-rehber:hover{color:var(--green) !important}
.lp-foot-bottom{border-top:1px solid var(--line)}
.lp-foot-bottom-in{max-width:1180px; margin:0 auto; padding:20px 24px; display:flex;
  justify-content:space-between; align-items:center; gap:14px; color:var(--faint); font-size:13px; flex-wrap:wrap}
.lp-foot-bottom-in a{color:var(--muted)}

/* ========================== RESPONSIVE ========================== */
@media (max-width:960px){
  .lp-hero-grid{grid-template-columns:1fr; gap:46px}
  .lp-hero{padding-top:88px}
  .lp-hero-lead{max-width:none}
  .lp-hero-visual{min-height:0; display:flex; flex-direction:column; gap:16px}
  .lp-orb{display:none}
  .lp-stat{position:static; width:100% !important; animation:none}
  .lp-cards-3{grid-template-columns:1fr; gap:18px}
  .lp-step,.lp-step:nth-child(even){flex-direction:column; gap:18px; text-align:left}
  .lp-step-visual{width:100%}
  .lp-step-text p{max-width:none}
  .lp-pricing-grid{grid-template-columns:1fr; gap:32px; max-width:440px}
  .lp-price-premium{transform:none; margin-top:6px}
  .lp-footer-in{grid-template-columns:1fr 1fr; gap:28px}
  .lp-foot-brand{grid-column:1 / -1}
}
@media (max-width:860px){
  .lp-burger{display:flex; margin-left:auto; order:3}
  .lp-menu{position:absolute; top:calc(100% + 6px); left:16px; right:16px; z-index:60;
    flex-direction:column; align-items:stretch; gap:14px; margin:0; padding:0;
    background:#FFFFFF; border:1px solid var(--line); border-radius:16px;
    box-shadow:var(--sh-lg), 0 0 0 100vmax rgba(20,23,28,.35);   /* tur96: arkaya karartma perdesi — hero ile karışmaz */
    max-height:0; opacity:0; overflow:hidden; pointer-events:none;
    transition:max-height .25s ease, opacity .2s ease, padding .25s ease}
  .lp-menu-toggle:checked ~ .lp-menu{max-height:460px; opacity:1; pointer-events:auto; padding:16px}
  .lp-nav{flex-direction:column; gap:4px}
  .lp-nav a{padding:11px 13px}
  .lp-actions{margin-left:0; flex-direction:column; gap:10px}
  .lp-actions .lp-btn{width:100%}
  .lp-menu-toggle:checked ~ .lp-burger span{background:transparent}
  .lp-menu-toggle:checked ~ .lp-burger span::before{top:0; transform:rotate(45deg)}
  .lp-menu-toggle:checked ~ .lp-burger span::after{top:0; transform:rotate(-45deg)}
}
@media (max-width:560px){
  .lp-section{padding:70px 0}
  .lp-actions .lp-btn{padding:10px 14px; font-size:14px}
  .lp-foot-bottom-in{flex-direction:column; align-items:flex-start}
}
@media (prefers-reduced-motion: reduce){
  html:has(body.lp-page){scroll-behavior:auto}
  .lp-page *{animation:none !important; transition:none !important}
}