/* ==========================================================================
   PUSULA Sigorta — responsive.css
   Desktop-down overrides. Breakpoints: 1280 · 1180 · 992 · 768 · 576 · 400
   ========================================================================== */

/* --- Large desktop -------------------------------------------------------- */
@media (max-width: 1280px) {
  .segment-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .mega { width: 560px; max-width: calc(100vw - 40px); }
  .hero__visual { height: clamp(400px, 42vw, 520px); }
}

/* --- Header density steps ------------------------------------------------- */
@media (max-width: 1240px) {
  .header-phone span { display: none; }
  .header-phone { padding: 9px 10px; }
}

/* --- Nav collapse point --------------------------------------------------- */
@media (max-width: 1120px) {
  .primary-nav { display: none; }
  .nav-toggle { display: inline-flex; }
  .header-inner { justify-content: space-between; gap: 12px; }
  .header-actions { margin-left: auto; }

  /* Four ribbon cells stop fitting well before the mobile breakpoint. */
  .hero-ribbon__list { grid-template-columns: repeat(2, 1fr); }
  .hero-ribbon__list li {
    padding: 18px 20px;
    border-left: 0;
    border-top: 1px solid var(--color-border-soft);
  }
  .hero-ribbon__list li:nth-child(-n+2) { border-top: 0; }
  .hero-ribbon__list li:nth-child(odd) { padding-left: 0; }
}

/* --- Tablet landscape ----------------------------------------------------- */
@media (max-width: 991.98px) {
  :root { --header-h: 72px; --header-h-scrolled: 64px; }

  .container, .container-fluid { padding-inline: 20px; }

  /* hero */
  .hero__grid { grid-template-columns: 1fr; gap: 36px; }
  .hero__visual {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: 260px 170px;
    height: auto;
  }
  .hero__visual .v-main { grid-row: span 1; grid-column: span 2; }
  .hero__meta { margin-top: 32px; }

  .hero-ribbon__list { grid-template-columns: repeat(2, 1fr); }
  .hero-ribbon__list li { padding: 18px 20px; border-left: 0; border-top: 1px solid var(--color-border-soft); }
  .hero-ribbon__list li:nth-child(-n+2) { border-top: 0; }
  .hero-ribbon__list li:nth-child(odd) { padding-left: 0; }

  /* layout primitives */
  .split, .split--balanced, .split--media-left,
  .page-hero__grid, .post-feature, .cta-band { grid-template-columns: 1fr; }
  .split__sticky, .toc { position: static; }
  .cta-band { gap: 26px; }
  .cta-band__actions { justify-content: flex-start; }
  .section-head--split { align-items: flex-start; }

  /* grids */
  .product-grid, .product-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .product-grid .product-tile:nth-child(4n),
  .product-grid--3 .product-tile:nth-child(3n) { border-right: 1px solid var(--color-border-soft); }
  .product-grid .product-tile:nth-child(2n),
  .product-grid--3 .product-tile:nth-child(2n) { border-right: 0; }
  .product-grid .product-tile:nth-last-child(-n+4),
  .product-grid--3 .product-tile:nth-last-child(-n+3) { border-bottom: 1px solid var(--color-border-soft); }
  .product-grid .product-tile:nth-last-child(-n+2) { border-bottom: 0; }

  .logo-row { grid-template-columns: repeat(3, 1fr); }
  .logo-row__item:nth-child(4n) { border-right: 1px solid var(--color-border-soft); }
  .logo-row__item:nth-child(3n) { border-right: 0; }
  .logo-row__item:nth-last-child(-n+4) { border-bottom: 1px solid var(--color-border-soft); }
  .logo-row__item:nth-last-child(-n+3) { border-bottom: 0; }

  .stat-band { grid-template-columns: repeat(2, 1fr); gap: 34px 0; }
  .stat-item { padding: 0 24px; }
  .stat-item:nth-child(odd) { border-left: 0; padding-left: 0; }

  .review-grid { grid-template-columns: 1fr; }
  .review, .review:not(:first-child) {
    padding: 30px 0; border-left: 0; border-top: 1px solid var(--color-border);
  }
  .review:first-child { border-top: 0; padding-top: 0; }

  .process { grid-template-columns: 1fr; }
  .process__step, .process__step + .process__step { padding: 24px 0; }
  .process__step + .process__step { padding-left: 0; }

  /* campaigns */
  .campaign { grid-template-columns: 1fr; }
  .campaign__media { aspect-ratio: 16 / 8; }
  .campaign__body { padding: 24px 24px 0; }
  .campaign__action { padding: 20px 24px 26px; }
  .campaign__action .btn { width: 100%; }

  /* doc selector */
  .doc-selector { grid-template-columns: 1fr; }
  .doc-selector__nav {
    border-right: 0; border-bottom: 1px solid var(--color-border);
    display: flex; overflow-x: auto; scrollbar-width: none;
  }
  .doc-selector__nav::-webkit-scrollbar { display: none; }
  .doc-selector__nav button {
    border-bottom: 0; white-space: nowrap; min-height: 56px; padding: 14px 18px;
  }
  .doc-selector__nav button[aria-selected="true"]::before {
    left: 0; right: 0; top: auto; bottom: 0; width: auto; height: 3px;
  }

  /* companies */
  .company-row { grid-template-columns: 1fr; gap: 16px; padding: 24px 0; }

  /* posts */
  .post-row { grid-template-columns: 110px minmax(0, 1fr); }
  .post-row > .btn, .post-row > .link-arrow { grid-column: 2; justify-self: start; }

  /* wizard */
  .option-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  /* footer */
  .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px 28px; }
  .footer-brand { grid-column: span 2; }

  /* auth */
  .auth-wrap { grid-template-columns: 1fr; min-height: 0; }
  .auth-aside { order: -1; padding: 40px 24px; }

  /* whatsapp chip yields to the mobile action bar */
  .wa-chip { display: none; }
}

