/* ==========================================================================
   Habillage « plateforme de courses » (inspiré de finishers.com) :
   fond clair chaud, en-tête simple, titres forts, cartes nettes à bordure fine,
   boutons en pastille, bandeau d'appel à l'action plein. Chargé après style.css.
   Palette « cèdre & Atlas » :
     --brand  vert cèdre : liens, prix, repères
     --cta    terracotta  : boutons et appels à l'action
   Changez ces variables pour rhabiller tout le site.
   ========================================================================== */

:root {
    --font: "Plus Jakarta Sans", ubuntu, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --brand: #4FBF8A; --brand-deep: #7ADBAA; --brand-ink: #04120A; --brand-soft: rgba(79,191,138,.14);
    --cta: #F59E5B; --cta-deep: #FFB77E; --cta-ink: #2A1204;
    --band: #0B4A33; --line-strong: rgba(255,255,255,.22);
    --glass: #16301F; --glass-strong: #1D3A27; --glass-line: rgba(255,255,255,.12);
    --grad: linear-gradient(120deg, #F59E5B 0%, #FFB77E 100%);
    --paint: #F59E5B; --paint-ink: #2A1204;
    --radius: 18px;
}
:root[data-theme="light"] {
    --bg: #FAF8F3; --surface: #F2EEE4; --ink: #14211A; --muted: #5B685F;
    --line: #E6E0D2; --line-strong: #D3CBB8;
    --glass: #FFFFFF; --glass-strong: #F2EEE4; --glass-line: #E6E0D2; --field: #FFFFFF;
    --brand: #0F6B49; --brand-deep: #0A5239; --brand-ink: #FFFFFF; --brand-soft: #E3F1EA;
    --cta: #C2410C; --cta-deep: #9A3412; --cta-ink: #FFFFFF;
    --band: #0B4A33;
    --aqua: #0F6B49; --violet: #0F6B49; --paint: #C2410C; --paint-ink: #FFFFFF; --focus: #0F6B49;
    --grad: linear-gradient(120deg, #C2410C 0%, #DD5A1C 100%);
    --shadow: 0 1px 2px rgba(20,33,26,.05), 0 10px 28px -14px rgba(20,33,26,.2);
}

/* fond uni : plus d'aurores */
body::before, body::after, :root[data-theme="light"] body::after { display: none !important; }
body { font-family: var(--font); }

/* titres */
h1, h2, h3 { font-weight: 800; letter-spacing: -.03em; line-height: 1.12; }
.page-head h1 { font-size: clamp(32px, 5vw, 52px); }
.page-head::after { width: 56px; height: 5px; box-shadow: none; background: var(--cta); }
.section > h2 { text-align: left; text-transform: none; letter-spacing: -.03em; font-size: clamp(26px, 4vw, 40px); /*! margin-bottom: 20px; */ }
.section > h2::before { display: none; }
.section > p { text-align: left !important; color: var(--muted); max-width: 70ch; margin: 0 0 26px; }
.eyebrow { margin: 0 0 6px; font: 700 14px/1.3 var(--font); color: var(--brand); letter-spacing: .01em; }
.section > .eyebrow { max-width: none; margin-bottom: 6px; color: var(--brand); }

/* en-tête : barre claire, trait fin */
.site-head .ins { background: var(--bg); border: 0; border-bottom: 1px solid var(--line); border-radius: 0; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
.site-head .in { padding-top: 10px; padding-bottom: 10px; }
.nav a, .nav button { color: var(--ink); font-weight: 600; border-radius: 999px; }
.nav a:hover, .nav button:hover { background: var(--glass-strong); color: var(--ink); }
.nav a[aria-current=page] { color: var(--brand); background: var(--brand-soft); }
.nav a.cta { background: var(--cta); color: var(--cta-ink); box-shadow: none; padding: 0 20px; }
.nav a.cta:hover { background: var(--cta-deep); color: var(--cta-ink); filter: none; }
.theme-toggle, .nav-toggle { color: var(--ink); }

/* boutons : pastille pleine terracotta, sans reflet */
button, .btn { background: var(--cta); background-image: none; color: var(--cta-ink); border-radius: 999px; box-shadow: none; min-height: 50px; font-weight: 700; }
button::after, .btn::after { display: none; }
button:hover, .btn:hover { background: var(--cta-deep); transform: none; box-shadow: none; }
button:active, .btn:active { transform: scale(.985); box-shadow: none; }
.btn.alt, .logout { background: transparent; color: var(--ink); border: 1.5px solid var(--line-strong); box-shadow: none; }
.btn.alt:hover, .logout:hover { background: var(--glass-strong); border-color: var(--brand); box-shadow: none; }
.nav button, .theme-toggle, .nav-toggle { background: none; }
.nav button:hover { background: var(--glass-strong); }

/* cartes et formulaires : fond uni, bordure fine, ombre discrète */
form, .box, .tile, .stat, .done, .tblwrap, .kpi, .slide, .g-item { background: var(--glass); border: 1px solid var(--line); box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
:root:not([data-theme="light"]) :is(form, .box, .tile, .stat, .done, .tblwrap, .kpi, .slide, .g-item) { border-color: var(--glass-line); }
.nav form, form.inline, form.gm-f { border: 0; background: none; }
.alert, .notice, .filterbar .pill, .cd-unit { -webkit-backdrop-filter: none; backdrop-filter: none; }
.tile { border-radius: var(--radius); padding: 20px; transition: box-shadow .2s, border-color .2s, transform .2s; }
.tile:hover, a.tile:hover { transform: translateY(-3px); border-color: var(--brand); box-shadow: var(--shadow); }
.tile .price { color: var(--brand); font-weight: 800; }
.kpi b { background: none; -webkit-background-clip: border-box; background-clip: border-box; color: var(--brand); }
.kpi-l { letter-spacing: .06em; }
input, select, textarea { background: var(--field); border: 1px solid var(--line-strong); border-radius: 12px; }
input:hover, select:hover, textarea:hover { border-color: var(--brand); }
input:focus, select:focus, textarea:focus { border-color: var(--brand); box-shadow: 0 0 0 4px var(--brand-soft); background: var(--field); }

/* accueil : grande carte image avec titre */
.hero { width: calc(100% - 32px); max-width: 1320px; margin: 16px auto 0; border-radius: 28px; }
@media (max-width: 640px) { .hero { width: calc(100% - 16px); border-radius: 20px; } }
.hero::before { display: none; }
.hero-shade { /*! background: linear-gradient(180deg, rgba(5,14,10,.30), rgba(5,14,10,.28) 40%, rgba(5,14,10,.74)); */ }
.hero.has-video h1 { text-transform: none; font-weight: 800; /*! letter-spacing: -.035em; */ text-transform: uppercase;}
.hero.has-video h2 { color: #F3E38A; -webkit-text-fill-color: #F3E38A; text-transform: none; font-weight: 700; letter-spacing: -.01em; }
.hero .kicker { border-radius: 999px; padding: 6px 14px; background: rgba(255,255,255,.16); border-color: rgba(255,255,255,.3); }
.hero .btn { background: var(--cta); color: var(--cta-ink); }
.hero .btn:hover { background: var(--cta-deep); }
.hero .btn.alt { background: transparent; color: #fff; border-color: rgba(255,255,255,.7); }
.hero .btn.alt:hover { background: rgba(255,255,255,.14); }

/* bandeau d'appel à l'action : aplat vert cèdre profond */
.cta-band { background: var(--band); border: 0; border-radius: 28px; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; color: #fff; text-align: left; }
.cta-band::before { display: none; }
.cta-band h2 { color: #fff; max-width: 22ch; margin-left: 0; }
.cta-band p { color: rgba(255,255,255,.82); margin-left: 0; }
.cta-band .actions { justify-content: flex-start; }
.cta-band .btn { background: var(--cta); color: var(--cta-ink); }
.cta-band .btn:hover { background: var(--cta-deep); }
.cta-band .btn.alt { background: transparent; color: #fff; border-color: rgba(255,255,255,.7); }
.cta-band .btn.alt:hover { background: rgba(255,255,255,.12); }
:root[data-theme="light"] .cta-band .btn { background: #fff; color: var(--cta); }
:root[data-theme="light"] .cta-band .btn:hover { background: #FBEDE5; }

/* bandeau des valeurs : voile clair sur l'image */
:root[data-theme="light"] .values-band { --values-overlay: linear-gradient(180deg, rgba(250,248,243,.93), rgba(250,248,243,.8) 50%, rgba(250,248,243,.95)); }

/* pied de page : bande sable, liens sobres */
.site-foot { margin-top: 72px; }
.site-foot .ins { background: var(--surface); border: 0; border-top: 1px solid var(--line); border-radius: 0; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
.site-foot a { color: var(--ink); }
.site-foot a:hover { color: var(--brand); }
.site-foot h2 { color: var(--ink); letter-spacing: .08em; }
.site-foot p, .site-foot .legal { color: var(--muted); }