:root {
  --color-border: rgba(255,98,168,.42);
  --color-paper: #fff2f8;
  --color-accent: #ffafd1;
  --color-primary-light: #a81759;
}

.hero { position: relative; display: flex; min-height: max(790px,100svh); align-items: center; justify-content: center; overflow: hidden; padding: 92px 28px 48px; isolation: isolate; text-align: center; }
.hero__content { position: relative; z-index: 2; width: min(100%,400px); animation: hero-arrive 1.2s cubic-bezier(.2,.7,.2,1) both; }
@keyframes hero-arrive { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: none; } }
.hero__glow { position: absolute; z-index: -1; width: 80%; aspect-ratio: 1; border-radius: 50%; background: var(--pink); filter: blur(95px); opacity: .13; pointer-events: none; }
.hero__glow--top { top: -35%; left: 10%; }
.hero__glow--bottom { right: -38%; bottom: -20%; width: 75%; opacity: .18; }
.hero__eyebrow { margin: 0 0 12px; color: var(--pink-bright); font-size: 9px; font-weight: 600; letter-spacing: .36em; }
.hero__title { margin: 0; color: #fff; text-shadow: 0 0 8px rgba(255,255,255,.9),0 0 26px rgba(255,255,255,.58),0 0 52px rgba(255,98,168,.54); }
.hero__title > span:first-child { display: block; font: clamp(76px,19vw,108px)/.9 var(--font-script); letter-spacing: .005em; }
.hero__party { display: block; margin-top: 3px; color: var(--pink); font: 500 clamp(24px,7vw,34px)/1 var(--font-display); letter-spacing: .17em; text-shadow: 0 0 12px rgba(255,75,155,.74); }
.hero__invite { margin: 35px 0 9px; color: #eee5eb; font: 500 13px/1.75 var(--font-display); letter-spacing: .055em; text-transform: uppercase; }
.hero__name { margin: 0; color: #fff; font: clamp(76px,20vw,112px)/.94 var(--font-script); text-shadow: 0 0 7px #fff,0 0 19px rgba(255,255,255,.76),0 0 44px rgba(255,86,158,.65); }
.hero__age { margin: 0 0 30px; color: var(--pink); font: 500 clamp(21px,6vw,29px)/1.2 var(--font-display); letter-spacing: .08em; text-shadow: 0 0 13px rgba(255,74,150,.65); }
.hero__event-date { width: min(100%,390px); margin: 0 auto 18px; color: var(--paper); }
.hero__weekday { display: block; margin-bottom: 4px; font: 400 17px/1.2 var(--font-display); letter-spacing: .13em; }
.hero__date-line { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px; }
.hero__date-line > span { color: #e5d9e0; font: 400 13px/1.2 var(--font-display); letter-spacing: .08em; }
.hero__date-line > span:first-child { text-align: right; }
.hero__date-line > span:last-child { text-align: left; white-space: nowrap; }
.hero__date-line b { position: relative; padding: 0 18px; color: #fff; font: 500 64px/.95 var(--font-display); }
.hero__date-line b::before,.hero__date-line b::after { position: absolute; top: 50%; width: 37px; height: 1px; background: linear-gradient(90deg,transparent,var(--pink)); content: ''; }
.hero__date-line b::before { right: 100%; }
.hero__date-line b::after { left: 100%; transform: rotate(180deg); }
.hero__venue { margin: 21px 0 16px; color: #f0e7ec; font: 500 14px/1.55 var(--font-display); letter-spacing: .08em; text-transform: uppercase; }
.hero__dress-hint { margin: 0 0 14px; color: #e9dbe4; font: 500 10px var(--font-display); letter-spacing: .16em; }
.hero__dress-hint span { display: inline-block; margin-left: 6px; color: var(--pink); font-size: 17px; animation: twinkle 1.8s ease-in-out infinite; }
.hero__actions { display: grid; width: min(100%,265px); gap: 9px; margin: 0 auto; }
.hero__button { display: flex; min-height: 40px; align-items: center; justify-content: center; gap: 9px; padding: 9px 14px; border: 1px solid rgba(255,176,211,.3); border-radius: 9px; background: linear-gradient(135deg,#ed4d99,#a81359); box-shadow: 0 5px 20px rgba(233,43,125,.22),inset 0 1px rgba(255,255,255,.2); color: #fff6fa; font-size: 9px; font-weight: 600; letter-spacing: .11em; text-decoration: none; transition: transform .2s ease,box-shadow .2s ease; }
.hero__button span { font-size: 15px; }
.hero__button:hover { transform: translateY(-2px); box-shadow: 0 8px 25px rgba(233,43,125,.38); }
.hero__button--secondary { background: rgba(42,14,31,.78); }
.hero__farewell { margin: 22px 0 0; color: #fff; font: 39px/1 var(--font-script); text-shadow: 0 0 14px rgba(255,255,255,.55); }
.hero__hint { display: block; margin-top: 19px; color: rgba(255,222,238,.56); font-size: 8px; letter-spacing: .22em; }
.hero__hint span { display: inline-block; margin-left: 4px; color: var(--pink); animation: hint-bounce 1.6s ease-in-out infinite; }
@keyframes hint-bounce { 50% { transform: translateY(4px); } }
.hero__star { position: absolute; z-index: 1; color: #fff; text-shadow: 0 0 9px #fff,0 0 20px var(--pink); animation: star-pulse 2.6s ease-in-out infinite; }
.hero__star--one { top: 23%; left: 8%; font-size: 28px; }
.hero__star--two { top: 19%; right: 7%; font-size: 23px; animation-delay: .7s; }
.hero__star--three { right: 12%; bottom: 14%; font-size: 18px; animation-delay: 1.3s; }
@keyframes star-pulse { 0%,100% { opacity: .34; transform: scale(.75) rotate(0); } 50% { opacity: 1; transform: scale(1.12) rotate(12deg); } }

/* Secciones estándar: tonos oscuros con el rosa brillante de la invitación. */
section.oc-section.oc-section { border-top: 1px solid rgba(255,98,168,.1); background-color: rgba(10,7,11,.58); color: var(--paper); }
section.oc-section .oc-title { color: var(--pink-bright); text-shadow: 0 0 18px rgba(255,78,154,.22); }
section.oc-section .oc-sub { color: #d2bfca; }
section.oc-section .oc-rule { color: var(--pink); }
section.oc-section .oc-rule::before, section.oc-section .oc-rule::after { opacity: .9; box-shadow: 0 0 9px rgba(255,98,168,.46); }
section.oc-section .oc-rule i { box-shadow: 0 0 9px var(--pink); }
section.oc-section .oc-card { border-color: rgba(255,98,168,.24); background: linear-gradient(145deg,rgba(33,18,29,.82),rgba(18,13,20,.76)); color: var(--paper); box-shadow: 0 16px 40px rgba(0,0,0,.23); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
section.oc-section .oc-count b { color: #fff; text-shadow: 0 0 15px rgba(255,98,168,.35); }
section.oc-section .oc-count small,section.oc-section .oc-w-note { color: var(--muted-pink); }
section.oc-section .oc-btn { background: linear-gradient(135deg,#f45ba3,#ab175a); color: #fff8fb; box-shadow: 0 6px 20px rgba(219,43,126,.18); }
section.oc-section .oc-btn.is-ghost { background: transparent; color: var(--pink-bright); box-shadow: inset 0 0 0 1px rgba(255,132,187,.6); }
section.oc-section .oc-play, .oc-music-toggle { border-color: rgba(255,133,187,.5); background: linear-gradient(145deg,#ef559e,#9e1553); color: #fff; box-shadow: 0 8px 25px rgba(230,52,135,.35); }
.oc-music-toggle { top: max(14px,env(safe-area-inset-top)); right: max(14px,env(safe-area-inset-right)); width: auto; min-width: 96px; height: 44px; padding: 0 13px 0 10px; display: flex; align-items: center; justify-content: center; gap: 8px; border: 1px solid rgba(255,190,220,.5); border-radius: 999px; background: rgba(24,10,20,.76); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); box-shadow: 0 8px 25px rgba(0,0,0,.34),0 0 18px rgba(255,74,150,.2),inset 0 1px rgba(255,255,255,.15); color: #fff2f8; }
.oc-music-toggle::after { content: 'Música'; color: #ffe8f2; font: 600 9px/1 var(--font-body); letter-spacing: .13em; text-transform: uppercase; }
.oc-music-toggle.is-playing { border-color: rgba(255,175,209,.8); box-shadow: 0 8px 25px rgba(0,0,0,.34),0 0 25px rgba(255,74,150,.36),inset 0 1px rgba(255,255,255,.17); }
section.oc-section .oc-song { margin: 0 auto 4px; color: #fff4f9; font: 34px/1.1 var(--font-script); text-shadow: 0 0 18px rgba(255,98,168,.34); }
section.oc-section .oc-artist { margin-bottom: 17px; color: #ddb7c9; font: 500 9px/1.5 var(--font-body); letter-spacing: .2em; text-transform: uppercase; }
section.oc-section .oc-player { position: relative; max-width: 370px; gap: 14px; margin: 18px auto 0; padding: 14px 17px; border: 1px solid rgba(255,150,194,.3); border-radius: 18px; background: linear-gradient(135deg,rgba(46,18,37,.76),rgba(18,11,19,.68)); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); box-shadow: 0 14px 36px rgba(0,0,0,.3),inset 0 1px rgba(255,255,255,.08); }
section.oc-section .oc-play { flex: 0 0 48px; width: 48px; height: 48px; border: 1px solid rgba(255,220,238,.55); border-radius: 50%; background: radial-gradient(circle at 32% 24%,#ffb6d5,#ed4d99 54%,#99134f); box-shadow: 0 0 0 5px rgba(255,98,168,.08),0 5px 18px rgba(220,40,125,.35),inset 0 1px rgba(255,255,255,.45); transition: transform .25s ease,box-shadow .25s ease; }
section.oc-section .oc-play:hover { transform: scale(1.07); box-shadow: 0 0 0 7px rgba(255,98,168,.1),0 6px 24px rgba(220,40,125,.46),inset 0 1px rgba(255,255,255,.45); }
section.oc-section .oc-player.is-playing .oc-play { animation: player-pulse 2.2s ease-in-out infinite; }
@keyframes player-pulse { 50% { box-shadow: 0 0 0 8px rgba(255,98,168,.06),0 6px 24px rgba(220,40,125,.48),inset 0 1px rgba(255,255,255,.45); } }
section.oc-section .oc-bar { height: 4px; background: rgba(255,226,240,.16); }
section.oc-section .oc-fill { background: linear-gradient(90deg,#df3484,#ffafd1); box-shadow: 0 0 10px rgba(255,98,168,.6); }
section.oc-section .oc-times { color: #d9bdcc; font: 500 9px var(--font-body); letter-spacing: .06em; }
/* Oculta únicamente el adorno lineal con rombo encima de cada título.
   Las pseudo líneas de división entre secciones se conservan. */
section.oc-section .oc-rule { display: none; }
section.oc-section .oc-video { border: 1px solid rgba(255,98,168,.28); box-shadow: 0 14px 36px rgba(0,0,0,.3); }
section.oc-section .oc-transition-flower { display: none; }
.oc-nav { left: max(12px,env(safe-area-inset-left)); }
.oc-nav-pill.oc-nav-pill { border-color: rgba(255,128,184,.36); background: rgba(22,12,20,.92); color: #ffe6f1; }
.oc-nav-pill.oc-nav-pill svg { color: var(--pink); }
.oc-nav-drop.oc-nav-drop { border-color: rgba(255,98,168,.3); background: rgba(18,11,17,.97); }
.oc-nav-head.oc-nav-head { border-color: rgba(255,98,168,.22); color: var(--pink-bright); }
.oc-nav-head.oc-nav-head i { background: var(--pink); box-shadow: 0 0 10px var(--pink); }
.oc-nav-drop.oc-nav-drop a { color: #f7eaf1; }
.oc-nav-drop.oc-nav-drop a:hover { background: rgba(255,98,168,.12); color: #fff; }
.oc-nav-drop.oc-nav-drop a svg { color: var(--pink); }
.oc-nav-drop.oc-nav-drop a.is-cta { background: linear-gradient(135deg,#e84b96,#a51256); color: #fff; }
.oc-nav-visibility { color: var(--pink-bright); }
.oc-nav-visibility:hover,.oc-nav-visibility:focus-visible { background: rgba(255,98,168,.14); }
.oc-nav-switch { border-color: rgba(255,175,209,.36); background: rgba(255,255,255,.1); }
.oc-nav-visibility[aria-checked="true"] .oc-nav-switch { border-color: var(--pink); background: var(--pink); }
.oc-nav-visibility:focus-visible { outline-color: var(--pink-bright); }

section.oc-section .oc-gallery > button { border: 1px solid rgba(255,146,194,.4); box-shadow: 0 12px 30px rgba(0,0,0,.4),0 0 20px rgba(255,78,154,.12); }
section.oc-section .oc-gallery-arrow { border-color: rgba(255,146,194,.45); background: rgba(25,12,21,.94); color: #ffe8f2; }
section.oc-section .oc-gallery-arrow:hover { background: var(--pink-deep); color: white; }
.footer { position: relative; z-index: 1; background: linear-gradient(180deg,transparent,rgba(255,63,148,.08)); }

@media (prefers-reduced-motion: reduce) {
  .hero__content { animation: none; }
  .hero__star,.hero__dress-hint span,.hero__hint span { animation: none; }
}
