:root {
   color-scheme: light;
   --paper: #fff8f2;
   --paper-strong: #f1e3d8;
   --white: #ffffff;
   --ink: #202522;
   --muted: #6d6760;
   --rose: #95594f;
   --rose-dark: #6e3934;
   --sage: #426356;
   --sage-dark: #263f38;
   --gold: #b89452;
   --blue: #2f4156;
   --shadow: 0 24px 70px rgba(32, 37, 34, 0.18);
   --soft-shadow: 0 14px 36px rgba(32, 37, 34, 0.12);
   --radius: 8px;
}

* {
   box-sizing: border-box;
}

html {
   scroll-behavior: smooth;
}

body {
   margin: 0;
   background: var(--paper);
   color: var(--ink);
   font-family: "Source Sans Pro", "Segoe UI", Arial, sans-serif;
   font-size: 1rem;
   line-height: 1.65;
   letter-spacing: 0;
}

body.lightbox-open {
   overflow: hidden;
}

[hidden] {
   display: none !important;
}

main section {
   scroll-margin-top: 96px;
}

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

button,
a {
   font: inherit;
}

a {
   color: inherit;
   text-decoration: none;
}

.site-header {
   align-items: center;
   background: rgba(255, 248, 242, 0.86);
   border-bottom: 1px solid rgba(66, 99, 86, 0.12);
   display: flex;
   gap: 2rem;
   justify-content: space-between;
   left: 0;
   min-height: 72px;
   padding: 0.9rem 4vw;
   position: fixed;
   right: 0;
   top: 0;
   transition: background 180ms ease, box-shadow 180ms ease;
   z-index: 20;
}

.site-header.is-scrolled {
   background: rgba(255, 255, 255, 0.94);
   box-shadow: 0 10px 30px rgba(32, 37, 34, 0.08);
}

.brand {
   align-items: baseline;
   color: var(--ink);
   display: inline-flex;
   font-family: Georgia, "Times New Roman", serif;
   font-size: 1.25rem;
   gap: 0.35rem;
   line-height: 1;
   white-space: nowrap;
}

.brand span:nth-child(2) {
   color: var(--rose);
   font-size: 1rem;
}

.site-nav {
   align-items: center;
   display: flex;
   gap: 0.35rem;
}

.site-nav a {
   border-radius: 999px;
   color: var(--ink);
   font-size: 0.86rem;
   font-weight: 700;
   padding: 0.52rem 0.82rem;
   text-transform: uppercase;
}

.site-nav a:hover,
.site-nav a:focus-visible {
   background: rgba(149, 89, 79, 0.12);
   color: var(--rose-dark);
   outline: none;
}

.hero {
   align-items: flex-end;
   display: flex;
   isolation: isolate;
   min-height: 84svh;
   overflow: hidden;
   padding: 8.8rem 4vw 7rem;
   position: relative;
}

.hero-image,
.hero-shade {
   height: 100%;
   inset: 0;
   position: absolute;
   width: 100%;
}

.hero-image {
   object-fit: cover;
   object-position: center;
   z-index: -3;
}

.hero-shade {
   background:
      linear-gradient(90deg, rgba(31, 38, 35, 0.82) 0%, rgba(31, 38, 35, 0.5) 44%, rgba(31, 38, 35, 0.12) 100%),
      linear-gradient(0deg, rgba(31, 38, 35, 0.52) 0%, rgba(31, 38, 35, 0) 55%);
   z-index: -2;
}

.hero-content {
   color: var(--white);
   max-width: 780px;
}

.eyebrow {
   color: var(--gold);
   font-size: 0.82rem;
   font-weight: 800;
   letter-spacing: 0;
   line-height: 1.2;
   margin: 0 0 1rem;
   text-transform: uppercase;
}

.eyebrow.dark {
   color: var(--rose-dark);
}

.eyebrow.light {
   color: #f1d492;
}

h1,
h2 {
   font-family: Georgia, "Times New Roman", serif;
   font-weight: 500;
   letter-spacing: 0;
   line-height: 1.02;
   margin: 0;
}

h1 {
   font-size: 4.7rem;
}

h2 {
   font-size: 3.05rem;
}

p {
   margin: 0;
}

.hero-copy {
   color: rgba(255, 255, 255, 0.9);
   font-size: 1.2rem;
   line-height: 1.65;
   margin-top: 1.35rem;
   max-width: 640px;
}

.hero-access-button {
   background: rgba(255, 255, 255, 0.12);
   border: 1px solid rgba(255, 255, 255, 0.48);
   border-radius: 999px;
   color: var(--white);
   cursor: pointer;
   display: inline-flex;
   font-size: 0.82rem;
   font-weight: 800;
   letter-spacing: 0;
   margin-top: 1.55rem;
   padding: 0.72rem 1.15rem;
   text-transform: uppercase;
   transition: background 160ms ease, border-color 160ms ease, transform 160ms ease;
}

