/* ==========================================================================
   HGI Cabinetry - homepage concept
   Design language: Heritage Craft (#12) for type, spacing, composition, motion.
   Palette: HGI's own brand. Accent #c5ac8e is lifted verbatim from their
   css/grey.css color scheme (buttons, small borders, back-to-top, phone number).
   Their logo is pure white, their chrome is near black, their neutrals are
   #313131 / #535353 / #999999. Nothing here is a stock library palette.
   ========================================================================== */

:root{
  /* HGI brand */
  --tan:            #c5ac8e;   /* their exact accent from grey.css */
  --tan-soft:       #d8c6ae;
  --tan-deep:       #75593b;   /* same hue family, deepened for text on light (>=4.5:1 on parchment AND wheat) */
  --tan-fill:       #6f563a;   /* deeper still, for white text on a fill */
  --tan-glow:       rgba(197,172,142,.22);

  --ink:            #14100c;   /* darkest band, warm near black */
  --ink-2:          #1f1a14;
  --ink-3:          #2a231b;
  --slate:          #313131;   /* their .dark */
  --stone:          #535353;   /* their .pf_text */
  --grey:           #999999;   /* their default */

  --parchment:      #f5f1e9;
  --wheat:          #e9e2d5;
  --white:          #fffdf9;

  --text-dark:      #241f19;
  --text-body:      #4a443c;
  --text-muted:     #6b6459;
  --text-light:     #f3efe7;
  --text-light-muted: rgba(243,239,231,.78);

  /* type */
  --font-display: 'EB Garamond', Georgia, 'Times New Roman', serif;
  --font-body:    'Karla', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;

  /* layout */
  --wrap:      min(90%, 1180px);
  --wrap-wide: min(94%, 1500px);
  --wrap-read: min(88%, 860px);
  --gutter:    clamp(1.25rem, 4vw, 3rem);
  --pad-y:     clamp(3.5rem, 7vw, 6.5rem);
  --nav-h:     78px;

  /* motion */
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
}

*,*::before,*::after{ box-sizing:border-box; }

html{ -webkit-text-size-adjust:100%; }

body{
  margin:0;
  background:var(--parchment);
  color:var(--text-body);
  font-family:var(--font-body);
  font-weight:400;
  font-size:clamp(1rem, .96rem + .18vw, 1.075rem);
  line-height:1.72;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img{ max-width:100%; display:block; }
a{ color:inherit; }
figure,blockquote,dl,dd{ margin:0; }

h1,h2,h3,h4{
  font-family:var(--font-display);
  font-weight:400;
  color:var(--text-dark);
  margin:0;
  line-height:1.08;
  letter-spacing:.002em;
}

p{ margin:0 0 1.15em; }
p:last-child{ margin-bottom:0; }

.wrap{ width:var(--wrap); margin-inline:auto; }
.wrap-wide{ width:var(--wrap-wide); margin-inline:auto; }
.wrap-read{ width:var(--wrap-read); margin-inline:auto; }

section{ padding-block:var(--pad-y); position:relative; }

/* --- bands ------------------------------------------------------------- */
.band-dark{ background:var(--ink); color:var(--text-light-muted); }
.band-dark h1,.band-dark h2,.band-dark h3,.band-dark h4{ color:var(--text-light); }
.band-dark-2{ background:var(--ink-2); color:var(--text-light-muted); }
.band-dark-2 h2,.band-dark-2 h3,.band-dark-2 h4{ color:var(--text-light); }
.band-light{ background:var(--parchment); }
.band-wheat{ background:var(--wheat); }

/* --- shared type ------------------------------------------------------- */
.eyebrow{
  font-family:var(--font-body);
  font-size:.72rem;
  font-weight:500;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--tan-deep);
  margin:0 0 1.1rem;
  display:flex;
  align-items:center;
  gap:.85rem;
}
.eyebrow::after{
  content:"";
  flex:0 0 46px;
  height:1px;
  background:currentColor;
  opacity:.55;
}
.band-dark .eyebrow,.band-dark-2 .eyebrow,.hero .eyebrow,.visit .eyebrow{ color:var(--tan); }

