/* =========================================================
   SATSAMARKAND.UZ — Visual Enhancements v2
   Blue accent · Micro-interactions · Animations
   ========================================================= */

:root {
  --amber:      #0661de;
  --amber2:     #044fba;
  --amber3:     #3b82f6;
  --amber-glow: rgba(6,97,222,.28);
  --amber-pale: #eff6ff;

  /* ── SQUIRCLE RADIUS OVERRIDES ── */
  --rsm: 14px;
  --rlg: 28px;
  --rxl: 40px;
}

/* ── SQUIRCLE — ALL RECTANGULAR ELEMENTS ───────────────── */

/* Cards */
.card, .pcard, .scard, .wc, .why-card, .feat-card,
.uni-card, .blog-card, .result-card, .score-card,
.faq-item, .step-item, .mentor-card, .parent-card,
.info-card, .pkg-card, .pricing-card, .inner-link-card,
.mock-card, .tip-card, .pillar-card, .services-card,
[class*="-card"], [class*="card-"] {
  border-radius: 28px !important;
}

/* Sections / banners with background */
.cta-banner, .mock-banner, .urgency-banner,
.hero-badge, .slbl, .pillar-section-label,
.stat-box, .score-box, .tb, .tb-item,
.form-card, .form-wrap, .form-inner {
  border-radius: 20px !important;
}

/* Buttons — keep pill shape but use squircle for non-pill buttons */
.btnf, .btns, .btnw, .pbtn,
.btn-tg-kw, .btn-tg-hero, .boot-cta-primary,
.nenroll, .mob-enroll {
  border-radius: 40px !important;
}

/* Tags / badges / labels */
.tag, .blog-card-tag, .slbl, .course-tag,
.uni-badge, .score-tag, [class*="tag"],
[class*="badge"], [class*="label"] {
  border-radius: 999px !important;
}

/* Input fields & selects */
input, textarea, select,
.input, .field, .form-field,
input[type="text"], input[type="email"],
input[type="tel"], input[type="number"] {
  border-radius: 16px !important;
}

/* Nav dropdown — consistent style, prevent backdrop-filter bleed */
.dd, .nav-dropdown {
  border-radius: 20px !important;
  background: #ffffff !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow: 0 2px 8px rgba(0,0,0,.06), 0 12px 36px rgba(0,0,0,.14) !important;
  border: 1px solid rgba(0,0,0,.08) !important;
  list-style: none !important;
  padding: 6px 0 !important;
}
.dd li, .nav-dropdown li {
  list-style: none !important;
  list-style-type: none !important;
  padding: 0 !important;
}
.dd li::before, .dd li::marker,
.nav-dropdown li::before, .nav-dropdown li::marker {
  display: none !important;
  content: "" !important;
}
/* Extra specificity for browsers that ignore ::marker content override */
body > ul.dd,
body > ul.dd li {
  list-style: none !important;
  list-style-type: none !important;
  margin: 0 !important;
}
body > ul.dd li::marker {
  content: "" !important;
  display: none !important;
}
.dd li a {
  display: block !important;
  padding: 11px 20px !important;
  font-size: .9rem !important;
  font-weight: 500 !important;
  color: #1a202c !important;
  text-decoration: none !important;
  background: transparent !important;
  transition: background .15s, color .15s !important;
}
.dd li a:hover {
  background: #f0f4ff !important;
  color: var(--blue, #0661de) !important;
}
.dd li:not(:last-child) a {
  border-bottom: 1px solid rgba(0,0,0,.045) !important;
}
#mobnav {
  border-radius: 20px !important;
}

/* Floating widget items */
.fmitem {
  border-radius: 20px !important;
}

/* Images inside cards — soft squircle */
.uni-card img, .mentor-card img,
.blog-card img, .result-card img {
  border-radius: 16px !important;
}

/* Nav pill */
.nbar, nav {
  border-radius: 0 !important; /* nav bar stays full-width */
}

/* Mobile sticky bar */
.mob-sticky {
  border-radius: 20px 20px 0 0 !important;
}

