/* =========================================================
   MUSÉE ORIGINES — Feuille de style principale
   Palette : argile, charbon, os, bronze, indigo, rouille
   Typo : Fraunces (display) / Work Sans (texte) / Space Mono (étiquettes)
   ========================================================= */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,300;0,9..144,400;0,9..144,500;0,9..144,600;0,9..144,700;1,9..144,400;1,9..144,500&family=Work+Sans:wght@300;400;500;600;700&family=Space+Mono:wght@400;700&display=swap');

:root{
  --charcoal: #1c1712;
  --charcoal-2: #241d17;
  --bone: #f1e8d8;
  --bone-2: #e7dcc6;
  --clay: #b8862c;
  --clay-dark: #8c651e;
  --bronze: #1f8f86;
  --bronze-light: #7fd4c9;
  --indigo: #145e59;
  --indigo-light: #2ca79d;
  --rust: #6b4a12;
  --ink: #241d17;
  --ink-soft: #4a4038;
  --paper: #faf6ee;
  --line: rgba(36,29,23,0.14);
  --line-light: rgba(241,232,216,0.22);
  --shadow: 0 18px 40px -18px rgba(20,14,8,0.35);
  --radius: 2px;
  --maxw: 1240px;
}

*, *::before, *::after{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
body{
  margin:0;
  background: var(--paper);
  color: var(--ink);
  font-family:'Work Sans', sans-serif;
  font-weight:400;
  line-height:1.6;
  -webkit-font-smoothing: antialiased;
}
img{ max-width:100%; display:block; }
a{ color: inherit; text-decoration:none; }
h1,h2,h3,h4{
  font-family:'Fraunces', serif;
  font-weight:500;
  line-height:1.08;
  margin:0 0 .5em;
  letter-spacing:-0.01em;
  color: var(--charcoal);
}
p{ margin:0 0 1em; }
ul{ margin:0; padding:0; list-style:none; }
.container{ max-width: var(--maxw); margin:0 auto; padding:0 32px; }
@media (max-width:640px){ .container{ padding:0 20px; } }

::selection{ background: var(--clay); color: var(--bone); }

/* Focus visibility for accessibility */
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible{
  outline: 2px solid var(--clay);
  outline-offset: 3px;
}

/* ---------- Étiquette / signature element (fiche d'objet) ---------- */
.tag{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-family:'Space Mono', monospace;
  font-size:11.5px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color: var(--clay-dark);
  padding: 5px 12px 5px 10px;
  border:1px solid var(--clay-dark);
  border-radius: 1px;
  background: transparent;
  position:relative;
}
.tag::before{
  content:"";
  width:6px; height:6px;
  border-radius:50%;
  border:1px solid var(--clay-dark);
  background: var(--paper);
  flex:none;
}
.tag--light{ color: var(--bone); border-color: var(--bronze-light); }
.tag--light::before{ border-color: var(--bronze-light); background: transparent; }
.tag--indigo{ color: var(--indigo); border-color: var(--indigo); }
.tag--indigo::before{ border-color: var(--indigo); }

.object-label{
  font-family:'Space Mono', monospace;
  font-size:12px;
  letter-spacing:.03em;
  color: var(--ink-soft);
  border-top: 1px dashed var(--line);
  padding-top:10px;
  margin-top:12px;
  display:flex;
  justify-content:space-between;
  gap: 10px;
}
.object-label b{ color: var(--ink); font-weight:600; }
.object-label span.num{ color: var(--clay-dark); flex:none; }

/* ---------- Header ---------- */
.site-header{
  position: sticky; top:0; z-index:100;
  background: rgba(20,60,58,0.95);
  backdrop-filter: blur(6px);
  border-bottom: 1px solid rgba(241,232,216,0.14);
}
.header-inner{
  max-width: var(--maxw); margin:0 auto; padding: 12px 32px;
  display:flex; align-items:center; justify-content:space-between;
  min-height:82px; gap:14px;
}
@media (max-width:640px){ .header-inner{ padding:10px 16px; min-height:64px; gap:8px; } }
@media (max-width:400px){ .brand-text small{ display:none; } }

.brand{ display:flex; align-items:center; gap:12px; color: var(--bone); min-width:0; }
.brand-mark{
  width:48px; height:48px; flex:none;
  border:1.5px solid var(--bronze-light);
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-family:'Fraunces', serif; font-size:17px; color: var(--bronze-light);
  overflow:hidden;
  background: var(--charcoal);
}
.brand-logo{
  display:block;
  width:100%; height:100%;
  object-fit:contain;
}
.brand-text{ display:flex; flex-direction:column; line-height:1.15; min-width:0; }
.brand-text strong{ font-family:'Fraunces', serif; font-size:18px; letter-spacing:.01em; color:var(--bone); white-space:nowrap; }
.brand-text small{ display:none; }

nav.main-nav{ display:flex; align-items:center; gap:20px; }
nav.main-nav > ul{ display:flex; gap:16px; align-items:center; }
nav.main-nav a{
  font-size:12.5px; letter-spacing:.03em; text-transform:uppercase;
  color: rgba(241,232,216,0.82); font-weight:500;
  padding:8px 0; position:relative;
}
nav.main-nav a::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:1px;
  background: var(--clay); transform:scaleX(0); transform-origin:left;
  transition: transform .25s ease;
}
nav.main-nav a:hover::after, nav.main-nav a.active::after{ transform:scaleX(1); }
nav.main-nav a.active{ color: var(--bone); }

