/* Shared light, warm base for the three look directions. Loaded after site.css / webinar.css / go.css. */
:root{--sky:#e6f2f6;--sky-2:#d5e9f0;--warm:#fff1d6;--ink:#2a4254;--text:#2a4254;
  --hf:var(--head);--r:12px;--rb:4px;--hcase:none;--hw:800;--hls:-.02em}
body{background-color:var(--cream)}
h1,h2,h3,h4{font-family:var(--hf);font-weight:var(--hw);letter-spacing:var(--hls)}
.btn,.nav a.cta{border-radius:var(--rb)}
.card,.agentcard,.box,.toc,.formcard,.cta,.story,.tease,.host-photo{border-radius:var(--r)}
/* --- main site --- */
.tape{background:var(--stone);color:var(--muted);border-bottom:1px solid var(--line)}
.tape a{color:var(--teal)}
.hdr{background:rgba(255,250,240,.95);border-bottom:1px solid var(--line)}
.logo,.logo:hover{color:var(--navy);font-family:var(--hf)}
.logo svg{color:#d29a1f}
.nav a{color:var(--text)}
.nav a:hover,.nav a[aria-current=page]{color:var(--navy);background:rgba(9,46,67,.07)}
.nav a.cta{color:var(--navy)}
.burger{border-color:rgba(9,46,67,.3);color:var(--navy)}
.hero{background:var(--sky);color:var(--text)}
.hero::after{background:linear-gradient(90deg,rgba(255,250,240,.97) 0%,rgba(255,250,240,.9) 42%,rgba(255,250,240,.2) 82%)}
.hero h1{font-family:var(--hf);font-stretch:100%;font-weight:var(--hw);text-transform:var(--hcase);color:var(--navy);line-height:1.02;letter-spacing:var(--hls);font-size:clamp(44px,6vw,80px)}
.hero h1 em{font-family:var(--hf);font-stretch:100%;color:var(--teal);border-top-color:var(--gold);text-transform:none;font-size:clamp(22px,2.4vw,30px);font-weight:600}
.hero .eyebrow{color:var(--teal)}
.hero p.lede{color:var(--text)}
.hero .btn.line{box-shadow:inset 0 0 0 1.5px var(--navy);color:var(--navy)}
.hero .btn.line:hover{background:var(--navy);color:var(--cream)}
.hero.sub{background:var(--sky)}
.hero.sub h1{font-family:var(--hf);font-weight:var(--hw)}
.hero.sub h1 em{color:var(--teal)}
.crumbs,.crumbs a{color:var(--muted)}
.crumbs a:hover{color:var(--navy)}
.trust{background:var(--stone);border-top:1px solid var(--line);color:var(--muted)}
.trust .wrap>div{border-left-color:var(--line)}
.trust b{color:var(--navy);font-family:var(--hf);font-stretch:100%;text-transform:none;font-size:17px;letter-spacing:0}
.trust span{color:var(--muted)}
.sec.dark{background:var(--sky);color:var(--text)}
.sec.dark h2,.sec.dark h3{color:var(--navy)}
.sec.dark .eyebrow{color:var(--teal)}
.sec.dark em{color:var(--teal);background:linear-gradient(transparent 62%,rgba(243,197,92,.6) 62%,rgba(243,197,92,.6) 90%,transparent 90%)}
.sec.dark .lead{color:var(--muted)}
.checks.light li{color:var(--navy)}
.punch{font-family:var(--hf);font-stretch:100%;color:var(--navy);text-transform:none;letter-spacing:var(--hls);font-size:clamp(26px,3.4vw,40px);line-height:1.1}
.cta{background:linear-gradient(135deg,var(--warm),var(--sky))}
.cta h2{font-family:var(--hf);font-stretch:100%;color:var(--navy);text-transform:none;line-height:1.05;letter-spacing:var(--hls);font-size:clamp(32px,4.6vw,56px)}
.cta p{color:var(--text)}
.cta .btn.line{border-color:var(--navy)!important;color:var(--navy)!important}
.cta .btn.line:hover{background:var(--navy);color:var(--cream)!important}
.box{background:var(--sky);color:var(--text)}
.box h3{color:var(--navy)}.box p{color:var(--muted)}
.ftr{background:var(--stone);color:var(--muted);border-top:1px solid var(--line)}
.ftr h4{color:var(--teal)}
.ftr a{color:var(--text)}.ftr a:hover{color:var(--teal)}
.ftr .legal{border-top-color:var(--line)}
.ftr .eho,.ftr #broker{color:var(--navy)}
.agentbadge .ab-text{color:var(--navy)}.agentbadge .ab-text span{color:var(--muted)}
.agentbadge .ab-photo{border-color:#fff}
.signup .more-link a{color:var(--teal);text-decoration:underline}
.steps h3{font-family:var(--hf)}
.job p{font-family:var(--hf)}
@media(max-width:1100px){.nav{background:var(--cream);border-bottom-color:var(--line)}}
@media(max-width:980px){.hero::after{background:linear-gradient(180deg,rgba(255,250,240,.9),rgba(255,250,240,.84) 55%,rgba(255,250,240,.95))}}
/* --- class page and ad page --- */
body.go{background:var(--cream)}
.nav:not(.hdr){background:rgba(255,250,240,.94);border-bottom:1px solid var(--line)}
.go-nav{background:transparent!important;border-bottom:0!important}
.nav .logo{color:var(--navy)}
.nav-btn{color:var(--navy);border-color:rgba(9,46,67,.4)}
.nav-btn:hover{background:var(--gold);border-color:var(--gold)}
.link{color:var(--navy)}
.hero::after{z-index:0}
.hero h1,.go-copy h1{font-family:var(--hf);font-stretch:100%;text-transform:var(--hcase);color:var(--navy);line-height:1.02;letter-spacing:var(--hls)}
.go-copy h1{font-size:clamp(44px,6vw,80px)}
.sub{font-family:var(--hf);font-stretch:100%;color:var(--teal);font-weight:600}
.lede{color:var(--text)}
.kick.light{color:var(--teal)}
.go-list li{color:var(--text)}
.hero-bar{border-top:1px solid var(--line);background:rgba(255,250,240,.78)}
.specs>div,.cd-boxes div,.cd-when{border-left-color:var(--line)}
.specs b,.cd-boxes b{font-family:var(--hf);font-stretch:100%;color:var(--navy);text-transform:none}
.specs span,.cd-boxes span{color:var(--muted)}
.specs .when-soon span,.cd-label,.cd-done{color:var(--teal)}
.cd-when{color:var(--text)}
.go .countdown{background:rgba(255,255,255,.7);border-color:var(--line)}
.manifesto{background:var(--sky-2);color:var(--navy)}
.man{font-family:var(--hf);font-stretch:100%;text-transform:none;color:var(--navy);font-weight:var(--hw);line-height:1.2;letter-spacing:var(--hls)}
.man-end{font-family:var(--hf);font-stretch:100%;text-transform:none;color:var(--teal);letter-spacing:var(--hls)}
.man-photo::after{background:linear-gradient(90deg,var(--sky-2) 0%,rgba(213,233,240,.45) 30%,rgba(213,233,240,0) 65%)}
.man-photo img{filter:none}
.tease{background:var(--sky);color:var(--text)}
.tease h2{color:var(--navy)}
.tease li{background:rgba(255,255,255,.7);border-color:var(--line);color:var(--navy)}
.tease li svg{stroke:var(--teal)}
.final{background:linear-gradient(135deg,var(--warm),var(--sky));color:var(--text)}
.final h2{font-family:var(--hf);font-stretch:100%;text-transform:none;color:var(--navy);line-height:1.05;letter-spacing:var(--hls);font-size:clamp(34px,5vw,60px)}
.foot{background:var(--stone);border-top:1px solid var(--line);color:var(--muted)}
.foot a{color:var(--text)}
.broker,.housing{color:var(--navy)}
.sticky{background:rgba(255,250,240,.96);border-top:1px solid var(--line)}
.card{box-shadow:0 24px 50px -34px rgba(9,46,67,.4)}
.btn{font-family:var(--hf)}
@media(max-width:940px){.hero::after{background:linear-gradient(180deg,rgba(255,250,240,.9),rgba(255,250,240,.84) 55%,rgba(255,250,240,.95))}}

/* Phones: show the home hero photo under the text instead of behind it, so faces stay clear. (Home page only.) */
@media(max-width:700px){
  .hero:not(.sub):not(.go-hero)::after{display:none}
  .hero:not(.sub):not(.go-hero) .wrap{padding-bottom:0}
  .hero:not(.sub):not(.go-hero) figure{position:relative;inset:auto;height:280px;margin:30px -22px 0;width:calc(100% + 44px)}
  .hero:not(.sub):not(.go-hero) figure img{object-position:60% 30%}
}

/* Look C: clean and bright. White, hairlines, one blue accent. */
:root{--hf:'Inter',system-ui,sans-serif;--head:'Inter',system-ui,sans-serif;--r:10px;--rb:8px;--hw:700;--hls:-.025em;
  --cream:#ffffff;--stone:#f4f8fa;--warm:#f4f8fa;--sky:#f0f7fa;--sky-2:#e6f1f6;--teal:#1f6f9a;--line:rgba(9,46,67,.12)}
body{background-image:none;background:#fff}
.btn{font-family:var(--hf);font-stretch:100%;text-transform:none;letter-spacing:0;font-size:15.5px;font-weight:600;min-height:50px;box-shadow:none}
.btn.gold{background:var(--gold)}
.btn.line,.hero .btn.line{box-shadow:inset 0 0 0 1px #b8cfdb;color:var(--navy);background:#fff}
.nav a.cta{text-transform:none;letter-spacing:0;font-size:14.5px;font-weight:600;font-family:var(--hf)}
.eyebrow,.kick{font-size:12.5px;letter-spacing:.12em}
.eyebrow::before,.kick>span:first-child{flex-basis:0;width:0;background:none}
.logo{font-family:var(--hf);font-stretch:100%;letter-spacing:.1em;font-size:14px;font-weight:700}
.tape{background:var(--sky-2)}
.hdr,.nav:not(.hdr){background:rgba(255,255,255,.96)}
.hero{background:#fff}
.hero::after{background:linear-gradient(90deg,rgba(255,255,255,.97) 0%,rgba(255,255,255,.88) 40%,rgba(255,255,255,.1) 80%)}
.hero h1{font-weight:700;font-size:clamp(40px,5.2vw,68px);line-height:1.05}
.hero h1 em{font-weight:500;color:var(--teal);border-top:0;padding-top:0;margin-top:14px}
.hero.sub{background:var(--sky)}
.trust{background:#fff}
.trust b{font-weight:700}
.sec{padding:88px 0}
.sec.stone{background:var(--stone)}
.sec.dark{background:var(--sky)}
em{background:none!important;color:var(--teal)!important}
.punch{font-weight:700}
.card,a.card,.agentcard,.myth,.toc,.formcard,.story{box-shadow:none;border:1px solid var(--line)}
a.card:hover{box-shadow:0 18px 36px -26px rgba(9,46,67,.35)}
.formcard{box-shadow:0 24px 48px -36px rgba(9,46,67,.35)}
.agentcard>img,figure.photo,figure.photo img,.host-photo{border-radius:10px}
.cta{background:var(--sky);border:1px solid var(--line)}
.cta h2,.final h2{font-weight:700}
.final{background:var(--sky)}
.steps{border-top:1px solid var(--line)}.steps::before{display:none}
.ruler{display:none}
.field input,.field textarea{border-radius:8px;border-width:1px;background:#fff}
summary::after{background:var(--sky-2);color:var(--teal)}
.prose th{background:var(--sky-2);color:var(--navy)}
.note{background:var(--stone)}
.manifesto{background:var(--sky)}
.man{font-weight:700;font-size:clamp(26px,3.9vw,58px);line-height:1.12}
.man-end{font-weight:700}
.man-photo::after{background:linear-gradient(90deg,var(--sky) 0%,rgba(240,247,250,.4) 30%,rgba(240,247,250,0) 65%)}
.tease{background:var(--sky)}
.ftr,.foot{background:var(--stone)}
.box{background:var(--sky)}
.hero-bar{background:rgba(255,255,255,.85)}
.specs b,.cd-boxes b{font-weight:700}
/* Hero photo treatment borrowed from the editorial look: warm tone and a soft paper-white fade. */
.hero figure img,.hero-bg img{filter:sepia(.22) saturate(.92)}
.hero::after{background:linear-gradient(90deg,rgba(255,252,246,.98) 0%,rgba(255,252,246,.92) 44%,rgba(255,252,246,.15) 84%)}
@media(max-width:980px){.hero::after{background:linear-gradient(180deg,rgba(255,252,246,.9),rgba(255,252,246,.84) 55%,rgba(255,252,246,.95))}}
/* Keep it blue: a clearly blue sky tone behind the hero and main sections. */
:root{--sky:#d3e8f4;--sky-2:#bddcee;--warm:#e3f0f8;--stone:#e8f2f8;--teal:#1b5f8c}
.tape{background:#bddcee;color:#12384f}
.hero{background:var(--sky)}
.hero::after{background:linear-gradient(90deg,rgba(211,232,244,.98) 0%,rgba(211,232,244,.9) 44%,rgba(211,232,244,.1) 84%)}
@media(max-width:980px){.hero::after{background:linear-gradient(180deg,rgba(211,232,244,.9),rgba(211,232,244,.84) 55%,rgba(211,232,244,.95))}}
.trust{background:#e8f2f8}
.sec.dark{background:var(--sky-2)}
.cta,.final{background:linear-gradient(135deg,#cfe6f3,#e6f2f9)}
.hero.sub{background:var(--sky-2)}
.manifesto{background:var(--sky-2)}
.man-photo::after{background:linear-gradient(90deg,#bddcee 0%,rgba(189,220,238,.4) 30%,rgba(189,220,238,0) 65%)}
.box,.tease{background:var(--sky)}
.ftr,.foot{background:#e1eef6}
/* Blue only: natural photo color, no yellow, orange or brown. Buttons and accents are blue. */
:root{--gold:#8cc4e6;--warm:#e3f0f8;--cream:#ffffff}
.hero figure img,.hero-bg img,.man-photo img,figure.photo img{filter:none}
.hero::after{background:linear-gradient(90deg,rgba(211,232,244,.98) 0%,rgba(211,232,244,.9) 44%,rgba(211,232,244,.1) 84%)}
.btn.gold,.btn,.nav a.cta{background:#1b5f8c;color:#fff}
.btn.gold:hover,.btn:hover,.nav a.cta:hover{background:#12486c;color:#fff}
.btn.line,.hero .btn.line,.btn.line:hover{color:var(--navy)}
.btn.line:hover,.hero .btn.line:hover{background:#fff;color:var(--navy)}
.btn.dark{background:var(--navy);color:#fff}
.logo svg{color:#1b5f8c}
.tape a,.hero h1 em,.sub{color:#1b5f8c}
.hero h1 em{border-top-color:#8cc4e6}
.rule,.kick>span:first-child,.eyebrow::before{background:#8cc4e6}
.checks.light li::before,.go-list li::before,.perks li::before{background-color:#8cc4e6}
.note{border-left-color:#8cc4e6}
.check{background:#8cc4e6}
.hh-cc{background:#fff!important;border-color:#c9dce8!important}
.hh-cc .yes{background:#1b5f8c!important;color:#fff!important}