a:hover{
text-decoration:underline;
font-family:verdana, arial, sans-serif;
font-size:12px;
font-weight:bold;
color:rgb(85, 85, 85);
font-style:normal;
}

/* === LINK STYLES (GENERAL) === */a{
font-family:Verdana, Arial, sans-serif;
font-size:12px;
color:rgb(85, 85, 85);
text-decoration:none;
}

/* === TEXT === */.wb-text-content{
font-family:Verdana, Arial, sans-serif;
font-size:12px;
color:rgb(0, 0, 0);
}

/* === SUBMENU === */#wb-navigation-subtop,#wb-navigation-subtop div.submenu,div.submenu{
display:none;
background-color:#CCCCCC;
}

#wb-navigation-bottom div a h3{
padding-left:10px;
font-size:11px;
font-weight:bold;
font-family:verdana, arial, sans-serif;
color:rgb(136, 136, 136);
font-style:normal;
}

#wb-navigation-bottom div a:hover{
border-right-color:#E3E3E3;
border-right-style:solid;
border-right-width:5px;
width:200px;
border-right:5px solid #E3E3E3;
background-color:#f5f5f5;
color:rgb(85, 85, 85);
font-family:verdana, arial, sans-serif;
font-size:12px;
font-weight:bold;
font-style:normal;
}

#wb-navigation-bottom div a{
border-bottom-color:#E3E3E3;
border-bottom-style:solid;
border-bottom-width:1px;
width:100%;
padding:0 10px;
margin:0;
display:block;
height:33px;
line-height:33px;
border-bottom:1px solid #E3E3E3;
text-decoration:none;
color:rgb(136, 136, 136);
font-family:Verdana, Arial, sans-serif;
font-size:11px;
font-weight:bold;
font-style:normal;
}

#wb-navigation-bottom div{
margin-top:0px;
text-align:left;
padding:0px;
margin:0 0 0 0;
width:100%;
background-color:transparent;
}

/* === NAVIGATION STYLES === */#wb-navigation,#wb-navigation-top,#wb-navigation-bottom{
background-color:transparent;
width:100%;
padding:5px 0;
}

/* === FOOTER === */#wb-layout-footer{
min-height:100px;
background-color:transparent;
border:0;
}

/* === TYPOGRAPHY === */h1#website-title{
font-family:Verdana, Arial, sans-serif;
font-size:30px;
font-weight:bold;
color:rgb(0, 0, 0);
}

#wb-layout-main{
width:75%;
min-height:100%;
float:right;
margin-top:2px;
padding-top:5px;
border-left-color:#E3E3E3;
border-left-style:solid;
border-left-width:5px;
border-right:none;
margin-left:0px;
padding-left:10px;
}

/* === RESPONSIVE BREAKPOINT === */@media (min-width: 768px){
#wb-layout-sidebar {    width:25%;
}

/* === MAIN CONTENT AREA === */#wb-layout-main{
width:100%;
padding:5px 20px;
border-left:5px solid #E3E3E3;
background-color:transparent;
}

/* === SIDEBAR === */#wb-layout-sidebar{
width:100%;
padding:0 20px 10px 20px;
background-color:#FFF;
}

/* === FLEXBOX LAYOUT === */#wb-container-contentwrapper{
display:flex;
flex-wrap:wrap;
min-height:100%;
}

#wb-container-inner,#wb-container-contentwrapper,#wb-layout-header-base,#wb-layout-header-mask,#wb-layout-footer{
width:100%;
max-width:100%;
margin:0 auto;
background-color:transparent;
}

/* === CONTAINER STRUCTURE === */#wb-container-outer{
background-color:#FFFFFF;
background-image:none;
background-repeat:repeat;
min-height:105px;
}

html, body{
height:100%;
width:100%;
}

/* === RESET & BASE === */*{
margin:0;
padding:0;
box-sizing:border-box;
}

/* Optional: remove h3 inside links */#wb-navigation-bottom div a h3{
display:none;
}

/* === HORIZONTAL NAVIGATION STYLES === */#wb-navigation,#wb-navigation-top,#wb-navigation-bottom{
background-color:#ffffff;
width:100%;
padding:10px 0;
display:flex;
justify-content:center;
align-items:center;
gap:20px;
border-bottom:1px solid #E3E3E3;
}

/* === RESPONSIVE BREAKPOINT (not needed for nav/sidebar anymore) === */@media (min-width: 768px){
#wb-layout-main {    width:100%;
}

/* === REMOVE SIDEBAR (no longer needed) === */#wb-layout-sidebar{
display:none;
}

/* === NAVIGATION STYLES === */#wb-navigation, #wb-navigation-top, #wb-navigation-bottom{
background-color:transparent;
width:100%;
padding:5px 0;
}