.hero-access-button:hover,
.hero-access-button:focus-visible {
   background: rgba(255, 255, 255, 0.2);
   border-color: rgba(255, 255, 255, 0.72);
   outline: none;
   transform: translateY(-1px);
}

.section-inner {
   margin: 0 auto;
   max-width: 1180px;
   padding-left: 4vw;
   padding-right: 4vw;
}

.intro-section {
   background:
      radial-gradient(circle at 12% 18%, rgba(184, 148, 82, 0.16), transparent 26rem),
      linear-gradient(180deg, var(--paper) 0%, var(--white) 100%);
   padding: 6.5rem 0;
}

.intro-grid {
   align-items: center;
   display: grid;
   gap: 3rem;
   grid-template-columns: minmax(0, 0.9fr) minmax(300px, 1.1fr);
}

.intro-copy p:not(.eyebrow),
.section-heading p:not(.eyebrow),
.video-copy p:not(.eyebrow),
.thanks-content p {
   color: var(--muted);
   font-size: 1.08rem;
   margin-top: 1.25rem;
   max-width: 620px;
}

.memory-strip {
   display: grid;
   gap: 0.9rem;
   grid-template-columns: 1fr 0.82fr;
   grid-template-rows: 178px 178px;
}

.memory-strip figure {
   border-radius: var(--radius);
   box-shadow: var(--soft-shadow);
   margin: 0;
   overflow: hidden;
}

.memory-strip figure:first-child {
   grid-row: span 2;
}

.memory-strip img {
   height: 100%;
   object-fit: cover;
   width: 100%;
}

.highlights {
   display: grid;
   gap: 1rem;
   grid-template-columns: repeat(3, 1fr);
   margin-top: 3.25rem;
}

.highlights article {
   background: var(--sage-dark);
   border-radius: var(--radius);
   box-shadow: var(--soft-shadow);
   min-height: 132px;
   padding: 1.3rem;
}

.highlights article:nth-child(2) {
   background: var(--rose-dark);
}

.highlights article:nth-child(3) {
   background: var(--blue);
}

.highlights span {
   color: rgba(255, 255, 255, 0.72);
   display: block;
   font-size: 0.82rem;
   font-weight: 800;
   margin-bottom: 0.6rem;
   text-transform: uppercase;
}

.highlights strong {
   color: var(--white);
   display: block;
   font-family: Georgia, "Times New Roman", serif;
   font-size: 1.45rem;
   font-weight: 500;
   line-height: 1.18;
}

.video-section {
   background: var(--sage-dark);
   color: var(--white);
   padding: 6rem 0;
}

.video-layout {
   align-items: center;
   display: grid;
   gap: 3rem;
   grid-template-columns: minmax(260px, 0.62fr) minmax(320px, 1fr);
}

.video-copy p:not(.eyebrow) {
   color: rgba(255, 255, 255, 0.76);
}

.video-frame {
   background: #111815;
   border: 1px solid rgba(255, 255, 255, 0.18);
   border-radius: var(--radius);
   box-shadow: var(--shadow);
   overflow: hidden;
}

.video-frame video {
   aspect-ratio: 16 / 9;
   background: #111815;
   height: auto;
   width: 100%;
}

