/*
  Page-level layout: hero, section scaffolding, and responsive rules.
  Components (nav, buttons, menu rows, etc.) live in components.css.
*/

/* ---------- Hero ---------- */
.hero {
  min-height: 100svh;
  display: grid;
  grid-template-columns: 1.3fr 0.7fr;
  align-items: end;
  padding: 160px 56px 90px;
  position: relative;
  background:
    radial-gradient(1100px 700px at 85% 0%, rgba(184,137,90,0.10), transparent 60%),
    var(--espresso-deep);
  gap: 40px;
}

.hero-left { max-width: 700px; }

.hero h1 {
  font-size: clamp(52px, 9vw, 118px);
  line-height: 0.96;
  color: var(--ivory);
  letter-spacing: -0.01em;
}
.hero h1 em {
  font-style: italic;
  color: var(--brass-bright);
}

.hero-cta {
  margin-top: 48px;
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
}

.hero-right {
  text-align: right;
  padding-bottom: 8px;
  border-right: 1px solid var(--rule);
  padding-right: 28px;
}
.hero-right .addr {
  font-size: 15px;
  color: var(--ivory-dim);
  line-height: 1.7;
}
.hero-right .addr strong {
  display: block;
  color: var(--brass-bright);
  font-style: italic;
  font-family: var(--font-display);
  font-size: 17px;
  margin-bottom: 8px;
}

/* ---------- Section shared scaffolding ---------- */
section { padding: 130px 56px; }
.section-inner { max-width: 980px; margin: 0 auto; }

#rates { background: var(--espresso); }
#info { background: var(--espresso-deep); }

#about {
  background: var(--espresso-light);
  text-align: left;
}
#about .section-inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  align-items: center;
}
#about p {
  font-size: 21px;
  color: var(--ivory-dim);
  font-style: italic;
  line-height: 1.75;
}

/* ---------- Responsive ---------- */
@media (max-width: 860px) {
  nav { padding: 20px 24px; }
  .nav-links { display: none; }
  .hero { grid-template-columns: 1fr; padding: 130px 24px 70px; }
  .hero-right { text-align: left; border-right: none; border-top: 1px solid var(--rule); padding: 22px 0 0; margin-top: 40px; }
  section { padding: 90px 24px; }
  .info-row { grid-template-columns: 1fr; gap: 36px; }
  #about .section-inner { grid-template-columns: 1fr; text-align: center; }
  .menu-row { flex-wrap: wrap; }
  .menu-dots { display: none; }
  footer { flex-direction: column; text-align: left; }
  footer .foot-info { text-align: left; }
}