/* Global Styles */
:root {
    /* Vibrant palette inspired by pink/red/orange/yellow */
    /* Updated floral + mountain palette */
    --primary-color: #443F19;    /* olive */
    --secondary-color: #ECE6E8;  /* warm paper */
    --accent-color: #ffb38a;     /* peach */
    --sunshine: #ffd166;         /* soft marigold */
    --berry: #e667a2;            /* poppy pink */
    --moss: #F88B8B;             /* alpine moss */
    --sage: #cfdcd0;             /* sage */
    --forest: #2f5d50;           /* deep evergreen */
    --sky: #eef6f9;              /* mountain sky */
    --text-color: #25332f;
    --light-text: #fff;
    --font-heading: 'Ultra', serif;
    --font-body: 'Libre Baskerville', serif;
}

/* Per-page hero backgrounds (update URLs as desired) */
.hero-home { background-image: url('assets/banner.jpeg'); }
.hero-schedule { background-image: url('assets/schedule.JPG'); background-position: center 140%; }
.hero-travel { background-image: url('assets/travel.jpeg'); background-position: center 55%;}
.hero-lodging { background-image: url('assets/lodging.JPG?v=1'); background-position: center 70%;}
.hero-things { background-image: url('assets/things-to-do.JPG'); background-position: center calc(60% - 1.5in); }
.hero-gifts { background-image: url('assets/gifts-hero.jpeg'); background-position: center 40%; }
.hero-faq { background-image: url('assets/6349E0A0-88EA-4888-866E-7B9D7248C850_1_201_a.jpeg'); background-position: center 60%;}
.section#schedule::before,
.section#schedule::after,
#schedule.section::before,
#schedule.section::after {
    display: none; /* remove decorative sprigs/outlines on schedule */
}

/* Generic two-column split layout used by Travel, Lodging, FAQ */
.split-grid {
    display: grid;
    grid-template-columns: 1fr 2fr; /* left: icon/title, right: description */
    gap: 2rem;
    position: relative;
    padding: 1.5rem 0; /* vertical buffer like schedule */
}

.split-grid::before {
    content: '';
    position: absolute;
    left: 33.333%; /* match 1fr 2fr split */
    top: 1.5rem;   /* respect vertical buffer */
    bottom: 1.5rem;
    width: 2px;
    background: #BDA372;
}

.split-left, .split-right { padding: 0.5rem 0.25rem; }

.split-title {
    font-family: var(--font-heading);
    font-size: 1.35rem;
    margin: 0.25rem 0 0.6rem;
}

.split-points {
    padding-left: 1.2rem;
    line-height: 1.9;
}

/* Improve readability between list items in Things to Do */
.split-points li {
    margin: 0.35rem 0;
}

.split-left i, .split-right i {
    font-size: 1.8rem;
    margin-bottom: 0.5rem;
    color: #f69aa5;
}

.faq-item { margin-bottom: 1rem; }
.faq-item h3 { margin-bottom: 0.25rem; }

@media (max-width: 900px) {
    .split-grid { grid-template-columns: 1fr; }
    .split-grid::before { display: none; }
}
/* Schedule (new layout) */
.schedule {
    margin-top: 1rem;
}

.day-block { 
    padding: 2.5rem 1rem 2rem; 
}

.day-header {
    text-align: center;
    font-family: var(--font-heading);
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #ECE6E8;
    font-size: clamp(1.6rem, 3.8vw, 2.4rem);
    margin: 0 0 1.25rem;
}

.day-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    align-items: start;
    position: relative;
    /* add vertical buffer inside each row */
    padding: 1.5rem 0;
}

/* Even spacing when multiple rows exist under the same day */
.day-block .day-grid {
    margin: 1.5rem 0;
}
.day-block .day-grid:not(:last-child) {
    padding-bottom: 1.25rem;
    margin-bottom: 2rem;
    border-bottom: 1px dashed #BDA372;
}

