:root { --course-ink:#11100e; --course-paper:#fbfaf6; --course-soft:#f1ece2; --course-line:rgba(17,16,14,.13); --course-red:#a90f1d; --course-gold:#cfa24b; --course-muted:#625c53; --course-max:1120px; }
.course-page { background:var(--course-paper); color:var(--course-ink); }
.course-page main { overflow:hidden; }
.course-hero { position:relative; min-height:clamp(530px,68vh,720px); display:grid; align-items:end; isolation:isolate; color:#fff; background:#171511; }
.course-hero-media,.course-hero-media img { position:absolute; inset:0; width:100%; height:100%; }
.course-hero-media img { object-fit:cover; object-position:center 48%; }
.course-hero::after { content:""; position:absolute; z-index:-1; inset:0; background:linear-gradient(90deg,rgba(11,10,9,.86),rgba(11,10,9,.52) 49%,rgba(11,10,9,.1)),linear-gradient(0deg,rgba(11,10,9,.62),transparent 58%); }
.course-hero-content { position:relative; z-index:1; width:min(var(--course-max),calc(100% - 36px)); margin:0 auto; padding:150px 0 60px; }
.course-hero .eyebrow { color:#f6cf78; }
.course-hero h1 { max-width:9ch; margin:0; font-size:clamp(3.7rem,7vw,6.7rem); line-height:.9; }
.course-hero p:not(.eyebrow) { max-width:545px; margin:22px 0 0; color:rgba(255,255,255,.91); font-size:1.08rem; line-height:1.62; }
.course-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:28px; }
.course-actions .button { min-height:48px; }
.course-section { padding:clamp(58px,8vw,110px) max(18px,calc((100vw - var(--course-max))/2)); }
.course-section.soft { background:var(--course-soft); }
.course-section.dark { background:#141310; color:#fff; }
.course-section.dark p { color:rgba(255,255,255,.78); }
.course-section.dark .eyebrow { color:#f6cf78; }
.course-intro { display:grid; grid-template-columns:.75fr 1.25fr; gap:clamp(28px,8vw,110px); align-items:start; }
.course-intro h2,.course-heading h2,.course-cta h2 { max-width:13ch; margin:0; font-size:clamp(2.7rem,5vw,5.2rem); line-height:.93; }
.course-intro > p { max-width:620px; margin:8px 0 0; color:var(--course-muted); font-size:1.12rem; line-height:1.72; }
.course-section.dark .course-intro > p { color:rgba(255,255,255,.78); }
.course-heading { max-width:680px; }
.course-heading > p:not(.eyebrow) { color:var(--course-muted); line-height:1.65; }
.course-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:34px; }
.course-grid article { padding:25px; border:1px solid var(--course-line); background:#fff; }
.course-grid h3 { margin:0 0 10px; font-size:1.45rem; }
.course-grid p { margin:0; color:var(--course-muted); line-height:1.58; }
.course-benefits { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin-top:34px; background:rgba(255,255,255,.2); }
.course-benefits article { padding:26px; background:#141310; }
.course-benefits strong { display:block; color:#f6cf78; font-size:.75rem; letter-spacing:.08em; text-transform:uppercase; }
.course-benefits p { margin:10px 0 0; color:rgba(255,255,255,.77); line-height:1.55; }
.course-split { display:grid; grid-template-columns:1fr .9fr; gap:clamp(28px,6vw,76px); align-items:center; }
.course-split img { width:100%; aspect-ratio:4/3; object-fit:cover; }
.course-split h2 { margin:0; font-size:clamp(2.45rem,4.5vw,4.55rem); line-height:.94; }
.course-split p { color:var(--course-muted); line-height:1.65; }
.course-faq { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:34px; }
.course-faq article { padding:24px; border-top:4px solid var(--course-red); background:#fff; box-shadow:0 12px 32px rgba(17,16,14,.07); }
.course-faq h3 { margin:0; font-size:1.3rem; }
.course-faq p { margin:12px 0 0; color:var(--course-muted); line-height:1.6; }
.course-cta { display:grid; grid-template-columns:1fr .8fr; gap:45px; align-items:end; padding:clamp(58px,8vw,110px) max(18px,calc((100vw - var(--course-max))/2)); background:var(--course-red); color:#fff; }
.course-cta p { max-width:470px; margin:0; color:rgba(255,255,255,.9); line-height:1.65; }
.course-cta .button { margin-top:25px; background:#fff; color:var(--course-ink); }
.course-cta .button.secondary { border-color:rgba(255,255,255,.75); background:transparent; color:#fff; }
.course-links { display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; font-weight:800; }
.course-links a { text-decoration:underline; text-underline-offset:5px; }
@media (max-width:900px) { .course-intro,.course-split,.course-cta { grid-template-columns:1fr; gap:28px; } .course-grid,.course-benefits,.course-faq { grid-template-columns:1fr; } }
@media (max-width:560px) { .course-hero { min-height:0; } .course-hero::after { background:linear-gradient(90deg,rgba(11,10,9,.84),rgba(11,10,9,.28)),linear-gradient(0deg,rgba(11,10,9,.78),transparent 65%); } .course-hero-media img { object-position:center 48%; } .course-hero-content { width:calc(100% - 28px); padding:126px 0 32px; } .course-hero h1 { font-size:clamp(3.35rem,15vw,4.8rem); } .course-hero p:not(.eyebrow) { font-size:.97rem; } .course-actions { display:grid; } .course-actions .button { width:100%; } .course-section { padding:62px 18px; } .course-grid article,.course-faq article { padding:21px; } .course-cta { padding:62px 18px; } }/* Contraste calibré par photo : les visages et le mouvement restent visibles. */
.course-hero-baby::after { background:linear-gradient(90deg,rgba(15,13,12,.86),rgba(15,13,12,.5) 52%,rgba(15,13,12,.08)),linear-gradient(0deg,rgba(15,13,12,.58),transparent 60%); }
.course-hero-kids::after { background:linear-gradient(90deg,rgba(10,10,9,.88),rgba(10,10,9,.55) 48%,rgba(10,10,9,.12)),linear-gradient(0deg,rgba(10,10,9,.56),transparent 58%); }
.course-hero-debutants::after { background:linear-gradient(90deg,rgba(13,12,10,.88),rgba(13,12,10,.52) 49%,rgba(13,12,10,.08)),linear-gradient(0deg,rgba(13,12,10,.58),transparent 58%); }
.course-hero-entrainement::after { background:linear-gradient(90deg,rgba(12,11,10,.88),rgba(12,11,10,.48) 55%,rgba(12,11,10,.08)),linear-gradient(0deg,rgba(12,11,10,.62),transparent 58%); }
.course-hero-crew::after { background:linear-gradient(90deg,rgba(9,9,8,.9),rgba(9,9,8,.55) 52%,rgba(9,9,8,.1)),linear-gradient(0deg,rgba(9,9,8,.58),transparent 60%); }
@media (max-width:560px) { .course-hero-content { text-shadow:0 1px 9px rgba(0,0,0,.48); } .course-hero .button { text-shadow:none; } }