/* ============================================================
   ADVISORY SAN DIEGO — Final CSS
   Exact match to advisorysandiego.com
   No diagonals. Clean splits. Black/white/gray only.
   ============================================================ */

@font-face {font-family:'CompassSerif';src:url('/fonts/compass/CompassSerif/CompassSerif-Regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face {font-family:'CompassSerif';src:url('/fonts/compass/CompassSerif/CompassSerif-Italic.woff2') format('woff2');font-weight:400;font-style:italic;font-display:swap}
@font-face {font-family:'CompassSerif';src:url('/fonts/compass/CompassSerif/CompassSerif-SemiBold.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face {font-family:'CompassSerif';src:url('/fonts/compass/CompassSerif/CompassSerif-SemiBoldItalic.woff2') format('woff2');font-weight:600;font-style:italic;font-display:swap}
@font-face {font-family:'CompassSerif';src:url('/fonts/compass/CompassSerif/CompassSerif-Bold.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face {font-family:'CompassSerif';src:url('/fonts/compass/CompassSerif/CompassSerif-BoldItalic.woff2') format('woff2');font-weight:700;font-style:italic;font-display:swap}

@font-face {font-family:'CompassSans';src:url('/fonts/compass/CompassSans/CompassSans-Light.woff2') format('woff2');font-weight:300;font-style:normal;font-display:swap}
@font-face {font-family:'CompassSans';src:url('/fonts/compass/CompassSans/CompassSans-LightItalic.woff2') format('woff2');font-weight:300;font-style:italic;font-display:swap}
@font-face {font-family:'CompassSans';src:url('/fonts/compass/CompassSans/CompassSans-Regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face {font-family:'CompassSans';src:url('/fonts/compass/CompassSans/CompassSans-Italic.woff2') format('woff2');font-weight:400;font-style:italic;font-display:swap}
@font-face {font-family:'CompassSans';src:url('/fonts/compass/CompassSans/CompassSans-Medium.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face {font-family:'CompassSans';src:url('/fonts/compass/CompassSans/CompassSans-MediumItalic.woff2') format('woff2');font-weight:500;font-style:italic;font-display:swap}
@font-face {font-family:'CompassSans';src:url('/fonts/compass/CompassSans/CompassSans-Medium.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face {font-family:'CompassSans';src:url('/fonts/compass/CompassSans/CompassSans-MediumItalic.woff2') format('woff2');font-weight:600;font-style:italic;font-display:swap}
@font-face {font-family:'CompassSans';src:url('/fonts/compass/CompassSans/CompassSans-Bold.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face {font-family:'CompassSans';src:url('/fonts/compass/CompassSans/CompassSans-BoldItalic.woff2') format('woff2');font-weight:700;font-style:italic;font-display:swap}

@font-face {font-family:'CompassDisplay';src:url('/fonts/compass/CompassDisplay/CompassDisplay-Regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}

:root {
  --black:     #0a0a0a;
  --near-black:#141414;
  --charcoal:  #2a2a2a;
  --mid:       #777;
  --silver:    #bbb;
  --light:     #e5e3df;
  --off-white: #f4f2ee;
  --white:     #fff;
  --font-sans: 'CompassSans','Helvetica Neue',Arial,sans-serif;
  --font-serif:'CompassSerif',Georgia,serif;
  --font-display:'CompassDisplay','CompassSans','Helvetica Neue',Arial,sans-serif;
  --nav-h: 72px;
  --max-w: calc(1600px + var(--container-pad, 70px) * 2);
  --t: 0.25s ease;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased}
body{font-family:var(--font-sans);color:var(--black);background:var(--white);overflow-x:hidden;line-height:1.6}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
ul{list-style:none}
button{border:none;cursor:pointer;font-family:var(--font-sans);background:none}

/* Typography */
h1,h2,h3,h4{font-family:var(--font-sans);font-weight:300;text-transform:uppercase;letter-spacing:0.12em;line-height:1.2}
h1{font-size:clamp(1.4rem,2.8vw,2.6rem)}
h2{font-size:clamp(1rem,1.8vw,1.5rem)}
p{font-size:0.82rem;line-height:1.9;color:var(--charcoal);font-weight:300}
#global-footer p{color:inherit;font-size:inherit;line-height:inherit;font-weight:inherit}

.eyebrow{font-size:0.58rem;font-weight:600;letter-spacing:0.26em;text-transform:uppercase;color:var(--mid);display:block;margin-bottom:10px}

/* Layout */
.wrap{max-width:var(--max-w);margin:0 auto;padding:0 var(--container-pad, 70px)}
.section{padding:72px 0}
.section--light{background:var(--off-white)}
.section--black{background:var(--black);color:var(--white)}
.section--near-black{background:var(--near-black);color:var(--white)}

.rule{width:28px;height:1px;background:var(--black);margin:10px 0 18px}
.rule--white{background:rgba(255,255,255,0.5)}
.rule--center{margin:10px auto 18px}

/* Buttons */
.btn{display:inline-block;padding:10px 24px;font-size:0.58rem;font-weight:600;letter-spacing:0.2em;text-transform:uppercase;border:1px solid transparent;transition:var(--t);cursor:pointer}
.btn--outline{border-color:var(--black);color:var(--black)}
.btn--outline:hover{background:var(--black);color:var(--white)}
.btn--outline-white{border-color:rgba(255,255,255,0.6);color:var(--white)}
.btn--outline-white:hover{background:var(--white);color:var(--black)}
.btn--black{background:var(--black);color:var(--white);border-color:var(--black)}
.btn--black:hover{background:var(--charcoal)}
.btn--white{background:var(--white);color:var(--black);border-color:var(--white)}
.btn--white:hover{background:var(--off-white)}

/* ── NAVIGATION ── */
.nav{position:fixed;top:0;left:0;right:0;z-index:1000;height:var(--nav-h);transition:var(--t)}
.nav--over{background:transparent;border-bottom:1px solid transparent}
.nav--light{background:var(--white);border-bottom:1px solid var(--light)}
.nav--scrolled{background:rgba(255,255,255,0.97)!important;border-bottom-color:var(--light)!important;box-shadow:0 1px 16px rgba(0,0,0,0.06)}

.nav__inner{display:flex;align-items:center;justify-content:space-between;height:var(--nav-h);padding:0 40px;max-width:var(--max-w);margin:0 auto}

.nav__logo{display:flex;align-items:center;text-decoration:none}
.nav__logo img{height:36px;width:auto;transition:var(--t)}
.nav--over .nav__logo img{filter:brightness(0) invert(1)}
.nav--scrolled .nav__logo img,.nav--light .nav__logo img{filter:brightness(0)}

.nav__links{display:flex;align-items:center;gap:24px}
.nav__links a{font-size:0.58rem;font-weight:600;letter-spacing:0.16em;text-transform:uppercase;color:var(--charcoal);transition:var(--t)}
.nav--over .nav__links a{color:rgba(255,255,255,0.85)}
.nav--scrolled .nav__links a{color:var(--charcoal)}
.nav__links a:hover{opacity:0.6}

.nav__right{display:flex;align-items:center;gap:16px}
.nav__phone{font-size:0.58rem;font-weight:500;letter-spacing:0.08em;color:var(--charcoal);transition:var(--t)}
.nav--over .nav__phone{color:rgba(255,255,255,0.8)}
.nav--scrolled .nav__phone{color:var(--charcoal)}

.nav__circle-btn{width:34px;height:34px;border-radius:50%;background:var(--black);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;cursor:pointer;flex-shrink:0}
.nav--over .nav__circle-btn{background:rgba(255,255,255,0.15)}
.nav__circle-btn span{display:block;width:13px;height:1px;background:var(--white)}

.nav__hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:4px}
.nav__hamburger span{display:block;width:20px;height:1.5px;background:var(--black);transition:var(--t)}
.nav--over .nav__hamburger span{background:var(--white)}

.nav__mobile{position:fixed;top:0;right:-100%;width:100%;height:100vh;background:var(--white);z-index:999;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:22px;transition:right 0.5s ease}
.nav__mobile.open{right:0}
.nav__mobile a{font-size:0.62rem;font-weight:600;letter-spacing:0.2em;text-transform:uppercase;color:var(--charcoal)}
.nav__mobile-close{position:absolute;top:22px;right:24px;font-size:1rem;color:var(--mid);cursor:pointer}
.nav__mobile-phone{font-size:0.62rem;color:var(--mid);margin-top:8px}

/* ── HERO — Full Screen Video ── */
.hero{position:relative;height:100vh;min-height:580px;overflow:hidden;display:flex;align-items:flex-end}
.hero__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.hero__overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,0.68) 0%,rgba(0,0,0,0.22) 55%,rgba(0,0,0,0.05) 100%);z-index:1}
.hero__content{position:relative;z-index:2;padding:0 0 64px}
.hero__title{font-size:clamp(1.6rem,2.8vw,3rem);font-weight:300;letter-spacing:0.1em;text-transform:uppercase;color:var(--white);line-height:1.25;margin-bottom:14px}
.hero__body{font-size:0.82rem;color:rgba(255,255,255,0.65);line-height:1.9;max-width:480px;margin-bottom:28px}
.hero__actions{display:flex;gap:12px;flex-wrap:wrap}

/* ── FEATURED STORIES ── */
.stories-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:3px}
.story-card{position:relative;overflow:hidden;display:block;text-decoration:none;aspect-ratio:16/9}
.story-card img{width:100%;height:100%;object-fit:cover;transition:transform 0.7s ease;display:block}
.story-card:hover img{transform:scale(1.04)}
.story-card__overlay{position:absolute;inset:0;background:rgba(0,0,0,0);transition:var(--t)}
.story-card:hover .story-card__overlay{background:rgba(0,0,0,0.3)}
.view-all-card{background:var(--off-white);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:6px;text-decoration:none}
.view-all-card span{font-size:0.58rem;font-weight:600;letter-spacing:0.2em;text-transform:uppercase;color:var(--charcoal)}

/* ── SPOTLIGHTS ── */
.spotlights-row{display:flex;gap:0;overflow-x:auto}
.spotlight-thumb{flex:1;min-width:0;position:relative;overflow:hidden;display:block;text-decoration:none;aspect-ratio:4/3}
.spotlight-thumb img{width:100%;height:100%;object-fit:cover;transition:transform 0.7s ease;display:block}
.spotlight-thumb:hover img{transform:scale(1.05)}
.spotlight-thumb__tag{position:absolute;bottom:10px;left:10px;font-size:0.52rem;font-weight:600;letter-spacing:0.2em;text-transform:uppercase;color:rgba(255,255,255,0.7)}

/* ── LUXURY PORTFOLIO ── */
.portfolio-feature{display:grid;grid-template-columns:58% 42%;min-height:380px}
.portfolio-feature__img{position:relative;overflow:hidden}
.portfolio-feature__img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 0.7s ease}
.portfolio-feature:hover .portfolio-feature__img img{transform:scale(1.03)}
.portfolio-feature__info{background:var(--black);padding:44px 48px;display:flex;flex-direction:column;justify-content:center}
.portfolio-feature__status{font-size:0.52rem;font-weight:600;letter-spacing:0.22em;text-transform:uppercase;color:rgba(255,255,255,0.4);margin-bottom:10px}
.portfolio-feature__address{font-size:0.9rem;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;color:var(--white);margin-bottom:4px}
.portfolio-feature__city{font-size:0.62rem;letter-spacing:0.1em;text-transform:uppercase;color:rgba(255,255,255,0.4);margin-bottom:14px}
.portfolio-feature__specs{font-size:0.62rem;letter-spacing:0.08em;text-transform:uppercase;color:rgba(255,255,255,0.35);margin-bottom:6px}
.portfolio-feature__price{font-size:1rem;font-weight:300;letter-spacing:0.04em;color:var(--white);margin-bottom:24px}
.portfolio-nav{display:flex;gap:2px}
.portfolio-nav button{width:30px;height:30px;border:1px solid rgba(255,255,255,0.2);color:rgba(255,255,255,0.5);font-size:0.65rem;transition:var(--t)}
.portfolio-nav button:hover{border-color:var(--white);color:var(--white)}

/* ── OUR TEAM ── */
.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:3px;position:relative}
.team-card{position:relative;overflow:hidden;display:block;text-decoration:none;aspect-ratio:3/2}
.team-card img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block;transition:transform 0.7s ease}
.team-card:hover img{transform:scale(1.04)}
.team-card__info{position:absolute;bottom:0;left:0;right:0;padding:20px 18px;background:linear-gradient(to top,rgba(0,0,0,0.6),transparent)}
.team-card__name{font-size:0.72rem;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;color:var(--white)}
.team-card__title{font-size:0.55rem;letter-spacing:0.1em;text-transform:uppercase;color:rgba(255,255,255,0.55);margin-top:3px}
.team-nav{display:flex;gap:2px;justify-content:flex-end;margin-top:8px}
.team-nav button{width:30px;height:30px;border:1px solid var(--light);color:var(--mid);font-size:0.65rem;transition:var(--t)}
.team-nav button:hover{border-color:var(--black);color:var(--black)}

/* ── SPLIT SECTION ── */
.split{display:grid;grid-template-columns:1fr 1fr;min-height:460px}
.split__text{padding:64px 56px 64px 40px;display:flex;flex-direction:column;justify-content:center}
.split__image{position:relative;overflow:hidden}
.split__image img{width:100%;height:100%;object-fit:cover;display:block}
.split--dark .split__text{background:var(--black);padding:64px 56px}
.split--dark p{color:rgba(255,255,255,0.6)}
.split--dark h2{color:var(--white)}
.split--reversed .split__text{order:2;padding:64px 40px 64px 56px}
.split--reversed .split__image{order:1}

/* ── NETWORK ── */
.network{padding:72px 0;background:var(--near-black)}
.network__inner{display:grid;grid-template-columns:1fr 1.3fr;gap:72px;align-items:center}
.network__cities{display:flex;flex-wrap:wrap;gap:4px;margin-top:16px}
.network__city{font-size:0.52rem;font-weight:500;letter-spacing:0.1em;text-transform:uppercase;color:rgba(255,255,255,0.3);border:1px solid rgba(255,255,255,0.08);padding:4px 9px;transition:var(--t)}
.network__city:hover{color:rgba(255,255,255,0.6);border-color:rgba(255,255,255,0.2)}

/* ── CTA / DIVER ── */
.cta-image{position:relative;min-height:280px;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden}
.cta-image__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(0.35)}
.cta-image__content{position:relative;z-index:2;padding:48px}
.cta-image__label{font-size:0.58rem;font-weight:600;letter-spacing:0.26em;text-transform:uppercase;color:var(--white);margin-bottom:12px}
.cta-image__body{font-family:var(--font-serif);font-style:italic;font-size:1rem;color:rgba(255,255,255,0.75);line-height:1.7;margin-bottom:22px}

/* ── TESTIMONIALS ── */
.testi-wrap{max-width:800px;margin:0 auto}
.testi-track{overflow:hidden}
.testi-slides{display:flex;transition:transform 0.5s ease}
.testi-slide{min-width:100%;padding:0 40px;text-align:center}
.testi-slide__text{font-family:var(--font-serif);font-size:clamp(0.95rem,1.6vw,1.2rem);font-style:italic;font-weight:300;line-height:1.8;color:var(--charcoal);margin-bottom:18px}
.testi-slide__author{font-size:0.6rem;font-weight:600;letter-spacing:0.18em;text-transform:uppercase;color:var(--black)}
.testi-nav{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:28px}
.testi-nav button{width:30px;height:30px;border:1px solid var(--light);color:var(--mid);font-size:0.65rem;transition:var(--t)}
.testi-nav button:hover{border-color:var(--black);color:var(--black)}
.testi-count{font-size:0.58rem;color:var(--silver);letter-spacing:0.1em}

/* ── BLOG GRID ── */
.blog-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:3px}
.blog-card{display:block;text-decoration:none;color:inherit}
.blog-card img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block;transition:transform 0.7s ease;filter:brightness(0.92)}
.blog-card:hover img{transform:scale(1.03);filter:brightness(0.75)}
.blog-card__meta{padding:12px 0 6px}
.blog-card__tag{font-size:0.5rem;font-weight:600;letter-spacing:0.2em;text-transform:uppercase;color:var(--mid);margin-bottom:4px}
.blog-card__title{font-size:0.7rem;font-weight:600;letter-spacing:0.06em;text-transform:uppercase;color:var(--black);line-height:1.4}

/* ── AREAS ── */
.areas-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:3px}
.area-card{position:relative;aspect-ratio:3/4;overflow:hidden;display:block;text-decoration:none}
.area-card img{width:100%;height:100%;object-fit:cover;transition:transform 0.7s ease;filter:brightness(0.72);display:block}
.area-card:hover img{transform:scale(1.06);filter:brightness(0.5)}
.area-card__name{position:absolute;bottom:0;left:0;right:0;padding:14px;font-size:0.62rem;font-weight:600;letter-spacing:0.16em;text-transform:uppercase;color:var(--white);background:linear-gradient(to top,rgba(0,0,0,0.6),transparent)}

/* ── PAGE HERO ── */
.page-hero{min-height:46vh;position:relative;display:flex;align-items:flex-end;overflow:hidden;padding-top:var(--nav-h)}
.page-hero__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.page-hero__overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,0.7) 0%,rgba(0,0,0,0.18) 100%)}
.page-hero__content{position:relative;z-index:2;padding:0 0 48px;width:100%}
.page-hero__content h1{color:var(--white)}
.page-hero__content p{color:rgba(255,255,255,0.65);max-width:500px;margin-top:10px}

/* ── NBHD HERO ── */
.nbhd-hero{min-height:46vh;position:relative;display:flex;align-items:flex-end;overflow:hidden;padding-top:var(--nav-h)}
.nbhd-hero__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.nbhd-hero__overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,0.72) 0%,rgba(0,0,0,0.2) 100%)}
.nbhd-hero__content{position:relative;z-index:2;padding:0 0 52px;width:100%}
.nbhd-hero__content h1{color:var(--white)}
.nbhd-hero__content p{color:rgba(255,255,255,0.6);max-width:480px;margin-top:10px;font-size:0.82rem}

