/* landing.css — index.html only */
.lp{min-height:100vh;position:relative;overflow-x:hidden}
.lp-glow{position:absolute;inset:0 0 auto 0;height:720px;pointer-events:none;z-index:0;
  background:radial-gradient(60% 70% at 70% 0%,rgba(255,122,26,.20),transparent 70%),radial-gradient(40% 50% at 92% 30%,rgba(155,107,255,.10),transparent 70%)}
.lp-top,main,.lp-footer{position:relative;z-index:1}
.lp-top{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:var(--sp-4);max-width:1180px;margin:0 auto;padding:14px 16px}
.lp-top .bm-topbar-right{justify-self:end}
.lp-nav{display:flex;justify-content:center;gap:4px}
.lp-nav a{color:var(--text-2);text-decoration:none;padding:7px 12px;border-radius:var(--radius-s);font-weight:600;transition:all var(--t-fast)}
.lp-nav a:hover{color:var(--text);background:var(--bg-3)}
.lp-lang .bm-tab{padding:5px 10px;font-size:var(--fs-s)}
main{max-width:1180px;margin:0 auto;padding:0 16px 80px}
.lp h1,.lp h2,.lp h3,.lp-sub,.lp-magic-desc,.lp-card-body p,.lp-step>div,.lp-plug-desc,.lp-checks li,.lp-section-head p,.lp-privacy p{text-wrap:balance}