.has-sub{ position:relative; }
.submenu{
  position:absolute; top: 100%; left:-16px; padding-top:14px;
  min-width:230px; display:none;
}
.has-sub:hover .submenu, .has-sub:focus-within .submenu{ display:block; }
.submenu ul{
  background: var(--charcoal-2); border:1px solid rgba(241,232,216,0.14);
  padding:10px 0; box-shadow: var(--shadow);
}
.submenu a{ display:block; padding:10px 20px; text-transform:none; letter-spacing:0; font-size:13.5px; }
.submenu a::after{ display:none; }
.submenu a:hover{ background: rgba(165,82,44,0.18); color: var(--bone); }

.btn{
  display:inline-flex; align-items:center; gap:10px;
  font-family:'Space Mono', monospace; font-size:11.5px; letter-spacing:.1em; text-transform:uppercase;
  padding: 13px 24px; border:1px solid currentColor; border-radius:1px;
  transition: all .22s ease; white-space:nowrap;
}
.btn-primary{ background: var(--clay); color: var(--bone); border-color: var(--clay); }
.btn-primary:hover{ background: var(--clay-dark); border-color: var(--clay-dark); }
.btn-ghost{ color: var(--bone); border-color: rgba(241,232,216,0.5); }
.btn-ghost:hover{ border-color: var(--bone); background: rgba(241,232,216,0.06); }
.btn-dark{ color: var(--charcoal); border-color: var(--charcoal); }
.btn-dark:hover{ background: var(--charcoal); color: var(--bone); }
.header-cta{ display:flex; align-items:center; }

.burger{ display:none; background:none; border:none; cursor:pointer; padding:8px; }
.burger span{ display:block; width:24px; height:2px; background: var(--bone); margin:5px 0; }

@media (max-width: 1180px){
  .header-cta .btn-ghost{ display:none; }
}
@media (max-width: 900px){
  nav.main-nav > ul{ display:none; }
  .burger{ display:block; }
}
@media (max-width: 480px){
  .header-cta .btn-primary{ display:none; }
}

/* Mobile drawer */
.mobile-nav{
  display:none; position:fixed; inset:0; z-index:200;
  background: var(--charcoal); padding: 26px 26px 40px;
  overflow-y:auto;
}
.mobile-nav.open{ display:block; }
.mobile-nav .mnav-top{ display:flex; justify-content:space-between; align-items:center; margin-bottom:34px; }
.mobile-nav .close-btn{ background:none; border:1px solid rgba(241,232,216,0.4); color: var(--bone); width:36px; height:36px; border-radius:50%; font-size:16px; cursor:pointer; }
.mobile-nav ul{ display:flex; flex-direction:column; gap:2px; }
.mobile-nav > div > ul > li > a{
  font-family:'Fraunces', serif; font-size:26px; color: var(--bone); padding: 14px 0;
  display:block; border-bottom:1px solid rgba(241,232,216,0.1);
}
.mobile-nav .sub-list{ padding-left:14px; }
.mobile-nav .sub-list a{ font-family:'Work Sans',sans-serif; font-size:15px; padding:9px 0; color: rgba(241,232,216,0.75); border:none; }
.mobile-nav .mnav-cta{ margin-top:28px; display:flex; gap:12px; flex-wrap:wrap; }

