/* Interior skeleton pages (location.html / services.html /
   single-service.html / occasion.html). Linked ONLY on those pages, never
   on index.html, so the home page cannot be affected. Design tokens come
   from styles.css; everything here is additive page-only componentry in
   the same vocabulary (serif display + script accents + Work Sans labels,
   cream/brown/ink/rose, 1px keylines). */

/* ---------- Hero additions (the .hero band itself is untouched) ---------- */

.pg-hero-line {
  font-family: 'Raleway', var(--body);
  font-size: 0.975rem;
  line-height: 1.7;
  max-width: 52ch;
  opacity: 0.92;
}
.pg-hero-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 1rem 1.8rem;
  margin-top: 1.6rem;
}
.pg-hero-actions .btn { margin-top: 0; }
.pg-ghost-light {
  font-family: var(--label);
  font-size: 0.6875rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: #fff;
  text-decoration: none;
  border-bottom: 1px solid rgba(255, 255, 255, 0.55);
  padding-bottom: 0.35em;
}
.pg-ghost-light:hover { border-bottom-color: #fff; }
.pg-hero-note { font-family: 'Raleway', var(--body); font-size: 0.875rem; opacity: 0.92; }
.pg-hero-note a { color: #fff; }
@media (prefers-reduced-motion: no-preference) {
  .hero > :nth-child(5) { animation-delay: 0.6s; }
  .hero > :nth-child(6) { animation-delay: 0.75s; }
}

/* ---------- Shared bands + heads ---------- */

.pg-band { background: #fff; padding: clamp(3.5rem, 8vw, 6.5rem) clamp(1.25rem, 4vw, 3rem); }
.pg-band--cream { background: var(--cream); }
.pg-band--brown { background: var(--brown); color: var(--cream); }
.pg-wrap { max-width: 1100px; margin: 0 auto; }
.pg-head { text-align: center; margin-bottom: clamp(2.2rem, 5vw, 3.6rem); }
.pg-head .eyebrow { color: var(--rose); margin-bottom: 1.3rem; }
.pg-band--brown .pg-head .eyebrow { color: #cbb6ae; }
.pg-head h2 {
  font-family: var(--serif);
  font-weight: 300;
  font-size: clamp(2.1rem, 4.5vw, 3.2rem);
  line-height: 1.08;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.pg-head h2 .script { text-transform: none; font-size: clamp(2.1rem, 4.5vw, 3.4rem); line-height: 1; }
.pg-head p { font-family: 'Raleway', var(--body); line-height: 1.8; max-width: 58ch; margin: 1.4rem auto 0; }
.pg-head--left { text-align: left; }
.pg-head--left p { margin-left: 0; }
.pg-note { text-align: center; font-family: 'Raleway', var(--body); line-height: 1.8; max-width: 62ch; margin: 2.4rem auto 0; }
.pg-note a { color: inherit; }

/* ---------- Framed photo band (location hero band) ---------- */

.pg-venueband { background: #fff; padding: clamp(2.5rem, 6vw, 4.5rem) clamp(1.25rem, 4vw, 3rem); }
.pg-venueband-grid {
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(1.25rem, 3vw, 2.25rem);
}
.pg-frame { border: 1px solid var(--brown); padding: clamp(0.7rem, 1.4vw, 1rem); }
.pg-frame img, .pg-frame video { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; display: block; }
.pg-venueband figcaption { margin-top: 0.9rem; text-align: center; }
.pg-venueband figcaption b {
  display: block;
  font-family: var(--serif);
  font-weight: 300;
  font-size: 1.15rem;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.pg-venueband figcaption span {
  font-family: var(--label);
  font-size: 0.6875rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--rose);
}

/* ---------- Picker stage (venue guide / spin chapters / wedding timeline) ---------- */

.pg-ven-grid {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
  gap: clamp(2rem, 5vw, 4rem);
  align-items: start;
}
.pg-ven-list { display: grid; align-content: start; }
.pg-ven-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  width: 100%;
  text-align: left;
  background: none;
  border: 0;
  border-bottom: 1px solid rgba(58, 53, 49, 0.25);
  padding: 1.1rem 0.4rem;
  cursor: pointer;
  color: inherit;
  transition: background-color 0.3s;
}
.pg-ven-item:hover { background: rgba(160, 133, 126, 0.08); }
.pg-ven-name {
  display: block;
  font-family: var(--serif);
  font-weight: 300;
  font-size: clamp(1.25rem, 2.4vw, 1.7rem);
  line-height: 1.15;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
.pg-ven-item.is-live .pg-ven-name { color: var(--rose); }
.pg-ven-sub { display: block; font-family: 'Raleway', var(--body); font-size: 0.9rem; opacity: 0.75; }
.pg-ven-arrow { font-family: var(--serif); font-weight: 300; font-size: 1.4rem; opacity: 0; color: var(--rose); transition: opacity 0.3s; }
.pg-ven-item.is-live .pg-ven-arrow { opacity: 1; }

.pg-stage-media { display: grid; }
.pg-stage-media img, .pg-stage-media video {
  grid-area: 1 / 1;
  width: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  opacity: 0;
  transition: opacity 0.5s;
}
.pg-stage-media img.is-live { opacity: 1; }
.pg-stage-card {
  position: relative;
  background: #fff;
  border: 1px solid var(--brown);
  padding: 1.4rem 1.6rem 1.6rem;
  margin: -2.5rem clamp(1rem, 3vw, 2rem) 0;
  display: grid;
  justify-items: start;
}
.pg-band--brown .pg-stage-card { background: var(--cream); color: var(--ink); }
.pg-stage-label {
  font-family: var(--label);
  font-size: 0.6875rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--rose);
  margin-bottom: 0.6rem;
}
.pg-stage-note { display: none; font-family: 'Raleway', var(--body); font-size: 0.95rem; line-height: 1.7; }
.pg-stage-note.is-live { display: block; }
.pg-stage-card .btn { margin-top: 1.3rem; }

/* ---------- Timeline rail (occasion) ---------- */

.pg-rail {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.6rem;
  margin-bottom: clamp(1.5rem, 3vw, 2.5rem);
}
.pg-stop {
  display: grid;
  gap: 0.15rem;
  text-align: center;
  background: #fff;
  border: 1px solid rgba(58, 53, 49, 0.35);
  padding: 0.7em 1.2em;
  cursor: pointer;
  color: inherit;
  font-family: var(--label);
  font-size: 0.6875rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  transition: background-color 0.3s, color 0.3s, border-color 0.3s;
}
.pg-stop b { font-family: var(--serif); font-weight: 300; font-size: 1.35rem; letter-spacing: 0.02em; }
.pg-stop.is-live { background: var(--brown); color: var(--cream); border-color: var(--brown); }

/* ---------- Chapter row (single-service how-it-works) ---------- */

.pg-chapters {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(0.8rem, 2vw, 1.5rem);
  margin-top: clamp(1.8rem, 4vw, 2.8rem);
}
.pg-chap {
  position: relative;
  background: none;
  border: 0;
  text-align: left;
  color: inherit;
  cursor: pointer;
  padding: 0.9rem 0 0;
}
.pg-chap-track {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  display: block;
  background: rgba(58, 53, 49, 0.2);
}
.pg-chap-fill { display: block; height: 100%; width: 0; background: var(--rose); }
.pg-chap-fill.is-run { animation: pg-fill 5s linear forwards; }
@keyframes pg-fill { from { width: 0; } to { width: 100%; } }
@media (prefers-reduced-motion: reduce) {
  .pg-chap-fill.is-run { animation: none; width: 100%; }
}
.pg-chap-num { display: block; font-family: var(--serif); font-weight: 300; font-size: 1.6rem; line-height: 1.2; color: rgba(20, 20, 20, 0.25); }
.pg-chap.is-live .pg-chap-num { color: var(--rose); }
.pg-chap-name {
  display: block;
  font-family: var(--serif);
  font-weight: 300;
  font-size: 1.05rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.pg-chap-sub { display: block; font-family: 'Raleway', var(--body); font-size: 0.85rem; opacity: 0.7; }

/* ---------- Stat band (count-ups) ---------- */

.pg-stats {
  max-width: 1000px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(1.5rem, 4vw, 3rem);
  text-align: center;
}
.pg-stats--three { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: none; margin: 2rem 0; text-align: left; }
.pg-stat b { display: block; font-family: var(--serif); font-weight: 300; font-size: clamp(2.4rem, 6vw, 4rem); line-height: 1; }
.pg-stat span {
  display: block;
  margin-top: 0.5rem;
  font-family: var(--label);
  font-size: 0.6875rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  opacity: 0.8;
}

/* ---------- Card grids (offers / occasion panels / booth picks) ---------- */

.pg-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(1.25rem, 3vw, 2.25rem);
  align-items: stretch;
}
.pg-cards--two { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 880px; margin: 0 auto; }
.pg-card {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--ink);
  padding: 1.25rem 1.25rem 1.5rem;
  color: inherit;
  text-decoration: none;
  transition: border-color 0.3s;
}
a.pg-card:hover { border-color: var(--rose); }
.pg-card img, .pg-card video { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; margin-bottom: 1.2rem; }
.pg-card h3 {
  font-family: var(--serif);
  font-weight: 300;
  font-size: clamp(1.35rem, 2.6vw, 1.85rem);
  line-height: 1.1;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  padding-bottom: 0.6rem;
  margin-bottom: 0.9rem;
  border-bottom: 1px solid currentColor;
}
.pg-card p { font-family: 'Raleway', var(--body); font-size: 0.95rem; line-height: 1.7; margin-bottom: 1.1rem; }
.pg-card .text-link,
.pg-card .btn { margin-top: auto; align-self: flex-start; }
.pg-card .btn + .text-link { margin-top: 1.1rem; }

/* ---------- Numbered rows (foundation items / travel zones) ---------- */

.pg-rows { max-width: 880px; margin: 0 auto; }
.pg-row {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: clamp(1rem, 3vw, 2rem);
  align-items: baseline;
  padding: 1.6rem 0.2rem;
  border-bottom: 1px solid rgba(58, 53, 49, 0.25);
}
.pg-row-num { font-family: var(--serif); font-weight: 300; font-size: clamp(2rem, 4vw, 3rem); line-height: 1; color: rgba(20, 20, 20, 0.18); }
.pg-band--brown .pg-row-num { color: rgba(255, 255, 255, 0.3); }
.pg-row h3 {
  font-family: var(--serif);
  font-weight: 300;
  font-size: clamp(1.25rem, 2.4vw, 1.7rem);
  letter-spacing: 0.03em;
  text-transform: uppercase;
  margin-bottom: 0.35rem;
}
.pg-row p { font-family: 'Raleway', var(--body); line-height: 1.7; max-width: 62ch; }

/* ---------- Area chips (location) ---------- */

.pg-chips { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.7rem; margin-top: 2rem; }
.pg-chips span,
.pg-chips a {
  font-family: var(--label);
  font-size: 0.6875rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  border: 1px solid rgba(58, 53, 49, 0.4);
  padding: 0.55em 1.1em;
  color: inherit;
  text-decoration: none;
}
.pg-chips a:hover { border-color: var(--rose); color: var(--rose); }

/* ---------- Included list (single-service) ---------- */

.pg-list {
  list-style: none;
  max-width: 880px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.5rem 3rem;
}
.pg-list li { border-left: 1px solid var(--rose); padding-left: 1.2rem; }
.pg-list b {
  display: block;
  font-family: var(--serif);
  font-weight: 300;
  font-size: 1.2rem;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  margin-bottom: 0.2rem;
}
.pg-list span { font-family: 'Raleway', var(--body); font-size: 0.95rem; line-height: 1.65; opacity: 0.85; }

/* ---------- Split band (occasion: points + photo) ---------- */

.pg-split {
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 6fr) minmax(0, 5fr);
  gap: clamp(2.5rem, 6vw, 5rem);
  align-items: center;
}
.pg-points { display: grid; gap: 1.4rem; margin: 1.8rem 0 2.2rem; }
.pg-point { border-left: 1px solid var(--rose); padding-left: 1.2rem; }
.pg-point h3 {
  font-family: var(--serif);
  font-weight: 300;
  font-size: 1.2rem;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  margin-bottom: 0.2rem;
}
.pg-point p { font-family: 'Raleway', var(--body); font-size: 0.95rem; line-height: 1.65; opacity: 0.85; }
.pg-split-media { justify-self: end; width: min(100%, 420px); }
.pg-split-media figcaption {
  margin-top: 0.8rem;
  text-align: center;
  font-family: var(--label);
  font-size: 0.6875rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--rose);
}
.pg-split-media--pair { display: grid; grid-template-columns: 3fr 2fr; gap: 1rem; align-items: end; width: 100%; }
.pg-split-media--pair img, .pg-split-media--pair video { width: 100%; object-fit: cover; }
.pg-split-media--pair :is(img, video):first-child { aspect-ratio: 4 / 5; }
.pg-split-media--pair :is(img, video):last-child { aspect-ratio: 1 / 1; filter: grayscale(1); }

/* ---------- Rate-card extras (services hub links) ---------- */

.rate-card .rate-cross { margin: 0 0 1.2rem; }
.rate-card--dark .rate-cross { color: var(--cream); }

/* ---------- Review flourishes on the Love Notes rotator ---------- */

.pg-stars { display: block; font-size: 0.9rem; letter-spacing: 0.35em; color: #cbb6ae; margin-bottom: 1.1rem; }
.pg-quote-context {
  display: block;
  font-family: 'Raleway', var(--body);
  font-size: 0.8rem;
  letter-spacing: normal;
  text-transform: none;
  opacity: 0.7;
  margin-top: 0.2rem;
}

/* ---------- Small screens ---------- */

@media (max-width: 800px) {
  .pg-venueband-grid { grid-template-columns: 1fr; max-width: 340px; }
  .pg-ven-grid { grid-template-columns: 1fr; }
  .pg-cards,
  .pg-cards--two { grid-template-columns: 1fr; }
  .pg-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pg-stats--three { grid-template-columns: 1fr; gap: 1.2rem; }
  .pg-chapters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pg-list { grid-template-columns: 1fr; }
  .pg-split { grid-template-columns: 1fr; }
  .pg-split-media { justify-self: center; }
  .pg-stage-card { margin: -1.6rem 0.8rem 0; }
}