:root {
  --mo-bg: #f3f4f6;
  --mo-card: #ffffff;
  --mo-text: #101827;
  --mo-muted: #667085;
  --mo-green: #0b6b37;
  --mo-green-2: #149254;
  --mo-border: rgba(16,24,39,.08);
}
body {
  background:
    radial-gradient(circle at 8% 10%, rgba(20,146,84,.08), transparent 30%),
    radial-gradient(circle at 92% 88%, rgba(240,139,39,.07), transparent 28%),
    var(--mo-bg);
  color: var(--mo-text);
}
.mo-navbar {
  background: linear-gradient(90deg, #0a5f31, #0f7a3f);
  border-bottom: 1px solid rgba(255,255,255,.12);
}
.lang-label { color: rgba(255,255,255,.92); font-size:.78rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em; }
.lang-switcher { display:inline-flex; gap:.25rem; padding:.2rem; border-radius:999px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12); }
.lang-switch-link { min-width:38px; height:30px; padding:0 .55rem; border-radius:999px; display:inline-flex; align-items:center; justify-content:center; color:rgba(255,255,255,.9); text-decoration:none; font-weight:800; font-size:.8rem; }
.lang-switch-link:hover { color:#fff; background:rgba(255,255,255,.08); text-decoration:none; }
.lang-switch-link.active { background:#fff; color:#0a5f31; box-shadow:0 2px 8px rgba(0,0,0,.15); }
.hero { background: linear-gradient(160deg, #ffffff 0%, #f7fff9 50%, #fbfdff 100%); border:1px solid var(--mo-border); border-radius:24px; box-shadow:0 18px 45px rgba(15,23,42,.06); }
.mo-card { background: var(--mo-card); border:1px solid var(--mo-border); border-radius:18px; box-shadow: 0 8px 24px rgba(15,23,42,.04); }
.section-title { font-weight: 900; letter-spacing: -.02em; }
.section-sub { color: var(--mo-muted); }
.hero-copy { color:#5f6b7a; line-height:1.55; }
.hero-copy-main { font-size:1.04rem; font-weight:600; }
.hero-copy-sub { font-size:1rem; font-weight:600; color:#667487; }
.hero-copy-stack { display:grid; gap:.75rem; max-width: 60ch; }
.hero-copy-stack .hero-copy {
  padding:.9rem 1rem;
  border-radius:14px;
  background:linear-gradient(180deg,#fff,#fafdfb);
  border:1px solid rgba(15,23,42,.06);
  box-shadow:0 8px 22px rgba(15,23,42,.03);
}
.cta-btn { border-radius:14px; padding:.75rem 1rem; font-weight:800; }
.platform-chips { display:flex; flex-wrap:wrap; gap:.65rem; }
.platform-chip { display:inline-grid; grid-template-columns:24px auto; grid-template-rows:auto auto; column-gap:.55rem; row-gap:.05rem; align-items:center; padding:.55rem .75rem; border-radius:14px; border:1px solid var(--mo-border); background:linear-gradient(180deg,#fff,#f8fafc); color:#0f172a; font-weight:800; line-height:1.05; min-width:150px; text-decoration:none; transition:transform .12s ease, box-shadow .12s ease; }
.platform-chip:hover { transform:translateY(-1px); box-shadow:0 8px 20px rgba(15,23,42,.08); color:#0f172a; text-decoration:none; }
.platform-chip i { grid-row:1 / span 2; width:24px; height:24px; display:inline-flex; align-items:center; justify-content:center; border-radius:999px; font-size:.9rem; }
.platform-chip small { display:block; color:#64748b; font-size:.68rem; font-weight:700; }
.platform-chip-web i { background:#ecfdf3; color:#166534; }
.platform-chip-ios i { background:#eef2ff; color:#312e81; }
.platform-chip-android i { background:#ecfdf5; color:#166534; }
.platform-chip-disabled { opacity:.9; cursor:default; pointer-events:none; }
.platform-chip-disabled small { color:#b45309; }
.platform-chip-huawei { border-color:#fecaca; background:linear-gradient(180deg,#fff7ed,#fff); }
.platform-chip-huawei i { background:#fee2e2; color:#b91c1c; }
.platform-chip-huawei small { color:#b45309; }
.hero-image { width:100%; max-width:520px; height:auto; border-radius:22px; display:block; margin-inline:auto; }
.feature-panel { background: radial-gradient(circle at 90% 8%, rgba(20,146,84,.04), transparent 36%), #fff; }
.feature-head { display:flex; gap:.9rem; }
.feature-head-icon { width:42px; height:42px; border-radius:13px; display:inline-flex; align-items:center; justify-content:center; background:#dcfce7; color:#166534; border:1px solid #bbf7d0; flex-shrink:0; }
.feature-head-icon-blue { background:#dbeafe; color:#1d4ed8; border-color:#bfdbfe; }
.timeline-modern { position:relative; padding-left:1.35rem; }
.timeline-modern::before { content:''; position:absolute; left:.45rem; top:.5rem; bottom:.6rem; width:2px; background:linear-gradient(#bbf7d0,#dbeafe); }
.timeline-item { position:relative; padding-left:1.2rem; margin-bottom:.85rem; }
.timeline-item::before { content:''; position:absolute; left:.02rem; top:.75rem; width:.7rem; height:.7rem; border-radius:999px; border:2px solid #15803d; background:#fff; }
.timeline-item.current::before { border-color:#b91c1c; box-shadow:0 0 0 4px rgba(185,28,28,.12); }
.timeline-card { border:1px solid rgba(15,23,42,.07); border-radius:14px; background:rgba(248,250,252,.85); padding:.85rem .9rem; }
.timeline-step { display:inline-flex; align-items:center; padding:.22rem .55rem; border-radius:999px; background:#fff; border:1px solid rgba(15,23,42,.08); color:#475569; font-size:.72rem; font-weight:800; margin-bottom:.35rem; }
.feature-list { display:grid; gap:.8rem; }
.feature-item { display:grid; grid-template-columns:42px 1fr; gap:.85rem; padding:.85rem; border:1px solid rgba(15,23,42,.07); border-radius:14px; background:linear-gradient(180deg,#fff,#fafbfd); }
.feature-item-icon { width:42px; height:42px; border-radius:12px; display:inline-flex; align-items:center; justify-content:center; background:#0f172a08; border:1px solid rgba(15,23,42,.07); color:#1e293b; }
.feature-item-title { font-weight:900; margin-bottom:.15rem; }
.feature-item-text { color:#64748b; font-weight:600; line-height:1.4; }
.compare-card img { width:100%; aspect-ratio:1/1; object-fit:cover; border-radius:14px; }
.compare-card.compare-card-muted { opacity:.82; background:linear-gradient(180deg,#fcfcfd,#f8fafc); }
.compare-card.compare-card-muted img { filter:saturate(.75) brightness(.97); }
.compare-badge { display:inline-block; padding:.25rem .6rem; border-radius:999px; font-size:.75rem; font-weight:800; }
.compare-badge.old { background:#eef2f7; color:#475467; }
.compare-badge.new { background:#dcfce7; color:#166534; }
.compare-badge.football { background:#dbeafe; color:#1d4ed8; }
.compare-note-pill { display:inline-flex; align-items:center; gap:.45rem; margin-top:.4rem; padding:.45rem .7rem; border-radius:999px; border:1px solid rgba(15,23,42,.08); background:#f8fafc; color:#334155; font-size:.86rem; font-weight:700; line-height:1.2; }
.baskan-tech-logo { width:28px; height:28px; object-fit:contain; border-radius:8px; border:1px solid rgba(15,23,42,.08); background:#fff; padding:2px; }
.mo-footer { background: linear-gradient(160deg, #0b1630, #111827); color:#fff; border-top:1px solid rgba(255,255,255,.08); }
.mo-footer a { color:#f8fbff; text-decoration:none; }
.mo-footer a:hover { text-decoration:underline; }
.footer-brand { display:flex; align-items:center; gap:.75rem; }
.footer-brand-logo { width:42px; height:42px; border-radius:12px; object-fit:cover; border:1px solid rgba(255,255,255,.14); background:rgba(255,255,255,.06); }
.footer-text { color:rgba(255,255,255,.9); }
.footer-title { color:#fff; letter-spacing:.04em; font-size:.95rem; font-weight:900; }
.footer-credit { color:rgba(255,255,255,.98); font-weight:700; }
.footer-badges { display:flex; flex-wrap:wrap; gap:.5rem; margin-top:.5rem; }
.footer-pill { display:inline-flex; align-items:center; gap:.35rem; padding:.35rem .65rem; border-radius:999px; border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.05); color:rgba(255,255,255,.96); font-size:.78rem; font-weight:700; }
.footer-pill small { font-size:.7rem; opacity:.9; }
.footer-pill-soon { border-color: rgba(251,191,36,.25); }
.legal-content h2 { font-size:1.05rem; font-weight:800; margin-top:1.25rem; }
.legal-content ul { padding-left:1.2rem; }
.legal-content li { margin-bottom:.35rem; }
.install-sheet-backdrop { position:fixed; inset:0; background:rgba(2,6,23,.35); z-index:1080; display:flex; align-items:flex-end; justify-content:center; padding:.9rem; }
.install-sheet { width:min(520px,100%); background:#fff; border:1px solid rgba(15,23,42,.08); border-radius:18px; box-shadow:0 24px 48px rgba(15,23,42,.2); padding:.55rem .85rem .85rem; }
.install-sheet-handle { width:46px; height:5px; border-radius:999px; background:#cbd5e1; margin:.15rem auto .65rem; }
.install-sheet-head { display:grid; grid-template-columns:44px 1fr 34px; gap:.7rem; align-items:start; }
.install-sheet-icon { width:44px; height:44px; border-radius:12px; display:inline-flex; align-items:center; justify-content:center; border:1px solid rgba(15,23,42,.08); background:#f8fafc; color:#0f172a; font-size:1rem; }
.install-sheet-icon.ios { background:#eef2ff; color:#312e81; border-color:#c7d2fe; }
.install-sheet-icon.android { background:#ecfdf5; color:#166534; border-color:#bbf7d0; }
.install-sheet-title { color:#0f172a; font-size:.98rem; font-weight:800; line-height:1.2; margin-top:.08rem; }
.install-sheet-sub { margin-top:.25rem; color:#64748b; font-size:.88rem; line-height:1.35; font-weight:600; }
.install-sheet-close { width:34px; height:34px; border-radius:999px; border:1px solid rgba(15,23,42,.08); background:#fff; color:#475569; }
.install-sheet-actions { display:flex; justify-content:flex-end; gap:.5rem; margin-top:.75rem; }
@media (max-width: 768px) {
  .lang-label { display:none; }
  .platform-chip { min-width:132px; }
  .hero { border-radius:18px; }
  .hero-image { max-width:100%; border-radius:18px; }
  .hero-copy-stack { gap:.55rem; max-width: 100%; }
  .hero-copy-stack .hero-copy { padding:.75rem .8rem; border-radius:12px; }
  .install-sheet { border-radius:16px; padding:.5rem .7rem .75rem; }
  .install-sheet-actions .btn { flex:1; }
  .feature-item { grid-template-columns:38px 1fr; gap:.7rem; padding:.75rem; }
  .feature-item-icon { width:38px; height:38px; border-radius:11px; font-size:.9rem; }
}