/* --- Tablet portrait / large phone --------------------------------------- */
@media (max-width: 767.98px) {
  :root { --section-space: 64px; --section-space-sm: 48px; }

  h1, .h1 { letter-spacing: -.024em; }

  .container, .container-fluid { padding-inline: 18px; }

  .hero { padding-top: 28px; }
  .hero__grid { padding-bottom: 44px; }
  .hero__visual { grid-template-rows: 210px 140px; gap: 10px; }
  .hero__cta { flex-direction: column; align-items: stretch; }
  .hero__cta .btn { width: 100%; }
  .hero__meta { padding-top: 20px; }
  .hero__meta-item { padding-inline: 14px; }

  /* quote selector */
  .segment-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .segment-option { min-height: 88px; padding: 14px 8px; font-size: .8rem; }
  .segment-option i { font-size: 1.2rem; }
  .quote-selector__foot { flex-direction: column; align-items: stretch; }
  .quote-selector__foot .btn { width: 100%; }

  /* products */
  .product-tile { padding: 24px 20px; min-height: 0; }

  .product-card__actions { flex-direction: column; }
  .product-card__actions .btn { width: 100%; }

  /* logos */
  .logo-row { grid-template-columns: repeat(2, 1fr); }
  .logo-row__item { min-height: 92px; padding: 22px 16px; }
  .logo-row__item:nth-child(3n) { border-right: 1px solid var(--color-border-soft); }
  .logo-row__item:nth-child(2n) { border-right: 0; }
  .logo-row__item:nth-last-child(-n+3) { border-bottom: 1px solid var(--color-border-soft); }
  .logo-row__item:nth-last-child(-n+2) { border-bottom: 0; }
  .logo-row__item svg { width: 128px; }

  /* checklists */
  .checklist--cols, .checklist--3 { grid-template-columns: 1fr; }

  /* rule list */
  .rule-list > li { grid-template-columns: 44px 1fr; padding: 22px 0; }

  /* wizard */
  .wizard__body { padding: 24px 20px; }
  .wizard__nav { padding: 16px 20px; flex-wrap: wrap; }
  .wizard__nav .btn { flex: 1 1 auto; }
  .wizard__nav .spacer { display: none; }
  .wizard__progress { padding: 16px 20px; }
  .wizard__step span { display: none; }
  .wizard__step.is-active span { display: inline; }
  .option-tiles { grid-template-columns: 1fr; }

  /* posts */
  .post-row { grid-template-columns: 88px minmax(0, 1fr); gap: 16px; }
  .post-row h3 { font-size: 1rem; }
  .post-row:hover { padding-inline-start: 0; }

  /* contact */
  .contact-list li { grid-template-columns: 38px 1fr; gap: 14px; }
  .contact-list__icon { width: 38px; height: 38px; font-size: 1rem; }

  /* CTA */
  .cta-band { padding: 30px 24px; }
  .cta-band__actions { flex-direction: column; align-items: stretch; }
  .cta-band__actions .btn { width: 100%; }

  /* modal & toasts */
  .toast-stack { right: 12px; left: 12px; bottom: 12px; width: auto; }

  /* cookie bar */
  .cookie-bar { left: 12px; right: 12px; bottom: 12px; width: auto; padding: 18px; }
  .cookie-bar__actions .btn { flex: 1 1 auto; }

  /* footer */
  .footer-grid { grid-template-columns: 1fr; gap: 32px; }
  .footer-brand { grid-column: span 1; }
  .footer-bottom { flex-direction: column; align-items: flex-start; }

  /* sticky mobile action bar */
  .sticky-cta { display: flex; }
  body.has-sticky-cta { padding-bottom: 74px; }

  /* tables scroll rather than squeeze */
  .table-wrap { border-radius: var(--radius-sm); }

  /* pager */
  .pager a, .pager span { min-width: 42px; height: 42px; }
  .pager .pager-label { display: none; }
}