.display-xl{ font-size:clamp(2.5rem, 1.1rem + 5.4vw, 5.1rem); }
.display-lg{ font-size:clamp(2.05rem, 1.2rem + 3.3vw, 3.5rem); }
.display-md{ font-size:clamp(1.55rem, 1.15rem + 1.5vw, 2.15rem); }

.lede{
  font-size:clamp(1.075rem, 1rem + .35vw, 1.25rem);
  line-height:1.66;
  color:var(--text-body);
}
.band-dark .lede,.band-dark-2 .lede,.hero .lede,.visit .lede{ color:var(--text-light-muted); }

.rule-thin{ height:1px; background:var(--tan); opacity:.42; border:0; margin:0; }

/* --- buttons ----------------------------------------------------------- */
.btn{
  display:inline-flex;
  align-items:center;
  gap:.7rem;
  padding:.95rem 1.6rem;
  border-radius:999px;
  font-family:var(--font-body);
  font-size:.83rem;
  font-weight:500;
  letter-spacing:.14em;
  text-transform:uppercase;
  text-decoration:none;
  border:1px solid transparent;
  transition:background .35s var(--ease), color .35s var(--ease), border-color .35s var(--ease), transform .35s var(--ease);
  min-height:48px;
  will-change:transform;
}
.btn__dot{
  width:7px; height:7px;
  border-radius:50%;
  background:currentColor;
  flex:0 0 7px;
  transition:transform .35s var(--ease);
}
.btn:hover .btn__dot{ transform:scale(1.55); }

.btn--solid{ background:var(--tan); color:var(--ink); border-color:var(--tan); }
.btn--solid:hover{ background:var(--tan-soft); border-color:var(--tan-soft); }

