@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600;700;900&family=Crimson+Text:ital,wght@0,400;0,600;1,400&display=swap');

/*
 * DRI landing overrides — palette "renseignements" ardoise/bleu.
 * Repose sur index.css pour le layout ; body.dri-landing remplace
 * la palette village par un thème classifié neutre.
 */

:root {
  --dri-bg:               #07080f;
  --dri-parchment-top:    #0d0f1c;
  --dri-parchment-mid:    #0a0c18;
  --dri-parchment-bottom: #070810;
  --dri-panel:            rgba(8,10,24,0.88);
  --dri-panel-soft:       rgba(12,16,34,0.65);
  --dri-card:             rgba(8,10,22,0.82);
  --dri-card-hover:       rgba(14,18,38,0.96);
  --dri-ink-light:        #bccef2;
  --dri-ink-soft:         rgba(172,196,238,0.88);
  --dri-ink-faint:        rgba(150,178,228,0.70);
  --dri-border:           rgba(58,98,182,0.52);
  --dri-border-bright:    rgba(88,144,226,0.95);
  /* Alias pour compatibilité avec les règles qui utilisent --dri-border-gold */
  --dri-border-gold:        rgba(58,98,182,0.52);
  --dri-border-gold-bright: rgba(88,144,226,0.95);
}

