@import url("https://fonts.googleapis.com/css2?family=Host+Grotesk:wght@400;500&display=swap");

:root{
  --color-bg: #ffffff;
  --color-surface: #f4f3f0;
  --color-text: #000000;
  --color-text-muted: #55534e;
  --color-text-soft: var(--color-text-muted);
  --color-border: #e8e6e1;
  --color-border-soft: color-mix(in srgb, var(--color-border) 55%, var(--color-bg));
  --color-accent: #cbd810;
  --color-accent-soft: color-mix(in srgb, var(--color-accent) 14%, var(--color-bg));
  --color-accent-deep: #b53d0a;
  --color-on-accent: #102b03;
  --color-band: #0f5a3a;
  --color-band-text: #ffffff;
  --color-warn: #b4541a;
  --font-display: "Host Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-body: "Host Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-sans: var(--font-body);
  --font-serif: Georgia, "Times New Roman", serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;
  --display-weight: 500;
  --display-case: none;
  --display-tracking: -0.03em;
  --display-style: normal;
  --fs-display: clamp(46px, 7.01vw, 101px);
  --fs-h1: clamp(42px, 6.11vw, 88px);
  --fs-h2: clamp(45px, 5.00vw, 72px);
  --fs-h3: clamp(20px, 1.67vw, 24px);
  --fs-body: 16px;
  --fs-small: 14px;
  --fs-label: 12px;
  --lh-tight: 1.08;
  --lh-snug: 1.25;
  --lh-body: 1.35;
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 21px;
  --s-6: 28px;
  --s-7: 42px;
  --s-8: 63px;
  --s-9: 42px;
  --s-10: 56px;
  --section-pad: clamp(36px, 3.89vw, 56px);
  --gap: 28px;
  --r-1: 4px;
  --r-2: 12px;
  --r-3: 18px;
  --r-4: 27px;
  --r-pill: 999px;
  --r-button: 12px;
  --r-card: 18px;
  --border: 0 solid transparent;
  --shadow-1: 0 1px 2px rgb(0 0 0 / .06);
  --shadow-2: 0 6px 20px rgb(0 0 0 / .08);
  --shadow-3: 0 18px 48px rgb(0 0 0 / .14);
  --maxw-prose: 49ch;
  --maxw-page: 1200px;
  --transition: .2s ease;
}
:root{
  --tint-1: #eef0cf;
  --tint-2: #f7ddc9;
  --tint-3: #dfead9;
  --tint-4: #e6e4ee;
  --ink-on-tint: #14140f;
  --hero-scrim: linear-gradient(180deg, rgba(8,20,10,.55) 0%, rgba(8,20,10,.35) 40%, rgba(8,20,10,.72) 100%);
}
:where(ul,ol)[class]{list-style:none;padding-left:0}