.btn--fill{ background:var(--tan-fill); color:#fff; border-color:var(--tan-fill); }
.btn--fill:hover{ background:var(--tan-deep); border-color:var(--tan-deep); }

.btn--ghost-light{ background:transparent; color:var(--text-light); border-color:rgba(243,239,231,.4); }
.btn--ghost-light:hover{ background:rgba(243,239,231,.1); border-color:rgba(243,239,231,.72); }

.btn--ghost-dark{ background:transparent; color:var(--tan-deep); border-color:rgba(117,89,59,.45); }
.btn--ghost-dark:hover{ background:rgba(117,89,59,.09); border-color:var(--tan-deep); }

.btn-row{ display:flex; flex-wrap:wrap; gap:.85rem; }

/* --- nav --------------------------------------------------------------- */
.nav{
  position:fixed;
  inset:0 0 auto 0;
  z-index:120;
  height:var(--nav-h);
  display:flex;
  align-items:center;
  background:transparent;
  transition:background .45s var(--ease), box-shadow .45s var(--ease), height .45s var(--ease);
}
.nav.is-solid{
  background:rgba(20,16,12,.96);
  box-shadow:0 1px 0 rgba(197,172,142,.16);
  height:68px;
}
.nav__inner{
  width:var(--wrap-wide);
  margin-inline:auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1.25rem;
}
.nav__logo img{
  width:auto;
  height:44px;
  max-width:170px;
  object-fit:contain;
  transition:height .45s var(--ease);
}
.nav.is-solid .nav__logo img{ height:36px; }
.nav__links{
  display:flex;
  align-items:center;
  gap:clamp(1rem, 2vw, 2rem);
  list-style:none;
  margin:0; padding:0;
}
.nav__link{
  font-size:.76rem;
  font-weight:500;
  letter-spacing:.16em;
  text-transform:uppercase;
  text-decoration:none;
  color:rgba(243,239,231,.86);
  padding-block:.5rem;
  transition:color .3s var(--ease);
}
.nav__link:hover{ color:var(--tan); }
.nav__cta{ padding:.72rem 1.25rem; min-height:44px; }
.nav__burger{
  display:none;
  width:48px; height:48px;
  background:none; border:0; padding:0;
  cursor:pointer;
  position:relative;
  z-index:140;
}
.nav__burger span{
  position:absolute;
  left:11px;
  width:26px; height:2px;
  background:var(--text-light);
  transition:transform .38s var(--ease), opacity .28s var(--ease);
}
.nav__burger span:nth-child(1){ top:17px; }
.nav__burger span:nth-child(2){ top:23px; }
.nav__burger span:nth-child(3){ top:29px; }
body.menu-open .nav__burger span:nth-child(1){ transform:translateY(6px) rotate(45deg); }
body.menu-open .nav__burger span:nth-child(2){ opacity:0; }
body.menu-open .nav__burger span:nth-child(3){ transform:translateY(-6px) rotate(-45deg); }

/* --- mobile menu ------------------------------------------------------- */
.mobile-menu{
  position:fixed;
  inset:0;
  z-index:110;
  background:var(--ink);
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:.35rem;
  padding:6rem var(--gutter) 3rem;
  opacity:0;
  visibility:hidden;
  transform:translateY(-14px);
  transition:opacity .4s var(--ease), transform .4s var(--ease), visibility .4s;
  overflow-y:auto;
}
body.menu-open .mobile-menu{ opacity:1; visibility:visible; transform:none; }
.mobile-menu a{
  font-family:var(--font-display);
  font-size:clamp(1.6rem, 7vw, 2.3rem);
  color:var(--text-light);
  text-decoration:none;
  padding-block:.5rem;
  border-bottom:1px solid rgba(197,172,142,.16);
}
.mobile-menu a:last-of-type{ border-bottom:0; }
.mobile-menu__foot{
  margin-top:2rem;
  font-size:.9rem;
  color:var(--text-light-muted);
}
.mobile-menu__foot a{
  font-family:var(--font-body);
  font-size:1rem;
  border:0;
  color:var(--tan);
  display:inline-block;
  padding-block:.65rem;
}

/* --- hero: the mantel -------------------------------------------------- */
.hero{
  background:var(--ink);
  color:var(--text-light-muted);
  min-height:100vh;
  min-height:100svh;
  padding:calc(var(--nav-h) + clamp(2rem, 5vw, 4rem)) 0 clamp(2.5rem, 5vw, 4.5rem);
  display:flex;
  flex-direction:column;
  position:relative;
}
.hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(120% 70% at 12% 0%, rgba(197,172,142,.10), transparent 62%),
    linear-gradient(180deg, var(--ink) 0%, var(--ink-2) 100%);
  pointer-events:none;
}
.hero__inner{ position:relative; z-index:2; width:var(--wrap-wide); margin-inline:auto; }
.hero__head{
  display:grid;
  grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);
  gap:clamp(2rem, 6vw, 5.5rem);
  align-items:end;
}
.hero__aside{
  border-left:1px solid rgba(197,172,142,.3);
  padding-left:clamp(1.25rem, 2.5vw, 2rem);
  padding-bottom:.4rem;
}
.hero__aside-label{
  font-size:.7rem;
  font-weight:500;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--tan);
  margin-bottom:.9rem;
}
.hero__aside-body{
  font-size:.97rem;
  line-height:1.66;
  color:var(--text-light-muted);
  margin-bottom:1.25rem;
}
.hero__aside .rule-thin{ margin-bottom:1.25rem; }
.hero__aside-body:last-child{ margin-bottom:0; }
.hero h1{
  max-width:min(100%, 15ch);
  color:var(--text-light);
  font-size:clamp(2.6rem, .9rem + 5.6vw, 5.15rem);
  line-height:1.02;
  margin-bottom:1.15rem;
}
.hero h1 em{
  font-style:italic;
  color:var(--tan);
}
.hero__sub{
  max-width:52ch;
  font-size:clamp(1.05rem, .98rem + .38vw, 1.24rem);
  line-height:1.62;
  color:var(--text-light-muted);
  margin-bottom:1.9rem;
}
.hero__meta{
  display:flex;
  flex-wrap:wrap;
  gap:.6rem 1.75rem;
  margin-top:2rem;
  font-size:.73rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(243,239,231,.7);
}
.hero__meta span{ display:inline-flex; align-items:center; gap:.6rem; }
.hero__meta span::before{
  content:"";
  width:5px; height:5px;
  background:var(--tan);
  transform:rotate(45deg);
  flex:0 0 5px;
}