/* vertical divider */
.day-grid::before {
    content: '';
    position: absolute;
    left: 50%;
    /* match the vertical padding so the divider respects the buffer */
    top: 1.5rem;
    bottom: 1.5rem;
    width: 2px;
    background: #BDA372;
}

/* Zola-like stacked schedule layout overrides */
.schedule .day-header {
    text-align: left;
    margin-bottom: 1rem;
}

.schedule .day-grid {
    grid-template-columns: 1fr 2fr; /* left: icon/title/time, right: description */
    gap: 2rem; /* restore comfortable column gap */
    align-items: center; /* align like an array row */
}

.schedule .day-grid::before {
    /* show divider and align it to the boundary between the left and right columns */
    display: block;
    left: 33.333%; /* matches 1fr 2fr split (1 / (1+2)) */
}

.schedule .day-left,
.schedule .day-right {
    text-align: left; /* left-align like Zola */
}

.schedule .event-title {
    font-size: 1.5rem;
    margin-bottom: 0.2rem;
}

.schedule .event-time {
    margin-bottom: 0.75rem;
}

.schedule .btn-row {
    justify-content: flex-start; /* align actions left */
}

.schedule .day-block .day-grid {
    margin: 1rem 0; /* slightly tighter base spacing */
}

.schedule .day-block .day-grid:not(:last-child) {
    border-bottom: none; /* no dashed divider between rows */
    padding-bottom: 0;
    margin-bottom: 1.75rem; /* space only */
}

.day-left {
    text-align: center;
}

.day-left i {
    font-size: 2.2rem;
    margin-bottom: 0.75rem;
    color: #f69aa5;
}

/* smaller secondary icon stacked above the main one */
.day-left .icon-secondary {
    font-size: 1.6rem;
    margin-bottom: 0.2rem;
    display: block;
    opacity: 0.95;
}

.event-title {
    font-family: var(--font-heading);
    font-size: 1.35rem;
    margin-bottom: 0.4rem;
}

.event-time { 
    color: rgba(0,0,0,0.65); 
    font-weight: 600; 
    font-size: 0.95rem; 
}

.day-right { 
    text-align: center; 
}

.event-detail.muted { 
    color: rgba(0,0,0,0.55); 
    margin-bottom: 0.9rem; 
}

/* ensure primary event details also get spacing */
.day-right .event-detail { 
    margin-bottom: 0.6rem; 
}

/* centered button row for map/calendar links */
.btn-row {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-top: 0.4rem;
}

.btn-calendar {
    display: inline-flex; /* normalize anchor/button sizing */
    align-items: center;
    justify-content: center;
    padding: 0.7rem 1.1rem;
    width: 180px; /* force consistent width across anchors and buttons */
    border-radius: 8px;
    border: none;
    background: #f69aa5; /* soft pink */
    color: white;
    font-weight: 700;
    font-size: 0.95rem;
    line-height: 1;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    box-sizing: border-box; /* include padding within fixed width */
    white-space: nowrap; /* prevent text wrapping changing height */
    -webkit-appearance: none;
    appearance: none;
}

.btn-calendar:hover {
    filter: brightness(0.95);
}

/* accessibility + disabled consistency */
.btn-calendar:focus-visible {
    outline: 3px solid rgba(246, 154, 165, 0.45);
    outline-offset: 2px;
}

.btn-calendar[disabled],
.btn-calendar[aria-disabled="true"] {
    opacity: 0.55;
    cursor: not-allowed;
}

.btn-calendar[disabled]:hover,
.btn-calendar[aria-disabled="true"]:hover {
    filter: none; /* prevent hover brighten on disabled */
}

.event-note {
    color: rgba(0,0,0,0.75);
    line-height: 1.8;
}

@media (max-width: 900px) {
    .day-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    .day-grid::before { display: none; }
}