/* Footer */footer{
background:linear-gradient(to right, #42275a, #734b6d);
color:white;
text-align:center;
padding:1rem 0;
}

.map-container iframe{
width:100%;
height:100%;
border:0;
}

/* Map container */.map-container{
margin-top:2rem;
border:2px solid #c0a16b;
border-radius:8px;
overflow:hidden;
height:400px;
}

.navbar-dark .navbar-toggler-icon{
background-image:url("data;
charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba%28969, 244, 237, 0.8%29' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}

.navbar-dark .navbar-toggler{
border-color:#f9f4ed;
}

.navbar-dark .navbar-brand{
color:#f9f4ed;
/* venue bg color */  font-weight:700;
font-size:1.5rem;
}

.navbar-dark .navbar-nav .nav-link:hover,.navbar-dark .navbar-nav .nav-link:focus{
color:#ffd700;
/* gold highlight */  text-decoration:underline;
}

.navbar-dark .navbar-nav .nav-link{
color:#f9f4ed;
/* venue bg color */  font-weight:600;
transition:color 0.3s ease;
}

/* Navbar styles */.navbar{
font-family:'Scheherazade New', serif;
background-color:#6a4a86 !important;
/* lighter purple */  box-shadow:0 2px 8px rgba(0, 0, 0, 0.2);
}

.bg-light{
background-color:#f9f4ed !important;
}

/* Sections */.section{
padding:4rem 1rem;
border-bottom:2px dotted #c0a16b;
}

.hero-caption{
background-color:rgba(0, 0, 0, 0.4);
padding:2rem;
border:3px double #f5deb3;
border-radius:1rem;
}

/* Hero image */.hero-image{
background-image:url('https;
background-size:cover;
background-position:center;
background-attachment:fixed;
height:100vh;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
color:#fdf5e6;
position:relative;
}

h1, h2{
font-family:'Great Vibes', cursive;
}

/* Reset & base */*{
margin:0;
padding:0;
box-sizing:border-box;
}

/* Smooth scrolling */html{
scroll-behavior:smooth;
}

.navbar-toggler-icon{
background-image:url("data;
charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba%28969, 244, 237, 0.8%29' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}

/* Toggler button */.navbar-toggler{
border-color:#f9f4ed;
}

/* Navbar brand */.navbar-brand{
color:#f9f4ed;
/* venue bg color */  font-weight:700;
font-size:1.5rem;
text-decoration:none;
}

.navbar-nav a.nav-link:hover,.navbar-nav a.nav-link:focus{
color:#ffd700;
/* gold highlight */  text-decoration:underline;
}

/* Links inside navbar */.navbar-nav a.nav-link{
color:#f9f4ed;
/* venue bg color */  font-weight:600;
transition:color 0.3s ease;
text-decoration:none;
}

/* Navbar styles controlled purely by these classes */.navbar{
font-family:'Scheherazade New', serif;
background-color:#6a4a86 !important;
/* lighter purple */  box-shadow:0 2px 8px rgba(0, 0, 0, 0.2);
}

.masonry-item img,  .venue-gallery img,  .btn{
transition:none !important;
}

.section-title{
animation:fadeUp .8s var(--easing) .2s forwards;
opacity:0;
transform:translateY(10px);
font-family:var(--font-heading);
font-weight:700;
font-size:clamp(1.6rem, 2.4vw, 2.4rem);
letter-spacing:.02em;
color:var(--espresso);
margin:0 0 var(--space-4);
position:relative;
display:inline-block;
}

.gate{
animation:none;
display:none;
}

to{
opacity:1;
transform:translateY(0);
}

/* =========================   Animations   ========================= */@keyframes fadeUp{
from { opacity:0;
transform:translateY(10px);
}

.icon svg{
width:18px;
height:18px;
fill:var(--espresso);
}

.icon{
width:36px;
height:36px;
display:inline-grid;
place-items:center;
border-radius:999px;
background:white;
border:1px solid var(--line);
box-shadow:var(--shadow-soft);
}

.social{
display:flex;
gap:.5rem;
}

.footer-inner p{
margin:0;
color:var(--slate);
}

.footer-inner{
display:flex;
align-items:center;
justify-content:space-between;
gap:1rem;
padding:1rem 0;
flex-wrap:wrap;
}

/* =========================   Footer   ========================= */.site-footer{
border-top:1px solid var(--line);
background:rgba(194,178,128,.08);
}

.faq-item p{
margin:.5rem 0 0;
color:var(--slate);
}

.faq-item[open]{
border-color:color-mix(in oklab, var(--gold), black 8%);
}

.faq-item > summary::-webkit-details-marker{
display:none;
}

.faq-item > summary{
cursor:pointer;
font-weight:700;
list-style:none;
}

/* =========================   FAQ   ========================= */.faq-item{
background:white;
border:1px solid var(--line);
border-radius:12px;
padding:.9rem 1rem;
box-shadow:var(--shadow-soft);
margin-bottom:.75rem;
}

.masonry-item figcaption{
padding:.5rem .75rem;
color:var(--slate);
font-size:.9rem;
}

.masonry-item:hover img{
transform:scale(1.01);
}

.masonry-item img{
width:100%;
height:auto;
display:block;
object-fit:cover;
transition:transform .35s var(--easing);
}

@media (min-width: 700px){
.masonry { column-count:2;
}

/* =========================   Gallery (Masonry)   ========================= */.masonry{
column-count:1;
column-gap:var(--space-3);
}

.text-link{
font-weight:600;
}

.map-links{
display:flex;
gap:1rem;
flex-wrap:wrap;
padding:.75rem 1rem;
border-top:1px solid var(--line);
}

.map{
width:100%;
height:min(60vh, 420px);
border:0;
display:block;
}

.map-card{
background:white;
border:1px solid var(--line);
border-radius:var(--radius);
box-shadow:var(--shadow-soft);
overflow:hidden;
}

@media (min-width: 960px){
.travel-grid { grid-template-columns:1fr 1.2fr;
align-items:start;
.section--venue .venue-grid { grid-template-columns:1fr 1.2fr;
}

/* =========================   Travel & Map   ========================= */.travel-grid{
display:grid;
gap:var(--space-5);
grid-template-columns:1fr;
}

/* Honeypot (CSS-only, invisible to users) */.honeypot{
position:absolute;
left:-10000px;
width:1px;
height:1px;
overflow:hidden;
}

.form-status{
min-height:1.2em;
color:var(--sage);
margin-top:.25rem;
}

.privacy{
font-size:.95rem;
color:var(--slate);
margin-top:.25rem;
}

.field--inline input{
margin-right:.35rem;
}

.field--inline label{
font-weight:600;
}

.field--inline{
display:flex;
gap:1rem;
align-items:center;
}

.field input:focus-visible, .field textarea:focus-visible{
border-color:var(--gold);
outline:2px solid color-mix(in oklab, var(--gold), transparent 70%);
}

.field input[type="text"],.field input[type="email"],.field input[type="number"],.field textarea{
width:100%;
padding:.7rem .85rem;
border-radius:10px;
border:1px solid color-mix(in oklab, var(--slate), white 60%);
background:white;
color:var(--espresso);
}

.field label, .field legend{
font-weight:600;
color:var(--espresso);
}

.field{
display:grid;
gap:.4rem;
}

.rsvp-form{
margin-top:var(--space-4);
display:grid;
gap:var(--space-3);
max-width:640px;
}

@media (max-width: 560px){
.timeline-item { grid-template-columns:68px 1fr;
}

.timeline-item:hover .item-title,.timeline-item:focus-within .item-title{
color:var(--sage);
}

.timeline .content p{
margin:0;
color:var(--slate);
}

.timeline .item-title{
margin:0 0 .25rem;
font-family:var(--font-heading);
font-weight:700;
}

.timeline .time{
font-weight:700;
color:var(--espresso);
}

.timeline-item::before{
counter-increment:step;
content:counter(step);
position:absolute;
left:8px;
top:.25rem;
width:20px;
height:20px;
border-radius:50%;
background:var(--gold);
color:white;
font:700 .75rem/20px var(--font-body);
text-align:center;
box-shadow:0 0 0 3px var(--ivory);
}

.timeline-item{
position:relative;
display:grid;
grid-template-columns:80px 1fr;
gap:var(--space-3);
padding-left:20px;
margin-bottom:var(--space-4);
}

.timeline::before{
content:"";
position:absolute;
left:18px;
top:0;
bottom:0;
width:2px;
background:var(--line);
}

.timeline{
counter-reset:step;
list-style:none;
padding:0;
margin:0;
position:relative;
}

/* =========================   Schedule (Vertical Timeline)   ========================= */.section--schedule{
background:linear-gradient(180deg, rgba(194,178,128,.08), transparent);
}

.venue-gallery figcaption{
padding:.5rem .75rem;
color:var(--slate);
font-size:.9rem;
}

.venue-gallery figure:hover img{
transform:scale(1.02);
}

.venue-gallery img{
width:100%;
height:220px;
object-fit:cover;
display:block;
transition:transform .35s var(--easing);
}

.venue-gallery figure{
margin:0;
background:white;
border-radius:12px;
overflow:hidden;
box-shadow:var(--shadow-soft);
border:1px solid var(--line);
}

.venue-gallery{
display:grid;
gap:var(--space-3);
grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
}

.note{
color:var(--slate);
font-size:.95rem;
}

.venue-address .pin{
width:22px;
height:22px;
fill:var(--sage);
flex:0 0 auto;
margin-top:.15rem;
}

.venue-address{
display:flex;
align-items:start;
gap:.5rem;
margin:var(--space-3) 0;
font-style:normal;
background:white;
padding:.75rem 1rem;
border-radius:var(--radius);
box-shadow:var(--shadow-soft);
border:1px solid var(--line);
}

/* =========================   Venue   ========================= */.section--venue .venue-grid{
display:grid;
gap:var(--space-5);
grid-template-columns:1fr;
align-items:start;
}

@keyframes gateSlideRight{
to { transform:translateX(100%);
}

@keyframes gateSlide{
to { transform:translateX(-100%);
}

.gate--right{
right:0;
transform-origin:right;
animation-delay:.04s;
}

.gate--left{
left:0;
transform-origin:left;
animation-delay:.02s;
}

/* Wrought-iron "gate" panels */.gate{
position:absolute;
top:0;
bottom:0;
width:52%;
background:/* faux iron bars */    repeating-linear-gradient(90deg, rgba(255,255,255,.10) 0 2px, transparent 2px 18px),    linear-gradient(0deg, rgba(255,255,255,.08), rgba(255,255,255,.02));
border:1px solid rgba(255,255,255,.25);
backdrop-filter:blur(1px) brightness(0.9);
z-index:1;
transform:translateX(0);
animation:gateSlide var(--dur-slow) var(--easing) forwards;
box-shadow:inset 0 0 0 1px rgba(0,0,0,.08);
}

.hero-meta{
margin:0 0 var(--space-4);
font-weight:600;
letter-spacing:.06em;
text-transform:uppercase;
color:color-mix(in oklab, white, var(--ivory) 20%);
}

.hero-title{
font-family:var(--font-heading);
font-size:clamp(2.2rem, 5vw, 4rem);
line-height:1.15;
margin:0 0 .5rem;
text-shadow:0 2px 30px rgba(0,0,0,.35);
letter-spacing:.02em;
}

.hero-content{
position:relative;
z-index:2;
text-align:center;
color:white;
padding:0 var(--space-3);
}

.hero::after{
/* subtle vignette for text readability */  content:"";
position:absolute;
inset:0;
background:radial-gradient(120% 120% at 50% 20%, rgba(0,0,0,0) 0%, rgba(0,0,0,.25) 70%);
}

.hero-media{
position:absolute;
inset:0;
width:100%;
height:100%;
object-fit:cover;
filter:contrast(1.03) saturate(1.02);
}

/* =========================   Hero   ========================= */.hero{
position:relative;
min-height:clamp(70vh, 86vh, 92vh);
display:grid;
place-items:center;
overflow:hidden;
}

.nav-cta:hover{
text-decoration:none;
}

.nav-cta{
color:white;
background:var(--sage);
padding:.5rem .85rem;
border-radius:999px;
border:1px solid color-mix(in oklab, var(--sage), black 10%);
}

.nav-list a:hover::after, .nav-list a:focus-visible::after{
width:70%;
}

.nav-list a::after{
content:"";
position:absolute;
left:50%;
bottom:0;
transform:translateX(-50%);
height:2px;
width:0;
background:var(--gold);
transition:width .2s var(--easing);
}

.nav-list a{
position:relative;
padding:.35rem .25rem;
font-weight:600;
color:var(--espresso);
}

.nav-list{
list-style:none;
display:flex;
gap:clamp(.5rem, 2vw, 1.25rem);
margin:0;
padding:0;
}

.brand{
font-family:var(--font-heading);
font-weight:700;
font-size:1.25rem;
color:var(--espresso);
}

.site-nav{
width:var(--wrap);
margin:0 auto;
display:flex;
align-items:center;
justify-content:space-between;
gap:var(--space-4);
padding:.75rem 0;
}

.site-header{
position:sticky;
top:0;
z-index:999;
background:rgba(248,244,239,.82);
border-bottom:1px solid var(--line);
backdrop-filter:saturate(140%) blur(6px);
}

.skip-link:focus-visible{
left:1rem;
top:1rem;
width:auto;
height:auto;
padding:.5rem .75rem;
background:var(--gold);
color:var(--espresso);
border-radius:8px;
z-index:9999;
}

/* =========================   Header & Navigation   ========================= */.skip-link{
position:absolute;
left:-999px;
top:auto;
width:1px;
height:1px;
overflow:hidden;
}

.btn-primary{
--btn-bg:var(--espresso);
}

.btn:active{
transform:translateY(0);
}

.btn:hover{
transform:translateY(-1px);
}

/* Buttons */.btn{
--btn-bg:var(--sage);
--btn-fg:white;
display:inline-block;
padding:.75rem 1.25rem;
border-radius:999px;
background:var(--btn-bg);
color:var(--btn-fg);
font-weight:600;
letter-spacing:.02em;
border:1px solid color-mix(in oklab, var(--sage), black 12%);
box-shadow:var(--shadow-soft);
transition:transform var(--dur-quick) var(--easing), background var(--dur-quick) var(--easing);
}

/* Links & text */a{
color:var(--sage);
text-decoration:none;
}

:target .section-title::after{
background:linear-gradient(90deg, transparent, var(--sage), transparent);
}

/* Highlight section title when targeted via anchor */:target .section-title,.section:target .section-title{
color:var(--sage);
}

.section-title::after{
content:"";
display:block;
height:1px;
width:80%;
margin:var(--space-2) auto 0;
background:linear-gradient(90deg, transparent, var(--gold), transparent);
opacity:.8;
}

.section{
padding:4rem 1rem;
border-bottom:2px dotted #c0a16b;
}

/* Utility */.wrap{
width:var(--wrap);
margin-inline:auto;
}

/* A11y: focus styles */:focus-visible{
outline:2px solid var(--gold);
outline-offset:2px;
}

/* Global reset bits */body{
margin:0;
font-family:var(--font-body);
line-height:1.6;
color:var(--espresso);
background:/* subtle linen / paper effect using layered gradients (very light) */    radial-gradient(100% 100% at 0 0, rgba(0,0,0,.015), transparent 40%),    radial-gradient(120% 120% at 100% 0, rgba(0,0,0,.02), transparent 45%),    linear-gradient(0deg, rgba(255,255,255,.9), rgba(255,255,255,.9)),    var(--ivory);
background-attachment:fixed;
}

:root{
/* Palette */  --ivory:#F8F4EF;
--sage:#7B8A6D;
--gold:#C2B280;
--espresso:#2F2A26;
--slate:#5D656D;
/* Typography */  --font-heading:"Playfair Display", ui-serif, Georgia, serif;
--font-body:"Source Sans 3", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
/* Sizing & spacing */  --wrap:min(1120px, 92vw);
--radius:14px;
--space-1:.375rem;
--space-2:.625rem;
--space-3:1rem;
--space-4:1.5rem;
--space-5:2rem;
--space-6:3rem;
/* Effects */  --shadow-soft:0 8px 24px rgba(0,0,0,.06);
--line:rgba(47,42,38,0.12);
/* Motion */  --easing:cubic-bezier(0.16, 1, 0.3, 1);
--dur-quick:180ms;
--dur-slow:1.4s;
}

html{
scroll-behavior:smooth;
}

/* styles.css *//* =========================   Reset & CSS Variables   ========================= */*,*::before,*::after{
box-sizing:border-box;
}

links still in DOM */  .brand{
font-size:1.05rem;
}

.gallery-grid img{
height:200px;
}

.hero{
position:relative;
min-height:clamp(70vh, 86vh, 92vh);
display:grid;
place-items:center;
overflow:hidden;
}

.btn, .gallery-grid img{
transition:none;
}

.gate-left, .gate-right{
display:none;
animation:none;
}

/* ========= ANIMATIONS ========= */@keyframes gateLeft{
to { transform:translateX(-110%);
}

.social .icon:hover{
transform:translateY(-1px);
}

.social .icon{
display:inline-flex;
align-items:center;
justify-content:center;
width:36px;
height:36px;
border-radius:999px;
background:#fff;
color:var(--espresso);
border:1px solid rgba(47,42,38,.08);
}

/* ========= FOOTER ========= */.site-footer{
padding:2rem 0;
background:color-mix(in oklab, var(--ivory) 85%, white);
border-top:1px solid rgba(47,42,38,.08);
}

.faq details[open] summary{
color:var(--accent);
}

.faq summary::-webkit-details-marker{
display:none;
}

.faq summary{
cursor:pointer;
font-weight:700;
list-style:none;
}

/* ========= FAQ ========= */.faq details{
background:#fff;
border:1px solid rgba(47,42,38,.1);
border-radius:var(--radius);
padding:.75rem .9rem;
margin-bottom:.6rem;
}

.gallery-grid figcaption{
padding:.5rem .6rem;
font-size:.95rem;
}

.gallery-grid figure:hover img{
transform:scale(1.03);
}

.gallery-grid figure{
background:#fff;
border:1px solid rgba(47,42,38,.08);
border-radius:var(--radius);
overflow:hidden;
}

/* ========= GALLERY ========= */.gallery-grid{
display:grid;
gap:.8rem;
grid-template-columns:repeat(auto-fill, minmax(220px, 1fr));
}

.link:hover{
color:var(--accent);
}

.link{
color:var(--espresso);
}

.map-wrap iframe{
width:100%;
aspect-ratio:16/10;
border:0;
border-radius:var(--radius);
box-shadow:var(--shadow);
}

.map-wrap{
display:grid;
}

.travel-tips li{
margin:.25rem 0;
}

.travel-tips{
margin:.5rem 0 0;
}

/* ========= TRAVEL & MAP ========= */.travel-grid{
display:grid;
gap:clamp(1rem, 3vw, 2rem);
grid-template-columns:1.1fr 1.2fr;
}

/* Visually hidden (honeypot) */.visually-hidden{
position:absolute !important;
height:1px;
width:1px;
overflow:hidden;
clip:rect(1px, 1px, 1px, 1px);
white-space:nowrap;
}

.form-actions{
margin-top:.75rem;
}

.choices{
display:flex;
gap:1rem;
}

input:focus, textarea:focus{
outline:2px solid color-mix(in oklab, var(--accent) 70%, white);
outline-offset:1px;
}

input[type="text"], input[type="email"], input[type="number"], textarea{
font:inherit;
padding:.6rem .7rem;
border:1px solid rgba(47,42,38,.25);
border-radius:8px;
background:#fff;
}

label, legend{
font-weight:600;
}

.form-row{
display:grid;
gap:.4rem;
}

/* ========= RSVP FORM ========= */.rsvp-form{
background:#fff;
border:1px solid rgba(47,42,38,.08);
padding:1rem;
border-radius:var(--radius);
box-shadow:var(--shadow);
}

.timeline li:hover .card, .timeline li:focus-within .card{
border-color:var(--accent);
}

.timeline .card{
background:#fff;
border:1px solid rgba(47,42,38,.08);
border-radius:var(--radius);
padding:.75rem .9rem;
}

.timeline time{
display:inline-block;
font-weight:700;
color:var(--espresso);
}

.timeline > li::before{
content:"";
position:absolute;
left:-.1rem;
top:.35rem;
width:.6rem;
height:.6rem;
border-radius:50%;
background:var(--accent);
box-shadow:0 0 0 4px rgba(123,138,109,.18);
}

.timeline > li{
position:relative;
padding-left:1.5rem;
margin:0 0 1rem;
}

/* ========= TIMELINE ========= */.timeline{
list-style:none;
margin:1rem 0 0;
padding:0 0 0 1rem;
position:relative;
counter-reset:step;
}

.venue-copy p{
margin:0 0 1rem;
}

/* ========= VENUE ========= */.venue-grid{
display:grid;
gap:clamp(1rem, 3vw, 2rem);
grid-template-columns:1.1fr 1.2fr;
}

.btn-primary:active{
transform:translateY(0);
}

.btn-primary:hover, .btn-primary:focus-visible{
transform:translateY(-1px);
}

/* ========= BUTTONS ========= */.btn{
display:inline-block;
padding:.65rem 1.1rem;
border-radius:999px;
border:1px solid transparent;
font-weight:600;
line-height:1;
transition:transform .18s cubic-bezier(.16,1,.3,1), box-shadow .18s;
}

.flourish{
display:grid;
place-items:center;
color:var(--accent-2);
}

.subhead{
font-size:clamp(1.05rem,2vw,1.125rem);
color:var(--muted);
}

.display{
font-size:clamp(2.4rem,6vw,4.25rem);
}

.gate-right{
right:0;
background:var(--gate-right-url) right center/200% 130% no-repeat;
}

.gate-left{
left:0;
background:var(--gate-left-url) left center/200% 130% no-repeat;
}

/* Decorative wrought-iron gates (two sliding panels) */.gate{
position:absolute;
top:0;
bottom:0;
width:52%;
background:repeating-linear-gradient(90deg, rgba(47,42,38,.8) 0 2px, transparent 2px 28px),    repeating-linear-gradient(0deg, rgba(47,42,38,.8) 0 2px, transparent 2px 28px),    linear-gradient(rgba(47,42,38,.14), rgba(47,42,38,.22));
mix-blend-mode:multiply;
box-shadow:inset 0 0 0 2px rgba(47,42,38,.25);
will-change:transform;
}

/* ========= HERO ========= */.hero{
padding:0;
min-height:72vh;
display:grid;
place-items:center;
color:var(--espresso);
position:relative;
overflow:hidden;
}

.nav-toggle{
list is always visible in this simple build */  background:transparent;
border:0;
color:var(--espresso);
display:none;
font-size:1.2rem;
}

/* ========= HEADER / NAV ========= */.site-header{
position:sticky;
top:0;
z-index:999;
background:rgba(248,244,239,.85);
backdrop-filter:blur(6px);
border-bottom:1px solid rgba(47,42,38,.08);
}

/* Highlight active section title via :target */section:target .section-title{
color:var(--accent);
}

/* Section headings: fade-up on load (non scroll-dependent) */.section-title{
font-size:clamp(1.6rem, 2.2vw, 2.2rem);
font-weight:700;
letter-spacing:.02em;
display:inline-block;
position:relative;
opacity:0;
transform:translateY(12px);
animation:fadeUp .8s cubic-bezier(.16,1,.3,1) .2s forwards;
}

.section-ivory{
background:#fff;
}

.container{
width:min(1100px,92%);
}

/* ========= LAYOUT WRAPPER ========= */#wedding-site{
position:relative;
z-index:1;
}

.skip-link:focus{
left:.5rem;
top:.5rem;
}

/* Accessible skip link */.skip-link{
position:absolute;
left:-9999px;
top:auto;
background:var(--espresso);
color:white;
padding:.5rem .75rem;
border-radius:8px;
}

h1, h2, h3{
font-family:"Playfair Display", Georgia, serif;
line-height:1.25;
color:var(--espresso);
margin:0 0 .6rem 0;
text-wrap:balance;
}

a{
font-family:Verdana, Arial, sans-serif;
font-size:12px;
color:rgb(85, 85, 85);
text-decoration:none;
}

img{
display:block;
max-width:100%;
}

/* Subtle paper texture using layered gradients (no images) */body::before{
content:"";
position:fixed;
inset:0;
pointer-events:none;
background:radial-gradient(1000px 600px at 20% -10%, rgba(194,178,128,.06), transparent 60%),    radial-gradient(900px 500px at 120% 10%, rgba(123,138,109,.05), transparent 60%),    linear-gradient(transparent 0 98%, rgba(0,0,0,.03) 98% 100%);
mix-blend-mode:multiply;
opacity:.6;
z-index:0;
}

body{
margin:0;
font-family:var(--font-body);
line-height:1.6;
color:var(--espresso);
background:/* subtle linen / paper effect using layered gradients (very light) */    radial-gradient(100% 100% at 0 0, rgba(0,0,0,.015), transparent 40%),    radial-gradient(120% 120% at 100% 0, rgba(0,0,0,.02), transparent 45%),    linear-gradient(0deg, rgba(255,255,255,.9), rgba(255,255,255,.9)),    var(--ivory);
background-attachment:fixed;
}

*,*::before,*::after{
box-sizing:border-box;
}

/* styles.css *//* ========= RESET & ROOT ========= */:root{
--ivory:#F8F4EF;
--sage:#7B8A6D;
--gold:#C2B280;
--espresso:#2F2A26;
--slate:#5D656D;
--bg:var(--ivory);
--text:var(--espresso);
--muted:var(--slate);
--accent:var(--sage);
--accent-2:var(--gold);
--radius:12px;
--shadow:0 8px 20px rgba(47,42,38,.08);
}

.cta-wrap{
margin-top:1.4rem;
}

.btn,.gallery-grid img,.nav-list a::after{
transition:none;
}

.gate-left,.gate-right{
display:none;
}

/* ======================= ANIMATIONS ===================== */@keyframes gateLeft{
to{transform:translateX(-110%);
}

/* ========================= FOOTER ======================= */.site-footer{
padding:2rem 0;
background:color-mix(in oklab,var(--ivory) 85%, white);
border-top:1px solid rgba(47,42,38,.08);
}

/* ========================== FAQ ========================= */.faq details{
background:#fff;
border:1px solid rgba(47,42,38,.1);
border-radius:var(--radius);
padding:.75rem .9rem;
}

/* ======================== GALLERY ======================= */.gallery-grid{
display:grid;
gap:.8rem;
}

/* ===================== TRAVEL & MAP ===================== */.travel-grid{
display:grid;
gap:clamp(1rem,3vw,2rem);
}

.visually-hidden{
position:absolute !important;
height:1px;
width:1px;
overflow:hidden;
clip:rect(1px, 1px, 1px, 1px);
white-space:nowrap;
}

input:focus,textarea:focus{
outline:2px solid color-mix(in oklab,var(--accent) 70%,white);
}

input[type="text"],input[type="email"],input[type="number"],textarea{
font:inherit;
padding:.6rem .7rem;
border:1px solid rgba(47,42,38,.25);
border-radius:8px;
}

label,legend{
font-weight:600;
}

/* ========================= RSVP ========================= */.rsvp-form{
background:#fff;
border:1px solid rgba(47,42,38,.08);
padding:1rem;
border-radius:var(--radius);
}

.timeline li:hover .card,.timeline li:focus-within .card{
border-color:var(--accent);
}

.timeline>li::before{
content:"";
position:absolute;
left:-.1rem;
top:.35rem;
width:.6rem;
height:.6rem;
border-radius:50%;
background:var(--accent);
box-shadow:0 0 0 4px rgba(123,138,109,.18);
}

.timeline>li{
position:relative;
padding-left:1.5rem;
}

/* ======================== SCHEDULE ====================== */.timeline{
list-style:none;
margin:1rem 0 0;
padding:0 0 0 1rem;
position:relative;
}

/* ========================= VENUE ======================== */.venue-grid{
display:grid;
gap:clamp(1rem,3vw,2rem);
}

.btn-primary:hover,.btn-primary:focus-visible{
transform:translateY(-1px);
}

.btn{
--btn-bg:var(--sage);
--btn-fg:white;
display:inline-block;
padding:.75rem 1.25rem;
border-radius:999px;
background:var(--btn-bg);
color:var(--btn-fg);
font-weight:600;
letter-spacing:.02em;
border:1px solid color-mix(in oklab, var(--sage), black 12%);
box-shadow:var(--shadow-soft);
transition:transform var(--dur-quick) var(--easing), background var(--dur-quick) var(--easing);
}

/* Gate panels (optional images) */.gate{
position:absolute;
top:0;
bottom:0;
width:52%;
will-change:transform;
mix-blend-mode:multiply;
box-shadow:inset 0 0 0 2px rgba(47,42,38,.25);
}

.hero-overlay{
position:absolute;
inset:0;
z-index:-1;
}

.hero-img{
position:absolute;
inset:0;
width:100%;
height:100%;
object-fit:cover;
}

/* ========================= HERO ========================= */.hero{
padding:0;
min-height:72vh;
display:grid;
place-items:center;
position:relative;
overflow:hidden;
}

.nav-list a:hover::after,.nav-list a:focus-visible::after{
width:80%;
}

/* ====================== HEADER / NAV ===================== */.site-header{
position:sticky;
top:0;
z-index:999;
background:rgba(248,244,239,.85);
backdrop-filter:blur(6px);
border-bottom:1px solid rgba(47,42,38,.08);
margin:0;
padding:0;
}

section:target .section-title{
color:var(--accent);
}

/* Section title: soft fade-up */.section-title{
font-size:clamp(1.6rem,2.2vw,2.2rem);
font-weight:700;
letter-spacing:.02em;
opacity:0;
transform:translateY(12px);
}

/* ======================= LAYOUT UTILS ==================== */#wedding-site{
position:relative;
}

/* Skip to content */.skip-link{
position:absolute;
left:-9999px;
top:auto;
background:var(--espresso);
color:#fff;
padding:.5rem .75rem;
}

/* Subtle paper / linen texture (no images) */body::before{
content:"";
position:fixed;
inset:0;
pointer-events:none;
z-index:0;
opacity:.6;
mix-blend-mode:multiply;
background:radial-gradient(1000px 600px at 20% -10%, rgba(194,178,128,.06), transparent 60%),    radial-gradient(900px 500px at 120% 10%, rgba(123,138,109,.05), transparent 60%),    linear-gradient(transparent 0 98%, rgba(0,0,0,.03) 98% 100%);
}

h1,h2,h3{
font-family:"Playfair Display",Georgia,serif;
line-height:1.25;
color:var(--espresso);
}

a:focus-visible{
outline:2px solid color-mix(in oklab,var(--accent) 70%,white);
outline-offset:2px;
}

html,body{
margin:0;
}

/* ====================== BASE / RESET ===================== */*,*::before,*::after{
box-sizing:border-box;
}

/* ===================== ROOT / THEME ===================== */:root{
--ivory:#F8F4EF;
--sage:#7B8A6D;
--gold:#C2B280;
--espresso:#2F2A26;
--slate:#5D656D;
--bg:var(--ivory);
--text:var(--espresso);
--muted:var(--slate);
--accent:var(--sage);
--accent-2:var(--gold);
--radius:12px;
--shadow:0 8px 20px rgba(47,42,38,.08);
--gate-left-url:url("https;
--gate-right-url:url("https;
}

/* === VENUE, SCHEDULE, RSVP, MAP, GALLERY, FAQ, FOOTER === *//* ... [keep all the section styles as before] ... *//* ======================= ANIMATIONS ===================== */@keyframes gateLeft{
to{transform:translateX(-110%);
}

/* ======================= LAYOUT ==================== */#wedding-site{
position:relative;
}

/* Paper texture */body::before{
content:"";
position:fixed;
inset:0;
pointer-events:none;
z-index:0;
opacity:.6;
mix-blend-mode:multiply;
background:radial-gradient(1000px 600px at 20% -10%, rgba(194,178,128,.06), transparent 60%),    radial-gradient(900px 500px at 120% 10%, rgba(123,138,109,.05), transparent 60%),    linear-gradient(transparent 0 98%, rgba(0,0,0,.03) 98% 100%);
}

/* 9) Safety: no extra z-index layers above the video */#wb-layout-header-base,#wb-layout-header-mask,#wb-container-outer{
z-index:0 !important;
}

/* 8) Keep our anchor scroll offsets accurate (builder sometimes adds sticky spacing) */.site-header,#wb-layout-header-base,#wb-navigation,#wb-navigation-top,#wb-navigation-bottom{
position:static !important;
/* disable builder sticky behavior */  height:auto !important;
}

/* 7) Don’t let any default “hero” skin interfere with our hero */.hero,.hero-img,.hero-image,.hero-media,.hero-overlay{
background:transparent !important;
box-shadow:none !important;
border:0 !important;
}

/* 6) Avoid unexpected background colors on generic “section” skins */.section,.section-ivory,.bg-light{
background:transparent !important;
border:0 !important;
}

/* 5) Ensure builder containers don’t add margins/width caps around our layout */#wb-container-inner,#wb-container-contentwrapper,#wb-layout-header-base,#wb-layout-header-mask{
max-width:100% !important;
width:100% !important;
margin:0 !important;
padding:0 !important;
background:transparent !important;
}

/* 4) Remove thin side borders & extra gutters on the main wrapper */#wb-layout-main{
border:0 !important;
/* kills the 5px left border */  padding:0 !important;
background:transparent !important;
}

/* 3) Remove forced top nav strip & divider line */#wb-navigation,#wb-navigation-top,#wb-navigation-bottom{
background:transparent !important;
border:0 !important;
padding:0 !important;
}

/* 2) Neutralize builder header/footer shells that create a white band */#wb-container-outer,#wb-layout-header-base,#wb-layout-header-mask,#wb-layout-footer{
background:transparent !important;
min-height:0 !important;
border:0 !important;
}

/* ==== Builder Overrides to Respect Inline Single-File Site ==== *//* 1) Put paper texture behind everything (prevents white veil over video) */body::before{
z-index:-1 !important;
}

/* (Optional) If any residual white comes from builder “section” class */.section-ivory,.section{
background:transparent !important;
}

/* 5) Keep hero on top of any builder wrappers */#hero{
position:relative;
z-index:0;
}

/* 4) Ensure the paper texture sits *behind* the video */body::before{
z-index:-1 !important;
}

#wb-container-inner,#wb-container-contentwrapper,#wb-layout-header-base,#wb-layout-header-mask{
max-width:100% !important;
width:100% !important;
margin:0 !important;
padding:0 !important;
background:transparent !important;
}

/* 3) Remove the thin left/right borders and extra gutters */#wb-layout-main{
border:0 !important;
/* removes the 5px left border */  padding:0 !important;
}

/* 2) Remove forced white nav strip & divider line */#wb-navigation,#wb-navigation-top,#wb-navigation-bottom{
background:transparent !important;
border:0 !important;
padding:0 !important;
}

/* ===== Website Builder Overrides (non-destructive) ===== *//* 1) Kill the white bar above the video (builder header shell) */#wb-container-outer,#wb-layout-header-base,#wb-layout-header-mask,#wb-layout-footer{
background:transparent !important;
min-height:0 !important;
border:0 !important;
}

/* 5) Common flex/grid rows: center children (prevents “glued left”) */  [class*="row"], [class*="grid"], .flex, .flex-row,  .transport__row, .registry__qr-flex, .registry__eu-grid, .footer__inner{
justify-content:center !important;
align-items:center !important;
gap:clamp(10px, 3vw, 18px) !important;
}

/* 4) Media & embeds: cannot exceed frame and are visually centered */  img, video, svg, canvas, iframe{
display:block !important;
max-width:100% !important;
height:auto !important;
margin-left:auto !important;
margin-right:auto !important;
line-height:0 !important;
transform:none !important;
}

/* 3) Any direct child blocks: allow shrink + keep centered */  header > *, footer > *, section > *,  .wb-container-inner > *, .wb-container > *,  [class*="wb-container"] > *{
min-width:0 !important;
max-width:100% !important;
margin-left:auto !important;
margin-right:auto !important;
box-sizing:border-box !important;
}

/* 2) Builder wrappers: remove hidden offsets and re-center */  /* Targets common Network Solutions / drag-and-drop wrapper patterns */  .wb-container-outer, .wb-container, .wb-container-inner,  [class*="wb-outer"], [class*="wb-container"], [id*="wb-container"],  [class*="container"], [id*="container"]{
width:var(--cap) !important;
max-width:100% !important;
margin-left:auto !important;
margin-right:auto !important;
/* Nuke surprise side paddings / margins / shifts */    padding-left:0 !important;
padding-right:0 !important;
margin-inline:auto !important;
left:auto !important;
right:auto !important;
transform:none !important;
position:relative !important;
box-sizing:border-box !important;
text-align:center !important;
}

backgrounds clipped inside 95vw */  header, footer, section,  #hero, #countdown, #location, #divider-strip, #transportation,  #accommodation, #agenda, #ceremony, #rsvp, #registry, #faq, #site-footer{
width:100vw !important;
padding-left:var(--frame) !important;
padding-right:var(--frame) !important;
box-sizing:border-box !important;
background-clip:content-box !important;
-webkit-background-clip:content-box !important;
margin:0 auto !important;
overflow-x:clip !important;
}

/* 0) Zero chance of horizontal scroll */  html, body{
margin:0 !important;
max-width:100vw !important;
overflow-x:hidden !important;
}

/* ===========================================================   PORTRAIT HARD CLAMP (Builder CSS) — cap ALL content to 95vw   and re-center, regardless of builder padding/transforms.   =========================================================== */@media (orientation: portrait){
/* 2.5vw + 2.5vw = 95vw */    --cap:calc(100vw - var(--frame) * 2);
}

/* 10) If the builder nests your code in an iframe-like box, neutralize it */iframe, .iframe, .embed{
border:0 !important;
background:transparent !important;
width:100% !important;
max-width:100% !important;
}

/* 9) Box model sanity */*, *::before, *::after{
box-sizing:border-box !important;
}

/* 7) Kill any fixed page padding the builder may add on small screens */@media (max-width: 1024px){
html, body,  #wrapper, #page, .site, .container, .row, .ns-container, .ns-section {    padding-left:0 !important;
padding-right:0 !important;
}

remove them */[class*="col"], [class*="column"], [class*="span"]{
min-width:0 !important;
}

pre, code{
white-space:pre-wrap !important;
word-wrap:break-word !important;
}

/* 5) Tables, pre/code blocks shouldn’t blow out the viewport */table{
width:100% !important;
border-collapse:collapse !important;
}

/* 4) Make sure media can span the container and never force sideways scroll */img, video, svg, canvas, iframe{
display:block !important;
max-width:100% !important;
height:auto !important;
border:0 !important;
}

/* 3) Kill any default typography/colors the builder applies */body, #wedding-site, #wedding-site *{
font:inherit !important;
color:inherit !important;
line-height:inherit !important;
letter-spacing:inherit !important;
text-transform:none !important;
text-decoration-thickness:inherit !important;
}

/* 2) If your HTML is wrapped in #wedding-site, make it the edge-to-edge host */#wedding-site{
margin:0 !important;
padding:0 !important;
width:100vw !important;
max-width:100vw !important;
position:relative !important;
}

/* 1) Common builder wrappers — kill padding/max-width/borders/shadows */#content, #main, #main-content, #wrapper, #page, #page-wrapper,.site, .site-wrapper, .container, .row, .col,.ns-container, .ns-section, .ns-row, .ns-col,.editor-canvas, .builder-wrap, .custom-html, .code-block, .widget, .module{
margin:0 !important;
padding:0 !important;
width:100vw !important;
max-width:100vw !important;
border:0 !important;
box-shadow:none !important;
background:transparent !important;
box-sizing:border-box !important;
}