/* the mantel: three frames on a shared baseline */
.mantel{
  position:relative;
  z-index:2;
  width:var(--wrap-wide);
  margin:clamp(2.25rem, 5vw, 4rem) auto 0;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.32fr) minmax(0,1fr);
  align-items:end;
  gap:clamp(.6rem, 1.4vw, 1.15rem);
  flex:1 1 auto;
  min-height:0;
}
.mantel__frame{
  position:relative;
  overflow:hidden;
  background:var(--ink-3);
  box-shadow:0 26px 60px rgba(0,0,0,.5);
}
.mantel__frame img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.mantel__frame--a{ aspect-ratio:4/5; }
.mantel__frame--b{ aspect-ratio:1/1; }
.mantel__frame--c{ aspect-ratio:4/5; }
.mantel__tag{
  position:absolute;
  left:0; bottom:0;
  max-width:100%;
  background:rgba(20,16,12,.86);
  color:var(--text-light);
  font-size:.66rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  padding:.6rem .95rem;
  border-top:1px solid rgba(197,172,142,.3);
}

/* --- heritage ---------------------------------------------------------- */
.heritage__grid{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);
  gap:clamp(2rem, 5vw, 4.5rem);
  align-items:start;
}
.heritage__portrait{
  position:relative;
  border:1px solid rgba(117,89,59,.28);
  padding:.7rem;
  background:var(--white);
}
.heritage__portrait img{ width:100%; aspect-ratio:1/1; object-fit:cover; }
.heritage__caption{
  margin-top:.85rem;
  font-size:.73rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--text-muted);
  text-align:center;
}
.facts{
  list-style:none;
  margin:2.1rem 0 0;
  padding:0;
  display:grid;
  gap:0;
  border-top:1px solid rgba(117,89,59,.22);
}
.facts li{
  padding:.95rem 0;
  border-bottom:1px solid rgba(117,89,59,.22);
  display:flex;
  align-items:baseline;
  gap:1rem;
  font-size:.98rem;
}
.facts b{
  font-family:var(--font-display);
  font-size:1.02rem;
  font-weight:500;
  color:var(--text-dark);
  flex:0 0 auto;
}
.facts span{ color:var(--text-muted); }

