/* ==========================================================================
   REBRAND-OVERRIDES.CSS — Venetian Plaster rebrand skin
   Loaded after the legacy stylesheets; re-themes the old dark "cave" design
   to the warm plaster + copper brand artwork. Token names keep their legacy
   meaning slots (--void = page base, --bone/--chalk = heading text, etc.)
   but now carry the light palette.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Marcellus&family=Outfit:wght@300;400;500;600;700&display=swap');

:root {
  --font-heading: 'Marcellus', 'Times New Roman', serif;
  --font-body: 'Outfit', -apple-system, BlinkMacSystemFont, sans-serif;
  --void: #efe5d1;
  --cave: rgba(244, 235, 218, 0.92);
  --bedrock: rgba(236, 224, 200, 0.95);
  --slate: rgba(80, 63, 49, 0.32);
  --sediment: #8a6c50;
  --weathered: #6d5238;
  --limestone: #54422f;
  --sandstone: #4a3522;
  --chalk: #382717;
  --bone: #2c1d12;
  --ember: #8a5a3b;
  --amber: #a3683c;
  --flame: #6d4630;
  --glow: rgba(138, 90, 59, 0.18);
  --glow-strong: rgba(138, 90, 59, 0.3);
  --fire-gradient: linear-gradient(135deg, #8a5a3b, #6d4630);

  --shadow-sm: 0 2px 8px rgba(58, 40, 24, 0.18);
  --shadow-md: 0 4px 16px rgba(58, 40, 24, 0.22), 0 2px 4px rgba(58, 40, 24, 0.12);
  --shadow-lg: 0 8px 32px rgba(58, 40, 24, 0.26), 0 4px 12px rgba(58, 40, 24, 0.16);
  --shadow-xl: 0 16px 48px rgba(58, 40, 24, 0.3), 0 8px 24px rgba(58, 40, 24, 0.18);
  --shadow-glow: 0 8px 28px rgba(109, 70, 48, 0.35);
  --shadow-glow-strong: 0 12px 36px rgba(109, 70, 48, 0.45);
  --shadow-inset: inset 0 2px 8px rgba(58, 40, 24, 0.18);
  --shadow-carved: inset 0 2px 4px rgba(58, 40, 24, 0.22), inset 0 -1px 2px rgba(243, 230, 206, 0.4);
}

/* Page base: calm parchment with a whisper of the brand texture */
body {
  font-family: var(--font-body);
  color: var(--sandstone);
  background-color: var(--void);
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  background: url('../img/brand-bg.jpg') center/cover no-repeat fixed;
  opacity: 0.1;
  pointer-events: none;
}

h1, h2, h3, h4 { font-family: var(--font-heading); font-weight: 400; }

::selection { background: rgba(138, 90, 59, 0.35); color: var(--bone); }
::-webkit-scrollbar-track { background: #c8b08e; }
::-webkit-scrollbar-thumb { background: #8a6c50; }

/* Sections sit on translucent plaster panels so the texture shows through */
.section--cave { background: var(--cave); }
.section--bedrock { background: var(--bedrock); }

/* Heroes: always the brand artwork (beats inline style attributes) */
.hero,
.hero--short,
.hero--minimal {
  background-image: url('../img/brand-bg.jpg') !important;
}

.hero::before {
  background: radial-gradient(ellipse at center, transparent 45%, rgba(175, 149, 119, 0.55) 95%);
}

.hero::after {
  background: linear-gradient(to top, rgba(236, 219, 190, 0.9) 0%, transparent 100%);
}

.hero__glow {
  background: radial-gradient(ellipse,
    rgba(243, 230, 206, 0.4) 0%,
    rgba(243, 230, 206, 0.12) 40%,
    transparent 70%);
}

/* Navigation */
.site-nav.nav--scrolled {
  background: rgba(236, 219, 190, 0.92);
  border-bottom-color: var(--slate);
}

.nav__logo { display: flex; align-items: center; gap: 10px; color: var(--bone); }

.nav__logo-img {
  width: 46px;
  height: 46px;
  border-radius: 999px;
  box-shadow: 0 6px 18px rgba(58, 40, 24, 0.4);
}

.nav__logo-main,
.nav__logo-sub { display: block; line-height: 1.1; }

.nav__logo-main { font-size: 1.05rem; font-weight: 800; letter-spacing: 0.14em; }
.nav__logo-sub { font-size: 0.66rem; font-weight: 700; letter-spacing: 0.32em; color: var(--ember); }

.nav__link { color: var(--limestone); }
.nav__link:hover { color: var(--bone); }

.nav__dropdown,
.nav__mobile {
  background: rgba(243, 230, 206, 0.97);
  border-color: var(--slate);
}

.nav__toggle-line { background: var(--bone); }

/* Footer: plaster panel with copper rule */
.site-footer {
  background: rgba(222, 200, 166, 0.92);
  border-top: 1px solid rgba(109, 70, 48, 0.4);
}

/* Forms */
.form__input,
.form__textarea {
  background: rgba(243, 230, 206, 0.9);
  border-color: var(--slate);
  color: var(--bone);
}