
:root{
  --primary:#29292c;
  --secondary:#1f1f22;
  --text:#2e2e33;
  --muted:#64646d;
  --line:#e8e8eb;
  --surface:#ffffff;
  --surface-soft:#f8f8f9;
  --shadow:0 18px 50px rgba(0,0,0,.08);
  --max:1240px;
  --radius:28px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Arial,Helvetica,sans-serif;
  color:var(--text);
  background:#fff;
  line-height:1.5;
}
img,video{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
ul{margin:0;padding:0}
.container{width:min(calc(100% - 32px),var(--max));margin:0 auto}
.topbar{
  position:absolute; inset:0 0 auto 0; z-index:40;
  color:#fff; font-size:14px;
}
.topbar .container{
  display:flex; justify-content:space-between; align-items:center; gap:16px;
  padding:18px 0 0;
}
.topbar__left,.topbar__right,.socials,.nav{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.socials a{
  width:22px;height:22px;display:grid;place-items:center;color:#fff;opacity:.95
}
.socials svg{width:16px;height:16px;fill:currentColor}
.header{
  position:absolute; inset:58px 0 auto 0; z-index:50;
}
.header .container{
  display:flex; justify-content:space-between; align-items:center; gap:24px;
}
.brand{display:inline-flex; align-items:center}
.brand img{height:110px; width:auto}
.nav{
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.16);
  backdrop-filter: blur(14px);
  border-radius:999px;
  padding:10px 14px;
}
.nav a{
  color:#fff;
  font-weight:700;
  font-size:15px;
  padding:10px 14px;
  border-radius:999px;
}
.nav a:hover,.nav a.active{background:#fff;color:var(--primary)}
.nav-toggle{
  display:none; width:48px; height:48px; border:1px solid rgba(255,255,255,.25);
  border-radius:16px; background:rgba(255,255,255,.12); color:#fff;
}
.nav-toggle span,.nav-toggle span::before,.nav-toggle span::after{
  content:"";display:block;width:20px;height:2px;background:currentColor;border-radius:999px;position:relative
}
.nav-toggle span::before{position:absolute;top:-6px;left:0}
.nav-toggle span::after{position:absolute;top:6px;left:0}

.hero{
  position:relative; min-height:920px; color:#fff; overflow:hidden; background:#111;
}
.hero__video,.hero__overlay{position:absolute; inset:0}
.hero__video video{width:100%;height:100%;object-fit:cover}
.hero__overlay{
  background:
    linear-gradient(180deg, rgba(0,0,0,.30) 0%, rgba(0,0,0,.42) 30%, rgba(0,0,0,.58) 100%),
    linear-gradient(90deg, rgba(0,0,0,.35) 0%, rgba(0,0,0,.16) 45%, rgba(0,0,0,.35) 100%);
}
.hero .container{
  position:relative; z-index:2;
  min-height:920px;
  display:flex; align-items:flex-end;
  padding:200px 0 84px;
}
.hero__content{width:100%}
.hero__intro{
  max-width:760px;
  margin-bottom:72px;
}
.hero__eyebrow{
  display:inline-block;
  font-size:15px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  margin-bottom:18px;
}
.hero h1{
  margin:0 0 18px;
  font-size:clamp(56px,7vw,96px);
  line-height:.94;
  font-weight:800;
  letter-spacing:-.04em;
  text-transform:uppercase;
}
.hero p{
  margin:0;
  font-size:20px;
  max-width:660px;
  color:rgba(255,255,255,.92);
}
.feature-strip{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
}
.feature-card{
  position:relative;
  min-height:300px;
  border-radius:34px;
  overflow:hidden;
  box-shadow:var(--shadow);
  background:#222;
}
.feature-card__media,.feature-card__overlay{
  position:absolute; inset:0
}
.feature-card__media{
  background-size:cover;
  background-position:center;
  transform:scale(1.01);
}
.feature-card__overlay{
  background:linear-gradient(180deg, rgba(0,0,0,.18) 15%, rgba(0,0,0,.66) 100%);
}
.feature-card__body{
  position:relative; z-index:1;
  height:100%;
  display:flex; flex-direction:column; justify-content:flex-end;
  padding:28px;
}
.feature-card h3{
  margin:0 0 10px;
  font-size:36px;
  line-height:.98;
  letter-spacing:-.03em;
  text-transform:uppercase;
}
.feature-card p{
  margin:0 0 18px;
  font-size:15px;
  color:rgba(255,255,255,.9);
  max-width:300px;
}
.feature-card .btn-link{
  display:inline-flex; align-items:center; gap:10px; font-weight:700; font-size:15px;
}

.section{
  padding:96px 0;
}
.section--tight{padding:84px 0}
.section--soft{background:var(--surface-soft)}
.section__header{
  margin-bottom:38px;
}
.kicker{
  font-size:14px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--muted);
  margin-bottom:12px;
}
.title{
  margin:0;
  font-size:clamp(38px,4vw,68px);
  line-height:.94;
  letter-spacing:-.04em;
  color:var(--secondary);
  text-transform:uppercase;
}
.subtitle{
  margin:18px 0 0;
  color:var(--muted);
  max-width:720px;
  font-size:18px;
}
.grid-2{display:grid;grid-template-columns:1.05fr .95fr;gap:28px}
.panel{
  background:#fff;
  border:1px solid var(--line);
  border-radius:32px;
  box-shadow:var(--shadow);
  padding:34px;
}
.panel h3{
  margin:0 0 14px;
  font-size:34px;
  line-height:1;
  letter-spacing:-.03em;
  text-transform:uppercase;
}
.hold-year{
  font-size:26px; font-weight:800; margin-bottom:18px; color:var(--secondary)
}
.hold-list{
  display:grid; gap:14px;
}
.hold-item{
  display:flex; align-items:flex-start; gap:14px;
  padding:16px 18px;
  border-radius:18px;
  background:#fafafa;
  border:1px solid var(--line);
  font-size:17px;
}
.hold-bullet{
  width:12px; height:12px; border-radius:999px; background:var(--secondary); margin-top:7px; flex:0 0 auto
}
.contact-prompt p{font-size:18px;color:var(--muted);margin:0 0 24px}
.button{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  min-height:54px; padding:0 22px;
  border-radius:999px;
  background:var(--secondary); color:#fff; border:0;
  font-weight:800; font-size:15px;
}
.button--ghost{
  background:transparent; border:1px solid var(--line); color:var(--secondary)
}
.info-rows{display:grid;gap:14px}
.info-row{
  display:flex; gap:14px; align-items:flex-start;
  padding:16px 18px; border-radius:18px; background:#fafafa; border:1px solid var(--line)
}
.info-row__icon{
  width:42px; height:42px; border-radius:14px; background:#fff; border:1px solid var(--line);
  display:grid; place-items:center; flex:0 0 auto;
}
.info-row__icon img{width:22px; height:22px; object-fit:contain}
.info-row strong{display:block; font-size:16px; margin-bottom:3px}
.info-row span,.info-row a{color:var(--muted); font-size:15px}

.offer-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px;
}
.offer-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:30px;
  padding:28px;
  box-shadow:var(--shadow);
}
.offer-card__icon{
  width:70px;height:70px;border-radius:22px;background:#f7f7f8;border:1px solid var(--line);
  display:grid;place-items:center;margin-bottom:18px
}
.offer-card__icon img{width:38px;height:38px;object-fit:contain}
.offer-card h3{
  margin:0 0 8px; font-size:28px; line-height:1; letter-spacing:-.03em; text-transform:uppercase
}
.offer-card p{margin:0; color:var(--muted); font-size:16px}
.offer-card .small{margin-top:12px; display:block; font-weight:700; color:var(--secondary)}