/* --- signature: the index (room by room) ------------------------------- */
.index__head{ margin-bottom:clamp(2rem, 4vw, 3rem); max-width:60ch; }
.index__grid{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(0,1.35fr);
  gap:clamp(1.5rem, 4vw, 3.5rem);
  align-items:start;
}
.index__list{ list-style:none; margin:0; padding:0; border-top:1px solid rgba(197,172,142,.22); }
.index__btn{
  display:flex;
  align-items:baseline;
  gap:1rem;
  width:100%;
  text-align:left;
  background:none;
  border:0;
  border-bottom:1px solid rgba(197,172,142,.22);
  padding:1.05rem .4rem;
  min-height:48px;
  cursor:pointer;
  font-family:var(--font-display);
  font-size:clamp(1.15rem, 1rem + .55vw, 1.6rem);
  line-height:1.25;
  color:rgba(243,239,231,.72);
  transition:color .35s var(--ease), padding-left .35s var(--ease), background .35s var(--ease);
}
.index__btn:hover{ color:var(--text-light); padding-left:.9rem; }
.index__btn .num{
  font-family:var(--font-body);
  font-size:.7rem;
  letter-spacing:.16em;
  color:var(--tan);
  flex:0 0 2.1rem;
}
.index__btn[aria-selected="true"]{
  color:var(--text-light);
  padding-left:.9rem;
  background:linear-gradient(90deg, rgba(197,172,142,.14), transparent 70%);
}
.index__panel{
  position:relative;
  min-height:0;
}
.index__figure{
  position:relative;
  overflow:hidden;
  background:var(--ink-3);
  aspect-ratio:1200/799;
  box-shadow:0 24px 55px rgba(0,0,0,.45);
}
.index__figure img{
  position:absolute;
  inset:0;
  width:100%; height:100%;
  object-fit:cover;
  opacity:0;
  transition:opacity .55s var(--ease);
}
.index__figure img.is-active{ opacity:1; }
.index__copy{
  margin-top:1.5rem;
  max-width:56ch;
}
.index__copy h3{
  font-size:clamp(1.35rem, 1.1rem + .8vw, 1.85rem);
  margin-bottom:.7rem;
}
.index__more{
  margin-top:clamp(2rem, 4vw, 3rem);
  padding-top:1.6rem;
  border-top:1px solid rgba(197,172,142,.22);
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);
  gap:clamp(1rem, 3vw, 2.5rem);
  align-items:start;
}
.index__more h4{
  font-size:1.25rem;
  color:var(--text-light);
}

/* --- plate ------------------------------------------------------------- */
.plate{
  padding:0;
  position:relative;
  height:clamp(320px, 58vh, 620px);
  overflow:hidden;
  background:var(--ink);
}
.plate img{
  width:100%;
  height:120%;
  object-fit:cover;
  position:absolute;
  inset:auto 0 auto 0;
  top:-10%;
}
.plate__caption{
  position:absolute;
  left:0; bottom:0;
  max-width:100%;
  background:rgba(20,16,12,.84);
  color:var(--text-light);
  padding:.85rem 1.35rem;
  font-size:.72rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  border-top:1px solid rgba(197,172,142,.3);
}

/* --- process ----------------------------------------------------------- */
.steps{
  display:grid;
  gap:0;
  margin-top:clamp(2rem, 4vw, 3rem);
  border-top:1px solid rgba(117,89,59,.24);
}
.step{
  display:grid;
  grid-template-columns:minmax(0,.16fr) minmax(0,.42fr) minmax(0,1fr);
  gap:clamp(1rem, 3vw, 2.5rem);
  padding:clamp(1.4rem, 3vw, 2.2rem) 0;
  border-bottom:1px solid rgba(117,89,59,.24);
  align-items:start;
}
.step__num{
  font-family:var(--font-display);
  font-size:clamp(1.5rem, 1.2rem + 1vw, 2.2rem);
  color:var(--tan-deep);
  line-height:1;
}
.step h3{ font-size:clamp(1.25rem, 1.05rem + .6vw, 1.65rem); }
.step p{ color:var(--text-body); }

/* --- work grid --------------------------------------------------------- */
.work__head{
  display:flex;
  flex-wrap:wrap;
  align-items:flex-end;
  justify-content:space-between;
  gap:1.5rem;
  margin-bottom:clamp(1.75rem, 3.5vw, 2.75rem);
}
.work__grid{
  display:grid;
  grid-template-columns:repeat(6, minmax(0,1fr));
  gap:clamp(.6rem, 1.3vw, 1.05rem);
}
.tile{
  position:relative;
  overflow:hidden;
  background:var(--ink-3);
  grid-column:span 2;
  aspect-ratio:1200/799;
}
.tile img{
  width:100%; height:100%;
  object-fit:cover;
  transition:transform 1.1s var(--ease);
}
.tile:hover img{ transform:scale(1.045); }
.tile--wide{ grid-column:span 3; }
.tile--tall{ grid-column:span 3; aspect-ratio:16/11; }
.tile__label{
  position:absolute;
  left:0; bottom:0;
  max-width:100%;
  background:rgba(20,16,12,.82);
  color:var(--text-light);
  font-size:.65rem;
  letter-spacing:.17em;
  text-transform:uppercase;
  padding:.5rem .85rem;
}

