/*
Theme Name: Sortez Plus
Theme URI: https://sortezplus.fr
Author: Sortez+
Description: Thème magazine pour loisirs, sorties et découvertes. Intègre les Custom Post Types Événements et Lieux.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 8.0
License: GPL-2.0-or-later
Text Domain: sortezplus
*/

/* ── VARIABLES ── */
:root {
  --sp-marine:    #0D2060;
  --sp-marine2:   #1a2e7a;
  --sp-orange:    #F4820A;
  --sp-rose:      #E8176A;
  --sp-blanc:     #ffffff;
  --sp-fond:      #F4F6FB;
  --sp-gris1:     #EAEEF8;
  --sp-gris2:     #C8D0E8;
  --sp-gris3:     #7A85A8;
  --sp-txt:       #1A1F3A;
  --sp-montagne:  #00B4D8;
  --sp-soleil:    #F5C518;
  --sp-musique:   #E84B8A;
  --sp-resto:     #F4820A;
  --sp-patrimoine:#9B5FC0;
  --sp-arbre:     #3DBB6E;
  --sp-chemin:    #0D2060;
  --pd: 'Playfair Display', Georgia, serif;
  --nu: 'Nunito', system-ui, sans-serif;
}

/* ── RESET ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 16px; scroll-behavior: smooth; }
body { background: var(--sp-fond); color: var(--sp-txt); font-family: var(--nu); line-height: 1.6; }
a { text-decoration: none; color: inherit; }
img { display: block; max-width: 100%; height: auto; }
ul { list-style: none; }
button { cursor: pointer; font-family: var(--nu); }

/* ── LAYOUT ── */
.sp-container { max-width: 1260px; margin: 0 auto; padding: 0 24px; }
.sp-section { padding: 56px 0; }

/* ── TYPOGRAPHY ── */
h1,h2,h3,h4,h5,h6 { font-family: var(--pd); line-height: 1.15; color: var(--sp-txt); }
p { font-family: var(--nu); }

/* ── SECTION HEADER ── */
.sp-sec-head { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 28px; }
.sp-sec-label { font-size: .65rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; margin-bottom: 6px; font-family: var(--nu); }
.sp-sec-title { font-family: var(--pd); font-size: 1.7rem; font-weight: 800; }
.sp-sec-link { font-size: .72rem; font-weight: 700; color: var(--sp-orange); text-transform: uppercase; letter-spacing: .08em; font-family: var(--nu); }
.sp-sec-link:hover { text-decoration: underline; }

