@font-face{font-family:'ContentPerfect Nohemi';font-style:normal;font-weight:400;font-display:swap;src:url('./fonts/Nohemi-Regular-CrOZruC8.woff2') format('woff2')}
@font-face{font-family:'ContentPerfect Nohemi';font-style:normal;font-weight:500;font-display:swap;src:url('./fonts/Nohemi-Medium-B6_cffN2.woff2') format('woff2')}
@font-face{font-family:'ContentPerfect Instrument Serif';font-style:normal;font-weight:400;font-display:swap;src:url('./fonts/jizBRFtNs2ka5fXjeivQ4LroWlx-2zI.ttf') format('truetype')}
.cp-home-feature{--loud-orange:#cc4700;--loud-orange-deep:#ad3c00;--loud-text:#3e3e3e;--loud-dark:#1b1b1b;--loud-white:#ffffff;--loud-peach:#fedfce;--loud-cream:#f8fcda;--loud-lavender:#cedffe;--loud-font-primary:'ContentPerfect Nohemi',Arial,sans-serif;--loud-font-display:'ContentPerfect Instrument Serif',Georgia,serif;}
.cp-home-shell { margin-block: 1rem 2rem; }
.cp-home-feature { display: grid; gap: 2rem; padding: 1.5rem; border-radius: .875rem; background: var(--loud-cream); color: var(--loud-text); font-family: var(--loud-font-primary); font-weight: 400; }
.cp-home-feature, .cp-home-feature * { box-sizing: border-box; }
.cp-home-copy, .cp-home-visual { min-width: 0; }
.cp-home-feature p, .cp-home-feature ol { margin: 0; }
.cp-home-name { display: flex; align-items: center; gap: .875rem; font-size: 1.5rem; line-height: 1.25; overflow-wrap: anywhere; }
.cp-home-mark { flex: 0 0 2.5rem; color: var(--loud-orange); }
.cp-home-feature h2 { margin: 1.5rem 0; font-family: var(--loud-font-display); font-size: clamp(2.75rem, 4.7vw, 5.25rem); font-weight: 400; line-height: 1.06; letter-spacing: normal; color: var(--loud-dark); text-transform: none; }
.cp-home-description { max-width: 38rem; font-size: 1.125rem; line-height: 1.6; }
.cp-home-feature .cp-home-rhythm { max-width: 38rem; margin-top: 1rem; font-size: 1rem; line-height: 1.6; }
.cp-home-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1.5rem; margin-top: 1.75rem; }
.cp-home-feature .cp-home-primary { display: inline-flex; align-items: center; justify-content: center; min-height: 3rem; max-width: 100%; padding: .875rem 1.25rem; border: 2px solid transparent; border-radius: 100px; background: var(--loud-orange); color: var(--loud-white); font-family: var(--loud-font-primary); font-size: 1rem; font-weight: 500; line-height: 1.4; letter-spacing: normal; text-align: center; text-decoration: none; text-transform: none; transition: background-color 150ms ease; }
.cp-home-feature .cp-home-primary:visited { color: var(--loud-white); }
.cp-home-feature .cp-home-primary:hover, .cp-home-feature .cp-home-primary:active { background: var(--loud-orange-deep); color: var(--loud-white); }
.cp-home-feature .cp-home-pricing { display: inline-flex; align-items: center; min-height: 2.75rem; padding: .5rem 0; color: var(--loud-orange-deep); font-family: var(--loud-font-primary); font-size: 1rem; font-weight: 500; line-height: 1.4; text-decoration: underline; text-underline-offset: .25em; text-transform: none; }
.cp-home-feature .cp-home-pricing:hover { color: var(--loud-dark); }
.cp-home-feature a:focus-visible { outline: 3px solid var(--loud-orange-deep); outline-offset: 3px; box-shadow: 0 0 0 3px var(--loud-white); }
.cp-home-visual { align-self: center; width: 100%; max-width: 29rem; margin-inline: auto; }
.cp-home-paper { width: 88%; margin-inline: auto; border: 1px solid var(--loud-dark); border-radius: .75rem .75rem 0 0; background: var(--loud-white); }
.cp-home-paper-top { display: flex; align-items: center; gap: .25rem; padding: .75rem; border-bottom: 1px solid var(--loud-dark); color: var(--loud-text); font-size: .875rem; line-height: 1.4; }
.cp-home-paper-top span { flex: 1; padding-right: .5rem; }
.cp-home-paper-top i { flex: 0 0 .375rem; height: .375rem; border-radius: 50%; background: var(--loud-text); }
.cp-home-paper-body { padding: 1.25rem; }
.cp-home-paper-kicker { font-size: .875rem; line-height: 1.4; color: var(--loud-orange-deep); }
.cp-home-paper-body p { margin-block: .75rem 1rem; font-family: var(--loud-font-display); font-size: clamp(1.75rem, 3vw, 2.75rem); line-height: 1.1; color: var(--loud-dark); }
.cp-home-paper-line { display: block; height: .375rem; margin-top: .5rem; background: var(--loud-text); opacity: .2; border-radius: 1rem; }
.cp-home-paper-line-short { width: 65%; }
.cp-home-paper-callout { margin-top: 1.25rem; padding: 1rem; border-left: 3px solid var(--loud-orange-deep); background: var(--loud-peach); font-size: 1rem; line-height: 1.5; }
.cp-home-feature .cp-home-steps { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 0; list-style: none; border: 1px solid var(--loud-dark); border-radius: .75rem; background: var(--loud-white); overflow: hidden; }
.cp-home-steps li { display: flex; flex-direction: column; gap: .25rem; padding: .875rem .625rem; min-width: 0; font-size: 1rem; line-height: 1.4; }
.cp-home-steps li + li { border-left: 1px solid var(--loud-dark); }
.cp-home-steps li:first-child { background: var(--loud-peach); }
.cp-home-steps li:last-child { background: var(--loud-lavender); }
.cp-home-step-number { color: var(--loud-orange-deep); font-size: .875rem; }
.cp-home-steps small { font: inherit; font-size: .75rem; }
.cp-home-feature .cp-home-caption { margin-top: 1rem; font-size: .875rem; line-height: 1.5; text-align: center; }
@media (min-width: 768px) {
  .cp-home-shell { margin-block: 1rem 3rem; }
  .cp-home-feature { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 2rem; padding: 2.5rem; border-radius: 3rem; }
  .cp-home-steps li { padding: 1rem .75rem; }
}
@media (min-width: 1024px) {
  .cp-home-feature { padding: 3.5rem; gap: 3rem; }
}
@media (prefers-reduced-motion: reduce) { .cp-home-feature * { transition: none; } }