.locations{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px;
}
.location-card{
  border:1px solid var(--line);
  border-radius:30px;
  background:#fff;
  box-shadow:var(--shadow);
  overflow:hidden;
}
.location-card__img{aspect-ratio:16/10; background:#ddd; overflow:hidden}
.location-card__img img{width:100%;height:100%;object-fit:cover}
.location-card__body{padding:24px}
.location-card h3{
  margin:0 0 10px; font-size:28px; line-height:1; letter-spacing:-.03em; text-transform:uppercase
}
.location-card p{margin:0 0 8px; color:var(--muted)}
.location-card a{font-weight:800}
.cta-band{
  position:relative;
  background:#1f1f22;
  color:#fff;
  overflow:hidden;
}
.cta-band::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(0,0,0,.55), rgba(0,0,0,.22)), url('images/lavender.jpg') center/cover no-repeat;
  opacity:.3;
}
.cta-band .container{
  position:relative; z-index:1;
  display:grid; grid-template-columns: 1.1fr .9fr; gap:28px; align-items:center;
  padding:72px 0;
}
.cta-band h2{
  margin:0; font-size:clamp(32px,4vw,58px); line-height:.95; letter-spacing:-.04em; text-transform:uppercase
}
.cta-band p{margin:16px 0 0; color:rgba(255,255,255,.82); font-size:18px}
.form-card{
  background:#fff; color:var(--text); border-radius:30px; padding:28px; box-shadow:var(--shadow)
}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.field{display:grid; gap:8px}
.field label{font-size:14px; font-weight:700}
.field input,.field select,.field textarea{
  width:100%; border:1px solid var(--line); border-radius:18px; background:#fff;
  padding:14px 16px; font:inherit; color:var(--text)
}
.field textarea{min-height:140px; resize:vertical}
.form-note{margin-top:12px; font-size:13px; color:var(--muted)}

.page-hero{
  position:relative;
  min-height:440px;
  color:#fff;
  overflow:hidden;
  background:#111;
}
.page-hero::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,.36), rgba(0,0,0,.62)), url('images/hero-slide-2.jpg') center/cover no-repeat;
}
.page-hero .container{
  position:relative; z-index:2; min-height:440px; display:flex; align-items:flex-end; padding:200px 0 60px
}
.page-hero h1{
  margin:0; font-size:clamp(46px,5vw,78px); line-height:.95; text-transform:uppercase; letter-spacing:-.04em
}
.page-hero p{margin:16px 0 0; font-size:18px; color:rgba(255,255,255,.88); max-width:720px}

