/* a5 — Guided Intake: white, royal blue, mint. The three-step picker IS the hero. */
:root {
  --fy-bg: #ffffff; --fy-surface: #f1f5fb; --fy-surface-2: #e4ebf7; --fy-text: #0f172a; --fy-muted: #526077; --fy-border: #dbe3ef;
  --fy-primary: #1d4ed8; --fy-primary-ink: #ffffff; --fy-accent: #1d4ed8; --fy-accent-ink: #ffffff; --fy-ok: #10b981;
  --fy-radius: 14px; --fy-radius-lg: 22px; --fy-shadow: 0 12px 34px rgba(29,78,216,.10); --fy-shadow-lg: 0 30px 70px rgba(15,23,42,.16);
  --fy-font-display: 'Plus Jakarta Sans', system-ui, sans-serif; --fy-font-body: 'Plus Jakarta Sans', system-ui, sans-serif;
  --fy-header-bg: rgba(255,255,255,.92); --fy-header-text: #0f172a; --fy-footer-bg: #0f172a; --fy-footer-text: #cbd5e1;
  --fy-hero-bg: #f1f5fb; --fy-hero-text: #0f172a; --fy-cta-bg: #1d4ed8; --fy-cta-text: #ffffff;
}
h1, h2, h3 { font-weight: 800; letter-spacing: -.02em; }
.fy-header { backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.fy-kicker { color: var(--fy-primary); }
.fy-btn { border-radius: 999px; }
.fy-card { border-radius: 22px; }
.fy-btn--ghost { color: var(--fy-text); }

/* hero */
.a5-hero { background: radial-gradient(900px 500px at 0% 0%, #dbeafe, transparent 60%), radial-gradient(700px 400px at 100% 100%, #d1fae5, transparent 60%), var(--fy-hero-bg); }
.a5-hero__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(360px, 560px); gap: clamp(28px, 5vw, 72px); align-items: center; padding-top: clamp(44px, 6vw, 80px); padding-bottom: clamp(44px, 6vw, 80px); }
.a5-hero__copy .fy-hero__title { font-size: clamp(2.2rem, 4vw, 3.6rem); }
.a5-hero__copy .fy-badges { margin-top: 26px; }
.a5-hero__wizard .fy-form-card { border: 0; padding: 30px; }
.a5-hero__wizard .fy-form-card__h { font-size: 1.6rem; }
.fy-wizard__q { margin: 0 0 14px; font-size: 1.1rem; }
.fy-tile { border-radius: 16px; }
.fy-tile svg { color: var(--fy-primary); }
@media (max-width: 1023px) { .a5-hero__grid { grid-template-columns: 1fr; } }

/* steps with connector */
.a5-steps { position: relative; }
.a5-steps .fy-step { text-align: center; border: 0; background: var(--fy-surface); }
.a5-steps .fy-step__num { width: 56px; height: 56px; border-radius: 50%; background: var(--fy-primary); color: #fff; display: grid; place-items: center; font-size: 1.4rem; margin: 0 auto 14px; font-family: var(--fy-font-body); }

/* areas as checklists */
.fy-area-card--check { border: 0; background: var(--fy-bg); box-shadow: var(--fy-shadow); }
.fy-area-card--check ul { flex-direction: column; gap: 4px; }
.fy-area-card--check ul a { background: transparent; border: 0; padding: 4px 0 4px 26px; position: relative; font-size: .92rem; border-radius: 0; }
.fy-area-card--check ul a::before { content: ''; position: absolute; left: 0; top: .55em; width: 16px; height: 16px; border-radius: 50%; background: var(--fy-ok); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm-1.2 14.6-4.1-4.1 1.5-1.5 2.6 2.6 5.6-5.6 1.5 1.5-7.1 7.1z'/%3E%3C/svg%3E") center/contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm-1.2 14.6-4.1-4.1 1.5-1.5 2.6 2.6 5.6-5.6 1.5 1.5-7.1 7.1z'/%3E%3C/svg%3E") center/contain no-repeat; }
.fy-area-card--check ul a:hover { color: var(--fy-primary); background: transparent; }

/* compare */
.a5-compare { overflow-x: auto; border-radius: 22px; box-shadow: var(--fy-shadow); }
.a5-compare table { width: 100%; border-collapse: collapse; min-width: 640px; background: var(--fy-bg); }
.a5-compare th, .a5-compare td { padding: 16px 18px; text-align: left; border-bottom: 1px solid var(--fy-border); vertical-align: top; }
.a5-compare thead th { background: var(--fy-primary); color: #fff; font-size: .9rem; letter-spacing: .04em; }
.a5-compare tbody th { font-weight: 700; width: 26%; }
.a5-yes { color: #065f46; background: #ecfdf5; font-weight: 600; }
.a5-yes svg { vertical-align: -3px; margin-right: 4px; }
.a5-no { color: var(--fy-muted); }

/* props sidebar */
.a5-props { display: grid; gap: 14px; }
.a5-props .fy-card { padding: 20px; }
.a5-props h3 { font-size: 1.05rem; }

/* interior */
.ph-chips .fy-hero__title { font-size: clamp(2rem, 3.8vw, 3.2rem); }
.fy-quiz { background: #ecfdf5; }
.fy-quiz__row button.is-on { background: var(--fy-primary); }
.fy-callout { background: var(--fy-primary); border-radius: 22px; }
.fy-callout .fy-btn--accent { background: #fff; color: var(--fy-primary); }
.fy-cta-band { background: linear-gradient(135deg, #1d4ed8, #4338ca); }
.fy-cta-band .fy-btn--accent { background: #fff; color: var(--fy-primary); }
.fy-cta-band .fy-btn--ghost { color: #fff; }
.fy-popin__panel { border-radius: 26px !important; }
@media (max-width: 767px) { .fy-popin__panel { border-radius: 26px 26px 0 0 !important; } }
.fy-sticky__btn--primary { background: var(--fy-primary); }
