:root{
  --red:#C8102E; --red-dark:#8E0B20; --red-light:#E8646F;
  --ink:#17120F; --ink-soft:#4A423E; --gray:#6B625E; --gray-light:#9A918C;
  --cream:#F6F2EE; --white:#fff; --line:rgba(23,18,15,.13);
  --title:Anton,Impact,sans-serif; --cond:'Barlow Condensed',Arial Narrow,sans-serif; --body:Barlow,system-ui,sans-serif;
  --wrap:1240px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--cream);color:var(--ink);font-family:var(--body);font-size:17px;line-height:1.55}
img{max-width:100%;height:auto}
a{color:var(--red);text-decoration:none}
a:hover{color:var(--red-dark);text-decoration:underline}
h1,h2,h3{font-family:var(--title);text-transform:uppercase;letter-spacing:-.01em;margin:0}
p{text-wrap:pretty}
code{font-family:ui-monospace,Menlo,monospace;background:rgba(23,18,15,.07);padding:1px 5px;font-size:.92em}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
.skip{position:absolute;left:-9999px}
.skip:focus{left:8px;top:8px;background:var(--ink);color:#fff;padding:10px 16px;z-index:99}

/* bandeau */
.ticker{background:var(--ink);color:var(--cream);font-family:var(--cond);font-size:15px;letter-spacing:.08em;text-transform:uppercase;display:flex;justify-content:center;gap:28px;padding:9px 24px;flex-wrap:wrap}
.ticker-tag{color:var(--red-light)}
.ticker .dim{opacity:.65}
.ticker b{color:#fff}

/* header */
.site-header{position:sticky;top:0;z-index:40;background:var(--cream);border-bottom:1px solid var(--line)}
.header-inner{display:flex;align-items:center;gap:24px;padding-top:12px;padding-bottom:12px}
.brand{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none}
.brand:hover{text-decoration:none;color:inherit}
.brand-name{display:block;font-family:var(--title);font-size:19px;text-transform:uppercase;line-height:1}
.brand-sub{display:block;font-family:var(--cond);font-size:13px;letter-spacing:.22em;text-transform:uppercase;color:var(--red);margin-top:4px}
.nav{margin-left:auto;display:flex;align-items:center;gap:2px;flex-wrap:wrap;font-family:var(--cond);font-size:16px;letter-spacing:.09em;text-transform:uppercase}
.nav a{color:var(--ink);padding:10px 11px 8px;position:relative;text-decoration:none}
.nav a:hover{color:var(--red);text-decoration:none}
.nav a.is-active::after{content:"";position:absolute;left:11px;right:11px;bottom:0;height:3px;background:var(--red)}
.nav-cta{background:var(--red);color:#fff!important;margin-left:8px;padding:10px 18px 8px!important}
.nav-cta:hover{background:var(--red-dark)}
.burger,.burger-check{display:none}

.breadcrumb{max-width:var(--wrap);margin:0 auto;padding:18px 24px 0;font-family:var(--cond);letter-spacing:.12em;text-transform:uppercase;font-size:13px;color:var(--gray)}

/* placeholders images */
.ph{position:relative;margin:0;display:flex;align-items:flex-end;padding:14px;border:1px solid var(--line);background:repeating-linear-gradient(135deg,rgba(23,18,15,.08) 0 8px,rgba(23,18,15,.03) 8px 16px);overflow:hidden}
.ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ph figcaption{position:relative;font-family:ui-monospace,Menlo,monospace;font-size:11px;color:var(--gray)}
.ph.dark{border-color:rgba(246,242,238,.18);background:repeating-linear-gradient(135deg,rgba(246,242,238,.09) 0 8px,rgba(246,242,238,.03) 8px 16px)}
.ph.dark figcaption{color:rgba(246,242,238,.6)}
.ph.r45{aspect-ratio:4/5}.ph.r43{aspect-ratio:4/3}.ph.r54{aspect-ratio:5/4}.ph.r32{aspect-ratio:3/2}.ph.r1611{aspect-ratio:16/11}.ph.sq{aspect-ratio:1;align-items:center;justify-content:center;padding:0}
.ph img{opacity:0;transition:opacity .2s}
.ph.is-loaded img{opacity:1}
.ph.is-loaded{background:#fff}
.ph.is-loaded figcaption{display:none}
.ph.contain img{inset:10%;width:80%;height:80%;object-fit:contain}
.ph.entiere img{object-fit:contain}

/* hero */
.hero{position:relative;background:repeating-linear-gradient(135deg,#241C18 0 14px,#1C1512 14px 28px);color:var(--cream);overflow:hidden}
.hero-inner{max-width:var(--wrap);margin:0 auto;padding:clamp(52px,7vw,96px) 24px clamp(48px,6vw,88px);display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:clamp(32px,4vw,56px);align-items:center}
.eyebrow{font-family:var(--cond);letter-spacing:.3em;text-transform:uppercase;font-size:13px;color:var(--red);margin-bottom:18px}
.hero .eyebrow{color:var(--red-light)}
.hero h1{font-size:clamp(42px,7vw,104px);line-height:.88;margin-bottom:26px}
.hero h1 span{color:var(--red)}
.hero p{font-size:19px;max-width:30em;color:rgba(246,242,238,.78);margin:0 0 34px}
.btn-row{display:flex;gap:14px;flex-wrap:wrap}
.btn{font-family:var(--cond);letter-spacing:.12em;text-transform:uppercase;font-size:17px;padding:15px 28px;background:var(--red);color:#fff;display:inline-block}
.btn:hover{background:var(--red-light);color:#fff;text-decoration:none}
.btn.ghost{background:transparent;border:1px solid rgba(246,242,238,.35);color:var(--cream)}
.btn.ghost:hover{background:rgba(246,242,238,.1);color:#fff}
.btn.light{background:#fff;color:var(--red)}
.btn.light:hover{background:var(--ink);color:#fff}
.stats{border-top:1px solid rgba(246,242,238,.14);background:rgba(0,0,0,.25)}
.stats-inner{max-width:var(--wrap);margin:0 auto;padding:26px 24px;display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:24px}
.stat-n{font-family:var(--title);font-size:40px;line-height:1;color:var(--red)}
.stat-l{font-family:var(--cond);letter-spacing:.16em;text-transform:uppercase;font-size:13px;color:rgba(246,242,238,.65);margin-top:6px}

/* sections */
.section{max-width:var(--wrap);margin:0 auto;padding:clamp(44px,6vw,76px) 24px 0}
.page-head{max-width:var(--wrap);margin:0 auto;padding:clamp(30px,5vw,56px) 24px 0}
.page-head h1{font-size:clamp(36px,6vw,82px);line-height:.92;margin:14px 0 12px}
.lead{font-size:17px;color:var(--gray);margin:0 0 36px;max-width:48em}
.section-head{display:flex;align-items:baseline;gap:20px;border-bottom:3px solid var(--ink);padding-bottom:12px;margin-bottom:32px;flex-wrap:wrap}
.section-head h2{font-size:clamp(26px,3.4vw,38px)}
.section-head .more{margin-left:auto;font-family:var(--cond);letter-spacing:.14em;text-transform:uppercase;font-size:15px}
.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:20px}
.split{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:clamp(32px,4vw,56px);align-items:center}
.split.top{align-items:start}

/* cartes */
.card{background:var(--white);border:1px solid var(--line);display:flex;flex-direction:column}
.card.accent{border-top:4px solid var(--red)}
.card.dark{background:var(--ink);color:var(--cream);border-color:var(--ink);border-top:4px solid var(--red)}
.card-body{padding:20px}
.meta{font-family:var(--cond);letter-spacing:.16em;text-transform:uppercase;font-size:12px;color:var(--red)}
.card.dark .meta{color:var(--red-light)}
.card h3{font-size:21px;line-height:1.15;margin:10px 0 8px}
.card p{margin:0;font-size:15px;color:var(--gray)}
.card.dark p{color:rgba(246,242,238,.75)}
.score-row{display:flex;justify-content:space-between;font-family:var(--title);font-size:24px;text-transform:uppercase;margin-top:12px}
.score-row.loser{color:var(--gray)}
.verdict{margin-top:16px;font-family:var(--cond);letter-spacing:.14em;text-transform:uppercase;font-size:13px;color:var(--red)}
.verdict.draw{color:var(--gray)}

/* tableau calendrier */
.table-wrap{background:var(--white);border:1px solid var(--line);overflow-x:auto}
table{border-collapse:collapse;width:100%;min-width:760px;font-size:16px}
thead tr{background:var(--ink);color:var(--cream);font-family:var(--cond);letter-spacing:.14em;text-transform:uppercase;font-size:14px;text-align:left}
th,td{padding:14px 18px}
th{font-weight:600}
tbody tr{border-bottom:1px solid rgba(23,18,15,.1)}
tbody tr:nth-child(even){background:rgba(23,18,15,.025)}
tbody tr.next{border-left:4px solid var(--red)}
td.num{text-align:right;font-family:var(--title);font-size:19px}
td.win{color:var(--red)}
td.dim,th.num{color:var(--gray)}
th.num{text-align:right}
.legend{display:flex;gap:24px;flex-wrap:wrap;margin-top:18px;font-family:var(--cond);letter-spacing:.1em;text-transform:uppercase;font-size:14px;color:var(--gray)}
.swatch{display:inline-block;width:10px;height:10px;background:var(--red);margin-right:8px}

/* murs de miniatures */
.thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:12px}
.logos{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.logos .ph{aspect-ratio:3/2;background:#fff;align-items:center;justify-content:center;padding:14px}
.logos .ph img{inset:14px;width:calc(100% - 28px);height:calc(100% - 28px);object-fit:contain}
.thumbs > p, .logos > p{grid-column:1/-1;margin:0}
.wall-empty{display:block}
.thumbs .ph:hover,.logos .ph:hover,.poule-grid .club:hover{border-color:var(--red)}

/* visionneuse */
.wall-cell{display:block;cursor:zoom-in}
.lightbox{position:fixed;inset:0;z-index:100;background:rgba(9,7,6,.94);display:flex;align-items:center;justify-content:center;padding:clamp(16px,4vw,56px)}
.lightbox[hidden]{display:none}
.lightbox figure{margin:0;display:flex;flex-direction:column;align-items:center;gap:18px;max-width:100%;max-height:100%}
.lightbox img{max-width:min(1200px,92vw);max-height:76vh;width:auto;height:auto;object-fit:contain;background:#fff}
.lightbox figcaption{font-family:var(--cond);letter-spacing:.14em;text-transform:uppercase;font-size:15px;color:var(--cream);text-align:center}
.lb-close,.lb-nav{position:absolute;background:none;border:0;color:var(--cream);font-family:var(--body);cursor:pointer;line-height:1;padding:12px}
.lb-close{top:10px;right:14px;font-size:40px}
.lb-nav{top:50%;transform:translateY(-50%);font-size:56px;width:64px}
.lb-prev{left:4px}
.lb-next{right:4px}
.lb-close:hover,.lb-nav:hover{color:var(--red-light)}

/* poule */
.seasons{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.seasons .label{font-family:var(--cond);letter-spacing:.18em;text-transform:uppercase;font-size:13px;color:var(--gray)}
.season-btn{font-family:var(--cond);letter-spacing:.12em;text-transform:uppercase;font-size:15px;padding:9px 18px;border:1px solid rgba(23,18,15,.2);background:transparent;color:var(--ink);cursor:pointer}
.season-btn:hover{border-color:var(--red)}
.season-btn[aria-pressed="true"]{background:var(--red);border-color:var(--red);color:#fff}
.poule-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:14px}
.club{background:#fff;border:1px solid var(--line);border-top:4px solid transparent;display:flex;flex-direction:column}
.club.home{border-color:var(--red);border-top-color:var(--red)}
.club-name{padding:14px 14px 16px;font-family:var(--cond);font-size:17px;line-height:1.2;text-transform:uppercase;letter-spacing:.03em}
[hidden]{display:none!important}

/* bandeaux */
.cta-band{background:var(--red);color:#fff;padding:clamp(28px,4vw,54px);display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:36px;align-items:center}
.cta-band h2{font-size:clamp(30px,4vw,44px);line-height:1;margin-bottom:16px}
.cta-band p{margin:0;color:rgba(255,255,255,.88);max-width:34em}
.cta-band .btn{justify-self:end}
.band-dark{background:var(--ink);color:var(--cream);padding:clamp(26px,4vw,40px);display:flex;align-items:center;gap:40px;flex-wrap:wrap}
.band-dark h2{font-size:clamp(24px,3vw,32px);line-height:1.05}
.band-dark p{color:rgba(246,242,238,.78);margin:12px 0 0;max-width:40em}
.band-dark .grow{flex:1;min-width:280px}

/* infos club */
.info-dark{background:var(--ink);color:var(--cream);padding:26px}
.info-dark .eyebrow{color:var(--red-light)}
.info-row{display:flex;justify-content:space-between;gap:16px;border-bottom:1px solid rgba(246,242,238,.15);padding:10px 0}
.info-row:last-child{border-bottom:0}
.info-row span:first-child{color:rgba(246,242,238,.65)}
.prose{font-size:18px;line-height:1.7;color:var(--ink-soft)}
.prose .intro{font-size:22px;line-height:1.5;color:var(--ink)}
.prose p{margin:0 0 18px}
.stack{display:flex;flex-direction:column;gap:20px}
.contact-block{border-top:3px solid var(--ink);padding-top:18px;margin-bottom:28px}
.contact-block .k{font-family:var(--cond);letter-spacing:.18em;text-transform:uppercase;font-size:13px;color:var(--gray);margin-bottom:8px}
.contact-block .v{font-size:19px;line-height:1.5}

/* carte */
.map{display:flex;flex-direction:column;gap:12px}
.map iframe{width:100%;aspect-ratio:16/11;height:auto;border:1px solid var(--line);display:block}
.map-link{margin:0;font-family:var(--cond);letter-spacing:.12em;text-transform:uppercase;font-size:14px}

/* presse */
.press-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}
.press-card{background:#fff;border:1px solid var(--line);color:var(--ink);display:flex;flex-direction:column}
.press-card:hover{border-color:var(--red);text-decoration:none;color:var(--ink)}
.press-card.dark{background:var(--ink);color:var(--cream);border-color:var(--ink)}
.press-card.dark:hover{color:var(--cream)}
.press-card .go{font-family:var(--cond);letter-spacing:.12em;text-transform:uppercase;font-size:14px;color:var(--red)}
.press-card.dark .go{color:var(--red-light)}

/* footer */
.site-footer{margin-top:clamp(56px,8vw,96px);background:var(--ink);color:rgba(246,242,238,.7)}
.footer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:40px;padding-top:56px;padding-bottom:40px}
.footer-brand{display:flex;gap:16px;align-items:flex-start}
.footer-name{font-family:var(--title);font-size:20px;color:var(--cream);text-transform:uppercase}
.footer-brand p{font-size:15px;margin:8px 0 0;max-width:26em}
.footer-h{font-family:var(--cond);letter-spacing:.2em;text-transform:uppercase;font-size:13px;color:var(--red-light);margin-bottom:14px}
.footer-list{list-style:none;margin:0;padding:0;display:grid;gap:9px;font-size:15px}
.footer-list a{color:rgba(246,242,238,.7)}
.footer-list a:hover{color:var(--cream)}
.footer-bottom{border-top:1px solid rgba(246,242,238,.14);margin-top:0;padding-top:18px;padding-bottom:18px;font-family:var(--cond);letter-spacing:.14em;text-transform:uppercase;font-size:13px;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;max-width:var(--wrap)}

@media (max-width:1080px){
  .nav{font-size:15px}
  .nav a{padding:10px 8px 8px}
}
@media (max-width:900px){
  .burger{display:flex;flex-direction:column;justify-content:center;gap:5px;margin-left:auto;width:44px;height:44px;cursor:pointer;padding:10px}
  .burger span{display:block;height:2px;background:var(--ink)}
  .nav{display:none;order:3;width:100%;margin:0;flex-direction:column;align-items:stretch;gap:0;border-top:1px solid var(--line);padding-top:8px}
  .burger-check:checked ~ .nav{display:flex}
  .nav a{padding:14px 4px;border-bottom:1px solid var(--line);font-size:17px}
  .nav a.is-active::after{left:4px;right:auto;width:22px}
  .nav-cta{margin:12px 0 4px;text-align:center;padding:14px 18px!important}
  .cta-band .btn{justify-self:start}
  .ticker{gap:14px;font-size:14px}
}
@media (max-width:560px){
  body{font-size:16px}
  .brand-name{font-size:16px}
  .brand img{width:44px;height:44px}
  .ticker .dim{display:none}
  .prose .intro{font-size:19px}
  .hero p{font-size:17px}
}
@media print{
  .ticker,.burger,.nav,.site-header,.site-footer,.breadcrumb{display:none!important}
  body{background:#fff;font-size:12pt}
}
