/* June Savage | Belle Meade Luxury Group */

:root{
  --ink:#0c1420;
  --ink-2:#101b2b;
  --navy:#002349;
  --navy-2:#0b2f55;
  --ivory:#f5f3ee;
  --paper:#fbfaf7;
  --white:#ffffff;
  --champagne:#b79a5e;
  --champagne-2:#cbb27c;
  --mist:#93a0b1;
  --slate:#3c4657;
  --text:#1d2733;
  --hairline:rgba(12,20,32,.14);
  --hairline-light:rgba(255,255,255,.18);
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
}

body{
  font-family:'Jost',system-ui,'Segoe UI',sans-serif;
  font-size:17px;
  line-height:1.7;
  color:var(--text);
  background:var(--paper);
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3,.serif{
  font-family:'Cormorant Garamond',Georgia,'Times New Roman',serif;
  font-weight:600;
  line-height:1.12;
  color:var(--ink);
  text-wrap:balance;
}
h1{font-size:clamp(2.6rem,6vw,4.6rem);letter-spacing:.01em}
h2{font-size:clamp(2rem,4vw,3rem)}
h3{font-size:1.5rem}
h1 em,h2 em{font-style:italic;font-weight:500}
p{max-width:68ch}

a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:2px solid var(--champagne);outline-offset:3px;
}
img{max-width:100%;display:block}
ul{list-style:none}

.wrap{max-width:1180px;margin:0 auto;padding:0 clamp(20px,4vw,44px)}
.wrap-n{max-width:880px;margin:0 auto;padding:0 clamp(20px,4vw,44px)}