/* ── AGENT PAGE ── */
.agent-hero{background:var(--black);padding:calc(var(--nav-h) + 52px) 0 60px}
.agent-hero__inner{display:grid;grid-template-columns:300px 1fr;gap:52px;align-items:start}
.agent-photo{width:100%;aspect-ratio:3/4;object-fit:cover;object-position:top;display:block}
.agent-placeholder{width:100%;aspect-ratio:3/4;background:rgba(255,255,255,0.05);display:flex;align-items:center;justify-content:center;font-size:2.5rem;font-weight:300;color:rgba(255,255,255,0.2);letter-spacing:0.1em}
.agent-label{font-size:0.52rem;font-weight:600;letter-spacing:0.22em;text-transform:uppercase;color:rgba(255,255,255,0.35);margin-bottom:10px}
.agent-name{font-size:clamp(1.6rem,3vw,2.8rem);font-weight:300;letter-spacing:0.1em;text-transform:uppercase;color:var(--white);margin-bottom:20px}
.agent-contact{display:flex;flex-direction:column;gap:7px;margin-bottom:24px}
.agent-contact-line{font-size:0.75rem;display:flex;gap:12px}
.agent-contact-line .lbl{font-size:0.52rem;font-weight:600;letter-spacing:0.14em;text-transform:uppercase;color:rgba(255,255,255,0.3);width:56px;flex-shrink:0;padding-top:2px}
.agent-contact-line a{color:rgba(255,255,255,0.65);transition:var(--t)}
.agent-contact-line a:hover{color:var(--white)}
.agent-bio-section{padding:56px 0}
.agent-bio-section p{font-size:0.86rem;line-height:1.9;color:var(--charcoal);margin-bottom:14px}
.agent-bio-section h3{font-size:0.7rem;font-weight:600;letter-spacing:0.16em;text-transform:uppercase;color:var(--black);margin:24px 0 10px}

