:root {
  color-scheme: light;
  --paper: #fcfaf5;
  --surround: #e9e4da;
  --ink: #30392d;
  --muted: #67695f;
  --gold: #92764d;
  --line: #d9cfbb;
  --display: "Cormorant Garamond", Georgia, serif;
  font-family: "Menu Sans", Arial, sans-serif;
  font-synthesis: none;
  color: var(--ink);
  background: var(--surround);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
* { box-sizing: border-box; }
body { margin: 0; }
::selection { color: var(--ink); background: #e9dfca; }
.menu-book { width: min(100% - 64px, 820px); margin: 40px auto; }
.paper {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 62px 72px 58px;
  border: 1px solid #ded5c4;
  background: var(--paper);
  box-shadow: 0 12px 50px #46391e0b;
}
.paper::before { content: ""; position: absolute; inset: 13px; border: 1px solid #c8b58b50; pointer-events: none; }
.menu-paper { min-height: 1160px; }
.paper-header { position: relative; padding-bottom: 37px; border-bottom: 1px solid var(--line); }
.paper-header::after { content: ""; position: absolute; left: 50%; bottom: -3px; width: 5px; height: 5px; background: #af966b; box-shadow: 0 0 0 7px var(--paper); transform: translateX(-50%) rotate(45deg); }
.partners { display: flex; justify-content: center; align-items: center; gap: 26px; }
.brand { display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; }
.brand-name { display: block; font-size: 23px; font-weight: 700; letter-spacing: 3.5px; line-height: 1.35; }
.brand-detail { display: block; color: var(--muted); font-size: 9px; letter-spacing: 2.8px; line-height: 1.5; text-align: center; }
.brand-kasakon { --brand-tracking: 2.9px; --detail-tracking: 1.9px; }
.brand-kasakon .brand-name { font-family: Arial, sans-serif; font-size: 22px; letter-spacing: var(--brand-tracking); text-indent: var(--brand-tracking); }
.brand-kasakon .brand-detail { align-self: stretch; font-family: Arial, sans-serif; font-size: 8px; letter-spacing: var(--detail-tracking); text-indent: var(--detail-tracking); }
.partner-divider { width: 1px; height: 39px; background: #c9bda5; }
.invitation { display: grid; justify-items: center; width: 100%; max-width: 600px; margin-inline: auto; padding-top: 43px; text-align: center; }
.invitation .invitation-title { width: 100%; margin: 0 0 25px; color: var(--ink); font-family: var(--display); font-size: 43px; font-weight: 400; line-height: 1.12; letter-spacing: -.5px; }
.invitation .invitation-title > span, .invitation .invitation-title > em { display: block; }
.invitation .invitation-title > em { margin-top: 2px; color: var(--gold); font-size: 1.1em; font-weight: 400; }
.invitation p { width: 100%; max-width: 550px; margin: 0; color: var(--muted); font-size: 14.5px; line-height: 1.95; }
.invitation .confirmation-copy { margin-top: 18px; }
.event-details { display: grid; gap: 8px; width: 100%; max-width: 425px; margin: 22px auto 2px; padding: 15px 6px; border-top: 1px solid #d9cfbb99; border-bottom: 1px solid #d9cfbb99; text-align: center; }
.event-details p { display: flex; align-items: center; justify-content: center; gap: 9px; width: 100%; max-width: none; margin: 0; color: #5f654f; font: 400 13.5px/1.65 Arial, sans-serif; }
.event-details svg { flex: none; color: var(--gold); }
.event-date time { font-weight: 500; }
.invitation strong { color: #434a3c; font-family: Arial, sans-serif; font-weight: 600; }
.welcome { display: block; width: 100%; margin-top: 12px; color: #646b55; font-family: var(--display); font-size: 25px; font-style: italic; line-height: 1.5; }
.rsvp-button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: max-content;
  min-width: 195px;
  min-height: 46px;
  margin: 19px auto 0;
  padding: 12px 23px;
  border: 1px solid #99805a;
  border-radius: 999px;
  color: #fbf7ee;
  background: linear-gradient(135deg, #444f3c, #303b2e);
  box-shadow: 0 5px 16px #30392d12, inset 0 1px 0 #ffffff16;
  font: 500 12px/1.5 Arial, sans-serif;
  letter-spacing: .45px;
  text-decoration: none;
  transition: box-shadow .18s ease, transform .18s ease;
}
.rsvp-button svg { flex: none; color: #d2bd8e; }
.rsvp-button:hover { box-shadow: 0 7px 19px #30392d25, inset 0 1px 0 #ffffff16; transform: translateY(-1px); }
.rsvp-button:focus-visible { outline: 2px solid var(--gold); outline-offset: 4px; }
.menu-heading { width: 100%; padding-top: 38px; padding-bottom: 5px; text-align: center; }
.invitation .eyebrow { margin: 0 0 20px; color: var(--gold); font-size: 10px; line-height: 1.6; letter-spacing: 3.4px; text-transform: uppercase; text-indent: 3.4px; }
h1 { margin: 12px 0 23px; font-family: var(--display); font-size: 79px; font-weight: 500; line-height: 1.05; letter-spacing: -.8px; }
.menu-caption { font-weight: 400; display: flex; justify-content: center; align-items: center; gap: 15px; margin: 0; color: var(--gold); font-size: 10px; line-height: 1.6; letter-spacing: 2.5px; text-transform: uppercase; }
.menu-caption > span { text-indent: 2.5px; }
.menu-caption::before, .menu-caption::after { content: ""; width: 32px; height: 1px; background: #b69e76; opacity: .75; }
.courses { list-style: none; padding: 0; margin: 0; }
.course { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 22px; padding: 29px 0 32px; }
.course + .course { border-top: 1px solid var(--line); }
.course-number { padding-top: 15px; color: #a58b60; font-family: var(--display); font-size: 27px; font-style: italic; line-height: 1.5; }
.course-category { margin: 0 0 9px; color: var(--gold); font-size: 9px; line-height: 1.5; letter-spacing: 2.5px; text-transform: uppercase; }
.course h2 { margin: 0 0 11px; font-family: var(--display); font-size: 33px; font-weight: 500; line-height: 1.2; letter-spacing: -.2px; }
.course-description { margin: 0; color: var(--muted); font-size: 14.5px; line-height: 1.9; }
.paper-footer { display: flex; justify-content: center; align-items: center; gap: 13px; color: #78786c; font-size: 8px; line-height: 1.8; letter-spacing: 1.4px; text-transform: uppercase; text-align: center; }
.partners-footer { margin-top: auto; padding-top: 62px; }
.footer-dot { color: var(--gold); }
.confirmation-book { max-width: 720px; }
.confirmation-paper { min-height: 870px; }
.form-panel { width: 100%; max-width: 450px; margin: 37px auto 0; }
.form-title { margin: 0 0 15px; text-align: center; font-size: 46px; font-weight: 400; line-height: 1.1; letter-spacing: -.4px; }
.form-title em { display: block; color: var(--gold); font-weight: 400; }
.form-intro { margin: 0; color: var(--muted); text-align: center; font-size: 13px; line-height: 1.8; }
.form-panel .event-details { margin: 23px auto 27px; }
.form-name-row { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
.form-field { display: grid; align-content: start; gap: 7px; margin-bottom: 16px; }
.form-field label { color: #535c48; font: 600 12px/1.5 Arial, sans-serif; }
.form-field input { width: 100%; min-width: 0; height: 47px; border: 1px solid #d7ccb7; border-radius: 9px; padding: 10px 13px; background: #fffdfa; color: var(--ink); font: 400 15px/1.5 Arial, sans-serif; transition: border-color .15s ease; }
.form-field input:focus { border-color: var(--gold); outline: 2px solid #b9a07035; outline-offset: 2px; }
.form-field input[aria-invalid="true"] { border-color: #a95547; }
.form-field input::placeholder { color: #a09d91; }
.field-hint { font-size: 11px; line-height: 1.5; color: #858576; }
.field-error { font: 400 11px/1.5 Arial, sans-serif; color: #9b483c; }
.field-error:empty { display: none; }
.form-status { margin: 6px 0 16px; padding: 10px 12px; border: 1px solid #ba76684d; border-radius: 8px; color: #934d40; font-size: 12px; line-height: 1.7; }
.form-status[hidden], .success-panel[hidden], #registration-panel[hidden] { display: none; }
.form-panel .rsvp-button { cursor: pointer; }
.form-panel .rsvp-button:disabled { cursor: wait; opacity: .65; transform: none; }
.privacy-note { max-width: 340px; margin: 15px auto 0; color: #858576; font-size: 10px; line-height: 1.8; text-align: center; }
.back-link { display: block; width: fit-content; margin: 25px auto 0; padding: 7px 3px; color: var(--gold); font-size: 11px; line-height: 1.7; text-underline-offset: 4px; text-decoration-thickness: 1px; }
.back-link:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; border-radius: 3px; }
.success-panel { text-align: center; padding-top: 18px; }
.success-mark { display: flex; align-items: center; justify-content: center; width: 66px; height: 66px; margin: 0 auto 23px; border: 1px solid #af966b; border-radius: 50%; color: #57664b; }
.success-panel h2 { margin: 0 0 18px; color: var(--ink); font: 400 39px/1.15 var(--display); }
.success-panel h2:focus { outline: none; }
.success-panel > p:not(.welcome) { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.85; }
@media (max-width: 700px) {
  .menu-book { width: min(100% - 28px, 580px); margin: 14px auto; }
  .paper { padding: 44px 34px 40px; }
  .paper::before { inset: 10px; }
  .menu-paper { min-height: 0; }
  .paper-header { padding-bottom: 31px; }
  .partners { gap: 21px; }
  .brand-name { font-size: 21px; }
  .brand-kasakon { --brand-tracking: 2.4px; --detail-tracking: 1.7px; }
  .brand-kasakon .brand-name { font-size: 20px; }
  .brand-detail { font-size: 8px; letter-spacing: 2.5px; }
  .brand-kasakon .brand-detail { font-size: 7.5px; }
  .invitation { padding-top: 36px; }
  .invitation .invitation-title { font-size: 36px; letter-spacing: -.35px; }
  .invitation p { font-size: 14px; }
  .event-details p { font-size: 13px; }
  .welcome { font-size: 24px; }
  .menu-heading { padding-top: 34px; padding-bottom: 4px; }
  h1 { font-size: 70px; }
  .invitation .eyebrow { font-size: 9px; letter-spacing: 2.9px; text-indent: 2.9px; }
  .menu-caption { gap: 12px; font-size: 9px; letter-spacing: 2.2px; }
  .menu-caption > span { text-indent: 2.2px; }
  .menu-caption::before, .menu-caption::after { width: 26px; }
  .course { grid-template-columns: 24px minmax(0, 1fr); gap: 16px; padding: 27px 0 29px; }
  .course-number { font-size: 25px; }
  .course h2 { font-size: 31px; }
  .course-description { font-size: 14px; }
  .course-category { font-size: 8.5px; letter-spacing: 2px; }
  .partners-footer { padding-top: 43px; }
  .paper-footer { gap: 9px; font-size: 7px; letter-spacing: 1px; }
  .confirmation-paper { min-height: 0; }
  .form-title { font-size: 39px; }
}
@media (max-width: 430px) {
  :root { background: var(--paper); }
  .menu-book { width: 100%; margin: 0; }
  .paper { padding: 37px 27px 34px; border: 0; box-shadow: none; }
  .paper::before { inset: 11px; }
  .brand-name { font-size: 20px; letter-spacing: 3px; }
  .brand-kasakon { --brand-tracking: 2.3px; --detail-tracking: 1.6px; }
  .brand-kasakon .brand-name { font-size: 19px; }
  .brand-kasakon .brand-detail { font-size: 7.4px; }
  .partners { gap: 18px; }
  .partner-divider { height: 36px; }
  .invitation { padding-top: 33px; }
  .invitation .invitation-title { font-size: clamp(27px, 8.2vw, 34px); letter-spacing: -.3px; margin-bottom: 22px; }
  .invitation .invitation-title > em { font-size: 1.07em; }
  .invitation p { font-size: 13.6px; line-height: 1.9; }
  .invitation .event-details p { font-size: 12.5px; }
  .welcome { font-size: 23px; }
  .rsvp-button { min-width: 191px; margin-top: 17px; }
  .menu-heading { padding-top: 32px; }
  h1 { font-size: 68px; }
  .invitation .eyebrow { font-size: 8.5px; letter-spacing: 2.6px; text-indent: 2.6px; }
  .course { grid-template-columns: 20px minmax(0, 1fr); gap: 13px; }
  .course h2 { font-size: 29px; }
  .course-description { font-size: 13.5px; }
  .partners-footer { padding-top: 36px; }
  .form-panel { margin-top: 31px; }
  .form-title { font-size: 36px; }
  .form-name-row { grid-template-columns: 1fr; gap: 0; }
  .form-field { margin-bottom: 15px; }
  .form-field input { font-size: 16px; }
  .success-panel h2 { font-size: 34px; }
}
@media (prefers-reduced-motion: reduce) {
  .rsvp-button { transition: none; }
  .rsvp-button:hover { transform: none; }
}
@media print {
  @page { size: A4; margin: 0; }
  :root, body { background: var(--paper); -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .menu-book { width: 210mm; margin: 0; }
  .paper { width: 210mm; min-height: 297mm; margin: 0; padding: 15mm 20mm; border: 0; box-shadow: none; }
  .paper-header { padding-bottom: 24px; }
  .invitation { padding-top: 23px; }
  .invitation .invitation-title { font-size: 28px; margin-bottom: 13px; }
  .invitation p { font-size: 11px; line-height: 1.65; }
  .invitation .confirmation-copy { margin-top: 10px; }
  .welcome { font-size: 18px; margin-top: 7px; }
  .rsvp-button { display: none; }
  .menu-heading { padding: 20px 0 9px; }
  h1 { font-size: 49px; margin: 8px 0 14px; }
  .course { padding: 17px 0; }
  .course h2 { font-size: 26px; margin-bottom: 7px; }
  .course-description { font-size: 11px; line-height: 1.7; }
  .partners-footer { padding-top: 25px; }
}