/* Livrée LVMH — pages action de MC.PA (templates/quote/lvmh/). Feuille servie telle quelle, comme assembly.css. Tout est scopé sous .quote-lvmh, la classe que les gabarits LVMH posent sur via le bloc bodyClass : hors de ces pages, rien ne s'applique. Elle surcharge localement le design system (bleu → noir) et inverse la navbar sur la voûte. */ /* Polices de la livrée, servies en local (sous-ensemble latin, woff2). Cormorant Garamond et DM Sans sont des polices variables : un seul fichier couvre les graisses 400 à 700, plus l'italique de Cormorant. */ @font-face { font-family: 'Cormorant Garamond'; font-style: normal; font-weight: 300 700; font-display: swap; src: url("../fonts/cormorant-garamond-variable-1nPjtOG.woff2") format('woff2'); } @font-face { font-family: 'Cormorant Garamond'; font-style: italic; font-weight: 300 700; font-display: swap; src: url("../fonts/cormorant-garamond-italic-sGQFVbM.woff2") format('woff2'); } @font-face { font-family: 'DM Sans'; font-style: normal; font-weight: 100 1000; font-display: swap; src: url("../fonts/dm-sans-variable-tzGc3mA.woff2") format('woff2'); } .quote-lvmh { --lv-ink: #0a0807; --lv-panel: #14100d; --lv-panel-2: #1b1511; --lv-ivory: #f2ece3; --lv-ivory-70: rgba(242,236,227,.70); --lv-ivory-45: rgba(242,236,227,.45); --lv-ivory-30: rgba(242,236,227,.28); --lv-line: rgba(242,236,227,.12); --lv-gold: #d4a463; --lv-gold-2: #b98a4a; background: var(--lv-ink) var(--lv-hero) no-repeat center top / 100% auto; overflow-x: clip; /* ceinture : rien ne doit provoquer de défilement horizontal */ color: var(--lv-ivory); /* Design system surchargé pour cette seule page : le bleu du site devient noir. Les utilitaires Tailwind lisent ces variables, le reste du site ne bouge pas. */ --color-blue-800: #000000; --color-blue-700: #0a0a0a; --color-blue-600: #111111; --color-blue-500: #111111; --color-blue-400: #bdbdbd; --color-blue-300: #efefef; --color-blue-200: #f3f3f3; --color-blue-100: #f8f8f8; --color-brand-800: #111111; --color-brand-700: #161616; --color-brand-600: #1c1c1c; --color-brand-500: #242424; --color-brand-400: #3a3a3a; --color-brand-300: #bdbdbd; --color-brand-200: #f3f3f3; --color-brand-100: #f8f8f8; --color-accent: #111111; --color-accent-dim: #000000; } /* Navbar : markup et hauteur du site, couleurs inversées sur la voûte qui commence derrière elle. Les boutons pleins passent en ivoire, les boutons sans fond en clair. */ .quote-lvmh #navbar { background: rgba(10,8,7,.28); border-color: rgba(242,236,227,.12); box-shadow: none; backdrop-filter: blur(14px) saturate(140%); -webkit-backdrop-filter: blur(14px) saturate(140%); } .quote-lvmh #navbar [data-nav-group="logo"] svg, .quote-lvmh #navbar [data-nav-group="logo"] span { color: var(--lv-ivory); } .quote-lvmh #navbar .search-trigger { background: transparent; border-color: rgba(242,236,227,.35); } .quote-lvmh #navbar .search-trigger, .quote-lvmh #navbar .search-trigger svg, .quote-lvmh #navbar .search-trigger span { color: var(--lv-ivory-70); } .quote-lvmh #navbar .nav-link, .quote-lvmh #navbar .nav-link svg { color: var(--lv-ivory-70); } .quote-lvmh #navbar .nav-link:hover, .quote-lvmh #navbar .nav-link:hover svg, .quote-lvmh #navbar .nav-link--active { color: var(--lv-ivory); background: transparent; } .quote-lvmh #navbar .bg-blue-500, .quote-lvmh #navbar .btn-primary { background: var(--lv-ivory); color: var(--lv-ink); border-color: var(--lv-ivory); box-shadow: none; } .quote-lvmh #navbar .bg-blue-500 svg, .quote-lvmh #navbar .btn-primary svg { color: var(--lv-ink); } .quote-lvmh #navbar .btn-outline { color: var(--lv-ivory); border-color: rgba(242,236,227,.5); background: transparent; } .quote-lvmh #navbar .btn-outline:hover { background: var(--lv-ivory); color: var(--lv-ink); } .quote-lvmh #navbar .text-blue-500 { color: var(--lv-ivory); } .quote-lvmh #navbar .nav-avatar-button .text-brand-800 { color: var(--lv-ivory); } .quote-lvmh #navbar .nav-avatar-button .bg-gradient-to-br { background: var(--lv-ivory); color: var(--lv-ink); } .quote-lvmh #navbar .nav-avatar-button .text-neutral-400, .quote-lvmh #navbar .nav-menu-summary .text-neutral-400 { color: var(--lv-ivory-45); } .quote-lvmh #navbar .nav-avatar-button:hover, .quote-lvmh #navbar .nav-menu-summary:hover { background: rgba(242,236,227,.1); } .quote-lvmh #navbar .nav-menu-panel, .quote-lvmh #navbar .nav-menu-panel .text-brand-800 { color: #01192a; } /* Bandeau d'essai Premium (base.html.twig, sous la navbar) : verre sombre sur la voûte */ .quote-lvmh .premium-trial-banner { background: rgba(10,8,7,.45); color: var(--lv-ivory); border-color: rgba(242,236,227,.12); backdrop-filter: blur(14px) saturate(140%); -webkit-backdrop-filter: blur(14px) saturate(140%); } .quote-lvmh .premium-trial-banner .text-neutral-700 { color: var(--lv-ivory-70); } .quote-lvmh .premium-trial-banner .bg-blue-500 { background: var(--lv-ivory); color: var(--lv-ink); } .quote-lvmh .premium-trial-banner .text-blue-700 { color: var(--lv-ivory); } /* Le divider du header, en clair sur la voûte */ .quote-lvmh .lv-hero-divider .bg-neutral-300 { background: rgba(242,236,227,.16); } .quote-lvmh .lv-hero-divider .text-neutral-700 { color: var(--lv-ivory-45); } .quote-lvmh main { padding-left: 0; padding-right: 0; max-width: none; } .lv-serif { font-family: 'Cormorant Garamond', Georgia, serif; } .lv-sans { font-family: 'DM Sans', system-ui, sans-serif; } .lv-cap { font-family: 'DM Sans', system-ui, sans-serif; font-size: 11px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: var(--lv-gold); } .lv-cap--muted { color: var(--lv-ivory-45); letter-spacing: .16em; font-size: 10px; } .lv-body { font-family: 'DM Sans', system-ui, sans-serif; font-size: 18px; line-height: 1.7; color: var(--lv-ivory-70); } .lv-body strong { color: var(--lv-ivory); font-weight: 500; } .lv-h2 { font-family: 'Cormorant Garamond', Georgia, serif; font-weight: 500; font-size: 46px; line-height: 1.1; letter-spacing: -.01em; color: var(--lv-ivory); text-wrap: balance; margin: 0; } .lv-num { font-family: 'Cormorant Garamond', Georgia, serif; font-size: 44px; line-height: 1; color: var(--lv-ivory); font-variant-numeric: tabular-nums; } .lv-panel { background: var(--lv-panel); border: 1px solid var(--lv-line); } .lv-grid { display: grid; gap: 1px; background: var(--lv-line); border: 1px solid var(--lv-line); } .lv-cell { display: flex; flex-direction: column; gap: 8px; padding: 28px; background: var(--lv-panel); } .lv-h3 { margin: 0; font-family: 'Cormorant Garamond', Georgia, serif; font-weight: 500; font-size: 24px; line-height: 1.2; color: var(--lv-ivory); } .lv-body--sm { font-size: 15px; } .lv-cap--wide { letter-spacing: .18em; } /* L'infobulle d'aide du design system, posée dans un libellé en capitales : elle reprend la casse et la police du texte courant */ .quote-lvmh [role="tooltip"] { text-transform: none; letter-spacing: 0; font-family: var(--font-body); font-weight: 500; z-index: 30; } /* Une bulle invisible (opacity 0) compte quand même dans le débordement de la page : dans la colonne de droite d'une grille bord à bord, elle dépassait le viewport et créait un défilement horizontal. On la sort du flux tant qu'elle n'est pas affichée. */ .quote-lvmh [role="tooltip"] { display: none; } .quote-lvmh .group:hover > [role="tooltip"], .quote-lvmh .group:focus-within > [role="tooltip"] { display: block; } /* Fourchette 52 semaines : le point est placé en pourcentage de la ligne */ .lv-range { position: relative; display: flex; flex-direction: column; gap: 10px; padding-top: 34px; } .lv-range-price { position: absolute; top: 0; transform: translateX(-50%); font-family: 'Cormorant Garamond', Georgia, serif; font-size: 24px; line-height: 1; color: var(--lv-ivory); white-space: nowrap; } .lv-range-price--start { transform: none; left: 0; } .lv-range-price--end { transform: none; right: 0; } .lv-range-track { position: relative; display: block; height: 1px; background: var(--lv-line); } .lv-range-fill { position: absolute; left: 0; top: 0; height: 2px; margin-top: -.5px; background: var(--lv-gold); } .lv-range-dot { position: absolute; top: 50%; width: 12px; height: 12px; margin: -6px 0 0 -6px; border-radius: 50%; background: var(--lv-gold); } .lv-range-ends { display: flex; justify-content: space-between; gap: 16px; font-family: 'DM Sans', system-ui, sans-serif; font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--lv-ivory-45); } .lv-line { border-color: var(--lv-line); } .lv-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 40px; padding: 0 20px; border-radius: 999px; font-family: var(--font-body); font-size: 14px; font-weight: 600; text-decoration: none; cursor: pointer; white-space: nowrap; } .lv-btn--ivory { background: var(--lv-ivory); color: var(--lv-ink); border: 1px solid var(--lv-ivory); } .lv-btn--ivory:hover { background: #fff; } .lv-btn--ghost { background: transparent; color: var(--lv-ivory); border: 1px solid rgba(242,236,227,.35); } .lv-btn--ghost:hover { border-color: var(--lv-ivory); } .lv-tab { font-family: var(--font-body); font-size: 14px; font-weight: 500; text-decoration: none; padding: 12px 16px; color: var(--lv-ivory-70); border-bottom: 2px solid transparent; display: inline-flex; align-items: center; white-space: nowrap; transition: color .2s, border-color .2s; } .lv-tab:hover { color: var(--lv-ivory); } .lv-tab--active { color: var(--lv-ivory); border-bottom-color: var(--lv-ivory); } .lv-door { display: flex; flex-direction: column; gap: 10px; padding: 26px 28px; border: 1px solid var(--lv-line); text-decoration: none; color: inherit; } .lv-door:hover { border-color: var(--lv-gold-2); } /* Pleine largeur : main est déjà sans largeur maximale sur ces pages (règle ci-dessus), donc pas de 100vw — cette unité inclut la barre de défilement et crée un défilement horizontal quand elle est visible. */ .lv-bleed { width: 100%; } .lv-pill { display: inline-flex; align-items: center; gap: 6px; height: 22px; padding: 0 8px; border-radius: 6px; font-size: 12px; font-weight: 600; } .lv-meta { display: inline-flex; align-items: center; gap: 6px; } .lv-meta svg { color: var(--lv-ivory-45); } .lv-editorial a { color: var(--lv-gold); } .lv-editorial a:hover { color: var(--lv-ivory); } /* ── Prose générée (Analyse IA) : le HTML du modèle tel quel, seulement mis en forme ── Le rythme vertical est porté par les enfants directs, dans cet ordre de règles : tout à zéro, puis l'espacement courant, puis l'air avant un intertitre, puis le resserrement après lui. */ .lv-prose { font-family: 'DM Sans', system-ui, sans-serif; font-size: 18px; line-height: 1.75; color: var(--lv-ivory-70); } .lv-prose > * { margin: 0; } .lv-prose > * + * { margin-top: 1.25em; } .lv-prose > h2 { margin-top: 2.4em; } .lv-prose > h3 { margin-top: 1.9em; } .lv-prose > h4 { margin-top: 1.5em; } .lv-prose > h2 + *, .lv-prose > h3 + *, .lv-prose > h4 + * { margin-top: 1em; } .lv-prose > :first-child { margin-top: 0; } .lv-prose h1, .lv-prose h2, .lv-prose h3, .lv-prose h4 { font-family: 'Cormorant Garamond', Georgia, serif; font-weight: 500; color: var(--lv-ivory); letter-spacing: -.01em; line-height: 1.15; } .lv-prose h2 { font-size: 40px; } .lv-prose h3 { font-size: 30px; } .lv-prose h4 { font-size: 22px; } .lv-prose strong, .lv-prose b { color: var(--lv-ivory); font-weight: 500; } .lv-prose em { color: var(--lv-ivory); } .lv-prose a { color: var(--lv-gold); text-decoration: underline; text-underline-offset: 3px; } .lv-prose ul, .lv-prose ol { padding-left: 1.4em; list-style: disc; } .lv-prose ol { list-style: decimal; } .lv-prose li + li { margin-top: .5em; } .lv-prose li::marker { color: var(--lv-gold); } .lv-prose blockquote { padding: .4em 0 .4em 1.4em; border-left: 1px solid var(--lv-gold); font-family: 'Cormorant Garamond', Georgia, serif; font-style: italic; font-size: 26px; line-height: 1.35; color: var(--lv-ivory); } .lv-prose hr { border: 0; height: 1px; background: var(--lv-line); margin: 2.5em 0; } .lv-prose table { width: 100%; border-collapse: collapse; font-size: 15px; } .lv-prose th, .lv-prose td { padding: .6em .8em; border-bottom: 1px solid var(--lv-line); text-align: left; vertical-align: top; } .lv-prose th { font-size: 11px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--lv-ivory-45); } .lv-prose td { color: var(--lv-ivory-70); } .lv-prose img { max-width: 100%; height: auto; } /* ── Composants du site sur fond sombre ────────────────────────────────────── Les partials partagés (fil communautaire, événements, sources, actualités du Radar, FAQ) gardent leur markup et leurs classes ; on remappe ici les couleurs du design system vers la livrée. Un seul endroit à tenir quand un partial évolue. */ .lv-dark-ds { color: var(--lv-ivory-70); } .lv-dark-ds .bg-white, .lv-dark-ds .bg-neutral-50, .lv-dark-ds .bg-neutral-100, .lv-dark-ds .bg-blue-50, .lv-dark-ds .bg-brand-100, .lv-dark-ds .bg-brand-200 { background-color: var(--lv-panel); } .lv-dark-ds .border-neutral-200, .lv-dark-ds .border-neutral-300, .lv-dark-ds .border-blue-200, .lv-dark-ds .divide-neutral-200 > * { border-color: var(--lv-line); } .lv-dark-ds .bg-neutral-200, .lv-dark-ds .bg-neutral-300 { background-color: var(--lv-line); } .lv-dark-ds .text-brand-800, .lv-dark-ds .text-brand-700, .lv-dark-ds .text-neutral-900, .lv-dark-ds .text-neutral-800, .lv-dark-ds .text-blue-700 { color: var(--lv-ivory); } .lv-dark-ds .text-neutral-700, .lv-dark-ds .text-neutral-600 { color: var(--lv-ivory-70); } .lv-dark-ds .text-neutral-500, .lv-dark-ds .text-neutral-400, .lv-dark-ds .text-neutral-300 { color: var(--lv-ivory-45); } .lv-dark-ds .text-blue-600, .lv-dark-ds .text-blue-500, .lv-dark-ds .text-brand-400 { color: var(--lv-gold); } .lv-dark-ds h2, .lv-dark-ds h3 { font-family: 'Cormorant Garamond', Georgia, serif; font-weight: 500; letter-spacing: -.01em; } .lv-dark-ds h2 { font-size: 30px; } .lv-dark-ds h3 { font-size: 20px; } .lv-dark-ds .bg-success-100 { background-color: rgba(143,176,138,.18); } .lv-dark-ds .text-success-600 { color: #8fb08a; } .lv-dark-ds .bg-error-100 { background-color: rgba(201,138,138,.18); } .lv-dark-ds .text-error-600 { color: #c98a8a; } .lv-dark-ds .bg-warning-100 { background-color: rgba(212,164,99,.18); } .lv-dark-ds .text-warning-600 { color: var(--lv-gold); } .lv-dark-ds .btn-outline { color: var(--lv-ivory); border-color: rgba(242,236,227,.35); background: transparent; } .lv-dark-ds .btn-outline:hover { background: var(--lv-ivory); color: var(--lv-ink); } .lv-dark-ds input, .lv-dark-ds textarea { color: var(--lv-ivory); } .lv-dark-ds input::placeholder, .lv-dark-ds textarea::placeholder { color: var(--lv-ivory-45); } .lv-dark-ds a { color: var(--lv-gold); } .lv-dark-ds .bg-brand-700 { background-color: var(--lv-panel); border: 1px solid rgba(212,164,99,.35); } .lv-dark-ds .card-default, .lv-dark-ds .card-hover { background-color: var(--lv-panel); border-color: var(--lv-line); box-shadow: none; border-radius: 0; } .lv-dark-ds .badge-base { background-color: rgba(242,236,227,.08); color: var(--lv-ivory-70); border-color: var(--lv-line); } .lv-dark-ds .badge-base svg { color: var(--lv-gold); } /* ── Écrans étroits : les onglets s'empilent pour être tous visibles d'un regard (l'actif est marqué par un filet doré à gauche), les grands chiffres et les titres se resserrent, la frise garde des étiquettes lisibles (ses tailles sont en unités du viewBox, 1008 de large). ── */ @media (max-width: 767px) { .lv-tabs { flex-direction: column; border-top: 1px solid var(--lv-line); } .lv-tab { padding: 14px 16px; border-bottom: 1px solid var(--lv-line); border-left: 2px solid transparent; } .lv-tab--active { border-bottom-color: var(--lv-line); border-left-color: var(--lv-gold); } .lv-num { font-size: 32px; } .lv-h2 { font-size: 32px; } .lv-cap--muted { font-size: 11px; } .lv-body { font-size: 17px; } .lv-cell { padding: 20px; } .lv-frise text { font-size: 28px; } .lv-frise .lv-frise-max { font-size: 56px; } .lv-frise .lv-frise-min { font-size: 44px; } /* Les douze mois : le libellé de ligne passe au-dessus, les mois en une lettre lisible */ .lv-months-row { grid-template-columns: minmax(0, 1fr); gap: 8px; } .lv-months { gap: 2px; } .lv-months .lv-cap { font-size: 9px; letter-spacing: 0; } .lv-prose h2 { font-size: 30px; } .lv-prose h3 { font-size: 24px; } } /* ── Le Radar, bandeau « à la une » sous la navbar : même markup et même mécanique (radar.css), couleurs de la livrée. Verre sombre sur la voûte, anneaux et états en or, texte ivoire. ── */ .quote-lvmh .rdr { --rdr-pos: var(--lv-gold); --rdr-watch: #e0b46b; --rdr-info: var(--lv-ivory-70); --rdr-ink: var(--lv-ivory); --rdr-ink-2: var(--lv-ivory-70); --rdr-muted: var(--lv-ivory-45); --rdr-faint: var(--lv-ivory-30); background: rgba(10,8,7,.45); border-bottom-color: var(--lv-line); font-family: var(--font-body); -webkit-backdrop-filter: blur(14px) saturate(140%); backdrop-filter: blur(14px) saturate(140%); } .quote-lvmh .rdr::after { background: linear-gradient(90deg, transparent, rgba(212,164,99,.55), transparent); } .quote-lvmh .rdr-id { border-right-color: var(--lv-line); } .quote-lvmh .rdr-id-ico { border-color: rgba(212,164,99,.45); background: transparent; color: var(--lv-gold); } .quote-lvmh .rdr-name { font-family: 'Cormorant Garamond', Georgia, serif; font-size: 17px; font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--lv-ivory); } .quote-lvmh .rdr-live { background: var(--lv-gold); box-shadow: 0 0 0 4px rgba(212,164,99,.18); } .quote-lvmh .rdr-ring { background: conic-gradient(from 200deg, var(--lv-gold), rgba(212,164,99,.35), var(--lv-gold)); } .quote-lvmh .rdr-story.is-seen .rdr-ring { background: rgba(242,236,227,.16); } .quote-lvmh .rdr-story.is-active .rdr-ring { background: conic-gradient(from 200deg, var(--lv-ivory), var(--lv-gold), var(--lv-ivory)); } .quote-lvmh .rdr-ring > span, .quote-lvmh .rdr-idt-ring > span { background: var(--lv-ink); } .quote-lvmh .rdr-logo, .quote-lvmh .rdr-idt-logo { background-color: var(--lv-panel); color: var(--lv-ivory); font-family: 'Cormorant Garamond', Georgia, serif; } .quote-lvmh .rdr-logo.has-image, .quote-lvmh .rdr-idt-logo.has-image { background-color: #fff; color: transparent; } .quote-lvmh .rdr-dot { border-color: var(--lv-ink); } .quote-lvmh .rdr-dot svg { color: var(--lv-ink); } .quote-lvmh .rdr-dot.t-neutral, .quote-lvmh .rdr-dot.t-sector { background: var(--lv-ivory-70); } .quote-lvmh .rdr-story:hover, .quote-lvmh .rdr-ico:hover { background: rgba(242,236,227,.08); } .quote-lvmh .rdr-story:focus-visible { outline-color: var(--lv-gold); } .quote-lvmh .rdr-lbl { color: var(--lv-ivory-45); } .quote-lvmh .rdr-story.is-active .rdr-lbl { color: var(--lv-ivory); } .quote-lvmh .rdr-story.is-seen .rdr-lbl { color: var(--lv-ivory-30); } .quote-lvmh .rdr-ico, .quote-lvmh .rdr-arrow { color: var(--lv-ivory-70); } .quote-lvmh .rdr-panel { border-top-color: var(--lv-line); } .quote-lvmh .rdr-glow, .quote-lvmh .rdr-panel[data-tone="positive"] .rdr-glow, .quote-lvmh .rdr-panel[data-tone="watch"] .rdr-glow, .quote-lvmh .rdr-panel[data-tone="sector"] .rdr-glow { background: radial-gradient(620px 260px at 22% 50%, rgba(212,164,99,.16), transparent 70%); } .quote-lvmh .rdr-seg { background: rgba(242,236,227,.16); border-radius: 0; } .quote-lvmh .rdr-seg > i { background: var(--lv-gold); border-radius: 0; } .quote-lvmh .rdr-seg.is-done > i { background: rgba(242,236,227,.5); } .quote-lvmh .rdr-idt-ring { background: conic-gradient(from 200deg, var(--lv-gold), rgba(212,164,99,.35), var(--lv-gold)); } .quote-lvmh .rdr-idt-name, .quote-lvmh .rdr-head { font-family: 'Cormorant Garamond', Georgia, serif; font-weight: 500; color: var(--lv-ivory); } .quote-lvmh .rdr-idt-name { font-size: 24px; } .quote-lvmh .rdr-head { font-size: 28px; line-height: 1.15; } .quote-lvmh a.rdr-idt:hover .rdr-idt-name { color: var(--lv-gold); } .quote-lvmh .rdr-tick, .quote-lvmh .rdr-idt-meta { font-family: 'DM Sans', system-ui, sans-serif; color: var(--lv-ivory-45); } .quote-lvmh .rdr-sep { color: var(--lv-ivory-30); } .quote-lvmh .rdr-pill, .quote-lvmh .rdr-pill.t-positive, .quote-lvmh .rdr-pill.t-neutral, .quote-lvmh .rdr-pill.t-watch, .quote-lvmh .rdr-pill.t-sector { background: transparent; border: 1px solid rgba(212,164,99,.45); color: var(--lv-gold); font-family: 'DM Sans', system-ui, sans-serif; letter-spacing: .16em; text-transform: uppercase; } .quote-lvmh .rdr-ai { color: var(--lv-ivory-45); } .quote-lvmh .rdr-ai svg { color: var(--lv-gold); } .quote-lvmh .rdr-lede { font-family: 'DM Sans', system-ui, sans-serif; color: var(--lv-ivory-70); } .quote-lvmh .rdr-cal { border-color: var(--lv-line); background: rgba(242,236,227,.03); border-radius: 0; } .quote-lvmh .rdr-cal-row { border-bottom-color: var(--lv-line); } .quote-lvmh .rdr-cal-legend { color: var(--lv-ivory-45); } /* Story plein écran (mobile). Le verre du bandeau (backdrop-filter) ferait de .rdr le bloc conteneur du panneau fixé : il resterait coincé dans la hauteur du bandeau. On le retire tant que la story est ouverte, et le fond bleu d'origine devient la voûte noire et or de la livrée. */ .quote-lvmh .rdr.is-fs { -webkit-backdrop-filter: none; backdrop-filter: none; } .quote-lvmh .rdr-panel.is-fs { background: radial-gradient(680px 420px at 20% 6%, rgba(212,164,99,.22), transparent 62%), radial-gradient(560px 380px at 86% 96%, rgba(212,164,99,.10), transparent 60%), linear-gradient(168deg, #0a0807 0%, #100d0b 52%, #0a0807 100%); } .quote-lvmh .rdr-panel.is-fs::after { background: linear-gradient(to top, rgba(10,8,7,.92), rgba(10,8,7,.6) 44%, transparent); } .quote-lvmh .rdr-panel.is-fs .rdr-close, .quote-lvmh .rdr-panel.is-fs .rdr-auto { background: rgba(10,8,7,.55); border-color: var(--lv-line); border-radius: 0; } .quote-lvmh .rdr-panel.is-fs .rdr-acts { border-top-color: var(--lv-line); }