/*
 * REALPRO STUDIOS
 * CONTACT HERO R3.5
 * Match Contact hero hierarchy closer to About hero
 */


/* ==========================================================
   01 · CONTACT HERO — DESKTOP
   ========================================================== */

html body.rp-page-contact
main#main
> section.rp-contact-hero[data-rp-surface="dark"]{
  height:clamp(420px,58svh,640px) !important;
  min-height:clamp(420px,58svh,640px) !important;
  max-height:640px !important;
  padding:
    clamp(92px,9.5svh,118px)
    0
    clamp(44px,5svh,58px)
    !important;
}

html body.rp-page-contact
.rp-contact-hero__content{
  max-width:min(720px,92vw) !important;
}

html body.rp-page-contact
.rp-contact-eyebrow{
  font-size:clamp(12px,.85vw,14px) !important;
  letter-spacing:.24em !important;
  margin-bottom:18px !important;
}

html body.rp-page-contact
.rp-contact-title-final,

html body.rp-page-contact
h1#rp-contact-title{
  width:min(100%,9.25ch) !important;
  max-width:9.25ch !important;
  font-size:clamp(66px,6.2vw,104px) !important;
  line-height:.88 !important;
  letter-spacing:-.052em !important;
  margin:0 !important;
}

html body.rp-page-contact
.rp-contact-title-final .rp-contact-line{
  display:block !important;
  white-space:normal !important;
}

html body.rp-page-contact
.rp-contact-hero__content
> p:not(.eyebrow){
  width:min(100%,31ch) !important;
  max-width:31ch !important;
  margin-top:26px !important;
  font-size:clamp(20px,1.35vw,25px) !important;
  line-height:1.42 !important;
  letter-spacing:-.01em !important;
  color:rgba(255,255,255,.90) !important;
}


/* ==========================================================
   02 · LARGE DESKTOP BALANCE
   ========================================================== */

@media (min-width:1600px){

  html body.rp-page-contact
  .rp-contact-title-final,

  html body.rp-page-contact
  h1#rp-contact-title{
    font-size:clamp(74px,5.5vw,112px) !important;
    max-width:9.5ch !important;
  }

  html body.rp-page-contact
  .rp-contact-hero__content
  > p:not(.eyebrow){
    font-size:clamp(21px,1.2vw,26px) !important;
    max-width:32ch !important;
  }

}


/* ==========================================================
   03 · TABLET
   ========================================================== */

@media (max-width:1100px){

  html body.rp-page-contact
  main#main
  > section.rp-contact-hero[data-rp-surface="dark"]{
    height:clamp(420px,56svh,560px) !important;
    min-height:clamp(420px,56svh,560px) !important;
    max-height:560px !important;
  }

  html body.rp-page-contact
  .rp-contact-title-final,

  html body.rp-page-contact
  h1#rp-contact-title{
    font-size:clamp(52px,6.8vw,82px) !important;
    max-width:9.4ch !important;
    line-height:.90 !important;
  }

  html body.rp-page-contact
  .rp-contact-hero__content
  > p:not(.eyebrow){
    font-size:clamp(17px,2vw,21px) !important;
    max-width:30ch !important;
    line-height:1.44 !important;
  }

}


/* ==========================================================
   04 · MOBILE
   ========================================================== */

@media (max-width:760px){

  html body.rp-page-contact
  main#main
  > section.rp-contact-hero[data-rp-surface="dark"]{
    height:clamp(420px,58svh,520px) !important;
    min-height:clamp(420px,58svh,520px) !important;
    max-height:520px !important;
    padding:88px 0 30px !important;
  }

  html body.rp-page-contact
  .rp-contact-hero__content{
    max-width:min(92vw,520px) !important;
  }

  html body.rp-page-contact
  .rp-contact-eyebrow{
    font-size:12px !important;
    letter-spacing:.22em !important;
    margin-bottom:16px !important;
  }

  html body.rp-page-contact
  .rp-contact-title-final,

  html body.rp-page-contact
  h1#rp-contact-title{
    max-width:9.1ch !important;
    font-size:clamp(40px,11.2vw,54px) !important;
    line-height:.91 !important;
    letter-spacing:-.045em !important;
  }

  html body.rp-page-contact
  .rp-contact-hero__content
  > p:not(.eyebrow){
    max-width:28ch !important;
    margin-top:18px !important;
    font-size:16px !important;
    line-height:1.45 !important;
  }

}

/* CONTACT HERO TITLE FINAL FIX R3.5.1 */

/*
 * Root correction:
 * - restore full editorial content width
 * - stop forcing every HTML title span onto its own line
 * - size title against the About hero visual language
 */

html body.rp-page-contact
.rp-contact-hero__content{
  width:min(88vw,1440px) !important;
  max-width:1440px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}


html body.rp-page-contact
.rp-contact-title-final,

html body.rp-page-contact
h1#rp-contact-title{
  width:min(100%,950px) !important;
  max-width:950px !important;

  font-size:clamp(68px,5vw,92px) !important;
  line-height:.89 !important;
  letter-spacing:-.052em !important;

  margin:0 !important;
}


/* CRITICAL:
   The source HTML contains several .rp-contact-line spans.
   They must participate in one natural headline flow.
*/

html body.rp-page-contact
.rp-contact-title-final
.rp-contact-line{
  display:inline !important;
  white-space:normal !important;
}


html body.rp-page-contact
.rp-contact-title-final
.rp-contact-line:not(:last-child)::after{
  content:" " !important;
}


/* Supporting copy — closer to About hero hierarchy */

html body.rp-page-contact
.rp-contact-hero__content
> p:not(.eyebrow){
  width:min(100%,760px) !important;
  max-width:760px !important;

  margin-top:26px !important;

  font-size:clamp(19px,1.25vw,23px) !important;
  line-height:1.48 !important;
  letter-spacing:-.012em !important;

  color:rgba(255,255,255,.92) !important;
}


/* Eyebrow */

html body.rp-page-contact
.rp-contact-eyebrow{
  font-size:clamp(12px,.82vw,14px) !important;
  letter-spacing:.24em !important;
  margin-bottom:20px !important;
}


/* Tablet */

@media (max-width:1100px){

  html body.rp-page-contact
  .rp-contact-title-final,

  html body.rp-page-contact
  h1#rp-contact-title{
    width:min(100%,760px) !important;
    max-width:760px !important;

    font-size:clamp(54px,6.4vw,72px) !important;
  }

}


/* Mobile */

@media (max-width:760px){

  html body.rp-page-contact
  .rp-contact-hero__content{
    width:calc(100% - 36px) !important;
    max-width:none !important;
  }

  html body.rp-page-contact
  .rp-contact-title-final,

  html body.rp-page-contact
  h1#rp-contact-title{
    width:100% !important;
    max-width:11.8ch !important;

    font-size:clamp(38px,10.3vw,48px) !important;
    line-height:.91 !important;
  }

  html body.rp-page-contact
  .rp-contact-hero__content
  > p:not(.eyebrow){
    max-width:32ch !important;
    margin-top:18px !important;

    font-size:15px !important;
    line-height:1.46 !important;
  }

}