/* ---------- kickers, rules, buttons ---------- */
.kicker{
  font-size:.72rem;letter-spacing:.32em;text-transform:uppercase;
  color:var(--champagne);font-weight:500;display:block;margin-bottom:1.1rem;
}
.kicker.on-light{color:#9a7f47}
.rule{width:56px;height:1px;background:var(--champagne);border:0;margin:1.4rem 0}
.rule.center{margin:1.4rem auto}

.btn{
  display:inline-block;font-size:.78rem;letter-spacing:.24em;text-transform:uppercase;
  font-weight:500;padding:1.05em 2.6em;border:1px solid var(--navy);
  background:var(--navy);color:var(--white);transition:background .25s,color .25s,border-color .25s;
  cursor:pointer;
}
.btn:hover{background:var(--ink);border-color:var(--ink)}
.btn.ghost{background:transparent;color:var(--white);border-color:rgba(255,255,255,.55)}
.btn.ghost:hover{background:var(--white);color:var(--ink);border-color:var(--white)}
.btn.gold{background:transparent;color:var(--champagne);border-color:var(--champagne)}
.btn.gold:hover{background:var(--champagne);color:var(--ink)}
.btn-row{display:flex;gap:16px;flex-wrap:wrap;margin-top:2.2rem}

/* ---------- header ---------- */
.top{
  background:var(--ink);color:var(--white);
  position:sticky;top:0;z-index:50;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.top-inner{
  max-width:1360px;margin:0 auto;padding:18px clamp(16px,3vw,36px);
  display:flex;align-items:center;justify-content:space-between;gap:18px;
  flex-wrap:wrap;row-gap:10px;
}
.brand{display:flex;align-items:center;gap:14px}
.brand .mark{height:44px;width:auto;display:block;flex:none}
.brand-text{display:flex;flex-direction:column;line-height:1.25}
.brand .name{
  font-family:'Cormorant Garamond',Georgia,serif;font-size:1.55rem;font-weight:600;
  letter-spacing:.06em;color:var(--white);white-space:nowrap;
}
.brand .sub{
  font-size:.6rem;letter-spacing:.34em;text-transform:uppercase;color:var(--champagne-2);
  white-space:nowrap;
}
.nav{display:flex;align-items:center;gap:clamp(10px,1.2vw,20px);flex-wrap:wrap;justify-content:flex-end;row-gap:4px}
.nav a{
  font-size:.65rem;letter-spacing:.15em;text-transform:uppercase;color:rgba(255,255,255,.82);
  padding:6px 2px;border-bottom:1px solid transparent;transition:color .2s,border-color .2s;
  white-space:nowrap;
}
.nav a:hover{color:var(--white)}
.nav a[aria-current="page"]{color:var(--champagne-2);border-bottom-color:var(--champagne)}
.lang{
  font-size:.65rem;letter-spacing:.15em;border:1px solid rgba(255,255,255,.35);
  padding:6px 12px;color:var(--white);white-space:nowrap;
}
.lang:hover{border-color:var(--champagne);color:var(--champagne-2)}
.nav-toggle{
  display:none;background:none;border:1px solid rgba(255,255,255,.35);color:var(--white);
  font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;padding:9px 16px;cursor:pointer;
}
@media (max-width:1200px){
  .nav-toggle{display:block}
  .nav{
    display:none;position:absolute;top:100%;left:0;right:0;background:var(--ink);
    flex-direction:column;align-items:flex-start;padding:18px clamp(16px,3vw,36px) 26px;
    gap:4px;border-bottom:1px solid rgba(255,255,255,.1);
  }
  .nav.open{display:flex}
  .nav a{padding:10px 2px;font-size:.78rem}
}

/* ---------- hero ---------- */
.hero{
  position:relative;background:var(--ink);color:var(--white);overflow:hidden;
}
.hero .bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.9}
.hero::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(12,20,32,.55) 0%,rgba(12,20,32,.25) 45%,rgba(12,20,32,.82) 100%);
}
.hero-inner{
  position:relative;z-index:2;max-width:1180px;margin:0 auto;
  padding:clamp(90px,14vw,190px) clamp(20px,4vw,44px) clamp(70px,10vw,130px);
}
.hero h1{color:var(--white);max-width:20ch}
.hero .lede{margin-top:1.6rem;font-size:1.06rem;font-weight:300;color:rgba(255,255,255,.88);max-width:56ch;letter-spacing:.02em}
.hero.short .hero-inner{padding:clamp(70px,9vw,120px) clamp(20px,4vw,44px) clamp(60px,7vw,90px)}
.hero.photo-hero .bg{opacity:1}
.hero.photo-hero::after{
  background:
    linear-gradient(90deg,rgba(9,15,25,.85) 0%,rgba(9,15,25,.5) 48%,rgba(9,15,25,.22) 100%),
    linear-gradient(180deg,rgba(9,15,25,.5) 0%,rgba(9,15,25,.12) 45%,rgba(9,15,25,.88) 100%);
}
.hero.photo-hero h1{font-size:clamp(2.8rem,6.4vw,5rem)}
/* subject on the left of the photo, copy on the right */
.hero.align-right .hero-inner{display:flex;justify-content:flex-end}
.hero.align-right .hero-copy{max-width:640px}
.hero.align-right::after{
  background:
    linear-gradient(270deg,rgba(9,15,25,.8) 0%,rgba(9,15,25,.42) 45%,rgba(9,15,25,.04) 100%),
    linear-gradient(180deg,rgba(9,15,25,.22) 0%,rgba(9,15,25,.02) 45%,rgba(9,15,25,.82) 100%);
}
.hero.align-right .bg{object-position:32% 30%}
@media (max-width:880px){
  .hero.align-right .hero-inner{justify-content:flex-start}
  .hero.align-right::after{
    background:linear-gradient(180deg,rgba(9,15,25,.35) 0%,rgba(9,15,25,.55) 40%,rgba(9,15,25,.92) 100%);
  }
  .hero.align-right .bg{object-position:38% 12%}
  .hero.align-right.tall .hero-inner{padding-top:56vh;padding-bottom:56px}
  .hero.align-right .hero-copy{max-width:none}
}
.hero.tall .hero-inner{padding-top:clamp(160px,26vw,340px)}

