/* =====================================================================
   AVENNA — ELEVATION LAYER (Direction 1 · Editorial Quiet Luxury)
   Loaded AFTER styles.css. Elevates the existing class vocabulary
   site-wide: type scale, whitespace, editorial detailing, dark footer,
   refined cards, richer motion. No markup changes required.
   ===================================================================== */

:root{
  --brass-lt: #B9C0CE;
  --ink: #211D18;
  --ease-out: cubic-bezier(.16,1,.3,1);
  --maxw: 1320px;
  --gutter: clamp(1.5rem, 5vw, 6rem);
  --radius: 0px;
  --script: "Momo Signature", "Pinyon Script", cursive;
}

/* ---------- Type: editorial scale & tightening ---------- */
body{ letter-spacing:.012em; }
h1,h2,h3,h4{ letter-spacing:.004em; line-height:1.05; }
h1{ font-size:clamp(3rem,6.6vw,5.8rem); font-weight:400; }
h2{ font-size:clamp(2.2rem,4.4vw,3.6rem); font-weight:400; }
h3{ font-weight:500; }
.lead{ font-size:clamp(1.1rem,1.55vw,1.32rem); line-height:1.85; }
.eyebrow{ letter-spacing:.21em; font-size:.7rem; }
.serif{ font-family:var(--serif); }

/* ---------- Whitespace ---------- */
.section{ padding-block:clamp(6rem,12vw,11rem); }
.wrap{ max-width:var(--maxw); }
@media (max-width:760px){ .section{ padding-block:clamp(3.5rem,11vw,5.5rem); } }

/* ---------- Header refinement ---------- */
.site-header{ padding-block:1.5rem; }
.site-header.solid{ background:rgba(246,241,235,.9); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); }
.nav a{ font-size:.66rem; letter-spacing:.16em; }
.nav .btn{ letter-spacing:.16em; }
.brand__logo{ height:44px; }

/* ---------- Services dropdown ---------- */
.nav-drop{ position:relative; display:flex; align-items:center; }
.nav-drop__menu{
  position:absolute; top:100%; left:50%; transform:translateX(-50%) translateY(8px);
  min-width:212px; background:rgba(246,241,235,.98); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  border:1px solid var(--line); box-shadow:0 32px 64px -34px rgba(33,30,26,.45);
  padding:.5rem 0; display:flex; flex-direction:column;
  opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity .3s var(--ease), transform .3s var(--ease); z-index:130;
}
.nav-drop__menu::before{ content:""; position:absolute; top:-16px; left:0; right:0; height:16px; }
.nav-drop:hover .nav-drop__menu, .nav-drop:focus-within .nav-drop__menu{
  opacity:1; visibility:visible; pointer-events:auto; transform:translateX(-50%) translateY(0);
}
.nav-drop__menu a{
  padding:.62rem 1.5rem !important; font-size:.66rem; letter-spacing:.16em;
  color:var(--charcoal) !important; white-space:nowrap;
}
.nav-drop__menu a::after{ display:none !important; }
.nav-drop__menu a:hover{ background:rgba(33,30,26,.05); color:var(--brass-deep) !important; }

@media (max-width:1240px){
  .nav-drop{ flex-direction:column; gap:1.1rem; }
  .nav-drop__menu{
    position:static; transform:none; opacity:1; visibility:visible; pointer-events:auto;
    background:transparent; border:0; box-shadow:none; padding:0; min-width:0; gap:1rem;
  }
  .nav-drop__menu::before{ display:none; }
  .nav-drop__menu a{ color:var(--ivory) !important; font-size:.82rem !important; opacity:.82; padding:0 !important; }
}

/* ---------- Eyebrow as editorial index marker ---------- */
.slabel .eyebrow,.eyebrow{ position:relative; }

/* ---------- Divider ---------- */
.divider{ width:60px; }

/* ---------- Buttons ---------- */
.btn{ font-size:.66rem; letter-spacing:.13em; padding:1.1rem 2.5rem; }
.btn:hover{ letter-spacing:.15em; }

/* ---------- Page hero (sub-pages): taller, editorial, bottom-aligned ---------- */
.pagehero{ min-height:62vh; }
.pagehero__inner{ padding-block:clamp(3rem,6vw,5rem); }
.pagehero h1{ font-size:clamp(2.8rem,6vw,5.2rem); font-weight:400; line-height:1; letter-spacing:-.01em; }
.pagehero .eyebrow{ margin-bottom:1.2rem; }

/* ---------- Cards: flatter & editorial ---------- */
.card{ border:1px solid var(--line); box-shadow:none; transition:transform .55s var(--ease), box-shadow .55s var(--ease); }
.card:hover{ transform:translateY(-6px); box-shadow:0 40px 80px -50px rgba(33,30,26,.45); }
.jcard,.listing,.area-card,.pkg{ box-shadow:none; }
.jcard:hover,.listing:hover,.area-card:hover,.pkg:hover{ box-shadow:0 40px 80px -50px rgba(33,30,26,.42); }

/* image hover refinement */
.card .ratio .img,.jcard .ratio .img,.listing__media .img{ transition:transform 1.2s var(--ease); }
.card:hover .ratio .img,.jcard:hover .ratio .img,.listing:hover .img{ transform:scale(1.05); }