relies on targeted !important overrides.*************************************************************************//* 0) Ensure the page can actually fill the screen */html, body{
margin:0 !important;
padding:0 !important;
width:100% !important;
max-width:100% !important;
min-height:100% !important;
overflow-x:hidden !important;
background:#fff;
}

/* 8) If builder nests your block in an iframe-like element, remove chrome */iframe, .iframe, .embed{
width:100% !important;
max-width:100% !important;
border:0 !important;
background:transparent !important;
}

force them to shrink */[class*="col"], [class*="column"], [class*="span"]{
min-width:0 !important;
}

/* 5) Stop fixed paddings on small screens */@media (max-width: 1024px){
html, body,  #wrapper, #page, .site, .container, .row, .ns-container, .ns-section {    padding-left:0 !important;
padding-right:0 !important;
}

/* 4) Media and embeds must never overflow */img, video, svg, canvas, iframe{
display:block !important;
max-width:100% !important;
height:auto !important;
border:0 !important;
}

/* 3) Kill builder defaults that distort layout/typography */body, #wedding-site, #wedding-site *{
font:inherit !important;
color:inherit !important;
line-height:inherit !important;
letter-spacing:inherit !important;
text-transform:none !important;
text-decoration:inherit !important;
}

/* 2) If your code sits inside a named wrapper, make it edge-to-edge */#wedding-site{
margin:0 !important;
padding:0 !important;
width:100vw !important;
max-width:100vw !important;
min-height:100svh !important;
/* visual viewport height */  position:relative !important;
isolation:isolate !important;
}