/* lifestyle mosaic */
.mosaic{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:clamp(180px,20vw,290px);gap:10px}
.tile{position:relative;overflow:hidden;background:var(--ink)}
.tile img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.2s cubic-bezier(.22,.61,.36,1)}
.tile:hover img{transform:scale(1.05)}
.tile.big{grid-column:span 2;grid-row:span 2}
.tile .cap{
  position:absolute;left:0;right:0;bottom:0;padding:18px 20px;
  font-size:.66rem;letter-spacing:.26em;text-transform:uppercase;color:rgba(255,255,255,.9);
  background:linear-gradient(180deg,rgba(9,15,25,0),rgba(9,15,25,.75));
}
@media (max-width:760px){
  .mosaic{grid-template-columns:repeat(2,1fr);grid-auto-rows:clamp(150px,34vw,220px)}
}
.hero .kicker::after{
  content:"";display:block;width:56px;height:1px;background:var(--champagne);margin-top:1.05rem;
}

/* ---------- sections ---------- */
.section{padding:clamp(64px,9vw,120px) 0;background:var(--paper)}
.section.ivory{background:var(--ivory)}
.section.white{background:var(--white)}
.section.dark{background:var(--navy);color:var(--white)}
.section.ink{background:var(--ink);color:var(--white)}
.section.dark h2,.section.dark h3,.section.ink h2,.section.ink h3{color:var(--white)}
.section.dark p,.section.ink p{color:rgba(255,255,255,.85)}
.sec-head{max-width:720px;margin-bottom:clamp(36px,5vw,64px)}
.sec-head.center{margin-left:auto;margin-right:auto;text-align:center}
.sec-head p{margin-top:1.2rem;color:var(--slate)}
.section.dark .sec-head p,.section.ink .sec-head p{color:var(--mist)}

/* ---------- grids & cards ---------- */
.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(20px,3vw,36px)}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,36px)}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(18px,2.4vw,28px)}
@media (max-width:960px){.grid3,.grid4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.grid2,.grid3,.grid4{grid-template-columns:1fr}}

.card{
  background:var(--white);border:1px solid var(--hairline);padding:34px 30px 38px;
  display:flex;flex-direction:column;gap:.65rem;
}
.section.white .card{background:var(--ivory)}
.card h3{font-size:1.45rem}
.card p{font-size:.95rem;color:var(--slate)}
.card .more{
  margin-top:auto;padding-top:1.2rem;font-size:.7rem;letter-spacing:.24em;text-transform:uppercase;
  color:#9a7f47;font-weight:500;
}
a.card{transition:border-color .25s,transform .25s}
a.card:hover{border-color:var(--champagne)}
.card.on-dark{background:rgba(255,255,255,.045);border-color:var(--hairline-light)}
.card.on-dark h3{color:var(--white)}
.card.on-dark p{color:var(--mist)}
.card.on-dark .more{color:var(--champagne-2)}
a.card.on-dark:hover{border-color:var(--champagne)}

/* ---------- split layout ---------- */
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(36px,6vw,80px);align-items:center}
.split.rev{grid-template-columns:.95fr 1.05fr}
@media (max-width:880px){.split,.split.rev{grid-template-columns:1fr}}
.split .body p + p{margin-top:1.1rem}
.split .body p{color:var(--slate)}
.section.dark .split .body p,.section.ink .split .body p{color:rgba(255,255,255,.85)}

