/* Vil·la Minerva — interior pages */

/* page hero */
.phero{ position:relative; height:min(70vh,620px); min-height:440px; display:flex; align-items:flex-end; overflow:hidden; }
.phero .ph{ position:absolute; inset:0; }
.phero .veil{ position:absolute; inset:0;
  background:
    linear-gradient(180deg,rgba(26,27,22,.52) 0%,rgba(26,27,22,.14) 40%,rgba(20,21,17,.66) 100%),
    linear-gradient(75deg,rgba(20,21,17,.5) 0%,rgba(20,21,17,.12) 48%,rgba(20,21,17,0) 72%);
}
.phero .inner{ position:relative; z-index:2; width:100%; padding-bottom:clamp(44px,7vh,72px); padding-top:110px; }
.phero .eyebrow{ color:var(--nude); }
.phero h1{ color:var(--cream); max-width:20ch; text-shadow:0 2px 26px rgba(15,16,12,.45); font-size:clamp(36px,5vw,72px); }

/* breadcrumb */
.crumb{ display:flex; align-items:center; gap:10px; font-family:var(--sans); font-size:11.5px;
  letter-spacing:.18em; text-transform:uppercase; color:rgba(244,241,233,.78); margin-bottom:18px; }
.crumb a{ transition:color .3s; }
.crumb a:hover{ color:var(--cream); }
.crumb i{ opacity:.5; font-style:normal; }

/* intro copy block */
.pintro{ max-width:62ch; }
.pintro .lead{ max-width:none; }

/* space rows */
.srow{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(34px,5vw,80px); align-items:center; padding:clamp(50px,7vh,86px) 0; border-bottom:1px solid var(--line-soft); }
.srow:last-of-type{ border-bottom:none; }
.srow.flip .fig{ order:2; }
.srow .fig .ph{ aspect-ratio:4/3; }
.srow .fig .ph.tall{ aspect-ratio:3/4; }
.srow .num{ font-family:var(--serif); font-style:italic; font-size:20px; color:var(--olive); }
.srow h2{ font-size:clamp(28px,3.4vw,46px); margin:8px 0 0; }
.srow .kicker{ font-family:var(--sans); font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--muted); margin-top:14px; }
.srow p{ color:var(--ink-soft); margin-top:16px; max-width:44ch; }

/* next-links strip */
.nextlinks{ background:var(--soft-bg); }
.nextlinks .grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:34px; }
.nextlink{ background:var(--paper); border:1px solid var(--line-soft); padding:26px 24px; display:flex; align-items:baseline; justify-content:space-between; gap:14px; transition:.45s cubic-bezier(.2,.7,.2,1); }
.nextlink:hover{ background:var(--olive); border-color:var(--olive); }
.nextlink b{ font-family:var(--serif); font-weight:400; font-size:25px; transition:color .4s; }
.nextlink span{ font-family:var(--sans); font-size:12px; letter-spacing:.18em; color:var(--olive); transition:color .4s; }
.nextlink:hover b,.nextlink:hover span{ color:var(--cream); }

/* dish gallery */
.pgal{ display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-top:40px; }
.pgal .ph{ aspect-ratio:1/1; }
.pgal .ph.w2{ grid-column:span 2; aspect-ratio:2/1; }
@media (max-width:900px){ .pgal{ grid-template-columns:repeat(2,1fr); } }

/* dish gallery - 3 columns, as in the client's reference doc */
.pgal3{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:40px; }
.pgal3 .ph{ aspect-ratio:1/1; }
@media (max-width:640px){ .pgal3{ grid-template-columns:repeat(2,1fr); } }

/* closing CTA */
.pcta{ background:var(--ink); color:var(--cream); text-align:center; }
.pcta h2{ color:var(--cream); max-width:24ch; margin:0 auto; }
.pcta p{ color:rgba(244,241,233,.8); max-width:48ch; margin:18px auto 34px; }

@media (max-width:900px){
  .srow,.nextlinks .grid{ grid-template-columns:1fr; }
  .srow.flip .fig{ order:0; }
  .phero{ height:min(62vh,520px); min-height:400px; }
}
