/* Theme 05: photo-led, left aligned, daylight. See theme05.mjs. */
:root{--hl-radius-xl:12px;--hl-radius-lg:12px;--v5-line:rgba(14,27,46,.14)}
body{background:#fff}

/* House nav: floating pill inset from the top. The page is white, so the glass takes the Cloud tint */
.nav .bar,.nav.scrolled .bar{background:rgba(241,245,250,.9);border-color:var(--v5-line);box-shadow:var(--shadow-card);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px)}
.drawer{background:#fff;color:var(--hl-ink)}
.drawer ul a{color:var(--hl-navy)}
.drawer .foot{color:var(--hl-slate)}
.drawer .wordmark.on-navy{color:var(--hl-ink)}
.drawer .wordmark.on-navy em{color:var(--hl-cobalt)}
.drawer .menu-btn{color:var(--hl-ink)!important}

/* no navy panels below the hero: every navy surface becomes Blue Fog */
.navy{background:var(--hl-blue-fog);color:var(--hl-navy)}
.navy h1,.navy h2,.navy h3{color:var(--hl-navy)}
.navy .ital{color:var(--hl-cobalt)}
.glow::before,.grain::after{display:none}
.btn-on-navy{background:var(--hl-cobalt);color:#fff}
.btn-on-navy:hover{background:#1f56e6}
.drawer .btn-on-navy{color:#fff}

/* closing band: left aligned */
.band{text-align:left;padding:64px}
.band h2{max-width:20ch;margin:0 0 16px}
.band p,.band.navy p{max-width:56ch;margin:0 0 28px;color:rgba(14,27,46,.75)}
.band form{justify-content:flex-start!important;margin:0!important}
.band input{background:#fff!important;border-color:var(--v5-line)!important;color:var(--hl-ink)!important}
.band input::placeholder{color:var(--hl-slate)}
.band p.band-foot{left:64px;right:64px;color:rgba(14,27,46,.7);opacity:1}
@media (max-width:720px){.band{padding:40px 24px}.band.has-foot{padding-bottom:112px}.band p.band-foot{left:24px;right:24px}}
.side-card.navy{background:var(--hl-blue-fog);color:var(--hl-navy)}
.side-card.navy h3{color:var(--hl-navy)}
.side-card.navy p{color:rgba(14,27,46,.75)}
.fam-card.navy .fam-mark{color:var(--hl-ink)}
.fam-card.navy .fam-mark em{color:var(--hl-cobalt)}
.fam-card.navy p{color:rgba(14,27,46,.75)}

/* full-bleed photo hero, square at the bottom */
.photo-hero{position:relative;color:#fff;min-height:68vh;display:flex;align-items:flex-end;padding:168px 0 80px;overflow:hidden;isolation:isolate}
.photo-hero .hero-bg{position:absolute;inset:0;z-index:-2}
.photo-hero .hero-bg img{width:100%;height:100%;object-fit:cover;object-position:60% 22%}
.photo-hero .hero-scrim{position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(14,27,46,.86) 0%,rgba(14,27,46,.6) 45%,rgba(14,27,46,.25) 100%),linear-gradient(180deg,rgba(14,27,46,.5),rgba(14,27,46,0) 30%,rgba(14,27,46,.6) 100%)}
.photo-hero .wrap{width:100%}
.photo-hero .on-navy{max-width:720px}
.photo-hero .wrap.on-navy{max-width:var(--wrap)}
.photo-hero .wrap.on-navy>*{max-width:720px}
.photo-hero .page-title{font-size:clamp(40px,5.2vw,64px)}
@media (max-width:720px){.photo-hero{padding:128px 0 56px;min-height:0}}

/* pre-qualify: quiz card on the photo */
.q-hero{align-items:flex-start;min-height:0;padding:136px 0 80px}
.q-hero .hero-bg img{object-position:40% 70%}
.q-hero .hero-scrim{background:linear-gradient(90deg,rgba(14,27,46,.72) 0%,rgba(14,27,46,.4) 50%,rgba(14,27,46,.15) 100%)}
body:has(.q-hero) .float-cta{display:none}
.q-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:64px;align-items:start}
.q-grid .on-navy{position:sticky;top:112px}
.q-grid .display{font-size:clamp(44px,5vw,68px)}
.q-hero .hero-card{background:#fff;border-radius:var(--hl-radius-xl);box-shadow:var(--shadow-float);overflow:hidden}
.q-hero .quiz.in-card{background:transparent;color:var(--hl-navy);padding:40px 0}
.q-hero .quiz.in-card .col{max-width:none;padding:0 40px}
.q-hero .qprog{background:rgba(14,27,46,.1)}
.q-hero .qprog .qfill{background:var(--hl-cobalt)}
.q-hero .qt{color:var(--hl-navy)}
.q-hero .qt em{color:var(--hl-cobalt)}
.q-hero .qh,.q-hero .qmeta,.q-hero .qback{color:var(--hl-slate)}
.q-hero .qback:hover{color:var(--hl-navy)}
.q-hero .qopt{background:var(--hl-off-white);border-color:var(--v5-line);color:var(--hl-navy)}
.q-hero .qopt:hover{border-color:var(--hl-cobalt);background:#fff;color:var(--hl-navy)}
.q-hero .qopt.on{background:var(--hl-navy);border-color:var(--hl-navy);color:#fff}
.q-hero .qin{background:var(--hl-off-white);border-color:var(--v5-line);color:var(--hl-ink)}
.q-hero .qin::placeholder{color:var(--hl-slate)}
.q-hero .qin:focus{border-color:var(--hl-cobalt);background:#fff;box-shadow:0 0 0 4px var(--hl-blue-fog)}
.q-hero .qin.bad{border-color:#cf2e2e}
.q-hero .qerr{color:#b42318}
.q-hero .qfine{color:var(--hl-slate)}
.q-hero .qfine a{color:var(--hl-navy)}
.q-hero .qcard{background:#fff;border-color:var(--v5-line);color:var(--hl-navy)}
.q-hero .qcard-d{color:var(--hl-slate)}
.q-hero .qcard-img{background:var(--hl-blue-fog)}
@media (max-width:960px){.q-hero{min-height:0;padding:112px 0 48px}.q-grid{grid-template-columns:1fr;gap:32px}.q-grid .on-navy{position:static}.q-hero .quiz.in-card .col{padding:0 22px}.q-hero .quiz.in-card{padding:28px 0}}

/* FAQ: one column, heading above, plain plus */
.split-2,.faq-grid{grid-template-columns:1fr;gap:32px}
.split-2>*,.faq-grid>*{max-width:860px}
.split-2 .side,.faq-grid h2{position:static}
.faq details,.faq details:last-child{border-color:var(--v5-line)}
.faq summary{padding:22px 0}
.faq .plus{width:20px;height:20px;border:0;color:var(--hl-cobalt)}
.faq details[open] .plus{background:none;color:var(--hl-cobalt)}
.v5-faq-title{margin-bottom:32px}

/* loan page */
.v5-narrow>*{max-width:860px}
.v5-ledger{margin-top:40px}
.v5-ledger>div{display:grid;grid-template-columns:220px 1fr;gap:32px;padding:28px 0;border-top:1px solid var(--v5-line)}
.v5-ledger>div:last-child{border-bottom:1px solid var(--v5-line)}
.v5-ledger h3{font-size:26px;line-height:1.15}
.v5-ledger p{margin:0;font-size:18px}
.v5-how{display:grid;grid-template-columns:.85fr 1.15fr;gap:72px;align-items:start}
.v5-how .photo{aspect-ratio:4/5;position:sticky;top:104px}
.v5-steps{list-style:none;margin:40px 0 0;padding:0}
.v5-steps li{display:grid;grid-template-columns:48px 1fr;gap:16px;padding:28px 0;border-top:1px solid var(--v5-line)}
.v5-steps li:last-child{border-bottom:1px solid var(--v5-line)}
.v5-steps span{font:400 32px/1 var(--hl-font-display);color:var(--hl-cobalt)}
.v5-steps h3{font-size:24px;line-height:1.18;margin-bottom:8px}
.v5-steps p{margin:0;color:var(--hl-slate);font-size:17px}
.v5-fit{background:var(--hl-blue-fog);color:var(--hl-navy)}
.v5-fit .ital{color:var(--hl-cobalt)}
.v5-fit-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;margin-top:48px}
.v5-fit-grid>div{padding-top:20px;border-top:1.5px solid var(--hl-navy)}
.v5-fit-grid h3{font-size:24px;line-height:1.15;margin-bottom:8px}
.v5-fit-grid p{margin:0;font-size:16px;color:rgba(14,27,46,.75)}
.v5-note{margin:40px 0 0;max-width:68ch;font-size:16px;color:rgba(14,27,46,.75)}
.v5-index-title,.v5-others-title{margin-bottom:28px}
.v5-others{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:16px}
.v5-others a{display:flex;flex-direction:column;background:#fff;border:1px solid rgba(14,27,46,.22);border-radius:var(--hl-radius-lg);overflow:hidden;color:var(--hl-ink);transition:border-color .2s,background-color .2s}
.v5-others a:hover,.v5-others a:focus-visible{border-color:var(--hl-cobalt);background:var(--hl-blue-fog)}
.v5-others .photo{display:block;aspect-ratio:16/9;border-radius:0}
.v5-others .photo img{object-position:50% 15%}
.v5-others:has(>:nth-child(4)) .photo{aspect-ratio:4/3}
.v5-others .name{padding:16px 16px 0;font:400 21px/1.15 var(--hl-font-display);margin-bottom:12px}
.v5-others .more{align-self:flex-start;margin:auto 16px 16px;color:var(--hl-cobalt);font:500 15px/1.3 var(--hl-font-sans);border-bottom:1.5px solid rgba(37,99,255,.3);transition:border-color .2s}
.v5-others a:hover .more,.v5-others a:focus-visible .more{border-color:var(--hl-cobalt)}
/* too narrow to fit them all: the row stays one row and swipes */
@media (max-width:1000px){.v5-others{grid-auto-columns:minmax(210px,1fr);overflow-x:auto;margin:0 calc(var(--gutter) * -1);padding:0 var(--gutter);scroll-padding:0 var(--gutter);scroll-snap-type:x mandatory}.v5-others a{scroll-snap-align:start}}
@media (max-width:900px){.v5-ledger>div{grid-template-columns:1fr;gap:10px}.v5-how{grid-template-columns:1fr;gap:40px}.v5-how .photo{position:static;aspect-ratio:4/3}.v5-fit-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.v5-fit-grid{grid-template-columns:1fr}}

/* loan options: bigger section titles, every loan a bordered tile with a visible link */
.lgroup-head .heading{font-size:clamp(44px,5.4vw,72px);line-height:1;letter-spacing:-1px;color:var(--hl-navy)}
.lgroup-head p{font-size:20px;margin:18px 0 0;color:rgba(14,27,46,.75)}
.lrows{gap:16px}
.lrow{grid-template-columns:1fr auto;column-gap:24px;align-items:center;align-content:center;padding:22px 24px;background:#fff;border:1px solid rgba(14,27,46,.22);border-radius:var(--hl-radius-lg);transition:border-color .2s,background-color .2s}
.lrow .name,.lrow .desc{grid-column:1}
.lrow .more{grid-column:2;grid-row:1/span 2;color:var(--hl-cobalt);font:500 15px/1.3 var(--hl-font-sans);white-space:nowrap;border-bottom:1.5px solid rgba(37,99,255,.3);transition:border-color .2s}
.lrow:hover,.lrow:focus-visible{border-color:var(--hl-cobalt);background:var(--hl-blue-fog)}
.lrow:hover .more,.lrow:focus-visible .more{border-color:var(--hl-cobalt)}
.lrow:hover .name{color:var(--hl-navy)}
@media (max-width:560px){.lrow{grid-template-columns:1fr;padding:20px}.lrow .more{grid-column:1;grid-row:auto;justify-self:start;margin-top:10px}}

/* blog index: rows instead of a card grid */
.cat-nav~.articles,.v5-post-more .articles{grid-template-columns:1fr;gap:0}
.cat-nav~.articles a,.v5-post-more .articles a{grid-template-columns:280px 1fr;column-gap:40px;row-gap:8px;padding:28px 0;border-top:1px solid var(--v5-line)}
.cat-nav~.articles .photo,.v5-post-more .articles .photo{grid-row:1/span 4}
.cat-nav~.articles .meta,.v5-post-more .articles .meta{align-self:end}
@media (max-width:720px){.cat-nav~.articles a,.v5-post-more .articles a{grid-template-columns:1fr}.cat-nav~.articles .photo,.v5-post-more .articles .photo{grid-row:auto}}

/* blog post: heading left, reading column right, hairlines between sections */
.crumbs{display:flex;gap:10px;align-items:center;margin-bottom:20px;font-size:15px;color:var(--hl-blue-fog)}
.crumbs a{color:inherit;transition:color .2s}
.crumbs a:hover{color:#fff}
.crumbs span{opacity:.5}
.page-hero:has(.crumbs) .meta{flex-wrap:wrap}
.page-hero:has(.crumbs) .meta span{white-space:nowrap}
.page-hero:has(.crumbs) h1{text-wrap:balance}
.v5-post-lead{padding-bottom:72px}
.v5-post-lead .prose{max-width:26em;font-size:clamp(26px,3vw,40px)}
.v5-post-lead .prose .lead{margin:0;font:400 1em/1.2 var(--hl-font-display);letter-spacing:-.5px;color:var(--hl-navy)}
.v5-post-lead .prose .lead strong{font-weight:400;font-style:italic;color:var(--hl-cobalt)}
.v5-post-fig{background:var(--hl-blue-fog);color:var(--hl-navy);padding:72px 0}
.post-fig{margin:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,760px);column-gap:64px}
.post-fig figcaption{grid-column:1;grid-row:1/span 9;max-width:15em;font:400 clamp(26px,2.4vw,32px)/1.15 var(--hl-font-display);letter-spacing:-.3px}
.pf-row{grid-column:2;display:grid;gap:10px}
.pf-row+.pf-row{margin-top:28px}
.pf-lab{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap;font-size:17px}
.pf-lab b{font:400 clamp(28px,3vw,40px)/1 var(--hl-font-display);letter-spacing:-.5px}
.pf-track{display:flex;gap:4px;height:12px;transform-origin:left;transform:scaleX(0);transition:transform 1.1s var(--ease) .25s}
.reveal.in .pf-track{transform:none}
.pf-track i{display:block;height:100%;border-radius:2px;min-width:0;flex:none}
.pf-track i.a{background:var(--hl-navy)}
.pf-track i.b{background:var(--hl-cobalt);flex:1 1 0}
.post-fig p{grid-column:2;margin:28px 0 0;font-size:16px;line-height:1.5;color:rgba(14,27,46,.75)}
.v5-post-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,760px);column-gap:64px;padding:48px 0;border-top:1px solid var(--v5-line)}
.v5-post-row:first-child{border-top:0;padding-top:0}
.v5-post-row>h2{font-size:clamp(28px,2.6vw,36px);line-height:1.12;color:var(--hl-navy)}
.v5-post-row .prose{max-width:none}
.v5-post-row .prose>:last-child{margin-bottom:0}
.takeaway{border-top:1.5px solid var(--hl-navy)}
.takeaway p{margin:0;font-size:18px}
.takeaway .takeaway-line{font:400 clamp(24px,2.2vw,30px)/1.2 var(--hl-font-display);letter-spacing:-.3px;color:var(--hl-navy)}
.v5-post-end{margin-left:auto;width:100%;max-width:760px;padding-top:16px}
.post-fine{margin:0;font-size:14px;line-height:1.5;color:var(--hl-slate)}
.post-share{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:24px}
.post-share span{font-size:15px;font-weight:500;color:var(--hl-slate);margin-right:6px}
.post-share a,.post-share button{display:inline-flex;align-items:center;height:42px;padding:0 18px;border-radius:999px;border:1px solid rgba(14,27,46,.22);background:#fff;color:var(--hl-ink);font:500 15px var(--hl-font-sans);cursor:pointer;transition:border-color .2s}
.post-share a:hover,.post-share button:hover{border-color:var(--hl-cobalt)}
.v5-post-more .section-head{margin-bottom:32px}
.v5-post-more .articles a:last-child{border-bottom:1px solid var(--v5-line)}
@media (prefers-reduced-motion:reduce){.pf-track{transform:none;transition:none}}
@media (max-width:860px){.v5-post-lead{padding-bottom:48px}.v5-post-fig{padding:48px 0}.post-fig,.v5-post-row{grid-template-columns:1fr}.post-fig figcaption{grid-row:auto;margin-bottom:28px}.pf-row,.post-fig p{grid-column:1}.v5-post-row{row-gap:20px;padding:36px 0}.v5-post-end{max-width:none}}
@media (max-width:640px){.pf-lab{flex-direction:column;gap:6px}.page-hero:has(.crumbs) .meta i:last-of-type,.page-hero:has(.crumbs) .meta span:last-child{display:none}}

/* long text reveals block by block */
[data-stagger]>*{opacity:0}

/* home */
.hero{border-radius:0}
.specialist{border-radius:0;aspect-ratio:21/8}
.specialist .cap{padding:96px max(var(--gutter),calc((100vw - var(--wrap)) / 2 + var(--gutter))) 56px;background:linear-gradient(180deg,rgba(14,27,46,0),rgba(14,27,46,.72) 40%,rgba(14,27,46,.92))}
.officer-copy{color:rgba(14,27,46,.75)}
@media (max-width:860px){.specialist{aspect-ratio:auto}.specialist .cap{padding:32px var(--gutter)}}

/* light footer, small wordmark */
.footer{background:var(--hl-off-white);color:var(--hl-ink);border-top:1px solid var(--v5-line);padding-top:64px}
.footer .big{font-size:44px;color:var(--hl-ink);margin-bottom:40px}
.footer .big em{color:var(--hl-cobalt)}
.footer h4{color:var(--hl-navy)}
.footer ul a{color:var(--hl-slate)}
.footer ul a:hover{color:var(--hl-navy);border-color:var(--v5-line)}
.footer .top{border-color:var(--v5-line)}
.footer .legal,.footer .ids,.footer .bottom{color:var(--hl-slate)}
.footer .legal strong,.eho{color:var(--hl-ink)}

/* about: statement over a full-bleed photo trio */
.v5-statement{padding-bottom:64px}
.v5-statement .big-serif{margin:0;max-width:24ch;font:400 clamp(36px,4.6vw,64px)/1.08 var(--hl-font-display);letter-spacing:-1px;color:var(--hl-navy)}
.v5-trio{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;padding:0}
.v5-trio-panel{position:relative;isolation:isolate;overflow:hidden;min-height:clamp(480px,44vw,660px);display:flex;align-items:flex-end;color:#fff;background:var(--hl-cloud)}
.v5-trio-panel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.v5-trio-panel::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(14,27,46,0) 40%,rgba(14,27,46,.5) 66%,rgba(14,27,46,.86))}
.v5-trio-copy{padding:40px}
.v5-trio-panel:first-child .v5-trio-copy{padding-left:max(var(--gutter),calc((100vw - var(--wrap)) / 2 + var(--gutter)))}
.v5-trio-copy h2{color:#fff;font:400 clamp(30px,2.7vw,40px)/1.06 var(--hl-font-display);letter-spacing:-.5px;margin-bottom:10px}
.v5-trio-copy p{margin:0;max-width:30ch;font-size:18px;color:#fff}
@media (max-width:860px){.v5-statement{padding-bottom:40px}.v5-trio{grid-template-columns:1fr}.v5-trio-panel{min-height:340px}.v5-trio-copy,.v5-trio-panel:first-child .v5-trio-copy{padding:28px var(--gutter)}}

/* about: four things, the photo follows the line in focus */
.v5-says{background:var(--hl-blue-fog);color:var(--hl-navy)}
.v5-says .heading{color:var(--hl-navy);margin-bottom:48px}
.v5-says .ital{color:var(--hl-cobalt)}
.v5-says-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:64px;align-items:stretch}
.v5-says-photo{position:relative;min-height:560px;overflow:hidden;border-radius:var(--hl-radius-xl);background:var(--hl-cloud)}
.v5-says-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s ease}
.v5-says-photo img.is-on{opacity:1}
.v5-says-list{display:grid;grid-auto-rows:1fr}
.v5-say{position:relative;display:grid;align-content:center;gap:10px;width:100%;padding:28px 0;background:none;border:0;border-top:1px solid rgba(14,27,46,.2);border-radius:0;color:inherit;font:inherit;text-align:left;cursor:pointer}
.v5-say:last-child{border-bottom:1px solid rgba(14,27,46,.2)}
.v5-say::before{content:"";position:absolute;top:-1px;left:0;right:0;height:2px;background:var(--hl-cobalt);transform:scaleX(0);transform-origin:left;transition:transform .5s cubic-bezier(.22,.8,.24,1)}
.v5-say.is-on::before{transform:scaleX(1)}
.v5-say img{display:none}
.v5-say-line{font:400 clamp(28px,3vw,42px)/1.1 var(--hl-font-display);letter-spacing:-.5px;color:rgba(14,27,46,.6);transition:color .3s}
.v5-say-line em{font-style:italic}
.v5-say.is-on .v5-say-line{color:var(--hl-navy)}
.v5-say.is-on .v5-say-line em{color:var(--hl-cobalt)}
.v5-say-tag{font-size:16px;font-weight:500;color:rgba(14,27,46,.75)}
.v5-say:focus-visible{outline:2px solid var(--hl-cobalt);outline-offset:4px}
@media (max-width:720px){.v5-says .heading{margin-bottom:32px}.v5-says-grid{grid-template-columns:1fr}.v5-says-photo{display:none}.v5-says-list{grid-auto-rows:auto;gap:32px}.v5-say,.v5-say:last-child{padding:0;border:0;cursor:default}.v5-say::before{display:none}.v5-say img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--hl-radius-xl);margin-bottom:8px}.v5-say-line,.v5-say.is-on .v5-say-line{color:var(--hl-navy)}.v5-say-line em{color:var(--hl-cobalt)}}

/* about: the Hello family, same site screenshots as 03 */
.fam-sites{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.fam-site{background:#fff;border-radius:var(--hl-radius-xl);border:1px solid var(--v5-line);overflow:hidden}
.fam-shot{aspect-ratio:16/10;background:#fff;border-bottom:1px solid var(--v5-line)}
.fam-shot img{display:block;width:100%;height:100%;object-fit:cover;object-position:top}
.fam-copy{padding:28px 28px 32px;display:grid;gap:8px}
.fam-name{font-size:15px;font-weight:600;color:var(--hl-slate)}
.fam-copy h3{font-size:26px;line-height:1.15}
.fam-copy p{margin:0;font-size:16px;color:var(--hl-slate)}
@media (max-width:860px){.fam-sites{grid-template-columns:1fr}}

/* apply online: three field rows in the request box */
@media (min-width:901px){.form .row3{grid-template-columns:repeat(3,1fr)}}
/* apply online: terms collapsed under the consent checkbox */
.apply-terms{font-size:14px;line-height:1.55;color:var(--hl-slate)}
.apply-terms summary{width:fit-content;cursor:pointer;color:var(--hl-navy);text-decoration:underline;text-underline-offset:3px}
.apply-terms summary:hover{color:var(--hl-cobalt)}
.consent .apply-terms p{margin:12px 0 0;font-size:14px}
.apply-terms a{color:var(--hl-navy);text-decoration:underline}
/* apply online: keep input min widths from pushing the card past its column */
form.consent{grid-template-columns:minmax(0,1fr)}
form.consent .row{grid-template-columns:minmax(0,1fr)}
form.consent .field input{width:100%;min-width:0}
@media (min-width:901px){form.consent .row{grid-template-columns:repeat(2,minmax(0,1fr))}form.consent .row3{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* Other loans on the home page: a hairline index, not chips. The label underline fades in on hover. */
.v5-index{display:grid;grid-template-columns:repeat(2,1fr);column-gap:48px;border-bottom:1px solid rgba(14,27,46,.12)}
.v5-index a{display:flex;align-items:center;min-height:64px;border-top:1px solid rgba(14,27,46,.12);color:var(--hl-navy);font:400 22px/1.2 var(--hl-font-display);text-decoration:underline 1px transparent;text-underline-offset:6px;transition:color .2s,text-decoration-color .3s}
.v5-index a:hover,.v5-index a:focus-visible{color:var(--hl-cobalt);text-decoration-color:currentColor}
@media (max-width:720px){.v5-index{grid-template-columns:1fr}.v5-index a{justify-content:center;min-height:56px;font-size:20px}}

/* Phones: every section centred, so the page reads one way top to bottom (house rule).
   Long-form legal and article prose stays left aligned for reading. */
@media (max-width:720px){
  main,section,.footer,.photo-hero .wrap.on-navy>*{text-align:center}
  .photo-hero .wrap.on-navy>*,.hero .on-navy,.lede,.section-head p,.band p{margin-left:auto;margin-right:auto}
  .actions,.hero .actions,.meta,.crumbs,.section-head,.trust li,.fam-copy,.v5-post-end,.ids,.footer .bottom{justify-content:center;align-items:center}
  .section-head{flex-direction:column;gap:12px}
  .trust{justify-items:center}
  .trust li{flex-direction:column;gap:8px}
  .lrow{grid-template-columns:1fr;justify-items:center}
  .lrow .more{grid-column:1;grid-row:auto}
  body .v5-steps li{grid-template-columns:1fr;justify-items:center;text-align:center;gap:8px}
  .faq summary{text-align:left}
  .prose,.prose p,.prose li,.prose ul,.prose ol,.v5-post-row .prose{text-align:left}
  .prose h2,.prose h3,.v5-post-row>h2{text-align:center}
  .footer ul{padding:0}
  body .help-card .more,body .lrow .more,body .side-card .btn,body .form .btn{justify-self:center}
  body .officer .txt{justify-items:center;align-items:center}
  body .v5-others .more{align-self:center}
  body .footer .big{justify-content:center}
  body .band form{justify-content:center!important;margin:0 auto!important}
  .footer .bottom{justify-content:center;text-align:center}
  body .band,body .band p.band-foot,body .v5-say{text-align:center}
  body .band h2{margin-left:auto;margin-right:auto}
  body .cat-nav{justify-content:center}
  body .q-hero .qcard{text-align:center}
}

/* Tablets (721 to 900): keep the photo grids side by side instead of one tall photo per row */
@media (min-width:721px) and (max-width:900px){
  body .help-cards{grid-template-columns:repeat(3,1fr);gap:20px}
  body .help-card .photo{aspect-ratio:3/4}
  body .help-card h3{font-size:24px}
  body .officer .grid{grid-template-columns:.85fr 1.15fr}
  body .officer .txt{padding:40px}
  body .articles:not(.cat-nav~.articles):not(.v5-post-more .articles){grid-template-columns:repeat(2,1fr);gap:28px}
  .float-cta{max-width:420px;margin:0 auto}
}

/* Tap targets at 44px: the wordmark, category filters, contact links and standalone text links */
.nav .wordmark{display:inline-flex;align-items:center;min-height:44px}
.cat-nav a{min-height:44px;display:inline-flex;align-items:center}
.contact .details a,.section-head .link{display:inline-flex;align-items:center;min-height:44px}
.crumbs a,.v5-post-end a{display:inline-flex;align-items:center;min-height:44px}

/* Sideways scrollers (loan shelves, tabs) scroll without a visible scrollbar */
.v5-others,.tabs,.shelf-scroll,.cat-nav{scrollbar-width:none;-ms-overflow-style:none}
.v5-others::-webkit-scrollbar,.tabs::-webkit-scrollbar,.shelf-scroll::-webkit-scrollbar,.cat-nav::-webkit-scrollbar{display:none}

/* Photos are visible the moment they load: the reveal is only a slight settle, never a fade from nothing */
.reveal-scale,.reveal-fade{opacity:1}
.reveal-scale{transform:scale(1.02);transition:transform 1s var(--ease)}
.reveal-scale.in{transform:none}
@media (prefers-reduced-motion:reduce){.reveal-scale{transform:none;transition:none}}

/* Tablets (721 to 900): image-beside-copy sections stay side by side, so no photo fills the whole screen.
   Full-bleed bands (hero, Specialists) are designed that way and stay as they are. */
@media (min-width:721px) and (max-width:900px){
  body .four{grid-template-columns:.9fr 1.1fr;gap:36px}
  body .leader{grid-template-columns:.8fr 1.2fr;gap:36px}
  body .leader-photo{aspect-ratio:4/5}
  body .featured{grid-template-columns:1.1fr .9fr;gap:28px}
  body .v5-how{grid-template-columns:.85fr 1.15fr;gap:36px}
  body .v5-how .photo{position:sticky;aspect-ratio:4/5}
  body .fam-sites{grid-template-columns:repeat(3,1fr);gap:14px}
  body .lgroup-head{grid-template-columns:.9fr 1.1fr;gap:32px}
  body .lgroup-head .heading{font-size:clamp(36px,5vw,48px)}
  body .lgroup-head.flip .lgroup-photo{order:2}
  body .v5-says-grid{gap:36px}
  body .v5-says-photo{min-height:0;position:sticky;top:104px;align-self:start;aspect-ratio:4/5}
}

/* Large phones and the iPhone Duo unfolded (561 to 720): the centred phone layout stays, but stacked photos take a wide crop
   and article cards go two across, so no single photo fills the screen. */
@media (min-width:561px) and (max-width:720px){
  body .help-card .photo,body .four-photo,body .officer .photo,body .v5-how .photo,body .leader-photo,body .featured .photo,body .fit-photo,body .v5-say img{aspect-ratio:16/9}
  body .articles,body .cat-nav~.articles,body .v5-post-more .articles{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:28px}
  body .specialist{min-height:340px}
  body .v5-trio-panel{min-height:300px}
}

/* Short landscape screens (phones and the iPhone Duo folded, turned sideways): photos stop at 62% of the screen height. */
@media (orientation:landscape) and (max-height:500px) and (max-width:1000px){
  body .help-card .photo,body .four-photo,body .officer .photo,body .v5-how .photo,body .leader-photo,body .featured .photo,body .fit-photo,body .lgroup-photo,body .pq-photo,body .articles .photo,body .v5-say img,body .v5-says-photo{max-height:62svh;margin-inline:auto}
  body .specialist{min-height:62svh}
  body .v5-trio-panel{min-height:62svh}
  body .fam-shot{aspect-ratio:21/9}
}

/* migrated articles: copy before the first heading reads in the right-hand column, with no heading beside it */
.v5-post-row.nohead>.prose{grid-column:2}
@media (max-width:860px){.v5-post-row.nohead>.prose{grid-column:auto}}

/* figure kinds on migrated articles: bars with one cobalt highlight, a two-column comparison, numbered steps, key figures */
.pf-track i.c{background:var(--hl-cobalt)}
.pf-cmp,.pf-steps,.pf-stats{grid-column:2;margin:0}
.pf-cmp>div{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1fr) minmax(0,1fr);column-gap:24px;padding:16px 0;border-top:1px solid rgba(14,27,46,.14);font-size:16px;line-height:1.45}
.pf-cmp>div:first-child{border-top:0;padding-top:0}
.pf-cmp-head b{font:400 clamp(22px,2vw,28px)/1.15 var(--hl-font-display);letter-spacing:-.3px}
.pf-cmp [role=rowheader]{font-weight:600}
.pf-steps{list-style:none;padding:0;counter-reset:pf}
.pf-steps li{counter-increment:pf;display:grid;grid-template-columns:56px minmax(0,1fr);column-gap:20px;row-gap:4px;padding:18px 0;border-top:1px solid rgba(14,27,46,.14)}
.pf-steps li:first-child{border-top:0;padding-top:0}
.pf-steps li::before{content:counter(pf,decimal-leading-zero);grid-row:1/span 2;font:400 28px/1 var(--hl-font-display);color:var(--hl-cobalt)}
.pf-steps b{font:400 clamp(20px,1.8vw,24px)/1.2 var(--hl-font-display)}
.pf-steps span{font-size:16px;line-height:1.5;color:rgba(14,27,46,.8)}
.pf-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:32px}
.pf-stats dt{font:400 clamp(36px,4vw,56px)/1 var(--hl-font-display);letter-spacing:-.8px;color:var(--hl-navy)}
.pf-stats dd{margin:12px 0 0;font-size:16px;line-height:1.45;color:rgba(14,27,46,.8)}
@media (max-width:860px){.pf-cmp,.pf-steps,.pf-stats{grid-column:1}}
@media (max-width:640px){.pf-cmp>div{grid-template-columns:1fr 1fr;row-gap:6px}.pf-cmp [role=rowheader]{grid-column:1/-1}.pf-cmp-head>span{display:none}}