/* ── BUTTONS ── */
.sp-btn { display: inline-block; font-family: var(--nu); font-size: .8rem; font-weight: 700; padding: 12px 26px; border-radius: 28px; border: none; transition: all .2s; }
.sp-btn-primary { background: var(--sp-orange); color: #fff; }
.sp-btn-primary:hover { background: #d96e06; transform: translateY(-1px); box-shadow: 0 6px 20px rgba(244,130,10,.35); }
.sp-btn-secondary { background: transparent; color: var(--sp-marine); border: 1.5px solid var(--sp-marine); }
.sp-btn-secondary:hover { background: var(--sp-marine); color: #fff; }

/* ── HEADER ── */
.site-header { position: sticky; top: 0; z-index: 200; background: var(--sp-blanc); border-bottom: 1px solid var(--sp-gris1); }
.sp-hdr-top { height: 68px; display: flex; align-items: center; justify-content: space-between; }
.sp-logo { display: flex; align-items: center; gap: 10px; }
.sp-logo-img { height: 44px; width: auto; display: block; object-fit: contain; }
.sp-hdr-actions { display: flex; align-items: center; gap: 16px; }
.sp-hdr-date { font-size: .7rem; font-weight: 600; color: var(--sp-gris3); text-transform: uppercase; letter-spacing: .08em; }
.sp-btn-nl { background: var(--sp-marine); color: #fff; font-size: .72rem; font-weight: 700; letter-spacing: .08em; padding: 9px 20px; border: none; border-radius: 24px; transition: background .2s; }
.sp-btn-nl:hover { background: var(--sp-marine2); }

/* Navigation */
.sp-nav-wrap { border-top: 1px solid var(--sp-gris1); }
.sp-nav { display: flex; overflow-x: auto; gap: 0; scrollbar-width: none; }
.sp-nav::-webkit-scrollbar { display: none; }
.sp-nav a { font-size: .7rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; padding: 10px 16px; color: var(--sp-gris3); border-bottom: 2px solid transparent; transition: all .2s; white-space: nowrap; display: flex; align-items: center; gap: 5px; }
.sp-nav a:hover { color: var(--sp-marine); }
.sp-nav a.current-menu-item,
.sp-nav a.current_page_item,
.sp-nav a:focus { color: var(--sp-marine); border-bottom-color: var(--sp-orange); }

/* ── HERO ── */
.sp-hero { background: var(--sp-marine); overflow: hidden; position: relative; }
.sp-hero-inner { padding: 56px 24px 48px; display: grid; grid-template-columns: 1fr 380px; gap: 48px; align-items: center; max-width: 1260px; margin: 0 auto; }
.sp-hero-eyebrow { display: inline-flex; align-items: center; gap: 8px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12); border-radius: 20px; padding: 5px 14px 5px 8px; margin-bottom: 22px; }
.sp-hero-eyebrow-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--sp-orange); animation: sp-pulse 2s infinite; }
@keyframes sp-pulse { 0%,100%{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(1.3)} }
.sp-hero-eyebrow-txt { font-size: .65rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: rgba(255,255,255,.7); font-family: var(--nu); }
.sp-hero-title { font-family: var(--pd); font-size: clamp(2rem,4vw,3.2rem); font-weight: 800; color: #fff; line-height: 1.1; margin-bottom: 16px; }
.sp-hero-title em { font-style: italic; color: var(--sp-orange); }
.sp-hero-sub { font-size: .95rem; font-weight: 300; color: rgba(255,255,255,.6); line-height: 1.75; margin-bottom: 32px; max-width: 460px; }
.sp-hero-ctas { display: flex; gap: 12px; flex-wrap: wrap; }
.sp-cta-white { background: rgba(255,255,255,.12); color: #fff; border: 1px solid rgba(255,255,255,.25); }
.sp-cta-white:hover { background: rgba(255,255,255,.2); }
.sp-hero-deco { position: absolute; right: -80px; top: -80px; width: 400px; height: 400px; border-radius: 50%; border: 1px solid rgba(255,255,255,.04); pointer-events: none; }
.sp-hero-deco2 { position: absolute; right: 60px; bottom: -120px; width: 240px; height: 240px; border-radius: 50%; border: 1px solid rgba(255,255,255,.06); pointer-events: none; }

/* Rubriques grid dans hero */
.sp-rubs-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.sp-rub-card { background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.1); border-radius: 12px; padding: 14px; cursor: pointer; transition: background .2s, transform .15s; display: flex; align-items: center; gap: 10px; }
.sp-rub-card:hover { background: rgba(255,255,255,.13); transform: translateY(-2px); }
.sp-rub-card:last-child { background: rgba(244,130,10,.15); border-color: rgba(244,130,10,.3); }
.sp-rub-icon { font-size: 1.4rem; flex-shrink: 0; }
.sp-rub-name { font-size: .72rem; font-weight: 700; color: #fff; letter-spacing: .03em; font-family: var(--nu); }
.sp-rub-sub { font-size: .62rem; font-weight: 400; color: rgba(255,255,255,.45); margin-top: 2px; font-family: var(--nu); }

/* ── ÉVÉNEMENTS ── */
.sp-events-section { background: var(--sp-blanc); }
.sp-events-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.sp-ev-card { background: var(--sp-fond); border-radius: 14px; overflow: hidden; border: 1px solid var(--sp-gris1); transition: transform .15s, box-shadow .2s; }
.sp-ev-card:hover { transform: translateY(-3px); box-shadow: 0 12px 32px rgba(13,32,96,.1); }
.sp-ev-card a { color: inherit; }
.sp-ev-top { padding: 18px 18px 0; display: flex; justify-content: space-between; align-items: flex-start; }
.sp-ev-date-box { text-align: center; background: var(--sp-marine); border-radius: 10px; padding: 8px 12px; min-width: 52px; }
.sp-ev-day { font-size: 1.4rem; font-weight: 800; color: #fff; line-height: 1; font-family: var(--pd); }
.sp-ev-month { font-size: .58rem; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: rgba(255,255,255,.6); font-family: var(--nu); }
.sp-ev-cat { font-size: .6rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; padding: 4px 10px; border-radius: 12px; color: #fff; font-family: var(--nu); }
.sp-ev-body { padding: 16px 18px 20px; }
.sp-ev-icon { font-size: 1.2rem; margin-bottom: 8px; }
.sp-ev-body h3 { font-family: var(--pd); font-size: 1rem; font-weight: 700; color: var(--sp-txt); line-height: 1.25; margin-bottom: 8px; }
.sp-ev-meta { display: flex; flex-direction: column; gap: 4px; margin-bottom: 10px; }
.sp-ev-meta-row { display: flex; align-items: center; gap: 6px; font-size: .7rem; color: var(--sp-gris3); font-family: var(--nu); }
.sp-ev-free { display: inline-block; font-size: .62rem; font-weight: 700; color: var(--sp-arbre); background: #e8f8ef; padding: 3px 10px; border-radius: 10px; font-family: var(--nu); }
.sp-ev-price { display: inline-block; font-size: .62rem; font-weight: 700; color: var(--sp-orange); background: #fef2e3; padding: 3px 10px; border-radius: 10px; font-family: var(--nu); }

/* ── AGENDA BANDE ── */
.sp-agenda-band { background: linear-gradient(135deg, var(--sp-marine) 0%, var(--sp-marine2) 100%); padding: 40px 0; }
.sp-agenda-scroll { display: flex; gap: 12px; overflow-x: auto; padding-bottom: 4px; scrollbar-width: none; }
.sp-agenda-scroll::-webkit-scrollbar { display: none; }
.sp-ag-pill { background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12); border-radius: 14px; padding: 16px 20px; min-width: 220px; cursor: pointer; transition: background .2s; flex-shrink: 0; }
.sp-ag-pill:hover { background: rgba(255,255,255,.14); }
.sp-ag-pill-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.sp-ag-date { font-family: var(--pd); font-size: 1.3rem; font-weight: 700; color: #fff; }
.sp-ag-month { font-size: .6rem; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: rgba(255,255,255,.45); font-family: var(--nu); }
.sp-ag-pill h4 { font-size: .82rem; font-weight: 700; color: #fff; line-height: 1.3; margin-bottom: 4px; font-family: var(--pd); }
.sp-ag-loc { font-size: .66rem; color: rgba(255,255,255,.45); font-family: var(--nu); }

/* ── ARTICLES ── */
.sp-articles-section { background: var(--sp-fond); }
.sp-articles-layout { display: grid; grid-template-columns: 2fr 1fr; gap: 24px; margin-bottom: 24px; }
.sp-art-featured { background: var(--sp-blanc); border-radius: 16px; overflow: hidden; border: 1px solid var(--sp-gris1); transition: box-shadow .2s; }
.sp-art-featured:hover { box-shadow: 0 12px 40px rgba(13,32,96,.1); }
.sp-art-featured-img { height: 280px; overflow: hidden; position: relative; background: var(--sp-gris1); }
.sp-art-featured-img img { width: 100%; height: 100%; object-fit: cover; }
.sp-art-featured-img .sp-art-no-img { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; font-size: 6rem; }
.sp-art-featured-body { padding: 28px; }
.sp-cat-badge { display: inline-flex; align-items: center; gap: 6px; font-size: .62rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; padding: 4px 12px 4px 8px; border-radius: 14px; margin-bottom: 14px; font-family: var(--nu); }
.sp-art-featured h2 { font-family: var(--pd); font-size: 1.55rem; font-weight: 800; line-height: 1.2; margin-bottom: 10px; }
.sp-art-featured p { font-size: .88rem; color: var(--sp-gris3); line-height: 1.7; margin-bottom: 16px; }
.sp-art-meta { font-size: .68rem; font-weight: 600; color: var(--sp-gris3); display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.sp-art-meta b { color: var(--sp-txt); }
.sp-art-list { display: flex; flex-direction: column; gap: 12px; }
.sp-art-mini { background: var(--sp-blanc); border-radius: 12px; padding: 18px; border: 1px solid var(--sp-gris1); transition: transform .15s, box-shadow .2s; display: flex; gap: 14px; align-items: flex-start; }
.sp-art-mini:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(13,32,96,.08); }
.sp-art-mini-icon { width: 44px; height: 44px; border-radius: 10px; display: flex; align-items: center; justify-content: center; font-size: 1.3rem; flex-shrink: 0; }
.sp-art-mini .sp-cat-label { font-size: .6rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; margin-bottom: 5px; font-family: var(--nu); }
.sp-art-mini h3 { font-family: var(--pd); font-size: .95rem; font-weight: 700; line-height: 1.3; margin-bottom: 4px; }
.sp-art-mini .sp-meta { font-size: .65rem; color: var(--sp-gris3); font-family: var(--nu); }
.sp-articles-more { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.sp-art-card { background: var(--sp-blanc); border-radius: 12px; overflow: hidden; border: 1px solid var(--sp-gris1); transition: transform .15s, box-shadow .2s; }
.sp-art-card:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(13,32,96,.08); }
.sp-art-card-img { height: 140px; overflow: hidden; background: var(--sp-gris1); position: relative; }
.sp-art-card-img img { width: 100%; height: 100%; object-fit: cover; }
.sp-art-card-img .sp-art-no-img { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; font-size: 3rem; }
.sp-art-card-body { padding: 16px; }
.sp-art-card h3 { font-family: var(--pd); font-size: .95rem; font-weight: 700; line-height: 1.25; margin-bottom: 6px; }
.sp-art-card .sp-meta { font-size: .65rem; color: var(--sp-gris3); font-family: var(--nu); }

/* ── LIEUX ── */
.sp-lieux-section { background: var(--sp-blanc); }
.sp-lieux-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.sp-lieu-card { border-radius: 16px; overflow: hidden; position: relative; min-height: 240px; transition: transform .15s, box-shadow .2s; background: var(--sp-marine); }
.sp-lieu-card:hover { transform: translateY(-3px); box-shadow: 0 16px 40px rgba(13,32,96,.15); }
.sp-lieu-card-img { position: absolute; inset: 0; }
.sp-lieu-card-img img { width: 100%; height: 100%; object-fit: cover; }
.sp-lieu-card-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(13,32,96,.85) 0%, rgba(13,32,96,.2) 60%, transparent 100%); }
.sp-lieu-card-body { position: absolute; bottom: 0; left: 0; right: 0; padding: 24px; }
.sp-lieu-icon { font-size: 1.6rem; margin-bottom: 8px; }
.sp-lieu-cat { font-size: .6rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: rgba(255,255,255,.6); margin-bottom: 5px; font-family: var(--nu); }
.sp-lieu-card h3 { font-family: var(--pd); font-size: 1.15rem; font-weight: 700; color: #fff; line-height: 1.2; margin-bottom: 4px; }
.sp-lieu-loc { font-size: .7rem; color: rgba(255,255,255,.55); font-family: var(--nu); }
.sp-lieu-badge { position: absolute; top: 16px; right: 16px; background: rgba(255,255,255,.15); border: 1px solid rgba(255,255,255,.2); border-radius: 12px; padding: 4px 10px; font-size: .62rem; font-weight: 700; color: #fff; font-family: var(--nu); }

/* ── NEWSLETTER ── */
.sp-nl-section { padding: 60px 0; background: var(--sp-fond); }
.sp-nl-box { background: var(--sp-marine); border-radius: 20px; padding: 48px 56px; display: flex; align-items: center; gap: 56px; }
.sp-nl-text h3 { font-family: var(--pd); font-size: 1.8rem; font-weight: 800; color: #fff; line-height: 1.1; margin-bottom: 8px; }
.sp-nl-text p { font-size: .88rem; color: rgba(255,255,255,.55); line-height: 1.6; }
.sp-nl-form { flex: 1; max-width: 440px; display: flex; }
.sp-nl-form input { flex: 1; padding: 14px 18px; border: none; background: rgba(255,255,255,.1); color: #fff; font-family: var(--nu); font-size: .85rem; border-radius: 28px 0 0 28px; outline: none; }
.sp-nl-form input::placeholder { color: rgba(255,255,255,.4); }
.sp-nl-form input:focus { background: rgba(255,255,255,.16); }
.sp-nl-form button { background: var(--sp-orange); color: #fff; border: none; padding: 14px 24px; font-family: var(--nu); font-size: .72rem; font-weight: 700; letter-spacing: .08em; border-radius: 0 28px 28px 0; transition: background .2s; }
.sp-nl-form button:hover { background: #d96e06; }

/* ── FOOTER ── */
.site-footer { background: var(--sp-txt); padding: 52px 0 28px; }
.sp-ftr-grid { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 48px; padding-bottom: 36px; border-bottom: 1px solid rgba(255,255,255,.07); margin-bottom: 24px; }
.sp-ftr-logo { display: flex; align-items: baseline; gap: 4px; margin-bottom: 14px; }
.sp-ftr-logo-s { font-family: var(--pd); font-weight: 800; font-size: 1.4rem; color: #fff; }
.sp-ftr-logo-p { font-size: 1.6rem; font-weight: 800; font-family: var(--nu); background: linear-gradient(135deg, var(--sp-orange), var(--sp-rose)); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.sp-ftr-desc { font-size: .78rem; color: rgba(255,255,255,.38); line-height: 1.75; max-width: 320px; }
.sp-ftr-col h4 { font-size: .65rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.85); margin-bottom: 18px; font-family: var(--nu); }
.sp-ftr-col ul { display: flex; flex-direction: column; gap: 2px; }
.sp-ftr-col li a { font-size: .78rem; color: rgba(255,255,255,.38); transition: color .15s; display: flex; align-items: center; gap: 8px; padding: 7px 0; border-bottom: 1px solid rgba(255,255,255,.04); }
.sp-ftr-col li a:hover { color: #fff; }
.sp-ftr-dot { width: 6px; height: 6px; border-radius: 50%; display: inline-block; flex-shrink: 0; }
.sp-ftr-bottom { display: flex; justify-content: space-between; align-items: center; font-size: .65rem; color: rgba(255,255,255,.2); letter-spacing: .05em; }
.sp-ftr-links { display: flex; gap: 18px; }
.sp-ftr-links a { color: rgba(255,255,255,.2); transition: color .15s; font-size: .65rem; }
.sp-ftr-links a:hover { color: rgba(255,255,255,.55); }

/* ── SINGLE ARTICLE ── */
.sp-single { max-width: 800px; margin: 48px auto; padding: 0 24px; }
.sp-single-header { margin-bottom: 32px; }
.sp-single-header .sp-cat-badge { margin-bottom: 16px; }
.sp-single-header h1 { font-family: var(--pd); font-size: clamp(1.6rem,4vw,2.4rem); font-weight: 800; line-height: 1.15; margin-bottom: 14px; }
.sp-single-header .sp-art-meta { margin-bottom: 24px; }
.sp-single-img { border-radius: 14px; overflow: hidden; margin-bottom: 32px; max-height: 460px; }
.sp-single-img img { width: 100%; object-fit: cover; }
.sp-single-content { font-size: 1rem; line-height: 1.8; color: var(--sp-txt); }
.sp-single-content p { margin-bottom: 1.4em; }
.sp-single-content h2 { font-family: var(--pd); font-size: 1.5rem; margin: 2em 0 .8em; }
.sp-single-content h3 { font-family: var(--pd); font-size: 1.2rem; margin: 1.6em 0 .6em; }
.sp-single-content ul,
.sp-single-content ol { padding-left: 1.5em; margin-bottom: 1.4em; }
.sp-single-content li { margin-bottom: .4em; list-style: disc; }
.sp-single-content blockquote { border-left: 4px solid var(--sp-orange); padding: 12px 20px; background: var(--sp-gris1); border-radius: 0 8px 8px 0; margin: 1.6em 0; font-style: italic; }

/* ── CPT SINGLE: ÉVÉNEMENT ── */
.sp-single-event { max-width: 900px; margin: 48px auto; padding: 0 24px; }
.sp-event-hero-img { border-radius: 16px; overflow: hidden; height: 360px; margin-bottom: 32px; background: var(--sp-gris1); position: relative; }
.sp-event-hero-img img { width: 100%; height: 100%; object-fit: cover; }
.sp-event-hero-img .sp-no-img { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; font-size: 8rem; opacity: .3; }
.sp-event-header h1 { font-family: var(--pd); font-size: 2rem; font-weight: 800; margin-bottom: 16px; line-height: 1.15; }
.sp-event-infos { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; background: var(--sp-blanc); border-radius: 14px; padding: 24px; border: 1px solid var(--sp-gris1); margin: 24px 0; }
.sp-ev-info-item { display: flex; flex-direction: column; gap: 4px; }
.sp-ev-info-label { font-size: .62rem; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: var(--sp-gris3); font-family: var(--nu); }
.sp-ev-info-val { font-size: .95rem; font-weight: 700; color: var(--sp-marine); font-family: var(--pd); }
.sp-ev-info-val a { color: var(--sp-orange); }

/* ── CPT SINGLE: LIEU ── */
.sp-single-lieu { max-width: 900px; margin: 48px auto; padding: 0 24px; }
.sp-lieu-hero-img { border-radius: 16px; overflow: hidden; height: 380px; margin-bottom: 32px; background: var(--sp-gris1); position: relative; }
.sp-lieu-hero-img img { width: 100%; height: 100%; object-fit: cover; }
.sp-lieu-header h1 { font-family: var(--pd); font-size: 2rem; font-weight: 800; margin-bottom: 8px; }
.sp-lieu-infos { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; background: var(--sp-blanc); border-radius: 14px; padding: 24px; border: 1px solid var(--sp-gris1); margin: 24px 0; }
.sp-lieu-info-item { display: flex; flex-direction: column; gap: 4px; }
.sp-lieu-info-label { font-size: .62rem; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: var(--sp-gris3); font-family: var(--nu); }
.sp-lieu-info-val { font-size: .9rem; font-weight: 700; color: var(--sp-marine); font-family: var(--nu); }

/* ── ARCHIVES ── */
.sp-archive { padding: 48px 0; }
.sp-archive-header { margin-bottom: 36px; }
.sp-archive-header h1 { font-family: var(--pd); font-size: 2rem; font-weight: 800; }
.sp-archive-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }

/* ── PAGINATION ── */
.sp-pagination { margin: 40px 0; display: flex; justify-content: center; gap: 8px; }
.sp-pagination a, .sp-pagination span { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; font-size: .85rem; font-weight: 700; border: 1.5px solid var(--sp-gris2); color: var(--sp-gris3); transition: all .2s; }
.sp-pagination a:hover { border-color: var(--sp-orange); color: var(--sp-orange); }
.sp-pagination .current { background: var(--sp-marine); color: #fff; border-color: var(--sp-marine); }

/* ── RESPONSIVE ── */
@media (max-width: 1024px) {
  .sp-hero-inner { grid-template-columns: 1fr; gap: 32px; }
  .sp-rubs-grid { grid-template-columns: repeat(4,1fr); }
  .sp-events-grid { grid-template-columns: 1fr 1fr; }
  .sp-articles-layout { grid-template-columns: 1fr; }
  .sp-articles-more { grid-template-columns: 1fr 1fr; }
  .sp-lieux-grid { grid-template-columns: 1fr 1fr; }
  .sp-ftr-grid { grid-template-columns: 1fr 1fr; }
  .sp-nl-box { flex-direction: column; padding: 36px 32px; gap: 28px; }
  .sp-event-infos { grid-template-columns: 1fr 1fr; }
  .sp-lieu-infos { grid-template-columns: 1fr 1fr; }
  .sp-archive-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .sp-rubs-grid { grid-template-columns: 1fr 1fr; }
  .sp-events-grid { grid-template-columns: 1fr; }
  .sp-articles-more { grid-template-columns: 1fr; }
  .sp-lieux-grid { grid-template-columns: 1fr; }
  .sp-ftr-grid { grid-template-columns: 1fr; }
  .sp-ftr-bottom { flex-direction: column; gap: 8px; text-align: center; }
  .sp-archive-grid { grid-template-columns: 1fr; }
  .sp-nl-form { flex-direction: column; }
  .sp-nl-form input { border-radius: 12px 12px 0 0; }
  .sp-nl-form button { border-radius: 0 0 12px 12px; }
  .sp-hdr-date { display: none; }
  .sp-event-infos,
  .sp-lieu-infos { grid-template-columns: 1fr; }
}

/* ── WIDGETS & SIDEBAR ── */
.sp-widget-title { font-family: var(--pd); font-size: 1.1rem; font-weight: 700; margin-bottom: 16px; padding-bottom: 10px; border-bottom: 2px solid var(--sp-marine); }

/* ══ CONCEPT BAND ══ */
.sp-concept-band{background:var(--sp-nuit,#0D2060);padding:0}
.sp-concept-band .sp-container{padding-top:0;padding-bottom:0}
.sp-concept-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0}
.sp-concept-card{display:flex;flex-direction:column;align-items:flex-start;padding:40px 36px;border-right:1px solid rgba(255,255,255,.08);transition:background .2s;color:#fff}
.sp-concept-card:last-child{border-right:none}
.sp-concept-card:hover{background:rgba(255,255,255,.04)}
.sp-concept-icon{width:56px;height:56px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:1.6rem;margin-bottom:18px;flex-shrink:0}
.sp-concept-card h3{font-family:var(--pd);font-size:1.25rem;font-weight:700;color:#fff;margin-bottom:10px}
.sp-concept-card p{font-size:.83rem;font-weight:300;color:rgba(255,255,255,.55);line-height:1.7;margin-bottom:18px;flex:1}
.sp-concept-cta{font-size:.72rem;font-weight:700;color:var(--sp-orange);text-transform:uppercase;letter-spacing:.08em;font-family:var(--nu)}

/* ══ EVENT CARD AVEC IMAGE ══ */
.sp-ev-card--img{background:var(--sp-blanc);border-radius:16px;overflow:hidden;border:1px solid var(--sp-gris1);transition:transform .15s,box-shadow .2s}
.sp-ev-card--img:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(13,32,96,.12)}
.sp-ev-card--img a{display:block;color:inherit;text-decoration:none}
.sp-ev-card-img{position:relative;height:200px;overflow:hidden;background:var(--sp-gris1)}
.sp-ev-card-emoji-bg{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:5rem;opacity:.35}
.sp-ev-date-badge{position:absolute;top:14px;left:14px;background:var(--sp-marine);border-radius:10px;padding:8px 12px;text-align:center;min-width:52px;box-shadow:0 4px 12px rgba(13,32,96,.3)}
.sp-ev-date-badge-day{font-family:var(--pd);font-size:1.5rem;font-weight:800;color:#fff;line-height:1}
.sp-ev-date-badge-month{font-size:.58rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:rgba(255,255,255,.7);font-family:var(--nu)}
.sp-ev-date-badge-year{font-size:.55rem;color:rgba(255,255,255,.45);font-family:var(--nu);margin-top:1px}
.sp-ev-card-cat-badge{position:absolute;top:14px;right:14px;color:#fff;font-size:.6rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:4px 10px;border-radius:10px;font-family:var(--nu)}
.sp-ev-card-body{padding:20px 22px 22px}
.sp-ev-card-body h3{font-family:var(--pd);font-size:1.05rem;font-weight:700;color:var(--sp-txt);line-height:1.25;margin-bottom:10px}

/* Events grid 3 colonnes sur homepage */
.sp-events-section .sp-events-grid{grid-template-columns:repeat(3,1fr)}

/* Lieux details */
.sp-lieu-details{display:flex;flex-direction:column;gap:3px;margin-top:6px}

@media(max-width:1024px){
  .sp-concept-grid{grid-template-columns:1fr}
  .sp-concept-card{border-right:none;border-bottom:1px solid rgba(255,255,255,.08)}
  .sp-concept-card:last-child{border-bottom:none}
  .sp-events-section .sp-events-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:640px){
  .sp-events-section .sp-events-grid{grid-template-columns:1fr}
}

/* ══ HEADER V2 ══ */
.site-header{position:sticky;top:0;z-index:200;background:var(--sp-blanc);border-bottom:1px solid var(--sp-gris1);transition:box-shadow .3s}
.site-header.sp-scrolled{box-shadow:0 2px 16px rgba(13,32,96,.1)}

.sp-hdr-top{padding:16px 0 12px;transition:padding .3s}
.site-header.sp-scrolled .sp-hdr-top{padding:7px 0}

.sp-hdr-grid{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px}

.sp-hdr-left{display:flex;align-items:center}
.sp-hdr-date{font-size:.68rem;font-weight:600;color:var(--sp-gris3);text-transform:uppercase;letter-spacing:.1em}

.sp-hdr-center{display:flex;justify-content:center}
.sp-logo{display:block}
.sp-logo-img{height:46px;width:auto;object-fit:contain;display:block;transition:height .3s}
.site-header.sp-scrolled .sp-logo-img{height:30px}

.sp-hdr-right{display:flex;align-items:center;justify-content:flex-end;gap:10px}

.sp-search-bar{display:flex;align-items:center;gap:8px;background:var(--sp-gris1);border-radius:24px;padding:7px 14px;width:190px;transition:width .3s,background .2s;border:none;cursor:text}
.sp-search-bar:hover{background:var(--sp-gris2)}
.sp-search-bar svg{width:14px;height:14px;color:var(--sp-gris3);flex-shrink:0}
.sp-search-bar input{background:transparent;border:none;outline:none;font-family:var(--nu);font-size:.75rem;color:var(--sp-gris3);width:100%}
.sp-search-bar input::placeholder{color:var(--sp-gris3)}
.site-header.sp-scrolled .sp-search-bar{width:160px}

.sp-btn-event{background:var(--sp-orange);color:#fff;font-family:var(--nu);font-size:.68rem;font-weight:700;letter-spacing:.06em;padding:8px 14px;border:none;border-radius:20px;cursor:pointer;white-space:nowrap;transition:background .2s;display:flex;align-items:center;gap:5px;text-decoration:none}
.sp-btn-event:hover{background:#d96e06;color:#fff}
.sp-btn-event svg{width:13px;height:13px;flex-shrink:0}

/* Nav */
.sp-nav-wrap{border-top:1px solid var(--sp-gris1)}
.sp-nav{display:flex;justify-content:center;overflow-x:auto;scrollbar-width:none}
.sp-nav::-webkit-scrollbar{display:none}
.sp-nav a{display:flex;flex-direction:column;align-items:center;gap:3px;padding:9px 16px;color:var(--sp-gris3);border-bottom:2px solid transparent;transition:all .2s;white-space:nowrap;text-decoration:none}
.sp-nav a:hover{color:var(--sp-marine)}
.sp-nav a.current_page_item,
.sp-nav a.current-menu-item{color:var(--sp-marine);border-bottom-color:var(--sp-orange)}
.sp-nav-icon{font-size:1.1rem;line-height:1}
.sp-nav-label{font-size:.62rem;font-weight:700;text-transform:uppercase;letter-spacing:.09em}

/* Responsive */
@media(max-width:768px){
  .sp-hdr-date{display:none}
  .sp-btn-event span:not(:first-child){display:none}
  .sp-search-bar{width:36px;padding:7px}
  .sp-search-bar input{display:none}
}
@media(max-width:480px){
  .sp-hdr-grid{grid-template-columns:auto 1fr auto}
  .sp-logo-img{height:36px}
}

/* ══ GRILLES 9 ITEMS ══ */
.sp-lieux-grid--9{grid-template-columns:repeat(3,1fr)}
.sp-ev-archive-grid,
.sp-events-section .sp-events-grid{grid-template-columns:repeat(3,1fr)}

/* ══ SVG TAILLE FIXE dans meta rows ══ */
.sp-ev-meta-row svg,
.sp-ev-meta svg{width:14px !important;height:14px !important;flex-shrink:0}

/* ══ GRILLE BLOG 8 ARTICLES ══ */
.sp-art-featured--home{margin-bottom:24px}
.sp-art-grid-8{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:0}

/* ══ BOUTON SINGLE ÉVÉNEMENT — casse normale ══ */
.sp-ev-arc-more,
.sp-ev-cta-btn,
.sp-ev-map-btn{text-transform:none !important;letter-spacing:0 !important}
.sp-ev-arc-more{font-size:.8rem;font-weight:600;color:var(--sp-orange)}

/* ══ EVENTS GRID HOME — 3 colonnes ══ */
.sp-events-section .sp-events-grid{grid-template-columns:repeat(3,1fr) !important}

@media(max-width:1100px){
  .sp-art-grid-8{grid-template-columns:repeat(3,1fr)}
  .sp-lieux-grid--9{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:760px){
  .sp-art-grid-8{grid-template-columns:repeat(2,1fr)}
  .sp-lieux-grid--9{grid-template-columns:1fr}
  .sp-events-section .sp-events-grid{grid-template-columns:1fr !important}
}
@media(max-width:480px){
  .sp-art-grid-8{grid-template-columns:1fr}
}