/* hero */
.lp-hero{text-align:center;padding:56px 0 36px;display:flex;flex-direction:column;align-items:center}
.lp-eyebrow{height:26px;padding:0 12px;font-size:11px}
.lp-eyebrow svg{width:13px;height:13px}
.lp-title{font-size:clamp(38px,7vw,76px);line-height:1.02;letter-spacing:-.035em;font-weight:850;margin:18px 0 0;max-width:24ch}
.lp-title em{font-style:normal;background:linear-gradient(135deg,#ff7a1a 0%,#ffa24d 55%,#ffd29a 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.lp-sub{color:var(--text-2);font-size:clamp(15px,2.2vw,19px);max-width:58ch;margin:18px 0 32px;line-height:1.55}

/* magic drop zone */
.lp-magic{position:relative;display:flex;align-items:center;gap:18px;width:min(760px,100%);padding:18px 20px;text-align:left;cursor:pointer;
  background:linear-gradient(180deg,rgba(155,107,255,.10),rgba(155,107,255,.04));border:1.5px dashed color-mix(in srgb,var(--magic) 55%,var(--line-2));
  border-radius:var(--radius-xl);transition:transform var(--t-med) var(--ease),box-shadow var(--t-med),border-color var(--t-fast),background var(--t-fast);
  box-shadow:0 20px 60px rgba(124,92,255,.14)}
.lp-magic:hover,.lp-magic:focus-visible,.lp-magic.is-drag{border-style:solid;border-color:var(--magic);transform:translateY(-2px);box-shadow:0 24px 70px rgba(124,92,255,.3);outline:none}
.lp-magic.is-drag{background:linear-gradient(180deg,rgba(155,107,255,.22),rgba(155,107,255,.08))}
.lp-magic.is-busy{pointer-events:none;opacity:.7}
.lp-magic-orb{flex:none;width:68px;height:68px;border-radius:20px;display:grid;place-items:center;color:#fff;background:var(--magic-grad);box-shadow:0 8px 28px var(--magic-glow)}
.lp-magic-orb svg{width:34px;height:34px;animation:lp-wiggle 3.6s ease-in-out infinite;transform-origin:20% 80%}
@keyframes lp-wiggle{0%,70%,100%{transform:rotate(0)}78%{transform:rotate(-14deg)}86%{transform:rotate(10deg)}94%{transform:rotate(-4deg)}}
.lp-magic-text{flex:1;min-width:0}
.lp-magic-title{font-size:20px;font-weight:800;letter-spacing:-.01em}
.lp-magic-desc{color:var(--text-2);margin-top:3px;font-size:14px}
.lp-magic-btn{flex:none}
.lp-magic-err{position:absolute;left:20px;right:20px;bottom:-34px;color:var(--bad);font-size:var(--fs-s);text-align:center}
.lp-formats{margin-top:16px;color:var(--text-3);font-size:var(--fs-s);letter-spacing:.08em}

/* mode cards */
.lp-cards{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:40px}
.lp-card{display:flex;flex-direction:column;background:linear-gradient(180deg,var(--bg-2),var(--bg-1));border:1px solid var(--line-2);border-radius:var(--radius-xl);overflow:hidden;text-decoration:none;color:var(--text);
  transition:transform var(--t-med) var(--ease),box-shadow var(--t-med),border-color var(--t-fast);box-shadow:var(--shadow-1)}
.lp-card:hover,.lp-card:focus-visible{transform:translateY(-4px);outline:none;box-shadow:var(--shadow-2)}
.lp-card-mix:hover,.lp-card-mix:focus-visible{border-color:var(--accent);box-shadow:0 20px 60px rgba(255,122,26,.16)}
.lp-card-master:hover,.lp-card-master:focus-visible{border-color:var(--accent);box-shadow:0 20px 60px rgba(255,122,26,.16)}
.lp-card-art{height:210px;border-bottom:1px solid var(--line);background:var(--bg-0);position:relative}
.lp-card-art svg{display:block;width:100%;height:100%}
.lp-card-body{padding:22px 24px 24px}
.lp-card-body h2{margin:6px 0 8px;font-size:28px;letter-spacing:-.02em;font-weight:800}
.lp-card-body p{margin:0 0 18px;color:var(--text-2);line-height:1.5}
.lp-card-go{display:inline-flex;align-items:center;gap:8px;font-weight:700;color:var(--accent-2)}
.lp-card-go svg{transition:transform var(--t-fast)}
.lp-card:hover .lp-card-go svg{transform:translateX(4px)}

/* steps */
.lp-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:0;padding:0;list-style:none;counter-reset:s}
.lp-step{display:flex;gap:14px;align-items:flex-start;padding:18px;border:1px solid var(--line);border-radius:var(--radius-m);background:var(--bg-1)}
.lp-step-magic{background:var(--magic-soft)!important;color:var(--magic-2)!important;border-color:color-mix(in srgb,var(--magic) 45%,transparent)!important}
.lp-step-n{flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:13px;background:var(--accent-soft);color:var(--accent-2);border:1px solid color-mix(in srgb,var(--accent) 40%,transparent)}
.lp-step b{display:block;font-size:15px;margin-bottom:2px}
.lp-step span{color:var(--text-3);font-size:var(--fs-s);line-height:1.4}

/* plugins */
.lp-section{margin-top:72px;scroll-margin-top:16px}
.lp-how{margin-top:56px}
.lp-section-head{text-align:center}
.lp-section-head h2{font-size:clamp(26px,4vw,38px);letter-spacing:-.025em;margin:0 0 8px;font-weight:800}
.lp-section-head p{color:var(--text-2);margin:0 auto 24px;max-width:60ch}
.lp-filter{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:0 0 18px}
.lp-fbtn{font:inherit;font-size:13px;font-weight:650;color:var(--text-2);background:var(--bg-2);border:1px solid var(--line-2);border-radius:var(--radius-pill);padding:6px 14px;cursor:pointer;transition:all var(--t-fast)}
.lp-fbtn:hover{color:var(--text);border-color:var(--text-3)}
.lp-fbtn.is-on{color:var(--text-inv);background:var(--accent);border-color:var(--accent)}
.lp-fbtn:focus-visible{outline:none;box-shadow:var(--ring)}
.lp-plug-foot{display:flex;align-items:center;gap:10px;margin-top:auto;padding-top:10px}
.lp-plug-foot .bm-chip{margin-top:0}
.lp-viz{flex:1;min-width:0;height:20px;display:flex;align-items:center;justify-content:flex-end;color:var(--c,var(--accent));opacity:.8}
.lp-plug:hover .lp-viz{opacity:1}
.lp-viz svg{width:48px;height:20px;overflow:visible}
.lp-v-curve,.lp-v-wave{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-dasharray:100;animation:lp-draw 3.2s ease-in-out infinite}
.lp-v-ring{fill:none;stroke:currentColor;stroke-width:1.6;transform-origin:24px 10px;animation:lp-ring 2.4s ease-in-out infinite}
.lp-v-ring2{animation-delay:-1.2s}
.lp-v-echo rect{fill:currentColor;animation:lp-echo 1.6s ease-in-out infinite}
.lp-v-echo rect:nth-child(2){animation-delay:.2s}.lp-v-echo rect:nth-child(3){animation-delay:.4s}.lp-v-echo rect:nth-child(4){animation-delay:.6s}
.lp-v-bars{display:flex;align-items:flex-end;gap:3px;height:18px}
.lp-v-bars i{width:4px;height:100%;border-radius:2px;background:currentColor;transform-origin:bottom;animation:lp-bar 1.1s ease-in-out infinite;animation-delay:var(--d)}
.lp-v-gr{width:48px;height:6px;border-radius:3px;background:var(--bg-3);overflow:hidden;position:relative}
.lp-v-gr i{position:absolute;inset:0 0 0 auto;width:60%;background:currentColor;border-radius:3px;animation:lp-gr 2.2s ease-in-out infinite}
@keyframes lp-draw{0%{stroke-dashoffset:100}50%,100%{stroke-dashoffset:0}}
@keyframes lp-ring{0%,100%{transform:scale(.7);opacity:.5}50%{transform:scale(1);opacity:1}}
@keyframes lp-echo{0%,100%{opacity:.35}50%{opacity:1}}
@keyframes lp-bar{0%,100%{transform:scaleY(.25)}50%{transform:scaleY(1)}}
@keyframes lp-gr{0%,100%{width:15%}40%{width:75%}}
@media (prefers-reduced-motion:reduce){.lp-viz *,.lp-magic-orb svg{animation:none!important}.lp-v-curve,.lp-v-wave{stroke-dashoffset:0}}
/* wrapped rows are centred (a short last row never hugs the left edge); column count follows the container width like auto-fill/minmax(250px) did */
.lp-plugins{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;container-type:inline-size}
.lp-plugins>.lp-plug{flex:0 0 100%;min-width:0}
@container (min-width:512px){.lp-plugins>.lp-plug{flex-basis:calc((100% - 12px)/2)}}
@container (min-width:774px){.lp-plugins>.lp-plug{flex-basis:calc((100% - 24px)/3)}}
@container (min-width:1036px){.lp-plugins>.lp-plug{flex-basis:calc((100% - 36px)/4)}}
.lp-plugins>.lp-plug-more{flex-basis:100%}
.lp-plug{display:flex;gap:12px;align-items:stretch;padding:14px;border:1px solid var(--line);border-radius:var(--radius-m);background:var(--bg-1);text-decoration:none;color:var(--text);transition:all var(--t-fast)}
.lp-plug:hover,.lp-plug:focus-visible{border-color:var(--c,var(--accent));background:var(--bg-2);transform:translateY(-2px);outline:none}
.lp-plug>span:last-child{flex:1;min-width:0;display:flex;flex-direction:column}
.lp-plug-more>span:last-child{display:grid;justify-items:center;gap:4px}
.lp-plug-ico{flex:none;align-self:flex-start;width:40px;height:40px;border-radius:var(--radius-m);display:grid;place-items:center;background:color-mix(in srgb,var(--c,var(--accent)) 14%,var(--bg-3));color:var(--c,var(--accent))}
.lp-plug-name{font-weight:700;font-size:14.5px}
.lp-plug-desc{color:var(--text-3);font-size:var(--fs-s);line-height:1.4;margin-top:2px}

.lp-plug-more{display:grid;place-items:center;text-align:center;color:var(--text-3);border-style:dashed}

/* privacy / platforms */
.lp-split{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:72px}
.lp-privacy,.lp-platforms{padding:26px;text-align:center}
.lp-privacy h3,.lp-platforms h3{margin:0 0 8px;font-size:20px;letter-spacing:-.01em}
.lp-privacy p{margin:0;color:var(--text-2);line-height:1.55}
.lp-privacy-ico{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;color:var(--good);background:color-mix(in srgb,var(--good) 14%,var(--bg-3));margin:0 auto 16px}
.lp-plat-ico{color:var(--accent-2);background:color-mix(in srgb,var(--accent) 14%,var(--bg-3))}   /* same 48 px icon block as the privacy panel: both titles sit on one line */
.lp-badges{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:16px}
.lp-badge{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:var(--radius-pill);background:var(--bg-3);border:1px solid var(--line-2);font-weight:650;font-size:13px}
.lp-badge i{font-style:normal;font:700 11px var(--mono);color:var(--accent-2)}

.lp-checks{list-style:none;margin:16px auto 0;padding:0;display:grid;gap:8px;width:fit-content;max-width:100%;color:var(--text-2);font-size:14px}
.lp-checks li{text-align:left}
.lp-checks li{position:relative;padding-left:24px;line-height:1.4}
.lp-checks li::before{content:"";position:absolute;left:2px;top:.35em;width:10px;height:6px;border-left:2px solid var(--good);border-bottom:2px solid var(--good);transform:rotate(-45deg)}
.lp-faq{display:grid;gap:10px;max-width:820px;margin:0 auto}
.lp-faq details{border:1px solid var(--line);border-radius:var(--radius-m);background:var(--bg-1);transition:border-color var(--t-fast)}
.lp-faq details[open]{border-color:var(--line-2);background:var(--bg-2)}
.lp-faq summary{cursor:pointer;padding:15px 18px;font-weight:700;list-style:none;display:flex;justify-content:space-between;gap:12px}
.lp-faq summary::-webkit-details-marker{display:none}
.lp-faq summary::after{content:"+";color:var(--accent);font-size:20px;line-height:1;font-weight:500}
.lp-faq details[open] summary::after{content:"-"}
.lp-faq summary:focus-visible{outline:none;box-shadow:var(--ring);border-radius:var(--radius-m)}
.lp-faq p{margin:0;padding:0 18px 16px;color:var(--text-2);line-height:1.6}
.lp-foot-brand{display:flex;flex-direction:column;gap:6px;text-wrap:balance}
.lp-foot-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 18px}
.lp-foot-nav a{color:var(--text-2);text-decoration:none;font-weight:600;padding:7px 2px}
.lp-foot-nav a:hover{color:var(--accent-2)}
.lp-footer{display:grid;grid-template-columns:1fr auto 1fr;gap:12px 24px;align-items:center;max-width:1180px;margin:0 auto;padding:28px 16px 40px;border-top:1px solid var(--line)}

.lp-footer>:last-child{justify-self:end}
@media (max-width:900px){
  .lp-cards,.lp-split{grid-template-columns:1fr}
  .lp-steps{grid-template-columns:1fr}
}
@media (max-width:760px){
  .lp-footer{grid-template-columns:1fr;justify-items:center;text-align:center}
  .lp-footer>:last-child{justify-self:center}
  .lp-foot-brand{align-items:center}
}
@media (max-width:520px){
  .lp-title{font-size:clamp(26px,7.4vw,38px)}   /* the three one-word sentences stay on ONE line (the longer Turkish title used to leave "Yayınla." alone on line 2) */
}
@media (max-width:640px){
  .lp-top{grid-template-columns:1fr auto}
  .lp-nav{display:none}
  .lp-hero{padding-top:32px}
  .lp-magic{flex-wrap:wrap;gap:14px;padding:16px}
  .lp-magic-text{flex-basis:calc(100% - 90px)}
  .lp-magic-btn{width:100%}
  .lp-magic-err{position:static;margin-top:6px;flex-basis:100%}
  .lp-card-art{height:170px}
  .lp-card-body h2{font-size:24px}
}