/* ---------- photos ---------- */
.photo{position:relative;border:1px solid var(--hairline);overflow:hidden;background:var(--ink)}
.photo img{width:100%;height:100%;display:block;object-fit:cover}
.photo::after{content:"";position:absolute;inset:14px;border:1px solid rgba(183,154,94,.35);pointer-events:none}
.photo.tall img{aspect-ratio:4/5}
.photo.wide img{aspect-ratio:3/2}
.photo.plain::after{display:none}
.figure{display:grid;gap:12px}
.figure figcaption{font-size:.7rem;letter-spacing:.24em;text-transform:uppercase;color:var(--slate)}
.section.dark .figure figcaption,.section.ink .figure figcaption{color:var(--mist)}
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,24px)}
@media (max-width:640px){.gallery{grid-template-columns:1fr}}
.video-wrap{position:relative;border:1px solid var(--hairline-light);overflow:hidden}
.video-wrap video{width:100%;display:block}
.logo-strip img{max-width:200px;mix-blend-mode:multiply;display:block}
.frame-off{position:relative}
.frame-off::before{
  content:"";position:absolute;top:24px;left:24px;right:-24px;bottom:-24px;
  border:1px solid rgba(183,154,94,.5);pointer-events:none;
}
.frame-off .photo{position:relative;z-index:1}
.photo img{transition:transform 1.1s cubic-bezier(.22,.61,.36,1)}
.photo:hover img{transform:scale(1.045)}
a.card{transition:border-color .3s,transform .3s,box-shadow .3s}
a.card:hover{transform:translateY(-4px);box-shadow:0 18px 40px -24px rgba(12,20,32,.35)}
.foot-mark{height:96px;width:auto;margin-bottom:16px;display:block}

/* IDX embed */
.idx-wrap{border:1px solid var(--hairline);background:#fff;overflow:hidden}
.idx-frame{width:100%;height:1150px;border:0;display:block}
@media (max-width:640px){.idx-frame{height:920px}}
.legal-links a{color:rgba(255,255,255,.7);font-size:.78rem;letter-spacing:.08em}
.legal-links a:hover{color:var(--champagne-2)}

/* scroll reveal */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .8s ease,transform .8s ease}
.reveal.in{opacity:1;transform:translateY(0)}
@media (prefers-reduced-motion: reduce){.reveal{opacity:1;transform:none}}

/* ---------- photo placeholders ---------- */
.ph{
  position:relative;background:linear-gradient(160deg,#12233c 0%,#0c1420 60%,#132a45 100%);
  border:1px solid var(--hairline);min-height:340px;display:flex;align-items:flex-end;
}
.ph.tall{min-height:480px}
.ph .tag{
  font-size:.62rem;letter-spacing:.3em;text-transform:uppercase;color:rgba(255,255,255,.5);
  padding:16px 18px;
}
.ph::before{
  content:"";position:absolute;inset:14px;border:1px solid rgba(183,154,94,.35);pointer-events:none;
}

/* ---------- stats ---------- */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,40px);text-align:center}
@media (max-width:640px){.stats{grid-template-columns:1fr}}
.stat .num{
  font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(2.6rem,4.6vw,3.8rem);
  font-weight:600;color:var(--champagne);line-height:1;
}
.stat .lbl{font-size:.7rem;letter-spacing:.26em;text-transform:uppercase;margin-top:.7rem;color:var(--mist)}
.section:not(.dark):not(.ink) .stat .lbl{color:var(--slate)}

/* ---------- lists ---------- */
.tick{display:grid;gap:.9rem}
.tick li{position:relative;padding-left:30px;color:var(--slate);font-size:.98rem}
.tick li::before{
  content:"";position:absolute;left:0;top:.62em;width:14px;height:1px;background:var(--champagne);
}
.section.dark .tick li,.section.ink .tick li{color:rgba(255,255,255,.85)}

/* ---------- steps ---------- */
.steps{counter-reset:step;display:grid;gap:0}
.step{
  counter-increment:step;display:grid;grid-template-columns:88px 1fr;gap:26px;
  padding:30px 0;border-top:1px solid var(--hairline);
}
.step:last-child{border-bottom:1px solid var(--hairline)}
.step::before{
  content:"0" counter(step);font-family:'Cormorant Garamond',Georgia,serif;
  font-size:2.4rem;font-weight:500;color:var(--champagne);line-height:1;
}
.step h3{font-size:1.3rem;margin-bottom:.4rem}
.step p{font-size:.96rem;color:var(--slate)}
@media (max-width:560px){.step{grid-template-columns:56px 1fr;gap:16px}.step::before{font-size:1.8rem}}