/* ── MODAL ── */
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.65);z-index:2000;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:var(--t)}
.modal-overlay.open{opacity:1;pointer-events:all}
.modal{background:var(--white);padding:44px 40px;max-width:460px;width:92%;max-height:90vh;overflow-y:auto;position:relative;transform:translateY(12px);transition:var(--t)}
.modal-overlay.open .modal{transform:translateY(0)}
.modal__close{position:absolute;top:14px;right:18px;font-size:0.9rem;color:var(--mid);cursor:pointer;transition:var(--t)}
.modal__close:hover{color:var(--black)}
.modal__title{font-size:0.72rem;font-weight:600;letter-spacing:0.2em;text-transform:uppercase;margin-bottom:5px}
.modal__sub{font-size:0.74rem;color:var(--mid);margin-bottom:24px}
.form-group{margin-bottom:13px}
.form-group label{display:block;font-size:0.52rem;font-weight:600;letter-spacing:0.16em;text-transform:uppercase;color:var(--charcoal);margin-bottom:5px}
.form-group input,.form-group select,.form-group textarea{width:100%;padding:9px 12px;border:1px solid var(--light);font-family:var(--font-sans);font-size:0.78rem;color:var(--black);outline:none;transition:var(--t);appearance:none;background:var(--white)}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--black)}
.form-group textarea{resize:vertical;min-height:76px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.form-disclaimer{font-size:0.54rem;color:var(--mid);line-height:1.6;margin-bottom:14px}
.form-submit{width:100%;padding:12px;font-size:0.58rem}

/* ── FAQ ── */
.faq-item{border-bottom:1px solid var(--charcoal)}
.faq-item:last-child{border-bottom:none}
.faq-q{font-family:var(--font-sans);font-weight:500;font-size:24px;letter-spacing:0;line-height:28px;text-transform:none;padding:42px 0 17px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;color:var(--black)}
.faq-item:first-child .faq-q{padding-top:0}
.faq-q::after{content:'+';font-size:1.2rem;color:var(--mid);font-weight:300;transition:var(--t);flex-shrink:0}
.faq-item.open .faq-q::after{content:'−'}
.faq-a{font-family:var(--font-sans);font-weight:300;font-size:21px;letter-spacing:0;line-height:28px;color:var(--charcoal);padding-bottom:0;max-height:0;overflow:hidden;transition:max-height 0.4s ease,padding-bottom 0.3s}
.faq-item.open .faq-a{max-height:500px;padding-bottom:17px}

/* ── FADE IN ── */
.fi{opacity:0;transform:translateY(16px);transition:opacity 0.6s ease,transform 0.6s ease}
.fi.vis{opacity:1;transform:translateY(0)}
.fi:nth-child(2){transition-delay:.06s}
.fi:nth-child(3){transition-delay:.12s}
.fi:nth-child(4){transition-delay:.18s}
.fi:nth-child(5){transition-delay:.24s}

/* ── RESPONSIVE ── */
@media(max-width:1024px){
  .portfolio-feature{grid-template-columns:1fr 1fr}
  .network__inner{grid-template-columns:1fr}
  .footer__grid{grid-template-columns:1fr 1fr;gap:28px}
  .split{grid-template-columns:1fr}
  .split__image{aspect-ratio:16/9}
  .split__text{padding:48px 40px}
  .split--reversed .split__text{order:1;padding:48px 40px}
  .split--reversed .split__image{order:2}
  .agent-hero__inner{grid-template-columns:220px 1fr}
}
@media(max-width:768px){
  .section{padding:52px 0}
  .nav__links,.nav__phone{display:none}
  .nav__circle-btn{display:none}
  .nav__hamburger{display:flex}
  .nav__inner{padding:0 20px}
  .hero__content{padding:0 0 44px}
  .hero__title{font-size:clamp(1.4rem,5.5vw,2.2rem)}
  .stories-grid{grid-template-columns:1fr 1fr}
  .portfolio-feature{grid-template-columns:1fr}
  .portfolio-feature__info{padding:28px 24px}
  .team-grid{grid-template-columns:1fr 1fr}
  .areas-grid{grid-template-columns:1fr 1fr}
  .blog-grid{grid-template-columns:1fr}
  .testi-slide{padding:0 16px}
  .footer__grid{grid-template-columns:1fr}
  .footer__bottom{grid-template-columns:1fr}
  .agent-hero__inner{grid-template-columns:1fr}
  .nbhd-hero__content h1{font-size:clamp(1.4rem,5vw,2.2rem)}
}
@media(max-width:480px){
  .stories-grid{grid-template-columns:1fr}
  .areas-grid{grid-template-columns:1fr 1fr}
  .team-grid{grid-template-columns:1fr}
}

/* ============================================================
   BUY PAGE REDESIGN — additions
   ============================================================ */
:root{
  --stone:#ECEBE8;
  --tan:#D1BB99;
  --terracotta:#9B5A4A;
  --camel:#9F7D58;
  --sage:#A2A783;
}

/* ── HERO BANNER (full-width image, top of page) ── */
.hero-banner{width:100%;aspect-ratio:1920/613;overflow:hidden}
.hero-banner img{width:100%;height:100%;object-fit:cover;display:block}
@media(max-height:850px) and (min-width:901px){
  .hero-banner{aspect-ratio:1920/440}
  .hero-banner--kitchen{aspect-ratio:1920/400}
}

/* ── PAGE INTRO (split hero, no image bg) ── */
.page-intro{padding:clamp(24px,7vh,80px) 0 112px}
.page-intro__row{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start;margin-bottom:135px}
.page-intro__row:last-of-type{margin-bottom:0}
.page-intro__row--hero{display:grid;grid-template-columns:repeat(12,1fr);column-gap:24px;margin-top:clamp(4px,1.4vh,16px)}
.page-intro__row--hero h1{grid-column:1 / 7}
.page-intro__row--hero .page-intro__body{grid-column:8 / 13}
.page-intro__row--split{display:grid;grid-template-columns:repeat(12,1fr);column-gap:24px;align-items:end}
.page-intro__row--split .page-intro__photo{grid-column:1 / 6}
.page-intro__row--split .page-intro__body{grid-column:8 / 13}
.page-intro h1{font-family:var(--font-serif);font-weight:400;font-size:clamp(52px,5.1vw,98px);letter-spacing:0.01em;text-transform:none;line-height:1;color:var(--black)}
.page-intro h1 em{font-style:italic}
.page-intro__body p{font-family:var(--font-sans);font-weight:300;font-size:21px;letter-spacing:0;line-height:28px;margin-bottom:clamp(12px,2.8vh,32px);color:var(--charcoal)}
.page-intro__body p:last-child{margin-bottom:0}
.page-intro__links{display:flex;gap:24px;margin-top:clamp(16px,3.5vh,40px)}
.page-intro__links .btn{min-width:290px;height:43.82px;padding:0 20px;box-sizing:border-box;display:flex;align-items:center;justify-content:center;white-space:nowrap;font-family:var(--font-sans);font-weight:500;font-size:17px;letter-spacing:0.1em;text-transform:uppercase;text-decoration:none;border:none}
.cta-arrow{padding-left:12px;font-weight:500}
.page-intro__photo{width:100%;aspect-ratio:674/840;object-fit:cover;display:block}
.page-intro h2.serif{font-family:var(--font-serif);font-weight:400;font-size:84px;text-transform:none;letter-spacing:0.01em;line-height:91px;margin-bottom:24px}
.page-intro__body p.page-intro__tagline{font-family:var(--font-serif);font-weight:400;font-style:italic;font-size:28px;letter-spacing:0;line-height:35px;color:var(--charcoal);margin-bottom:24px}

/* ── PROCESS STEP ── */
.process-step{background:var(--stone);padding:80px 0}
.page-intro + .process-step{padding-top:112px}
.process-step:has(+ .divider-band){padding-bottom:84px}
.process-step:has(+ .strategy-banner){padding-bottom:84px}
.strategy-banner + .process-step{padding-top:84px}
.process-step:has(+ .cta-band){padding-bottom:140px}
.process-step__grid{display:grid;grid-template-columns:repeat(12,1fr);column-gap:24px;align-items:start}
.process-step__grid>*:first-child{grid-column:1 / 7}
.process-step__grid>*:last-child{grid-column:8 / 13}
.process-step__grid--aligned{display:grid;grid-template-columns:repeat(12,1fr);column-gap:24px;row-gap:28px}
.process-step__grid--aligned .process-step__num{grid-column:1 / 7;grid-row:1}
.process-step__grid--aligned .process-step__intro{grid-column:8 / 13;grid-row:1}
.process-step__grid--aligned .process-step__intro p.process-step__list-label{margin-top:70px;margin-bottom:0}
.process-step__grid--aligned .process-step__intro p.process-step__lede{margin-bottom:28px}
.process-step__grid--aligned .process-step__intro p:not(.process-step__lede):not(.process-step__list-label){margin-bottom:28px}
.process-step__grid--aligned .spec-list__item{padding:42px 0 17px}
.process-step__grid--aligned .process-step__img-wrap{grid-column:1 / 6;grid-row:2 / 4;align-self:stretch;margin-top:42px;position:relative;overflow:hidden}
.process-step__grid--aligned .process-step__img-wrap .process-step__img{position:absolute;inset:0;width:100%;height:100%;margin-top:0;aspect-ratio:auto;object-fit:cover}
.process-step__grid--aligned .process-step__checklist{grid-column:8 / 13;grid-row:2}
.process-step__grid--aligned .process-step__checklist .spec-list{margin-top:0}
.process-step__grid--aligned .process-step__checklist .spec-list__item:last-child{border-bottom:none}
.process-step__grid--aligned .process-step__closing{grid-column:8 / 13;grid-row:3;margin-top:25px;margin-bottom:0}

/* Variant where the image aligns to [list-label + checklist] instead of [checklist + closing] */
.process-step__grid--aligned--split-label > .process-step__list-label{grid-column:8 / 13;grid-row:2;margin:14px 0 0;letter-spacing:0.15em}
.process-step__grid--aligned--split-label .process-step__img-wrap{grid-row:2 / 4;margin-top:0}
.process-step__grid--aligned--split-label .process-step__checklist{grid-row:3}
.process-step__grid--aligned--split-label .process-step__checklist .spec-list__item:last-child{border-bottom:none}
.process-step__grid--aligned--split-label .process-step__closing{grid-row:4}
@media(min-width:1440px){
  .process-step__num--hang{padding-left:167px;text-indent:-167px}
  .process-step__num--hang-02{padding-left:177px;text-indent:-177px}
}
@media(min-width:1740px){
  .process-step__num--hang-03{padding-left:175px;text-indent:-175px}
  .process-step__num--hang-04{padding-left:179px;text-indent:-179px}
}
.process-step__num{font-family:var(--font-serif);font-weight:400;font-size:70px;letter-spacing:0.01em;text-transform:none;line-height:77px;color:var(--black);margin-bottom:24px}
.process-step__img-wrap--faq{width:653px;height:490px;overflow:hidden;margin-top:84px}
.process-step__img-wrap--faq .process-step__img{width:100%;height:100%;aspect-ratio:auto;margin-top:0}
.process-step__img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;margin-top:40px}
.process-step__img-secondary{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;margin-top:28px}
.process-step__intro p,.process-step__body p,.process-step__closing{font-family:var(--font-sans);font-weight:300;font-size:21px;letter-spacing:0;line-height:28px;color:var(--charcoal);margin-bottom:16px}
.process-step__intro p.process-step__lede,.process-step__body p.process-step__lede{font-family:var(--font-serif);font-weight:400;font-size:24px;letter-spacing:0;line-height:35px;font-style:normal;color:var(--black);margin-bottom:14px}
.process-step__body--02 p.process-step__lede,.process-step__body--03 p.process-step__lede,.process-step__body--04 p.process-step__lede,.process-step__body--05 p.process-step__lede{margin-bottom:28px}
.process-step__body--02 p.process-step__lede{letter-spacing:-0.005em}
.process-step__body--04 p.process-step__lede{letter-spacing:-0.015em}
.process-step__body--02 p:not(.process-step__lede),.process-step__body--03 p:not(.process-step__lede),.process-step__body--04 p:not(.process-step__lede),.process-step__body--05 p:not(.process-step__lede){margin-bottom:28px}
.process-step__grid--closing .process-step__img-wrap{width:450px;height:496px;position:relative;overflow:hidden}
.process-step__grid--closing .process-step__img-wrap .process-step__img{position:absolute;inset:0;width:100%;height:100%;margin:0;object-fit:cover}
.process-step__grid--closing .spec-list{margin-top:0}
.process-step__grid--closing .spec-list__item{padding:42px 0 17px}
.process-step__grid--closing .spec-list__item:last-child{border-bottom:none}
.process-step__intro p.process-step__list-label,.process-step__body p.process-step__list-label,.process-step__list-label{font-family:var(--font-display);font-weight:400;font-size:28px;letter-spacing:0.175em;line-height:28px;text-transform:uppercase;color:var(--black);margin:28px 0 6px}