.copy{display:grid; gap:18px; color:var(--muted); font-size:17px}
.copy strong{color:var(--secondary)}
.list-card{display:grid; gap:14px}
.rule{
  padding:18px 20px; border:1px solid var(--line); border-radius:22px; background:#fff
}
.rule h4{margin:0 0 8px; font-size:22px; text-transform:uppercase; letter-spacing:-.02em; color:var(--secondary)}
.rule p,.rule li{color:var(--muted)}
.rule ul{padding-left:20px; display:grid; gap:8px}

.footer{
  background:#222225;
  color:#fff;
}
.footer-top{
  padding:72px 0 36px;
}
.footer-grid{
  display:grid;
  grid-template-columns:1.2fr .8fr .9fr .7fr;
  gap:28px;
}
.footer .brand img{height:94px}
.footer h4{
  margin:0 0 16px; font-size:18px; text-transform:uppercase; letter-spacing:.04em
}
.footer p,.footer a,.footer li{color:rgba(255,255,255,.76)}
.footer-list{display:grid; gap:10px}
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.12);
  padding:18px 0 26px;
  color:rgba(255,255,255,.55);
  font-size:14px;
}
.arrow{display:inline-block; transform:translateY(-1px)}
.mobile-only{display:none}

@media (max-width:1100px){
  .nav-toggle{display:grid; place-items:center}
  .nav{
    display:none; position:absolute; top:calc(100% + 12px); right:16px; left:16px;
    border-radius:28px; padding:14px; background:rgba(33,33,36,.95); backdrop-filter:blur(18px);
    flex-direction:column; align-items:stretch; gap:6px;
  }
  .nav.is-open{display:flex}
  .feature-strip,.offer-grid,.locations,.footer-grid,.grid-2,.cta-band .container{grid-template-columns:1fr}
  .header{inset:50px 0 auto 0}
  .hero{min-height:auto}
  .hero .container{min-height:auto; padding:180px 0 56px}
  .hero__intro{margin-bottom:36px}
}

@media (max-width:760px){
  .topbar{
    position:relative;
    z-index:60;
    background:rgba(0,0,0,.75);
    padding:8px 0;
  }

  .topbar .container{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:10px;
  }

  .topbar__left{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
  }

  .socials{
    display:flex;
    gap:10px;
    flex-shrink:0;
  }

  /* text on the right */
  .topbar__left span{
    display:block;
    width:100%;
    font-size:12px;
  }

  /* wrap text into its own column on right */
  .topbar__left{
    flex:1;
  }

  .topbar__left > .socials{
    order:1;
  }

  .topbar__left > span{
    order:2;
    text-align:right;
  }

  .header{
    position:relative;
    z-index:70;
    background:rgba(0,0,0,.75);
    padding:12px 0;
    inset:auto;
  }

  .header .container{
    position:relative;
  }

  .nav{
    top:calc(100% + 8px);
    right:10px;
    left:10px;
    z-index:80;
  }

  .container{width:min(calc(100% - 20px),var(--max))}
  .brand img{height:76px}

  .hero{
    min-height:auto;
  }

  .hero .container{
    min-height:auto;
    padding:32px 0 28px;
  }

  .hero h1{font-size:clamp(42px,14vw,68px)}
  .hero p{font-size:17px}
  .feature-card{min-height:250px}
  .feature-card h3{font-size:28px}
  .section,.section--tight{padding:68px 0}
  .panel,.offer-card,.location-card__body,.form-card{padding:22px}
  .title{font-size:clamp(34px,10vw,54px)}
  .offer-grid{grid-template-columns:1fr}
  .locations{grid-template-columns:1fr}
  .form-grid{grid-template-columns:1fr}
  .page-hero{min-height:360px}
  .page-hero .container{min-height:360px; padding:150px 0 42px}
}

/*
@media (max-width:760px){
  .container{width:min(calc(100% - 20px),var(--max))}
  .topbar .container{padding-top:12px}
  .topbar__left,.topbar__right{gap:10px; font-size:12px}
  .header{inset:42px 0 auto 0}
  .brand img{height:76px}
  .hero .container{padding:150px 0 28px}
  .hero h1{font-size:clamp(42px,14vw,68px)}
  .hero p{font-size:17px}
  .feature-card{min-height:250px}
  .feature-card h3{font-size:28px}
  .section,.section--tight{padding:68px 0}
  .panel,.offer-card,.location-card__body,.form-card{padding:22px}
  .title{font-size:clamp(34px,10vw,54px)}
  .offer-grid{grid-template-columns:1fr}
  .locations{grid-template-columns:1fr}
  .form-grid{grid-template-columns:1fr}
  .page-hero{min-height:360px}
  .page-hero .container{min-height:360px; padding:150px 0 42px}
}*/
