/*
Theme Name: Lumière de cabine
Theme URI: https://alainghazal.com
Author: Alain Ghazal
Description: Thème sur mesure pour le site d'Alain Ghazal, comédien voix off. Direction Lumière de cabine : la pénombre chaude du studio vers la lumière, palette bleu nuit, ivoire, ambre. Construit sans constructeur de pages, sur blocs natifs et gabarits légers.
Version: 1.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: lumiere-cabine
*/

:root{
  --nuit:#16334D;
  --cabine:#130E09;
  --ivoire:#F6F0E4;
  --ivoire-clair:#F9F4EA;
  --ambre:#C89A5B;
  --ambre-fonce:#A87B3F;
  --encre-chaude:#3D3A32;
  --gris-chaud:#9C8D77;
  --blanc-casse:#FBF8F2;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Hanken Grotesk',system-ui,sans-serif;color:var(--encre-chaude);background:var(--blanc-casse);line-height:1.65;font-size:16.5px}
h1,h2,h3,.serif{font-family:'Source Serif 4',Georgia,serif;font-weight:600}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
.contenu{max-width:1140px;margin:0 auto;padding:0 24px}
.etiquette{font-size:11.5px;letter-spacing:.32em;text-transform:uppercase;font-weight:700}

/* Barre de préproduction */
.bandeau-preprod{background:var(--ambre-fonce);color:#fff;text-align:center;font-size:12.5px;padding:6px 16px;letter-spacing:.04em}

/* Navigation */
.nav-site{position:sticky;top:0;z-index:50;background:rgba(251,248,242,.96);backdrop-filter:blur(8px);border-bottom:1px solid #E8E1D2}
.nav-int{max-width:1140px;margin:0 auto;padding:14px 24px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.logo-site{font-family:'Source Serif 4',serif;font-size:24px;color:var(--nuit);line-height:1}
.logo-site .prenom{font-weight:400}
.logo-site .famille{font-weight:600;font-style:italic}
.nav-liens{display:flex;gap:26px;font-size:14px;font-weight:600}
.nav-liens a{padding:4px 0;border-bottom:2px solid transparent;transition:border-color .2s}
.nav-liens a:hover{border-color:var(--ambre)}
.nav-langues{display:flex;gap:8px;font-size:12px;font-weight:700}
.nav-langues a{color:var(--gris-chaud)}
.nav-langues a.actif{color:var(--nuit)}

/* Boutons */
.bouton{display:inline-flex;align-items:center;gap:11px;background:var(--ambre-fonce);color:#fff;font-weight:700;font-size:14.5px;letter-spacing:.04em;padding:14px 26px;border-radius:3px;transition:background .2s;border:none;cursor:pointer;font-family:inherit}
.bouton:hover{background:#8C6532}
.bouton.clair{background:transparent;border:1.5px solid rgba(255,255,255,.5);color:#fff}
.bouton.clair:hover{background:rgba(255,255,255,.08)}
.bouton.nuit{background:var(--nuit)}
.bouton.nuit:hover{background:#0E2436}

/* Apparitions */
.apparition{opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s ease}
.apparition.visible{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.apparition{opacity:1;transform:none;transition:none}}

/* Pied de page */
.pied-site{background:var(--cabine);color:#B4A78F;padding:44px 0 26px;font-size:14px}
.pied-grille{display:flex;justify-content:space-between;gap:32px;flex-wrap:wrap;margin-bottom:28px;align-items:center}
.pied-liens{display:flex;gap:20px;flex-wrap:wrap;font-weight:600;font-size:13.5px}
.pied-liens a:hover{color:var(--ivoire)}
.pied-bas{border-top:1px solid rgba(255,255,255,.1);padding-top:20px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:12.5px;color:#7A6E5A}

@media (max-width:900px){
  .nav-liens{display:none}
}