/* ---------- Hero ---------- */
.hero{
  position:relative; color: var(--bone); min-height: 86vh;
  display:flex; align-items:flex-end;
  background-color: var(--charcoal);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.hero-sub{ min-height:52vh; }
.hero::before{
  content:""; position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(20,15,10,0.35), rgba(15,11,8,0.86));
}
.hero-inner{ position:relative; z-index:1; max-width: var(--maxw); margin:0 auto; padding: 90px 32px 64px; width:100%; }
@media (max-width:640px){ .hero-inner{ padding:60px 20px 44px; } }
.hero-eyebrow{ margin-bottom:22px; }
.hero h1{ color: var(--bone); font-size: clamp(38px, 6vw, 74px); max-width:16ch; font-weight:500; }
.hero-lede{ max-width:52ch; font-size:18px; color: rgba(241,232,216,0.86); margin-top:18px; }
.hero-actions{ display:flex; gap:16px; margin-top:34px; flex-wrap:wrap; }
.hero-meta{
  display:flex; gap:44px; margin-top:56px; padding-top:26px;
  border-top:1px solid rgba(241,232,216,0.22); flex-wrap:wrap;
}
.hero-meta div strong{ display:block; font-family:'Fraunces', serif; font-size:26px; color:var(--bone); }
.hero-meta div span{ font-family:'Space Mono', monospace; font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; color: var(--bronze-light); }

/* ---------- Sections ---------- */
section{ padding: 96px 0; }
section.tight{ padding:64px 0; }
@media (max-width:780px){ section{ padding:64px 0; } }

.section-head{ max-width:760px; margin-bottom:52px; }
.eyebrow{ margin-bottom:18px; }
.section-head h2{ font-size: clamp(28px, 4vw, 44px); }
.section-head p{ font-size:17px; color: var(--ink-soft); max-width:60ch; }
.section-head.center{ margin-left:auto; margin-right:auto; text-align:center; }

.bg-charcoal{ background: var(--charcoal); color: var(--bone); }
.bg-charcoal h2, .bg-charcoal h3, .bg-charcoal h4{ color: var(--bone); }
.bg-charcoal .section-head p{ color: rgba(241,232,216,0.7); }
.bg-bone{ background: var(--bone-2); }

/* ---------- Grids / cards ---------- */
.grid-3{ display:grid; grid-template-columns: repeat(3,1fr); gap:34px; }
.grid-2{ display:grid; grid-template-columns: repeat(2,1fr); gap:40px; }
@media (max-width:900px){ .grid-3{ grid-template-columns:1fr 1fr; } .grid-2{ grid-template-columns:1fr; } }
@media (max-width:640px){ .grid-3{ grid-template-columns:1fr; } }

.card{ background: var(--paper); border:1px solid var(--line); position:relative; }
.card .card-media{ aspect-ratio: 4/3; overflow:hidden; position:relative; }
.card .card-media img{ width:100%; height:100%; object-fit:cover; transition: transform .6s ease; }
.card:hover .card-media img{ transform: scale(1.055); }
.card .card-body{ padding:22px 22px 24px; }
.card h3{ font-size:20px; margin-bottom:8px; }
.card p{ color: var(--ink-soft); font-size:14.5px; margin-bottom:0; }
.card-cat{
  position:absolute; top:14px; left:14px; z-index:2;
  font-family:'Space Mono', monospace; font-size:10px; letter-spacing:.12em; text-transform:uppercase;
  background: rgba(28,23,18,0.82); color: var(--bone); padding:6px 10px;
}
.accent-clay{ border-top: 3px solid var(--clay); }
.accent-bronze{ border-top: 3px solid var(--bronze); }
.accent-indigo{ border-top: 3px solid var(--indigo); }

/* Collection category block */
.collection-block{ display:grid; grid-template-columns: .85fr 1.15fr; gap:56px; align-items:center; margin-bottom: 110px; }
.collection-block:last-child{ margin-bottom:0; }
.collection-block.reverse{ direction: rtl; }
.collection-block.reverse > *{ direction: ltr; }
@media (max-width:900px){ .collection-block, .collection-block.reverse{ grid-template-columns:1fr; direction:ltr; } }

.collection-figure{ position:relative; }
.collection-figure img{ width:100%; }
.collection-figure .frame-num{
  position:absolute; bottom:-18px; right:-18px;
  background: var(--paper); border:1px solid var(--line);
  font-family:'Space Mono', monospace; font-size:11px; padding:8px 12px; letter-spacing:.08em;
}
@media (max-width:900px){ .collection-figure .frame-num{ right:12px; } }

