/* Portada, preloader y decoración premium */
.portada {
            position: relative;
            min-height: 100svh;
            display: flex;
            justify-content: center;
            align-items: center;
            padding: 35px 20px;
            overflow: hidden;
        }

.marco {
            position: absolute;
            inset: 14px;
            border: 1px solid rgba(211, 166, 79, 0.48);
            pointer-events: none;
        }

.marco::before,
        .marco::after {
            content: "✦";
            position: absolute;
            left: 50%;
            padding: 0 10px;
            color: var(--dorado);
            background: rgba(255, 245, 245, 0.9);
            transform: translateX(-50%);
        }

.marco::before {
            top: -11px;
        }

.marco::after {
            bottom: -11px;
        }

.circulo {
            position: absolute;
            width: 760px;
            height: 760px;
            border: 1px solid rgba(211, 166, 79, 0.25);
            border-radius: 50%;
            pointer-events: none;
        }

.circulo-izquierdo {
            top: -510px;
            left: -330px;
        }

.circulo-derecho {
            right: -410px;
            bottom: -440px;
        }

.particulas {
            position: absolute;
            inset: 0;
            overflow: hidden;
            pointer-events: none;
        }

.particula {
            position: absolute;
            bottom: -20px;
            width: 4px;
            height: 4px;
            border-radius: 50%;
            opacity: 0;
            background: var(--dorado);
            box-shadow: 0 0 10px rgba(211, 166, 79, 0.9);
            animation: flotar 8s linear infinite;
        }

.particula:nth-child(1) {
            left: 7%;
            animation-delay: 0s;
        }

.particula:nth-child(2) {
            left: 22%;
            animation-delay: 1.5s;
        }

.particula:nth-child(3) {
            left: 39%;
            animation-delay: 3s;
        }

.particula:nth-child(4) {
            left: 59%;
            animation-delay: 0.7s;
        }

.particula:nth-child(5) {
            left: 78%;
            animation-delay: 2.4s;
        }

.particula:nth-child(6) {
            left: 92%;
            animation-delay: 4.2s;
        }

.contenido {
            position: relative;
            z-index: 5;
            width: min(100%, 960px);
            text-align: center;
        }

.corona {
            margin-bottom: 3px;
            color: var(--dorado);
            font-size: clamp(38px, 6vw, 62px);
            line-height: 1;
        }

.mis-xv {
            font-family: "Cormorant Garamond", serif;
            font-size: clamp(17px, 2.5vw, 26px);
            letter-spacing: 0.34em;
            text-transform: uppercase;
        }

.nombre {
            margin-top: -7px;
            color: var(--rosa-oscuro);
            font-family: "Great Vibes", cursive;
            font-size: clamp(78px, 12vw, 142px);
            font-weight: 400;
            line-height: 0.95;

            text-shadow:
                0 3px 0 rgba(255, 255, 255, 0.8),
                0 13px 28px rgba(121, 71, 75, 0.13);
        }

.mensaje-superior {
            margin-top: 10px;
            margin-bottom: 25px;
            font-family: "Cormorant Garamond", serif;
            font-size: clamp(20px, 3vw, 29px);
            font-style: italic;
        }

