/* Styles propres à about.html — extrait du <style> inline (charte partagée : /assets/site.css) */
    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

    :root {
      --ink: #1a1814;
      --paper: #f2f5fa;
      --paper-dark: #e6ecf6;
      --brand: #1d3a5f;
      --gold: #b89a5a;
      --gold-light: #d4b87a;
      --muted: #7a7060;
      --nav-h: 72px;
    }

    body {
      background: var(--paper);
      color: var(--ink);
      font-family: 'Montserrat', sans-serif;
      font-weight: 300;
    }

    /* En-tête (nav à onglets) commun : voir /assets/site.css */

    /* ── PAGE HEADER ── */
    .page-header {
      padding-top: calc(var(--nav-h) + 6rem);
      padding-bottom: 5rem;
      text-align: center;
      position: relative;
    }

    .page-header::after {
      content: '';
      display: block;
      width: 60px;
      height: 1px;
      background: var(--gold);
      margin: 2.5rem auto 0;
    }

    .page-eyebrow {
      font-size: 0.7rem;
      letter-spacing: 0.3em;
      text-transform: uppercase;
      color: var(--gold);
      margin-bottom: 1.2rem;
      opacity: 0;
      animation: fadeUp 0.8s 0.1s forwards;
    }

    .page-title {
      font-family: 'Cormorant Garamond', serif;
      font-size: clamp(2.8rem, 6vw, 5rem);
      font-weight: 300;
      font-style: italic;
      color: var(--ink);
      opacity: 0;
      animation: fadeUp 0.8s 0.25s forwards;
    }

    /* ── CONTENT ── */
    .content {
      max-width: 760px;
      margin: 0 auto;
      padding: 0 3rem 8rem;
      opacity: 0;
      animation: fadeUp 0.8s 0.5s forwards;
    }

    .content p {
      font-size: 0.9rem;
      line-height: 2;
      color: var(--ink);
      margin-bottom: 1.8rem;
      letter-spacing: 0.02em;
    }

    .content p.intro {
      font-family: 'Cormorant Garamond', serif;
      font-size: 1.5rem;
      font-style: italic;
      font-weight: 300;
      line-height: 1.6;
      color: var(--ink);
      margin-bottom: 2.5rem;
    }

    .content p strong {
      font-weight: 500;
      color: var(--gold);
    }

    .ornament {
      text-align: center;
      font-family: 'Cormorant Garamond', serif;
      font-size: 1.5rem;
      color: var(--gold);
      letter-spacing: 0.5em;
      margin: 3rem 0;
      opacity: 0.4;
    }

    /* Pied de page commun : voir /assets/site.css */

    @keyframes fadeUp {
      from { opacity: 0; transform: translateY(16px); }
      to   { opacity: 1; transform: translateY(0); }
    }

    .content ul {
      list-style: none;
      margin: 0 0 1.8rem;
      padding: 0;
    }

    .content li {
      font-size: 0.9rem;
      line-height: 1.9;
      color: var(--ink);
      letter-spacing: 0.02em;
      padding-left: 1.4rem;
      position: relative;
      margin-bottom: 0.5rem;
    }

    .content li::before {
      content: '—';
      position: absolute;
      left: 0;
      color: var(--gold);
    }

    .content a {
      color: var(--gold);
      text-decoration: none;
      border-bottom: 1px solid rgba(184,154,90,0.4);
      transition: border-color 0.2s;
    }

    .content a:hover { border-color: var(--gold); }

    @media (max-width: 600px) {
      .content { padding: 0 1.5rem 5rem; }
    }