/* Professionals Advantage, Brief 1 re-qualifier landing pages. Production brand. */
:root{
  --charcoal:#373D40; --cream:#ECE7DC; --cream75:#F1EDE5; --cream25:#FAF9F6; --ruby:#FF4753;
  --c75:#5F6467; --c50:#9B9E9F; --c25:#CDCFD0; --danger:#B42318;
  --serif:'Source Serif 4',Georgia,'Times New Roman',serif;
  --sans:'Poppins',-apple-system,'Segoe UI',Roboto,sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{background:var(--cream);color:var(--charcoal);font-family:var(--sans);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}
h1,h2{font-family:var(--serif);font-weight:500;letter-spacing:-.025em;line-height:1.04}
h1 em{font-style:italic;color:var(--ruby)}
a{color:inherit}
.skip{position:absolute;left:-999px;top:0;background:var(--charcoal);color:#fff;padding:10px 16px;z-index:100}
.skip:focus{left:16px;top:16px}

header.top{background:var(--charcoal);padding:18px 0}
.wrap{max-width:680px;margin:0 auto;padding:0 24px}
header .wrap{display:flex;align-items:center;justify-content:space-between}
header img{height:24px;width:auto;display:block}
header .tag{color:rgba(255,255,255,.8);font-size:12px;font-weight:500}

.hero{padding:44px 0 10px}
.eyebrow{font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--c75)}
h1{font-size:clamp(34px,7vw,48px);margin:12px 0 16px}
.sub{font-size:17px;color:var(--c75);max-width:58ch}
@media(max-width:480px){.sub{font-size:16px}}

.card{background:var(--cream25);border:1px solid var(--c25);border-radius:12px;padding:28px 26px 30px;margin:26px 0 10px}
@media(max-width:480px){.card{padding:22px 18px 24px;margin-left:-8px;margin-right:-8px}}
.f{display:flex;flex-direction:column;gap:6px;margin-bottom:16px}
.f label{font-size:13px;font-weight:600;color:var(--charcoal)}
.f input{font-family:var(--sans);font-size:16px;color:var(--charcoal);background:#fff;
  border:1px solid var(--c50);border-radius:8px;padding:13px 14px;min-height:48px;width:100%}
.f input:focus{outline:2px solid var(--charcoal);outline-offset:1px;border-color:var(--charcoal)}
.f input[aria-invalid="true"]{border-color:var(--danger)}
.f .err{display:none;font-size:12.5px;color:var(--danger)}
.f.bad .err{display:block}
.hp{position:absolute;left:-9999px;opacity:0;height:0;overflow:hidden}

fieldset{border:0;margin:6px 0 22px}
legend{font-size:13px;font-weight:600;margin-bottom:10px}
.opt{display:flex;gap:12px;align-items:flex-start;padding:13px 14px;border:1px solid var(--c25);
  border-radius:8px;background:#fff;margin-bottom:8px;cursor:pointer;min-height:48px;font-size:15px;line-height:1.4}
.opt:hover{border-color:var(--c50)}
.opt input{margin-top:3px;width:18px;height:18px;accent-color:var(--ruby);flex:none}
.opt:has(input:checked){border-color:var(--charcoal);box-shadow:0 0 0 1px var(--charcoal) inset}
.opt:has(input:focus-visible){outline:2px solid var(--charcoal);outline-offset:2px}
fieldset.bad .opt{border-color:var(--danger)}
fieldset .err{display:none;font-size:12.5px;color:var(--danger);margin-top:4px}
fieldset.bad .err{display:block}

.btn{display:inline-flex;align-items:center;justify-content:center;background:var(--ruby);color:#fff;
  border:0;border-radius:50px;font-family:var(--sans);font-size:16px;font-weight:600;
  padding:15px 32px;min-height:52px;width:100%;cursor:pointer;transition:background 180ms ease}
.btn:hover{background:#E63E49}
.btn:focus-visible{outline:2px solid var(--charcoal);outline-offset:3px}
.btn[disabled]{opacity:.6;cursor:wait}
.fine{font-size:12.5px;color:var(--c75);margin-top:12px;line-height:1.5}
.fine a{color:var(--charcoal)}

.srv{display:none;margin-top:14px;padding:12px 14px;border:1px solid var(--danger);border-radius:8px;font-size:14px;color:var(--danger);background:#fff}
.srv.on{display:block}

.beat{display:none;align-items:center;gap:12px}
.beat.on{display:flex}
.bdot{width:10px;height:10px;border-radius:50%;background:var(--ruby);flex:none;animation:bpulse 1.1s ease-in-out infinite}
@keyframes bpulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.8)}}
.btxt{font-size:15.5px;color:var(--charcoal);font-weight:500}
.gift{display:inline-block;color:var(--charcoal);font-weight:600;font-size:14.5px;border-bottom:2px solid var(--ruby);text-decoration:none;padding-bottom:2px}
.gift:hover{color:var(--ruby)}
.done{display:none}
.done.on{display:block}
.done .tick{width:44px;height:44px;border-radius:50%;background:var(--ruby);display:grid;place-items:center;margin-bottom:18px}
.done .tick::after{content:"";width:10px;height:18px;border:solid #fff;border-width:0 3px 3px 0;transform:rotate(45deg) translate(-2px,-2px)}
.done h2{font-size:28px;margin-bottom:10px}
.done p{font-size:16px;color:var(--c75);max-width:52ch}

.optout{margin:30px 0 0;font-size:13.5px;color:var(--c75)}
.optout a{color:var(--charcoal)}
.optout .box{display:none;margin-top:12px;padding:18px;border:1px solid var(--c25);border-radius:10px;background:var(--cream25)}
.optout .box.on{display:block}
.optout .row{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.optout input{flex:1;min-width:200px;font-family:var(--sans);font-size:16px;padding:11px 12px;min-height:46px;border:1px solid var(--c50);border-radius:8px;background:#fff}
.optout .btn{width:auto;background:transparent;color:var(--charcoal);border:1px solid var(--c50);min-height:46px;padding:10px 22px;font-size:14px}
.optout .btn:hover{background:var(--cream75)}

footer{background:var(--charcoal);color:#fff;margin-top:56px;padding:34px 0 40px}
footer .wrap{display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap}
footer img{height:22px;width:auto}
footer .links{font-size:12.5px;color:rgba(255,255,255,.8);display:flex;gap:18px;flex-wrap:wrap}
footer .links a{color:#fff;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.4)}
footer .legal{width:100%;font-size:11.5px;color:rgba(255,255,255,.78);margin-top:6px}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ---- visual variants ---- */
/* A: hero strip under the header. Straight edges per Tom, no slash crop. */
.herostrip{background:var(--charcoal)}
.herostrip img{display:block;width:100%;height:min(34vh,300px);object-fit:cover}
body.vhero .hero{padding-top:34px}

/* B: the page as is, over a full background image with a charcoal scrim.
   The form card stays opaque, so the form itself is untouched. */
body.vbg{background:#23272a}
body.vbg::before{content:"";position:fixed;inset:0;z-index:-1;
  background:linear-gradient(rgba(35,39,42,.55),rgba(35,39,42,.86)),url("/assets/bg-suburb.jpg") center/cover no-repeat}
body.vbg[data-intent="rental"]::before{background:linear-gradient(rgba(35,39,42,.55),rgba(35,39,42,.86)),url("/assets/bg-rental.jpg") center/cover no-repeat}
body.vbg header.top{background:rgba(55,61,64,.6);backdrop-filter:blur(4px)}
body.vbg .eyebrow{color:#FF4753}
body.vbg h1,body.vbg footer{color:#fff}
body.vbg .sub{color:rgba(255,255,255,.88)}
body.vbg .optout{color:rgba(255,255,255,.85)}
body.vbg .optout a{color:#fff}
body.vbg footer{background:rgba(43,48,51,.92)}

/* ---- v2: split name fields ---- */
.pair{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
@media(max-width:480px){.pair{grid-template-columns:1fr}}

/* ---- v2: prefill welcome line ---- */
.welcome{font-size:14.5px;color:var(--charcoal);background:var(--cream);
  border-left:3px solid var(--ruby);padding:10px 14px;margin-bottom:18px;border-radius:6px}

/* ---- v2: the not-now acknowledgment page ---- */
body.notnow{background:var(--charcoal);color:#fff;display:flex;flex-direction:column;min-height:100vh}
body.notnow main{flex:1;display:flex;flex-direction:column;justify-content:center}
.nnwrap{max-width:720px;text-align:center;padding-top:24px;padding-bottom:18px}
body.notnow h1{color:#fff}
body.notnow .hero{padding:12px 0 8px}
body.notnow header.top .wrap{justify-content:center}
body.notnow .sub{color:rgba(255,255,255,.88);margin-left:auto;margin-right:auto}
.nnimg{margin:26px auto 0;max-width:520px}
.nnimg img{width:100%;display:block;border-radius:2px}