/* AVEMONT — shared design system. Used by every page on the site. */

:root{
  --black:#0a0a0a;
  --charcoal:#1c1b19;
  --stone:#8c8579;
  --warm-white:#f6f4f0;
  --concrete:#b9b4ab;
  --oak:#8a6a49;
  --gold:#c9a769;
  --ink:#5a564e;
  --line: rgba(255,255,255,0.14);
  --line-dark: rgba(10,10,10,0.1);
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth; overflow-x:hidden; width:100%;}
body{
  font-family:'Work Sans', sans-serif;
  background:var(--warm-white);
  color:var(--charcoal);
  font-weight:300;
  overflow-x:hidden;
  width:100%;
  position:relative;
}
h1,h2,h3,.nav-logo,.label{
  font-family:'Jost', sans-serif;
  font-weight:300;
  letter-spacing:0.18em;
  text-transform:uppercase;
}
.serif-accent{
  font-family:'Cormorant Garamond', serif;
  font-style:italic;
  font-weight:400;
  text-transform:none;
  letter-spacing:0;
}
a{color:inherit; text-decoration:none;}
img{display:block; width:100%; height:100%; object-fit:cover;}

/* ---------- NAV ---------- */
nav{
  position:fixed; top:0; left:0; width:100%; z-index:100;
  display:flex; align-items:center; justify-content:space-between;
  padding:28px 5vw;
  transition:background .5s ease, padding .4s ease, box-shadow .4s ease;
}
nav.scrolled{
  background:rgba(246,244,240,0.92);
  padding:18px 5vw;
  box-shadow:0 1px 0 var(--line-dark);
  backdrop-filter:blur(6px);
}
.nav-logo{ position:relative; height:19px; line-height:0; }
.nav-logo img{ display:block; height:19px; width:auto; }
.nav-logo .logo-dark{ position:absolute; top:0; left:0; opacity:0; transition:opacity .4s ease; }
.nav-logo .logo-light{ transition:opacity .4s ease; }
nav.scrolled .nav-logo .logo-light{ opacity:0; }
nav.scrolled .nav-logo .logo-dark{ opacity:1; }
.nav-links{ display:flex; gap:38px; }
.nav-links a{
  font-size:11px; letter-spacing:0.18em; text-transform:uppercase;
  color:#fff; position:relative; padding-bottom:4px;
  transition:color .4s ease;
}
.nav-links a.current{ opacity:0.55; }
nav.scrolled .nav-links a{ color:var(--charcoal); }
.nav-links a::after{
  content:''; position:absolute; left:0; bottom:0; width:0; height:1px;
  background:var(--gold); transition:width .35s ease;
}
.nav-links a:hover::after{ width:100%; }
.nav-toggle{
  display:none; position:relative; width:26px; height:16px; background:none; border:none; padding:0;
  cursor:pointer; z-index:110; flex-shrink:0;
}
.nav-toggle span{
  position:absolute; left:0; width:100%; height:1px; background:#fff;
  transition:transform .35s ease, opacity .35s ease, background .35s ease;
}
.nav-toggle span:nth-child(1){ top:0; }
.nav-toggle span:nth-child(2){ top:7px; }
.nav-toggle span:nth-child(3){ top:14px; }
body:not(.nav-transparent) .nav-toggle span,
nav.scrolled .nav-toggle span,
nav.nav-open .nav-toggle span{ background:var(--charcoal); }
nav.nav-open .nav-toggle span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
nav.nav-open .nav-toggle span:nth-child(2){ opacity:0; }
nav.nav-open .nav-toggle span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }
.nav-backdrop{
  display:none; position:fixed; inset:0; background:rgba(10,10,10,0.4);
  opacity:0; transition:opacity .4s ease; z-index:105;
}
nav.nav-open .nav-backdrop{ display:block; opacity:1; }
body:not(.nav-transparent) nav{ background:rgba(246,244,240,0.92); box-shadow:0 1px 0 var(--line-dark); padding:18px 5vw; }
body:not(.nav-transparent) .nav-logo .logo-light{ opacity:0; }
body:not(.nav-transparent) .nav-logo .logo-dark{ opacity:1; }
body:not(.nav-transparent) .nav-links a{ color:var(--charcoal); }