.mini-gallery{ display:grid; grid-template-columns: repeat(3,1fr); gap:12px; margin-top:20px; }
.mini-gallery img{ aspect-ratio:1; object-fit:cover; border:1px solid var(--line); }

/* ---------- Stats / values ---------- */
.value-row{ display:grid; grid-template-columns: repeat(4, 1fr); gap:30px; }
@media (max-width:900px){ .value-row{ grid-template-columns: 1fr 1fr; } }
@media (max-width:560px){ .value-row{ grid-template-columns: 1fr; } }
.value-row .num{ font-family:'Fraunces', serif; font-size:40px; color: var(--clay); margin-bottom:6px; }
.value-row h4{ font-size:16px; margin-bottom:8px; }
.value-row p{ font-size:14px; color: var(--ink-soft); }

/* ---------- Timeline (about page) ---------- */
.timeline{ border-left: 1px solid var(--line); padding-left: 34px; display:flex; flex-direction:column; gap:38px; }
.timeline-item{ position:relative; }
.timeline-item::before{
  content:""; position:absolute; left:-40px; top:4px; width:9px; height:9px; border-radius:50%;
  background: var(--clay); border: 3px solid var(--paper); outline: 1px solid var(--clay);
}
.timeline-item .yr{ font-family:'Space Mono', monospace; font-size:12px; color: var(--clay-dark); letter-spacing:.08em; }
.timeline-item h4{ margin:6px 0 8px; font-size:19px; }
.timeline-item p{ color: var(--ink-soft); font-size:14.5px; max-width:60ch; }

/* ---------- Team ---------- */
.team-grid{ display:grid; grid-template-columns: repeat(3,1fr); gap:30px; }
@media (max-width:780px){ .team-grid{ grid-template-columns:1fr; } }
.team-card{ border-top:1px solid var(--line); padding-top:18px; }
.team-card h4{ font-size:18px; margin-bottom:2px; }
.team-card .role{ font-family:'Space Mono', monospace; font-size:11px; text-transform:uppercase; letter-spacing:.1em; color: var(--clay-dark); display:block; margin-bottom:12px; }
.team-card p{ font-size:14px; color: var(--ink-soft); }

/* ---------- Exhibition list ---------- */
.expo-row{
  display:grid; grid-template-columns: 120px 1fr 220px; gap:28px; align-items:start;
  padding: 32px 0; border-top:1px solid var(--line);
}
.expo-row:last-child{ border-bottom:1px solid var(--line); }
.expo-row .expo-date{ font-family:'Space Mono', monospace; font-size:12px; color: var(--clay-dark); letter-spacing:.05em; padding-top:4px; }
.expo-row h3{ font-size:23px; margin-bottom:8px; }
.expo-row p{ color: var(--ink-soft); font-size:14.5px; max-width:60ch; }
.expo-row .expo-cta{ justify-self:end; }
@media (max-width:780px){ .expo-row{ grid-template-columns:1fr; gap:10px; } .expo-row .expo-cta{ justify-self:start; margin-top:6px; } }