/* 1) Nuke all common Network Solutions / builder shells */#content, #main, #main-content, #wrapper, #page, #page-wrapper,.site, .site-wrapper, .container, .row, .col,.ns-container, .ns-section, .ns-row, .ns-col,.editor-canvas, .builder-wrap, .custom-html, .code-block, .widget, .module{
margin:0 !important;
padding:0 !important;
width:100vw !important;
max-width:100vw !important;
min-width:0 !important;
min-height:0 !important;
border:0 !important;
outline:0 !important;
box-shadow:none !important;
background:transparent !important;
position:static !important;
/* stop relative/absolute offsets */  left:auto !important;
right:auto !important;
transform:none !important;
}

*, *::before, *::after{
box-sizing:border-box !important;
}

/******** HARD OVERRIDE: Builder wrapper neutralizer ********//* 0) Viewport + box model */html, body{
margin:0 !important;
padding:0 !important;
width:100% !important;
max-width:100% !important;
min-height:100% !important;
overflow-x:hidden !important;
-webkit-text-size-adjust:100% !important;
}

/* Force all your own content wrapper edge-to-edge */#wedding-site{
position:relative !important;
width:100vw !important;
max-width:100vw !important;
overflow-x:clip !important;
margin:0 !important;
padding:0 !important;
}

