.arco-page .site-nav a[aria-current] {
  color: #1d5140;
  text-decoration: underline;
  text-decoration-color: #b88e56;
  text-underline-offset: 7px;
}

.arco-intro, .arco-reservation {
  background:
    radial-gradient(ellipse at 82% 125%, #285746, transparent 55%),
    linear-gradient(115deg, #112f26, #163c31);
  color: #fffdf5;
}

.arco-intro { padding-block: 9px clamp(34px, 4vw, 57px); }
.arco-intro .eyebrow, .arco-reservation .eyebrow { color: var(--gold); }
.arco-intro a:focus-visible, .arco-reservation a:focus-visible { outline-color: var(--gold); }

.arco-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 0 10px; min-height: 44px; color: #e1e9de; font-size: 13px; }
.arco-breadcrumb a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: underline; text-underline-offset: 3px; }
.arco-breadcrumb [aria-current] { font-weight: 700; }

.arco-intro-layout {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  align-items: center;
  gap: 22px clamp(24px, 4vw, 56px);
  margin-top: 13px;
}

.arco-intro h1 {
  margin-top: 8px;
  font: 400 clamp(34px, 4.2vw, 59px)/1.24 var(--serif);
  letter-spacing: -.07em;
}

.arco-lead { margin-top: 10px; color: var(--gold); font-size: clamp(17px, 1.6vw, 21px); font-weight: 700; letter-spacing: -.04em; }
.arco-description { margin-top: 10px; color: #e4ede5; font-size: 16px; line-height: 1.7; }

.arco-facts {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  margin-top: 18px;
  overflow: hidden;
  border: 1px solid #e0ecde45;
  border-radius: 8px;
  background: #ffffff08;
}

.arco-facts > div { padding: 9px 12px 10px; }
.arco-facts > div + div { border-left: 1px solid #e0ecde45; }
.arco-facts dt { color: #dce7de; font-size: 12px; }
.arco-facts dd { margin-top: 3px; color: #fff7e4; font-size: 16px; font-weight: 700; line-height: 1.4; letter-spacing: -.05em; }

.arco-actions, .arco-contact-actions { display: flex; flex-wrap: wrap; gap: 9px; }
.arco-actions { margin-top: 17px; }
.arrow-down { transform: rotate(90deg); }

.arco-exterior img { width: 100%; height: auto; border-radius: 9px; box-shadow: 0 0 0 1px #fffdf435; }
.arco-exterior figcaption { display: flex; align-items: center; gap: 7px; margin-top: 9px; color: #e5ece1; font-size: 13px; }
.arco-exterior figcaption span { width: 7px; height: 7px; border-radius: 50%; background: var(--gold); }

.arco-spaces, .arco-reservation { padding-block: clamp(33px, 4.5vw, 62px); }
.arco-heading { display: flex; justify-content: space-between; align-items: end; gap: 9px 26px; margin-bottom: 20px; }
.arco-heading h2 { margin-top: 7px; }
.arco-heading > p { max-width: 360px; color: var(--body); font-size: 15px; line-height: 1.65; }

.arco-gallery, .arco-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.arco-space { overflow: hidden; border: 1px solid var(--line); border-radius: 11px; background: #fffef9; }
.arco-space-photo { aspect-ratio: 1536 / 629; background: #dce4d9; }
.arco-space-photo img { width: 100%; height: 100%; object-fit: cover; }
.arco-space-photo-ondol img { object-position: 20% center; }
.arco-space figcaption { padding: 14px 17px 17px; }
.arco-photo-label { display: inline-block; padding: 3px 7px; border-radius: 4px; background: #e8f0e6; color: #295441; font-size: 12px; font-weight: 700; }
.arco-photo-concept { background: #f4ebd6; color: #6c522a; }
.arco-space h3 { margin-top: 6px; font-size: 20px; letter-spacing: -.055em; }
.arco-space p { margin-top: 5px; color: var(--body); font-size: 15px; line-height: 1.6; }

.arco-reservation .arco-heading > p { color: #e1ebe2; }
.arco-steps { margin: 0; padding: 0; list-style: none; }
.arco-steps li { padding: 15px 16px; border: 1px solid #e0ecde3d; border-radius: 8px; background: #ffffff08; }
.arco-steps span { color: var(--gold); font-size: 13px; font-weight: 700; letter-spacing: .05em; }
.arco-steps h3 { margin-top: 4px; font-size: 19px; letter-spacing: -.04em; }
.arco-steps p { margin-top: 6px; color: #e1ebe2; font-size: 14px; line-height: 1.65; }

.arco-contact { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px 20px; margin-top: 20px; padding-top: 17px; border-top: 1px solid #e0ecde3d; }
.arco-contact > div:first-child > p:first-child { color: var(--gold); font-size: 15px; font-weight: 700; }
.arco-contact-note { margin-top: 4px; color: #e1ebe2; font-size: 14px; line-height: 1.6; }

@media (max-width: 850px) {
  .arco-intro-layout { grid-template-columns: minmax(0, 1fr); }
  .arco-copy { max-width: 610px; }
}

@media (max-width: 660px) {
  .arco-heading { display: grid; }
  .arco-gallery, .arco-steps { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .arco-facts > div { padding-inline: 8px; }
  .arco-facts dd { font-size: 14px; }
  .arco-actions .button, .arco-contact-actions .button { padding-inline: 10px; gap: 6px; font-size: 14px; }
}
