/* ═══════════════════════════════════════════════════
   İRESA SİGORTA — RESPONSIVE.CSS
   ═══════════════════════════════════════════════════ */

html, body { max-width: 100%; overflow-x: clip; }
.bg-white  { background: var(--c-card) !important; }
.bg-light  { background: var(--c-surface) !important; }

/* ──────────────────── TABLET (≤ 991px) ───────────────────── */
@media (max-width: 991px) {
  /* Hero */
  .page-hero         { padding: 70px 0 52px; }
  .page-hero h1      { font-size: 2rem; }
  .hero-3d-wrap      { height: 360px; }
  .badge-top-right,
  .badge-bottom-left { display: none; }

  /* Sections */
  section.py-5       { padding-top: 2.8rem !important; padding-bottom: 2.8rem !important; }

  /* Cards spacing */
  .row.g-4           { --bs-gutter-x: 1rem; --bs-gutter-y: 1rem; }

  /* Stats */
  .num-band .n       { font-size: 2.4rem; }

  /* Animations: reduce stagger */
  .test-wrap, .partner-wrap, .val-card-wrap { animation-delay: 0ms !important; }
}

/* ──────────────────── MOBILE (≤ 767px) ───────────────────── */
@media (max-width: 767px) {
  /* Typography */
  .grad-heading          { font-size: clamp(1.5rem, 5vw, 2rem); }
  h2.grad-heading        { font-size: clamp(1.4rem, 5vw, 1.9rem); }
  .page-hero h1          { font-size: 1.75rem; }

  /* Footer */
  .footer                { text-align: center; }
  .footer .social-links  { justify-content: center; }
  .footer-contact-item   { justify-content: center; }
  .footer-nav            { display: flex; flex-direction: column; align-items: center; }

  /* Page hero */
  .page-hero             { padding: 55px 0 44px; }
  .hero-3d-wrap          { height: 280px; }

  /* Hero badges */
  .hero-badge            { padding: 8px 12px; }
  .hb-title              { font-size: 12px; }
  .hb-sub                { display: none; }

  /* Stats band */
  .big-stat-num          { font-size: 3.5rem; }
  .num-band .n           { font-size: 2rem; }
  .num-band              { padding: 36px 0; }

  /* Buttons */
  .btn-grad, .btn-outline-grad { font-size: 13.5px; padding: 11px 22px; }

  /* Partner cards */
  .filter-wrap           { width: 100%; justify-content: center; flex-wrap: wrap; }
  .partner-card          { min-height: 100px !important; }

  /* Team cards */
  .team-img              { height: 160px; }

  /* Video / iframe embeds */
  .spotlight-video-wrap  { border-radius: 12px; }
  iframe                 { border-radius: 10px; }

  /* Navbar */
  .navbar                { padding: 9px 0; }
  .navbar-brand .brand-name { font-size: 16px; }
  .navbar-logo           { width: 36px; height: 36px; }

  /* Why items */
  .why-item              { flex-direction: row; align-items: flex-start; gap: 12px; }

  /* Toast notifications */
  .toast-notif           { right: 12px; left: 12px; max-width: unset; }
}

/* ──────────────────── SMALL MOBILE (≤ 575px) ───────────────────── */
@media (max-width: 575px) {
  /* Hide decorative elements */
  .hero-wave             { display: none; }
  .hero-trust-sep        { display: none; }

  /* Tags & labels */
  .section-tag           { font-size: 10px; padding: 5px 12px; letter-spacing: 1px; }

  /* Trust row on hero */
  .hero-trust-item       { font-size: 12px; }
  .hero-trust-num        { font-size: 1.3rem; }

  /* Page hero */
  .page-hero             { padding: 48px 0 36px; }
  .page-hero p           { font-size: 14px; }

  /* Sections */
  section.py-5           { padding-top: 2.2rem !important; padding-bottom: 2.2rem !important; }

  /* Grid: 1 col on small screens */
  .col-6.col-md-4.col-lg-3.partner-wrap { width: 50%; }

  /* Buttons full-width on very small */
  .hero-cta-wrap .btn-grad,
  .hero-cta-wrap .btn-outline-grad { width: 100%; justify-content: center; }

  /* Sketchfab / iframe */
  .hero-3d-wrap          { height: 240px; }

  /* Big stat */
  .big-stat              { padding: 28px 20px; }
  .big-stat-num          { font-size: 3rem; }

  /* Value cards stacked */
  .val-card-wrap, .team-wrap { animation: none !important; opacity: 1 !important; transform: none !important; }

  /* Why section: full width */
  .why-item              { padding: 14px; }
}

/* ──────────────────── LANDSCAPE MOBILE ───────────────────── */
@media (max-height: 500px) and (orientation: landscape) {
  .page-hero   { padding: 40px 0 32px; }
  .hero-3d-wrap { height: 200px; }
}


/* ─────────────────────────────────────
   AÇIK TEMA — Mobil Özel Düzeltmeler
───────────────────────────────────── */
@media (max-width: 767px) {
  /* Kart padding mobilde daha az */
  .test-card, .value-card, .contact-card { padding: 20px 16px !important; }
  .prd-body { padding: 16px; }

  /* Stats band daha kompakt */
  .stat-item { padding: 14px 8px; }
  .stat-icon-wrap { width: 48px; height: 48px; font-size: 18px; margin-bottom: 8px; }
  .stat-num { font-size: 1.9rem; }

  /* Why item düzeni */
  .why-item { gap: 12px; }

  /* big stat mobil */
  .big-stat { padding: 32px 20px; }
  .big-stat-num { font-size: 4rem; }

  /* Form tam genişlik */
  .form-card { border-radius: 14px; }

  /* Partner card grid */
  .partner-wrap { padding: 4px; }
  .partner-card { min-height: 90px !important; padding: 16px 10px !important; }
}

@media (max-width: 480px) {
  /* Stats 2x2 grid */
  #statsRow .col-6 { width: 50% !important; }
  .stat-num { font-size: 1.7rem; }
  .stat-label { font-size: 11px; }

  /* Heading boyutları */
  .page-hero h1 { font-size: 1.6rem; }
  .grad-heading { font-size: 1.5rem; }

  /* Hero badges gizle */
  .badge-top-right, .badge-bottom-left, .badge-top-left { display: none !important; }
  .badge-bottom-right { display: block; bottom: 8px; right: 8px; }

  /* Butonlar stack */
  .hero-actions { flex-direction: column; gap: 10px; }
  .hero-actions .btn-grad,
  .hero-actions .btn-ghost-white { width: 100%; justify-content: center; }
}

/* ── Geniş ekran (1200px+) ── */
@media (min-width: 1200px) {
  .hero-3d-wrap { min-height: 480px; }
  .hero-title { font-size: 4rem; }
  .container { max-width: 1180px; }
}

/* ── Çok geniş ekran (1400px+) ── */
@media (min-width: 1400px) {
  .hero-title { font-size: 4.4rem; }
  .container { max-width: 1320px; }
}

/* ── Yatay telefon ── */
@media (max-height: 500px) and (orientation: landscape) {
  .hero { min-height: auto; padding: 80px 0 40px; }
  .hero-visual { display: none; }
  .hero-content .col-lg-6 { max-width: 100%; flex: 0 0 100%; }
  .site-header .top-bar { display: none !important; }
}
