/* =====================================================================
   Marysville Wallpaper Installation — styles.css
   Palette: warm ivory / cream base · espresso + charcoal depth · brass accent
   Type: EB Garamond (display) + Inter (body/UI)
   All colour pairs verified against WCAG 2 AA before build.
   ===================================================================== */

/* ------------------------------------------------------------ tokens */
:root {
  /* surfaces */
  --ivory:#F4EFE6; --paper:#FBF7EF; --cream:#FDFBF6; --taupe:#E9E1D2; --stone:#DBD1BE;
  /* dark */
  --espresso:#2B2119; --espresso-2:#3A2D22; --charcoal:#201812;
  /* text on light */
  --head:#241C13; --body:#4A3F30; --muted:#6C5E48; --muted-deep:#574A37;
  /* text on dark */
  --on-dark:#F1EADC; --on-dark-muted:#C3B49A;
  /* brass */
  --brass-ink:#7C5C27;   /* brass text/links/numerals on light (AA) */
  --brass-deco:#8A6C34;  /* meaningful brass graphics on light (>=3:1) */
  --brass-dark:#CBAE78;  /* brass on dark (AA) */
  --brass-glow:#C7A768;  /* decorative brass on dark only */
  /* lines / controls / states */
  --line:#D8CDB9; --card-border:#E4DAC8; --control-border:#877655;
  --btn-text:#FBF7EF; --error:#A6382C; --focus:#7C5C27;
  /* shape / depth */
  --radius:14px; --radius-sm:10px; --radius-lg:22px;
  --shadow-sm:0 4px 18px -12px rgba(43,33,25,.40);
  --shadow-md:0 20px 44px -26px rgba(43,33,25,.44);
  --shadow-lg:0 34px 70px -34px rgba(32,24,18,.55);
  --container:1180px; --gutter:clamp(18px,5vw,44px);
  /* type */
  --font-serif:'EB Garamond', Georgia,'Times New Roman',serif;
  --font-sans:'Inter', system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
}