/* ---------- waterfront chips ---------- */
.chips{display:flex;flex-wrap:wrap;gap:12px}
.chip{
  font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;
  border:1px solid var(--hairline-light);color:rgba(255,255,255,.85);
  padding:12px 20px;transition:border-color .2s,color .2s;
}
.chip:hover{border-color:var(--champagne);color:var(--champagne-2)}
.section:not(.dark):not(.ink) .chip{border-color:var(--hairline);color:var(--slate)}
.section:not(.dark):not(.ink) .chip:hover{border-color:var(--champagne);color:#9a7f47}

/* ---------- forms ---------- */
.form{display:grid;gap:22px}
.form .row{display:grid;grid-template-columns:1fr 1fr;gap:22px}
@media (max-width:640px){.form .row{grid-template-columns:1fr}}
.field{display:grid;gap:8px}
.field label{font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:var(--slate);font-weight:500}
.field input,.field select,.field textarea{
  font-family:'Jost',system-ui,sans-serif;font-size:1rem;color:var(--ink);
  background:var(--white);border:1px solid var(--hairline);padding:14px 16px;width:100%;
}
.field textarea{min-height:150px;resize:vertical}
.section.dark .field label,.section.ink .field label{color:var(--mist)}
.form .consent{font-size:.8rem;color:var(--slate);display:flex;gap:10px;align-items:flex-start;max-width:none}
.form .consent input{width:auto;margin-top:5px}

/* ---------- search panel (IDX placeholder) ---------- */
.search-panel{
  background:var(--white);border:1px solid var(--hairline);padding:clamp(26px,4vw,44px);
}
.search-panel .note{
  margin-top:22px;font-size:.8rem;color:var(--slate);border-top:1px solid var(--hairline);padding-top:18px;
}

/* ---------- quote ---------- */
.pull{
  font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(1.6rem,3vw,2.3rem);
  font-weight:500;font-style:italic;line-height:1.35;color:var(--ink);max-width:26ch;
}
.section.dark .pull,.section.ink .pull{color:var(--white)}
.pull-by{font-size:.7rem;letter-spacing:.26em;text-transform:uppercase;color:var(--champagne);margin-top:1.4rem;display:block}

/* ---------- footer ---------- */
footer{background:var(--ink);color:rgba(255,255,255,.8);padding:clamp(60px,8vw,90px) 0 40px}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:clamp(28px,4vw,56px)}
@media (max-width:960px){.foot-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.foot-grid{grid-template-columns:1fr}}
.foot-brand .name{font-family:'Cormorant Garamond',Georgia,serif;font-size:1.7rem;color:var(--white);font-weight:600}
.foot-brand .sub{font-size:.6rem;letter-spacing:.34em;text-transform:uppercase;color:var(--champagne-2);display:block;margin:.4rem 0 1.2rem}
.foot-brand p{font-size:.86rem;color:var(--mist);max-width:34ch}
footer h4{
  font-size:.7rem;letter-spacing:.28em;text-transform:uppercase;color:var(--champagne);
  font-weight:500;margin-bottom:1.1rem;
}
footer ul{display:grid;gap:.55rem}
footer ul a{font-size:.88rem;color:rgba(255,255,255,.75)}
footer ul a:hover{color:var(--champagne-2)}
.foot-legal{
  margin-top:clamp(40px,6vw,64px);padding-top:26px;border-top:1px solid rgba(255,255,255,.12);
  font-size:.74rem;color:rgba(255,255,255,.5);display:grid;gap:.5rem;
}
.foot-legal p{max-width:none}
.eho{display:flex;align-items:center;gap:10px}
.eho svg{flex:none;opacity:.7}

/* ---------- misc ---------- */
.center{text-align:center}
.mt-1{margin-top:1rem}.mt-2{margin-top:2rem}.mt-3{margin-top:3rem}
.notice{
  font-size:.8rem;color:var(--slate);border-left:2px solid var(--champagne);
  padding:.4rem 0 .4rem 1.2rem;max-width:60ch;
}
.section.dark .notice,.section.ink .notice{color:var(--mist)}
.table-wrap{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:.92rem}
th,td{padding:14px 16px;text-align:left;border-bottom:1px solid var(--hairline)}
th{font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--slate);font-weight:500}
