:root {
    --night-blue: 220 49% 10%;
    --deep-blue: 210 35% 12%;
    --royal-blue: 210 32% 15%;
    --slate-blue: 210 28% 18%;
    --gold: 39 43% 60%;
    --gold-light: 41 40% 70%;
    --gold-muted: 41 25% 45%;
    --pearl: 210 20% 92%;
    --silver: 210 15% 70%;
    --whisper: 210 12% 80%;
    --background: var(--night-blue);
    --foreground: var(--pearl);
    --card: var(--deep-blue);
    --card-foreground: var(--pearl);
    --card-border: var(--slate-blue);
    --primary: var(--gold);
    --primary-foreground: var(--night-blue);
    --primary-muted: var(--gold-muted);
    --secondary: var(--royal-blue);
    --secondary-foreground: var(--pearl);
    --muted: var(--silver);
    --muted-foreground: var(--whisper);
    --accent: var(--gold);
    --accent-foreground: var(--night-blue);
    --border: var(--slate-blue);
    --input: var(--royal-blue);
    --ring: var(--gold);
    --gradient-premium: linear-gradient(135deg, hsl(var(--gold)), hsl(var(--gold-light)));
    --gradient-hero: linear-gradient(180deg, hsl(var(--night-blue)), hsl(var(--deep-blue)));
    --gradient-glow: radial-gradient(circle at center, hsl(var(--gold) / .15), transparent);
    --shadow-soft: 0 4px 20px hsl(var(--night-blue) / .3);
    --shadow-premium: 0 10px 40px hsl(var(--night-blue) / .4);
    --shadow-gold: 0 0 30px hsl(var(--gold) / .2);
    --transition-smooth: all .4s cubic-bezier(.4, 0, .2, 1);
    --transition-spring: all .6s cubic-bezier(.34, 1.56, .64, 1);
    --radius: 16px;



}

html,
:host {
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    -moz-tab-size: 4;
    -o-tab-size: 4;
    tab-size: 4;
    font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", Segoe UI Symbol, "Noto Color Emoji";
    font-feature-settings: normal;
    font-variation-settings: normal;
    -webkit-tap-highlight-color: transparent
}

* {
    box-sizing: border-box;
}


html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    font-family: Inter, system-ui, sans-serif;
    color: hsl(var(--ink));
    background: hsl(var(--background));
}

header {
    border-bottom: 1px solid hsl(var(--gold)/0.4);
}

.btn-premium {
    background: var(--gradient-premium);
    box-shadow: var(--shadow-soft), inset 0 1px hsl(var(--gold-light) / .3);
    transition: var(--transition-smooth)
}

.btn-premium:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-premium), var(--shadow-gold)
}

.card-premium {
    background: color-mix(in srgb, hsl(var(--card)) 92%, transparent);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    border: 1px solid hsl(var(--card-border) / .6);
    box-shadow: var(--shadow-soft);
    transition: var(--transition-smooth)
}

.card-premium:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-premium);
    border-color: hsl(var(--gold) / .3)
}

.text-primary {
    color: hsl(var(--accent))
}

.text-foreground {
    color: hsl(var(--foreground))
}

.text-primary-foreground {
    color: hsl(var(--primary-foreground))
}

.text-muted {
    color: hsl(var(--muted))
}

.text-ink {
    color: hsl(var(--ink))
}

.text-muted-foreground {
    color: hsl(var(--muted-foreground))
}

.text-muted-foreground\/80 {
    color: hsl(var(--muted-foreground) / 0.8)
}

.font-cinzel {
    font-family: Cinzel, serif;
}


.bg-accent {
    background-color: hsl(var(--accent))
}

.bg-background {
    background-color: hsl(var(--background))
}

.bg-black\/80 {
    background-color: #000c
}

.bg-border {
    background-color: hsl(var(--border))
}

.bg-card {
    background-color: hsl(var(--card))
}

.bg-card\/30 {
    background-color: hsl(var(--card) / .3)
}

.bg-foreground {
    background-color: hsl(var(--foreground))
}

.bg-gray-100 {
    --tw-bg-opacity: 1;
    background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1))
}

.bg-muted {
    background-color: hsl(var(--muted))
}

.bg-muted\/50 {
    background-color: hsl(var(--muted) / .5)
}

.bg-primary {
    background-color: hsl(var(--primary))
}

.bg-transparent {
    background-color: transparent
}

.bg-gradient-hero {
    background-image: var(--gradient-hero)
}

.bg-gradient-premium {
    background-image: var(--gradient-premium)
}

.bg-gradient-to-b {
    background-image: linear-gradient(to bottom, var(--tw-gradient-stops))
}

.bg-gradient-to-t {
    background-image: linear-gradient(to top, var(--tw-gradient-stops))
}

.nav-glass {
    -webkit-backdrop-filter: saturate(140%) blur(8px);
    backdrop-filter: saturate(140%) blur(8px);
    background: color-mix(in srgb, hsl(black) 85%, transparent);
    border-bottom: 1px solid hsl(var(--gold) / .2);
}

ul li::marker {
    color: hsl(var(--accent))
}

/* Style global de l’article */
article {
    font-size: 1.05rem;
    line-height: 1.75;
    color: var(--ink, #E8ECF3);
    /* garde ta variable si définie */
}

/* Titres principaux */
article h1 {
    font-family: 'Cinzel', serif;
    font-size: 2rem;
    line-height: 1.2;
    color: var(--primary, #C5A46D);
    margin-bottom: 1.5rem;
}

/* Sous-titres (sections) */
article h2 {
    font-family: 'Cinzel', serif;
    font-size: 1.4rem;
    font-weight: 600;
    margin-top: 2.5rem;
    margin-bottom: 1rem;
    color: var(--foreground, #ffffff);
    border-left: 3px solid var(--primary, #C5A46D);
    padding-left: 0.75rem;
}

/* Paragraphes */
article p {
    margin-bottom: 2rem;
    font-size: 1.05rem;
    line-height: 1.7;
    color: var(--muted-foreground, #d0d3db);
}

/* Mots en gras pour souligner les points clés */
article strong {
    color: var(--primary, #C5A46D);
    font-weight: 600;
}

/* Texte en italique : légèrement adouci */
article em {
    color: var(--foreground, #fff);
    opacity: 0.9;
}

/* Liens dans le contenu */
article a {
    color: var(--primary, #C5A46D);
    text-decoration: underline;
    transition: color 0.2s;
}

article a:hover {
    color: var(--primary-hover, #e2c178);
}

/* Bloc CTA */
article .btn-premium {
    font-size: 1.1rem;
    padding: 0.9rem 2rem;
    margin-top: 2rem;
}

article .btn-premium.m-0 {
    margin: 0 0;
}

main p a,
main div a {
    color: hsl(var(--primary, #C5A46D));
}