/* ============================================================
   CENTERSPREAD CONTACT — EDITABLE / RESPONSIVE v4.3
============================================================ */

.cs-contact-v43{
  --cs-contact-max:1220px;
  width:100%;
  overflow:hidden;
  font-family:"Satoshi",-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif !important;
}

.cs-contact-v43 *,
.cs-contact-v43 *::before,
.cs-contact-v43 *::after{
  font-family:inherit !important;
}

.cs-contact-v43 .wrap{
  width:min(var(--cs-contact-max),calc(100% - 44px)) !important;
  margin-inline:auto !important;
}

/* Respect global floating-header spacing from v3.8. */
.cs-contact-v43 > .hero:first-child{
  padding-top:96px !important;
}

.cs-contact-v43 #contact-form{
  scroll-margin-top:125px;
}

/* Capture form remains visually identical. */
.cs-contact-v43 .cs-capture-contact{
  width:100%;
}

/* Editable text should never force horizontal page overflow. */
.cs-contact-v43 h1,
.cs-contact-v43 h2,
.cs-contact-v43 h3,
.cs-contact-v43 p,
.cs-contact-v43 span,
.cs-contact-v43 label,
.cs-contact-v43 .info-card,
.cs-contact-v43 .form-note{
  overflow-wrap:anywhere;
}

