/* =========================================================================
   REPLOY Power — responsive
   Breakpoints mirror the source exactly: 991 (tablet), 767 (mobile-land),
   479 (mobile-portrait). Values taken verbatim from the Webflow stylesheet.
   ========================================================================= */

/* ============================ TABLET  ≤ 991px ============================ */
@media screen and (max-width: 991px) {
  :root { --container: 728px; }

  .container-1200, .hero__inner, .site-footer__container { max-width: 728px; }

  /* Type scale */
  .display    { font-size: 52px; line-height: 60px; }
  .heading    { font-size: 32px; line-height: 37px; }
  .subheading { font-size: 20px; line-height: 24px; }
  .lead       { font-size: 22px; line-height: 25px; }
  .body-text  { font-size: 16px; }

  /* Vertical rhythm */
  .section__inner { padding-top: 150px; padding-bottom: 150px; }

  /* Header → collapsed nav with hamburger */
  .nav__toggle { display: inline-flex; }
  .nav__menu {
    position: absolute; left: 50px; right: 50px; top: 100%;
    flex-wrap: wrap; justify-content: space-around; align-items: center;
    max-width: 960px; margin: 0 auto; padding: 20px;
    background-color: rgba(0,5,9,.37); border-radius: 0 0 20px 20px;
    -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);
    box-shadow: 0 0 50px 10px rgba(0,0,0,.15);
  }
  .nav__menu:not(.is-open) { display: none; }
  .nav__link { color: var(--white); margin: 0; padding-left: 10px; padding-right: 10px; }

  /* Footer */
  .site-footer__cols { column-gap: 29px; }
  .site-footer__brand img { height: 40px; }
  .site-footer__title { font-size: 16px; }
  .site-footer__link { font-size: 12px; }

  /* Features / images */
  .feature__icon { width: 100px; height: 100px; }

  /* Page hero */
  .page-hero__accent { height: 250px; }

  /* Team */
  .team__member { width: 45%; }
  .team__photo { width: 100px; height: 100px; }

  /* Hero rotator */
  .hero__rotator-wrap { height: 13vw; margin-bottom: 0; }
  .hero__rotator { height: 13vw; display: block; }
  .hero__word { display: flex; flex-direction: column; justify-content: flex-end; font-size: 10vw; line-height: 12vw; }

  /* Hero overlay pattern smaller */
  .hero__overlay { background-size: auto 40%, auto; }

  /* CTA patterns */
  .cta__pattern { width: 20%; height: auto; }
}

/* ========================= MOBILE-LAND  ≤ 767px ========================= */
@media screen and (max-width: 767px) {
  :root { --pad-x: 35px; }

  /* Type scale */
  .display    { font-size: 40px; line-height: 45px; }
  .heading    { font-size: 30px; line-height: 35px; text-align: center; }
  .heading.heading--left, .heading--left { text-align: left; }
  .subheading { font-size: 22px; line-height: 25px; text-align: center; }
  .lead       { font-size: 20px; line-height: 23px; }
  .body-text  { text-align: center; }

  .section { padding-left: 35px; padding-right: 35px; }
  .section__inner { padding-top: 130px; padding-bottom: 130px; }
  .divider { padding-left: 35px; padding-right: 35px; }

  /* Columns stack */
  .grid-2 { grid-template-columns: 1fr; }
  .grid-2__body { align-items: center; padding-top: 0; padding-bottom: 0; }
  .grid-3 { grid-template-columns: 1fr; row-gap: 20px; }

  /* Hero */
  .hero { padding: 60px 0 0; }
  .hero__rotator-wrap, .hero__rotator { height: 11vw; }
  .hero__word { height: 11vw; font-size: 9vw; line-height: 11vw; }
  .hero__rotator-move { text-align: center; }
  .hero__overlay { background-size: auto 30%, auto; }

  /* Page hero */
  .page-hero-section { height: 50vh; padding-left: 35px; padding-right: 35px; }
  .page-hero__accent { height: 150px; }
  .page-hero__tick { top: 40px; }
  .page-hero__line { top: 170px; }
  .page-hero__eyebrow { font-size: 20px; line-height: 28px; top: 16px; left: 50px; }

  /* Forms / update grid stack */
  .contact-form, .updates-grid { grid-template-columns: 1fr; }

  /* Header */
  .nav { padding-left: 35px; padding-right: 35px; }
  .nav__menu { left: 35px; right: 35px; }

  /* Footer becomes centered single column */
  .site-footer { padding-left: 35px; padding-right: 35px; }
  .site-footer__container { padding-top: 60px; padding-bottom: 60px; }
  .site-footer__wrapper { flex-direction: column; align-items: center; margin-top: 40px; }
  .site-footer__brand { display: flex; flex-direction: column; justify-content: center; align-items: center; }
  .site-footer__brand img { height: 60px; margin-bottom: 40px; }
  .site-footer__cols { grid-template-columns: 1fr; margin-top: 40px; }
  .site-footer__col { align-items: center; }
  .site-footer__title { font-size: 25px; }
  .site-footer__link { font-size: 18px; }
  .site-footer__rule { margin-top: 60px; }
  .site-footer__copyright { font-size: 12px; }

  /* Team full width */
  .team__member { width: 100%; }
}

/* ======================== MOBILE-PORTRAIT  ≤ 479px ====================== */
@media screen and (max-width: 479px) {
  :root { --pad-x: 25px; --container: none; }

  .container-1200 { justify-content: center; max-width: none; }
  .section { padding-left: 25px; padding-right: 25px; }
  .divider { padding-left: 25px; padding-right: 25px; }
  .divider__icon { height: 50px; top: -25px; }

  /* Type scale */
  .display { font-size: 35px; line-height: 40px; }
  .page-hero__title.display { margin-bottom: 15px; font-size: 27px; line-height: 35px; }
  .heading { font-size: 27px; line-height: 33px; }
  .quote__text { margin: 20px 0; font-size: 20px; line-height: 25px; }
  .subheading { font-size: 21px; line-height: 23px; }
  .lead { font-size: 18px; line-height: 22px; }
  .body-text { font-size: 15px; }

  /* Buttons */
  .btn { padding: 8px 15px; }
  .btn--dark { font-size: 12px; line-height: 12px; }

  /* Header */
  .nav { padding-left: 25px; padding-right: 25px; }
  .nav__menu { left: 25px; right: 25px; flex-direction: column; }
  .nav__brand img { height: 30px; }
  .nav__toggle-icon { border-width: 0; border-radius: 5px; }
  .nav__link { padding: 0 10px; }

  /* Hero */
  .hero { padding-bottom: 0; padding-left: 0; padding-right: 0; }

  /* Footer */
  .site-footer { margin-top: 30px; padding-left: 25px; padding-right: 25px; }
  .site-footer__container { max-width: none; padding-top: 60px; padding-bottom: 60px; }
  .site-footer__wrapper { margin-top: 0; padding-top: 0; }
  .site-footer__rule { margin-top: 40px; }
  .site-footer__legal { flex-direction: column; justify-content: center; align-items: center; }
}