/* --- Small phone ---------------------------------------------------------- */
@media (max-width: 575.98px) {
  .container, .container-fluid { padding-inline: 16px; }

  .brand__sub { letter-spacing: .2em; font-size: .58rem; }
  .header-phone span { display: none; }
  .header-phone { padding: 9px 10px; }

  .hero__visual { grid-template-rows: 190px 122px; }
  .hero-ribbon__list { grid-template-columns: 1fr; }
  .hero-ribbon__list li { border-top: 1px solid var(--color-border-soft); padding-left: 0; padding-right: 0; }
  .hero-ribbon__list li:first-child { border-top: 0; }

  .segment-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .product-grid, .product-grid--3 { grid-template-columns: 1fr; }
  .product-grid .product-tile,
  .product-grid--3 .product-tile { border-right: 0 !important; border-bottom: 1px solid var(--color-border-soft) !important; }
  .product-grid .product-tile:last-child,
  .product-grid--3 .product-tile:last-child { border-bottom: 0 !important; }

  .stat-band { grid-template-columns: 1fr; gap: 26px; }
  .stat-item { padding: 0; border-left: 0; }

  .post-row { grid-template-columns: 1fr; }
  .post-row__media { aspect-ratio: 16 / 9; }
  .post-row > .btn, .post-row > .link-arrow { grid-column: 1; }

  .filter-bar { padding-bottom: 20px; margin-bottom: 24px; }
  .filter-count { width: 100%; margin-left: 0; }

  .review blockquote { font-size: .96rem; }

  .sticky-cta .btn-outline-brand { flex: 0 0 42%; }
  .sticky-cta .btn { font-size: .9rem; padding-inline: 12px; }

  .wizard-success__icon { width: 58px; height: 58px; font-size: 1.6rem; }
}

@media (max-width: 400px) {
  .brand__mark { width: 34px; height: 34px; }
  .brand__name { font-size: 1.05rem; }
  .segment-option { min-height: 82px; }

  /* At 320px the brand, the phone shortcut, the CTA and the menu button no
     longer fit on one line. The phone number is in the menu and the footer,
     so the shortcut is the one to drop — the CTA is the page's job. */
  .header-actions .header-phone { display: none; }
  .header-actions { gap: 6px; }
  .site-header .btn { padding-inline: 14px; font-size: .86rem; }
}

/* --- Touch targets --------------------------------------------------------
   Standalone controls need a finger-sized hit area on touch screens. Inline
   links inside prose are deliberately left alone: they are exempt, and padding
   them out would break the line box they sit in. */
@media (max-width: 991.98px) {
  .site-header .btn,
  .sticky-cta .btn { min-height: 44px; }

  .header-phone {
    min-width: 44px;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  /* Bootstrap sizes .btn-close as content-box, so width/height would sit
     outside its padding and overshoot the 44px target. */
  .offcanvas .btn-close {
    box-sizing: border-box;
    width: 44px;
    height: 44px;
    background-size: 14px;
    margin-inline-end: -8px;
  }
}

/* --- Print ---------------------------------------------------------------- */
@media print {
  .site-header, .site-footer, .sticky-cta, .wa-chip, .cookie-bar, .toast-stack { display: none !important; }
  body { background: #fff; }
  .section { padding-block: 24px; }
}