/* experience-detail.css — Single experience detail template */

.page-experience-detail { background: var(--off-black); }

/* HERO */
.hero {
  position: relative; height: 100vh; min-height: 700px;
  overflow: hidden; display: flex; align-items: flex-end;
}
.hero-bg-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .35; z-index: 0; }
.hero__content { position: relative; z-index: 5; padding: 0 4rem 8rem; max-width: 700px; }
.hero__sig { font-family: var(--serif); font-size: .95rem; font-style: italic; color: rgba(200,205,154,.45); margin-bottom: 1.5rem; }
.hero__ctas { display: flex; gap: 1.25rem; flex-wrap: wrap; margin-top: 2.5rem; }

/* Price badge */
.hero-price-badge {
  position: absolute; top: 50%; right: 5rem; z-index: 10;
  transform: translateY(-50%);
}
.hero-price-badge__ring {
  width: 140px; height: 140px;
  border: 1px solid rgba(200,205,154,.2); border-radius: 50%;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .25rem;
}
.hero-price-badge__price { font-family: var(--serif); font-size: 1.6rem; font-weight: 400; color: var(--olive-pale); line-height: 1; }
.hero-price-badge__label { font-size: .52rem; letter-spacing: .2em; text-transform: uppercase; color: rgba(200,205,154,.4); }
.hero-price-badge__sub { font-size: .5rem; letter-spacing: .15em; color: rgba(200,205,154,.3); }

/* OVERVIEW STRIP */
.overview-strip {
  background: var(--brown);
  display: grid; grid-template-columns: repeat(5, 1fr);
  border-bottom: 1px solid rgba(200,205,154,.06);
}
.overview-item { padding: 2.25rem 2rem; border-right: 1px solid rgba(200,205,154,.07); }
.overview-item:last-child { border-right: none; }
.overview-item__label { font-size: .58rem; letter-spacing: .2em; text-transform: uppercase; color: rgba(200,205,154,.35); margin-bottom: .4rem; }
.overview-item__val { font-family: var(--serif); font-size: 1.1rem; font-style: italic; color: var(--cream); margin-bottom: .15rem; }
.overview-item__note { font-size: .72rem; font-weight: 200; color: rgba(200,205,154,.4); }

/* NARRATIVE + FACTS */
.narrative-section { background: var(--off-black); padding: var(--section-pad); display: grid; grid-template-columns: 5fr 4fr; gap: 8rem; align-items: start; }
.narrative__chapter { font-size: .6rem; letter-spacing: .28em; text-transform: uppercase; color: rgba(200,205,154,.25); display: block; margin-bottom: 1.75rem; }
.narrative__h { font-family: var(--serif); font-size: clamp(2rem,4vw,3.2rem); font-weight: 400; line-height: 1.15; color: var(--white); margin-bottom: 2rem; }
.narrative__h em { font-style: italic; color: var(--olive-pale); }

/* Sticky facts card */
.facts-card { position: sticky; top: calc(var(--nav-h) + 1.5rem); background: rgba(255,255,255,.03); border: 1px solid rgba(200,205,154,.1); padding: 2.5rem; }
.facts-card__title { font-size: .6rem; letter-spacing: .25em; text-transform: uppercase; color: var(--olive-pale); margin-bottom: 1.75rem; display: flex; align-items: center; gap: .75rem; }
.facts-card__title::before { content: ''; display: block; width: 20px; height: 1px; background: var(--olive-pale); }
.fact-row { padding: 1rem 0; border-bottom: 1px solid rgba(200,205,154,.07); display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; }
.fact-row:last-of-type { border-bottom: none; }
.fact-row__label { font-size: .62rem; letter-spacing: .15em; text-transform: uppercase; color: rgba(200,205,154,.35); flex-shrink: 0; }
.fact-row__val { font-size: .88rem; font-weight: 200; color: rgba(200,213,160,.75); text-align: right; line-height: 1.5; }
.fact-row__val strong { font-weight: 400; color: var(--olive-pale); display: block; }
.price-highlight { margin-top: 1.75rem; padding: 1.5rem; background: rgba(98,107,58,.12); border-left: 2px solid var(--olive-pale); }
.price-highlight__price { font-family: var(--serif); font-size: 2.8rem; font-weight: 400; color: var(--olive-pale); line-height: 1; }
.price-highlight__note { font-size: .72rem; font-weight: 200; color: rgba(200,205,154,.4); margin-top: .35rem; }
.price-highlight__tax  { font-size: .68rem; font-weight: 300; color: rgba(200,205,154,.3); margin-top: .2rem; }
.facts-cta { margin-top: 1.75rem; display: flex; flex-direction: column; gap: .75rem; }