/* ── SPEC LIST (underlined checklist rows) ── */
.spec-list{margin-top:8px}
.spec-list__item{font-family:var(--font-sans);font-size:24px;font-weight:500;letter-spacing:0;line-height:28px;color:var(--black);padding:12px 0;border-bottom:1px solid var(--charcoal)}

/* ── TRIO GRID ── */
.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.trio__label{font-family:var(--font-sans);font-weight:300;font-size:21px;letter-spacing:0;line-height:28px;color:var(--charcoal);margin-bottom:10px}
.trio__img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}
.value-grid{grid-template-columns:repeat(5,1fr)}
.value-grid .trio__img{aspect-ratio:auto;height:350px}

/* ── DIVIDER BAND ── */
.divider-band{position:relative;background:var(--tan);padding:137px 40px;text-align:center;overflow:hidden}
.divider-band--camel{background:var(--camel)}
.divider-band.divider-band--camel p{color:var(--white)}
.divider-band::before{content:'';position:absolute;inset:0;background-image:url('/images/buy/texture-paper.jpg');background-size:cover;background-position:center;opacity:0.07;z-index:0}
.divider-band + .section{padding-top:84px;background:var(--stone)}
.divider-band p{position:relative;z-index:1;font-family:var(--font-serif);font-weight:400;font-size:42px;letter-spacing:0;line-height:49px;color:var(--near-black);max-width:1090px;margin:0 auto}

