/* La Mama — the site's own pages (21 Oct 2026): a banner each, then the
   home page's sections that belong there, and what only that page has. */
.page-hero { position: relative; min-height: min(78vh, 720px); display: flex; align-items: flex-end; margin-top: 82px; overflow: hidden; color: #fff; background: #1b261b; }
.page-hero__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transform: scale(1.04); animation: pg-zoom 9s ease-out forwards; }
@keyframes pg-zoom { to { transform: scale(1); } }
.page-hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10,18,10,.15) 0%, rgba(10,18,10,.25) 40%, rgba(10,18,10,.82) 100%); }
.page-hero__in { position: relative; z-index: 1; width: min(1240px, 100%); margin: 0 auto; padding: 0 6vw 9vh; }
.page-hero .section-kicker { color: #e7b58f; }
.page-hero h1 { margin: 10px 0 14px; font: 500 clamp(3rem, 7.5vw, 6.4rem)/.95 Cormorant, serif; letter-spacing: -.015em; }
.page-hero h1 em { font-style: italic; color: #f1d2b8; }
.page-hero__intro { max-width: 620px; margin: 0 0 26px; font-size: 1.08rem; line-height: 1.7; color: rgba(255,255,255,.88); }
.page-crumb { display: flex; gap: 10px; align-items: center; margin-bottom: 22px; font-size: .78rem; letter-spacing: .16em; text-transform: uppercase; color: rgba(255,255,255,.75); }
.page-crumb a { color: inherit; text-decoration: none; } .page-crumb a:hover { color: #fff; } .page-crumb b { color: #fff; font-weight: 600; }

.pg-section { position: relative; }
.pg-h { margin: 8px 0 14px; font: 500 clamp(2.2rem, 4.6vw, 3.8rem)/1 Cormorant, serif; }
.pg-lead { max-width: 640px; margin: 0 0 28px; color: #667062; line-height: 1.75; }

/* Rooms: free tonight. */
.pg-live { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px; }
.pg-kind { display: grid; gap: 6px; padding: 24px; border: 1px solid rgba(24,32,24,.12); border-radius: 22px; background: rgba(255,255,255,.6); }
.pg-kind b { font: 500 1.9rem/1 Cormorant, serif; } .pg-kind span { color: #667062; }
.pg-kind strong { margin-top: 8px; color: #35482e; font-size: 1.05rem; }
.pg-kind.is-full strong { color: #b5562f; }
.pg-kind button { justify-self: start; margin-top: 10px; padding: 11px 18px; border: 0; border-radius: 999px; background: #ce6944; color: #fff; font: 600 .86rem Manrope, sans-serif; cursor: pointer; }

/* Gallery: every photo. */
.pg-grid { columns: 3 280px; column-gap: 14px; }
.pg-tile { position: relative; display: block; width: 100%; margin: 0 0 14px; padding: 0; overflow: hidden; border: 0; border-radius: 20px; background: #d9d1bf; cursor: pointer; break-inside: avoid; }
.pg-tile img { display: block; width: 100%; height: auto; transition: transform .6s ease; } .pg-tile:hover img { transform: scale(1.04); }
.pg-cap { position: absolute; left: 0; right: 0; bottom: 0; padding: 36px 16px 14px; background: linear-gradient(transparent, rgba(8,14,8,.75)); color: #fff; font-size: .88rem; text-align: left; opacity: 0; transition: opacity .3s; }
.pg-tile:hover .pg-cap, .pg-tile:focus .pg-cap { opacity: 1; }
.pg-play { position: absolute; top: 14px; left: 14px; padding: 6px 12px; border-radius: 999px; background: rgba(255,255,255,.9); color: #182018; font-size: .76rem; font-weight: 600; }

/* Contact: the ways in, and the map. */
.pg-contact { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 10px 0 24px; }
.pg-card { display: grid; gap: 4px; padding: 22px; border: 1px solid rgba(24,32,24,.12); border-radius: 22px; background: rgba(255,255,255,.6); color: #182018; text-decoration: none; transition: transform .25s, box-shadow .25s; }
.pg-card:hover { transform: translateY(-4px); box-shadow: 0 16px 34px rgba(24,32,24,.12); }
.pg-card img { width: 26px; height: 26px; margin-bottom: 10px; } .pg-card b { font: 500 1.6rem/1 Cormorant, serif; } .pg-card span { color: #667062; font-size: .88rem; overflow-wrap: anywhere; }
.pg-map { overflow: hidden; border-radius: 26px; border: 1px solid rgba(24,32,24,.12); background: #e7e1d3; aspect-ratio: 16 / 7; }
.pg-map iframe { display: block; width: 100%; height: 100%; border: 0; }

@media (max-width: 860px) {
  .page-hero { margin-top: 72px; min-height: 64vh; }
  .page-hero__in { padding: 0 22px 8vh; }
  .page-hero h1 { font-size: 3rem; } .page-hero__intro { font-size: .98rem; }
  .pg-contact { grid-template-columns: 1fr 1fr; }
  .pg-map { aspect-ratio: 4 / 5; }
}
@media (max-width: 480px) { .pg-contact { grid-template-columns: 1fr; } .pg-grid { columns: 2 150px; column-gap: 10px; } .pg-tile { margin-bottom: 10px; border-radius: 14px; } }
.page-hero::after { background: linear-gradient(180deg, rgba(10,18,10,.3) 0%, rgba(10,18,10,.45) 45%, rgba(10,18,10,.88) 100%); }
.page-hero .section-kicker, .page-hero h1, .page-hero__intro, .page-crumb { text-shadow: 0 2px 18px rgba(0,0,0,.45); }
@media (max-width: 860px) { .page-hero::after { background: linear-gradient(180deg, rgba(10,18,10,.35), rgba(10,18,10,.6) 40%, rgba(10,18,10,.9)); } }

/* Privacy (29 Oct 2026): reading width, and links in the text's own colour. */
.pg-prose { max-width: 760px; }
.pg-prose h3 { margin: 26px 0 8px; }
.pg-prose p { line-height: 1.7; }
.pg-prose a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