.portada {
            isolation: isolate;
            background:
                radial-gradient(circle at 18% 16%, rgba(255,255,255,.96) 0 9%, transparent 28%),
                radial-gradient(circle at 82% 18%, rgba(238,177,190,.34) 0 12%, transparent 34%),
                radial-gradient(circle at 12% 78%, rgba(255,228,232,.72) 0 10%, transparent 30%),
                radial-gradient(circle at 86% 82%, rgba(225,164,180,.24) 0 12%, transparent 32%),
                linear-gradient(145deg, #fffaf9 0%, #f8dfe3 45%, #fff7f3 100%);
        }

.portada::before {
            content: "";
            position: absolute;
            inset: 0;
            z-index: -3;
            pointer-events: none;
            opacity: .55;
            background-image:
                repeating-radial-gradient(circle at 30% 30%, rgba(255,255,255,.28) 0 1px, transparent 1px 4px),
                linear-gradient(118deg, transparent 0 38%, rgba(255,255,255,.22) 42%, transparent 47% 100%);
            mix-blend-mode: soft-light;
        }

.portada::after {
            content: "";
            position: absolute;
            inset: 0;
            z-index: -2;
            pointer-events: none;
            background:
                radial-gradient(ellipse at 50% 52%, rgba(255,255,255,.55), transparent 46%),
                linear-gradient(to bottom, rgba(255,255,255,.12), rgba(151,84,101,.04));
        }

.decoracion-premium {
            position: absolute;
            inset: 0;
            z-index: 1;
            overflow: hidden;
            pointer-events: none;
        }

.floral {
            position: absolute;
            width: clamp(230px, 28vw, 430px);
            height: auto;
            opacity: .92;
            filter: drop-shadow(0 16px 24px rgba(115,67,78,.16));
        }

.floral-superior {
            top: -46px;
            left: -28px;
            transform: rotate(-8deg);
        }

.floral-inferior {
            right: -42px;
            bottom: -70px;
            transform: rotate(172deg) scale(.95);
        }

.floral .petalo { fill: #f2c7cf; }

.floral .petalo-claro { fill: #f9e7e9; }

.floral .centro { fill: #d3a64f; }

.floral .hoja { fill: #c8b7a1; opacity: .65; }

.floral .tallo { stroke: #c4a56a; stroke-width: 2; fill: none; opacity: .72; }

.mariposa {
            position: absolute;
            width: clamp(28px, 3vw, 46px);
            color: rgba(190,120,137,.75);
            filter: drop-shadow(0 8px 8px rgba(120,70,82,.18));
            animation: vueloMariposa 7s ease-in-out infinite;
        }

.mariposa svg { width: 100%; height: auto; display: block; }

.mariposa-1 { top: 18%; right: 10%; animation-delay: 0s; }

.mariposa-2 { top: 34%; left: 8%; transform: scale(.8) rotate(-14deg); animation-delay: 1.8s; }

.mariposa-3 { bottom: 18%; right: 18%; transform: scale(.65) rotate(14deg); animation-delay: 3.2s; }

.destello-premium {
            position: absolute;
            color: rgba(211,166,79,.75);
            text-shadow: 0 0 16px rgba(211,166,79,.58);
            animation: titilar 2.8s ease-in-out infinite;
        }

.halo-sobre {
            position: absolute;
            left: 50%;
            bottom: 62px;
            width: min(780px, 92vw);
            height: 330px;
            transform: translateX(-50%);
            border-radius: 50%;
            background: radial-gradient(ellipse, rgba(255,255,255,.62), transparent 68%);
            filter: blur(18px);
            opacity: .75;
        }

.contenido {
            z-index: 4;
        }

body.preloading { overflow: hidden; }

.preloader {
            position: fixed;
            inset: 0;
            z-index: 9999;
            display: grid;
            place-items: center;
            background:
                radial-gradient(circle at 50% 42%, rgba(255,255,255,.98), rgba(253,235,238,.96) 48%, #f7d8de 100%);
            transition: opacity .85s ease, visibility .85s ease;
        }

.preloader.oculto {
            opacity: 0;
            visibility: hidden;
            pointer-events: none;
        }

.preloader-inner {
            position: relative;
            width: 190px;
            height: 190px;
            display: grid;
            place-items: center;
        }

.preloader-ring,
        .preloader-ring::before,
        .preloader-ring::after {
            position: absolute;
            inset: 0;
            border-radius: 50%;
            content: "";
        }

.preloader-ring {
            border: 1px solid rgba(211,166,79,.45);
            animation: girarLento 8s linear infinite;
        }

.preloader-ring::before {
            inset: 12px;
            border: 1px dashed rgba(180,111,117,.25);
            animation: girarLento 11s linear infinite reverse;
        }

.preloader-ring::after {
            inset: 27px;
            border: 1px solid rgba(211,166,79,.22);
        }

.preloader-monograma {
            position: relative;
            z-index: 2;
            font-family: "Great Vibes", cursive;
            font-size: 86px;
            color: var(--rosa-oscuro);
            text-shadow: 0 8px 28px rgba(134,82,87,.18);
            animation: respirarMonograma 2.2s ease-in-out infinite;
        }

.preloader-subtitulo {
            position: absolute;
            top: calc(50% + 58px);
            left: 50%;
            width: 260px;
            transform: translateX(-50%);
            font-family: "Cormorant Garamond", serif;
            font-size: 13px;
            letter-spacing: .34em;
            text-transform: uppercase;
            color: rgba(134,82,87,.72);
        }

.portada::before {
            background-image:
                repeating-radial-gradient(circle at 30% 30%, rgba(255,255,255,.25) 0 1px, transparent 1px 4px),
                repeating-linear-gradient(12deg, rgba(125,75,87,.018) 0 1px, transparent 1px 5px),
                linear-gradient(118deg, transparent 0 38%, rgba(255,255,255,.23) 42%, transparent 47% 100%);
        }

.portada-luz-central {
            position: absolute;
            left: 50%;
            top: 43%;
            width: min(900px, 90vw);
            height: min(650px, 70vh);
            transform: translate(-50%, -50%);
            border-radius: 50%;
            background: radial-gradient(ellipse, rgba(255,255,255,.72), rgba(255,255,255,.18) 48%, transparent 72%);
            filter: blur(7px);
            pointer-events: none;
            z-index: 0;
        }

.nombre {
            position: relative;
            display: inline-block;
        }

.nombre::after {
            content: "";
            position: absolute;
            left: 12%;
            right: 8%;
            bottom: 3px;
            height: 1px;
            background: linear-gradient(90deg, transparent, rgba(211,166,79,.75), transparent);
            transform: scaleX(.75);
            opacity: .75;
        }

.mis-xv {
            color: rgba(113,71,77,.92);
            text-shadow: 0 1px 0 rgba(255,255,255,.85);
        }

.mensaje-superior {
            color: rgba(113,71,77,.88);
            text-shadow: 0 1px 0 rgba(255,255,255,.8);
        }

/* Recursos gráficos premium */
.portada::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background-image:
        linear-gradient(rgba(255,248,247,.70), rgba(255,239,242,.60)),
        url("../assets/fondos/textura-papel.svg");
    background-size: auto, 520px 520px;
    mix-blend-mode: soft-light;
    opacity: .62;
    pointer-events: none;
}

.floral-asset {
    position: absolute;
    width: clamp(270px, 38vw, 570px);
    height: auto;
    pointer-events: none;
    user-select: none;
    filter: saturate(.9) drop-shadow(0 18px 22px rgba(111,72,77,.13));
}
.floral-asset-superior { top: -78px; left: -85px; transform: rotate(-5deg); }
.floral-asset-inferior { right: -100px; bottom: -105px; transform: rotate(174deg); opacity: .9; }

.mariposa-asset {
    position: absolute;
    width: clamp(34px, 5vw, 70px);
    height: auto;
    pointer-events: none;
    filter: drop-shadow(0 8px 8px rgba(108,66,72,.2));
    animation: vueloMariposa 6.5s ease-in-out infinite;
}
.mariposa-asset-1 { top: 17%; right: 14%; transform: rotate(12deg); }
.mariposa-asset-2 { top: 40%; left: 8%; width: clamp(27px, 4vw, 54px); animation-delay: -2s; transform: rotate(-18deg); }
.mariposa-asset-3 { right: 8%; bottom: 17%; width: clamp(24px, 3.4vw, 48px); animation-delay: -4.1s; transform: rotate(28deg); }

.destello-asset {
    position: absolute;
    width: 19px;
    height: 19px;
    opacity: .45;
    animation: titilar 3.8s ease-in-out infinite;
}
.destello-asset-1 { top: 25%; left: 20%; }
.destello-asset-2 { top: 31%; right: 24%; width: 12px; animation-delay: -1.1s; }
.destello-asset-3 { bottom: 24%; left: 17%; width: 14px; animation-delay: -2.2s; }
.destello-asset-4 { right: 18%; bottom: 30%; width: 22px; animation-delay: -.6s; }

.corona-svg {
    display: block;
    width: clamp(72px, 9vw, 120px);
    height: auto;
    margin: 0 auto 2px;
    object-fit: contain;
}

/* Composicion editorial definitiva de la portada */
.portada {
    min-height: 100svh;
    padding: clamp(24px, 3.4vh, 38px) 20px 18px;
}

.portada::after {
    background:
        radial-gradient(ellipse at 50% 46%, rgba(255,255,255,.72), transparent 43%),
        linear-gradient(90deg, rgba(122,70,82,.035), transparent 12% 88%, rgba(122,70,82,.035)),
        linear-gradient(to bottom, rgba(255,255,255,.12), rgba(151,84,101,.055));
}

.marco {
    inset: 14px;
    border-color: rgba(190,143,63,.50);
    box-shadow: inset 0 0 0 5px rgba(255,255,255,.20);
    z-index: 8;
}

.marco::before,
.marco::after {
    font-size: 15px;
    text-shadow: 0 0 12px rgba(211,166,79,.45);
}

.contenido {
    width: min(100%, 900px);
    display: flex;
    flex-direction: column;
    align-items: center;
}

.corona-svg {
    width: clamp(64px, 7vw, 92px);
    filter: drop-shadow(0 7px 8px rgba(113,66,44,.18));
}

.mis-xv {
    font-size: clamp(15px, 1.75vw, 22px);
    letter-spacing: .42em;
}

.nombre {
    margin-top: -9px;
    font-size: clamp(76px, 9vw, 122px);
    text-shadow:
        0 2px 0 rgba(255,255,255,.9),
        0 10px 24px rgba(121,71,75,.16);
}

.mensaje-superior {
    margin: 4px 0 clamp(8px, 1.6vh, 17px);
    font-size: clamp(19px, 2vw, 26px);
}

.floral-asset {
    width: clamp(260px, 32vw, 470px);
    opacity: .88;
    filter: saturate(.72) contrast(.97) drop-shadow(0 18px 28px rgba(111,72,77,.15));
}

.floral-asset-superior {
    top: -82px;
    left: -66px;
    transform: rotate(-9deg);
}

.floral-asset-inferior {
    right: -75px;
    bottom: -92px;
    transform: rotate(171deg) scale(.92);
    opacity: .80;
}

.mariposa-asset {
    opacity: .78;
    filter: saturate(.78) drop-shadow(0 7px 8px rgba(108,66,72,.18));
}

.mariposa-asset-1 { top: 18%; right: 12%; }
.mariposa-asset-2 { top: 44%; left: 7%; }
.mariposa-asset-3 { right: 9%; bottom: 16%; }

.halo-sobre {
    bottom: 24px;
    height: 270px;
    background: radial-gradient(ellipse, rgba(255,255,255,.82), rgba(255,245,244,.28) 48%, transparent 70%);
    filter: blur(14px);
}
