:root {
    --sky:     #A8C8E0;
    --sky-d:   #7B9EC4;
    --beige:   #F5EFE6;
    --beige-d: #E8DFD2;
    --white:   #FAFAF7;
    --dark:    #2C3E50;
    --text:    #4A4A4A;
    --muted:   #8A8A8A;
    --green:   #6AAF7B;
    --red:     #D96B6B;
    --amber:   #D4A853;
    --ft:      'Cormorant Garamond', Georgia, serif;
    --fb:      'Jost', sans-serif;
    --script:  'Great Vibes', cursive;
    --logo:    'Playfair Display', Georgia, serif;
    --ease:    cubic-bezier(.4,0,.2,1);
    --ease-out: cubic-bezier(.16, 1, .3, 1);
    --ease-soft: cubic-bezier(.33, 1, .68, 1);
    --dur: .55s;
    --dur-slow: 1s;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
}
body {
    font-family: var(--fb);
    font-weight: 400;
    color: var(--text);
    background: var(--white);
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
    font-size: 16px;
}
body.intro-locked { overflow: hidden; }

/* ═══════════════════════════════════════════════════
   INTRO — minimal (editorial), sans carte ni effets agressifs
   ═══════════════════════════════════════════════════ */
.intro-overlay {
    position: fixed; inset: 0; z-index: 100000;
    display: flex; align-items: center; justify-content: center;
    padding: min(32px, 5vw);
    background: var(--dark);
}
.intro-overlay.is-closing { pointer-events: none; }

.intro-bg {
    position: absolute; inset: 0;
    background:
        radial-gradient(ellipse 70% 55% at 50% 15%, rgba(168,200,224,.14), transparent 60%),
        radial-gradient(ellipse 50% 40% at 85% 85%, rgba(123,158,196,.08), transparent 50%),
        linear-gradient(168deg, #1b2430 0%, var(--dark) 42%, #141c24 100%);
}

.intro-grain {
    position: absolute; inset: 0; opacity: .035; pointer-events: none;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

.intro-content {
    position: relative; z-index: 2;
    width: 100%;
    max-width: 34rem;
    text-align: center;
}

.intro-inner {
    padding: clamp(2rem, 5vw, 3rem) 1rem;
}

.intro-rule {
    display: block;
    width: min(180px, 40vw);
    height: 1px;
    margin-left: auto;
    margin-right: auto;
    background: linear-gradient(90deg, transparent, rgba(168,200,224,.45), transparent);
}
.intro-rule--top { margin-bottom: clamp(1.5rem, 4vw, 2rem); }
.intro-rule--bot { margin-top: clamp(1.5rem, 4vw, 2rem); }

.intro-kicker {
    font-family: var(--fb);
    font-size: clamp(10px, 2.4vw, 11px);
    letter-spacing: .32em;
    text-transform: uppercase;
    color: rgba(255,255,255,.58);
    font-weight: 500;
    line-height: 1.65;
    margin-bottom: 1.25rem;
    max-width: 22rem;
    margin-left: auto;
    margin-right: auto;
}

.intro-monogram {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    gap: 0.28em;
    margin: 0 auto 1.35rem;
    font-family: var(--logo);
    font-size: clamp(1.35rem, 4.2vw, 1.75rem);
    font-weight: 500;
    font-style: italic;
    color: var(--sky);
    letter-spacing: 0.06em;
    line-height: 1;
}
.intro-m { flex-shrink: 0; }
.intro-m-amp {
    flex-shrink: 0;
    font-family: var(--ft);
    font-size: 0.78em;
    font-style: italic;
    opacity: 0.85;
    font-weight: 400;
    margin: 0 0.02em;
}

.intro-title {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: baseline;
    gap: 0.25em 0.55em;
    font-family: var(--script);
    font-weight: 400;
    font-size: clamp(2.5rem, 10vw, 3.85rem);
    color: #fff;
    line-height: 1.05;
    letter-spacing: 0.02em;
    margin-bottom: 1rem;
    text-shadow: 0 2px 40px rgba(0,0,0,.2);
}
.intro-title-name {
    white-space: nowrap;
}
.intro-title-amp {
    font-family: var(--ft);
    font-size: 0.42em;
    font-style: italic;
    color: var(--sky);
    opacity: 0.95;
}

.intro-date {
    font-family: var(--fb);
    font-size: 0.8125rem;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: rgba(255,255,255,.48);
    font-weight: 400;
    margin-bottom: 1.85rem;
}

.intro-cta {
    display: inline-block;
    position: relative;
    margin: 0;
    padding: 0.85rem 0 0.35rem;
    font-family: var(--fb);
    font-size: 11px;
    letter-spacing: .28em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--sky);
    background: none;
    border: none;
    cursor: pointer;
    transition: color 0.4s var(--ease-soft), letter-spacing 0.5s var(--ease-soft);
}
.intro-cta::after {
    content: '';
    position: absolute;
    left: 0; right: 0; bottom: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--sky), transparent);
    opacity: 0.6;
    transform: scaleX(1);
    transition: opacity 0.35s, transform 0.45s var(--ease-out);
}
.intro-cta:hover {
    color: #fff;
    letter-spacing: 0.32em;
}
.intro-cta:hover::after {
    opacity: 1;
    transform: scaleX(1.08);
}
.intro-cta:active {
    opacity: 0.85;
}

@media (prefers-reduced-motion: reduce) {
    .intro-bg { animation: none; }
}

