/*
Theme Name: House of Sports
Theme URI: https://house-of-sports.fr/
Description: Thème maison léger pour House of Sports (blog sport). Reproduit le design existant sans Astra ni Elementor. PHP classique.
Author: House of Sports
Version: 1.1.0
Text Domain: house-of-sports
*/
:root{
  --paper:#ffffff;
  --wash:#f6f7f8;
  --ink:#0c0c0c;          /* titres / corps */
  --slate:#334155;        /* secondaire */
  --muted:#8a8f98;
  --line:#ececec;
  --accent:#5c6a7d;       /* liens et survols (ardoise, meme famille que le gris du site) */
  --accent-dk:#425063;    /* survol appuye */
  --accent-soft:#97a3b6;  /* aplats, filets, bordures : le gris accent du site */
  --maxw:1240px;
  --gut:clamp(16px,4vw,40px);
  --display:'Bebas Neue', 'Arial Narrow', sans-serif;
  --body:'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{font-family:var(--display);font-weight:400;line-height:1.05;margin:0 0 .3em;color:var(--ink);letter-spacing:.01em}
p{margin:0 0 1.1em}
.hos-wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--gut)}
.hos-kick{display:inline-block;font-family:var(--body);font-weight:700;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--slate)}
.hos-btn{display:inline-block;font-family:var(--display);font-size:1.15rem;letter-spacing:.04em;padding:.5em 1.4em;background:var(--accent-soft);color:var(--ink);transition:.2s}
.hos-btn:hover{background:var(--accent);color:#fff}

/* HEADER */
.hos-head{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.98);backdrop-filter:saturate(180%) blur(6px);border-bottom:1px solid var(--line)}
.hos-head__in{max-width:var(--maxw);margin:0 auto;padding:14px var(--gut);display:flex;align-items:center;justify-content:space-between;gap:24px}
.hos-logo img{max-height:48px;width:auto}
.hos-logo span{font-family:var(--display);font-size:1.8rem;color:var(--ink)}
.hos-nav ul{list-style:none;display:flex;flex-wrap:wrap;gap:24px;margin:0;padding:0}
.hos-nav a{font-family:var(--display);font-size:1.25rem;letter-spacing:.03em;color:var(--ink);transition:.15s}
.hos-nav a:hover,.hos-nav .current-menu-item>a,.hos-nav .current-cat>a{color:var(--accent)}
.hos-burger{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:6px}
.hos-burger span{width:26px;height:2px;background:var(--ink);display:block}
@media(max-width:940px){
  .hos-burger{display:flex}
  .hos-nav{position:absolute;left:0;right:0;top:100%;background:var(--paper);border-bottom:1px solid var(--line);max-height:0;overflow:hidden;transition:max-height .3s}
  .hos-nav.open{max-height:85vh}
  .hos-nav ul{flex-direction:column;gap:0;padding:6px 0}
  .hos-nav li{border-top:1px solid var(--line)}
  .hos-nav a{display:block;padding:14px var(--gut);font-size:1.4rem}
}