.status-pill{ display:inline-block; font-family:'Space Mono', monospace; font-size:10px; letter-spacing:.1em; text-transform:uppercase; padding:4px 10px; border:1px solid; margin-bottom:10px;}
.status-pill.now{ color:#3f6b3a; border-color:#3f6b3a; }
.status-pill.soon{ color: var(--clay-dark); border-color: var(--clay-dark); }
.status-pill.past{ color: var(--ink-soft); border-color: var(--line); }

/* ---------- Agenda ---------- */
.agenda-list{ display:flex; flex-direction:column; }
.agenda-item{
  display:grid; grid-template-columns: 96px 1fr auto; gap:26px; align-items:center;
  padding:26px 0; border-top:1px solid var(--line);
}
.agenda-item:last-child{ border-bottom:1px solid var(--line); }
.agenda-date{ text-align:center; background: var(--charcoal); color: var(--bone); padding:12px 6px; }
.agenda-date .d{ font-family:'Fraunces', serif; font-size:26px; display:block; line-height:1; }
.agenda-date .m{ font-family:'Space Mono', monospace; font-size:10px; letter-spacing:.1em; text-transform:uppercase; color: var(--bronze-light); }
.agenda-item h4{ font-size:18px; margin-bottom:4px; }
.agenda-item .meta{ font-family:'Space Mono', monospace; font-size:11.5px; color: var(--ink-soft); letter-spacing:.03em; }
@media (max-width:640px){ .agenda-item{ grid-template-columns:70px 1fr; } .agenda-item .btn{ grid-column:1/-1; justify-self:start; } }

/* ---------- Practical info / access ---------- */
.info-grid{ display:grid; grid-template-columns: repeat(3,1fr); gap:30px; }
@media (max-width:900px){ .info-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .info-grid{ grid-template-columns:1fr; } }
.info-card{ padding:26px; border:1px solid var(--line); background: var(--paper); }
.info-card h4{ font-size:15px; text-transform:uppercase; letter-spacing:.08em; font-family:'Space Mono', monospace; color: var(--clay-dark); margin-bottom:14px; }
.info-card ul li{ display:flex; justify-content:space-between; gap:10px; padding:8px 0; border-top:1px dashed var(--line); font-size:14.5px; }
.info-card ul li:first-child{ border-top:none; }
.info-card ul li span:last-child{ font-weight:600; text-align:right; }

.map-frame{ border:1px solid var(--line); aspect-ratio: 16/8; background: var(--bone-2) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="200" height="200"><rect width="200" height="200" fill="%23e7dcc6"/><path d="M0 100 H200 M100 0 V200" stroke="%23c9bb9a" stroke-width="1"/></svg>'); display:flex; align-items:center; justify-content:center; overflow:hidden; }
.map-frame span{ font-family:'Space Mono', monospace; font-size:12px; color: var(--ink-soft); letter-spacing:.06em;}
.map-frame iframe{ width:100%; height:100%; border:0; display:block; filter: grayscale(12%) contrast(1.02); }
.map-link{ display:inline-flex; align-items:center; gap:8px; margin-top:12px; font-family:'Space Mono', monospace; font-size:11.5px; letter-spacing:.06em; text-transform:uppercase; color: var(--clay-dark); text-decoration:underline; text-underline-offset:3px; }

/* ---------- Pricing ---------- */
.price-table{ width:100%; border-collapse:collapse; }
.price-table th, .price-table td{ text-align:left; padding:18px 14px; border-top:1px solid var(--line); font-size:15px; }
.price-table thead th{ font-family:'Space Mono', monospace; font-size:11px; text-transform:uppercase; letter-spacing:.1em; color: var(--clay-dark); border-top:none; }
.price-table td:last-child, .price-table th:last-child{ text-align:right; font-family:'Fraunces', serif; font-size:19px; }
.price-note{ font-size:13px; color: var(--ink-soft); margin-top:16px; }

.ticket-card{ background: var(--charcoal); color: var(--bone); padding:40px; }
.ticket-card h3{ color: var(--bone); }
.ticket-card p{ color: rgba(241,232,216,0.75); }

/* ---------- Pedagogy ---------- */
.pill-list{ display:flex; flex-wrap:wrap; gap:10px; margin-top:18px; }
.pill{ font-family:'Space Mono', monospace; font-size:11.5px; letter-spacing:.06em; text-transform:uppercase; border:1px solid var(--line); padding:7px 13px; color: var(--ink-soft); }

.workshop-grid{ display:grid; grid-template-columns: repeat(2,1fr); gap:26px; }
@media (max-width:780px){ .workshop-grid{ grid-template-columns:1fr; } }
.workshop-card{ border:1px solid var(--line); padding:26px; }
.workshop-card .lvl{ font-family:'Space Mono', monospace; font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color: var(--indigo); }
.workshop-card h4{ margin:10px 0 8px; font-size:19px; }
.workshop-card p{ font-size:14px; color: var(--ink-soft); }

/* ---------- Contact / form ---------- */
.contact-grid{ display:grid; grid-template-columns: 1fr 1fr; gap:60px; }
@media (max-width:900px){ .contact-grid{ grid-template-columns:1fr; gap:40px; } }
.form-field{ margin-bottom:20px; }
.form-field label{ display:block; font-family:'Space Mono', monospace; font-size:11px; letter-spacing:.08em; text-transform:uppercase; margin-bottom:8px; color: var(--ink-soft); }
.form-field input, .form-field textarea, .form-field select{
  width:100%; padding:13px 14px; border:1px solid var(--line); background: var(--paper);
  font-family:'Work Sans', sans-serif; font-size:15px; color: var(--ink);
}
.form-field textarea{ resize:vertical; min-height:130px; }
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
@media (max-width:520px){ .form-row{ grid-template-columns:1fr; } }
.form-note{ font-size:12.5px; color: var(--ink-soft); margin-top:6px; }

.contact-info li{ display:flex; gap:16px; padding:16px 0; border-top:1px solid var(--line); }
.contact-info li:first-child{ border-top:none; }
.contact-info .lbl{ font-family:'Space Mono', monospace; font-size:11px; text-transform:uppercase; letter-spacing:.08em; color: var(--clay-dark); width:110px; flex:none; padding-top:2px; }

/* ---------- Newsletter ---------- */
.newsletter{ background: var(--indigo); color: var(--bone); padding: 60px 0; }
.newsletter h2{ color: var(--bone); font-size: clamp(24px,3vw,32px); }
.newsletter-form{ display:flex; gap:12px; margin-top:24px; max-width:520px; flex-wrap:wrap; }
.newsletter-form input{ flex:1; min-width:220px; padding:14px 16px; border:1px solid rgba(241,232,216,0.4); background:transparent; color: var(--bone); font-family:'Work Sans', sans-serif; }
.newsletter-form input::placeholder{ color: rgba(241,232,216,0.55); }
.newsletter-form .btn{ border-color: var(--bone); color: var(--bone); }
.newsletter-form .btn:hover{ background: var(--bone); color: var(--indigo); }

/* ---------- Quote / editorial ---------- */
.quote-block{ max-width:820px; margin: 0 auto; text-align:center; }
.quote-block q{ font-family:'Fraunces', serif; font-style:italic; font-size: clamp(24px,3.4vw,36px); color: var(--charcoal); line-height:1.35; quotes:none; }
.quote-block cite{ display:block; margin-top:22px; font-style:normal; font-family:'Space Mono', monospace; font-size:12px; letter-spacing:.1em; text-transform:uppercase; color: var(--ink-soft); }

/* ---------- Footer ---------- */
footer.site-footer{ background: var(--clay-dark); color: rgba(241,232,216,0.85); padding: 70px 0 26px; }
.footer-top{ display:grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap:40px; padding-bottom:50px; border-bottom:1px solid rgba(241,232,216,0.14); }
@media (max-width:860px){ .footer-top{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .footer-top{ grid-template-columns:1fr; } }
.footer-top h5{ font-family:'Space Mono', monospace; font-size:11px; letter-spacing:.1em; text-transform:uppercase; color: var(--bronze-light); margin-bottom:18px; }
.footer-top li{ padding:6px 0; font-size:14px; }
.footer-top li a:hover{ color: var(--bone); }
.footer-brand p{ max-width:34ch; font-size:14px; color: rgba(241,232,216,0.6); }
.footer-bottom{ display:flex; justify-content:space-between; align-items:center; padding-top:24px; font-family:'Space Mono', monospace; font-size:11px; letter-spacing:.04em; color: rgba(241,232,216,0.45); flex-wrap:wrap; gap:10px; }

/* ---------- Breadcrumb / page intro (interior pages) ---------- */
.page-intro{
  position:relative;
  background-color: var(--charcoal);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  color: var(--bone);
  padding: 150px 0 60px;
}
.page-intro::before{
  content:""; position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(18,14,10,0.62), rgba(15,11,8,0.93));
}
.page-intro > .container{ position:relative; z-index:1; }
.page-intro .tag{ margin-bottom:20px; }
.page-intro h1{ color: var(--bone); font-size: clamp(32px,5vw,56px); max-width:20ch; }
.page-intro p{ color: rgba(241,232,216,0.72); max-width:60ch; font-size:16.5px; margin-top:16px; }
.crumbs{ font-family:'Space Mono', monospace; font-size:11px; letter-spacing:.06em; color: var(--bronze-light); margin-bottom:22px; }
.crumbs a{ color: var(--bronze-light); }
.crumbs span{ color: rgba(241,232,216,0.4); margin:0 6px; }

/* Utility */
.mt-0{ margin-top:0; }
.divider{ height:1px; background: var(--line); margin: 70px 0; }
.reveal{ opacity:0; transform: translateY(18px); transition: opacity .7s ease, transform .7s ease; }
.reveal.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){
  .reveal{ opacity:1; transform:none; transition:none; }
  html{ scroll-behavior:auto; }
}
