/* ============================================================
   CLUB PAGE · shared styles for club-lille.html / club-champigny.html
   Builds on escapad-chrome.css tokens (--midnight, --cream, --paper, --yellow, etc.)
============================================================ */

.cp-wrap { max-width:1240px; margin:0 auto; padding:0 32px; }

.cp-eyebrow {
  font-size:11px; font-weight:700; letter-spacing:0.18em; text-transform:uppercase;
  opacity:0.55; margin-bottom:14px;
}
.cp-h1 {
  font-size:clamp(56px, 7.5vw, 152px); line-height:0.86; letter-spacing:-0.055em;
  text-transform:uppercase; margin-bottom:24px;
  max-width:14ch;
}
.cp-h1 .l1 { font-weight:300; display:block; }
.cp-h1 .l2 { font-weight:900; display:block; }
.cp-h2 {
  font-size:clamp(40px, 5.5vw, 84px); line-height:0.92; letter-spacing:-0.045em;
  text-transform:uppercase; margin-bottom:18px;
}
.cp-h2 .l1 { font-weight:300; display:inline; }
.cp-h2 .l2 { font-weight:900; display:inline; margin-left:0.18em; }

/* ============== HERO ============== */
.cp-hero {
  position:relative; min-height:88vh;
  padding:calc(var(--banner-h) + var(--nav-h) + 40px) 0 80px;
  overflow:hidden;
  background:var(--midnight); color:var(--paper);
}
.cp-hero-bg { position:absolute; inset:0; display:grid; grid-template-columns:1fr 1fr; grid-template-rows:1fr 1fr; gap:0; }
.cp-hero-tile { background-size:cover; background-position:center; opacity:0.55; filter:saturate(0.9) contrast(1.05); }

