/* ============================================================
   EAGLE LOAN FINDER — dedicated conversational funnel
   Scoped: .elf-* only. Designed to sit natively within Eagles Funding.
   ============================================================ */
:root { --elf-blue:#00B0F0; --elf-blue-deep:#0A6FAE; --elf-gold:#F0B000; --elf-purple:#8B5CF6; --elf-teal:#14B8A6; }
.elf-hero{position:relative;isolation:isolate;overflow:hidden;color:#EAF6FF;background:radial-gradient(780px 470px at 78% 18%,rgba(0,176,240,.35),transparent 58%),radial-gradient(580px 340px at 13% 105%,rgba(240,176,0,.2),transparent 55%),linear-gradient(135deg,#081018 0%,#091B2B 49%,#0A6FAE 160%);}
.elf-hero-grid{position:absolute;inset:0;opacity:.24;background-image:linear-gradient(rgba(255,255,255,.11) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.11) 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(90deg,#000 0%,transparent 72%);}
.elf-hero-inner{min-height:clamp(360px,35vw,470px);position:relative;display:grid;grid-template-columns:minmax(0,1.02fr) minmax(300px,.98fr);align-items:center;padding-top:clamp(42px,5vw,76px);padding-bottom:clamp(42px,5vw,76px)}
.elf-hero-copy{position:relative;z-index:2;max-width:720px}.elf-kicker,.elf-micro{font:700 12px/1.3 var(--font-display);letter-spacing:.18em;text-transform:uppercase}.elf-micro{color:var(--elf-blue-deep)}.elf-save .elf-micro{color:#AEE9FF}.elf-kicker{color:#AEE9FF;display:flex;align-items:center;gap:9px;margin-bottom:18px}.elf-kicker-dot{width:9px;height:9px;border-radius:50%;background:var(--elf-gold);box-shadow:0 0 0 6px rgba(240,176,0,.14),0 0 20px rgba(240,176,0,.82)}
.elf-hero h1{margin:0 0 18px;color:#fff;font-size:clamp(38px,5.25vw,70px);letter-spacing:-.055em;max-width:650px}.elf-hero h1 em{font-style:normal;color:var(--elf-gold);text-shadow:0 0 22px rgba(240,176,0,.25)}.elf-hero-copy>p:not(.elf-kicker){max-width:648px;color:#D6ECFA;font-size:clamp(16px,1.45vw,18px);line-height:1.7}
.elf-trust{display:flex;gap:clamp(14px,3.2vw,42px);margin:26px 0 0;padding:0;list-style:none}.elf-trust li{position:relative;display:grid;gap:1px;padding-left:13px;border-left:2px solid var(--elf-gold)}.elf-trust strong{font:700 13px/1.3 var(--font-display);color:#fff}.elf-trust span{color:#E2F3FC;font-size:12px}.elf-hero-eagle{position:relative;align-self:stretch;min-height:300px;z-index:1}.elf-hero-eagle img{position:absolute;right:-10%;bottom:-23%;width:min(600px,53vw);max-width:none;filter:drop-shadow(0 20px 40px rgba(0,0,0,.4)) drop-shadow(0 0 24px rgba(0,176,240,.4));animation:elfEagleFloat 6.8s ease-in-out infinite}.elf-eagle-halo{position:absolute;width:360px;height:360px;right:9%;top:8%;border-radius:50%;background:radial-gradient(circle,rgba(0,176,240,.25),rgba(0,176,240,.05) 45%,transparent 70%);filter:blur(5px)}.elf-orbit{position:absolute;border:1px solid rgba(174,233,255,.32);border-radius:50%;transform:rotate(-20deg)}.elf-orbit-one{width:300px;height:110px;right:10%;top:33%}.elf-orbit-two{width:370px;height:155px;right:1%;top:25%;border-color:rgba(240,176,0,.26)}
.elf-app-section{padding:clamp(44px,6vw,76px) 0 var(--section-pad);background:linear-gradient(180deg,#F6FBFE 0%,#fff 48%,#EDF8FD 100%);overflow-x:clip}.elf-text-btn{border:0;padding:7px 0;background:transparent;color:var(--elf-blue-deep);font:700 14px var(--font-display);cursor:pointer}.elf-text-btn:hover{text-decoration:underline;color:#075784}
.elf-path-wrap{padding:clamp(20px,3vw,30px);border:1px solid #D5EAF4;border-radius:20px 20px 0 0;background:#fff}.elf-path-heading{display:flex;justify-content:space-between;gap:20px;align-items:end;margin-bottom:22px}.elf-path-heading h2{font-size:clamp(21px,2.3vw,28px);color:#081018;letter-spacing:-.04em}.elf-path-heading span{display:block;margin-top:3px;font-size:13px;color:var(--muted)}.elf-path-heading>p{margin:0;padding-bottom:4px;color:var(--muted);font:600 13px var(--font-display)}
.elf-path{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin:0;padding:0;list-style:none}
.elf-path li{min-width:0;min-height:88px;position:relative;padding:15px 13px 12px 48px;border:1px solid #E4EBF0;border-radius:13px;background:#F9FBFC;color:#5E7484;transition:.2s ease}.elf-path-icon{position:absolute;left:13px;top:16px;display:grid;place-items:center;width:25px;height:25px;border-radius:50%;background:#DDE6EB;color:#45606F;font:700 12px var(--font-display)}.elf-path-label{display:block;font:700 10px/1.2 var(--font-display);letter-spacing:.11em}.elf-path b{display:block;margin-top:6px;color:#5A7284;font:600 12px/1.25 var(--font-body)}.elf-path li.is-current{border-color:var(--elf-blue);background:#EAF9FF;box-shadow:0 7px 18px rgba(0,176,240,.12)}.elf-path li.is-current:not(.is-complete) .elf-path-icon{background:var(--elf-blue);color:#081018}.elf-path li.is-current .elf-path-label,.elf-path li.is-current b{color:#0878A5}.elf-path li[data-path="propertyUse"].is-current{border-color:var(--elf-teal);background:#EDFCF9}.elf-path li[data-path="propertyUse"].is-current:not(.is-complete) .elf-path-icon{background:var(--elf-teal);color:#081018}.elf-path li[data-path="propertyUse"].is-current .elf-path-label,.elf-path li[data-path="propertyUse"].is-current b{color:#0B6F65}.elf-path li[data-path="documentation"].is-current{border-color:var(--elf-gold);background:#FFF8E9}.elf-path li[data-path="documentation"].is-current:not(.is-complete) .elf-path-icon{background:var(--elf-gold);color:#081018}.elf-path li[data-path="documentation"].is-current .elf-path-label,.elf-path li[data-path="documentation"].is-current b{color:#8A6500}.elf-path li[data-path="programPreference"].is-current{border-color:var(--elf-purple);background:#F5F1FF}.elf-path li[data-path="programPreference"].is-current:not(.is-complete) .elf-path-icon{background:var(--elf-purple);color:#081018}.elf-path li[data-path="programPreference"].is-current .elf-path-label,.elf-path li[data-path="programPreference"].is-current b{color:#6741B5}.elf-path li.is-complete{background:#fff}.elf-path li.is-complete .elf-path-icon{background:#1B9C77;color:transparent}.elf-path li.is-complete .elf-path-icon:after{content:'✓';color:#fff;font-size:14px}.elf-path li.is-complete b{color:#17354A}.elf-progress{height:6px;overflow:hidden;background:#DCE8EE}.elf-progress span{display:block;width:25%;height:100%;background:linear-gradient(90deg,var(--elf-blue),#59D0FB);transition:width .28s ease}
.elf-question-shell{position:relative;min-height:420px;padding:clamp(28px,4.5vw,60px);border:1px solid #D5EAF4;border-top:0;border-radius:0 0 20px 20px;background:#fff;box-shadow:0 18px 40px -28px rgba(4,64,94,.28)}.elf-assistant{display:flex;align-items:center;gap:10px;margin-bottom:clamp(25px,3vw,38px)}/* Optical centring for the badge glyph. Sora's font box is 16/5 (ascent/descent) but a
   capital E inks only 13/0, so place-items:center centres the LINE BOX, leaving the E
   1px high (8px above, 10px below in a 31px box). With box-sizing:border-box a 2px
   padding-top shrinks the content box to 29px, putting the baseline at y=22 and the cap
   at 9..22 -> an even 9px above and 9px below. Line-height cannot fix this: the baseline
   formula (H-LH)/2 + (LH-(A+D))/2 + A cancels LH out entirely.
   NOTE: text-box-trim:trim-both cap alphabetic computes but does NOT render here
   (verified: identical pixels on/off), so an explicit padding nudge is used instead. */
.elf-assistant .elf-assistant-mark{display:grid;place-items:center;width:31px;height:31px;flex:0 0 31px;padding-top:2px;border-radius:9px;background:linear-gradient(140deg,#0079A8,#006C9C);color:#fff;font:800 17px/1 var(--font-display);box-shadow:0 5px 12px rgba(0,176,240,.25)}.elf-assistant b{display:block;color:#0A6FAE;font:700 11px/1.2 var(--font-display);letter-spacing:.14em}.elf-assistant span:not(.elf-assistant-mark){display:block;color:#52697A;font-size:11px}.elf-question-title{max-width:760px;margin:0 0 7px;color:#081018;font-size:clamp(28px,4vw,46px);letter-spacing:-.045em}.elf-question-help{margin:0 0 28px;color:var(--muted);font-size:16px}.elf-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;max-width:940px}.elf-option{position:relative;display:flex;align-items:flex-start;gap:13px;min-height:94px;padding:18px;border:1.5px solid #D9E4EA;border-radius:14px;background:#fff;cursor:pointer;transition:border-color .17s,transform .17s,box-shadow .17s}.elf-option:hover{transform:translateY(-2px);border-color:#83D8F6;box-shadow:0 10px 22px -16px rgba(0,137,189,.45)}.elf-option:has(input:focus-visible){outline:3px solid rgba(0,176,240,.35);outline-offset:2px}.elf-option input{position:absolute;opacity:0;pointer-events:none}.elf-option-mark{display:grid;place-items:center;flex:0 0 25px;width:25px;height:25px;margin-top:1px;border:2px solid #ADC3D0;border-radius:50%;color:transparent}.elf-option input:checked~.elf-option-mark{border-color:var(--elf-blue);background:var(--elf-blue);color:#fff}.elf-option-mark:after{content:'✓';font-size:13px;font-weight:800}.elf-option strong{display:block;color:#162D3D;font:700 15px/1.25 var(--font-display)}.elf-option small{display:block;margin-top:5px;color:#5A6E7B;font-size:13px;line-height:1.4}.elf-option:has(input:checked){border-color:var(--elf-blue);background:#F0FBFF;box-shadow:0 9px 22px -18px rgba(0,176,240,.55)}.elf-controls{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;margin-top:clamp(30px,5vw,52px)}.elf-controls .btn:disabled,.elf-controls .btn:disabled:hover{background:#C9D6DE;color:#3E5563;opacity:1;box-shadow:none;transform:none;cursor:not-allowed}.elf-controls .btn:disabled::before{transform:scaleX(0)}.elf-loading{display:grid;place-items:center;min-height:200px;color:#527183;font:600 15px var(--font-display)}
.elf-results{padding:clamp(30px,5vw,60px);border:1px solid #D5EAF4;border-radius:20px;background:#fff;box-shadow:0 18px 40px -28px rgba(4,64,94,.28)}.elf-results-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:28px}.elf-results h2{margin:5px 0 10px;font-size:clamp(30px,4vw,46px);color:#081018}.elf-results-head p:not(.elf-micro){max-width:650px;margin:0;color:var(--muted)}.elf-results-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.elf-result-card{position:relative;overflow:hidden;padding:24px;border:1px solid #DDE8EF;border-radius:17px;background:#fff}.elf-result-card:before{content:'';position:absolute;inset:0 auto 0 0;width:5px;background:var(--result-color,#00B0F0)}.elf-result-card.is-first{border-color:var(--result-color,#00B0F0);box-shadow:0 16px 30px -24px color-mix(in srgb,var(--result-color,#00B0F0) 70%,transparent)}.elf-result-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.elf-result-card h3{margin:11px 0 7px;font-size:23px;color:#0C1F2E}.elf-result-card>p{font-size:14px;color:#596F7D}.elf-pill,.elf-rank{display:inline-flex;align-items:center;padding:5px 9px;border-radius:999px;font:700 10px/1.2 var(--font-display);letter-spacing:.08em;text-transform:uppercase}.elf-pill{background:color-mix(in srgb,var(--result-color,#00B0F0) 13%,white);color:var(--result-color,#00B0F0)}.elf-rank{background:#081018;color:#fff}.elf-reason{padding:12px 0;border-top:1px solid #E4EDF2}.elf-reason b{display:block;margin-bottom:4px;color:#537081;font:700 10px var(--font-display);letter-spacing:.1em}.elf-reason span{color:#253D4D;font-size:13px;line-height:1.45}.elf-card-actions{display:flex;gap:10px;margin-top:16px}.elf-card-actions .btn{padding:10px 13px;font-size:12px}.elf-disclosure{margin-top:24px;padding:17px 18px;border-left:4px solid var(--elf-gold);border-radius:0 12px 12px 0;background:#FFF9EA;color:#5A4C28}.elf-disclosure strong{font:700 13px var(--font-display);color:#5D4800}.elf-disclosure p{margin:6px 0 0;font-size:12px;line-height:1.55}.elf-save{display:grid;grid-template-columns:minmax(220px,.75fr) minmax(0,1.25fr);gap:clamp(24px,5vw,58px);margin-top:28px;padding:clamp(25px,4vw,42px);border-radius:17px;background:radial-gradient(440px 250px at 100% 0%,rgba(0,176,240,.16),transparent 64%),linear-gradient(135deg,#081018,#0C2638)}.elf-save h3{margin:8px 0 12px;color:#fff;font-size:27px}.elf-save-intro>p:not(.elf-micro):not(.elf-save-includes){color:#D1E2EC;font-size:14px}.elf-contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.elf-contact-grid label,.elf-contact-methods,.elf-consent{color:#EAF6FF;font:600 12px var(--font-display)}.elf-contact-grid label:last-child{grid-column:1/-1}.elf-contact-grid input{display:block;width:100%;margin-top:6px;padding:12px 13px;border:1px solid rgba(255,255,255,.28);border-radius:9px;background:#fff;color:#081018;font:400 15px var(--font-body)}.elf-contact-grid input:focus{outline:3px solid rgba(0,176,240,.38);border-color:#00B0F0}.elf-contact-methods{display:flex;flex-wrap:wrap;gap:11px 18px;margin:18px 0;padding:0;border:0}.elf-contact-methods legend{width:100%;margin-bottom:2px}.elf-contact-methods label{display:inline-flex;align-items:center;gap:7px;font-family:var(--font-body);font-weight:400}.elf-contact-methods input,.elf-consent input{width:17px;height:17px;accent-color:#00B0F0}.elf-consent{display:flex;gap:10px;align-items:flex-start;margin-bottom:16px;font:400 11px/1.55 var(--font-body);color:#D9E9F2}.elf-consent b{display:block;margin-bottom:2px;color:#fff;font:700 10px var(--font-display);letter-spacing:.1em}.elf-turnstile{min-height:48px;margin-bottom:13px;color:#A9C6D5;font-size:11px}.elf-turnstile .cf-turnstile{min-height:65px}.elf-form-error{margin:0 0 12px;padding:10px 12px;border-radius:9px;background:#49252A;color:#FFE5E7;font-size:13px}.elf-save-fine{margin:11px 0 0;color:#AFC8D6;font-size:10px;line-height:1.45}.elf-hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0!important}.elf-success{max-width:720px;margin:0 auto;padding:clamp(44px,7vw,76px) clamp(22px,6vw,80px);border:1px solid #D5EAF4;border-radius:20px;background:#fff;text-align:center;box-shadow:0 18px 40px -28px rgba(4,64,94,.28)}.elf-success-check{display:grid;place-items:center;width:68px;height:68px;margin:0 auto 20px;border-radius:50%;background:#E5FBF4;color:#15946E;font:800 34px var(--font-display);box-shadow:0 0 0 12px #F2FFFA}.elf-success h2{margin:7px 0;color:#081018;font-size:clamp(28px,4vw,40px)}.elf-success strong{display:block;margin:12px 0;font:800 clamp(28px,4vw,44px) var(--font-display);letter-spacing:.06em;color:#0A6FAE}.elf-success>p:not(.elf-micro){max-width:490px;margin:0 auto 25px;color:#5F7484}.elf-success>div{display:flex;justify-content:center;flex-wrap:wrap;gap:12px}
.elf-save-intro>.elf-save-includes{margin:18px 0 0;padding:13px 15px;border-left:3px solid var(--elf-gold);border-radius:0 10px 10px 0;background:#FFF9EA;color:#5A4C28;font-size:13px;line-height:1.5;font-weight:400}
.elf-save-intro>.elf-save-includes b{color:#0C1F2E;font-family:var(--font-display);font-weight:700}
@keyframes elfEagleFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-13px)}}
@media (max-width:1080px){.elf-hero-inner{grid-template-columns:1fr;min-height:auto}.elf-hero-eagle{position:absolute;inset:0;opacity:.3;pointer-events:none}.elf-hero-eagle img{right:-15%;bottom:-39%;width:min(620px,95vw)}.elf-hero-copy{padding-right:16vw}.elf-save{grid-template-columns:1fr}.elf-save-intro{max-width:620px}}
@media (max-width:720px){.elf-hero-inner{padding-top:54px;padding-bottom:46px}.elf-hero h1{line-height:1.18}.elf-hero-copy{padding-right:0}.elf-hero-eagle img{right:-50%;bottom:-43%;width:650px}.elf-trust{gap:10px;flex-wrap:wrap}.elf-trust li{flex:1 1 30%;min-width:92px}.elf-path-wrap{margin-right:calc(-1 * clamp(20px,4vw,32px));padding-right:0;border-radius:16px 0 0 16px}.elf-path-heading{padding-right:clamp(20px,4vw,32px)}.elf-path{padding:0;gap:10px}.elf-question-shell,.elf-results{padding:25px 18px;border-radius:0 0 16px 16px}.elf-results{border-radius:16px}.elf-options,.elf-results-grid{grid-template-columns:1fr}.elf-option{min-height:80px}.elf-controls .btn{padding:13px 17px}.elf-results-head{flex-direction:column}.elf-save{margin-left:-1px;margin-right:-1px;border-radius:14px;padding:24px 18px}.elf-contact-grid{grid-template-columns:1fr}.elf-contact-grid label:last-child{grid-column:auto}.elf-contact-methods{display:grid;grid-template-columns:1fr;gap:10px}.elf-success{padding:44px 20px}.elf-success>div{display:grid}.elf-success .btn{width:100%}}
@media (prefers-reduced-motion:reduce){.elf-hero-eagle img{animation:none}.elf-path li,.elf-progress span,.elf-option{transition:none}}

/* ============================================================
   FIX PASS (finale step + centering + brighter brand colors)
   ============================================================ */

/* 1) Path-step checkmark centering.
   Cause: .elf-path-icon is display:grid;place-items:center and still holds the
   (transparent) step number text node, so the ::after check landed in a SECOND
   implicit grid row and sat low/off-center. Overlay the check instead. */
.elf-path li.is-complete .elf-path-icon:after{content:'';position:absolute;left:50%;top:50%;width:7px;height:11px;border:solid #fff;border-width:0 2px 2px 0;transform:translate(calc(-50% - 0.5px),calc(-50% - 2.5px)) rotate(45deg);box-sizing:border-box}

/* 2) Brighter brand colors on the assistant header (was muted steel-blue/grey) */
.elf-assistant .elf-assistant-mark{background:linear-gradient(140deg,#0079A8,#006C9C);box-shadow:0 5px 14px rgba(0,159,227,.38)}
.elf-assistant b{color:#0A6FAE}
.elf-assistant span:not(.elf-assistant-mark){color:#52697A}

/* 3) RESULTS -> final-step CTA (the form is now its own last step) */
.elf-results-cta{display:flex;flex-direction:column;align-items:flex-start;gap:14px;margin-top:26px;padding-top:24px;border-top:1px solid #E4EDF2}
.elf-results-cta-note{margin:0;max-width:620px;color:#537081;font-size:14px;line-height:1.6}
.elf-final{padding:clamp(30px,5vw,60px);border:1px solid #D5EAF4;border-radius:20px;background:#fff;box-shadow:0 18px 40px -28px rgba(4,64,94,.28)}
.elf-final .elf-question-title{max-width:680px}
.elf-final .elf-save{grid-template-columns:1fr;margin-top:26px}
.elf-final .elf-save-intro{max-width:640px}
.elf-final-back{margin-top:26px;padding-top:22px;border-top:1px solid #E4EDF2}

/* 4) Tablet + mobile hero eagle: was an absolute, faded (opacity .3) watermark
   pushed off the right/bottom edge. Now it sits centred BELOW the copy at full
   strength so the brand colors read true. */
@media (max-width:1080px){
  .elf-hero-eagle{position:relative;inset:auto;opacity:1;min-height:0;align-self:auto;display:flex;justify-content:center;padding:6px 0 2px}
  .elf-hero-eagle img{position:static;right:auto;bottom:auto;width:min(520px,84vw);max-width:100%;margin:0 auto}
  .elf-eagle-halo,.elf-orbit{display:none}
  .elf-hero-copy{padding-right:0}
}
@media (max-width:720px){
  .elf-hero-eagle img{width:min(430px,88vw);right:auto;bottom:auto}
  .elf-final{padding:25px 18px;border-radius:16px}
}

/* ============================================================
   MOBILE / TABLET PATH — steps revealed one by one
   Desktop keeps the 4-across (5-wide) horizontal rail.
   At <=1080px the cramped horizontal scroller is replaced by a
   vertical list where each step appears as the visitor completes
   the previous question, so nothing is cut off or crammed.
   ============================================================ */
@media (max-width:1080px){
  .elf-path{
    display:grid;
    grid-template-columns:minmax(0,1fr);   /* one per row */
    gap:10px;
    overflow-x:visible;                    /* no horizontal scroller */
    padding:0;
  }
  .elf-path li{
    min-width:0;                            /* was 155px -> forced the scroll strip */
    min-height:0;
    padding:15px 14px 14px 52px;
  }
  .elf-path-icon{left:14px;top:14px}
  /* Hide steps the visitor has not reached yet; reveal them as they progress. */
  .elf-path li.is-future{display:none}

  /* the reveal: a step slides in the moment it stops being 'future' */
  .elf-path li:not(.is-future){animation:elfStepIn .34s ease both}
}
@keyframes elfStepIn{
  from{opacity:0;transform:translateY(-6px)}
  to{opacity:1;transform:none}
}
@media (max-width:720px){
  /* the old 720px rules that created the cramped scroller are overridden here */
  .elf-path{padding:0;gap:9px}
  .elf-path li{min-width:0}
}
@media (prefers-reduced-motion:reduce){
  .elf-path li{animation:none}
}

/* ============================================================
   FINAL CHOICE — speak to someone / fill out an application / go home
   Shown on the success screen after the lead is saved, so the
   visitor gets clear next steps instead of flat buttons.
   3 across on desktop, 2+1 on tablet, stacked on mobile.
   ============================================================ */
.elf-choice{margin:26px auto 0;max-width:900px;text-align:left}
.elf-choice-title{margin:0 0 14px;text-align:center;color:#081018;font-size:clamp(17px,2.2vw,21px);letter-spacing:-.02em}
.elf-choice-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
/* tablet: first two side by side, homepage link spans full width underneath */
@media (max-width:1080px){
  .elf-choice-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .elf-choice-card:last-child{grid-column:1/-1}
}
.elf-choice-card{display:flex;flex-direction:column;gap:4px;padding:20px 18px;border:1.5px solid #D9E4EA;border-radius:16px;background:#fff;text-decoration:none;transition:border-color .18s,transform .18s,box-shadow .18s}
.elf-choice-card:hover{transform:translateY(-2px);border-color:#83D8F6;box-shadow:0 14px 28px -20px rgba(0,137,189,.5)}
.elf-choice-card.is-primary{border-color:var(--elf-blue);background:#F5FCFF}
.elf-choice-ic{display:grid;place-items:center;width:38px;height:38px;margin-bottom:6px;border-radius:11px;background:linear-gradient(140deg,#0079A8,#006C9C);color:#fff;font-size:17px;box-shadow:0 5px 12px rgba(0,159,227,.28)}
.elf-choice-card strong{color:#0C1F2E;font:700 16px/1.25 var(--font-display)}
.elf-choice-card small{color:#5C7383;font-size:13px;line-height:1.5}
.elf-choice-go{margin-top:8px;color:var(--elf-blue-deep);font:700 13px var(--font-display)}
.elf-choice-note{margin:16px 0 0;text-align:center;color:#5F7484;font-size:12px}
@media (max-width:720px){
  .elf-choice-grid{grid-template-columns:minmax(0,1fr)}
  .elf-choice-card{padding:17px 15px}
  .elf-choice-card:last-child{grid-column:auto}
}

/* ============================================================
   FORM VALIDATION — required markers + inline field errors
   ============================================================ */
.elf-req{color:#FF9DB0;font-weight:700;margin-left:2px}
.elf-contact-grid label.is-invalid input,.elf-contact-grid input.is-invalid{border-color:#FF7A8A;background:#FFF5F6}
.elf-field-err{display:block;margin-top:5px;color:#FFC2CC;font:500 11.5px/1.4 var(--font-body);letter-spacing:0}
.elf-field-err[hidden]{display:none}
.elf-field-err-wide{margin:6px 0 0}
.elf-contact-grid label{position:relative}
/* on the cream callout / light surfaces the error needs dark ink */
.elf-save .elf-field-err{color:#FFB3C0}
.elf-contact-methods legend .elf-req{color:#FF9DB0}
@media (max-width:720px){
  .elf-field-err{font-size:11px}
}

/* ============================================================
   FIX PASS (card CTA buttons: no clipping, stacked on mobile)
   ============================================================ */

/* 5) Result-card CTAs were being CRUSHED instead of wrapping.
   Cause: styles.css gives .btn-primary/.btn-accent/.btn-white/.btn-navy
   `overflow:hidden` (for the hover-sweep ::before). Overflow that is not
   `visible` resolves the flex item's automatic minimum size (min-width:auto)
   to ZERO, so .elf-card-actions{display:flex} with nowrap squeezed the
   PRIMARY button down to ~30px wide while the GHOST button (no overflow
   rule) kept its full 218px. .elf-result-card{overflow:hidden} then cropped
   the label to a sliver ("re A").
   Fix: let the row WRAP. Wrapping is decided from each button's flex-basis
   (auto -> its max-content width), so the row breaks to a new line before
   any button is compressed; nothing can ever be clipped at any width. */
.elf-card-actions{flex-wrap:wrap}
.elf-card-actions .btn-ghost{color:#0A6FAE;border-color:#0A6FAE}
.elf-card-actions .btn-ghost:hover{background:#0A6FAE;color:#fff}

/* 6) Phones: stack the CTAs full-width (and restore a comfortable tap target,
   matching the .elf-controls .btn mobile padding). */
@media (max-width:720px){
  .elf-card-actions{flex-direction:column;align-items:stretch}
  .elf-card-actions .btn{width:100%;padding:13px 17px;font-size:13px}
}