/* =========================================================
   Modern River Point — responsive.css
   ========================================================= */

@media (max-width: 1080px) {
  :root { --s-7:4rem; --s-8:5.5rem; }
  .hero-grid { grid-template-columns:1fr; gap:var(--s-5); }
  .hero-visual { max-width:560px; }
  .split { grid-template-columns:1fr; gap:var(--s-5); }
  .cat-grid { grid-template-columns:repeat(3,1fr); }
  .insights { grid-template-columns:1fr; }
  .content-layout { grid-template-columns:1fr; }
  .sidebar { position:static; grid-template-columns:1fr 1fr; }
  .blog-grid { grid-template-columns:repeat(2,1fr); }
  .related { grid-template-columns:repeat(2,1fr); }
  .blog-feature { grid-template-columns:1fr; } .blog-feature .thumb{ min-height:220px; }
}

@media (max-width: 920px) {
  .nav-links, .nav-actions .btn-compare { display:none; }
  .nav-toggle { display:flex; }
  .mobile-menu { display:flex; position:fixed; inset:74px 0 0; z-index:48; background:var(--paper);
    transform:translateX(100%); transition:transform .4s var(--ease); padding:1.5rem; flex-direction:column; gap:.3rem; overflow-y:auto; }
  .mobile-menu.open { transform:translateX(0); }
  .mobile-menu a { padding:.95rem 1.1rem; border-radius:10px; font-family:var(--display); font-weight:600; font-size:1.3rem; color:var(--ink); border-bottom:1px solid var(--line-soft); }
  .mobile-menu a:hover, .mobile-menu a[aria-current="page"] { color:var(--brand-deep); }
  .mobile-menu .btn { margin-top:1.1rem; font-size:1.05rem; }
  body.menu-open { overflow:hidden; }

  .steps { grid-template-columns:1fr; }
  .exp-cards { grid-template-columns:1fr; }
  .tmls { grid-template-columns:1fr; }
  .ribbon .shell { grid-template-columns:1fr 1fr; }
  .ribbon .item:nth-child(odd){ border-left:none; } .ribbon .item:nth-child(3),.ribbon .item:nth-child(4){ border-top:1px solid var(--line-soft); }
  .footer-top { grid-template-columns:1fr 1fr; } .footer-brand{ grid-column:1/-1; }
  .calc-panel.active { grid-template-columns:1fr; }
  .compare-layout { grid-template-columns:1fr !important; }
  .filter-rail { position:static; }
}

@media (max-width: 640px) {
  body { font-size:1rem; }
  .shell { padding-inline:1.15rem; }
  :root { --s-7:3.25rem; --s-8:4.25rem; }
  .hero { padding-top:var(--s-6); }
  .hero h1 { font-size:clamp(2.2rem,9vw,3rem); }
  .hero-cta { flex-direction:column; } .hero-cta .btn{ width:100%; }
  .hero-search { grid-template-columns:1fr; } .hero-search .btn{ width:100%; }
  .cat-grid { grid-template-columns:1fr 1fr; }
  .blog-grid, .related { grid-template-columns:1fr; }
  .ribbon .shell { grid-template-columns:1fr 1fr; }
  .footer-top { grid-template-columns:1fr; }
  .footer-bottom { flex-direction:column; align-items:flex-start; }

  /* comparison card → stacked */
  .cmp { grid-template-columns:1fr; gap:1rem; }
  .cmp-price { text-align:left; display:flex; align-items:baseline; gap:.7rem; flex-wrap:wrap; }
  .cmp-action { flex-direction:row; }
  .insight { grid-template-columns:1fr; } .insight .thumb{ min-height:150px; }
  .savings-block { flex-direction:column; align-items:flex-start; }
  .calc-tabs { flex-direction:column; } .calc-tab{ border-bottom:1px solid var(--line); border-left:3px solid transparent; } .calc-tab.active{ border-left-color:var(--brand); border-bottom-color:var(--line); }
}

@media (max-width: 400px) {
  .cat-grid { grid-template-columns:1fr; }
}