@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600;700&family=Jost:wght@400;500;600&display=swap');

:root{
  --cream:#e9e2d6;
  --text:#4a4037;
  --white:#fff;
  --olive:#a4a878;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--text);font-family:"Jost",sans-serif}
a{color:inherit;text-decoration:none}
img{display:block;width:100%;height:100%;object-fit:cover}

/* Shared placeholder */
.image-placeholder{
  background:#fff url("assets/placeholder.jpg") center/cover no-repeat;
  position:relative;
}
.image-placeholder span{display:none}

/* LOCK SCREEN */
.lock-screen{position:fixed;inset:0;min-height:600px;background:url("assets/masia.jpg") center/cover no-repeat;overflow:hidden}
.lock-overlay{position:absolute;inset:0;background:rgba(43,48,48,.48)}
.lock-content{position:relative;z-index:1;width:100%;height:100%;color:#fff;text-align:center}
.lock-content h1{
  position:absolute;left:50%;top:36.8%;transform:translate(-50%,-50%);
  margin:0;white-space:nowrap;font-family:"Cormorant Garamond",serif;
  font-size:clamp(48px,4.1vw,58px);line-height:1;font-weight:700;letter-spacing:-1.5px
}
.lock-content p{
  position:absolute;left:50%;transform:translateX(-50%);margin:0;white-space:nowrap;
  font-family:"Jost",sans-serif;font-size:19px;line-height:1;font-weight:400
}
.lock-content p:nth-of-type(1){top:49.2%}
.lock-content p:nth-of-type(2){top:54.9%}
#passwordForm{
  position:absolute;left:50%;top:63%;transform:translateX(-50%);
  width:365px;height:61px;border:2px solid rgba(255,255,255,.96);
  display:flex;align-items:center;padding:0 4px 0 7px
}
#password{flex:1;height:100%;min-width:0;border:0;outline:0;background:transparent;color:#fff;font-family:"Jost",sans-serif;font-size:18px;padding:0}
#password::placeholder{color:#fff;opacity:1}
#passwordForm button{width:45px;height:52px;border:0;background:transparent;color:rgba(255,255,255,.72);cursor:pointer;font:200 39px/1 Arial;padding:0}
#error{position:absolute;left:50%;top:69%;transform:translateX(-50%);font-family:"Jost",sans-serif;font-size:14px;opacity:0}
#error.show{opacity:1}

/* HOME HEADER */
.header{
  position:absolute;z-index:10;top:0;left:0;right:0;
  display:grid;grid-template-columns:1fr auto 1fr;align-items:start;
  padding:67px 75px 0;color:var(--text)
}
.nav{
  display:flex;gap:25px;align-items:center;
  font-family:"Jost",sans-serif;font-size:20px;line-height:1;
  white-space:nowrap
}
.nav-left{flex-wrap:nowrap;max-width:none;align-self:center}
.nav-right{justify-content:flex-end;gap:42px;align-self:center}
.header-brand{
  font-family:"Cormorant Garamond",serif;font-size:37px;line-height:1;
  font-weight:500;letter-spacing:.01em;white-space:nowrap
}

/* HERO */
.home-hero{height:858px;position:relative;background:var(--cream);overflow:hidden}
.home-hero .hero-placeholder{position:absolute;inset:0;background-image:url("assets/placeholder.jpg");background-position:center;background-size:cover;background-repeat:no-repeat;opacity:.5}
.hero-copy{
  position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;
  justify-content:center;text-align:center;z-index:2;padding-top:70px
}
.hero-date,.hero-location{font-family:"Jost",sans-serif;font-size:24px;font-weight:400}
.hero-date{margin-bottom:58px}
.hero-copy h1{
  font-family:"Cormorant Garamond",serif;font-weight:400;font-size:76px;
  line-height:1;margin:0 0 60px;letter-spacing:-.015em
}

/* WELCOME */
.welcome{text-align:center;padding:111px 8vw 103px;min-height:525px}
.welcome h2,.weekend-section h2,.taste h2{
  font-family:"Cormorant Garamond",serif;font-weight:400;
  font-size:58px;line-height:1.05;margin:0
}
.welcome h2{margin-bottom:57px}
.welcome p{font-family:"Jost",sans-serif;font-size:24px;line-height:1.35;margin:0 auto 25px;max-width:1370px}
.section-divider{display:flex;align-items:center;gap:0;margin:105px auto 0;max-width:1585px}
.section-divider:before,.section-divider:after{content:"";height:1px;background:var(--text);flex:1}
.section-divider span,.section-divider a{font-family:"Cormorant Garamond",serif;font-size:22px;padding:0 203px;white-space:nowrap}

/* WEEKEND */
.weekend-section{display:grid;grid-template-columns:2fr 1fr;min-height:1045px}
.weekend-main{padding:102px 8.2% 90px}
.weekend-section h2{text-align:left;margin-bottom:85px}
.event-row{display:grid;grid-template-columns:275px 1fr;gap:16px;margin-bottom:62px}
.event-image{width:275px;height:288px}
.event-copy{padding-top:7px}
.event-copy h3{font-family:"Cormorant Garamond",serif;font-weight:400;font-size:27px;line-height:1;margin:0 0 26px}
.event-copy p{font-family:"Jost",sans-serif;font-size:21px;line-height:1.45;margin:0;max-width:760px}
.weekend-side{min-height:1045px}
.see-weekend{margin:0 auto;padding:75px 8vw 102px}
.see-weekend span{padding:0 125px}

/* TASTE */
.taste{text-align:center;padding:104px 5vw 94px;min-height:910px}
.taste h2{margin-bottom:82px}
.taste-image{width:545px;height:510px;margin:0 auto 68px}
.taste p{font-family:"Jost",sans-serif;font-size:24px;line-height:1.45;margin:0 auto 95px}
.text-link{display:block;font-family:"Cormorant Garamond",serif;font-size:22px;margin:0 auto 75px}

/* RSVP */
.rsvp-hero{height:690px;position:relative;margin:0 75px 0}
.rsvp-hero>.image-placeholder{position:absolute;inset:0}
.rsvp-copy{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding-top:250px;color:#fff;text-align:center}
.rsvp-copy h2{font-family:"Cormorant Garamond",serif;font-size:56px;font-weight:400;margin:0 0 44px}
.rsvp-copy a{font-family:"Cormorant Garamond",serif;font-size:34px;font-weight:700}

/* FOOTER */
footer{text-align:center;padding:125px 20px 70px;min-height:430px;font-family:"Cormorant Garamond",serif}
footer div:first-child{font-size:50px;margin-bottom:48px}
footer div:nth-child(2){font-family:"Jost",sans-serif;font-size:23px;margin-bottom:80px}
footer a{font-size:23px}

@media(max-width:1100px){
  .header{padding-left:35px;padding-right:35px}
  .nav{font-size:17px;gap:17px}
  .nav-right{gap:28px}
}
@media(max-width:1100px){
  .header{padding:28px 24px 0;grid-template-columns:1fr auto}
  .header-brand{grid-column:2;grid-row:1;font-size:27px}
  .nav{font-size:15px;gap:13px}
  .nav-left{display:none}.nav-right{grid-column:1;grid-row:1;justify-content:flex-start;gap:22px}
  .home-hero{height:720px}.hero-copy h1{font-size:48px}.hero-date,.hero-location{font-size:18px}
  .welcome{padding:80px 24px}.welcome h2,.weekend-section h2,.taste h2{font-size:42px}.welcome p,.event-copy p,.taste p{font-size:18px}
  .section-divider span{padding:0 30px}
  .weekend-section{grid-template-columns:1fr}.weekend-side{height:500px;min-height:500px;grid-row:1}.weekend-main{padding:70px 24px}
  .event-row{grid-template-columns:120px 1fr;gap:14px}.event-image{width:120px;height:145px}.event-copy h3{font-size:20px}.event-copy p{font-size:16px}
  .taste-image{width:min(545px,90vw);height:420px}
  .rsvp-hero{margin:0 20px;height:500px}.rsvp-copy{padding-top:170px}.rsvp-copy h2{font-size:40px}
}

/* v4 — A TASTE OF BENICASSIM: three equal images in one horizontal row */
.taste-image-row{
  width:min(1050px, 90vw);
  margin:0 auto 68px;
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:0;
}
.taste-image-row img{
  width:100%;
  aspect-ratio:1 / 1;
  height:auto;
  object-fit:cover;
  display:block;
}

@media(max-width:1100px){
  .taste-image-row{
    width:100%;
    grid-template-columns:repeat(3, 1fr);
  }
}

/* v5 — separation between the three Benicassim gallery photos */
.taste-image-row{
  gap:18px;
}
.taste-image-row img{
  aspect-ratio:1 / 1;
  object-fit:cover;
}

/* v5 — move the password box further down */
#passwordForm{
  top:67% !important;
}

/* v6 — slightly wider separation and higher Taste of Benicassim section */
.taste-image-row{
  gap:28px;
}

.taste-section{
  transform:translateY(-55px);
  margin-bottom:-55px;
}

/* OUR STORY — reference-matched layout */
.story-page{
  background:#f7f4ed;
}
.story-page .header{
  position:absolute;
}
.story-page .nav a.active{
  border-bottom:1px solid currentColor;
  padding-bottom:6px;
}
.story-hero{
  height:720px;
  position:relative;
  overflow:hidden;
}
.story-hero-image{
  position:absolute;
  inset:0;
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
  opacity:.5;
}
.story-hero-copy{
  position:absolute;
  inset:0;
  z-index:2;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding-top:65px;
  color:#fff;
  text-align:center;
}
.story-hero-copy h1{
  margin:0 0 44px;
  font-family:"Cormorant Garamond",serif;
  font-weight:400;
  font-size:78px;
  line-height:.95;
  letter-spacing:-.02em;
}
.story-hero-copy p{
  margin:0;
  font-family:"Jost",sans-serif;
  font-size:27px;
  font-weight:500;
}
.story-hero-copy span{
  display:block;
  width:105px;
  height:1px;
  background:#fff;
  margin-top:65px;
}

.story-begin{
  min-height:640px;
  display:grid;
  grid-template-columns:1fr 1.12fr;
  gap:110px;
  align-items:start;
  padding:60px 16% 70px;
  background:#f7f4ed;
}
.story-begin-image{
  width:100%;
  max-width:430px;
  aspect-ratio:1/1.13;
  overflow:hidden;
}
.story-begin-image img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.story-begin-copy{
  padding-top:12px;
}
.story-begin h2,
.story-distance h2,
.story-chapter h2{
  font-family:"Cormorant Garamond",serif;
  font-weight:400;
  color:var(--text);
}
.story-begin h2{
  margin:0 0 100px;
  font-size:46px;
  line-height:1;
}
.story-body{
  max-width:650px;
}
.story-body p{
  margin:0 0 30px;
  font-family:"Jost",sans-serif;
  font-size:21px;
  line-height:1.6;
}

.story-distance{
  background:#e9e2d6;
  min-height:850px;
  padding:65px 4vw 72px;
  text-align:center;
  overflow:hidden;
}
.story-distance-copy{
  max-width:1050px;
  margin:0 auto;
}
.story-distance h2{
  font-size:45px;
  line-height:1;
  margin:0 0 70px;
}
.story-distance-copy p{
  max-width:1050px;
  margin:0 auto 28px;
  font-family:"Jost",sans-serif;
  font-size:21px;
  line-height:1.55;
}
.story-distance-copy p:last-child{
  max-width:970px;
}
.story-carousel{
  width:100%;
  max-width:1610px;
  margin:185px auto 0;
  overflow:hidden;
}
.story-carousel-track{
  display:flex;
  gap:0;
  transition:transform .45s ease;
  will-change:transform;
}
.story-slide{
  flex:0 0 20%;
  height:405px;
  overflow:hidden;
}
.story-slide img,
.story-slide .image-placeholder{
  width:100%;
  height:100%;
  object-fit:cover;
}
.story-carousel-controls{
  display:flex;
  justify-content:center;
  gap:14px;
  margin-top:42px;
}
.story-arrow{
  width:56px;
  height:56px;
  border:0;
  background:#fff;
  color:var(--text);
  font:400 28px/1 Arial,sans-serif;
  cursor:pointer;
}
.story-arrow:disabled{
  opacity:.45;
  cursor:default;
}

.story-chapter{
  min-height:690px;
  display:grid;
  grid-template-columns:1fr 1fr;
  background:#f7f4ed;
}
.story-chapter-copy{
  padding:105px 8.5% 90px 9%;
}
.story-chapter h2{
  font-size:46px;
  line-height:1;
  margin:0 0 105px;
}
.story-chapter-text{
  max-width:560px;
}
.story-chapter-text p{
  font-family:"Jost",sans-serif;
  font-size:21px;
  line-height:1.55;
  margin:0 0 34px;
}
.story-chapter-text p:last-child{
  margin-top:105px;
}
.story-chapter-image{
  min-height:690px;
  background-position:center;
  background-size:cover;
}

.story-page footer{
  background:#e9e2d6;
  min-height:345px;
  padding-top:54px;
}

@media(max-width:1100px){
  .story-begin{padding-left:9%;padding-right:9%;gap:60px}
  .story-carousel{max-width:92vw}
  .story-slide{height:350px}
}
@media(max-width:1100px){
  .story-hero{height:620px}
  .story-hero-copy h1{font-size:58px}
  .story-hero-copy p{font-size:21px}
  .story-begin{
    grid-template-columns:1fr;
    gap:45px;
    padding:65px 8vw;
  }
  .story-begin-image{max-width:900px;margin:0 auto}
  .story-begin-copy{padding-top:0}
  .story-begin h2{margin-bottom:55px;font-size:42px}
  .story-body p,.story-distance-copy p,.story-chapter-text p{font-size:18px}
  .story-distance{padding-top:60px}
  .story-distance h2{font-size:40px;margin-bottom:55px}
  .story-carousel{margin-top:100px}
  .story-slide{flex-basis:33.3333%;height:300px}
  .story-chapter{grid-template-columns:1fr}
  .story-chapter-image{min-height:500px;grid-row:1}
  .story-chapter-copy{padding:75px 8vw}
  .story-chapter h2{margin-bottom:60px}
  .story-chapter-text p:last-child{margin-top:70px}
}
@media(max-width:700px){
  .story-slide{flex-basis:100%;height:430px}
  .story-distance{padding-left:5vw;padding-right:5vw}
  .story-carousel{margin-top:80px}
  .story-carousel-controls{margin-top:25px}
}

/* v8 — 20-photo OUR STORY carousel */
.story-carousel-wrap{
  position:relative;
}
.story-carousel{
  position:relative;
}
.story-carousel .story-slide:first-child img{
  opacity:1;
}
.story-carousel-controls{
  position:absolute;
  top:50%;
  left:0;
  right:0;
  margin:0;
  transform:translateY(-50%);
  display:flex;
  justify-content:space-between;
  align-items:center;
  pointer-events:none;
  z-index:5;
}
.story-arrow{
  pointer-events:auto;
  width:52px;
  height:52px;
  border:0;
  background:rgba(255,255,255,.75);
  color:var(--text);
  cursor:pointer;
  font:400 27px/1 Arial,sans-serif;
  display:flex;
  align-items:center;
  justify-content:center;
}
.story-arrow:first-child{transform:translateX(-22px)}
.story-arrow:last-child{transform:translateX(22px)}
.story-arrow:disabled{
  opacity:.38;
  cursor:default;
}

/* Larger, higher FAQ footer link on all pages */
footer{
  position:relative;
}
footer a{
  display:inline-block;
  font-family:"Cormorant Garamond",serif;
  font-size:30px;
  font-weight:700;
  margin-top:-18px;
}
.story-page footer a{
  font-size:30px;
  font-weight:700;
  margin-top:-18px;
}

/* v8 refinement — controls sit just outside the actual carousel edges */
.story-carousel-wrap{
  width:100%;
  max-width:1610px;
  margin:90px auto 0;
  position:relative;
}
.story-carousel-wrap .story-carousel{
  width:100%;
  max-width:none;
  margin:0;
}
.story-distance > .story-carousel-wrap .story-carousel-controls{
  left:0;
  right:0;
}

/* FAQ sits closer to the date line */
footer div:nth-child(2){
  margin-bottom:35px;
}
footer a,
.story-page footer a{
  font-size:30px;
  font-weight:700;
  margin-top:0;
}

@media(max-width:1100px){
  .story-carousel-wrap{max-width:92vw}
}
@media(max-width:1100px){
  .story-carousel-wrap{max-width:92vw;margin-top:65px}
  .story-arrow:first-child{transform:translateX(-14px)}
  .story-arrow:last-child{transform:translateX(14px)}
}
@media(max-width:700px){
  .story-carousel-wrap{max-width:90vw;margin-top:50px}
}


/* v11 — seamless infinite carousel */
.story-carousel{overflow:hidden}
.story-carousel-track{will-change:transform}
.story-arrow{background:rgba(255,255,255,.25);opacity:.75}
.story-arrow:hover{opacity:.9}

/* Home RSVP button */
.rsvp-copy a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:150px;
  min-height:64px;
  padding:12px 34px;
  border:1px solid rgba(255,255,255,.9);
  border-radius:10px;
  background:transparent;
  color:#fff;
  font-size:34px;
  font-weight:700;
  line-height:1;
}

