/* Generated by scripts/build-public-css.mjs. Edit the source stylesheets. */
/* K&C Group | eXp Realty — public site */
:root{
  --navy:#160C4B; --light:#F7F7FA; --white:#FFFFFF; --blue:#0274E6; --blue-soft:#639AF9; --gold:#C09028;
  --gold-print:#8A6410; --ink:#160C4B; --ink-2:#4A4566; --line:#E4E3EC; --on-navy-2:#C9C5E0;
  --f-display:'Libre Baskerville','Noto Serif',Georgia,'Times New Roman',serif;
  --f-ui:'Outfit','Noto Sans',Roboto,system-ui,-apple-system,'Segoe UI',Arial,sans-serif;
  --s1:8px; --s2:16px; --s3:24px; --s4:32px; --s5:40px; --s6:48px; --s8:64px; --s10:80px;
  --r-card:24px; --r-btn:14px;
  --shadow:0 1px 2px rgba(22,12,75,.06),0 18px 40px -12px rgba(22,12,75,.18);
}
*{box-sizing:border-box}
html,body{margin:0}
html{scroll-padding-top:112px}
body{background:var(--light);color:var(--ink);font-family:var(--f-ui);font-size:16px;-webkit-font-smoothing:antialiased}
h1,h2,h3,p{margin:0}
a{color:inherit}
a:focus-visible,button:focus-visible{outline:3px solid var(--blue);outline-offset:3px;border-radius:6px}
.hero :focus-visible,.more-card :focus-visible,.footer :focus-visible{outline-color:var(--blue-soft)}
.skip-link:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
.shell{width:min(1240px,calc(100% - 96px));margin-inline:auto}
.skip-link{position:absolute;left:16px;top:-100px;display:inline-flex;align-items:center;box-sizing:border-box;min-width:44px;min-height:44px;background:#fff;color:var(--navy);padding:12px 16px;z-index:60;font:600 16px/1 var(--f-ui)}
.skip-link:focus{top:12px}

/* HEADER LOCKUP — eXp logo is taller and at least as wide as the K&C logo */
.site-header{background:var(--white);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:40}
.header-inner{min-height:104px;display:flex;align-items:center;justify-content:space-between;gap:var(--s4)}
.lockup{display:flex;align-items:center;gap:20px;text-decoration:none;min-height:44px}
.lockup .kc{height:28px;width:auto;display:block}
.lockup .exp{height:72px;width:auto;display:block}
.lockup .vr{width:1px;height:52px;background:var(--line)}
.nav{display:flex;align-items:center;gap:var(--s4);font:500 16px/1 var(--f-ui)}
.nav a{text-decoration:none;min-height:44px;display:inline-flex;align-items:center;padding:12px 0}
.nav a:hover{text-decoration:underline;text-underline-offset:4px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 22px;border-radius:var(--r-btn);font:600 16px/1 var(--f-ui);text-decoration:none;border:0;cursor:pointer}
.btn-blue{background:var(--blue);color:#fff;box-shadow:0 8px 18px -10px rgba(2,116,230,.8)}
.btn-navy{background:var(--navy);color:#fff}
.btn-ghost{background:var(--white);color:var(--navy);border:1.5px solid var(--navy)}
.nav .btn{padding:0 22px;text-decoration:none}
.nav .btn:hover{text-decoration:none}
.menu-btn{display:none}

/* MOBILE NAV */
.mobile-nav{display:none}
.mobile-nav[hidden]{display:none !important}

/* HERO — solid navy. No photograph. */
.hero-wrap{padding:var(--s5) 0 var(--s2)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,460px);gap:var(--s4);align-items:stretch}
.hero-grid > *,.routes > *,.contact-grid > *{min-width:0}
.hero{position:relative;border-radius:var(--r-card);overflow:hidden;background:var(--navy);display:flex;align-items:flex-end;min-height:100%}
.hero-text{position:relative;padding:var(--s6);z-index:1;color:#fff;width:100%}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font:600 13px/1 var(--f-ui);letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.eyebrow::before{content:"";width:28px;height:2px;background:var(--gold);flex:none}
.eyebrow.on-white{color:var(--gold-print)}
.eyebrow.on-white::before{background:var(--gold)}
.hero h1{font:700 58px/1.1 var(--f-display);letter-spacing:-.01em;margin:18px 0 18px}
.hero h1 em{font-style:italic;font-weight:400;color:#fff;white-space:nowrap}
.hero .intro{font:400 19px/1.55 var(--f-ui);max-width:560px;color:#fff}
.tagline{font:italic 400 17px/1.4 var(--f-display);color:#fff;margin-top:var(--s3);display:flex;align-items:center;gap:12px}
.tagline::before{content:"";width:28px;height:1px;background:var(--gold);flex:none}
.hero-ctas{display:flex;gap:12px;margin-top:var(--s3);flex-wrap:wrap}
.hero-ctas .btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.7)}
.hero-m{display:none}
.hero .eyebrow{color:#fff}

/* PORTAL CARD */
.card{background:var(--white);border-radius:var(--r-card);box-shadow:var(--shadow);padding:var(--s5)}
.kicker{font:600 13px/1 var(--f-ui);letter-spacing:.16em;text-transform:uppercase;color:var(--blue)}
.card h2{font:700 36px/1.15 var(--f-display);color:var(--navy);margin:14px 0 10px}
.card .lead{font:400 17px/1.55 var(--f-ui);color:var(--ink-2)}
.portal-entry{display:flex;align-items:center;justify-content:space-between;gap:var(--s2);padding:20px;margin-top:var(--s2);border:1px solid var(--line);border-radius:18px;text-decoration:none;background:var(--light);min-height:44px}
.portal-entry:first-of-type{margin-top:var(--s3)}
.portal-entry:hover{border-color:var(--blue)}
.entry-title{display:block;font:600 20px/1.3 var(--f-ui);color:var(--navy)}
.entry-desc{display:block;font:400 15px/1.5 var(--f-ui);color:var(--ink-2);margin-top:4px}
.arrow{display:grid;place-items:center;flex:none;width:44px;height:44px;border-radius:50%;background:var(--blue);color:#fff;font-size:20px}
.note{font:400 14px/1.6 var(--f-ui);color:var(--ink-2);margin-top:var(--s3)}
.link{display:inline-flex;gap:8px;align-items:center;min-height:44px;font:600 16px/1.3 var(--f-ui);color:var(--blue);text-decoration:underline;text-underline-offset:3px;margin-top:var(--s2)}

/* SECTIONS */
.section{padding:var(--s10) 0}
.section.white{background:var(--white);border-block:1px solid var(--line)}
.section-head{max-width:720px;margin-bottom:var(--s5)}
.section-head h2{font:700 40px/1.15 var(--f-display);margin:16px 0 12px}
.section-head p{font:400 18px/1.55 var(--f-ui);color:var(--ink-2)}
.routes{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s4)}
.route{background:var(--light);border:1px solid var(--line);border-radius:var(--r-card);padding:var(--s5);display:flex;flex-direction:column}
.route .num{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--navy);color:#fff;font:600 15px/1 var(--f-ui)}
.route h3{font:700 26px/1.25 var(--f-display);margin:var(--s3) 0 12px}
.route p{font:400 17px/1.6 var(--f-ui);color:var(--ink-2)}
.route p+p{margin-top:12px}
.route strong{color:var(--navy);font-weight:600}
.route .actions{margin-top:auto;padding-top:var(--s3);display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.route .small{font-size:14px;line-height:1.55}
.callout{display:flex;align-items:center;gap:var(--s2);margin-top:var(--s4);padding:20px var(--s3);border-radius:18px;background:#EEF4FE;border:1px solid #CFE0FC;font:400 17px/1.55 var(--f-ui);color:var(--navy)}
.callout .ico{flex:none;width:44px;height:44px;border-radius:10px;background:var(--white);display:grid;place-items:center;color:var(--blue)}
.callout a{color:var(--navy);font-weight:600;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}

/* CONTACT — brokerage name sits immediately above the phone and email */
.contact-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.15fr) minmax(0,1fr);gap:var(--s4);align-items:stretch}
.contact-grid h2{font:700 40px/1.15 var(--f-display);margin-top:16px}
.contact-card{background:var(--white);border-radius:var(--r-card);box-shadow:var(--shadow);padding:var(--s5)}
/* Contact lockup. Full size is K&C 36px (172.66px wide) and eXp 68px (130.91px wide). Both shrink together below that. */
.contact-lockup{display:flex;align-items:center;gap:16px;min-width:0;max-width:100%}
.contact-lockup .kc,.contact-lockup .exp{display:block;height:auto;min-width:0;max-width:100%;object-fit:contain}
.contact-lockup .kc{flex:0 1 172.66px;width:172.66px;aspect-ratio:4024 / 839}
.contact-lockup .exp{flex:0 1 130.91px;width:130.91px;aspect-ratio:1157 / 601}
.contact-lockup .vr{width:1px;height:44px;background:var(--line);flex:none}
.contact-card .help{font:400 16px/1.55 var(--f-ui);color:var(--ink-2);margin:0 0 var(--s3)}
@media (max-width:366px){
  .contact-card .help{max-width:12.75em}
}
.phone{display:inline-flex;align-items:center;min-height:44px;font:600 30px/1.2 var(--f-ui);color:var(--navy);text-decoration:none;margin-top:12px}
.email{display:inline-flex;align-items:center;min-height:44px;font:600 17px/1.3 var(--f-ui);color:var(--blue);text-decoration:underline;text-underline-offset:3px;margin-top:4px}
.contact-card .email{display:flex;width:fit-content}
.more-card{background:var(--navy);color:#fff;border-radius:var(--r-card);padding:var(--s5);display:flex;flex-direction:column}
.more-card h3{font:700 26px/1.25 var(--f-display);margin-top:14px}
.more-card p{font:400 16px/1.55 var(--f-ui);color:var(--on-navy-2);margin-top:12px}
.more-card .btn{margin-top:auto;align-self:flex-start;background:#fff;color:var(--navy)}
.more-card .eyebrow{color:var(--gold)}

/* FOOTER
   The K&C file is 4024×839 and the eXp file is 1157×601.
   Footer eXp is 72px tall on desktop (about 139px wide) and 52px on mobile
   (about 100px wide). The mobile K&C logo is 24px tall. Plate padding matches the offers site. */
.footer{background:var(--navy);color:#fff;padding:var(--s6) 0 var(--s5)}
.f-top{display:flex;align-items:center;justify-content:space-between;gap:var(--s4);padding-bottom:var(--s4);border-bottom:1px solid rgba(255,255,255,.18)}
.f-lockup{display:flex;align-items:center;gap:18px}
.plate{background:#fff;border-radius:10px;padding:8px 12px;display:flex}
.plate img{height:26px;width:auto;display:block}
/* 72px tall renders about 139px wide, wider than the K&C plate. */
.f-lockup .exp{height:72px;width:auto;display:block}
.f-lockup .vr{width:1px;height:48px;background:rgba(255,255,255,.28)}
.f-lockup .txt{font:500 16px/1.4 var(--f-ui)}
.f-lockup .txt b{font-weight:600}
.f-lockup .txt i{display:block;font:italic 400 15px/1.4 var(--f-display);color:var(--on-navy-2);margin-top:4px}
.f-nav{display:flex;gap:var(--s4);font:500 15px/1 var(--f-ui)}
.f-nav a{text-decoration:none;min-height:44px;display:inline-flex;align-items:center;color:#fff}
.f-bottom{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--s5);padding-top:var(--s4)}
.eho{display:flex;align-items:center;gap:12px;margin:0;color:#fff;font:600 14px/1.35 var(--f-ui);text-wrap:pretty}
.eho img{height:32px;width:auto;display:block;flex:none}
.f-legal p{font:400 14px/1.6 var(--f-ui);color:var(--on-navy-2);max-width:760px}
.f-legal p+p{margin-top:8px}
.f-legal .broker{color:#fff;font-weight:700}

h1,h2,h3{text-wrap:balance}
p,.legal-page .meta,.f-legal p{text-wrap:pretty}
.entry-title,.entry-desc,.no-sell,p.help,.callout p{text-wrap:balance}
.contact-grid h2{text-wrap:pretty}

/* TABLET */
@media (max-width:1100px){
  .shell{width:calc(100% - 48px)}
  .hero-grid,.routes,.contact-grid{grid-template-columns:minmax(0,1fr)}
}

/* MOBILE */
@media (max-width:767px){
  .shell{width:calc(100% - 32px)}
  .header-inner{min-height:76px;gap:var(--s2);min-width:0}
  .lockup{display:inline-flex;width:max-content;flex:none;min-width:max-content;gap:12px}
  .lockup .kc,.lockup .exp,.lockup .vr{flex:none}
  .lockup .kc,.lockup .exp{display:block;width:auto;height:auto;max-width:none;object-fit:contain}
  .lockup .kc{height:24px}
  .lockup .exp{height:48px}
  .lockup .vr{height:36px;flex:none}
  .nav{display:none}
  .menu-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;flex:none;min-height:56px;min-width:56px;padding:0 14px;border-radius:12px;border:1.5px solid var(--line);background:#fff;font:600 16px/1 var(--f-ui);color:var(--navy)}
  .menu-btn span[aria-hidden="true"]{display:block;width:18px;height:2px;background:var(--navy);box-shadow:0 -6px 0 var(--navy),0 6px 0 var(--navy)}
  .mobile-nav:not([hidden]){display:flex;flex-direction:column;gap:4px;position:absolute;left:0;right:0;top:100%;background:#fff;border-top:1px solid var(--line);border-bottom:1px solid #4A4566;padding:8px 16px 16px;box-shadow:var(--shadow)}
  .mobile-nav a{display:flex;align-items:center;min-height:44px;padding:10px 8px;font:500 16px/1.3 var(--f-ui);color:var(--navy);text-decoration:none}
  .mobile-nav a.btn{margin-top:8px;min-height:56px;justify-content:center;color:#fff;font-size:18px;text-decoration:none}
  .mobile-nav-close{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;min-height:56px;min-width:56px;margin-top:4px;padding:0 14px;border-radius:12px;border:1.5px solid var(--line);background:#fff;font:600 16px/1 var(--f-ui);color:var(--navy);cursor:pointer}
  .mobile-nav-close::before{content:"";width:14px;height:14px;flex:none;background:linear-gradient(currentColor,currentColor) center/14px 2px no-repeat,linear-gradient(currentColor,currentColor) center/2px 14px no-repeat;transform:rotate(45deg)}
  .hero-wrap{padding:0 0 var(--s2)}
  .hero-wrap>.shell{width:100%}
  .hero-grid{gap:0}
  .hero{border-radius:0;min-height:0;height:auto;display:block}
  .hero-text{padding:28px var(--s2) 24px}
  .hero h1{font-size:30px;margin:12px 0 0}
  .hero .intro,.hero .tagline,.hero .hero-ctas{display:none}
  .eyebrow{font-size:13px}
  .eyebrow::before{width:18px}
  .hero-m{display:block;background:#fff;padding:20px var(--s2) var(--s3);border-bottom:1px solid var(--line)}
  .hero-m .intro{font:400 16px/1.55 var(--f-ui);color:var(--ink-2)}
  .hero-m .tagline{color:var(--navy);font-size:15px;margin-top:14px}
  .hero-m .tagline::before{background:var(--gold)}
  .hero-m .btn{width:100%;min-height:56px;font-size:18px;margin-top:var(--s2)}
  .hero-m .btn+.btn{margin-top:12px}
  .hero-grid .card{margin:var(--s3) var(--s2) 0;padding:var(--s3)}
  .card h2{font-size:28px}
  .card .lead{font-size:16px}
  .portal-entry{padding:16px}
  .entry-title{font-size:18px}
  .entry-desc{font-size:14px}
  .section{padding:var(--s6) 0}
  .section-head{margin-bottom:var(--s3)}
  .section-head h2,.contact-grid h2{font-size:30px}
  .section-head p{font-size:16px}
  .route{padding:var(--s3)}
  .route h3{font-size:22px}
  .route p{font-size:16px}
  .route .btn{width:100%;min-height:56px;font-size:17px}
  .callout{align-items:flex-start;font-size:16px;padding:var(--s2)}
  .contact-card,.more-card{padding:var(--s3)}
  .more-card .btn{min-height:56px;min-width:56px}
  .contact-card{padding-left:16px;padding-right:16px}
  .contact-lockup{gap:8px}
  .contact-lockup .exp{flex-basis:123.21px;width:123.21px}
  .contact-lockup .vr{height:32px;flex:none}
  .phone{font-size:26px}
  .footer{padding:var(--s5) 0 var(--s4)}
  .f-top,.f-bottom{flex-direction:column;align-items:flex-start;gap:var(--s3)}
  .f-lockup{flex-wrap:wrap;gap:12px}
  .plate{padding:6px 9px;border-radius:8px}
  .plate img{height:24px}
  .f-lockup .exp{height:52px}
  .f-lockup .vr{height:36px}
  .f-lockup .txt{flex-basis:100%}
  .f-nav{flex-wrap:wrap;gap:4px var(--s3)}
  .f-legal p{font-size:13px}
}
@media (max-width:335px){
  .f-legal p:last-of-type{max-width:16em}
}

/* Narrow phones: keep the K&C mark at 24px and give that width back by using an icon button. */
@media (max-width:389px){
  .header-inner{gap:8px}
  .lockup{gap:8px}
  .lockup .exp{height:44px}
  .lockup .vr{height:32px}
  .menu-btn{width:56px;height:56px;padding:0;gap:0}
  .menu-btn .menu-label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap;border:0}
}
/* 320px windows with classic ~15px scrollbars lay out at 305px. Shrink-wrap
   the lockup and give the header 8px of side inset so both logos stay inside
   the link with at least 4px before Menu. Heights stay 24px / 44px. */
@media (max-width:360px){
  .site-header .header-inner{width:calc(100% - 16px);gap:8px}
  .lockup{gap:6px}
}

@media (min-width:768px){
  .mobile-nav{display:none !important}
}
@media (min-width:768px) and (max-width:1023px){
  .header-inner{gap:16px}
  .lockup{flex:none;gap:12px}
  .lockup .kc{height:24px}
  .lockup .exp{height:48px}
  .lockup .vr{height:36px}
  .nav{gap:12px;font-size:15px}
  .nav a{white-space:nowrap}
  .nav .btn{padding:0 14px}
  .f-top{flex-direction:column;align-items:flex-start;gap:24px}
  .f-nav a{white-space:nowrap}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
}

@media (forced-colors:active){
  .menu-btn span[aria-hidden="true"]{forced-color-adjust:none;background:ButtonText;box-shadow:0 -6px 0 ButtonText,0 6px 0 ButtonText}
  .mobile-nav-close::before{forced-color-adjust:none;background:linear-gradient(ButtonText,ButtonText) center/14px 2px no-repeat,linear-gradient(ButtonText,ButtonText) center/2px 14px no-repeat}
  .footer{forced-color-adjust:none}
}

/* Policy pages. Body markup is unchanged; these rules only restyle it. */
.legal-page main{padding:64px 20px 80px}
.legal-page .container{max-width:760px;margin-inline:auto}
.legal-page .page-header{padding-bottom:24px;margin-bottom:32px;border-bottom:1px solid var(--line)}
.legal-page .page-header h1{font:700 48px/1.15 var(--f-display);letter-spacing:0;margin:0 0 12px}
.legal-page .meta{font:400 13px/1.6 var(--f-ui);color:var(--ink-2)}
@media (max-width:520px){
  .legal-page .meta strong:nth-of-type(2)::before{content:"";display:block;height:0}
}
.legal-page .intro{border-left:2px solid var(--gold);padding:8px 0 8px 20px;margin-bottom:36px;font:400 17px/1.6 var(--f-ui);color:var(--navy)}
.legal-page main section{margin-bottom:32px}
.legal-page main h2{display:flex;align-items:baseline;gap:12px;font:700 26px/1.3 var(--f-display);margin:0 0 12px}
.legal-page .num{font:600 13px/1 var(--f-ui);color:var(--gold-print);min-width:18px}
.legal-page main section p,.legal-page main li{font:400 16px/1.65 var(--f-ui);color:var(--navy)}
.legal-page main ul{padding-left:22px;margin:8px 0}
.legal-page main li{padding-block:4px}
body.legal-page main li{text-wrap:balance}
body.legal-page main li:last-child{text-wrap:pretty}
.legal-page .highlight-box,.legal-page .contact-block{background:var(--white);border:1px solid var(--line);border-radius:18px;padding:20px 24px;margin-top:12px}
.legal-page main a{color:var(--navy);text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere}
.legal-page .contact-block a{display:inline-flex;align-items:center;min-height:44px}
.legal-page .no-sell{display:inline-block;padding:12px 14px;margin-top:12px;background:#eaf0e7;color:#1f3d24;font:600 16px/1.5 var(--f-ui);border-radius:10px}
@media (max-width:767px){
  .legal-page main{padding:32px 16px 48px}
  .legal-page .page-header h1{font-size:34px}
  .legal-page main h2{font-size:24px}
  .legal-page .intro{padding-left:16px;font-size:16px}
  .legal-page .highlight-box,.legal-page .contact-block{padding:16px}
}
@media (max-width:359px){
  .legal-page .contact-block{padding-inline:12px}
  .legal-page .contact-block a[href^="mailto:"]{font-size:15px;overflow-wrap:normal;word-break:normal;white-space:nowrap}
  .contact-grid h2{font-size:28px}
}


/* Public-site presentation. Legal copy and navigation behavior stay unchanged. */
.public-refresh {
  --r-card: 20px;
  --r-btn: 10px;
  --shadow: 0 2px 3px rgb(22 12 75 / 3%), 0 16px 28px -16px rgb(22 12 75 / 24%);
}
.public-refresh .shell { width: min(1240px, calc(100% - 80px)); }
.public-refresh .header-inner { min-height: 96px; gap: 24px; }
.public-refresh .nav { gap: 24px; font-size: 14px; }
.public-refresh .nav a { white-space: nowrap; }
.public-refresh .btn { min-height: 48px; font-size: 15px; padding-inline: 20px; }
.public-refresh .btn-blue:hover { background: #0064C8; }
.public-refresh .btn-navy:hover { background: #2A1F68; }
.public-refresh .btn-ghost:hover { background: #F0EFF6; }

/* The photo supplies the atmosphere; the opaque lower gradient keeps the copy readable. */
.public-refresh .hero-wrap { padding: 40px 0 48px; }
.public-refresh .hero-grid { grid-template-columns: minmax(0, 1.62fr) minmax(0, 1fr); gap: 28px; }
.public-refresh .hero { min-height: 560px; isolation: isolate; }
.public-refresh .hero-photo {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; object-position: center 38%; z-index: -2;
}
.public-refresh .hero::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(180deg, rgb(22 12 75 / 8%) 0%, rgb(22 12 75 / 66%) 28%, rgb(22 12 75 / 94%) 45%, #160C4B 100%);
}
.public-refresh .hero-text { padding: 42px; }
.public-refresh .hero h1 { font-size: clamp(38px, 3.55vw, 50px); line-height: 1.12; margin: 16px 0; text-wrap: initial; }
.public-refresh .hero .intro { font-size: 17px; line-height: 1.55; max-width: 510px; }
.public-refresh .hero-ctas { margin-top: 24px; }
.public-refresh .hero-ctas .btn-ghost:hover { background: rgb(255 255 255 / 12%); }
.public-refresh .tagline { font-size: 15px; margin-top: 22px; }
.public-refresh .card { padding: 36px; display: flex; flex-direction: column; justify-content: center; }
.public-refresh .card h2 { font-size: 32px; margin: 14px 0 12px; }
.public-refresh .card .lead { font-size: 16px; line-height: 1.5; }
.public-refresh .portal-entry { padding: 17px 16px; gap: 12px; border-radius: 14px; margin-top: 12px; }
.public-refresh .portal-entry:first-of-type { margin-top: 24px; }
.public-refresh .entry-title { font-size: 17px; }
.public-refresh .entry-desc { font-size: 13px; line-height: 1.5; margin-top: 4px; }
.public-refresh .arrow { width: 38px; height: 38px; font-size: 20px; }
.public-refresh .note { font-size: 13px; line-height: 1.55; margin-top: 24px; }
.public-refresh .link { margin-top: 8px; font-size: 14px; align-self: flex-start; }

.public-refresh .section { padding: 64px 0; }
.public-refresh .section.white { border-top: 0; }
.public-refresh .section-head { margin-bottom: 32px; }
.public-refresh .section-head h2 { font-size: 36px; margin: 14px 0 12px; }
.public-refresh .section-head p { font-size: 16px; }
/* Sampled from the solid navy field in the approved K&C logo. */
.public-refresh .routes .btn-navy { background: #0F0948; color: #fff; }
.public-refresh .routes .btn-navy:hover { background: #2A1F68; }
.public-refresh .routes { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
.public-refresh .route { padding: 32px; }
.public-refresh .route .num { width: 40px; height: 40px; border-radius: 10px; font-size: 14px; }
.public-refresh .route h3 { font-size: 25px; margin: 22px 0 14px; }
.public-refresh .route p { font-size: 16px; line-height: 1.6; }
.public-refresh .route .small { font-size: 13px; }
.public-refresh .route .actions { padding-top: 26px; }
.public-refresh .callout { margin-top: 28px; padding: 18px 20px; font-size: 15px; border-radius: 14px; }
.public-refresh .callout .ico { width: 36px; height: 36px; }

.public-refresh .contact-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.12fr) minmax(0, .98fr); gap: 28px; }
.public-refresh .contact-grid h2 { font-size: 34px; line-height: 1.2; }
.public-refresh .contact-card, .public-refresh .more-card { padding: 30px; }
.public-refresh .contact-card .help { font-size: 15px; line-height: 1.5; margin-bottom: 20px; }
.public-refresh .contact-lockup { gap: 12px; }
.public-refresh .contact-lockup .kc { flex-basis: 134.3px; width: 134.3px; }
.public-refresh .contact-lockup .exp { flex-basis: 115.5px; width: 115.5px; }
.public-refresh .contact-lockup .vr { height: 36px; }
.public-refresh .phone { font-size: 27px; margin-top: 16px; white-space: nowrap; }
.public-refresh .email { font-size: 15px; margin-top: 0; }
.public-refresh .more-card .eyebrow { font-size: 13px; letter-spacing: .08em; gap: 8px; }
.public-refresh .more-card .eyebrow::before { width: 18px; }
.public-refresh .more-card h3 { font-size: 25px; margin-top: 16px; }
.public-refresh .more-card p { font-size: 15px; margin: 14px 0 24px; }
.public-refresh .more-card .btn:hover { background: #ECEAF5; }
.public-refresh .footer { padding: 36px 0; }
.public-refresh .f-top { padding-bottom: 24px; gap: 24px; }
.public-refresh .f-lockup { gap: 14px; }
.public-refresh .f-lockup .txt { font-size: 14px; }
.public-refresh .f-lockup .txt i { font-size: 13px; }
.public-refresh .f-nav { gap: 24px; font-size: 14px; }
.public-refresh .f-nav a { white-space: nowrap; }
.public-refresh .f-bottom { padding-top: 24px; }
.public-refresh .f-legal p { font-size: 13px; }
.public-refresh .eho { font-size: 14px; max-width: 240px; }

@media (min-width: 768px) and (max-width: 1100px) {
  .public-refresh .shell { width: calc(100% - 48px); }
  .public-refresh .header-inner { min-height: 84px; gap: 16px; }
  .public-refresh .lockup { gap: 12px; flex: none; }
  .public-refresh .lockup .kc { height: 24px; }
  .public-refresh .lockup .exp { height: 48px; }
  .public-refresh .lockup .vr { height: 36px; }
  .public-refresh .nav { gap: 12px; font-size: 13px; }
  .public-refresh .nav .btn { padding-inline: 14px; font-size: 13px; }
  .public-refresh .hero-grid { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 20px; }
  .public-refresh .hero { min-height: 540px; }
  .public-refresh .hero-text { padding: 28px; }
  .public-refresh .hero h1 { font-size: 38px; }
  .public-refresh .hero .intro { font-size: 16px; }
  .public-refresh .hero-ctas { gap: 10px; }
  .public-refresh .hero-ctas .btn { padding-inline: 14px; font-size: 14px; }
  .public-refresh .card { padding: 24px; }
  .public-refresh .card h2 { font-size: 28px; }
  .public-refresh .entry-title { font-size: 16px; }
  .public-refresh .portal-entry { padding: 14px 12px; gap: 8px; }
  .public-refresh .arrow { width: 30px; height: 30px; }
  .public-refresh .routes { gap: 20px; }
  .public-refresh .route { padding: 26px; }
  .public-refresh .route h3 { font-size: 23px; }
  .public-refresh .contact-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
  .public-refresh .contact-grid > :first-child { grid-column: 1 / -1; }
  .public-refresh .contact-grid h2 br { display: none; }
  .public-refresh .f-top { flex-direction: column; align-items: flex-start; }
}

@media (max-width: 767px) {
  .public-refresh .shell { width: calc(100% - 32px); }
  .public-refresh .header-inner { min-height: 76px; gap: 12px; }
  .public-refresh .hero-wrap { padding: 0 0 32px; }
  .public-refresh .hero-wrap > .shell { width: 100%; }
  .public-refresh .hero-grid { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .public-refresh .hero { min-height: 300px; display: flex; }
  .public-refresh .hero::before { background: linear-gradient(180deg, rgb(22 12 75 / 8%) 0%, rgb(22 12 75 / 20%) 22%, rgb(22 12 75 / 94%) 65%, #160C4B 100%); }
  .public-refresh .hero-photo { object-position: center 35%; }
  .public-refresh .hero-text { padding: 24px 16px; }
  .public-refresh .hero h1 { font-size: 32px; margin: 12px 0 0; }
  .public-refresh .hero-m { padding: 20px 16px 24px; }
  .public-refresh .hero-m .intro { font-size: 16px; }
  .public-refresh .hero-m .btn { min-height: 56px; font-size: 17px; }
  .public-refresh .hero-m .tagline { font-size: 14px; margin-top: 18px; }
  .public-refresh .hero-grid .card { padding: 28px 24px 20px; margin: 24px 16px 0; }
  .public-refresh .card h2 { font-size: 28px; }
  .public-refresh .card .lead { font-size: 16px; }
  .public-refresh .portal-entry { min-height: 80px; padding: 16px; }
  .public-refresh .arrow { width: 32px; height: 32px; }
  .public-refresh .section { padding: 44px 0; }
  .public-refresh .section-head { margin-bottom: 24px; }
  .public-refresh .section-head h2, .public-refresh .contact-grid h2 { font-size: 29px; }
  .public-refresh .routes, .public-refresh .contact-grid { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .public-refresh .route { padding: 24px; }
  .public-refresh .route h3 { font-size: 23px; }
  .public-refresh .route .btn, .public-refresh .more-card .btn { width: 100%; min-height: 56px; font-size: 16px; }
  .public-refresh .callout { padding: 16px; gap: 12px; align-items: flex-start; margin-top: 20px; }
  .public-refresh .callout .ico { width: 28px; height: 28px; }
  .public-refresh .contact-card, .public-refresh .more-card { padding: 28px 24px; }
  .public-refresh .contact-card .help { max-width: none; }
  .public-refresh .contact-lockup { justify-content: flex-start; }
  .public-refresh .phone { font-size: 28px; }
  .public-refresh .footer { padding: 32px 0; }
  .public-refresh .f-lockup { gap: 12px; }
  .public-refresh .f-lockup .txt { font-size: 14px; }
  .public-refresh .f-nav { gap: 4px 24px; }
  .public-refresh .f-bottom { gap: 24px; }
}
@media (max-width: 389px) {
  .public-refresh .header-inner { gap: 8px; }
  .public-refresh .hero h1 { font-size: 29px; }
  .public-refresh .hero { min-height: 280px; }
  .public-refresh .hero-grid .card { padding-inline: 20px; }
  .public-refresh .portal-entry { padding-inline: 12px; }
  .public-refresh .entry-title { font-size: 16px; }
  .public-refresh .contact-card, .public-refresh .more-card { padding-inline: 22px; }
  .public-refresh .phone { font-size: 26px; }
}
@media (max-width: 360px) {
  .public-refresh .site-header .header-inner { width: calc(100% - 16px); }
}
@media (forced-colors: active) {
  .public-refresh .hero-photo, .public-refresh .hero::before { display: none; }
  .public-refresh .hero, .public-refresh .hero-text { background: Canvas; color: CanvasText; }
  .public-refresh .hero h1 em, .public-refresh .hero .intro, .public-refresh .hero .eyebrow, .public-refresh .hero .tagline { color: CanvasText; }
  .public-refresh .hero-ctas .btn { border: 1px solid ButtonText; }
}