/* ── PROCESS-STEP AUXILIARY IMAGE (small image under a left-column heading, bottom-aligned to the row) ── */
.process-step__col-aux{position:relative;align-self:stretch}
.process-step__img-aux{position:absolute;left:0;bottom:0;width:450px;height:490px;object-fit:cover;display:block}

/* ── STRATEGY BANNER (full-bleed image, bullet cols) ── */
.strategy-banner{position:relative;min-height:490px;display:flex;align-items:center;padding:40px;overflow:hidden;color:var(--white)}
.strategy-banner__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;margin:0}
.strategy-banner::after{content:'';position:absolute;inset:0;background:rgba(10,10,10,0.55);z-index:1}
.strategy-banner__inner{position:relative;z-index:2;max-width:var(--max-w);margin:0 auto;width:100%}
.strategy-banner__title{text-align:center;font-family:var(--font-display);font-weight:400;font-size:28px;letter-spacing:0.175em;line-height:28px;text-transform:uppercase;color:var(--white);margin-bottom:49px}
.strategy-banner__cols{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;text-align:left;max-width:1329px;margin:0 auto}
.strategy-banner__cols--5{grid-template-columns:repeat(5,1fr);max-width:1600px}
.strategy-banner__cols div{font-family:var(--font-sans);font-weight:300;font-size:21px;letter-spacing:0;line-height:28px;color:var(--white)}
.strategy-banner__col{display:flex;flex-direction:column;gap:18px}
.strategy-banner__item{display:flex;align-items:center;gap:14px}
.strategy-banner__icon{flex:0 0 auto;width:24px;height:24px}

