/* Fichier genere par app:styles:assembler depuis assets/styles/ : ne pas modifier a la main (App\Gabarit\FeuillesSite). */
.hero{background:var(--vert);border-radius:0 0 46px 46px;padding:28px 0 40px;position:relative;overflow:hidden}
.hero-rond{position:absolute;width:190px;top:-80px;right:-70px;opacity:.75;z-index:1;pointer-events:none}
.hero-grille{
  display:grid;grid-template-columns:minmax(0,1fr);gap:22px;position:relative;z-index:2;
  grid-template-areas:"meeple" "texte" "widget";
}
.hero-meeple{grid-area:meeple;width:92px;filter:drop-shadow(0 8px 14px rgba(36,71,31,.22))}
.hero-texte{grid-area:texte;min-width:0}
.hero h1{color:var(--vert-profond);font-size:2.3rem;max-width:16ch}
.hero h1 .sur-titre{display:block;font-family:var(--sans);font-size:.85rem;font-weight:700;text-transform:uppercase;letter-spacing:.16em;margin-bottom:.55em}
.hero .chapo{color:var(--vert-profond);font-size:1.1rem;max-width:54ch;font-weight:500}
.hero-widget{grid-area:widget;min-width:0}
@media (min-width:900px){
  .hero{padding:52px 0 58px;border-radius:0 0 60px 60px}
  .hero-rond{width:260px;top:-110px;right:-90px}
  .hero-grille{
    grid-template-columns:170px minmax(0,1fr);
    grid-template-areas:"meeple texte" "widget widget";
    column-gap:40px;row-gap:30px;align-items:center;
  }
  .hero-meeple{width:100%;max-width:170px;justify-self:center}
  .hero h1{font-size:3rem}
  .hero h1 .sur-titre{font-size:.95rem}
  .hero .chapo{font-size:1.15rem}
}
@media (min-width:1100px){
  .hero-grille{
    grid-template-columns:170px auto 360px;
    grid-template-areas:"meeple texte widget";
    column-gap:24px;align-items:center;justify-content:space-evenly;
  }
  .hero .env{max-width:none}
  .hero-meeple{max-width:170px}
  .hero h1{font-size:3.1rem}
}
.aujourdhui{
  position:relative;grid-area:widget;min-width:0;
  background:rgba(255,255,255,.6);border:2px solid rgba(255,255,255,.85);border-radius:var(--r-grand);
  padding:26px 22px 20px;color:var(--vert-profond);
}
.aujourdhui-de{position:absolute;top:-20px;right:16px;width:54px;height:auto;transform:rotate(14deg);pointer-events:none}
.aujourdhui .etiquette{
  display:inline-flex;align-items:center;gap:10px;font-size:.78rem;font-weight:700;
  text-transform:uppercase;letter-spacing:.12em;color:#fff;background:var(--vert-profond);
  border-radius:999px;padding:6px 14px 6px 12px;margin:0 0 12px;
}
.aujourdhui .point{position:relative;width:10px;height:10px;border-radius:50%;background:var(--vert-clair);display:inline-block;flex:0 0 auto}
.aujourdhui .point::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid var(--vert-clair);animation:halo 2.4s ease-out infinite}
.aujourdhui .point--calme{background:#fff;opacity:.75}
.aujourdhui .point--calme::after{content:none}
@keyframes halo{from{transform:scale(.55);opacity:.8}to{transform:scale(1.45);opacity:0}}
@media (prefers-reduced-motion:reduce){.aujourdhui .point::after{animation:none;opacity:.35}}
.aujourdhui .horaire{
  font-family:var(--serif);font-size:1.75rem;font-weight:700;color:var(--vert-profond);line-height:1.15;margin:0 0 8px;
}
.aujourdhui .horaire .segment{display:inline-block}
.aujourdhui .motif{margin:0 0 4px;font-size:1.02rem;font-weight:700;color:var(--vert-profond)}
.aujourdhui .entree{margin:0;font-size:.98rem;font-weight:500;color:var(--vert-profond)}
.aujourdhui .entree + .entree{margin-top:6px}
.aujourdhui .suite{margin-top:16px;padding-top:14px;border-top:3px dotted rgba(36,71,31,.4);font-size:.95rem;color:var(--vert-profond)}
.aujourdhui .suite p{margin:0 0 6px}
.aujourdhui .suite .suite-titre{font-size:.76rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--vert-fonce);margin-bottom:2px}
.aujourdhui .suite strong{color:var(--vert-profond)}
.aujourdhui .suite .lien-souligne{font-size:.92rem;color:var(--vert-profond);display:inline-flex;align-items:center;min-height:44px}
@media (min-width:900px){
  .aujourdhui{display:flex;gap:26px;align-items:center;padding:28px 28px 24px}
  .aujourdhui .bloc-h{flex:1 1 auto;min-width:0}
  .aujourdhui .horaire{font-size:2.1rem}
  .aujourdhui .suite{flex:0 0 11.5em;margin:0;border-top:0;border-left:3px dotted rgba(36,71,31,.4);padding:4px 0 4px 24px}
  .aujourdhui-de{width:60px;top:-24px;right:24px}
}
@media (min-width:1100px){
  .aujourdhui{flex-direction:column;align-items:stretch;gap:0;padding:30px 24px 24px}
  .aujourdhui .horaire{font-size:1.75rem}
  .aujourdhui .suite{flex:0 0 auto;margin-top:18px;border-left:0;border-top:3px dotted rgba(36,71,31,.4);padding:16px 0 0}
}