/* ---------- HERO (full, homepage) ---------- */
.hero{
  position:relative; height:100vh; min-height:640px;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; color:#fff; overflow:hidden;
}
.hero-bg{ position:absolute; inset:-6% -2% -2% -2%; overflow:hidden; will-change:transform; background:#0a0a0a; }
.hero-bg-inner{
  position:absolute; inset:0;
  animation:heroKenBurns 34s ease-in-out infinite alternate;
}
.hero-bg-inner img{ position:absolute; inset:0; }
.hero-overlay{
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(10,10,10,0.42) 0%, rgba(10,10,10,0.58) 55%, rgba(10,10,10,0.8) 100%);
}
.hero-overlay.tone-2{ background:linear-gradient(180deg, rgba(10,10,10,0.48) 0%, rgba(10,10,10,0.6) 55%, rgba(10,10,10,0.82) 100%); }
.hero-overlay.tone-3{ background:linear-gradient(180deg, rgba(10,10,10,0.5) 0%, rgba(10,10,10,0.62) 55%, rgba(10,10,10,0.84) 100%); }
@keyframes heroKenBurns{ from{transform:scale(1) translate3d(0,0,0);} to{transform:scale(1.06) translate3d(-1%,-1%,0);} }
.hero-content{ position:relative; z-index:2; padding:0 24px; opacity:0; animation:fadeUp 1.4s ease .3s forwards; }
@keyframes fadeUp{ from{opacity:0; transform:translateY(18px);} to{opacity:1; transform:translateY(0);} }
.hero h1{
  font-size:clamp(38px, 6vw, 72px); font-weight:300; letter-spacing:0.1em;
  margin-bottom:22px;
}
.hero p{
  font-size:15px; letter-spacing:0.02em; max-width:480px; margin:0 auto;
  color:rgba(255,255,255,0.82); line-height:1.8; font-weight:300;
}
.scroll-cue{
  position:absolute; bottom:40px; left:50%; transform:translateX(-50%);
  width:1px; height:50px; background:rgba(255,255,255,0.4); z-index:2;
  overflow:hidden;
}
.scroll-cue::after{
  content:''; position:absolute; top:-100%; left:0; width:100%; height:100%;
  background:#fff; animation:scrollLine 2.2s ease-in-out infinite;
}
@keyframes scrollLine{ 0%{top:-100%;} 50%{top:0;} 100%{top:100%;} }

/* ---------- PAGE HERO (interior pages, shorter) ---------- */
.page-hero{
  position:relative; height:58vh; min-height:420px;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; color:#fff; overflow:hidden;
}
.page-hero .hero-content{ animation:fadeUp 1.2s ease .2s forwards; }
.page-hero .label{ color:var(--gold); }
.page-hero h1{ font-size:clamp(32px,5vw,54px); margin-bottom:18px; }
.page-hero p{ font-size:15px; max-width:520px; margin:0 auto; color:rgba(255,255,255,0.8); line-height:1.8; font-weight:300; }

/* ---------- SECTION / REVEAL / LABEL ---------- */
section{ padding:140px 5vw; }
.reveal{ opacity:0; transform:translateY(28px); transition:opacity 1s ease, transform 1s ease; }
.reveal.visible{ opacity:1; transform:translateY(0); }
.label{ font-size:11px; letter-spacing:0.28em; color:var(--oak); display:block; margin-bottom:22px; }
.section-head{ text-align:center; max-width:640px; margin:0 auto 70px; }
.section-head h2{ font-size:28px; letter-spacing:0.1em; }
.section-head .serif-accent{ font-size:26px; }

