/* Catamaran Finder page (page-catamaran-finder.php). Loads after catamaran-brokerage.css, which holds the shared .brk pieces. Scoped to .cf. */

/* hero: HH50 HONEY RYDER under sail, boxed right and fading into navy */
.w54.cf .hero::before{background-image:url(/wp-content/uploads/2026/03/2022-HH50-Catamaran-HONEY-RYDER-prolfile.jpg);background-position:42% 50%}
@media (max-width:760px){.w54.cf .hero::before{background-position:46% 50%}}
.w54.cf .band::before{background-image:url(/wp-content/uploads/2023/12/54-windelo-catamaran.jpeg);background-position:center 45%}
.w54.cf .fig-n small{font-size:.42em}

/* finder intro + form */
.cf .stack p:not(.lede) a{color:var(--accent-ink);font-weight:600}
.cf .cf-form{background:var(--surface);border:1px solid var(--line);border-top:3px solid var(--accent);border-radius:6px;padding:clamp(20px,3vw,32px)}
.cf .cf-mini{list-style:none;counter-reset:m;margin:8px 0 0;padding:0;border-top:1px solid var(--line)}
.cf .cf-mini li{counter-increment:m;display:grid;grid-template-columns:auto 1fr;column-gap:16px;padding:14px 0;border-bottom:1px solid var(--line);margin:0}
.cf .cf-mini li::before{content:counter(m);grid-row:span 2;width:30px;height:30px;border-radius:50%;background:var(--accent);color:var(--accent-ink);font:700 14px/30px var(--f-mono);text-align:center}
.cf .cf-mini b{font-family:var(--f-display);font-stretch:112%;font-size:17px;font-weight:650}
.cf .cf-mini span{color:var(--muted);font-size:15px}

/* buying guide cards */
.cf .cf-guide{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:44px}
@media (max-width:1000px){.cf .cf-guide{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.cf .cf-guide{grid-template-columns:1fr}}
.cf .trait{background:var(--surface);border:1px solid var(--line);border-top:3px solid var(--accent);border-radius:6px;padding:22px 22px 24px}
.cf .trait h3{font-size:19px;margin-bottom:10px}
.cf .trait p{color:var(--muted);font-size:15px;line-height:1.5}
.cf .alt .steps li{background:var(--bg)}
.cf .faq-wrap .lede a{color:var(--accent-ink);font-weight:600}
.cf a[href^="tel:"]{white-space:nowrap}
