/* Shared edges keep the complete page and the full-width story in alignment. */
:root {
  --layout-gutter: clamp(24px, 4vw, 80px);
  --container: min(1680px, calc(100% - 2 * var(--layout-gutter)));
  --content-edge: max(var(--layout-gutter), calc((100% - 1680px) / 2));
  --story-header-height: 84px;
}

.expanded-layout .page-shell { overflow: clip; }
.expanded-layout .site-header { padding-inline: var(--content-edge); }
.expanded-layout main > section[id] { scroll-margin-top: calc(var(--story-header-height) + 16px); }
.expanded-layout .hero-content { grid-template-columns: minmax(0, 1.05fr) minmax(340px, .95fr); gap: 7%; }
.expanded-layout .hero-copy h1 { max-width: 840px; }
.expanded-layout .brand-stage,
.expanded-layout .brand-note { width: min(520px, 92%); }
.expanded-layout .hero-mark-lockup { width: 86%; }
.expanded-layout .hero-mark-lockup img { max-height: 350px; }
.expanded-layout .hero-proof { max-width: 760px; }
.expanded-layout .action-heading { max-width: none; }
.expanded-layout .action-heading h2 { max-width: 840px; }
.expanded-layout .tablet-experience { grid-template-columns: minmax(0, 1.3fr) minmax(300px, .7fr); gap: 6%; }
.expanded-layout .trust-section { grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 6%; }
.expanded-layout .operational-faq { max-width: 1200px; }
.expanded-layout .contact-section { grid-template-columns: minmax(0, 1.05fr) minmax(360px, .8fr); gap: 10%; }
.expanded-layout .lead-form-card { width: 100%; max-width: 580px; justify-self: end; }
.expanded-layout .contact-copy { max-width: 760px; }
.expanded-layout .analytics-consent { padding-inline: var(--content-edge); }

#produto { --page-gutter: var(--layout-gutter); width: 100%; border-top: 2px solid var(--premia-black); }
#produto .introduction,
#produto .scene-inner { width: var(--container); max-width: none; padding-inline: 0; }
#produto .introduction { padding-block: 60px; }
#produto .intro-description { justify-self: start; margin-left: 10%; }
#produto .story-title { margin-bottom: 0; }
#produto .journey-track { display: block; padding: 0; margin: 0; gap: 0; min-height: 0; }
#produto .is-scroll-ready .journey-heading,
#produto .is-scroll-ready .journey-bottom { padding-inline: var(--content-edge); }
#produto .scene-inner { grid-template-columns: minmax(0, .9fr) minmax(0, 1.3fr); }
#produto .scene-visual,
#produto .is-scroll-ready .scene-visual { max-width: none; }
#produto .journey-heading { gap: 30px; }

@media (min-width: 901px) and (min-height: 680px) and (prefers-reduced-motion: no-preference) {
  #produto .is-scroll-ready .journey-sticky { top: var(--story-header-height); height: calc(100svh - var(--story-header-height)); }
  #produto .is-scroll-ready .journey-track { display: flex; }
  #produto .is-scroll-ready .illustration-wrap { max-height: calc(100svh - var(--story-header-height) - 255px); }
}

@media (min-width: 901px) and (max-height: 880px) {
  #produto .scene h2 { font-size: 39px; }
  #produto .scene-label { margin-bottom: 14px; }
  #produto .scene-description { font-size: 14px; margin-top: 16px; line-height: 1.55; }
  #produto .scene-points { gap: 7px; margin-top: 16px; }
  #produto .scene-points li { font-size: 12px; }
  #produto .scene-value { margin-top: 20px; padding-top: 15px; }
  #produto .is-scroll-ready .journey-heading { min-height: 78px; }
  #produto .chapter { padding-block: 26px; }
  #produto .is-scroll-ready .journey-bottom { height: 44px; }
  #produto .is-scroll-ready .scene-inner { padding-block: 22px 48px; }
}

@media (max-width: 1120px) and (min-width: 901px) {
  .expanded-layout .hero-copy h1 { font-size: 4rem; }
  .expanded-layout .site-header { gap: 16px; }
  .expanded-layout .nav-links a { padding-inline: 8px; font-size: .85rem; }
  #produto .scene-inner { grid-template-columns: minmax(0, 1fr) minmax(0, 1.12fr); gap: 4%; }
}

@media (max-width: 900px) {
  :root { --layout-gutter: 24px; }
  .expanded-layout .site-header .header-cta { display: none; }
  .expanded-layout .hero-content,
  .expanded-layout .tablet-experience,
  .expanded-layout .trust-section,
  .expanded-layout .contact-section { grid-template-columns: 1fr; gap: 38px; }
  .expanded-layout .lead-form-card { max-width: 620px; justify-self: center; }
  #produto .scene-inner { grid-template-columns: 1fr; }
  #produto .intro-description { margin-left: 0; }
  #produto .introduction { padding-block: 44px; }
}

@media (max-width: 640px) {
  :root { --layout-gutter: 20px; --story-header-height: 0px; }
  .expanded-layout .hero-content,
  .expanded-layout .action-heading,
  .expanded-layout .tablet-experience,
  .expanded-layout .advantages-grid,
  .expanded-layout .section-cta,
  .expanded-layout .trust-section,
  .expanded-layout .operational-faq,
  .expanded-layout .contact-section,
  .expanded-layout .site-footer,
  .expanded-layout .section-intro { width: var(--container); max-width: none; }
  .expanded-layout .brand-stage,
  .expanded-layout .brand-note { width: min(420px, 94%); }
  .expanded-layout .hero-brand { padding-right: 8px; }
  .expanded-layout .hero-copy h1 { font-size: 2.7rem; }
  .expanded-layout .hero-mark-lockup img { max-height: 280px; }
  .expanded-layout .analytics-consent { padding-inline: 16px; }
  #produto .introduction { padding-block: 36px; }
}
