/* Studio Event 22 — compléments de la page d'accueil (textes SEO, mariages & pros, zone, FAQ). Charte v1.0. */

/* Sous-titre du H1 : mots-clés lisibles, sans casser le grand titre de marque */
.accueil h1 .h1-sous{font-family:var(--texte);font-weight:500;font-size:clamp(.72rem,1.5vw,.95rem);letter-spacing:.3em;text-transform:uppercase;color:var(--or);text-shadow:none;margin-top:18px;line-height:1.6}
.intro-accueil{max-width:640px;margin:14px auto 0;color:var(--sable);font-size:clamp(.98rem,1.6vw,1.08rem)}
.intro-accueil strong{color:var(--blanc);font-weight:500}

/* Chapeau sous les titres de section */
.chapo{max-width:760px;margin:0 auto;color:var(--sable);font-size:1.02rem}

/* Description des trois métiers */
.metier .desc{color:var(--sable);font-size:.95rem;margin:0 auto 14px;max-width:340px}

/* Mariages & entreprises */
.deux{display:grid;grid-template-columns:repeat(2,1fr);gap:34px;margin-top:60px}
.bloc-evenement{border:1px solid rgba(255,154,31,.3);padding:40px 34px 34px;background:linear-gradient(180deg,rgba(255,154,31,.07),rgba(10,6,3,.4));position:relative}
.bloc-evenement::before{content:"";position:absolute;left:34px;top:0;width:60px;height:2px;background:var(--orange)}
.bloc-evenement h3{font-family:var(--titre);font-weight:700;color:var(--orange);letter-spacing:.06em;font-size:clamp(1.25rem,2.2vw,1.55rem);margin:0 0 14px;line-height:1.25}
.bloc-evenement p{margin:0 0 16px}
.bloc-evenement strong{color:var(--or);font-weight:500}
.bloc-evenement ul{list-style:none;padding:0;margin:0 0 24px}
.bloc-evenement li{position:relative;padding:6px 0 6px 22px;color:var(--sable)}
.bloc-evenement li::before{content:"";position:absolute;left:2px;top:15px;width:7px;height:7px;background:var(--orange);transform:rotate(45deg)}
.lien-fleche{color:var(--or);font-weight:600;font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid var(--filet);padding-bottom:4px}
.lien-fleche::after{content:" →"}
.lien-fleche:hover{color:var(--orange);border-color:var(--orange)}

/* Déroulé en quatre étapes */
.etapes.quatre-etapes{grid-template-columns:repeat(4,1fr)}

/* Zone d'intervention */
.villes{list-style:none;padding:0;margin:44px auto 0;max-width:960px;display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.villes li{border:1px solid rgba(255,154,31,.3);padding:8px 16px;font-size:.85rem;letter-spacing:.06em;color:var(--sable);background:rgba(21,14,7,.6)}

/* Questions fréquentes */
.faq{max-width:860px;margin:54px auto 0}
.faq details{border-bottom:1px solid var(--filet)}
.faq details:first-child{border-top:1px solid var(--filet)}
.faq summary{cursor:pointer;list-style:none;padding:22px 44px 22px 0;font-weight:600;font-size:1.05rem;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:6px;top:50%;transform:translateY(-50%);font-family:var(--titre);font-size:1.6rem;color:var(--orange);transition:transform .25s}
.faq details[open] summary::after{transform:translateY(-50%) rotate(45deg)}
.faq summary:hover{color:var(--or)}
.faq details p{margin:0 0 22px;color:var(--sable)}
.faq a{color:var(--or)}

/* Pied : adresse et coordonnées (cohérence nom / lieu / téléphone pour Google) */
.pied .adresse-pied{font-size:.82rem;color:var(--sable);margin:0 0 18px;line-height:1.8}
.pied .adresse-pied a{color:var(--sable);text-decoration:none}
.pied .adresse-pied a:hover{color:var(--or)}

@media (max-width:1000px){
  .etapes.quatre-etapes{grid-template-columns:repeat(2,1fr);row-gap:44px}
  .etapes.quatre-etapes .etape:nth-child(3)::before{display:none}
}
@media (max-width:860px){
  .deux{grid-template-columns:1fr}
  .etapes.quatre-etapes{grid-template-columns:1fr}
}
@media (max-width:560px){
  .bloc-evenement{padding:34px 20px 28px}
  .bloc-evenement::before{left:20px}
  .accueil h1 .h1-sous{letter-spacing:.18em}
}

/* Liens vers les pages de prestation dans les cartes Photo / Vidéo / Montage */
.metier li a{color:inherit;text-decoration:none;border-bottom:1px solid rgba(255,154,31,.35);transition:color .2s,border-color .2s}
.metier li a:hover{color:var(--or);border-color:var(--or)}