/**
 * photobooth-on-events.css — Template Photobooth ON-Events (sous-site)
 * Contient uniquement les règles spécifiques à ce template.
 * Les composants communs sont dans photobooth-shared.css.
 */

/* =====================================================
   LAYOUT — Le hero commence sous le header blanc ON-Events
   Le header ON-Events est utilisé tel quel (fond blanc).
===================================================== */
.page-template-template-photobooth-on-events .on-events-main,
.page-template-template-photobooth-on-events-en .on-events-main {
    padding-top: 105px;
}

.page-template-template-photobooth-on-events .photobooth-hero,
.page-template-template-photobooth-on-events-en .photobooth-hero {
    min-height: calc(100vh - 105px) !important;
    padding-top: 0;
}

/* =====================================================
   OVERRIDE — fond noir du sous-site remplacé par blanc
   puis le photobooth-main reprend le navy
===================================================== */
.page-template-template-photobooth-on-events.on-events-page,
.page-template-template-photobooth-on-events .on-events-site,
.page-template-template-photobooth-on-events-en.on-events-page,
.page-template-template-photobooth-on-events-en .on-events-site {
    background-color: #fdfbfa;
}

.page-template-template-photobooth-on-events .photobooth-main,
.page-template-template-photobooth-on-events-en .photobooth-main {
    background-color: var(--pb-navy);
}

.page-template-template-photobooth-on-events .on-events-main,
.page-template-template-photobooth-on-events-en .on-events-main {
    background-color: var(--pb-navy);
}

/* Template Photobooth EN (header mariage) : pas de padding-top supplémentaire */
body.page-template-template-photobooth-en .photobooth-main {
    padding-top: 0;
}

/* =====================================================
   HERO — spécifique au sous-site (sous header de 105px)
===================================================== */
.photobooth-hero {
    position: relative;
    min-height: calc(100vh - 105px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    overflow: hidden;
    box-sizing: border-box;
}

.photobooth-hero-content {
    position: relative;
    z-index: 1;
    width: 100vw;
    max-width: 100vw;
    padding: 2rem;
    margin-left: calc((100% - 100vw) / 2) !important;
    margin-right: 0 !important;
    left: 0 !important;
    right: 0 !important;
    text-align: center !important;
    align-self: center;
    animation: pb-fade-up 1s ease both;
}

.photobooth-hero-eyebrow {
    font-family: var(--pb-font-sans);
    font-size: 0.75rem;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    color: var(--pb-gold);
    margin: 0 0 1.4rem;
    opacity: 0.8;
    padding-left: 0 !important;
    text-align: center !important;
    width: 100%;
    display: block;
    animation: pb-fade-up 1s 0.1s ease both;
}

.photobooth-hero-title {
    margin: 0 0 0.5rem;
    line-height: 1.1;
    width: 100%;
    text-align: center !important;
    display: block;
}

/* Variante blanche du titre (spécifique à ce template) */
.photobooth-hero-em-white {
    display: block;
    font-style: italic;
    font-size: clamp(3rem, 8vw, 6rem);
    font-weight: 400;
    color: #ffffff;
    animation: pb-fade-up 1s 0.25s ease both;
}

.photobooth-hero-subtitle {
    display: block;
    font-family: var(--pb-font-sans);
    font-size: clamp(1.4rem, 4vw, 2.4rem);
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--pb-gold);
    animation: pb-fade-up 1s 0.3s ease both;
}

/* =====================================================
   FOOTER — espace au-dessus des icônes sociales
===================================================== */
.page-template-template-photobooth-on-events .footer-social-icons,
.page-template-template-photobooth-on-events-en .footer-social-icons {
    margin-top: 2.3rem;
}

/* =====================================================
   FOOTER FR — page /fr/photo-booth/ (template photobooth-on-events)
   Force le même fond beige que the-experience-2
===================================================== */