/* Mobile: stack actions and allow full-width buttons for better tap targets */
@media (max-width: 500px) {
    .btn-row { gap: 0.6rem; }
    .btn-row .btn-calendar { width: 100%; }
}
/* Event meta block */
.event-meta {
    text-align: center;
    margin: 1.5rem auto 2rem;
}
.event-meta p { margin: 0.25rem 0; }
/* Make the first line (date) pop */
.event-meta p:first-child strong {
    font-family: var(--font-heading);
    font-weight: 700;
    font-size: clamp(1.75rem, 3.2vw, 2.5rem);
    line-height: 1.2;
    display: inline-block;
    color: var(--sage); /* match background green */
}

/* Countdown styled to match brand/nav */
.countdown {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    margin-top: 0.75rem;
}
.countdown-item {
    background: transparent; /* remove card background */
    border: none;            /* remove border */
    border-radius: 0;        /* no rounded box */
    padding: 0;              /* remove padding box */
    min-width: 0;            /* no fixed width */
    box-shadow: none;        /* remove shadow */
    text-align: center;
    color: var(--text-color); /* match section text color */
}
.countdown-item span:first-child {
    display: block;
    font-family: var(--font-body);
    font-weight: 700;
    font-size: 2rem;
    line-height: 1.1;
    color: var(--text-color); /* darken numbers */
}
.countdown-item span:last-child {
    display: block;
    margin-top: 2px;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--text-color); /* ensure labels match section text color */
}

@media (max-width: 768px) {
    .countdown { gap: 0.5rem; }
    .countdown-item { min-width: 72px; padding: 0.5rem 0.6rem; }
    .countdown-item span:first-child { font-size: 1.5rem; }
    .countdown-item span:last-child { font-size: 0.7rem; }
}

/* Large banner photo below nav */
.banner-photo {
    width: 100%;
    height: 60vh;
    overflow: hidden;
}
.banner-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

@media (max-width: 768px) {
    .banner-photo { height: 40vh; }
}

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

html {
    scroll-behavior: smooth;
}

body {
    font-family: var(--font-body);
    color: var(--text-color);
    line-height: 1.75;
    background: var(--sage); /* comfortable soft green background */
    font-size: clamp(16px, 1.1vw + 14px, 18px);
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-heading);
    font-weight: 700;
    margin-bottom: 1rem;
}

/* Refine heading styling: small-caps + tracking (except the big hero title) */
h2, h3, h4, h5, h6 {
    font-variant-caps: small-caps;
    letter-spacing: 0.04em;
}

/* Paragraph rhythm */
p { margin: 0.75rem 0; }

a {
    text-decoration: none;
    color: var(--primary-color);
    transition: color 0.3s ease;
}

a:hover {
    color: var(--accent-color);
}

.section {
    padding: 1.0rem 1.5rem;
    max-width: 960px;
    margin: 2rem auto;
    background: #ffffff; /* clean card on warm paper */
    color: var(--text-color);
    border: 1px solid rgba(0,0,0,0.06);
    border-radius: 16px;
    position: relative; /* anchor decorative sprigs */
    overflow: hidden;   /* clip sprigs to rounded corners */
}

/* Typography inside section: darker headers and body */
.section h1,
.section h2,
.section h3,
.section h4,
.section h5,
.section h6 { color: var(--primary-color); }

.section p { color: var(--text-color); }