/* ---------- EDITORIAL PARAGRAPH (positioning-style pause) ---------- */
.editorial-pause{ text-align:center; max-width:760px; margin:0 auto; }
.editorial-pause .serif-accent{ font-size:clamp(24px,3.4vw,34px); line-height:1.5; display:block; margin-bottom:32px; color:var(--charcoal); }
.editorial-pause p{ font-size:16px; line-height:1.9; color:var(--ink); font-weight:300; }
.editorial-pause.on-dark .serif-accent{ color:#fff; }
.editorial-pause.on-dark p{ color:rgba(255,255,255,0.65); }

/* ---------- SPLIT (reusable alternating image/text block) ---------- */
.split{ display:grid; grid-template-columns:1.1fr 0.9fr; align-items:stretch; }
.split.split--reverse{ grid-template-columns:0.9fr 1.1fr; }
.split.split--reverse .split-img{ order:2; }
.split.split--reverse .split-text{ order:1; }
.split.split--center{ align-items:center; }
.split-img{ position:relative; height:640px; overflow:hidden; }
.split-img .frame{
  position:absolute; inset:0; background:linear-gradient(160deg,#c7bfae,#5a5145);
  transition:transform 1.8s cubic-bezier(.19,1,.22,1);
}
.split:hover .split-img .frame{ transform:scale(1.03); }
.split-text{ display:flex; flex-direction:column; justify-content:center; padding:0 7vw; }
.split-text .serif-accent{ font-size:26px; line-height:1.6; margin-bottom:26px; }
.split-text h2{ font-size:26px; letter-spacing:0.08em; margin-bottom:26px; max-width:440px; }
.split-text p{ font-size:15px; line-height:1.9; color:var(--ink); font-weight:300; max-width:440px; margin-bottom:20px; }

/* ---------- TEXT LINKS / BUTTONS ---------- */
.text-link{ font-size:11px; letter-spacing:0.2em; text-transform:uppercase; border-bottom:1px solid var(--gold); padding-bottom:5px; width:fit-content; transition:letter-spacing .35s ease; }
.text-link:hover{ letter-spacing:0.3em; }
.text-link.on-dark{ border-color:var(--gold); }
.text-link.muted{ border-color:var(--oak); }

/* ---------- GRID CARDS (services / portfolio-like tiles) ---------- */
.tile{ position:relative; overflow:hidden; }
.tile .frame{ position:absolute; inset:0; transition:transform 1.4s cubic-bezier(.19,1,.22,1); }
.tile:hover .frame{ transform:scale(1.04); }
.tile-overlay{
  position:absolute; inset:0; background:linear-gradient(0deg, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0.05) 45%);
  display:flex; flex-direction:column; justify-content:flex-end; padding:44px;
  color:#fff;
}
.tile-overlay h3{ font-size:22px; letter-spacing:0.12em; margin-bottom:14px; }
.tile-overlay p{ font-size:14px; line-height:1.8; max-width:380px; font-weight:300; color:rgba(255,255,255,0.85); margin-bottom:20px;}
.tile-cap{
  position:absolute; bottom:0; left:0; right:0; padding:20px 24px;
  background:linear-gradient(0deg, rgba(0,0,0,0.55), transparent);
  color:#fff; font-size:12px; letter-spacing:0.14em; text-transform:uppercase;
}

/* ---------- DARK BAND (process / stat / cta sections) ---------- */
.band-dark{ background:var(--charcoal); color:#fff; }
.band-black{ background:var(--black); color:#fff; }

/* ---------- PROCESS STEPS ---------- */
.process-steps{ display:grid; grid-template-columns:repeat(4,1fr); gap:40px; max-width:1200px; margin:0 auto; position:relative; }
.process-steps::before{ content:''; position:absolute; top:14px; left:6%; right:6%; height:1px; background:var(--line); }
.step{ text-align:center; position:relative; }
.step .num{ font-family:'Jost',sans-serif; font-size:13px; letter-spacing:0.2em; color:var(--gold); display:block; margin-bottom:26px; }
.step h3{ font-size:15px; letter-spacing:0.1em; margin-bottom:14px; font-weight:400; }
.step p{ font-size:13px; line-height:1.8; color:rgba(255,255,255,0.65); font-weight:300; }

/* ---------- FORM ---------- */
form{ display:flex; flex-direction:column; gap:22px; }
.field{ display:flex; flex-direction:column; gap:8px; }
.field label{ font-size:11px; letter-spacing:0.16em; text-transform:uppercase; color:rgba(255,255,255,0.55); }
.field input, .field select, .field textarea{
  background:transparent; border:none; border-bottom:1px solid var(--line);
  color:#fff; font-family:'Work Sans',sans-serif; font-size:15px; font-weight:300;
  padding:10px 0; outline:none; transition:border-color .3s ease;
}
.field input:focus, .field select:focus, .field textarea:focus{ border-color:var(--gold); }
.field select option{ background:var(--charcoal); }
.submit-btn{
  align-self:flex-start; margin-top:14px; background:none; color:#fff;
  border:none; border-bottom:1px solid var(--gold); padding:0 0 8px;
  font-family:'Jost',sans-serif; font-size:11px; letter-spacing:0.22em; text-transform:uppercase;
  cursor:pointer; transition:letter-spacing .4s ease, opacity .4s ease; opacity:0.85;
}
.submit-btn:hover{ letter-spacing:0.3em; opacity:1; }
.hp-field{ position:absolute !important; width:1px !important; height:1px !important; overflow:hidden !important; clip:rect(0 0 0 0) !important; clip-path:inset(50%) !important; white-space:nowrap !important; left:-9999px !important; top:-9999px !important; }
.field-error{ display:block; font-size:11px; color:#c96363; letter-spacing:0.02em; margin-top:6px; }
.field input.is-invalid, .field select.is-invalid, .field textarea.is-invalid{ border-color:#c96363; }
.form-msg{ font-size:13px; line-height:1.7; letter-spacing:0.02em; display:none; }
.form-msg.visible{ display:block; }
.form-msg.success{ color:var(--gold); }
.form-msg.error{ color:#c96363; }
.submit-btn[disabled]{ opacity:0.4; cursor:default; pointer-events:none; }
.service-area{ font-size:12px; line-height:2.2; color:rgba(255,255,255,0.55); letter-spacing:0.04em; }
.service-area span{ color:var(--gold); }
.contact-wrap{ display:grid; grid-template-columns:1fr 1fr; gap:80px; max-width:1200px; margin:0 auto; }

/* ---------- FOOTER ---------- */
footer{
  background:var(--black); color:rgba(255,255,255,0.5);
  padding:40px 5vw; display:flex; justify-content:space-between; align-items:center;
  border-top:1px solid var(--line); font-size:11px; letter-spacing:0.08em;
}
footer .foot-logo{ line-height:0; }
footer .foot-logo img{ display:block; height:16px; width:auto; }
footer .foot-links{ display:flex; gap:22px; align-items:center; }
footer .foot-links a{ display:flex; color:rgba(255,255,255,0.5); transition:color .3s ease; }
footer .foot-links a:hover{ color:var(--gold); }
footer .foot-links svg{ width:18px; height:18px; display:block; }

/* ---------- RESPONSIVE ---------- */
@media (max-width:860px){
  .nav-toggle{ display:block; }
  .nav-links{
    display:flex; flex-direction:column; justify-content:center; align-items:flex-start;
    position:fixed; top:0; right:-100%; height:100vh; width:78%; max-width:320px;
    background:var(--warm-white); padding:0 12vw; gap:6px;
    transition:right .45s cubic-bezier(.19,1,.22,1);
    box-shadow:-10px 0 40px rgba(0,0,0,0.18); z-index:106;
  }
  nav.nav-open .nav-links{ right:0; }
  .nav-links a{
    color:var(--charcoal) !important; font-size:15px; letter-spacing:0.1em;
    width:100%; padding:14px 0; border-bottom:1px solid var(--line-dark);
  }
  .nav-links a.current{ opacity:1; color:var(--oak) !important; }
  .nav-links a::after{ display:none; }
  section{ padding:90px 6vw; }
  .split, .split.split--reverse{ grid-template-columns:1fr; }
  .split-img{ height:340px; }
  .split.split--reverse .split-img{ order:0; }
  .split.split--reverse .split-text{ order:0; }
  .split-text{ padding:60px 6vw; }
  .process-steps{ grid-template-columns:1fr 1fr; row-gap:50px; }
  .process-steps::before{ display:none; }
  .page-hero{ height:46vh; min-height:340px; }
  footer{ flex-direction:column; gap:16px; text-align:center; }
  .contact-wrap, .contact-page-wrap{ grid-template-columns:1fr !important; gap:50px !important; }
}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  .hero-bg-inner, .hero-content, .scroll-cue::after{ animation:none !important; }
  .hero-content{ opacity:1 !important; }
  .reveal{ opacity:1 !important; transform:none !important; transition:none !important; }
  *{ transition-duration:.01ms !important; }
}