/* SPEEDBOX — Racing identity / V3. Visual extension of the existing accessible V2. */
:root {
 --sb-orange:#E60023;--sb-orange-hover:#FF173B;--sb-orange-active:#BF001D;--sb-orange-text:#B4001B;
 --sb-anthracite:#071E3B;--sb-offwhite:#F5F7FA;--sb-white:#FFFFFF;--sb-grey:#46556A;
 --sb-border:#D3DCE8;--sb-field-border:#53647A;--sb-kraft:#D9B17A;
 --radius:5px;--radius-lg:9px;
}
body{background:#f5f7fa;color:#081e39}
a{color:#ba0024}
.site-header{background:#fff;border-bottom:4px solid #071e3b;box-shadow:0 6px 18px rgba(0,18,48,.08)}
.header-inner{min-height:90px}
.brand{display:flex;flex-direction:column;transform:skew(-8deg);text-decoration:none;position:relative;padding:3px 15px 5px 14px;border:3px solid #071e3b;box-shadow:4px 4px 0 #e60023;background:linear-gradient(110deg,#ffdf00 0 10%,#ec0024 10% 59%,#07376a 59% 100%)}
.brand-name{color:white;font:800 35px/.95 var(--font-title);letter-spacing:-.025em;text-shadow:2px 2px 0 rgba(0,0,0,.18)}
.brand-detail{font-size:10px;letter-spacing:.09em;color:#fff;font-weight:600;margin-top:4px}
.main-nav ul a{color:#071e3b;font-family:var(--font-title);font-size:19px;font-weight:800;text-transform:uppercase}
.main-nav ul a:hover{border-bottom-color:#e60023}
.btn{font-family:var(--font-title);font-weight:800;text-transform:uppercase;font-size:19px;letter-spacing:.01em;border-radius:6px}
.btn-primary{background:#e60023;color:#fff;box-shadow:4px 4px 0 #071e3b}
.btn-primary:hover{background:#c80020;color:#fff}
.btn-primary:active{background:#af001b;color:#fff;box-shadow:1px 1px 0 #071e3b;transform:translate(3px,3px)}
.hero{position:relative;background:radial-gradient(circle at 76% 50%,#12406b 0,transparent 45%),linear-gradient(125deg,#00142b,#052447 57%,#00152f);isolation:isolate}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;opacity:.22;background:repeating-linear-gradient(118deg,transparent 0 115px,#2c6999 115px 138px,transparent 138px 220px);clip-path:polygon(48% 0,100% 0,100% 100%,35% 100%)}
.hero::after{content:"";position:absolute;right:3%;top:-16%;width:12%;height:140%;background:#e60023;transform:skewX(-27deg);z-index:-1;box-shadow:24px 0 0 #001227}
.hero-grid{position:relative;padding-top:82px;padding-bottom:98px;gap:38px}
.hero-grid::after{content:"";position:absolute;bottom:2px;left:30%;right:0;height:22px;background:conic-gradient(#fff 25%,#071e3b 0 50%,#fff 0 75%,#071e3b 0) 0 0/34px 34px;transform:skewX(-20deg);border-top:4px solid #fff}
.eyebrow{color:#fff;font-style:italic;letter-spacing:.16em}
.eyebrow::before,.rule{background:#e60023;transform:skewX(-27deg);border-radius:0}
.hero h1{font-style:italic;transform:skewX(-4deg);transform-origin:left center;font-size:clamp(55px,7.4vw,106px);letter-spacing:-.035em;text-shadow:4px 5px 0 rgba(0,0,0,.2);max-width:11ch}
.hero-lead{display:table;background:#fff;color:#e60023;padding:6px 16px 9px;transform:skewX(-8deg);box-shadow:8px 8px 0 #e60023;font-style:italic;text-transform:uppercase;font-size:clamp(24px,2.9vw,38px)}
.hero-sub{color:#dce7f5;line-height:1.5;font-size:19px;max-width:31em;margin-top:29px}
.btn-secondary-dark{border:2px solid #fff;background:rgba(0,18,40,.65)}
.hero-logo{filter:drop-shadow(0 12px 1px rgba(0,0,0,.28));max-width:510px}
.section{position:relative;padding-top:78px;padding-bottom:82px}
.section h2{font-size:clamp(38px,5vw,66px);font-style:italic;letter-spacing:-.025em;transform:skewX(-4deg);transform-origin:left;text-transform:uppercase;color:#071e3b}
.section-head{max-width:920px}.section-intro{font-size:18px}
#espaces{background:#fff}
#espaces::before{content:"";position:absolute;top:0;left:0;right:0;height:8px;background:linear-gradient(110deg,#e60023 0 20%,#071e3b 20% 80%,#e60023 80%)}
.cards{gap:22px}
.card{position:relative;border:2px solid #d8e0eb;border-top:7px solid #e60023;border-radius:3px;padding:32px 26px 28px;box-shadow:6px 7px 0 #edf1f5;transition:transform .2s ease,box-shadow .2s ease}
.card:hover{transform:translateY(-4px);box-shadow:6px 11px 0 #e9edf4}
.card-icon{width:54px;height:54px;stroke:#0a2f59;stroke-width:1.8}
.card h3,.audience h3,.step h3{font-style:italic;color:#071e3b;font-size:30px;line-height:1.08}
.card-link{color:#c80020;text-transform:uppercase;font-family:var(--font-title);font-weight:800;font-size:20px}
.card-link::after{content:"  →"}
.section-white{background:#f3f6fa}
.audiences{gap:22px}.audience{position:relative;background:#fff;border:2px solid #dce4ed;border-left:8px solid #092f59;border-radius:3px;padding:34px;overflow:hidden}
.audience::after{content:"";width:100px;height:14px;position:absolute;right:-22px;top:17px;background:#e60023;transform:rotate(33deg)}
.checks li::before{border-color:#e60023}
.steps{gap:20px}.step{border:2px solid #dae2ed;border-radius:3px;padding:30px;box-shadow:5px 6px 0 #e9edf4}
.step-num{background:#071e3b;color:#fff;border-radius:3px;font-style:italic;box-shadow:4px 4px 0 #e60023}
.section-dark{background:radial-gradient(circle at 5% 5%,#12416d,#061c37 62%,#00132a)}
.section-dark h2{color:#fff}
.coords dt{color:#f7bd6c}
.contact-form{border:4px solid #fff;box-shadow:12px 12px 0 #e60023;border-radius:4px}
.site-footer{background:#00142b}
.site-footer a:hover{color:#ffb81c}
.call-bar{background:#e60023}
@media(max-width:960px){.hero-grid{padding-top:66px}.hero::after{right:0;width:11%}.hero-logo{max-width:360px}}
@media(max-width:640px){.header-inner{min-height:78px}.brand{padding:4px 10px}.brand-name{font-size:27px}.brand-detail{font-size:8px}.hero-grid{padding-top:55px;padding-bottom:68px}.hero h1{font-size:clamp(49px,12vw,70px)}.hero-lead{font-size:25px}.hero::after{width:17%;opacity:.55}.hero-logo{max-width:270px}.hero-grid::after{left:15%;height:12px;background-size:22px 22px}.section{padding-top:58px;padding-bottom:62px}.card{padding:25px}.contact-form{box-shadow:5px 6px 0 #e60023}}
@media(prefers-reduced-motion:reduce){.card{transition:none}.btn{transition:none}}

/* V3.1 : titre héros sur deux lignes en grand écran */
@media (min-width: 961px){.hero h1{max-width:none;font-size:clamp(55px,6.2vw,96px)}}

/* V3.2 : cartouche officiel SPEEDBOX dans l'en-tête */
.brand.brand-logo{display:block;transform:none;padding:0;border:0;box-shadow:none;background:none;flex:none;line-height:0}
.brand.brand-logo img{display:block;width:260px;height:auto}
@media(max-width:960px){.brand.brand-logo img{width:220px}}
@media(max-width:640px){.brand.brand-logo{padding:0}.brand.brand-logo img{width:180px}}
@media(max-width:359px){.brand.brand-logo img{width:150px}}

/* V4 : dégradé NASCAR du cartouche (rouge → pourpre → bleu) + nouveaux contenus */
:root{
  --nascar:linear-gradient(105deg,#EC0103 0%,#D20108 16%,#BF010E 28%,#A8022A 38%,#8E0441 47%,#3E0A55 54%,#0A1267 60%,#002392 70%,#004ABC 86%,#0055BE 100%);
  --nascar-v:linear-gradient(170deg,#EC0103 0%,#C2011F 26%,#8E0441 44%,#0A1267 60%,#002392 74%,#0055BE 100%);
  --sb-yellow:#FFC20E;
}
.hero{background:var(--nascar)}
.hero::before{opacity:.10;background:repeating-linear-gradient(118deg,transparent 0 115px,#fff 115px 138px,transparent 138px 220px)}
.hero::after{box-shadow:24px 0 0 #071e3b}
.hero-sub{color:#fff}
.eyebrow::before,.hero .rule{background:var(--sb-yellow)}
.hero-lead{box-shadow:8px 8px 0 #071e3b}
.hero .btn-primary{background:var(--sb-yellow);color:#071e3b;box-shadow:4px 4px 0 #071e3b}
.hero .btn-primary:hover{background:#ffd54a;color:#071e3b}
.hero .btn-secondary-dark{background:rgba(7,30,59,.55)}
.animation-control{background:rgba(7,30,59,.6)!important}
@media(max-width:960px){.hero{background:var(--nascar-v)}}

/* Liseré dégradé sous l'en-tête et en haut des espaces */
.site-header{border-bottom:0}
.site-header::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:6px;background:var(--nascar)}
#espaces::before{background:var(--nascar)}

/* Atouts */
.atouts{background:#071e3b;color:#fff;padding:22px 0;border-bottom:4px solid var(--sb-yellow)}
.atouts-list{list-style:none;margin:0 auto;display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px 28px}
.atouts-list li{display:flex;align-items:center;gap:12px;font-family:var(--font-title);font-style:italic;text-transform:uppercase;font-size:22px;letter-spacing:.02em}
.atouts-list li strong{font-weight:800}
.atouts-list .icon{width:30px;height:30px;stroke:var(--sb-yellow);stroke-width:2.2}

/* Cartes : badge, surfaces, actions */
.card-badge{align-self:flex-start;background:var(--sb-yellow);color:#071e3b;font:800 15px/1 var(--font-title);text-transform:uppercase;letter-spacing:.04em;padding:7px 10px;transform:skewX(-10deg);box-shadow:3px 3px 0 #071e3b}
.sizes{list-style:none;margin:0;padding:0;display:flex;gap:10px}
.sizes li{background:#071e3b;color:#fff;font:800 24px/1 var(--font-title);font-style:italic;padding:8px 14px;transform:skewX(-10deg);box-shadow:3px 3px 0 #e60023}
.card-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px}
.btn.btn-small{min-height:44px;padding:10px 16px;font-size:17px}

/* Panneau « Être averti » */
.alerte{margin-top:34px;background:var(--nascar);color:#fff;border-radius:4px;padding:34px;display:grid;grid-template-columns:1fr 1.3fr;gap:28px 40px;align-items:center;box-shadow:10px 10px 0 #071e3b;scroll-margin-top:110px}
.alerte-tag{display:inline-block;background:var(--sb-yellow);color:#071e3b;font:800 15px/1 var(--font-title);text-transform:uppercase;letter-spacing:.06em;padding:7px 10px;transform:skewX(-10deg);margin-bottom:12px}
.alerte h3{font-size:clamp(30px,3.4vw,44px);font-style:italic;text-transform:uppercase;line-height:1;transform:skewX(-4deg);transform-origin:left;margin-bottom:10px}
.alerte-head p:last-child{font-size:18px}
.alerte-fields{display:grid;grid-template-columns:1fr 1fr auto;gap:14px;align-items:end}
.alerte .field label{color:#fff}
.alerte .field input{border:2px solid #fff}
.alerte .btn-primary{background:var(--sb-yellow);color:#071e3b;box-shadow:4px 4px 0 #071e3b;min-height:48px}
.alerte .btn-primary:hover{background:#ffd54a;color:#071e3b}
.alerte .field-error{grid-column:1/-1;margin-top:12px;color:#fff;background:#071e3b;padding:8px 12px;border-radius:3px}
.alerte-privacy{margin-top:12px;font-size:14px;color:#fff;opacity:.95}
.alerte .form-status{margin-top:12px;color:#071e3b}
.alerte :focus-visible{outline-color:#fff}
.alerte .field input:focus-visible{outline:3px solid #071e3b;outline-offset:1px}
@media(max-width:960px){.alerte{grid-template-columns:1fr;background:var(--nascar)}}
@media(max-width:640px){.alerte{padding:24px 20px;box-shadow:6px 6px 0 #071e3b}.alerte-fields{grid-template-columns:1fr}.alerte .btn-primary{width:100%}.atouts-list{flex-direction:column;align-items:flex-start}.atouts-list li{font-size:20px}}

/* V4.1 : retour au fond bleu nuit de la V3 + bandes NASCAR jaune / rouge / bleu */
:root{
  --nascar-bands:linear-gradient(90deg,#FFC20E 0 7%,transparent 7% 11%,#FFC20E 11% 18%,transparent 18% 22%,#E60023 22% 36%,transparent 36% 40%,#E60023 40% 54%,transparent 54% 58%,#0055BE 58% 100%);
  --nascar-line:linear-gradient(90deg,#FFC20E 0 5%,#071e3b 5% 6%,#FFC20E 6% 10%,#071e3b 10% 11%,#EC0103 11%,#C2011F 34%,#8E0441 50%,#002392 66%,#0055BE 100%);
}
.hero,.hero{background:radial-gradient(circle at 76% 50%,#12406b 0,transparent 45%),linear-gradient(125deg,#00142b,#052447 57%,#00152f)}
@media(max-width:960px){.hero{background:radial-gradient(circle at 80% 30%,#12406b 0,transparent 55%),linear-gradient(160deg,#00142b,#052447 57%,#00152f)}}
.hero::before{opacity:.22;background:repeating-linear-gradient(118deg,transparent 0 115px,#2c6999 115px 138px,transparent 138px 220px)}
.hero::after{right:-2%;width:30%;background:var(--nascar-bands);box-shadow:none;opacity:1}
.site-header::after,#espaces::before{background:var(--nascar-line)}

/* Encart « Être averti » : fond bleu nuit + liseré NASCAR */
.alerte{position:relative;overflow:hidden;background:radial-gradient(circle at 5% 5%,#12416d,#061c37 62%,#00132a);box-shadow:10px 10px 0 #e60023}
.alerte::before{content:"";position:absolute;left:0;right:0;top:0;height:8px;background:var(--nascar-line)}
@media(max-width:960px){.alerte{background:radial-gradient(circle at 5% 5%,#12416d,#061c37 62%,#00132a)}}
@media(max-width:640px){.alerte{box-shadow:6px 6px 0 #e60023}}

/* Mobile : mascotte réduite, à côté du titre */
@media(max-width:640px){
  .hero-grid{grid-template-columns:minmax(0,1fr) auto;column-gap:10px;row-gap:0;padding-top:36px}
  .hero-text{display:contents}
  .hero .eyebrow{grid-column:1/-1;grid-row:1}
  .hero h1{grid-column:1;grid-row:2;align-self:center;font-size:clamp(38px,12vw,56px);max-width:none}
  .hero-visual{grid-column:2;grid-row:2;align-self:center;gap:0}
  .hero-logo{width:clamp(100px,33vw,150px);max-width:none}
  .hero-lead,.hero-sub,.hero-actions{grid-column:1/-1}
  .animation-control{display:none!important}
  .hero::after{width:34%;right:-8%;opacity:.9}
}
@media(max-width:640px){
  .hero::after{top:-8%;height:70%;width:38%;right:-16%;-webkit-mask-image:linear-gradient(to bottom,#000 45%,transparent 92%);mask-image:linear-gradient(to bottom,#000 45%,transparent 92%)}
}

/* V4.2 : moins de blanc — sections sombres, seules les cartes d'offre et le formulaire restent clairs */
body{background:#071e3b}
.section h2,.section .section-head h2{color:#fff}
.section-intro{color:#c9d6e6}

#espaces{background:radial-gradient(circle at 92% 0%,#12406b 0,transparent 45%),linear-gradient(180deg,#071e3b,#0a2a4f)}
#espaces .card{border-color:#071e3b;box-shadow:6px 7px 0 #00142b}
#espaces .card:hover{box-shadow:6px 11px 0 #00142b}
.alerte{background:linear-gradient(110deg,#0b4a96 0%,#0055BE 100%);box-shadow:10px 10px 0 #e60023}
@media(max-width:960px){.alerte{background:linear-gradient(160deg,#0b4a96,#0055BE)}}

.section-white{background:#00142b;position:relative;overflow:hidden}
.section-white::before{content:"";position:absolute;right:-6%;top:-20%;width:22%;height:140%;background:var(--nascar-bands);transform:skewX(-27deg);opacity:.9;pointer-events:none}
.section-white .container{position:relative}
.audience{background:#0b2747;border:2px solid #1d3f66;border-left:8px solid var(--sb-yellow);color:#fff}
.audience h3{color:#fff}
.audience .checks li{color:#e6edf6}

#fonctionnement{background:linear-gradient(180deg,#0a2f59,#071e3b)}
.step{background:#071e3b;border:2px solid #1d3f66;box-shadow:5px 6px 0 #e60023;color:#fff}
.step h3{color:#fff}
.step p{color:#c9d6e6}
.step-num{background:var(--sb-yellow);color:#071e3b;box-shadow:4px 4px 0 #e60023}

.site-footer{border-top:6px solid transparent;border-image:var(--nascar-line) 1}
.footer-cartouche{width:200px;height:auto}
@media(max-width:640px){.section-white::before{width:30%;right:-14%;opacity:.5}.footer-cartouche{width:170px}}

/* Page mentions légales */
.page-legal .legal{background:linear-gradient(180deg,#0a2a4f,#071e3b);color:#e6edf6;min-height:60vh}
.legal-inner{max-width:860px}
.legal h1{font-family:var(--font-title);font-weight:800;font-style:italic;text-transform:uppercase;font-size:clamp(40px,6vw,64px);color:#fff;transform:skewX(-4deg);transform-origin:left;margin-bottom:24px}
.legal h2{font-size:clamp(24px,3vw,30px)!important;margin:40px 0 12px;color:var(--sb-yellow)!important;transform:none!important}
.legal p{margin:0 0 12px;max-width:68ch}
.legal a{color:#fff}
.legal a.btn{color:#071e3b}
.legal-list{margin:0;display:grid;gap:10px}
.legal-list div{display:grid;grid-template-columns:minmax(150px,240px) 1fr;gap:4px 18px;padding:10px 0;border-bottom:1px solid #1d3f66}
.legal-list dt{font-family:var(--font-title);font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:#9fb6d1}
.legal-list dd{margin:0}
.legal-back{margin-top:40px}
.page-legal .header-inner .btn{min-height:44px}
@media(max-width:640px){.legal-list div{grid-template-columns:1fr}}
/* V4.2 : contrastes des liens sur fonds sombres / bleus */
.alerte a{color:#fff;text-decoration:underline}
.legal .legal-back a.btn{color:#fff}
.contact-form .form-privacy a{color:#B4001B}
