/* Thème Aura — famille Nova (Clochu). L'image d'une artiste d'envergure : nuit profonde, or, lettres d'affiche, pochettes et vinyles. */

:root { --paper: #FFFDF8; --ink: #141A2A; --muted: #626A7E; --line: #E7E1D3; --radius: 10px; --on-accent: #0B0F1A; --gold: #E4C27F; --cream: #FDFCF8; }
html.is-dark { --paper: color-mix(in srgb, var(--primary) 35%, #04060B); --light: color-mix(in srgb, var(--primary) 70%, #0A0E18); --ink: #F3EFE6; --muted: #A9AFBF; --line: rgba(228,194,127,.16); --bgdark: color-mix(in srgb, var(--primary) 40%, #020307); --cream: color-mix(in srgb, var(--primary) 55%, #070A12); }
html.is-dark body { background: var(--paper) radial-gradient(1200px 600px at 80% -10%, color-mix(in srgb, var(--accent) 10%, transparent), transparent 70%) no-repeat; }

/* Lettres d'affiche */
h1, h2, h3 { font-weight: 700; letter-spacing: -.01em; line-height: 1.04; }
h2 { font-size: clamp(2.1rem, 1.3rem + 2.8vw, 3.4rem); }
.section-head p, .lede { font-size: 1.08rem; color: var(--muted); }
::selection { background: var(--accent); color: var(--on-accent); }

/* En-tête : transparent sur la photo, puis verre fumé */
.site-header .brand img { max-height: 46px; width: auto; }
.site-header .brand-text strong { font-family: var(--font-head); font-size: 1.35rem; letter-spacing: .14em; text-transform: uppercase; font-weight: 600; }
@media (min-width: 1000px) {
  .main-nav a, .main-nav .nav-menu > li > .menu-heading { font-family: var(--font-body); text-transform: uppercase; letter-spacing: .18em; font-size: .72rem; font-weight: 600; padding: 10px 14px; position: relative; }
  .main-nav a::after { content: ""; position: absolute; left: 14px; right: 14px; bottom: 4px; height: 1px; background: var(--gold); transform: scaleX(0); transform-origin: left; transition: transform .35s; }
  .main-nav a:hover::after, .main-nav a[aria-current="page"]::after { transform: scaleX(1); }
  .main-nav a[aria-current="page"] { background: none; color: var(--gold) !important; }
}
.hdr-overlay.is-scrolled .site-header, html.is-dark .site-header { background: color-mix(in srgb, var(--paper) 82%, transparent); -webkit-backdrop-filter: blur(14px) saturate(1.3); backdrop-filter: blur(14px) saturate(1.3); border-bottom: 1px solid var(--line); }
.hdr-overlay:not(.is-scrolled) .site-header { background: linear-gradient(180deg, rgba(4,6,12,.55), transparent); border-bottom: 0; -webkit-backdrop-filter: none; backdrop-filter: none; }
html.is-dark .hdr-overlay.is-scrolled .site-header .brand, html.is-dark .hdr-overlay.is-scrolled .brand-text strong, html.is-dark .hdr-overlay.is-scrolled .main-nav a { color: var(--ink); }

/* Boutons : or brossé et contour fin */
.btn { border-radius: 999px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; font-size: .8rem; padding: 14px 28px; }
.btn-accent { background: linear-gradient(120deg, var(--accent), var(--gold) 50%, var(--accent)) 0 0 / 220% 100%; color: var(--on-accent) !important; border: 0; box-shadow: 0 14px 34px -14px color-mix(in srgb, var(--accent) 80%, transparent); transition: background-position .6s, transform .2s; }
.btn-accent:hover { background-position: 100% 0; transform: translateY(-1px); }
.btn-ghost, .hero .btn-ghost { border: 1px solid color-mix(in srgb, var(--gold) 70%, transparent); color: #fff; background: rgba(255,255,255,.04); }
.btn-ghost:hover, .hero .btn-ghost:hover { background: var(--gold); color: #0B0F1A !important; border-color: var(--gold); }

/* Accueil : photo de l'artiste à droite, nuit profonde à gauche, grain de pellicule */
.hero-full { background: var(--bgdark, #05070D); color: #fff; position: relative; overflow: hidden; isolation: isolate; }
.hero-full::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--hero) 72% 18% / cover no-repeat; }
.hero-full::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: linear-gradient(90deg, var(--bgdark, #05070D) 0%, var(--bgdark, #05070D) 33%, color-mix(in srgb, var(--bgdark, #05070D) 55%, transparent) 46%, transparent 64%), linear-gradient(0deg, var(--bgdark, #05070D) 0%, transparent 30%), radial-gradient(600px 400px at 15% 80%, color-mix(in srgb, var(--accent) 18%, transparent), transparent 70%); }
@media (min-width: 900px) { .hero-full::before { left: 32%; } }
.hero-full .hero-inner { min-height: 100vh; min-height: 100svh; align-items: center; padding-top: calc(var(--hh, 80px) + 30px); padding-bottom: 90px; }
.hero-full .hero-text { max-width: 640px; }
.hero .tagline { color: var(--gold); text-transform: uppercase; letter-spacing: .32em; font: 600 .74rem var(--font-body); font-style: normal; opacity: 1; display: flex; align-items: center; gap: 14px; }
.hero .tagline::before { content: ""; width: 44px; height: 1px; background: var(--gold); }
.hero h1, .hero-full h1 { font-size: clamp(3rem, 1.2rem + 7vw, 7.4rem); line-height: .92; letter-spacing: -.02em; font-weight: 700; max-width: 11ch; margin: 18px 0 22px;
  background: linear-gradient(180deg, #fff 30%, color-mix(in srgb, var(--gold) 75%, #fff)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hero-lede { font-size: 1.12rem; line-height: 1.6; max-width: 46ch; color: rgba(255,255,255,.82); }
.hero-actions { margin-top: 30px; gap: 14px; }
.scroll-cue { border-color: color-mix(in srgb, var(--gold) 70%, transparent); }
.scroll-cue span { background: var(--gold); }
@media (max-width: 899px) {
  .hero-full::before { background-position: 60% 12%; }
  .hero-full::after { background: linear-gradient(0deg, var(--bgdark, #05070D) 8%, color-mix(in srgb, var(--bgdark, #05070D) 70%, transparent) 45%, rgba(0,0,0,.15) 75%); }
  .hero-full .hero-inner { align-items: flex-end; padding-bottom: 70px; }
  .hero h1, .hero-full h1 { font-size: clamp(2.8rem, 1.6rem + 7vw, 4.2rem); }
}

/* Chiffres clés : bande dorée fine */
.stats-band { background: var(--bgdark, #05070D); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.stats strong { font-family: var(--font-head); color: var(--gold); font-weight: 700; font-size: clamp(2.2rem, 1.6rem + 1.8vw, 3.2rem); }
.stats span { text-transform: uppercase; letter-spacing: .14em; font-size: .7rem; color: rgba(255,255,255,.72); }

/* Titres de section : filet or */
.section-head h2::after, .blk h2::after { content: ""; display: block; width: 56px; height: 2px; margin-top: 18px; background: linear-gradient(90deg, var(--gold), transparent); }
.blk-cta h2::after, .blk-quote h2::after, .cta-band h2::after, .blk-hero h2::after, .mu-rel h2::after, .bsocial h2::after { display: none; }
.section-head { margin-bottom: clamp(26px, 4vw, 48px); }
.blk-teinte { background: var(--cream); }
.blk-sombre { background: radial-gradient(900px 500px at 85% 0%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 65%), var(--bgdark, #05070D); color: #fff; }
.blk-couleur { background: radial-gradient(700px 360px at 90% 10%, color-mix(in srgb, var(--accent) 30%, transparent), transparent 70%), linear-gradient(135deg, color-mix(in srgb, var(--primary) 80%, #000), var(--bgdark, #05070D)); color: #fff; }
html:not(.is-dark) .blk-couleur { background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary) 60%, #000)); }
html:not(.is-dark) .blk-sombre .mu-btn { color: #fff !important; }

/* Citation : grande, italique, guillemet doré */
.blk-quote blockquote, .bquote blockquote { font-family: var(--font-head); font-style: italic; font-weight: 600; font-size: clamp(1.9rem, 1.1rem + 2.8vw, 3.4rem); line-height: 1.12; position: relative; }
.blk-quote blockquote::before, .bquote blockquote::before { content: "“"; display: block; font-size: 5rem; line-height: .6; color: var(--gold); margin-bottom: 10px; }

/* Texte et photo : portrait éditorial avec cadre doré décalé */
.btxtimg img, .blk-text_image img { border-radius: 4px; box-shadow: 16px 16px 0 -1px color-mix(in srgb, var(--gold) 55%, transparent), 0 40px 70px -30px rgba(0,0,0,.6); object-position: center 20%; }

/* Vidéos : vignettes cinéma */
.video-grid .video-load, .bvgal .video-load, .ep-embed .video-load { border-radius: 6px; overflow: hidden; }
.video-load .play, .ep-embed .play { background: var(--gold) !important; color: #0B0F1A !important; box-shadow: 0 0 0 10px color-mix(in srgb, var(--gold) 22%, transparent); }
.video-load img { transition: transform .6s; }
.video-load:hover img { transform: scale(1.04); }

/* Galerie : mosaïque serrée */
.bgal .gallery, .gallery-grid { gap: 8px; }
.bgal img, .gallery-grid img { border-radius: 3px; }

/* Formulaire de booking */
.bform .form, .bcontact-form { border: 1px solid var(--line); border-radius: 14px; padding: clamp(18px, 3vw, 34px); background: color-mix(in srgb, var(--paper) 92%, var(--accent)); }

/* Réseaux sociaux */
.bsocial ul { gap: 12px; }
.bsocial .soc { border: 1px solid var(--line); border-radius: 999px; padding: 12px 22px; text-transform: uppercase; letter-spacing: .14em; font-size: .74rem; font-weight: 600; }
.bsocial .soc:hover { border-color: var(--gold); color: var(--gold); }

/* Nouvelle sortie : vinyle doré */
.mu-rel-title { font-style: italic; }
.mu-disc { box-shadow: 0 0 0 1px color-mix(in srgb, var(--gold) 35%, transparent), 0 20px 40px -20px rgba(0,0,0,.7); }
.mu-disc span { box-shadow: 0 0 0 6px #0c0c0e, 0 0 0 7px color-mix(in srgb, var(--gold) 50%, transparent); }
.mu-chip { color: var(--gold); }
.mu-card-play { background: var(--gold); color: #0B0F1A; }
.mu-card-body h3 { font-family: var(--font-head); font-size: 1.25rem; }

/* Pied de page */
.site-footer { background: var(--bgdark, #05070D); border-top: 1px solid var(--line); color: rgba(255,255,255,.78); }
.site-footer .footer-name { font-family: var(--font-head); font-size: 1.7rem; letter-spacing: .12em; text-transform: uppercase; color: #fff; }
.site-footer a:hover { color: var(--gold); }

/* Animations marquées mais élégantes */
.motion-expressive .hero-full::before { animation: au-zoom 18s ease-out both; }
@keyframes au-zoom { from { transform: scale(1.08); } to { transform: scale(1); } }
@media (prefers-reduced-motion: reduce) { .hero-full::before { animation: none !important; } }
@media (max-width: 700px) { .site-header .brand-text strong { font-size: 1.05rem; letter-spacing: .1em; } .btn { padding: 13px 22px; } }
html:not(.is-dark) .hdr-overlay.is-scrolled .site-header .brand img, html:not(.is-dark) body:not(.hdr-overlay) .site-header .brand img { filter: brightness(.22) sepia(.4); }
