/**
 * BALART INVITATION — Style Classique
 * /wp-content/themes/kadence-child/invitation-styles/style-classique.css
 *
 * Design sobre, élégant, typographie Cormorant + Jost
 * Commun à tous les templates Classique (Hazel, Diana, Rosa, Elise...)
 * Les différences visuelles entre templates Classique = palette uniquement
 */

/* ── ENVELOPPE (commune à tous les Classique) ── */
.env-classique-screen {
    position: fixed; inset: 0; z-index: 9999;
    background: var(--cream);
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    transition: opacity .8s ease;
}
.env-classique-screen.hiding { opacity: 0; pointer-events: none; }

.env-wrapper {
    position: relative;
    width: min(72vw, 290px);
    aspect-ratio: 3 / 4.8;
    perspective: 900px;
    transform-style: preserve-3d;
    filter: drop-shadow(0 12px 40px rgba(44,36,28,.18));
}
.env-body {
    position: absolute; inset: 0;
    background: #F8F5EF; border-radius: 3px; overflow: hidden;
}
.env-body::after {
    content: ''; position: absolute; inset: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='400'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='400' height='400' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E");
    pointer-events: none; z-index: 0;
}
.env-fold { position: absolute; inset: 0; pointer-events: none; z-index: 1; }
.env-fold-left  { clip-path: polygon(0 100%,50% 52%,0 8%);   background: linear-gradient(135deg,rgba(196,168,130,.10) 0%,transparent 65%); }
.env-fold-right { clip-path: polygon(100% 100%,50% 52%,100% 8%); background: linear-gradient(225deg,rgba(196,168,130,.10) 0%,transparent 65%); }
.env-fold-bottom{ clip-path: polygon(0 100%,50% 52%,100% 100%); background: linear-gradient(0deg,rgba(196,168,130,.07) 0%,transparent 60%); }
.env-flap-line  { position: absolute; top: 44%; left: 0; right: 0; height: 1px; background: rgba(196,168,130,.25); z-index: 2; pointer-events: none; }
.env-flap {
    position: absolute; top: 0; left: 0; right: 0; height: 45%;
    clip-path: polygon(0 0,100% 0,100% 4%,50% 88%,0 4%);
    background: linear-gradient(175deg,#F2EDE4 55%,#E8E0D2 100%);
    transform-origin: top center; transform: rotateX(0deg);
    transition: transform 1s cubic-bezier(.4,0,.2,1);
    z-index: 10; box-shadow: 0 4px 12px rgba(44,28,16,.08);
}
.env-flap.open { transform: rotateX(-185deg); }
.env-flap-shadow {
    position: absolute; top: 38%; left: 5%; right: 5%; height: 10%;
    background: linear-gradient(180deg,rgba(44,28,16,.08) 0%,transparent 100%);
    z-index: 5; pointer-events: none; transition: opacity .5s ease;
}
.env-flap.open ~ .env-flap-shadow { opacity: 0; }

/* ── Sceau ── */
.env-seal {
    position: absolute; top: 38%; left: 50%;
    transform: translate(-50%,-50%); z-index: 20;
    width: clamp(58px,20%,78px); aspect-ratio: 1; border-radius: 50%;
    background: radial-gradient(circle at 33% 33%,var(--seal-gold-light) 0%,#C49A40 45%,var(--seal-gold-dark) 100%);
    cursor: pointer;
    box-shadow: 0 3px 14px rgba(160,120,48,.40), inset 0 1px 3px rgba(255,245,200,.30), inset 0 -2px 5px rgba(0,0,0,.18);
    display: flex; align-items: center; justify-content: center;
    transition: transform .2s ease; user-select: none;
}
.env-seal:hover  { transform: translate(-50%,-50%) scale(1.06); }
.env-seal:active { transform: translate(-50%,-50%) scale(.96); }
.env-seal-ring {
    width: 82%; height: 82%; border-radius: 50%;
    border: 1px solid rgba(255,240,180,.20);
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
}
.env-seal-label    { font-family:var(--font-sans); font-size:clamp(5px,1.4vw,7px); letter-spacing:.12em; text-transform:uppercase; color:rgba(255,245,200,.75); }
.env-seal-initials { font-family:var(--font-serif); font-style:italic; font-size:clamp(13px,4vw,19px); color:rgba(255,248,220,.95); text-shadow:0 1px 3px rgba(0,0,0,.30); }
.env-seal-bar      { width:55%; height:1px; background:rgba(255,240,180,.35); margin-top:1px; }

/* ── Caption & skip ── */
.env-caption { margin-top: 28px; text-align: center; }
.env-caption-main { font-family:var(--font-serif); font-style:italic; font-size:clamp(15px,3.5vw,18px); color:var(--text-light); margin-bottom:6px; }
.env-caption-hint { font-family:var(--font-sans); font-size:10px; font-weight:300; letter-spacing:.20em; text-transform:uppercase; color:var(--cream-dark); animation:hintPulse 2.2s ease-in-out infinite; }
@keyframes hintPulse { 0%,100%{opacity:.5} 50%{opacity:1} }
.env-skip { position:fixed; bottom:28px; right:24px; background:none; border:none; font-family:var(--font-sans); font-size:10px; letter-spacing:.18em; text-transform:uppercase; color:var(--cream-dark); cursor:pointer; padding:8px 4px; z-index:10000; transition:color .2s; }
.env-skip:hover { color:var(--text-light); }

/* ── HEADER CLASSIQUE ── */
.classique-header {
    min-height: 100vh; display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    background: var(--cream-mid); padding: 60px 24px;
    position: relative; overflow: hidden; text-align: center;
}
.classique-header::before {
    content: ''; position: absolute; inset: 0;
    background: radial-gradient(ellipse at 20% 20%,rgba(196,168,130,.08) 0%,transparent 60%),
                radial-gradient(ellipse at 80% 80%,rgba(196,168,130,.06) 0%,transparent 60%);
}
.header-ornament { font-family:var(--font-serif); font-size:11px; letter-spacing:5px; text-transform:uppercase; color:var(--gold); margin-bottom:32px; }
.header-ornament::before,.header-ornament::after { content:'——'; margin:0 12px; opacity:.5; }
.classique-names { font-family:var(--font-serif); font-size:clamp(42px,10vw,80px); font-weight:300; font-style:italic; color:var(--brown); line-height:1.1; margin-bottom:24px; }
.classique-ampersand { display:block; font-size:.5em; color:var(--gold); font-style:normal; margin:-4px 0; }
.header-divider { display:flex; align-items:center; gap:16px; margin:28px auto; width:200px; }
.header-divider::before,.header-divider::after { content:''; flex:1; height:1px; background:var(--cream-dark); }
.header-divider-diamond { width:6px; height:6px; background:var(--gold); transform:rotate(45deg); }
.classique-date { font-family:var(--font-serif); font-size:clamp(16px,3vw,22px); font-weight:300; color:var(--text-light); letter-spacing:2px; margin-bottom:10px; }
.classique-lieu { font-family:var(--font-sans); font-size:12px; font-weight:300; letter-spacing:4px; text-transform:uppercase; color:var(--cream-dark); }
.classique-message { max-width:480px; margin:36px auto 0; font-family:var(--font-serif); font-size:17px; font-style:italic; line-height:1.8; color:var(--text-light); }
.scroll-hint { position:absolute; bottom:32px; left:50%; transform:translateX(-50%); display:flex; flex-direction:column; align-items:center; gap:8px; font-family:var(--font-sans); font-size:10px; letter-spacing:3px; text-transform:uppercase; color:var(--cream-dark); }
.scroll-arrow { width:1px; height:32px; background:var(--cream-dark); animation:scrollDown 1.8s ease-in-out infinite; }
@keyframes scrollDown { 0%{transform:scaleY(0);transform-origin:top} 50%{transform:scaleY(1);transform-origin:top} 51%{transform:scaleY(1);transform-origin:bottom} 100%{transform:scaleY(0);transform-origin:bottom} }

/* ── CAROUSEL PHOTOS (Diana) ── */
.diana-hero { position:relative; min-height:100vh; }
.diana-carousel { position:relative; height:100vh; overflow:hidden; }
.diana-slide { position:absolute; inset:0; opacity:0; transition:opacity 1s ease; }
.diana-slide.active { opacity:1; }
.diana-slide img { width:100%; height:100%; object-fit:cover; }
.diana-slide::after { content:''; position:absolute; inset:0; background:linear-gradient(to bottom,rgba(44,24,16,.2) 0%,rgba(44,24,16,.5) 100%); }
.diana-hero-content { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:40px 24px; z-index:2; }
.diana-carousel-dots { position:absolute; bottom:80px; left:50%; transform:translateX(-50%); display:flex; gap:8px; z-index:3; }
.diana-dot { width:6px; height:6px; border-radius:50%; background:rgba(255,255,255,.4); cursor:pointer; transition:background .3s; }
.diana-dot.active { background:#FFF; }
.diana-hero-content .classique-names { color:#FFF; }
.diana-hero-content .classique-ampersand { color:var(--gold); }
.diana-hero-content .classique-date { color:rgba(255,255,255,.85); }
.diana-hero-content .classique-lieu { color:rgba(255,255,255,.6); }
.diana-hero-content .classique-message { color:rgba(255,255,255,.8); }
.diana-hero-content .header-divider::before,
.diana-hero-content .header-divider::after { background:rgba(255,255,255,.3); }

/* ── COMPTE À REBOURS ── */
.bloc-countdown { background:var(--brown); padding:64px 24px; text-align:center; }
.bloc-countdown .s-label { color:var(--gold); }
.bloc-countdown .s-title { color:var(--cream); }
.countdown-grid { display:flex; justify-content:center; gap:clamp(12px,4vw,32px); flex-wrap:wrap; }
.countdown-unit { min-width:80px; text-align:center; }
.countdown-number { font-family:var(--font-serif); font-size:clamp(40px,8vw,64px); font-weight:300; color:var(--cream-mid); line-height:1; display:block; }
.countdown-label  { font-family:var(--font-sans); font-size:10px; letter-spacing:3px; text-transform:uppercase; color:var(--gold); margin-top:8px; display:block; }
.countdown-sep    { font-family:var(--font-serif); font-size:48px; color:var(--gold); opacity:.3; align-self:flex-start; padding-top:8px; }

/* ── LIEU ── */
.location-card { border:1px solid var(--cream-dark); border-radius:2px; padding:40px; text-align:center; background:var(--white); }
.location-icon { width:48px; height:48px; border-radius:50%; background:var(--cream-mid); display:flex; align-items:center; justify-content:center; margin:0 auto 20px; font-size:18px; }
.location-name { font-family:var(--font-serif); font-size:26px; font-style:italic; color:var(--brown); margin-bottom:12px; }
.location-address { font-size:13px; font-weight:300; color:var(--text-light); letter-spacing:1px; line-height:1.6; margin-bottom:28px; }
.location-btn { display:inline-flex; align-items:center; gap:8px; padding:12px 28px; border:1px solid var(--brown); font-family:var(--font-sans); font-size:11px; font-weight:500; letter-spacing:3px; text-transform:uppercase; color:var(--brown); text-decoration:none; transition:all .3s; }
.location-btn:hover { background:var(--brown); color:var(--cream-mid); }

/* ── PROGRAMME ── */
.balart-timeline { position:relative; padding-left:40px; }
.balart-timeline::before { content:''; position:absolute; left:12px; top:6px; bottom:6px; width:1px; background:var(--cream-dark); }
.timeline-item { position:relative; margin-bottom:36px; }
.timeline-item:last-child { margin-bottom:0; }
.timeline-dot { position:absolute; left:-34px; top:6px; width:9px; height:9px; border-radius:50%; background:var(--gold); border:2px solid var(--cream-mid); box-shadow:0 0 0 1px var(--gold); }
.timeline-time  { font-family:var(--font-sans); font-size:11px; font-weight:500; letter-spacing:2px; color:var(--gold); margin-bottom:4px; }
.timeline-title { font-family:var(--font-serif); font-size:20px; font-style:italic; color:var(--brown); margin-bottom:4px; }
.timeline-desc  { font-size:13px; font-weight:300; color:var(--text-light); line-height:1.5; }

/* ── HISTOIRE ── */
.bloc-histoire-wrap { background:var(--white); padding:80px 24px; }
.histoire-text { font-family:var(--font-serif); font-size:18px; font-style:italic; line-height:1.9; color:var(--text-light); max-width:580px; margin:0 auto; text-align:center; }

/* ── DRESS CODE ── */
.dresscode-content { background:var(--cream-mid); border-left:3px solid var(--gold); padding:28px 32px; font-family:var(--font-serif); font-size:18px; font-style:italic; color:var(--text-light); line-height:1.8; }

/* ── FAQ ── */
.faq-item { border-bottom:1px solid var(--cream-dark); overflow:hidden; }
.faq-item:first-child { border-top:1px solid var(--cream-dark); }
.faq-question { width:100%; background:none; border:none; padding:22px 0; display:flex; justify-content:space-between; align-items:center; cursor:pointer; font-family:var(--font-serif); font-size:18px; font-style:italic; color:var(--brown); text-align:left; gap:16px; }
.faq-icon { font-size:20px; color:var(--gold); flex-shrink:0; transition:transform .3s; font-style:normal; font-family:var(--font-sans); }
.faq-item.open .faq-icon { transform:rotate(45deg); }
.faq-answer { max-height:0; overflow:hidden; transition:max-height .4s ease,padding .3s; font-size:14px; font-weight:300; color:var(--text-light); line-height:1.7; }
.faq-item.open .faq-answer { max-height:200px; padding-bottom:20px; }

/* ── RSVP CLASSIQUE ── */
.bloc-rsvp { background:var(--brown); padding:80px 24px; text-align:center; }
.bloc-rsvp .s-label { color:var(--gold); }
.bloc-rsvp .s-title { color:var(--cream-mid); }
.rsvp-inner { max-width:520px; margin:0 auto; background:var(--cream-mid); border-radius:2px; padding:40px; }
.rsvp-inner .wpforms-form input[type=text],
.rsvp-inner .wpforms-form input[type=email],
.rsvp-inner .wpforms-form input[type=number],
.rsvp-inner .wpforms-form select,
.rsvp-inner .wpforms-form textarea {
    border:none !important; border-bottom:1px solid var(--cream-dark) !important;
    border-radius:0 !important; background:transparent !important;
    font-family:var(--font-serif) !important; font-size:16px !important;
    color:var(--brown) !important; padding:10px 0 !important; box-shadow:none !important;
}
.rsvp-inner .wpforms-form label { font-family:var(--font-sans) !important; font-size:10px !important; font-weight:500 !important; letter-spacing:3px !important; text-transform:uppercase !important; color:var(--text-light) !important; }
.rsvp-inner .wpforms-form .wpforms-submit { background:var(--brown) !important; border:none !important; border-radius:0 !important; font-family:var(--font-sans) !important; font-size:11px !important; letter-spacing:4px !important; text-transform:uppercase !important; padding:16px 40px !important; cursor:pointer !important; width:100% !important; margin-top:24px !important; color:var(--cream) !important; }
.rsvp-inner .wpforms-form .wpforms-submit:hover { background:var(--brown-mid) !important; }

/* ═══════════════════════════════════════════════════════
   CLASSES COMMUNES — partagées avec tous les blocs
   Ajout v3 : ces classes étaient manquantes dans Classique
   (elles existaient dans style-florale.css mais pas ici)
═══════════════════════════════════════════════════════ */

/* Wrapper de section générique */
.balart-section {
    padding: 80px 24px;
    max-width: 680px;
    margin: 0 auto;
    text-align: center;
}

/* Séparateur décoratif entre sections */
.balart-sep {
    text-align: center;
    padding: 16px 0;
    color: var(--gold);
    font-family: var(--font-serif);
    font-size: 18px;
    letter-spacing: 10px;
    opacity: .35;
}

/* Label eyebrow au-dessus des titres de sections */
.s-label {
    display: block;
    font-family: var(--font-sans);
    font-size: 10px;
    font-weight: 500;
    letter-spacing: 5px;
    text-transform: uppercase;
    color: var(--gold);
    margin-bottom: 12px;
}

/* Titre principal de chaque section */
.s-title {
    font-family: var(--font-serif);
    font-size: clamp(30px, 7vw, 46px);
    font-weight: 300;
    font-style: italic;
    color: var(--brown);
    line-height: 1.08;
    margin-bottom: 36px;
}

/* Sous-titre optionnel sous le titre */
.s-subtitle {
    font-family: var(--font-serif);
    font-size: clamp(15px, 3vw, 18px);
    font-style: italic;
    font-weight: 300;
    color: var(--text-light);
    line-height: 1.75;
    max-width: 520px;
    margin: -20px auto 36px;
    text-align: center;
}

/* Wrapper FAQ */
.balart-faq {
    max-width: 540px;
    margin: 0 auto;
    text-align: left;
}

/* Citation — fond sombre (Classique) */
.classique-citation-section {
    position: relative;
    background: var(--brown);
    padding: 88px 40px;
    text-align: center;
    background-size: cover !important;
    background-position: center !important;
    overflow: hidden;
}
.classique-citation-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,.52);
    z-index: 1;
}
.classique-citation-inner {
    position: relative;
    z-index: 2;
    max-width: 600px;
    margin: 0 auto;
}
.classique-citation-guillemets {
    font-family: var(--font-serif);
    font-size: 72px;
    color: var(--gold);
    line-height: .5;
    margin-bottom: 28px;
    opacity: .60;
    display: block;
}
.classique-citation-texte {
    font-family: var(--font-serif);
    font-size: clamp(20px, 4.5vw, 30px);
    font-style: italic;
    font-weight: 300;
    color: var(--cream);
    line-height: 1.60;
    margin-bottom: 32px;
}
.classique-citation-line {
    width: 40px;
    height: 1px;
    background: var(--gold);
    opacity: .40;
    margin: 0 auto 16px;
}
.classique-citation-auteur {
    font-family: var(--font-sans);
    font-size: 10px;
    letter-spacing: 5px;
    text-transform: uppercase;
    color: rgba(255,252,248,.45);
}

/* Responsive */
@media (max-width: 640px) {
    .balart-section { padding: 60px 20px; }
}

/* ── RSVP — classes communes (ajout v3) ── */
.rsvp-wrap { max-width: 680px; margin: 0 auto; text-align: center; }
.rsvp-intro { font-family:var(--font-serif); font-style:italic; font-size:16px; color:var(--cream-dark); margin-bottom:40px; line-height:1.7; }
.rsvp-unavailable { font-family:var(--font-serif); font-style:italic; color:var(--text-light); padding:20px 0; }

/* ═══════════════════════════════════════════════════════
   HERO CLASSIQUE v4 — fix définitif vidéo + texte superposés
═══════════════════════════════════════════════════════ */

/* Wrapper : hauteur fixe, contexte de positionnement */
.c-hero-wrap {
    position: relative !important;
    width: 100% !important;
    height: 100vh !important;
    min-height: 600px !important;
    overflow: hidden !important;
    display: block !important;
    background: var(--cream) !important;
}

/* Vidéo : absolue, centrée, couvre tout */
.c-hero-video {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    min-width: 100% !important;
    min-height: 100% !important;
    width: auto !important;
    height: auto !important;
    object-fit: cover !important;
    z-index: 1 !important;
}

/* Image fixe fallback */
.c-hero-bg {
    position: absolute !important;
    inset: 0 !important;
    background-size: cover !important;
    background-position: center !important;
    z-index: 1 !important;
}

/* Contenu : absolu, couvre tout le wrapper, centré */
.c-hero-content {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    z-index: 2 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    padding: 80px 32px !important;
}

/* Supprimer le ::after qui causait des problèmes */
.c-hero-wrap::after {
    display: none !important;
}

/* Desktop : vidéo centrée */
@media (min-width: 768px) {
    .c-hero-video {
        width: 100% !important;
        height: 100% !important;
        top: 0 !important;
        left: 0 !important;
        transform: none !important;
    }
}