/* Picnic · Romance botánico. Paleta tomada de la referencia proporcionada. */
:root {
  --mauve: #b69391; --sage: #898b63; --sage-deep: #535d47;
  --peach: #a3745d; --rust: #66391f; --paper: #f8f4ed; --ink: #503e35;
  --rose-paper: #eee3df; --line: #d8c9bc; --photo-corners: 48px 0 48px 0;
  --main-color: var(--mauve); --secondary-color: var(--sage); --third-color: var(--peach);
  --body-font-color: var(--ink); --body-font-family: 'Cormorant Garamond', Georgia, serif;
  --font-family: 'Cormorant Garamond', Georgia, serif;
  --secondary-font-family: var(--font-family); --extra-font-family: var(--font-family);
  --cursive-font-family: 'Sacramento', cursive;
  --light-bg-color: var(--paper); --titles-font-color: var(--rust);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 86px; background: var(--paper); }
body { margin: 0; font-family: var(--font-family); color: var(--ink); font-size: 19px; line-height: 1.65; background: var(--paper); }
html, body { height: 100%; overflow: hidden; }
html.picnic-open, .picnic-open body { height: auto; overflow: visible; }
.page-wrapper { overflow: clip; }
p { font-family: var(--font-family); font-size: 20px; color: var(--ink); line-height: 1.65; }
h1,h2,h3,h4,h5,h6 { font-family: var(--font-family); color: var(--ink); font-weight: 400; }
a { color: var(--rust); }
a:hover { color: var(--peach); text-decoration: none; }
button, input, textarea { font: inherit; }
button { cursor: pointer; }
button:focus-visible,a:focus-visible { outline: 2px solid var(--rust); outline-offset: 6px; }
img { max-width: 100%; }
.row { margin-left: 0; margin-right: 0; }
.container { max-width: 1180px; width: 100%; padding: 0 36px; margin: 0 auto; }
section { position: relative; scroll-margin-top: 72px; }
.section-padding, #events, #accomodations { padding: 100px 0; }
.section-title, .section-title.white-title { background: none; border: 0; margin: 0 auto 56px; padding: 0 18px; text-align: center; }
.section-title h2, .section-title.white-title h2 { font-family: var(--cursive-font-family); color: var(--rust); font-weight: 400; font-size: clamp(48px,5vw,72px); line-height: 1.3; margin: 0; padding: 0; text-transform: none; }
.section-title::before { content: ''; display: block; height: 48px; width: 34px; margin: 0 auto 18px; background: url('../images/picnic-botanical.svg') center/contain no-repeat; }
.section-title::after { content: ''; display: block; width: 46px; border-bottom: 1px solid var(--peach); margin: 21px auto 0; }
.section-title > svg, .section-title > .fi, .section-title .vertical-line { display: none; }
.eyebrow { font-family: var(--font-family); font-size: 12px; letter-spacing: .2em; text-transform: uppercase; line-height: 1.8; }
.animate-gradient-text, .animate-gradient-gray-text { background: none; -webkit-text-fill-color: currentColor; animation: none; }
.animate-text-color,.animate-icon-color,.animate-zoom-in-out,.animate-rotate { animation: none; }
/* La composición sustituye las animaciones antiguas; el contenido siempre es visible. */
.wow { visibility: visible !important; animation: none !important; }
.animate-appear { opacity: 1; transform: none; }
.preloader { display: none !important; }
.white-text { color: var(--ink) !important; }
.mw-btn, .see-location-btn { display: inline-flex; align-items: center; justify-content: center; gap: 9px; font-family: var(--font-family); font-weight: 500; text-transform: uppercase; letter-spacing: .12em; font-size: 14px; line-height: 1.5; padding: 14px 23px; border: 1px solid var(--peach); border-radius: 24px 0 24px 0; background: transparent; color: var(--rust) !important; box-shadow: none; transition: background .25s, color .25s; }
.mw-btn:hover, .see-location-btn:hover { background: var(--rust); color: var(--paper) !important; letter-spacing: .12em; }
.see-location-btn svg { width: 15px; height: 19px; fill: currentColor; }
/* Sobre de bienvenida: papel, pliegues y lacre, creados con CSS. */
.pre-page { position: fixed; inset: 0; z-index: 10000; width: 100%; height: 100%; height: 100dvh; overflow: auto; background: var(--paper); display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 76px 24px 28px; color: var(--ink); transition: opacity .75s, visibility .75s; }
.pre-page[hidden] { display: none !important; }
.pre-page::before, .romance-hero::before { content: ''; position: absolute; inset: 0; pointer-events: none; opacity: .28; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23a69b87' opacity='.25' filter='url(%23n)' d='M0 0h180v180H0z'/%3E%3C/svg%3E"); }
.welcome-topline { position: absolute; top: 25px; left: 5%; right: 5%; display: flex; justify-content: space-between; font-size: 11px; letter-spacing: .19em; padding-bottom: 16px; border-bottom: 1px solid var(--line); }
.welcome-stationery { --envelope-mouth: 170px; --flap-rise: 72px; position: relative; width: min(560px,84vw); height: 440px; flex: 0 0 auto; margin-top: 25px; }
.envelope-open-flap { position: absolute; top: calc(0px - var(--flap-rise)); bottom: 0; left: 0; width: 100%; transform: rotate(-5deg); transform-origin: 50% 100%; clip-path: polygon(0 calc(var(--envelope-mouth) + var(--flap-rise)),50% 0,100% calc(var(--envelope-mouth) + var(--flap-rise)),100% 100%,0 100%); background: linear-gradient(145deg, #b4bca0, #9da987); pointer-events: none; }
.envelope-open-flap::before { content: ''; position: absolute; inset: 0; background: url('../images/optimized/envelope-texture.jpg') center / 650px auto; filter: grayscale(1) contrast(1.65); mix-blend-mode: soft-light; opacity: .8; }
.welcome-letter { position: absolute; width: 85%; left: 9%; top: -10px; background: linear-gradient(110deg, #fffdf7, #f5f0e7); min-height: 350px; padding: 35px 42px 90px; box-shadow: 0 8px 18px #393a241a; text-align: center; transform: rotate(1deg); }
.letter-botanical { position: absolute; top: 25px; left: 12px; width: 48px; height: 150px; opacity: .6; }
.welcome-letter .eyebrow { margin: 7px 0 12px; color: var(--peach); }
#welcome-names { font-family: var(--cursive-font-family); font-size: 53px; line-height: 1.25; color: var(--rust); margin: 0 0 12px; }
#welcome-names > span { display: inline-block; font-size: 34px; color: var(--peach); }
.welcome-message { font-size: 17px; line-height: 1.5; margin: 0 auto 12px; max-width: 250px; }
.letter-date { font-size: 23px; margin: 0; }
.letter-date > span { font-size: 11px; letter-spacing: .18em; margin: 0 9px; }
#rotuloapi { font-size: clamp(18px,2vw,22px); font-weight: 600; line-height: 1.3; color: var(--rust); overflow-wrap: anywhere; }
.envelope-front { position: absolute; inset: var(--envelope-mouth) 0 0; transform: rotate(-5deg); transform-origin: 50% 100%; background: url('../images/picnic-envelope-folds.svg?v=20261015-7') center / 100% 100% no-repeat; filter: drop-shadow(0 12px 13px #41462e35) drop-shadow(0 -1px 1px #41462e20); }
.wax-seal { position: absolute; z-index: 2; top: 254px; left: calc(50% - 52px); width: 80px; height: 78px; padding: 0; border: 0; border-radius: 50%; background: transparent; box-shadow: none; transition: transform .3s; }
.wax-seal img { display: block; width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(2px 5px 4px #3b2d234d); }
.wax-seal:hover { transform: rotate(-8deg) scale(1.06); }
/* Sin anillos exteriores en la apertura; el foco de teclado usa otro indicador. */
.wax-seal:focus, .wax-seal:focus-visible, .btn-pre-page:focus, .btn-pre-page:focus-visible { outline: none; box-shadow: none; }
.wax-seal:focus-visible img { filter: drop-shadow(2px 5px 4px #3b2d234d) brightness(1.08); }
.btn-pre-page:focus-visible { text-decoration: none; border-color: var(--paper); }

/* Grano y fibras sobre cada papel, sin cubrir los textos ni el sello original. */
/* La composición nueva utiliza la textura fotográfica del papel original. */

.welcome-letter::before { content: ''; position: absolute; inset: 0; background: url('../images/picnic-paper-grain.svg') repeat; pointer-events: none; mix-blend-mode: multiply; opacity: .24; }
.envelope-front::before { content: ''; position: absolute; inset: 0; z-index: 1; clip-path: polygon(0 0,50% 42%,100% 0,100% 100%,0 100%); background: url('../images/optimized/envelope-texture.jpg') center / 650px auto; filter: grayscale(1) contrast(1.65); mix-blend-mode: soft-light; opacity: .8; pointer-events: none; }
.btn-pre-page { position: relative; display: inline-flex; align-items: center; gap: 40px; color: var(--paper); background: var(--rust); border: 1px solid var(--rust); padding: 14px 25px; font-family: var(--font-family); text-transform: uppercase; letter-spacing: .17em; font-size: 14px; margin-top: 22px; }
.btn-pre-page:hover { background: #7a4930; border-color: #7a4930; color: var(--paper); }
.btn-pre-page > span { font-size: 21px; line-height: 1; }
.welcome-footnote { font-size: 15px; font-style: italic; color: #79675b; margin: 14px 0 0; }
.pre-page.is-opening { opacity: 0; visibility: hidden; pointer-events: none; }
.pre-page.is-opening .welcome-letter { transform: translateY(-65px) rotate(1deg); transition: transform .7s ease; }
.pre-page.is-opening .envelope-front { transform: translateY(60px) rotate(-5deg); transition: transform .7s ease; }
/* Portada: una composición de papelería y fotografía de Picnic. */
.romance-hero { background: var(--paper); height: auto; min-height: 820px; min-height: min(900px,100svh); padding: 26px 5% 22px; display: flex; flex-direction: column; }
.hero-edition,.hero-bottomline { display: flex; align-items: center; justify-content: space-between; gap: 24px; position: relative; font-size: 11px; letter-spacing: .18em; color: var(--rust); }
.hero-edition { border-bottom: 1px solid var(--line); padding-bottom: 18px; }
.hero-composition { position: relative; width: min(1120px,100%); min-height: 630px; flex: 1; margin: 0 auto; }
.hero-envelope { position: absolute; width: 45%; height: 58%; background: #a5a78d; left: 2%; top: 12%; transform: rotate(-8deg); box-shadow: 2px 12px 30px #43362120; }
.hero-envelope::after { content: ''; position: absolute; inset: 0; background: #b7baa1; clip-path: polygon(0 0,100% 0,50% 60%); border-top: 1px solid #8e9479; }
.hero-envelope > img { position: absolute; top: -25px; left: -40px; width: 120px; height: 300px; transform: rotate(-30deg); opacity: .7; }
.hero-photograph { position: absolute; width: 45%; height: 78%; right: 0; top: 6%; margin: 0; padding: 12px 12px 42px; background: #fffdf8; box-shadow: 0 16px 30px #49332526; transform: rotate(5deg); }
.hero-photograph > img { width: 100%; height: 100%; object-fit: cover; object-position: 69% 50%; }
.hero-photograph figcaption { text-align: center; font-family: var(--cursive-font-family); color: var(--peach); font-size: 24px; line-height: 36px; }
.hero-letter { position: absolute; z-index: 1; left: 10%; top: 15%; width: 49%; height: 66%; min-height: 410px; padding: 38px 32px 28px; background: var(--mauve); color: var(--paper); text-align: center; border-radius: 2px 60px 2px 60px; box-shadow: 0 12px 25px #593b3120; }
.hero-letter .eyebrow { position: relative; max-width: 270px; margin: 0 auto 16px; font-size: 10px; color: #fffaf3; letter-spacing: .17em; }
.hero-botanical { position: absolute; bottom: 0; right: 0; height: 86%; width: 150px; opacity: .2; filter: brightness(0) invert(1); transform: rotate(12deg); }
#couple-names { position: relative; font-family: var(--cursive-font-family); font-size: clamp(66px,7.4vw,106px); font-weight: 400; line-height: .85; color: #fff9ee; margin: 25px 0; padding: 10px 0; outline: none; }
.hero-amp { display: block; font-size: .45em; line-height: 1.2; color: #f4e4d5; margin: 3px auto; }
.hero-date { display: flex; position: relative; align-items: center; justify-content: center; gap: 14px; margin-top: 28px; }
.hero-date > span { font-size: 46px; line-height: 1; }
.hero-date > div { border-left: 1px solid #f7f2e887; padding-left: 15px; font-size: 12px; letter-spacing: .17em; line-height: 1.6; text-align: left; }
.hero-date small { display: block; font-size: 16px; letter-spacing: .15em; }
.hero-discover { display: inline-flex; align-items: center; gap: 25px; color: #fff9ee; font-size: 11px; text-transform: uppercase; letter-spacing: .15em; margin-top: 25px; border-bottom: 1px solid #fff7eb70; padding-bottom: 4px; }
.hero-discover:hover { color: #fff; }
.hero-countdown { position: absolute; z-index: 2; left: 4%; bottom: 5%; width: 49%; background: var(--sage-deep); padding: 18px 25px; border-radius: 35px 0 35px 0; box-shadow: 0 8px 20px #383e2820; }
.hero-countdown .count-down-clock { background: transparent; padding: 0; border: 0; width: 100%; margin: 0; }
.hero-countdown #clock { display: flex; justify-content: space-evenly; gap: 8px; padding: 0; }
.hero-countdown #clock .box { width: auto; min-width: 0; float: none; margin: 0; padding: 0 10px; border: none; background: none; box-shadow: none; }
.hero-countdown #clock .box div { font-family: var(--font-family); font-size: 29px; font-weight: 400; color: var(--paper); line-height: 1.15; }
.hero-countdown #clock .box span { font-family: var(--font-family); font-size: 11px; color: #e3e5d5; text-transform: none; letter-spacing: .07em; }
.hero-bottomline { border-top: 1px solid var(--line); padding-top: 15px; letter-spacing: .03em; font-size: 15px; font-style: italic; }
.hero-bottomline a { font-size: 25px; padding: 0 12px; }
/* Navegación */
.site-header,.site-header.sticky-header { background: var(--paper); border: 0; box-shadow: none; position: sticky; top: 0; z-index: 400; }
.site-header { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.romance-nav { display: flex; align-items: center; gap: 40px; max-width: 1320px; min-height: 80px; margin: auto; padding: 0 5%; }
.nav-monogram { font-family: var(--cursive-font-family); font-size: 38px; white-space: nowrap; line-height: 1.2; }
.nav-monogram.couple-monogram { display: inline-flex; align-items: center; justify-content: center; transform: translateY(.12em); }
#romance-menu { display: flex; flex: 1; align-items: center; justify-content: flex-end; gap: 25px; }
#romance-menu a { font-size: 13px; letter-spacing: .09em; text-transform: uppercase; padding: 20px 0; }
.nav-menu-toggle { display: none; }
/* Historia */
#couple { background: var(--paper); padding-top: 100px; }
#couple .gb.groom { display: grid; grid-template-columns: .95fr 1.05fr; align-items: center; background: none; border: 0; min-height: 0; padding: 0; overflow: visible; }
#couple .gb > .img-holder { position: relative; width: 100%; height: auto; padding: 0 38px 0 0; float: none; }
#couple .gb > .img-holder::after { content: ''; position: absolute; border: 1px solid var(--peach); inset: 18px 20px -18px 18px; z-index: 0; border-radius: var(--photo-corners); pointer-events: none; }
#couple .gb > .img-holder img { position: relative; z-index: 1; width: 100%; height: 590px; object-fit: cover; border: 0; border-radius: var(--photo-corners); }
#couple .gb > .details { width: 100%; padding: 0 0 0 40px; float: none; background: transparent; text-align: left; }
#couple .details-inner { position: static; transform: none; padding: 0; display: block; height: auto; }
#couple .details-inner > svg { width: 70px; height: 65px; fill: var(--peach); margin: 0 0 20px; }
#couple .details p { color: var(--ink) !important; font-size: 20px; line-height: 1.6; margin-bottom: 18px; }
#couple .details p:first-of-type::first-letter { float: left; font-size: 68px; line-height: .9; padding: 7px 8px 0 0; color: var(--peach); }
/* Lugares */
#events { background: var(--rose-paper); }
.event-container { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; padding: 0; }
.events-section .event,.events-section .event.event2 { width: 100%; padding: 0; margin: 0; border: 0; border-radius: 0; background: none; box-shadow: none; text-align: center; }
.events-section .event + .event { margin: 0; }
.event .img-holder { margin: 0 0 28px; overflow: hidden; }
.event .img-holder img { width: 100%; height: 320px; object-fit: cover; border: 0; border-radius: var(--photo-corners); margin: 0; }
.events-section .event h3 { color: var(--rust) !important; font-family: var(--cursive-font-family); font-size: 49px; font-weight: 400; text-transform: none; margin: 10px 0 15px; }
.events-section .event h6 { font-size: 22px; line-height: 1.3; font-weight: 500; min-height: 58px; max-width: 360px; margin: 0 auto 14px; }
.events-section .event ul { padding: 0; margin: 0 0 25px; }
.events-section .event ul li { font-size: 17px; line-height: 1.6; margin: 6px 0; }
.events-section .event ul li i { color: var(--peach); font-size: 15px !important; margin-right: 5px; }
.event .go-to-buttons { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 12px; padding: 0; }
/* Vestimenta con las fotografías existentes */
#dress-code-items.cta.no-overlay { margin: 0; padding: 80px 0; background: var(--paper); border: 0; }
#dress-code-items h2 { font-family: var(--cursive-font-family); font-size: clamp(48px,5vw,72px); color: var(--rust); margin: 0 0 45px; text-transform: none; }
#dress-code-items h2 span { display: block; font-family: var(--font-family); text-transform: uppercase; font-size: 17px; letter-spacing: .2em; color: var(--peach); margin-top: 15px; }
#dress-code-items .dress-items { max-width: 760px; margin: auto; justify-content: center; gap: 45px; flex-wrap: nowrap; }
#dress-code-items .dress-items > div { flex: 1; width: 50%; max-width: 330px; padding: 0; }
#dress-code-items .img-holder { height: 340px; margin: 0; overflow: hidden; }
#dress-code-items .img-holder img { width: 100%; height: 100%; object-fit: contain; filter: saturate(.7); }
#dress-code-items .details { padding-top: 20px; text-align: center; }
#dress-code-items h3 { font-size: 21px; letter-spacing: .04em; text-transform: none; }
/* Un itinerario ligero, con iconos originales */
#story { background: #e9ebdf; }
#story .container { max-width: 1040px; }
.story-section .story-timeline { position: relative; }
.story-section .story-timeline::before { background: #9da084; width: 1px; }
.story-section .story-timeline > .row { display: flex; align-items: center; padding: 25px 0; min-height: 180px; }
.story-section .story-timeline .story-text { padding: 15px 45px; background: none; border: 0; box-shadow: none; }
.story-section .story-timeline h3 { font-family: var(--cursive-font-family); color: var(--rust); font-size: 43px; text-transform: none; margin: 0 0 10px; }
.story-section .story-timeline .date { font-family: var(--font-family); color: var(--sage-deep); font-size: 15px; letter-spacing: .08em; }
.story-section .story-timeline p { font-size: 18px; line-height: 1.5; margin: 8px 0 0; }
.story-timeline .img-holder { padding: 0 45px; text-align: center; }
.story-timeline .img-holder svg { height: 80px; width: 100px; fill: var(--sage-deep); margin: 0; }
.story-section .story-timeline .heart,.story-section .story-timeline .fa { display: none; }
/* Galería editorial */
#gallery { background: var(--paper); }
 .gallery-viewport { position: relative; overflow: hidden; width: 100%; touch-action: pan-y; }
.romance-gallery { display: flex; position: relative; gap: 20px; align-items: start; will-change: transform; }
.romance-gallery .grid { flex: 0 0 calc((100% - 60px)/4); min-width: 0; margin: 0 !important; padding: 0; float: none; }
.gallery-controls { display: flex; align-items: center; justify-content: center; gap: 16px; margin-top: 28px; }
.gallery-controls button { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; padding: 0; border: 1px solid var(--peach); border-radius: 50%; background: var(--paper); color: var(--rust); }
.gallery-controls button:hover { background: var(--rust); color: var(--paper); }
.gallery-controls button:focus-visible { outline: 2px solid var(--rust); outline-offset: 4px; }
.gallery-controls svg, .picnic-lightbox button svg { display: block; width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; pointer-events: none; }
.romance-gallery a { display: block; position: relative; overflow: hidden; }
.romance-gallery a::after { content: ''; position: absolute; right: 12px; bottom: 12px; width: 36px; height: 36px; background: var(--paper); border-radius: 50%; transition: transform .25s; }
.romance-gallery a::before { content: ''; position: absolute; z-index: 1; right: 22px; bottom: 22px; width: 16px; height: 16px; background: linear-gradient(var(--rust),var(--rust)) center / 2px 16px no-repeat, linear-gradient(var(--rust),var(--rust)) center / 16px 2px no-repeat; pointer-events: none; }
.romance-gallery-link:focus-visible::before { background: linear-gradient(var(--paper),var(--paper)) center / 2px 16px no-repeat, linear-gradient(var(--paper),var(--paper)) center / 16px 2px no-repeat; }
.romance-gallery img { display: block; width: 100%; height: 340px; object-fit: cover; transition: transform .6s; }
.romance-gallery a:hover img { transform: scale(1.035); }
.romance-gallery a { border-radius: var(--photo-corners); }
.romance-gallery img { border-radius: var(--photo-corners); }
/* Regalos */
#registry { background: #eee1d7; padding-bottom: 80px; }
.romance-registry { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 20px; width: 100%; margin: 0 auto; }
.romance-registry > a { display: block; }
.romance-registry .register { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; height: 100%; min-height: 166px; padding: 25px 14px; margin: 0; border: 0; border-radius: var(--photo-corners); text-align: center; }
.romance-registry .registry-mauve { background: var(--mauve); }
.romance-registry .registry-sage { background: var(--sage); }
.romance-registry .registry-peach { background: var(--peach); }
.romance-registry .registry-rust { background: var(--rust); }
.romance-registry .register img { width: 120px; max-width: 100%; height: 60px; object-fit: contain; margin: 0 auto 12px; }
.romance-registry .register p { font-size: 24px; color: var(--paper) !important; margin: 0; }
/* El iframe conserva sus textos y lógica. Se modifica únicamente su tamaño. */
#rsvp { background-attachment: scroll !important; background-position: center !important; padding: 85px 20px; }
#rsvp::before { background: #333b26; opacity: .24; }
#rsvp .container { position: relative; z-index: 1; max-width: 760px; padding: 0; }
#rsvp-frame { display: block; width: 100%; height: 490px; margin: 0; border: 0; border-radius: 48px 0 48px 0; background: transparent; }
/* Hospedaje */
#accomodations { background: var(--paper); }
#accomodations .event-container { gap: 55px; }
#accomodations .event .img-holder img { border-radius: var(--photo-corners); height: 270px; }
#accomodations .event .details { padding: 0; }
#accomodations .event h6 { min-height: 0; font-size: 25px; }
#accomodations .event p { font-size: 18px; line-height: 1.6; }
#accomodations .see-location-btn { margin-top: 18px; }
/* App discreta */
#features { padding: 55px 0; border-top: 1px solid var(--line); background: #e9ebdf !important; }
#features .gb.groom { padding: 0; background: none !important; border: 0; }
#features .gb.groom .details { max-width: 720px; width: 100%; margin: auto; padding: 0 25px; }
#features .details-inner { position: static; transform: none; display: block; padding: 0; }
#features .details-inner svg { display: none; }
#features h3 { font-family: var(--cursive-font-family); font-size: 40px; margin: 0; }
#features p { font-size: 16px; line-height: 1.6; }
#features br { display: none; }
#features .details-inner > p { margin: 14px 0; }
#features .download-app { padding-top: 12px; }
.download-app .buttons { gap: 10px; }
.download-app .buttons a.mw-btn,.download-app .buttons a.mw-btn:hover { width: auto; background: transparent; color: var(--sage-deep) !important; border-color: #949a80; margin: 0; padding: 10px 20px; letter-spacing: .1em; }
.download-app .buttons a.mw-btn:hover { background: #d8dccb; }
/* Despedida */
.site-footer { position: relative; background: var(--sage-deep); padding: 65px 20px 35px; border: 0; color: var(--paper); text-align: center; }
.footer-names { font-family: var(--cursive-font-family); color: var(--paper); font-size: 58px; margin: 0; }
.footer-date { color: #d5d7c6; letter-spacing: .15em; font-size: 11px; margin: 8px 0 35px; }
.site-footer h2 { font-family: var(--font-family); font-size: 17px; color: #e9e7dc; text-transform: none; letter-spacing: .02em; margin: 0 0 12px; }
.site-footer h3 { font-family: var(--font-family); color: var(--paper); font-size: clamp(22px,2.5vw,33px); font-weight: 400; letter-spacing: .03em; margin: 0; }
.site-footer img { width: 48px; height: auto; opacity: .7; }
.site-footer .back-to-top { position: static; }
.site-footer .back-to-top a { position: absolute; top: 35px; right: 35px; width: 45px; height: 45px; line-height: 42px; font-size: 27px; color: var(--paper); border: 1px solid #d5d7c680; border-radius: 50%; background: transparent; box-shadow: none; }
/* Control musical, mismo estado y comportamiento que Capital. */
#my_audio { display: none !important; }
.music-box { position: fixed; z-index: 100; right: 22px; bottom: 22px; top: auto; left: auto; height: auto; }
.music-box button { display: flex; align-items: center; gap: 10px; width: auto; height: 46px; padding: 0 17px; border: 1px solid #f8f4ed8c; border-radius: 30px; background: var(--sage-deep); box-shadow: 0 3px 15px #332b2526; color: var(--paper); }
.music-status { font-family: var(--font-family); font-size: 15px; letter-spacing: .05em; }
.music-bars { display: flex; align-items: center; gap: 3px; height: 18px; }
.music-bars i { display: block; width: 2px; height: 7px; background: currentColor; border-radius: 2px; }
.music-bars i:nth-child(2) { height: 15px; }
.music-bars i:nth-child(3) { height: 11px; }
.music-box button[aria-pressed='true'] .music-bars i { animation: music-wave .85s ease-in-out infinite alternate; }
.music-box button[aria-pressed='true'] .music-bars i:nth-child(2) { animation-delay: -.5s; }
.music-box button[aria-pressed='true'] .music-bars i:nth-child(3) { animation-delay: -.2s; }
@keyframes music-wave { to { height: 4px; } }
/* Preview fotográfico accesible */
.picnic-lightbox { position: fixed; inset: 0; z-index: 20000; background: #26271ff5; display: flex; align-items: center; justify-content: center; padding: 60px 75px; overscroll-behavior: none; touch-action: none; }
.picnic-lightbox[hidden] { display: none; }
.picnic-lightbox figure { margin: 0; display: flex; flex-direction: column; align-items: center; max-width: 100%; max-height: 100%; }
.picnic-lightbox img { display: block; max-width: 100%; max-height: calc(100dvh - 150px); object-fit: contain; user-select: none; touch-action: pinch-zoom; }
.picnic-lightbox figcaption { color: var(--paper); font-size: 14px; margin-top: 10px; }
.picnic-lightbox button { position: absolute; background: transparent; color: var(--paper); border: 1px solid #f8f4ed55; border-radius: 50%; width: 46px; height: 46px; font-size: 28px; line-height: 1; padding: 0; display: flex; align-items: center; justify-content: center; }
.lightbox-close { right: 20px; top: 18px; }
.lightbox-prev { left: 18px; top: calc(50% - 23px); }
.lightbox-next { right: 18px; top: calc(50% - 23px); }
html.gallery-open,html.gallery-open body { overflow: hidden; overscroll-behavior: none; }
@media (min-width: 1500px) {
  .hero-letter { height: 65%; }
}
@media (max-width: 1100px) {
  #romance-menu { gap: 15px; }
  #romance-menu a { font-size: 12px; }
  .hero-composition { min-height: 620px; }
  .hero-letter { left: 6%; width: 53%; }
  .hero-countdown { width: 53%; left: 1%; }
  #couple .gb > .details { padding-left: 15px; }
  #couple .details p { font-size: 18px; }
}
@media (max-width: 767px) {
  html { scroll-padding-top: 20px; }
  .container { padding: 0 24px; }
  .section-padding,#events,#accomodations { padding: 70px 0; }
  .section-title,.section-title.white-title { margin-bottom: 38px; }
  .section-title::before { height: 37px; margin-bottom: 12px; }
  .romance-hero { min-height: 0; padding: 22px 20px 16px; }
  .hero-edition { font-size: 9px; letter-spacing: .1em; padding-bottom: 15px; }
  .hero-composition { min-height: 710px; width: 100%; }
  .hero-envelope { top: 6%; left: 3%; width: 60%; height: 48%; }
  .hero-letter { top: 11%; left: 2%; width: 70%; min-height: 0; height: 405px; padding: 28px 17px 22px; border-radius: 2px 42px 2px 42px; }
  .hero-letter .eyebrow { font-size: 9px; max-width: 190px; }
  #couple-names { font-size: clamp(65px,15vw,94px); margin: 23px 0; }
  .hero-date { margin-top: 24px; }
  .hero-date > span { font-size: 37px; }
  .hero-date > div { font-size: 10px; }
  .hero-date small { font-size: 14px; }
  .hero-discover { font-size: 10px; margin-top: 24px; gap: 20px; }
  .hero-photograph { width: 61%; height: 345px; right: 0; top: 39%; padding: 8px 8px 34px; }
  .hero-photograph > img { object-position: 72% center; }
  .hero-photograph figcaption { font-size: 21px; line-height: 30px; }
  .hero-countdown { left: 0; width: 77%; bottom: 2%; padding: 16px 10px; }
  .hero-countdown #clock .box { padding: 0 4px; }
  .hero-countdown #clock .box div { font-size: 26px; }
  .hero-countdown #clock .box span { font-size: 10px; }
  .hero-bottomline { align-items: center; font-size: 15px; line-height: 1.5; }
  .hero-bottomline > span { max-width: 250px; }
  .romance-nav { min-height: 70px; flex-wrap: wrap; gap: 0; padding: 12px 25px; justify-content: space-between; }
  .nav-monogram { font-size: 34px; }
  .nav-menu-toggle { display: flex; align-items: center; gap: 12px; padding: 8px 0 8px 15px; background: none; border: 0; color: var(--rust); font-size: 15px; }
  .nav-menu-toggle span { font-size: 18px; }
  #romance-menu { display: none; width: 100%; flex: 0 0 100%; padding-top: 15px; border-top: 1px solid var(--line); margin-top: 10px; }
  #romance-menu.is-open { display: flex; flex-direction: column; align-items: center; gap: 0; }
  #romance-menu a { padding: 12px 0; font-size: 14px; width: 100%; text-align: center; }
  #couple { padding-top: 70px; }
  #couple .gb.groom { display: block; }
  #couple .gb > .img-holder { padding: 0 12px 0 0; width: min(430px,100%); margin: auto auto 48px; }
  #couple .gb > .img-holder::after { inset: 12px 0 -12px 12px; }
  #couple .gb > .img-holder img { height: auto; aspect-ratio: 4/5; }
  #couple .gb > .details { padding: 0 3px; text-align: left; }
  #couple .details-inner > svg { display: block; margin: 0 auto 20px; }
  #couple .details p { font-size: 19px; line-height: 1.65; }
  .event-container { grid-template-columns: 1fr; gap: 55px; }
  .event .img-holder img { height: 290px; }
  .events-section .event h6 { min-height: 0; }
  .events-section .event h3 { font-size: 45px; }
  #dress-code-items.cta.no-overlay { padding: 65px 0; }
  #dress-code-items h2 { font-size: 47px; margin-bottom: 30px; }
  #dress-code-items .dress-items { gap: 14px; }
  #dress-code-items .img-holder { height: 240px; }
  #dress-code-items h3 { font-size: 18px; }
  #dress-code-items .see-location-btn { font-size: 13px; padding: 12px; }
  .story-section .story-timeline::before { left: 38px; }
  .story-section .story-timeline > .row { display: grid; grid-template-columns: 76px 1fr; padding: 18px 0; min-height: 160px; }
  .story-timeline > .row > .col { max-width: 100%; width: 100%; padding: 0; }
  .story-timeline > .row > .icon { grid-column: 1; grid-row: 1; }
  .story-timeline > .row > .col:not(.icon) { grid-column: 2; grid-row: 1; }
  .story-section .story-timeline .story-text { text-align: left; padding: 5px 0 5px 20px; }
  .story-section .story-timeline h3 { font-size: 38px; }
  .story-section .story-timeline p { font-size: 17px; }
  .story-timeline .img-holder { padding: 15px 5px; background: #e9ebdf; }
  .story-timeline .img-holder svg { width: 55px; height: 60px; }
  .romance-gallery { gap: 14px; }
  .romance-gallery .grid { flex-basis: calc((100% - 14px)/2); }
  .romance-gallery img { height: 250px; }
  .romance-registry { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
  .romance-registry .register { width: 100%; min-height: 150px; padding: 22px 12px; }
  #rsvp { padding: 60px 12px; }
  #accomodations .event-container { gap: 45px; }
  #accomodations .event .img-holder img { height: 240px; }
  .footer-names { font-size: 47px; }
  .site-footer { padding-top: 65px; }
  .site-footer .back-to-top a { width: 35px; height: 35px; line-height: 32px; font-size: 22px; top: 18px; right: 18px; }
  .music-box { right: 14px; bottom: 14px; }
  .picnic-lightbox { padding: 60px 12px; }
  .picnic-lightbox img { max-height: calc(100dvh - 165px); }
  .lightbox-prev,.lightbox-next { top: auto !important; bottom: 16px; }
  .lightbox-prev { left: calc(50% - 60px); }
  .lightbox-next { right: calc(50% - 60px); }
  .welcome-topline { font-size: 9px; top: 20px; }
  .pre-page { padding: 20px 16px; justify-content: safe center; }
  .welcome-stationery { width: min(410px,85vw); height: 350px; margin-top: 28px; }
  .welcome-letter { padding: 26px 18px 70px; min-height: 290px; top: -25px; }
  #welcome-names { font-size: 44px; }
  #welcome-names > span { font-size: 25px; }
  .welcome-message { font-size: 16px; max-width: 200px; }
  .letter-botanical { width: 32px; height: 95px; left: 0; top: 5px; }
  .letter-date { font-size: 21px; }
  .letter-date > span { font-size: 9px; margin: 0 4px; }
  .envelope-front { top: 150px; }
  .wax-seal { top: 212px; width: 68px; height: 66px; left: calc(50% - 34px); }
  .btn-pre-page { margin-top: 42px; }
}
@media (max-width: 360px) {
 .hero-letter { width: 78%; } #couple-names { font-size: 63px; }
 .hero-countdown { width: 88%; }
 .romance-gallery img { height: 210px; }
 #welcome-names { font-size: 39px; }
 .welcome-message { font-size: 15px; }
}
@media (max-height: 700px) and (min-width: 768px) {
 .welcome-stationery { transform: scale(.8); margin: -40px 0 -35px; }
 .romance-hero { min-height: 780px; }
}
@media (prefers-reduced-motion: reduce) {
 *,*::before,*::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
/* El revamp utiliza su propia composición; los estilos antiguos se conservan
   en la carpeta, pero ya no se cargan para evitar conflictos de cascada. */
.page-wrapper { width: 100%; }
ul { list-style: none; }
.pre-page { inset: 0; min-height: 100%; }
.btn-pre-page { margin: 22px 0 0; width: auto; border-radius: 24px 0 24px 0; color: var(--paper); text-decoration: none; }
.welcome-footnote { flex: 0 0 auto; }
.section-title { display: block; }
.section-title h2 { letter-spacing: 0; }
.hero-discover { color: #fff9ee; }
.hero-countdown #clock .box div,.hero-countdown #clock .box span { text-shadow: none; background: none; }
.hero-countdown #clock .box span { padding: 0; margin-top: 5px; }
.romance-nav a { color: var(--rust); }
#couple .gb.groom { background: transparent; }
#couple .img-holder img { display: block; }
.story-section .story-timeline::before { content: ''; position: absolute; top: 0; bottom: 0; left: 50%; width: 1px; background: #9da084; }
.story-timeline .right-align-text { text-align: right; }
.parallax { background-size: cover; background-position: center; background-repeat: no-repeat; }
#dress-code-items { text-align: center; }
#dress-code-items .dress-items { display: flex; }
#dress-code-items .details h3 { margin-bottom: 18px; }
#features .gb.groom .details { text-align: center; }
.download-app .buttons { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; }
.event .details > ul li { list-style: none; }
.romance-gallery-link img { display: block; }
@media (max-width: 767px) {
 .story-section .story-timeline::before { left: 38px; }
 .btn-pre-page { margin-top: 42px; }
 .welcome-stationery { height: 350px; }
 .welcome-letter { top: -28px; min-height: 310px; }
 .welcome-letter .eyebrow { margin: 0 0 8px; }
 #welcome-names { font-size: 43px; line-height: 1.05; margin-bottom: 8px; }
 #welcome-names > span { display: block; font-size: 23px; line-height: 1.1; }
 .welcome-message { font-size: 15px; line-height: 1.4; margin-bottom: 8px; }
 .envelope-front { top: 205px; }
 .wax-seal { top: 233px; }
 .hero-photograph { top: 44%; right: 1%; width: 67%; height: 312px; }
 .hero-letter { height: 400px; }
 .hero-countdown { width: 83%; }
}
a { text-decoration: none; }
.hero-countdown #clock .box { text-align: center; }
.hero-countdown #clock .box span { display: block; }
.section-title::before { width: 42px; height: 55px; }
@media (max-width: 767px) {
 .section-title::before { height: 42px; }
 .hero-photograph { top: 46%; }
 .hero-photograph figcaption { font-size: 18px; }
}


@media (max-width: 767px) {
 .welcome-stationery { --envelope-mouth: 205px; --flap-rise: 12px; }
}

@media (max-width: 767px) {
 .wax-seal { left: calc(50% - 42px); }
}

/* Papel de ginkgo: relieve tenue, sin marco floral. */
.pre-page { isolation: isolate; }
.pre-page::before { z-index: -1; opacity: .32; background-image: url('../images/optimized/ginkgo-paper.jpg?v=20261015-2'); background-size: 960px 960px; background-position: center; background-repeat: repeat; }
@media (max-width: 767px) {
 .pre-page::before { background-size: 640px 640px; }
}

/* Se conserva la composición original de la portada; solo se unifica la textura. */
.romance-hero::before { display: none; }
.romance-hero, #couple, #gallery, #accomodations, #dress-code-items.cta.no-overlay {
 background-color: var(--paper);
 background-image: linear-gradient(rgba(248,244,237,.76),rgba(248,244,237,.76)),url('../images/optimized/ginkgo-paper.jpg?v=20261015-2');
 background-size: auto,960px 960px;
 background-position: center;
 background-repeat: repeat;
}
.hero-composition { min-height: 780px; }
.hero-envelope-seams { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 2; pointer-events: none; }
.hero-envelope::before { content: ''; position: absolute; inset: 0; z-index: 1; background: url('../images/optimized/envelope-texture.jpg') center / 650px auto; filter: grayscale(1) contrast(1.65); mix-blend-mode: soft-light; opacity: .8; pointer-events: none; }
.hero-letter { top: 50px; height: auto; min-height: 0; padding: 30px 28px; }
#couple-names { font-size: clamp(68px,6vw,86px); line-height: .95; margin: 18px 0; padding: 8px 0; }
.hero-amp { font-size: .42em; line-height: 1.1; margin: 5px auto; }
.hero-date { margin-top: 22px; }
.hero-discover { margin-top: 20px; }
.hero-photograph { padding: 12px; border-radius: 60px 0 60px 0; }
.hero-photograph > img { border-radius: var(--photo-corners); }
.hero-countdown { bottom: 85px; }
.section-title::before { display: none; }
/* En celular la portada sigue una secuencia vertical, con proporciones naturales. */
@media (max-width: 767px) {
 .romance-hero { display: block; min-height: 0; padding: 28px 20px; }
 .hero-composition { display: grid; grid-template-columns: minmax(0,1fr); grid-template-areas: 'photo' 'letter' 'countdown'; align-items: center; gap: 44px; width: 100%; min-height: 0; padding: 8px 0 24px; }
 .hero-photograph { grid-area: photo; position: relative; top: auto; right: auto; width: 94%; max-width: 430px; height: auto; margin: 0 auto; padding: 9px; transform: translateY(24px) rotate(2deg); }
 .hero-photograph > img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; object-position: 72% center; }
 .hero-envelope { grid-area: letter; align-self: end; justify-self: center; position: relative; top: auto; left: auto; width: 92%; max-width: 360px; height: auto; aspect-ratio: 1.5; margin: 0; transform: rotate(-4deg); }
 .hero-letter { grid-area: letter; position: relative; top: auto; left: auto; width: 86%; max-width: 340px; height: auto; min-height: 0; margin: -54px auto 50px; padding: 28px 18px 30px; }
 .hero-letter .eyebrow { max-width: 240px; }
 #couple-names { font-size: clamp(56px,15vw,72px); line-height: .95; margin: 14px 0; }
 .hero-date { margin-top: 20px; }
 .hero-discover { margin-top: 20px; }
 .hero-countdown { grid-area: countdown; justify-self: center; position: relative; top: auto; bottom: auto; left: auto; width: 92%; max-width: 360px; margin: 0; padding: 18px 12px; }
 .hero-bottomline { margin-top: 5px; }
 .romance-hero, #couple, #gallery, #accomodations, #dress-code-items.cta.no-overlay { background-size: auto,640px 640px; }
}
/* Contador centrado y superpuesto al borde inferior de la foto en computadora. */
@media (min-width: 768px) {
 .romance-hero { min-height: 0; }
 .hero-composition { min-height: 750px; }
 .hero-envelope { top: 94px; height: 452px; }
 .hero-photograph { top: 47px; height: 610px; }
 .hero-countdown { left: 50%; bottom: 40px; width: min(550px,60%); transform: translateX(-50%); }
}

/* Sin franja de nombres, fecha ni línea superior en las dos portadas. */
.welcome-topline, .hero-edition { display: none; }

/* Un único monograma BR para menú e historia. */
.couple-monogram { font-family: var(--cursive-font-family); font-weight: 400; line-height: 1.2; white-space: nowrap; }
.story-monogram { font-size: 58px; color: var(--peach); margin: 0 0 20px; }
@media (max-width: 767px) {
 .story-monogram { text-align: center; }
}

/* Recordatorio de calendario centrado y con acciones destacadas. */
.add-to-calendar { width: min(620px,100%); margin: 64px auto 0; padding: 32px 30px 36px; text-align: center; background: var(--paper); border-radius: 42px 0 42px 0; }
.add-to-calendar h4 { font-family: var(--cursive-font-family); font-weight: 400; font-size: clamp(34px,4vw,46px); line-height: 1.25; color: var(--rust); margin: 0 0 12px; }
.add-to-calendar .calendar-date { font-size: 14px; color: var(--peach); letter-spacing: .16em; margin: 0 0 24px; }
.calendar-buttons { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; }
.calendar-buttons .mw-btn { min-width: 180px; min-height: 46px; background: var(--sage-deep); border-color: var(--sage-deep); color: var(--paper) !important; }
.calendar-buttons .calendar-ios:hover { background: #424d38; border-color: #424d38; }
.calendar-buttons .calendar-google { background: var(--rust); border-color: var(--rust); }
.calendar-buttons .calendar-google:hover { background: #7a4930; border-color: #7a4930; }
@media (max-width: 480px) {
 .add-to-calendar { margin-top: 45px; padding: 28px 20px 30px; }
 .calendar-buttons .mw-btn { width: 100%; }
}

/* Encuadre individual: conservar las tarjetas llenas y acercar a ambos novios. */
.romance-gallery-link[href$="img-3.jpg"] img { object-position: 90% center; }
.romance-gallery-link[href$="img-4.jpg"] img { object-position: 85% center; }
.romance-registry a.register { text-decoration: none; transition: transform .2s, box-shadow .2s; }
.romance-registry a.register:hover { transform: translateY(-4px); box-shadow: 0 8px 20px #503e351c; }
.romance-registry a.register:focus-visible { outline: 2px solid var(--rust); outline-offset: 4px; }
.itinerary-cards { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 20px; }
.itinerary-card { padding: 28px 18px; text-align: center; border: 1px solid var(--peach); border-radius: var(--photo-corners); background: var(--paper); }
.itinerary-icon { display: flex; align-items: center; justify-content: center; height: 70px; margin-bottom: 18px; }
.itinerary-icon svg { width: 68px; height: 64px; fill: var(--sage-deep); }
.itinerary-card .itinerary-time { color: var(--sage-deep); font-size: 17px; letter-spacing: .04em; margin-bottom: 10px; }
.itinerary-card h3 { font-family: var(--font-family); font-size: 23px; font-weight: 500; margin: 0 0 10px; }
.itinerary-card > p:last-child { font-size: 18px; line-height: 1.5; margin: 0; }
@media (max-width: 991px) { .itinerary-cards { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 480px) { .itinerary-cards { gap: 14px; } .itinerary-card { padding: 23px 12px; border-radius: 32px 0 32px 0; } .itinerary-card h3 { font-size: 21px; } .itinerary-card .itinerary-time { font-size: 16px; } }

/* Evitar anillos duplicados al abrir y cerrar fotografías. */
.picnic-lightbox button:focus,
.picnic-lightbox button:focus-visible,
.romance-gallery-link:focus,
.romance-gallery-link:focus-visible { outline: none; box-shadow: none; }
.romance-gallery-link { border: 0; -webkit-tap-highlight-color: transparent; }
.picnic-lightbox button:focus-visible { background: #ffffff18; }
.romance-gallery-link:focus-visible::after { background: var(--rust); color: var(--paper); }

/* Reservar el rótulo personalizado evita saltos si el servicio tarda en responder. */
.has-guest-label #rotuloapi { min-height: 1.3em; }

/* La carta de bienvenida comparte la curva superior de las demás tarjetas. */
.welcome-letter { border-top-left-radius: 48px; }
.welcome-letter::before { border-radius: inherit; }
@media (max-width: 767px) { .welcome-letter { border-top-left-radius: 36px; } }