/* Si GSAP ne charge pas — un seul fondu + léger glissement */
.intro-overlay.intro-fallback .intro-inner {
    animation: introFallbackIn 1.05s cubic-bezier(.22, 1, .36, 1) backwards;
}
@keyframes introFallbackIn {
    from { opacity: 0; transform: translateY(14px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ═══════════════════════════════════════════════════
   NAV
   ═══════════════════════════════════════════════════ */
.nav {
    position: fixed; top: 0; left: 0; right: 0; z-index: 1000;
    height: 72px; padding: 0 48px;
    display: flex; align-items: center; justify-content: space-between;
    transition: height .5s var(--ease-out), background .5s var(--ease-soft), box-shadow .5s var(--ease-soft);
}
.nav.scrolled {
    height: 64px;
    background: rgba(250,250,247,.94);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    box-shadow: 0 4px 32px rgba(44,62,80,.06), 0 1px 0 rgba(168,200,224,.18);
}
.nav-brand {
    font-family: var(--logo);
    font-size: 22px; font-weight: 500; font-style: italic;
    color: #fff; letter-spacing: .02em;
    transition: color .5s var(--ease-soft), transform .45s var(--ease-out);
}
.nav.scrolled .nav-brand { color: var(--dark); }
.nav.scrolled .nav-brand:hover { transform: translateY(-1px); }
.nav-links { display: flex; gap: 36px; }
.nav-links a {
    font-size: 11px; letter-spacing: 2.5px;
    text-transform: uppercase; font-weight: 500;
    color: rgba(255,255,255,.65);
    text-decoration: none;
    transition: color .35s var(--ease-soft), transform .35s var(--ease-out);
    position: relative;
}
.nav-links a::after {
    content: ''; position: absolute; bottom: -5px; left: 0; right: 0;
    height: 2px; background: linear-gradient(90deg, transparent, var(--sky), transparent);
    transform: scaleX(0); transform-origin: center;
    transition: transform .45s var(--ease-out);
    border-radius: 2px;
    opacity: .95;
}
.nav-links a:hover { transform: translateY(-1px); }
.nav-links a:hover::after { transform: scaleX(1); }
.nav.scrolled .nav-links a { color: var(--muted); }
.nav-links a:hover { color: var(--sky) !important; }

.nav-toggle {
    display: none; flex-direction: column; gap: 5px;
    background: none; border: none; cursor: pointer; padding: 8px; z-index: 1001;
}
.nav-toggle span {
    display: block; width: 22px; height: 1.5px;
    background: rgba(255,255,255,.7);
    transition: all .3s var(--ease);
}
.nav.scrolled .nav-toggle span { background: var(--dark); }
.nav-toggle.open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.nav-toggle.open span:nth-child(2) { opacity: 0; }
.nav-toggle.open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

/* ═══════════════════════════════════════════════════
   HERO
   ═══════════════════════════════════════════════════ */
.hero {
    position: relative;
    height: 100vh; height: 100dvh;
    min-height: 680px;
    display: flex; align-items: center; justify-content: center;
    overflow: hidden;
}
.hero-bg {
    position: absolute; inset: -40px;
    background:
        radial-gradient(ellipse 90% 70% at 50% 20%, rgba(168,200,224,.14), transparent 55%),
        radial-gradient(ellipse 60% 50% at 90% 90%, rgba(123,158,196,.1), transparent 45%),
        linear-gradient(145deg, var(--dark) 0%, #1a252f 42%, #121920 100%);
    background-size: 140% 140%;
    background-position: 50% 50%;
    will-change: transform;
    transition: transform .15s linear;
}
@media (prefers-reduced-motion: no-preference) {
    .hero-bg {
        animation: heroBreathe 18s ease-in-out infinite alternate;
    }
}
@keyframes heroBreathe {
    0%   { background-position: 48% 45%; background-size: 135% 135%; }
    100% { background-position: 52% 55%; background-size: 145% 145%; }
}
.hero-overlay {
    position: absolute; inset: 0;
    background:
        radial-gradient(ellipse at 50% 35%, rgba(168,200,224,.12), transparent 58%),
        linear-gradient(to bottom, rgba(0,0,0,.08) 0%, transparent 35%, rgba(0,0,0,.42) 100%);
    pointer-events: none;
}
.hero-particles {
    position: absolute; inset: 0; pointer-events: none; overflow: hidden;
}
.hero-particle {
    position: absolute; border-radius: 50%;
    background: radial-gradient(circle, rgba(255,255,255,.8), rgba(168,200,224,.2));
    opacity: 0;
    animation: pFloat var(--dur) linear infinite;
}
@keyframes pFloat {
    0%   { transform: translateY(20px) scale(.5); opacity: 0; }
    10%  { opacity: var(--op); }
    90%  { opacity: var(--op); }
    100% { transform: translateY(-110vh) scale(1.1); opacity: 0; }
}

.hero-content { position: relative; z-index: 2; text-align: center; padding: 0 20px; max-width: 900px; }
.hero-label {
    font-size: 12px; letter-spacing: .5em; text-transform: uppercase;
    color: var(--sky); font-weight: 500; margin-bottom: 24px;
    text-shadow: 0 2px 24px rgba(168,200,224,.25);
}
.hero-ornament { display: flex; align-items: center; justify-content: center; gap: 18px; margin-bottom: 24px; }
.orn-line { width: 70px; height: 1px; background: linear-gradient(90deg, transparent, var(--sky)); }
.orn-line.right { background: linear-gradient(270deg, transparent, var(--sky)); }
.orn-diamond {
    width: 6px; height: 6px; background: var(--sky);
    transform: rotate(45deg); box-shadow: 0 0 16px rgba(168,200,224,.3);
}
.hero-names {
    font-family: var(--ft);
    font-size: clamp(52px, 12vw, 110px);
    font-weight: 400; color: #fff;
    line-height: .95; letter-spacing: -.02em;
    margin-bottom: 28px;
    text-shadow: 0 4px 40px rgba(0,0,0,.25), 0 0 80px rgba(168,200,224,.08);
}
.hero-name { display: inline-block; }
.hero-amp {
    display: block; font-family: var(--script);
    font-size: .35em; color: var(--sky);
    line-height: 2;
    filter: drop-shadow(0 2px 12px rgba(168,200,224,.35));
}
.hero-date {
    display: inline-flex; align-items: center; gap: 12px;
    font-size: 14px; letter-spacing: .25em; text-transform: uppercase;
    color: rgba(255,255,255,.8); font-weight: 400;
    margin-bottom: 40px;
}
.hero-date i { color: var(--sky); font-size: 14px; }

.countdown { display: flex; gap: 12px; justify-content: center; margin-bottom: 44px; }
.cd-item {
    display: flex; flex-direction: column; align-items: center;
    min-width: 76px; padding: 18px 14px;
    background: rgba(255,255,255,.07);
    border: 1px solid rgba(255,255,255,.1);
    backdrop-filter: blur(16px);
    border-radius: 16px;
    transition: transform var(--dur-slow) var(--ease-out), border-color .4s, background .4s;
}
.cd-item:hover {
    transform: translateY(-2px);
    border-color: rgba(168,200,224,.22);
    background: rgba(255,255,255,.09);
}
.cd-num {
    font-family: var(--ft); font-size: 40px; font-weight: 500;
    color: #fff; line-height: 1;
}
.cd-lbl {
    font-size: 9px; letter-spacing: .3em; text-transform: uppercase;
    color: var(--sky); margin-top: 6px; font-weight: 500;
}

.hero-actions { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }

.scroll-down {
    position: absolute; bottom: 28px; left: 50%; transform: translateX(-50%);
    z-index: 2; display: flex; flex-direction: column; align-items: center; gap: 8px;
    text-decoration: none; color: rgba(255,255,255,.45);
    font-size: 9px; letter-spacing: .3em; text-transform: uppercase;
    transition: color .45s var(--ease-soft), transform .45s var(--ease-out);
}
.scroll-down:hover {
    color: rgba(255,255,255,.75);
    transform: translateX(-50%) translateY(2px);
}
.scroll-down i {
    font-size: 16px; color: var(--sky); opacity: .75;
    transition: transform .5s var(--ease-out), opacity .45s;
}
.scroll-down:hover i { opacity: 1; }
@media (prefers-reduced-motion: no-preference) {
    .scroll-down i {
        animation: scrollChevron 2.2s ease-in-out infinite;
    }
    .scroll-down:hover i { animation-play-state: paused; }
}
@keyframes scrollChevron {
    0%, 100% { transform: translateY(0); opacity: .65; }
    50%      { transform: translateY(8px); opacity: 1; }
}

/* ═══════════════════════════════════════════════════
   BUTTONS
   ═══════════════════════════════════════════════════ */
.btn {
    display: inline-flex; align-items: center; gap: 8px;
    font-family: var(--fb); font-size: 12px; letter-spacing: .2em;
    text-transform: uppercase; font-weight: 500;
    padding: 16px 36px; border-radius: 999px;
    text-decoration: none; cursor: pointer; border: none;
    transition: transform .45s var(--ease-out), box-shadow .45s var(--ease-out), filter .45s, background .45s, border-color .45s;
}
.btn-primary {
    background: linear-gradient(135deg, var(--sky) 0%, var(--sky-d) 100%);
    color: var(--dark);
    box-shadow: 0 8px 28px rgba(168,200,224,.3);
}
.btn-primary:hover {
    transform: translateY(-3px) scale(1.02);
    box-shadow: 0 16px 44px rgba(168,200,224,.38);
    filter: brightness(1.05);
}
.btn-primary:active { transform: translateY(-1px) scale(.99); }
.btn-outline {
    background: transparent; color: #fff;
    border: 1px solid rgba(255,255,255,.22);
}
.btn-outline:hover {
    background: rgba(255,255,255,.1);
    border-color: rgba(255,255,255,.38);
    transform: translateY(-2px);
}
.btn-sm { padding: 10px 20px; font-size: 9px; letter-spacing: .2em; }
.btn-full { width: 100%; justify-content: center; }

/* ═══════════════════════════════════════════════════
   SECTIONS
   ═══════════════════════════════════════════════════ */
.section { padding: 140px 0; position: relative; }
.section-alt {
    background:
        radial-gradient(ellipse 80% 50% at 10% 0%, rgba(168,200,224,.08), transparent 50%),
        radial-gradient(ellipse 60% 40% at 100% 100%, rgba(232,223,210,.6), transparent 45%),
        linear-gradient(180deg, var(--beige) 0%, var(--white) 48%, var(--beige-d) 100%);
}
.section-dark {
    background:
        radial-gradient(ellipse 100% 60% at 50% 0%, rgba(168,200,224,.1), transparent 55%),
        linear-gradient(175deg, var(--dark) 0%, #243445 50%, #1a2530 100%);
    color: #fff;
}
.container { max-width: 1060px; margin: 0 auto; padding: 0 32px; }

.section-head { text-align: center; margin-bottom: 64px; }
.section-orn { display: flex; align-items: center; justify-content: center; gap: 14px; margin-bottom: 16px; }
.s-line { width: 40px; height: 1px; background: linear-gradient(90deg, transparent, var(--sky)); }
.s-line:last-child { background: linear-gradient(270deg, transparent, var(--sky)); }
.section-orn i { color: var(--sky); font-size: 10px; }
.section-label {
    font-size: 11px; letter-spacing: 5px; text-transform: uppercase;
    color: var(--sky-d); font-weight: 500; display: block; margin-bottom: 14px;
}
.section-dark .section-label { color: var(--sky); }
.section-title {
    font-family: var(--ft); font-size: clamp(36px, 5.5vw, 60px);
    font-weight: 500; line-height: 1.1; letter-spacing: -.01em;
}
.section-dark .section-title { color: #fff; }
.section-sub {
    font-size: 16px; color: rgba(255,255,255,.55); font-weight: 400;
    max-width: 520px; margin: 16px auto 0; line-height: 1.8;
}

/* STORY */
.story { max-width: 680px; margin: 0 auto; text-align: center; }
.story-quote {
    font-family: var(--ft); font-size: 26px; font-style: italic;
    font-weight: 400; color: var(--sky-d); line-height: 1.6;
    margin-bottom: 28px;
}
.story-text { font-size: 17px; line-height: 2; color: var(--text); font-weight: 400; }

/* GALLERY */
.gallery {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 8px;
}
.gallery-item {
    position: relative; overflow: hidden; border-radius: 14px;
    aspect-ratio: 1; background: var(--beige-d);
    box-shadow: 0 4px 24px rgba(44,62,80,.06);
    transition: box-shadow .55s var(--ease-out), transform .55s var(--ease-out);
}
.gallery-item:hover {
    box-shadow: 0 16px 48px rgba(44,62,80,.12);
    transform: translateY(-4px);
}
.gallery-item img {
    width: 100%; height: 100%; object-fit: cover; display: block;
    transition: transform .85s var(--ease-soft);
}
.gallery-item:hover img { transform: scale(1.07); }
.gallery-caption {
    position: absolute; bottom: 0; left: 0; right: 0;
    padding: 16px; background: linear-gradient(transparent, rgba(0,0,0,.65));
    font-family: var(--ft); font-size: 14px; color: #fff; font-style: italic;
    opacity: 0; transform: translateY(12px);
    transition: opacity .45s var(--ease-soft), transform .45s var(--ease-out);
}
.gallery-item:hover .gallery-caption { opacity: 1; transform: translateY(0); }
.gallery-placeholder {
    width: 100%; height: 100%;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 8px; color: var(--muted); font-size: 13px;
}
.gallery-placeholder i { font-size: 36px; opacity: .3; }

/* INFO GRID — En un coup d’œil */
.info-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
}
@media (max-width: 900px) {
    .info-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 14px;
    }
}
.info-card {
    text-align: center;
    padding: 44px 24px;
    background: #fff;
    border: 1px solid rgba(168,200,224,.1);
    border-radius: 12px;
    transition: border-color .35s var(--ease-soft), box-shadow .35s var(--ease-soft);
    position: relative;
    min-width: 0;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.info-card::after {
    content: ''; position: absolute; bottom: 0; left: 20%; right: 20%;
    height: 2px; background: linear-gradient(90deg, transparent, var(--sky), transparent);
    opacity: 0; transition: opacity .4s;
}
@media (hover: hover) and (pointer: fine) {
    .info-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 12px 32px rgba(44,62,80,.08);
    }
}
.info-card:hover::after { opacity: 1; }
.info-card i { font-size: 24px; color: var(--sky-d); display: block; margin-bottom: 20px; }
.info-card .info-label {
    font-size: 11px; letter-spacing: 2px; text-transform: uppercase;
    color: var(--muted); display: block; margin-bottom: 10px; font-weight: 500;
}
.info-card strong {
    font-family: var(--ft);
    font-size: 20px;
    font-weight: 600;
    color: var(--dark);
    line-height: 1.35;
    display: block;
    word-break: break-word;
    overflow-wrap: break-word;
    hyphens: auto;
}

/* TIMELINE — Le fil de la journée */
.timeline {
    max-width: 680px;
    margin: 0 auto;
    position: relative;
    padding: 8px 0 0;
}
.timeline::before {
    content: '';
    position: absolute;
    left: 18px;
    top: 8px;
    bottom: 8px;
    width: 3px;
    margin-left: -1px;
    background: linear-gradient(
        180deg,
        rgba(168,200,224,.15) 0%,
        var(--sky-d) 12%,
        var(--sky) 50%,
        var(--sky-d) 88%,
        rgba(168,200,224,.15) 100%
    );
    border-radius: 3px;
    opacity: .85;
}
.tl-item {
    position: relative;
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 16px 22px;
    align-items: start;
    margin-bottom: 22px;
}
.tl-item:last-child { margin-bottom: 0; }
.tl-dot {
    position: relative;
    left: auto;
    top: 14px;
    width: 15px;
    height: 15px;
    margin: 0 auto;
    border-radius: 50%;
    background: #fff;
    border: 3px solid var(--sky-d);
    box-shadow:
        0 0 0 4px var(--beige),
        0 2px 12px rgba(123,158,196,.35);
    flex-shrink: 0;
    z-index: 1;
}
.tl-content {
    background: #fff;
    border-radius: 16px;
    padding: 20px 22px 22px;
    border: 1px solid rgba(168,200,224,.18);
    box-shadow: 0 6px 28px rgba(44,62,80,.06);
    transition: transform .45s var(--ease-out), box-shadow .45s var(--ease-out);
}
.tl-item:hover .tl-content {
    transform: translateX(6px);
    box-shadow: 0 14px 40px rgba(123,158,196,.14);
}
.tl-time {
    display: inline-block;
    font-size: 10px;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: var(--dark);
    font-weight: 600;
    margin-bottom: 12px;
    padding: 8px 14px;
    border-radius: 999px;
    background: linear-gradient(135deg, rgba(168,200,224,.22), rgba(123,158,196,.14));
    border: 1px solid rgba(168,200,224,.25);
}
.tl-content h3 {
    font-family: var(--ft);
    font-size: clamp(1.2rem, 3.5vw, 1.6rem);
    font-weight: 600;
    color: var(--dark);
    margin-bottom: 8px;
    line-height: 1.25;
}
.tl-content p {
    font-size: 15px;
    color: var(--muted);
    line-height: 1.75;
    font-weight: 400;
    margin: 0;
}
.timeline-empty {
    text-align: center;
    color: var(--muted);
    font-size: 16px;
    padding: 32px 16px;
    max-width: 480px;
    margin: 0 auto;
}
@media (max-width: 480px) {
    .timeline::before { left: 14px; }
    .tl-item {
        grid-template-columns: 32px minmax(0, 1fr);
        gap: 12px 14px;
    }
    .tl-dot { width: 12px; height: 12px; top: 12px; border-width: 2px; box-shadow: 0 0 0 3px var(--beige), 0 2px 8px rgba(123,158,196,.25); }
    .tl-content { padding: 16px 18px 18px; border-radius: 14px; }
    .tl-item:hover .tl-content { transform: none; }
}

/* VENUES */
.venues { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 28px; }
.venue-card {
    background: #fff; border-radius: 16px; overflow: hidden;
    border: 1px solid rgba(168,200,224,.1);
    box-shadow: 0 4px 24px rgba(0,0,0,.04);
    transition: transform .5s var(--ease), box-shadow .5s var(--ease);
}
.venue-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 16px 48px rgba(0,0,0,.08);
}

.venue-visual {
    position: relative; aspect-ratio: 16/10; overflow: hidden;
    background: linear-gradient(135deg, var(--beige), var(--beige-d));
}
.venue-visual img {
    width: 100%; height: 100%; object-fit: cover; display: block;
    transition: transform .7s var(--ease);
}
.venue-card:hover .venue-visual img { transform: scale(1.06); }
.venue-visual-empty {
    display: flex; align-items: center; justify-content: center;
}
.venue-visual-empty > i {
    font-size: 48px; color: var(--sky-d); opacity: .3;
}
.venue-badge {
    position: absolute; top: 16px; left: 16px;
    background: var(--sky-d); color: #fff;
    font-size: 9px; letter-spacing: .2em; text-transform: uppercase; font-weight: 500;
    padding: 6px 14px; border-radius: 999px;
    box-shadow: 0 4px 12px rgba(123,158,196,.3);
}

.venue-body { padding: 28px; }
.venue-body h3 {
    font-family: var(--ft); font-size: 26px; font-weight: 600;
    color: var(--dark); margin-bottom: 10px; line-height: 1.2;
}
.venue-address {
    display: flex; align-items: flex-start; gap: 6px;
    font-size: 14px; color: var(--muted); line-height: 1.6; font-weight: 400;
    margin-bottom: 20px;
}
.venue-address i { color: var(--sky-d); margin-top: 3px; flex-shrink: 0; }

.venue-links {
    display: flex; gap: 8px; flex-wrap: wrap;
}
.venue-link {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 10px 18px; border-radius: 999px;
    font-size: 12px; font-weight: 500; letter-spacing: .04em;
    text-decoration: none;
    transition: all .3s var(--ease);
    border: 1px solid transparent;
}
.venue-link i { font-size: 13px; }
.venue-link--gmaps {
    background: rgba(66,133,244,.08); color: #4285F4;
    border-color: rgba(66,133,244,.15);
}
.venue-link--gmaps:hover { background: rgba(66,133,244,.15); }
.venue-link--waze {
    background: rgba(51,205,255,.06); color: #33CDFF;
    border-color: rgba(51,205,255,.15);
}
.venue-link--waze:hover { background: rgba(51,205,255,.15); }
.venue-link--apple {
    background: rgba(0,0,0,.04); color: #555;
    border-color: rgba(0,0,0,.08);
}
.venue-link--apple:hover { background: rgba(0,0,0,.08); }
.venue-link--site {
    background: rgba(106,175,123,.1); color: #4a8f5c;
    border-color: rgba(106,175,123,.22);
}
.venue-link--site:hover { background: rgba(106,175,123,.18); }

/* AMBIANCE PHOTOS */
.ambiance-photos {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 16px; margin-bottom: 56px;
}
.ambiance-photo {
    position: relative; border-radius: 12px; overflow: hidden;
    aspect-ratio: 4/3;
    box-shadow: 0 8px 32px rgba(0,0,0,.25);
}
.ambiance-photo img {
    width: 100%; height: 100%; object-fit: cover; display: block;
    transition: transform .7s var(--ease);
}
.ambiance-photo:hover img { transform: scale(1.05); }
.ambiance-caption {
    position: absolute; bottom: 0; left: 0; right: 0;
    padding: 20px 24px; font-family: var(--ft);
    font-size: 15px; font-style: italic; color: #fff;
    background: linear-gradient(transparent, rgba(0,0,0,.55));
}

/* PALETTE */
.palette-section {
    text-align: center; margin-bottom: 56px;
}
.palette-label {
    font-size: 10px; letter-spacing: .4em; text-transform: uppercase;
    color: var(--sky); margin-bottom: 24px; font-weight: 400;
}
.palette-row {
    display: flex; justify-content: center; gap: 16px; flex-wrap: wrap;
}
.palette-swatch {
    display: flex; flex-direction: column; align-items: center; gap: 10px;
}
.palette-color {
    width: 64px; height: 64px; border-radius: 50%;
    border: 3px solid rgba(255,255,255,.15);
    box-shadow: 0 4px 16px rgba(0,0,0,.2);
    transition: transform .3s var(--ease), box-shadow .3s;
}
.palette-swatch:hover .palette-color {
    transform: scale(1.12);
    box-shadow: 0 8px 28px rgba(0,0,0,.3);
}
.palette-name {
    font-size: 10px; letter-spacing: .1em;
    color: rgba(255,255,255,.45); font-weight: 300;
}

/* DRESS CODE */
.dress-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.dress-card {
    text-align: center; padding: 40px 24px;
    background: rgba(255,255,255,.05);
    border: 1px solid rgba(168,200,224,.12);
    border-radius: 4px; transition: all .4s var(--ease);
}
.dress-card:hover { border-color: rgba(168,200,224,.3); transform: translateY(-2px); }
.dress-icon { font-size: 28px; color: var(--sky); margin-bottom: 16px; }
.dress-card h3 { font-family: var(--ft); font-size: 24px; font-weight: 600; margin-bottom: 10px; }
.dress-card p { font-size: 15px; color: rgba(255,255,255,.6); line-height: 1.6; font-weight: 400; }
.dress-avoid { border-color: rgba(217,107,107,.25); }
.dress-avoid .dress-icon { color: var(--red); }

/* RULES */
.rules-list { max-width: 600px; margin: 0 auto; }
.rule-item {
    display: flex; align-items: center; gap: 16px;
    padding: 20px 28px; margin-bottom: 8px;
    background: #fff; border-radius: 8px;
    border: 1px solid rgba(168,200,224,.08);
    font-size: 16px; font-weight: 400; transition: transform .3s var(--ease);
}
.rule-item:hover { transform: translateX(4px); }
.rule-item i { font-size: 20px; flex-shrink: 0; }
.rule-ok i { color: var(--green); }
.rule-warn i { color: var(--red); }
.rule-info i { color: var(--sky-d); }

/* RSVP FORM */
.rsvp-form {
    max-width: 560px; margin: 0 auto;
    background: linear-gradient(165deg, rgba(255,255,255,.07) 0%, rgba(255,255,255,.03) 100%);
    border: 1px solid rgba(168,200,224,.16);
    border-radius: 20px; padding: 52px;
    backdrop-filter: blur(18px);
    box-shadow: 0 24px 64px rgba(0,0,0,.15);
    transition: border-color .5s var(--ease-soft), box-shadow .5s var(--ease-soft);
}
.rsvp-form:focus-within {
    border-color: rgba(168,200,224,.28);
    box-shadow: 0 28px 72px rgba(0,0,0,.18), 0 0 0 1px rgba(168,200,224,.1);
}
.rsvp-redirect-hint {
    max-width: 560px; margin: 24px auto 0; padding: 0 12px;
    text-align: center; font-size: 13px; line-height: 1.6;
    color: rgba(255,255,255,.36); font-weight: 400;
}
.rsvp-privacy-note {
    max-width: 560px; margin: 16px auto 0; padding: 0 12px;
    text-align: center; font-size: 12px; line-height: 1.55;
    color: rgba(255,255,255,.32); font-weight: 400;
}
.form-group .label-hint {
    text-transform: none; letter-spacing: 0; font-size: 11px;
    font-weight: 400; opacity: .55;
}
.form-group { margin-bottom: 24px; }
.form-group label {
    display: block; font-size: 11px; letter-spacing: 2px; text-transform: uppercase;
    font-weight: 500; margin-bottom: 10px; color: rgba(255,255,255,.8);
}
.form-group input,
.form-group textarea {
    width: 100%; padding: 14px 18px;
    background: rgba(255,255,255,.05);
    border: 1px solid rgba(168,200,224,.15);
    color: #fff; font-family: var(--fb); font-size: 14px; font-weight: 300;
    border-radius: 4px; outline: none;
    transition: border-color .3s, box-shadow .3s;
}
.form-group input:focus,
.form-group textarea:focus {
    border-color: var(--sky);
    box-shadow: 0 0 0 3px rgba(168,200,224,.08);
}
.form-group input::placeholder,
.form-group textarea::placeholder { color: rgba(255,255,255,.2); }
textarea { resize: vertical; }

.status-group { display: flex; gap: 8px; }
.status-btn {
    flex: 1; padding: 14px 8px; cursor: pointer;
    background: rgba(255,255,255,.04);
    border: 1px solid rgba(168,200,224,.1);
    display: flex; flex-direction: column; align-items: center; gap: 6px;
    font-family: var(--fb); font-size: 10px; letter-spacing: 1px;
    text-transform: uppercase; color: rgba(255,255,255,.4);
    border-radius: 4px; transition: all .3s var(--ease);
}
.status-btn i { font-size: 20px; }
.status-btn:hover { border-color: rgba(168,200,224,.3); background: rgba(168,200,224,.04); }
.status-btn.active-accepted { border-color: var(--green); background: rgba(106,175,123,.1); color: var(--green); }
.status-btn.active-maybe { border-color: var(--amber); background: rgba(212,168,83,.1); color: var(--amber); }
.status-btn.active-declined { border-color: var(--red); background: rgba(217,107,107,.1); color: var(--red); }

.alert {
    padding: 14px 18px; border-radius: 4px; margin-bottom: 20px;
    font-size: 13px; font-weight: 400;
}
.alert-ok { background: rgba(106,175,123,.12); border: 1px solid rgba(106,175,123,.25); color: var(--green); }
.alert-err { background: rgba(217,107,107,.12); border: 1px solid rgba(217,107,107,.25); color: var(--red); }

/* INVITATION MODALE (lien ?invite=CODE) */
.invite-fab {
    position: fixed;
    bottom: 22px;
    right: 22px;
    z-index: 950;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 14px 22px;
    font-family: var(--fb);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--dark);
    background: linear-gradient(135deg, var(--sky), var(--sky-d));
    border: none;
    border-radius: 999px;
    cursor: pointer;
    box-shadow: 0 8px 32px rgba(123,158,196,.45);
    transition: transform .35s var(--ease-out), box-shadow .35s;
}
.invite-fab:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 40px rgba(123,158,196,.5);
}
.invite-fab i { font-size: 1.15rem; }
@media (max-width: 480px) {
    .invite-fab {
        left: 16px;
        right: 16px;
        bottom: 16px;
        justify-content: center;
        padding: 14px 18px;
    }
}

.invite-modal { position: fixed; inset: 0; z-index: 960; display: flex; align-items: center; justify-content: center; padding: 20px; }
.invite-modal[hidden] { display: none !important; }
.invite-modal__sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
.invite-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(20, 28, 36, .55);
    backdrop-filter: blur(6px);
}
.invite-modal__panel {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 440px;
    max-height: min(92vh, 860px);
    overflow: auto;
    border-radius: 6px;
    box-shadow: 0 28px 80px rgba(0,0,0,.35);
}
.invite-modal__close {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 3;
    width: 40px;
    height: 40px;
    border: none;
    border-radius: 50%;
    background: rgba(255,255,255,.92);
    color: var(--dark);
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
    box-shadow: 0 4px 16px rgba(0,0,0,.12);
    transition: background .25s, transform .25s;
}
.invite-modal__close:hover { background: #fff; transform: scale(1.05); }
.invite-modal__inner {
    --imc-paper: #faf7f1;
    --imc-ink: #2a2420;
    --imc-ink-soft: #4a433c;
    --imc-gold: #b8a88a;
    position: relative;
    padding: 48px 32px 40px;
    background: linear-gradient(165deg, var(--imc-paper) 0%, #f0ebe3 100%);
    color: var(--imc-ink);
    border: 1px solid var(--imc-gold);
    box-shadow: 0 0 0 3px #e8e0d4, inset 0 1px 0 rgba(255,255,255,.6);
}
.invite-modal__inner::before {
    content: '';
    position: absolute;
    inset: 14px;
    border: 1px solid rgba(184, 168, 138, .45);
    border-radius: 2px;
    pointer-events: none;
}
.imc-deco {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    font-family: var(--script);
    font-size: 26px;
    color: var(--sky-d);
    opacity: .85;
    pointer-events: none;
}
.imc-deco--top { top: 8px; }
.imc-deco--bot { bottom: 8px; transform: translateX(-50%) rotate(180deg); }
.imc-mono {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    flex-wrap: nowrap;
    margin: 12px auto 24px;
    padding: 8px 20px;
    border-radius: 999px;
    background: #fff;
    border: 2px solid var(--sky-d);
    font-family: var(--logo);
    font-size: 1.3rem;
    font-style: italic;
    font-weight: 600;
    color: var(--sky-d);
}
.imc-mono-amp { font-family: var(--ft); font-size: 1rem; font-style: italic; color: var(--imc-ink-soft); }
.imc-cordial {
    position: relative;
    z-index: 1;
    text-align: center;
    font-size: clamp(0.75rem, 2.5vw, 0.9rem);
    font-weight: 600;
    letter-spacing: .16em;
    text-transform: uppercase;
    margin-bottom: 6px;
}
.imc-sub {
    text-align: center;
    font-family: var(--ft);
    font-style: italic;
    color: var(--imc-ink-soft);
    margin-bottom: 12px;
    font-size: 1rem;
}
.imc-for {
    text-align: center;
    font-family: var(--logo);
    font-size: 1.45rem;
    font-style: italic;
    font-weight: 600;
    margin-bottom: 18px;
}
.imc-orn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    margin-bottom: 16px;
}
.imc-line { width: 44px; height: 1px; background: linear-gradient(90deg, transparent, var(--imc-gold), transparent); }
.imc-orn i { color: var(--sky-d); font-size: 9px; }
.imc-names { text-align: center; margin-bottom: 8px; }
.imc-name-script {
    font-family: var(--script);
    font-size: clamp(2.2rem, 8vw, 3rem);
    line-height: 1.05;
}
.imc-names-et {
    display: block;
    font-family: var(--ft);
    font-size: 1.25rem;
    font-style: italic;
    color: var(--sky-d);
    margin: 4px 0;
}
.imc-dateline {
    text-align: center;
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    margin-top: 10px;
}
.imc-dateline i { color: var(--sky-d); margin-right: 6px; }
.imc-time { text-align: center; font-size: 0.85rem; color: var(--imc-ink-soft); margin-bottom: 22px; }
.imc-details { display: flex; flex-direction: column; gap: 10px; margin-bottom: 22px; text-align: left; }
.imc-detail {
    display: flex;
    gap: 12px;
    padding: 12px 14px;
    background: rgba(255,255,255,.75);
    border: 1px solid rgba(184, 168, 138, .35);
    border-radius: 8px;
}
.imc-detail i { color: var(--sky-d); margin-top: 2px; flex-shrink: 0; }
.imc-detail-label {
    font-size: 0.6rem;
    letter-spacing: .18em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--imc-ink-soft);
    margin-bottom: 4px;
}
.imc-detail-val { font-size: 0.88rem; font-weight: 500; line-height: 1.4; }
.imc-detail-addr { display: block; font-size: 0.78rem; color: var(--imc-ink-soft); margin-top: 4px; }
.imc-codebox {
    text-align: center;
    padding: 16px;
    border-radius: 8px;
    background: linear-gradient(135deg, rgba(168,200,224,.14), rgba(123,158,196,.1));
    border: 1px solid rgba(123,158,196,.35);
    margin-bottom: 12px;
}
.imc-code-lbl { font-size: 0.6rem; letter-spacing: .2em; text-transform: uppercase; color: var(--imc-ink-soft); margin-bottom: 6px; }
.imc-code { font-family: var(--fb); font-size: 1.2rem; font-weight: 700; letter-spacing: .18em; color: var(--sky-d); }
.imc-foot { text-align: center; font-family: var(--ft); font-style: italic; color: var(--imc-ink-soft); font-size: 0.92rem; }