/* HERO 3-up overlay */
.hos-hero{padding:30px 0 8px}
.hos-hero__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,24px)}
.hos-ov{position:relative;display:block;aspect-ratio:3/4;overflow:hidden;background:#333}
.hos-ov img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s}
.hos-ov:hover img{transform:scale(1.05)}
.hos-ov__bg{position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,15,20,.1) 25%,rgba(15,15,20,.7) 100%)}
.hos-ov__c{position:absolute;left:0;right:0;bottom:0;padding:0 8% 10%;text-align:center;color:#fff}
.hos-ov__k{display:block;color:rgba(255,255,255,.85);margin-bottom:12px;letter-spacing:.18em}
.hos-ov__t{display:block;font-family:var(--display);font-size:clamp(1.5rem,2.4vw,2.1rem);line-height:1.02;color:#fff;text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:2px}
@media(max-width:760px){.hos-hero__grid{grid-template-columns:1fr}.hos-ov{aspect-ratio:16/10}}

/* BODY 2-col (main + sidebar à la une) */
.hos-body{display:grid;grid-template-columns:1fr 320px;gap:clamp(24px,3vw,48px);padding:40px 0}
@media(max-width:980px){.hos-body{grid-template-columns:1fr}}

/* SECTION rubrique */
.hos-sec{margin-bottom:44px}
.hos-sec__h{display:flex;align-items:baseline;justify-content:space-between;gap:16px;border-bottom:3px solid var(--ink);padding-bottom:6px;margin-bottom:24px}
.hos-sec__t{font-family:var(--display);font-size:clamp(1.7rem,3vw,2.3rem);color:var(--ink);margin:0}
.hos-sec__all{font-family:var(--display);font-size:1.1rem;letter-spacing:.03em;color:var(--accent);white-space:nowrap}
.hos-sec__all:hover{color:var(--accent-dk)}
.hos-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:clamp(16px,2vw,26px)}

/* CARD */
.hos-card{background:var(--paper);display:flex;flex-direction:column}
.hos-card__media{display:block;aspect-ratio:16/10;overflow:hidden;background:var(--wash);margin-bottom:12px}
.hos-card__media img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.hos-card:hover .hos-card__media img{transform:scale(1.05)}
.hos-card__t{font-family:var(--display);font-size:1.35rem;line-height:1.05;color:var(--ink);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.hos-card:hover .hos-card__t{color:var(--accent)}
.hos-card__m{font-family:var(--body);font-size:.74rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-top:8px}

/* SIDEBAR à la une */
.hos-side{position:sticky;top:90px;align-self:start}
.hos-side__h{font-family:var(--display);font-size:1.5rem;border-bottom:3px solid var(--ink);padding-bottom:6px;margin-bottom:18px}
.hos-alaune{display:block;padding:14px 0;border-bottom:1px solid var(--line)}
.hos-alaune__t{font-family:var(--display);font-size:1.2rem;line-height:1.05;color:var(--ink);text-decoration:underline;text-underline-offset:2px}
.hos-alaune:hover .hos-alaune__t{color:var(--accent)}
.hos-alaune__m{font-family:var(--body);font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin-top:5px}
@media(max-width:980px){.hos-side{position:static}}

/* ARCHIVE header */
.hos-arch{padding:44px var(--gut) 4px;text-align:center}
.hos-arch__t{font-family:var(--display);font-size:clamp(2.4rem,6vw,4rem);color:var(--ink);margin:.1em 0}
.hos-arch__d{color:var(--slate);max-width:42em;margin:.3em auto 0;font-family:var(--body)}
.hos-arch__rule{width:70px;height:4px;background:var(--accent-soft);margin:16px auto 0}
.hos-pag{display:flex;justify-content:center;gap:8px;margin:40px 0 0;flex-wrap:wrap;font-family:var(--body)}
.hos-pag a,.hos-pag span{padding:.55em .95em;border:1px solid var(--line);font-weight:700;font-size:.85rem;color:var(--ink)}
.hos-pag .current{background:var(--ink);color:#fff;border-color:var(--ink)}
.hos-pag a:hover{border-color:var(--ink)}

/* SINGLE */
.hos-cover{position:relative;max-width:1240px;margin:0 auto;aspect-ratio:16/8;overflow:hidden;background:#222}
.hos-cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hos-cover__bg{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,10,15,.15) 40%,rgba(10,10,15,.72) 100%)}
.hos-cover__c{position:absolute;left:0;right:0;bottom:0;padding:clamp(20px,5vw,60px) var(--gut)}
.hos-cover__c .hos-wrap{padding:0}
.hos-cover__k{color:rgba(255,255,255,.9);margin-bottom:12px}
.hos-cover__t{font-family:var(--display);font-size:clamp(2rem,4.5vw,3.6rem);line-height:1;color:#fff;text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:2px;max-width:20em}
.hos-artmeta{max-width:800px;margin:0 auto;padding:18px var(--gut) 0;font-family:var(--body);font-size:.8rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
/* single sans cover (fallback) */
.hos-arthead{max-width:800px;margin:0 auto;padding:40px var(--gut) 0;text-align:center}
.hos-arthead__t{font-family:var(--display);font-size:clamp(2rem,5vw,3.4rem);color:var(--ink);line-height:1;margin:.15em 0}

.hos-article{max-width:800px;margin:0 auto;padding:0 var(--gut)}
.hos-entry{font-family:var(--body);font-size:1.06rem;line-height:1.8;color:var(--ink);margin-top:30px}
.hos-entry p{margin:0 0 1.25em}
.hos-entry h2{font-family:var(--display);font-size:2rem;color:var(--ink);margin:1.5em 0 .4em;letter-spacing:.01em}
.hos-entry h3{font-family:var(--display);font-size:1.6rem;color:var(--ink);margin:1.3em 0 .35em}
.hos-entry a{color:var(--accent)}
.hos-entry a:hover{color:var(--accent-dk);text-decoration:underline}
.hos-entry img{margin:1.4em 0}
.hos-entry figure{margin:1.5em 0}
.hos-entry figcaption{text-align:center;color:var(--muted);font-size:.85rem;margin-top:.5em}
.hos-entry ul,.hos-entry ol{margin:0 0 1.25em;padding-left:1.3em}
.hos-entry li{margin-bottom:.5em}
.hos-entry blockquote{margin:1.5em 0;padding:.4em 0 .4em 1.3em;border-left:4px solid var(--accent-soft);font-style:italic;color:var(--slate);font-size:1.15rem}
.hos-entry table{width:100%;border-collapse:collapse;margin:1.5em 0;font-size:.95rem}
.hos-entry th,.hos-entry td{border:1px solid var(--line);padding:.7em .9em;text-align:left}
.hos-entry th{background:var(--wash);font-family:var(--body);font-weight:700}
/* callout converti par le thème */
.hos-entry .hos-callout{margin:1.7em 0;padding:1.3em 1.5em;background:var(--wash);border:1px solid var(--line);border-left:4px solid var(--accent-soft)}
.hos-entry .hos-callout__label{display:block;font-family:var(--display);font-size:1.5rem;color:var(--ink);margin:0 0 .4rem;letter-spacing:.02em}
.hos-entry .hos-callout__body{margin:0;font-size:1rem;line-height:1.65;color:var(--slate)}

.hos-related{background:var(--wash);margin-top:52px;padding:44px 0}
.hos-related__h{font-family:var(--display);font-size:clamp(1.7rem,3vw,2.2rem);text-align:center;margin-bottom:26px}

/* FOOTER */
.hos-foot{background:var(--ink);color:#b9bfc7;margin-top:56px}
.hos-foot__in{max-width:var(--maxw);margin:0 auto;padding:48px var(--gut) 26px;display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:32px}
.hos-foot__logo img{max-height:52px;width:auto;margin-bottom:14px;filter:brightness(0) invert(1)}
.hos-foot__about{font-family:var(--body);font-size:.9rem;color:#8f96a0;max-width:30em}
.hos-foot h4{font-family:var(--display);font-size:1.35rem;letter-spacing:.03em;color:#fff;margin:0 0 12px}
.hos-foot ul{list-style:none;margin:0;padding:0}
.hos-foot li{margin-bottom:9px}
.hos-foot a{color:#b9bfc7;font-family:var(--body);font-size:.9rem;transition:.2s}
.hos-foot a:hover{color:var(--accent)}
.hos-foot__bottom{border-top:1px solid #23262c;text-align:center;padding:18px var(--gut);font-family:var(--body);font-size:.78rem;color:#6b7280}
@media(max-width:760px){.hos-foot__in{grid-template-columns:1fr;gap:26px}}

.hos-progress{position:fixed;top:0;left:0;height:3px;background:var(--accent);width:0;z-index:100;transition:width .1s}