/* ---------- Numbered feature / process rows: editorial ---------- */
.feature{ transition:padding-left .5s var(--ease); }
.feature:hover{ padding-left:1rem; }
.feature__num,.pstep .ico{ color:var(--brass); }
.srow{ transition:padding-left .5s var(--ease); }
.srow:hover{ padding-left:1rem; }
a.srow{ color:inherit; text-decoration:none; }
a.srow .link-arrow{ color:var(--brass); }
a.srow:hover h3{ color:var(--brown); }
a.jcard__link{ display:block; }

/* ---------- Menu stays light; on scroll use a dark glass bar (no flip to dark text) ---------- */
.site-header{ transition:padding .5s var(--ease), box-shadow .5s var(--ease); }
.site-header.on-dark.solid{
  background:rgba(26,23,19,.82); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
  box-shadow:0 1px 0 rgba(255,255,255,.06);
}
.site-header.on-dark.solid::before{ opacity:1; }
.site-header.on-dark.solid .brand__name{ color:var(--ivory); }
.site-header.on-dark.solid .nav a{ color:var(--ivory); }
.site-header.on-dark.solid .brand__logo--dark{ display:none; }
.site-header.on-dark.solid .brand__logo--light{ display:block; }
.site-header.on-dark.solid .nav-toggle span{ background:var(--ivory); }

/* ---------- Prose ---------- */
.prose p{ line-height:1.95; }
.article-head h1{ font-size:clamp(2.6rem,5.2vw,4.2rem); letter-spacing:-.01em; }

/* ---------- Script accents use Momo ---------- */
.script,.brand__name{ font-family:var(--script); }

/* ---------- Dark, unified footer (matches homepage) ---------- */
.site-footer{ background:var(--charcoal); color:rgba(246,241,235,.7); border-top:0; padding-block:clamp(4rem,7vw,6rem) 2rem; }
.site-footer h4{ color:var(--brass-lt); }
.site-footer a{ color:rgba(246,241,235,.72); }
.site-footer a:hover{ color:#fff; }
.footer__tag{ color:var(--ivory); }
.footer__brand p{ color:rgba(246,241,235,.62); }
.monogram{ color:var(--ivory); border-color:var(--brass); }
.socials a{ color:var(--brass-lt); }
.footer-legal{ border-top:1px solid rgba(246,241,235,.14); margin-top:2.5rem; }
.footer-legal p{ color:rgba(246,241,235,.5); }
.footer-bottom{ border-top:1px solid rgba(246,241,235,.14); color:rgba(246,241,235,.6); }
.footer-bottom a{ color:rgba(246,241,235,.7); }
.footer-bottom a:hover{ color:#fff; }

/* ---------- Richer motion ---------- */
.reveal{ transition:opacity .9s var(--ease-out), transform .9s var(--ease-out); transform:translateY(26px); }

/* line-by-line headline reveal (opt-in via .lines markup) */
.lines span{ display:block; overflow:hidden; padding-bottom:.12em; margin-bottom:-.12em; }
.lines span i{ display:block; font-style:inherit; transform:translateY(110%); transition:transform 1s var(--ease-out); }
.lines.in span:nth-child(1) i{ transition-delay:.05s; }
.lines.in span:nth-child(2) i{ transition-delay:.16s; }
.lines.in span:nth-child(3) i{ transition-delay:.27s; }
.lines.in span i{ transform:none; }
html:not(.js) .lines span i{ transform:none; }

@media (prefers-reduced-motion:reduce){
  .lines span i{ transform:none; transition:none; }
}

/* ---------- Sub-page hero: SPLIT — title on charcoal, photo alongside ---------- */
.pagehero{
  position:relative; display:grid; grid-template-columns:1.05fr 1fr;
  min-height:clamp(440px,60vh,580px); background:var(--charcoal);
  color:var(--ivory); align-items:stretch; overflow:hidden;
}
.pagehero__bg{ order:2; position:relative; inset:auto; z-index:0; width:100%; height:100%; }
.pagehero__bg img{ width:100%; height:100%; object-fit:cover; object-position:center; display:block; }
.pagehero__bg::after{ display:none; }
.pagehero__inner{
  order:1; align-self:center; position:relative; z-index:2;
  display:flex; flex-direction:column; justify-content:center;
  width:100%; max-width:none; margin:0;
  padding:clamp(7.5rem,13vh,9.5rem) clamp(2rem,4vw,4.5rem) clamp(2.5rem,5vw,3.5rem);
}
.pagehero h1{ color:var(--ivory); text-shadow:none; }
.pagehero .eyebrow{ color:var(--brass-light); margin-bottom:1.1rem; text-shadow:none; }
.pagehero p{ color:rgba(246,241,235,.92); text-shadow:none; margin-top:.4rem; }
.pagehero .hero-rule{ width:54px; height:2px; background:var(--brass); border:0; margin:1.3rem 0 0; }
@media (max-width:820px){
  .pagehero{ grid-template-columns:1fr; }
  .pagehero__inner{ padding:clamp(7rem,16vh,9rem) var(--gutter) 1.8rem; }
  .pagehero__bg{ height:clamp(240px,42vh,360px); }
}