/* Side navigation: prevent fixed 205 px column */#wb-navigation,#wb-navigation-top,#wb-navigation-bottom{
width:100% !important;
float:none !important;
}

/* Footer fix: remove the 960 px cap */#wb-layout-footer{
min-height:0 !important;
height:auto !important;
}

/* Ensure your actual page fills screen height */html, body, #wedding-site{
width:100% !important;
height:100% !important;
min-height:100svh !important;
overflow-x:hidden !important;
}

#wb-container-contentwrapper,#wb-container-inner,#wb-container-outer,#wb-layout-header,#wb-layout-header-base,#wb-layout-header-mask,#wb-layout-main,#wb-layout-footer,#wb-layout-sidebar,#wb-navigation,#wb-navigation-top,#wb-navigation-bottom{
width:100vw !important;
max-width:100vw !important;
min-width:0 !important;
float:none !important;
margin:0 auto !important;
padding:0 !important;
border:0 !important;
background:transparent !important;
box-sizing:border-box !important;
}

#wb-navigation-subtop,#wb-navigation-subtop div.submenu,div.submenu{
display:none;
background-color:#CCCCCC;
}

@media (min-width: 768px){
#wb-layout-sidebar {    width:25%;
}

#wb-navigation, #wb-navigation-top, #wb-navigation-bottom{
background-color:transparent;
width:100%;
padding:5px 0;
}