/* Improve contrast for text elements within light section cards */
.section a { color: var(--primary-color); }
.section .muted { color: rgba(0,0,0,0.65); }
.section .event-detail,
.section .event-time { color: var(--text-color); }
/* Lighten the mid-column divider used in split layouts when inside a light section */
.section .split-grid::before { background: rgba(0,0,0,0.12); }
/* Use brand gold for dividers within dark sections */
.section .split-grid::before { background: #BDA372; }
/* Lighten icons and button text inside dark sections */
.section i[class^="fa"],
.section i[class*=" fa-"],
.section .icon { color: #ffffff; }
.section .btn,
.section .btn-calendar,
.section button { color: var(--light-text); }

/* Compact action chips for inline links (maps, info, rentals) */
.link-chip {
    display: inline-block;
    padding: 0.3rem 0.6rem;
    border-radius: 999px;
    background: var(--sky);
    color: var(--forest);
    border: 1px solid rgba(0,0,0,0.08);
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}
.link-chip:hover { filter: brightness(0.97); color: var(--forest); }
.link-chip:focus-visible { outline: 2px solid rgba(47,93,80,0.35); outline-offset: 2px; }

/* Event section: enforce darker text */
#event.section { color: var(--text-color); }
#event.section h1,
#event.section h2,
#event.section h3,
#event.section h4,
#event.section h5,
#event.section h6 { color: var(--primary-color); }
#event.section a { color: var(--primary-color); }
#event.section .event-title { color: var(--primary-color); }
#event.section .event-time { color: var(--text-color); }
#event.section .event-detail { color: var(--text-color); }
#event.section .muted { color: rgba(0,0,0,0.7); }
/* Remove outer border on Event section only */
#event.section { border: none; }

/* Center all text on Home (Event) section */
#event.section,
#event.section p,
#event.section .btn-row,
#event.section .countdown,
#event.section .countdown-item { text-align: center; }

/* Override gradient icon styles within sections to ensure light icons */
.section .day-left i,
.section .split-left i,
.section .detail-item i {
    background: none !important;
    -webkit-text-fill-color: initial !important;
    color: #ffffff !important;
}

/* Decorative wildflower sprigs in section corners */
.section::before,
.section::after {
    content: '';
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    width: 140px;
    height: 140px;
    opacity: 0.35;
    pointer-events: none;
}
.section::before {
    background-image: url('assets/wildflower-sprig-1.svg');
    top: -14px;
    left: -14px;
    transform: rotate(-6deg);
}
.section::after {
    background-image: url('assets/wildflower-sprig-2.svg');
    bottom: -18px;
    right: -12px;
    transform: rotate(8deg);
}
.section:nth-of-type(even)::before {
    background-image: url('assets/wildflower-sprig-2.svg');
    right: -12px;
    left: auto;
    top: -12px;
    transform: rotate(6deg) scaleX(-1);
}
.section:nth-of-type(even)::after {
    background-image: url('assets/wildflower-sprig-1.svg');
    left: -10px;
    right: auto;
    bottom: -16px;
    transform: rotate(-8deg) scaleX(-1);
}

@media (max-width: 900px) {
    .section::before, .section::after { width: 100px; height: 100px; opacity: 0.28; }
}
@media (max-width: 520px) {
    .section::before, .section::after { width: 72px; height: 72px; opacity: 0.22; }
}

/* Schedule: use brand card background */
#schedule.section {
    background: transparent; /* inherit pink body background */
}

.section h2 {
    text-align: center;
    color: var(--primary-color); /* ensure readable on light cards */
    font-size: 2.25rem;
    margin-bottom: 2rem;
    position: relative;
}

.section h2::after {
    content: '';
    display: block;
    width: 48px;
    height: 2px;
    background: #BDA372;
    margin: 0.5rem auto 0;
    border-radius: 2px;
}

@media (min-width: 900px) {
  /* Keep all section headings centered on large screens */
  .section h2 { text-align: center; }
  .section h2::after { margin-left: auto; }
}

/* Tidy default lists inside sections to mimic Zola */
.section ul {
  padding-left: 1.2rem;
  line-height: 1.9;
}
.section li { margin: 0rem 0; }

.btn {
    display: inline-block;
    background: linear-gradient(90deg, var(--primary-color), var(--accent-color));
    color: white;
    padding: 0.8rem 2rem;
    border: none;
    border-radius: 30px;
    cursor: pointer;
    font-size: 1rem;
    transition: all 0.3s ease;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 600;
}

.btn:hover {
    background: linear-gradient(90deg, var(--berry), var(--sunshine));
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

/* Hero Section */
.hero {
    position: relative;
    text-align: center;
    color: var(--light-text);
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover; /* fill full width without side gaps */
    width: 100vw; /* span full viewport width */
    margin-left: 50%;
    transform: translateX(-50%); /* full-bleed */
    aspect-ratio: 1920 / 900; /* adjust to your photo's ratio if needed */
    padding: 0; /* remove any internal padding */
}

/* removed .hero-bg image styles; using CSS background instead */

/* Subtle top-to-bottom gradient to ensure text legibility over sky */
.hero::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0,0,0,0.25) 0%, rgba(0,0,0,0.15) 30%, rgba(0,0,0,0.05) 60%, rgba(0,0,0,0) 100%);
    pointer-events: none;
}

