.whatsapp-fields {
  display: grid;
  grid-template-columns: minmax(190px, .9fr) minmax(0, 1.1fr);
  gap: 20px;
}
.transaction-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; }
.transaction-fields[hidden] { display: none!important; }
.identification-details { border: 1px solid var(--line); border-radius: 12px; background: #f8faf8; }
.identification-details summary { padding: 16px 18px; color: var(--green); font-weight: 900; cursor: pointer; touch-action: manipulation; }
.identification-details > p { margin: 0; padding: 0 18px 16px; color: var(--muted); }
.identification-details > .field-grid { padding: 0 18px 18px; }
.my-number-warning { padding: 10px 12px; border-radius: 8px; background: #fff1cf; color: #694700!important; font-weight: 750; }

.date-control,
.time-control {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 56px;
  gap: 8px;
}

.picker-button {
  grid-column: 2;
  grid-row: 1;
  display: grid;
  place-items: center;
  min-height: 48px;
  border: 1px solid #c9cfca;
  border-radius: 10px;
  background: #fff;
  font-size: 21px;
  line-height: 1;
  pointer-events: none;
}

.date-picker,
.time-picker {
  position: absolute;
  z-index: 2;
  top: 0;
  right: 0;
  width: 56px;
  height: 100%;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}

.money-control {
  position: relative;
  display: block !important;
  margin: 0 !important;
}

.money-control input {
  padding-right: 72px;
}

.money-control.has-prefix input {
  padding-left: 38px;
}

.money-prefix,
.money-unit {
  position: absolute;
  z-index: 1;
  top: 50%;
  margin: 0;
  color: var(--green);
  font-size: 14px;
  font-weight: 900;
  line-height: 1;
  pointer-events: none;
  transform: translateY(-50%);
}

.money-prefix { left: 14px; font-size: 18px; }
.money-unit { right: 14px; }
.money-control [hidden] { display: none !important; }
#amount-example { min-height: 1.5em; }
.success-transaction { margin: 18px auto 0; color: var(--green); font-weight: 850; }

.site-footer {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) minmax(370px, auto);
  align-items: start;
  gap: 36px;
  padding: 38px max(24px, calc((100vw - 1180px) / 2));
  border-top: 1px solid var(--line);
  background: #fff;
  color: var(--muted);
}

.site-footer section { min-width: 0; }
.footer-brand { display: grid; grid-template-columns: minmax(180px,300px) minmax(230px,1fr); align-items: center; justify-items: start; gap: 24px; }
.footer-brand img { width: min(100%, 300px); border-radius: 10px; }
.footer-details { display: grid; gap: 9px; min-width: 0; }
.footer-details address { margin: 0; color: inherit; font-size: 14px; font-style: normal; font-weight: 500; line-height: 1.5; }
.footer-details a,.footer-details address { display: grid; grid-template-columns: 24px minmax(0,1fr); align-items: start; }
.footer-icon { display: inline-grid; width: 24px!important; height: 24px; place-items: center; color: inherit; font-size: 18px; font-style: normal; line-height: 24px; text-align: center; }
.footer-brand p,.footer-address address { margin: 0; color: var(--muted); font-size: 14px; font-style: normal; font-weight: 500; line-height: 1.65; }
.footer-brand strong { color: var(--ink); font-size: 16px; }
.footer-brand a { color: inherit; font-weight: inherit; overflow-wrap: anywhere; text-decoration: none; }
.footer-brand a:hover,.footer-brand a:focus-visible { color: var(--accent); text-decoration: underline; }
.footer-address { padding-top: 8px; }
.footer-address h2 { margin: 0 0 12px; color: var(--ink); font-size: 16px; line-height: 1.35; }
.footer-qr { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); justify-self: end; gap: 22px; }
.footer-qr figure { display: grid; justify-items: center; gap: 8px; margin: 0; color: var(--muted); font-size: 14px; font-weight: 700; }
.footer-qr img { width: 168px; height: 168px; padding: 10px; border: 1px solid var(--line); border-radius: 12px; background: #fff; object-fit: contain; }
.site-footer [hidden],
.whatsapp-fields[hidden] { display: none !important; }

@media (max-width: 900px) {
  .whatsapp-fields { grid-template-columns: 1fr; }
  .transaction-fields { grid-template-columns: 1fr; }
  .site-footer { grid-template-columns: 1fr; gap: 30px; text-align: left; }
  .footer-brand { grid-template-columns: 1fr; justify-items: start; }
  .footer-address { padding-top: 0; }
  .footer-qr { justify-self: center; width: 100%; }
  .footer-qr img { width: min(42vw,172px); height: min(42vw,172px); }
}

/* Reservation page structure. */
body { background: #f3f6f2; }
body > .reservation-header { max-width: none; padding-left: max(24px,calc((100vw - 1180px)/2)); padding-right: max(24px,calc((100vw - 1180px)/2)); background: var(--green); }
.reservation-hero { background: var(--green); }
.reservation-hero .reservation-intro { padding: 28px 18px 64px; }
.reservation-hero .reservation-intro h1 { max-width: 820px; margin-inline: auto; }
main { margin-top: 0; }
.request-intro { padding: 42px 18px 30px; text-align: center; }
.request-intro .jp-title { margin: 0; color: #a87815; }
.request-intro .lead { margin-top: 18px; color: var(--ink); }
.request-intro .lead { max-width: 680px; font-size: 14px; line-height: 1.55; }
.important-notice { max-width: 760px; margin: 24px auto 0; padding: 16px 18px; border: 2px solid var(--gold); border-radius: 14px; background: #fff8e7; color: var(--ink); text-align: left; }
.important-notice strong { display: block; margin-bottom: 4px; color: var(--green); font-size: 16px; }
.important-notice p { margin: 0; line-height: 1.55; }
.important-submit-note { padding: 15px 18px; border-radius: 12px; background: #fff3cf; color: var(--green)!important; font-weight: 800; }
html.embedded-reservation body { background: #f3f6f2; }
html.embedded-reservation .reservation-header,
html.embedded-reservation .reservation-hero,
html.embedded-reservation .language-switcher,
html.embedded-reservation .site-footer { display: none!important; }
html.embedded-reservation main { margin-top: 0; margin-bottom: 24px; }
html.embedded-reservation .request-intro { padding: 24px 12px 18px; }
html.embedded-reservation .request-intro .lead { display: none; }
.large-exchange small { display: block; margin-top: 12px; color: var(--muted); }
.large-lock-note { margin: 12px 0 0; padding: 10px 12px; border-radius: 9px; background: #fff1cf; color: #694700; font-size: 14px; font-weight: 750; }
.exact-exchange { display: block; margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--line); }
.exact-exchange[hidden] { display: none; }
.policy-summary { margin: 14px 0 18px; color: #344a3f; white-space: normal; }
.compliance-box { background: #f7fbf7; }
.policy-summary { white-space: pre-line; color: #36483f; }
.consent-required { display: inline-flex; margin: 18px 0 0!important; padding: 3px 9px; border-radius: 999px; background: #e9f2ec; color: var(--green)!important; font-size: 11px; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; }
.exact-exchange { display: block; margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--line); }
.site-footer { grid-template-columns: minmax(300px,1fr) auto; margin-top: 72px; background: var(--green); color: rgba(255,255,255,.82); }
.footer-brand { gap: 18px; }
.footer-details { display: grid; gap: 9px; }
.footer-details strong { margin-bottom: 3px; color: #fff; font-size: 18px; }
.footer-details a,.footer-details address { display: grid; grid-template-columns: 24px minmax(0,1fr); align-items: start; margin: 0; color: rgba(255,255,255,.86); font-style: normal; font-weight: 500; line-height: 1.55; text-decoration: none; }
.footer-details a span,.footer-details address span { width: 24px; text-align: center; }
.footer-qr figure { color: rgba(255,255,255,.82); }
@media (max-width:680px) {
  .reservation-hero .reservation-intro { padding: 20px 14px 46px; }
  .reservation-hero .reservation-intro h1 { font-size: clamp(30px,10vw,43px); overflow-wrap: anywhere; }
  .request-intro { padding: 32px 10px 24px; }
  .footer-brand { justify-items: center; text-align: center; }
  .footer-details { width: min(100%,420px); text-align: left; }
  .footer-qr { grid-template-columns: 1fr; justify-items: center; }
  .footer-qr img { width: min(72vw,180px); height: min(72vw,180px); }
}
.request-intro .lead span,
.reservation-intro .lead span { white-space: nowrap; }
@media (max-width:900px){.request-intro .lead span,.reservation-intro .lead span{white-space:normal}}

@media (max-width:900px) {
  .site-footer { grid-template-columns: minmax(0,1fr); }
  .footer-brand { grid-template-columns: minmax(0,1fr); width: 100%; }
  .footer-qr { grid-template-columns: repeat(2,minmax(0,1fr)); justify-self: stretch; width: 100%; }
}

@media (max-width:680px) {
  .site-footer { padding-inline: 16px; }
  .footer-qr { grid-template-columns: minmax(0,1fr); }
  .reservation-hero .reservation-intro h1 { max-width: 350px; margin-inline: auto; font-size: clamp(24px,7.2vw,29px); line-height: 1.12; letter-spacing: -.045em; overflow-wrap: normal; word-break: normal; }
}
