/*
Theme Name: Élu Vitrine
Theme URI: https://example.com/elu-vitrine
Author: Votre équipe
Description: Thème vitrine pour élu(e) : réalisations, galerie, vidéos et fil d'actualités. Couleurs, typographies, textes et réseaux sociaux modifiables depuis Apparence > Personnaliser.
Version: 1.0.0
Requires at least: 6.3
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: elu-vitrine
*/

:root{--accent:#F47C0B;--accent2:#FCCC0C;--accent-ink:#0C3B17;--ink:#0C3B17;--bg:#F6F7EE;--text:#26402C;--muted:#4A5F4F;--line:#C9D3C0;--on-dark:#D5E3D3;--logo-h:84px;--logo-h-footer:64px;--header-h:calc(var(--logo-h) + 40px);--font-head:"Bricolage Grotesque",sans-serif;--font-body:"DM Sans",sans-serif;--fs-base:17px;--fs-h2:52px;--fw-head:800}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font-body);font-size:var(--fs-base);line-height:1.55;-webkit-font-smoothing:antialiased}
img,svg,iframe{max-width:100%}
img{height:auto;display:block}
a{color:inherit;text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4,h5,.bf{font-family:var(--font-head);font-weight:var(--fw-head);line-height:1.1;letter-spacing:-.02em;margin:0}
.screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;word-wrap:normal!important}
.skip-link:focus{clip:auto;clip-path:none;width:auto;height:auto;background:#fff;color:var(--ink);padding:12px 20px;z-index:100000;top:8px;left:8px;overflow:visible}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.wrap{max-width:1200px;margin:0 auto;padding-left:32px;padding-right:32px}

/* Header */
.site-header{max-width:1200px;margin:0 auto;padding:20px 32px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 32px;position:relative;z-index:20}
.site-logo{display:block;line-height:0}
.site-logo a,.site-logo .custom-logo-link{display:block;line-height:0}
.site-logo img,.site-logo .custom-logo{height:var(--logo-h);width:auto;max-width:100%;object-fit:contain}
.site-logo--footer img,.site-logo--footer .custom-logo{height:var(--logo-h-footer)}
.site-logo .logo-svg{height:var(--logo-h);width:var(--logo-h)}
.logo-svg .l-bg{fill:var(--accent)}.logo-svg .l-body{fill:var(--ink)}.logo-svg .l-dot{fill:var(--bg)}
.header-panel{display:contents}
.main-nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px 28px;font-weight:500;font-size:16px}
.main-nav li{position:relative}
.main-nav a{display:inline-block;padding:2px 0;border-bottom:3px solid transparent}
.main-nav a:hover{text-decoration:none;border-bottom-color:var(--accent)}
.main-nav .current-menu-item>a,.main-nav .current-menu-ancestor>a,.main-nav .current_page_item>a{border-bottom-color:var(--accent)}
.main-nav .sub-menu{display:none;position:absolute;top:100%;left:-14px;min-width:230px;background:#fff;border-radius:14px;padding:10px;box-shadow:0 14px 36px rgba(15,29,46,.16);flex-direction:column;flex-wrap:nowrap;gap:2px;z-index:50}
.main-nav li:hover>.sub-menu,.main-nav li:focus-within>.sub-menu{display:flex}
.main-nav .sub-menu a{display:block;padding:9px 12px;border-radius:8px;border:0}
.main-nav .sub-menu a:hover{background:var(--bg)}
.nav-toggle{display:none;background:var(--ink);border:0;border-radius:12px;width:48px;height:48px;cursor:pointer;position:relative}
.nav-toggle__bars,.nav-toggle__bars::before,.nav-toggle__bars::after{display:block;position:absolute;left:13px;width:22px;height:3px;background:#fff;border-radius:2px;content:""}
.nav-toggle__bars{top:22px}.nav-toggle__bars::before{top:-7px;left:0}.nav-toggle__bars::after{top:7px;left:0}

/* Boutons */
.btn{display:inline-block;padding:16px 28px;border-radius:40px;font-weight:700;border:2px solid transparent;cursor:pointer;font-family:inherit;font-size:inherit;line-height:1.3}
.btn:hover{text-decoration:none;opacity:.92}
.btn--accent{background:var(--accent);color:var(--accent-ink)}
.btn--outline{border-color:var(--ink);color:var(--ink);background:transparent}
.btn--dark{background:var(--ink);color:#fff;padding:12px 22px;font-size:15px}
.lk{font-weight:700;border-bottom:3px solid var(--accent);display:inline-block}
.lk:hover{text-decoration:none}

/* Placeholders */
.ph{background:repeating-linear-gradient(135deg,#DDE5D6 0 14px,#E8EEE2 14px 28px);width:100%;height:100%;min-height:100%;display:block}
.ph--dark{background:repeating-linear-gradient(135deg,#14502A 0 14px,#1A5E32 14px 28px)}

/* Hero */
.hero{max-width:1200px;margin:0 auto;padding:24px 32px 48px;display:flex;flex-wrap:wrap;gap:40px 48px;align-items:center;justify-content:center}
/* Écran d'accueil : en-tête + bandeau principal = 100 % de la hauteur de la fenêtre, contenu centré */
.hero-full .hero{min-height:calc(100vh - var(--header-h));min-height:calc(100svh - var(--header-h))}
.hero-full .hero__photo{height:var(--hero-img-h,clamp(300px,calc(100vh - var(--header-h) - 96px),640px));height:var(--hero-img-h,clamp(300px,calc(100svh - var(--header-h) - 96px),640px))}
.hero-full .hero h1{font-size:min(var(--hero-title-size,76px),max(34px,8.5vw),max(40px,11svh))}
.hero__text{flex:1 1 440px}
.eyebrow{font-family:var(--eyebrow-font,var(--font-body));font-weight:700;font-size:var(--eyebrow-size,14px);letter-spacing:.12em;text-transform:uppercase;color:var(--eyebrow-color,var(--muted));margin-bottom:20px}
.hero h1{font-family:var(--hero-title-font,var(--font-head));font-size:min(var(--hero-title-size,76px),max(34px,8.5vw));color:var(--hero-title-color,var(--ink));line-height:1;letter-spacing:-.03em;margin:0 0 28px}
.hl{background:linear-gradient(transparent 62%,var(--accent2) 62% 92%,transparent 92%)}
.hero__lead{margin:0 0 36px;font-size:20px;max-width:520px;color:var(--text)}
.hero__actions{display:flex;flex-wrap:wrap;gap:14px}
.hero__visual{flex:1 1 min(380px,100%);position:relative;max-width:min(var(--hero-img-w,520px),100%);margin:0 auto;padding:0 0 24px 24px}
.hero__shape{position:absolute;left:0;bottom:0;width:78%;height:88%;background:var(--accent2);border-radius:var(--hero-img-radius,200px 200px 24px 24px)}
.hero--no-shape .hero__shape{display:none}
.hero--no-shape .hero__visual{padding:0}
.hero__photo{position:relative;height:var(--hero-img-h,560px);border-radius:var(--hero-img-radius,200px 200px 24px 24px);overflow:hidden;background:var(--hero-img-bg,#DDE5D6)}
.hero__photo img{width:100%;height:100%;object-fit:var(--hero-img-fit,cover);object-position:var(--hero-img-pos,center)}
.hero__badge{position:absolute;right:-8px;bottom:56px;background:var(--ink);color:#fff;padding:12px 18px;border-radius:12px;font-size:14px;font-weight:700}

/* Bandeau du jour */
.ticker{background:var(--ink);color:#fff}
.ticker__in{max-width:1200px;margin:0 auto;padding:18px 32px;display:flex;flex-wrap:wrap;align-items:center;gap:12px 28px;font-size:15px}
.ticker__label{background:var(--accent2);color:var(--ink);font-weight:700;padding:4px 12px;border-radius:6px;letter-spacing:.08em;font-size:13px;text-transform:uppercase}
.ticker__sep{color:#8D9BB0}

/* Sections */
.section{max-width:1200px;margin:0 auto;padding:72px 32px}
.section--first{padding-top:96px}
.section--dark-wrap{background:var(--ink);color:#fff}
.section--dark-wrap .section{padding:96px 32px}
.sec-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:40px}
.sec-head__title{display:flex;align-items:baseline;gap:20px}
.sec-num{font-family:var(--font-head);font-weight:var(--fw-head);font-size:20px;color:var(--muted)}
.section--dark-wrap .sec-num{color:#9AA8BC}
.sec-head h2,.section h2.h2{font-size:clamp(34px,5vw,var(--fs-h2))}

/* Cartes */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:32px}
.card__media{display:block;height:240px;border-radius:16px;overflow:hidden;background:#DDE5D6}
.card__media img{width:100%;height:100%;object-fit:cover}
.card__meta{margin:18px 0 6px;font-size:14px;font-weight:700;color:var(--muted);letter-spacing:.06em;text-transform:uppercase}
.card__title{font-size:26px;line-height:1.15;margin:0 0 10px}
.card__text{margin:0 0 14px;color:var(--text)}
.card--small .card__media{height:200px}
.card--small .card__title{font-size:24px;margin:14px 0 6px}

/* Mosaïque galerie */
.mosaic{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:210px;grid-auto-flow:dense;gap:16px}
.tile{position:relative;display:block;border-radius:16px;overflow:hidden;background:#DDE5D6}
.tile img{width:100%;height:100%;object-fit:cover;transition:transform .35s}
a.tile:hover img{transform:scale(1.04)}
.tile--video{background:#14502A}
.mosaic>.tile:nth-child(7n+1){grid-column:span 2;grid-row:span 2}
.mosaic>.tile:nth-child(7n+4){grid-row:span 2}
.mosaic>.tile:nth-child(7n+7){grid-column:span 2}
.mosaic.is-home>.tile:nth-child(n){grid-row:auto;grid-column:auto}
.mosaic.is-home>.tile:nth-child(8n+1){grid-column:span 2;grid-row:span 2}
.mosaic.is-home>.tile:nth-child(8n+6){grid-column:span 2}
.play{display:flex;align-items:center;justify-content:center;border-radius:50%;background:var(--accent);color:var(--accent-ink);width:48px;height:48px}
.tile .play{position:absolute;left:14px;bottom:14px;width:44px;height:44px}
.play svg{width:40%;height:40%;fill:currentColor}

/* Vidéos */
.videos{display:flex;flex-wrap:wrap;gap:32px}
.videos__main{flex:2 1 560px}
.videos__side{flex:1 1 280px;display:flex;flex-direction:column;gap:24px}
.video__thumb{position:relative;display:flex;align-items:center;justify-content:center;aspect-ratio:16/9;border-radius:16px;overflow:hidden;background:#14502A}
.video__thumb:hover{text-decoration:none}
.video__thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.video__thumb .play{position:relative;width:84px;height:84px;z-index:1}
.videos__side .video__thumb{border-radius:12px}
.videos__side .video__thumb .play{width:48px;height:48px}
.video__dur{position:absolute;right:16px;bottom:14px;background:var(--ink);color:#fff;font-size:13px;font-weight:700;padding:3px 10px;border-radius:6px;z-index:1}
.video iframe,.player iframe{width:100%;aspect-ratio:16/9;border:0;border-radius:16px;display:block}
.video__title{font-size:28px;margin:20px 0 6px}
.videos__side .video__title{font-size:inherit;font-family:var(--font-body);font-weight:700;letter-spacing:0;margin:10px 0 0}
.video__date{color:var(--on-dark);font-size:15px}
.video__title a:hover{text-decoration:underline}

/* Fil d'actualités */
.news-list{border-top:2px solid var(--ink)}
.news-row{display:flex;flex-wrap:wrap;gap:12px 32px;padding:28px 0;border-bottom:1px solid var(--line);align-items:center}
.news-row:hover{text-decoration:none}
.news-row:hover h3{text-decoration:underline}
.news-row__date{flex:0 0 110px;font-family:var(--font-head);font-weight:var(--fw-head);font-size:34px;line-height:1}
.news-row__date small{display:block;font-family:var(--font-body);font-size:15px;color:var(--muted);font-weight:500;margin-top:4px;text-transform:uppercase}
.news-row__body{flex:1 1 400px}
.news-row__cat{font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.news-row h3{font-size:28px;line-height:1.2;margin:6px 0}
.news-row p{margin:0;color:var(--text)}
.news-row__img{flex:0 0 200px;height:120px;border-radius:12px;overflow:hidden;background:#DDE5D6}
.news-row__img img{width:100%;height:100%;object-fit:cover}

/* Réseaux */
.social{background:var(--accent);color:var(--accent-ink)}
.social__in{max-width:1200px;margin:0 auto;padding:72px 32px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:32px}
.social h2{font-size:clamp(34px,5vw,48px);line-height:1.05;max-width:420px}
.social__icons{display:flex;flex-wrap:wrap;gap:14px;flex:1 1 420px;justify-content:flex-end}
.ic{width:56px;height:56px;border-radius:50%;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center}
.ic:hover{background:#fff;color:var(--ink);text-decoration:none}
.ic svg{width:26px;height:26px}

/* Pied de page */
.site-footer{max-width:1200px;margin:0 auto;padding:40px 32px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 32px;font-size:15px;color:var(--text)}
body:not(.home) .site-footer{border-top:1px solid var(--line)}
.site-footer__links{display:flex;flex-wrap:wrap;gap:8px 24px;align-items:center}
.site-footer__links ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px 24px}

/* Pages internes */
.page-main{max-width:1200px;margin:0 auto;padding:24px 32px 72px}
.page-title{font-size:clamp(40px,7vw,68px);line-height:1;letter-spacing:-.03em;margin:16px 0 12px}
.page-title--xl{line-height:1.02;max-width:900px;margin:16px 0 20px}
.lead{font-size:21px;color:var(--text);max-width:720px;margin:0 0 32px}
.crumbs{font-size:14px;color:var(--muted);font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.pills{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:32px}
.pill{border:2px solid var(--ink);padding:8px 20px;border-radius:40px;font-weight:700;font-size:15px}
.pill:hover{text-decoration:none;background:#fff}
.pill.is-active{background:var(--ink);color:#fff}
.more{text-align:center;margin-top:48px}
.pagination .nav-links{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:48px}
.pagination .page-numbers{padding:8px 16px;border:2px solid var(--ink);border-radius:40px;font-weight:700}
.pagination .page-numbers.current{background:var(--ink);color:#fff}
.pagination a.page-numbers:hover{text-decoration:none;background:#fff}
.cover{aspect-ratio:21/9;border-radius:20px;overflow:hidden;background:#DDE5D6}
.cover img{width:100%;height:100%;object-fit:cover}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:24px;margin:48px 0;padding:32px 0;border-top:2px solid var(--ink);border-bottom:1px solid var(--line)}
.stats__v{font-family:var(--font-head);font-weight:var(--fw-head);font-size:44px;line-height:1}
.stats__l{color:var(--muted);font-size:15px}
.split{display:flex;flex-wrap:wrap;gap:56px}
.split__main{flex:2 1 520px;min-width:0}
.brief{flex:1 1 280px;align-self:flex-start;background:var(--ink);color:#fff;border-radius:20px;padding:32px}
.brief__t{font-size:24px;margin-bottom:16px}
.brief__l{font-size:15px;color:var(--on-dark);line-height:1.9}
.brief__l b{color:#fff;font-weight:700}
.brief .btn{margin-top:24px;padding:12px 24px}
.h2s{font-size:34px;margin:72px 0 24px}
.shots{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.shots a{display:block;height:220px;border-radius:16px;overflow:hidden}
.shots img{width:100%;height:100%;object-fit:cover}

/* Article */
.article-head{max-width:760px;margin:0 auto}
.article-meta{font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.badge{background:var(--accent);color:var(--accent-ink);padding:3px 10px;border-radius:6px;margin-right:10px}
.article-head h1{font-size:clamp(36px,6vw,58px);line-height:1.05;letter-spacing:-.025em;margin:20px 0}
.article-head .lead{max-width:none}
.figure-wide{max-width:1100px;margin:0 auto}
.figure-wide .img{aspect-ratio:16/8;border-radius:20px;overflow:hidden}
.figure-wide img{width:100%;height:100%;object-fit:cover}
.figcap{font-size:14px;color:var(--muted);margin:10px 0 40px}
.article-body{max-width:760px;margin:0 auto;font-size:19px}
.share{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:40px;padding-top:24px;border-top:1px solid var(--line)}
.share a{border:2px solid var(--ink);padding:8px 18px;border-radius:40px;font-weight:700;font-size:15px}
.share a:hover{text-decoration:none;background:#fff}

/* Contenu éditeur */
.entry-content>*{margin-top:0;margin-bottom:20px}
.entry-content p,.entry-content li{color:var(--text)}
.entry-content h2{font-size:34px;margin:28px 0 16px}
.entry-content h3{font-size:26px;margin:24px 0 12px}
.entry-content a{border-bottom:2px solid var(--accent)}
.entry-content a:hover{text-decoration:none;background:var(--accent)}
.entry-content blockquote,.entry-content .wp-block-quote{margin:36px 0;padding:4px 0 4px 28px;border-left:6px solid var(--accent);font-family:var(--font-head);font-weight:var(--fw-head);font-size:30px;line-height:1.25;color:var(--ink)}
.entry-content blockquote p{color:inherit;margin:0}
.entry-content img{border-radius:16px}
.entry-content figure{margin:28px 0}
.entry-content figcaption{font-size:14px;color:var(--muted);margin-top:8px}
.entry-content iframe{border-radius:16px}
.entry-content .wp-block-button__link{background:var(--accent);color:var(--accent-ink);border-radius:40px;font-weight:700;padding:16px 28px}
.entry-content table{border-collapse:collapse;width:100%}
.entry-content td,.entry-content th{border-bottom:1px solid var(--line);padding:10px;text-align:left}
.alignleft{float:left;margin:0 24px 16px 0}.alignright{float:right;margin:0 0 16px 24px}.aligncenter{margin-left:auto;margin-right:auto}

/* Formulaires */
.form{max-width:640px;display:grid;gap:18px}
.form label{display:grid;gap:6px;font-weight:700;font-size:15px}
.form input[type=text],.form input[type=email],.form textarea,.search-form input[type=search]{font:inherit;padding:14px 16px;border:2px solid var(--ink);border-radius:12px;background:#fff;color:var(--ink);width:100%}
.form .check{display:flex;gap:10px;align-items:flex-start;font-weight:400}
.hp{position:absolute!important;left:-9999px;height:0;overflow:hidden}
.notice{padding:16px 20px;border-radius:12px;margin-bottom:24px;font-weight:700}
.notice--ok{background:#DFF3E3}.notice--err{background:#FBE0DC}.notice--info{background:#fff;border:2px dashed var(--ink)}
.search-form{display:flex;gap:10px;max-width:520px;margin:20px 0}

/* Visionneuse */
.lightbox{border:0;padding:0;background:transparent;width:min(1100px,94vw);max-width:none;overflow:visible}
.lightbox::backdrop{background:rgba(15,29,46,.9)}
.lightbox__body img{max-height:86vh;width:auto;margin:0 auto;border-radius:12px}
.lightbox__body iframe{width:100%;aspect-ratio:16/9;border:0;border-radius:12px}
.lightbox__close{position:absolute;top:-48px;right:0;background:var(--accent);color:var(--accent-ink);border:0;width:40px;height:40px;border-radius:50%;font-size:26px;line-height:1;cursor:pointer}

/* Responsive */
@media(max-width:820px){
 .nav-toggle{display:block}
 .site-logo img,.site-logo .custom-logo{height:min(var(--logo-h),72px)}
 .header-panel{display:none;flex:1 0 100%;flex-direction:column;align-items:flex-start;gap:20px;padding-bottom:12px}
 .header-panel.is-open{display:flex}
 .main-nav ul{flex-direction:column;gap:10px}
 .main-nav .sub-menu{display:flex;position:static;box-shadow:none;background:transparent;padding:6px 0 0 14px}
 .hero__badge{right:0}
 .hero-full .hero__photo,.hero__photo{height:min(var(--hero-img-h,440px),70svh)}
 .mosaic{grid-template-columns:repeat(2,1fr);grid-auto-rows:160px}
 .section,.section--first{padding-top:56px;padding-bottom:40px}
 .section--dark-wrap .section{padding:56px 32px}
 .social__icons{justify-content:flex-start}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