/* ------ Body ------ */
body.dri-landing {
  background: var(--dri-bg);
  background-image:
    radial-gradient(ellipse at 18% 22%, #0c0e1e 0%, transparent 55%),
    radial-gradient(ellipse at 82% 78%, #060810 0%, transparent 55%),
    url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%233a62b5' fill-opacity='0.04'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}

body.dri-landing::before {
  background-image:
    radial-gradient(1px 1px at 15% 25%, rgba(75,120,200,0.28), transparent),
    radial-gradient(1px 1px at 45% 65%, rgba(180,40,55,0.22), transparent),
    radial-gradient(1px 1px at 75% 15%, rgba(75,120,200,0.22), transparent),
    radial-gradient(1px 1px at 85% 75%, rgba(180,40,55,0.18), transparent),
    radial-gradient(1px 1px at 25% 85%, rgba(75,120,200,0.18), transparent),
    radial-gradient(1.5px 1.5px at 55% 35%, rgba(88,144,226,0.32), transparent),
    radial-gradient(1px 1px at 35% 55%, rgba(180,40,55,0.14), transparent),
    radial-gradient(1px 1px at 65% 45%, rgba(75,120,200,0.18), transparent);
}

/* ------ Main frame ------ */
body.dri-landing .landing-frame,
body.dri-landing.home-landing .landing-frame {
  background: var(--dri-parchment-mid) !important;
  background-image:
    radial-gradient(ellipse at 20% 15%, rgba(130,168,228,0.08) 0%, transparent 55%),
    radial-gradient(ellipse at 80% 85%, rgba(0,0,0,0.5) 0%, transparent 60%),
    linear-gradient(160deg, var(--dri-parchment-top) 0%, var(--dri-parchment-mid) 45%, var(--dri-parchment-bottom) 100%) !important;
  border-color: rgba(58,98,182,0.6) !important;
  box-shadow:
    0 0 0 2px rgba(4,6,12,0.96),
    0 0 0 8px rgba(58,98,182,0.85),
    0 0 0 10px rgba(4,6,12,0.94),
    0 26px 58px rgba(0,0,0,0.65),
    inset 0 0 52px rgba(180,40,55,0.12) !important;
}

body.dri-landing .landing-frame::before,
body.dri-landing .landing-frame::after,
body.dri-landing .corner-tr,
body.dri-landing .corner-bl {
  color: var(--dri-ink-light);
  text-shadow: 0 0 8px rgba(88,144,226,0.5), 0 0 14px rgba(180,40,55,0.25);
}

/* ------ Watermark ------ */
body.dri-landing .watermark {
  color: rgba(130,165,220,0.06);
  text-shadow: 0 0 30px rgba(180,40,55,0.18);
}

/* ------ Title zone ------ */
body.dri-landing h1 {
  color: var(--dri-ink-light) !important;
  text-shadow: 1px 1px 0 rgba(0,0,0,0.6), 0 0 16px rgba(88,144,226,0.2);
}

body.dri-landing .subtitle {
  color: var(--dri-ink-faint) !important;
  opacity: 0.92;
}

/* ------ Divider & kanjis ------ */
body.dri-landing .divider {
  background: linear-gradient(90deg, transparent, rgba(58,98,182,0.8), rgba(180,40,55,0.6), rgba(58,98,182,0.8), transparent);
}

body.dri-landing .kanji-row {
  color: rgba(88,144,226,0.6);
  opacity: 0.7;
}

/* ------ Hub sections ------ */
body.dri-landing .hub-section,
body.dri-landing.home-landing .hub-section {
  background:
    radial-gradient(ellipse at 20% 20%, rgba(130,168,228,0.07) 0%, transparent 55%),
    linear-gradient(180deg, rgba(10,14,26,0.75), rgba(7,9,18,0.82)) !important;
  border: 1px solid rgba(58,98,182,0.48) !important;
  box-shadow:
    inset 0 0 22px rgba(180,40,55,0.08),
    0 10px 26px rgba(0,0,0,0.4) !important;
}

body.dri-landing .hub-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(180,210,255,0.04), transparent 35%);
  pointer-events: none;
}
body.dri-landing .hub-section { position: relative; }

body.dri-landing .hub-heading {
  border-bottom-color: rgba(58,98,182,0.38) !important;
}
body.dri-landing .hub-kicker {
  color: var(--dri-ink-faint) !important;
}
body.dri-landing .hub-heading h2 {
  color: var(--dri-ink-light) !important;
  text-shadow: 1px 1px 0 rgba(0,0,0,0.5);
}
body.dri-landing .hub-heading p {
  color: rgba(162,192,238,0.72) !important;
}

/* ------ Nav overview ------ */
body.dri-landing .nav-overview {
  background:
    radial-gradient(circle at right top, rgba(88,144,226,0.14), transparent 34%),
    linear-gradient(135deg, rgba(10,14,26,0.80), rgba(7,9,18,0.86));
  border-color: rgba(58,98,182,0.5);
  box-shadow: inset 0 0 22px rgba(180,40,55,0.06);
}
body.dri-landing .nav-overview-kicker { color: var(--dri-ink-faint); }
body.dri-landing .nav-overview-copy { color: rgba(162,192,238,0.82); }
body.dri-landing .nav-overview-ribbon span {
  background: rgba(6,8,18,0.65);
  border-color: rgba(58,98,182,0.42);
  color: var(--dri-ink-light);
}

/* ------ Nav cards ------ */
body.dri-landing .nav-card,
body.dri-landing .nav-card--dri,
body.dri-landing.home-landing .nav-card,
body.dri-landing.home-landing .nav-card--feature,
body.dri-landing.home-landing .nav-shell.public-only .nav-card {
  --card-accent: rgba(58,98,182,0.58);
  background:
    radial-gradient(circle at top right, rgba(20,30,60,0.22), rgba(8,10,22,0.84) 34%, rgba(6,8,18,0.96) 100%) !important;
  border: 1px solid var(--card-accent) !important;
  box-shadow:
    inset 0 1px 0 rgba(88,144,226,0.14),
    inset 0 -10px 24px rgba(180,40,55,0.06),
    0 8px 20px rgba(0,0,0,0.5) !important;
}

body.dri-landing .nav-card::before {
  background:
    radial-gradient(circle at top right, rgba(88,144,226,0.14), transparent 30%),
    linear-gradient(135deg, rgba(20,30,60,0.10), transparent 55%);
  opacity: 0.85;
}
body.dri-landing .nav-card::after {
  background: linear-gradient(90deg, transparent, rgba(58,98,182,0.30), transparent);
}
body.dri-landing .nav-card:hover {
  transform: translateY(-4px);
  border-color: var(--dri-border-bright) !important;
  background:
    radial-gradient(circle at top right, rgba(88,144,226,0.18), rgba(12,16,32,0.92) 34%, rgba(8,10,22,0.97) 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(88,144,226,0.26),
    inset 0 -10px 26px rgba(180,40,55,0.10),
    0 16px 32px rgba(0,0,0,0.6),
    0 0 22px rgba(88,144,226,0.14) !important;
}
body.dri-landing .nav-card-title {
  color: var(--dri-ink-light) !important;
  text-shadow: 1px 1px 0 rgba(0,0,0,0.5);
}
body.dri-landing .nav-card-desc {
  color: rgba(162,192,238,0.78) !important;
}
body.dri-landing .nav-card-icon {
  filter: drop-shadow(0 4px 10px rgba(58,98,182,0.35));
}

/* ------ Stamp + footer ------ */
body.dri-landing .stamp {
  color: #c0bce8;
  border-color: #8898c8;
  background: rgba(58,98,182,0.22);
  box-shadow: inset 0 0 12px rgba(88,144,226,0.10);
  text-shadow: 0 0 6px rgba(88,144,226,0.30);
  opacity: 0.88;
}
body.dri-landing .footer-text {
  color: rgba(150,178,228,0.60);
}

/* ------ Logo pulse ------ */
body.dri-landing .logo-svg {
  animation: dri-logo-pulse 4s ease-in-out infinite;
}
@keyframes dri-logo-pulse {
  0%, 100% { filter: drop-shadow(0 4px 12px rgba(0,0,0,0.55)); }
  50%       { filter: drop-shadow(0 4px 22px rgba(58,98,182,0.45)); }
}

/* ------ User-bar chrome ------ */
body.dri-landing .user-badge,
body.dri-landing .btn-user-action {
  border-color: var(--dri-border);
}
body.dri-landing .btn-user-back {
  color: var(--dri-ink-light);
  background: rgba(10,14,28,0.90);
  border: 1px solid var(--dri-border);
}
body.dri-landing .btn-user-back:hover {
  background: rgba(20,35,72,0.96);
  border-color: var(--dri-border-bright);
}