/* ── GREEN PRIMARY CTAs ─────────────────────────────────── */
.nenroll,
.mob-enroll,
.btn-tg-hero,
.boot-cta-primary {
  background: linear-gradient(135deg, var(--amber), #044fba) !important;
  color: #fff !important;
  border: none !important;
  box-shadow: 0 6px 22px var(--amber-glow) !important;
}
.nenroll:hover,
.mob-enroll:hover,
.btn-tg-hero:hover,
.boot-cta-primary:hover {
  background: linear-gradient(135deg, var(--amber3), var(--amber)) !important;
  box-shadow: 0 10px 36px var(--amber-glow) !important;
  transform: translateY(-2px) scale(1.02) !important;
  color: #fff !important;
}

/* Pulse ring on primary hero CTA */
@keyframes _cta-pulse {
  0%,100% { box-shadow: 0 6px 22px var(--amber-glow), 0 0 0 0 var(--amber-glow); }
  55%      { box-shadow: 0 6px 22px var(--amber-glow), 0 0 0 10px transparent; }
}
.btn-tg-hero,
.boot-cta-primary {
  animation: _cta-pulse 2.8s ease-in-out infinite;
}
.btn-tg-hero:hover,
.boot-cta-primary:hover {
  animation: none;
}

/* Mobile sticky bar — hidden */
.mob-sticky {
  display: none !important;
}
@media (max-width: 640px) {
  body { padding-bottom: 0 !important; }
}

/* ── SECTION LABEL ACCENT DOT ───────────────────────────── */
.slbl::before,
.pillar-section-label::before {
  background: var(--amber) !important;
}

/* ── CARD HOVER LIFT ────────────────────────────────────── */
.pcard,
.scard,
.uni-card,
.why-card,
.wc,
.feat-card,
.step-item {
  transition: transform .22s cubic-bezier(.34,1.4,.64,1),
              box-shadow .22s ease,
              border-color .22s ease !important;
  will-change: transform;
}
.pcard:hover { transform: translateY(-7px) !important; box-shadow: 0 18px 50px rgba(0,0,0,.13) !important; }
.scard:hover { transform: translateY(-5px) !important; box-shadow: 0 12px 36px rgba(0,0,0,.11) !important; }
.uni-card:hover { transform: translateY(-6px) !important; }
.why-card:hover { transform: translateY(-5px) !important; box-shadow: 0 12px 32px rgba(0,0,0,.1) !important; }

/* ── NAV LINK ANIMATED UNDERLINE ────────────────────────── */
.nlinks a {
  position: relative;
  text-decoration: none !important;
}
.nlinks a::after {
  content: '';
  position: absolute;
  bottom: 0; left: 12px; right: 12px;
  height: 2px;
  background: var(--amber);
  border-radius: 2px;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .2s cubic-bezier(.4,0,.2,1);
}
.nlinks a:hover::after { transform: scaleX(1); }
.nlinks a.on::after   { transform: scaleX(1); background: var(--blue); }
.nlinks a.on          { border-bottom-color: transparent !important; }

/* ── HERO SUBTLE SHIMMER ────────────────────────────────── */
@keyframes _hero-shimmer {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
.hero {
  background: linear-gradient(135deg, #f8faff 0%, #eef4ff 35%, #f4f8ff 60%, #f8faff 100%) !important;
  background-size: 300% 300% !important;
  animation: _hero-shimmer 14s ease infinite !important;
}

/* ── FLOATING WIDGET ENTRANCE ───────────────────────────── */
@keyframes _widget-in {
  from { opacity: 0; transform: translateX(48px); }
  to   { opacity: 1; transform: translateX(0); }
}
.fwidget {
  animation: _widget-in .65s cubic-bezier(.34,1.45,.64,1) both;
  animation-delay: 1s;
}
.fmitem {
  transition: transform .2s cubic-bezier(.34,1.4,.64,1),
              box-shadow .2s ease !important;
}
.fmitem:hover {
  transform: translateX(-5px) translateY(-2px) !important;
  box-shadow: 0 10px 30px rgba(0,0,0,.14) !important;
}
.fmitem.fmcall .fmicon { background: var(--amber) !important; color: #fff !important; }

/* ── STATS — BRIGHT BLUE (matches button color) ─────────── */
.tb-num,
.stat-num,
.pillar-stat-num {
  background: linear-gradient(135deg, var(--amber), var(--amber3));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
/* Exception: stat-num inside dark sections stays white */
[style*="background:linear-gradient"][style*="#022049"] .stat-num,
[style*="background:linear-gradient"][style*="#010e24"] .stat-num,
.stat-bar .stat-num,
.mock-banner .stat-num {
  background: none !important;
  -webkit-text-fill-color: #fff !important;
  color: #fff !important;
}

/* ── BUTTONS — GENERAL POLISH ───────────────────────────── */
.btnf,
.btns,
.btnw,
.pbtn,
.btn-tg-kw {
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease !important;
}
.btnf:hover  { transform: translateY(-2px) !important; box-shadow: 0 8px 28px rgba(6,97,222,.28) !important; }
.btns:hover  { transform: translateY(-2px) !important; }
.btnw:hover  { transform: translateY(-2px) !important; }

/* ── FAQ ITEMS ──────────────────────────────────────────── */
.faq-item {
  transition: box-shadow .18s ease !important;
}
.faq-item:hover {
  box-shadow: 0 4px 20px rgba(0,0,0,.06) !important;
}

/* ── SCROLL REVEAL POLISH ───────────────────────────────── */
[data-anim]:not(.is-visible) {
  opacity: 0;
  transform: translateY(22px);
  transition: opacity .5s ease, transform .5s cubic-bezier(.16,1,.3,1) !important;
}
[data-anim].is-visible {
  opacity: 1;
  transform: translateY(0);
  transition: opacity .5s ease, transform .5s cubic-bezier(.16,1,.3,1) !important;
}

/* ── URGENCY BANNER PULSE ───────────────────────────────── */
.urgency-banner {
  background: linear-gradient(90deg, #022049, #0a3a7a, #022049) !important;
  background-size: 200% 100% !important;
  animation: _hero-shimmer 6s linear infinite !important;
}

/* ── LINK HOVER UNDERLINE ───────────────────────────────── */
.smore, .fbot a, .internal-link-item a {
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: border-color .15s ease, color .15s ease;
}
.smore:hover, .fbot a:hover {
  border-bottom-color: currentColor;
}

/* ── MENTOR & PARENTS SECTIONS — MOBILE RESPONSIVE ──────── */
@media (max-width: 760px) {
  .mentor-cards-grid {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }
  .parents-cards-grid {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
}
@media (max-width: 480px) {
  .mentor-cards-grid,
  .parents-cards-grid {
    gap: 10px !important;
  }
}