/* Overlay names near top (over sky) */
.hero .hero-content {
    position: absolute;
    top: calc(12% + 2in);
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    max-width: 1100px;
    z-index: 1;
}

/* Gifts page: move title down an additional 2 inches */
.hero-gifts .hero-content {
    top: calc(12% + 3in);
}

.hero-schedule .hero-content {
    /* Move up by 1.5in from the base offset and left by 2in from centered */
    top: calc(12% + 0.5in);
    transform: translateX(calc(-50% - 2in));
}

.hero-lodging .hero-content {
    /* Move up by 1.5in from the base offset and right by 1in from centered */
    top: calc(12% + 0.5in);
    transform: translateX(calc(-50% + 1in));
}

.hero-travel .hero-content {
    /* Move title 1.5in to the left from centered */
    transform: translateX(calc(-50% - 1.5in));
}

.hero-things .hero-content {
    /* Move title up by 1.5in from base (12% + 2in -> 12% + 0.5in) */
    top: calc(12% + 0.5in);
}

.hero-faq .hero-content {
    /* Move title 3in to the left from centered */
    transform: translateX(calc(-50% - 3in));
}

.hero-content h1 {
    font-size: clamp(3rem, 8vw, 5rem);
    margin-bottom: 0; /* remove extra spacing below title */
    font-family: 'Ultra', serif;
    font-weight: 400;
    text-transform: uppercase;
    line-height: 1.3;
    letter-spacing: normal;
    color: rgb(247, 243, 240);
    text-shadow: 0 2px 12px rgba(0,0,0,0.35);
}

.date {
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
    font-family: var(--font-heading);
}

.location {
    font-size: 1.2rem;
    margin-bottom: 2rem;
    font-style: italic;
}

.password-gate {
    position: fixed;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    background: radial-gradient(1200px 600px at 20% 20%, rgba(255,63,94,0.25), transparent),
                radial-gradient(1200px 600px at 80% 80%, rgba(255,195,0,0.25), transparent),
                rgba(0,0,0,0.55);
    backdrop-filter: blur(3px);
    z-index: 2000;
}

.gate-card {
    background: #fff;
    border-radius: 16px;
    padding: 2rem;
    width: min(92vw, 520px);
    box-shadow: 0 20px 60px rgba(0,0,0,0.25);
    text-align: center;
}

.gate-card h2 {
    font-family: 'Ultra', serif;
    font-weight: 400;
    font-size: 2rem;
    margin-bottom: 0.25rem;
    text-transform: uppercase;
}

.gate-sub {
    color: #555;
    margin-bottom: 1rem;
}

.gate-form {
    margin-top: 1rem;
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 0.8rem;
}

.gate-form input {
    padding: 0.9rem 1rem;
    border: 2px solid #eee;
    border-radius: 10px;
    font-family: var(--font-body);
}

.gate-error {
    color: #d72d2d;
    margin-top: 0.5rem;
    min-height: 1.25rem;
}

.gate-hint {
    margin-top: 0.75rem;
    color: #666;
    font-size: 0.9rem;
}

/* Countdown */
.countdown {
    display: flex;
    justify-content: center;
    gap: 2rem;
    margin-top: 3rem;
}

.countdown-item {
    text-align: center;
}

.countdown-item span:first-child {
    display: block;
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    color: var(--text-color); /* keep numbers dark at all sizes */
}

