/* ═══════════════════════════════════════════════════════
   Matheson Group Realty — Home Value Funnel (Hero / Glass variant)
   Full-bleed background + glass card, modeled on the
   ottawahomesvalue.com single-hero-photo pattern.
   Coal #263137 · Ivory #F5F1E8 · Brass #B08D57
   ═══════════════════════════════════════════════════════ */
:root {
  --coal:#263137; --coal-deep:#1b2429;
  --ivory:#f5f1e8; --ink:#222b30;
  --brass:#b08d57; --brass-lite:#c9a673; --brass-deep:#9a7843;
  --green:#7fbf7a; --red:#d16b5f;
  --serif:'Fraunces',Georgia,serif; --sans:'Hanken Grotesk',-apple-system,'Helvetica Neue',Helvetica,Arial,sans-serif;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px}
body{font-family:var(--sans);color:var(--ivory);min-height:100vh;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:var(--brass-lite)}
button,input,select{font-family:var(--sans)}

.skip-link{position:absolute;top:-100px;left:0;background:var(--coal);color:var(--ivory);padding:8px 16px;font-size:.875rem;font-weight:600;z-index:9999;transition:top .2s}
.skip-link:focus{top:0}

/* ── FULL-BLEED BACKGROUND (persists behind every screen) ── */
.hero-bg{position:fixed;inset:0;z-index:0;overflow:hidden;background:var(--coal-deep)}
.hero-bg video,.hero-bg img{width:100%;height:100%;object-fit:cover;object-position:center}
.hero-bg::after{content:"";position:absolute;inset:0;background:
  linear-gradient(180deg, rgba(19,25,28,.55) 0%, rgba(19,25,28,.28) 30%, rgba(19,25,28,.5) 62%, rgba(19,25,28,.88) 100%);
}

/* ── TOP BAR ── */
.site-header{position:relative;z-index:5;padding:18px 24px}
.site-header-inner{max-width:1100px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:12px}
.site-logo{display:flex;align-items:center;gap:10px;text-decoration:none}
.site-logo img{height:26px;display:block;filter:drop-shadow(0 1px 3px rgba(0,0,0,.4))}
.logo-wordmark{font-family:var(--serif);font-size:1rem;font-weight:500;color:var(--ivory);text-shadow:0 1px 4px rgba(0,0,0,.5)}
.header-secure{font-size:.66rem;color:var(--brass-lite);display:flex;align-items:center;gap:5px;letter-spacing:.06em;text-transform:uppercase;font-weight:700;text-shadow:0 1px 3px rgba(0,0,0,.5)}

/* ── PAGE ── */
.page-wrap{position:relative;z-index:2;min-height:calc(100vh - 64px);display:flex;flex-direction:column;justify-content:center;padding:24px 24px 40px}
.stage{max-width:560px;margin:0 auto;width:100%}

/* ── SCREENS ── */
.screen{display:none}
.screen.is-active{display:block;animation:rise .45s ease both}
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}

/* ── GLASS CARD ── */
.glass{background:linear-gradient(180deg, rgba(38,49,55,.72), rgba(27,36,41,.82));backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border:1px solid rgba(245,241,232,.16);border-top:2px solid var(--brass);border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,.35);padding:30px 30px 26px}
.glass-eyebrow{font-size:.68rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--brass-lite);margin-bottom:10px;display:flex;align-items:center;gap:10px}
.glass-eyebrow::before{content:"";width:22px;height:2px;background:var(--brass)}
.glass-title{font-family:var(--serif);font-size:clamp(1.5rem,4vw,2rem);font-weight:500;line-height:1.15;color:var(--ivory);margin-bottom:8px}
.glass-title em{font-style:italic;color:var(--brass-lite)}
.glass-sub{font-size:.92rem;color:rgba(245,241,232,.72);line-height:1.55;margin-bottom:22px}

