@font-face {
  font-family:Barlow;
  src:url('assets/fonts/barlow-condensed-800.ttf') format('truetype');
  font-style:normal;
  font-weight:800;
  font-display:swap;
}

@font-face {
  font-family:Plex;
  src:url('assets/fonts/ibm-plex-sans-400.ttf') format('truetype');
  font-style:normal;
  font-weight:400;
  font-display:swap;
}

@font-face {
  font-family:Typewriter;
  src:url('assets/fonts/special-elite-400.ttf') format('truetype');
  font-style:normal;
  font-weight:400;
  font-display:swap;
}

:root {
  color-scheme:dark;
  --ink:#101511;
  --deep:#0b100d;
  --paper:#ded8c6;
  --text:#eee9dc;
  --muted:#b5baac;
  --red:#bb342a;
  --green:#a5b49a;
  --line:#343e33;
  --display:Barlow,'Arial Narrow',sans-serif;
  --body:Plex,Arial,sans-serif;
}

* {
  box-sizing:border-box;
}

html {
  scroll-behavior:smooth;
  scroll-padding-top:24px;
  scrollbar-color:#65715d var(--ink);
}

body {
  margin:0;
  background:var(--ink);
  color:var(--text);
  font-family:var(--body);
  font-size:16px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}

::selection {
  color:#fff6e4;
  background:#89362d;
}

a {
  color:inherit;
  text-underline-offset:5px;
}

a:focus-visible {
  outline:3px solid #e6bd71;
  outline-offset:6px;
}

h1,h2,h3,p {
  margin:0;
}

h1,h2,h3 {
  text-wrap:balance;
}

p {
  max-width:70ch;
}

svg {
  display:block;
}

.sr-only {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

.skip-link {
  position:fixed;
  top:12px;
  left:12px;
  padding:10px 18px;
  background:var(--paper);
  color:var(--ink);
  z-index:10;
  transform:translateY(-150%);
}

.skip-link:focus {
  transform:translateY(0);
}

.site-header {
  height:78px;
  padding:0 5%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  border-bottom:1px solid var(--line);
  background:var(--deep);
}

.wordmark {
  display:flex;
  align-items:center;
  gap:11px;
  text-decoration:none;
  font-family:var(--display);
  font-size:25px;
  letter-spacing:.035em;
  white-space:nowrap;
}

.wordmark svg {
  width:20px;
  height:20px;
  fill:var(--red);
}

.header-note {
  font-size:11px;
  letter-spacing:.16em;
  color:var(--muted);
}

.header-link {
  min-height:44px;
  font-size:12px;
  text-decoration:none;
  display:flex;
  gap:16px;
  align-items:center;
}

.header-link:hover,.text-link:hover,.hero-bottom a:hover {
  color:#e5b39f;
}

.hero {
  min-height:740px;
  position:relative;
  isolation:isolate;
  display:flex;
  flex-direction:column;
  justify-content:center;
  overflow:hidden;
}

.corridor,.hero-shade {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:-2;
}

.corridor {
  object-fit:cover;
  object-position:center 52%;
}

.hero-shade {
  z-index:-1;
  background:linear-gradient(90deg,rgba(5,9,6,.88) 0%,rgba(5,9,6,.57) 35%,rgba(5,9,6,.07) 72%),linear-gradient(0deg,var(--deep),transparent 23%);
}

.hero-content {
  padding:58px 7% 96px;
  max-width:850px;
}

.hero h1 {
  font-family:var(--display);
  font-size:clamp(80px,9vw,128px);
  font-weight:800;
  letter-spacing:-.025em;
  line-height:.9;
  white-space:nowrap;
  color:#ebe7d8;
  text-shadow:0 3px 22px rgba(0,0,0,.35);
}

.hero h1 span {
  display:block;
  color:#bd4637;
}

.hero-subtitle {
  font-weight:800;
  font-family:var(--display);
  font-size:clamp(19px,2vw,25px);
  letter-spacing:.06em;
  margin-top:17px;
  line-height:1.15;
}

.hero-story {
  font-family:Typewriter,Georgia,serif;
  color:#d4d6c6;
  font-size:18px;
  line-height:1.8;
  margin-top:35px;
}

.hero-date {
  display:flex;
  gap:12px;
  align-items:center;
  font-size:12px;
  letter-spacing:.075em;
  margin:30px 0 22px;
  color:#e3e6d6;
}

.status-light {
  width:6px;
  height:6px;
  background:#c74534;
  border-radius:50%;
  flex-shrink:0;
  animation:signal 6s ease-out 2;
}

.date-divider {
  margin:0 9px;
  color:#b6bca8;
}

.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:35px;
  min-height:54px;
  padding:13px 24px;
  color:#fff7ed;
  background:var(--red);
  border:1px solid #cf5144;
  text-decoration:none;
  font-size:13px;
  letter-spacing:.035em;
  transition:background .2s ease-out;
}