.countdown-item span:last-child {
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--text-color); /* match section text color */
}

/* Zola-like Schedule Styles */
.schedule.zola-like {
    max-width: 720px;
    margin: 0 auto;
}

/* Ensure schedule buttons are centered */
.schedule.zola-like .btn-row { justify-content: center !important; }

/* Center all text on Schedule page and remove section border */
#schedule.section { border: none; margin: 2rem auto; }
#schedule.section, 
#schedule.section .schedule-date,
#schedule.section .schedule-item,
#schedule.section .item-title,
#schedule.section .item-time,
#schedule.section .item-location,
#schedule.section .item-attire { text-align: center; }

/* Match Travel and Lodging styling to Schedule */
#travel.section, #lodging.section {
    border: none;
    margin: 2rem auto;
    background: transparent; /* inherit pink body */
}

/* Remove decorative sprigs on Travel & Lodging */
.section#travel::before,
.section#travel::after,
#travel.section::before,
#travel.section::after,
.section#lodging::before,
.section#lodging::after,
#lodging.section::before,
#lodging.section::after { display: none; }

/* Center text within Travel & Lodging content */
#travel.section, 
#travel.section .split-title,
#travel.section .split-points,
#travel.section p,
#lodging.section,
#lodging.section .split-title,
#lodging.section .split-points,
#lodging.section p { text-align: center; }

/* Ensure split lists look centered nicely */
#travel.section .split-points,
#lodging.section .split-points { list-style-position: inside; padding-left: 0; }

/* Match Things, Gifts, and FAQ styling to Schedule/Travel */
#things.section, #gifts.section, #faq.section {
    border: none;
    margin: 2rem auto;
    background: transparent;
}

/* Remove decorative sprigs on Things, Gifts, FAQ */
.section#things::before, .section#things::after,
#things.section::before, #things.section::after,
.section#gifts::before, .section#gifts::after,
#gifts.section::before, #gifts.section::after,
.section#faq::before, .section#faq::after,
#faq.section::before, #faq.section::after { display: none; }

/* Center typical inner content */
#things.section, #gifts.section, #faq.section,
#things.section .split-title, #gifts.section .split-title, #faq.section .split-title,
#things.section .split-points, #gifts.section .split-points, #faq.section .split-points,
#things.section p, #gifts.section p, #faq.section p { text-align: center; }

/* Globally center text content for non-home/non-schedule pages */
#travel.section p, #travel.section li,
#lodging.section p, #lodging.section li,
#things.section p, #things.section li,
#gifts.section p, #gifts.section li,
#faq.section p, #faq.section li { text-align: center; }

/* Collapse two-column split layouts to single-column and center them */
#travel.section .split-grid,
#lodging.section .split-grid,
#things.section .split-grid,
#gifts.section .split-grid,
#faq.section .split-grid { 
  grid-template-columns: 1fr !important; 
  justify-items: center; 
}
#travel.section .split-grid::before,
#lodging.section .split-grid::before,
#things.section .split-grid::before,
#gifts.section .split-grid::before,
#faq.section .split-grid::before { display: none !important; }
#travel.section .split-left, #travel.section .split-right,
#lodging.section .split-left, #lodging.section .split-right,
#things.section .split-left, #things.section .split-right,
#gifts.section .split-left, #gifts.section .split-right,
#faq.section .split-left, #faq.section .split-right { 
  text-align: center; 
  width: 100%;
}

/* Make Schedule single-column and centered like Home */
#schedule.section .day-grid { grid-template-columns: 1fr !important; }
#schedule.section .day-grid::before { display: none !important; }
#schedule.section .day-left, #schedule.section .day-right { text-align: center !important; }

/* Center list bullets nicely */
#things.section .split-points,
#gifts.section .split-points,
#faq.section .split-points { list-style-position: inside; padding-left: 0; }

.schedule-day {
    margin: 2rem 0;
}

.schedule-date {
    font-size: 1.25rem;
    font-weight: 700;
    margin: 0 0 0.75rem;
    color: var(--text-color);
}

