/*! cdm-page 1.0.8 | /demo redesign, Figma 4343:14883 (1920 frame, content 1312 inside the cfh-frame rails) */

/* ---- hero: copy left (654) | form right (658), divider on x 958 ---- */
.cfh-page .cdm-hero{position:relative;width:100%;border-bottom:1px solid #EEEDEC}
.cfh-page .cdm-hero-grid{display:grid;grid-template-columns:minmax(0,654fr) minmax(0,658fr)}
/* insets are measured from the rail: 35 + the 1px rail = Figma's 36 */
.cfh-page .cdm-hero-copy{display:flex;flex-direction:column;justify-content:center;padding:48px 36px 48px 35px}
/* "Book your" on line 1, "Clayface demo" on line 2 at every width (the live Artific runs ~5% wider than the Figma trial font) */
/* 64px from ~1100px up; scales down on small desktops so the no-wrap line never crosses the divider */
.cfh-page .cdm-h1{margin:0;white-space:nowrap;font-family:'Artifictrial',var(--cfh-display);font-weight:400;font-size:clamp(48px,5.8vw,64px);line-height:1;letter-spacing:-0.02em;color:#1D0A05}
.cfh-page .cdm-h1-a{display:block;letter-spacing:inherit}
.cfh-page .cdm-h1-em{font-weight:600}
/* Headings use the Artifictrial faces uploaded in Webflow (TRIAL, personal-use licence; swap for licensed files before prod).
   Glyphs missing from the trial (Q ? ' - : etc.) fall back to Geist. */
/* Wherever Geist still renders, use its ss03 straight "l" like Artific's (keyed to the Geist family only). */
@font-feature-values Geist{@styleset{cdm-l:3}}
.cfh-page .cdm-h1,.cfh-page .cdm-card-title{font-variant-alternates:styleset(cdm-l)}
.cfh-page .cdm-sub{margin:20px 0 0;max-width:431px;font-family:var(--cfh-sans);font-weight:400;font-size:16px;line-height:1.3;letter-spacing:-0.16px;color:#1D0A05}
.cfh-page .cdm-hero-form{border-left:1px solid #EEEDEC;padding:32px 31px 36px}
.cfh-page .cdm-card{background-color:#F4F2EE;padding:60px 36px}
.cfh-page .cdm-card-title{margin:0 0 36px;font-family:'Artifictrial',var(--cfh-display);font-weight:400;font-size:36px;line-height:1;letter-spacing:-0.72px;color:#1D0A05}

/* ---- HubSpot v2 form, rendered with css:"" so these are the only styles ---- */
.cdm-hs form{margin:0}
.cdm-hs fieldset{max-width:none!important;border:0;margin:0;padding:0}
.cdm-hs .hs-form-field{margin:0 0 32px}
.cdm-hs .hs-form-field>label{display:block;margin:0 0 18px;font-family:var(--cfh-mono);font-weight:400;font-size:12px;line-height:14px;letter-spacing:1.2px;text-transform:uppercase;color:#1D0A05}
.cdm-hs .hs-form-required{display:none}
.cdm-hs .input{margin:0!important}
.cdm-hs .hs-input{box-sizing:border-box;display:block;width:100%!important;height:56px;margin:0;padding:0 16px;background-color:#FCFBF8;border:1px solid #E2E0DB;border-radius:0;box-shadow:none;font-family:var(--cfh-sans);font-size:16px;line-height:1.3;color:#1D0A05;-webkit-appearance:none;appearance:none}
.cdm-hs .hs-input:focus{outline:none;border-color:#1D0A05}
.cdm-hs .hs-input.invalid.error{border-color:#D93A00}
.cdm-hs .hs-error-msgs{list-style:none;margin:8px 0 0;padding:0}
.cdm-hs .hs-error-msgs label,.cdm-hs .hs-error-msg{margin:0;font-family:var(--cfh-sans);font-weight:400;font-size:13px;line-height:1.3;letter-spacing:0;text-transform:none;color:#D93A00}
.cdm-hs .hs_error_rollup{display:none}
/* company is filled from the email domain by the embed script (design shows name + email only) */
.cdm-hs.cdm-co-auto .hs_company{display:none}
/* invisible reCAPTCHA: keep it rendered (it still runs) but take it out of the layout, as the old /demo did */
.cdm-hs .hs_recaptcha{height:0;margin:0;overflow:hidden}
.cdm-hs .hs-submit .actions{margin:0;padding:0}
.cdm-hs input[type="submit"]{display:inline-block;box-sizing:border-box;min-width:173px;min-height:36px;margin:0;padding:8px 31px 8px 16px;border:0;border-radius:0;cursor:pointer;
  background:#FF5400 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M7.51513 5.11722L10.89 8.71702C10.9249 8.75416 10.9525 8.79828 10.9714 8.84683C10.9903 8.89539 11 8.94744 11 9C11 9.05256 10.9903 9.10461 10.9714 9.15317C10.9525 9.20172 10.9249 9.24584 10.89 9.28298L7.51513 12.8828C7.44477 12.9578 7.34934 13 7.24983 13C7.15032 13 7.05489 12.9578 6.98452 12.8828C6.91416 12.8077 6.87463 12.7059 6.87463 12.5998C6.87463 12.4937 6.91416 12.3919 6.98452 12.3168L9.71959 9.39998L2.37499 9.39998C2.27553 9.39998 2.18016 9.35784 2.10983 9.28283C2.03951 9.20782 2 9.10608 2 9C2 8.89392 2.03951 8.79218 2.10983 8.71717C2.18016 8.64216 2.27553 8.60002 2.37499 8.60002L9.71959 8.60002L6.98452 5.68318C6.91416 5.60813 6.87463 5.50634 6.87463 5.4002C6.87463 5.29406 6.91416 5.19227 6.98452 5.11722C7.05489 5.04216 7.15032 5 7.24983 5C7.34934 5 7.44477 5.04216 7.51513 5.11722Z' fill='%23FCFBF8' stroke='%23FCFBF8' stroke-width='0.2'/%3E%3C/svg%3E") no-repeat right 11px center/16px 16px;
  color:#FCFBF8;font-family:var(--cfh-mono);font-weight:400;font-size:14px;line-height:19.6px;letter-spacing:0;-webkit-appearance:none;appearance:none;transition:background-color .18s ease-out}
.cdm-hs input[type="submit"]:hover{background-color:#E64B00}
.cdm-hs .legal-consent-container,.cdm-hs .hs-richtext{font-family:var(--cfh-sans);font-size:13px;line-height:1.4;color:rgba(29,10,5,.6)}
.cdm-hs .submitted-message{font-family:var(--cfh-sans);font-size:16px;line-height:1.3;color:#1D0A05}

/* ---- slim footer: 4 equal cells, copy at 36px in, row 73 tall, 26px below it ---- */
.cfh-page .cdm-foot{position:relative;width:100%;padding-bottom:25px}
.cfh-page .cdm-foot-row{display:grid;grid-template-columns:minmax(0,329fr) minmax(0,327fr) minmax(0,328fr) minmax(0,326fr);border-bottom:1px solid #EEEDEC}
.cfh-page .cdm-foot-cell{box-sizing:border-box;min-height:72px;padding:25px 36px 26px 35px}
.cfh-page .cdm-foot-cell+.cdm-foot-cell{border-left:1px solid #EEEDEC}
.cfh-page .cdm-foot-copy,.cfh-page .cdm-foot-link{margin:0;font-family:var(--cfh-sans);font-weight:400;font-size:16px;line-height:21px;letter-spacing:-0.16px}
.cfh-page .cdm-foot-copy{color:#B7B5B2}
.cfh-page .cdm-foot-link{color:rgba(42,42,42,.65);text-decoration:none;transition:color .18s ease-out}
.cfh-page .cdm-foot-link:hover{color:#1D0A05}

/* Trusted By grid, this page only (desktop): Figma's row/column lines 624/753/878 and 520/739/960/1179/1399
   on a 1310px frame, label 36px from the rail, square mark 3.5px right of its cell centre */
@media (min-width:992px){
  .cfh-page .cfh-s04-grid{grid-template-rows:129px 125px;grid-template-columns:minmax(0,216fr) minmax(0,219fr) minmax(0,221fr) minmax(0,219fr) minmax(0,220fr) minmax(0,215fr)}
  .cfh-page .cfh-s04-cell-label{padding-left:52px}
  .cfh-page .cfh-s04-w-squareicon{position:relative;left:3.5px}
}

/* ---- tablet: stack, form under the copy ---- */
@media (max-width:991px){
  .cfh-page .cdm-hero-grid{grid-template-columns:minmax(0,1fr)}
  .cfh-page .cdm-hero-copy{padding:64px 32px 48px}
  .cfh-page .cdm-h1{font-size:56px}
  .cfh-page .cdm-sub{max-width:560px}
  .cfh-page .cdm-hero-form{border-left:0;border-top:1px solid #EEEDEC;padding:32px}
  .cfh-page .cdm-foot-cell{padding:24px 32px}
}
/* ---- phones ---- */
@media (max-width:767px){
  .cfh-page .cdm-hero-copy{padding:48px 24px 36px}
  .cfh-page .cdm-h1{font-size:44px}
  .cfh-page .cdm-hero-form{padding:24px}
  .cfh-page .cdm-card{padding:40px 24px}
  .cfh-page .cdm-card-title{font-size:30px;letter-spacing:-0.6px;margin-bottom:28px}
  .cdm-hs .hs-form-field{margin-bottom:24px}
  .cfh-page .cdm-foot-row{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cfh-page .cdm-foot-cell{min-height:0;padding:20px 24px}
  .cfh-page .cdm-foot-cell:nth-child(3){border-left:0}
  .cfh-page .cdm-foot-cell:nth-child(n+3){border-top:1px solid #EEEDEC}
}
@media (max-width:479px){
  .cfh-page .cdm-hero-copy{padding:40px 20px 32px}
  .cfh-page .cdm-h1{font-size:38px;white-space:normal}
  .cfh-page .cdm-hero-form{padding:16px}
  .cfh-page .cdm-card{padding:32px 20px}
  .cdm-hs input[type="submit"]{width:100%;text-align:left}
  .cfh-page .cdm-foot-row{grid-template-columns:minmax(0,1fr)}
  .cfh-page .cdm-foot-cell+.cdm-foot-cell{border-left:0;border-top:1px solid #EEEDEC}
  .cfh-page .cdm-foot-cell{padding:16px 20px}
}