/* --- testimonials ------------------------------------------------------ */
.quotes{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(min(100%, 440px), 1fr));
  gap:clamp(1.5rem, 3vw, 2.5rem);
  margin-top:clamp(2rem, 4vw, 3rem);
}
.quote{
  background:var(--white);
  border:1px solid rgba(117,89,59,.2);
  padding:clamp(1.5rem, 3vw, 2.25rem);
  position:relative;
}
.quote::before{
  content:"";
  position:absolute;
  top:0; left:0;
  width:56px; height:3px;
  background:var(--tan-deep);
}
.quote blockquote{
  margin:0 0 1.35rem;
  font-family:var(--font-display);
  font-size:clamp(1.06rem, 1rem + .35vw, 1.24rem);
  line-height:1.58;
  color:var(--text-dark);
}
.quote cite{
  font-style:normal;
  font-size:.78rem;
  letter-spacing:.13em;
  text-transform:uppercase;
  color:var(--text-muted);
  display:block;
}

/* --- team -------------------------------------------------------------- */
.team__grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(min(100%, 240px), 1fr));
  gap:clamp(1.5rem, 3vw, 2.4rem);
  margin-top:clamp(2rem, 4vw, 3rem);
}
.member img{
  width:100%;
  aspect-ratio:1/1;
  object-fit:cover;
  filter:saturate(.92);
}
.member h3{
  font-size:1.3rem;
  margin:1.1rem 0 .25rem;
}
.member .role{
  font-size:.72rem;
  letter-spacing:.17em;
  text-transform:uppercase;
  color:var(--tan-deep);
  margin-bottom:.75rem;
}
.member p{ font-size:.95rem; color:var(--text-body); }

/* --- giving ------------------------------------------------------------ */
.giving__grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(min(100%, 260px), 1fr));
  gap:clamp(1.5rem, 3vw, 2.5rem);
  margin-top:clamp(2rem, 4vw, 3rem);
}
.cause{
  border-top:2px solid var(--tan);
  padding-top:1.25rem;
}
.cause h3{ font-size:1.3rem; margin-bottom:.6rem; }
.cause p{ color:var(--text-light-muted); font-size:.97rem; }
.cause a{
  color:var(--tan);
  text-decoration:none;
  border-bottom:1px solid rgba(197,172,142,.45);
  display:inline-block;
  padding-block:.35rem;
}
.cause a:hover{ color:var(--tan-soft); }

/* --- visit / CTA ------------------------------------------------------- */
.visit{
  background:var(--ink-2);
  color:var(--text-light-muted);
  position:relative;
  overflow:hidden;
}
.visit::before{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(90% 120% at 85% 10%, rgba(197,172,142,.13), transparent 60%);
  pointer-events:none;
}
.visit__inner{ position:relative; z-index:2; }
.visit h2{ color:var(--text-light); max-width:18ch; }
.visit__details{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(min(100%, 220px), 1fr));
  gap:clamp(1.25rem, 3vw, 2.5rem);
  margin-top:clamp(2rem, 4vw, 3rem);
  padding-top:1.75rem;
  border-top:1px solid rgba(197,172,142,.24);
}
.visit__details dt{
  font-size:.7rem;
  letter-spacing:.19em;
  text-transform:uppercase;
  color:var(--tan);
  margin-bottom:.5rem;
}
.visit__details dd{
  margin:0;
  font-family:var(--font-display);
  font-size:1.16rem;
  color:var(--text-light);
  line-height:1.42;
}
.visit__details dd a{
  color:var(--text-light);
  text-decoration:none;
  border-bottom:1px solid rgba(197,172,142,.4);
  display:inline-block;
  padding-block:.3rem;
}
.visit__details dd a:hover{ color:var(--tan); }