.schedule-item {
    padding: 0.25rem 0 1rem;
    border-bottom: 1px solid rgba(0,0,0,0.12);
}

.schedule-day .schedule-item:last-child {
    border-bottom: none;
}

.item-title {
    margin: 0 0 0.2rem;
    font-weight: 700;
    font-size: 1.1rem;
    color: var(--text-color);
}

.item-time { color: var(--text-color); }
.item-location a {
    color: var(--primary-color);
    text-decoration: underline;
}
.item-attire { color: var(--text-color); }

/* Navigation */
.main-nav {
    background: var(--secondary-color);
    border-bottom: 1px solid #eee;
    position: sticky;
    top: 0;
    z-index: 1000;
}

.main-nav ul {
    display: flex;
    justify-content: center;
    list-style: none;
    padding: 0.75rem 0;
    background: var(--secondary-color);
    margin: 0;
}

.main-nav li {
    margin: 0 1.5rem;
}

.main-nav a {
    color: var(--text-color);
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.85rem;
    letter-spacing: 1px;
    padding: 0.5rem 0;
    position: relative;
}

.main-nav a::after {
    content: '';
    position: absolute;
    width: 0;
    height: 2px;
    bottom: 0;
    left: 0;
    background: linear-gradient(90deg, var(--forest), var(--moss), var(--accent-color));
    transition: width 0.3s ease;
}

.main-nav a:hover::after {
    width: 100%;
}

/* Active page underline */
.main-nav a.active::after,
.main-nav a[aria-current="page"]::after {
    width: 100%;
}

/* Story/Schedule shared layout */
.story-content {
    display: flex;
    align-items: center;
    gap: 3rem;
    margin-top: 3rem;
}

.story-text {
    flex: 1;
}

.story-text p {
    margin-bottom: 1.5rem;
    font-size: 1.1rem;
    line-height: 1.8;
}

.story-image {
    flex: 1;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.story-image img {
    width: 100%;
    height: auto;
    display: block;
    transition: transform 0.5s ease;
}

.story-image:hover img {
    transform: scale(1.05);
}

/* Details Section */
.details-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 2rem;
    margin-top: 3rem;
}

.detail-item {
    text-align: center;
    padding: 1.75rem;
    background: #fff;
    border: 1px solid #eee;
    border-radius: 14px;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.detail-item:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 24px rgba(0,0,0,0.06);
}

.detail-item i {
    font-size: 2.5rem;
    color: #f69aa5;
    margin-bottom: 1rem;
}

.detail-item h3 {
    margin: 1rem 0;
    color: var(--forest);
}

/* Gallery Section */
.gallery {
    background: transparent;
}

.gallery-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 1.5rem;
    margin-top: 2rem;
}

.gallery-item {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid #eee;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.gallery-item:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 28px rgba(0,0,0,0.08);
}

