/* ==========================================================================
   Finance Business Debt — responsive rules (min-width, mobile first)
   ========================================================================== */

/* Small phones */
@media (max-width: 359px) {
  :root { --gutter: 0.875rem; }
  .btn { padding-left: 1.1rem; padding-right: 1.1rem; }
  .hero h1 { font-size: 1.85rem; }
}

/* ≥ 480px */
@media (min-width: 480px) {
  .grid--2 { grid-template-columns: repeat(2, 1fr); }
  .form-row { grid-template-columns: repeat(2, 1fr); }
  .hero-form .form-row { grid-template-columns: repeat(2, 1fr); }
  .result-grid { grid-template-columns: repeat(2, 1fr); }
  .trust-strip ul { grid-template-columns: repeat(2, 1fr); }
  .pros-cons { grid-template-columns: repeat(2, 1fr); }
  .toc ol { columns: 2; column-gap: 2rem; }
}

/* ≥ 640px */
@media (min-width: 640px) {
  :root { --gutter: 1.5rem; }
  .section { padding: 4.5rem 0; }
  .section--tight { padding: 3rem 0; }
  h1 { font-size: var(--fs-4xl); }
  h2 { font-size: var(--fs-3xl); }
  .steps { grid-template-columns: repeat(2, 1fr); }
  .option-grid { grid-template-columns: repeat(2, 1fr); }
  .related-grid { grid-template-columns: repeat(2, 1fr); }
  .footer-main { grid-template-columns: repeat(2, 1fr); }
  .footer-brand { grid-column: 1 / -1; }
  .form-card { padding: 2.25rem 2rem; }
  .tool { padding: 2rem; }
  .facility { grid-template-columns: repeat(3, 1fr); }
  .facility__head { grid-column: 1 / -1; }
  .cta-band .container { grid-template-columns: 1fr auto; align-items: center; }
}

/* ≥ 768px */
@media (min-width: 768px) {
  .grid--3 { grid-template-columns: repeat(3, 1fr); }
  .grid--4 { grid-template-columns: repeat(2, 1fr); }
  .hero { padding: 4rem 0 4.5rem; }
  .page-hero { padding: 3rem 0 3.5rem; }
  .value-list { grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }
  .trust-strip ul { grid-template-columns: repeat(4, 1fr); }
  .pressure-list { grid-template-columns: repeat(2, 1fr); }
  .result-grid { grid-template-columns: repeat(4, 1fr); }
  .result-grid--3 { grid-template-columns: repeat(3, 1fr); }
  .footer-main { grid-template-columns: 1.4fr 1fr 1fr 1fr; }
  .footer-brand { grid-column: auto; }
}

/* ≥ 1024px — desktop navigation */
@media (min-width: 1024px) {
  .hero-split { grid-template-columns: minmax(0, 1fr) 440px; gap: 3rem; }
  .hero-form-col { justify-self: end; }
  .page-hero { padding: 3rem 0 3.5rem; }
  :root { --header-h: 80px; }
  .section { padding: 5.5rem 0; }
  .section--tight { padding: 3.5rem 0; }
  .hero-grid { grid-template-columns: minmax(0, 1fr) 460px; gap: 3rem; }
  .hero-grid .hero-form-col { justify-self: end; }
  .hero { padding: 4.5rem 0 5rem; }
  .grid--4 { grid-template-columns: repeat(4, 1fr); }
  .steps { grid-template-columns: repeat(4, 1fr); }
  .steps--3 { grid-template-columns: repeat(3, 1fr); }
  .option-grid { grid-template-columns: repeat(4, 1fr); }
  .option-grid--2 { grid-template-columns: repeat(2, 1fr); }
  .layout { grid-template-columns: minmax(0, 1fr) 320px; gap: 3.5rem; align-items: start; }
  .layout--reverse { grid-template-columns: 320px minmax(0, 1fr); }
  .sidebar { position: sticky; top: calc(var(--header-h) + 24px); }
  .layout--contact { grid-template-columns: 1fr 1.15fr; }
  .related-grid { grid-template-columns: repeat(3, 1fr); }
  .facility { grid-template-columns: repeat(3, 1fr); }
  .logo img { height: 36px; }
  .nav-item--home { display: none; }
  .header-cta { display: none; }

  .nav-toggle { display: none; }
  .header-cta { display: inline-flex; }
  .logo img { height: 40px; }
  .site-nav {
    position: static; inset: auto; height: auto; transform: none; background: transparent; overflow: visible;
    padding: 0; border: 0; transition: none; display: flex; align-items: center; visibility: visible;
  }
  .nav-list { display: flex; align-items: center; gap: 0.15rem; }
  .nav-item { border: 0; position: relative; }
  .nav-link, .nav-trigger {
    width: auto; padding: 0.5rem 0.6rem; font-size: 0.875rem; border-radius: 10px; gap: 0.3rem; white-space: nowrap;
    transition: background-color 0.2s, color 0.2s;
  }
  .nav-link:hover, .nav-trigger:hover, .nav-trigger[aria-expanded="true"] { background: var(--slate-100); color: var(--navy-900); }
  .nav-trigger .icon { width: 15px; height: 15px; }
  .nav-sub {
    position: absolute; top: calc(100% + 10px); left: 0; min-width: 300px; background: var(--white);
    border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-lg); padding: 0.6rem;
    display: none; z-index: 950;
  }
  .nav-sub::before { content: ""; position: absolute; left: 0; right: 0; top: -12px; height: 12px; }
  .nav-item.is-open > .nav-sub { display: block; }
  .nav-sub--wide { min-width: 560px; display: none; grid-template-columns: 1fr 1fr; gap: 0 0.5rem; }
  .nav-item.is-open > .nav-sub--wide { display: grid; }
  .nav-sub__title { grid-column: 1 / -1; }
  .nav-sub a { padding: 0.5rem 0.75rem; font-size: var(--fs-sm); }
  .nav-item--right .nav-sub { left: auto; right: 0; }
  .nav-mobile-cta { display: none; }
  .nav-sub__group { display: contents; }
}

/* ≥ 1280px */
@media (min-width: 1280px) {
  .nav-link, .nav-trigger { padding: 0.6rem 0.9rem; font-size: 0.95rem; }
  .header-cta { display: inline-flex; }
  .hero h1 { font-size: 3.5rem; }
}

/* ≥ 1600px: cap line length, keep hero balanced */
@media (min-width: 1600px) {
  :root { --container: 1240px; }
}