/* One responsive contract for the complete Dimensional experience. */
:root { --responsive-header: 118px; }
html { scroll-padding-top: calc(var(--responsive-header) + 16px); }
body { min-width: 280px; }
main, footer, main > section, .page-shell, .route-hero-grid, .topic-grid,
.contact-grid, .history-layout, .quotation-panel { min-width: 0; }
.route-hero-grid > *, .topic-grid > *, .contact-grid > *, .history-layout > *,
.quotation-panel > *, .section-head > *, .partners-heading > * { min-width: 0; }
.mobile-menu { max-height: 100dvh; }
.mobile-menu nav { padding-bottom: max(20px, env(safe-area-inset-bottom)); }

/* Wide but shallow screens: keep the first view compact without crowding it. */
@media (min-width: 1181px) and (max-height: 820px) {
  .hero {
    min-height: 700px;
    padding-top: 154px;
    padding-bottom: 112px;
  }
  .hero-proof div { padding-block: 18px; }
  .hero-lead { margin-block: 22px 26px; }
}

/* Desktop layouts affected by Windows scaling and browser zoom. */
@media (min-width: 761px) and (max-width: 1180px) {
  :root {
    --responsive-header: 80px;
    --page: min(1180px, calc(100vw - 40px));
  }
  :where(main > section[id], .solution-card[id], .insurance-card[id], #detalhes) {
    scroll-margin-top: 96px;
  }
  .site-header { padding-inline: max(20px, calc((100vw - 1180px) / 2)); }
  .route-hero-grid, .topic-grid { gap: clamp(28px, 4vw, 42px); }
  .route-photo { min-height: clamp(330px, 43vw, 390px); }
  .footer-top { gap: 40px clamp(36px, 6vw, 64px); }
}

@media (min-width: 761px) and (max-width: 1180px) and (max-height: 680px) {
  .hero {
    min-height: 620px;
    padding-top: 124px;
    padding-bottom: 104px;
  }
  .hero-media { inset: 80px 0 -16px; }
  .hero h1 { font-size: clamp(2.75rem, 5.8vw, 4.65rem); }
  .hero-lead { margin-block: 20px 24px; line-height: 1.5; }
  .hero-proof div { padding-block: 14px; }
  .mobile-menu { padding-top: 88px; }
  .mobile-menu a:not(.button) { padding-block: 9px; font-size: 1rem; }
}

/* Tablet: preserve the editorial rhythm while reducing stacked hero height. */
@media (min-width: 621px) and (max-width: 900px) {
  .route-hero, .route-intro { padding-block: 42px; }
  .route-photo {
    aspect-ratio: 16 / 9;
    max-height: 380px;
  }
  .history-layout, .faq-grid { gap: 34px; }
}

/* Phones: compact surfaces, comfortable touch targets and predictable stacking. */
@media (max-width: 760px) {
  :root {
    --responsive-header: 72px;
    --page: min(calc(100vw - 36px), 600px);
  }
  html { scroll-padding-top: 84px; }
  :where(main > section[id], .solution-card[id], .insurance-card[id], #detalhes) {
    scroll-margin-top: 84px;
  }
  .mobile-menu { padding: 88px 18px 24px; }
  .mobile-menu a:not(.button) { min-height: 44px; display: flex; align-items: center; }
  .hero {
    min-height: max(760px, 100svh);
    padding-top: calc(88px + clamp(270px, 72vw, 360px));
  }
  .hero-media { inset: 84px 0 auto; height: clamp(270px, 72vw, 360px); }
  .hero-content { padding-bottom: 112px; }
  .hero h1 { font-size: clamp(2.6rem, 11vw, 3.75rem); }
  .hero-proof div { padding: 14px 6px; }
  .manifesto-note { padding-left: 18px; }
  .moment-explorer { min-height: 0; border-radius: 22px; }
  .moment-copy { padding-inline: 22px; }
  .about-image { min-height: clamp(340px, 100vw, 460px); }
  .partner-symbols { min-height: 280px; }
  .contact-form, .quotation-panel, .choice-result, .claims-guide { width: 100%; }
  .quotation-panel { padding: 22px; }
  .quotation-steps { gap: 20px; }
  .route-hero, .route-intro { padding-block: 38px; }
  .route-hero-grid, .topic-grid, .contact-grid, .history-layout,
  .quotation-panel, .faq-grid, .choice-layout { grid-template-columns: minmax(0, 1fr); }
  .choice-layout > *, .choice-options, .choice-result { min-width: 0; }
  .choice-options button { width: 100%; min-width: 0; }
  .route-photo { aspect-ratio: 3 / 2; max-height: 360px; }
  .safety-note { align-items: flex-start; }
  .footer-top { padding-block: 44px; }
}

@media (min-width: 360px) and (max-width: 620px) {
  .moment-tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
    gap: 8px;
  }
  .moment-tabs button {
    width: 100%;
    min-width: 0;
    height: 58px;
    padding-inline: 8px;
    gap: 7px;
  }
  .moment-tabs .tab-number { flex: 0 0 auto; }
  .moment-tabs .tab-label { min-width: 0; }
  .moment-tabs .tab-icon { width: 28px; height: 28px; }
}

@media (max-width: 480px) {
  .page-journey { display: grid; grid-template-columns: 1fr; gap: 0; }
  .page-journey a { max-width: none; padding-block: 16px; }
  .page-journey a + a { border-top: 1px solid var(--line); text-align: left; }
  .home-contact-actions { justify-content: flex-start; }
  .home-contact-actions .button, .quotation-shortcut-actions .button { width: 100%; }
  .footer-bottom { gap: 18px; }
}

@media (max-width: 359px) {
  :root { --page: calc(100vw - 28px); }
  .brand-logo { width: 168px; }
  .hero { padding-top: 312px; }
  .hero-media { height: 230px; }
  .hero h1 { font-size: 2.35rem; }
  .hero-lead { font-size: 1rem; }
  .moment-tabs { align-items: stretch; }
  .moment-tabs button { width: 100%; min-width: 0; }
  .footer-links { grid-template-columns: 1fr; }
}

@media (hover: none) {
  .solution-card:hover, .insurance-card:hover, .directory-card:hover,
  .route-photo:hover img, .topic-image:hover img { transform: none; }
}