/*! cpf-form 1.0.2 | product-page "Coverage Gap Report" form section (section.cpf-sec), shared by
   /product/consumer-intelligence (Figma 4757:30152, group 4820:13369) and /product/trend-innovation-intelligence (4757:39389).
   1920 geometry: 119px gap under the tabs, ruled box 305..1616 x 5249..6022, divider on x 959; left column text at 341
   (heading top 92 below the rule); right column = #F4F2EE panel 594 x 708 inset 32/31, panel padding 60/36.
   Native Webflow form (labels + inputs + submit made in the Designer data API), so webflow.css form defaults are reset here. */

.cfh-page .cpf-sec{padding-top:119px}
.cfh-page .cpf-grid{display:grid;grid-template-columns:minmax(0,654fr) minmax(0,657fr);border-top:1px solid #EEEDEC;border-bottom:1px solid #EEEDEC}
.cfh-page .cpf-left{min-width:0;padding:92px 12px 48px 36px}   /* text at 341; the heading may run to 12px off the divider */
.cfh-page .cpf-right{min-width:0;border-left:1px solid #EEEDEC;padding:32px 31px 31px 31px}

/* ---- left column ---- */
.cfh-page .cpf-h2{margin:0;max-width:579px;font-family:var(--cfh-display);font-weight:600;font-size:48px;line-height:48px;letter-spacing:-0.96px;color:#1D0A05}
.cfh-page .cpf-sub{margin:20px 0 0;max-width:582px;font-family:var(--cfh-sans);font-weight:400;font-size:16px;line-height:20.8px;letter-spacing:-0.16px;color:#1D0A05}
.cfh-page .cpf-stats{display:flex;flex-direction:column;gap:52px;margin-top:77px}
.cfh-page .cpf-stat-num{margin:0;font-family:var(--cfh-sans);font-weight:600;font-size:48px;line-height:62px;letter-spacing:-0.48px;color:#1D0A05}
.cfh-page .cpf-stat-label{margin:0;font-family:var(--cfh-sans);font-weight:400;font-size:16px;line-height:21px;letter-spacing:-0.16px;color:#1D0A05}
.cfh-page .cpf-built{margin-top:66px}
.cfh-page .cpf-mark{display:block;width:55px;height:35px}
.cfh-page .cpf-built-t{margin:13px 0 0;font-family:var(--cfh-sans);font-weight:400;font-size:16px;line-height:21px;letter-spacing:-0.16px;color:#1D0A05}

/* ---- right column: panel + native form ---- */
.cfh-page .cpf-panel{background-color:#F4F2EE;padding:60px 36px}
.cfh-page .cpf-h3{margin:0 0 36px;font-family:var(--cfh-display);font-weight:400;font-size:36px;line-height:36px;letter-spacing:-0.72px;color:#1D0A05}
.cfh-page .cpf-panel .w-form{margin:0}
.cfh-page .cpf-panel form{margin:0}
.cfh-page .cpf-panel 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}
.cfh-page .cpf-panel .w-input{display:block;width:100%;height:56px;margin:0 0 32px;padding:0 16px;border:1px solid #E2E0DB;border-radius:0;background-color:#FCFBF8;box-shadow:none;font-family:var(--cfh-sans);font-size:16px;line-height:20px;letter-spacing:-0.16px;color:#1D0A05;transition:border-color 150ms ease}
.cfh-page .cpf-panel .w-input:hover{border-color:#C9C6BF}
.cfh-page .cpf-panel .w-input:focus{border-color:#1D0A05;outline:0}
.cfh-page .cpf-panel .w-input:focus-visible{outline:2px solid #FF5400;outline-offset:1px}
.cfh-page .cpf-panel input[type="submit"]{-webkit-appearance:none;appearance:none;display:block;width:auto;height:36px;margin:0;padding:0 29px 0 16px;border:0;border-radius:0;background:#FF5400 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='8' viewBox='0 0 9 8'%3E%3Cpath fill='%23FCFBF8' d='M5.2.3 8.6 3.7a.4.4 0 0 1 0 .6L5.2 7.7a.4.4 0 0 1-.6-.6L7.3 4.4H.5a.4.4 0 0 1 0-.8h6.8L4.6.9a.4.4 0 0 1 .6-.6Z'/%3E%3C/svg%3E") no-repeat right 16px center/9px 8px;font-family:var(--cfh-mono);font-weight:400;font-size:14px;line-height:20px;letter-spacing:0;color:#FCFBF8;text-align:left;cursor:pointer;transition:background-color 150ms ease}
.cfh-page .cpf-panel input[type="submit"]:hover{background-color:#E64C00}
.cfh-page .cpf-panel input[type="submit"]:focus-visible{outline:2px solid #1D0A05;outline-offset:2px}
.cfh-page .cpf-panel .w-form-done{margin:0;padding:24px;border:1px solid #E2E0DB;background-color:#FCFBF8;text-align:left;font-family:var(--cfh-sans);font-size:16px;line-height:21px;letter-spacing:-0.16px;color:#1D0A05}
.cfh-page .cpf-panel .w-form-fail{margin:16px 0 0;padding:12px 16px;background-color:#FCE7DD;font-family:var(--cfh-sans);font-size:14px;line-height:19px;color:#1D0A05}

/* ---- 992..1439: the left column is narrower than at 1920, so the 48px heading scales down (2 lines from ~1300px)
   and balances where it still needs 3 (no single word left on the last line) ---- */
@media (min-width:992px) and (max-width:1439px){
  .cfh-page .cpf-h2{font-size:clamp(36px,3.33vw,48px);line-height:1;letter-spacing:-0.02em;text-wrap:balance}
  .cfh-page .cpf-sub{text-wrap:pretty}   /* 1.0.2: no single word ("up.") on the last line */
}

/* ---- tablet + phones: one column, text first, the panel under it ---- */
@media (max-width:991px){
  .cfh-page .cpf-sec{padding-top:88px}
  .cfh-page .cpf-grid{grid-template-columns:minmax(0,1fr)}
  .cfh-page .cpf-left{padding:64px 32px 48px}
  .cfh-page .cpf-right{border-left:0;padding:0 32px 32px}
  .cfh-page .cpf-h2{max-width:640px;font-size:40px;line-height:42px;letter-spacing:-0.8px;text-wrap:balance}
  .cfh-page .cpf-sub{max-width:560px;text-wrap:pretty}
  .cfh-page .cpf-stats{flex-direction:row;flex-wrap:wrap;gap:24px 56px;margin-top:48px}
  .cfh-page .cpf-built{margin-top:48px}
  .cfh-page .cpf-panel{padding:48px 32px}
}
@media (max-width:767px){
  .cfh-page .cpf-sec{padding-top:64px}
  .cfh-page .cpf-left{padding:56px 24px 40px}
  .cfh-page .cpf-right{padding:0 24px 24px}
  .cfh-page .cpf-h2{font-size:32px;line-height:34px;letter-spacing:-0.64px}
  .cfh-page .cpf-sub{line-height:22px}
  .cfh-page .cpf-stat-num{font-size:40px;line-height:52px;letter-spacing:-0.4px}
  .cfh-page .cpf-panel{padding:40px 24px}
  .cfh-page .cpf-h3{margin-bottom:32px;font-size:32px;line-height:32px;letter-spacing:-0.64px}
  .cfh-page .cpf-panel .w-input{margin-bottom:24px}
}
@media (max-width:479px){
  .cfh-page .cpf-left{padding:48px 20px 32px}
  .cfh-page .cpf-right{padding:0 16px 16px}
  .cfh-page .cpf-h2{font-size:30px;line-height:33px;letter-spacing:-0.6px}
  .cfh-page .cpf-stats{gap:20px 40px}
  .cfh-page .cpf-panel{padding:32px 16px}
  .cfh-page .cpf-panel input[type="submit"]{width:100%}
}
/* the 28-character mono label needs 280px; below 360 the panel is narrower, so the label drops to 12px */
@media (max-width:359px){
  .cfh-page .cpf-panel input[type="submit"]{font-size:12px;padding-right:27px}
}