footer{
background:linear-gradient(to right, #42275a, #734b6d);
color:white;
text-align:center;
padding:1rem 0;
}

.map-container{
margin-top:2rem;
border:2px solid #c0a16b;
border-radius:8px;
overflow:hidden;
height:400px;
}

.hero-image{
background-image:url('https;
background-size:cover;
background-position:center;
background-attachment:fixed;
height:100vh;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
color:#fdf5e6;
position:relative;
}

.navbar-toggler{
border-color:#f9f4ed;
}

.navbar-brand{
color:#f9f4ed;
/* venue bg color */  font-weight:700;
font-size:1.5rem;
text-decoration:none;
}

.navbar-nav a.nav-link{
color:#f9f4ed;
/* venue bg color */  font-weight:600;
transition:color 0.3s ease;
text-decoration:none;
}

.navbar{
font-family:'Scheherazade New', serif;
background-color:#6a4a86 !important;
/* lighter purple */  box-shadow:0 2px 8px rgba(0, 0, 0, 0.2);
}

@keyframes fadeUp{
from { opacity:0;
transform:translateY(10px);
}

.faq-item{
background:white;
border:1px solid var(--line);
border-radius:12px;
padding:.9rem 1rem;
box-shadow:var(--shadow-soft);
margin-bottom:.75rem;
}

.masonry{
column-count:1;
column-gap:var(--space-3);
}

.honeypot{
position:absolute;
left:-10000px;
width:1px;
height:1px;
overflow:hidden;
}

.section--schedule{
background:linear-gradient(180deg, rgba(194,178,128,.08), transparent);
}

.section--venue .venue-grid{
display:grid;
gap:var(--space-5);
grid-template-columns:1fr;
align-items:start;
}

:target .section-title,.section:target .section-title{
color:var(--sage);
}

.wrap{
width:var(--wrap);
margin-inline:auto;
}

:focus-visible{
outline:2px solid var(--gold);
outline-offset:2px;
}

.site-footer{
border-top:1px solid var(--line);
background:rgba(194,178,128,.08);
}

.faq details{
background:#fff;
border:1px solid rgba(47,42,38,.1);
border-radius:var(--radius);
padding:.75rem .9rem;
margin-bottom:.6rem;
}

.gallery-grid{
display:grid;
gap:.8rem;
grid-template-columns:repeat(auto-fill, minmax(220px, 1fr));
}

.travel-grid{
display:grid;
gap:var(--space-5);
grid-template-columns:1fr;
}

.venue-grid{
display:grid;
gap:clamp(1rem, 3vw, 2rem);
grid-template-columns:1.1fr 1.2fr;
}

.skip-link{
position:absolute;
left:-999px;
top:auto;
width:1px;
height:1px;
overflow:hidden;
}

@keyframes gateLeft{
to { transform:translateX(-110%);
}

#wb-layout-header-base,#wb-layout-header-mask,#wb-container-outer{
z-index:0 !important;
}

.site-header,#wb-layout-header-base,#wb-navigation,#wb-navigation-top,#wb-navigation-bottom{
position:static !important;
/* disable builder sticky behavior */  height:auto !important;
}

.hero,.hero-img,.hero-image,.hero-media,.hero-overlay{
background:transparent !important;
box-shadow:none !important;
border:0 !important;
}

.section,.section-ivory,.bg-light{
background:transparent !important;
border:0 !important;
}

.section-ivory,.section{
background:transparent !important;
}

#hero{
position:relative;
z-index:0;
}

body::before{
content:"";
position:fixed;
inset:0;
pointer-events:none;
background:radial-gradient(1000px 600px at 20% -10%, rgba(194,178,128,.06), transparent 60%),    radial-gradient(900px 500px at 120% 10%, rgba(123,138,109,.05), transparent 60%),    linear-gradient(transparent 0 98%, rgba(0,0,0,.03) 98% 100%);
mix-blend-mode:multiply;
opacity:.6;
z-index:0;
}

#wb-navigation,#wb-navigation-top,#wb-navigation-bottom{
background-color:transparent;
width:100%;
padding:5px 0;
}

#wb-container-outer,#wb-layout-header-base,#wb-layout-header-mask,#wb-layout-footer{
background:transparent !important;
min-height:0 !important;
border:0 !important;
}

[class*="row"], [class*="grid"], .flex, .flex-row,  .transport__row, .registry__qr-flex, .registry__eu-grid, .footer__inner{
justify-content:center !important;
align-items:center !important;
gap:clamp(10px, 3vw, 18px) !important;
}

header > *, footer > *, section > *,  .wb-container-inner > *, .wb-container > *,  [class*="wb-container"] > *{
min-width:0 !important;
max-width:100% !important;
margin-left:auto !important;
margin-right:auto !important;
box-sizing:border-box !important;
}

.wb-container-outer, .wb-container, .wb-container-inner,  [class*="wb-outer"], [class*="wb-container"], [id*="wb-container"],  [class*="container"], [id*="container"]{
width:var(--cap) !important;
max-width:100% !important;
margin-left:auto !important;
margin-right:auto !important;
/* Nuke surprise side paddings / margins / shifts */    padding-left:0 !important;
padding-right:0 !important;
margin-inline:auto !important;
left:auto !important;
right:auto !important;
transform:none !important;
position:relative !important;
box-sizing:border-box !important;
text-align:center !important;
}

