/* Plantilla Inauguración Glamour: negro y dorado con brillo de neón, globos, foto en aro de luz.
 * Sirve para cualquier negocio (salón, barbería, boutique, spa, uñas...). */
:root {
  --primario: #d4af37;
  --acento: #e6c46a;
  --fondo: #0b0a08;
  --superficie: #16130e;
  --texto: #f3ead7;
  --texto-suave: #b9ab8c;
  --oro: linear-gradient(180deg, #fff3c4 0%, #ecc15e 45%, #b88427 100%);
  --brillo: 0 0 14px rgb(240 196 96 / .55);
  --fuente-lujo: 'Cinzel', 'Cormorant Garamond', Georgia, serif;
  --radio: 14px;
  color-scheme: dark;
}

/* Partículas doradas y marco fino alrededor de la pantalla */
body {
  background:
    radial-gradient(circle, rgb(240 200 110 / .55) 0 1px, transparent 2px) 0 0 / 70px 70px,
    radial-gradient(circle, rgb(240 200 110 / .3) 0 1.5px, transparent 2.5px) 35px 20px / 130px 130px,
    radial-gradient(ellipse at 50% 0%, #2a2112, transparent 60%),
    var(--fondo);
}
body::before {
  content: ''; position: fixed; inset: 8px; z-index: 30; pointer-events: none;
  border: 1px solid rgb(230 196 106 / .45); border-radius: 4px;
  box-shadow: inset 0 0 18px rgb(230 196 106 / .12);
}

/* ---------- Sobre ---------- */
.sobre { background: radial-gradient(circle at 50% 40%, #2a2112, var(--fondo) 70%); }
.sobre__cuerpo { background: #151209; border: 1px solid rgb(230 196 106 / .6); box-shadow: 0 0 30px rgb(230 196 106 / .25); }
.sobre__cuerpo::after { opacity: .35; }
.sobre__solapa { background: #1f1a10; }
.sobre__sello { background: var(--oro); color: #1a1408; font: 700 26px var(--fuente-lujo); box-shadow: var(--brillo); }
.sobre__titulo { color: var(--acento); }
.sobre__nombre {
  font: 700 38px/1.1 var(--fuente-lujo);
  background: var(--oro); -webkit-background-clip: text; background-clip: text; color: transparent;
}

/* ---------- Portada: foto en aro de neón, globos y nombre dorado ---------- */
.portada {
  flex-direction: column; align-items: center; justify-content: center; gap: 26px;
  padding: 70px 16px 96px;
  background: radial-gradient(circle at 50% 30%, #2b2213, var(--fondo) 70%);
}
.portada__velo { display: none; }
.portada__foto {
  position: relative; inset: auto; flex: none;
  width: min(62vw, 260px); aspect-ratio: 1; border-radius: 50%;
  animation: none;
  box-shadow:
    0 0 0 3px #f6d98a,
    0 0 18px 6px rgb(246 217 138 / .65),
    0 0 60px 18px rgb(212 175 55 / .3);
}
.portada__texto { display: flex; flex-direction: column; align-items: center; }
.portada__nombre {
  order: 1;
  font: 800 clamp(44px, 13vw, 78px)/1 var(--fuente-lujo); letter-spacing: .04em;
  background: var(--oro); -webkit-background-clip: text; background-clip: text; color: transparent;
  filter: drop-shadow(0 0 10px rgb(240 190 80 / .45));
}
.portada__eslogan { order: 2; color: var(--acento); font-size: 26px; }
.portada__titulo {
  order: 3; margin-top: 14px;
  font: 400 clamp(50px, 15vw, 76px)/1.1 var(--fuente-script); letter-spacing: 0; text-transform: none;
  color: #f6d98a; text-shadow: var(--brillo);
}
.portada__fecha { order: 4; color: var(--texto); letter-spacing: .12em; text-transform: uppercase; font-size: 13px; }
.adorno--portada { order: 0; }

/* Globos dorados y negros con serpentina en las esquinas superiores */
.portada::before, .portada::after {
  content: ''; position: absolute; top: 0; width: 120px; height: 210px; pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 210'%3E%3Cdefs%3E%3CradialGradient id='o' cx='.35' cy='.3'%3E%3Cstop offset='0' stop-color='%23fff2c0'/%3E%3Cstop offset='.5' stop-color='%23e2b04a'/%3E%3Cstop offset='1' stop-color='%238a5f17'/%3E%3C/radialGradient%3E%3CradialGradient id='n' cx='.35' cy='.3'%3E%3Cstop offset='0' stop-color='%23555'/%3E%3Cstop offset='.6' stop-color='%23161616'/%3E%3Cstop offset='1' stop-color='%23000'/%3E%3C/radialGradient%3E%3C/defs%3E%3Cpath d='M30 70c10 30-14 50 0 80s-10 40 4 60' stroke='%23e2b04a' stroke-width='3' fill='none'/%3E%3Cpath d='M70 95c-8 25 12 40 0 70' stroke='%23e2b04a' stroke-width='1.5' fill='none'/%3E%3Cellipse cx='62' cy='68' rx='28' ry='34' fill='url(%23n)'/%3E%3Cellipse cx='26' cy='40' rx='26' ry='32' fill='url(%23o)'/%3E%3Cellipse cx='86' cy='22' rx='22' ry='27' fill='url(%23o)'/%3E%3C/svg%3E") top left / contain no-repeat;
}
.portada::before { left: 0; }
.portada::after { right: 0; transform: scaleX(-1); }

/* ---------- Secciones ---------- */
.seccion__titulo { font-size: 46px; color: #f6d98a; text-shadow: var(--brillo); }
.adorno {
  width: 46px; height: 40px; margin: 0 auto 14px;
  background: var(--acento);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 22'%3E%3Cpath d='M12 20.5 3.5 12A5 5 0 0 1 12 5a5 5 0 0 1 8.5 7Z' fill='none' stroke='black' stroke-width='1.6'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 22'%3E%3Cpath d='M12 20.5 3.5 12A5 5 0 0 1 12 5a5 5 0 0 1 8.5 7Z' fill='none' stroke='black' stroke-width='1.6'/%3E%3C/svg%3E") center / contain no-repeat;
}
.mensaje__texto { font: 400 17px/1.75 var(--fuente-texto); font-style: normal; }
.familia__grupo h3, .resumen__etiqueta { color: var(--acento); }
.familia__grupo p, .lugar__titulo, .pase__nombre { font-family: var(--fuente-lujo); font-weight: 700; }

.lugar, .cuenta__reloj > div, .rsvp__form, .pase, .regalos__yape {
  background: var(--superficie);
  border: 1px solid rgb(230 196 106 / .4);
  box-shadow: 0 0 22px rgb(230 196 106 / .08);
}
.cuenta__reloj span { color: #f6d98a; font-family: var(--fuente-lujo); }
.cuenta__fin, .pie__gracias { color: #f6d98a; text-shadow: var(--brillo); }
.servicio__icono { background: transparent; box-shadow: 0 0 14px rgb(230 196 106 / .25), inset 0 0 10px rgb(230 196 106 / .15); }
.itinerario__lista li::before { background: rgb(230 196 106 / .3); }
.galeria__grid img { border: 1px solid rgb(230 196 106 / .45); }

/* Formulario oscuro */
.rsvp__form input:not([type=radio]), .rsvp__form select, .rsvp__form textarea {
  background: #0e0c08; color: var(--texto); border-color: rgb(230 196 106 / .3);
}

/* Botones dorados con texto oscuro */
.btn:not(.btn--contorno):not(.btn--whatsapp) {
  background: var(--oro); border: 0; color: #1a1408; box-shadow: 0 0 14px rgb(240 196 96 / .3);
}
.btn--contorno { color: var(--texto); border-color: rgb(230 196 106 / .6); }
.pase__cantidad { background: var(--oro); color: #1a1408; }
.btn-musica { background: var(--oro); color: #1a1408; }
.pie__marca { color: var(--texto-suave); }