.button:hover {
  background:#97281f;
}

.button svg {
  width:21px;
  height:21px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.5;
}

.hero-caption {
  margin-top:15px;
  font-size:12px;
  color:#c1c5b7;
}

.hero-bottom {
  position:absolute;
  bottom:26px;
  left:5%;
  right:5%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  font-size:11px;
  letter-spacing:.1em;
  color:#b5bca9;
}

.hero-bottom a {
  display:flex;
  gap:24px;
  align-items:center;
  text-decoration:none;
  letter-spacing:.04em;
}

.wall-label {
  position:absolute;
  right:5%;
  top:65px;
  color:#c4c1a6;
  opacity:.7;
  border:1px solid #aaa78e;
  padding:10px 14px;
  font-family:var(--display);
  font-size:16px;
  line-height:1.15;
  letter-spacing:.11em;
  transform:rotate(3deg);
}

.notice-strip {
  background:#b0b8a0;
  color:#192318;
  min-height:49px;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:38px;
  padding:12px 24px;
  font-size:11px;
  font-weight:bold;
  letter-spacing:.15em;
}

.notice-strip>span {
  font-size:19px;
  line-height:1;
}

.section-wrap {
  max-width:1192px;
  margin:0 auto;
  padding-left:36px;
  padding-right:36px;
}

.admission-section {
  display:grid;
  grid-template-columns:1fr .95fr;
  align-items:center;
  gap:100px;
  padding-top:108px;
  padding-bottom:112px;
}

.ward-story h2 {
  font-family:var(--display);
  font-size:clamp(45px,4.7vw,65px);
  font-weight:800;
  line-height:1.02;
  text-transform:uppercase;
  letter-spacing:-.01em;
  margin-bottom:26px;
}

.ward-story em {
  font-style:normal;
  color:#aab59a;
}

.ward-story>p {
  font-size:14px;
  color:#bfc4b6;
  margin-top:19px;
}

.ward-story strong {
  color:var(--text);
}

.story-note {
  display:flex;
  gap:18px;
  align-items:center;
  margin-top:30px;
  padding-top:24px;
  border-top:1px solid var(--line);
}

.small-cross {
  font-family:var(--display);
  font-size:33px;
  color:#a6b49a;
  line-height:1;
}

.story-note p {
  font-family:Typewriter,Georgia,serif;
  font-size:13px;
  line-height:1.7;
  color:#c3c9b7;
}

.admission-paper {
  position:relative;
  transform:rotate(1deg);
  background:var(--paper);
  color:#242c23;
  padding:30px 35px 24px;
  box-shadow:0 18px 38px #0004;
  color-scheme:light;
}

.paper-top {
  display:flex;
  justify-content:space-between;
  font-size:11px;
  letter-spacing:.13em;
  border-bottom:1px solid #9b9b88;
  padding-bottom:15px;
}

.admission-paper h3 {
  font-family:var(--display);
  font-size:44px;
  line-height:1.1;
  margin-top:24px;
  letter-spacing:-.01em;
}

.paper-stamp {
  display:inline-block;
  color:#91352b;
  border:2px solid #91352b;
  padding:3px 8px 1px;
  font-family:Typewriter,Georgia,serif;
  font-size:12px;
  line-height:1.4;
  transform:rotate(-5deg);
  margin-top:12px;
}

dl {
  margin:23px 0 0;
}

dl>div {
  display:grid;
  grid-template-columns:78px 1fr;
  border-top:1px solid #aaa998;
  padding:15px 0;
  gap:12px;
}

dt {
  font-family:Typewriter,Georgia,serif;
  font-size:12px;
  line-height:1.8;
}

dd {
  margin:0;
  font-size:14px;
  line-height:1.6;
}

dd>span {
  display:block;
  color:#45503e;
  margin-top:5px;
  font-size:13px;
}

.map-link {
  font-size:12px;
  display:inline-block;
  margin-top:12px;
}

.map-link:hover {
  color:#91352b;
}

.paper-bottom {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  border-top:1px solid #aaa998;
  padding-top:19px;
  margin-top:7px;
  font-size:11px;
  letter-spacing:.13em;
  line-height:1.6;
}