body.invite-modal-open { overflow: hidden; }

/* FOOTER */
.footer {
    background: linear-gradient(180deg, #1e252d 0%, #1a1f25 45%, #151a20 100%);
    text-align: center; padding: 80px 32px 48px;
    position: relative;
}
.footer::before {
    content: ''; position: absolute; top: 0; left: 20%; right: 20%;
    height: 1px; background: linear-gradient(90deg, transparent, rgba(168,200,224,.15), transparent);
}
.footer-names { font-family: var(--logo); font-size: 36px; font-weight: 500; font-style: italic; color: #fff; margin-bottom: 10px; letter-spacing: .02em; }
.footer-date {
    font-size: 11px; letter-spacing: 4px; text-transform: uppercase;
    color: var(--sky); margin-bottom: 28px; font-weight: 500;
}
.footer-orn { display: flex; align-items: center; justify-content: center; gap: 14px; margin-bottom: 20px; }
.f-line { width: 50px; height: 1px; background: rgba(168,200,224,.15); }
.footer-orn i { color: var(--sky); font-size: 10px; }
.footer-quote {
    font-family: var(--ft); font-size: 17px; font-style: italic;
    color: rgba(255,255,255,.3); margin-bottom: 20px;
}
.footer-credit { font-size: 12px; color: rgba(255,255,255,.15); letter-spacing: 2px; font-weight: 400; }

/* ═══════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════ */
@media (max-width: 768px) {
    .nav { padding: 0 20px; height: 64px; }
    .nav-toggle { display: flex; }
    .nav-links {
        display: none; position: fixed; inset: 0;
        background: rgba(44,62,80,.97); backdrop-filter: blur(20px);
        flex-direction: column; align-items: center; justify-content: center;
        gap: 28px; z-index: 1000;
    }
    .nav-links.open { display: flex; }
    .nav-links a { font-size: 12px !important; letter-spacing: 4px !important; color: rgba(255,255,255,.6) !important; }
    .section { padding: 100px 0; }
    .container { padding: 0 20px; }
    .info-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
    }
    .info-card {
        padding: 22px 14px 24px;
        border-radius: 14px;
    }
    .info-card i {
        font-size: 22px;
        margin-bottom: 12px;
    }
    .info-card .info-label {
        font-size: 10px;
        letter-spacing: 1.6px;
        margin-bottom: 8px;
    }
    .info-card strong {
        font-size: clamp(15px, 3.9vw, 17px);
        font-weight: 600;
        line-height: 1.4;
    }
    .hero-names { font-size: clamp(40px, 14vw, 60px); }
    .countdown { gap: 8px; }
    .cd-item { padding: 14px 10px; min-width: 64px; }
    .cd-num { font-size: 30px; }
    .hero-actions { flex-direction: column; align-items: center; gap: 10px; }
    .btn { width: 100%; max-width: 280px; justify-content: center; padding: 14px 24px; }
    .dress-grid { grid-template-columns: 1fr; }
    .venues { grid-template-columns: 1fr; }
    .venue-links { gap: 6px; }
    .venue-link { padding: 8px 12px; font-size: 10px; }
    .status-group { flex-direction: column; }
    .rsvp-form { padding: 32px 20px; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
    .hero-bg { animation: none !important; }
    .scroll-down i { animation: none !important; }
}