/* TIMELINE / PROGRAM FLOW */
.flow-section { background: var(--brown); padding: var(--section-pad); position: relative; overflow: hidden; }
.flow-section::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 80% 60% at 50% 0%, rgba(98,107,58,.15) 0%, transparent 55%); }
.flow-header { position: relative; z-index: 1; max-width: 700px; margin: 0 auto 5rem; text-align: center; }
.flow-header .eyebrow { justify-content: center; }
.flow-header .eyebrow::before, .flow-header .eyebrow::after { content: ''; display: block; width: 24px; height: 1px; background: var(--olive-pale); }
.flow-header .eyebrow::before { }
.timeline { position: relative; z-index: 1; max-width: 900px; margin: 0 auto; display: flex; flex-direction: column; }
.timeline-step { display: grid; grid-template-columns: 120px 1px 1fr; min-height: 130px; }
.timeline-step__num { padding: 2.5rem 2.5rem 2.5rem 0; text-align: right; }
.timeline-step__numeral { font-family: var(--serif); font-size: 3rem; font-weight: 400; color: var(--olive-pale); opacity: .2; line-height: 1; display: block; }
.timeline-step__num-label { font-size: .55rem; letter-spacing: .2em; text-transform: uppercase; color: rgba(200,205,154,.3); display: block; margin-top: .25rem; }
.timeline-step__line { background: rgba(200,205,154,.12); position: relative; }
.timeline-step__dot { position: absolute; top: 2.5rem; left: 50%; transform: translateX(-50%); width: 10px; height: 10px; border-radius: 50%; background: var(--olive-pale); border: 2px solid var(--brown); }
.timeline-step:first-child .timeline-step__dot { background: var(--cream); box-shadow: 0 0 0 4px rgba(232,224,204,.12); }
.timeline-step__content { padding: 2.5rem 0 2.5rem 2.5rem; }
.timeline-step__tag { font-size: .58rem; letter-spacing: .2em; text-transform: uppercase; color: var(--olive-pale); margin-bottom: .5rem; }
.timeline-step__title { font-family: var(--serif); font-size: 1.3rem; font-weight: 400; color: var(--cream); margin-bottom: .75rem; line-height: 1.25; }
.timeline-step__desc { font-size: .9rem; font-weight: 200; line-height: 1.9; color: rgba(200,213,160,.5); max-width: 520px; }
.timeline-step__dur { display: inline-flex; align-items: center; gap: .4rem; margin-top: .85rem; font-size: .65rem; font-weight: 300; letter-spacing: .12em; color: rgba(200,205,154,.4); border: 1px solid rgba(200,205,154,.12); padding: .3rem .75rem; }

/* INCLUSIONS */
.inclusions-section { background: var(--off-black); padding: var(--section-pad); display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; }
.inc-col__title { font-size: .6rem; letter-spacing: .25em; text-transform: uppercase; color: var(--olive-pale); margin-bottom: 1.75rem; display: flex; align-items: center; gap: .75rem; }
.inc-col__title--no { color: rgba(200,205,154,.3); }
.inc-col__title::before { content: ''; display: block; width: 20px; height: 1px; }
.inc-col__title::before { background: var(--olive-pale); }
.inc-col__title--no::before { background: rgba(200,205,154,.25); }
.inc-list { list-style: none; display: flex; flex-direction: column; gap: .75rem; margin-bottom: 2rem; }
.inc-list__item { display: flex; align-items: flex-start; gap: .85rem; }
.inc-list__dot { width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; margin-top: 7px; }
.inc-list__dot--yes { background: var(--olive-pale); }
.inc-list__dot--no  { background: rgba(150,140,120,.35); }
.inc-list__text { font-size: .9rem; font-weight: 200; line-height: 1.65; color: rgba(200,213,160,.6); }
.inc-list__text--no { color: rgba(200,213,160,.35); }
.practical-box { background: rgba(255,255,255,.02); border: 1px solid rgba(200,205,154,.07); padding: 2.5rem; margin-top: 3rem; }
.practical-box__title { font-size: .6rem; letter-spacing: .22em; text-transform: uppercase; color: var(--olive-pale); margin-bottom: 1.5rem; }
.practical-items { display: flex; flex-direction: column; gap: .85rem; }
.practical-item { display: flex; gap: 1.25rem; align-items: flex-start; }
.practical-item__icon { width: 28px; height: 28px; border: 1px solid rgba(200,205,154,.18); border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; color: var(--olive-pale); font-size: .75rem; }
.practical-item__text { font-size: .83rem; font-weight: 200; line-height: 1.6; color: rgba(200,213,160,.5); }
.practical-item__text strong { font-weight: 400; color: rgba(200,213,160,.8); }

/* PHILOSOPHY / PILLARS */
.philosophy-section { background: var(--cream-light); padding: var(--section-pad); }
.philosophy-intro { max-width: 700px; margin: 0 auto 5rem; text-align: center; }
.pillars { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2.5rem; }
.pillar { padding: 2.5rem; background: var(--cream); border-top: 2px solid var(--olive-pale); }
.pillar__icon { width: 44px; height: 44px; margin-bottom: 1.25rem; }
.pillar__title { font-family: var(--serif); font-size: 1.3rem; font-weight: 400; color: var(--brown); margin-bottom: .75rem; }