header, footer, section,  #hero, #countdown, #location, #divider-strip, #transportation,  #accommodation, #agenda, #ceremony, #rsvp, #registry, #faq, #site-footer{
width:100vw !important;
padding-left:var(--frame) !important;
padding-right:var(--frame) !important;
box-sizing:border-box !important;
background-clip:content-box !important;
-webkit-background-clip:content-box !important;
margin:0 auto !important;
overflow-x:clip !important;
}

@media (orientation: portrait){
/* 2.5vw + 2.5vw = 95vw */    --cap:calc(100vw - var(--frame) * 2);
}

table{
width:100% !important;
border-collapse:collapse !important;
}

iframe, .iframe, .embed{
border:0 !important;
background:transparent !important;
width:100% !important;
max-width:100% !important;
}

[class*="col"], [class*="column"], [class*="span"]{
min-width:0 !important;
}

@media (max-width: 1024px){
html, body,  #wrapper, #page, .site, .container, .row, .ns-container, .ns-section {    padding-left:0 !important;
padding-right:0 !important;
}

img, video, svg, canvas, iframe{
display:block !important;
max-width:100% !important;
height:auto !important;
margin-left:auto !important;
margin-right:auto !important;
line-height:0 !important;
transform:none !important;
}

body, #wedding-site, #wedding-site *{
font:inherit !important;
color:inherit !important;
line-height:inherit !important;
letter-spacing:inherit !important;
text-transform:none !important;
text-decoration-thickness:inherit !important;
}

#wedding-site{
position:relative;
z-index:1;
}

#content, #main, #main-content, #wrapper, #page, #page-wrapper,.site, .site-wrapper, .container, .row, .col,.ns-container, .ns-section, .ns-row, .ns-col,.editor-canvas, .builder-wrap, .custom-html, .code-block, .widget, .module{
margin:0 !important;
padding:0 !important;
width:100vw !important;
max-width:100vw !important;
border:0 !important;
box-shadow:none !important;
background:transparent !important;
box-sizing:border-box !important;
}

*.wb-text-content{
font-family:verdana, arial, sans-serif;
font-size:12px;
font-weight:normal;
color:rgb(0, 0, 0);
font-style:normal;
}

*#wb-container-outer a:link{
font-family:verdana, arial, sans-serif;
font-size:12px;
font-weight:normal;
color:rgb(85, 85, 85);
font-style:normal;
}

*#wb-container-outer a:active{
font-family:verdana, arial, sans-serif;
font-size:12px;
font-weight:normal;
color:rgb(85, 85, 85);
font-style:normal;
}

*#wb-container-outer a:visited{
font-family:verdana, arial, sans-serif;
font-size:12px;
font-weight:normal;
color:rgb(85, 85, 85);
font-style:normal;
}

*#wb-container-outer a:hover{
font-family:verdana, arial, sans-serif;
font-size:12px;
font-weight:normal;
color:rgb(136, 136, 136);
font-style:normal;
}

*#wb-navigation-subtop div a{
font-family:verdana, arial, sans-serif;
font-size:11px;
font-weight:bold;
color:rgb(136, 136, 136);
font-style:normal;
}

*#wb-navigation-subtop div a:link{
font-family:verdana, arial, sans-serif;
font-size:11px;
font-weight:bold;
color:rgb(136, 136, 136);
font-style:normal;
}

*#wb-navigation-subtop div a:visited{
font-family:verdana, arial, sans-serif;
font-size:11px;
font-weight:bold;
color:rgb(136, 136, 136);
font-style:normal;
}

*#wb-navigation-subtop div a:active{
font-family:verdana, arial, sans-serif;
font-size:11px;
font-weight:bold;
color:rgb(136, 136, 136);
font-style:normal;
}

*#wb-navigation-subtop div a h3{
font-family:verdana, arial, sans-serif;
font-size:11px;
font-weight:bold;
color:rgb(136, 136, 136);
font-style:normal;
}

*#wb-navigation-subtop-header div a{
font-family:verdana, arial, sans-serif;
font-size:11px;
font-weight:bold;
color:rgb(136, 136, 136);
font-style:normal;
}

*#wb-navigation-subtop-header div a:link{
font-family:verdana, arial, sans-serif;
font-size:11px;
font-weight:bold;
color:rgb(136, 136, 136);
font-style:normal;
}

*#wb-navigation-subtop-header div a:visited{
font-family:verdana, arial, sans-serif;
font-size:11px;
font-weight:bold;
color:rgb(136, 136, 136);
font-style:normal;
}

*#wb-navigation-subtop-header div a:active{
font-family:verdana, arial, sans-serif;
font-size:11px;
font-weight:bold;
color:rgb(136, 136, 136);
font-style:normal;
}

*#wb-navigation-subtop-header div a h3{
font-family:verdana, arial, sans-serif;
font-size:11px;
font-weight:bold;
color:rgb(136, 136, 136);
font-style:normal;
}

*#wb-navigation-bottom div a{
font-family:verdana, arial, sans-serif;
font-size:11px;
font-weight:bold;
color:rgb(136, 136, 136);
font-style:normal;
}

*#wb-navigation-bottom div a:link{
font-family:verdana, arial, sans-serif;
font-size:11px;
font-weight:bold;
color:rgb(136, 136, 136);
font-style:normal;
}

*#wb-navigation-bottom div a:active{
font-family:verdana, arial, sans-serif;
font-size:11px;
font-weight:bold;
color:rgb(136, 136, 136);
font-style:normal;
}

*#wb-navigation-bottom div a:visited{
font-family:verdana, arial, sans-serif;
font-size:11px;
font-weight:bold;
color:rgb(136, 136, 136);
font-style:normal;
}

*#wb-navigation-bottom div a h3{
font-family:verdana, arial, sans-serif;
font-size:11px;
font-weight:bold;
color:rgb(136, 136, 136);
font-style:normal;
}

*#wb-navigation-bottom-header div a{
font-family:verdana, arial, sans-serif;
font-size:11px;
font-weight:bold;
color:rgb(136, 136, 136);
font-style:normal;
}

*#wb-navigation-bottom-header div a:link{
font-family:verdana, arial, sans-serif;
font-size:11px;
font-weight:bold;
color:rgb(136, 136, 136);
font-style:normal;
}

*#wb-navigation-bottom-header div a:active{
font-family:verdana, arial, sans-serif;
font-size:11px;
font-weight:bold;
color:rgb(136, 136, 136);
font-style:normal;
}

*#wb-navigation-bottom-header div a:visited{
font-family:verdana, arial, sans-serif;
font-size:11px;
font-weight:bold;
color:rgb(136, 136, 136);
font-style:normal;
}

*#wb-navigation-bottom-header div a h3{
font-family:verdana, arial, sans-serif;
font-size:11px;
font-weight:bold;
color:rgb(136, 136, 136);
font-style:normal;
}

*#wb-navigation-uppersubtop-header div a{
font-family:verdana, arial, sans-serif;
font-size:11px;
font-weight:bold;
color:rgb(136, 136, 136);
font-style:normal;
}

*#wb-navigation-uppersubtop-header div a:link{
font-family:verdana, arial, sans-serif;
font-size:11px;
font-weight:bold;
color:rgb(136, 136, 136);
font-style:normal;
}

*#wb-navigation-uppersubtop-header div a:active{
font-family:verdana, arial, sans-serif;
font-size:11px;
font-weight:bold;
color:rgb(136, 136, 136);
font-style:normal;
}

*#wb-navigation-uppersubtop-header div a:visited{
font-family:verdana, arial, sans-serif;
font-size:11px;
font-weight:bold;
color:rgb(136, 136, 136);
font-style:normal;
}

*#wb-navigation-uppersubtop-header div a h3{
font-family:verdana, arial, sans-serif;
font-size:11px;
font-weight:bold;
color:rgb(136, 136, 136);
font-style:normal;
}

*#wb-navigation-subtop div a:hover h3{
font-family:verdana, arial, sans-serif;
font-size:12px;
font-weight:bold;
color:rgb(85, 85, 85);
font-style:normal;
}

*#wb-navigation-subtop div a:hover{
font-family:verdana, arial, sans-serif;
font-size:12px;
font-weight:bold;
color:rgb(85, 85, 85);
font-style:normal;
}

*#wb-navigation-supertop div a:hover h3{
font-family:verdana, arial, sans-serif;
font-size:12px;
font-weight:bold;
color:rgb(85, 85, 85);
font-style:normal;
}

*#wb-navigation-supertop div a:hover{
font-family:verdana, arial, sans-serif;
font-size:12px;
font-weight:bold;
color:rgb(85, 85, 85);
font-style:normal;
}

*#wb-navigation-bottom div a:hover h3{
font-family:verdana, arial, sans-serif;
font-size:12px;
font-weight:bold;
color:rgb(85, 85, 85);
font-style:normal;
}

*#wb-navigation-bottom div a:hover{
font-family:verdana, arial, sans-serif;
font-size:12px;
font-weight:bold;
color:rgb(85, 85, 85);
font-style:normal;
}

*#wb-navigation-subtop-header div a:hover h3{
font-family:verdana, arial, sans-serif;
font-size:12px;
font-weight:bold;
color:rgb(85, 85, 85);
font-style:normal;
}