/* Benicàssim guide page */
.beni-page{background:#f7f4ed}
.beni-hero{height:520px;position:relative;overflow:hidden}
.beni-hero .beni-hero-image{position:absolute;inset:0;background:url("assets/benicassim-hero-couple-wide.png") center center/cover no-repeat}
.beni-hero:after{content:"";position:absolute;inset:0;background:rgba(38,38,35,.18)}
.beni-hero-copy{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;text-align:center;padding-top:65px}
.beni-hero-copy h1{font-family:"Cormorant Garamond",serif;font-weight:400;font-size:78px;line-height:.95;letter-spacing:-.02em;margin:0 0 60px}
.beni-hero-copy p,.beni-hero-location{font-family:"Jost",sans-serif;font-size:24px;font-weight:400}
.beni-hero-copy p{margin:0 0 58px}
.beni-hero-location{margin:0}
.beni-intro{display:grid;grid-template-columns:1fr 1.25fr;gap:80px;align-items:center;padding:75px 10% 65px}
.beni-intro-copy h2,.beni-section-title,.beni-eat h2,.beni-day h2{font-family:"Cormorant Garamond",serif;font-weight:400}
.beni-intro-copy h2{font-size:45px;line-height:1.08;margin:0 0 30px}
.beni-intro-copy p,.beni-card p,.beni-eat p,.beni-list{font-family:"Jost",sans-serif;font-size:17px;line-height:1.55}
.beni-intro-copy p{margin:0 0 20px;max-width:530px}
.beni-intro-image{height:340px;background:url("assets/benicassim-intro-user.png") center/cover no-repeat}
.beni-section-title{display:flex;align-items:center;gap:18px;max-width:1260px;margin:0 auto 28px;font-size:34px}
.beni-section-title:before,.beni-section-title:after{content:"";height:1px;background:#b9b1a5;flex:1}
.beni-things{padding:0 7% 55px}
.beni-columns{display:grid;grid-template-columns:1.2fr 1fr 1fr;max-width:1260px;margin:0 auto}
.beni-column{padding:0 32px;border-right:1px solid #cfc7bb;text-align:center}
.beni-column:first-child{padding-left:0}
.beni-column:last-child{border-right:0;padding-right:0}
.beni-icon{font-family:"Cormorant Garamond",serif;font-size:35px;height:45px}
.beni-column h3{font-family:"Jost",sans-serif;font-size:18px;font-weight:500;letter-spacing:.04em;margin:0 0 8px}
.beni-column>p{margin:0 auto 20px;max-width:330px}
.beni-mini-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;text-align:left}
.beni-mini-grid .mini{min-width:0}
.beni-mini-grid img{height:105px;object-fit:cover}
.beni-mini-grid .mini-title{font-family:"Jost",sans-serif;font-size:15px;margin-top:8px}
.beni-list{list-style:none;padding:0;margin:12px 0 0;text-align:left}
.beni-list li{display:grid;grid-template-columns:100px 1fr;gap:14px;margin-bottom:14px;align-items:start}
.beni-list img{width:100px;height:72px;object-fit:cover}
.beni-list strong{font-weight:500;display:block;margin-bottom:2px}
.beni-eat{background:#eee7dc;padding:55px 7% 48px}
.beni-eat-inner{max-width:1260px;margin:0 auto;display:grid;grid-template-columns:1.1fr repeat(3,1fr);gap:25px}
.beni-eat h2{font-size:38px;margin:0 0 18px}
.beni-eat p{margin:0;max-width:260px}
.beni-eat-col{border-left:1px solid #c8c0b5;padding-left:25px}
.beni-eat-col h3{font-family:"Jost",sans-serif;font-size:16px;font-weight:500;margin:0 0 12px}
.beni-eat-col ul{font-family:"Jost",sans-serif;font-size:15px;line-height:1.6;margin:0;padding-left:17px}
.beni-day{max-width:1180px;margin:35px auto 50px;border:1px solid #cfc7bb;padding:20px 28px 24px}
.beni-day h2{font-size:28px;margin:0 0 18px}
.beni-day-row{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;text-align:center}
.beni-day-step{font-family:"Jost",sans-serif;font-size:14px}
.beni-day-step .symbol{font-family:"Cormorant Garamond",serif;font-size:28px;display:block;margin-bottom:4px}
.beni-day-step strong{font-weight:500;display:block;margin-bottom:4px}
.beni-footer-hero{height:220px;position:relative;background:url("assets/placeholder.jpg") center/cover no-repeat;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.beni-footer-hero:before{content:"";position:absolute;inset:0;background:rgba(35,35,35,.32)}
.beni-footer-hero>*{position:relative;z-index:1}
.beni-footer-hero h2{font-family:"Cormorant Garamond",serif;font-size:35px;font-weight:400;margin:0 0 15px}
.beni-footer-hero a{font-family:"Jost",sans-serif;font-size:15px;border:1px solid rgba(255,255,255,.8);background:rgba(255,255,255,.75);color:var(--text);padding:12px 30px;border-radius:2px}

@media(max-width:1100px){
 .beni-hero{height:560px}.beni-hero-copy h1{font-size:58px}
 .beni-intro{grid-template-columns:1fr;padding:60px 8vw;gap:35px}.beni-intro-image{height:300px;order:2}
 .beni-columns{grid-template-columns:1fr;gap:35px}.beni-column{border-right:0;border-bottom:1px solid #cfc7bb;padding:0 0 35px}.beni-column:last-child{border-bottom:0}
 .beni-eat-inner{grid-template-columns:1fr 1fr}.beni-eat-col{border-left:0;padding-left:0}
 .beni-day-row{grid-template-columns:1fr 1fr 1fr}
}
@media (min-width:601px) and (max-width:1100px){
 .beni-eat-inner{grid-template-columns:1fr;}
 .beni-eat-col{border-left:0;padding-left:0;}
}

@media(max-width:600px){
 .rsvp-copy a{font-size:28px;min-width:130px;min-height:58px}
 .beni-mini-grid{grid-template-columns:1fr 1fr}.beni-list li{grid-template-columns:85px 1fr}.beni-list img{width:85px;height:65px}
 .beni-eat-inner{grid-template-columns:1fr}.beni-day-row{grid-template-columns:1fr 1fr}
}

.beni-page .nav a.active{border-bottom:1px solid currentColor;padding-bottom:6px}


/* Final footer + Benicàssim refinements */
footer{
  min-height:0 !important;
  padding:38px 20px 30px !important;
}
footer div:first-child{
  font-size:20px !important;
  margin:0 0 8px !important;
}
footer div:nth-child(2){
  font-size:14px !important;
  margin:0 0 14px !important;
}
footer a, .story-page footer a{
  font-size:20px !important;
  font-weight:700 !important;
  margin:0 !important;
}
.story-page footer{
  min-height:0 !important;
  padding:38px 20px 30px !important;
}

/* Home RSVP uses the same translucent square/button treatment as the travel CTA */
.home-hero + .welcome ~ .rsvp-hero .rsvp-copy a,
.rsvp-copy a{
  font-family:"Jost",sans-serif;
  font-size:15px;
  font-weight:500;
  min-width:0;
  min-height:0;
  padding:12px 30px;
  border:1px solid rgba(255,255,255,.8);
  border-radius:2px;
  background:rgba(255,255,255,.75);
  color:var(--text);
}

/* Benicàssim hero image at 50% opacity */
.beni-hero .beni-hero-image{opacity:.5}

@media(max-width:1100px){
  footer{padding:28px 16px 22px !important}
  .story-page footer{padding:28px 16px 22px !important}
}

/* Benicàssim content refinements */
.beni-icon{height:45px;display:flex;align-items:center;justify-content:center}
.beni-icon svg{width:46px;height:32px;fill:none;stroke:currentColor;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round}
.beni-mini-vertical{display:flex;flex-direction:column;gap:24px;text-align:left}
.beni-mini-vertical .mini{display:grid;grid-template-columns:120px 1fr;column-gap:16px;align-items:start}
.beni-mini-vertical img{width:120px;height:105px;object-fit:cover;grid-row:span 2}
.beni-mini-vertical .mini-title{font-family:"Jost",sans-serif;font-size:15px;letter-spacing:.03em;margin:0 0 4px}
.beni-mini-vertical .mini p{font-family:"Jost",sans-serif;font-size:14px;line-height:1.45;margin:0;max-width:none}
.beni-list em{display:block;font-style:normal;font-size:13px;margin-top:5px;opacity:.82}
.beni-eat-col a{color:inherit;text-decoration:none;border-bottom:1px solid rgba(45,43,40,.25);transition:border-color .2s ease}
.beni-eat-col a:hover{border-bottom-color:currentColor}

@media(max-width:600px){
  .beni-mini-vertical .mini{grid-template-columns:100px 1fr}
  .beni-mini-vertical img{width:100px;height:90px}
}

/* Benicàssim category cards share the Beaches typography and sizing */
.beni-column h3{font-family:"Jost",sans-serif;font-size:18px;font-weight:500;letter-spacing:.04em;margin:0 0 8px}
.beni-column>p{font-family:"Jost",sans-serif;font-size:17px;line-height:1.55;margin:0 auto 20px;max-width:330px}
.beni-mini-vertical .mini-title{font-family:"Jost",sans-serif;font-size:15px;letter-spacing:.03em;margin:0 0 4px}
.beni-mini-vertical .mini p{font-family:"Jost",sans-serif;font-size:14px;line-height:1.45;margin:0;max-width:none}
.beni-mini-vertical .mini p em{display:block;font-style:normal;font-size:13px;margin-top:5px;opacity:.82}

/* v15 — balanced lead-copy lengths for Beaches, Mountains and Nearby Towns */
.beni-category-intro { max-width: 760px; }

/* v16 — equal-width category sections and aligned first images */
.beni-category,
.ben-category,
.category-section {
  width: min(1100px, calc(100% - 160px));
  margin-left: auto;
  margin-right: auto;
}

.beni-category-intro,
.ben-category-intro,
.category-intro {
  width: 100%;
  max-width: none;
}

.beni-category-grid,
.ben-category-grid,
.category-grid {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr;
}

.beni-category-grid .item,
.ben-category-grid .item,
.category-grid .item {
  width: 100%;
}

.beni-category-grid .item:first-child img,
.ben-category-grid .item:first-child img,
.category-grid .item:first-child img {
  margin-left: 0;
}

/* v17 — unified Benicàssim category layout */
.beni-categories {
  width: min(1100px, calc(100% - 160px));
  margin-left: auto;
  margin-right: auto;
}
.beni-category {
  width: 100%;
  max-width: 1100px;
  margin-left: auto;
  margin-right: auto;
}
.beni-category-intro {
  width: 100%;
  max-width: 760px;
  min-height: 92px;
}
.beni-category .category-items {
  width: 100%;
}
.beni-category .category-item {
  width: 100%;
}
.beni-category .category-item:first-child,
.beni-category .category-item:first-child img {
  margin-left: 0;
}

/* Keep the three section headings/lead blocks on one common measure. */
.beni-category h2,
.beni-category .section-title {
  width: 100%;
}
.beni-category p.category-intro,
.beni-category .intro,
.beni-category .description {
  max-width: 760px;
  min-height: 92px;
}

/* Align the first image of each section to the same left edge. */
.beni-category .items,
.beni-category .cards,
.beni-category .places {
  width: 100%;
  margin-left: 0;
}
.beni-category .items > *,
.beni-category .cards > *,
.beni-category .places > * {
  margin-left: 0;
}

@media (max-width: 1100px) {
  .beni-categories,
  .beni-category {
    width: calc(100% - 48px);
  }
  .beni-category-intro,
  .beni-category p.category-intro,
  .beni-category .intro,
  .beni-category .description {
    max-width: 100%;
    min-height: 0;
  }
}

/* v18 — Beaches / Mountains / Nearby Towns: one shared horizontal grid */
.beni-category,
.beaches,
.mountains,
.nearby-towns {
  width: min(1180px, calc(100% - 120px)) !important;
  max-width: 1180px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Identical text measure and reserved intro height in all three sections. */
.beni-category-intro,
.beaches > p,
.mountains > p,
.nearby-towns > p,
.beaches .category-intro,
.mountains .category-intro,
.nearby-towns .category-intro {
  width: 760px !important;
  max-width: 760px !important;
  min-height: 96px !important;
  margin-left: 0 !important;
  margin-right: auto !important;
}

/* The first image in every category starts at the exact same x-position.
   The card rows themselves share one width and one grid definition. */
.beaches .category-items,
.mountains .category-items,
.nearby-towns .category-items,
.beaches .items,
.mountains .items,
.nearby-towns .items,
.beaches .cards,
.mountains .cards,
.nearby-towns .cards,
.beaches .places,
.mountains .places,
.nearby-towns .places {
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
}

/* Horizontal alignment: every section's first photo uses the same left edge,
   and all first photos occupy the same column width. */
.beaches .category-item:first-child,
.mountains .category-item:first-child,
.nearby-towns .category-item:first-child,
.beaches .item:first-child,
.mountains .item:first-child,
.nearby-towns .item:first-child,
.beaches .card:first-child,
.mountains .card:first-child,
.nearby-towns .card:first-child {
  width: 100% !important;
  margin-left: 0 !important;
}

/* Keep image boxes equal wherever the existing markup exposes card images. */
.beaches img,
.mountains img,
.nearby-towns img {
  display: block;
}

/* Do not let the common desktop alignment affect mobile. */
@media (max-width: 1100px) {
  .beni-category,
  .beaches,
  .mountains,
  .nearby-towns {
    width: calc(100% - 48px) !important;
  }
  .beni-category-intro,
  .beaches > p,
  .mountains > p,
  .nearby-towns > p,
  .beaches .category-intro,
  .mountains .category-intro,
  .nearby-towns .category-intro {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 0 !important;
  }
}

/* v19 — exact three-column alignment for Things to Do */
@media (min-width: 1101px) {
  .beni-things { padding-left: 7%; padding-right: 7%; }
  .beni-columns {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 0 !important;
    max-width: 1260px !important;
    width: 100% !important;
    margin: 0 auto !important;
    align-items: start !important;
  }
  .beni-column {
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    padding: 0 32px !important;
    border-right: 1px solid #cfc7bb !important;
    text-align: center !important;
  }
  .beni-column:first-child { padding-left: 0 !important; }
  .beni-column:last-child { padding-right: 0 !important; border-right: 0 !important; }

  /* Identical paragraph measure and height: this makes the first image in
     all three columns begin on exactly the same horizontal line. */
  .beni-column > p {
    width: 100% !important;
    max-width: none !important;
    height: 176px !important;
    min-height: 176px !important;
    margin: 0 0 20px !important;
    box-sizing: border-box !important;
  }

  /* Identical first-image box and left alignment inside each column. */
  .beni-mini-vertical {
    width: 100% !important;
    margin: 0 !important;
    align-items: stretch !important;
  }
  .beni-mini-vertical .mini {
    width: 100% !important;
    box-sizing: border-box !important;
    grid-template-columns: 120px minmax(0, 1fr) !important;
    column-gap: 16px !important;
  }
  .beni-mini-vertical .mini:first-child {
    margin-left: 0 !important;
  }
  .beni-mini-vertical .mini:first-child img {
    width: 120px !important;
    height: 105px !important;
    object-fit: cover !important;
  }
}

/* v22 — show the full Benicàssim header photograph, including both bodies */
.beni-hero,
.benicassim-hero,
.beni-header,
.benicassim-header {
  background-size: 100% 100% !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}
.beni-hero img,
.benicassim-hero img,
.beni-header img,
.benicassim-header img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center bottom !important;
}

/* v23 — taller full-height hero treatment across photo-led pages */
.beni-hero,
.story-hero,
.home-hero {
  height: 858px !important;
}

/* Keep the complete Benicàssim photograph visible, including both full bodies. */
.beni-hero .beni-hero-image {
  background-size: 100% 100% !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  opacity: .5 !important;
}

@media (max-width: 1100px) {
  .beni-hero,
  .story-hero,
  .home-hero {
    height: 720px !important;
  }
}

/* v24 — preserve the Benicàssim hero photograph's natural aspect ratio.
   The source has been expanded horizontally with sky/water so the full
   couple remains visible without horizontal stretching. */
.beni-hero .beni-hero-image {
  background-image: url("assets/benicassim-hero-wide.png") !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  opacity: .5 !important;
}

/* Bring the A TASTE OF BENICASSIM section closer to the preceding content. */
.taste {
  padding-top: 52px !important;
}

@media (max-width: 1100px) {
  .beni-hero .beni-hero-image {
    background-size: cover !important;
    background-position: center center !important;
  }
  .taste {
    padding-top: 40px !important;
  }
}


/* v26 — keep the Benicàssim couple photograph at its natural proportions.
   The side background is extended in the image itself, so the couple is never
   horizontally stretched while the full-body framing and hero height remain. */
.beni-hero .beni-hero-image {
  background-image: url("assets/benicassim-hero-natural-wide.png") !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  opacity: .5 !important;
}


/* v27 — preserve the original Benicàssim couple photo without horizontal distortion.
   The source image remains pixel-proportional; only the surrounding sides are extended. */
.beni-hero .beni-hero-image {
  background-image: url("assets/benicassim-hero-original-extended.png") !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  opacity: .5 !important;
}

/* Keep all photo-led page headers at the same height. */
.home-hero, .story-hero, .beni-hero {
  height: 858px !important;
}

@media (max-width: 1100px) {
  .home-hero, .story-hero, .beni-hero { height: 720px !important; }
}


/* v27 — preserve the original Benicàssim couple photo without horizontal distortion.
   The original photograph is centered; only the side background is extended. */
.beni-hero .beni-hero-image {
  background-image: url("assets/benicassim-hero-original-extended.png") !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  opacity: .5 !important;
}
.home-hero, .story-hero, .beni-hero { height: 858px !important; }
@media (max-width: 1100px) {
  .home-hero, .story-hero, .beni-hero { height: 720px !important; }
}

/* v28 — language selector + seamless Benicàssim hero */
.language-switcher{position:relative;display:inline-block}
.language-toggle{display:flex;align-items:center;gap:6px;border:0;background:transparent;color:inherit;font:inherit;font-family:"Jost",sans-serif;font-size:inherit;padding:0;cursor:pointer;white-space:nowrap}
.language-chevron{font-size:.85em;line-height:1;position:relative;top:-1px}
.language-menu{position:absolute;right:0;top:calc(100% + 10px);min-width:105px;background:rgba(250,247,241,.98);border:1px solid rgba(46,44,42,.18);padding:6px;z-index:50;box-shadow:0 8px 24px rgba(0,0,0,.08)}
.language-menu[hidden]{display:none}
.language-menu button{display:block;width:100%;border:0;background:transparent;text-align:left;padding:7px 9px;font-family:"Jost",sans-serif;font-size:14px;color:var(--text);cursor:pointer}
.language-menu button:hover{background:rgba(46,44,42,.06)}
.lock-language{position:absolute;z-index:5;right:38px;top:32px;color:#fff}
.lock-language .language-toggle{font-size:18px}
.beni-hero .beni-hero-image{background-image:url("assets/benicassim-hero-seamless.png") !important;background-size:cover !important;background-position:center center !important;}

/* v33 — updated OUR STORY hero + consistent 50% photo transparency */
.story-hero .story-hero-image {
  background-image: url("assets/our-story-hero-arch.png") !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  opacity: .5 !important;
}

/* All main photo-led page headers use the same height and 50% image opacity. */
.home-hero .hero-placeholder,
.story-hero .story-hero-image,
.beni-hero .beni-hero-image {
  opacity: .5 !important;
}

.home-hero,
.story-hero,
.beni-hero {
  height: 858px !important;
}

@media (max-width: 1100px) {
  .home-hero,
  .story-hero,
  .beni-hero {
    height: 720px !important;
  }
}

/* v35 — mobile navigation: keep the header clean and move all navigation into a menu. */
.mobile-menu-button,
.mobile-menu { display:none; }

@media (max-width: 1100px) {
  .header {
    position:absolute;
    top:0;
    left:0;
    right:0;
    z-index:100;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:14px;
    padding:24px 22px 0 !important;
  }
  .header-brand {
    order:1;
    margin:0 auto;
    font-size:27px !important;
    line-height:1;
  }
  .header .nav-left,
  .header .nav-right {
    display:none !important;
  }
  .mobile-menu-button {
    display:flex !important;
    order:3;
    width:34px;
    height:34px;
    align-items:center;
    justify-content:center;
    padding:0;
    border:0;
    background:transparent;
    color:inherit;
    font:400 25px/1 Arial,sans-serif;
    cursor:pointer;
  }
  .header::before {
    content:'';
    order:0;
    width:34px;
    height:34px;
    flex:0 0 34px;
  }
  .header .language-switcher {
    order:2;
    margin-left:auto;
    margin-right:0;
    flex:0 0 auto;
  }
  .header .language-toggle {
    font-size:14px !important;
    gap:2px !important;
  }
  .header .language-chevron { display:none; }
  .header .language-toggle [data-language-current]::after { content:''; }

  .mobile-menu {
    position:fixed;
    display:block;
    top:0;
    left:0;
    right:0;
    min-height:100vh;
    padding:105px 30px 38px;
    background:rgba(250,247,241,.98);
    color:var(--text);
    z-index:99;
    box-shadow:0 12px 35px rgba(0,0,0,.08);
  }
  .mobile-menu-close {
    position:absolute;
    top:20px;
    right:22px;
    width:34px;
    height:34px;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:0;
    border:0;
    background:transparent;
    color:var(--text);
    font:300 32px/1 Arial,sans-serif;
    cursor:pointer;
  }
  .mobile-menu[hidden] { display:none !important; }
  .mobile-menu nav {
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:24px;
    text-align:center;
  }
  .mobile-menu nav a {
    font-family:"Jost",sans-serif;
    font-size:18px;
    letter-spacing:.02em;
  }
  .mobile-menu-language {
    display:flex;
    justify-content:center;
    align-items:center;
    gap:18px;
    margin-top:42px;
    padding-top:25px;
    border-top:1px solid rgba(46,44,42,.18);
    font-family:"Jost",sans-serif;
    font-size:14px;
  }
  .mobile-menu-language span { margin-right:8px; }
  .mobile-menu-language button {
    border:0;
    background:transparent;
    padding:3px;
    font:inherit;
    cursor:pointer;
  }

  /* Center all text-navigation links/buttons in the Home page. */
  .welcome .section-divider,
  .see-weekend {
    width:100%;
    justify-content:center;
    margin-left:auto;
    margin-right:auto;
  }
  .welcome .section-divider a,
  .welcome .section-divider span,
  .see-weekend a,
  .see-weekend span,
  .taste .text-link {
    display:block;
    width:auto;
    max-width:100%;
    padding-left:14px !important;
    padding-right:14px !important;
    text-align:center;
    white-space:normal;
    margin-left:auto;
    margin-right:auto;
  }
  .taste .text-link { width:fit-content; }
}

/* v35b — compact language label and truly centered mobile brand. */
@media (max-width: 1100px) {
  .header-brand {
    position:absolute !important;
    left:50% !important;
    transform:translateX(-50%) !important;
    margin:0 !important;
  }
  .header .language-switcher { margin-left:auto !important; margin-right:48px !important; }
  .header .language-toggle [data-language-current] {
    font-size:0 !important;
  }
  .header .language-toggle [data-language-current]::after {
    font-family:"Jost",sans-serif;
    font-size:14px;
    content:"EN";
  }
  body.lang-es .header .language-toggle [data-language-current]::after { content:"ES"; }
}


/* v37 — slightly smaller Benicàssim intro heading on mobile so it fits comfortably */
@media (max-width: 600px) {
  .beni-intro-copy h2 {
    font-size: 34px !important;
    line-height: 1.05 !important;
  }
}

/* v44 — Travel spacing, accent heading, and footer refinements */
.travel-page .travel-intro{
  padding-top: 105px !important;
  margin-bottom: 105px !important;
}
.travel-page .travel-intro p{
  line-height: 1.35 !important;
  margin: 0 !important;
}
.travel-page .flight-heading h2{
  color: var(--olive) !important;
}
.travel-page .flights-section{
  margin-bottom: 105px !important;
}
.travel-page .hotels-block{
  margin-bottom: 0 !important;
}
.travel-page + footer{
  margin-top: 0;
}
@media(max-width:1100px){
  .travel-page .travel-intro{padding-top:95px !important;margin-bottom:72px !important}
  .travel-page .flights-section{margin-bottom:78px !important}
}

/* v46 — Benicàssim imagery and Travel section background */
.beni-intro-image{
  background-image:url("assets/benicassim-footer-night.jpg") !important;
  background-position:center center !important;
  background-size:cover !important;
}
.beni-footer-hero{
  background-image:url("assets/benicassim-intro-user.jpg") !important;
  background-position:center center !important;
  background-size:cover !important;
}
/* Match the reference palette: the complete travel/airport block is the darker cream. */
.travel-page .flight-grid{
  background:transparent !important;
  color:#2e2c2a !important;
  padding:0 !important;
}
.travel-page .flight-heading h2{
  color:#2e2c2a !important;
}
/* Full-width color field from the top of HOW TO GET THERE through the airport cards,
   ending immediately before WHERE TO STAY. */
.travel-page .flights-section{
  background:#e9e2d6 !important;
  width:100vw;
  margin-left:calc(50% - 50vw);
  padding:0 7vw 105px !important;
  box-sizing:border-box;
}
.travel-page .flights-section .flight-grid{
  max-width:1180px;
  margin:0 auto;
}
.travel-page .flights-section .airport-cards{
  max-width:1180px;
  margin-left:auto;
  margin-right:auto;
}
.travel-page .hotels-block{
  background:#f7f4ed !important;
}
@media(max-width:1100px){
  .travel-page .flights-section{
    padding:0 6vw 78px !important;
  }
}
@media(max-width:1100px){
  .travel-page .flights-section{
    padding:0 6vw 60px !important;
  }
}
@media(max-width:1100px){
  .travel-page .travel-intro{padding-top:95px !important;margin-bottom:72px !important}
}
@media(max-width:1100px){
  .travel-page .flights-section{margin-bottom:78px !important}
}

/* Keep the airport/map area readable inside the reference-colored section. */
.travel-page .flight-grid{
  background:#dfe3d2 !important;
  color:#2e2c2a !important;
  padding:64px 58px !important;
}
.travel-page .flight-heading h2{
  color:#2e2c2a !important;
}
@media(max-width:1100px){
  .travel-page .flight-grid{padding:48px 28px !important}
}
@media(max-width:1100px){
  .travel-page .flight-grid{padding:38px 20px !important}
}


/* v48 — Travel palette: alternate the existing cream tones only; no green/sage. */
.travel-page{
  background:#f7f4ed !important;
  color:#172b4d !important;
}

/* HOW TO GET THERE — darker cream band */
.travel-page .flights-section{
  background:#e9e2d6 !important;
  color:#172b4d !important;
  width:100vw !important;
  margin-left:calc(50% - 50vw) !important;
  box-sizing:border-box !important;
}

/* Keep the airport cards within the same darker band. */
.travel-page .airport-card{
  background:transparent !important;
}

/* WHERE TO STAY — return to the lighter cream */
.travel-page .hotels-block{
  background:#f7f4ed !important;
  color:#172b4d !important;
  width:100vw !important;
  max-width:none !important;
  margin-left:calc(50% - 50vw) !important;
  box-sizing:border-box !important;
  padding:70px 7vw 72px !important;
}

/* Center the contents inside the full-width WHERE TO STAY band. */
.travel-page .hotels-block > *{
  max-width:900px;
  margin-left:auto;
  margin-right:auto;
}

/* Footer alternates back to the darker cream. */
.travel-page + footer,
body:has(.travel-page) footer{
  background:#e9e2d6 !important;
  color:#172b4d !important;
}

/* Make sure no previous sage block survives through more specific rules. */
.travel-page .flights-section,
.travel-page .hotels-block{
  background-image:none !important;
}

@media(max-width:1100px){
  .travel-page .hotels-block{
    padding:58px 6vw 62px !important;
  }
}

/* v49 — final Travel palette/layout refinements */

/* Remove the sage-green panel entirely. Travel uses only the two warm creams. */
.travel-page .flight-grid{
  background:transparent !important;
}

/* HOW TO GET HERE and WHERE TO STAY use the same elegant heading size.
   The former is deliberately small enough to remain on one line. */
.travel-page .travel-section-head h2,
.travel-page .hotels-block h2{
  font-size:50px !important;
  line-height:1.05 !important;
  letter-spacing:.06em !important;
}

/* Keep the heading on one line on desktop. */
.travel-page .flight-heading h2{
  white-space:nowrap !important;
}

/* Give the two welcome lines a little more breathing room. */
.travel-page .travel-intro p{
  line-height:1.25 !important;
}
.travel-page .travel-intro p span{
  display:block !important;
}
.travel-page .travel-intro p span + br{
  display:none !important;
}
.travel-page .travel-intro p span:first-child{
  margin-bottom:11px !important;
}

/* Benicàssim page footer: solid darker cream, no photo/overlay. */
.beni-footer-hero{
  background:#e9e2d6 !important;
  color:#172b4d !important;
}
.beni-footer-hero:before{
  display:none !important;
}
.beni-footer-hero h2{
  color:#172b4d !important;
}
.beni-footer-hero a{
  background:rgba(255,255,255,.75) !important;
  color:#172b4d !important;
  border-color:rgba(23,43,77,.45) !important;
}

@media(max-width:1100px){
  .travel-page .travel-section-head h2,
  .travel-page .hotels-block h2{
    font-size:42px !important;
  }
  .travel-page .flight-heading h2{
    white-space:normal !important;
  }
}
@media(max-width:1100px){
  .travel-page .travel-section-head h2,
  .travel-page .hotels-block h2{
    font-size:36px !important;
  }
}

/* v50 — Benicàssim page's actual site footer (Laura & John / Benicàssim · July 2027 / FAQ). */
body.beni-page > footer{
  background:#e9e2d6 !important;
  color:#172b4d !important;
}
body.beni-page > footer a{
  color:#172b4d !important;
}

/* v51 — restore the Benicàssim "SEE YOU BY THE SEA" photo block as in v48. */
.beni-footer-hero{
  background-image:url("assets/benicassim-intro-user.jpg") !important;
  background-position:center center !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
  color:#fff !important;
}
.beni-footer-hero:before{
  display:block !important;
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  background:rgba(35,35,35,.32) !important;
}
.beni-footer-hero h2{
  color:#fff !important;
}
.beni-footer-hero a{
  color:var(--text) !important;
  background:rgba(255,255,255,.75) !important;
  border:1px solid rgba(255,255,255,.8) !important;
}

/* Keep the actual site footer (Laura & John / Benicàssim · July 2027 / FAQ)
   in the darker cream requested previously. */
body.beni-page > footer{
  background:#e9e2d6 !important;
  color:#172b4d !important;
}
body.beni-page > footer a{
  color:#172b4d !important;
}

/* v52 — Travel typography/position refinement */
.travel-page .flight-heading h2{
  margin-top:22px !important;
}
.travel-page .flight-copy{
  font-size:22px !important;
  line-height:1.65 !important;
}
@media(max-width:1100px){
  .travel-page .flight-heading h2{
    margin-top:12px !important;
  }
  .travel-page .flight-copy{
    font-size:21px !important;
  }
}
@media(max-width:1100px){
  .travel-page .flight-copy{
    font-size:20px !important;
  }
}

/* v53 — Travel copy, FAQ navigation, and hotel-note line break */
.travel-page .hotels-note span{
  display:inline;
}
.travel-page .hotels-note br{
  display:block;
  content:"";
  margin-bottom:4px;
}
.nav-right > a[href="faq.html"]{
  margin-left:2px;
}

/* v55 — OPTION B
   Cormorant Garamond: headings / display typography
   Jost: everything functional, navigation, body copy, labels and controls
*/
:root{
  --text:#4a4037;
  --dark-brown:#4a4037;
  --light-cream:#f8f1e5;
}

/* Base: functional text is Jost */
html, body{
  color:var(--dark-brown);
  font-family:"Jost",sans-serif;
}
button, input, select, textarea{
  font-family:"Jost",sans-serif;
}

/* Display / heading typography */
h1, h2, h3, h4, h5, h6,
.hero-copy h1,
.welcome h2,
.weekend-section h2,
.taste h2,
.rsvp-copy h2,
.story-hero-copy h1,
.story-begin h2,
.story-distance h2,
.story-chapter h2,
.beni-hero-copy h1,
.beni-intro-copy h2,
.beni-section-title,
.beni-eat h2,
.beni-day h2,
.beni-column h3,
.beni-eat-col h3,
.beni-footer-hero h2,
.coming-inner h1,
.travel-section-head h2,
.airport-card h3{
  font-family:"Cormorant Garamond",serif;
  color:var(--dark-brown);
}

/* Everything functional / supporting stays Jost */
.header,
.header .nav,
.header .nav a,
.header-brand,
.language-toggle,
.language-menu,
.language-menu button,
.hero-date,
.hero-location,
p, li,
.welcome p,
.event-copy p,
.event-copy a,
.taste p,
.text-link,
.story-hero-copy p,
.story-body p,
.story-distance-copy p,
.story-chapter-text p,
.story-carousel-controls,
.story-arrow,
.beni-hero-copy p,
.beni-intro-copy p,
.beni-card p,
.beni-eat p,
.beni-list,
.beni-mini-grid,
.beni-mini-vertical,
.beni-mini-vertical .mini-title,
.beni-mini-vertical .mini p,
.beni-eat-col ul,
.beni-column > p,
.beni-footer-hero a,
.coming-inner p,
.coming-inner a,
.travel-intro,
.flight-copy,
.airport-card p,
.airport-card a,
.hotels-note,
.hotels-coming,
footer,
footer a{
  font-family:"Jost",sans-serif;
}

/* Dark/image backgrounds: light cream text */
.lock-content,
.lock-content h1,
.lock-content p,
#password,
#password::placeholder,
#error,
.lock-language,
.story-hero-copy,
.story-hero-copy h1,
.story-hero-copy p,
.beni-hero-copy,
.beni-hero-copy h1,
.beni-hero-copy p,
.beni-footer-hero,
.beni-footer-hero h2,
.story-page .header,
.beni-page .header,
.story-page .header .nav a,
.beni-page .header .nav a,
.story-page .header .header-brand,
.beni-page .header .header-brand,
.story-page .header .language-toggle,
.beni-page .header .language-toggle{
  color:var(--light-cream);
}

/* Keep headings on dark/image areas in Cormorant */
.story-hero-copy h1,
.beni-hero-copy h1,
.beni-footer-hero h2,
.lock-content h1{
  font-family:"Cormorant Garamond",serif;
  color:var(--light-cream);
}

/* Functional controls/links use the dark greyish-brown system color */
.header .nav a,
.header-brand,
.language-toggle,
.language-menu,
.language-menu button,
.text-link,
.story-arrow,
.beni-footer-hero a,
.coming-inner a,
.travel-page,
.travel-page a,
.travel-page .flight-copy,
.travel-page .airport-card,
.travel-page .hotels-note,
.travel-page .hotels-coming,
footer,
footer a{
  color:var(--dark-brown);
}

/* Travel: headings are Cormorant; all functional copy/UI is Jost */
.travel-page .travel-section-head h2,
.travel-page .airport-card h3{
  font-family:"Cormorant Garamond",serif !important;
  color:var(--dark-brown) !important;
}
.travel-page .travel-intro p,
.travel-page .flight-copy,
.travel-page .airport-card p,
.travel-page .airport-card a,
.travel-page .hotels-note,
.travel-page .hotels-coming{
  font-family:"Jost",sans-serif !important;
  color:var(--dark-brown) !important;
}

/* Preserve the cream-only Travel palette; no sage/green text */
.travel-page{
  background:#f7f4ed !important;
}
.travel-page .flights-section{
  background:#e9e2d6 !important;
}
.travel-page .hotels-block{
  background:#f7f4ed !important;
}
body:has(.travel-page) footer{
  background:#e9e2d6 !important;
  color:var(--dark-brown) !important;
}

/* Light sections consistently use dark greyish-brown */
body{
  color:var(--dark-brown);
}

/* v56 — Cormorant-led typography + consistent active navigation */
:root{
  --dark-brown:#4a4037;
  --light-cream:#f8f1e5;
}

body,
body p,
body li,
body a,
body button,
body input,
body select,
body textarea{
  font-family:"Cormorant Garamond",serif;
  color:var(--dark-brown);
}

/* Cormorant throughout the visual language */
h1,h2,h3,h4,h5,h6,
.header,
.header a,
.header-brand,
.header .nav,
.header .nav a,
.language-toggle,
.language-menu,
.language-menu button,
.hero-date,
.hero-location,
.hero-copy,
.welcome,
.event-copy,
.taste,
.text-link,
.rsvp-copy,
.story-hero-copy,
.story-body,
.story-distance,
.story-chapter,
.beni-hero-copy,
.beni-intro-copy,
.beni-card,
.beni-eat,
.beni-day,
.beni-column,
.beni-footer-hero,
.travel-page,
.coming-inner,
footer{
  font-family:"Cormorant Garamond",serif;
}

/* Top-left LAURA & JOHN brand */
.header-brand{
  font-family:"Cormorant Garamond",serif !important;
  letter-spacing:.16em;
}

/* Footer couple name: uppercase + Cormorant */
footer div:first-child{
  font-family:"Cormorant Garamond",serif !important;
  text-transform:uppercase !important;
  letter-spacing:.18em;
}

/* Details / notes keep the elegant italic Cormorant treatment */
.details,
.details p,
.notes,
.notes p,
[class*="note"],
[class*="details"]{
  font-family:"Cormorant Garamond",serif;
}

/* Active navigation underline: every page gets the same treatment.
   Existing active states are preserved and normalized visually. */
.header .nav a{
  position:relative;
  display:inline-block;
  text-decoration:none;
}
.header .nav a::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-7px;
  height:1px;
  background:currentColor;
  transform:scaleX(0);
  transform-origin:center;
  transition:transform .22s ease;
}
.header .nav a:hover::after,
.header .nav a.active::after,
.header .nav a[aria-current="page"]::after,
.header .nav a.current::after{
  transform:scaleX(1);
}

/* Do not show an active underline on the language control. */
.header .nav .language-toggle::after,
.header .language-toggle::after{
  display:none !important;
}

/* Keep the light-on-image treatment consistent */
.story-page .header,
.beni-page .header{
  color:var(--light-cream);
}
.story-page .header .nav a,
.beni-page .header .nav a,
.story-page .header .header-brand,
.beni-page .header .header-brand,
.story-page .header .language-toggle,
.beni-page .header .language-toggle{
  color:var(--light-cream);
}

.lock-content,
.lock-content h1,
.lock-content p,
.story-hero-copy,
.story-hero-copy h1,
.story-hero-copy p,
.beni-hero-copy,
.beni-hero-copy h1,
.beni-hero-copy p,
.beni-footer-hero,
.beni-footer-hero h2{
  color:var(--light-cream);
}

/* v57 — destination image alignment + one-line active navigation */
.beni-column .mini,
.beni-column .beni-mini,
.beni-mini-grid .mini,
.beni-mini-vertical .mini{
  align-items:flex-start;
}

/* Images align with the destination title/text row. */
.beni-column .mini img,
.beni-column .beni-mini img,
.beni-mini-grid .mini img,
.beni-mini-vertical .mini img{
  align-self:flex-start;
  margin-top:0.25em;
}

/* One persistent active-nav underline for every section. */
.header .nav a{
  position:relative;
  display:inline-block;
  text-decoration:none !important;
  border-bottom:none !important;
  box-shadow:none !important;
}
.header .nav a::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-7px;
  height:1px;
  background:currentColor;
  opacity:0;
  transform:none;
  transition:opacity .18s ease;
}
.header .nav a:hover::after,
.header .nav a.active::after,
.header .nav a[aria-current="page"]::after,
.header .nav a.current::after{
  opacity:1;
}

/* Disable any legacy underline/pseudo-element implementations so the
   selected item displays exactly one line. */
.header .nav a::before{
  display:none !important;
}
.header .nav a.active,
.header .nav a[aria-current="page"],
.header .nav a.current{
  text-decoration:none !important;
  border-bottom:none !important;
  box-shadow:none !important;
}

/* Language selector is not a section and never gets the active line. */
.header .language-toggle::after,
.header .nav .language-toggle::after{
  display:none !important;
}

/* v58 — final header normalization */
.header .nav,
.header .nav a,
.header .nav span,
.header .language-toggle,
.header-brand{
  font-family:"Cormorant Garamond",serif !important;
  font-size:20px !important;
  font-weight:500 !important;
  line-height:1 !important;
  letter-spacing:.02em !important;
  text-transform:none !important;
}

/* Brand is intentionally larger but identical in family/weight. */
.header .header-brand{
  font-size:37px !important;
  font-weight:500 !important;
  letter-spacing:.16em !important;
}

/* Language selector follows the exact same header typography. */
.header .language-toggle{
  font-size:20px !important;
  font-weight:500 !important;
}

/* Consistent default header color on light pages. */
.header,
.header .nav a,
.header-brand,
.header .language-toggle{
  color:#4a4037 !important;
}

/* Consistent light header on photographic/dark hero pages. */
.story-page .header,
.story-page .header .nav a,
.story-page .header .header-brand,
.story-page .header .language-toggle,
.beni-page .header,
.beni-page .header .nav a,
.beni-page .header .header-brand,
.beni-page .header .language-toggle{
  color:#f8f1e5 !important;
}

/* Exactly one persistent active line — no legacy second line/padding. */
.header .nav a{
  position:relative !important;
  display:inline-block !important;
  padding-bottom:0 !important;
  border-bottom:0 !important;
  text-decoration:none !important;
  box-shadow:none !important;
}
.header .nav a::before{
  content:none !important;
  display:none !important;
}
.header .nav a::after{
  content:"" !important;
  position:absolute !important;
  left:0 !important;
  right:0 !important;
  bottom:-8px !important;
  width:auto !important;
  height:1px !important;
  background:currentColor !important;
  opacity:0 !important;
  transform:none !important;
  transition:opacity .18s ease !important;
}
.header .nav a:hover::after,
.header .nav a.active::after,
.header .nav a[aria-current="page"]::after,
.header .nav a.current::after{
  opacity:1 !important;
}

/* Language control is not a page section. */
.header .language-toggle::after{
  content:none !important;
}

/* Mobile header uses the same type family/weight, scaled only by the
   existing responsive layout. */
@media (max-width:1100px){
  .header .nav,
  .header .nav a,
  .header .nav span,
  .header .language-toggle{
    font-size:17px !important;
    font-weight:500 !important;
  }
  .header .header-brand{
    font-size:27px !important;
    font-weight:500 !important;
  }
}

/* v64 — hero-only correction; all lower Our Story content remains unchanged */
.story-hero-copy{
  justify-content:center !important;
  padding-top:70px !important;
  padding-bottom:0 !important;
}
.story-hero-copy h1{
  margin:0 0 60px !important;
  font-family:"Cormorant Garamond",serif !important;
  font-weight:400 !important;
  font-size:76px !important;
  line-height:1 !important;
  letter-spacing:-.015em !important;
  color:#f8f1e5 !important;
}
.story-hero-copy .story-hero-subtitle{
  font-family:"Cormorant Garamond",serif !important;
  font-size:24px !important;
  font-weight:700 !important;
  line-height:1.35 !important;
  text-transform:uppercase !important;
  letter-spacing:0 !important;
  margin-bottom:58px !important;
  color:#f8f1e5 !important;
}
/* Invisible third slot mirrors Home's BENICÀSSIM · SPAIN spacing so
   OUR STORY and FROM BUFFALO... land at the exact same vertical positions. */
.story-hero-copy .story-hero-spacer{
  visibility:hidden !important;
  font-family:"Cormorant Garamond",serif !important;
  font-size:24px !important;
  font-weight:700 !important;
  line-height:1.35 !important;
  margin:0 !important;
  color:transparent !important;
}
.story-hero-copy > span{
  display:none !important;
}

/* Bold Home's supporting hero lines as requested. */
.home-hero .hero-date,
.home-hero .hero-location{
  font-family:"Cormorant Garamond",serif !important;
  font-weight:700 !important;
}

@media (max-width:1100px){
  .story-hero-copy h1{
    font-size:48px !important;
    margin-bottom:60px !important;
  }
  .story-hero-copy .story-hero-subtitle{
    font-size:18px !important;
    margin-bottom:58px !important;
  }
  .story-hero-copy .story-hero-spacer{font-size:18px !important;}
}
@media (max-width:1100px){
  .story-hero-copy h1{
    font-size:42px !important;
    margin-bottom:45px !important;
  }
  .story-hero-copy .story-hero-subtitle{
    font-size:17px !important;
    margin-bottom:45px !important;
  }
  .story-hero-copy .story-hero-spacer{font-size:17px !important;}
}


/* v66 — Match the second and third hero lines on Our Story and Benicàssim
   exactly to the Home hero's JULY 2027 line, including typography and spacing. */
.story-hero-copy,
.beni-hero-copy{
  justify-content:center !important;
  padding-top:70px !important;
}

.story-hero-copy h1,
.beni-hero-copy h1{
  font-family:"Cormorant Garamond",serif !important;
  font-weight:400 !important;
  font-size:76px !important;
  line-height:1 !important;
  letter-spacing:-.015em !important;
  margin:0 0 60px !important;
}

/* Identical to Home's JULY 2027 line. */
.story-hero-copy .story-hero-subtitle,
.beni-hero-copy .beni-hero-subtitle{
  font-family:"Cormorant Garamond",serif !important;
  font-size:24px !important;
  font-weight:700 !important;
  line-height:normal !important;
  text-transform:none !important;
  letter-spacing:normal !important;
  margin:0 0 58px !important;
  color:#f8f1e5 !important;
}

/* Third line is intentionally blank, but keeps the exact same dimensions
   as Home's BENICÀSSIM · SPAIN line so positioning remains identical. */
.story-hero-copy .story-hero-spacer,
.beni-hero-copy .beni-hero-location{
  visibility:hidden !important;
  font-family:"Cormorant Garamond",serif !important;
  font-size:24px !important;
  font-weight:700 !important;
  line-height:normal !important;
  letter-spacing:normal !important;
  margin:0 !important;
  color:transparent !important;
}



/* v67 — Travel hero uses the user-provided background image. */
.travel-hero{
  height:858px;
  position:relative;
  overflow:hidden;
  background:var(--cream,#f6f2e8);
}
.travel-hero-image{
  position:absolute;
  inset:0;
  background-image:url("assets/travel-hero-user.png");
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
  opacity:1;
}
.travel-hero-copy{
  position:absolute;
  inset:0;
  z-index:2;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding-top:70px;
  color:#fff;
}
.travel-hero-copy h1{
  font-family:"Cormorant Garamond",serif;
  font-weight:400;
  font-size:76px;
  line-height:1;
  letter-spacing:-.015em;
  margin:0 0 60px;
}
.travel-hero-copy p,
.travel-hero-location{
  font-family:"Cormorant Garamond",serif;
  font-size:24px;
  font-weight:700;
  line-height:normal;
  letter-spacing:normal;
}
.travel-hero-copy p{margin:0 0 58px}
.travel-hero-location{margin:0}

@media(max-width:1100px){
  .travel-hero{height:720px}
  .travel-hero-copy h1{font-size:48px}
  .travel-hero-copy p,.travel-hero-location{font-size:18px}
}
@media(max-width:1100px){
  .travel-hero-copy h1{font-size:42px;margin-bottom:45px}
  .travel-hero-copy p,.travel-hero-location{font-size:17px}
  .travel-hero-copy p{margin-bottom:45px}
}

/* v67 — The supporting hero sentences are uppercase, matching JULY 2027. */
.story-hero-copy .story-hero-subtitle,
.beni-hero-copy .beni-hero-subtitle{
  text-transform:uppercase !important;
}


/* v69 — Travel refinement: uppercase dark hero copy, remove the pale content band,
   and add delicate olive-branch dividers before the two main sections. */
.travel-hero-copy .travel-hero-subtitle,
.travel-hero-copy .travel-hero-location{
  text-transform:uppercase !important;
  color:#4a4037 !important;
}
.travel-page{
  background:#e9e2d6 !important;
}
.travel-page .flights-section,
.travel-page .hotels-block{
  background:#e9e2d6 !important;
}
.travel-page .hotels-block{
  color:#4a4037 !important;
}
.travel-divider{
  width:min(100%, 760px);
  margin:0 auto 46px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:20px;
  color:#7d8452;
}
.travel-divider span{
  flex:1;
  height:1px;
  background:currentColor;
  opacity:.55;
}
.travel-divider svg{
  width:150px;
  height:34px;
  flex:0 0 auto;
}
.travel-page .flights-section{
  padding-top:0 !important;
}
.travel-page .hotels-block{
  padding-top:70px !important;
}
@media(max-width:1100px){
  .travel-divider{
    gap:12px;
    margin-bottom:32px;
  }
  .travel-divider svg{
    width:115px;
    height:27px;
  }
}
@media(max-width:1100px){
  .travel-divider{
    gap:8px;
    margin-bottom:26px;
  }
  .travel-divider svg{
    width:95px;
    height:24px;
  }
}


/* v70 — Travel hero rhythm + supplied Mediterranean divider */
.travel-hero{height:650px !important;}
.travel-hero-copy{padding-top:150px !important;}
.travel-hero-copy p,.travel-hero-location{color:#4a4037 !important;text-transform:uppercase !important;}
.travel-page{padding-top:0 !important;}
.travel-divider{width:min(100%,760px);margin:0 auto 46px;display:block;line-height:0;color:transparent;}
.travel-divider img{display:block;width:100%;height:auto;object-fit:contain;}
/* v81 — supplied aircraft/hotel dividers; lift the complete HOW TO GET HERE block. */
.travel-page .flights-section{margin-top:-45px !important;}
@media(max-width:1100px){
  .travel-hero{height:620px !important;}
  .travel-hero-copy{padding-top:40px !important;}
  .travel-divider{margin-bottom:32px;}

}
@media(max-width:1100px){
  .travel-hero{height:560px !important;}
  .travel-hero-copy{padding-top:80px !important;}
  .travel-divider{margin-bottom:26px;}

}

/* Final requested typography refinements */
.header .nav a,
.header .language-toggle,
.header .language-menu button,
.mobile-menu nav a,
.mobile-menu-language,
.mobile-menu-language button{
  font-weight:700 !important;
}
.header .header-brand{
  font-weight:500 !important;
}

/* Dark text on the Our Story and Benicàssim heroes/headers */
.story-page .header,
.story-page .header .nav a,
.story-page .header .header-brand,
.story-page .header .language-toggle,
.story-page .story-hero-copy,
.story-page .story-hero-copy h1,
.story-page .story-hero-copy p{
  color:var(--dark-brown) !important;
}
.beni-page .header,
.beni-page .header .nav a,
.beni-page .header .header-brand,
.beni-page .header .language-toggle,
.beni-page .beni-hero-copy,
.beni-page .beni-hero-copy h1,
.beni-page .beni-hero-copy p,
.beni-page .beni-hero-location{
  color:var(--dark-brown) !important;
}


/* v71 — header typography correction: every header item bold except the brand. */
.header .nav,
.header .nav a,
.header .nav span,
.header .language-toggle,
.header .language-menu,
.header .language-menu button,
.mobile-menu nav a,
.mobile-menu nav span,
.mobile-menu .language-toggle,
.mobile-menu [data-lang-option]{
  font-weight:700 !important;
}
.header .header-brand{
  font-weight:400 !important;
}
@media (max-width:1100px){
  .header .nav, .header .nav a, .header .nav span, .header .language-toggle{font-weight:700 !important;}
  .header .header-brand{font-weight:400 !important;}
}

/* v73 — final hero heights: consistent across desktop, tablet and mobile */
.home-hero,
.story-hero,
.beni-hero {
  height: 762.5px !important;
}

.travel-hero {
  height: 700px !important;
}

/* v74 — final requested hero heights and consistent mobile hero title sizing */
.home-hero,
.story-hero,
.beni-hero {
  height: 737.5px !important;
}

.travel-hero {
  height: 675px !important;
}

@media (max-width: 1100px) {
  .home-hero,
  .story-hero,
  .beni-hero {
    height: 737.5px !important;
  }

  .travel-hero {
    height: 675px !important;
  }

  .hero-copy h1,
  .story-hero-copy h1,
  .beni-hero-copy h1,
  .travel-hero-copy h1 {
    font-size: 48px !important;
  }
}

@media (max-width: 1100px) {
  .hero-copy h1,
  .story-hero-copy h1,
  .beni-hero-copy h1,
  .travel-hero-copy h1 {
    font-size: 48px !important;
  }
}

/* v75 — lock all primary hero heights on mobile so Our Story matches the other heroes exactly. */
@media (max-width: 1100px) {
  .home-hero,
  .story-hero,
  .beni-hero {
    height: 737.5px !important;
    min-height: 737.5px !important;
    max-height: 737.5px !important;
    box-sizing: border-box !important;
  }
}

@media (max-width: 1100px) {
  .home-hero,
  .story-hero,
  .beni-hero {
    height: 737.5px !important;
    min-height: 737.5px !important;
    max-height: 737.5px !important;
  }
}

/* v76 — mobile hero heading alignment: keep the first hero word at the same
   vertical distance below the header across Home, Our Story, Benicàssim and Travel. */
@media (max-width: 1100px) {
  .story-hero-copy h1 {
    transform: translateY(2px) !important;
  }
  .travel-hero-copy h1 {
    transform: translateY(20px) !important;
  }
}

/* v77 — Align all primary hero copy from a common top anchor.
   The heading (first line) now starts at the same distance from the top of
   every hero instead of each copy block being vertically centered. */
.home-hero .hero-copy,
.story-hero .story-hero-copy,
.beni-hero .beni-hero-copy,
.travel-hero .travel-hero-copy {
  top: 0 !important;
  bottom: auto !important;
  height: auto !important;
  justify-content: flex-start !important;
  padding-top: 260px !important;
}

@media (max-width: 1100px) {
  .home-hero .hero-copy,
  .story-hero .story-hero-copy,
  .beni-hero .beni-hero-copy,
  .travel-hero .travel-hero-copy {
    top: 0 !important;
    bottom: auto !important;
    height: auto !important;
    justify-content: flex-start !important;
    padding-top: 190px !important;
  }
}

@media (max-width: 1100px) {
  .home-hero .hero-copy,
  .story-hero .story-hero-copy,
  .beni-hero .beni-hero-copy,
  .travel-hero .travel-hero-copy {
    padding-top: 190px !important;
  }
  .story-hero-copy h1,
  .beni-hero-copy h1,
  .travel-hero-copy h1,
  .home-hero .hero-copy h1 {
    transform: none !important;
  }
}

/* v78 — shorten all hero sections by 100px on phone screens only. */
@media (max-width: 1100px) {
  .home-hero,
  .story-hero,
  .beni-hero {
    height: 637.5px !important;
    min-height: 637.5px !important;
    max-height: 637.5px !important;
  }

  .travel-hero {
    height: 575px !important;
    min-height: 575px !important;
    max-height: 575px !important;
  }
}

/* v79 — Match the mobile hero title size to Home across every hero. */
@media (max-width: 1100px) {
  .home-hero .hero-copy h1,
  .story-hero .story-hero-copy h1,
  .beni-hero .beni-hero-copy h1,
  .travel-hero .travel-hero-copy h1 {
    font-size: 48px !important;
    line-height: .95 !important;
  }
}

/* v80 — Match all supporting hero sentences to Home's hero styling. */
.home-hero .hero-date,
.home-hero .hero-location,
.story-hero-copy .story-hero-subtitle,
.story-hero-copy .story-hero-spacer,
.beni-hero-copy .beni-hero-subtitle,
.beni-hero-copy .beni-hero-location,
.travel-hero-copy .travel-hero-subtitle,
.travel-hero-copy .travel-hero-location{
  font-family:"Cormorant Garamond",serif !important;
  font-size:24px !important;
  font-weight:700 !important;
  line-height:normal !important;
  letter-spacing:normal !important;
}

.home-hero .hero-date,
.home-hero .hero-location,
.story-hero-copy .story-hero-subtitle,
.beni-hero-copy .beni-hero-subtitle,
.travel-hero-copy .travel-hero-subtitle,
.travel-hero-copy .travel-hero-location{
  text-transform:uppercase !important;
}

@media (max-width:1100px){
  .home-hero .hero-date,
  .home-hero .hero-location,
  .story-hero-copy .story-hero-subtitle,
  .story-hero-copy .story-hero-spacer,
  .beni-hero-copy .beni-hero-subtitle,
  .beni-hero-copy .beni-hero-location,
  .travel-hero-copy .travel-hero-subtitle,
  .travel-hero-copy .travel-hero-location{
    font-size:24px !important;
    line-height:normal !important;
    font-weight:700 !important;
  }
}

/* v81 — Mobile hero sentence sizing and spacing: match Home consistently. */
@media (max-width: 1100px) {
  .home-hero .hero-copy h1,
  .story-hero .story-hero-copy h1,
  .beni-hero .beni-hero-copy h1,
  .travel-hero .travel-hero-copy h1 {
    margin-bottom: 60px !important;
  }

  .home-hero .hero-date,
  .home-hero .hero-location,
  .story-hero-copy .story-hero-subtitle,
  .story-hero-copy .story-hero-spacer,
  .beni-hero-copy .beni-hero-subtitle,
  .beni-hero-copy .beni-hero-location,
  .travel-hero-copy .travel-hero-subtitle,
  .travel-hero-copy .travel-hero-location {
    font-size: 20px !important;
    line-height: normal !important;
  }

  .home-hero .hero-date,
  .story-hero-copy .story-hero-subtitle,
  .beni-hero-copy .beni-hero-subtitle,
  .travel-hero-copy .travel-hero-subtitle {
    margin-bottom: 58px !important;
  }
}


/* v81 — responsive lift for the complete HOW TO GET HERE section */

@media (max-width:1100px){
  .travel-page .flights-section{margin-top:-25px !important;}
}

/* v82 — Keep the first Travel divider visibly between the hero and HOW TO GET HERE.
   The divider must never be pulled underneath the hero. Lift the HOW TO GET HERE
   content by tightening the space below the divider instead. */
.travel-page .flights-section{
  margin-top:0 !important;
}
.travel-page .flights-section .travel-divider{
  position:relative;
  z-index:3;
  margin-top:0 !important;
  margin-bottom:22px !important;
}
@media (max-width:1100px){
  .travel-page .flights-section .travel-divider{
    margin-bottom:18px !important;
  }
}
@media (max-width:1100px){
  .travel-page .flights-section .travel-divider{
    margin-bottom:14px !important;
  }
}


/* v85 — Travel airport card typography/alignment refinements. */
.travel-page .airport-flight-text{
  font-size:14.5px !important;
  text-align:left !important;
}
.travel-page .airport-card > a:last-child{
  margin-top:auto !important;
  padding-top:14px !important;
}


/* v86 — Align airport-card content left and equalize vertical spacing. */
.airport-card{
  text-align:left !important;
}
.airport-card h3,
.airport-card > p,
.airport-flight-info,
.airport-route,
.airport-links{
  text-align:left !important;
  margin-left:0 !important;
  margin-right:0 !important;
}
.airport-card h3{
  margin-bottom:14px !important;
}
.airport-card > p{
  margin-bottom:34px !important;
  max-width:none !important;
  min-height:51px;
}
.airport-flight-info{
  margin-top:0 !important;
  margin-bottom:34px !important;
  max-width:none !important;
}
.airport-route{
  margin-top:0 !important;
  margin-bottom:34px !important;
  max-width:none !important;
}
.airport-links{
  margin-top:0 !important;
  margin-bottom:34px !important;
  max-width:none !important;
}
.airport-card > a:last-child{
  align-self:flex-start !important;
  margin-left:0 !important;
  margin-right:0 !important;
}
@media(max-width:1100px){
  .airport-card > p{margin-bottom:30px !important;}
  .airport-flight-info{margin-bottom:30px !important;}
  .airport-route{margin-bottom:30px !important;}
  .airport-links{margin-bottom:30px !important;}
}


/* v87 — Airport card final alignment and typography. */
.travel-page .airport-card{
  text-align:left !important;
}
/* Center only the airport title/details and the Google Maps CTA. */
.travel-page .airport-card h3,
.travel-page .airport-card > p,
.travel-page .airport-card > a:last-child{
  text-align:center !important;
}
.travel-page .airport-card h3{
  font-size:31px !important;
  line-height:1.05 !important;
  margin-left:auto !important;
  margin-right:auto !important;
  margin-bottom:14px !important;
}
.travel-page .airport-card > p{
  font-size:16px !important;
  line-height:1.45 !important;
  max-width:100% !important;
  min-height:51px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  margin-bottom:34px !important;
}
/* Keep the flight message aligned with the left edge of the route/link copy. */
.travel-page .airport-flight-info,
.travel-page .airport-flight-label,
.travel-page .airport-flight-text,
.travel-page .airport-route,
.travel-page .airport-links{
  text-align:left !important;
}
.travel-page .airport-flight-info,
.travel-page .airport-route,
.travel-page .airport-links{
  max-width:none !important;
  margin-left:0 !important;
  margin-right:0 !important;
}
/* Matching primary body size across the three airport cards. */
.travel-page .airport-flight-text,
.travel-page .airport-route ul,
.travel-page .airport-links ul,
.travel-page .airport-links a{
  font-size:14.5px !important;
}
.travel-page .airport-route ul,
.travel-page .airport-links ul{
  line-height:1.55 !important;
}
.travel-page .airport-links .link-note{
  font-size:12px !important;
  line-height:1.4 !important;
}
.travel-page .airport-card > a:last-child{
  align-self:center !important;
  margin-left:auto !important;
  margin-right:auto !important;
  padding-top:14px !important;
}


/* v88 — Final airport-card layout refinements. */
.travel-page .airport-card h3,
.travel-page .airport-card > p {
  text-align: center !important;
}
.travel-page .airport-flight-text,
.travel-page .airport-route,
.travel-page .airport-links {
  text-align: left !important;
}
/* Keep the three Useful Links sections on the same horizontal line on desktop. */
@media (min-width: 1101px) {
  .travel-page .airport-route {
    min-height: 188px !important;
    box-sizing: border-box !important;
  }
  .travel-page .airport-links {
    margin-top: 0 !important;
  }
}
/* Google Maps CTA intentionally removed in v88. */


/* v89 — Final airport card alignment and tighter spacing. */
.travel-page .airport-card { text-align:left !important; }
.travel-page .airport-card h3, .travel-page .airport-card > p { text-align:center !important; }
.travel-page .airport-flight-info, .travel-page .airport-route, .travel-page .airport-links { width:100% !important; max-width:none !important; margin-left:0 !important; margin-right:0 !important; text-align:left !important; }
.travel-page .airport-flight-text, .travel-page .airport-route ul, .travel-page .airport-links ul, .travel-page .airport-links a { font-family:"Jost",sans-serif !important; font-size:14.5px !important; line-height:1.55 !important; }
.travel-page .airport-flight-label, .travel-page .airport-info-label { font-family:"Jost",sans-serif !important; font-size:10px !important; line-height:1.35 !important; letter-spacing:.18em !important; }
.travel-page .airport-links .link-note { font-family:"Jost",sans-serif !important; font-size:12px !important; line-height:1.4 !important; }
@media (min-width:1101px) {
  .travel-page .airport-card > p { min-height:51px !important; margin-bottom:20px !important; }
  .travel-page .airport-flight-info { height:104px !important; box-sizing:border-box !important; margin-top:0 !important; margin-bottom:20px !important; }
  .travel-page .airport-route { height:166px !important; box-sizing:border-box !important; margin-top:0 !important; margin-bottom:20px !important; }
  .travel-page .airport-links { margin-top:0 !important; }
}
@media (max-width:1100px) {
  .travel-page .airport-flight-info, .travel-page .airport-route, .travel-page .airport-links { margin-top:0 !important; }
  .travel-page .airport-flight-info { margin-bottom:20px !important; }
  .travel-page .airport-route { margin-bottom:20px !important; }
  .travel-page .airport-links { margin-bottom:0 !important; }
}

/* v90 — Final airport card spacing/alignment. */
.travel-page .airport-flight-text{
  /* Align the first character with the bullet position used by the route lists. */
  margin-left:-32px !important;
  margin-right:0 !important;
  padding-left:0 !important;
  padding-right:0 !important;
  text-align:left !important;
}
.travel-page .airport-flight-info,
.travel-page .airport-route,
.travel-page .airport-links{
  text-align:left !important;
}
@media (min-width:1101px){
  .travel-page .airport-card > p{
    margin-bottom:12px !important;
  }
  .travel-page .airport-flight-info{
    height:78px !important;
    margin-bottom:12px !important;
  }
  .travel-page .airport-route{
    height:132px !important;
    margin-bottom:12px !important;
  }
  .travel-page .airport-links{
    margin-top:0 !important;
    margin-bottom:0 !important;
  }
}
@media (max-width:1100px){
  .travel-page .airport-card > p{ margin-bottom:12px !important; }
  .travel-page .airport-flight-info{ margin-bottom:12px !important; }
  .travel-page .airport-route{ margin-bottom:12px !important; }
  .travel-page .airport-links{ margin-bottom:0 !important; }
}

/* v91 — Travel airport card alignment and tighter section rhythm */
.travel-page .airport-flight-info,
.travel-page .airport-route,
.travel-page .airport-links{
  width:100% !important;
  max-width:290px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  box-sizing:border-box;
}
.travel-page .airport-flight-text{
  max-width:none !important;
  margin:0 !important;
  text-align:left !important;
}
.travel-page .airport-links{
  margin-top:12px !important;
}
.travel-page .airport-route{
  margin-top:20px !important;
}


/* v93 — Match travel-card typography and compact spacing. */
.travel-page .airport-card h3 + p {
  font-family: "Jost", sans-serif !important;
}
.travel-page .airport-flight-info,
.travel-page .airport-route,
.travel-page .airport-links {
  font-family: "Jost", sans-serif !important;
}
.travel-page .airport-flight-info *,
.travel-page .airport-route *,
.travel-page .airport-links * {
  font-family: "Jost", sans-serif !important;
  font-size: 14px !important;
}
.travel-page .airport-flight-label,
.travel-page .airport-info-label {
  font-size: 14px !important;
  line-height: 1.25 !important;
  letter-spacing: .16em !important;
}
.travel-page .airport-flight-text {
  margin-left: -18px !important;
  line-height: 1.45 !important;
}
.travel-page .airport-route {
  margin-top: 12px !important;
}
.travel-page .airport-links {
  margin-top: 8px !important;
}
.travel-page .airport-route ul,
.travel-page .airport-links ul {
  line-height: 1.45 !important;
}
.travel-page .airport-route li {
  margin-bottom: 7px !important;
}
.travel-page .airport-links li {
  margin-bottom: 6px !important;
}
.travel-page .airport-links .link-note {
  font-size: 14px !important;
  line-height: 1.35 !important;
}
@media (min-width:1101px) {
  .travel-page .airport-card > p {
    margin-bottom: 8px !important;
  }
  .travel-page .airport-flight-info {
    height: 72px !important;
    margin-bottom: 0 !important;
  }
  .travel-page .airport-route {
    height: 126px !important;
    margin-bottom: 0 !important;
  }
  .travel-page .airport-links {
    margin-top: 0 !important;
  }
}
@media (max-width:1100px) {
  .travel-page .airport-card > p { margin-bottom: 8px !important; }
  .travel-page .airport-flight-info { margin-bottom: 8px !important; }
  .travel-page .airport-route { margin-bottom: 8px !important; }
  .travel-page .airport-links { margin-top: 8px !important; }
}


/* v95 — Travel page: compact section label and prevent horizontal overflow */
.travel-page,
.travel-page .flights-section,
.travel-page .hotels-block {
  max-width: 100%;
  overflow-x: clip;
}
.travel-page .flights-section,
.travel-page .hotels-block {
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.travel-page .airport-info-label {
  white-space: nowrap;
}
@media (max-width: 1100px) {
  .travel-page .airport-info-label {
    white-space: nowrap;
    letter-spacing: .14em;
  }
}

/* v98 — Refine airport-card vertical spacing: tighter top gap, more room before Useful Links. */
@media (min-width:1101px) {
  .travel-page .airport-cards {
    margin-top: 15px !important;
  }
  .travel-page .airport-links {
    margin-top: 30px !important;
  }
}
@media (max-width:1100px) {
  .travel-page .airport-cards {
    margin-top: 20px !important;
  }
  .travel-page .airport-links {
    margin-top: 18px !important;
  }
}

/* v103 — fine-tune Travel spacing: move GET TO BENICÀSSIM halfway back up and
   widen the visual gap between the hotel divider lines and icon. */
@media (min-width: 1101px) {
  .travel-page .airport-route {
    top: 9px !important;
  }
}
@media (max-width: 1100px) {
  .travel-page .airport-route {
    top: 7px !important;
  }
}

/* v110 — Ensure airport cards are tall enough to contain the lowered Useful Links.
   The previous fixed-height child sections made the card content extend beyond its border. */
@media (min-width: 1101px) {
  .travel-page .airport-card {
    min-height: 760px !important;
    height: auto !important;
    overflow: visible !important;
    box-sizing: border-box !important;
  }
}
@media (max-width: 1100px) {
  .travel-page .airport-card {
    min-height: 0 !important;
    height: auto !important;
    overflow: visible !important;
  }
}

/* v117 — mobile hero text breathing room.
   Add horizontal padding so hero lettering never sits too close to the
   screen edges. Desktop is intentionally unchanged. */
@media (max-width: 1100px) {
  .home-hero .hero-copy,
  .story-hero .story-hero-copy,
  .beni-hero .beni-hero-copy,
  .travel-hero .travel-hero-copy {
    padding-left: 24px !important;
    padding-right: 24px !important;
    box-sizing: border-box !important;
  }
}

/* v120 — mobile Travel cards: match the gap from the final sentence of
   GET TO BENICÀSSIM to USEFUL LINKS with the corresponding gap above
   GET TO BENICÀSSIM. Desktop intentionally unchanged. */
@media (max-width: 1100px) {
  .travel-page .airport-route {
    margin-bottom: 96px !important;
  }
  .travel-page .airport-links {
    margin-top: 0 !important;
  }
}
@media (max-width: 1100px) {
  .travel-page .airport-route {
    margin-bottom: 96px !important;
  }
}

/* v122 — Mobile airport cards: equalize the visual gap between section content,
   while letting each section grow naturally when text wraps onto extra lines.
   This avoids fixed heights so the spacing stays identical for Valencia,
   Barcelona and Madrid regardless of line breaks. */
@media (max-width:1100px) {
  .travel-page .airport-flight-info {
    height: auto !important;
    min-height: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 28px !important;
  }
  .travel-page .airport-route {
    height: auto !important;
    min-height: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 28px !important;
    top: 0 !important;
  }
  .travel-page .airport-links {
    height: auto !important;
    min-height: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
}

/* v146 — Tablet Benicàssim EAT & DRINK: keep the intro on the left and
   place Lunch, Dinner and Drinks in one horizontal row beneath/alongside it,
   matching the desktop composition rather than stacking the columns. */
@media (min-width:601px) and (max-width:1100px) {
  .beni-eat-inner {
    grid-template-columns: 1.1fr repeat(3, 1fr) !important;
    gap: 25px !important;
    align-items: start !important;
  }
  .beni-eat-col {
    border-left: 1px solid #c8c0b5 !important;
    padding-left: 25px !important;
  }
}

/* v147 — Tablet Benicàssim EAT & DRINK: lower the three restaurant columns
   so their headings align with the opening line of the intro paragraph. */
@media (min-width:601px) and (max-width:1100px) {
  .beni-eat-col {
    margin-top: 64px !important;
  }
}


/* v149 — Tablet Benicàssim EAT & DRINK: keep the intro paragraph above
   the three restaurant blocks, with Lunch / Dinner / Drinks aligned in one
   horizontal row underneath it. */
@media (min-width:601px) and (max-width:1100px) {
  .beni-eat-inner {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 25px !important;
    align-items: start !important;
  }
  .beni-eat-inner > div:first-child {
    grid-column: 1 / -1 !important;
  }
  .beni-eat-col {
    margin-top: 0 !important;
    border-left: 1px solid #c8c0b5 !important;
    padding-left: 25px !important;
  }
}

/* v148 — Home divider consistency: OUR STORY uses the exact same available
   line width, text padding, and 1px rule thickness as SEE THE WEEKEND. */
.welcome .section-divider {
  width: auto !important;
  max-width: none !important;
  margin-left: 8vw !important;
  margin-right: 8vw !important;
}
.welcome .section-divider::before,
.welcome .section-divider::after {
  height: 1px !important;
}
.welcome .section-divider a,
.welcome .section-divider span {
  padding-left: 125px !important;
  padding-right: 125px !important;
}

@media (max-width:1100px) {
  /* Preserve the phone/tablet centered treatment while keeping both dividers
     identical in line thickness and horizontal geometry. */
  .welcome .section-divider {
    margin-left: 8vw !important;
    margin-right: 8vw !important;
  }
  .welcome .section-divider a,
  .welcome .section-divider span,
  .see-weekend a,
  .see-weekend span {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  .welcome .section-divider::before,
  .welcome .section-divider::after,
  .see-weekend::before,
  .see-weekend::after {
    height: 1px !important;
  }
}

/* v150 — Tablet Benicàssim EAT & DRINK: let the intro paragraph use the
   full horizontal width available above the three restaurant columns. */
@media (min-width:601px) and (max-width:1100px) {
  .beni-eat-inner > div:first-child p {
    width: 100% !important;
    max-width: none !important;
  }
}

/* v151 — Desktop Home OUR STORY divider: match SEE THE WEEKEND exactly.
   OUR STORY contains a nested span, so remove the span's extra horizontal
   padding and keep the 125px padding only on the link itself. */
@media (min-width:1101px) {
  .welcome .section-divider a {
    padding-left: 125px !important;
    padding-right: 125px !important;
  }
  .welcome .section-divider span {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

/* v153 — Desktop Home OUR STORY divider: match SEE THE WEEKEND geometry exactly.
   The divider must start/end at the same 8vw screen inset and use the same
   425px rule lengths. Remove the shared max-width so the screen-edge inset,
   rather than the 1585px max-width, controls the horizontal position. */
@media (min-width:1101px) {
  .welcome .section-divider {
    width: auto !important;
    max-width: none !important;
    margin-left: 8vw !important;
    margin-right: 8vw !important;
    justify-content: center !important;
  }
  .welcome .section-divider::before,
  .welcome .section-divider::after {
    flex: 0 0 425px !important;
    width: 425px !important;
  }
  .welcome .section-divider a,
  .welcome .section-divider span {
    flex: 0 0 auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

/* v154 — Desktop Home OUR STORY: the .welcome section already has 8vw
   horizontal padding, so the divider must NOT add another 8vw inset.
   This makes its screen-edge separation and 425px line lengths match
   SEE THE WEEKEND exactly. */
@media (min-width:1101px) {
  .welcome .section-divider {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: none !important;
  }
  /* Keep the two Home divider buttons identical in width so the available
     space is split evenly and both horizontal rules are exactly the same length. */
  .welcome .section-divider a,
  .welcome .section-divider a span {
    box-sizing: border-box !important;
    flex: 0 0 455px !important;
    width: 454px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    text-align: center !important;
  }
  .welcome .section-divider::before,
  .welcome .section-divider::after {
    flex: 1 1 0 !important;
    width: auto !important;
  }
}


/* v156 — Desktop Home divider buttons: make OUR STORY and SEE THE WEEKEND
   exactly the same width. This gives both dividers identical rule lengths. */
@media (min-width:1101px) {
  .section-divider.see-weekend a {
    box-sizing: border-box !important;
    flex: 0 0 455px !important;
    width: 455px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    text-align: center !important;
  }
  .section-divider.see-weekend::before,
  .section-divider.see-weekend::after {
    flex: 1 1 0 !important;
    width: auto !important;
  }
}


/* LOCK SCREEN — final refinements */
.lock-content,
.lock-content h1,
.lock-content p,
#password,
#password::placeholder,
#error,
.lock-language{
  color:var(--light-cream);
}

/* Password placeholder at 50% transparency */
#password::placeholder{
  opacity:.5;
}

/* Make the entire password box an easy click target */
#passwordForm{
  cursor:text;
}
#passwordForm button{
  cursor:pointer;
}


/* LOCK SCREEN — password box matched to reference style */
#passwordForm{
  background:rgba(255,255,255,.72);
  border:2px solid rgba(255,255,255,.95);
  border-radius:5px;
  padding:0 4px 0 22px;
  overflow:hidden;
}

#password{
  color:var(--text);
  font-family:"Jost",sans-serif;
  font-size:18px;
}

#password::placeholder{
  color:var(--text);
  opacity:.5;
}

#passwordForm button{
  color:var(--text);
}


/* FINAL — remove white borders from requested translucent boxes */
#passwordForm{
  border:none !important;
}

.beni-section-title,
.beni-section-header,
.beni-travel-title,
.beni-travel-box,
.beni-travel-header{
  border:none !important;
}

.beni-footer-hero a{
  border:none !important;
}

/* RSVP PAGE — hero photo + form */
.rsvp-page{
  min-height:100vh;
  background:var(--cream);
}
.rsvp-layout{
  min-height:100vh;
  display:block;
}
.rsvp-photo{
  height:858px;
  min-height:858px;
  position:relative;
  background-image:url("assets/placeholder.jpg");
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
  opacity:.5;
}
.rsvp-photo::after{
  content:"";
  position:absolute;
  inset:0;
  background:rgba(0,0,0,0);
}
.rsvp-form-panel{
  min-height:0;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:105px 8vw 115px;
  background:var(--cream);
}
.rsvp-form-inner{
  width:min(560px,100%);
  text-align:center;
  color:var(--text);
}
/* Match the Home hero typography/centering treatment. */
.rsvp-form-inner h1{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  width:100%;
  z-index:3;
  font-family:"Cormorant Garamond",serif;
  font-weight:400;
  font-size:76px;
  line-height:1;
  letter-spacing:-.015em;
  margin:0;
  color:#fff;
  text-align:center;
  text-shadow:0 1px 8px rgba(0,0,0,.08);
}
.rsvp-rule{
  position:absolute;
  top:calc(50% + 74px);
  left:50%;
  transform:translateX(-50%);
  z-index:3;
  width:115px;
  height:1px;
  background:#fff;
}
.rsvp-subtitle{
  position:absolute;
  top:calc(50% + 105px);
  left:50%;
  transform:translateX(-50%);
  z-index:3;
  font-family:"Jost",sans-serif;
  color:#fff;
  font-size:24px;
  line-height:1;
  letter-spacing:.04em;
  margin:0;
  white-space:nowrap;
}
.rsvp-form{
  text-align:left;
}
.rsvp-form>label,
.rsvp-attending legend{
  display:block;
  font-family:"Jost",sans-serif;
  font-size:16px;
  font-weight:400;
  letter-spacing:.28em;
  color:var(--text);
}
.rsvp-form>input{
  display:block;
  width:100%;
  height:50px;
  margin:12px 0 56px;
  padding:0;
  border:0;
  border-bottom:1px solid var(--text);
  border-radius:0;
  outline:0;
  background:transparent;
  color:var(--text);
  font-family:"Jost",sans-serif;
  font-size:18px;
}
.rsvp-form>input:focus{border-bottom-width:2px}
.rsvp-attending{
  border:0;
  margin:0 0 54px;
  padding:0;
}
.rsvp-attending legend{padding:0;margin-bottom:28px}
.rsvp-options{display:flex;align-items:center;gap:110px}
.rsvp-options label{
  display:flex;align-items:center;gap:17px;cursor:pointer;
  font-family:"Jost",sans-serif;font-size:16px;letter-spacing:.28em
}
.rsvp-options input{
  appearance:none;width:27px;height:27px;margin:0;border:1px solid var(--text);
  border-radius:50%;background:transparent;cursor:pointer;position:relative
}
.rsvp-options input:checked::after{
  content:"";position:absolute;width:11px;height:11px;border-radius:50%;
  background:var(--text);top:7px;left:7px
}
.rsvp-form>textarea{
  display:block;width:100%;min-height:115px;margin-top:13px;margin-bottom:46px;
  padding:16px 18px;resize:vertical;border:1px solid var(--text);border-radius:0;
  outline:0;background:transparent;color:var(--text);font-family:"Jost",sans-serif;
  font-size:17px;line-height:1.45
}
.rsvp-form>textarea:focus{border-width:2px}
.rsvp-form>textarea::placeholder{
  color:var(--text);opacity:.45;font-family:"Jost",sans-serif;font-size:14px;letter-spacing:.25em
}
.rsvp-send{
  display:block;margin:0 auto;min-width:205px;padding:14px 34px;border:1px solid var(--text);
  border-radius:0;background:transparent;color:var(--text);font-family:"Jost",sans-serif;
  font-size:15px;font-weight:500;letter-spacing:.28em;cursor:pointer
}
.rsvp-send:hover{background:rgba(74,64,55,.06)}
.rsvp-send:disabled{opacity:.5;cursor:wait}
.rsvp-status{
  min-height:24px;margin:22px 0 0;text-align:center;font-family:"Jost",sans-serif;
  font-size:13px;letter-spacing:.12em;color:var(--text)
}

@media(max-width:1100px){
  .rsvp-photo{height:858px;min-height:858px}
  .rsvp-form-inner h1{font-size:58px}
  .rsvp-rule{top:calc(50% + 58px);width:100px}
  .rsvp-subtitle{top:calc(50% + 86px);font-size:20px}
  .rsvp-form-panel{padding:90px 8vw 100px}
}

@media(max-width:600px){
  .rsvp-photo{height:100svh;min-height:680px}
  .rsvp-form-inner h1{font-size:48px}
  .rsvp-rule{width:90px;top:calc(50% + 48px);margin:0}
  .rsvp-subtitle{top:calc(50% + 72px);font-size:15px;letter-spacing:.27em}
  .rsvp-form-panel{padding:80px 28px 70px}
  .rsvp-form>label,
  .rsvp-attending legend,
  .rsvp-options label{font-size:14px;letter-spacing:.22em}
  .rsvp-form>input{margin-bottom:46px}
  .rsvp-attending{margin-bottom:45px}
  .rsvp-options{gap:55px}
  .rsvp-form>textarea{min-height:110px;margin-bottom:38px}
  .rsvp-send{min-width:175px}
}


/* RSVP — split layout restored from the preferred design reference.
   The site header sits above the page; the photo occupies only the left panel. */
.rsvp-body .header{
  position:relative;
  top:auto;
  left:auto;
  right:auto;
}
.rsvp-body .rsvp-page{min-height:calc(100vh - 105px);}
.rsvp-body .rsvp-layout{
  min-height:calc(100vh - 105px);
  display:grid;
  grid-template-columns:44.2% 55.8%;
  align-items:stretch;
}
.rsvp-body .rsvp-photo{
  height:auto;
  min-height:calc(100vh - 105px);
  opacity:.5 !important;
  background-position:center center;
}
.rsvp-body .rsvp-form-panel{
  min-height:calc(100vh - 105px);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:80px 8.5vw 90px;
}
.rsvp-body .rsvp-form-inner{
  width:min(560px,100%);
  text-align:center;
  color:var(--text);
}
.rsvp-body .rsvp-form-inner h1{
  position:static;
  transform:none;
  width:auto;
  z-index:auto;
  font-family:"Cormorant Garamond",serif;
  font-weight:400;
  font-size:76px;
  line-height:.95;
  letter-spacing:-.015em;
  margin:28px 0 4px;
  color:var(--text);
  text-align:center;
  text-shadow:none;
}
.rsvp-body .rsvp-rule{
  position:static;
  transform:none;
  z-index:auto;
  width:115px;
  height:1px;
  margin:0 auto 30px;
  background:var(--text);
}
.rsvp-body .rsvp-subtitle{
  position:static;
  transform:none;
  z-index:auto;
  font-family:"Jost",sans-serif;
  color:var(--text);
  font-size:24px;
  line-height:1;
  letter-spacing:.04em;
  margin:0 0 84px;
  white-space:nowrap;
}
.rsvp-body .rsvp-form{text-align:left;}

@media(max-width:1100px){
  .rsvp-body .header{position:relative;}
  .rsvp-body .rsvp-page,
  .rsvp-body .rsvp-layout{min-height:0;}
  .rsvp-body .rsvp-layout{grid-template-columns:1fr;}
  .rsvp-body .rsvp-photo{height:520px;min-height:0;}
  .rsvp-body .rsvp-form-panel{min-height:0;padding:76px 8vw 90px;}
  .rsvp-body .rsvp-form-inner h1{font-size:58px;margin-top:10px;margin-bottom:4px;}
  .rsvp-body .rsvp-photo{border-left:none;}
  .rsvp-body .rsvp-subtitle{font-size:20px;margin-bottom:65px;}
}

@media(max-width:600px){
  .rsvp-body .rsvp-photo{
    height:360px;
    min-height:0;
    width:calc(100% - 56px);
    margin-left:auto;
    margin-right:auto;
    margin-top:80px;
    border-left:none;
  }
  .rsvp-body .rsvp-form-panel{padding:64px 28px 70px;}
  .rsvp-body .rsvp-form-inner h1{font-size:48px;line-height:.96;margin:0 0 4px;}
  .rsvp-body .rsvp-rule{width:90px;margin-bottom:30px;}
  .rsvp-body .rsvp-subtitle{font-size:15px;letter-spacing:.27em;margin-bottom:55px;}
}


/* RSVP final layout refinements */
.rsvp-body .rsvp-layout{
  min-height:0;
  align-items:stretch;
}
.rsvp-body .rsvp-photo{
  margin-left:90px;
  margin-top:130px;
  min-height:0;
  height:calc(100% - 130px);
  border-left:none;
  box-sizing:border-box;
  opacity:1 !important;
  background-position:55% center;
}
.rsvp-body .rsvp-form-panel{
  min-height:0;
  padding-top:130px;
  padding-bottom:0;
}
.rsvp-body footer{
  background:var(--cream);
}
@media(max-width:1100px){
  .rsvp-body .rsvp-layout{display:grid;grid-template-columns:1fr;}
  .rsvp-body .rsvp-photo{
    margin:45px auto 0;
    width:calc(100% - 56px);
    height:520px;
    min-height:0;
    border-left:none;
  }
  .rsvp-body .rsvp-form-panel{padding-top:76px;padding-bottom:90px;}
}
@media(max-width:600px){
  .rsvp-body .rsvp-photo{
    margin:65px auto 0;
    width:calc(100% - 40px);
    height:360px;
  }
  .rsvp-body footer{
    min-height:345px;
    padding-top:54px;
  }
}

/* RSVP hero spacing — keep the visual gaps equal at every breakpoint. */
.rsvp-body .rsvp-form-inner h1{
  margin-bottom:30px;
}
.rsvp-body .rsvp-rule{
  margin-bottom:20px;
}
@media(max-width:1100px){
  .rsvp-body .rsvp-form-inner h1{
    margin-bottom:30px;
  }
  .rsvp-body .rsvp-rule{
    margin-bottom:20px;
  }
}
@media(max-width:600px){
  .rsvp-body .rsvp-form-inner h1{
    margin-bottom:30px;
  }
  .rsvp-body .rsvp-rule{
    margin-bottom:20px;
  }
}

/* RSVP final polish: remove photo border everywhere; keep the divider hairline-thin; lower RSVP label clearly. */
.rsvp-body .rsvp-photo,
.rsvp-body .rsvp-photo::after{
  border-left:none !important;
  border-left-width:0 !important;
}
.rsvp-body .rsvp-rule{
  height:1px !important;
  min-height:0 !important;
  max-height:1px !important;
  border:0 !important;
  box-shadow:none !important;
}
.rsvp-body .rsvp-subtitle{
  transform:translateY(24px);
}
@media(max-width:1100px){
  .rsvp-body .rsvp-rule{
    height:1px !important;
    min-height:0 !important;
    max-height:1px !important;
    border:0 !important;
    box-shadow:none !important;
  }
  .rsvp-body .rsvp-subtitle{
    transform:translateY(24px);
  }
}
@media(max-width:600px){
  .rsvp-body .rsvp-rule{
    height:1px !important;
    min-height:0 !important;
    max-height:1px !important;
    border:0 !important;
    box-shadow:none !important;
  }
  .rsvp-body .rsvp-subtitle{
    transform:translateY(24px);
  }
}

/* RSVP micro-adjustment: restore the divider to a single hairline and move RSVP BELOW down 15px. */
.rsvp-body .rsvp-rule{
  height:1px !important;
  min-height:1px !important;
  max-height:1px !important;
  border:none !important;
  border-top:1px solid var(--text) !important;
  background:transparent !important;
  box-shadow:none !important;
}
.rsvp-body .rsvp-subtitle{
  transform:translateY(15px) !important;
}
@media(max-width:1100px){
  .rsvp-body .rsvp-rule{
    height:1px !important;
    min-height:1px !important;
    max-height:1px !important;
    border:none !important;
    border-top:1px solid var(--text) !important;
    background:transparent !important;
  }
  .rsvp-body .rsvp-subtitle{transform:translateY(15px) !important;}
}
@media(max-width:600px){
  .rsvp-body .rsvp-rule{
    height:1px !important;
    min-height:1px !important;
    max-height:1px !important;
    border:none !important;
    border-top:1px solid var(--text) !important;
    background:transparent !important;
  }
  .rsvp-body .rsvp-subtitle{transform:translateY(15px) !important;}
}


/* Wedding countdown */
.countdown{display:flex;gap:28px;align-items:flex-start;justify-content:center;margin:-14px 0 38px;color:#fff;font-family:"Jost",sans-serif}
.countdown>div{display:flex;flex-direction:column;align-items:center;min-width:64px}
.countdown span{font-family:"Cormorant Garamond",serif;font-size:46px;line-height:.9;font-weight:500;letter-spacing:.02em}
.countdown small{font-size:10px;letter-spacing:.16em;margin-top:10px;font-weight:500}
@media(max-width:700px){.countdown{gap:13px;margin:-20px 0 32px}.countdown>div{min-width:48px}.countdown span{font-size:34px}.countdown small{font-size:7px;letter-spacing:.1em;margin-top:7px}}