/* ------------------------------------------------------------ reset */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
@media (prefers-reduced-motion: no-preference){ html{ scroll-behavior:smooth; } }
body{
  margin:0; background:var(--ivory); color:var(--body);
  font-family:var(--font-sans); font-size:clamp(16px,.55vw + 15px,17px);
  line-height:1.68; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img,svg,iframe{ max-width:100%; display:block; }
img{ height:auto; }
a{ color:var(--brass-ink); text-decoration:none; }
h1,h2,h3,h4{ font-family:var(--font-serif); color:var(--head); line-height:1.12; margin:0; font-weight:600; letter-spacing:.005em; }
p{ margin:0 0 1em; }
ul,ol{ margin:0; padding:0; }
button{ font-family:inherit; }
:focus-visible{ outline:2px solid var(--focus); outline-offset:3px; border-radius:4px; }
section{ scroll-margin-top:88px; }

/* ------------------------------------------------------------ utilities */
.container{ width:100%; max-width:var(--container); margin-inline:auto; padding-inline:var(--gutter); }
.skip-link{
  position:absolute; left:12px; top:-60px; z-index:3000; background:var(--espresso); color:var(--on-dark);
  padding:10px 16px; border-radius:8px; font-size:.9rem; transition:top .2s;
}
.skip-link:focus{ top:12px; }

.eyebrow{
  font-family:var(--font-sans); font-size:.74rem; font-weight:600; letter-spacing:.22em;
  text-transform:uppercase; color:var(--brass-ink); margin:0 0 14px; display:flex; align-items:center; gap:12px;
}
.eyebrow::before{ content:""; width:26px; height:1px; background:var(--brass-deco); display:inline-block; }
.eyebrow--light{ color:var(--brass-dark); }
.eyebrow--light::before{ background:var(--brass-dark); }

/* buttons */
.btn{
  --btn-bg:var(--espresso); --btn-fg:var(--btn-text);
  display:inline-flex; align-items:center; justify-content:center; gap:.5em;
  font-family:var(--font-sans); font-weight:600; font-size:.94rem; letter-spacing:.02em;
  padding:15px 30px; border-radius:var(--radius-sm); border:1.5px solid transparent;
  background:var(--btn-bg); color:var(--btn-fg); cursor:pointer;
  transition:background .25s ease, transform .25s ease, box-shadow .25s ease, color .25s ease, border-color .25s ease;
  will-change:transform;
}
.btn--primary:hover{ background:var(--espresso-2); transform:translateY(-2px); box-shadow:var(--shadow-md); }
.btn--ghost{ background:transparent; color:var(--on-dark); border-color:rgba(241,234,220,.55); }
.btn--ghost:hover{ background:rgba(241,234,220,.12); border-color:var(--on-dark); transform:translateY(-2px); }
.btn--outline{ background:transparent; color:var(--brass-ink); border-color:var(--control-border); }
.btn--outline:hover{ background:var(--espresso); color:var(--on-dark); border-color:var(--espresso); transform:translateY(-2px); }
.btn--gold{ background:var(--brass-dark); color:var(--charcoal); }
.btn--gold:hover{ background:#D9BE8C; transform:translateY(-2px); box-shadow:var(--shadow-md); }

/* ------------------------------------------------------------ header */
.site-header{
  position:sticky; top:0; z-index:1600;
  background:rgba(250,247,240,.88); backdrop-filter:saturate(120%) blur(10px);
  -webkit-backdrop-filter:saturate(120%) blur(10px);
  border-bottom:1px solid var(--line);
}
.header-inner{ display:flex; align-items:center; justify-content:space-between; gap:18px; min-height:72px; }
.brand{ display:inline-flex; align-items:center; gap:12px; color:var(--head); }
.brand-mark{ border-radius:10px; flex:none; box-shadow:var(--shadow-sm); }
.brand-text{ display:flex; flex-direction:column; line-height:1.05; }
.brand-name{ font-family:var(--font-serif); font-size:1.26rem; font-weight:600; color:var(--head); letter-spacing:.01em; }
.brand-sub{ font-family:var(--font-sans); font-size:.62rem; font-weight:600; letter-spacing:.22em; text-transform:uppercase; color:var(--muted); margin-top:2px; }

.nav-desktop{ display:none; gap:30px; }
.nav-desktop a{
  font-family:var(--font-sans); font-size:.92rem; font-weight:500; color:var(--body); position:relative; padding:6px 0;
}
.nav-desktop a::after{ content:""; position:absolute; left:0; bottom:-2px; width:0; height:1.5px; background:var(--brass-deco); transition:width .28s ease; }
.nav-desktop a:hover{ color:var(--head); }
.nav-desktop a:hover::after{ width:100%; }

.header-actions{ display:flex; align-items:center; gap:14px; }
.header-tel{ display:none; align-items:center; gap:8px; font-family:var(--font-sans); font-weight:600; font-size:.92rem; color:var(--head); }
.header-tel svg{ color:var(--brass-ink); }
.header-tel:hover{ color:var(--brass-ink); }

.nav-burger{
  display:inline-flex; align-items:center; justify-content:center; width:46px; height:46px;
  border:1px solid var(--line); border-radius:10px; background:var(--cream); cursor:pointer;
}
.nav-burger__bars, .nav-burger__bars::before, .nav-burger__bars::after{
  content:""; display:block; width:20px; height:2px; background:var(--head); border-radius:2px; position:relative;
  transition:transform .28s ease, opacity .2s ease;
}
.nav-burger__bars::before{ position:absolute; top:-6px; }
.nav-burger__bars::after{ position:absolute; top:6px; }

/* checkbox toggle (visually hidden, keyboard-operable) */
.nav-toggle{ position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); border:0; }
.nav-toggle:focus-visible ~ .site-header .nav-burger{ outline:2px solid var(--focus); outline-offset:3px; }
/* burger morphs into an X when open */
.nav-toggle:checked ~ .site-header .nav-burger__bars{ background:transparent; }
.nav-toggle:checked ~ .site-header .nav-burger__bars::before{ top:0; transform:rotate(45deg); }
.nav-toggle:checked ~ .site-header .nav-burger__bars::after{ top:0; transform:rotate(-45deg); }

/* ------------------------------------------------------------ mobile menu (checkbox) */
.mobile-menu{
  position:fixed; inset:0; z-index:1500; visibility:hidden; opacity:0;
  transition:opacity .3s ease, visibility 0s linear .3s;
}
.nav-toggle:checked ~ .mobile-menu{ visibility:visible; opacity:1; transition:opacity .3s ease; }
.mobile-menu__backdrop{ position:absolute; inset:0; background:rgba(20,16,12,.55); cursor:pointer; border:0; }
.mobile-menu__panel{
  position:absolute; top:0; right:0; height:100%; width:min(86vw,360px);
  background:var(--cream); box-shadow:var(--shadow-lg); padding:82px 30px 34px;
  display:flex; flex-direction:column; gap:4px; transform:translateX(102%); transition:transform .34s cubic-bezier(.22,.61,.36,1);
  overflow-y:auto;
}
.nav-toggle:checked ~ .mobile-menu .mobile-menu__panel{ transform:translateX(0); }
.mobile-menu__panel a{ font-family:var(--font-serif); font-size:1.32rem; color:var(--head); padding:11px 0; border-bottom:1px solid var(--line); }
.mobile-menu__panel a:hover{ color:var(--brass-ink); }
.mobile-menu__close{
  position:absolute; top:18px; right:20px; width:42px; height:42px; border:1px solid var(--line);
  border-radius:10px; display:flex; align-items:center; justify-content:center; font-size:1.8rem;
  line-height:1; color:var(--head); font-family:var(--font-sans); cursor:pointer;
}
.mobile-menu__close:hover{ background:var(--paper); }
.mobile-menu__cta{ margin-top:18px; border-bottom:none !important; color:var(--btn-text) !important; font-family:var(--font-sans) !important; font-size:.94rem !important; }
.mobile-menu__tel{ border-bottom:none !important; font-family:var(--font-sans) !important; font-size:1rem !important; color:var(--brass-ink) !important; margin-top:6px; }

/* ------------------------------------------------------------ hero */
.hero{ position:relative; display:flex; align-items:flex-end; min-height:clamp(560px,86vh,840px); overflow:hidden; isolation:isolate; }
.hero__media{ position:absolute; inset:0; z-index:-2; }
.hero__media img{ width:100%; height:100%; object-fit:cover; object-position:60% center; }
.hero__scrim{
  position:absolute; inset:0; z-index:-1;
  background:
    linear-gradient(180deg, rgba(20,16,12,.30) 0%, rgba(20,16,12,0) 34%),
    linear-gradient(90deg, rgba(20,16,12,.82) 0%, rgba(20,16,12,.55) 38%, rgba(20,16,12,.12) 74%, rgba(20,16,12,.30) 100%),
    linear-gradient(0deg, rgba(20,16,12,.55) 0%, rgba(20,16,12,0) 40%);
}
.hero__inner{ padding-block:clamp(56px,10vh,120px); max-width:820px; }
.hero__eyebrow{
  font-family:var(--font-sans); font-size:.76rem; font-weight:600; letter-spacing:.2em; text-transform:uppercase;
  color:var(--brass-dark); margin:0 0 20px; display:flex; align-items:center; gap:12px;
}
.hero__eyebrow::before{ content:""; width:30px; height:1px; background:var(--brass-dark); }
.hero__title{
  color:#FCF8F1; font-size:clamp(2.35rem,5.4vw,4.15rem); font-weight:600; line-height:1.05;
  letter-spacing:.004em; margin:0 0 22px; max-width:15ch; text-shadow:0 2px 30px rgba(20,16,12,.4);
}
.hero__lead{
  color:#EFE7DA; font-size:clamp(1.05rem,1.4vw,1.24rem); line-height:1.6; max-width:58ch; margin:0 0 32px;
  text-shadow:0 1px 18px rgba(20,16,12,.5);
}
.hero__actions{ display:flex; flex-wrap:wrap; gap:14px; }

/* ------------------------------------------------------------ trust strip */
.trust{ background:var(--espresso); color:var(--on-dark); }
.trust__grid{ display:grid; grid-template-columns:1fr; gap:30px 40px; padding-block:clamp(38px,6vw,58px); }
.trust__item{ text-align:left; }
.trust__icon{ width:30px; height:30px; color:var(--brass-glow); margin-bottom:12px; }
.trust__h{ color:var(--on-dark); font-family:var(--font-serif); font-size:1.22rem; font-weight:600; margin:0 0 6px; }
.trust__item p{ color:var(--on-dark-muted); font-family:var(--font-sans); font-size:.95rem; margin:0; }

/* ------------------------------------------------------------ section base */
.section{ padding-block:clamp(64px,9vw,110px); }
.section__head{ max-width:720px; margin-bottom:clamp(36px,5vw,56px); }
.section__head--tight{ text-align:center; margin-inline:auto; }
.section__head--tight .eyebrow{ justify-content:center; }
.section__title{ font-size:clamp(1.9rem,3.4vw,2.9rem); margin-bottom:16px; letter-spacing:.004em; }
.section__title--light{ color:var(--on-dark); }
.section__intro{ font-size:clamp(1.02rem,1.2vw,1.14rem); color:var(--muted-deep); margin:0; }

/* ------------------------------------------------------------ services cards */
.cards{ display:grid; grid-template-columns:1fr; gap:22px; }
.card{
  position:relative; background:var(--paper); border:1px solid var(--card-border); border-radius:var(--radius);
  padding:34px 30px 30px; overflow:hidden; transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.card::before{ content:""; position:absolute; left:0; top:0; height:3px; width:0; background:var(--brass-deco); transition:width .4s ease; }
.card:hover{ transform:translateY(-5px); box-shadow:var(--shadow-md); border-color:var(--stone); }
.card:hover::before{ width:100%; }
.card__index{ font-family:var(--font-serif); font-size:1.05rem; font-weight:600; color:var(--brass-ink); letter-spacing:.08em; }
.card__icon{ width:34px; height:34px; color:var(--espresso); margin:14px 0 16px; }
.card__title{ font-size:1.36rem; margin-bottom:10px; }
.card__text{ color:var(--muted-deep); font-size:.98rem; margin:0; }

/* ------------------------------------------------------------ why band */
.why{ background:var(--charcoal); color:var(--on-dark); position:relative; }
.why::after{ content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(120% 80% at 85% 0%, rgba(199,167,104,.10), transparent 60%); }
.why__grid{ position:relative; display:grid; grid-template-columns:1fr; gap:36px; align-items:start; }
.why__lead{ color:var(--on-dark-muted); font-size:1.06rem; margin:0; }
.why__list{ list-style:none; display:grid; grid-template-columns:1fr; gap:2px 30px; }
.why__list li{
  display:flex; align-items:flex-start; gap:14px; padding:14px 0; border-bottom:1px solid rgba(199,167,104,.16);
  font-family:var(--font-serif); font-size:1.2rem; color:var(--on-dark);
}
.why__tick{
  flex:none; width:26px; height:26px; border-radius:50%; background:rgba(199,167,104,.15);
  color:var(--brass-dark); display:flex; align-items:center; justify-content:center; font-size:.85rem; margin-top:3px;
  font-family:var(--font-sans);
}

/* ------------------------------------------------------------ process */
.steps{ list-style:none; display:grid; grid-template-columns:1fr; gap:26px; counter-reset:none; }
.step{ position:relative; padding:28px 26px; background:var(--paper); border:1px solid var(--card-border); border-radius:var(--radius); }
.step__num{ font-family:var(--font-serif); font-size:2.6rem; font-weight:600; color:var(--brass-ink); line-height:1; display:block; margin-bottom:10px; }
.step__title{ font-size:1.3rem; margin-bottom:8px; }
.step__text{ color:var(--muted-deep); font-size:.97rem; margin:0; }

/* ------------------------------------------------------------ gallery */
.gallery__grid{ display:grid; grid-template-columns:1fr; gap:18px; }
.gallery__item{ margin:0; }
.gallery__link{ position:relative; display:block; border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-sm); }
.gallery__link img{ width:100%; aspect-ratio:4/5; object-fit:cover; transition:transform .55s cubic-bezier(.2,.6,.3,1); }
.gallery__link::after{ content:""; position:absolute; inset:0; background:linear-gradient(0deg, rgba(20,16,12,.72) 0%, rgba(20,16,12,0) 46%); opacity:.85; transition:opacity .35s ease; }
.gallery__link:hover img, .gallery__link:focus-visible img{ transform:scale(1.055); }
.gallery__cap{
  position:absolute; left:0; bottom:0; z-index:1; padding:20px 22px; color:#FBF7EF;
  font-family:var(--font-sans); font-size:.9rem; letter-spacing:.01em;
}
.gallery__cap span{ display:block; font-family:var(--font-serif); font-size:1.28rem; color:#FCF8F1; margin-bottom:2px; }

/* lightbox (:target) */
.lightbox{ position:fixed; inset:0; z-index:2500; visibility:hidden; opacity:0; transition:opacity .3s ease, visibility 0s linear .3s; }
.lightbox:target{ visibility:visible; opacity:1; transition:opacity .3s ease; }
.lightbox__backdrop{ position:absolute; inset:0; background:rgba(16,12,9,.86); }
.lightbox__inner{
  position:absolute; inset:0; margin:auto; width:min(92vw,1000px); height:max-content; max-height:92vh;
  display:flex; flex-direction:column; align-items:center; justify-content:center; padding:20px;
}
.lightbox__inner img{ max-width:100%; max-height:78vh; border-radius:10px; box-shadow:var(--shadow-lg); object-fit:contain; }
.lightbox__close{
  position:absolute; top:6px; right:10px; width:44px; height:44px; border-radius:50%;
  background:rgba(250,247,240,.12); color:#FBF7EF; display:flex; align-items:center; justify-content:center;
  font-size:1.7rem; line-height:1; border:1px solid rgba(250,247,240,.3);
}
.lightbox__close:hover{ background:rgba(250,247,240,.24); }
.lightbox__bar{ display:flex; flex-wrap:wrap; gap:8px 22px; align-items:center; justify-content:space-between; width:100%; max-width:820px; margin-top:16px; color:#EFE7DA; font-family:var(--font-sans); font-size:.92rem; }
.lightbox__bar p{ margin:0; }
.lightbox__nav{ display:flex; gap:18px; }
.lightbox__nav a{ color:var(--brass-dark); font-weight:600; }
.lightbox__nav a:hover{ color:#E4CE9E; }

/* ------------------------------------------------------------ about */
.about{ background:var(--taupe); }
.about__grid{ display:grid; grid-template-columns:1fr; gap:34px; align-items:center; }
.about__badge{
  width:clamp(150px,42vw,210px); aspect-ratio:1; border-radius:50%; background:var(--espresso); color:var(--on-dark);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; margin:0 auto;
  border:1px solid rgba(199,167,104,.4); box-shadow:var(--shadow-md); position:relative;
}
.about__badge::before{ content:""; position:absolute; inset:12px; border-radius:50%; border:1px dashed rgba(199,167,104,.45); }
.about__initials{ font-family:var(--font-serif); font-size:clamp(2.6rem,9vw,3.6rem); font-weight:600; color:var(--brass-glow); line-height:1; }
.about__role{ font-family:var(--font-sans); font-size:.68rem; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--on-dark-muted); }
.about__body p{ color:var(--muted-deep); font-size:1.06rem; }
.about__body .btn{ margin-top:12px; }

/* ------------------------------------------------------------ cta band */
.cta{ background:var(--espresso); color:var(--on-dark); position:relative; overflow:hidden; }
.cta::before{ content:""; position:absolute; inset:0; background:radial-gradient(90% 120% at 100% 0%, rgba(199,167,104,.12), transparent 55%); }
.cta__inner{ position:relative; text-align:center; max-width:760px; margin-inline:auto; padding-block:clamp(58px,8vw,92px); }
.cta__title{ color:#FCF8F1; font-size:clamp(2rem,4vw,3.1rem); margin-bottom:16px; }
.cta__text{ color:var(--on-dark-muted); font-size:1.1rem; margin:0 auto 30px; max-width:52ch; }
.cta__actions{ display:flex; flex-wrap:wrap; gap:16px 26px; align-items:center; justify-content:center; }
.cta__tel{ font-family:var(--font-serif); font-size:1.5rem; color:var(--brass-dark); font-weight:600; }
.cta__tel:hover{ color:#E4CE9E; }

/* ------------------------------------------------------------ contact + form */
.contact__grid{ display:grid; grid-template-columns:1fr; gap:38px; align-items:start; }
.contact__intro{ color:var(--muted-deep); max-width:44ch; }
.contact__list{ list-style:none; display:flex; flex-direction:column; gap:2px; margin-top:26px; }
.contact__list li{ display:flex; flex-direction:column; gap:2px; padding:14px 0; border-top:1px solid var(--line); }
.contact__label{ font-family:var(--font-sans); font-size:.72rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); }
.contact__value{ font-size:1.04rem; color:var(--head); word-break:break-word; }
a.contact__value:hover{ color:var(--brass-ink); }

.contact__form-wrap{ background:var(--paper); border:1px solid var(--card-border); border-radius:var(--radius-lg); padding:clamp(24px,4vw,40px); box-shadow:var(--shadow-md); }
.form__row{ margin-bottom:18px; }
.form label{ display:block; font-family:var(--font-sans); font-size:.86rem; font-weight:600; color:var(--head); margin-bottom:7px; letter-spacing:.01em; }
.req{ color:var(--brass-ink); }
.form input, .form textarea{
  width:100%; font-family:var(--font-sans); font-size:1rem; color:var(--head); background:var(--cream);
  border:1.5px solid var(--control-border); border-radius:var(--radius-sm); padding:13px 15px; transition:border-color .2s ease, box-shadow .2s ease;
}
.form input::placeholder, .form textarea::placeholder{ color:#9A8D77; }
.form input:focus, .form textarea:focus{ outline:none; border-color:var(--brass-ink); box-shadow:0 0 0 3px rgba(124,92,39,.16); }
.form textarea{ resize:vertical; min-height:110px; }
.form__submit{ width:100%; margin-top:6px; }
.form__note{ font-family:var(--font-sans); font-size:.82rem; color:var(--muted); text-align:center; margin:14px 0 0; }
/* honeypot — hidden from humans, available to bots */
.form__hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

/* injected error messages (client script references .error-message + fadeIn;
   override its inline #ff6b6b — ~2.6:1, fails AA — with an accessible colour) */
.error-message{ color:var(--error) !important; margin-top:6px; font-family:var(--font-sans); font-size:.85rem; }
@keyframes fadeIn{ from{ opacity:0; transform:translateY(-3px); } to{ opacity:1; transform:translateY(0); } }

/* success panel — hidden by default; the client script toggles it to block */
.form-success{ display:none; text-align:center; padding:18px 8px; }
.form-success__mark{
  width:60px; height:60px; border-radius:50%; background:var(--brass-ink); color:var(--cream);
  display:flex; align-items:center; justify-content:center; font-size:1.7rem; margin:0 auto 16px;
}
.form-success h3{ font-size:1.4rem; margin-bottom:8px; }
.form-success p{ color:var(--muted-deep); margin:0; font-family:var(--font-sans); }

/* ------------------------------------------------------------ map */
.map__frame{ border:1px solid var(--card-border); border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-sm); background:var(--stone); }
.map__frame iframe{ width:100%; height:clamp(300px,42vw,460px); border:0; filter:saturate(.92) contrast(1.02); }
.map__actions{ text-align:center; margin-top:24px; }

/* ------------------------------------------------------------ footer */
.site-footer{ background:var(--charcoal); color:var(--on-dark-muted); padding-top:clamp(50px,7vw,72px); }
.footer__grid{ display:grid; grid-template-columns:1fr; gap:34px; padding-bottom:44px; }
.footer__name{ font-family:var(--font-serif); font-size:1.4rem; color:var(--on-dark); display:block; margin-bottom:8px; }
.footer__tag{ margin:0; font-size:.95rem; max-width:34ch; }
.footer__col{ display:flex; flex-direction:column; gap:9px; }
.footer__col h3{ font-family:var(--font-sans); font-size:.74rem; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--brass-dark); margin-bottom:6px; }
.footer__col a, .footer__col span{ color:var(--on-dark-muted); font-size:.95rem; }
.footer__col a:hover{ color:var(--on-dark); }
.footer__contact a[href^="mailto"]{ word-break:break-word; }
.footer__bottom{ border-top:1px solid rgba(199,167,104,.16); padding:22px 0; }
.footer__bottom p{ margin:0; font-size:.86rem; color:var(--on-dark-muted); text-align:center; }

/* ------------------------------------------------------------ reveal (progressive, pure CSS)
   Time-based load-in: content is ALWAYS visible by default and the fade runs
   once on load, so nothing can be left hidden (no scroll or JS dependency). */
.reveal{ opacity:1; }
@media (prefers-reduced-motion: no-preference){
  .reveal{ animation:reveal-in .8s cubic-bezier(.22,.61,.36,1) both; }
  .trust__item.reveal:nth-child(2){ animation-delay:.08s; }
  .trust__item.reveal:nth-child(3){ animation-delay:.16s; }
  .trust__item.reveal:nth-child(4){ animation-delay:.24s; }
  .card.reveal:nth-child(2),.step.reveal:nth-child(2),.gallery__item.reveal:nth-child(2){ animation-delay:.07s; }
  .card.reveal:nth-child(3),.step.reveal:nth-child(3),.gallery__item.reveal:nth-child(3){ animation-delay:.14s; }
  .card.reveal:nth-child(4),.step.reveal:nth-child(4),.gallery__item.reveal:nth-child(4){ animation-delay:.21s; }
  .card.reveal:nth-child(5),.gallery__item.reveal:nth-child(5){ animation-delay:.28s; }
  .card.reveal:nth-child(6),.gallery__item.reveal:nth-child(6){ animation-delay:.35s; }
}
@keyframes reveal-in{ from{ opacity:0; transform:translateY(22px); } to{ opacity:1; transform:translateY(0); } }
@media (prefers-reduced-motion: reduce){ .reveal{ opacity:1 !important; transform:none !important; animation:none !important; } }
@media print{ .reveal{ opacity:1 !important; animation:none !important; transform:none !important; } }

/* ------------------------------------------------------------ responsive */
@media (min-width:600px){
  .trust__grid{ grid-template-columns:repeat(2,1fr); }
  .cards{ grid-template-columns:repeat(2,1fr); }
  .steps{ grid-template-columns:repeat(2,1fr); }
  .gallery__grid{ grid-template-columns:repeat(2,1fr); }
  .hero__actions .btn{ min-width:auto; }
}
@media (min-width:900px){
  .nav-desktop{ display:flex; }
  .header-tel{ display:flex; }
  .nav-burger{ display:none; }
  .mobile-menu{ display:none; }
  .trust__grid{ grid-template-columns:repeat(4,1fr); }
  .cards{ grid-template-columns:repeat(3,1fr); }
  .steps{ grid-template-columns:repeat(4,1fr); }
  .gallery__grid{ grid-template-columns:repeat(3,1fr); }
  .why__grid{ grid-template-columns:1.05fr 1fr; gap:56px; }
  .why__list{ grid-template-columns:1fr; }
  .about__grid{ grid-template-columns:auto 1fr; gap:56px; }
  .about__badge{ margin:0; }
  .contact__grid{ grid-template-columns:1fr 1.05fr; gap:52px; }
  .footer__grid{ grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:40px; }
}
@media (min-width:1100px){
  .why__list{ grid-template-columns:1fr; }
}

/* connector rule under process numbers on wide screens */
@media (min-width:900px){
  .step{ padding-top:34px; }
  .step::before{ content:""; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg,var(--brass-deco),transparent); border-radius:3px 3px 0 0; }
}