/* Lille palette, pinks + warm bricks */
[data-club-page="lille"] .cp-hero { background:#1c1838; }
/* Collage photo du club (Euralille) en fond de hero · repli dégradé puis
   image-set AVIF/WebP/JPEG. Atténué par .cp-hero-tile{opacity} + le scrim. */
[data-club-page="lille"] .cp-hero-tile--1 { background-image:linear-gradient(135deg,#6e5a62,#6e5a62); background-image:image-set(url(assets/clubs/lille-hero-1.avif) type("image/avif"), url(assets/clubs/lille-hero-1.webp) type("image/webp"), url(assets/clubs/lille-hero-1.jpg) type("image/jpeg")); }
[data-club-page="lille"] .cp-hero-tile--2 { background-image:linear-gradient(225deg,#3a3450,#1c1838); background-image:image-set(url(assets/clubs/lille-hero-2.avif) type("image/avif"), url(assets/clubs/lille-hero-2.webp) type("image/webp"), url(assets/clubs/lille-hero-2.jpg) type("image/jpeg")); }
[data-club-page="lille"] .cp-hero-tile--3 { background-image:linear-gradient(315deg,#3a3450,#1c1838); background-image:image-set(url(assets/clubs/lille-hero-3.avif) type("image/avif"), url(assets/clubs/lille-hero-3.webp) type("image/webp"), url(assets/clubs/lille-hero-3.jpg) type("image/jpeg")); }
[data-club-page="lille"] .cp-hero-tile--4 { background-image:linear-gradient(45deg,#6e5a62,#3a3450); background-image:image-set(url(assets/clubs/lille-hero-4.avif) type("image/avif"), url(assets/clubs/lille-hero-4.webp) type("image/webp"), url(assets/clubs/lille-hero-4.jpg) type("image/jpeg")); }

/* Champigny palette, greens */
[data-club-page="champigny"] .cp-hero { background:#1c1838; }
[data-club-page="champigny"] .cp-hero-tile--1 { background-image:linear-gradient(135deg,#6e5a62,#3a3450); }
[data-club-page="champigny"] .cp-hero-tile--2 { background-image:linear-gradient(225deg,#3a3450,#1c1838); }
[data-club-page="champigny"] .cp-hero-tile--3 { background-image:linear-gradient(315deg,#3a3450,#1c1838); }
[data-club-page="champigny"] .cp-hero-tile--4 { background-image:linear-gradient(45deg,#b78878,#3a3450); }

.cp-hero-scrim {
  position:absolute; inset:0;
  background:
    radial-gradient(60% 80% at 30% 50%, rgba(0,0,0,0.4), transparent 70%),
    linear-gradient(to right, rgba(14,11,35,0.85) 0%, rgba(14,11,35,0.45) 60%, rgba(14,11,35,0.2) 100%);
}
.cp-hero-content { position:relative; max-width:1240px; margin:0 auto; padding:0 32px; padding-right:240px; }
@media (max-width:980px) { .cp-hero-content { padding-right:32px; } }

.cp-crumbs { font-size:11px; font-weight:600; letter-spacing:0.16em; text-transform:uppercase; opacity:0.6; margin-bottom:24px; }
.cp-crumbs a { color:inherit; }
.cp-crumbs a:hover { opacity:1; text-decoration:underline; }
.cp-crumbs span { margin:0 8px; opacity:0.45; }

.cp-status {
  display:inline-flex; align-items:center; gap:8px;
  padding:6px 12px; border:1px solid var(--paper);
  font-size:11px; font-weight:700; letter-spacing:0.14em; text-transform:uppercase;
  margin-bottom:20px;
}
.cp-status .dot { width:8px; height:8px; border-radius:50%; background:#4f9a5c; box-shadow:0 0 12px #4f9a5c; }
[data-club-page="champigny"] .cp-status .dot { background:var(--yellow); box-shadow:0 0 12px var(--yellow); animation:pulse 2s infinite; }
@keyframes pulse { 0%,100% { opacity:1; } 50% { opacity:0.4; } }

.cp-lede { font-size:18px; line-height:1.55; max-width:620px; opacity:0.8; margin-bottom:36px; }

.cp-meta { display:flex; gap:36px; flex-wrap:wrap; margin-bottom:36px; padding-bottom:36px; border-bottom:1px solid rgba(255,255,255,0.15); max-width:760px; }
.cp-meta-item strong { display:block; font-size:36px; font-weight:900; letter-spacing:-0.04em; line-height:1; margin-bottom:4px; }
.cp-meta-item span { font-size:11px; font-weight:600; letter-spacing:0.12em; text-transform:uppercase; opacity:0.6; }

.cp-hero-cta { display:flex; gap:12px; flex-wrap:wrap; }

.cp-hero-stamp {
  position:absolute; top:50%; right:60px; transform:translateY(-50%) rotate(-8deg);
  width:160px; height:160px; border-radius:50%;
  background:var(--yellow); color:var(--midnight);
  display:flex; align-items:center; justify-content:center;
  border:2px solid var(--midnight);
  box-shadow:6px 6px 0 rgba(0,0,0,0.3);
}
.stamp-inner { text-align:center; }
.stamp-line { font-size:10px; font-weight:800; letter-spacing:0.2em; }
.stamp-num { font-size:42px; font-weight:900; letter-spacing:-0.04em; line-height:0.9; margin:6px 0; }
@media (max-width:980px) { .cp-hero-stamp { display:none; } }

/* ============== INTRO ============== */
.cp-intro { padding:120px 0; background:var(--paper); }
.cp-intro-grid { display:grid; grid-template-columns:280px 1fr; gap:48px; align-items:start; }
.cp-intro-text p { font-size:17px; line-height:1.65; margin-bottom:18px; max-width:680px; }
.cp-pull {
  font-size:32px !important; font-weight:300; line-height:1.25 !important; letter-spacing:-0.02em;
  margin-bottom:32px !important;
}
.cp-pull em { font-style:italic; font-weight:600; }
@media (max-width:780px) { .cp-intro-grid { grid-template-columns:1fr; gap:18px; } }

/* ============== SPORTS ============== */
.cp-sports { padding:100px 0; background:var(--cream); border-top:1.5px solid var(--midnight); border-bottom:1.5px solid var(--midnight); }
.cp-section-head { margin-bottom:48px; max-width:900px; }
.cp-sports-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:18px; }
.cp-sport-card {
  position:relative; padding:32px 28px; min-height:380px;
  background:var(--paper); border:1.5px solid var(--midnight);
  display:flex; flex-direction:column;
  transition:transform 0.18s, box-shadow 0.18s;
  color:var(--midnight);
}
.cp-sport-card:hover { transform:translate(-3px,-3px); box-shadow:6px 6px 0 var(--midnight); }
.cp-sport-card .sc-num { font-size:11px; font-weight:800; letter-spacing:0.18em; opacity:0.4; }
.cp-sport-card .sc-tag { font-size:11px; font-weight:800; letter-spacing:0.18em; margin:14px 0 8px; }
.cp-sport-card .sc-title { font-size:30px; font-weight:900; letter-spacing:-0.03em; line-height:1; margin-bottom:18px; text-transform:uppercase; }
.cp-sport-card .sc-list { list-style:none; padding:0; margin:0 0 24px; flex:1; }
.cp-sport-card .sc-list li { font-size:14px; line-height:1.5; padding:6px 0; border-bottom:1px dashed rgba(0,0,0,0.15); }
.cp-sport-card .sc-cta { font-size:13px; font-weight:800; letter-spacing:0.04em; }
.cp-sport-card--escalade { background:linear-gradient(180deg, #fff5d1, var(--paper)); }
.cp-sport-card--padel { background:linear-gradient(180deg, #e8f1e0, var(--paper)); }
.cp-sport-card--resto { background:linear-gradient(180deg, #ffe9dc, var(--paper)); }
.cp-sport-card--hyrox { background:linear-gradient(180deg, #d4e8ff, var(--paper)); }
.cp-sport-card--bienetre { background:linear-gradient(180deg, #dbe6d5, var(--paper)); }
@media (max-width:980px) { .cp-sports-grid { grid-template-columns:1fr; } }

/* ============== GALLERY ============== */
.cp-gallery { padding:100px 0; background:var(--paper); }
.cp-gallery-grid {
  display:grid; gap:14px;
  grid-template-columns:repeat(4, 1fr);
  grid-auto-rows:180px;
}
.cp-photo {
  position:relative; border:1.5px solid var(--midnight);
  background-size:cover; background-position:center;
  overflow:hidden;
}
.cp-photo > picture { position:absolute; inset:0; z-index:0; }
.cp-photo > picture img { width:100%; height:100%; object-fit:cover; display:block; }
.cp-photo .cap { z-index:1; }
.cp-photo .cap {
  position:absolute; left:14px; bottom:14px;
  font-size:11px; font-weight:700; letter-spacing:0.1em;
  background:var(--midnight); color:var(--yellow); padding:6px 10px;
}
.cp-photo--xl { grid-column:span 2; grid-row:span 2; }
.cp-photo--lg { grid-column:span 2; grid-row:span 1; }
.cp-photo--md { grid-column:span 1; grid-row:span 1; }
.cp-photo--sm { grid-column:span 1; grid-row:span 1; }

[data-club-page="lille"] .cp-photo:nth-child(1) { background:linear-gradient(135deg,#6e5a62,#3a3450); }
[data-club-page="lille"] .cp-photo:nth-child(2) { background:linear-gradient(135deg,#3a3450,#1c1838); }
[data-club-page="lille"] .cp-photo:nth-child(3) { background:linear-gradient(135deg,#6e5a62,#0d0b22); }
[data-club-page="lille"] .cp-photo:nth-child(4) { background:linear-gradient(135deg,#1c1838,#3a3450); }
[data-club-page="lille"] .cp-photo:nth-child(5) { background:linear-gradient(135deg,#3a3450,#6e5a62); }
[data-club-page="lille"] .cp-photo:nth-child(6) { background:linear-gradient(135deg,#1c1838,#3a3450); }

[data-club-page="champigny"] .cp-photo:nth-child(1) { background:linear-gradient(135deg,#b78878,#3a3450); }
[data-club-page="champigny"] .cp-photo:nth-child(2) { background:linear-gradient(135deg,#3a3450,#1c1838); }
[data-club-page="champigny"] .cp-photo:nth-child(3) { background:linear-gradient(135deg,#6e5a62,#3a3450); }
[data-club-page="champigny"] .cp-photo:nth-child(4) { background:linear-gradient(135deg,#3a3450,#b78878); }
[data-club-page="champigny"] .cp-photo:nth-child(5) { background:linear-gradient(135deg,#1c1838,#6e5a62); }
[data-club-page="champigny"] .cp-photo:nth-child(6) { background:linear-gradient(135deg,#3a3450,#b78878); }

@media (max-width:780px) {
  .cp-gallery-grid { grid-template-columns:repeat(2, 1fr); }
  .cp-photo--xl, .cp-photo--lg { grid-column:span 2; }
}

/* ============== TIMETABLE ============== */
.cp-timetable { padding:100px 0; background:var(--midnight); color:var(--paper); }
.cp-timetable .cp-eyebrow { color:var(--yellow); opacity:1; }
.cp-tt-table { border:1.5px solid var(--paper); }
.cp-tt-row { display:grid; grid-template-columns:120px repeat(7, 1fr); border-bottom:1px solid rgba(255,255,255,0.18); }
.cp-tt-row:last-child { border-bottom:none; }
.cp-tt-head { background:rgba(255,255,255,0.05); }
.cp-tt-head > div { padding:14px 10px; font-size:11px; font-weight:800; letter-spacing:0.14em; text-transform:uppercase; opacity:0.6; }
.cp-tt-time { padding:18px 14px; font-size:13px; font-weight:800; letter-spacing:0.04em; border-right:1px solid rgba(255,255,255,0.18); display:flex; align-items:center; }
.cp-tt-cell { padding:18px 10px; font-size:12px; font-weight:700; border-right:1px solid rgba(255,255,255,0.08); display:flex; align-items:center; justify-content:center; min-height:64px; text-align:center; }
.cp-tt-cell:last-child { border-right:none; }
.cp-tt-cell.esc { background:rgba(255,237,90,0.18); color:var(--yellow); }
.cp-tt-cell.pad { background:rgba(95,189,135,0.22); color:#a8cf9a; }
.cp-tt-cell.hyx { background:rgba(255,107,157,0.22); color:#ffd9c2; }
.cp-tt-cell.mix { background:rgba(255,255,255,0.06); }
.cp-tt-cell.party { background:var(--yellow); color:var(--midnight); }
.cp-tt-legend { margin-top:24px; display:flex; gap:24px; font-size:12px; flex-wrap:wrap; }
.cp-tt-legend .lg { display:inline-block; width:14px; height:14px; vertical-align:middle; margin-right:6px; }
.cp-tt-legend .lg.esc { background:rgba(255,237,90,0.5); }
.cp-tt-legend .lg.pad { background:rgba(95,189,135,0.5); }
.cp-tt-legend .lg.hyx { background:rgba(255,107,157,0.5); }
.cp-tt-legend .lg.mix { background:rgba(255,255,255,0.18); }
.cp-tt-legend .lg.party { background:var(--yellow); }
@media (max-width:780px) {
  .cp-tt-table { font-size:10px; }
  .cp-tt-row { grid-template-columns:60px repeat(7, 1fr); }
  .cp-tt-time { padding:10px 6px; font-size:10px; }
  .cp-tt-cell { padding:10px 4px; font-size:9px; min-height:48px; }
}

/* ============== TEAM ============== */
.cp-team { padding:100px 0; background:var(--cream); border-top:1.5px solid var(--midnight); border-bottom:1.5px solid var(--midnight); }
.cp-team-grid { display:grid; grid-template-columns:repeat(4, 1fr); gap:18px; }
.cp-team-card { background:var(--paper); border:1.5px solid var(--midnight); padding:24px; }
.cp-team-photo {
  width:100%; aspect-ratio:1/1; margin-bottom:16px;
  border:1.5px solid var(--midnight);
  display:flex; align-items:center; justify-content:center;
  font-size:54px; font-weight:900; letter-spacing:-0.04em;
  color:var(--paper);
  position:relative; overflow:hidden;
}
.cp-team-photo::after { content:attr(data-init); }
/* Vraie photo : remplit le carré (cadrage haut pour garder le visage),
   masque les initiales de repli. */
.cp-team-img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:top center; }
.cp-team-photo:has(.cp-team-img)::after { display:none; }
[data-club-page="lille"] .cp-team-card:nth-child(1) .cp-team-photo { background:linear-gradient(135deg,#6e5a62,#3a3450); }
[data-club-page="lille"] .cp-team-card:nth-child(2) .cp-team-photo { background:linear-gradient(135deg,#6e5a62,#1c1838); }
[data-club-page="lille"] .cp-team-card:nth-child(3) .cp-team-photo { background:linear-gradient(135deg,#3a3450,#6e5a62); }
[data-club-page="lille"] .cp-team-card:nth-child(4) .cp-team-photo { background:linear-gradient(135deg,#1c1838,#6e5a62); }
[data-club-page="champigny"] .cp-team-card:nth-child(1) .cp-team-photo { background:linear-gradient(135deg,#b78878,#3a3450); }
[data-club-page="champigny"] .cp-team-card:nth-child(2) .cp-team-photo { background:linear-gradient(135deg,#3a3450,#1c1838); }
[data-club-page="champigny"] .cp-team-card:nth-child(3) .cp-team-photo { background:linear-gradient(135deg,#6e5a62,#b78878); }
[data-club-page="champigny"] .cp-team-card:nth-child(4) .cp-team-photo { background:linear-gradient(135deg,#3a3450,#b78878); }
.cp-team-name { font-size:18px; font-weight:900; letter-spacing:-0.02em; margin-bottom:2px; }
.cp-team-role { font-size:11px; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; opacity:0.6; margin-bottom:12px; }
.cp-team-card p { font-size:13px; line-height:1.5; opacity:0.8; }
@media (max-width:980px) { .cp-team-grid { grid-template-columns:repeat(2, 1fr); } }
@media (max-width:520px) { .cp-team-grid { grid-template-columns:1fr; } }

/* ============== LOCATION ============== */
.cp-location { padding:100px 0; background:var(--paper); }
.cp-loc-grid { display:grid; grid-template-columns:1fr 1.1fr; gap:48px; align-items:start; }
.cp-loc-rows { margin:24px 0 28px; }
.cp-loc-row { display:grid; grid-template-columns:140px 1fr; padding:14px 0; border-top:1px solid rgba(0,0,0,0.12); font-size:14px; }
.cp-loc-row:last-child { border-bottom:1px solid rgba(0,0,0,0.12); }
.cp-loc-row .k { font-size:11px; font-weight:800; letter-spacing:0.14em; text-transform:uppercase; opacity:0.55; padding-top:2px; }
.cp-loc-row .v { line-height:1.5; }
.cp-loc-cta { display:flex; gap:12px; flex-wrap:wrap; }

.cp-loc-map { position:sticky; top:120px; }
.cp-map-frame {
  position:relative; aspect-ratio:1/1.05;
  background:var(--cream); border:1.5px solid var(--midnight);
  overflow:hidden;
}
.cp-map-grid {
  position:absolute; inset:0;
  background-image:
    linear-gradient(rgba(0,0,0,0.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,0,0,0.06) 1px, transparent 1px);
  background-size:40px 40px;
}
.cp-map-roads {
  position:absolute; inset:0;
  background:
    linear-gradient(115deg, transparent 35%, rgba(0,0,0,0.12) 35%, rgba(0,0,0,0.12) 38%, transparent 38%),
    linear-gradient(40deg, transparent 50%, rgba(0,0,0,0.12) 50%, rgba(0,0,0,0.12) 52%, transparent 52%),
    linear-gradient(160deg, transparent 60%, rgba(0,0,0,0.08) 60%, rgba(0,0,0,0.08) 62%, transparent 62%);
}
.cp-map-pin {
  position:absolute; left:48%; top:46%;
  display:flex; align-items:center; gap:10px;
  transform:translate(-50%,-50%);
}
.pin-dot {
  width:22px; height:22px; border-radius:50%; background:var(--yellow);
  border:2px solid var(--midnight);
  box-shadow:0 0 0 8px rgba(255,237,90,0.3), 0 4px 12px rgba(0,0,0,0.3);
  animation:pulse 2s infinite;
}
.pin-label {
  background:var(--midnight); color:var(--yellow); padding:6px 10px;
  font-size:11px; font-weight:800; letter-spacing:0.1em; text-transform:uppercase;
  white-space:nowrap;
}
.cp-map-cap {
  position:absolute; left:14px; bottom:14px;
  font-size:10px; font-weight:700; letter-spacing:0.14em; opacity:0.5;
}
@media (max-width:980px) { .cp-loc-grid { grid-template-columns:1fr; } .cp-loc-map { position:static; } }

/* ============== FINAL CTA ============== */
.cp-final-cta { padding:100px 0; background:var(--cream); }
.cp-final-card {
  background:var(--midnight); color:var(--paper);
  padding:80px 60px; text-align:center;
  border:1.5px solid var(--midnight);
  position:relative; overflow:hidden;
}
.cp-final-card::before {
  content:''; position:absolute; right:-60px; top:-60px;
  width:200px; height:200px; border-radius:50%;
  background:var(--yellow); opacity:0.18;
}
.cp-final-h {
  font-size:clamp(46px, 6vw, 88px); line-height:0.9; letter-spacing:-0.05em;
  text-transform:uppercase; margin-bottom:20px;
}
.cp-final-h .l1 { font-weight:300; display:block; }
.cp-final-h .l2 { font-weight:900; display:block; color:var(--yellow); }
.cp-final-card p { font-size:16px; line-height:1.55; max-width:520px; margin:0 auto 32px; opacity:0.8; }
.cp-final-cta-row { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }

/* ============== FOOTER ============== */
.cp-footer { background:var(--midnight); color:var(--paper); padding:60px 0 24px; border-top:1.5px solid var(--midnight); }
.cp-footer-grid { display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:32px; padding-bottom:36px; border-bottom:1px solid rgba(255,255,255,0.15); }
/* Même graphie que le logo du footer partagé (.footer-brand h3 · retour équipe
   20/07 : le footer des pages club affichait « escapad » en minuscules).
   Taille conservée : la grille du footer club est plus étroite. */
.cp-footer-logo { font-size:24px; font-weight:900; letter-spacing:-0.055em; text-transform:uppercase; margin-bottom:8px; }
.cp-footer p { font-size:13px; opacity:0.6; line-height:1.5; }
.cp-footer h5 { font-size:11px; font-weight:800; letter-spacing:0.14em; text-transform:uppercase; opacity:0.6; margin-bottom:12px; }
.cp-footer ul { list-style:none; padding:0; margin:0; }
.cp-footer ul li { padding:4px 0; font-size:13px; }
.cp-footer ul li a { color:inherit; }
.cp-footer ul li a:hover { color:var(--yellow); }
.cp-footer-bottom { margin-top:24px; font-size:11px; letter-spacing:0.1em; opacity:0.4; }
@media (max-width:780px) { .cp-footer-grid { grid-template-columns:1fr 1fr; } }

/* btn-xl */
.btn.btn-xl { padding:18px 32px; font-size:16px; }

/* Photo d'en-tête du hero (Paris Est · retour équipe 20/07) : pleine surface
   sous le scrim existant. Éditable via /admin (hero.image). */
.cp-hero-photo { position:absolute; inset:0; }
.cp-hero-photo img { width:100%; height:100%; object-fit:cover; display:block; }
