/*
Theme Name: Montpellier en Salle
Theme URI: https://salledesportmontpellier.fr/
Author: Montpellier en Salle
Description: Annuaire des salles de sport de Montpellier et de l'Hérault — pierre blonde, terre cuite, soleil et lagune, arceaux de l'aqueduc.
Version: 1.0.0
Text Domain: msp
*/
@font-face{font-family:"Unbounded";src:url(assets/fonts/unbounded.woff2) format("woff2");font-weight:200 900;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Instrument Sans";src:url(assets/fonts/instrument-sans.woff2) format("woff2");font-weight:400 700;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{--ink:#2b1810;--ink2:#4a2c1d;--paper:#f7f0e4;--card:#fffdf8;--line:#e6d8c1;--sig:#c4472a;--sig-d:#9d3319;--sun:#f6b73c;--lagon:#0f7d86;--lagon-d:#0a5d65;--mute:#6b5a4d;--soft:#f0e5d1;--r:8px;--titre:"Unbounded","Arial Black",system-ui,sans-serif;--corps:"Instrument Sans",system-ui,sans-serif;--w:1180px}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.62 var(--corps)}
img,svg{max-width:100%;height:auto}a{color:var(--sig-d)}a:hover{color:var(--lagon-d)}
h1,h2,h3,h4{font-family:var(--titre);font-weight:700;line-height:1.2;letter-spacing:-.02em;margin:0 0 .55em}
h1{font-size:clamp(1.75rem,3.9vw,2.9rem);font-weight:800;line-height:1.1}h2{font-size:clamp(1.25rem,2.2vw,1.65rem)}h3{font-size:1.02rem}
p{margin:0 0 1em}.wrap{width:min(100% - 2.2rem,var(--w));margin-inline:auto}
.sr{position:absolute;left:-9999px}
:focus-visible{outline:3px solid var(--lagon);outline-offset:2px;border-radius:4px}
.skip{position:absolute;left:-9999px;top:0;background:var(--ink);color:#fff;padding:.6rem 1rem;z-index:99}.skip:focus{left:0}
/* filet tricolore */
.bande{height:7px;background:linear-gradient(90deg,var(--sig) 0 34%,var(--sun) 34% 66%,var(--lagon) 66%)}
/* en-tête */
.top{background:var(--paper);border-bottom:2px solid var(--ink);position:sticky;top:0;z-index:40}
.top .wrap{display:flex;align-items:center;gap:1.4rem;min-height:70px}
.logo{display:flex;align-items:center;gap:.7rem;text-decoration:none;color:var(--ink)}
.logo svg{width:40px;height:40px;flex:none}.logo b{font:800 1rem/1.05 var(--titre);letter-spacing:-.03em;display:block}.logo small{display:block;font:500 .72rem/1.2 var(--corps);color:var(--mute);margin-top:.22rem}
.nav{display:flex;gap:.2rem;margin-left:auto;align-items:center}
.nav a{font:600 .92rem var(--corps);text-decoration:none;padding:.55rem .8rem;border-radius:6px;color:var(--ink)}.nav a:hover{background:var(--soft);color:var(--ink)}
.nav a.cta{background:var(--sig);color:#fff;padding:.6rem 1.05rem;border:2px solid var(--ink);box-shadow:3px 3px 0 var(--ink)}.nav a.cta:hover{background:var(--sig-d);color:#fff;transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--ink)}
.burger{display:none;margin-left:auto;background:var(--ink);color:#fff;border:0;border-radius:6px;padding:.6rem .85rem;font:600 .9rem var(--corps)}
@media(max-width:860px){.burger{display:block}.nav{display:none;position:absolute;left:0;right:0;top:100%;background:var(--paper);border-bottom:2px solid var(--ink);flex-direction:column;align-items:stretch;padding:.6rem 1.1rem 1rem;margin:0}.nav.on{display:flex}.nav a{padding:.8rem .6rem}}
/* héros : soleil + arceaux de l'aqueduc */
.hero{background:linear-gradient(180deg,var(--paper) 0,#f3e6cc 100%);color:var(--ink);position:relative;overflow:hidden}
.soleil{position:absolute;right:max(-110px,calc(50% - 760px));top:-90px;width:440px;height:440px;border-radius:50%;background:radial-gradient(circle at 40% 40%,#ffd36b 0,var(--sun) 52%,rgba(246,183,60,.35) 53%,rgba(246,183,60,0) 72%)}
.hero .wrap{position:relative;padding:3.4rem 0 4.6rem;display:grid;grid-template-columns:1.1fr .9fr;gap:2.6rem;align-items:center}
.hero h1{max-width:17ch}.hero h1 em{font-style:normal;color:var(--sig);background:linear-gradient(transparent 88%,var(--lagon) 88% 94%,transparent 94%)}
.hero p.lead{font-size:1.1rem;color:var(--ink2);max-width:48ch}
.kpis{display:flex;gap:1.8rem;flex-wrap:wrap;margin-top:1.5rem}.kpis div{font:500 .85rem var(--corps);color:var(--mute)}.kpis b{display:block;font:800 1.7rem/1 var(--titre);color:var(--ink);letter-spacing:-.04em}
.pointage{background:var(--card);color:var(--ink);border:2px solid var(--ink);border-radius:var(--r);padding:1.5rem;position:relative;box-shadow:7px 7px 0 var(--ink)}
.pointage h2{font-size:1.1rem}.pointage .sep{border:0;border-top:2px dashed var(--line);margin:1rem 0}
.arceaux{position:absolute;left:0;right:0;bottom:0;height:34px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='68' height='34' viewBox='0 0 68 34'%3E%3Crect width='68' height='34' fill='%23c4472a'/%3E%3Cpath d='M12 34V20a22 22 0 0 1 44 0v14z' fill='%23f7f0e4'/%3E%3C/svg%3E") repeat-x left bottom/68px 34px}
@media(max-width:900px){.hero .wrap{grid-template-columns:1fr;padding-bottom:4rem}.soleil{width:300px;height:300px;top:-110px}}
/* champs */
label{display:block;font:600 .88rem var(--corps);margin:0 0 .3rem}
input[type=text],input[type=tel],input[type=email],select,textarea{width:100%;padding:.8rem .9rem;border:2px solid var(--ink);border-radius:6px;background:#fff;color:var(--ink);font:400 1rem var(--corps)}
input:focus,select:focus,textarea:focus{border-color:var(--lagon);outline:0;box-shadow:0 0 0 3px rgba(15,125,134,.25)}
textarea{min-height:120px;resize:vertical}.champ{margin-bottom:1rem}.duo{display:grid;grid-template-columns:1fr 1fr;gap:1rem}@media(max-width:620px){.duo{grid-template-columns:1fr}}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;background:var(--sig);color:#fff;border:2px solid var(--ink);border-radius:6px;padding:.8rem 1.25rem;font:700 .98rem var(--corps);text-decoration:none;cursor:pointer;box-shadow:3px 3px 0 var(--ink);transition:transform .12s,box-shadow .12s,background .12s}
.btn:hover{background:var(--sig-d);color:#fff;transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--ink)}.btn.bloc{width:100%}
.btn.sec{background:var(--card);color:var(--ink)}.btn.sec:hover{background:var(--sun);color:var(--ink)}
.btn.sm{padding:.5rem .85rem;font-size:.88rem;box-shadow:2px 2px 0 var(--ink)}
/* sections */
.sec-t{padding:3.4rem 0}.sec-t.alt{background:var(--soft);border-block:2px solid var(--line)}.sec-t.nuit{background:var(--ink);color:#fff}.sec-t.nuit h2{color:#fff}
.tete{display:flex;align-items:end;justify-content:space-between;gap:1rem;margin-bottom:1.6rem;flex-wrap:wrap}.tete p{color:var(--mute);margin:0}.tete a.plus{font:700 .92rem var(--corps)}
.eyebrow{display:inline-block;font:700 .74rem var(--corps);text-transform:uppercase;letter-spacing:.14em;color:var(--lagon-d);margin-bottom:.55rem}
.nuit .eyebrow{color:var(--sun)}
/* puces / enseignes / communes */
.puces{display:flex;flex-wrap:wrap;gap:.55rem;list-style:none;padding:0;margin:0}
.puces a{display:inline-flex;align-items:center;gap:.5rem;background:var(--card);border:2px solid var(--ink);border-radius:999px;padding:.35rem .9rem;text-decoration:none;font:600 .9rem var(--corps);color:var(--ink)}
.puces a:hover{background:var(--sun);color:var(--ink)}.puces small{color:var(--mute);font:500 .8rem var(--corps)}
.grille{display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(235px,1fr))}
.tuile{display:flex;flex-direction:column;gap:.35rem;background:var(--card);border:2px solid var(--ink);border-radius:var(--r);padding:1.1rem 1.2rem;text-decoration:none;color:var(--ink);position:relative;transition:transform .12s,box-shadow .12s}
.tuile:hover{transform:translate(-2px,-2px);box-shadow:5px 5px 0 var(--sig);color:var(--ink)}.tuile b{font:700 .95rem/1.25 var(--titre);letter-spacing:-.02em}.tuile span{color:var(--mute);font-size:.9rem}
.tuile .mono{margin-bottom:.4rem}
.mono{display:inline-grid;place-items:center;width:44px;height:48px;border-radius:22px 22px 6px 6px;color:#fff;font:800 .95rem var(--titre);flex:none;position:relative;border:2px solid var(--ink)}
.mono span{margin-top:6px;color:#fff;letter-spacing:-.04em}
/* fiches */
.liste{display:grid;gap:1rem}
.ticket{display:grid;grid-template-columns:auto 1fr auto;gap:1rem 1.2rem;align-items:center;background:var(--card);border:2px solid var(--ink);border-radius:var(--r);padding:1.05rem 1.3rem;position:relative;transition:box-shadow .12s,transform .12s}
.ticket:hover{box-shadow:5px 5px 0 var(--lagon);transform:translate(-2px,-2px)}
.ticket h3{margin:0 0 .2rem;font-size:.98rem}.ticket h3 a{text-decoration:none;color:var(--ink)}.ticket h3 a:hover{color:var(--sig-d)}
.ticket .meta{color:var(--mute);font-size:.92rem;margin:0}.ticket .tag{display:inline-block;background:var(--sun);border-radius:5px;padding:.08rem .5rem;font:700 .72rem var(--corps);color:var(--ink);margin-right:.4rem;text-transform:uppercase;letter-spacing:.05em}
.ticket .tag.pub{background:#d5ecee;color:var(--lagon-d)}
.ticket .act{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:flex-end}
@media(max-width:700px){.ticket{grid-template-columns:auto 1fr}.ticket .act{grid-column:1/-1;justify-content:flex-start}}
/* fil d'ariane */
.fil{font-size:.88rem;color:var(--mute);padding:1rem 0 .2rem}.fil ol{list-style:none;display:flex;flex-wrap:wrap;gap:.3rem;padding:0;margin:0}.fil li+li:before{content:"›";margin-right:.3rem;color:#a8957f}.fil a{color:var(--mute);text-decoration:none}.fil a:hover{color:var(--sig-d)}
/* entête de page annuaire */
.entete{background:var(--card);border-bottom:2px solid var(--ink)}
.entete .wrap{padding:.6rem 0 2rem}.entete h1{margin:.5rem 0 .6rem}.entete .chapo{font-size:1.06rem;color:var(--mute);max-width:70ch;margin:0}
.chiffres{display:flex;gap:.7rem;flex-wrap:wrap;margin-top:1.1rem}.chiffres span{background:var(--soft);border:1.5px solid var(--line);border-radius:999px;padding:.3rem .9rem;font:600 .86rem var(--corps)}
/* mise en page 2 colonnes */
.cols{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:2rem;padding:2rem 0 3rem;align-items:start}
.cols aside{position:sticky;top:96px;display:grid;gap:1.2rem}@media(max-width:980px){.cols{grid-template-columns:1fr}.cols aside{position:static}}
.carte{background:var(--card);border:2px solid var(--ink);border-radius:var(--r);padding:1.3rem}
.carte h2,.carte h3{margin-bottom:.7rem}.carte.nuit{background:var(--ink);color:#fff;border-color:var(--ink);box-shadow:6px 6px 0 var(--sun)}.carte.nuit h2,.carte.nuit h3{color:#fff}.carte.nuit label{color:#f1e6d3}.carte.nuit .aide{color:#cdb99f}
.aide{font-size:.85rem;color:var(--mute);margin:.6rem 0 0}
.texte p{max-width:72ch}.texte h2{margin-top:1.6em}
dl.infos{display:grid;grid-template-columns:140px 1fr;gap:.6rem 1rem;margin:0}dl.infos dt{font:600 .9rem var(--corps);color:var(--mute)}dl.infos dd{margin:0}
@media(max-width:560px){dl.infos{grid-template-columns:1fr}dl.infos dt{margin-top:.4rem}}
.etapes{counter-reset:e;display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));list-style:none;padding:0;margin:0}
.etapes li{counter-increment:e;background:var(--card);border:2px solid var(--ink);border-radius:var(--r);padding:1.3rem;position:relative;border-top:8px solid var(--lagon)}
.etapes li:before{content:counter(e);font:800 2rem/1 var(--titre);color:var(--sig);display:block;margin-bottom:.5rem}.etapes b{display:block;font:700 1rem var(--titre);margin-bottom:.3rem}
.alerte{background:#fbe3da;border:2px solid var(--sig);border-radius:8px;padding:.8rem 1rem;margin-bottom:1rem;color:#7a2410;font-weight:600}
.ok-bloc{background:#e0f1f2;border:2px solid var(--lagon);border-radius:var(--r);padding:1.6rem;text-align:center}.ok-bloc .code{font:800 1.8rem var(--titre);letter-spacing:.1em}
.bandeau{background:var(--lagon);color:#fff;border-block:2px solid var(--ink)}.bandeau .wrap{display:flex;gap:1.5rem;align-items:center;justify-content:space-between;padding:2.2rem 0;flex-wrap:wrap}.bandeau h2{color:#fff;margin:0}.bandeau p{margin:.3rem 0 0;color:#dff3f4}
.bandeau .btn{background:var(--sun);color:var(--ink)}.bandeau .btn:hover{background:#ffc95e;color:var(--ink)}
.radios{display:grid;gap:.6rem}.radios label{display:flex;gap:.7rem;align-items:flex-start;background:var(--card);border:2px solid var(--line);border-radius:8px;padding:.8rem 1rem;font:500 .98rem var(--corps);cursor:pointer;margin:0}.radios input{margin-top:.35rem;accent-color:var(--sig)}
.radios label:has(input:checked){border-color:var(--sig);background:#fdeee8}
.coche{display:flex;gap:.6rem;align-items:flex-start;font-size:.88rem;font-family:var(--corps);font-weight:400}.coche input{margin-top:.25rem;accent-color:var(--sig)}
/* articles */
.cartes{display:grid;gap:1.2rem;grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.art{background:var(--card);border:2px solid var(--ink);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column}.art img{width:100%;aspect-ratio:3/2;object-fit:cover;display:block}
.art .pl{aspect-ratio:3/2;background:linear-gradient(135deg,var(--sig),var(--sig-d));display:grid;place-items:center;color:var(--sun);font:800 3rem var(--titre)}
.art div.c{padding:1rem 1.2rem 1.3rem}.art h3{font-size:.95rem}.art h3 a{text-decoration:none;color:var(--ink)}.art h3 a:hover{color:var(--sig-d)}.art small{color:var(--mute)}
.corps{max-width:760px;font-size:1.05rem}.corps h2{margin-top:1.8em}.corps img{border-radius:8px}.corps table{border-collapse:collapse;width:100%}.corps th,.corps td{border:1px solid var(--line);padding:.5rem .7rem;text-align:left}
.art-tete{background:var(--card);border-bottom:2px solid var(--ink)}.art-tete .wrap{padding:1rem 0 2rem;max-width:860px}
/* pied de page */
.pied{background:var(--ink);color:#d8c7ae;margin-top:0}.pied a{color:#f3e8d4;text-decoration:none}.pied a:hover{color:var(--sun)}
.pied .wrap{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:2rem;padding:3rem 0 2rem}@media(max-width:860px){.pied .wrap{grid-template-columns:1fr 1fr}}@media(max-width:520px){.pied .wrap{grid-template-columns:1fr}}
.pied h2{font:700 .78rem var(--corps);text-transform:uppercase;letter-spacing:.14em;color:var(--sun);margin-bottom:.8rem}.pied ul{list-style:none;padding:0;margin:0;display:grid;gap:.4rem;font-size:.95rem}
.pied .logo{color:#fff}.pied .logo small{color:#cdb99f}.pied .note{font-size:.85rem;color:#cdb99f;margin-top:1rem}
.pied .bas{border-top:1px solid #5a3a28}.pied .bas .wrap{display:block;padding:1.2rem 0;font-size:.83rem;color:#bfa98c}
.pagination{display:flex;gap:.5rem;flex-wrap:wrap;margin:2rem 0}.pagination a,.pagination span{padding:.5rem .9rem;border:2px solid var(--ink);border-radius:6px;text-decoration:none;font:600 .92rem var(--corps);background:#fff}.pagination .current{background:var(--ink);color:#fff}
@media print{.top,.pied,.hero .pointage,.bande{display:none}}
.carte.nuit .radios label{color:var(--ink)}.carte.nuit .radios label span{color:var(--ink)}
.carte.nuit a{color:var(--sun)}.carte.nuit .coche{color:#f1e6d3}
.mono{color:#fff}.mono span{color:#fff}
.cartes>*,.art>a{min-width:0;max-width:100%}.art>a{display:block}
