/* ============================================================
   PHASE 7 — TEXTURES & MATIÈRES
   SVG noise · toile overlay · patine cuivrée · grain argentique
   ============================================================ */

/* ── SVG Noise (plâtre) — inline base64 SVG filter ───────────────────── */
.tex-platre::before,
body::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: .028;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");
  background-size: 300px 300px;
}

/* ── Toile overlay — sections spécifiques ────────────────────────────── */
.quote-section::before,
.about-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  opacity: .035;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='t'%3E%3CfeTurbulence type='turbulence' baseFrequency='.9 .6' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23t)' opacity='1'/%3E%3C/svg%3E");
  background-size: 120px 120px;
}
.quote-section,
.about-hero { position: relative; }

/* ── Patine cuivrée sur séparateurs / bordures ────────────────────────── */
.section__header {
  position: relative;
}
.section__header::after {
  content: '';
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 100%;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(181,149,106,.25) 20%,
    rgba(181,149,106,.55) 50%,
    rgba(181,149,106,.25) 80%,
    transparent 100%
  );
}

.timeline__entry {
  position: relative;
}
.timeline__entry::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: linear-gradient(135deg, #B5956A, #7A3E2C);
  transform: translateY(-50%);
  box-shadow: 0 0 8px rgba(181,149,106,.4);
}

/* Patine sur la nav logo */
.nav__logo {
  /* Fallback: plain light colour if background-clip:text is unsupported */
  color: #F5EFE6;
  /* Progressive enhancement: gradient text */
  background: linear-gradient(135deg, #F5EFE6 0%, #B5956A 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* ── Grain argentique sur images au repos ────────────────────────────── */
.project-card__img,
.arch-card__img,
.single-hero__img,
.about-portrait img {
  filter: brightness(.88) saturate(.85) contrast(1.02);
}
.project-card:hover .project-card__img,
.arch-card:hover .arch-card__img {
  filter: brightness(1) saturate(1) contrast(1);
}

/* ── Borders with copper gradient ────────────────────────────────────── */
.clients {
  border-top:    1px solid;
  border-bottom: 1px solid;
  border-image: linear-gradient(
    90deg,
    transparent,
    rgba(181,149,106,.2) 30%,
    rgba(181,149,106,.2) 70%,
    transparent
  ) 1;
}

.footer {
  border-top: 1px solid;
  border-image: linear-gradient(
    90deg,
    transparent,
    rgba(181,149,106,.18) 50%,
    transparent
  ) 1;
}

/* ── Vignette effect on page ─────────────────────────────────────────── */
body::after {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 1;
  background: radial-gradient(
    ellipse 120% 100% at 50% 50%,
    transparent 55%,
    rgba(28,25,23,.18) 100%
  );
}

/* ── Hero text shadow for depth ──────────────────────────────────────── */
.hero__title,
.arch-hero__title {
  text-shadow: 0 2px 40px rgba(28,25,23,.5), 0 1px 0 rgba(181,149,106,.08);
}