.barcode {
  height:28px;
  width:110px;
  background:repeating-linear-gradient(90deg,#343a2c 0 2px,transparent 2px 4px,#343a2c 4px 5px,transparent 5px 8px,#343a2c 8px 12px,transparent 12px 14px,#343a2c 14px 15px,transparent 15px 19px);
}

.video-section {
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  align-items:center;
  gap:64px;
  padding-top:12px;
  padding-bottom:100px;
}

.video-intro h2 {
  font-family:var(--display);
  font-size:clamp(36px,3.5vw,48px);
  line-height:1.05;
  margin-bottom:20px;
}

.video-intro p {
  font-size:14px;
  color:var(--muted);
}

.video-intro .video-theme {
  margin-top:22px;
  font-family:Typewriter,Georgia,serif;
  font-size:12px;
  color:var(--green);
}

.video-frame {
  aspect-ratio:16 / 9;
  background:var(--deep);
  border:1px solid var(--line);
}

.video-frame iframe {
  display:block;
  width:100%;
  height:100%;
  border:0;
}

.night-shift {
  background:#202b23;
  border-top:1px solid #3a4535;
  border-bottom:1px solid #3a4535;
}

.shift-layout {
  padding-top:80px;
  padding-bottom:80px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:100px;
}

.shift-intro h2 {
  font-family:var(--display);
  font-size:64px;
  line-height:.98;
  letter-spacing:-.01em;
  color:#c3cbb5;
}

.shift-intro p {
  font-size:14px;
  color:#c1c9b8;
  margin-top:25px;
}

.text-link {
  display:inline-flex;
  gap:25px;
  margin-top:26px;
  font-size:13px;
}

.shift-row {
  padding:21px 0;
  border-bottom:1px solid #455141;
}

.shift-row:first-child {
  padding-top:0;
}

.shift-row:last-child {
  border-bottom:0;
  padding-bottom:0;
}

.shift-row h3 {
  font-size:16px;
  font-weight:400;
  margin-bottom:8px;
  color:#eee9dc;
}

.shift-row p {
  font-size:13px;
  line-height:1.8;
  color:#c1c9b8;
}

.visitor-info {
  padding-top:74px;
  padding-bottom:80px;
}

.visitor-info h2 {
  font-family:var(--display);
  font-size:35px;
  line-height:1.2;
  margin-bottom:30px;
}

.visitor-columns {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:100px;
}

.visitor-columns h3 {
  font-size:15px;
  font-weight:400;
  margin-bottom:10px;
}

.visitor-columns p {
  font-size:13px;
  color:#bfc4b6;
  line-height:1.8;
}

.rsvp {
  text-align:center;
  background:var(--deep);
  border-top:1px solid var(--line);
  padding:73px 24px 80px;
}

.rsvp-inner {
  max-width:720px;
  margin:0 auto;
}

.rsvp-cross {
  width:26px;
  height:26px;
  margin:0 auto 26px;
  fill:var(--red);
}

.rsvp h2 {
  font-family:var(--display);
  font-size:clamp(52px,5vw,72px);
  line-height:.98;
  letter-spacing:-.015em;
}

.rsvp p {
  font-size:14px;
  color:#bfc4b6;
  margin:26px auto;
}

.email-address {
  display:block;
  width:fit-content;
  margin:19px auto 0;
  font-size:12px;
  color:#b5bdac;
}

.site-footer {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding:24px 5%;
  border-top:1px solid var(--line);
  font-size:11px;
  letter-spacing:.09em;
  color:#a4ae99;
}

.site-footer p {
  font-family:Typewriter,Georgia,serif;
  font-size:11px;
  letter-spacing:0;
}

.footer-divider {
  margin:0 8px;
}

@keyframes signal {
  0%,91%,96%,100% {
    opacity:1;
  }
  93%,98% {
    opacity:.35;
  }
}

@media(min-width:1600px) {
  .hero {
    min-height:820px;
  }
  .hero-content {
    padding-left:max(7%,calc((100vw - 1220px)/2));
  }
}

@media(max-width:1000px) {
  .header-note {
    display:none;
  }
  .admission-section,.shift-layout,.visitor-columns {
    gap:50px;
  }
  .hero {
    min-height:680px;
  }
  .hero-content {
    padding-left:6%;
  }
  .wall-label {
    top:35px;
  }
  .notice-strip {
    gap:20px;
    font-size:11px;
  }
  .admission-section {
    padding-top:80px;
    padding-bottom:80px;
  }
  .admission-paper {
    padding:25px;
  }
  .shift-intro h2 {
    font-size:56px;
  }
}

@media(max-width:680px) {
  .video-section {
    grid-template-columns:1fr;
    gap:26px;
    padding-top:0;
    padding-bottom:55px;
  }
  .site-header {
    height:66px;
    padding:0 22px;
    gap:12px;
  }
  .wordmark {
    font-size:23px;
  }
  .header-link {
    font-size:11px;
    gap:10px;
  }
  .hero {
    min-height:720px;
    justify-content:flex-end;
  }
  .corridor {
    object-position:65% center;
  }
  .hero-shade {
    background:linear-gradient(0deg,#090f0c 0%,rgba(5,9,6,.78) 33%,rgba(5,9,6,.25) 80%);
  }
  .hero-content {
    padding:160px 25px 94px;
    max-width:100%;
  }
  .hero h1 {
    font-size:clamp(72px,19vw,112px);
  }
  .hero-subtitle {
    font-size:19px;
    letter-spacing:.035em;
    margin-top:13px;
  }
  .hero-story {
    font-size:15px;
    margin-top:25px;
    line-height:1.85;
  }
  .hero-date {
    font-size:12px;
    letter-spacing:0;
    gap:8px;
    margin-top:23px;
  }
  .date-divider {
    margin:0 5px;
  }
  .hero-caption {
    font-size:12px;
    max-width:290px;
    line-height:1.7;
  }
  .button {
    min-height:54px;
    font-size:13px;
  }
  .wall-label {
    top:30px;
    right:26px;
    font-size:13px;
    padding:8px 11px;
  }
  .hero-bottom {
    left:25px;
    right:25px;
    bottom:24px;
    font-size:11px;
  }
  .hero-bottom>span {
    display:none;
  }
  .hero-bottom a {
    width:100%;
    justify-content:space-between;
  }
  .notice-strip {
    justify-content:space-between;
    text-align:center;
    gap:16px;
    padding:13px 22px;
    min-height:47px;
    letter-spacing:.09em;
    font-size:11px;
  }
  .notice-strip p:nth-of-type(2),.notice-strip>span:last-child {
    display:none;
  }
  .section-wrap {
    padding-left:26px;
    padding-right:26px;
  }
  .admission-section {
    grid-template-columns:1fr;
    gap:45px;
    padding-top:62px;
    padding-bottom:62px;
  }
  .ward-story h2 {
    font-size:49px;
  }
  .ward-story>p {
    font-size:14px;
  }
  .story-note {
    margin-top:24px;
    padding-top:20px;
  }
  .admission-paper {
    padding:25px 26px;
  }
  .admission-paper h3 {
    font-size:40px;
  }
  .paper-top {
    font-size:11px;
    letter-spacing:.03em;
  }
  dl>div {
    grid-template-columns:64px 1fr;
    gap:8px;
  }
  dd {
    font-size:13px;
  }
  .shift-layout {
    grid-template-columns:1fr;
    gap:35px;
    padding-top:55px;
    padding-bottom:50px;
  }
  .shift-intro h2 {
    font-size:55px;
  }
  .shift-intro p {
    margin-top:21px;
  }
  .shift-row {
    padding:20px 0;
  }
  .shift-row p {
    font-size:14px;
  }
  .visitor-info {
    padding-top:50px;
    padding-bottom:52px;
  }
  .visitor-info h2 {
    font-size:32px;
  }
  .visitor-columns {
    grid-template-columns:1fr;
    gap:28px;
  }
  .visitor-columns p {
    font-size:14px;
  }
  .rsvp {
    padding:54px 25px 59px;
  }
  .rsvp h2 {
    font-size:56px;
  }
  .rsvp p {
    font-size:13px;
  }
  .rsvp p br {
    display:none;
  }
  .site-footer {
    padding:25px;
    flex-wrap:wrap;
    gap:16px;
    font-size:11px;
  }
  .site-footer p {
    order:3;
    flex-basis:100%;
    font-size:11px;
  }
}

@media(max-width:360px) {
  .hero-content {
    padding-left:20px;
    padding-right:20px;
  }
  .hero-date {
    font-size:11px;
  }
  .hero-subtitle {
    font-size:17px;
  }
  .hero h1 {
    font-size:66px;
  }
  .section-wrap {
    padding-left:22px;
    padding-right:22px;
  }
  .admission-paper {
    padding:22px;
  }
  .admission-paper h3 {
    font-size:35px;
  }
  .rsvp h2 {
    font-size:48px;
  }
  .notice-strip {
    font-size:11px;
  }
  .header-link {
    font-size:11px;
  }
  .wordmark {
    font-size:18px;
    gap:7px;
  }
}

@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto;
  }
  *,*::before,*::after {
    animation:none!important;
    transition:none!important;
  }
}