.gallery-item img {
    width: 100%;
    height: 300px;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.gallery-item:hover img {
    transform: scale(1.05);
}

.card-caption {
    background: rgba(0,0,0,0.5);
    color: #fff;
    padding: 0.6rem 0.9rem;
    position: absolute;
    bottom: 8px;
    left: 8px;
    border-radius: 6px;
    font-weight: 600;
}

/* RSVP Section */
.rsvp-form {
    max-width: 600px;
    margin: 0 auto;
    padding: 2rem;
    background: white;
    border-radius: 10px;
    box-shadow: 0 5px 30px rgba(0, 0, 0, 0.1);
}

.form-group {
    margin-bottom: 1.5rem;
}

.form-group input,
.form-group select,
.form-group textarea {
    width: 100%;
    padding: 0.8rem 1rem;
    border: 1px solid #ddd;
    border-radius: 5px;
    font-family: var(--font-body);
    font-size: 1rem;
    transition: border-color 0.3s ease;
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
    outline: none;
    border-color: var(--primary-color);
}

.form-group textarea {
    min-height: 120px;
    resize: vertical;
}

/* Registry Section */
.registry-links {
    display: flex;
    justify-content: center;
    gap: 2rem;
    margin-top: 2rem;
    flex-wrap: wrap;
}

.registry-link {
    display: inline-block;
    padding: 1rem 2rem;
    background: #f69aa5; /* match .btn-calendar pink */
    color: white;
    border-radius: 8px; /* match .btn-calendar radius */
    transition: all 0.3s ease;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 1px;
    font-size: 0.95rem;
}

.registry-link:hover {
    filter: brightness(0.95); /* match .btn-calendar hover */
    color: white;
}

/* Footer */
footer {
    background: #fff;
    color: #333;
    text-align: center;
    padding: 2rem 1rem;
    border-top: 1px solid #eee;
}

.social-links {
    margin-top: 1rem;
}

.social-links a {
    color: #f69aa5; /* unify icon color with View map buttons */
    margin: 0 0.5rem;
    font-size: 1.5rem;
    transition: color 0.3s ease;
}

.social-links a:hover {
    color: #e667a2; /* subtle hover toward berry */
}

/* Responsive Design */
@media (max-width: 768px) {
    .hero .hero-content { top: calc(8% + 1in); }
    /* Gifts page mobile: offset reduced by 1in */
    .hero-gifts .hero-content { top: calc(8% + 2in); }
    /* Schedule page mobile: recentre horizontally and use smaller vertical offset */
    .hero-schedule .hero-content {
        top: calc(8% + 0.75in);
        transform: translateX(-50%);
    }
    .hero-travel .hero-content {
        left: calc(50% - 1.5in);
        transform: translateX(-50%);
    }
    .hero-things .hero-content {
        top: calc(8% + 1.5in);
    }
    .hero-faq .hero-content {
        left: calc(50% - 1.5in);
        transform: translateX(-50%);
    }
    .hero-content h1 { font-size: 2.5rem; }
    
    .date {
        font-size: 1.2rem;
    }
    
    .location {
        font-size: 1rem;
    }
    
    .countdown { gap: 1rem; }
    .countdown-item { min-width: 0; padding: 0; }
    .countdown-item span:first-child { font-size: 2rem; }
    
    .story-content {
        flex-direction: column;
    }
    
    .details-grid {
        grid-template-columns: 1fr;
    }
    
    .main-nav ul {
        flex-wrap: wrap;
        padding: 0.5rem 0;
    }
    
    .main-nav li {
        margin: 0.3rem 0.8rem;
    }
    
    /* Unify all hero title positions on mobile to match Things To Do */
    .hero.hero-home .hero-content,
    .hero.hero-schedule .hero-content,
    .hero.hero-travel .hero-content,
    .hero.hero-lodging .hero-content,
    .hero.hero-things .hero-content,
    .hero.hero-gifts .hero-content,
    .hero.hero-faq .hero-content {
        top: calc(8% + 1.5in) !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
    }
    /* Home title: match the same top offset as other mobile titles and allow wrapping */
    .hero.hero-home .hero-content {
        top: calc(8% + 0.5in) !important; /* lowered by 1in from previous */
        max-width: 70vw; /* encourage two-line wrap */
        white-space: normal; /* allow wrapping */
        word-break: normal;
        overflow-wrap: anywhere; /* allow break opportunities if needed */
    }
    /* Give the Home hero a bit more vertical space on mobile to avoid clipping bottom line */
    .hero.hero-home { aspect-ratio: 1920 / 1450; }
    /* Slightly reduce Home title size on mobile to keep both lines visible */
    .hero.hero-home .hero-content h1 { font-size: 1.8rem; line-height: 1.18; }
    
    /* Very small devices: slightly reduce title size to ensure full visibility */
    @media (max-width: 380px) {
        .hero-content h1 { font-size: 2.2rem; }
    }
    @media (max-width: 330px) {
        .hero-content h1 { font-size: 2.0rem; }
    }
}