@import url('https://fonts.googleapis.com/css2?family=Bree+Serif&family=Lora:wght@400;500;600;700&display=swap');
@font-face{font-family:'WeddingDisplay';src:url('/fonts/display.woff2') format('woff2');font-weight:400 800;font-style:normal;font-display:swap}
@font-face{font-family:'WeddingBody';src:url('/fonts/body.woff2') format('woff2');font-weight:300 800;font-style:normal;font-display:swap}
:root{
  --cream:#eee8dc;
  --cream2:#f4efe6;
  --ink:#2f2d2a;
  --soft:#6d665f;
  --dark:#292622;
  --blue:#7f98ad;
  --gold:#c6a04b;
  --max:1460px;
}
*{box-sizing:border-box} html{scroll-behavior:smooth} body{margin:0;background:var(--cream);color:var(--ink);font-family:'WeddingBody','Lora', Arial, Helvetica, sans-serif;line-height:1.55;font-size:18px} img{display:block;max-width:100%} a{color:inherit}
/* A close, original recreation of the reference mood: transparent nav, cream bokeh, arched portraits, waves. */
.site-nav{position:absolute;top:0;left:0;right:0;height:126px;z-index:20;color:var(--ink);background:linear-gradient(to bottom,rgba(239,234,226,.78) 0%,rgba(239,234,226,.50) 58%,rgba(239,234,226,0) 100%)}
.nav-inner{height:88px;padding:0 78px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px}.nav-left,.nav-right{display:flex;align-items:center;gap:25px}.nav-right{justify-content:flex-end}.nav-left a,.nav-right a{text-decoration:none;font-size:17px;line-height:1}.site-title{font-family:'WeddingDisplay','Bree Serif', Georgia, 'Times New Roman', serif!important;text-decoration:none;font-size:28px!important;white-space:nowrap}.rsvp-link{background:#2f2c29;color:white!important;text-decoration:none;border-radius:4px;padding:17px 27px;font-size:17px!important}.menu-button{display:none;background:none;border:0;font-size:16px;color:var(--ink)}

.home-hero{height:1880px;position:relative;background-image:linear-gradient(rgba(35,32,28,.08),rgba(35,32,28,.08)),url('/assets/ref-home-hero.webp');background-size:cover;background-position:center 64%;display:flex;align-items:flex-start;justify-content:center;text-align:center;color:white;overflow:hidden}.home-hero .home-title-block{position:relative;margin-top:225px;z-index:2}.home-hero .kicker{font-family:'WeddingDisplay','Bree Serif', Georgia, 'Times New Roman', serif;font-weight:800;font-size:38px;letter-spacing:.04em;margin:0 0 28px;color:white}.home-hero h1{font-family:'WeddingDisplay','Bree Serif', Georgia, 'Times New Roman', serif;font-size:74px;font-weight:400;line-height:1;margin:0;color:white}.home-hero .date-line{font-family:'WeddingDisplay','Bree Serif', Georgia, 'Times New Roman', serif;font-weight:800;font-size:35px;letter-spacing:.08em;margin:38px 0 0;color:white}.home-hero .countdown{display:none}
.story-hero,.page-hero{height:410px;position:relative;background-size:cover;background-position:center;display:flex;align-items:flex-end;overflow:hidden}.story-hero:before,.page-hero:before{content:"";position:absolute;inset:0;background:rgba(238,232,220,.38)}.story-hero h1,.page-hero h1{position:relative;margin:0 0 58px 78px;font-family:'WeddingDisplay','Bree Serif', Georgia, 'Times New Roman', serif;font-weight:400;font-size:82px;letter-spacing:.01em;color:#393733}.story-hero{background-image:url('/assets/ref-home-hero.webp');background-position:center 31%}.travel-hero{background-image:url('/assets/cabin-smile.webp')}.registry-hero{background-image:url('/assets/hand-kiss.webp')}.rsvp-hero{background-image:url('/assets/heart-arch.webp')}.plan-hero{background-image:url('/assets/long-bridge.webp')}

.countdown{display:grid;grid-template-columns:repeat(4,1fr);width:min(660px,90vw);margin:32px auto 0;border-top:1px solid rgba(47,45,42,.25);border-bottom:1px solid rgba(47,45,42,.25);position:relative}.countdown div{padding:15px 12px;border-right:1px solid rgba(47,45,42,.25)}.countdown div:last-child{border-right:0}.countdown strong{display:block;font-family:'WeddingDisplay','Bree Serif', Georgia, 'Times New Roman', serif;font-size:34px;font-weight:400;color:var(--ink)}.countdown span{font-size:12px;text-transform:uppercase;letter-spacing:.13em;color:var(--soft)}

.home-story-band{height:650px;margin-top:-120px;padding-top:126px;position:relative;z-index:2;display:grid;place-items:center;background-image:linear-gradient(rgba(47,45,42,.30),rgba(47,45,42,.30)),url('/assets/ref-reeds.webp');background-size:cover;background-position:center 49%;overflow:hidden;color:white;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 650' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 116 C240 70 480 62 720 94 C960 126 1200 126 1440 86 L1440 536 C1200 576 960 576 720 544 C480 512 240 520 0 566 Z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 650' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 116 C240 70 480 62 720 94 C960 126 1200 126 1440 86 L1440 536 C1200 576 960 576 720 544 C480 512 240 520 0 566 Z'/%3E%3C/svg%3E");-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.home-story-band .band-inner{position:relative;z-index:3;text-align:center;margin-top:0;transform:translateY(-22px)}.home-story-band h2{font-family:'WeddingDisplay','Bree Serif', Georgia, 'Times New Roman', serif;font-size:48px;font-weight:800;color:white;margin:0 0 22px;transform:translateY(-24px)}.dark-button{display:inline-block;background:#302d29;color:white;text-decoration:none;border-radius:4px;padding:18px 36px;text-transform:uppercase;letter-spacing:.14em;font-size:13px;font-weight:700}.ceremony-section{position:relative;z-index:1;margin-top:-250px;background-image:linear-gradient(rgba(236,244,247,.72),rgba(236,244,247,.72)),url('/assets/ref-clouds.webp');background-size:cover;background-position:center;padding:360px 80px 140px;display:grid;grid-template-columns:1fr 1fr;gap:85px;align-items:center;mask-repeat:no-repeat}.ceremony-image{width:620px;height:760px;object-fit:cover;object-position:70% center !important;border-radius:50% 50% 0 0 / 22% 22% 0 0;justify-self:center}.ceremony-copy{text-align:center;color:#393733;max-width:760px}.ceremony-copy h2{font-family:'WeddingDisplay','Bree Serif', Georgia, 'Times New Roman', serif;font-size:76px;line-height:1;margin:0 0 26px}.ceremony-copy h4{font-family:'WeddingDisplay','Bree Serif', Georgia, 'Times New Roman', serif;font-size:28px;letter-spacing:.07em;margin:0 0 28px;font-weight:400}.ceremony-copy p{font-size:20px;line-height:1.65;margin:0 0 22px}.home-rsvp-band{height:780px;margin-top:-135px;padding-top:185px;position:relative;z-index:2;display:grid;place-items:start center;background-image:linear-gradient(rgba(198,160,75,.35),rgba(198,160,75,.35)),url('/assets/ref-rsvp-banner.webp');background-size:cover;background-position:center;color:white;text-align:center;overflow:hidden;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 780' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 78 C240 46 480 30 720 66 C960 102 1200 102 1440 78 L1440 668 C1200 636 960 620 720 656 C480 692 240 692 0 668 Z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 780' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 78 C240 46 480 30 720 66 C960 102 1200 102 1440 78 L1440 668 C1200 636 960 620 720 656 C480 692 240 692 0 668 Z'/%3E%3C/svg%3E");-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.home-rsvp-band h2{font-family:'WeddingDisplay','Bree Serif', Georgia, 'Times New Roman', serif;font-size:74px;font-weight:400;margin:0 0 34px;color:white;position:relative;z-index:3}.home-rsvp-band .dark-button{position:relative;z-index:3}
.bokeh{position:relative;background:var(--cream);overflow:hidden}.bokeh:before{content:"";position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(circle at 10% 20%,rgba(255,255,255,.85) 0 3px,transparent 4px),radial-gradient(circle at 18% 55%,rgba(255,255,255,.45) 0 11px,transparent 13px),radial-gradient(circle at 39% 13%,rgba(255,255,255,.55) 0 8px,transparent 10px),radial-gradient(circle at 53% 36%,rgba(255,255,255,.55) 0 5px,transparent 7px),radial-gradient(circle at 75% 24%,rgba(255,255,255,.65) 0 4px,transparent 6px),radial-gradient(circle at 92% 52%,rgba(255,255,255,.45) 0 15px,transparent 17px),radial-gradient(circle at 88% 10%,rgba(255,255,255,.45) 0 7px,transparent 9px),radial-gradient(circle at 5% 78%,rgba(255,255,255,.65) 0 9px,transparent 12px);background-size:280px 260px,460px 410px,340px 310px,500px 430px,280px 240px,420px 380px,370px 330px,520px 470px;opacity:.85}.story-grid{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:90px;max-width:1360px;margin:0 auto;padding:78px 72px 84px;align-items:start}.quote-big{font-family:'WeddingDisplay','Bree Serif', Georgia, 'Times New Roman', serif;font-weight:700;font-size:41px;line-height:1.27;text-align:center;margin:90px 0 44px;color:#2f2d2a}.story-copy{max-width:690px;margin:0 auto;text-align:center;color:#3a3936}.story-copy p{margin:0 0 24px}.arch-img{width:570px;height:760px;object-fit:cover;object-position:center;border-radius:48% 48% 0 0 / 24% 24% 0 0;margin:0 auto}.wave-banner{height:330px;margin-top:-1px;position:relative;display:grid;place-items:center;background-image:linear-gradient(rgba(47,45,42,.28),rgba(47,45,42,.28)),url('/assets/cabin-kiss.webp');background-size:cover;background-position:center 50%;overflow:hidden}.wave-banner:before,.wave-banner:after{content:"";position:absolute;left:-5%;width:110%;height:78px;background:var(--cream);z-index:2}.wave-banner:before{top:-1px;border-radius:0 0 50% 50%/0 0 100% 100%;transform:rotate(2deg)}.wave-banner:after{bottom:-1px;border-radius:50% 50% 0 0/100% 100% 0 0;transform:rotate(-2deg)}.wave-banner h2{position:relative;z-index:3;color:white;font-family:'WeddingDisplay','Bree Serif', Georgia, 'Times New Roman', serif;font-size:48px;font-weight:700;letter-spacing:.02em;text-align:center}

.masonry{max-width:1500px;margin:82px auto 90px;padding:0 58px;columns:4 270px;column-gap:24px}.masonry img{width:100%;break-inside:avoid;margin:0 0 24px;object-fit:cover}.masonry img.tall{height:560px}.masonry img.med{height:335px}.masonry img.square{height:420px}.masonry img.wide{height:285px}.masonry img.bw{filter:grayscale(1)}

.section{max-width:1120px;margin:0 auto;padding:80px 34px}.center{text-align:center}.section h2{font-family:'WeddingDisplay','Bree Serif', Georgia, 'Times New Roman', serif;font-size:56px;font-weight:400;margin:0 0 18px}.section p{color:#48443f}.button{display:inline-block;text-decoration:none;border:1px solid var(--ink);padding:13px 22px;margin-top:16px;background:transparent;text-transform:uppercase;letter-spacing:.12em;font-size:13px}.button:hover{background:var(--ink);color:var(--cream)}.details-card{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}.details-card img{height:540px;width:100%;object-fit:cover}.travel-list{max-width:900px;margin:0 auto}.travel-item{display:grid;grid-template-columns:150px 1fr;gap:34px;border-top:1px solid rgba(47,45,42,.20);padding:36px 0}.travel-icon{aspect-ratio:1;display:grid;place-items:center;background:rgba(127,152,173,.22);font-family:'WeddingDisplay','Bree Serif', Georgia, 'Times New Roman', serif;font-size:48px;color:var(--blue)}.travel-item h2{font-family:'WeddingDisplay','Bree Serif', Georgia, 'Times New Roman', serif;font-weight:400;font-size:38px;margin:0 0 6px}.registry-box,.rsvp-box{max-width:850px;margin:70px auto 90px;text-align:center;padding:55px 44px;background:rgba(255,255,255,.25);border:1px solid rgba(47,45,42,.20)}.registry-box h2,.rsvp-box h2{font-family:'WeddingDisplay','Bree Serif', Georgia, 'Times New Roman', serif;font-size:56px;font-weight:400;margin:0 0 16px}

.code-form{max-width:590px;margin:35px auto 0;text-align:left}.code-form label,.guest-card label{display:block;font-weight:600;color:var(--ink)}.code-row{display:grid;grid-template-columns:1fr auto;gap:12px;margin-top:8px}input,select,textarea{width:100%;border:1px solid rgba(47,45,42,.22);background:rgba(255,255,255,.8);padding:13px 12px;font:inherit;border-radius:0}textarea{min-height:80px;resize:vertical}.form-message{min-height:26px;color:var(--blue);font-weight:600}.hidden{display:none}.guest-area{margin-top:34px;text-align:left}.guest-card{border-top:1px solid rgba(47,45,42,.20);padding:24px 0}.guest-card h4{font-family:'WeddingDisplay','Bree Serif', Georgia, 'Times New Roman', serif;font-size:26px;font-weight:400;margin:0 0 14px}.guest-card .grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.guest-card .full{grid-column:1/-1}

.site-footer{position:relative;z-index:1;margin-top:-265px;min-height:460px;background-image:linear-gradient(rgba(238,232,220,.35),rgba(238,232,220,.35)),url('/assets/ref-reeds.webp');background-size:cover;background-position:center 70%;padding:285px 70px 60px;color:#211f1c;display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;mask-repeat:no-repeat}.site-footer>*{position:relative;z-index:1}.footer-contact{font-weight:700;font-size:21px}.footer-links{display:flex;flex-direction:column;align-items:center;gap:4px}.footer-links a{font-size:22px}.made{align-self:end;color:white;font-size:22px}.footer-date{text-align:right;font-family:'WeddingDisplay','Bree Serif', Georgia, 'Times New Roman', serif;font-size:22px;color:white}

@media(max-width:900px){.nav-inner{height:74px;padding:0 20px;grid-template-columns:auto 1fr auto}.menu-button{display:block}.nav-left,.nav-right{display:none}.site-title{justify-self:center;font-size:21px!important}.site-nav.open .nav-left,.site-nav.open .nav-right{position:absolute;top:74px;left:0;right:0;background:var(--cream);display:flex;flex-direction:column;padding:15px 24px;gap:12px}.site-nav.open .nav-right{top:285px}.story-hero,.page-hero{height:330px}.story-hero h1,.page-hero h1{margin:0 24px 36px;font-size:52px}.home-hero{height:520px}.home-hero h1{font-size:70px}.story-grid{grid-template-columns:1fr;padding:52px 24px;gap:45px}.quote-big{font-size:30px;margin:20px 0 28px}.arch-img{height:560px}.masonry{columns:2 180px;padding:0 18px}.masonry img.tall,.masonry img.med,.masonry img.square,.masonry img.wide{height:auto}.details-card,.travel-item{grid-template-columns:1fr}.code-row,.guest-card .grid{grid-template-columns:1fr}.site-footer{grid-template-columns:1fr;text-align:center;gap:24px;padding:100px 24px 48px}.footer-date{text-align:center}.countdown{grid-template-columns:repeat(2,1fr)}}

/* v10 mobile/reference refinements */
@media(max-width:900px){
  .site-nav{position:relative;height:64px;background:rgba(239,234,226,.96)}
  .nav-inner{height:64px;padding:0 22px;display:flex;align-items:center;justify-content:space-between;gap:16px}
  .site-title{order:1;justify-self:auto;font-size:14px!important;letter-spacing:.01em!important}
  .menu-button{order:2;display:block;font-size:0;width:24px;height:18px;position:relative;background:transparent;border:0;padding:0}
  .menu-button:before,.menu-button:after{content:"";position:absolute;right:0;width:24px;height:1px;background:#2f2d2a}
  .menu-button:before{top:5px}.menu-button:after{bottom:5px}
  .nav-left,.nav-right{display:none}
  .site-nav.open .nav-left,.site-nav.open .nav-right{position:absolute;top:64px;left:0;right:0;background:rgba(239,234,226,.98);display:flex;flex-direction:column;padding:18px 24px;gap:12px;z-index:30}
  .site-nav.open .nav-right{top:250px}
  .home-hero{height:700px;background-position:center 62%}
  .home-hero .home-title-block{margin-top:82px}
  .home-hero .kicker{font-size:24px;margin-bottom:20px}
  .home-hero h1{font-size:42px}
  .home-hero .date-line{font-size:22px;margin-top:22px}
  .home-story-band{height:500px;margin-top:-105px;padding-top:130px;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 500' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 86 C240 48 480 44 720 68 C960 92 1200 92 1440 60 L1440 374 C1200 406 960 406 720 382 C480 358 240 362 0 400 Z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 500' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 86 C240 48 480 44 720 68 C960 92 1200 92 1440 60 L1440 374 C1200 406 960 406 720 382 C480 358 240 362 0 400 Z'/%3E%3C/svg%3E");-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
  .home-story-band .band-inner{transform:translateY(-16px)}
  .home-story-band h2{font-size:28px;line-height:1.1;transform:translateY(-18px)}
  .dark-button{padding:14px 26px;font-size:11px}
  .ceremony-section{grid-template-columns:1fr;margin-top:-195px;padding:255px 26px 90px;gap:30px}
  .ceremony-image{width:100%;height:auto;max-height:none;object-position:70% center !important}
  .ceremony-copy h2{font-size:42px}
  .ceremony-copy h4{font-size:17px}
  .ceremony-copy p{font-size:14px;line-height:1.55}
  .home-rsvp-band{height:570px;margin-top:-80px;padding-top:135px;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 570' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 62 C240 34 480 22 720 50 C960 78 1200 78 1440 62 L1440 462 C1200 434 960 422 720 450 C480 478 240 478 0 462 Z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 570' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 62 C240 34 480 22 720 50 C960 78 1200 78 1440 62 L1440 462 C1200 434 960 422 720 450 C480 478 240 478 0 462 Z'/%3E%3C/svg%3E");-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
  .home-rsvp-band h2{font-size:39px;line-height:1.08}
  .site-footer{grid-template-columns:1fr;margin-top:-205px;min-height:420px;padding:225px 24px 42px;text-align:center;gap:22px}
  .footer-date{text-align:center}
}


/* mobile homepage story-wave alignment patch — based only on uploaded v3 RAR */
@media(max-width:900px){
  /* Pull the story band upward on mobile so it appears closer to the reference timing. */
  .home-hero{height:630px;background-position:center 62%}

  /* Make the reeds/Our Story band shorter and less dominant on mobile. */
  .home-story-band{
    height:355px;
    margin-top:-150px;
    padding-top:0;
    place-items:center;
    -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 355' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 82 C240 46 480 42 720 66 C960 90 1200 90 1440 58 L1440 265 C1200 297 960 297 720 273 C480 249 240 253 0 291 Z'/%3E%3C/svg%3E");
    mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 355' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 82 C240 46 480 42 720 66 C960 90 1200 90 1440 58 L1440 265 C1200 297 960 297 720 273 C480 249 240 253 0 291 Z'/%3E%3C/svg%3E");
    -webkit-mask-size:100% 100%;
    mask-size:100% 100%;
    -webkit-mask-repeat:no-repeat;
    mask-repeat:no-repeat;
  }
  .home-story-band .band-inner{
    transform:translateY(-6px);
  }
  .home-story-band h2{
    font-size:24px;
    line-height:1.08;
    margin:0 0 12px;
    transform:none;
  }
  .home-story-band .dark-button{
    padding:12px 22px;
    font-size:10px;
  }

  /* Bring the arched ceremony photo up closer to the story wave. */
  .ceremony-section{
    margin-top:-108px;
    padding:68px 26px 90px;
    gap:24px;
  }
}


/* mobile nav fix — closer to Jessie/PJ reference */
@media(max-width:900px){
  /* closed state: transparent/faded over hero, not a solid cream bar */
  .site-nav{
    position:absolute;
    top:0;
    left:0;
    right:0;
    height:92px;
    z-index:50;
    background:linear-gradient(to bottom, rgba(239,234,226,.72) 0%, rgba(239,234,226,.38) 62%, rgba(239,234,226,0) 100%) !important;
  }
  .nav-inner{
    height:70px;
    padding:0 20px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
  }
  .site-title{
    order:1;
    justify-self:auto;
    font-size:13px!important;
    line-height:1;
    letter-spacing:.01em!important;
    position:relative;
    z-index:60;
  }
  .menu-button{
    order:2;
    display:block;
    font-size:0;
    width:25px;
    height:25px;
    position:relative;
    background:transparent;
    border:0;
    padding:0;
    z-index:61;
  }
  .menu-button:before,
  .menu-button:after{
    content:"";
    position:absolute;
    right:0;
    width:24px;
    height:1px;
    background:#2f2d2a;
    transition:transform .2s ease, top .2s ease, bottom .2s ease;
  }
  .menu-button:before{top:8px}
  .menu-button:after{bottom:8px}

  /* open state: full translucent overlay, big links, X icon, RSVP at bottom */
  .site-nav.open{
    position:fixed;
    inset:0;
    height:100dvh;
    z-index:999;
    overflow:hidden;
    background:linear-gradient(to bottom, rgba(239,234,226,.88) 0%, rgba(239,234,226,.78) 38%, rgba(239,234,226,.62) 100%) !important;
    backdrop-filter:blur(1px);
  }
  .site-nav.open .nav-inner{
    height:100dvh;
    padding:0 22px;
    align-items:flex-start;
  }
  .site-nav.open .menu-button:before{
    top:12px;
    transform:rotate(45deg);
  }
  .site-nav.open .menu-button:after{
    bottom:12px;
    transform:rotate(-45deg);
  }
  .site-nav.open .site-title{
    margin-top:27px;
  }
  .site-nav.open .menu-button{
    margin-top:22px;
  }
  .site-nav.open .nav-left{
    position:absolute;
    top:142px;
    left:24px;
    right:24px;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:2px;
    padding:0;
    background:transparent!important;
    z-index:60;
  }
  .site-nav.open .nav-left a{
    font-size:30px;
    line-height:1.12;
    font-family:'WeddingBody','Lora',Arial,Helvetica,sans-serif;
    font-weight:400;
    text-decoration:none;
    color:#2f2d2a;
  }
  .site-nav.open .nav-right{
    position:absolute;
    left:24px;
    right:24px;
    bottom:28px;
    top:auto!important;
    display:block;
    padding:0;
    background:transparent!important;
    z-index:60;
  }
  .site-nav.open .rsvp-link{
    display:block;
    width:100%;
    border-radius:4px;
    padding:16px 22px;
    text-align:center;
    font-size:13px!important;
    letter-spacing:.02em;
    background:#2f2c29;
    color:#fff!important;
  }
}

@media(max-width:900px){body.nav-open{overflow:hidden}}


/* our-story page reference pass: hero, animated sparkle field, smoother waves, symmetrical gallery */
.story-hero{
  height:430px;
  background-image:url('/assets/story-champagne.webp') !important;
  background-size:cover;
  background-position:center 43% !important;
}
.story-hero:before{
  background:rgba(238,232,220,.24) !important;
}

.bokeh{
  position:relative;
  background:var(--cream);
  overflow:hidden;
}
.bokeh:before,
.bokeh:after,
.story-grid:before{
  content:"";
  position:absolute;
  inset:-10%;
  pointer-events:none;
}
.bokeh:before,
.bokeh:after{z-index:0;}
.story-grid{position:relative;z-index:1;}
.story-grid:before{z-index:-1;}

/* multi-layer moving sparkle field inspired by the reference site */
.bokeh:before{
  background-image:
    radial-gradient(circle at 10% 18%,rgba(255,255,255,.96) 0 3px,transparent 4px),
    radial-gradient(circle at 23% 60%,rgba(247,243,236,.72) 0 10px,transparent 13px),
    radial-gradient(circle at 39% 16%,rgba(255,255,255,.60) 0 7px,transparent 10px),
    radial-gradient(circle at 54% 34%,rgba(255,252,246,.72) 0 5px,transparent 7px),
    radial-gradient(circle at 71% 24%,rgba(246,247,255,.78) 0 4px,transparent 6px),
    radial-gradient(circle at 88% 56%,rgba(255,255,255,.52) 0 14px,transparent 18px),
    radial-gradient(circle at 83% 14%,rgba(255,247,237,.56) 0 6px,transparent 9px),
    radial-gradient(circle at 8% 80%,rgba(255,255,255,.74) 0 8px,transparent 11px);
  background-size:270px 250px,430px 390px,330px 300px,470px 420px,260px 230px,410px 365px,360px 320px,500px 450px;
  opacity:.90;
  filter:drop-shadow(0 0 8px rgba(255,255,255,.22));
  animation:storySparkleFloatA 8.4s linear infinite;
  will-change:transform,opacity,filter;
}
.bokeh:after{
  background-image:
    radial-gradient(circle at 16% 36%,rgba(255,255,255,.88) 0 2px,transparent 3px),
    radial-gradient(circle at 46% 66%,rgba(251,248,241,.72) 0 5px,transparent 8px),
    radial-gradient(circle at 68% 18%,rgba(255,255,255,.82) 0 3px,transparent 5px),
    radial-gradient(circle at 84% 84%,rgba(243,246,255,.60) 0 10px,transparent 13px),
    radial-gradient(circle at 32% 8%,rgba(255,248,239,.66) 0 8px,transparent 11px),
    radial-gradient(circle at 94% 42%,rgba(255,255,255,.44) 0 13px,transparent 17px);
  background-size:300px 280px,400px 370px,350px 320px,490px 440px,340px 300px,460px 400px;
  opacity:.62;
  filter:drop-shadow(0 0 10px rgba(255,255,255,.18));
  animation:storySparkleFloatB 5.7s ease-in-out infinite;
  will-change:transform,opacity,filter;
}
.story-grid:before{
  inset:-16% -10% -8%;
  background-image:
    radial-gradient(circle at 12% 28%,rgba(255,255,255,.98) 0 1.5px,transparent 2.6px),
    radial-gradient(circle at 29% 74%,rgba(255,247,235,.90) 0 2px,transparent 3px),
    radial-gradient(circle at 58% 18%,rgba(248,248,255,.82) 0 1.5px,transparent 2.8px),
    radial-gradient(circle at 79% 34%,rgba(255,255,255,.92) 0 2px,transparent 3.2px),
    radial-gradient(circle at 90% 70%,rgba(255,249,241,.74) 0 1.8px,transparent 3px),
    radial-gradient(circle at 6% 58%,rgba(255,255,255,.80) 0 1.8px,transparent 3px),
    radial-gradient(circle at 47% 48%,rgba(255,252,247,.78) 0 2.2px,transparent 3.5px);
  background-size:180px 180px,240px 220px,210px 200px,260px 240px,220px 210px,200px 190px,280px 260px;
  opacity:.60;
  filter:drop-shadow(0 0 6px rgba(255,255,255,.14));
  animation:storySparkleFloatC 3.9s ease-in-out infinite;
  will-change:transform,opacity,filter;
}
@keyframes storySparkleFloatA{
  0%{transform:translate3d(-30px,24px,0) scale(1);opacity:.54;filter:drop-shadow(0 0 2px rgba(255,255,255,.06));}
  25%{opacity:.98;filter:drop-shadow(0 0 10px rgba(255,255,255,.25));}
  50%{transform:translate3d(8px,-10px,0) scale(1.02);opacity:.74;filter:drop-shadow(0 0 5px rgba(255,255,255,.14));}
  75%{opacity:1;filter:drop-shadow(0 0 12px rgba(255,255,255,.32));}
  100%{transform:translate3d(44px,-42px,0) scale(1.05);opacity:.58;filter:drop-shadow(0 0 3px rgba(255,255,255,.08));}
}
@keyframes storySparkleFloatB{
  0%{transform:translate3d(16px,12px,0) scale(1);opacity:.28;filter:drop-shadow(0 0 2px rgba(255,255,255,.05));}
  30%{opacity:.82;filter:drop-shadow(0 0 12px rgba(255,255,255,.24));}
  60%{transform:translate3d(-10px,-18px,0) scale(1.05);opacity:.50;filter:drop-shadow(0 0 4px rgba(255,255,255,.10));}
  100%{transform:translate3d(-30px,-34px,0) scale(1.08);opacity:.90;filter:drop-shadow(0 0 13px rgba(255,255,255,.28));}
}
@keyframes storySparkleFloatC{
  0%{transform:translate3d(-8px,10px,0) scale(.98);opacity:.26;filter:drop-shadow(0 0 2px rgba(255,255,255,.04));}
  35%{opacity:.88;filter:drop-shadow(0 0 8px rgba(255,255,255,.22));}
  65%{transform:translate3d(10px,-14px,0) scale(1.05);opacity:.44;filter:drop-shadow(0 0 3px rgba(255,255,255,.08));}
  100%{transform:translate3d(22px,-26px,0) scale(1.08);opacity:.92;filter:drop-shadow(0 0 9px rgba(255,255,255,.24));}
}

.wave-banner{height:330px;margin-top:-1px;position:relative;display:grid;place-items:center;background-image:linear-gradient(rgba(47,45,42,.28),rgba(47,45,42,.28)),url('/assets/cabin-kiss.webp');background-size:cover;background-position:center 50%;overflow:hidden}.wave-banner:before,.wave-banner:after{content:"";position:absolute;left:-5%;width:110%;height:78px;background:var(--cream);z-index:2}.wave-banner:before{top:-1px;border-radius:0 0 50% 50%/0 0 100% 100%;transform:rotate(2deg)}.wave-banner:after{bottom:-1px;border-radius:50% 50% 0 0/100% 100% 0 0;transform:rotate(-2deg)}.wave-banner h2{position:relative;z-index:3;color:white;font-family:'WeddingDisplay','Bree Serif', Georgia, 'Times New Roman', serif;font-size:48px;font-weight:700;letter-spacing:.02em;text-align:center}

.masonry{max-width:1500px;margin:82px auto 90px;padding:0 58px;columns:4 270px;column-gap:24px}.masonry img{width:100%;break-inside:avoid;margin:0 0 24px;object-fit:cover}.masonry img.tall{height:560px}.masonry img.med{height:335px}.masonry img.square{height:420px}.masonry img.wide{height:285px}.masonry img.bw{filter:grayscale(1)}

.section{max-width:1120px;margin:0 auto;padding:80px 34px}.center{text-align:center}.section h2{font-family:'WeddingDisplay','Bree Serif', Georgia, 'Times New Roman', serif;font-size:56px;font-weight:400;margin:0 0 18px}.section p{color:#48443f}.button{display:inline-block;text-decoration:none;border:1px solid var(--ink);padding:13px 22px;margin-top:16px;background:transparent;text-transform:uppercase;letter-spacing:.12em;font-size:13px}.button:hover{background:var(--ink);color:var(--cream)}.details-card{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}.details-card img{height:540px;width:100%;object-fit:cover}.travel-list{max-width:900px;margin:0 auto}.travel-item{display:grid;grid-template-columns:150px 1fr;gap:34px;border-top:1px solid rgba(47,45,42,.20);padding:36px 0}.travel-icon{aspect-ratio:1;display:grid;place-items:center;background:rgba(127,152,173,.22);font-family:'WeddingDisplay','Bree Serif', Georgia, 'Times New Roman', serif;font-size:48px;color:var(--blue)}.travel-item h2{font-family:'WeddingDisplay','Bree Serif', Georgia, 'Times New Roman', serif;font-weight:400;font-size:38px;margin:0 0 6px}.registry-box,.rsvp-box{max-width:850px;margin:70px auto 90px;text-align:center;padding:55px 44px;background:rgba(255,255,255,.25);border:1px solid rgba(47,45,42,.20)}.registry-box h2,.rsvp-box h2{font-family:'WeddingDisplay','Bree Serif', Georgia, 'Times New Roman', serif;font-size:56px;font-weight:400;margin:0 0 16px}

.code-form{max-width:590px;margin:35px auto 0;text-align:left}.code-form label,.guest-card label{display:block;font-weight:600;color:var(--ink)}.code-row{display:grid;grid-template-columns:1fr auto;gap:12px;margin-top:8px}input,select,textarea{width:100%;border:1px solid rgba(47,45,42,.22);background:rgba(255,255,255,.8);padding:13px 12px;font:inherit;border-radius:0}textarea{min-height:80px;resize:vertical}.form-message{min-height:26px;color:var(--blue);font-weight:600}.hidden{display:none}.guest-area{margin-top:34px;text-align:left}.guest-card{border-top:1px solid rgba(47,45,42,.20);padding:24px 0}.guest-card h4{font-family:'WeddingDisplay','Bree Serif', Georgia, 'Times New Roman', serif;font-size:26px;font-weight:400;margin:0 0 14px}.guest-card .grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.guest-card .full{grid-column:1/-1}

.site-footer{position:relative;z-index:1;margin-top:-265px;min-height:460px;background-image:linear-gradient(rgba(238,232,220,.35),rgba(238,232,220,.35)),url('/assets/ref-reeds.webp');background-size:cover;background-position:center 70%;padding:285px 70px 60px;color:#211f1c;display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;mask-repeat:no-repeat}.site-footer>*{position:relative;z-index:1}.footer-contact{font-weight:700;font-size:21px}.footer-links{display:flex;flex-direction:column;align-items:center;gap:4px}.footer-links a{font-size:22px}.made{align-self:end;color:white;font-size:22px}.footer-date{text-align:right;font-family:'WeddingDisplay','Bree Serif', Georgia, 'Times New Roman', serif;font-size:22px;color:white}

@media(max-width:900px){.nav-inner{height:74px;padding:0 20px;grid-template-columns:auto 1fr auto}.menu-button{display:block}.nav-left,.nav-right{display:none}.site-title{justify-self:center;font-size:21px!important}.site-nav.open .nav-left,.site-nav.open .nav-right{position:absolute;top:74px;left:0;right:0;background:var(--cream);display:flex;flex-direction:column;padding:15px 24px;gap:12px}.site-nav.open .nav-right{top:285px}.story-hero,.page-hero{height:330px}.story-hero h1,.page-hero h1{margin:0 24px 36px;font-size:52px}.home-hero{height:520px}.home-hero h1{font-size:70px}.story-grid{grid-template-columns:1fr;padding:52px 24px;gap:45px}.quote-big{font-size:30px;margin:20px 0 28px}.arch-img{height:560px}.masonry{columns:2 180px;padding:0 18px}.masonry img.tall,.masonry img.med,.masonry img.square,.masonry img.wide{height:auto}.details-card,.travel-item{grid-template-columns:1fr}.code-row,.guest-card .grid{grid-template-columns:1fr}.site-footer{grid-template-columns:1fr;text-align:center;gap:24px;padding:100px 24px 48px}.footer-date{text-align:center}.countdown{grid-template-columns:repeat(2,1fr)}}

/* v10 mobile/reference refinements */
@media(max-width:900px){
  .site-nav{position:relative;height:64px;background:rgba(239,234,226,.96)}
  .nav-inner{height:64px;padding:0 22px;display:flex;align-items:center;justify-content:space-between;gap:16px}
  .site-title{order:1;justify-self:auto;font-size:14px!important;letter-spacing:.01em!important}
  .menu-button{order:2;display:block;font-size:0;width:24px;height:18px;position:relative;background:transparent;border:0;padding:0}
  .menu-button:before,.menu-button:after{content:"";position:absolute;right:0;width:24px;height:1px;background:#2f2d2a}
  .menu-button:before{top:5px}.menu-button:after{bottom:5px}
  .nav-left,.nav-right{display:none}
  .site-nav.open .nav-left,.site-nav.open .nav-right{position:absolute;top:64px;left:0;right:0;background:rgba(239,234,226,.98);display:flex;flex-direction:column;padding:18px 24px;gap:12px;z-index:30}
  .site-nav.open .nav-right{top:250px}
  .home-hero{height:700px;background-position:center 62%}
  .home-hero .home-title-block{margin-top:82px}
  .home-hero .kicker{font-size:24px;margin-bottom:20px}
  .home-hero h1{font-size:42px}
  .home-hero .date-line{font-size:22px;margin-top:22px}
  .home-story-band{height:500px;margin-top:-105px;padding-top:130px;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 500' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 86 C240 48 480 44 720 68 C960 92 1200 92 1440 60 L1440 374 C1200 406 960 406 720 382 C480 358 240 362 0 400 Z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 500' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 86 C240 48 480 44 720 68 C960 92 1200 92 1440 60 L1440 374 C1200 406 960 406 720 382 C480 358 240 362 0 400 Z'/%3E%3C/svg%3E");-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
  .home-story-band .band-inner{transform:translateY(-16px)}
  .home-story-band h2{font-size:28px;line-height:1.1;transform:translateY(-18px)}
  .dark-button{padding:14px 26px;font-size:11px}
  .ceremony-section{grid-template-columns:1fr;margin-top:-195px;padding:255px 26px 90px;gap:30px}
  .ceremony-image{width:100%;height:auto;max-height:none;object-position:70% center !important}
  .ceremony-copy h2{font-size:42px}
  .ceremony-copy h4{font-size:17px}
  .ceremony-copy p{font-size:14px;line-height:1.55}
  .home-rsvp-band{height:570px;margin-top:-80px;padding-top:135px;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 570' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 62 C240 34 480 22 720 50 C960 78 1200 78 1440 62 L1440 462 C1200 434 960 422 720 450 C480 478 240 478 0 462 Z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 570' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 62 C240 34 480 22 720 50 C960 78 1200 78 1440 62 L1440 462 C1200 434 960 422 720 450 C480 478 240 478 0 462 Z'/%3E%3C/svg%3E");-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
  .home-rsvp-band h2{font-size:39px;line-height:1.08}
  .site-footer{grid-template-columns:1fr;margin-top:-205px;min-height:420px;padding:225px 24px 42px;text-align:center;gap:22px}
  .footer-date{text-align:center}
}


/* mobile homepage story-wave alignment patch — based only on uploaded v3 RAR */
@media(max-width:900px){
  /* Pull the story band upward on mobile so it appears closer to the reference timing. */
  .home-hero{height:630px;background-position:center 62%}

  /* Make the reeds/Our Story band shorter and less dominant on mobile. */
  .home-story-band{
    height:355px;
    margin-top:-150px;
    padding-top:0;
    place-items:center;
    -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 355' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 82 C240 46 480 42 720 66 C960 90 1200 90 1440 58 L1440 265 C1200 297 960 297 720 273 C480 249 240 253 0 291 Z'/%3E%3C/svg%3E");
    mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 355' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 82 C240 46 480 42 720 66 C960 90 1200 90 1440 58 L1440 265 C1200 297 960 297 720 273 C480 249 240 253 0 291 Z'/%3E%3C/svg%3E");
    -webkit-mask-size:100% 100%;
    mask-size:100% 100%;
    -webkit-mask-repeat:no-repeat;
    mask-repeat:no-repeat;
  }
  .home-story-band .band-inner{
    transform:translateY(-6px);
  }
  .home-story-band h2{
    font-size:24px;
    line-height:1.08;
    margin:0 0 12px;
    transform:none;
  }
  .home-story-band .dark-button{
    padding:12px 22px;
    font-size:10px;
  }

  /* Bring the arched ceremony photo up closer to the story wave. */
  .ceremony-section{
    margin-top:-108px;
    padding:68px 26px 90px;
    gap:24px;
  }
}


/* mobile nav fix — closer to Jessie/PJ reference */
@media(max-width:900px){
  /* closed state: transparent/faded over hero, not a solid cream bar */
  .site-nav{
    position:absolute;
    top:0;
    left:0;
    right:0;
    height:92px;
    z-index:50;
    background:linear-gradient(to bottom, rgba(239,234,226,.72) 0%, rgba(239,234,226,.38) 62%, rgba(239,234,226,0) 100%) !important;
  }
  .nav-inner{
    height:70px;
    padding:0 20px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
  }
  .site-title{
    order:1;
    justify-self:auto;
    font-size:13px!important;
    line-height:1;
    letter-spacing:.01em!important;
    position:relative;
    z-index:60;
  }
  .menu-button{
    order:2;
    display:block;
    font-size:0;
    width:25px;
    height:25px;
    position:relative;
    background:transparent;
    border:0;
    padding:0;
    z-index:61;
  }
  .menu-button:before,
  .menu-button:after{
    content:"";
    position:absolute;
    right:0;
    width:24px;
    height:1px;
    background:#2f2d2a;
    transition:transform .2s ease, top .2s ease, bottom .2s ease;
  }
  .menu-button:before{top:8px}
  .menu-button:after{bottom:8px}

  /* open state: full translucent overlay, big links, X icon, RSVP at bottom */
  .site-nav.open{
    position:fixed;
    inset:0;
    height:100dvh;
    z-index:999;
    overflow:hidden;
    background:linear-gradient(to bottom, rgba(239,234,226,.88) 0%, rgba(239,234,226,.78) 38%, rgba(239,234,226,.62) 100%) !important;
    backdrop-filter:blur(1px);
  }
  .site-nav.open .nav-inner{
    height:100dvh;
    padding:0 22px;
    align-items:flex-start;
  }
  .site-nav.open .menu-button:before{
    top:12px;
    transform:rotate(45deg);
  }
  .site-nav.open .menu-button:after{
    bottom:12px;
    transform:rotate(-45deg);
  }
  .site-nav.open .site-title{
    margin-top:27px;
  }
  .site-nav.open .menu-button{
    margin-top:22px;
  }
  .site-nav.open .nav-left{
    position:absolute;
    top:142px;
    left:24px;
    right:24px;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:2px;
    padding:0;
    background:transparent!important;
    z-index:60;
  }
  .site-nav.open .nav-left a{
    font-size:30px;
    line-height:1.12;
    font-family:'WeddingBody','Lora',Arial,Helvetica,sans-serif;
    font-weight:400;
    text-decoration:none;
    color:#2f2d2a;
  }
  .site-nav.open .nav-right{
    position:absolute;
    left:24px;
    right:24px;
    bottom:28px;
    top:auto!important;
    display:block;
    padding:0;
    background:transparent!important;
    z-index:60;
  }
  .site-nav.open .rsvp-link{
    display:block;
    width:100%;
    border-radius:4px;
    padding:16px 22px;
    text-align:center;
    font-size:13px!important;
    letter-spacing:.02em;
    background:#2f2c29;
    color:#fff!important;
  }
}

@media(max-width:900px){body.nav-open{overflow:hidden}}


/* our-story page reference pass: hero, animated sparkle field, smoother waves, symmetrical gallery */
.story-hero{
  height:430px;
  background-image:url('/assets/story-champagne.webp') !important;
  background-size:cover;
  background-position:center 43% !important;
}
.story-hero:before{
  background:rgba(238,232,220,.24) !important;
}

.bokeh{
  position:relative;
  background:var(--cream);
  overflow:hidden;
}
.bokeh:before,
.bokeh:after,
.story-grid:before{
  content:"";
  position:absolute;
  inset:-10%;
  pointer-events:none;
}
.bokeh:before,
.bokeh:after{z-index:0;}
.story-grid{position:relative;z-index:1;}
.story-grid:before{z-index:-1;}

/* multi-layer moving sparkle field inspired by the reference site */
.bokeh:before{
  background-image:
    radial-gradient(circle at 10% 18%,rgba(255,255,255,.92) 0 3px,transparent 4px),
    radial-gradient(circle at 23% 60%,rgba(249,247,243,.60) 0 10px,transparent 13px),
    radial-gradient(circle at 39% 16%,rgba(255,255,255,.54) 0 7px,transparent 10px),
    radial-gradient(circle at 54% 34%,rgba(255,250,244,.66) 0 5px,transparent 7px),
    radial-gradient(circle at 71% 24%,rgba(248,247,255,.72) 0 4px,transparent 6px),
    radial-gradient(circle at 88% 56%,rgba(255,255,255,.46) 0 14px,transparent 18px),
    radial-gradient(circle at 83% 14%,rgba(255,250,241,.48) 0 6px,transparent 9px),
    radial-gradient(circle at 8% 80%,rgba(255,255,255,.68) 0 8px,transparent 11px);
  background-size:270px 250px,430px 390px,330px 300px,470px 420px,260px 230px,410px 365px,360px 320px,500px 450px;
  opacity:.82;
  animation:storySparkleRiseA 21s linear infinite;
  will-change:transform,opacity;
}
.bokeh:after{
  background-image:
    radial-gradient(circle at 16% 36%,rgba(255,255,255,.82) 0 2px,transparent 3px),
    radial-gradient(circle at 46% 66%,rgba(252,250,245,.58) 0 5px,transparent 8px),
    radial-gradient(circle at 68% 18%,rgba(255,255,255,.74) 0 3px,transparent 5px),
    radial-gradient(circle at 84% 84%,rgba(244,246,255,.50) 0 10px,transparent 13px),
    radial-gradient(circle at 32% 8%,rgba(255,250,243,.55) 0 8px,transparent 11px),
    radial-gradient(circle at 94% 42%,rgba(255,255,255,.38) 0 13px,transparent 17px);
  background-size:300px 280px,400px 370px,350px 320px,490px 440px,340px 300px,460px 400px;
  opacity:.56;
  animation:storySparkleRiseB 13s ease-in-out infinite alternate;
  will-change:transform,opacity;
}
.story-grid:before{
  inset:-16% -10% -8%;
  background-image:
    radial-gradient(circle at 12% 28%,rgba(255,255,255,.96) 0 1.5px,transparent 2.6px),
    radial-gradient(circle at 29% 74%,rgba(255,248,238,.84) 0 2px,transparent 3px),
    radial-gradient(circle at 58% 18%,rgba(248,248,255,.76) 0 1.5px,transparent 2.8px),
    radial-gradient(circle at 79% 34%,rgba(255,255,255,.88) 0 2px,transparent 3.2px),
    radial-gradient(circle at 90% 70%,rgba(255,250,244,.66) 0 1.8px,transparent 3px),
    radial-gradient(circle at 6% 58%,rgba(255,255,255,.74) 0 1.8px,transparent 3px),
    radial-gradient(circle at 47% 48%,rgba(255,252,247,.72) 0 2.2px,transparent 3.5px);
  background-size:180px 180px,240px 220px,210px 200px,260px 240px,220px 210px,200px 190px,280px 260px;
  opacity:.54;
  animation:storySparkleRiseC 8.5s ease-in-out infinite alternate;
  will-change:transform,opacity;
}
@keyframes storySparkleRiseA{
  0%{transform:translate3d(-30px,28px,0);opacity:.70;}
  45%{opacity:.92;}
  100%{transform:translate3d(50px,-42px,0);opacity:.74;}
}
@keyframes storySparkleRiseB{
  0%{transform:translate3d(22px,16px,0) scale(1);opacity:.34;}
  100%{transform:translate3d(-28px,-34px,0) scale(1.05);opacity:.74;}
}
@keyframes storySparkleRiseC{
  0%{transform:translate3d(-12px,14px,0) scale(1);opacity:.38;}
  100%{transform:translate3d(18px,-22px,0) scale(1.04);opacity:.78;}
}

.wave-banner{
  height:410px;
  margin-top:-18px;
  position:relative;
  display:grid;
  place-items:center;
  background-image:linear-gradient(rgba(47,45,42,.18),rgba(47,45,42,.18)),url('/assets/story-grass.webp') !important;
  background-size:cover;
  background-position:center 54%;
  overflow:hidden;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 410' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 88 C240 42 480 28 720 66 C960 104 1200 104 1440 70 L1440 320 C1200 356 960 374 720 336 C480 298 240 312 0 356 Z'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 410' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 88 C240 42 480 28 720 66 C960 104 1200 104 1440 70 L1440 320 C1200 356 960 374 720 336 C480 298 240 312 0 356 Z'/%3E%3C/svg%3E");
  -webkit-mask-size:100% 100%;
  mask-size:100% 100%;
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
}
.wave-banner:before,
.wave-banner:after{display:none !important;}
.wave-banner h2{
  position:relative;
  z-index:2;
  margin:0;
  transform:translateY(-4px);
  color:white;
  text-shadow:0 1px 12px rgba(0,0,0,.18);
}

.masonry.story-gallery{
  max-width:1380px;
  margin:70px auto 110px;
  padding:0 56px;
  columns:auto;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  grid-auto-rows:185px;
  grid-auto-flow:dense;
  gap:24px;
  align-items:stretch;
}
.masonry.story-gallery img{
  width:100%;
  height:100% !important;
  margin:0;
  display:block;
  object-fit:cover;
  break-inside:auto;
}
.story-gallery .gallery-tall{grid-row:span 3;}
.story-gallery .gallery-wide{grid-column:span 2;grid-row:span 2;}
.story-gallery .gallery-square{grid-row:span 2;}
.story-gallery .gallery-portrait{grid-row:span 2;}
.story-gallery .bw{filter:grayscale(1);}

@media(max-width:900px){
  .story-hero{height:345px;background-position:center 44% !important;}
  .story-hero h1{font-size:48px;margin:0 24px 34px;}
  .bokeh:before{animation-duration:7.4s;}
  .bokeh:after{animation-duration:5.0s;}
  .story-grid:before{animation-duration:3.5s;}
  .story-grid{padding:46px 24px 54px;gap:36px;}
  .wave-banner{
    height:300px;
    margin-top:-10px;
    background-position:center 52%;
    -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 300' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 62 C240 34 480 24 720 50 C960 76 1200 76 1440 52 L1440 232 C1200 258 960 270 720 244 C480 218 240 228 0 256 Z'/%3E%3C/svg%3E");
    mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 300' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 62 C240 34 480 24 720 50 C960 76 1200 76 1440 52 L1440 232 C1200 258 960 270 720 244 C480 218 240 228 0 256 Z'/%3E%3C/svg%3E");
  }
  .wave-banner h2{font-size:32px;line-height:1.08;padding:0 28px;}
  .masonry.story-gallery{
    grid-template-columns:repeat(2,minmax(0,1fr));
    grid-auto-rows:145px;
    gap:14px;
    padding:0 18px;
    margin:45px auto 70px;
  }
  .story-gallery .gallery-tall{grid-row:span 3;}
  .story-gallery .gallery-wide{grid-column:span 2;grid-row:span 2;}
  .story-gallery .gallery-square,
  .story-gallery .gallery-portrait{grid-row:span 2;}
}

/* story page footer wave: keep other pages untouched */
.our-story-page .site-footer{
  margin-top:-145px;
  padding-top:245px;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 470' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 120 C240 70 480 52 720 88 C960 124 1200 124 1440 86 L1440 470 L0 470 Z'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 470' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 120 C240 70 480 52 720 88 C960 124 1200 124 1440 86 L1440 470 L0 470 Z'/%3E%3C/svg%3E");
  -webkit-mask-size:100% 100%;
  mask-size:100% 100%;
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
}
@media(max-width:900px){
  .our-story-page .site-footer{
    margin-top:-90px;
    padding-top:170px;
    -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 420' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 92 C240 50 480 38 720 66 C960 94 1200 94 1440 62 L1440 420 L0 420 Z'/%3E%3C/svg%3E");
    mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 420' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 92 C240 50 480 38 720 66 C960 94 1200 94 1440 62 L1440 420 L0 420 Z'/%3E%3C/svg%3E");
  }
}


/* our-story sparkle continuity pass: dense, seamless, continuously drifting field */
body.our-story-page .bokeh,
body.our-story-page .story-grid{position:relative;overflow:hidden;}
body.our-story-page .bokeh:before,
body.our-story-page .bokeh:after,
body.our-story-page .story-grid:before{
  content:"";
  position:absolute;
  inset:-10%;
  pointer-events:none;
  z-index:0;
  will-change:background-position,opacity,filter,transform;
}
body.our-story-page .story-grid{z-index:1;}
body.our-story-page .story-grid:before{z-index:-1;}

/* Layer 1: dense small/medium particles moving continuously right */
body.our-story-page .bokeh:before{
  background-image:
    radial-gradient(circle at 18px 20px, rgba(255,255,255,.98) 0 2px, transparent 2.7px),
    radial-gradient(circle at 88px 48px, rgba(255,247,237,.82) 0 7px, transparent 9px),
    radial-gradient(circle at 154px 92px, rgba(250,250,255,.88) 0 3px, transparent 4px),
    radial-gradient(circle at 210px 34px, rgba(255,255,255,.76) 0 5px, transparent 6.5px),
    radial-gradient(circle at 292px 70px, rgba(255,250,244,.84) 0 2px, transparent 3px),
    radial-gradient(circle at 356px 20px, rgba(255,255,255,.92) 0 8px, transparent 10px),
    radial-gradient(circle at 430px 104px, rgba(249,248,255,.72) 0 4px, transparent 5.5px),
    radial-gradient(circle at 508px 58px, rgba(255,255,255,.90) 0 2.5px, transparent 3.5px),
    radial-gradient(circle at 568px 18px, rgba(255,247,239,.70) 0 6px, transparent 7.5px),
    radial-gradient(circle at 640px 86px, rgba(255,255,255,.96) 0 3px, transparent 4px);
  background-size:680px 150px;
  background-repeat:repeat;
  opacity:.68;
  filter:drop-shadow(0 0 1px rgba(255,255,255,.08));
  animation:
    storySeamlessDriftA 3.2s linear infinite,
    storyGlowPulseA 1.18s ease-in-out infinite;
}

/* Layer 2: larger softer glow particles, also continuous */
body.our-story-page .bokeh:after{
  background-image:
    radial-gradient(circle at 42px 38px, rgba(255,255,255,.60) 0 10px, transparent 14px),
    radial-gradient(circle at 146px 110px, rgba(255,249,242,.68) 0 5px, transparent 7px),
    radial-gradient(circle at 246px 28px, rgba(255,255,255,.54) 0 13px, transparent 18px),
    radial-gradient(circle at 332px 82px, rgba(248,247,255,.62) 0 7px, transparent 10px),
    radial-gradient(circle at 420px 52px, rgba(255,255,255,.70) 0 4px, transparent 6px),
    radial-gradient(circle at 528px 18px, rgba(255,248,239,.55) 0 11px, transparent 15px),
    radial-gradient(circle at 620px 94px, rgba(255,255,255,.60) 0 6px, transparent 8px);
  background-size:700px 160px;
  background-repeat:repeat;
  opacity:.40;
  filter:drop-shadow(0 0 1px rgba(255,255,255,.06));
  animation:
    storySeamlessDriftB 2.4s linear infinite,
    storyGlowPulseB .96s ease-in-out infinite;
}

/* Layer 3: extra fine glitter over the content area */
body.our-story-page .story-grid:before{
  inset:-8%;
  background-image:
    radial-gradient(circle at 16px 20px, rgba(255,255,255,.98) 0 1.4px, transparent 2px),
    radial-gradient(circle at 54px 60px, rgba(255,247,236,.88) 0 1.8px, transparent 2.4px),
    radial-gradient(circle at 112px 24px, rgba(248,248,255,.90) 0 1.4px, transparent 2px),
    radial-gradient(circle at 166px 74px, rgba(255,255,255,.86) 0 2px, transparent 2.8px),
    radial-gradient(circle at 228px 44px, rgba(255,250,244,.78) 0 1.6px, transparent 2.4px),
    radial-gradient(circle at 284px 12px, rgba(255,255,255,.92) 0 2px, transparent 2.8px),
    radial-gradient(circle at 338px 66px, rgba(255,247,239,.80) 0 1.6px, transparent 2.3px),
    radial-gradient(circle at 396px 30px, rgba(255,255,255,.90) 0 1.4px, transparent 2px);
  background-size:420px 100px;
  background-repeat:repeat;
  opacity:.30;
  filter:drop-shadow(0 0 0 rgba(255,255,255,.04));
  animation:
    storySeamlessDriftC 1.9s linear infinite,
    storyGlowPulseC .72s ease-in-out infinite;
}

/* Seamless horizontal drift: exactly one tile-width so it loops continuously */
@keyframes storySeamlessDriftA {
  from { background-position: 0 0; }
  to   { background-position: 680px 8px; }
}
@keyframes storySeamlessDriftB {
  from { background-position: 0 0; }
  to   { background-position: 700px -6px; }
}
@keyframes storySeamlessDriftC {
  from { background-position: 0 0; }
  to   { background-position: 420px 4px; }
}

/* Glow: brighter + slightly larger feeling via stronger blur/shadow and opacity */
@keyframes storyGlowPulseA {
  0%,100% { opacity:.42; filter:drop-shadow(0 0 1px rgba(255,255,255,.08)); transform:scale(.985); }
  50%     { opacity:1;   filter:drop-shadow(0 0 18px rgba(255,255,255,.42)); transform:scale(1.018); }
}
@keyframes storyGlowPulseB {
  0%,100% { opacity:.24; filter:drop-shadow(0 0 1px rgba(255,255,255,.06)); transform:scale(.985); }
  50%     { opacity:.72; filter:drop-shadow(0 0 16px rgba(255,255,255,.30)); transform:scale(1.024); }
}
@keyframes storyGlowPulseC {
  0%,100% { opacity:.16; filter:drop-shadow(0 0 0 rgba(255,255,255,.04)); transform:scale(.98); }
  50%     { opacity:.64; filter:drop-shadow(0 0 10px rgba(255,255,255,.24)); transform:scale(1.03); }
}

@media(max-width:900px){
  body.our-story-page .bokeh:before{
    animation:
      storySeamlessDriftA 2.8s linear infinite,
      storyGlowPulseA 1.02s ease-in-out infinite;
  }
  body.our-story-page .bokeh:after{
    animation:
      storySeamlessDriftB 2.1s linear infinite,
      storyGlowPulseB .86s ease-in-out infinite;
  }
  body.our-story-page .story-grid:before{
    animation:
      storySeamlessDriftC 1.65s linear infinite,
      storyGlowPulseC .62s ease-in-out infinite;
  }
}


/* our-story sparkle magic-tune: slower than previous, still continuous and seamless */
body.our-story-page .bokeh:before{
  animation:
    storySeamlessDriftA 7.2s linear infinite,
    storyGlowPulseA 2.35s ease-in-out infinite !important;
}
body.our-story-page .bokeh:after{
  animation:
    storySeamlessDriftB 5.8s linear infinite,
    storyGlowPulseB 1.85s ease-in-out infinite !important;
}
body.our-story-page .story-grid:before{
  animation:
    storySeamlessDriftC 4.4s linear infinite,
    storyGlowPulseC 1.45s ease-in-out infinite !important;
}

/* slightly softer glow so it reads like magic, not flashing */
@keyframes storyGlowPulseA {
  0%,100% { opacity:.44; filter:drop-shadow(0 0 2px rgba(255,255,255,.10)); transform:scale(.99); }
  50%     { opacity:.92; filter:drop-shadow(0 0 15px rgba(255,255,255,.34)); transform:scale(1.014); }
}
@keyframes storyGlowPulseB {
  0%,100% { opacity:.26; filter:drop-shadow(0 0 1px rgba(255,255,255,.07)); transform:scale(.99); }
  50%     { opacity:.66; filter:drop-shadow(0 0 13px rgba(255,255,255,.26)); transform:scale(1.018); }
}
@keyframes storyGlowPulseC {
  0%,100% { opacity:.18; filter:drop-shadow(0 0 0 rgba(255,255,255,.04)); transform:scale(.985); }
  50%     { opacity:.56; filter:drop-shadow(0 0 9px rgba(255,255,255,.20)); transform:scale(1.022); }
}

@media(max-width:900px){
  body.our-story-page .bokeh:before{
    animation:
      storySeamlessDriftA 6.4s linear infinite,
      storyGlowPulseA 2.05s ease-in-out infinite !important;
  }
  body.our-story-page .bokeh:after{
    animation:
      storySeamlessDriftB 5.0s linear infinite,
      storyGlowPulseB 1.6s ease-in-out infinite !important;
  }
  body.our-story-page .story-grid:before{
    animation:
      storySeamlessDriftC 3.8s linear infinite,
      storyGlowPulseC 1.25s ease-in-out infinite !important;
  }
}


/* final tiny slowdown: same magic effect, just a tad calmer */
body.our-story-page .bokeh:before{
  animation:
    storySeamlessDriftA 8.4s linear infinite,
    storyGlowPulseA 2.7s ease-in-out infinite !important;
}
body.our-story-page .bokeh:after{
  animation:
    storySeamlessDriftB 6.7s linear infinite,
    storyGlowPulseB 2.15s ease-in-out infinite !important;
}
body.our-story-page .story-grid:before{
  animation:
    storySeamlessDriftC 5.2s linear infinite,
    storyGlowPulseC 1.75s ease-in-out infinite !important;
}

@media(max-width:900px){
  body.our-story-page .bokeh:before{
    animation:
      storySeamlessDriftA 7.4s linear infinite,
      storyGlowPulseA 2.35s ease-in-out infinite !important;
  }
  body.our-story-page .bokeh:after{
    animation:
      storySeamlessDriftB 5.9s linear infinite,
      storyGlowPulseB 1.9s ease-in-out infinite !important;
  }
  body.our-story-page .story-grid:before{
    animation:
      storySeamlessDriftC 4.6s linear infinite,
      storyGlowPulseC 1.55s ease-in-out infinite !important;
  }
}


/* final micro-tune: slightly slower and with longer seamless cycles */
body.our-story-page .bokeh:before{
  background-size: 920px 150px !important;
  animation:
    storySeamlessDriftA 10.2s linear infinite,
    storyGlowPulseA 3.0s ease-in-out infinite !important;
}
body.our-story-page .bokeh:after{
  background-size: 940px 160px !important;
  animation:
    storySeamlessDriftB 8.1s linear infinite,
    storyGlowPulseB 2.35s ease-in-out infinite !important;
}
body.our-story-page .story-grid:before{
  background-size: 560px 100px !important;
  animation:
    storySeamlessDriftC 6.4s linear infinite,
    storyGlowPulseC 1.95s ease-in-out infinite !important;
}

@keyframes storySeamlessDriftA {
  from { background-position: 0 0; }
  to   { background-position: 920px 8px; }
}
@keyframes storySeamlessDriftB {
  from { background-position: 0 0; }
  to   { background-position: 940px -6px; }
}
@keyframes storySeamlessDriftC {
  from { background-position: 0 0; }
  to   { background-position: 560px 4px; }
}

@media(max-width:900px){
  body.our-story-page .bokeh:before{
    animation:
      storySeamlessDriftA 9.0s linear infinite,
      storyGlowPulseA 2.55s ease-in-out infinite !important;
  }
  body.our-story-page .bokeh:after{
    animation:
      storySeamlessDriftB 7.2s linear infinite,
      storyGlowPulseB 2.0s ease-in-out infinite !important;
  }
  body.our-story-page .story-grid:before{
    animation:
      storySeamlessDriftC 5.6s linear infinite,
      storyGlowPulseC 1.7s ease-in-out infinite !important;
  }
}


/* Jessie-style streaming bokeh:
   particles no longer pop in the middle; they drift right and only fade at the edges. */
body.our-story-page .bokeh{
  position:relative;
  overflow:hidden;
}

/* Kill previous sheet/pseudo animations on this page so they cannot restart visibly. */
body.our-story-page .bokeh:before,
body.our-story-page .bokeh:after,
body.our-story-page .story-grid:before{
  background-image:none !important;
  animation:none !important;
  opacity:0 !important;
}

body.our-story-page .story-grid{
  position:relative;
  z-index:1;
}

body.our-story-page .magic-particles{
  position:absolute;
  inset:-12% -20%;
  z-index:0;
  pointer-events:none;
  overflow:hidden;
}

body.our-story-page .magic-particles span{
  position:absolute;
  left:0;
  top:var(--y);
  width:var(--size);
  height:var(--size);
  border-radius:999px;
  background:rgba(255,255,255,var(--alpha));
  box-shadow:
    0 0 var(--glow) rgba(255,255,255,.38),
    0 0 calc(var(--glow) * 1.8) rgba(255,248,236,.16);
  filter:blur(var(--blur));
  opacity:0;
  transform:translate3d(var(--start-x),0,0);
  mix-blend-mode:screen;
  will-change:transform,opacity;
  animation:magicStream var(--duration) linear infinite;
  animation-delay:var(--delay);
}

/* Fade only at left/right edges. Through the middle, opacity stays stable: no popping.
   The path now weaves up and down as it travels right for a more magical feel. */
@keyframes magicStream{
  0%{
    opacity:0;
    transform:translate3d(var(--start-x),0,0) scale(.98);
  }
  6%{
    opacity:var(--alpha);
    transform:translate3d(calc(var(--start-x) + var(--travel) * .06), calc(var(--y1) * .45), 0) scale(1);
  }
  18%{
    opacity:var(--alpha);
    transform:translate3d(calc(var(--start-x) + var(--travel) * .18), var(--y1), 0) scale(1.012);
  }
  33%{
    opacity:calc(var(--alpha) * .98);
    transform:translate3d(calc(var(--start-x) + var(--travel) * .33), var(--y2), 0) scale(1.02);
  }
  49%{
    opacity:calc(var(--alpha) * .94);
    transform:translate3d(calc(var(--start-x) + var(--travel) * .49), var(--y3), 0) scale(1.005);
  }
  64%{
    opacity:var(--alpha);
    transform:translate3d(calc(var(--start-x) + var(--travel) * .64), var(--y4), 0) scale(1.015);
  }
  81%{
    opacity:calc(var(--alpha) * .97);
    transform:translate3d(calc(var(--start-x) + var(--travel) * .81), var(--y5), 0) scale(1.006);
  }
  94%{
    opacity:var(--alpha);
    transform:translate3d(calc(var(--start-x) + var(--travel) * .94), calc(var(--y4) * -.28), 0) scale(1);
  }
  100%{
    opacity:0;
    transform:translate3d(calc(var(--start-x) + var(--travel)), calc(var(--y5) * -.25), 0) scale(.99);
  }
}

@media(max-width:900px){
  body.our-story-page .magic-particles{
    inset:-12% -24%;
  }
}


/* dead-zone fix:
   Do NOT add bubbles inside the wave.
   Instead, let the main story bokeh layer extend lower so the cream area immediately
   above the wave, especially on mobile/right side, still has moving particles. */
body.our-story-page .bokeh{
  overflow:visible !important;
  z-index:1;
}

body.our-story-page .magic-particles{
  top:-12% !important;
  left:-22% !important;
  right:-22% !important;
  bottom:-260px !important;
  height:auto !important;
}

/* Keep the next image wave visually above only where the image itself begins. */
body.our-story-page .wave-banner{
  position:relative;
  z-index:2;
}

@media(max-width:900px){
  body.our-story-page .magic-particles{
    top:-10% !important;
    left:-28% !important;
    right:-28% !important;
    bottom:-210px !important;
  }
}


/* Keep bokeh out of the top "Cómo todo comenzó" hero section.
   We still allow the particle field to extend downward near the wave,
   but the hero itself should sit above the bokeh layer. */
body.our-story-page .story-hero{
  position:relative;
  z-index:6;
}

body.our-story-page .bokeh{
  position:relative;
  z-index:1;
}


/* story page final layout polish */
@media(min-width:901px){
  body.our-story-page .story-grid{
    align-items:center !important;
  }
  body.our-story-page .arch-img{
    align-self:center;
    justify-self:center;
  }
}


/* our story final photo layout */
.story-gallery-modern{
  max-width:1380px;
  margin:70px auto 110px;
  padding:0 56px;
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:34px;
  align-items:start;
}
.story-gallery-modern .gallery-card{
  margin:0;
  overflow:hidden;
  background:transparent;
}
.story-gallery-modern img{
  width:100%;
  display:block;
  object-fit:cover;
}
.story-gallery-modern .top-left img,
.story-gallery-modern .top-right img{
  aspect-ratio:1126 / 2000;
}
.story-gallery-modern .bottom-wide{
  grid-column:1 / -1;
}
.story-gallery-modern .bottom-wide img{
  width:100%;
  aspect-ratio:3 / 2;
  object-position:center 28%;
}
@media(max-width:900px){
  .story-gallery-modern{
    grid-template-columns:1fr;
    gap:18px;
    padding:0 18px;
    margin:45px auto 70px;
  }
  .story-gallery-modern .bottom-wide{
    grid-column:auto;
  }
  .story-gallery-modern .bottom-wide img{
    aspect-ratio:auto;
    object-position:center 24%;
  }
}


/* final gallery/mobile + horizontal-scroll fix */
html,
body,
body.our-story-page{
  max-width:100%;
  overflow-x:hidden !important;
}

/* Prevent wide animation/photo layers from creating right-scroll while preserving the vertical bokeh extension. */
body.our-story-page main{
  max-width:100%;
  overflow-x:hidden;
}

/* Mobile photo section should match the desktop-style composition:
   two photos on the first row, one wide photo below. */
@media(max-width:900px){
  .story-gallery-modern{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:14px !important;
    padding:0 18px !important;
    margin:45px auto 70px !important;
    width:100%;
    box-sizing:border-box;
  }

  .story-gallery-modern .top-left,
  .story-gallery-modern .top-right{
    grid-column:auto !important;
  }

  .story-gallery-modern .bottom-wide{
    grid-column:1 / -1 !important;
  }

  .story-gallery-modern .top-left img,
  .story-gallery-modern .top-right img{
    aspect-ratio:1126 / 2000 !important;
    height:auto !important;
    object-fit:cover;
  }

  .story-gallery-modern .bottom-wide img{
    aspect-ratio:3 / 2 !important;
    height:auto !important;
    object-fit:cover;
    object-position:center 28%;
  }
}


/* Estadía page — Hotel Vista Azul, styled to match the wedding site mood */
.travel-page{
  background:var(--cream);
}
.travel-page .travel-hero,
.travel-page .page-hero.travel-hero{display:none;}
.stay-hero{
  min-height:470px;
  position:relative;
  display:grid;
  align-items:center;
  padding:118px 76px 86px;
  color:#fff;
  background-image:linear-gradient(rgba(23,33,39,.44),rgba(23,33,39,.30)),url('/assets/hotel-vista-azul-aerial.webp');
  background-size:cover;
  background-position:center 46%;
  overflow:hidden;
}
.stay-hero:after{
  content:"";
  position:absolute;
  inset:auto -4% -1px;
  height:82px;
  background:var(--cream);
  border-radius:50% 50% 0 0 / 100% 100% 0 0;
  transform:rotate(-1.2deg);
}
.stay-hero-copy{
  position:relative;
  z-index:1;
  max-width:1160px;
  width:100%;
  margin:0 auto;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:60px;
  align-items:end;
}
.stay-hero h1{
  font-family:'WeddingDisplay','Bree Serif',Georgia,serif;
  font-size:86px;
  line-height:.95;
  margin:0;
  color:#fff;
}
.stay-hero p{
  margin:0 0 10px;
  max-width:470px;
  font-size:18px;
  line-height:1.55;
  color:rgba(255,255,255,.94);
}
.stay-card-strip{
  max-width:1260px;
  margin:-42px auto 78px;
  padding:0 54px;
  position:relative;
  z-index:3;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px;
}
.stay-card{
  background:rgba(246,241,232,.98);
  border:1px solid rgba(47,45,42,.15);
  padding:10px 10px 24px;
  text-align:center;
  box-shadow:0 18px 40px rgba(0,0,0,.08);
}
.stay-card img{
  width:100%;
  height:230px;
  display:block;
  object-fit:cover;
  margin-bottom:20px;
}
.stay-card h2,
.stay-details h2,
.stay-panel h3{
  font-family:'WeddingDisplay','Bree Serif',Georgia,serif;
  font-weight:400;
  color:#2f2d2a;
}
.stay-card h2{font-size:34px;margin:0 0 8px;}
.stay-card p{font-size:14px;line-height:1.55;margin:0 auto 18px;max-width:310px;color:#504d47;}
.stay-card button{
  border:1px solid #302d29;
  background:#302d29;
  color:white;
  padding:11px 18px;
  text-transform:uppercase;
  letter-spacing:.13em;
  font-size:11px;
  cursor:pointer;
}
.stay-details{
  max-width:1180px;
  margin:0 auto 90px;
  padding:0 54px;
}
.stay-details-intro{
  text-align:center;
  max-width:860px;
  margin:0 auto 34px;
}
.stay-details-intro .eyebrow{
  text-transform:uppercase;
  letter-spacing:.16em;
  font-size:12px;
  margin:0 0 14px;
  color:#7d765f;
}
.stay-details h2{font-size:58px;line-height:1.04;margin:0 0 18px;}
.stay-details-intro p:last-child{margin:0;color:#514e48;}
.stay-tabs{
  display:flex;
  justify-content:center;
  gap:8px;
  flex-wrap:wrap;
  margin:0 0 22px;
}
.stay-tabs button{
  border:1px solid rgba(47,45,42,.22);
  background:transparent;
  color:#2f2d2a;
  padding:11px 18px;
  cursor:pointer;
  text-transform:uppercase;
  font-size:12px;
  letter-spacing:.12em;
}
.stay-tabs button.active{background:#302d29;color:#fff;}
.stay-panels{
  background:rgba(255,255,255,.22);
  border:1px solid rgba(47,45,42,.14);
}
.stay-panel{
  display:none;
  grid-template-columns:1.05fr .95fr;
  gap:46px;
  align-items:center;
  padding:34px;
}
.stay-panel.active{display:grid;}
.stay-panel img{
  width:100%;
  height:500px;
  object-fit:cover;
  display:block;
}
.stay-panel h3{font-size:46px;margin:0 0 18px;}
.stay-panel p{font-size:17px;line-height:1.65;color:#45423e;margin:0 0 22px;}
.stay-actions{display:flex;gap:12px;flex-wrap:wrap;}
.stay-list{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px;}
.stay-list span{
  border:1px solid rgba(47,45,42,.20);
  padding:9px 12px;
  font-size:13px;
  background:rgba(255,255,255,.28);
}
.stay-photo-band{
  max-width:1320px;
  margin:0 auto 110px;
  padding:0 54px;
  display:grid;
  grid-template-columns:1fr 1.35fr 1fr;
  gap:22px;
  align-items:stretch;
}
.stay-photo-band img{
  width:100%;
  height:360px;
  object-fit:cover;
  display:block;
}
.stay-photo-band img:nth-child(2){height:430px;}
@media(max-width:900px){
  .stay-hero{min-height:360px;padding:104px 26px 74px;background-position:center 48%;}
  .stay-hero-copy{grid-template-columns:1fr;gap:16px;align-items:end;}
  .stay-hero h1{font-size:58px;}
  .stay-hero p{font-size:15px;max-width:300px;}
  .stay-card-strip{
    grid-template-columns:1fr;
    margin:-32px auto 52px;
    padding:0 18px;
    gap:18px;
  }
  .stay-card{padding:8px 8px 22px;}
  .stay-card img{height:190px;}
  .stay-details{padding:0 18px;margin-bottom:64px;}
  .stay-details h2{font-size:40px;}
  .stay-tabs{gap:6px;justify-content:flex-start;}
  .stay-tabs button{font-size:10px;padding:10px 12px;}
  .stay-panel{grid-template-columns:1fr;padding:16px;gap:22px;}
  .stay-panel img{height:250px;}
  .stay-panel h3{font-size:34px;}
  .stay-panel p{font-size:15px;}
  .stay-photo-band{grid-template-columns:1fr;gap:16px;padding:0 18px;margin-bottom:74px;}
  .stay-photo-band img,.stay-photo-band img:nth-child(2){height:auto;aspect-ratio:4/3;}
}


/* Estadía v2 polish requested: straight hero edge, no intro cards, no Habitaciones tab */
.travel-page .stay-hero{
  min-height:440px;
  padding-bottom:82px;
  margin-bottom:68px;
}
.travel-page .stay-hero:after{
  display:none !important;
}
.travel-page .stay-details{
  margin-top:0;
}
.travel-page .stay-details-intro{
  margin-top:0;
}

/* Bottom hotel photos: show the full images instead of cropping them on desktop. */
.travel-page .stay-photo-band{
  align-items:start;
  margin-top:10px;
}
.travel-page .stay-photo-band img,
.travel-page .stay-photo-band img:nth-child(2){
  height:auto !important;
  object-fit:contain !important;
  object-position:center center;
  background:rgba(255,255,255,.18);
}

@media(max-width:900px){
  .travel-page .stay-hero{
    min-height:350px;
    margin-bottom:46px;
    padding-bottom:58px;
  }
  .travel-page .stay-details{
    margin-top:0;
  }
}


/* Estadía v3: fully show bottom hotel images instead of cropping them */
.travel-gallery,
.estadia-gallery,
.hotel-gallery,
.travel-photo-grid,
.hotel-photo-grid{
  align-items:start !important;
}

.travel-gallery img,
.estadia-gallery img,
.hotel-gallery img,
.travel-photo-grid img,
.hotel-photo-grid img,
body.travel-stay-page .gallery-strip img,
body.travel-stay-page .hotel-images img,
body.travel-stay-page .hotel-gallery img,
body.travel-stay-page .estadia-gallery img{
  height:auto !important;
  max-height:none !important;
  object-fit:contain !important;
  object-position:center center !important;
}

/* If the hotel photo section uses figure/card wrappers, let them grow with the image. */
body.travel-stay-page figure,
body.travel-stay-page .gallery-card,
body.travel-stay-page .hotel-card,
body.travel-stay-page .photo-card{
  height:auto !important;
  max-height:none !important;
  overflow:visible !important;
}

/* Give the Estadía page a little more breathing room before the footer. */
body.travel-stay-page main{
  padding-bottom:90px;
}

body.travel-stay-page .site-footer{
  margin-top:0 !important;
}


/* Estadía footer overlap fix:
   the footer was pulled upward with a negative margin and was covering the hotel photos.
   On this page only, push the footer down and give the gallery real bottom clearance. */
body.travel-stay-page .hotel-photo-grid,
body.travel-stay-page .travel-photo-grid,
body.travel-stay-page .hotel-gallery,
body.travel-stay-page .estadia-gallery,
body.travel-stay-page .gallery-strip,
body.travel-stay-page .hotel-images{
  margin-bottom:180px !important;
  padding-bottom:0 !important;
  position:relative;
  z-index:2;
}

/* Override the global footer wave overlap on Estadía only. */
body.travel-stay-page .site-footer{
  margin-top:0 !important;
  clear:both;
  position:relative;
  z-index:1;
}

/* Extra safety: make sure the main content reserves space before the footer starts. */
body.travel-stay-page main{
  padding-bottom:180px !important;
  overflow:visible !important;
}

@media(max-width:900px){
  body.travel-stay-page .hotel-photo-grid,
  body.travel-stay-page .travel-photo-grid,
  body.travel-stay-page .hotel-gallery,
  body.travel-stay-page .estadia-gallery,
  body.travel-stay-page .gallery-strip,
  body.travel-stay-page .hotel-images{
    margin-bottom:130px !important;
  }

  body.travel-stay-page main{
    padding-bottom:130px !important;
  }
}


/* Estadía v5 REAL footer overlap fix.
   The page body class is .travel-page, not .travel-stay-page.
   This removes the global negative footer pull only on Estadía and reserves space after the photos. */
body.travel-page main{
  padding-bottom:260px !important;
  overflow:visible !important;
}
body.travel-page .stay-photo-band{
  margin-bottom:260px !important;
  position:relative !important;
  z-index:3 !important;
}
body.travel-page .stay-photo-band img,
body.travel-page .stay-photo-band img:nth-child(2){
  height:auto !important;
  max-height:none !important;
  object-fit:contain !important;
  object-position:center center !important;
}
body.travel-page .site-footer{
  margin-top:0 !important;
  position:relative !important;
  z-index:1 !important;
  clear:both !important;
}

@media(max-width:900px){
  body.travel-page main{
    padding-bottom:170px !important;
  }
  body.travel-page .stay-photo-band{
    margin-bottom:170px !important;
  }
}


/* Estadía v6: balanced footer spacing + symmetrical image row */

/* Bring the footer closer again, but keep enough space so it no longer overlaps the hotel images. */
body.travel-page main,
body.travel-stay-page main{
  padding-bottom:70px !important;
}

body.travel-page .site-footer,
body.travel-stay-page .site-footer{
  margin-top:0 !important;
}

/* Make the bottom hotel images symmetrical. */
body.travel-page .hotel-photo-grid,
body.travel-page .travel-photo-grid,
body.travel-page .hotel-gallery,
body.travel-page .estadia-gallery,
body.travel-page .gallery-strip,
body.travel-page .hotel-images,
body.travel-stay-page .hotel-photo-grid,
body.travel-stay-page .travel-photo-grid,
body.travel-stay-page .hotel-gallery,
body.travel-stay-page .estadia-gallery,
body.travel-stay-page .gallery-strip,
body.travel-stay-page .hotel-images{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:28px !important;
  max-width:1380px !important;
  margin:70px auto 90px !important;
  padding:0 56px !important;
  align-items:stretch !important;
  box-sizing:border-box;
  position:relative;
  z-index:2;
}

/* Crop consistently instead of letting one image become taller than the others. */
body.travel-page .hotel-photo-grid img,
body.travel-page .travel-photo-grid img,
body.travel-page .hotel-gallery img,
body.travel-page .estadia-gallery img,
body.travel-page .gallery-strip img,
body.travel-page .hotel-images img,
body.travel-stay-page .hotel-photo-grid img,
body.travel-stay-page .travel-photo-grid img,
body.travel-stay-page .hotel-gallery img,
body.travel-stay-page .estadia-gallery img,
body.travel-stay-page .gallery-strip img,
body.travel-stay-page .hotel-images img{
  width:100% !important;
  height:260px !important;
  max-height:none !important;
  object-fit:cover !important;
  object-position:center center !important;
  display:block !important;
}

/* Keep wrappers clipped cleanly if the section uses figures/cards. */
body.travel-page .hotel-photo-grid > *,
body.travel-page .travel-photo-grid > *,
body.travel-page .hotel-gallery > *,
body.travel-page .estadia-gallery > *,
body.travel-page .gallery-strip > *,
body.travel-page .hotel-images > *,
body.travel-stay-page .hotel-photo-grid > *,
body.travel-stay-page .travel-photo-grid > *,
body.travel-stay-page .hotel-gallery > *,
body.travel-stay-page .estadia-gallery > *,
body.travel-stay-page .gallery-strip > *,
body.travel-stay-page .hotel-images > *{
  overflow:hidden !important;
  height:auto !important;
}

/* Slight crop tuning for the slide image so people stay visible. */
body.travel-page .hotel-photo-grid img:nth-child(3),
body.travel-page .travel-photo-grid img:nth-child(3),
body.travel-page .hotel-gallery img:nth-child(3),
body.travel-page .estadia-gallery img:nth-child(3),
body.travel-page .gallery-strip img:nth-child(3),
body.travel-page .hotel-images img:nth-child(3),
body.travel-stay-page .hotel-photo-grid img:nth-child(3),
body.travel-stay-page .travel-photo-grid img:nth-child(3),
body.travel-stay-page .hotel-gallery img:nth-child(3),
body.travel-stay-page .estadia-gallery img:nth-child(3),
body.travel-stay-page .gallery-strip img:nth-child(3),
body.travel-stay-page .hotel-images img:nth-child(3){
  object-position:center 38% !important;
}

@media(max-width:900px){
  body.travel-page main,
  body.travel-stay-page main{
    padding-bottom:50px !important;
  }

  body.travel-page .hotel-photo-grid,
  body.travel-page .travel-photo-grid,
  body.travel-page .hotel-gallery,
  body.travel-page .estadia-gallery,
  body.travel-page .gallery-strip,
  body.travel-page .hotel-images,
  body.travel-stay-page .hotel-photo-grid,
  body.travel-stay-page .travel-photo-grid,
  body.travel-stay-page .hotel-gallery,
  body.travel-stay-page .estadia-gallery,
  body.travel-stay-page .gallery-strip,
  body.travel-stay-page .hotel-images{
    grid-template-columns:1fr !important;
    gap:16px !important;
    padding:0 22px !important;
    margin:42px auto 58px !important;
  }

  body.travel-page .hotel-photo-grid img,
  body.travel-page .travel-photo-grid img,
  body.travel-page .hotel-gallery img,
  body.travel-page .estadia-gallery img,
  body.travel-page .gallery-strip img,
  body.travel-page .hotel-images img,
  body.travel-stay-page .hotel-photo-grid img,
  body.travel-stay-page .travel-photo-grid img,
  body.travel-stay-page .hotel-gallery img,
  body.travel-stay-page .estadia-gallery img,
  body.travel-stay-page .gallery-strip img,
  body.travel-stay-page .hotel-images img{
    height:230px !important;
  }
}


/* Estadía v7: footer wave + tighter spacing + ACTUAL symmetrical stay-photo-band */

/* Kill the excessive spacing from the previous footer fix. */
body.travel-page main{
  padding-bottom:0 !important;
}

/* The actual hotel image row is .stay-photo-band. Make all 3 images equal. */
body.travel-page .stay-photo-band{
  max-width:1320px !important;
  width:100% !important;
  margin:48px auto 118px !important;
  padding:0 54px !important;
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:24px !important;
  align-items:stretch !important;
  box-sizing:border-box !important;
  position:relative !important;
  z-index:2 !important;
}

body.travel-page .stay-photo-band img,
body.travel-page .stay-photo-band img:nth-child(2){
  width:100% !important;
  height:300px !important;
  max-height:none !important;
  display:block !important;
  object-fit:cover !important;
  object-position:center center !important;
  background:transparent !important;
}

/* Fine-tune the crop on the slide image so the slide/kids stay visible. */
body.travel-page .stay-photo-band img:nth-child(3){
  object-position:center 38% !important;
}

/* Give Estadía the same wave-style footer treatment as the story/home vibe. */
body.travel-page .site-footer{
  margin-top:-88px !important;
  padding-top:205px !important;
  position:relative !important;
  z-index:1 !important;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 470' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 120 C240 70 480 52 720 88 C960 124 1200 124 1440 86 L1440 470 L0 470 Z'/%3E%3C/svg%3E") !important;
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 470' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 120 C240 70 480 52 720 88 C960 124 1200 124 1440 86 L1440 470 L0 470 Z'/%3E%3C/svg%3E") !important;
  -webkit-mask-size:100% 100% !important;
  mask-size:100% 100% !important;
  -webkit-mask-repeat:no-repeat !important;
  mask-repeat:no-repeat !important;
}

@media(max-width:900px){
  body.travel-page main{
    padding-bottom:0 !important;
  }

  body.travel-page .stay-photo-band{
    grid-template-columns:1fr !important;
    gap:16px !important;
    padding:0 18px !important;
    margin:34px auto 88px !important;
  }

  body.travel-page .stay-photo-band img,
  body.travel-page .stay-photo-band img:nth-child(2){
    height:230px !important;
    aspect-ratio:auto !important;
  }

  body.travel-page .site-footer{
    margin-top:-72px !important;
    padding-top:170px !important;
    -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 420' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 92 C240 50 480 38 720 66 C960 94 1200 94 1440 62 L1440 420 L0 420 Z'/%3E%3C/svg%3E") !important;
    mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 420' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 92 C240 50 480 38 720 66 C960 94 1200 94 1440 62 L1440 420 L0 420 Z'/%3E%3C/svg%3E") !important;
  }
}


/* Estadía v8: center Hotel / Amenidades / Ubicación tabs on mobile */
@media(max-width:900px){
  body.travel-page .stay-tabs{
    justify-content:center !important;
    align-items:center !important;
    text-align:center !important;
    width:100% !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }

  body.travel-page .stay-tabs button{
    text-align:center !important;
  }
}


/* Registro page v2 — closer to Jessie/PJ registry structure */
.registry-page{
  background:var(--cream);
  overflow-x:hidden;
}

.registry-page .registry-jessie-photo{
  width:100%;
  margin:0;
  padding:0;
  background:var(--cream);
}

.registry-page .registry-jessie-photo img{
  display:block;
  width:100%;
  height:64vh;
  min-height:520px;
  max-height:760px;
  object-fit:cover;
  object-position:center 34%;
}

.registry-page .registry-message-section{
  background:var(--cream);
  padding:82px 28px 74px;
  text-align:center;
}

.registry-page .registry-message-inner{
  max-width:1040px;
  margin:0 auto;
}

.registry-page .registry-message-inner p{
  font-family:'WeddingDisplay','Bree Serif', Georgia, 'Times New Roman', serif;
  font-size:28px;
  line-height:1.38;
  font-weight:700;
  color:#2f2d2a;
  margin:0 auto 26px;
}

.registry-page .registry-message-inner p:nth-child(2){
  margin-top:6px;
}

.registry-page .registry-fund-button{
  display:inline-block;
  margin-top:18px;
  padding:14px 28px;
  border:1px solid #302d29;
  background:#302d29;
  color:white;
  text-decoration:none;
  text-transform:uppercase;
  letter-spacing:.13em;
  font-size:12px;
  font-weight:700;
}

.registry-page .registry-fund-button:hover{
  background:transparent;
  color:#302d29;
}

.registry-page .registry-bottom-image{
  height:345px;
  margin:0;
  overflow:hidden;
  background:var(--cream);
}

.registry-page .registry-bottom-image img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 62%;
  opacity:.92;
}

/* Same wave footer behavior as the finished story/travel pages. */
.registry-page .site-footer{
  margin-top:-118px !important;
  padding-top:225px !important;
  position:relative;
  z-index:1;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 470' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 120 C240 70 480 52 720 88 C960 124 1200 124 1440 86 L1440 470 L0 470 Z'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 470' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 120 C240 70 480 52 720 88 C960 124 1200 124 1440 86 L1440 470 L0 470 Z'/%3E%3C/svg%3E");
  -webkit-mask-size:100% 100%;
  mask-size:100% 100%;
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
}

@media(max-width:900px){
  .registry-page .registry-jessie-photo img{
    height:470px;
    min-height:470px;
    max-height:none;
    object-position:center 36%;
  }

  .registry-page .registry-message-section{
    padding:58px 24px 56px;
  }

  .registry-page .registry-message-inner p{
    font-size:20px;
    line-height:1.42;
    margin-bottom:22px;
  }

  .registry-page .registry-bottom-image{
    height:270px;
  }

  .registry-page .site-footer{
    margin-top:-82px !important;
    padding-top:175px !important;
    -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 420' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 92 C240 50 480 38 720 66 C960 94 1200 94 1440 62 L1440 420 L0 420 Z'/%3E%3C/svg%3E");
    mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 420' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 92 C240 50 480 38 720 66 C960 94 1200 94 1440 62 L1440 420 L0 420 Z'/%3E%3C/svg%3E");
  }
}


/* Registro v3 — closer to Jessie/PJ reference: full image background + bordered text panel */
.registry-page{
  background:var(--cream);
  overflow-x:hidden;
}
.registry-page .site-nav{
  background:linear-gradient(to bottom, rgba(239,234,226,.72) 0%, rgba(239,234,226,.38) 62%, rgba(239,234,226,0) 100%) !important;
}
.registry-reference-hero{
  min-height:1060px;
  position:relative;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  padding:285px 38px 360px;
  box-sizing:border-box;
  background-image:linear-gradient(rgba(32,32,28,.34), rgba(32,32,28,.30)), url('/assets/ref-rsvp-banner.webp');
  background-size:cover;
  background-position:center 58%;
  overflow:hidden;
}
.registry-reference-hero:after{
  content:"";
  position:absolute;
  left:-4%;
  right:-4%;
  bottom:-2px;
  height:135px;
  background:rgba(238,232,220,.92);
  border-top:2px solid rgba(255,255,255,.75);
  border-radius:54% 46% 0 0 / 42% 58% 0 0;
  transform:rotate(-1.5deg);
  z-index:1;
}
.registry-overlay-card{
  position:relative;
  z-index:2;
  max-width:1180px;
  width:min(1180px, 72vw);
  border:2px solid rgba(255,255,255,.86);
  padding:72px 82px 66px;
  text-align:center;
  color:white;
  background:rgba(37,37,33,.10);
  box-sizing:border-box;
  backdrop-filter:blur(.25px);
}
.registry-overlay-card p{
  font-family:'WeddingDisplay','Bree Serif', Georgia, 'Times New Roman', serif;
  font-size:28px;
  line-height:1.25;
  font-weight:700;
  margin:0 auto 34px;
  max-width:960px;
  color:white;
  text-shadow:0 2px 12px rgba(0,0,0,.42);
}
.registry-overlay-card p:last-of-type{
  margin-bottom:50px;
}
.registry-fund-button{
  display:inline-block;
  padding:15px 28px;
  border-radius:4px;
  background:rgba(231,215,194,.86);
  color:#302d29;
  text-decoration:none;
  text-transform:uppercase;
  letter-spacing:.14em;
  font-size:12px;
  font-weight:700;
  box-shadow:0 8px 18px rgba(0,0,0,.10);
}
.registry-fund-button:hover{
  background:#302d29;
  color:white;
}
.registry-page .site-footer{
  margin-top:-138px !important;
  padding-top:225px !important;
  position:relative;
  z-index:3;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 470' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 120 C240 70 480 52 720 88 C960 124 1200 124 1440 86 L1440 470 L0 470 Z'/%3E%3C/svg%3E") !important;
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 470' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 120 C240 70 480 52 720 88 C960 124 1200 124 1440 86 L1440 470 L0 470 Z'/%3E%3C/svg%3E") !important;
  -webkit-mask-size:100% 100% !important;
  mask-size:100% 100% !important;
  -webkit-mask-repeat:no-repeat !important;
  mask-repeat:no-repeat !important;
}
@media(max-width:900px){
  .registry-reference-hero{
    min-height:890px;
    padding:190px 18px 260px;
    background-position:center 55%;
  }
  .registry-reference-hero:after{
    height:100px;
    border-radius:54% 46% 0 0 / 45% 55% 0 0;
  }
  .registry-overlay-card{
    width:100%;
    border-width:1.5px;
    padding:42px 22px 38px;
  }
  .registry-overlay-card p{
    font-size:19px;
    line-height:1.32;
    margin-bottom:24px;
  }
  .registry-overlay-card p:last-of-type{
    margin-bottom:34px;
  }
  .registry-fund-button{
    font-size:10px;
    padding:13px 20px;
  }
  .registry-page .site-footer{
    margin-top:-92px !important;
    padding-top:170px !important;
    -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 420' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 92 C240 50 480 38 720 66 C960 94 1200 94 1440 62 L1440 420 L0 420 Z'/%3E%3C/svg%3E") !important;
    mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 420' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 92 C240 50 480 38 720 66 C960 94 1200 94 1440 62 L1440 420 L0 420 Z'/%3E%3C/svg%3E") !important;
  }
}


/* Registro v5 correction:
   - restore nav RSVP by NOT hiding global /rsvp links
   - remove only the in-box Confirmar asistencia button via HTML above
   - actually swap the registry background image
   - remove the cream blob before the footer curve */

/* Actual registry hero selector from v3. */
body.registry-page .registry-reference-hero{
  background-image:
    linear-gradient(rgba(31,31,27,.26), rgba(31,31,27,.22)),
    url('/assets/ref-home-hero.webp') !important;
  background-size:cover !important;
  background-position:center 52% !important;
  background-repeat:no-repeat !important;
  min-height:1040px !important;
  padding:285px 38px 250px !important;
}

/* This pseudo-element was the cream/white blob. Remove it completely. */
body.registry-page .registry-reference-hero::after,
body.registry-page .registry-reference-hero:after{
  display:none !important;
  content:none !important;
  background:transparent !important;
  border:0 !important;
  height:0 !important;
}

/* Resize the bordered message box now that the in-box button is gone. */
body.registry-page .registry-overlay-card{
  max-width:1120px !important;
  width:min(1120px, 72vw) !important;
  padding:58px 76px 54px !important;
}

body.registry-page .registry-overlay-card p{
  margin-bottom:28px !important;
}

body.registry-page .registry-overlay-card p:last-of-type{
  margin-bottom:0 !important;
}

/* Hide only the old registry-card button class, not the top nav RSVP link. */
body.registry-page .registry-overlay-card .registry-fund-button{
  display:none !important;
}

/* Let the footer wave overlap the mountain image directly. */
body.registry-page .site-footer{
  margin-top:-122px !important;
  padding-top:225px !important;
  position:relative !important;
  z-index:3 !important;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 470' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 120 C240 70 480 52 720 88 C960 124 1200 124 1440 86 L1440 470 L0 470 Z'/%3E%3C/svg%3E") !important;
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 470' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 120 C240 70 480 52 720 88 C960 124 1200 124 1440 86 L1440 470 L0 470 Z'/%3E%3C/svg%3E") !important;
  -webkit-mask-size:100% 100% !important;
  mask-size:100% 100% !important;
  -webkit-mask-repeat:no-repeat !important;
  mask-repeat:no-repeat !important;
}

/* Explicitly restore the nav RSVP in case any prior registry rule hid anchors. */
body.registry-page .site-nav .nav-right,
body.registry-page .site-nav .rsvp-link{
  display:flex !important;
  visibility:visible !important;
  opacity:1 !important;
}

body.registry-page .site-nav .rsvp-link{
  align-items:center !important;
}

@media(max-width:900px){
  body.registry-page .registry-reference-hero{
    min-height:840px !important;
    padding:180px 18px 190px !important;
    background-position:center 52% !important;
  }

  body.registry-page .registry-overlay-card{
    width:calc(100% - 20px) !important;
    max-width:560px !important;
    padding:36px 22px 34px !important;
  }

  body.registry-page .registry-overlay-card p{
    margin-bottom:22px !important;
  }

  body.registry-page .site-footer{
    margin-top:-86px !important;
    padding-top:170px !important;
    -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 420' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 92 C240 50 480 38 720 66 C960 94 1200 94 1440 62 L1440 420 L0 420 Z'/%3E%3C/svg%3E") !important;
    mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 420' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 92 C240 50 480 38 720 66 C960 94 1200 94 1440 62 L1440 420 L0 420 Z'/%3E%3C/svg%3E") !important;
  }
}


/* Registro v6: use the explicitly provided no-couple bosque image + fix mobile nav RSVP */

/* Use the uploaded forest/road image for the registry background. */
body.registry-page .registry-reference-hero{
  background-image:
    linear-gradient(rgba(31,31,27,.22), rgba(31,31,27,.18)),
    url('/assets/registry-bosque.webp') !important;
  background-size:cover !important;
  background-position:center 54% !important;
  background-repeat:no-repeat !important;
}

/* Desktop keeps the top-right RSVP button. */
@media(min-width:901px){
  body.registry-page .site-nav .nav-right,
  body.registry-page .site-nav .rsvp-link{
    display:flex !important;
    visibility:visible !important;
    opacity:1 !important;
  }
}

/* Mobile should match the other pages: no separate top-nav RSVP showing. */
@media(max-width:900px){
  body.registry-page .site-nav:not(.open) .nav-right{
    display:none !important;
  }

  body.registry-page .site-nav:not(.open) .rsvp-link{
    display:none !important;
  }

  body.registry-page .registry-reference-hero{
    background-position:center 52% !important;
  }
}

/* Registry v7 mobile footer-gap fix:
   Pull the footer wave farther upward on mobile so the cream strip before the curve disappears. */
@media(max-width:900px){
  body.registry-page .registry-reference-hero{
    min-height: 820px !important;
    padding: 180px 18px 150px !important;
  }

  body.registry-page .site-footer{
    margin-top: -150px !important;
    padding-top: 230px !important;
  }
}


/* RSVP v1 — elegant page polish */

/* Give RSVP its own page scope. */
body.rsvp-page{
  background:var(--cream);
  overflow-x:hidden;
}

/* Use the correct RSVP banner image and place the couple nicely. */
body.rsvp-page .page-hero.rsvp-hero{
  height:470px !important;
  min-height:470px !important;
  background-image:
    linear-gradient(rgba(238,232,220,.18), rgba(238,232,220,.34)),
    url('/assets/ref-rsvp-banner.webp') !important;
  background-size:cover !important;
  background-position:center 43% !important;
  display:flex !important;
  align-items:flex-end !important;
  overflow:hidden !important;
}

body.rsvp-page .page-hero.rsvp-hero:before{
  background:rgba(238,232,220,.15) !important;
}

body.rsvp-page .page-hero.rsvp-hero h1{
  position:relative;
  z-index:2;
  margin:0 0 86px 76px !important;
  color:#2f2d2a !important;
  text-shadow:0 2px 18px rgba(255,255,255,.35);
}

/* Remove the RSVP page white dots/bubbles only. */
body.rsvp-page .bokeh:before,
body.rsvp-page .bokeh:after{
  display:none !important;
  content:none !important;
  background:none !important;
  animation:none !important;
}

/* Clean RSVP body and prevent the form from being cut by the footer overlap. */
body.rsvp-page .bokeh{
  background:var(--cream) !important;
  overflow:visible !important;
  padding:86px 28px 190px !important;
  min-height:auto !important;
}

/* More elegant card/form box. */
body.rsvp-page .rsvp-box{
  max-width:900px !important;
  margin:0 auto !important;
  padding:58px 70px 62px !important;
  background:rgba(246,241,232,.70) !important;
  border:1px solid rgba(47,45,42,.18) !important;
  box-shadow:0 24px 70px rgba(35,32,28,.10) !important;
  box-sizing:border-box !important;
  position:relative !important;
  z-index:3 !important;
  backdrop-filter:blur(.4px);
}

body.rsvp-page .rsvp-box h2{
  font-family:'WeddingDisplay','Bree Serif', Georgia, 'Times New Roman', serif !important;
  font-size:58px !important;
  line-height:1.03 !important;
  font-weight:700 !important;
  text-align:center !important;
  margin:0 0 24px !important;
  color:#2f2d2a !important;
}

body.rsvp-page .rsvp-box > p{
  max-width:680px;
  margin:0 auto 16px !important;
  text-align:center;
  font-size:17px;
  line-height:1.6;
  color:#3f3b36;
}

body.rsvp-page .code-form{
  max-width:680px;
  margin:38px auto 0 !important;
}

body.rsvp-page .code-form label{
  display:block;
  margin:0 0 10px;
  font-weight:700;
  color:#302d29;
}

body.rsvp-page .code-row{
  display:grid !important;
  grid-template-columns:1fr auto !important;
  gap:12px !important;
  align-items:stretch !important;
}

body.rsvp-page .code-row input{
  width:100%;
  min-height:52px;
  border:1px solid rgba(47,45,42,.26);
  background:rgba(255,255,255,.48);
  padding:0 16px;
  font-size:16px;
  box-sizing:border-box;
}

body.rsvp-page .code-row .button{
  min-height:52px;
  margin:0 !important;
  white-space:nowrap;
}

/* Footer wave on RSVP, matching the other finished pages. */
body.rsvp-page .site-footer{
  margin-top:-135px !important;
  padding-top:235px !important;
  position:relative !important;
  z-index:2 !important;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 470' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 120 C240 70 480 52 720 88 C960 124 1200 124 1440 86 L1440 470 L0 470 Z'/%3E%3C/svg%3E") !important;
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 470' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 120 C240 70 480 52 720 88 C960 124 1200 124 1440 86 L1440 470 L0 470 Z'/%3E%3C/svg%3E") !important;
  -webkit-mask-size:100% 100% !important;
  mask-size:100% 100% !important;
  -webkit-mask-repeat:no-repeat !important;
  mask-repeat:no-repeat !important;
}

@media(max-width:900px){
  body.rsvp-page .page-hero.rsvp-hero{
    height:390px !important;
    min-height:390px !important;
    background-position:62% 43% !important;
  }

  body.rsvp-page .page-hero.rsvp-hero h1{
    margin:0 0 54px 26px !important;
    font-size:58px !important;
  }

  body.rsvp-page .bokeh{
    padding:54px 18px 138px !important;
  }

  body.rsvp-page .rsvp-box{
    padding:38px 22px 42px !important;
    width:100% !important;
  }

  body.rsvp-page .rsvp-box h2{
    font-size:42px !important;
  }

  body.rsvp-page .rsvp-box > p{
    font-size:15px;
  }

  body.rsvp-page .code-row{
    grid-template-columns:1fr !important;
  }

  body.rsvp-page .site-footer{
    margin-top:-100px !important;
    padding-top:178px !important;
    -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 420' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 92 C240 50 480 38 720 66 C960 94 1200 94 1440 62 L1440 420 L0 420 Z'/%3E%3C/svg%3E") !important;
    mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 420' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 92 C240 50 480 38 720 66 C960 94 1200 94 1440 62 L1440 420 L0 420 Z'/%3E%3C/svg%3E") !important;
  }
}


/* RSVP v2 — RSVP system + admin polish */

/* Make RSVP body long enough for generated guest cards and keep the footer from covering content. */
body.rsvp-page .bokeh{
  padding-bottom:220px !important;
}

body.rsvp-page .invite-note{
  max-width:760px;
  margin:24px auto 0 !important;
  padding:16px 18px;
  border-top:1px solid rgba(47,45,42,.18);
  border-bottom:1px solid rgba(47,45,42,.18);
  text-align:center;
  font-size:14px;
  line-height:1.55;
  font-style:italic;
  color:#5a554d;
}

body.rsvp-page .guest-area{
  margin-top:46px;
}

body.rsvp-page .guest-area > h2{
  font-family:'WeddingDisplay','Bree Serif', Georgia, 'Times New Roman', serif !important;
  font-size:46px !important;
  text-align:center;
  margin:0 0 8px !important;
}

body.rsvp-page .guest-intro{
  text-align:center;
  margin:0 auto 28px !important;
  color:#57524b;
}

body.rsvp-page #guestForms{
  display:grid;
  gap:20px;
  margin-top:24px;
}

body.rsvp-page .guest-card{
  background:rgba(255,255,255,.36);
  border:1px solid rgba(47,45,42,.16);
  padding:26px;
  box-shadow:0 14px 34px rgba(35,32,28,.06);
}

body.rsvp-page .guest-card h4{
  font-family:'WeddingDisplay','Bree Serif', Georgia, 'Times New Roman', serif;
  font-size:31px;
  margin:0 0 18px;
  color:#2f2d2a;
}

body.rsvp-page .guest-card .grid{
  display:grid;
  grid-template-columns:1fr;
  gap:16px;
}

body.rsvp-page .guest-card label{
  font-weight:700;
  color:#302d29;
}

body.rsvp-page .guest-card select,
body.rsvp-page .guest-card textarea{
  width:100%;
  margin-top:8px;
  border:1px solid rgba(47,45,42,.24);
  background:rgba(255,255,255,.48);
  padding:13px 14px;
  font-size:15px;
  box-sizing:border-box;
}

body.rsvp-page .guest-card textarea{
  min-height:92px;
  resize:vertical;
}

body.rsvp-page .guest-card .button{
  justify-self:start;
  margin-top:4px;
}

/* Admin page */
body.admin-page{
  background:var(--cream);
  overflow-x:hidden;
}

body.admin-page .admin-hero{
  min-height:340px;
  padding:130px 70px 70px;
  display:flex;
  align-items:flex-end;
  background-image:
    linear-gradient(rgba(238,232,220,.35), rgba(238,232,220,.32)),
    url('/assets/ref-rsvp-banner.webp');
  background-size:cover;
  background-position:center 43%;
}

body.admin-page .admin-hero h1{
  font-family:'WeddingDisplay','Bree Serif', Georgia, 'Times New Roman', serif;
  font-size:74px;
  margin:0;
  color:#2f2d2a;
}

body.admin-page .admin-section{
  padding:78px 34px 210px;
  background:var(--cream);
}

body.admin-page .admin-card{
  max-width:1180px;
  margin:0 auto;
  background:rgba(246,241,232,.76);
  border:1px solid rgba(47,45,42,.18);
  box-shadow:0 24px 70px rgba(35,32,28,.10);
  padding:44px;
  box-sizing:border-box;
}

body.admin-page .admin-login{
  max-width:560px;
}

body.admin-page .admin-card h2{
  font-family:'WeddingDisplay','Bree Serif', Georgia, 'Times New Roman', serif;
  font-size:48px;
  margin:0 0 14px;
  color:#2f2d2a;
}

body.admin-page .admin-login form{
  display:grid;
  gap:18px;
  margin-top:28px;
}

body.admin-page .admin-login label{
  font-weight:700;
}

body.admin-page .admin-login input,
body.admin-page .admin-table input,
body.admin-page .admin-table select{
  width:100%;
  margin-top:8px;
  border:1px solid rgba(47,45,42,.24);
  background:rgba(255,255,255,.55);
  padding:12px 13px;
  font-size:15px;
  box-sizing:border-box;
}

body.admin-page .admin-panel-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:22px;
  margin-bottom:18px;
}

body.admin-page .eyebrow{
  text-transform:uppercase;
  letter-spacing:.16em;
  font-size:12px;
  margin:0 0 10px;
  color:#7d765f;
}

body.admin-page .admin-small{
  margin:0 0 22px;
  color:#5a554d;
}

body.admin-page .admin-table-wrap{
  overflow-x:auto;
  border:1px solid rgba(47,45,42,.14);
}

body.admin-page .admin-table{
  width:100%;
  min-width:1020px;
  border-collapse:collapse;
  background:rgba(255,255,255,.28);
}

body.admin-page .admin-table th,
body.admin-page .admin-table td{
  padding:14px 12px;
  border-bottom:1px solid rgba(47,45,42,.12);
  text-align:left;
  vertical-align:middle;
  font-size:14px;
}

body.admin-page .admin-table th{
  background:rgba(47,45,42,.08);
  font-weight:700;
}

body.admin-page .admin-save{
  padding:10px 14px !important;
  font-size:11px !important;
}

body.admin-page .site-footer{
  margin-top:-135px !important;
  padding-top:235px !important;
  position:relative !important;
  z-index:2 !important;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 470' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 120 C240 70 480 52 720 88 C960 124 1200 124 1440 86 L1440 470 L0 470 Z'/%3E%3C/svg%3E") !important;
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 470' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 120 C240 70 480 52 720 88 C960 124 1200 124 1440 86 L1440 470 L0 470 Z'/%3E%3C/svg%3E") !important;
  -webkit-mask-size:100% 100% !important;
  mask-size:100% 100% !important;
  -webkit-mask-repeat:no-repeat !important;
  mask-repeat:no-repeat !important;
}

@media(max-width:900px){
  body.rsvp-page .bokeh{
    padding-bottom:160px !important;
  }

  body.rsvp-page .guest-area > h2{
    font-size:36px !important;
  }

  body.rsvp-page .guest-card{
    padding:20px;
  }

  body.rsvp-page .guest-card h4{
    font-size:27px;
  }

  body.admin-page .admin-hero{
    min-height:280px;
    padding:110px 24px 50px;
    background-position:62% 43%;
  }

  body.admin-page .admin-hero h1{
    font-size:52px;
  }

  body.admin-page .admin-section{
    padding:48px 18px 160px;
  }

  body.admin-page .admin-card{
    padding:28px 20px;
  }

  body.admin-page .admin-card h2{
    font-size:38px;
  }

  body.admin-page .admin-panel-head{
    align-items:flex-start;
    flex-direction:column;
  }

  body.admin-page .site-footer{
    margin-top:-100px !important;
    padding-top:178px !important;
    -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 420' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 92 C240 50 480 38 720 66 C960 94 1200 94 1440 62 L1440 420 L0 420 Z'/%3E%3C/svg%3E") !important;
    mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 420' preserveAspectRatio='none'%3E%3Cpath fill='black' d='M0 92 C240 50 480 38 720 66 C960 94 1200 94 1440 62 L1440 420 L0 420 Z'/%3E%3C/svg%3E") !important;
  }
}


/* ===== Correct dusty-blue theme pass from uploaded RAR 11 =====
   Scope:
   - Change cream/white flat page backgrounds to dusty blue.
   - Keep the actual images from the uploaded RAR unchanged.
   - Do NOT recolor the Ceremony section image/overlay.
   - Keep black buttons black.
   - Make ordinary text consistently white.
   - Remove the Our Story text/photo background block that was covering the magic effect.
*/
:root{
  --cream:#7f98ad !important;
  --cream2:#8fa7ba !important;
  --ink:#ffffff !important;
  --soft:rgba(255,255,255,.82) !important;
  --blue:#ffffff !important;
}

/* Flat backgrounds only */
html,
body,
main,
.bokeh,
.story-grid,
.travel-page,
.registry-page,
.rsvp-page,
.admin-page,
body.travel-page,
body.rsvp-page,
body.admin-page,
body.registry-page,
body.rsvp-page .bokeh,
body.admin-page .admin-section,
body.travel-page .stay-details,
body.registry-page .registry-message-section{
  background-color:#7f98ad !important;
}

/* White text only — leave image colors and button backgrounds alone */
body,
body p,
body h1,
body h2,
body h3,
body h4,
body h5,
body h6,
body label,
body span,
body li,
body small,
body strong,
body em,
body .site-title,
body .nav-left a,
body .nav-right a,
body .footer-contact,
body .footer-contact p,
body .footer-links a,
body .footer-date,
body .made,
body .story-copy,
body .quote-big,
body .ceremony-copy,
body .ceremony-copy h2,
body .ceremony-copy h4,
body .ceremony-copy p,
body .stay-details h2,
body .stay-details p,
body .stay-details-intro .eyebrow,
body .stay-panel h3,
body .stay-panel p,
body .registry-overlay-card p,
body .rsvp-box h2,
body .rsvp-box p,
body .guest-card h4,
body .guest-intro,
body .invite-note,
body .admin-card h2,
body .admin-small,
body .admin-table,
body .admin-table th,
body .admin-table td,
body .form-message{
  color:#ffffff !important;
}

/* Keep all black buttons black, not white */
.button,
.dark-button,
.rsvp-link,
button.button,
a.button,
.guest-card .button,
.admin-save{
  background:#2f2c29 !important;
  color:#ffffff !important;
  border-color:#2f2c29 !important;
}

/* Inputs/selects get subtle blue glass but text stays white */
input,
select,
textarea{
  background:rgba(255,255,255,.13) !important;
  color:#ffffff !important;
  border-color:rgba(255,255,255,.34) !important;
}
input::placeholder,
textarea::placeholder{
  color:rgba(255,255,255,.72) !important;
}
option{
  color:#2f2d2a !important;
}

/* Dusty-blue nav/open menu/footer surfaces */
.site-nav{
  color:#ffffff !important;
  background:linear-gradient(to bottom, rgba(127,152,173,.92) 0%, rgba(127,152,173,.56) 58%, rgba(127,152,173,0) 100%) !important;
}
.menu-button,
.menu-button:before,
.menu-button:after{
  color:#ffffff !important;
}
.menu-button:before,
.menu-button:after{
  background:#ffffff !important;
}
.site-nav.open{
  background:linear-gradient(to bottom, rgba(127,152,173,.94) 0%, rgba(127,152,173,.84) 48%, rgba(127,152,173,.74) 100%) !important;
}
.site-nav.open .nav-left,
.site-nav.open .nav-right{
  background:transparent !important;
}

/* Dusty-blue cards/boxes that used to read as cream/white */
.rsvp-box,
.guest-card,
.admin-card,
.details-card,
.stay-panels,
.stay-panel,
.stay-list span,
.registry-overlay-card,
.registry-message-inner,
.travel-item,
.info-card,
.code-row,
.countdown,
.admin-table,
.admin-table th,
.admin-table td{
  background-color:rgba(127,152,173,.74) !important;
  border-color:rgba(255,255,255,.24) !important;
}

/* Remove Our Story background block behind the text/photo arch so the magic effect shows. */
body.our-story-page .story-grid,
body.our-story-page .story-copy,
body.our-story-page .quote-big{
  background:transparent !important;
}
body.our-story-page .story-grid:before,
body.our-story-page .story-grid::before{
  display:none !important;
  content:none !important;
  background:none !important;
  opacity:0 !important;
}

/* Change wave/solid fills that used --cream to dusty blue */
.wave-banner:before,
.wave-banner:after,
.stay-hero:after,
.registry-reference-hero:after,
.registry-reference-hero::after{
  background:#7f98ad !important;
}

/* Footer still uses the site image, but with dusty-blue overlay instead of cream overlay */
.site-footer,
.our-story-page .site-footer,
body.travel-page .site-footer,
body.registry-page .site-footer,
body.rsvp-page .site-footer,
body.admin-page .site-footer{
  background-image:linear-gradient(rgba(127,152,173,.43), rgba(127,152,173,.43)), url('/assets/ref-reeds.webp') !important;
  color:#ffffff !important;
}

/* Home RSVP / "¡Esperamos que puedas acompañarnos!" section:
   only replace the warm/yellow tint with a light-blue overlay.
   Do not recolor the Ceremony section. */
.home-rsvp-band{
  background-image:linear-gradient(rgba(170,203,224,.36), rgba(170,203,224,.36)), url('/assets/ref-rsvp-banner.webp') !important;
}

/* Keep Ceremony image/overlay exactly as the uploaded RAR defined it.
   Only force its text to white above; no blue hue is applied here. */

/* Some explicit old dark text colors */
.section p,
.story-copy p,
.stay-details-intro p:last-child,
.stay-list span,
.admin-page .eyebrow,
.admin-page .admin-small{
  color:#ffffff !important;
}

/* Mobile consistency */
@media(max-width:900px){
  .site-nav{
    background:linear-gradient(to bottom, rgba(127,152,173,.92) 0%, rgba(127,152,173,.56) 62%, rgba(127,152,173,0) 100%) !important;
  }
  .site-nav.open{
    background:linear-gradient(to bottom, rgba(127,152,173,.96) 0%, rgba(127,152,173,.88) 45%, rgba(127,152,173,.78) 100%) !important;
  }
}


/* Registry background image fix from RAR 12.
   The new uploaded file is registry-bosque.webp, so force the registry hero to use it. */
body.registry-page .registry-reference-hero{
  background-image:
    linear-gradient(rgba(31,31,27,.20), rgba(31,31,27,.18)),
    url('/assets/registry-bosque.webp') !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
}

/* Keep the background visible all the way into the wave/footer transition. */
body.registry-page .registry-reference-hero::after,
body.registry-page .registry-reference-hero:after{
  display:none !important;
  content:none !important;
  background:transparent !important;
}


/* Home hero v13 adjustment:
   Push the new homepage hero image lower and add a subtle 10% transparency/veil effect
   in CSS only, without altering the image file. */
.home-hero{
  background-image:
    linear-gradient(rgba(255,255,255,.10), rgba(255,255,255,.10)),
    url('/assets/ref-home-hero.webp') !important;
  background-position:center 82% !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
}

.home-hero .home-title-block{
  position:relative !important;
  z-index:2 !important;
}

@media(max-width:900px){
  .home-hero{
    background-position:center 82% !important;
  }
}


/* Home hero v14 correction:
   Previous pass moved the image the wrong way. This moves the visible photo in the opposite direction
   and makes the veil/transparency effect more noticeable, still only through CSS. */
.home-hero{
  background-image:
    linear-gradient(rgba(255,255,255,.24), rgba(255,255,255,.24)),
    url('/assets/ref-home-hero.webp') !important;
  background-position:center 28% !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
}

@media(max-width:900px){
  .home-hero{
    background-image:
      linear-gradient(rgba(255,255,255,.24), rgba(255,255,255,.24)),
      url('/assets/ref-home-hero.webp') !important;
    background-position:center 28% !important;
  }
}


/* Home hero v15 adjustment:
   - remove the transparency-style white veil
   - use a very light blue hue instead
   - move the image farther down on desktop and mobile */
.home-hero{
  background-image:
    linear-gradient(rgba(173, 201, 220, .16), rgba(173, 201, 220, .16)),
    url('/assets/ref-home-hero.webp') !important;
  background-position:center 16% !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
}

@media(max-width:900px){
  .home-hero{
    background-image:
      linear-gradient(rgba(173, 201, 220, .18), rgba(173, 201, 220, .18)),
      url('/assets/ref-home-hero.webp') !important;
    background-position:center 14% !important;
    background-size:cover !important;
    background-repeat:no-repeat !important;
  }
}


/* Home hero v16 mobile fix:
   On mobile, use a real translated background layer so the couple/photo moves down,
   instead of relying on background-position rules that were being visually ineffective. */
@media(max-width:900px){
  .home-hero{
    position:relative !important;
    overflow:hidden !important;
    background-image:none !important;
    background-color:#7f98ad !important;
  }

  .home-hero::before{
    content:"" !important;
    position:absolute !important;
    left:0 !important;
    right:0 !important;
    top:-170px !important;
    bottom:-170px !important;
    background-image:
      linear-gradient(rgba(173, 201, 220, .14), rgba(173, 201, 220, .14)),
      url('/assets/ref-home-hero.webp') !important;
    background-size:cover !important;
    background-position:center center !important;
    background-repeat:no-repeat !important;
    transform:translateY(165px) !important;
    z-index:0 !important;
  }

  .home-hero .home-title-block{
    position:relative !important;
    z-index:2 !important;
  }
}


/* Home hero v17 mobile: restore original background treatment and simply shift the original image downward.
   This keeps more of the full scene visible while moving the couple below the text. */
@media(max-width:900px){
  .home-hero{
    position:relative !important;
    overflow:hidden !important;
    background-color:#7f98ad !important;
    background-image:
      linear-gradient(rgba(173, 201, 220, .14), rgba(173, 201, 220, .14)),
      url('/assets/ref-home-hero.webp') !important;
    background-size:cover !important;
    background-repeat:no-repeat !important;
    background-position:center 36% !important;
  }

  .home-hero::before{
    content:none !important;
    display:none !important;
  }

  .home-hero .home-title-block{
    position:relative !important;
    z-index:2 !important;
  }
}


/* ===== Home page refinements from to-do list ===== */
.home-story-band{
  background-image:
    linear-gradient(rgba(47,45,42,.24), rgba(47,45,42,.24)),
    url('/assets/story-grass.webp') !important;
  background-position:center center !important;
}

.home-hero{
  position:relative !important;
  overflow:hidden !important;
  background:none !important;
  background-color:#9fb9cf !important;
  isolation:isolate !important;
}

.home-hero::before{
  content:"" !important;
  position:absolute !important;
  inset:-2% !important;
  background-image:url('/assets/ref-home-hero.webp') !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
  background-position:center 16% !important;
  filter:blur(10px) !important;
  transform:scale(1.04) !important;
  z-index:0 !important;
}

.home-hero::after{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  background:linear-gradient(rgba(170,203,224,.36), rgba(170,203,224,.36)) !important;
  z-index:1 !important;
}

.home-hero .home-title-block{
  position:relative !important;
  z-index:2 !important;
}

.home-hero .kicker,
.home-hero h1,
.home-hero .date-line{
  font-family:'Snell Roundhand','Brush Script MT','Lucida Handwriting','Apple Chancery',cursive !important;
  font-weight:600 !important;
  letter-spacing:0 !important;
  color:#ffffff !important;
  text-shadow:0 3px 18px rgba(0,0,0,.18) !important;
}

.home-hero .kicker{
  font-size:56px !important;
  margin-bottom:18px !important;
}

.home-hero h1{
  font-size:104px !important;
  line-height:0.98 !important;
}

.home-hero .date-line{
  font-size:58px !important;
  margin-top:24px !important;
}

.ceremony-section{
  grid-template-columns:minmax(320px, 560px) minmax(320px, 760px) !important;
  gap:70px !important;
}

.ceremony-image{display:none !important;}

.ceremony-countdown-card{
  justify-self:center;
  width:min(560px, 100%);
  padding:58px 38px 42px;
  border-radius:280px 280px 28px 28px / 165px 165px 28px 28px;
  background:linear-gradient(180deg, rgba(158,184,204,.90) 0%, rgba(123,150,170,.92) 100%);
  border:1px solid rgba(194,158,82,.55);
  box-shadow:0 28px 60px rgba(48,45,41,.16);
  color:#fff;
  text-align:center;
}

.ceremony-countdown-card .countdown-eyebrow{
  margin:0 0 12px;
  color:#f2e2b7;
  letter-spacing:.26em;
  text-transform:uppercase;
  font-size:12px;
}

.ceremony-countdown-card h3{
  margin:0 0 22px;
  font-family:'Snell Roundhand','Brush Script MT','Lucida Handwriting','Apple Chancery',cursive;
  font-size:56px;
  line-height:1;
  color:#ffffff;
}

.ceremony-countdown-card .countdown{
  width:100%;
  margin:0 auto;
  border-top:1px solid rgba(255,255,255,.34);
  border-bottom:1px solid rgba(255,255,255,.34);
  grid-template-columns:repeat(4, 1fr);
}

.ceremony-countdown-card .countdown div{
  border-right:1px solid rgba(255,255,255,.25);
  padding:18px 10px;
}

.ceremony-countdown-card .countdown div:last-child{
  border-right:0;
}

.ceremony-countdown-card .countdown strong{
  display:block;
  font-family:'WeddingDisplay','Bree Serif', Georgia, serif;
  font-size:46px;
  line-height:1;
  color:#ffffff;
}

.ceremony-countdown-card .countdown span{
  display:block;
  margin-top:8px;
  font-size:12px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:#f2e2b7;
}

.ceremony-countdown-card .countdown-note{
  margin:18px 0 0;
  color:#ffffff;
  font-size:18px;
  line-height:1.4;
}

.ceremony-copy,
.ceremony-copy h2,
.ceremony-copy h4,
.ceremony-copy p,
.ceremony-copy strong{
  color:#b8914e !important;
}

.ceremony-copy h2,
.ceremony-copy h4{
  text-shadow:0 1px 0 rgba(255,255,255,.32);
}

@media(max-width:900px){
  .home-hero::before{
    background-position:center 36% !important;
  }

  .home-hero .kicker{
    font-size:34px !important;
  }

  .home-hero h1{
    font-size:68px !important;
    line-height:1 !important;
  }

  .home-hero .date-line{
    font-size:40px !important;
    margin-top:18px !important;
  }

  .ceremony-section{
    grid-template-columns:1fr !important;
    padding:300px 26px 92px !important;
    gap:28px !important;
  }

  .ceremony-countdown-card{
    width:min(430px, 100%);
    padding:44px 22px 30px;
    border-radius:220px 220px 24px 24px / 120px 120px 24px 24px;
  }

  .ceremony-countdown-card h3{
    font-size:42px;
  }

  .ceremony-countdown-card .countdown{
    grid-template-columns:repeat(2, 1fr);
  }

  .ceremony-countdown-card .countdown div:nth-child(2){
    border-right:0;
  }

  .ceremony-countdown-card .countdown div:nth-child(-n+2){
    border-bottom:1px solid rgba(255,255,255,.25);
  }

  .ceremony-countdown-card .countdown strong{
    font-size:36px;
  }
}


/* ===== Home to-do correction pass v15 =====
   Fixes:
   1) blur toned down
   2) mobile hero image visible again
   3) all ceremony copy text is gold
   4) reduced mobile gap before countdown
   5) more elegant invitation-style cursive
*/

/* More elegant wedding-invitation font for the home hero text. */
body .home-hero .kicker,
body .home-hero h1,
body .home-hero .date-line{
  font-family:'Great Vibes','Snell Roundhand','Brush Script MT','Lucida Handwriting','Apple Chancery',cursive !important;
  font-weight:400 !important;
  letter-spacing:0 !important;
  color:#ffffff !important;
  text-shadow:0 4px 22px rgba(0,0,0,.22) !important;
}

body .home-hero .kicker{
  font-size:70px !important;
  margin-bottom:12px !important;
}

body .home-hero h1{
  font-size:132px !important;
  line-height:.92 !important;
}

body .home-hero .date-line{
  font-size:66px !important;
  margin-top:22px !important;
}

/* Desktop hero: keep the hue, but reduce blur heavily. */
body .home-hero{
  position:relative !important;
  overflow:hidden !important;
  background:none !important;
  background-color:#9fb9cf !important;
  isolation:isolate !important;
}

body .home-hero::before{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  inset:-1% !important;
  background-image:url('/assets/ref-home-hero.webp') !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
  background-position:center 16% !important;
  filter:blur(3px) !important;
  transform:scale(1.012) !important;
  z-index:0 !important;
  opacity:1 !important;
}

body .home-hero::after{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  inset:0 !important;
  background:linear-gradient(rgba(170,203,224,.30), rgba(170,203,224,.30)) !important;
  z-index:1 !important;
  pointer-events:none !important;
}

body .home-hero .home-title-block{
  position:relative !important;
  z-index:2 !important;
}

/* Make every piece of ceremony copy gold.
   Keep buttons as buttons, not gold text blocks. */
body .ceremony-section .ceremony-copy,
body .ceremony-section .ceremony-copy h2,
body .ceremony-section .ceremony-copy h4,
body .ceremony-section .ceremony-copy p,
body .ceremony-section .ceremony-copy p *,
body .ceremony-section .ceremony-copy strong{
  color:#b8914e !important;
}

body .ceremony-section .ceremony-copy a.dark-button,
body .ceremony-section .ceremony-copy a.dark-button *,
body .ceremony-section .ceremony-copy .dark-button{
  color:#ffffff !important;
  background:#2f2c29 !important;
  border-color:#2f2c29 !important;
}

/* Keep the story band image choice locked to story-grass. */
body .home-story-band{
  background-image:
    linear-gradient(rgba(47,45,42,.24), rgba(47,45,42,.24)),
    url('/assets/story-grass.webp') !important;
  background-position:center center !important;
}

/* Mobile-specific: make the actual hero image visible and reduce gap before countdown. */
@media(max-width:900px){
  body .home-hero{
    position:relative !important;
    overflow:hidden !important;
    background:none !important;
    background-color:#9fb9cf !important;
    isolation:isolate !important;
  }

  body .home-hero::before{
    content:"" !important;
    display:block !important;
    position:absolute !important;
    inset:-1% !important;
    background-image:url('/assets/ref-home-hero.webp') !important;
    background-size:cover !important;
    background-repeat:no-repeat !important;
    background-position:center 36% !important;
    filter:blur(2px) !important;
    transform:scale(1.008) !important;
    z-index:0 !important;
    opacity:1 !important;
  }

  body .home-hero::after{
    content:"" !important;
    display:block !important;
    position:absolute !important;
    inset:0 !important;
    background:linear-gradient(rgba(170,203,224,.26), rgba(170,203,224,.26)) !important;
    z-index:1 !important;
    pointer-events:none !important;
  }

  body .home-hero .home-title-block{
    position:relative !important;
    z-index:2 !important;
  }

  body .home-hero .kicker{
    font-size:45px !important;
    margin-bottom:8px !important;
  }

  body .home-hero h1{
    font-size:78px !important;
    line-height:.94 !important;
  }

  body .home-hero .date-line{
    font-size:43px !important;
    margin-top:12px !important;
  }

  body .ceremony-section{
    margin-top:-168px !important;
    padding:142px 26px 92px !important;
    gap:24px !important;
  }

  body .ceremony-countdown-card{
    margin-top:0 !important;
  }
}


/* ===== Polish pass: mobile hero title, lighter blur, travel cleanup, registry text, fireworks ===== */

/* 1 + 2: Less blur on the home ref hero, desktop and mobile. */
body .home-hero::before{
  filter:blur(1.25px) !important;
  transform:scale(1.006) !important;
}

@media(max-width:900px){
  body .home-hero::before{
    filter:blur(.75px) !important;
    transform:scale(1.003) !important;
  }

  /* Fit “Mónica & Eric” on one line on mobile. */
  body .home-hero h1{
    font-size:58px !important;
    line-height:.96 !important;
    white-space:nowrap !important;
  }

  body .home-hero .kicker{
    font-size:40px !important;
  }

  body .home-hero .date-line{
    font-size:36px !important;
  }
}

/* 3: Estadía cleanup after removing the bottom 3-photo strip. */
body.travel-page main{
  padding-bottom:0 !important;
}

body.travel-page .stay-details{
  margin-bottom:78px !important;
}

body.travel-page .stay-panels{
  margin-bottom:0 !important;
}

body.travel-page .stay-photo-band{
  display:none !important;
}

body.travel-page .stay-panel img{
  object-fit:cover !important;
  object-position:center center !important;
}

body.travel-page .site-footer{
  margin-top:-92px !important;
}

@media(max-width:900px){
  body.travel-page .stay-details{
    margin-bottom:46px !important;
  }

  body.travel-page .site-footer{
    margin-top:-72px !important;
  }
}

/* 4: Registry page: remove blue textbox while preserving readable text. */
body.registry-page .registry-overlay-card{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  padding:0 18px !important;
  max-width:1120px !important;
}

body.registry-page .registry-overlay-card p{
  color:#ffffff !important;
  text-shadow:0 3px 18px rgba(0,0,0,.50), 0 1px 2px rgba(0,0,0,.55) !important;
}

/* 5: One-time home page fireworks. */
.home-hero{
  isolation:isolate !important;
}

.home-fireworks{
  position:absolute;
  left:0;
  right:0;
  top:0;
  width:100%;
  height:100%;
  z-index:2;
  pointer-events:none;
}

.home-hero .home-title-block{
  z-index:3 !important;
}


/* ===== Well-done pass v17 ===== */
body .ceremony-countdown-card .countdown-eyebrow,
body .ceremony-countdown-card .countdown-note{
  font-family:'Great Vibes','Snell Roundhand','Brush Script MT','Lucida Handwriting','Apple Chancery',cursive !important;
  font-weight:400 !important;
  letter-spacing:0 !important;
  text-transform:none !important;
  color:#f2e2b7 !important;
}
body .ceremony-countdown-card .countdown-eyebrow{font-size:36px !important;margin-bottom:8px !important;}
body .ceremony-countdown-card .countdown-note{font-size:32px !important;line-height:1.15 !important;}

body.registry-page .registry-overlay-card{max-width:980px !important;}
body.registry-page .registry-overlay-card p{
  font-family:'Cormorant Garamond','Garamond','Times New Roman',serif !important;
  font-weight:500 !important;
  font-size:31px !important;
  line-height:1.35 !important;
  letter-spacing:.01em !important;
  color:#ffffff !important;
  text-shadow:0 2px 16px rgba(0,0,0,.42),0 1px 2px rgba(0,0,0,.45) !important;
}

.site-footer{grid-template-columns:1fr 1fr !important;}
.footer-date{display:none !important;}
.footer-contact a{color:inherit !important;text-decoration:none !important;border-bottom:1px solid rgba(255,255,255,.55);}
.footer-contact a:hover{border-bottom-color:currentColor;}

body .home-hero{
  background-image:linear-gradient(rgba(170,203,224,.30),rgba(170,203,224,.30)),url('/assets/ref-home-hero.webp') !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
  background-position:center 16% !important;
  background-color:#9fb9cf !important;
}
body .home-hero::before{filter:blur(.65px) !important;transform:scale(1.002) !important;}

@media(max-width:900px){
  body.registry-page .registry-overlay-card p{font-size:22px !important;line-height:1.38 !important;}
  body .ceremony-countdown-card .countdown-eyebrow{font-size:30px !important;}
  body .ceremony-countdown-card .countdown-note{font-size:27px !important;}
  .site-footer{grid-template-columns:1fr !important;}
  body .home-hero{
    background-image:linear-gradient(rgba(170,203,224,.26),rgba(170,203,224,.26)),url('/assets/ref-home-hero.webp') !important;
    background-position:center 36% !important;
  }
  body .home-hero::before{filter:blur(.35px) !important;transform:scale(1.001) !important;}
}

/* ===== Refinement pass v18 ===== */
/* 1: keep countdown cursive lines white, not gold. */
body .ceremony-countdown-card .countdown-eyebrow,
body .ceremony-countdown-card .countdown-note{
  color:#ffffff !important;
  text-shadow:0 2px 14px rgba(0,0,0,.16) !important;
}

/* 2: mobile hero uses a small optimized image so it appears immediately. */
@media(max-width:900px){
  body .home-hero{
    background-image:
      linear-gradient(rgba(170,203,224,.26),rgba(170,203,224,.26)),
      url('/assets/ref-home-hero-mobile.webp') !important;
    background-position:center 36% !important;
  }
  body .home-hero::before{
    background-image:url('/assets/ref-home-hero-mobile.webp') !important;
  }
}

/* 4 + 5: footer layout, desktop links to the right, mobile cleaner one-line contact text. */
.site-footer{
  grid-template-columns:1fr auto !important;
  align-items:center !important;
}
.footer-contact{
  text-align:left !important;
  max-width:none !important;
}
.footer-contact p{
  margin:.25rem 0 !important;
}
.footer-links{
  align-items:flex-end !important;
  justify-self:end !important;
  text-align:right !important;
}
.footer-contact a{
  white-space:nowrap !important;
}
@media(max-width:900px){
  .site-footer{
    grid-template-columns:1fr !important;
    text-align:center !important;
    gap:18px !important;
  }
  .footer-contact{
    text-align:center !important;
    font-size:15px !important;
    line-height:1.35 !important;
  }
  .footer-contact p:first-child{
    white-space:nowrap !important;
    font-size:15px !important;
  }
  .footer-contact p:nth-child(2){
    white-space:nowrap !important;
    font-size:12.8px !important;
    letter-spacing:-.01em !important;
  }
  .footer-contact .made{
    font-size:18px !important;
  }
  .footer-links{
    justify-self:center !important;
    align-items:center !important;
    text-align:center !important;
  }
}

/* 6: registry text, more like a wedding invitation. */
body.registry-page .registry-overlay-card p{
  font-family:'Marcellus','Cormorant Garamond','Garamond','Times New Roman',serif !important;
  font-weight:400 !important;
  font-size:29px !important;
  line-height:1.55 !important;
  letter-spacing:.025em !important;
  text-shadow:0 2px 16px rgba(0,0,0,.44),0 1px 2px rgba(0,0,0,.50) !important;
}
@media(max-width:900px){
  body.registry-page .registry-overlay-card p{
    font-size:20px !important;
    line-height:1.55 !important;
    letter-spacing:.018em !important;
  }
}


/* ===== v22: keep the good footer placement; only update Registro font + lift footer contents ===== */

/* Registro: use the lighter cursive font from the previous attempt, without changing the box/section layout. */
body.registry-page .registry-overlay-card{
  max-width:1040px !important;
}

body.registry-page .registry-overlay-card p{
  font-family:'Parisienne','Great Vibes','Snell Roundhand','Brush Script MT',cursive !important;
  font-weight:400 !important;
  font-size:38px !important;
  line-height:1.22 !important;
  letter-spacing:.005em !important;
  color:#ffffff !important;
  text-shadow:0 2px 14px rgba(0,0,0,.42), 0 1px 2px rgba(0,0,0,.38) !important;
}

/* Mobile footer: do NOT change the footer placement/height/margins/padding.
   Only move the contents upward inside the existing footer. */
@media(max-width:900px){
  body .footer-contact,
  body .footer-links{
    transform:translateY(-42px) !important;
  }

  body.registry-page .registry-overlay-card p{
    font-size:30px !important;
    line-height:1.24 !important;
  }
}

@media(max-width:430px){
  body .footer-contact,
  body .footer-links{
    transform:translateY(-38px) !important;
  }

  body.registry-page .registry-overlay-card p{
    font-size:27px !important;
    line-height:1.25 !important;
  }
}


/* ===== v23 from RAR16 requested changes ===== */

/* Footer links gold on every page. */
.footer-links a,
.site-footer .footer-links a{
  color:#b8914e !important;
  text-decoration-color:#b8914e !important;
}

/* Footer updated layout / phone links. */
.footer-contact a{
  color:inherit !important;
  text-decoration:none !important;
  border-bottom:1px solid currentColor;
}

.footer-contact p{
  margin:0 0 7px !important;
}

.footer-contact .made{
  margin-top:12px !important;
}

/* Registry text gold. */
body.registry-page .registry-overlay-card p{
  color:#b8914e !important;
  text-shadow:0 2px 12px rgba(0,0,0,.28), 0 1px 2px rgba(255,255,255,.18) !important;
}

/* Desktop-only alignment fix for Ceremonia + countdown. */
@media(min-width:901px){
  .ceremony-section{
    grid-template-columns:minmax(420px, 560px) minmax(520px, 760px) !important;
    justify-content:center !important;
    align-items:center !important;
    column-gap:92px !important;
    padding-left:clamp(70px, 7vw, 132px) !important;
    padding-right:clamp(70px, 7vw, 132px) !important;
  }

  .ceremony-countdown-card{
    justify-self:end !important;
    align-self:center !important;
  }

  .ceremony-copy{
    justify-self:start !important;
    align-self:center !important;
  }
}

/* RSVP: hide/remove optional message controls if any are still generated. */
.rsvp-page .guest-note,
.rsvp-page label:has(.guest-note),
.rsvp-page textarea[name="note"],
.rsvp-page label:has(textarea[name="note"]){
  display:none !important;
}


/* ===== v24 RSVP/Admin polish and color reversions ===== */

/* Revert footer links and registry gift text back to white. */
.footer-links a,
.site-footer .footer-links a{
  color:#ffffff !important;
  text-decoration-color:#ffffff !important;
}

body.registry-page .registry-overlay-card p{
  color:#ffffff !important;
  text-shadow:0 2px 14px rgba(0,0,0,.42), 0 1px 2px rgba(0,0,0,.38) !important;
}

/* RSVP page hero title in gold. */
body.rsvp-page .rsvp-hero h1,
body.rsvp-page .page-hero h1{
  color:#b8914e !important;
  text-shadow:0 2px 16px rgba(255,255,255,.20), 0 2px 14px rgba(0,0,0,.24) !important;
}

/* RSVP box/card gold with white text on dusty blue background. */
body.rsvp-page .rsvp-box{
  background:linear-gradient(180deg, rgba(184,145,78,.94), rgba(166,129,66,.94)) !important;
  border:1px solid rgba(255,255,255,.32) !important;
  box-shadow:0 24px 70px rgba(35,32,28,.18) !important;
  color:#ffffff !important;
}

body.rsvp-page .rsvp-box h2,
body.rsvp-page .rsvp-box p,
body.rsvp-page .rsvp-box label,
body.rsvp-page .guest-area h2,
body.rsvp-page .guest-intro,
body.rsvp-page .guest-card h4,
body.rsvp-page .form-message,
body.rsvp-page .invite-note{
  color:#ffffff !important;
}

body.rsvp-page .code-row{
  display:grid !important;
  grid-template-columns:minmax(0, 1fr) auto !important;
  gap:12px !important;
  align-items:end !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  padding:0 !important;
}

body.rsvp-page .code-row input,
body.rsvp-page .guest-card select{
  background:rgba(255,255,255,.18) !important;
  color:#ffffff !important;
  border:1px solid rgba(255,255,255,.48) !important;
}

body.rsvp-page .code-row input::placeholder{
  color:rgba(255,255,255,.68) !important;
}

body.rsvp-page .guest-card{
  background:rgba(255,255,255,.10) !important;
  border:1px solid rgba(255,255,255,.25) !important;
  box-shadow:none !important;
}

body.rsvp-page .invite-note{
  margin-top:26px !important;
  margin-bottom:0 !important;
  font-size:14px !important;
  line-height:1.45 !important;
  opacity:.92 !important;
}

body.rsvp-page #codeMessage{
  margin:14px 0 4px !important;
}

/* Keep the centered guest-intro only once. */
body.rsvp-page .guest-intro{
  text-align:center !important;
  margin:10px 0 20px !important;
}

/* Admin cards also gold/white so the mechanic visually matches RSVP. */
body.admin-page .admin-card{
  background:linear-gradient(180deg, rgba(184,145,78,.94), rgba(166,129,66,.94)) !important;
  color:#ffffff !important;
  border:1px solid rgba(255,255,255,.30) !important;
}

body.admin-page .admin-card h2,
body.admin-page .admin-card p,
body.admin-page .admin-card label,
body.admin-page .admin-table,
body.admin-page .admin-table th,
body.admin-page .admin-table td,
body.admin-page .form-message{
  color:#ffffff !important;
}

body.admin-page input,
body.admin-page select{
  background:rgba(255,255,255,.18) !important;
  color:#ffffff !important;
  border:1px solid rgba(255,255,255,.45) !important;
}

body.admin-page option,
body.rsvp-page option{
  color:#2f2c29 !important;
}

@media(max-width:700px){
  body.rsvp-page .code-row{
    grid-template-columns:1fr !important;
  }
}


/* ===== v25 RSVP/Admin quick fixes ===== */

/* RSVP hero title should be white again. */
body.rsvp-page .rsvp-hero h1,
body.rsvp-page .page-hero.rsvp-hero h1{
  color:#ffffff !important;
  text-shadow:0 3px 18px rgba(0,0,0,.28) !important;
}

/* Admin default should visually land on No asistirá when there is no saved RSVP. */
body.admin-page .admin-attending option[value="No asistirá"]{
  font-weight:700;
}


/* ===== v26 final stretch updates ===== */

/* Registry: blur only the background image, not the text, for readability. */
body.registry-page .registry-reference-hero{
  position:relative !important;
  overflow:hidden !important;
  background-image:none !important;
  background-color:#7f98ad !important;
}

body.registry-page .registry-reference-hero::before{
  content:"" !important;
  position:absolute !important;
  inset:-18px !important;
  background-image:
    linear-gradient(rgba(31,31,27,.18), rgba(31,31,27,.16)),
    url('/assets/registry-bosque.webp') !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
  filter:blur(3px) !important;
  transform:scale(1.035) !important;
  z-index:0 !important;
}

body.registry-page .registry-overlay-card{
  position:relative !important;
  z-index:2 !important;
}

/* RSVP/Admin boxes: much lighter gold, white text. */
body.rsvp-page .rsvp-box,
body.admin-page .admin-card{
  background:linear-gradient(180deg, rgba(220,190,122,.96), rgba(198,160,82,.96)) !important;
  border:1px solid rgba(255,255,255,.44) !important;
  color:#ffffff !important;
  box-shadow:0 24px 70px rgba(35,32,28,.16) !important;
}

body.rsvp-page .guest-card{
  background:rgba(255,255,255,.13) !important;
  border-color:rgba(255,255,255,.32) !important;
}

/* RSVP deadline sentence. */
body.rsvp-page .rsvp-deadline-note{
  color:#ffffff !important;
  font-weight:700 !important;
  margin-top:12px !important;
}

/* Footer contact split into separate phone lines. */
.footer-contact p{
  margin:0 0 7px !important;
}

.footer-contact .made{
  margin-top:14px !important;
}

.footer-contact a{
  color:inherit !important;
  text-decoration:none !important;
  border-bottom:1px solid currentColor;
}

/* Keep footer links and registry text white after the previous regret/revert. */
.footer-links a,
.site-footer .footer-links a{
  color:#ffffff !important;
  text-decoration-color:#ffffff !important;
}

body.registry-page .registry-overlay-card p{
  color:#ffffff !important;
}

/* Audio stays invisible. */
#weddingMusic{
  display:none !important;
}


/* ===== v27 music + RSVP deadline finalization ===== */

/* Expired RSVP message centered. */
body.rsvp-page #codeMessage,
body.rsvp-page .form-message{
  text-align:center !important;
}

/* Deadline text now lives in the normal paragraph, so no special separate style needed. */
body.rsvp-page .rsvp-deadline-note{
  display:none !important;
}

/* Small fallback only appears if browser blocks autoplay. */
.music-start-button{
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:9999;
  border:1px solid rgba(255,255,255,.55);
  background:rgba(184,145,78,.92);
  color:#fff;
  border-radius:999px;
  padding:10px 16px;
  font-family:'Cormorant Garamond', serif;
  font-size:15px;
  letter-spacing:.02em;
  box-shadow:0 10px 30px rgba(0,0,0,.18);
}

.music-start-button.hidden{
  display:none !important;
}


/* ===== v28 music circle toggle ===== */

/* Hide old long fallback button if any old markup survived. */
.music-start-button{
  display:none !important;
}

/* Small functional play/pause circle. */
.music-toggle-button{
  position:fixed !important;
  right:18px !important;
  bottom:18px !important;
  z-index:9999 !important;
  width:48px !important;
  height:48px !important;
  border-radius:50% !important;
  border:1px solid rgba(255,255,255,.68) !important;
  background:rgba(184,145,78,.92) !important;
  color:#ffffff !important;
  box-shadow:0 10px 30px rgba(0,0,0,.20) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  cursor:pointer !important;
  padding:0 !important;
  -webkit-tap-highlight-color:transparent !important;
}

.music-toggle-button:hover{
  transform:translateY(-1px) !important;
  background:rgba(198,160,82,.96) !important;
}

.music-toggle-button:active{
  transform:translateY(0) scale(.97) !important;
}

.music-icon{
  display:block !important;
  width:0 !important;
  height:0 !important;
}

/* Play triangle */
.music-icon-play{
  margin-left:4px !important;
  border-top:10px solid transparent !important;
  border-bottom:10px solid transparent !important;
  border-left:16px solid #ffffff !important;
}

/* Pause bars */
.music-icon-pause{
  width:16px !important;
  height:20px !important;
  border-left:6px solid #ffffff !important;
  border-right:6px solid #ffffff !important;
  box-sizing:border-box !important;
}

@media(max-width:700px){
  .music-toggle-button{
    width:44px !important;
    height:44px !important;
    right:14px !important;
    bottom:14px !important;
  }
}


/* ===== v29 repaired music button ===== */
.music-toggle-button{
  pointer-events:auto !important;
  user-select:none !important;
}

.music-toggle-button.is-loading{
  opacity:.82 !important;
}

.music-toggle-button.is-loading::after{
  content:"" !important;
  position:absolute !important;
  inset:5px !important;
  border-radius:50% !important;
  border:2px solid rgba(255,255,255,.35) !important;
  border-top-color:#ffffff !important;
  animation:musicSpin .85s linear infinite !important;
}

@keyframes musicSpin{
  to{ transform:rotate(360deg); }
}


/* ===== v30 continuous music + final text edits ===== */

/* Registro: keep blur and add dusty-blue hue behind the text for readability. */
body.registry-page .registry-reference-hero::before{
  background-image:
    linear-gradient(rgba(92,128,155,.38), rgba(92,128,155,.38)),
    linear-gradient(rgba(31,31,27,.14), rgba(31,31,27,.12)),
    url('/assets/registry-bosque.webp') !important;
  filter:blur(3px) !important;
  transform:scale(1.035) !important;
}

/* Nuestra Historia final announcement. */
body.our-story-page .story-wedding-line{
  font-family:'Great Vibes','Snell Roundhand','Brush Script MT',cursive !important;
  font-size:52px !important;
  line-height:1 !important;
  text-align:center !important;
  margin:28px 0 14px !important;
}

@media(max-width:700px){
  body.our-story-page .story-wedding-line{
    font-size:42px !important;
  }
}


/* ===== v32 home ceremony detail emphasis ===== */

/* Home page ceremony date + location: slightly larger for importance, without overpowering the section. */
body:not(.our-story-page):not(.travel-page):not(.registry-page):not(.rsvp-page):not(.admin-page) .ceremony-copy h4{
  font-size:clamp(25px, 2.15vw, 34px) !important;
  line-height:1.16 !important;
  margin-bottom:12px !important;
}

body:not(.our-story-page):not(.travel-page):not(.registry-page):not(.rsvp-page):not(.admin-page) .ceremony-copy h4 + p{
  font-size:clamp(19px, 1.35vw, 23px) !important;
  line-height:1.35 !important;
  font-weight:600 !important;
}

@media(max-width:900px){
  body:not(.our-story-page):not(.travel-page):not(.registry-page):not(.rsvp-page):not(.admin-page) .ceremony-copy h4{
    font-size:26px !important;
  }

  body:not(.our-story-page):not(.travel-page):not(.registry-page):not(.rsvp-page):not(.admin-page) .ceremony-copy h4 + p{
    font-size:19px !important;
  }
}


/* ===== v38 persistent music shell =====
   The page content lives in a normal iframe so original page animations/effects
   load exactly as they did before. The music player stays outside the iframe. */
.music-shell-html,
body.music-shell-active{
  width:100%;
  height:100%;
  margin:0 !important;
  overflow:hidden !important;
  background:#7f98ad !important;
}

body.music-shell-active > :not(#siteShellFrame):not(#weddingMusic):not(#musicToggleButton){
  display:none !important;
}

#siteShellFrame{
  position:fixed !important;
  inset:0 !important;
  width:100vw !important;
  height:100dvh !important;
  border:0 !important;
  margin:0 !important;
  padding:0 !important;
  z-index:1 !important;
  background:#7f98ad !important;
}

body.music-shell-active #musicToggleButton{
  z-index:10000 !important;
}