*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{
  margin:0; min-height:100vh; display:flex; flex-direction:column;
  background:var(--color-bg); color:var(--color-text);
  font-family:var(--font-body); font-size:var(--fs-body); line-height:var(--lh-body);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
[data-aicms="page"]{ flex:1; display:block; }
img{ max-width:100%; display:block; }
a{ color:inherit; }
p{ margin:0; }
h1,h2,h3{ margin:0; font-family:var(--font-display); font-weight:var(--display-weight); text-transform:var(--display-case); letter-spacing:var(--display-tracking); font-style:var(--display-style); line-height:var(--lh-tight); }
h1{ font-size:var(--fs-h1); }
h2{ font-size:var(--fs-h2); }
h3{ font-size:var(--fs-h3); line-height:var(--lh-snug); }
em{ font-style:normal; background:linear-gradient(transparent 62%, var(--color-accent) 62%); padding:0 .08em; }
.skip{ position:absolute; left:-9999px; top:0; }
.skip:focus{ position:fixed; left:12px; top:12px; background:#fff; padding:10px 14px; border-radius:var(--r-button); box-shadow:var(--shadow-2); z-index:99; }

.wrap{ width:100%; max-width:var(--maxw-page); margin-inline:auto; padding-inline:clamp(20px, 4vw, 40px); }
.section{ padding-block:var(--section-pad); }
.section-tight{ padding-block:calc(var(--section-pad) * .85); }
.small{ font-size:var(--fs-small); color:var(--color-text-muted); line-height:1.4; }
.eyebrow{
  font-size:var(--fs-label); font-weight:500; letter-spacing:.14em; text-transform:uppercase;
  color:var(--color-text-muted); margin:0 0 var(--s-4);
  display:flex; align-items:center; gap:10px;
}
.eyebrow::before{ content:""; width:22px; height:1px; background:currentColor; opacity:.5; }
[data-num]{ letter-spacing:.06em; }

.btn{
  display:inline-flex; align-items:center; gap:8px; justify-content:center;
  font-family:var(--font-body); font-size:15px; font-weight:500;
  padding:13px 20px; border-radius:var(--r-button); border:0; cursor:pointer;
  text-decoration:none; transition:transform var(--transition), background var(--transition), color var(--transition);
  background:var(--color-surface); color:var(--color-text);
}
.btn:hover{ transform:translateY(-1px); }
.btn-solid{ background:var(--color-accent); color:var(--color-on-accent); box-shadow:var(--shadow-1); }
.btn-solid:hover{ background:color-mix(in srgb, var(--color-accent) 88%, #000); }
.btn-light{ background:#fff; color:var(--color-text); box-shadow:var(--shadow-1); }
.btn-pill{ border-radius:var(--r-pill); }
.text-link{
  display:inline-flex; align-items:center; gap:8px; font-size:15px; font-weight:500;
  color:var(--color-text); text-decoration:none; border-bottom:1px solid currentColor; padding-bottom:2px;
}
.text-link:hover{ color:var(--color-accent-deep); }

.chips{ display:flex; flex-wrap:wrap; gap:8px; list-style:none; margin:0; padding:0; }
.chips li, .chip{
  font-size:var(--fs-label); letter-spacing:.08em; text-transform:uppercase; font-weight:500;
  padding:7px 12px; border-radius:var(--r-pill); background:var(--color-surface); color:var(--color-text-muted);
}

.icon-row{ display:flex; flex-wrap:wrap; gap:var(--s-6); list-style:none; margin:0; padding:0; }
.icon-row li{ display:flex; align-items:center; gap:10px; font-size:var(--fs-small); color:var(--color-text-muted); }
.icon-row svg{ width:28px; height:28px; flex:0 0 auto; color:var(--color-accent-deep); }

nav[data-aicms="navbar"]{
  position:absolute; top:clamp(14px,2vw,24px); left:50%; transform:translateX(-50%);
  z-index:20; width:min(calc(100% - 24px), var(--maxw-page));
  display:flex; align-items:center; gap:var(--s-5);
  padding:10px 10px 10px 22px;
  background:rgba(255,255,255,.96); color:var(--color-text);
  border-radius:var(--r-pill); box-shadow:var(--shadow-2);
  
}
.nav-brand{
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--font-display); font-weight:500; letter-spacing:-.02em;
  font-size:17px; text-decoration:none; color:inherit; margin-right:auto;
}
.brand-mark{ width:26px; height:26px; color:var(--color-accent-deep); }
nav[data-aicms="navbar"] ul{ list-style:none; margin:0; padding:0; display:flex; gap:var(--s-5); }
nav[data-aicms="navbar"] ul a{ text-decoration:none; font-size:15px; color:inherit; opacity:.82; }
nav[data-aicms="navbar"] ul a:hover{ opacity:1; }
.nav-cta{ white-space:nowrap; }
@media (max-width: 760px){
  nav[data-aicms="navbar"]{ padding:8px 8px 8px 16px; gap:var(--s-3); }
  nav[data-aicms="navbar"] ul{ display:none; }
  .nav-cta{ font-size:13px; padding:11px 14px; }
}

.hero{ position:relative; padding:0; }
.hero-media{
  position:relative; min-height:min(88vh, 780px); display:flex; align-items:flex-end;
  overflow:hidden; border-bottom-left-radius:var(--r-4); border-bottom-right-radius:var(--r-4);
}
.hero-media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; aspect-ratio:auto; }
.hero-media::after{ content:""; position:absolute; inset:0; background:var(--hero-scrim); }
.hero-inner{ position:relative; z-index:2; width:100%; padding-bottom:clamp(38px, 5vw, 68px); padding-top:clamp(120px, 22vw, 220px); color:#fff; }
.hero-inner .eyebrow{ color:rgba(255,255,255,.85); }
.hero-inner .eyebrow::before{ background:rgba(255,255,255,.7); }
.hero h1{ color:#fff; max-width:16ch; font-size:var(--fs-display); }
.hero-lede{ margin-top:var(--s-5); max-width:52ch; color:rgba(255,255,255,.92); font-size:clamp(16px,1.15vw,18px); }
.hero-actions{ display:flex; flex-wrap:wrap; gap:var(--s-3); align-items:center; margin-top:var(--s-6); }
.hero-chip{
  display:inline-flex; align-items:center; gap:9px; color:#fff; text-decoration:none;
  background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.35);
  padding:11px 16px; border-radius:var(--r-pill); font-size:15px; font-weight:500;
  
}
.hero-chip:hover{ background:rgba(255,255,255,.22); }
.hero-chip svg{ width:16px; height:16px; }
.hero-city{
  margin-top:clamp(28px,4vw,44px); font-size:var(--fs-label); letter-spacing:.16em; text-transform:uppercase;
  color:rgba(255,255,255,.8); display:flex; gap:12px; align-items:center;
}
.hero-city::before{ content:""; width:32px; height:1px; background:currentColor; opacity:.55; }

.intro{ text-align:center; background:var(--color-bg); }
.intro .lede{
  max-width:var(--maxw-prose); margin-inline:auto;
  font-family:var(--font-display); font-weight:var(--display-weight);
  letter-spacing:-.015em; line-height:1.24;
  font-size:clamp(22px, 2.4vw, 32px); color:var(--color-text);
}
.intro .rule{ width:52px; height:2px; background:var(--color-accent); margin:0 auto var(--s-6); border-radius:2px; }
.intro .chips{ justify-content:center; margin-top:var(--s-6); }
.intro .intro-sub{ margin-top:var(--s-5); font-size:var(--fs-small); color:var(--color-text-muted); }

.offers{ background:var(--color-surface); }
.section-head{ display:grid; grid-template-columns:1.2fr 1fr; gap:var(--gap); align-items:end; margin-bottom:clamp(28px,4vw,48px); }
.section-head p{ color:var(--color-text-muted); max-width:42ch; }
@media (max-width:820px){ .section-head{ grid-template-columns:1fr; } }

.offer-list{ list-style:none; margin:0; padding:0; display:grid; gap:var(--gap); }
.offer{
  display:grid; grid-template-columns:1.05fr 1fr; gap:clamp(20px,3vw,44px); align-items:center;
  background:var(--color-bg); border-radius:var(--r-3); padding:clamp(18px,2.2vw,28px);
  box-shadow:var(--shadow-1);
}
.offer:nth-child(even) .offer-photo{ order:-1; }
.offer-photo{ margin:0; border-radius:var(--r-3); overflow:hidden; background:var(--color-surface); }
.offer-photo img{ width:100%; aspect-ratio:4/3; object-fit:cover; }
.offer-body{ padding:clamp(4px,1.4vw,18px) clamp(4px,1.4vw,22px); }
.offer-num{
  display:inline-flex; align-items:center; justify-content:center;
  font-family:var(--font-display); font-weight:500; letter-spacing:.02em;
  font-size:13px; width:34px; height:34px; border-radius:var(--r-pill);
  background:var(--tint, var(--tint-1)); color:var(--ink-on-tint);
  margin-bottom:var(--s-4);
}
.offer h3{ font-size:clamp(22px,2vw,28px); letter-spacing:-.02em; }
.offer p{ margin-top:var(--s-3); color:var(--color-text-muted); max-width:46ch; }
.offer .text-link{ margin-top:var(--s-5); }
.offer[data-tint="1"]{ background:var(--tint-1); }
.offer[data-tint="1"] p{ color:color-mix(in srgb, var(--ink-on-tint) 68%, transparent); }
.offer[data-tint="1"] .offer-body{ }
.offer[data-tint="1"] .offer-photo{ background:transparent; }
.offer[data-tint="2"]{ background:var(--tint-2); }
.offer[data-tint="2"] p{ color:color-mix(in srgb, var(--ink-on-tint) 68%, transparent); }
.offer[data-tint="3"]{ background:var(--tint-3); }
.offer[data-tint="3"] p{ color:color-mix(in srgb, var(--ink-on-tint) 68%, transparent); }
.offer[data-tint="4"]{ background:var(--tint-4); }
.offer[data-tint="4"] p{ color:color-mix(in srgb, var(--ink-on-tint) 68%, transparent); }
.offer[data-tint] { --tint:inherit; }
.offer[data-tint] h3{ color:var(--ink-on-tint); }
.offer[data-tint] .text-link{ color:var(--ink-on-tint); }
@media (max-width:820px){
  .offer{ grid-template-columns:1fr; }
  .offer:nth-child(even) .offer-photo{ order:0; }
}

.cta-band{ background:var(--color-surface); padding-top:0; }
.cta-photo{
  position:relative; border-radius:var(--r-4); overflow:hidden; margin:0;
}
.cta-photo img{ width:100%; aspect-ratio:21/8; object-fit:cover; }
.cta-photo::after{ content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(8,20,10,.55),rgba(8,20,10,.05)); }
.cta-card{
  position:relative; z-index:2; margin-top:calc(-1 * clamp(80px,12vw,180px));
  margin-left:clamp(16px,4vw,56px); max-width:min(560px, 92%);
  background:#fff; border-radius:var(--r-3); padding:clamp(22px,2.6vw,34px);
  box-shadow:var(--shadow-3);
}
.cta-card h2{ font-size:clamp(28px,3.2vw,44px); }
.cta-card p{ margin-top:var(--s-3); color:var(--color-text-muted); max-width:44ch; }
.cta-card .actions{ display:flex; align-items:center; gap:var(--s-5); flex-wrap:wrap; margin-top:var(--s-6); }
.cta-phone{ font-family:var(--font-display); font-weight:500; letter-spacing:-.02em; font-size:clamp(20px,2vw,26px); text-decoration:none; color:inherit; }
@media (max-width:640px){
  .cta-photo img{ aspect-ratio:4/3; }
  .cta-card{ margin-top:calc(-1 * var(--s-8)); margin-inline:clamp(12px,4vw,20px); }
}

.contact{ background:var(--color-bg); }
.contact-card{
  border-radius:var(--r-4); background:var(--color-surface);
  padding:clamp(28px,4vw,64px); display:grid; grid-template-columns:1fr 1fr;
  gap:clamp(24px,4vw,60px); align-items:start;
}
.contact-card h2{ font-size:clamp(32px,3.6vw,52px); max-width:14ch; }
.contact-card .lede{ margin-top:var(--s-5); color:var(--color-text-muted); max-width:44ch; }
.contact-side{ display:grid; gap:var(--s-5); }
.contact-block{ border-top:1px solid var(--color-border); padding-top:var(--s-4); }
.contact-block .label{ font-size:var(--fs-label); letter-spacing:.14em; text-transform:uppercase; color:var(--color-text-muted); margin-bottom:8px; }
.contact-block a{ font-size:clamp(20px,2vw,28px); font-family:var(--font-display); font-weight:500; letter-spacing:-.02em; text-decoration:none; }
.contact-block a:hover{ color:var(--color-accent-deep); }
.contact-actions{ display:flex; flex-wrap:wrap; gap:var(--s-3); margin-top:var(--s-2); }
@media (max-width:820px){ .contact-card{ grid-template-columns:1fr; } }

.closing{
  background:var(--color-band); color:var(--color-band-text);
  padding-block:clamp(46px,5vw,84px);
}
.closing .wrap{ display:grid; grid-template-columns:1.4fr auto; gap:var(--gap); align-items:center; }
.closing h2{ color:var(--color-band-text); font-size:clamp(30px,3.6vw,54px); max-width:22ch; }
.closing p{ margin-top:var(--s-3); color:color-mix(in srgb, var(--color-band-text) 82%, transparent); max-width:40ch; }
.closing a.btn-solid{ background:#fff; color:var(--color-band); }
@media (max-width:700px){ .closing .wrap{ grid-template-columns:1fr; } }

footer[data-aicms="footer"]{ background:var(--color-bg); color:var(--color-text); }
footer[data-aicms="footer"] .foot{
  display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:clamp(24px,4vw,56px);
  padding-block:clamp(36px,4vw,64px);
}
footer[data-aicms="footer"] .foot-name{
  font-family:var(--font-display); font-weight:500; letter-spacing:-.02em;
  font-size:22px; margin:0 0 var(--s-3);
}
footer[data-aicms="footer"] h2{
  font-family:var(--font-body); font-weight:500; letter-spacing:.14em; text-transform:uppercase;
  font-size:var(--fs-label); color:var(--color-text-muted); margin:0 0 var(--s-4);
}
footer[data-aicms="footer"] p{ font-size:var(--fs-small); color:var(--color-text-muted); max-width:38ch; }
footer[data-aicms="footer"] a{ text-decoration:none; color:inherit; }
footer[data-aicms="footer"] a:hover{ color:var(--color-accent-deep); }
footer[data-aicms="footer"] ul{ list-style:none; margin:0; padding:0; display:grid; gap:8px; }
footer[data-aicms="footer"] .foot-legal{
  display:flex; justify-content:space-between; gap:var(--s-4); flex-wrap:wrap;
  border-top:1px solid var(--color-border);
  padding-top:var(--s-5); padding-bottom:var(--s-5);
  font-size:var(--fs-label); color:var(--color-text-muted); letter-spacing:.04em;
}
@media (max-width:760px){
  footer[data-aicms="footer"] .foot{ grid-template-columns:1fr; }
}
footer[data-aicms="footer"] .book-bar{ display:none; }

@media (prefers-reduced-motion: no-preference){
  .btn, .text-link, .hero-chip{ transition:transform .18s ease, background .18s ease, color .18s ease; }
  .offer-photo img{ transition:transform .5s ease; }
  .offer:hover .offer-photo img{ transform:scale(1.02); }
}

.contact-place{
  margin:0;
  font-family:var(--font-body);
  font-size:var(--fs-body);
  line-height:var(--lh-body);
  color:var(--color-text);
}

.nav-links{
  display:flex;
  align-items:center;
  gap:var(--s-5);
  margin:0;
  padding:0;
  list-style:none;
}

.nav-links li{
  display:flex;
}

.nav-links a{
  display:inline-flex;
  align-items:center;
  min-height:44px;
  padding:0 var(--s-2);
  font-family:var(--font-body);
  font-size:15px;
  font-weight:500;
  text-decoration:none;
  color:var(--color-text);
  border-radius:var(--r-button);
  transition:color var(--transition), background var(--transition), transform var(--transition);
}

.nav-links a:hover{
  color:var(--color-accent-deep);
}

@media (max-width:760px){
  .nav-links{
    flex-wrap:wrap;
    gap:var(--s-3);
    max-width:100%;
  }
}

:where(img){height:auto}
.hero-media img:not(#aicms-none){filter:brightness(.5) saturate(.9)}
.hero-media:where(:has(img)){--color-text:#fff;--color-text-muted:rgba(255,255,255,.86);--color-text-soft:rgba(255,255,255,.86);color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.45)}
.hero-media:where(:has(img)) :is(h1,h2,h3,h4,h5,h6,p,li,dt,dd,blockquote,address):not(.btn, .btn *, .btn-solid, .btn-solid *, .hero-chip, .hero-chip *){color:#fff}
.hero-media:where(:has(img)) :is(.btn,.btn-solid,.hero-chip){text-shadow:none;--color-text:#000000}
.hero-media:where(:has(img)) .btn:not(#aicms-none):not(:hover){color:var(--color-text)}
.hero-media:where(:has(img)) .btn-solid:not(#aicms-none):not(:hover){color:var(--color-on-accent)}
.hero-media:where(:has(img)) .hero-chip:not(#aicms-none):not(:hover){color:#fff}

/* === EXTENSIONS === */

.btn,a[class*="btn"],button[class*="btn"],[data-aicms="nav-toggle"] button,nav[data-aicms="navbar"] a{min-height:44px;align-content:center}
.btn,a[class*="btn"],button[class*="btn"]{display:inline-flex;align-items:center;justify-content:center}
