/* ============================================================
   TEKNO EHLİYET — Global Görsel Yükseltme Katmanı (upgrade.css)
   2026-07-29 · Sadece görsel; HTML/PHP/layout değişmez.
   Mevcut kimlik: #4154f1 mavi + #012970 lacivert.
   ============================================================ */

:root{
  --u-brand:#4154f1;      --u-brand-600:#2f40db;  --u-brand-050:#eef1fe;
  --u-navy:#012970;       --u-navy-2:#0b3a8f;
  --u-cyan:#2db6fa;
  --u-bg:#eef2fb;         --u-surface:#ffffff;    --u-surface-2:#f6f8fe;
  --u-line:#e3e9f6;       --u-line-2:#eef2fb;
  --u-ink:#1a2340;        --u-ink-soft:#48526e;   --u-muted:#7a85a3;
  --u-ok:#0bb14e;         --u-ok-bg:#e6f7ec;
  --u-warn:#f68c09;       --u-warn-bg:#fef1de;
  --u-danger:#e9222c;     --u-danger-bg:#fdeaea;
  --u-gold:#f6b40a;
  --u-r-lg:18px; --u-r-md:14px; --u-r-sm:10px;
  --u-sh-1:0 1px 2px rgba(1,41,112,.06), 0 3px 10px rgba(1,41,112,.05);
  --u-sh-2:0 6px 18px rgba(1,41,112,.10), 0 14px 40px rgba(1,41,112,.08);
  --u-sh-brand:0 8px 22px rgba(65,84,241,.34);
  --u-grad:linear-gradient(135deg,#4154f1 0%,#5b6cff 52%,#2db6fa 125%);
  --u-grad-navy:linear-gradient(150deg,#012970 0%,#123a95 100%);
  --u-grad-gold:linear-gradient(135deg,#ffe08a,#f6b40a);
}

/* ---------- Zemin ---------- */
body{
  background:
    radial-gradient(1100px 480px at 82% -8%, #e2eafe 0%, transparent 60%),
    radial-gradient(820px 460px at -8% 6%, #e6f4fe 0%, transparent 55%),
    var(--u-bg) !important;
  color:var(--u-ink);
  -webkit-font-smoothing:antialiased;
}

/* ---------- Başlıklar ---------- */
h1,h2,h3,.section-header h2,.pricing-card-title{ color:var(--u-navy); letter-spacing:-.01em; }
.section-header p{ color:var(--u-navy) !important; font-weight:800 !important; }

/* ---------- Navbar / Header (cam efekti) ---------- */
#header.header, .header.fixed-top{
  background:rgba(255,255,255,.82) !important;
  -webkit-backdrop-filter:saturate(180%) blur(14px);
  backdrop-filter:saturate(180%) blur(14px);
  box-shadow:0 4px 24px rgba(1,41,112,.09);
  border-bottom:1px solid rgba(1,41,112,.06);
}
.navbar a, .navbar a:focus{ color:var(--u-ink-soft) !important; font-weight:700; border-radius:9px; transition:.2s; }
.navbar a:hover{ color:var(--u-brand) !important; background:var(--u-brand-050); }
.navbar .active, .navbar .active:focus{ color:var(--u-brand) !important; }
.logo span, .logo strong{ color:var(--u-navy) !important; }

/* ---------- Butonlar ---------- */
.btn{ border-radius:11px !important; font-weight:700 !important; transition:transform .15s ease, box-shadow .22s ease, filter .2s !important; letter-spacing:.1px; }
.btn:active{ transform:translateY(1px); }
.btn-lg{ border-radius:13px !important; }
.btn-sm{ border-radius:9px !important; }
.btn-primary{
  background:var(--u-grad) !important; border:none !important; color:#fff !important;
  box-shadow:var(--u-sh-brand) !important;
}
.btn-primary:hover{ filter:brightness(1.05); box-shadow:0 12px 30px rgba(65,84,241,.45) !important; }
.btn-primary:disabled,.btn-primary.disabled{ background:#aab4e8 !important; box-shadow:none !important; filter:none; }
.btn-success{ background:linear-gradient(135deg,#0bb14e,#3ad67e) !important; border:none !important; box-shadow:0 8px 20px rgba(11,177,78,.30) !important; }
.btn-danger{ background:linear-gradient(135deg,#e9222c,#ff5a5a) !important; border:none !important; box-shadow:0 8px 20px rgba(233,34,44,.28) !important; }
.btn-warning{ background:linear-gradient(135deg,#ffb020,#f68c09) !important; border:none !important; color:#5a3d00 !important; }
.btn-outline-success{ border:1.5px solid var(--u-ok) !important; color:var(--u-ok) !important; border-radius:11px !important; }
.btn-outline-success:hover{ background:var(--u-ok) !important; color:#fff !important; }
.btn-outline-primary{ border:1.5px solid var(--u-brand) !important; color:var(--u-brand) !important; }
.btn-outline-primary:hover{ background:var(--u-brand) !important; color:#fff !important; }
.btn-group>.btn{ box-shadow:none !important; }

/* ---------- Kartlar ---------- */
.card{
  border:1px solid var(--u-line) !important; border-radius:var(--u-r-lg) !important;
  box-shadow:var(--u-sh-1) !important; overflow:hidden;
  transition:transform .28s ease, box-shadow .28s ease;
}
.card:hover{ box-shadow:var(--u-sh-2) !important; }
.card-header{ background:linear-gradient(180deg,#fff,var(--u-surface-2)) !important; border-bottom:1px solid var(--u-line-2) !important; font-weight:800; color:var(--u-navy); }
.card-primary.card-outline{ border-top:3px solid var(--u-brand) !important; }
.shadow, .shadow-sm, .shadow-lg{ box-shadow:var(--u-sh-2) !important; }
.border.rounded, .rounded-3{ border-radius:var(--u-r-lg) !important; border-color:var(--u-line) !important; }

/* ---------- İstatistik kutuları (service-box) ---------- */
.services .service-box{
  background:var(--u-surface) !important; border:1px solid var(--u-line) !important;
  border-radius:var(--u-r-md) !important; box-shadow:var(--u-sh-1) !important;
  padding:18px 12px !important; position:relative; overflow:hidden;
  transition:transform .26s ease, box-shadow .26s ease;
}
.services .service-box:hover{ transform:translateY(-4px); box-shadow:var(--u-sh-2) !important; }
.services .service-box::after{ content:""; position:absolute; left:0; bottom:0; height:4px; width:100%; }
.services .service-box h3, .services .service-box h3 a{ color:var(--u-navy) !important; font-weight:800 !important; }
.services .service-box i{ font-size:26px; }
.service-box.blue{ border-left:none !important; } .service-box.blue::after{ background:var(--u-brand); } .service-box.blue i{ color:var(--u-brand) !important; }
.service-box.orange{ border-left:none !important; } .service-box.orange::after{ background:var(--u-warn); } .service-box.orange i{ color:var(--u-warn) !important; }
.service-box.green{ border-left:none !important; } .service-box.green::after{ background:var(--u-ok); } .service-box.green i{ color:var(--u-ok) !important; }

/* ---------- Haber kartları (post-box) ---------- */
.post-box{
  background:var(--u-surface) !important; border:1px solid var(--u-line) !important;
  border-radius:var(--u-r-md) !important; box-shadow:var(--u-sh-1) !important; overflow:hidden;
  transition:transform .26s ease, box-shadow .26s ease;
}
.post-box:hover{ transform:translateY(-4px); box-shadow:var(--u-sh-2) !important; }
.post-box .post-title, .post-box h3{ color:var(--u-navy) !important; font-weight:800 !important; }
.post-box img{ transition:transform .5s ease; }
.post-box:hover img{ transform:scale(1.05); }

/* ---------- bd-callout ---------- */
.bd-callout{ border-radius:var(--u-r-md) !important; border:1px solid var(--u-line) !important; background:var(--u-surface) !important; box-shadow:var(--u-sh-1); }
.bd-callout-info{ border-left:.28rem solid var(--u-cyan) !important; }

/* ---------- Formlar ---------- */
.form-control, .form-select{
  border:1.5px solid var(--u-line) !important; border-radius:11px !important;
  background:var(--u-surface-2) !important; color:var(--u-ink) !important;
  transition:border-color .2s, box-shadow .2s, background .2s !important;
  padding:.6rem .8rem;
}
.form-control:focus, .form-select:focus{
  border-color:var(--u-brand) !important; background:#fff !important;
  box-shadow:0 0 0 4px var(--u-brand-050) !important;
}
.input-group-addon, .input-group-text{ border-radius:11px 0 0 11px; border:1.5px solid var(--u-line); background:var(--u-surface-2); color:var(--u-muted); }

/* ---------- Rozetler ---------- */
.badge{ border-radius:999px !important; font-weight:700; letter-spacing:.2px; padding:.4em .7em; }
.bg-warning{ background:var(--u-gold) !important; color:#5a3d00 !important; }
.bg-success{ background:var(--u-ok) !important; }
.bg-danger{ background:var(--u-danger) !important; }

/* ---------- Alert / list-group ---------- */
.alert{ border-radius:var(--u-r-md) !important; border:1px solid transparent; }
.alert-success{ background:var(--u-ok-bg) !important; color:#0a6d38 !important; border-color:#c2e7d2 !important; }
.alert-danger{ background:var(--u-danger-bg) !important; color:#a11d24 !important; border-color:#f2c9cc !important; }
.alert-warning{ background:var(--u-warn-bg) !important; color:#8a5a00 !important; border-color:#f3ddb0 !important; }
.list-group-item{ border-color:var(--u-line-2) !important; }
.list-group-item-info{ background:var(--u-brand-050) !important; color:var(--u-brand) !important; border-color:#d6dffb !important; font-weight:700; border-radius:10px !important; }
.list-group-item.text-start:hover{ background:var(--u-surface-2) !important; }

/* ---------- VIP fiyat kartı (accont.php sepet) ---------- */
.pricing-card-title{ font-weight:800 !important; }
.card .card-header .fa-medal, .fa-award, .fa-trophy{ filter:drop-shadow(0 3px 8px rgba(246,180,10,.5)); }

/* ---------- Sekme/timer/misc ---------- */
.back-to-top{ background:var(--u-grad) !important; box-shadow:var(--u-sh-brand) !important; border-radius:12px !important; }
hr{ border-color:var(--u-line) !important; opacity:.7; }
a{ transition:color .18s; }

/* ---------- Giriş sayfası özel (login.php mavi zemin) ---------- */
body:has(.card.shadow-lg){ } /* dokunma güvenli */

/* ============================================================
   Animasyonlar (JS ile tetiklenen reveal + genel)
   ============================================================ */
@keyframes uFadeUp{ from{opacity:0; transform:translateY(16px);} to{opacity:1; transform:none;} }
@keyframes uPop{ from{opacity:0; transform:scale(.96);} to{opacity:1; transform:none;} }
@keyframes uShine{ 0%{background-position:200% 0;} 100%{background-position:-200% 0;} }

.u-reveal{ opacity:0; }
.u-reveal.u-in{ animation:uFadeUp .6s cubic-bezier(.2,.7,.2,1) forwards; }
.u-reveal.d1.u-in{ animation-delay:.06s; }
.u-reveal.d2.u-in{ animation-delay:.12s; }
.u-reveal.d3.u-in{ animation-delay:.18s; }

/* buton ripple (JS ekler) */
.u-ripple{ position:relative; overflow:hidden; }
.u-ripple > .u-rip{ position:absolute; border-radius:50%; transform:scale(0); background:rgba(255,255,255,.5); animation:uRip .6s ease-out; pointer-events:none; }
@keyframes uRip{ to{ transform:scale(3); opacity:0; } }

/* şık scrollbar */
*{ scrollbar-color:#b9c4e8 transparent; }
::-webkit-scrollbar{ width:11px; height:11px; }
::-webkit-scrollbar-thumb{ background:#b9c4e8; border-radius:10px; border:3px solid transparent; background-clip:content-box; }
::-webkit-scrollbar-thumb:hover{ background:#8f9ede; background-clip:content-box; }

@media (prefers-reduced-motion: reduce){
  *{ animation:none !important; transition:none !important; }
  .u-reveal{ opacity:1 !important; }
}

/* ============================================================
   Ana Sayfa (index.php) — cesur cila (yalnızca CSS)
   ============================================================ */
.section-header h2{ position:relative; display:inline-block; }
.section-header h2::after{ content:""; display:block; width:58px; height:4px; margin:12px auto 0; border-radius:3px; background:var(--u-grad); }
.section-header p{ color:var(--u-brand) !important; }

/* avantaj: sınıf teklif kartları */
.avantaj .card{ text-align:center; padding:10px 8px; }
.avantaj .card-icon{ width:76px; height:76px; margin:16px auto 8px; border-radius:22px; display:grid; place-items:center;
  background:var(--u-grad); box-shadow:var(--u-sh-brand); }
.avantaj .card-icon i{ font-size:32px; color:#fff !important; }
.avantaj .small-title p{ color:var(--u-navy); font-weight:800; font-size:17px; margin-bottom:6px; }
.avantaj .card-text p{ color:var(--u-ink-soft); }

/* hero carousel */
#myCarousel{ border-radius:var(--u-r-lg) !important; box-shadow:var(--u-sh-2); overflow:hidden; border:1px solid var(--u-line); }
#myCarousel .item img{ border:none !important; padding:0 !important; border-radius:0 !important; }
#myCarousel .carousel-caption{ background:linear-gradient(0deg, rgba(1,25,64,.88), rgba(1,25,64,0)); padding:28px 22px 20px; left:0; right:0; bottom:0; text-align:left; }
#myCarousel .carousel-caption h3{ color:#fff; font-weight:800; }
#myCarousel .carousel-caption p{ color:#dbe6ff; }
.carousel-control{ width:46px; height:46px; border-radius:50%; background:rgba(255,255,255,.92) !important;
  color:var(--u-brand) !important; display:grid; place-items:center; top:50%; transform:translateY(-50%);
  box-shadow:var(--u-sh-1); opacity:1; text-shadow:none; }
.carousel-control .fas{ font-size:16px; }

/* counts */
#counts.counts{ padding-top:14px; }

/* ============================================================
   MOBİL düzeltmeler — header/menü kayması (PC etkilenmez)
   ============================================================ */
/* yatay taşmayı engelle (kaymaların baş sebebi) */
html, body{ overflow-x:hidden; max-width:100%; }

@media (max-width: 991px){
  /* fixed header: mobilde blur YOK — yoksa .navbar-mobile fixed overlay'i header'a hapsolur (hamburger açılmaz) */
  #header.header, .header.fixed-top{
    background:#ffffff !important;
    -webkit-backdrop-filter:none !important; backdrop-filter:none !important;
    padding:10px 0 !important;
  }
  /* mobil menü overlay'i her şeyin üstünde ve tam ekran olsun */
  .navbar-mobile{ z-index:9999 !important; }
  /* logonun bozuk 150px genişliğini düzelt → orantılı */
  .header .logo img{ max-height:40px !important; width:auto !important; height:auto !important; }
  .header .container-fluid{ padding-left:14px !important; padding-right:14px !important; }
  .logo span.mobiltext{ font-size:15px !important; }
  /* mobil açılır menü paneli: yeni tasarımla uyumlu, net */
  .navbar-mobile ul{ border-radius:14px !important; box-shadow:0 24px 60px rgba(1,25,64,.45) !important; }
  .navbar-mobile a{ border-radius:9px !important; margin:2px 8px !important; }
  .navbar-mobile a:hover, .navbar-mobile .active{ background:var(--u-brand-050) !important; }
  /* mobil link hover arka planı kaymasın */
  .navbar a{ background:transparent !important; }
  /* mobil alt giriş/üye şeridi */
  .list-group-horizontal .list-group-item{ border-radius:10px !important; }
}

/* ============================================================
   Lacivert/mavi alanlardaki METİN linkleri beyaz (stilli butonlar hariç)
   ============================================================ */
.u-hero a:not(.btn), .hx a:not(.b-gold):not(.b-ghost), .sx a:not(.sx-b1):not(.sx-b2),
.application .card a, .ftx-top a, .ftx-bottom a{ color:#ffffff !important; }
.u-hero a:not(.btn):hover, .hx a:not(.b-gold):not(.b-ghost):hover,
.application .card a:hover, .ftx-top a:hover, .ftx-bottom a:hover{ color:#ffffff !important; opacity:.85; }

/* Footer: DB'den gelen copyright/iletişim metni koyu inline renk (<font color>) taşıyor → zorla açık */
.ftx-bottom, .ftx-bottom *{ color:#e8eefb !important; }
.ftx-contact, .ftx-contact *{ color:#cdd8ee !important; }
.ftx-bottom a, .ftx-contact a{ color:#ffffff !important; }

/* ============================================================
   PREMIUM MENÜ (header / navbar)
   ============================================================ */
#header .logo{ gap:8px; }
#header .logo img{ transition:transform .3s ease; }
#header .logo:hover img{ transform:scale(1.04); }

@media (min-width:992px){
  .navbar ul{ gap:4px; align-items:center; }
  .navbar > ul > li > .nav-link{
    padding:9px 15px !important; border-radius:11px; position:relative;
    color:var(--u-ink-soft) !important; font-weight:700 !important; font-size:15px !important;
  }
  .navbar > ul > li > .nav-link:hover{ background:var(--u-brand-050) !important; color:var(--u-brand) !important; }
  .navbar > ul > li > .nav-link.active{ color:var(--u-brand) !important; }
  .navbar > ul > li > .nav-link.active::after{ content:""; position:absolute; left:15px; right:15px; bottom:2px; height:2px; border-radius:2px; background:var(--u-grad); }
}

/* CTA: Üye Ol */
.nav-cta{ background:var(--u-grad) !important; color:#fff !important; padding:10px 20px !important; border-radius:12px !important; font-weight:800 !important; box-shadow:var(--u-sh-brand); margin-left:6px; transition:transform .18s ease, box-shadow .22s ease !important; }
.nav-cta:hover{ color:#fff !important; transform:translateY(-2px); box-shadow:0 12px 28px rgba(65,84,241,.5) !important; background:var(--u-grad) !important; }
.nav-login{ color:var(--u-ink-soft) !important; font-weight:700 !important; }
.nav-login:hover{ color:var(--u-brand) !important; background:var(--u-brand-050) !important; }

/* Üyeliğim / VIP rozeti */
.navbar a[href*="page=cart"]{ background:linear-gradient(135deg,#fff5d6,#ffe9a8) !important; border:1px solid #f0d68a !important; border-radius:999px !important; padding:6px 14px !important; }
.navbar a[href*="page=cart"] .text-danger{ color:#9a6b00 !important; }
.navbar a[href="home.php"].text-success{ color:var(--u-ok) !important; }

/* mobil menü premium */
@media (max-width:991px){
  /* açılır menü: OVERLAY'in KENDİSİ kaydırılır, liste normal akışta → tüm öğeler (Çıkış dahil) erişilir */
  .navbar-mobile{ overflow-y:auto !important; -webkit-overflow-scrolling:touch !important; overscroll-behavior:contain; padding-bottom:30px; }
  .navbar-mobile ul{
    position:static !important; display:block !important;
    height:auto !important; max-height:none !important;
    margin:70px 10px 24px !important; padding:10px 8px 16px !important;
    background:#fff !important; border-radius:16px !important;
    box-shadow:0 24px 60px rgba(1,25,64,.42) !important;
  }
  .navbar-mobile li{ display:block !important; }
  .navbar-mobile li > a, .navbar-mobile .nav-link{ font-size:14px !important; padding:9px 14px !important; }
  .nav-cta{ margin:10px !important; justify-content:center; }
  .navbar-mobile .nav-cta, .navbar-mobile .nav-cta:hover{ color:#fff !important; transform:none; }
}

/* ============================================================
   Mobil Alt Navigasyon (uygulama hissi) — bottom nav
   ============================================================ */
.u-bottomnav{ display:none; }
@media (max-width:991px){
  .u-bottomnav{
    display:flex; position:fixed; left:0; right:0; bottom:0; z-index:1200;
    background:rgba(255,255,255,.97); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
    border-top:1px solid #e3e9f6; box-shadow:0 -6px 24px rgba(1,41,112,.10);
    padding:7px 4px calc(7px + env(safe-area-inset-bottom, 0px)); justify-content:space-around; align-items:flex-end;
  }
  .u-bottomnav a{ flex:1; min-width:0; display:flex; flex-direction:column; align-items:center; gap:3px;
    color:#8592ad; font-size:10px; font-weight:800; text-decoration:none; padding:3px 2px; border-radius:12px; transition:.2s; }
  .u-bottomnav a i{ font-size:19px; line-height:1; }
  .u-bottomnav a span{ white-space:nowrap; }
  .u-bottomnav a.on{ color:#4154f1 !important; }
  .u-bottomnav a.u-bn-mid i{ background:linear-gradient(135deg,#4154f1,#2db6fa); width:50px; height:50px; border-radius:17px;
    display:grid; place-items:center; color:#fff !important; margin-top:-22px; box-shadow:0 10px 22px rgba(65,84,241,.5); font-size:21px; border:3px solid #fff; }
  .u-bottomnav a.u-bn-mid span{ color:#4154f1; margin-top:1px; }
  /* alt nav arkasında içerik kalmasın */
  body{ padding-bottom:74px !important; }
  /* eski template'in back-to-top butonu alt navla çakışmasın */
  .back-to-top{ bottom:86px !important; }
}

/* ============================================================
   HEADER = footer lacivert rengi + beyaz logo (2026-07-30)
   ============================================================ */
#header.header, .header.fixed-top, .header.header-scrolled{
  background:linear-gradient(160deg,#012970 0%,#001b52 100%) !important;
  -webkit-backdrop-filter:none !important; backdrop-filter:none !important;
  box-shadow:0 4px 22px rgba(1,20,60,.35) !important;
  border-bottom:1px solid rgba(255,255,255,.08) !important;
}
#header .logo img{ filter:brightness(0) invert(1) !important; }
#header .logo span, #header .logo strong, #header .mobiltext{ color:#fff !important; }
#header .navbar-text strong{ color:#eaf1ff !important; }
/* masaüstü nav linkleri açık renk */
.navbar a, .navbar a:focus, .navbar > ul > li > .nav-link{ color:#d7e3f7 !important; }
.navbar a:hover, .navbar > ul > li > .nav-link:hover{ color:#fff !important; background:rgba(255,255,255,.12) !important; }
.navbar .active, .navbar .active:focus, .navbar > ul > li > .nav-link.active{ color:#fff !important; }
.navbar > ul > li > .nav-link.active::after{ background:linear-gradient(90deg,#ffd24d,#2db6fa) !important; }
.navbar a.text-danger{ color:#ff9aa2 !important; }
.navbar a.text-success{ color:#8ee6b0 !important; }
.nav-login{ color:#d7e3f7 !important; }
.nav-login:hover{ color:#fff !important; background:rgba(255,255,255,.12) !important; }
.mobile-nav-toggle{ color:#fff !important; }
/* mobil header de lacivert */
@media (max-width:991px){
  #header.header, .header.fixed-top{ background:linear-gradient(160deg,#012970,#001b52) !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important; }
}
/* mobil AÇILIR menü paneli beyaz → linkleri koyu tut (okunur) */
.navbar-mobile a{ color:#012970 !important; background:transparent !important; }
.navbar-mobile a:hover, .navbar-mobile .active{ color:#4154f1 !important; background:#eef1fe !important; }
/* 2026-07-30: mobil açılır menüde TÜM yazıları okunur yap (beyaz zemin).
   YÜKSEK ÖZGÜLLÜK: '.navbar > ul > li > .nav-link' (0,2,2) açık-mavi kuralını yenmek için
   '.navbar.navbar-mobile ...' zinciri kullanıldı. */
.navbar-mobile ul{ background:#fff !important; }
.navbar.navbar-mobile > ul > li > a,
.navbar.navbar-mobile > ul > li > .nav-link,
.navbar.navbar-mobile ul li a,
.navbar.navbar-mobile ul li .nav-link,
.navbar.navbar-mobile ul li a strong,
.navbar.navbar-mobile ul li a small,
.navbar.navbar-mobile ul li a .badge{ color:#012970 !important; }
.navbar.navbar-mobile ul li a.text-danger,
.navbar.navbar-mobile ul li a.text-danger strong,
.navbar.navbar-mobile ul li a .text-danger{ color:#e02435 !important; }
.navbar.navbar-mobile ul li a .text-success{ color:#0b8b43 !important; }
.navbar.navbar-mobile ul li a .text-warning{ color:#b07a00 !important; }
.navbar.navbar-mobile ul li a:hover,
.navbar.navbar-mobile ul li a:hover *{ color:#4154f1 !important; }

/* 2026-07-30: erisilebilirlik + cila */
:focus-visible{ outline:3px solid rgba(65,84,241,.55) !important; outline-offset:2px; border-radius:6px; }
html{ scroll-behavior:smooth; }
.gtile:focus-visible, .qa a:focus-visible, .sb-item:focus-visible{ outline-offset:3px; }