/* --- dealers ----------------------------------------------------------- */
.dealers{
  padding-block:clamp(2rem, 4vw, 3rem);
  border-bottom:1px solid rgba(197,172,142,.16);
}
.dealers__label{
  font-size:.7rem;
  letter-spacing:.19em;
  text-transform:uppercase;
  color:var(--tan);
  margin-bottom:1.5rem;
}
.dealers__row{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:clamp(1.5rem, 5vw, 3.5rem);
}
.dealers__row img{
  width:auto;
  height:34px;
  max-width:170px;
  object-fit:contain;
  opacity:.8;
  transition:opacity .35s var(--ease);
}
.dealers__row a:hover img{ opacity:1; }

/* --- footer ------------------------------------------------------------ */
.footer{
  background:var(--ink);
  color:var(--text-light-muted);
  padding-block:clamp(2.5rem, 5vw, 4rem) clamp(1.75rem, 3vw, 2.5rem);
}
.footer__top{
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr) minmax(0,.8fr);
  gap:clamp(1.75rem, 4vw, 3.5rem);
  padding-top:clamp(2rem, 4vw, 3rem);
}
.footer__logo img{
  width:auto;
  height:52px;
  max-width:190px;
  object-fit:contain;
  margin-bottom:1.25rem;
}
.footer p{ font-size:.95rem; }
.footer h4{
  color:var(--text-light);
  font-size:1.08rem;
  margin-bottom:1rem;
}
.footer__links{ list-style:none; margin:0; padding:0; }
.footer__links a{
  text-decoration:none;
  color:var(--text-light-muted);
  display:inline-block;
  padding-block:.65rem;
  font-size:.95rem;
  transition:color .3s var(--ease);
}
.footer__links a:hover{ color:var(--tan); }
.footer__social{
  display:flex;
  flex-wrap:wrap;
  gap:.6rem;
  margin-top:1.25rem;
}
.footer__social a{
  min-height:44px;
  padding:.7rem 1.05rem;
  border:1px solid rgba(197,172,142,.3);
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  color:var(--text-light-muted);
  text-decoration:none;
  font-size:.73rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  transition:color .3s var(--ease), border-color .3s var(--ease);
}
.footer__social a:hover{ color:var(--tan); border-color:var(--tan); }
.footer__bottom{
  margin-top:clamp(2rem, 4vw, 3rem);
  padding-top:1.5rem;
  border-top:1px solid rgba(197,172,142,.16);
  display:flex;
  flex-wrap:wrap;
  gap:.75rem 1.5rem;
  justify-content:space-between;
  font-size:.83rem;
  color:rgba(243,239,231,.72);
}

/* --- 404 --------------------------------------------------------------- */
.error{
  min-height:100vh;
  min-height:100svh;
  background:var(--ink);
  display:flex;
  align-items:center;
  padding-block:calc(var(--nav-h) + 3rem) 4rem;
}
.error__code{
  font-family:var(--font-display);
  font-size:clamp(5rem, 18vw, 12rem);
  line-height:.9;
  color:rgba(197,172,142,.24);
  margin-bottom:1rem;
}
.error h1{ color:var(--text-light); margin-bottom:1.15rem; }
.error p{ color:var(--text-light-muted); max-width:50ch; margin-bottom:2rem; }

/* --- motion ------------------------------------------------------------ */
.reveal{ opacity:1; }
html.js .reveal{ opacity:0; transform:translateY(22px); }