/* ── CTA BAND (closing) ── */
.cta-band{position:relative;background:var(--terracotta);padding:112px 40px;text-align:center;color:var(--white);overflow:hidden}
.cta-band--sage{background:var(--sage)}
.cta-band.cta-band--sage h2,.cta-band.cta-band--sage p,.cta-band.cta-band--sage .cta-band__links a,.cta-band.cta-band--sage .cta-band__links span{color:var(--black)}
.cta-band::before{content:'';position:absolute;inset:0;background-image:url('/images/buy/texture-paper.jpg');background-size:cover;background-position:center;opacity:0.07;z-index:0}
.cta-band > *{position:relative;z-index:1}
.cta-band h2{font-family:var(--font-serif);font-weight:400;font-size:70px;letter-spacing:0.01em;line-height:77px;text-transform:none;color:var(--white);margin-bottom:42px}
.cta-band p{font-family:var(--font-sans);font-weight:300;font-size:21px;letter-spacing:0;line-height:28px;color:var(--white);max-width:700px;margin:0 auto 42px}
@media(min-width:901px){
  .cta-band p{max-width:820px}
}
.cta-band__links{display:flex;justify-content:center;align-items:center;gap:24px}
.cta-band__links .btn{min-width:290px;height:43.82px;padding:0 20px;box-sizing:border-box;display:flex;align-items:center;justify-content:center;white-space:nowrap;font-family:var(--font-sans);font-weight:500;font-size:17px;letter-spacing:0.1em;text-transform:uppercase;text-decoration:none;border:none}