/* ── STEP INDICATOR ── */
.step-tag{font-size:.66rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--brass-lite);margin-bottom:6px}
.step-track{height:3px;background:rgba(245,241,232,.15);border-radius:3px;margin-bottom:20px;overflow:hidden}
.step-fill{height:100%;background:linear-gradient(90deg,var(--brass),var(--brass-lite));transition:width .5s ease}

/* ── ADDRESS ROW (single-line, mirrors ottawahomesvalue.com) ── */
.addr-group{display:flex;gap:8px;margin-bottom:8px}
.addr-wrap-rel{position:relative;flex:1}
.addr-input{width:100%;font-size:1rem;padding:14px 16px;border:1px solid rgba(245,241,232,.25);background:rgba(245,241,232,.94);color:var(--ink);border-radius:9px;outline:none;transition:border-color .15s,box-shadow .15s}
.addr-input:focus{border-color:var(--brass);box-shadow:0 0 0 3px rgba(176,141,87,.28)}
.addr-input::placeholder{color:#7c766a}
.addr-input.err{border-color:var(--red);box-shadow:0 0 0 3px rgba(209,107,95,.25)}
.addr-btn{background:linear-gradient(180deg,var(--brass-lite),var(--brass));color:var(--coal-deep);border:none;padding:14px 26px;font-size:.92rem;font-weight:800;letter-spacing:.02em;cursor:pointer;border-radius:9px;white-space:nowrap;transition:.2s;flex-shrink:0}
.addr-btn:hover{filter:brightness(1.06);transform:translateY(-1px)}
.ac-box{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:50;background:var(--ivory);border:1px solid rgba(38,49,55,.12);border-top:2px solid var(--brass);border-radius:9px;display:none;max-height:220px;overflow-y:auto;box-shadow:0 12px 32px rgba(0,0,0,.35)}
.ac-item{padding:11px 14px;font-size:.86rem;cursor:pointer;border-bottom:1px solid rgba(38,49,55,.08);display:flex;align-items:flex-start;gap:9px;line-height:1.4;color:var(--ink)}
.ac-item:last-child{border-bottom:none}
.ac-item:hover{background:rgba(176,141,87,.14)}
.ac-item-text{flex:1}
.ac-item-main{font-weight:600}
.ac-item-sub{font-size:.78rem;color:#6b6459;margin-top:1px}
.addr-hint{font-size:.76rem;color:rgba(245,241,232,.55);margin-top:6px}

/* ── GOOGLE PLACES AUTOCOMPLETE (injected into body by Google) ── */
.pac-container{background:var(--coal);border:1px solid rgba(245,241,232,.16);border-top:2px solid var(--brass);border-radius:9px;box-shadow:0 12px 32px rgba(0,0,0,.35);font-family:var(--sans);margin-top:6px;overflow:hidden}
.pac-item{padding:10px 14px;font-size:.86rem;color:rgba(245,241,232,.85);border-top:1px solid rgba(245,241,232,.08)}
.pac-item:first-child{border-top:none}
.pac-item:hover,.pac-item-selected{background:rgba(176,141,87,.14)}
.pac-icon{display:none}
.pac-item-query{font-weight:600;color:var(--ivory)}
.pac-matched{color:var(--brass-lite)}
.searching-anim{font-size:.78rem;color:rgba(245,241,232,.75);margin-top:8px;opacity:0;transition:opacity .3s;display:flex;align-items:center;gap:6px}
.searching-anim.show{opacity:1}
.dot-pulse{display:flex;gap:3px}
.dot-pulse span{width:5px;height:5px;border-radius:50%;background:var(--brass-lite);animation:pulse-dot 1.2s infinite}
.dot-pulse span:nth-child(2){animation-delay:.2s}
.dot-pulse span:nth-child(3){animation-delay:.4s}
@keyframes pulse-dot{0%,80%,100%{transform:scale(.6);opacity:.4}40%{transform:scale(1);opacity:1}}

/* ── PROPERTY FOUND + MAP ── */
.prop-found-banner{background:rgba(127,191,122,.14);border:1px solid rgba(127,191,122,.4);border-left:4px solid var(--green);padding:11px 14px;display:flex;align-items:center;gap:10px;border-radius:9px 9px 0 0}
.prop-found-label{font-size:.86rem;font-weight:700;color:var(--green)}
.prop-found-addr{font-size:.79rem;color:rgba(245,241,232,.75);margin-top:1px}
.prop-change-btn{flex-shrink:0;background:transparent;border:1px solid rgba(245,241,232,.3);color:rgba(245,241,232,.8);font-size:.72rem;font-weight:700;padding:6px 12px;border-radius:6px;cursor:pointer;transition:.15s}
.prop-change-btn:hover{border-color:var(--brass-lite);color:var(--brass-lite)}
.prop-map-box{height:200px;width:100%;border:1px solid rgba(245,241,232,.18);border-top:none;overflow:hidden;background:var(--coal-deep);border-radius:0 0 9px 9px}
.map-pin-icon{pointer-events:none}
.map-pin-drop{position:relative;width:34px;height:44px}
.map-pin-drop svg{position:absolute;top:0;left:0;filter:drop-shadow(0 3px 4px rgba(0,0,0,.4));animation:pin-drop .5s cubic-bezier(.4,0,.2,1.4)}
.map-pin-drop .map-pin-shadow{position:absolute;left:9px;top:39px;width:16px;height:6px;background:rgba(0,0,0,.35);border-radius:50%;filter:blur(1px);animation:pin-shadow .5s ease-out}
@keyframes pin-drop{0%{transform:translateY(-30px);opacity:0}60%{transform:translateY(4px)}100%{transform:translateY(0);opacity:1}}
@keyframes pin-shadow{0%{transform:scale(.2);opacity:0}100%{transform:scale(1);opacity:1}}
.prop-continue-btn{margin-top:12px}

/* ── CHECKLIST ── */
.check-list{list-style:none;display:flex;flex-direction:column;gap:8px;margin:20px 0 4px;padding-left:2px}
.check-list li{font-size:.83rem;color:rgba(245,241,232,.7);display:flex;align-items:flex-start;gap:9px;line-height:1.5}
.check-mark{width:15px;height:15px;flex-shrink:0;margin-top:2px;background:var(--brass);border-radius:50%;display:inline-flex;align-items:center;justify-content:center}

/* ── FORM ── */
.form-grid{display:flex;flex-direction:column;gap:14px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.field{display:flex;flex-direction:column;gap:5px}
.field-label{font-size:.78rem;font-weight:700;color:rgba(245,241,232,.85);display:flex;align-items:center;gap:4px}
.req{color:var(--red);font-weight:700}
.field input,.field select{font-family:var(--sans);font-size:.93rem;padding:11px 12px;border:1px solid rgba(245,241,232,.22);border-radius:8px;background:rgba(245,241,232,.94);color:var(--ink);outline:none;transition:border-color .15s,box-shadow .15s;width:100%}
.field input:focus,.field select:focus{border-color:var(--brass);box-shadow:0 0 0 3px rgba(176,141,87,.28)}
.field input.err,.field select.err{border-color:var(--red);box-shadow:0 0 0 3px rgba(209,107,95,.25)}
.field input::placeholder{color:#7c766a}
.required-note{font-size:.74rem;color:rgba(245,241,232,.5);margin-bottom:2px}
.required-note span{color:var(--red)}

/* ── BUTTONS ── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--sans);font-size:.92rem;font-weight:700;padding:13px 24px;border:none;border-radius:9px;cursor:pointer;text-decoration:none;transition:.2s;line-height:1.4}
.btn-primary{background:linear-gradient(180deg,var(--brass-lite),var(--brass));color:var(--coal-deep)}
.btn-primary:hover{filter:brightness(1.06);transform:translateY(-1px);text-decoration:none}
.btn-navy{background:var(--coal-deep);color:var(--ivory);border:1px solid rgba(245,241,232,.2)}
.btn-navy:hover{background:#141b1f;text-decoration:none;transform:translateY(-1px)}
.btn-outline{background:transparent;color:rgba(245,241,232,.7);border:1px solid rgba(245,241,232,.25)}
.btn-outline:hover{background:rgba(245,241,232,.08)}
.btn-full{width:100%}
.btn-row{display:flex;gap:10px;margin-top:20px}

/* ── ALERTS ── */
.alert{padding:11px 14px;font-size:.83rem;margin-bottom:14px;border-left:4px solid;border-radius:0 8px 8px 0;display:flex;align-items:flex-start;gap:8px;line-height:1.5}
.alert-error{background:rgba(209,107,95,.16);border-color:var(--red);color:#ffd8d2}

/* ── FOUND BANNER (step 2 top) ── */
.found-banner{background:rgba(127,191,122,.14);border:1px solid rgba(127,191,122,.4);border-left:4px solid var(--green);padding:12px 16px;margin-bottom:18px;border-radius:9px;display:flex;align-items:flex-start;gap:10px}
.found-label{font-size:.85rem;font-weight:700;color:var(--green)}
.found-sub{font-size:.79rem;color:rgba(245,241,232,.75);margin-top:2px}

/* ── CALC ── */
.calc-spinner{width:52px;height:52px;margin:0 auto 16px}
.calc-spinner svg{animation:spin 1.4s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.calc-title{font-family:var(--serif);font-size:1.15rem;font-weight:500;color:var(--ivory);margin-bottom:4px;text-align:center}
.calc-subtitle{font-size:.83rem;color:rgba(245,241,232,.6);margin-bottom:22px;text-align:center}
.calc-steps{max-width:340px;margin:0 auto;text-align:left}
.calc-step-row{font-size:.79rem;color:rgba(245,241,232,.45);padding:7px 12px;border-left:3px solid rgba(245,241,232,.15);margin-bottom:3px;transition:all .25s;border-radius:0 6px 6px 0}
.calc-step-row.active{border-left-color:var(--brass);color:var(--ivory);font-weight:600;background:rgba(176,141,87,.12)}
.calc-step-row.done{border-left-color:var(--green);color:var(--green)}

/* ── RESULTS ── */
.results-eyebrow{font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--brass-lite);margin-bottom:6px;font-weight:700}
.results-address{font-family:var(--serif);font-size:1.1rem;font-weight:500;color:var(--ivory);margin-bottom:16px}
.estimate-table{width:100%;border-collapse:collapse;border:1px solid rgba(245,241,232,.16);border-radius:10px;overflow:hidden;margin-bottom:20px}
.estimate-table th{font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(245,241,232,.5);font-weight:600;padding:8px 10px;text-align:center;border-right:1px solid rgba(245,241,232,.1);background:rgba(245,241,232,.04)}
.estimate-table td{font-size:1.15rem;font-weight:700;padding:12px 10px;text-align:center;border-right:1px solid rgba(245,241,232,.1);font-variant-numeric:tabular-nums;color:var(--ivory)}
.estimate-table td.main{font-family:var(--serif);font-size:1.55rem;color:var(--brass-lite)}
.estimate-table th:last-child,.estimate-table td:last-child{border-right:none}
.details-table{width:100%;border-collapse:collapse;font-size:.84rem;margin-bottom:16px}
.details-table tr{border-bottom:1px solid rgba(245,241,232,.1)}
.details-table tr:last-child{border-bottom:none}
.details-table td{padding:9px 2px;color:rgba(245,241,232,.85)}
.details-table td:first-child{font-weight:600;color:rgba(245,241,232,.5);width:46%}
.appreciation-bar{height:5px;background:rgba(245,241,232,.15);margin-top:5px;border-radius:3px;overflow:hidden}
.appreciation-fill{height:100%;background:var(--green);transition:width 1.2s ease}
.ref-badge{font-size:.68rem;font-family:'Courier New',monospace;color:rgba(245,241,232,.55);background:rgba(245,241,232,.06);border:1px solid rgba(245,241,232,.14);padding:3px 9px;border-radius:5px;display:inline-block;letter-spacing:.06em}
.disclaimer{font-size:.72rem;color:rgba(245,241,232,.5);line-height:1.6;padding:11px 13px;background:rgba(245,241,232,.05);border-left:3px solid rgba(245,241,232,.15);border-radius:0 8px 8px 0;margin-bottom:16px}

/* ── AVATAR VIDEO ── */
.avatar-block{background:var(--coal-deep);aspect-ratio:16/9;width:100%;display:flex;align-items:center;justify-content:center;overflow:hidden;margin-bottom:16px;border-radius:14px;border:1px solid rgba(245,241,232,.16)}
.avatar-block video{width:100%;height:100%;object-fit:cover}
.avatar-placeholder-inner{text-align:center;color:rgba(245,241,232,.4);padding:20px}
.avatar-play-icon{width:44px;height:44px;border:2px solid rgba(245,241,232,.25);border-radius:50%;display:grid;place-items:center;margin:0 auto 10px}
.avatar-placeholder-text{font-size:.7rem;letter-spacing:.08em;text-transform:uppercase}

/* ── STEP 2 BRIDGE ── */
.step2-box{margin-top:16px}
.step2-head{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.step2-badge{width:26px;height:26px;background:var(--brass);color:var(--coal-deep);font-size:.78rem;font-weight:800;display:grid;place-items:center;border-radius:50%;flex-shrink:0}
.step2-head-label{font-size:.64rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--brass-lite)}
.step2-head-name{font-family:var(--serif);font-size:1.05rem;font-weight:500;color:var(--ivory);line-height:1.2}
.step2-desc{font-size:.85rem;color:rgba(245,241,232,.72);line-height:1.65;margin-bottom:15px}
.feature-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:16px}
.feature-item{padding:10px 12px;background:rgba(245,241,232,.05);border-left:3px solid var(--brass-lite);border-radius:0 8px 8px 0;font-size:.78rem}
.feature-item-title{font-weight:700;color:var(--ivory);margin-bottom:2px;font-size:.79rem}
.feature-item-text{color:rgba(245,241,232,.6);line-height:1.4}

/* ── FOOTER ── */
.page-footer{position:relative;z-index:5;text-align:center;padding:16px 20px}
.page-footer-text{font-size:.72rem;color:rgba(245,241,232,.55);line-height:1.6}
.page-footer-links{display:flex;gap:14px;justify-content:center;margin-top:6px;flex-wrap:wrap}
.page-footer-links a{font-size:.72rem;color:rgba(245,241,232,.55);text-decoration:none}
.page-footer-links a:hover{color:var(--brass-lite);text-decoration:underline}

/* ── COOKIE NOTE ── */
.cookie-note{position:fixed;left:0;right:0;bottom:0;z-index:20;background:rgba(19,25,28,.92);backdrop-filter:blur(8px);padding:12px 20px;display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap;border-top:1px solid rgba(245,241,232,.1)}
.cookie-note p{font-size:.74rem;color:rgba(245,241,232,.7);max-width:640px}
.cookie-note .btns{display:flex;gap:8px;flex-shrink:0}
.cookie-note button{font-size:.74rem;font-weight:700;padding:7px 16px;border-radius:6px;cursor:pointer;border:1px solid rgba(245,241,232,.25)}
.cookie-note .accept{background:var(--brass);color:var(--coal-deep);border-color:var(--brass)}
.cookie-note .refuse{background:transparent;color:rgba(245,241,232,.7)}

/* ── MOBILE ── */
@media(max-width:600px){
  .addr-group{flex-direction:column}
  .addr-btn{width:100%}
  .form-row{grid-template-columns:1fr}
  .glass{padding:24px 20px 22px}
  .feature-grid{grid-template-columns:1fr}
  .estimate-table td{font-size:.95rem}
  .estimate-table td.main{font-size:1.2rem}
  .btn-row{flex-direction:column}
  .page-wrap{padding:18px 16px 32px}
}
@media(max-width:480px){
  .field input,.field select,.addr-input{font-size:16px}
}