/*! cct-page 1.0.2 | /contact redesign, Figma 4414:225489 (1920 frame). Same layout as /demo: loads AFTER cdm-page and only changes what differs */

/* ---- desktop hero: headline top-aligned with the first form label (Figma y 180 = card top 120 + 60 card padding);
   32px under the card (the demo frame had 36) ---- */
@media (min-width:992px){
  .cfh-page [data-cfh-sec="contact-hero"] .cdm-hero-copy{justify-content:flex-start;padding-top:92px}
  .cfh-page [data-cfh-sec="contact-hero"] .cdm-hero-form{padding-bottom:32px}
}

/* ---- HubSpot contact form (First name*, Email*, Message): show the required star, message box 112 tall ---- */
.cct-hs .hs-form-required{display:inline}
.cct-hs textarea.hs-input{height:112px;min-height:112px;padding:15px 16px;resize:vertical}

/* ---- Trusted By columns: Figma lines 520/739/958/1179/1399 on the 1310px frame (the demo frame had 960) ---- */
@media (min-width:992px){
  .cfh-page .cfh-s04-grid{grid-template-columns:minmax(0,216fr) minmax(0,219fr) minmax(0,219fr) minmax(0,221fr) minmax(0,220fr) minmax(0,215fr)}
}

/* ---- slim footer (desktop): Figma lines 634/959/1289, copy 36px in (Terms sits at 38), frame ends 43px under the row.
   Below 992 the 2 x 2 footer from cdm-page 1.0.11 applies ---- */
@media (min-width:992px){
  .cfh-page .cdm-foot-row{grid-template-columns:minmax(0,330fr) minmax(0,325fr) minmax(0,330fr) minmax(0,325fr)}
  .cfh-page .cdm-foot{padding-bottom:42px}
  .cfh-page .cdm-foot-cell:nth-child(3){padding-left:37px}
}

/* ---- thank-you state (1.0.2): the embed rebuilds HubSpot's inline message, keeping its wording, into .cct-ty;
   the form box keeps its height (locked on submit) so nothing below jumps, and the block sits in its middle ---- */
.cct-hs.cct-hs-sent{display:flex;flex-direction:column;justify-content:center}
.cct-hs .submitted-message{width:100%}
.cct-hs .cct-ty{display:flex;flex-direction:column;align-items:flex-start;outline:none;animation:cct-ty-in .45s cubic-bezier(.2,.7,.2,1) both}
.cct-hs .cct-ty-mark{display:flex;align-items:center;justify-content:center;width:48px;height:48px;margin:0 0 32px;background-color:#FF5400}
.cct-hs .cct-ty-mark svg{display:block;width:24px;height:24px}
.cct-hs .cct-ty-title{margin:0;max-width:460px;font-family:'Artifictrial',var(--cfh-display);font-weight:400;font-size:36px;line-height:1.05;letter-spacing:-0.72px;color:#1D0A05;text-wrap:balance;font-variant-alternates:styleset(cdm-l)}
.cct-hs .cct-ty-text{margin:16px 0 0;max-width:460px;font-family:var(--cfh-sans);font-weight:400;font-size:16px;line-height:1.3;letter-spacing:-0.16px;color:rgba(29,10,5,.7)}
@keyframes cct-ty-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.cct-hs .cct-ty{animation:none}}
@media (max-width:767px){
  .cct-hs .cct-ty-mark{margin-bottom:24px}
  .cct-hs .cct-ty-title{font-size:30px;letter-spacing:-0.6px}
}