@media(max-width:900px){
  .page-intro__row{grid-template-columns:1fr}
  .page-intro__row--hero{grid-template-columns:1fr}
  .page-intro__row--hero h1,.page-intro__row--hero .page-intro__body{grid-column:auto}
  .page-intro__row--split{grid-template-columns:1fr}
  .page-intro__row--split .page-intro__photo,.page-intro__row--split .page-intro__body{grid-column:auto}
  .page-intro h1{font-size:clamp(2rem,7vw,3.4rem);letter-spacing:0}
  .page-intro__links{flex-wrap:wrap;row-gap:16px}
  .page-intro__links .btn{width:100%}
  .cta-band__links{flex-wrap:wrap;row-gap:16px}
  .cta-band__links .btn{width:100%}
  .process-step__grid{grid-template-columns:1fr}
  .process-step__grid>*:first-child,.process-step__grid>*:last-child{grid-column:auto}
  .process-step__grid--aligned{grid-template-columns:1fr}
  .process-step__grid--aligned .process-step__num,.process-step__grid--aligned .process-step__intro,.process-step__grid--aligned .process-step__img-wrap,.process-step__grid--aligned .process-step__checklist,.process-step__grid--aligned .process-step__closing,.process-step__grid--aligned--split-label > .process-step__list-label{grid-column:auto;grid-row:auto;height:auto;position:static}
  .process-step__grid--aligned .process-step__img-wrap{aspect-ratio:4/3}
  .process-step__grid--aligned .process-step__img-wrap .process-step__img{position:static;height:100%}
  .process-step__grid--closing .process-step__img-wrap{width:100%;height:auto;aspect-ratio:4/3}
  .process-step__img-wrap--faq{width:100%;height:auto;aspect-ratio:4/3}
  .process-step__col-aux{position:static;align-self:auto}
  .process-step__img-aux{position:static;width:100%;height:auto;aspect-ratio:4/3;margin-top:28px}
  .trio{grid-template-columns:1fr}
  .strategy-banner__cols{grid-template-columns:1fr 1fr;gap:20px 24px}
}