@media (prefers-reduced-motion: reduce){
  html.js .reveal{ opacity:1 !important; transform:none !important; }
  *{ animation-duration:.001ms !important; transition-duration:.001ms !important; }
}

/* ==========================================================================
   Responsive. Written alongside the desktop rules, not bolted on after.
   ========================================================================== */

@media (max-width:1024px){
  .hero__head{ grid-template-columns:minmax(0,1fr); gap:2rem; }
  .hero__aside{
    border-left:0;
    border-top:1px solid rgba(197,172,142,.3);
    padding-left:0;
    padding-top:1.5rem;
    max-width:56ch;
  }
  .heritage__grid{ grid-template-columns:minmax(0,1fr); gap:2.25rem; }
  .heritage__portrait{ max-width:420px; }
  .index__grid{ grid-template-columns:minmax(0,1fr); }
  .index__more{ grid-template-columns:minmax(0,1fr); }
  .footer__top{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
  .step{ grid-template-columns:minmax(0,.14fr) minmax(0,1fr); }
  .step p{ grid-column:2; }
}

@media (max-width:900px){
  .nav__links{ display:none; }
  .nav__burger{ display:block; }
  .nav{ background:rgba(20,16,12,.94); }
  .work__grid{ grid-template-columns:repeat(4, minmax(0,1fr)); }
  .tile--wide,.tile--tall{ grid-column:span 4; }
  .tile{ grid-column:span 2; }
}

@media (max-width:768px){
  :root{ --nav-h:66px; }

  .hero{
    min-height:0;
    height:auto;
    padding-top:calc(var(--nav-h) + 2.25rem);
    padding-bottom:2.5rem;
  }
  .hero__head{ max-width:100%; }
  .hero__sub{ margin-bottom:1.5rem; }
  .hero__meta{ margin-top:1.6rem; gap:.5rem 1.25rem; }

  .mantel{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    align-items:stretch;
  }
  .mantel__frame--a{ grid-column:1 / -1; aspect-ratio:16/10; }
  .mantel__frame--b,.mantel__frame--c{ aspect-ratio:3/4; }

  .work__grid{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .tile,.tile--wide,.tile--tall{ grid-column:span 1; aspect-ratio:1200/799; }

  .footer__top{ grid-template-columns:minmax(0,1fr); }
  .visit h2{ max-width:100%; }
  .plate{ height:clamp(260px, 45vh, 400px); }
}

@media (max-width:560px){
  .index__btn{ font-size:1.12rem; padding-block:.95rem; }
  .index__btn .num{ flex:0 0 1.8rem; }
  .facts li{ flex-direction:column; gap:.2rem; }
  .quotes{ grid-template-columns:minmax(0,1fr); }
  .dealers__row{ gap:1.5rem 2rem; }
  .dealers__row img{ height:28px; max-width:135px; }
  .btn{ padding:.9rem 1.3rem; font-size:.78rem; }
  .footer__bottom{ flex-direction:column; }

  /* keep the footer from running past ~1.6 viewports on small phones */
  .footer{ padding-block:2rem 1.5rem; }
  .footer__top{ padding-top:1.75rem; gap:1.5rem; }
  .footer__logo img{ height:44px; margin-bottom:.9rem; }
  .footer__links a{ padding-block:.65rem; }
  .footer__bottom{ margin-top:1.35rem; padding-top:1.1rem; }
  .footer p{ font-size:.9rem; }
  .footer__social{ margin-top:1rem; }
  .dealers{ padding-block:1.4rem 1.6rem; }
  .dealers__label{ margin-bottom:.9rem; }
  .dealers__row{ gap:1.1rem 1.75rem; }
}

@media (max-width:400px){
  .mantel{ grid-template-columns:minmax(0,1fr); }
  .mantel__frame--b,.mantel__frame--c{ aspect-ratio:16/10; }
  .mantel__frame--c{ display:none; }
}