:root {
            /* 🎨 Paleta Old Money / Bridgerton */
            --bridgerton-blue: #A7C7E7;
            --navy:           #1A2C42;
            --gold:           #D4AF37;
            --gold-light:     #F3E5AB;
            --crema:          #FAF7F2;
            --burgundy:       #4A1525; /* Para toques sutiles */
            --texto:          #2A2A2A;
            --blanco:         #FFFFFF;
        }

        *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
        html { scroll-behavior: smooth; }

        body {
            font-family: 'Nunito', sans-serif;
            background: var(--bridgerton-blue);
            color: var(--texto);
            overflow-x: hidden;
        }

        h1, h2, h3, h4 { font-family: 'Cormorant Garamond', serif; font-weight: 400; color: var(--navy); }
        .gossip-script { font-family: 'Great Vibes', cursive; color: var(--gold); }

        /* ════ EFECTOS GLOBALES ════ */
        #flash { position:fixed;inset:0;background:var(--blanco);opacity:0;pointer-events:none;z-index:10001;transition:opacity .8s ease; }
        
        .floating-icon { position: absolute; opacity: 0.2; pointer-events: none; z-index: 1;}
        .floating-bee { top:25vh; left:10vw; width:35px; animation:float-bee 6s infinite; }
        .floating-quill { top:70vh; right:12vw; width:45px; animation:float-quill 8s infinite; }
        @keyframes float-bee { 0%,100%{transform:translate(0,0) rotate(0deg)} 50%{transform:translate(10px,10px) rotate(10deg)} }
        @keyframes float-quill { 0%,100%{transform:translate(0,0) rotate(0deg)} 50%{transform:translate(-10px,-10px) rotate(-10deg)} }

        /* ════════════════════════════════════════════════════
           MODAL INICIO — TEATRO BRIDGERTON COMPLETO
        ════════════════════════════════════════════════════ */
        body.no-scroll { overflow: hidden; }

        /* ── Escena de fondo ── */
        #modal-inicio {
            position: fixed; inset: 0; z-index: 9999;
            display: flex; flex-direction: column;
            justify-content: center; align-items: center;
            overflow: hidden;
            background:
                radial-gradient(ellipse 70% 80% at 50% 45%,
                    #1c2a1a 0%, #0d1a0d 50%, #060e06 100%);
            transition: opacity 1.6s cubic-bezier(0.4,0,0.2,1),
                        visibility 1.6s;
        }
        #modal-inicio.cerrado {
            opacity: 0; visibility: hidden; pointer-events: none;
        }

        /* ── Tapiz de fondo animado (damasco) ── */
        #modal-inicio::before {
            content: '';
            position: absolute; inset: -10%;
            background-image:
                url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cpath d='M60 10 C70 30 90 30 80 50 C90 70 70 70 60 90 C50 70 30 70 40 50 C30 30 50 30 60 10Z' fill='none' stroke='%23D4AF37' stroke-width='0.4' opacity='0.12'/%3E%3Ccircle cx='60' cy='50' r='6' fill='none' stroke='%23D4AF37' stroke-width='0.4' opacity='0.1'/%3E%3Cpath d='M10 0 L10 120 M0 10 L120 10' stroke='%23D4AF37' stroke-width='0.15' opacity='0.06'/%3E%3C/svg%3E");
            background-size: 120px 120px;
            animation: tapiz-drift 60s linear infinite;
            opacity: 1;
        }
        @keyframes tapiz-drift {
            0%   { transform: translate(0, 0); }
            100% { transform: translate(120px, 120px); }
        }

        /* ── Viñeta profunda ── */
        #modal-inicio::after {
            content: '';
            position: absolute; inset: 0;
            background: radial-gradient(ellipse 60% 65% at 50% 48%,
                transparent 0%, rgba(4,8,4,0.65) 100%);
            pointer-events: none; z-index: 0;
        }

        /* ── Partículas / Luciérnagas ── */
        .luciernaga {
            position: absolute; border-radius: 50%;
            pointer-events: none; z-index: 1;
            background: radial-gradient(circle, #ffe88a, transparent 70%);
            animation: luciernaga-float linear infinite;
        }
        @keyframes luciernaga-float {
            0%   { transform: translate(0, 0) scale(1);   opacity: 0; }
            15%  { opacity: 1; }
            50%  { transform: translate(var(--dx), var(--dy)) scale(1.3); }
            85%  { opacity: 0.6; }
            100% { transform: translate(var(--dx2),var(--dy2)) scale(0.5); opacity: 0; }
        }

        /* ── Cortinas teatrales ── */
        .cortina {
            position: absolute; top: 0; bottom: 0; width: 18vw;
            z-index: 2; pointer-events: none;
            background: linear-gradient(to bottom,
                #1a0a00 0%, #2d1200 20%, #1a0a00 60%, #0e0600 100%);
            overflow: hidden;
        }
        .cortina::before {
            content: '';
            position: absolute; inset: 0;
            background-image: repeating-linear-gradient(
                180deg,
                transparent 0px, transparent 8px,
                rgba(0,0,0,0.25) 8px, rgba(0,0,0,0.25) 9px
            );
        }
        .cortina::after {
            content: '';
            position: absolute; inset: 0;
            background-image: repeating-linear-gradient(
                0deg,
                transparent 0px, transparent 4px,
                rgba(212,175,55,0.06) 4px, rgba(212,175,55,0.06) 5px
            );
        }
        .cortina-izq {
            left: 0;
            box-shadow: 8px 0 40px rgba(0,0,0,0.8),
                        inset -15px 0 30px rgba(212,175,55,0.05);
            border-right: 1px solid rgba(212,175,55,0.15);
            clip-path: polygon(0 0, 100% 0, 88% 100%, 0 100%);
        }
        .cortina-der {
            right: 0;
            box-shadow: -8px 0 40px rgba(0,0,0,0.8),
                        inset 15px 0 30px rgba(212,175,55,0.05);
            border-left: 1px solid rgba(212,175,55,0.15);
            clip-path: polygon(12% 0, 100% 0, 100% 100%, 0 100%);
        }
        /* Ribete dorado de las cortinas */
        .cortina-izq .ribete,
        .cortina-der .ribete {
            position: absolute; top: 0; bottom: 0; width: 3px;
            background: linear-gradient(to bottom,
                transparent, rgba(212,175,55,0.6) 15%,
                rgba(212,175,55,0.8) 50%,
                rgba(212,175,55,0.6) 85%, transparent);
        }
        .cortina-izq .ribete { right: 0; }
        .cortina-der .ribete { left: 0; }
        /* Borla superior */
        .borla {
            position: absolute; top: 0; width: 100%;
            height: 28px; z-index: 3;
            background: linear-gradient(to bottom, #3d1a00, #1a0800);
            border-bottom: 2px solid rgba(212,175,55,0.4);
        }
        .borla::after {
            content: '';
            position: absolute; bottom: -12px; left: 50%; transform: translateX(-50%);
            width: 14px; height: 14px; border-radius: 50%;
            background: radial-gradient(circle at 40% 35%, #f0d060, #a07820);
            box-shadow: 0 0 12px rgba(212,175,55,0.6);
        }

        /* ── Escena central ── */
        .modal-escena {
            position: relative; z-index: 5;
            display: flex; flex-direction: column;
            align-items: center; gap: 0;
            animation: escena-entrada 1.4s cubic-bezier(0.22,0.61,0.36,1) both;
        }
        @keyframes escena-entrada {
            0%   { opacity: 0; transform: translateY(24px) scale(0.97); }
            100% { opacity: 1; transform: translateY(0) scale(1); }
        }

        /* ── Letrero superior "Lady Whistledown" ── */
        .lw-letrero {
            margin-bottom: 20px; text-align: center;
            animation: escena-entrada 1.4s 0.3s both;
        }
        .lw-letrero-linea {
            display: flex; align-items: center; gap: 14px; margin-bottom: 6px;
        }
        .lw-letrero-linea::before,
        .lw-letrero-linea::after {
            content: '';
            flex: 1; height: 1px; min-width: 30px;
            background: linear-gradient(to right, transparent, rgba(212,175,55,0.5), transparent);
        }
        .lw-letrero-linea span {
            font-family: 'Cormorant Garamond', serif;
            font-size: clamp(0.55em, 1.4vw, 0.72em);
            letter-spacing: 6px; text-transform: uppercase;
            color: rgba(212,175,55,0.75); font-weight: 600;
            white-space: nowrap;
        }
        .lw-letrero-titulo {
            font-family: 'Great Vibes', cursive;
            font-size: clamp(1.6em, 4vw, 2.6em);
            color: rgba(243,229,171,0.9);
            text-shadow: 0 0 30px rgba(212,175,55,0.5), 0 2px 6px rgba(0,0,0,0.5);
            line-height: 1; margin-bottom: 4px;
        }
        .lw-letrero-subtitulo {
            font-family: 'Cormorant Garamond', serif;
            font-size: clamp(0.55em, 1.2vw, 0.65em);
            letter-spacing: 8px; text-transform: uppercase;
            color: rgba(212,175,55,0.45); font-weight: 300;
        }

        /* ════ EL SOBRE ÉPICO ════ */
        .sobre-scene {
            position: relative;
            perspective: 1000px;
            cursor: pointer;
        }

        /* Sombra proyectada del sobre */
        .sobre-sombra {
            position: absolute;
            bottom: -30px; left: 50%; transform: translateX(-50%);
            width: 85%; height: 30px;
            background: radial-gradient(ellipse, rgba(0,0,0,0.7) 0%, transparent 70%);
            filter: blur(8px);
            transition: transform 0.6s ease, opacity 0.6s ease;
        }

        /* Cuerpo principal del sobre */
        .envelope-body {
            position: relative;
            width: clamp(280px, 70vw, 480px);
            height: clamp(185px, 47vw, 320px);
            transform-style: preserve-3d;
            transition: transform 0.4s ease;
        }
        .sobre-scene:hover .envelope-body {
            transform: translateY(-8px) rotateX(2deg);
        }
        .sobre-scene:hover .sobre-sombra {
            transform: translateX(-50%) scaleX(0.85);
            opacity: 0.5;
        }

        /* Cara frontal del sobre */
        .sobre-frente {
            position: absolute; inset: 0;
            border-radius: 3px;
            overflow: hidden;
            box-shadow:
                0 0 0 1px rgba(212,175,55,0.3),
                0 0 0 3px rgba(212,175,55,0.08),
                0 20px 60px rgba(0,0,0,0.6),
                0 4px 12px rgba(0,0,0,0.4);
        }

        /* Textura del sobre */
        .sobre-papel {
            position: absolute; inset: 0;
            background:
                linear-gradient(135deg,
                    #faf3de 0%, #f5e8c0 25%,
                    #fdf6e3 50%, #f0e0a8 75%,
                    #faf3de 100%);
        }
        /* Grano de papel */
        .sobre-papel::after {
            content: '';
            position: absolute; inset: 0;
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)' opacity='0.06'/%3E%3C/svg%3E");
            background-size: 200px 200px;
            opacity: 0.8; mix-blend-mode: multiply;
        }

        /* Bordes doblados del sobre (efecto trapecio inferior) */
        .sobre-doblez-izq {
            position: absolute; bottom: 0; left: 0;
            width: 50%; height: 55%;
            background: linear-gradient(to top right, #e8d48a, #f5e8c0);
            clip-path: polygon(0 100%, 100% 100%, 100% 0);
            border-top: 1px solid rgba(180,140,40,0.4);
        }
        .sobre-doblez-der {
            position: absolute; bottom: 0; right: 0;
            width: 50%; height: 55%;
            background: linear-gradient(to top left, #e0ca78, #f0e0a8);
            clip-path: polygon(0 100%, 100% 100%, 0 0);
            border-top: 1px solid rgba(180,140,40,0.4);
        }

        /* Línea central del sobre (junta de los dobleces) */
        .sobre-junta {
            position: absolute; bottom: 0; left: 50%;
            transform: translateX(-50%);
            width: 1px; height: 55%;
            background: linear-gradient(to top, rgba(160,120,30,0.4), transparent);
        }

        /* Solapa superior (FLAP) */
        .envelope-flap {
            position: absolute; top: 0; left: 0; right: 0;
            height: 60%;
            clip-path: polygon(0 0, 100% 0, 50% 72%);
            transform-origin: top center;
            transform-style: preserve-3d;
            transition: transform 1.1s cubic-bezier(0.4, 0, 0.2, 1);
            z-index: 10;
            backface-visibility: hidden;
        }
        /* Papel de la solapa */
        .envelope-flap::before {
            content: '';
            position: absolute; inset: 0;
            background: linear-gradient(to bottom,
                #f8eecc 0%, #f0e0a0 40%, #e8d080 100%);
            clip-path: inherit;
        }
        /* Línea de pliegue de la solapa */
        .envelope-flap::after {
            content: '';
            position: absolute; bottom: 0; left: 0; right: 0;
            height: 1px;
            background: linear-gradient(to right,
                transparent 0%, rgba(160,120,20,0.5) 20%,
                rgba(160,120,20,0.8) 50%,
                rgba(160,120,20,0.5) 80%, transparent 100%);
        }
        /* Interior de la solapa visible cuando se abre */
        .flap-interior {
            position: absolute; inset: 0;
            clip-path: polygon(0 0, 100% 0, 50% 72%);
            background: linear-gradient(to bottom, #e8d890, #d4c060);
            backface-visibility: hidden;
            transform: rotateX(180deg);
        }

        /* Ornamento lineal del sobre (border decorativo) */
        .sobre-ornamento {
            position: absolute; inset: 10px;
            border: 1px solid rgba(160,120,30,0.35);
            pointer-events: none; z-index: 3;
            border-radius: 2px;
        }
        .sobre-ornamento::before {
            content: '';
            position: absolute; inset: 4px;
            border: 1px dashed rgba(160,120,30,0.2);
        }

        /* Esquinas ornamentales del sobre */
        .sobre-corner {
            position: absolute; width: 20px; height: 20px;
            z-index: 4; pointer-events: none;
        }
        .sobre-corner.tl { top: 6px; left: 6px; }
        .sobre-corner.tr { top: 6px; right: 6px; transform: scaleX(-1); }
        .sobre-corner.bl { bottom: 6px; left: 6px; transform: scaleY(-1); }
        .sobre-corner.br { bottom: 6px; right: 6px; transform: scale(-1); }

        /* Texto en el sobre */
        .sobre-destinatario {
            position: absolute; z-index: 5;
            bottom: 22%; left: 0; right: 0;
            text-align: center; pointer-events: none;
        }
        .sobre-destinatario .dest-linea1 {
            font-family: 'Cormorant Garamond', serif;
            font-size: clamp(0.55em, 1.3vw, 0.75em);
            color: rgba(100,75,20,0.6);
            letter-spacing: 3px; text-transform: uppercase;
            display: block; margin-bottom: 3px;
        }
        .sobre-destinatario .dest-linea2 {
            font-family: 'Great Vibes', cursive;
            font-size: clamp(1.1em, 3vw, 1.8em);
            color: rgba(80,55,10,0.75);
            display: block; line-height: 1;
        }

        /* ════ SELLO DE LACRE ════ */
        .sello-wrap {
            position: absolute;
            top: 50%; left: 50%;
            transform: translate(-50%, calc(-50% + 6%));
            z-index: 20;
            cursor: pointer;
            transition: transform 0.3s ease;
        }
        .sello-wrap:hover { transform: translate(-50%, calc(-50% + 6%)) scale(1.06); }

        /* El lacre SVG */
        .sello-lacre {
            width: clamp(75px, 16vw, 110px);
            height: clamp(75px, 16vw, 110px);
            filter:
                drop-shadow(0 6px 18px rgba(0,0,0,0.5))
                drop-shadow(0 0 20px rgba(120,20,20,0.4));
            animation: sello-pulso 3s ease-in-out infinite;
            transition: all 0.4s ease;
        }
        @keyframes sello-pulso {
            0%,100% { filter:
                drop-shadow(0 6px 18px rgba(0,0,0,0.5))
                drop-shadow(0 0 20px rgba(120,20,20,0.4)); }
            50%     { filter:
                drop-shadow(0 8px 25px rgba(0,0,0,0.6))
                drop-shadow(0 0 35px rgba(160,30,30,0.65)); }
        }

        /* ── Estado: ABIERTO ── */
        /* 1. Solapa se abre hacia atrás */
        .sobre-scene.abierto .envelope-flap {
            transform: rotateX(-180deg);
        }
        /* 2. El sello desaparece */
        .sobre-scene.abierto .sello-wrap {
            animation: sello-explotar 0.6s cubic-bezier(0.36,0.07,0.19,0.97) both;
        }
        @keyframes sello-explotar {
            0%  { transform: translate(-50%, calc(-50% + 6%)) scale(1); opacity: 1; }
            40% { transform: translate(-50%, calc(-50% + 6%)) scale(1.8) rotate(8deg); opacity: 0.8; }
            100%{ transform: translate(-50%, calc(-50% + 6%)) scale(0) rotate(20deg); opacity: 0; }
        }
        /* 3. La carta sube */
        .sobre-scene.abierto .carta-interior {
            transform: translateY(-68%) scale(1);
            opacity: 1;
        }

        /* ════ CARTA QUE SALE DEL SOBRE ════ */
        .carta-wrap {
            position: absolute;
            bottom: 10%; left: 50%;
            transform: translateX(-50%);
            width: 82%; z-index: 8;
            pointer-events: none;
        }
        .carta-interior {
            background: linear-gradient(160deg, #fffdf5, #f8f0d8, #fffdf5);
            border: 1px solid rgba(180,140,40,0.4);
            padding: clamp(14px,3vw,24px) clamp(16px,3.5vw,28px);
            text-align: center;
            box-shadow:
                0 -10px 30px rgba(0,0,0,0.3),
                inset 0 1px 0 rgba(255,255,255,0.8);
            transform: translateY(0) scale(0.95);
            opacity: 0;
            transition: transform 0.9s cubic-bezier(0.22,0.61,0.36,1) 0.4s,
                        opacity 0.7s ease 0.4s;
            position: relative;
        }
        .carta-interior::before {
            content: '';
            position: absolute; inset: 5px;
            border: 1px dashed rgba(160,120,30,0.25);
            pointer-events: none;
        }
        .carta-linea-header {
            font-family: 'Cormorant Garamond', serif;
            font-size: clamp(0.5em, 1.1vw, 0.65em);
            letter-spacing: 5px; text-transform: uppercase;
            color: rgba(100,70,10,0.55); margin-bottom: 6px;
        }
        .carta-nombres {
            font-family: 'Great Vibes', cursive;
            font-size: clamp(1.8em, 5vw, 3.2em);
            background: linear-gradient(135deg, #c8a020, #f0d060, #c8a020);
            background-size: 200%;
            -webkit-background-clip: text; background-clip: text;
            -webkit-text-fill-color: transparent;
            animation: shimmer-carta 3s linear infinite;
            line-height: 1; margin: 4px 0;
        }
        @keyframes shimmer-carta {
            0%   { background-position: 200%; }
            100% { background-position: -200%; }
        }
        .carta-fecha {
            font-family: 'Cormorant Garamond', serif;
            font-size: clamp(0.6em, 1.4vw, 0.78em);
            letter-spacing: 4px; text-transform: uppercase;
            color: rgba(80,55,10,0.65); margin-top: 8px;
        }
        .carta-div {
            width: 60%; height: 1px; margin: 7px auto;
            background: linear-gradient(to right, transparent, rgba(160,120,30,0.5), transparent);
        }

        /* ── Hint de "toca el sello" ── */
        .sobre-hint {
            margin-top: 22px; text-align: center;
            animation: parpadeo 2.8s ease-in-out infinite;
            position: relative; z-index: 5;
        }
        .sobre-hint span {
            font-family: 'Cormorant Garamond', serif;
            font-size: clamp(0.65em, 1.5vw, 0.78em);
            letter-spacing: 5px; text-transform: uppercase;
            color: rgba(212,175,55,0.55);
        }
        .sobre-hint::before {
            content: '— ';
            color: rgba(212,175,55,0.3);
        }
        .sobre-hint::after {
            content: ' —';
            color: rgba(212,175,55,0.3);
        }
        @keyframes parpadeo { 0%,100%{opacity:.3} 50%{opacity:.85} }

        /* ════ PORTADA BRIDGERTON FULL CINEMATIC ════ */
        @import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,700;1,400;1,700&display=swap');

        .portada {
            width: 100%; min-height: 100vh;
            position: relative; overflow: hidden;
            display: flex; flex-direction: column;
            justify-content: center; align-items: center;
            text-align: center; z-index: 2;
        }

        /* Foto de fondo */
        .portada-bg {
            position: absolute; inset: -5%;
            background: url('Fotos/noviosfondo.jpg') center/cover no-repeat;
            filter: sepia(20%) contrast(115%) brightness(0.75) saturate(1.1);
            animation: kb 40s ease-in-out infinite alternate; z-index: -1;
        }
        @keyframes kb { 0%{transform:scale(1)} 100%{transform:scale(1.1) translate(-2%,-2%)} }

        /* Overlay multicapa cinematográfico */
        .portada-overlay {
            position: absolute; inset: 0; z-index: 0;
            background:
                radial-gradient(ellipse 60% 80% at 50% 50%, transparent 0%, rgba(10,18,30,0.45) 100%),
                linear-gradient(to bottom, rgba(10,18,30,0.6) 0%, transparent 25%, transparent 70%, rgba(10,18,30,0.7) 100%);
        }

        /* ── Pétalos de rosa cayendo ── */
        .petalo {
            position: absolute; top: -60px; z-index: 1;
            pointer-events: none; opacity: 0;
            animation: caida-petalo linear infinite;
        }
        @keyframes caida-petalo {
            0%   { opacity: 0; transform: translateY(0) rotate(0deg) scale(1); }
            5%   { opacity: 0.7; }
            90%  { opacity: 0.5; }
            100% { opacity: 0; transform: translateY(110vh) rotate(720deg) scale(0.6); }
        }

        /* ── Cenefa lateral derecha ── */
        .cenefa-lateral {
            position: absolute; right: 0; top: 0; bottom: 0;
            width: 90px; z-index: 2; pointer-events: none;
            background: linear-gradient(to left, rgba(26,44,66,0.25), transparent);
        }
        .cenefa-lateral-izq {
            position: absolute; left: 0; top: 0; bottom: 0;
            width: 90px; z-index: 2; pointer-events: none;
            background: linear-gradient(to right, rgba(26,44,66,0.25), transparent);
        }

        /* ── Contenido principal ── */
        .portada-contenido {
            position: relative; z-index: 5;
            padding: 0; max-width: min(820px, 92vw);
            display: flex; flex-direction: column; align-items: center;
            animation: revelar-portada 1.8s ease both;
        }
        @keyframes revelar-portada {
            0%   { opacity: 0; transform: translateY(30px); }
            100% { opacity: 1; transform: translateY(0); }
        }

        /* ── Pamphlet de Lady Whistledown ── */
        .lw-pamphlet {
            background: rgba(250, 247, 242, 0.10);
            border: 1px solid rgba(212,175,55,0.35);
            border-radius: 2px;
            padding: 3px 22px 3px;
            margin-bottom: 28px;
            backdrop-filter: blur(2px);
            display: flex; align-items: center; gap: 12px;
            animation: revelar-portada 1.8s 0.3s ease both;
            opacity: 0;
        }
        .lw-pamphlet::before,
        .lw-pamphlet::after {
            content: '✦'; color: var(--gold); font-size: 0.7em; opacity: 0.8;
        }
        .lw-pamphlet span {
            font-family: 'Cormorant Garamond', serif;
            font-size: clamp(0.65em, 1.5vw, 0.8em);
            letter-spacing: 5px; text-transform: uppercase;
            color: rgba(243, 229, 171, 0.9); font-weight: 600;
        }

        /* ── SVG ornamental frame inline ── */
        .ornamental-frame {
            position: absolute; inset: -4px;
            pointer-events: none; z-index: 6;
            width: calc(100% + 8px); height: calc(100% + 8px);
            opacity: 0.85;
            animation: revelar-portada 2s 0.5s ease both;
        }

        /* ── Marco interior del contenido ── */
        .portada-card {
            position: relative;
            padding: clamp(30px, 5vw, 60px) clamp(30px, 7vw, 80px);
            background: rgba(12, 22, 38, 0.72);
            border: 1px solid rgba(212, 175, 55, 0.5);
            backdrop-filter: blur(12px);
            -webkit-backdrop-filter: blur(12px);
            box-shadow:
                0 0 0 6px rgba(212,175,55,0.08),
                0 0 0 7px rgba(212,175,55,0.25),
                0 30px 80px rgba(0,0,0,0.6),
                inset 0 1px 0 rgba(255,255,255,0.07);
        }
        /* Esquinas doradas decorativas */
        .portada-card::before {
            content: '';
            position: absolute; inset: 7px;
            border: 1px solid rgba(212, 175, 55, 0.2);
            pointer-events: none;
        }

        /* ── Monograma / crest ── */
        .portada-crest {
            margin-bottom: 16px;
            animation: revelar-portada 1.8s 0.6s ease both; opacity: 0;
        }
        .portada-crest svg { width: clamp(60px, 10vw, 90px); height: auto; }

        /* ── Lema de la temporada ── */
        .portada-season {
            font-family: 'Cormorant Garamond', serif;
            font-size: clamp(0.7em, 1.8vw, 0.9em);
            letter-spacing: 6px; text-transform: uppercase;
            color: rgba(212,175,55,0.9); font-weight: 600;
            margin-bottom: 20px;
            animation: revelar-portada 1.8s 0.8s ease both; opacity: 0;
        }

        /* ── Nombres épicos ── */
        .portada-nombres {
            font-family: 'Great Vibes', cursive;
            font-size: clamp(4em, 12vw, 7.5em);
            line-height: 0.9;
            color: #FFF;
            text-shadow:
                0 0 40px rgba(212,175,55,0.6),
                0 0 80px rgba(212,175,55,0.25),
                2px 3px 8px rgba(0,0,0,0.5);
            margin: 8px 0 18px;
            letter-spacing: 2px;
            animation: revelar-portada 1.8s 1s ease both; opacity: 0;
        }
        /* Shimmer dorado en los nombres */
        .portada-nombres .shimmer-name {
            display: inline-block;
            background: linear-gradient(90deg,
                #e8d5a3 0%, #D4AF37 25%, #fff8e7 45%,
                #D4AF37 55%, #f0d060 75%, #D4AF37 100%);
            background-size: 200% auto;
            -webkit-background-clip: text; background-clip: text;
            -webkit-text-fill-color: transparent;
            animation: shimmer-gold 4s linear infinite;
        }
        @keyframes shimmer-gold {
            0%   { background-position: 200% center; }
            100% { background-position: -200% center; }
        }

        /* ── Y ornamental ── */
        .portada-y {
            display: flex; align-items: center; gap: 18px;
            margin: 0 auto 18px;
            animation: revelar-portada 1.8s 1.1s ease both; opacity: 0;
        }
        .portada-y::before, .portada-y::after {
            content: '';
            flex: 1; height: 1px;
            background: linear-gradient(to right, transparent, rgba(212,175,55,0.7), transparent);
            min-width: 60px;
        }
        .portada-y span {
            font-family: 'Cormorant Garamond', serif;
            color: rgba(212,175,55,0.9); font-size: 1em;
            letter-spacing: 3px; font-style: italic;
        }

        /* ── Sub-texto ── */
        .portada-subtexto {
            font-family: 'Cormorant Garamond', serif;
            font-size: clamp(1em, 2.5vw, 1.4em);
            color: rgba(230,220,200,0.85);
            font-style: italic; letter-spacing: 2px;
            margin-bottom: 28px; line-height: 1.5;
            animation: revelar-portada 1.8s 1.2s ease both; opacity: 0;
        }

        /* ── Separador floral ── */
        .portada-floraldiv {
            display: flex; align-items: center; gap: 14px;
            margin: 4px auto 28px; width: 100%;
            justify-content: center;
            animation: revelar-portada 1.8s 1.3s ease both; opacity: 0;
        }
        .portada-floraldiv::before, .portada-floraldiv::after {
            content: ''; flex:1; max-width: 120px;
            height: 1px;
            background: linear-gradient(to right, transparent, rgba(212,175,55,0.6));
        }
        .portada-floraldiv::after {
            background: linear-gradient(to left, transparent, rgba(212,175,55,0.6));
        }
        .portada-floraldiv .flor { color: var(--gold); font-size: 1.1em; letter-spacing: 6px; }

        /* ── Fecha ── */
        .portada-fecha-wrap {
            display: flex; align-items: center; gap: 20px; justify-content: center;
            animation: revelar-portada 1.8s 1.4s ease both; opacity: 0;
        }
        .portada-fecha {
            font-family: 'Cormorant Garamond', serif;
            font-size: clamp(1em, 2.8vw, 1.6em);
            color: rgba(243,229,171,0.95);
            letter-spacing: 6px; text-transform: uppercase; font-weight: 600;
        }
        .fecha-rombo { color: rgba(212,175,55,0.7); font-size: 0.8em; }
        .portada-amp { font-size:.45em; color:rgba(212,175,55,.75); font-family:'Cormorant Garamond',serif; letter-spacing:10px; font-style:italic; display:block; margin:4px 0; }
        .ubicacion-copy { margin-bottom:25px; }
        .dresscode-title { font-size:1.6em; text-transform:uppercase; letter-spacing:3px; font-family:'Cormorant Garamond',serif; }
        .color-negro { background:#000; border:2px solid var(--gold); }
        .color-azul { background:#1A2C42; border:2px solid var(--gold); }
        .color-borgona { background:#4A1525; border:2px solid var(--gold); }
        .color-oro { background:#D4AF37; border:2px solid var(--navy); }
        .form-success-title { color:var(--navy); font-size:2.5em; margin-bottom:10px; }
        .form-success-copy { font-size:1.2em; }
        .footer-note { font-family:'Cormorant Garamond',serif; font-style:italic; opacity:.7; margin-top:18px; font-size:1.2em; }

        /* ── Scroll indicator ── */
        .portada-scroll {
            position: absolute; bottom: 38px; left: 50%; transform: translateX(-50%);
            display: flex; flex-direction: column; align-items: center; gap: 8px;
            z-index: 5; animation: fadeInUp 2s 2.2s ease both; opacity: 0;
            cursor: pointer;
        }
        @keyframes fadeInUp { from{opacity:0;transform:translateX(-50%) translateY(10px)} to{opacity:1;transform:translateX(-50%) translateY(0)} }
        .portada-scroll span {
            font-family: 'Cormorant Garamond', serif;
            font-size: 0.65em; letter-spacing: 4px; text-transform: uppercase;
            color: rgba(212,175,55,0.7);
        }
        .scroll-arrow {
            width: 22px; height: 22px;
            border-right: 1px solid rgba(212,175,55,0.6);
            border-bottom: 1px solid rgba(212,175,55,0.6);
            transform: rotate(45deg);
            animation: bounce-arrow 1.8s ease-in-out infinite;
        }
        @keyframes bounce-arrow {
            0%,100%{transform:rotate(45deg) translateY(0)} 50%{transform:rotate(45deg) translateY(5px)}
        }

        /* ── Escudo SVG corners del portada-card ── */
        .corner-deco {
            position: absolute; width: 36px; height: 36px; opacity: 0.65;
        }
        .corner-deco.tl { top: 10px; left: 10px; }
        .corner-deco.tr { top: 10px; right: 10px; transform: scaleX(-1); }
        .corner-deco.bl { bottom: 10px; left: 10px; transform: scaleY(-1); }
        .corner-deco.br { bottom: 10px; right: 10px; transform: scale(-1); }

        /* ── Label de la boda ── */
        .portada-label {
            font-family: 'Cormorant Garamond', serif;
            font-size: clamp(0.7em, 1.5vw, 0.85em);
            letter-spacing: 5px; text-transform: uppercase;
            color: rgba(212,175,55,0.85); font-weight: 600; margin-bottom: 8px;
        }

        /* ── Responsive ── */
        @media(max-width:600px){
            .portada-card { padding: 28px 22px; }
            .cenefa-lateral, .cenefa-lateral-izq { width: 40px; }
        }

        /* ════ SECCIONES GENERALES ════ */
        .seccion { padding:90px 20px; text-align:center; position:relative; z-index:2; }
        .seccion-inner { max-width:860px; margin:0 auto; }
        .seccion-alt { background: var(--blanco); border-top: 2px solid var(--gold); border-bottom: 2px solid var(--gold); box-shadow: 0 10px 30px rgba(0,0,0,0.05); }
        
        .titulo-seccion { font-size:clamp(2.5em,6vw,4em); font-style:italic; margin-bottom:10px; font-weight: bold; }
        .titulo-seccion em { color:var(--gold); font-family: 'Great Vibes', cursive; font-size: 1.3em; font-style: normal; }

        .fdivisor { display:flex; align-items:center; justify-content:center; gap:14px; margin:10px auto 40px; }
        .fdivisor::before,.fdivisor::after { content:''; flex:1; max-width:100px; height:2px; background:var(--gold); }
        .fdivisor span { color: var(--gold); font-size: 1.8em; }

        /* ════ CONTADOR VIP ════ */
        .contador { display:flex; justify-content:center; gap:25px; flex-wrap:wrap; margin-top: 30px;}
        .unidad { background:var(--crema); border:2px solid var(--gold); border-radius:50%; width:120px; height: 120px; display: flex; flex-direction: column; justify-content: center; align-items: center; box-shadow: 0 10px 20px rgba(0,0,0,0.08); position: relative;}
        .unidad::after { content:''; position:absolute; inset: 4px; border: 1px dashed var(--gold); border-radius: 50%; pointer-events: none;}
        .unidad .numero { font-family:'Cormorant Garamond',serif; font-size:clamp(2.5em,5vw,3.5em); color:var(--navy); font-weight:bold; line-height: 1;}
        .unidad .etiqueta { display:block; margin-top:5px; font-size:0.7em; text-transform:uppercase; letter-spacing:2px; color:var(--texto); font-weight: bold;}

        /* ════ ITINERARIO CARDS ════ */
        .itinerario-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:40px; margin-top: 40px;}
        .tarjeta { background:var(--blanco); border:2px solid var(--gold-light); padding:50px 30px; border-radius:8px; transition:transform .4s ease, box-shadow .4s ease; position:relative; box-shadow: 0 10px 40px rgba(0,0,0,0.03); }
        .tarjeta:hover { transform:translateY(-8px); box-shadow: 0 15px 35px rgba(212,175,55,0.2); border-color: var(--gold);}
        .tarjeta .icono { font-size:3em; margin-bottom:15px; filter: sepia(30%) saturate(150%); }
        .tarjeta h3 { font-size:1.8em; color:var(--navy); margin-bottom:10px; font-weight: bold; }
        .tarjeta .hora { font-family:'Cormorant Garamond',serif; font-size:2em; color:var(--gold); margin-bottom:10px; font-weight:bold; font-style: italic; letter-spacing: 1px; }

        .btn-floral { display:inline-block; color:var(--crema); background: var(--navy); padding:14px 35px; text-decoration:none; border-radius:4px; font-size:0.85em; letter-spacing:2px; text-transform:uppercase; transition:all .3s ease; box-shadow: 0 8px 20px rgba(26, 44, 66, 0.3); border: 2px solid var(--navy); font-weight: bold; margin-top: 15px;}
        .btn-floral:hover { background:var(--gold); color:var(--blanco); box-shadow:0 10px 25px rgba(212,175,55,0.4); border-color: var(--gold); transform: translateY(-3px);}

        /* ════ TIMELINE GOSSIP CHRONICLE ════ */
        .timeline { display:flex; flex-direction:column; margin-top:40px; position:relative; font-family: 'Cormorant Garamond', serif; }
        .timeline::before { content:''; position:absolute; left:50%; top:0; bottom:0; width:2px; background:var(--gold); transform:translateX(-50%); opacity: 0.5; }
        .tl-item { display:grid; grid-template-columns:1fr 60px 1fr; gap:20px; align-items:center; margin-bottom:60px; }
        .tl-text h4 { font-size:2em; color:var(--navy); margin-bottom:8px; font-style: italic;}
        .tl-text p { font-size:1.2em; color:var(--texto); line-height:1.6; background: rgba(255,255,255,0.9); padding: 20px; border-radius: 4px; border: 1px solid var(--gold-light); box-shadow: 0 5px 15px rgba(0,0,0,0.05);}
        .tl-item:nth-child(odd) .tl-text { text-align:right; grid-column:1; }
        .tl-item:nth-child(even) .tl-text { text-align:left; grid-column:3; }
        .tl-dot { width:50px; height:50px; background:var(--blanco); border:3px solid var(--gold); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1.4em; z-index:1; box-shadow: 0 0 15px rgba(212,175,55,0.4); }
        
        @media(max-width:768px){
            .timeline::before{left:30px;}
            .tl-item{grid-template-columns:60px 1fr;gap:15px;}
            .tl-item:nth-child(odd) .tl-text,.tl-item:nth-child(even) .tl-text{text-align:left;grid-column:2;grid-row:1;}
            .tl-item:nth-child(odd) .tl-dot,.tl-item:nth-child(even) .tl-dot{grid-column:1;grid-row:1;}
        }

        /* ════ GALERÍA / RETRATOS (TU ESPACIO DE UPSELL) ════ */
        .galeria { display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:30px; margin-top: 40px; }
        .galeria-img-wrap { border: 12px solid var(--blanco); box-shadow: 0 15px 35px rgba(0,0,0,0.15); transition:transform .5s; overflow: hidden; position: relative;}
        /* La clase especial para el marco del montaje épico */
        .marco-epico { border-color: var(--gold); box-shadow: 0 20px 50px rgba(212,175,55,0.3); transform: scale(1.05); z-index: 2;}
        .galeria-img { width:100%; aspect-ratio:3/4; object-fit:cover; transition:transform 0.5s ease; filter: sepia(20%) brightness(1.05) contrast(95%);}
        .galeria-img-wrap:hover { transform:scale(1.03) rotate(-2deg); z-index: 3;}
        .galeria-img-wrap:hover .galeria-img { transform:scale(1.1); filter: sepia(0%);}
        .etiqueta-obra { position: absolute; bottom: 0; width: 100%; background: rgba(255,255,255,0.9); padding: 10px; font-family: 'Cormorant Garamond', serif; font-size: 1.1em; color: var(--navy); border-top: 1px solid var(--gold);}

        /* ════ ETIQUETA / DRESS CODE ════ */
        .paleta { display:flex; justify-content:center; gap:20px; flex-wrap:wrap; margin: 25px 0; }
        .color-c { width: 60px; height: 60px; border-radius: 50%; box-shadow: 0 5px 15px rgba(0,0,0,0.2); transition: transform 0.3s;}
        .color-c:hover { transform: scale(1.15);}
        .dc-cards { display: flex; flex-wrap: wrap; gap: 20px; justify-content: center;}
        .dc-cardTarjeta { background: white; border:2px solid var(--gold-light); border-radius:8px; padding:40px 30px; flex:1; max-width:300px; box-shadow: 0 10px 20px rgba(0,0,0,0.05);}
        .aviso-blanco { display:inline-block; border:2px solid var(--gold); color:var(--navy); background: rgba(212,175,55,0.1); border-radius:4px; padding:15px 25px; font-size:0.95em; letter-spacing:1px; font-weight: bold; margin-top: 30px;}

        /* ════ RSVP FORM VIP ════ */
        .form-card { max-width:650px; margin:0 auto; background:var(--blanco); border:2px solid var(--gold); border-radius:8px; padding:50px; text-align:left; box-shadow: 0 20px 50px rgba(0,0,0,0.1); position: relative;}
        .form-card::before { content:''; position:absolute; inset: 6px; border: 1px dashed var(--gold); pointer-events: none;}
        .campo { margin-bottom:25px; position: relative; z-index: 1;}
        .campo label { display:block; margin-bottom:10px; font-size:0.85em; letter-spacing:2px; text-transform:uppercase; color:var(--navy); font-weight:bold; }
        .campo input,.campo select { width:100%; padding:18px; background:var(--crema); border:2px solid #EAE2D0; border-radius:4px; color:var(--texto); font-family:'Nunito',sans-serif; outline:none; transition:.3s; font-size: 1em;}
        .campo input:focus,.campo select:focus { border-color:var(--gold); background:var(--blanco); box-shadow: 0 0 15px rgba(212,175,55,0.15); }
        .btn-enviar { width:100%; padding:22px; background:var(--navy); color:var(--crema); border:none; border-radius:4px; font-size:1.1em; letter-spacing:2px; text-transform:uppercase; cursor:pointer; transition:.3s; font-weight: bold; position: relative; z-index: 1; box-shadow: 0 10px 20px rgba(26, 44, 66, 0.3);}
        .btn-enviar:hover:not(:disabled) { background:var(--gold); color: var(--navy); transform:translateY(-3px); box-shadow:0 15px 30px rgba(212,175,55,0.4); }

        #form-exito { display:none; text-align:center; padding:30px; font-family: 'Cormorant Garamond', serif; position: relative; z-index: 1;}

        /* ════ FOOTER ════ */
        footer { background:var(--navy); text-align:center; padding:60px 20px; font-size:0.85em; letter-spacing:2px; color:rgba(255,255,255,0.7); position:relative; z-index:2; border-top: 3px solid var(--gold); }
        footer span { color:var(--gold); font-weight: bold;}


        /* ════ DAVINCI DOCTRINE · REGENCY SOCIETY PAPERS ════ */
        :root {
            --regency-ink: #17283D;
            --regency-paper: #FFF9EB;
            --regency-porcelain: #DCEAF6;
            --regency-wax: #6E111B;
            --regency-shadow: rgba(23,40,61,0.18);
            --regency-line: rgba(212,175,55,0.42);
            --kc-obsidian: #050505;
        }

        body::before {
            content:'';
            position: fixed; inset: 0;
            pointer-events:none; z-index:0;
            background:
                radial-gradient(circle at 12% 12%, rgba(255,249,235,0.42), transparent 28%),
                radial-gradient(circle at 84% 18%, rgba(212,175,55,0.18), transparent 24%),
                linear-gradient(115deg, rgba(255,255,255,0.14), transparent 45%, rgba(26,44,66,0.10));
        }

        .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; }
        .section-kicker { font-family:'Cormorant Garamond',serif; letter-spacing:5px; text-transform:uppercase; color:var(--gold); font-size:.78rem; font-weight:700; margin-bottom:10px; }
        .regency-copy { font-family:'Cormorant Garamond',serif; font-size:clamp(1.12rem,2.4vw,1.45rem); line-height:1.75; color:var(--regency-ink); max-width:720px; margin:0 auto 24px; }
        .society-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:22px; margin-top:36px; }
        .society-card { background:linear-gradient(155deg, rgba(255,255,255,.94), rgba(255,249,235,.9)); border:1px solid var(--regency-line); box-shadow:0 18px 40px rgba(23,40,61,.08); padding:30px 24px; position:relative; }
        .society-card::before { content:''; position:absolute; inset:8px; border:1px dashed rgba(212,175,55,.28); pointer-events:none; }
        .society-card h3, .society-card h4 { font-size:1.65rem; font-weight:700; margin-bottom:12px; color:var(--navy); }
        .society-card p { line-height:1.65; color:rgba(42,42,42,.82); }
        .regency-sigil { width:48px; height:48px; margin:0 auto 16px; color:var(--gold); display:block; }
        .parents-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:22px; margin-top:34px; }
        .parent-card { background:var(--regency-paper); border:1px solid var(--regency-line); padding:30px 22px; box-shadow:0 18px 38px rgba(0,0,0,.07); }
        .parent-card .role { display:block; color:var(--gold); letter-spacing:3px; text-transform:uppercase; font-size:.72rem; font-weight:800; margin-bottom:12px; }
        .parent-card strong { font-family:'Great Vibes',cursive; font-size:2.25rem; color:var(--navy); font-weight:400; }
        .gift-vault { max-width:760px; margin:34px auto 0; background:linear-gradient(145deg, #17283D, #0C1724); color:var(--crema); border:1px solid rgba(212,175,55,.55); padding:36px 26px; box-shadow:0 24px 65px rgba(26,44,66,.28); position:relative; }
        .gift-vault::before { content:''; position:absolute; inset:10px; border:1px dashed rgba(212,175,55,.3); pointer-events:none; }
        .gift-vault h3 { color:var(--gold-light); font-size:2rem; margin-bottom:12px; }
        .gift-vault p { color:rgba(250,247,242,.84); line-height:1.7; }
        .clabe-box { margin:22px auto 0; max-width:470px; background:rgba(255,255,255,.08); border:1px solid rgba(212,175,55,.45); padding:18px; font-family:'Courier New',monospace; letter-spacing:2px; color:#fff; }
        .map-ledger { display:grid; grid-template-columns:repeat(auto-fit,minmax(270px,1fr)); gap:24px; margin-top:34px; }
        .map-card { background:#fff; border:1px solid var(--regency-line); padding:28px 22px; box-shadow:0 14px 34px rgba(0,0,0,.06); }
        .rsvp-saludo { display:none; max-width:650px; margin:0 auto 22px; padding:18px 20px; background:rgba(212,175,55,.12); border:1px solid var(--gold); color:var(--navy); font-family:'Cormorant Garamond',serif; font-size:1.2rem; text-align:center; }
        .rsvp-saludo.activo { display:block; }
        .kc-ticket { margin:28px auto 0; max-width:560px; background:linear-gradient(145deg,#fffaf0,#efe1b8); border:2px solid var(--gold); color:var(--navy); padding:28px 22px; text-align:center; box-shadow:0 20px 60px rgba(26,44,66,.18); position:relative; }
        .kc-ticket::before { content:''; position:absolute; inset:9px; border:1px dashed rgba(110,17,27,.35); pointer-events:none; }
        .kc-ticket h3 { font-size:2.1rem; font-weight:700; margin-bottom:8px; }
        .ticket-name { font-family:'Great Vibes',cursive; font-size:2.8rem; color:var(--regency-wax); line-height:1; margin:12px 0; }
        .ticket-meta { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin:16px 0; }
        .ticket-meta span, .kct-maps-chip { border:1px solid rgba(212,175,55,.65); background:rgba(255,255,255,.42); padding:8px 12px; font-size:.78rem; letter-spacing:2px; text-transform:uppercase; font-weight:800; }
        .kct-maps-chip { cursor:pointer; color:var(--navy); }
        .ticket-qr { width:132px; height:132px; margin:16px auto 6px; border:8px solid #fff; box-shadow:0 8px 22px rgba(0,0,0,.12); display:block; }
        #kc-vip-ticket { display:none; }
        #kc-vip-ticket.visible { display:block; }
        .ticket-actions { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-top:16px; }
        .ticket-actions .btn-floral { margin-top:0; }
        .overlay-regency { position:fixed; inset:0; z-index:10020; display:none; align-items:center; justify-content:center; padding:20px; background:rgba(5,5,5,.72); backdrop-filter:blur(10px); }
        .overlay-regency.visible { display:flex; }
        .overlay-panel { width:min(820px,94vw); max-height:90vh; overflow:auto; background:linear-gradient(155deg,#fffaf0,#eaf3fb); border:2px solid var(--gold); padding:34px 24px; position:relative; box-shadow:0 30px 90px rgba(0,0,0,.45); }
        .overlay-close { position:absolute; top:12px; right:12px; min-width:44px; min-height:44px; border:1px solid var(--gold); background:var(--navy); color:var(--crema); cursor:pointer; font-size:1.2rem; }
        .kc-footer { background:linear-gradient(145deg,#050505,#17283D); color:rgba(250,247,242,.78); }
        .kc-footer-mark { font-family:'Cormorant Garamond',serif; font-size:1.65rem; color:var(--gold); letter-spacing:4px; text-transform:uppercase; margin-bottom:14px; }
        .kc-social { display:flex; gap:14px; flex-wrap:wrap; justify-content:center; margin-top:18px; }
        .kc-social a { color:var(--crema); border:1px solid rgba(212,175,55,.45); padding:10px 12px; text-decoration:none; letter-spacing:1px; }
        .kc-social a:hover { background:rgba(212,175,55,.14); }
        .micro-note { display:block; margin-top:8px; opacity:.7; font-size:.82rem; letter-spacing:1px; }
        .svg-icon { width:2.4em; height:2.4em; display:block; margin:0 auto 12px; color:var(--gold); }
        .svg-icon path, .svg-icon circle, .svg-icon line, .svg-icon rect { vector-effect:non-scaling-stroke; }

        /* ════ KC-RSVP v3 — MÓDULO CEREMONIAL ════
           Variables preparadas para Fase D Navy Royale */
        :root {
            --kc-rsvp-bg:      var(--blanco);
            --kc-rsvp-border:  rgba(212,175,55,.45);
            --kc-rsvp-gold:    var(--gold);
            --kc-rsvp-navy:    var(--navy);
            --kc-rsvp-cream:   var(--crema);
        }

        /* ── Saludo VIP ── */
        .kc-rsvp-saludo { display:none; max-width:650px; margin:0 auto 22px; padding:14px 20px; background:rgba(212,175,55,.10); border:1px solid var(--kc-rsvp-gold); color:var(--kc-rsvp-navy); font-family:'Cormorant Garamond',serif; font-size:1.1rem; text-align:center; border-radius:3px; }
        .kc-rsvp-saludo.activo { display:block; }

        /* ── Tarjeta del formulario ── */
        .kc-rsvp-card { max-width:640px; margin:0 auto; background:var(--kc-rsvp-bg); border:2px solid var(--kc-rsvp-gold); border-radius:6px; padding:44px 40px; text-align:left; box-shadow:0 20px 60px rgba(0,0,0,.08); position:relative; }
        .kc-rsvp-card::before { content:''; position:absolute; inset:8px; border:1px dashed rgba(212,175,55,.3); pointer-events:none; border-radius:4px; }
        .kc-rsvp-ornament { text-align:center; color:var(--kc-rsvp-gold); font-size:1.6em; margin-bottom:24px; letter-spacing:14px; }
        .campo-opcional { font-size:.78em; opacity:.6; font-weight:400; }

        /* ── Estado confirmado + ticket inline ── */
        .kc-rsvp-exito { max-width:640px; margin:0 auto; text-align:center; }
        .kc-conf-icon { font-size:2.8em; color:var(--kc-rsvp-gold); margin-bottom:12px; display:block; }
        .kc-conf-title { font-family:'Great Vibes',cursive; font-size:clamp(2em,5vw,3.2em); color:var(--kc-rsvp-navy); margin-bottom:10px; }
        .kc-conf-copy { font-family:'Cormorant Garamond',serif; font-size:1.15rem; color:rgba(42,42,42,.8); margin-bottom:28px; line-height:1.7; }
        @keyframes kc-conf-pop { 0%{opacity:0;transform:translateY(18px)} 100%{opacity:1;transform:translateY(0)} }

        /* ── Ticket VIP ── */
        .kc-ticket { background:linear-gradient(155deg,#fffaf0,#f0e6cc); border:2px solid rgba(212,175,55,.7); border-radius:6px; padding:0; margin:0 auto; max-width:420px; position:relative; overflow:hidden; box-shadow:0 14px 40px rgba(0,0,0,.15); }
        .kc-ticket-header { background:linear-gradient(135deg,#1A2C42,#0c1a2e); color:var(--kc-rsvp-cream); text-align:center; padding:18px 22px 14px; }
        .kc-ticket-badge { display:block; font-family:'Cormorant Garamond',serif; font-size:.6rem; letter-spacing:4px; text-transform:uppercase; color:rgba(212,175,55,.7); margin-bottom:6px; }
        .kc-ticket-novios { font-family:'Cormorant Garamond',serif; font-size:.82rem; letter-spacing:2px; color:rgba(250,247,242,.75); }
        .kc-ticket-body { padding:22px 24px 18px; text-align:center; }
        .kc-ticket-label { font-family:'Cormorant Garamond',serif; font-size:.58rem; letter-spacing:4px; text-transform:uppercase; color:rgba(100,75,20,.6); margin-bottom:6px; }
        .kc-ticket-nombre { font-family:'Great Vibes',cursive; font-size:clamp(2em,5vw,2.8em); color:var(--kc-rsvp-navy); line-height:1.1; margin-bottom:8px; }
        .kc-ticket-pases { font-family:'Cormorant Garamond',serif; font-size:.78rem; letter-spacing:2px; color:rgba(42,42,42,.65); border:1px solid rgba(212,175,55,.45); display:inline-block; padding:3px 14px; margin-bottom:20px; background:rgba(255,255,255,.5); }
        .kc-ticket-qr-wrap { display:flex; justify-content:center; margin-bottom:16px; }
        .kc-ticket-qr { width:160px; height:160px; border:8px solid #fff; box-shadow:0 8px 28px rgba(0,0,0,.18), 0 0 0 1px rgba(212,175,55,.3); display:block; }
        .kc-ticket-firma { font-family:'Great Vibes',cursive; font-size:1.1em; color:rgba(100,75,20,.65); margin-bottom:2px; }
        .kc-ticket-brand { background:var(--kc-rsvp-navy); color:rgba(212,175,55,.65); text-align:center; padding:7px; font-size:.56rem; letter-spacing:3px; text-transform:uppercase; }

        /* ── Botón Guardar Pase — FUERA del .kc-ticket (KC-RSVP §6) ── */
        .kc-ticket-share { margin-top:16px; display:flex; justify-content:center; }
        .kc-ticket-share-btn { font-size:.65em; letter-spacing:2px; text-transform:uppercase; padding:10px 20px; border:1px solid rgba(212,175,55,.5); border-radius:25px; background:rgba(212,175,55,.1); color:var(--navy); cursor:pointer; transition:background .3s,border-color .3s; font-weight:700; }
        .kc-ticket-share-btn:hover { background:rgba(212,175,55,.25); border-color:rgba(212,175,55,.8); }

        /* ════ FASE C-C — RSVP HEADER COMPACTO ════ */
        .kc-rsvp-header { display:flex; align-items:center; justify-content:center; gap:12px; margin-bottom:8px; }
        .kc-rsvp-star { flex-shrink:0; filter:drop-shadow(0 0 6px rgba(212,175,55,.5)); }
        .kc-rsvp-titulo { font-family:'Cormorant Garamond',serif; font-size:clamp(1.8rem,4vw,2.6rem); font-weight:600; color:var(--navy); letter-spacing:4px; text-transform:uppercase; line-height:1; margin:0; }
        .kc-rsvp-titulo em { font-style:italic; color:var(--gold); font-family:'Great Vibes',cursive; font-size:1.4em; letter-spacing:0; text-transform:none; vertical-align:middle; }
        .kc-rsvp-subcopy { font-family:'Cormorant Garamond',serif; font-size:1rem; color:rgba(42,42,42,.75); text-align:center; margin:0 auto 24px; max-width:440px; letter-spacing:.5px; }
        .kc-rsvp-subcopy strong { color:var(--navy); }

        /* ════ FASE C-C — MOBILE COMPRESSION ════ */
        @media(max-width:640px){

            /* ── Global section breathing ── */
            .seccion { padding:52px 16px; }
            .seccion-inner { max-width:100%; }
            .titulo-seccion { font-size:clamp(1.8rem,7vw,2.6rem); }
            .section-kicker { font-size:.58rem; letter-spacing:5px; }
            .regency-copy { font-size:.95rem; margin-bottom:20px; }
            .fdivisor { margin:10px 0; }

            /* ── Galería: scroll-snap horizontal rail ── */
            .galeria { display:flex; flex-wrap:nowrap; gap:12px; overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; padding:4px 0 14px; scrollbar-width:none; }
            .galeria::-webkit-scrollbar { display:none; }
            .galeria-img-wrap { flex:0 0 74vw; max-width:280px; scroll-snap-align:center; border-radius:6px; overflow:hidden; }
            .galeria-img { width:100%; height:220px; object-fit:cover; display:block; }
            .marco-epico { flex:0 0 80vw; }

            /* ── Familia: rail horizontal ── */
            .parents-grid { display:flex; flex-wrap:nowrap; gap:12px; overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; padding-bottom:10px; }
            .parent-card { flex:0 0 70vw; scroll-snap-align:start; padding:20px 18px; }

            /* ── Ubicaciones: grid compacto 2 cols ── */
            .itinerario-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
            .tarjeta { padding:16px 12px; font-size:.88rem; }
            .tarjeta h3 { font-size:.88rem; margin-bottom:4px; }
            .hora { font-size:1.1rem; margin:4px 0; }
            .ubicacion-copy { font-size:.78rem; margin-bottom:10px; }
            .svg-icon { width:1.8em; height:1.8em; margin-bottom:8px; }

            /* ── Dresscode: card condensada ── */
            .dresscode-title { font-size:1rem; margin-bottom:10px; }
            .paleta { gap:8px; margin-bottom:14px; }
            .color-c { width:28px; height:28px; }
            .dc-cards { gap:10px; }
            .dc-cardTarjeta { padding:14px 12px; }
            .dc-cardTarjeta h4 { font-size:.85rem; margin-bottom:4px; }
            .dc-cardTarjeta p { font-size:.8rem; line-height:1.4; }
            .aviso-blanco { font-size:.8rem; padding:8px 14px; }

            /* ── Regalos: cápsula premium compacta ── */
            .gift-vault { padding:20px 16px; }
            .gift-vault h3 { font-size:1.1rem; margin-bottom:8px; }
            .gift-vault p { font-size:.88rem; margin-bottom:12px; }
            .clabe-box { font-size:.82rem; padding:10px 14px; margin-bottom:10px; letter-spacing:1px; }

            /* ── RSVP mobile ── */
            .kc-rsvp-titulo { font-size:1.6rem; }
            .kc-rsvp-card { padding:24px 16px; }
            .kc-rsvp-card::before { inset:5px; }
            .campo label { font-size:.8rem; }
            .campo input, .campo select { font-size:.9rem; padding:10px 12px; }
            .btn-enviar { font-size:.8rem; padding:13px 20px; }
            .kc-conf-icon { font-size:2.2em; }
            .kc-conf-title { font-size:1.8em; }
            .kc-conf-copy { font-size:.92rem; margin-bottom:16px; }
            .kc-ticket { max-width:100%; }
            .kc-ticket-qr { width:130px; height:130px; }
        }

        /* ════ FOOTER EDITORIAL PREMIUM ════ */
        .kc-footer-editorial { background:linear-gradient(145deg,#050505,#17283D); color:rgba(250,247,242,.78); text-align:center; padding:60px 20px; position:relative; z-index:2; border-top:1px solid rgba(212,175,55,.35); }
        .kc-footer-divider { font-size:1.6em; color:rgba(212,175,55,.55); margin-bottom:28px; letter-spacing:12px; }
        .kc-footer-sello { font-family:'Cormorant Garamond',serif; font-size:clamp(1rem,2.2vw,1.3rem); line-height:1.9; margin-bottom:26px; color:rgba(250,247,242,.72); }
        .kc-footer-pareja { color:var(--gold); font-family:'Great Vibes',cursive; font-size:1.5em; vertical-align:middle; }
        .kc-footer-venue { display:block; font-size:.78em; letter-spacing:4px; text-transform:uppercase; color:rgba(212,175,55,.5); margin-top:4px; }
        .kc-footer-brand { display:inline-block; text-decoration:none; color:rgba(250,247,242,.4); font-size:.72em; letter-spacing:3px; text-transform:uppercase; border:1px solid rgba(212,175,55,.18); padding:10px 20px; transition:all .3s ease; margin-top:8px; }
        .kc-footer-brand:hover { color:rgba(212,175,55,.8); border-color:rgba(212,175,55,.45); }

        @media (prefers-reduced-motion: reduce) {
            *, *::before, *::after { animation-duration:.001ms !important; animation-iteration-count:1 !important; scroll-behavior:auto !important; transition-duration:.001ms !important; }
            .portada-bg { animation:none !important; transform:none !important; }
            .petalo, .luciernaga { display:none !important; }
        }

        /* ════ FASE C-C-R MICRO-FIX: OVERFLOW 360px ════ */
        @media (max-width: 380px) {
            .itinerario-grid { grid-template-columns: 1fr; }
        }

/* ════════════════════════════════════════════════════
   FASE D-B — NAVY ROYALE FULL VISUAL REDESIGN
   Khal Calloway Studio · Boda Bridgerton Navy Royale
   DaVinci Doctrine: Renaissance-Luxury Dark/Navy Variant
════════════════════════════════════════════════════ */

:root {
    --kc-navy-obsidian: #050B14;
    --kc-navy-base:     #0B173D;
    --kc-navy-surface:  #10285C;
    --kc-navy-mid:      #152348;
    --kc-paper-ivory:   #F7F0E4;
    --kc-paper-pearl:   #FFF8EA;
    --kc-paper-antique: #EADFCB;
    --kc-gold-old:      #C8A96A;
    --kc-gold-soft:     #D9C48F;
    --kc-bronze-aged:   #8B7043;
    --kc-garden-shadow: #1F3A34;
    --kc-ink-dark:      #0B101E;
    --kc-ink-light:     #F7F0E4;
    --kc-ink-muted:     rgba(247,240,228,0.60);
    /* Legacy compat map */
    --bridgerton-blue:  var(--kc-navy-base);
    --navy:             var(--kc-navy-base);
    --gold:             var(--kc-gold-old);
    --gold-light:       var(--kc-gold-soft);
    --crema:            var(--kc-paper-pearl);
    --blanco:           var(--kc-paper-ivory);
    --texto:            var(--kc-ink-dark);
    --burgundy:         #5A1F2F;
    --regency-ink:      var(--kc-navy-base);
    --regency-paper:    var(--kc-paper-pearl);
    --regency-line:     rgba(200,169,106,0.40);
    --regency-shadow:   rgba(11,23,61,0.18);
    --kc-obsidian:      var(--kc-navy-obsidian);
    --kc-rsvp-bg:       var(--kc-paper-pearl);
    --kc-rsvp-border:   rgba(200,169,106,0.45);
    --kc-rsvp-gold:     var(--kc-gold-old);
    --kc-rsvp-navy:     var(--kc-navy-base);
    --kc-rsvp-cream:    var(--kc-paper-pearl);
}

/* ── Body: Navy atmosphere ── */
body {
    background: var(--kc-navy-obsidian);
    background-image: none;
}

body::before {
    background:
        radial-gradient(circle at 15% 15%, rgba(200,169,106,0.07), transparent 28%),
        radial-gradient(circle at 85% 20%, rgba(200,169,106,0.04), transparent 24%),
        linear-gradient(135deg, rgba(16,40,92,0.12), transparent 45%, rgba(5,11,20,0.18));
}

/* ── Gate/Modal: Navy deep atmosphere ── */
#modal-inicio {
    background:
        radial-gradient(ellipse 70% 80% at 50% 45%,
            #0d1a3a 0%, #050B14 55%, #020608 100%);
}

#modal-inicio::before {
    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cpath d='M60 10 C70 30 90 30 80 50 C90 70 70 70 60 90 C50 70 30 70 40 50 C30 30 50 30 60 10Z' fill='none' stroke='%23C8A96A' stroke-width='0.4' opacity='0.09'/%3E%3Ccircle cx='60' cy='50' r='6' fill='none' stroke='%23C8A96A' stroke-width='0.3' opacity='0.07'/%3E%3Cpath d='M0 0 L0 120 M0 0 L120 0' stroke='%23C8A96A' stroke-width='0.15' opacity='0.04'/%3E%3C/svg%3E");
}

.cortina {
    background: linear-gradient(to bottom,
        #06101a 0%, #0b1a2e 20%, #06101a 60%, #030810 100%);
}

.cortina::after {
    background-image: repeating-linear-gradient(
        0deg,
        transparent 0px, transparent 4px,
        rgba(200,169,106,0.05) 4px, rgba(200,169,106,0.05) 5px
    );
}

.cortina-izq {
    border-right-color: rgba(200,169,106,0.12);
}

.cortina-der {
    border-left-color: rgba(200,169,106,0.12);
}

.cortina-izq .ribete,
.cortina-der .ribete {
    background: linear-gradient(to bottom,
        transparent, rgba(200,169,106,0.5) 15%,
        rgba(200,169,106,0.7) 50%,
        rgba(200,169,106,0.5) 85%, transparent);
}

.borla {
    background: linear-gradient(to bottom, #081428, #050b14);
    border-bottom-color: rgba(200,169,106,0.32);
}

.borla::after {
    background: radial-gradient(circle at 40% 35%, #d9c48f, #8b7043);
    box-shadow: 0 0 12px rgba(200,169,106,0.5);
}

.lw-letrero-linea::before,
.lw-letrero-linea::after {
    background: linear-gradient(to right, transparent, rgba(200,169,106,0.42), transparent);
}

.lw-letrero-linea span {
    color: rgba(200,169,106,0.68);
}

.lw-letrero-titulo {
    color: rgba(217,196,143,0.9);
    text-shadow: 0 0 30px rgba(200,169,106,0.35), 0 2px 6px rgba(0,0,0,0.7);
}

.lw-letrero-subtitulo {
    color: rgba(200,169,106,0.35);
}

.luciernaga {
    background: radial-gradient(circle, rgba(200,169,106,0.85), transparent 70%);
}

/* ── Hero/Portada: Navy Royale Aristocratic ── */
.portada {
    background: var(--kc-navy-obsidian);
}

.portada-bg {
    filter: sepia(10%) contrast(105%) brightness(0.45) saturate(0.8);
}

.portada-overlay {
    background:
        radial-gradient(ellipse 60% 80% at 50% 50%, transparent 0%, rgba(5,11,20,0.55) 100%),
        linear-gradient(to bottom, rgba(5,11,20,0.7) 0%, transparent 30%, transparent 65%, rgba(5,11,20,0.75) 100%);
}

.portada-card {
    background: rgba(11,23,61,0.70);
    border-color: rgba(200,169,106,0.42);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    box-shadow:
        0 0 0 6px rgba(200,169,106,0.06),
        0 0 0 7px rgba(200,169,106,0.20),
        0 30px 80px rgba(0,0,0,0.65),
        inset 0 1px 0 rgba(255,255,255,0.05);
}

.portada-card::before {
    border-color: rgba(200,169,106,0.16);
}

.lw-pamphlet {
    border-color: rgba(200,169,106,0.28);
}

.lw-pamphlet span {
    color: rgba(217,196,143,0.88);
}

.portada-season {
    color: rgba(200,169,106,0.88);
}

/* Nombres: eliminado shimmer Las Vegas, serif editorial ivory */
.portada-nombres {
    color: var(--kc-paper-ivory);
    text-shadow:
        0 0 60px rgba(200,169,106,0.15),
        0 2px 12px rgba(0,0,0,0.7);
}

.portada-nombres .shimmer-name {
    background: none !important;
    -webkit-background-clip: initial !important;
    background-clip: initial !important;
    -webkit-text-fill-color: var(--kc-paper-ivory) !important;
    color: var(--kc-paper-ivory) !important;
    animation: none !important;
}

.portada-y span {
    color: rgba(200,169,106,0.82);
}

.portada-y::before,
.portada-y::after {
    background: linear-gradient(to right, transparent, rgba(200,169,106,0.6), transparent);
}

.portada-subtexto {
    color: rgba(247,240,228,0.72);
}

.portada-fecha {
    color: rgba(217,196,143,0.95);
}

.fecha-rombo {
    color: rgba(200,169,106,0.65);
}

.portada-amp {
    color: rgba(200,169,106,0.7);
}

.portada-floraldiv .flor {
    color: var(--kc-gold-old);
}

.portada-floraldiv::before,
.portada-floraldiv::after {
    background: linear-gradient(to right, transparent, rgba(200,169,106,0.55));
}

.portada-scroll span {
    color: rgba(200,169,106,0.65);
}

.scroll-arrow {
    border-right-color: rgba(200,169,106,0.55);
    border-bottom-color: rgba(200,169,106,0.55);
}

/* Pétals: neutralizados (DaVinci: no decoración infinita) */
.petalo { display: none !important; }
@keyframes caida-petalo { 0%,100% { opacity: 0; } }

/* ── Secciones Generales: Navy Navy ── */
.seccion {
    background: var(--kc-navy-base);
    color: var(--kc-paper-ivory);
}

.seccion-alt {
    background: var(--kc-navy-obsidian);
    border-top-color: rgba(200,169,106,0.22);
    border-bottom-color: rgba(200,169,106,0.22);
    box-shadow: none;
}

h1, h2, h3, h4 {
    color: var(--kc-paper-ivory);
}

.titulo-seccion {
    color: var(--kc-paper-ivory);
}

.titulo-seccion em {
    color: var(--kc-gold-old);
}

.section-kicker {
    color: var(--kc-gold-old);
}

.regency-copy {
    color: rgba(247,240,228,0.78);
}

.fdivisor::before,
.fdivisor::after {
    background: var(--kc-gold-old);
    opacity: 0.55;
}

.fdivisor span {
    color: var(--kc-gold-old);
}

/* ── Countdown: Relojería Aristocrática ── */
.contador {
    gap: 12px;
    flex-wrap: nowrap;
}

.unidad {
    background: transparent;
    border: none;
    border-radius: 0;
    border-bottom: 1px solid rgba(200,169,106,0.35);
    width: auto;
    min-width: 70px;
    height: auto;
    padding: 0 14px 10px;
    box-shadow: none;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
}

.unidad::after { display: none; }

.unidad .numero {
    font-family: 'Cormorant Garamond', serif;
    font-size: clamp(2.6em, 5.5vw, 3.8em);
    color: var(--kc-gold-old);
    font-weight: 300;
    line-height: 1;
}

.unidad .etiqueta {
    color: var(--kc-ink-muted);
    letter-spacing: 3px;
    font-size: 0.58em;
    margin-top: 6px;
    text-transform: uppercase;
}

/* ── Historia Timeline ── */
.timeline::before {
    background: var(--kc-gold-old);
    opacity: 0.35;
}

.tl-dot {
    background: var(--kc-navy-base);
    border-color: var(--kc-gold-old);
    color: var(--kc-gold-old);
    box-shadow: 0 0 15px rgba(200,169,106,0.3);
}

.tl-text h4 {
    color: var(--kc-paper-ivory);
}

.tl-text p {
    background: rgba(247,240,228,0.05);
    border-color: rgba(200,169,106,0.22);
    color: rgba(247,240,228,0.78);
}

/* ── Galería: Editorial Retratos ── */
.galeria-img-wrap {
    border-color: rgba(247,240,228,0.15);
    box-shadow: 0 15px 35px rgba(0,0,0,0.35);
}

.marco-epico {
    border-color: var(--kc-gold-old);
    box-shadow: 0 20px 50px rgba(200,169,106,0.2);
}

.etiqueta-obra {
    background: rgba(247,240,228,0.94);
    color: var(--kc-navy-base);
    border-top-color: var(--kc-gold-old);
}

/* ── Familia Cards: Linaje ── */
.parents-grid {}

.parent-card {
    background: rgba(247,240,228,0.06);
    border-color: rgba(200,169,106,0.35);
    color: var(--kc-paper-ivory);
    box-shadow: 0 12px 30px rgba(0,0,0,0.2);
}

.parent-card .role {
    color: var(--kc-gold-old);
}

.parent-card strong {
    color: var(--kc-gold-soft);
}

.parent-card p {
    color: rgba(247,240,228,0.7);
}

/* ── Ubicaciones Cards ── */
.tarjeta {
    background: var(--kc-paper-ivory);
    border-color: rgba(200,169,106,0.38);
    color: var(--kc-ink-dark);
    box-shadow: 0 10px 30px rgba(0,0,0,0.25);
}

.tarjeta:hover {
    border-color: var(--kc-gold-old);
    box-shadow: 0 15px 40px rgba(200,169,106,0.18);
}

.tarjeta h3 {
    color: var(--kc-navy-base);
}

.tarjeta .hora {
    color: var(--kc-bronze-aged);
}

.tarjeta p.ubicacion-copy {
    color: rgba(11,16,30,0.75);
}

.svg-icon {
    color: var(--kc-gold-old);
}

/* ── Botón Floral Navy ── */
.btn-floral {
    background: var(--kc-navy-base);
    border-color: rgba(200,169,106,0.45);
    color: var(--kc-paper-ivory);
    box-shadow: 0 6px 18px rgba(5,11,20,0.35);
}

.btn-floral:hover {
    background: var(--kc-gold-old);
    color: var(--kc-navy-obsidian);
    border-color: var(--kc-gold-old);
    box-shadow: 0 10px 28px rgba(200,169,106,0.35);
}

/* ── Dresscode ── */
.seccion-alt.dresscode-section {}

.dc-cardTarjeta {
    background: rgba(247,240,228,0.06);
    border-color: rgba(200,169,106,0.32);
    color: var(--kc-paper-ivory);
}

.dc-cardTarjeta h4 {
    color: var(--kc-gold-soft);
}

.dc-cardTarjeta p {
    color: rgba(247,240,228,0.72);
}

.dresscode-title {
    color: var(--kc-paper-ivory);
}

.aviso-blanco {
    border-color: var(--kc-gold-old);
    color: var(--kc-paper-ivory);
    background: rgba(200,169,106,0.10);
}

/* ── Regalos: La Bóveda ── */
.gift-vault {
    background: linear-gradient(145deg, var(--kc-navy-obsidian), #0d1e42);
    border-color: rgba(200,169,106,0.45);
    box-shadow: 0 24px 65px rgba(5,11,20,0.45);
}

.gift-vault::before {
    border-color: rgba(200,169,106,0.25);
}

.gift-vault h3 {
    color: var(--kc-gold-soft);
}

.gift-vault p {
    color: rgba(247,240,228,0.82);
}

.clabe-box {
    background: rgba(247,240,228,0.07);
    border-color: rgba(200,169,106,0.42);
    color: var(--kc-paper-ivory);
}

/* ── KC-RSVP: Módulo Ceremonial Navy ── */
.kc-rsvp-header {}

.kc-rsvp-titulo {
    color: var(--kc-paper-ivory);
}

.kc-rsvp-titulo em {
    color: var(--kc-gold-old);
}

.kc-rsvp-subcopy {
    color: rgba(247,240,228,0.72);
}

.kc-rsvp-subcopy strong {
    color: var(--kc-paper-ivory);
}

.kc-rsvp-card {
    background: var(--kc-paper-pearl);
    border-color: rgba(200,169,106,0.42);
    box-shadow: 0 20px 60px rgba(5,11,20,0.3);
}

.kc-rsvp-card::before {
    border-color: rgba(200,169,106,0.25);
}

.kc-rsvp-ornament {
    color: var(--kc-gold-old);
}

.campo label {
    color: var(--kc-navy-base);
}

.campo input,
.campo select {
    background: var(--kc-paper-ivory);
    border-color: rgba(200,169,106,0.32);
    color: var(--kc-ink-dark);
}

.campo input:focus,
.campo select:focus {
    border-color: var(--kc-gold-old);
    background: var(--kc-paper-pearl);
    box-shadow: 0 0 15px rgba(200,169,106,0.12);
}

.btn-enviar {
    background: var(--kc-navy-base);
    color: var(--kc-paper-ivory);
    box-shadow: 0 10px 20px rgba(5,11,20,0.35);
}

.btn-enviar:hover:not(:disabled) {
    background: var(--kc-gold-old);
    color: var(--kc-navy-obsidian);
    box-shadow: 0 14px 30px rgba(200,169,106,0.35);
}

.kc-rsvp-saludo {
    background: rgba(200,169,106,0.10);
    border-color: var(--kc-gold-old);
    color: var(--kc-paper-ivory);
}

/* ── Confirmación ── */
.kc-conf-icon {
    color: var(--kc-gold-old);
}

.kc-conf-title {
    color: var(--kc-paper-ivory);
}

.kc-conf-copy {
    color: rgba(247,240,228,0.78);
}

/* ── Ticket VIP: Pase de Alta Sociedad ── */
.kc-ticket {
    background: linear-gradient(155deg, var(--kc-paper-ivory), var(--kc-paper-antique));
    border-color: rgba(200,169,106,0.62);
    box-shadow: 0 18px 55px rgba(5,11,20,0.35), 0 0 0 1px rgba(200,169,106,0.18);
}

.kc-ticket::before {
    border-color: rgba(139,112,67,0.28);
}

.kc-ticket-header {
    background: linear-gradient(135deg, var(--kc-navy-obsidian), var(--kc-navy-base));
}

.kc-ticket-badge {
    color: rgba(200,169,106,0.72);
}

.kc-ticket-novios {
    color: rgba(247,240,228,0.75);
}

.kc-ticket-label {
    color: rgba(100,75,20,0.62);
}

.kc-ticket-nombre {
    color: var(--kc-navy-base);
}

.kc-ticket-pases {
    color: rgba(11,16,30,0.65);
    border-color: rgba(200,169,106,0.42);
    background: rgba(247,240,228,0.55);
}

.kc-ticket-firma {
    color: rgba(100,75,20,0.62);
}

.kc-ticket-brand {
    background: var(--kc-navy-base);
    color: rgba(200,169,106,0.62);
}

.kc-ticket-share-btn {
    color: var(--kc-navy-base);
    border-color: rgba(200,169,106,0.48);
    background: rgba(200,169,106,0.10);
}

.kc-ticket-share-btn:hover {
    background: rgba(200,169,106,0.22);
    border-color: rgba(200,169,106,0.75);
}

/* ── Society Cards (si existen) ── */
.society-card {
    background: rgba(247,240,228,0.05);
    border-color: rgba(200,169,106,0.30);
    color: var(--kc-paper-ivory);
}

.society-card::before {
    border-color: rgba(200,169,106,0.18);
}

.society-card h3,
.society-card h4 {
    color: var(--kc-gold-soft);
}

.society-card p {
    color: rgba(247,240,228,0.72);
}

.regency-sigil {
    color: var(--kc-gold-old);
}

.map-card {
    background: var(--kc-paper-ivory);
    border-color: rgba(200,169,106,0.35);
    color: var(--kc-ink-dark);
}

/* ── Footer Editorial Navy Royale ── */
.kc-footer-editorial {
    background: linear-gradient(160deg, var(--kc-navy-obsidian), #081022);
    color: rgba(200,169,106,0.42);
    border-top-color: rgba(200,169,106,0.22);
}

.kc-footer-divider {
    color: rgba(200,169,106,0.38);
}

.kc-footer-sello {
    color: rgba(247,240,228,0.58);
}

.kc-footer-pareja {
    color: var(--kc-gold-old);
}

.kc-footer-venue {
    color: rgba(200,169,106,0.42);
}

.kc-footer-brand {
    color: rgba(200,169,106,0.35);
    border-color: rgba(200,169,106,0.15);
}

.kc-footer-brand:hover {
    color: rgba(200,169,106,0.8);
    border-color: rgba(200,169,106,0.42);
}

/* ── Anti-shimmer / Anti-pulse cleanup ── */
@keyframes shimmer-gold { 0%,100% { opacity: 1; } }
@keyframes shimmer-carta { 0%,100% { background-position: 0%; } }

.carta-nombres {
    background: linear-gradient(135deg, var(--kc-gold-old), var(--kc-gold-soft), var(--kc-gold-old));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: none;
}

/* Micro-note and overlays */
.micro-note {
    color: rgba(200,169,106,0.5);
}

/* ── Mobile: Preservar todo lo de C-C-R ── */
@media (max-width: 640px) {
    /* Countdown compacto navy */
    .contador { gap: 8px; justify-content: center; }
    .unidad { min-width: 58px; padding: 0 8px 8px; }
    .unidad .numero { font-size: 2.2em; }
    .unidad .etiqueta { font-size: 0.52em; letter-spacing: 2px; }
    /* RSVP section navy en mobile */
    .kc-rsvp-titulo { color: var(--kc-paper-ivory); }
}

/* ════ FIN FASE D-B NAVY ROYALE ════ */


/* ════════════════════════════════════════════════════
   FASE D-B.6 — NAVY TEXTURE POLISH + MUSIC RING
   Khal Calloway Studio · Navy Royale Integration
════════════════════════════════════════════════════ */

/* ── Body texture: grain overlay sutil ── */
body::after {
    content: '';
    position: fixed; inset: 0; pointer-events: none; z-index: 0;
    background-image:
        repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(200,169,106,0.016) 2px, rgba(200,169,106,0.016) 3px),
        repeating-linear-gradient(90deg, transparent, transparent 3px, rgba(11,23,61,0.022) 3px, rgba(11,23,61,0.022) 4px);
    mix-blend-mode: overlay;
    opacity: 1;
}

/* ── Secciones con sfumato zonal ── */
.seccion { position: relative; }
.seccion-alt { position: relative; }
.seccion-inner { position: relative; z-index: 1; }
.seccion::before {
    content: '';
    position: absolute; inset: 0; pointer-events: none; z-index: 0;
    background: radial-gradient(ellipse 80% 55% at 50% 0%, rgba(200,169,106,0.04) 0%, transparent 65%);
}
.seccion-alt::before {
    content: '';
    position: absolute; inset: 0; pointer-events: none; z-index: 0;
    background: radial-gradient(ellipse 70% 50% at 50% 100%, rgba(200,169,106,0.03) 0%, transparent 65%);
}

/* ── Hero card — marco editorial doble ── */
.portada-card {
    outline: 1px solid rgba(200,169,106,0.20);
    outline-offset: 7px;
}
.portada-card::after {
    content: '';
    position: absolute; inset: -11px;
    border: 1px solid rgba(200,169,106,0.10);
    border-radius: 4px;
    pointer-events: none;
}

/* ── Carta / Sobre: pergamino enriquecido ── */
.sobre-papel {
    background: linear-gradient(
        135deg,
        #fdf5dc 0%, #f8e8b0 18%, #fdf3d8 35%,
        #f0d888 52%, #faf2db 68%, #ecdfa0 82%, #fdf5dc 100%
    ) !important;
}
.sobre-frente {
    box-shadow:
        0 0 0 1px rgba(200,169,106,0.35),
        0 0 0 4px rgba(200,169,106,0.09),
        inset 0 1px 0 rgba(255,245,200,0.65),
        inset 0 -1px 0 rgba(140,100,20,0.16),
        0 26px 72px rgba(0,0,0,0.75),
        0 6px 20px rgba(0,0,0,0.48) !important;
}

/* ── Countdown: relojería elegante con separadores ── */
.contador {
    border-top: 1px solid rgba(200,169,106,0.18) !important;
    border-bottom: 1px solid rgba(200,169,106,0.18) !important;
    padding: 18px 0 !important;
    margin: 0 auto !important;
    max-width: 380px;
}
.unidad + .unidad {
    border-left: 1px solid rgba(200,169,106,0.20);
    margin-left: 4px;
    padding-left: 16px;
}

/* ── FIX CONTRASTE — Guardar Pase (OBLIGATORIO) ── */
.kc-ticket-share-btn {
    color: var(--kc-paper-ivory) !important;
    background: rgba(11,23,61,0.88) !important;
    border: 1px solid rgba(200,169,106,0.58) !important;
    font-weight: 600 !important;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    font-size: 0.72em;
    padding: 10px 22px;
    border-radius: 25px;
    cursor: pointer;
    transition: background 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}
.kc-ticket-share-btn:hover,
.kc-ticket-share-btn:focus {
    background: var(--kc-gold-old) !important;
    color: var(--kc-navy-obsidian) !important;
    border-color: var(--kc-gold-old) !important;
    outline: none;
}

/* ════════════════════════════════════════════════════
   MUSIC RING — KC Float Button (Navy Royale Variant)
   Adaptado desde KC-Style-Kit v2 · Clases aisladas
════════════════════════════════════════════════════ */

@keyframes kc-rotate-ring { 0%{transform:rotate(0deg)} 100%{transform:rotate(360deg)} }
@keyframes kc-breath-ring  { 0%{opacity:.3;transform:scale(.9)} 100%{opacity:.72;transform:scale(1.18)} }
@keyframes kc-bar-dance    { 0%{height:3px;opacity:.45} 100%{opacity:1} }

#kc-float {
    position: fixed;
    bottom: clamp(18px,3vh,30px); right: clamp(18px,3vw,28px);
    z-index: 8500;
    width: 48px; height: 48px;
    display: flex; align-items: center; justify-content: center;
    cursor: pointer; border: none; background: none; padding: 0;
    outline: none; -webkit-tap-highlight-color: transparent;
    opacity: 0; transform: translateY(22px);
    transition: opacity .65s ease, transform .65s cubic-bezier(.34,1.56,.64,1);
    pointer-events: none;
}
#kc-float.visible { opacity: 1; transform: translateY(0); pointer-events: auto; }

.kc-float-bg {
    position: absolute; inset: 0; border-radius: 50%;
    background: rgba(5,11,20,0.90);
    border: 1px solid rgba(200,169,106,0.35);
    backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
    transition: border-color .4s, box-shadow .4s, background .4s, transform .15s;
}
#kc-float:hover .kc-float-bg {
    border-color: rgba(200,169,106,0.68);
    box-shadow: 0 4px 22px rgba(0,0,0,.55), 0 0 28px rgba(200,169,106,0.14);
    background: rgba(5,11,20,0.96);
}
#kc-float:active .kc-float-bg { transform: scale(.91); }

.kc-float-glow {
    position: absolute; inset: -10px; border-radius: 50%; pointer-events: none;
    background: radial-gradient(circle, rgba(200,169,106,0.20) 0%, transparent 70%);
    opacity: 0; transition: opacity .8s;
    animation: kc-breath-ring 3s ease-in-out infinite alternate;
}
#kc-float.is-playing .kc-float-glow { opacity: 1; }
#kc-float:not(.is-playing) .kc-float-glow { opacity: .10; animation-play-state: paused; }

.kc-ring {
    position: absolute; border-radius: 50%;
    transition: border-color .4s, box-shadow .4s;
}
.kc-ring--boda {
    inset: -9px;
    border: 1.5px dashed rgba(200,169,106,0.48);
    animation: kc-rotate-ring 22s linear infinite;
    box-shadow: 0 0 10px rgba(200,169,106,0.10);
}
.kc-ring--boda::before {
    content: '';
    position: absolute; top: -3px; left: 50%; transform: translateX(-50%);
    width: 5px; height: 5px; border-radius: 50%;
    background: var(--kc-gold-old, #C8A96A);
    box-shadow: 0 0 8px 3px rgba(200,169,106,0.55), 0 0 18px 6px rgba(200,169,106,0.18);
}
#kc-float:not(.is-playing) .kc-ring--boda {
    animation-play-state: paused;
    border-color: rgba(200,169,106,0.14); box-shadow: none;
}
#kc-float:not(.is-playing) .kc-ring--boda::before { opacity: .18; box-shadow: none; }
#kc-float:hover .kc-ring--boda {
    border-color: rgba(200,169,106,0.80);
    box-shadow: 0 0 18px rgba(200,169,106,0.28);
}

.kc-float-letter {
    position: relative; z-index: 2;
    font-family: 'Cormorant Garamond', serif;
    font-size: .82em; font-style: italic;
    color: var(--kc-gold-old, #C8A96A);
    letter-spacing: 1px; line-height: 1;
    transition: color .3s, transform .3s cubic-bezier(.34,1.56,.64,1);
    user-select: none;
}
#kc-float:hover .kc-float-letter { color: var(--kc-paper-ivory, #F7F0E4); transform: scale(1.08); }
#kc-float:not(.is-playing) .kc-float-letter { color: rgba(200,169,106,0.38); }

.kc-bars {
    position: absolute; bottom: 6px; left: 50%; transform: translateX(-50%);
    display: flex; gap: 1.5px; z-index: 3;
}
.kc-bar {
    width: 3px; border-radius: 2px;
    background: linear-gradient(to top, var(--kc-navy-surface,#10285C), var(--kc-gold-old,#C8A96A));
    animation: kc-bar-dance var(--d,.4s) ease-in-out infinite alternate;
    box-shadow: 0 0 4px rgba(200,169,106,0.30);
}
.kc-bar:nth-child(1) { height:6px; --d:.35s; }
.kc-bar:nth-child(2) { height:9px; --d:.25s; animation-delay:.1s; }
.kc-bar:nth-child(3) { height:5px; --d:.4s;  animation-delay:.2s; }
#kc-float:not(.is-playing) .kc-bar { animation-play-state:paused; opacity:.18; height:3px !important; }

@media (prefers-reduced-motion: reduce) {
    .kc-ring--boda, .kc-float-glow, .kc-bar { animation: none !important; }
}
@media (max-width: 480px) {
    #kc-float { bottom:16px; right:16px; width:44px; height:44px; }
}

/* ════ FIN FASE D-B.6 ════ */

/* ── D-B.6-R MICRO-FIX: Ring position en viewports muy estrechos ── */
@media (max-width: 390px) {
    #kc-float {
        bottom: 14px;
        right: 14px;
        width: 42px;
        height: 42px;
    }
    /* Asegurar que el ring nunca bloquee interacciones del RSVP */
    #kc-float:not(.visible) {
        pointer-events: none !important;
        opacity: 0 !important;
    }
}
/* Guardar Pase: padding-bottom en sección RSVP para clearance del ring */
#rsvp .kc-ticket-share {
    padding-bottom: 12px;
}
/* ── FIN D-B.6-R MICRO-FIX ── */


/* ════════════════════════════════════════════════════
   FASE D-B.7 — NAVY PAPER TEXTURE + SECTION DIVIDERS
   + TAP HIGHLIGHT FIX
   Khal Calloway Studio · Navy Royale Micro-Polish
════════════════════════════════════════════════════ */

/* ══ 1. TAP HIGHLIGHT FIX — Eliminar flash azul mobile ══ */
.sobre-scene,
.sobre-scene *,
.sello-wrap,
.sello-wrap *,
.lacre,
.sello-lacre,
.borla,
.cortina,
.cortina-izq,
.cortina-der,
.kc-float,
.kc-float *,
.portada-card,
.portada-scroll,
.scroll-arrow,
.lw-letrero-titulo,
button,
a,
[role="button"],
[onclick] {
    -webkit-tap-highlight-color: transparent;
}

.sobre-scene,
.sello-wrap,
.portada-scroll,
.kc-float,
.btn-floral,
.btn-enviar {
    touch-action: manipulation;
}

/* user-select:none solo en elementos decorativos del gate */
.sobre-scene,
.sello-wrap,
.borla,
.cortina,
.lw-letrero-titulo,
.lw-letrero-linea,
.kc-float,
.kc-ring,
.kc-float-letter,
.kc-bars {
    user-select: none;
    -webkit-user-select: none;
}
/* JAMÁS aplicar en inputs, CLABE, textos de lectura */


/* ══ 2. NAVY PAPER TEXTURE — Fondos con profundidad ══ */

/* Textura global body: capas de fibra de lino sobre negro tinta */
body {
    background-image:
        repeating-linear-gradient(
            0deg,
            transparent 0px,
            transparent 3px,
            rgba(200,169,106,0.028) 3px,
            rgba(200,169,106,0.028) 4px
        ),
        repeating-linear-gradient(
            90deg,
            transparent 0px,
            transparent 4px,
            rgba(11,23,61,0.035) 4px,
            rgba(11,23,61,0.035) 5px
        ),
        linear-gradient(160deg, #070e1e 0%, #050B14 50%, #030810 100%);
    background-attachment: fixed;
}

/* Textura por sección oscura: sfumato + micro-grain */
.seccion,
.seccion-alt {
    background-image:
        radial-gradient(ellipse 75% 50% at 50% 0%, rgba(200,169,106,0.055) 0%, transparent 65%),
        radial-gradient(ellipse 60% 40% at 50% 100%, rgba(11,23,61,0.08) 0%, transparent 65%),
        repeating-linear-gradient(
            45deg,
            transparent 0px,
            transparent 8px,
            rgba(200,169,106,0.012) 8px,
            rgba(200,169,106,0.012) 9px
        );
}

/* Sección alternada (oscura): tinta más profunda */
.seccion-alt {
    background-image:
        radial-gradient(ellipse 80% 55% at 30% 50%, rgba(200,169,106,0.04) 0%, transparent 60%),
        radial-gradient(ellipse 60% 40% at 80% 50%, rgba(11,23,61,0.06) 0%, transparent 60%),
        repeating-linear-gradient(
            -45deg,
            transparent 0px,
            transparent 10px,
            rgba(200,169,106,0.010) 10px,
            rgba(200,169,106,0.010) 11px
        );
}


/* ══ 3. PAPER / IVORY CARD TEXTURE ══ */

/* Cards de papel — textura de papel verjurado */
.tarjeta,
.parent-card {
    background-image:
        repeating-linear-gradient(
            0deg,
            transparent 0px,
            transparent 18px,
            rgba(139,112,67,0.06) 18px,
            rgba(139,112,67,0.06) 19px
        ),
        repeating-linear-gradient(
            90deg,
            transparent 0px,
            transparent 22px,
            rgba(200,169,106,0.04) 22px,
            rgba(200,169,106,0.04) 23px
        );
    background-blend-mode: multiply;
}

/* RSVP card: textura de papelería */
.kc-rsvp-card {
    background-image:
        repeating-linear-gradient(
            0deg,
            transparent 0px,
            transparent 22px,
            rgba(139,112,67,0.05) 22px,
            rgba(139,112,67,0.05) 23px
        );
    background-blend-mode: multiply;
}

/* Gift vault: textura de cuero/tela oscura */
.gift-vault {
    background-image:
        repeating-linear-gradient(
            135deg,
            transparent 0px,
            transparent 12px,
            rgba(200,169,106,0.04) 12px,
            rgba(200,169,106,0.04) 13px
        ) !important;
}


/* ══ 4. SECTION DIVIDERS — Separadores premium ══ */

/* Separador superior en cada sección: línea dorada degradada */
section.seccion::before,
section.seccion-alt::before {
    content: '';
    display: block;
    position: relative;
    width: 100%;
    height: 1px;
    background: linear-gradient(
        to right,
        transparent 0%,
        rgba(200,169,106,0.18) 15%,
        rgba(200,169,106,0.55) 50%,
        rgba(200,169,106,0.18) 85%,
        transparent 100%
    );
    margin: 0;
    z-index: 1;
}

/* Eliminar borde superior en primera sección */
section.seccion:first-of-type::before,
section.seccion-alt:first-of-type::before {
    display: none;
}

/* fdivisor: upgrading ornamento central existente */
.fdivisor {
    position: relative;
    gap: 18px !important;
    margin: 14px auto 44px !important;
}

.fdivisor::before,
.fdivisor::after {
    height: 1px !important;
    max-width: 120px !important;
    background: linear-gradient(
        to right,
        transparent,
        rgba(200,169,106,0.65),
        rgba(200,169,106,0.85)
    ) !important;
}

.fdivisor::after {
    background: linear-gradient(
        to left,
        transparent,
        rgba(200,169,106,0.65),
        rgba(200,169,106,0.85)
    ) !important;
}

.fdivisor span {
    font-size: 1.2em !important;
    color: var(--kc-gold-old) !important;
    opacity: 0.82;
    letter-spacing: 8px;
}

/* Añadir línea secundaria más fina bajo cada fdivisor */
.fdivisor + * {
    border-top: 0 !important;
}


/* ══ 5. HERO / PORTADA CARD DEPTH ══ */

.portada-card {
    /* Textura interna de papel fino */
    background-image:
        radial-gradient(ellipse 80% 60% at 50% 30%, rgba(16,40,92,0.75) 0%, rgba(5,11,20,0.90) 100%),
        repeating-linear-gradient(
            45deg,
            transparent 0px,
            transparent 14px,
            rgba(200,169,106,0.018) 14px,
            rgba(200,169,106,0.018) 15px
        ) !important;
}

/* Borde doble interno mejorado */
.portada-card::before {
    border-color: rgba(200,169,106,0.28) !important;
    inset: 8px !important;
}

/* Segunda línea de borde exterior ultra-fina */
.portada-card {
    outline: none !important;
    box-shadow:
        0 0 0 1px rgba(200,169,106,0.18),
        0 0 0 7px rgba(200,169,106,0.05),
        0 0 0 8px rgba(200,169,106,0.16),
        0 30px 80px rgba(0,0,0,0.65),
        inset 0 1px 0 rgba(255,255,255,0.04) !important;
}

/* Ornamento en esquinas del hero: pseudo-elemento posicionado */
.portada-card::after {
    content: '';
    position: absolute;
    inset: -12px;
    border: 1px solid rgba(200,169,106,0.10);
    border-radius: 4px;
    pointer-events: none;
    z-index: 0;
}


/* ══ 6. SOBRE / CARTA: micro-polish ══ */

/* Ya tiene pergamino bueno de D-B.6; añadir verjurado horizontal */
.sobre-papel::before {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        repeating-linear-gradient(
            0deg,
            transparent 0px,
            transparent 20px,
            rgba(180,145,60,0.07) 20px,
            rgba(180,145,60,0.07) 21px
        );
    z-index: 0;
    border-radius: inherit;
}


/* ══ 7. MOBILE GUARDRAILS: texturas sin overflow ══ */

@media (max-width: 640px) {
    body {
        background-attachment: scroll; /* evitar lag en iOS */
    }

    section.seccion::before,
    section.seccion-alt::before {
        height: 1px;
    }

    .fdivisor {
        margin: 8px auto 28px !important;
    }

    .fdivisor::before,
    .fdivisor::after {
        max-width: 70px !important;
    }

    /* Textura en tarjetas mobile: más liviana */
    .tarjeta,
    .parent-card {
        background-image:
            repeating-linear-gradient(
                0deg,
                transparent 0px,
                transparent 20px,
                rgba(139,112,67,0.04) 20px,
                rgba(139,112,67,0.04) 21px
            );
    }
}

/* ════ FIN FASE D-B.7 ════ */


/* ════════════════════════════════════════════════════
   FASE E — TICKET / QR / iOS HARDENING
   Khal Calloway Studio · UI States & Capture Clean
════════════════════════════════════════════════════ */

/* ── Botón Guardar Pase: estados de captura ── */
.kc-ticket-share-btn.kc-capture-loading {
    background: rgba(11,23,61,0.92) !important;
    color: rgba(247,240,228,0.65) !important;
    border-color: rgba(200,169,106,0.28) !important;
    cursor: wait !important;
    letter-spacing: 0.5px;
}

.kc-ticket-share-btn.kc-capture-success {
    background: rgba(34,90,50,0.85) !important;
    color: var(--kc-paper-ivory, #F7F0E4) !important;
    border-color: rgba(80,180,100,0.55) !important;
}

.kc-ticket-share-btn.kc-capture-error {
    background: rgba(60,20,20,0.80) !important;
    color: var(--kc-paper-ivory, #F7F0E4) !important;
    border-color: rgba(200,80,80,0.45) !important;
}

/* ── Mensaje de fallback elegante ── */
.kc-capture-notice {
    margin-top: 10px;
    font-size: 0.74em;
    color: rgba(247,240,228,0.70);
    line-height: 1.5;
    text-align: center;
    font-style: italic;
    padding: 0 8px;
}

/* ── Modo captura en body: aislar UI fija ── */
/* El ring flotante NO aparece en la captura porque se captura solo #kc-ticket */
/* body.is-capturing-ticket pausa animaciones para reducir riesgo de artefactos */
body.is-capturing-ticket #kc-float {
    visibility: hidden !important;
    pointer-events: none !important;
}

body.is-capturing-ticket .kc-ring--boda,
body.is-capturing-ticket .kc-float-glow,
body.is-capturing-ticket .kc-bar {
    animation-play-state: paused !important;
}

/* ── Ticket: garantizar que no tiene filtros que rompan captura ── */
.kc-ticket,
.kc-ticket * {
    /* PROHIBIDO: backdrop-filter, filter, mix-blend-mode dentro del ticket */
    /* solo confirmamos que el background sea sólido para captura */
}

.kc-ticket {
    /* El bgcolor del toPng es #F7F0E4 — alinear por si acaso */
    background-color: var(--kc-paper-ivory, #F7F0E4);
}

/* ── Mobile: notice text legible en pantallas pequeñas ── */
@media (max-width: 640px) {
    .kc-capture-notice {
        font-size: 0.70em;
        padding: 0 12px;
    }

    .kc-ticket-share-btn {
        font-size: 0.68em !important;
        padding: 10px 18px !important;
    }
}

/* ════ FIN FASE E ════ */