.gallery-section {
   background:
      linear-gradient(180deg, var(--white) 0%, #f8f7f4 100%);
   padding: 6.5rem 4vw;
}

.section-heading {
   padding-left: 0;
   padding-right: 0;
   text-align: center;
}

.section-heading p:not(.eyebrow) {
   margin-left: auto;
   margin-right: auto;
}

.gallery-count {
   color: var(--rose-dark);
   font-size: 0.9rem;
   font-weight: 800;
   margin-top: 1rem;
   text-transform: uppercase;
}

.gallery-grid {
   display: grid;
   gap: 0.85rem;
   grid-auto-flow: dense;
   grid-auto-rows: 118px;
   grid-template-columns: repeat(12, minmax(0, 1fr));
   margin: 3rem auto 0;
   max-width: 1280px;
}

.gallery-item {
   background: var(--paper-strong);
   border: 0;
   border-radius: var(--radius);
   box-shadow: 0 8px 24px rgba(32, 37, 34, 0.08);
   cursor: pointer;
   grid-column: span 3;
   grid-row: span 2;
   overflow: hidden;
   padding: 0;
   position: relative;
}

.gallery-item.wide {
   grid-column: span 6;
}

.gallery-item img {
   height: 100%;
   object-fit: cover;
   transform: scale(1.001);
   transition: transform 260ms ease, filter 260ms ease;
   width: 100%;
}

.gallery-item:hover img,
.gallery-item:focus-visible img {
   filter: saturate(1.05) contrast(1.04);
   transform: scale(1.04);
}

.gallery-item:focus-visible {
   box-shadow: 0 0 0 4px rgba(184, 148, 82, 0.55), var(--soft-shadow);
   outline: none;
}

.thanks-section {
   align-items: center;
   color: var(--white);
   display: flex;
   min-height: 560px;
   overflow: hidden;
   padding: 6.2rem 4vw;
   position: relative;
}

.thanks-section img,
.thanks-overlay {
   height: 100%;
   inset: 0;
   position: absolute;
   width: 100%;
}

.thanks-section img {
   object-fit: cover;
   object-position: center;
   z-index: 0;
}

.thanks-overlay {
   background:
      linear-gradient(90deg, rgba(28, 37, 34, 0.84), rgba(28, 37, 34, 0.42) 58%, rgba(28, 37, 34, 0.18)),
      linear-gradient(0deg, rgba(28, 37, 34, 0.48), rgba(28, 37, 34, 0));
   z-index: 1;
}

.thanks-content {
   max-width: 700px;
   position: relative;
   z-index: 2;
}

.thanks-content p {
   color: rgba(255, 255, 255, 0.82);
}

.access-dialog {
   background: transparent;
   border: 0;
   color: var(--ink);
   margin: auto;
   max-width: min(420px, calc(100vw - 2rem));
   padding: 0;
}

.access-dialog::backdrop {
   background: rgba(16, 22, 20, 0.62);
   backdrop-filter: blur(5px);
}

.access-card {
   background: rgba(255, 248, 242, 0.98);
   border: 1px solid rgba(66, 99, 86, 0.16);
   border-radius: var(--radius);
   box-shadow: var(--shadow);
   display: grid;
   gap: 0.85rem;
   padding: 2rem;
   position: relative;
   width: 100%;
}

.access-card h2 {
   font-size: 2.1rem;
}

.access-card label {
   color: var(--muted);
   font-size: 0.86rem;
   font-weight: 800;
   text-transform: uppercase;
}

.access-card input {
   background: var(--white);
   border: 1px solid rgba(32, 37, 34, 0.2);
   border-radius: var(--radius);
   color: var(--ink);
   font-size: 1rem;
   min-height: 48px;
   padding: 0.72rem 0.85rem;
   width: 100%;
}

.access-card input:focus {
   border-color: var(--gold);
   box-shadow: 0 0 0 4px rgba(184, 148, 82, 0.2);
   outline: none;
}

.access-error {
   color: var(--rose-dark);
   font-size: 0.95rem;
   font-weight: 700;
}

.access-submit {
   background: var(--sage-dark);
   border: 0;
   border-radius: 999px;
   color: var(--white);
   cursor: pointer;
   font-weight: 800;
   margin-top: 0.4rem;
   min-height: 48px;
   padding: 0.75rem 1rem;
   text-transform: uppercase;
}

.access-submit:hover,
.access-submit:focus-visible {
   background: var(--sage);
   outline: none;
}

.access-close {
   align-items: center;
   background: transparent;
   border: 0;
   color: var(--muted);
   cursor: pointer;
   display: inline-flex;
   font-size: 1.6rem;
   height: 36px;
   justify-content: center;
   line-height: 1;
   position: absolute;
   right: 0.75rem;
   top: 0.75rem;
   width: 36px;
}

.access-close:hover,
.access-close:focus-visible {
   color: var(--rose-dark);
   outline: none;
}

.lightbox {
   background: rgba(15, 20, 18, 0.92);
   border: 0;
   color: var(--white);
   height: 100%;
   margin: 0;
   max-height: none;
   max-width: none;
   opacity: 0;
   padding: 0;
   transition: opacity 160ms ease;
   width: 100%;
}

.lightbox[open] {
   align-items: center;
   display: flex;
   justify-content: center;
   opacity: 1;
}

.lightbox::backdrop {
   background: rgba(15, 20, 18, 0.86);
}

.lightbox-figure {
   align-items: center;
   display: flex;
   flex-direction: column;
   gap: 1rem;
   margin: 0;
   max-height: 88vh;
   max-width: min(1180px, calc(100vw - 8rem));
}

.lightbox-figure img {
   border-radius: var(--radius);
   box-shadow: var(--shadow);
   max-height: calc(88vh - 3rem);
   object-fit: contain;
   width: auto;
}

.lightbox-figure figcaption {
   color: rgba(255, 255, 255, 0.86);
   font-size: 1rem;
   min-height: 1.4rem;
   text-align: center;
}

.lightbox-close,
.lightbox-nav {
   align-items: center;
   background: rgba(255, 255, 255, 0.12);
   border: 1px solid rgba(255, 255, 255, 0.24);
   border-radius: 999px;
   color: var(--white);
   cursor: pointer;
   display: inline-flex;
   justify-content: center;
   position: fixed;
   transition: background 160ms ease, transform 160ms ease;
   z-index: 2;
}

.lightbox-close {
   font-size: 2rem;
   height: 48px;
   line-height: 1;
   right: 1.35rem;
   top: 1.35rem;
   width: 48px;
}

.lightbox-nav {
   font-size: 3rem;
   height: 58px;
   top: 50%;
   transform: translateY(-50%);
   width: 58px;
}

.lightbox-prev {
   left: 1.35rem;
}

.lightbox-next {
   right: 1.35rem;
}

.lightbox-close:hover,
.lightbox-close:focus-visible,
.lightbox-nav:hover,
.lightbox-nav:focus-visible {
   background: rgba(255, 255, 255, 0.22);
   outline: none;
}

.lightbox-nav:hover,
.lightbox-nav:focus-visible {
   transform: translateY(-50%) scale(1.04);
}

@media (max-width: 980px) {
   .site-header {
      align-items: flex-start;
      flex-direction: column;
      gap: 0.75rem;
   }

   .site-nav {
      flex-wrap: wrap;
   }

   .hero {
      min-height: 82svh;
      padding-top: 10.5rem;
   }

   h1 {
      font-size: 3.4rem;
   }

   h2 {
      font-size: 2.35rem;
   }

   .intro-grid,
   .video-layout {
      grid-template-columns: 1fr;
   }

   .highlights {
      grid-template-columns: 1fr;
   }

   .gallery-grid {
      grid-template-columns: repeat(6, minmax(0, 1fr));
   }

   .gallery-item {
      grid-column: span 3;
   }

   .gallery-item.wide {
      grid-column: span 6;
   }
}

@media (max-width: 620px) {
   body {
      font-size: 0.96rem;
   }

   .site-header {
      min-height: 92px;
      padding: 0.82rem 1rem;
   }

   .brand {
      font-size: 1.08rem;
   }

   .site-nav {
      gap: 0.2rem;
   }

   .site-nav a {
      font-size: 0.75rem;
      padding: 0.42rem 0.58rem;
   }

   .hero {
      min-height: 80svh;
      padding: 9.6rem 1.1rem 4.5rem;
   }

   .hero-shade {
      background:
         linear-gradient(90deg, rgba(31, 38, 35, 0.78) 0%, rgba(31, 38, 35, 0.58) 54%, rgba(31, 38, 35, 0.24) 100%),
         linear-gradient(0deg, rgba(31, 38, 35, 0.6) 0%, rgba(31, 38, 35, 0.08) 58%);
   }

   h1 {
      font-size: 2.7rem;
   }

   h2 {
      font-size: 2rem;
   }

   .hero-copy {
      font-size: 1.02rem;
   }

   .intro-section,
   .video-section {
      padding: 4.5rem 0;
   }

   .section-inner {
      padding-left: 1.1rem;
      padding-right: 1.1rem;
   }

   .memory-strip {
      grid-template-columns: 1fr;
      grid-template-rows: repeat(3, 170px);
   }

   .memory-strip figure:first-child {
      grid-row: auto;
   }

   .gallery-section {
      padding: 4.8rem 1rem;
   }

   .gallery-grid {
      gap: 0.65rem;
      grid-auto-rows: 132px;
      grid-template-columns: repeat(2, minmax(0, 1fr));
   }

   .gallery-item,
   .gallery-item.wide {
      grid-column: span 1;
      grid-row: span 1;
   }

   .thanks-section {
      min-height: 500px;
      padding: 4.8rem 1.1rem;
   }

   .lightbox-figure {
      max-width: calc(100vw - 1.5rem);
   }

   .lightbox-figure img {
      max-height: calc(82vh - 3rem);
   }

   .lightbox-close {
      height: 42px;
      right: 0.8rem;
      top: 0.8rem;
      width: 42px;
   }

   .lightbox-nav {
      bottom: 1rem;
      height: 48px;
      top: auto;
      transform: none;
      width: 48px;
   }

   .lightbox-nav:hover,
   .lightbox-nav:focus-visible {
      transform: scale(1.04);
   }

   .lightbox-prev {
      left: calc(50% - 58px);
   }

   .lightbox-next {
      right: calc(50% - 58px);
   }
}