/* ===========================================================
   COMITÉ FÊTE DU CHEVAL D'OCANA
   École : affiche rustique / fête traditionnelle méditerranéenne
   =========================================================== */
:root{
  --terra:#A8421F;
  --terra-d:#822f12;
  --maquis:#4E6B3A;
  --maquis-d:#39502a;
  --ocre:#D79A2B;
  --ocre-d:#b07d18;
  --cream:#F3E7CF;
  --cream-2:#FAF2E1;
  --ink:#2A1C10;
  --line:#d9c7a3;
  --muted:#7a6549;
  --maxw:1100px;
  --disp:"Oswald",system-ui,sans-serif;
  --body:"Bitter",Georgia,serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--body);background:var(--cream);color:var(--ink);line-height:1.7;font-size:17px;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}a{color:inherit;text-decoration:none}
h1,h2,h3,h4{font-family:var(--disp);font-weight:700;line-height:1;text-transform:uppercase;letter-spacing:.01em}
h1{font-size:clamp(3rem,8vw,6.5rem)}
h2{font-size:clamp(2rem,4.5vw,3.4rem)}
h3{font-size:1.4rem;letter-spacing:.02em}
p{margin-bottom:1rem}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}
.lead{font-size:1.18rem}
.muted{color:var(--muted)}
section{padding:78px 0}
.center{text-align:center}
.kick{font-family:var(--disp);font-weight:600;text-transform:uppercase;letter-spacing:.34em;font-size:.82rem;color:var(--terra)}
.dbl-rule{border:0;border-top:3px double var(--ink);max-width:120px;margin:14px auto}
.dbl-rule.l{margin:14px 0}

.btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--disp);font-weight:600;text-transform:uppercase;letter-spacing:.08em;font-size:.95rem;padding:14px 30px;border:2px solid var(--ink);background:var(--terra);color:#fff;cursor:pointer;transition:.16s}
.btn:hover{background:var(--terra-d)}
.btn-ocre{background:var(--ocre);color:var(--ink)}.btn-ocre:hover{background:var(--ocre-d)}
.btn-maquis{background:var(--maquis);color:#fff}.btn-maquis:hover{background:var(--maquis-d)}
.btn-out{background:transparent;color:var(--ink)}.btn-out:hover{background:var(--ink);color:var(--cream)}

/* header — bandeau programme */
.hdr{background:var(--ink);color:var(--cream);position:sticky;top:0;z-index:60;border-bottom:3px solid var(--ocre)}
.nav{display:flex;align-items:center;justify-content:space-between;height:72px}
.brand{display:flex;align-items:center;gap:12px;color:var(--cream)}
.brand img{width:44px;height:44px}
.brand b{font-family:var(--disp);font-weight:700;text-transform:uppercase;font-size:1.1rem;line-height:1;letter-spacing:.02em}
.brand small{display:block;font-family:var(--body);font-weight:400;font-size:.62rem;letter-spacing:.16em;color:var(--ocre)}
.nav-links{display:flex;gap:2px;list-style:none;align-items:center}
.nav-links a{padding:9px 13px;font-family:var(--disp);font-weight:500;text-transform:uppercase;letter-spacing:.06em;font-size:.86rem;color:var(--cream)}
.nav-links a:hover,.nav-links a.active{color:var(--ocre)}
.nav-links .cta{background:var(--terra);padding:9px 16px;color:#fff}
.burger{display:none;width:44px;height:40px;border:1px solid var(--ocre);background:transparent;cursor:pointer}
.burger span{display:block;width:18px;height:2px;background:var(--cream);margin:3px auto}

/* HERO — affiche */
.hero{position:relative;background:var(--maquis-d);color:var(--cream);text-align:center;overflow:hidden;border-bottom:6px double var(--ocre)}
.hero .bg{position:absolute;inset:0;opacity:.32}
.hero .bg img{width:100%;height:100%;object-fit:cover;filter:sepia(.3)}
.hero .veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(42,28,16,.55),rgba(78,107,58,.75))}
.hero .inner{position:relative;z-index:2;padding:70px 24px 60px;max-width:880px;margin:0 auto}
.hero .ed{font-family:var(--disp);font-weight:600;text-transform:uppercase;letter-spacing:.4em;font-size:.86rem;color:var(--ocre)}
.hero h1{color:var(--cream);margin:12px 0;text-shadow:3px 3px 0 rgba(0,0,0,.25)}
.hero h1 .big{display:block;font-size:1.32em;color:var(--ocre)}
.hero .sub{font-family:var(--body);font-size:1.2rem;font-style:italic;max-width:40ch;margin:0 auto}
.datebar{display:inline-flex;align-items:stretch;gap:0;margin-top:26px;border:3px solid var(--ocre);background:rgba(0,0,0,.25)}
.datebar .d{padding:14px 22px;font-family:var(--disp);text-align:center;border-right:1px solid rgba(215,154,43,.5)}
.datebar .d:last-child{border-right:0}
.datebar .d .big{font-size:2rem;font-weight:700;line-height:1;color:var(--ocre)}
.datebar .d .sm{font-size:.74rem;text-transform:uppercase;letter-spacing:.12em;margin-top:4px}
.hero-cta{margin-top:28px;display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

/* ruban défilant */
.ribbon{background:var(--ocre);color:var(--ink);overflow:hidden;border-bottom:3px solid var(--ink)}
.ribbon .t{display:flex;white-space:nowrap;animation:sc 22s linear infinite;padding:10px 0;font-family:var(--disp);font-weight:600;text-transform:uppercase;letter-spacing:.1em}
.ribbon .t span{padding:0 26px}
.ribbon .t span::after{content:"♞";margin-left:26px;color:var(--terra)}
@keyframes sc{to{transform:translateX(-50%)}}

/* poster panel (cadre double) */
.panel{border:3px double var(--ink);background:var(--cream-2);padding:40px}
.shead{text-align:center;max-width:680px;margin:0 auto 42px}

/* presentation split */
.split{display:grid;grid-template-columns:1fr 1fr;gap:46px;align-items:center}
.split.rev .m{order:2}
.split .m{border:4px solid var(--ink);overflow:hidden;background:#fff;box-shadow:8px 8px 0 var(--ocre)}
.split .m img{width:100%;height:100%;object-fit:cover;min-height:300px}

/* programme — bill/timetable */
.bill{border-top:3px double var(--ink)}
.bill .it{display:grid;grid-template-columns:130px 1fr;gap:24px;padding:18px 6px;border-bottom:1px solid var(--line);align-items:baseline}
.bill .h{font-family:var(--disp);font-weight:700;font-size:1.3rem;color:var(--terra)}
.bill .t h3{margin-bottom:3px}.bill .t p{margin:0;color:var(--muted)}
.daytab{display:inline-block;font-family:var(--disp);font-weight:700;text-transform:uppercase;letter-spacing:.1em;background:var(--maquis);color:#fff;padding:8px 20px;margin-bottom:6px}

/* highlights (3) */
.feats{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:3px solid var(--ink)}
.feats .f{padding:30px 24px;border-right:1px solid var(--line);text-align:center}
.feats .f:last-child{border-right:0}
.feats .ic{font-size:2rem;color:var(--terra);margin-bottom:10px}
.feats h3{margin-bottom:6px}.feats p{margin:0;color:var(--muted);font-size:.95rem}

/* gallery affiche */
.gal{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.gal figure{border:3px solid var(--ink);overflow:hidden;background:#fff;box-shadow:5px 5px 0 var(--maquis)}
.gal img{width:100%;height:230px;object-fit:cover}
.poster-feature{display:grid;grid-template-columns:.8fr 1.2fr;gap:40px;align-items:center}
.poster-feature .pf{border:4px solid var(--ink);box-shadow:10px 10px 0 var(--terra);max-width:330px;margin:0 auto}

/* infos pratiques */
.infos{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.infocard{border:3px double var(--ink);background:var(--cream-2);padding:24px;text-align:center}
.infocard .ic{font-size:1.8rem;color:var(--maquis);margin-bottom:8px}
.infocard h3{margin-bottom:6px}.infocard p{margin:0;color:var(--muted)}

/* CTA */
.cta{background:var(--terra);color:var(--cream);text-align:center;border-top:6px double var(--ocre);border-bottom:6px double var(--ocre)}
.cta h2{color:var(--cream)}
.cta p{max-width:46ch;margin:14px auto 24px;font-style:italic}

/* page hero */
.page-hero{background:var(--ink);color:var(--cream);text-align:center;padding:56px 0;border-bottom:4px solid var(--ocre)}
.page-hero .kick{color:var(--ocre)}
.page-hero h1{color:var(--cream);margin-top:8px;font-size:clamp(2.4rem,6vw,4rem)}
.page-hero p{max-width:60ch;margin:12px auto 0;font-style:italic}

/* prose */
.prose{max-width:740px;margin:0 auto}
.prose h2{font-size:1.7rem;margin:26px 0 8px}
.prose p,.prose li{color:#43321f}
.prose ul{padding-left:18px;margin:8px 0;display:grid;gap:6px}

/* contact/legal */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:start}
.legal{border:3px double var(--ink);background:var(--cream-2);padding:24px}
.legal h3{color:var(--terra);margin-bottom:10px}
.legal .row{display:flex;justify-content:space-between;gap:14px;padding:9px 0;border-bottom:1px solid var(--line);font-size:.94rem}
.legal .row:last-child{border:0}.legal .row span:first-child{color:var(--muted);font-family:var(--disp);text-transform:uppercase;letter-spacing:.06em;font-size:.78rem}.legal .row span:last-child{font-weight:700}
.field{margin-bottom:15px}.field label{display:block;font-family:var(--disp);font-weight:600;text-transform:uppercase;letter-spacing:.06em;font-size:.82rem;margin-bottom:6px}
.field input,.field textarea,.field select{width:100%;padding:13px 14px;border:2px solid var(--ink);background:#fff;font:inherit}
.field input:focus,.field textarea:focus,.field select:focus{outline:2px solid var(--ocre);outline-offset:-2px}
.field textarea{min-height:130px;resize:vertical}
.consent{display:flex;gap:9px;font-size:.84rem;color:var(--muted)}.consent input{width:auto;margin-top:4px}
.map{border:3px solid var(--ink);width:100%;height:280px;margin-top:16px}

/* footer */
.ftr{background:var(--ink);color:#cdbb9c;padding:56px 0 24px;border-top:4px solid var(--ocre)}
.ftr-grid{display:grid;grid-template-columns:1.8fr 1fr 1.3fr;gap:32px}
.ftr .brand{margin-bottom:12px}.ftr .brand b{color:var(--cream)}
.ftr h4{font-family:var(--disp);color:var(--ocre);text-transform:uppercase;letter-spacing:.1em;font-size:.84rem;margin-bottom:12px}
.ftr ul{list-style:none;display:grid;gap:8px}.ftr a,.ftr li{color:#cdbb9c;font-size:.92rem}.ftr a:hover{color:var(--ocre)}
.ftr-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-top:36px;padding-top:16px;border-top:1px solid rgba(215,154,43,.3);font-size:.84rem;color:#9c8a6e}
.ftr-bottom a{color:#cdbb9c}

.reveal{opacity:0;transform:translateY(18px);transition:.55s}.reveal.in{opacity:1;transform:none}

@media(max-width:880px){
  .split,.contact-grid,.poster-feature{grid-template-columns:1fr}
  .split.rev .m{order:0}
  .feats,.infos,.gal{grid-template-columns:1fr 1fr}
  .feats .f:nth-child(2){border-right:0}
  .feats .f{border-bottom:1px solid var(--line)}
  .ftr-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:600px){
  .nav-links{position:fixed;inset:72px 0 auto 0;background:var(--ink);flex-direction:column;align-items:stretch;padding:12px;gap:2px;transform:translateY(-140%);transition:.3s}
  .nav-links.open{transform:none}.burger{display:block}
  .feats,.infos,.gal{grid-template-columns:1fr}.feats .f{border-right:0}
  .bill .it{grid-template-columns:1fr;gap:4px}
  .ftr-grid{grid-template-columns:1fr}
  section{padding:54px 0}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}.ribbon .t{animation:none}}