/* TESTIMONIAL (single) */
.voices-section { background: var(--brown); padding: var(--section-pad); position: relative; overflow: hidden; }
.voices-section::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 60% 50% at 50% 100%, rgba(98,107,58,.2) 0%, transparent 60%); }
.voices-inner { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 3fr 1fr; gap: 3rem; align-items: center; }
.voices-line { height: 1px; background: rgba(200,205,154,.12); }
.voices-center { text-align: center; }
.voices-mark { font-family: var(--serif); font-size: 5rem; font-weight: 400; color: var(--olive-pale); opacity: .2; line-height: .7; display: block; margin-bottom: .5rem; }
.voices-quote { font-family: var(--serif); font-size: clamp(1.3rem,2.5vw,1.8rem); font-weight: 400; font-style: italic; color: var(--cream); line-height: 1.6; margin-bottom: 2rem; }
.voices-attr { display: flex; align-items: center; gap: 1.25rem; justify-content: center; }
.voices-attr__line { width: 32px; height: 1px; background: var(--olive); }
.voices-attr__name { font-size: .75rem; letter-spacing: .12em; text-transform: uppercase; color: rgba(200,213,160,.7); }
.voices-attr__detail { font-size: .7rem; font-weight: 200; color: rgba(200,213,160,.45); margin-top: .15rem; }

/* BOOKING CTA */
.booking-cta { background: var(--olive-deep); padding: var(--section-pad); position: relative; overflow: hidden; }
.booking-cta::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 80% 60% at 50% 0%, rgba(138,148,80,.2) 0%, transparent 55%); }
.booking-cta__inner { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 6rem; align-items: center; }
.booking-cta__text {}
.booking-cta__price-box { background: rgba(200,205,154,.06); border: 1px solid rgba(200,205,154,.1); padding: 1.5rem; margin-top: 1.5rem; }
.booking-cta__price-main { font-family: var(--serif); font-size: 2rem; font-weight: 400; color: var(--olive-pale); line-height: 1; }
.booking-cta__price-note { font-size: .72rem; font-weight: 200; color: rgba(200,205,154,.4); margin-top: .25rem; }
.booking-channels { display: flex; flex-direction: column; gap: .75rem; }
.channel-card { display: flex; align-items: center; gap: 1.25rem; padding: 1.25rem 1.5rem; border: 1px solid rgba(200,205,154,.1); transition: background .3s, border-color .3s; }
.channel-card:hover { background: rgba(200,205,154,.07); border-color: rgba(200,205,154,.25); }
.channel-card__icon { width: 36px; height: 36px; border: 1px solid rgba(200,205,154,.2); border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; color: var(--olive-pale); font-size: .8rem; }
.channel-card__label { font-size: .58rem; letter-spacing: .18em; text-transform: uppercase; color: rgba(200,205,154,.3); }
.channel-card__val { font-size: .9rem; font-weight: 300; color: var(--cream); }
.channel-card__arrow { margin-left: auto; color: rgba(200,205,154,.25); transition: transform .3s, color .3s; }
.channel-card:hover .channel-card__arrow { transform: translateX(4px); color: var(--olive-pale); }
.also-explore { margin-top: 1.5rem; padding-top: 1.5rem; border-top: 1px solid rgba(200,205,154,.08); }
.also-explore__label { font-size: .78rem; font-weight: 200; color: rgba(200,205,154,.35); margin-bottom: 1rem; }
.also-explore__links { display: flex; gap: 1rem; flex-wrap: wrap; }
.also-explore__link { font-size: .68rem; letter-spacing: .14em; text-transform: uppercase; color: rgba(200,205,154,.45); border-bottom: 1px solid rgba(200,205,154,.2); padding-bottom: 2px; transition: color .3s, border-color .3s; }
.also-explore__link:hover { color: var(--olive-pale); border-color: var(--olive-pale); }

/* RESPONSIVE */
@media (max-width: 1024px) {
  .hero__content { padding: 0 2rem 6rem; }
  .hero-price-badge { display: none; }
  .overview-strip { grid-template-columns: 1fr 1fr; }
  .overview-item:nth-child(2) { border-right: none; }
  .overview-item:nth-child(4) { border-right: none; }
  .narrative-section { grid-template-columns: 1fr; gap: 3.5rem; }
  .facts-card { position: static; }
  .timeline-step { grid-template-columns: 80px 1px 1fr; }
  .inclusions-section { grid-template-columns: 1fr; gap: 2rem; }
  .pillars { grid-template-columns: 1fr; }
  .voices-inner { grid-template-columns: 1fr; }
  .voices-line { display: none; }
  .booking-cta__inner { grid-template-columns: 1fr; gap: 3rem; }
}