*#wb-navigation-subtop-header div a:hover{
font-family:verdana, arial, sans-serif;
font-size:12px;
font-weight:bold;
color:rgb(85, 85, 85);
font-style:normal;
}

*#wb-navigation-supertop-header div a:hover h3{
font-family:verdana, arial, sans-serif;
font-size:12px;
font-weight:bold;
color:rgb(85, 85, 85);
font-style:normal;
}

*#wb-navigation-supertop-header div a:hover{
font-family:verdana, arial, sans-serif;
font-size:12px;
font-weight:bold;
color:rgb(85, 85, 85);
font-style:normal;
}

*#wb-navigation-bottom-header div a:hover h3{
font-family:verdana, arial, sans-serif;
font-size:12px;
font-weight:bold;
color:rgb(85, 85, 85);
font-style:normal;
}

*#wb-navigation-bottom-header div a:hover{
font-family:verdana, arial, sans-serif;
font-size:12px;
font-weight:bold;
color:rgb(85, 85, 85);
font-style:normal;
}

*#wb-navigation-uppersubtop-header div a:hover{
font-family:verdana, arial, sans-serif;
font-size:12px;
font-weight:bold;
color:rgb(85, 85, 85);
font-style:normal;
}

*#wb-navigation-uppersubtop-header div a:hover h3{
font-family:verdana, arial, sans-serif;
font-size:12px;
font-weight:bold;
color:rgb(85, 85, 85);
font-style:normal;
}

h1#website-title{
font-family:Verdana, Arial, sans-serif;
font-size:30px;
font-weight:bold;
color:rgb(0, 0, 0);
font-style:normal;
}

*{
padding:0;
margin:0;
box-sizing:border-box;
}

#wb-navigation-subtop div.submenu{
display:none;
}

div.submenu{
display:none;
background-color:#CCCCCC;
}

#wb-navigation-subtop div.submenu div{
display:none;
}

#wb-container-outer{
min-height:105px;
}

#wb-container-inner{
margin:0;
background-color:transparent;
padding-bottom:0px;
width:960px;
}

#wb-layout-header{
width:100%;
height:105px;
border-bottom-color:#999999;
border-bottom-style:solid;
border-bottom-width:1px;
}

#wb-layout-header-mask{
width:960px;
background-color:transparent;
overflow:hidden;
height:105px;
}

#wb-layout-header-base{
width:960px;
height:0px;
background-color:transparent;
}

#wb-container-contentwrapper{
width:960px;
min-height:100%;
background-color:transparent;
display:flex;
flex-wrap:wrap;
}

#wb-layout-sidebar{
float:left;
width:100%;
padding-left:0px;
padding-bottom:10px;
padding-top:0px;
*margin-top:-1px;
padding:0 20px 10px 20px;
}

#wb-navigation{
width:205px;
margin-top:2px;
background-color:transparent;
}

#wb-navigation-top{
width:205px;
padding-top:1px;
background-color:transparent;
}

#wb-navigation-bottom{
/* NO HEIGHT:100%. BREAKS FF. */ width: 205px;
padding-bottom:5px;
}

#wb-layout-footer{
width:960px;
min-height:100px;
margin:0 !important;
background:transparent !important;
border:0;
margin-left:0;
}

/* Mobile orientation refinements */@media (orientation: portrait){
html, body { height:100dvh !important;
}

/* Make sure your own page wrapper wins */#wedding-site{
position:relative !important;
width:100vw !important;
max-width:100vw !important;
margin:0 !important;
padding:0 !important;
overflow-x:clip !important;
z-index:10 !important;
}

/* Container outer: remove hard white box background */#wb-container-outer{
background:transparent !important;
box-shadow:none !important;
}

/* Footer: fluid width */#wb-layout-footer{
width:100% !important;
max-width:100% !important;
height:auto !important;
min-height:60px !important;
background:transparent !important;
border:0 !important;
}

/* Navigation columns: full-width bar, not 205px side panel */#wb-navigation,#wb-navigation-top,#wb-navigation-bottom{
width:100% !important;
float:none !important;
display:block !important;
padding:0 !important;
margin:0 auto !important;
background:transparent !important;
border:0 !important;
}

/* Sidebar & main layout: stack, not split */#wb-layout-sidebar,#wb-layout-main{
width:100% !important;
float:none !important;
margin:0 !important;
padding:0 !important;
border:0 !important;
min-height:auto !important;
}

/* Main content wrapper: kill 960px box and float */#wb-container-contentwrapper,#wb-container-inner,#wb-container-outer,#wb-layout-header-base,#wb-layout-header-mask,#wb-layout-footer{
width:100% !important;
max-width:100% !important;
min-width:0 !important;
margin:0 auto !important;
padding:0 !important;
float:none !important;
display:block !important;
border:0 !important;
background:transparent !important;
box-sizing:border-box !important;
}

/* ============================================================   FINAL BUILDER LAYOUT FIX — 2025-11-05   Purpose: make Network Solutions wrapper responsive and neutral.   ============================================================ *//* Universal box reset */html, body{
width:100% !important;
max-width:100% !important;
min-height:100svh !important;
margin:0 !important;
padding:0 !important;
overflow-x:hidden !important;
}

html, body, #wedding-site{
width:100% !important;
height:100% !important;
min-height:100svh !important;
overflow-x:hidden !important;
}

* html *#wb-container-outer{
filter:none;
}

*#wb-container-outer{
background-image:url(none);
background-color:rgb(255, 255, 255);
}

*#wb-layout-header{
background-color:transparent;
}

*#wb-layout-sidebar{
background-color:rgb(255, 255, 255);
}

*#wb-layout-footer{
background-color:transparent;
}

*#wb-navigation-supertop{
background-color:transparent;
}

*#wb-navigation-subtop{
background-color:transparent;
}

*#wb-navigation-bottom{
background-color:transparent;
}

*#wb-layout-subtop-header{
background-color:transparent;
}

#wb-layout-sidebar,#wb-layout-main{
width:100% !important;
float:none !important;
margin:0 !important;
padding:0 !important;
border:0 !important;
min-height:auto !important;
}

#wb-container-contentwrapper,#wb-container-inner,#wb-container-outer,#wb-layout-header-base,#wb-layout-header-mask,#wb-layout-footer{
width:100% !important;
max-width:100% !important;
min-width:0 !important;
margin:0 auto !important;
padding:0 !important;
float:none !important;
display:block !important;
border:0 !important;
background:transparent !important;
box-sizing:border-box !important;
}

/* 11) Optional: on wider screens, constrain your own inner content nicely */@media (min-width: 960px){
.wrap, .container, .inner, .content,  [data-wrap], [data-container] {    max-width:1200px;
/* change to your preferred page width */    margin-inline:auto;
padding-inline:clamp(16px, 3vw, 28px);
box-sizing:border-box;
}

="wb-"], [class*="wb-"]{
left:auto !important;
right:auto !important;
transform:none !important;
}

/* 9) Kill any leftover fixed nav/item widths that could cause clipping */#wb-navigation-bottom div,#wb-navigation-bottom div a,#wb-navigation-bottom{
width:100% !important;
}

/* 8) Media should scale fluidly */img, video, svg, canvas, iframe{
display:block !important;
max-width:100% !important;
height:auto !important;
}

/* 7) Prevent any element from exceeding the viewport width */header, footer, section,#hero, #countdown, #location, #divider-strip,#transportation, #accommodation, #agenda, #ceremony,#rsvp, #registry, #faq, #site-footer{
width:100% !important;
max-width:100% !important;
margin:0 auto !important;
padding-inline:0 !important;
box-sizing:border-box !important;
overflow-x:hidden !important;
}

/* 6) Header/footer shouldn’t force fixed heights */#wb-layout-header{
width:100% !important;
height:auto !important;
border:0 !important;
background:transparent !important;
}

/* 5) Navigation blocks shouldn’t reserve 205px columns */#wb-navigation,#wb-navigation-top,#wb-navigation-bottom{
width:100% !important;
margin:0 !important;
padding:0 !important;
background:transparent !important;
}

/* 4) Sidebar should not push/clip content on mobile or desktop */#wb-layout-sidebar{
float:none !important;
width:100% !important;
margin:0 !important;
padding:0 !important;
background:transparent !important;
}

drop the float layout */#wb-layout-main{
float:none !important;
width:100% !important;
min-height:auto !important;
margin:0 !important;
padding:0 !important;
border:0 !important;
}

/* 2) Remove fixed 960px clamps */#wb-container-inner,#wb-container-contentwrapper,#wb-layout-header-base,#wb-layout-header-mask{
/* kill the 960px lock */  inline-size:100% !important;
}

#wb-container-outer,#wb-container-inner,#wb-container-contentwrapper,#wb-layout-header-base,#wb-layout-header-mask,#wb-layout-footer{
width:100% !important;
max-width:100% !important;
min-height:0 !important;
margin:0 auto !important;
padding:0 !important;
background:transparent !important;
border:0 !important;
}

/* ===== FULL-SCREEN OVERRIDES (place after builder CSS) ===== *//* 1) Make the outer containers fluid */html, body{
width:100%;
height:100%;
overflow-x:hidden;
}