@media(max-width:1100px){
  .cs-contact-v43 > .hero:first-child{
    padding-top:82px !important;
  }

  .cs-contact-v43 .hero-grid,
  .cs-contact-v43 .contact-layout{
    grid-template-columns:1fr !important;
  }

  .cs-contact-v43 .contact-visual{
    width:min(760px,100%) !important;
    margin-inline:auto !important;
  }

  .cs-contact-v43 .contact-info{
    max-width:760px;
  }

  .cs-contact-v43 .contact-form-card{
    width:100%;
  }

  .cs-contact-v43 .expect-grid{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
}

@media(max-width:820px){
  .cs-contact-v43 .expect-grid{
    grid-template-columns:1fr !important;
  }

  .cs-contact-v43 .expect-card{
    min-height:0 !important;
  }
}

@media(max-width:720px){
  .cs-contact-v43 .wrap{
    width:min(var(--cs-contact-max),calc(100% - 26px)) !important;
  }

  .cs-contact-v43 > .hero:first-child{
    padding-top:68px !important;
  }

  .cs-contact-v43 .hero h1{
    font-size:clamp(44px,12.5vw,60px) !important;
    line-height:.95 !important;
  }

  .cs-contact-v43 .hero-copy .lead{
    font-size:16px !important;
  }

  .cs-contact-v43 .hero-actions{
    display:grid !important;
    grid-template-columns:1fr !important;
  }

  .cs-contact-v43 .hero-actions .btn{
    width:100% !important;
  }

  .cs-contact-v43 .hero-proof{
    gap:10px 14px !important;
  }

  .cs-contact-v43 .contact-visual{
    min-height:485px !important;
    border-radius:24px !important;
  }

  .cs-contact-v43 .contact-core{
    width:152px !important;
    height:152px !important;
  }

  .cs-contact-v43 .contact-node{
    width:132px !important;
    padding:12px !important;
  }

  .cs-contact-v43 .contact-form-card{
    padding:22px 18px !important;
    border-radius:22px !important;
  }

  .cs-contact-v43 .form-head{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:14px !important;
  }

  .cs-contact-v43 .response-badge{
    justify-self:start !important;
  }

  .cs-contact-v43 .form-grid{
    grid-template-columns:1fr !important;
  }

  .cs-contact-v43 .field.full,
  .cs-contact-v43 .form-consent,
  .cs-contact-v43 .form-actions,
  .cs-contact-v43 .success-message{
    grid-column:auto !important;
  }

  .cs-contact-v43 .field input,
  .cs-contact-v43 .field select{
    min-height:50px !important;
    width:100% !important;
  }

  .cs-contact-v43 .field textarea{
    width:100% !important;
    min-height:135px !important;
  }

  .cs-contact-v43 .form-actions{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:14px !important;
  }

  .cs-contact-v43 .form-actions .btn{
    width:100% !important;
  }
}

@media(max-width:520px){
  .cs-contact-v43 > .hero:first-child{
    padding-top:58px !important;
  }

  .cs-contact-v43 .contact-visual{
    min-height:430px !important;
  }

  .cs-contact-v43 .contact-core{
    width:138px !important;
    height:138px !important;
  }

  .cs-contact-v43 .contact-core strong{
    font-size:18px !important;
  }

  .cs-contact-v43 .contact-node{
    width:114px !important;
  }

  .cs-contact-v43 .contact-node strong{
    font-size:12px !important;
  }

  .cs-contact-v43 .contact-node small{
    display:none !important;
  }

  .cs-contact-v43 .info-card{
    align-items:flex-start !important;
  }

  .cs-contact-v43 .contact-main{
    padding-top:68px !important;
  }

  .cs-contact-v43 .contact-form-card{
    padding:18px 14px !important;
  }

  .cs-contact-v43 .form-consent{
    align-items:flex-start !important;
  }
}

@media(max-width:370px){
  .cs-contact-v43 .contact-visual{
    min-height:390px !important;
  }

  .cs-contact-v43 .contact-core{
    width:124px !important;
    height:124px !important;
  }

  .cs-contact-v43 .contact-node{
    width:104px !important;
    padding:10px !important;
  }

  .cs-contact-v43 .contact-node .icon{
    width:30px !important;
    height:30px !important;
  }
}


/* v205.2: Contact purple circle — keep all text inside the circle on mobile.
   Fixed circle size per breakpoint, text sized to fit, subtitle width capped
   so it wraps inside the round shape, overflow clipped as a final safety net. */
@media screen and (max-width:767px) {
  html body .cs-contact-v43 .contact-visual .contact-core {
    box-sizing:border-box !important;
    width:168px !important;
    height:168px !important;
    min-width:0 !important;
    min-height:0 !important;
    max-width:none !important;
    max-height:none !important;
    aspect-ratio:1 / 1 !important;
    padding:18px !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    text-align:center !important;
    border-radius:50% !important;
    overflow:hidden !important;
    clip-path:circle(50% at 50% 50%);
  }
  html body .cs-contact-v43 .contact-visual .contact-core > div {
    box-sizing:border-box !important;
    position:static !important;
    transform:none !important;
    inset:auto !important;
    width:100% !important;
    max-width:100% !important;
    height:auto !important;
    min-width:0 !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    gap:5px !important;
    padding:0 !important;
    margin:0 !important;
    line-height:1.1 !important;
  }
  html body .cs-contact-v43 .contact-visual .contact-core small,
  html body .cs-contact-v43 .contact-visual .contact-core strong,
  html body .cs-contact-v43 .contact-visual .contact-core span {
    display:block !important;
    position:static !important;
    transform:none !important;
    flex:0 0 auto !important;
    float:none !important;
    margin:0 auto !important;
    padding:0 !important;
    max-width:100% !important;
    white-space:normal !important;
    word-break:normal !important;
    overflow-wrap:normal !important;
    hyphens:none !important;
    text-align:center !important;
  }
  html body .cs-contact-v43 .contact-visual .contact-core small {
    font-size:9px !important;
    line-height:1.15 !important;
    letter-spacing:.08em !important;
  }
  html body .cs-contact-v43 .contact-visual .contact-core strong {
    width:100% !important;
    font-size:19px !important;
    line-height:1.02 !important;
    letter-spacing:-.025em !important;
  }
  html body .cs-contact-v43 .contact-visual .contact-core span {
    width:auto !important;
    max-width:104px !important;
    color:#fff !important;
    opacity:.92 !important;
    font-size:9px !important;
    line-height:1.3 !important;
    letter-spacing:0 !important;
  }
}
@media screen and (max-width:420px) {
  html body .cs-contact-v43 .contact-visual .contact-core {
    width:150px !important;
    height:150px !important;
    padding:16px !important;
  }
  html body .cs-contact-v43 .contact-visual .contact-core > div {gap:4px !important;}
  html body .cs-contact-v43 .contact-visual .contact-core small {font-size:8px !important;}
  html body .cs-contact-v43 .contact-visual .contact-core strong {font-size:17px !important;}
  html body .cs-contact-v43 .contact-visual .contact-core span {font-size:8px !important; max-width:92px !important;}
}
@media screen and (max-width:350px) {
  html body .cs-contact-v43 .contact-visual .contact-core {
    width:140px !important;
    height:140px !important;
    padding:14px !important;
  }
  html body .cs-contact-v43 .contact-visual .contact-core strong {font-size:16px !important;}
  html body .cs-contact-v43 .contact-visual .contact-core span {max-width:86px !important;}
}


/* v205.9: Contact form — bulletproof mobile layout. */
html body .cs-contact-v43 .contact-layout,
html body .cs-contact-v43 .contact-form-card,
html body .cs-contact-v43 .contact-form-card form,
html body .cs-contact-v43 .form-grid,
html body .cs-contact-v43 .form-grid > *{
  min-width:0 !important;
  max-width:100% !important;
  box-sizing:border-box !important;
}
html body .cs-contact-v43 .form-grid input,
html body .cs-contact-v43 .form-grid select,
html body .cs-contact-v43 .form-grid textarea{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  box-sizing:border-box !important;
}
@media (max-width:1100px){
  /* Slide-in reveal pushes the card sideways and causes horizontal scroll. */
  html body .cs-contact-v43 .contact-info.reveal,
  html body .cs-contact-v43 .contact-form-card.reveal{
    transform:none !important;
  }
  html body .cs-contact-v43 .contact-main{
    overflow-x:hidden !important;
  }
  html body .cs-contact-v43 .contact-layout{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:28px !important;
  }
  html body .cs-contact-v43 .contact-info,
  html body .cs-contact-v43 .contact-form-card{
    width:100% !important;
    max-width:760px !important;
    margin-inline:auto !important;
  }
}
@media (max-width:720px){
  html body .cs-contact-v43 .contact-main{
    overflow-x:hidden !important;
  }
  html body .cs-contact-v43 .form-grid{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:14px !important;
  }
  html body .cs-contact-v43 .form-grid > *{
    grid-column:1 / -1 !important;
  }
  html body .cs-contact-v43 .field{
    display:flex !important;
    flex-direction:column !important;
    gap:6px !important;
  }
  html body .cs-contact-v43 .field label{
    font-size:14px !important;
    line-height:1.35 !important;
    white-space:normal !important;
  }
  /* 16px stops iPhones zooming the page when a field is tapped. */
  html body .cs-contact-v43 .form-grid input,
  html body .cs-contact-v43 .form-grid select,
  html body .cs-contact-v43 .form-grid textarea{
    font-size:16px !important;
    padding:12px 14px !important;
  }
  html body .cs-contact-v43 .form-grid select{
    text-overflow:ellipsis !important;
  }
  html body .cs-contact-v43 .form-head{
    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    gap:12px !important;
  }
  html body .cs-contact-v43 .form-head h3{
    font-size:clamp(22px,6.4vw,28px) !important;
    line-height:1.15 !important;
  }
  html body .cs-contact-v43 .response-badge{
    align-self:flex-start !important;
    white-space:nowrap !important;
  }
  html body .cs-contact-v43 .form-consent{
    display:flex !important;
    align-items:flex-start !important;
    gap:10px !important;
    font-size:13px !important;
    line-height:1.45 !important;
  }
  html body .cs-contact-v43 .form-consent input[type="checkbox"]{
    flex:0 0 18px !important;
    width:18px !important;
    height:18px !important;
    margin:2px 0 0 !important;
  }
  html body .cs-contact-v43 .form-actions{
    display:flex !important;
    flex-direction:column-reverse !important;
    align-items:stretch !important;
    gap:12px !important;
  }
  html body .cs-contact-v43 .form-actions .btn{
    width:100% !important;
    justify-content:center !important;
    min-height:52px !important;
  }
  html body .cs-contact-v43 .form-note{
    text-align:center !important;
    font-size:13px !important;
  }
  html body .cs-contact-v43 .info-card{
    display:flex !important;
    gap:12px !important;
    align-items:flex-start !important;
  }
  html body .cs-contact-v43 .info-card > div{
    min-width:0 !important;
  }
  html body .cs-contact-v43 .info-card a{
    overflow-wrap:anywhere !important;
  }
}
@media (max-width:380px){
  html body .cs-contact-v43 .contact-form-card{
    padding:16px 12px !important;
    border-radius:18px !important;
  }
}