/* LPJH Experiences — assets/css/experiences.css
   Enqueue AFTER brand-tokens.css, homepage.css and location.css: reuses .hp
   bands, buttons, hairlines, .loc-hero and .loc-prose. Tokens only.
*/
/* ============================================================
   LPJH — Experiences page
   Loads after homepage.css + location.css: reuses .hp bands, buttons,
   hairlines, .loc-hero and .loc-prose. Prefix: .exp-
   ============================================================ */

/* ---------- SEASON RAIL (sticky) ---------- */
.exp-rail{position:relative;z-index:40;background:var(--tr-cream);border-bottom:1px solid var(--tr-border)}
/* JS pins the rail with position:fixed (Cassio overflow/transform ancestors break
   CSS position:sticky). --exp-pin-top is the live header height, set by lpjh-experiences.js. */
.exp-rail.is-pinned{position:fixed;top:var(--exp-pin-top,0);left:0;right:0;z-index:4000;box-shadow:0 1px 0 var(--tr-border)}
.exp-rail__inner{display:flex;align-items:stretch;justify-content:space-between;gap:2rem}
/* Pulled left by the same amount the first button is padded, so the label stays
   flush with the container edge while the active background still has room. */
.exp-rail__list{display:flex;align-items:stretch;gap:0;margin:0 0 0 -1.1rem;padding:0;list-style:none;flex:1 1 auto;min-width:0}
.exp-rail__btn{display:flex;flex-direction:column;justify-content:center;gap:.2rem;padding:1rem 1.75rem;background:none;border:0;border-left:1px solid var(--tr-border);cursor:pointer;text-align:left;transition:background-color .26s ease;flex:1 1 0;min-width:0}
.exp-rail__list li:first-child .exp-rail__btn{padding-left:1.1rem;border-left:0}
.exp-rail__btn b{font-family:var(--tr-font-display);font-size:1.15rem;font-weight:500;letter-spacing:-.01em;color:var(--tr-heading);transition:color .26s ease}
.exp-rail__btn span{font-family:var(--tr-font-body);font-size:.6rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--tr-stone-400);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.exp-rail__btn:hover b,.exp-rail__btn.is-active b{color:var(--tr-accent)}
.exp-rail__btn.is-active{background:var(--tr-linen)}
.exp-rail__btn.is-active span{color:var(--tr-accent)}
.exp-rail__cta{display:flex;align-items:center;flex:0 0 auto;padding-left:2rem;border-left:1px solid var(--tr-border)}

/* ---------- SEASON BLOCK ---------- */
.exp-season{scroll-margin-top:5.5rem}
.exp-season__top{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:start;margin-bottom:3.5rem}
.exp-season__media{position:relative;aspect-ratio:3/2;overflow:hidden;background:var(--tr-linen)}
.exp-season__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.exp-season__mark{display:flex;align-items:baseline;gap:1rem;margin:0 0 1.1rem}
.exp-season__name{font-family:var(--tr-font-display);font-size:2.6rem;font-weight:500;line-height:1;letter-spacing:-.015em;color:var(--tr-accent)}
.exp-season__months{font-family:var(--tr-font-body);font-size:.64rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--tr-stone-400)}
.exp-season__h{margin:0 0 1.5rem;font-family:var(--tr-font-display);font-size:2.1rem;font-weight:500;line-height:1.12;letter-spacing:-.015em;color:var(--tr-heading);text-wrap:pretty}
.exp-season__note{margin:1.75rem 0 0;padding-top:1.1rem;border-top:1px solid var(--tr-border);font-family:var(--tr-font-display);font-size:1.05rem;font-style:italic;line-height:1.5;color:var(--tr-text-muted);text-wrap:pretty}
.exp-cats{display:grid;grid-template-columns:repeat(3,1fr)}
.exp-cats__col{padding:0 2.5rem;border-left:1px solid var(--tr-border)}
.exp-cats__col:first-child{padding-left:0;border-left:0}
.exp-cats__col:last-child{padding-right:0}
.exp-cats__h{margin:0 0 1.25rem;font-family:var(--tr-font-body);font-size:.62rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--tr-accent)}
.exp-cats__list{list-style:none;margin:0;padding:0}
.exp-cats__list li{padding:.9rem 0;border-top:1px solid var(--tr-border);font-family:var(--tr-font-body);font-size:.88rem;line-height:1.65;color:var(--tr-text)}

/* ---------- SIGNATURE ---------- */
.exp-sig{display:grid;grid-template-columns:1fr 1fr;gap:0;border-top:1px solid rgba(255,255,255,.14)}
.exp-sig__cell{padding:2.75rem 3rem;border-bottom:1px solid rgba(255,255,255,.14);border-left:1px solid rgba(255,255,255,.14)}
.exp-sig__cell:nth-child(odd){padding-left:0;border-left:0}
.exp-sig__cell:nth-child(even){padding-right:0}
.exp-sig__n{display:flex;align-items:center;gap:1rem;margin:0 0 1rem;font-family:var(--tr-font-body);font-size:.62rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--tr-gold-pale)}
.exp-sig__n::after{content:"";flex:1 1 auto;max-width:3rem;height:1px;background:rgba(255,255,255,.2)}
.exp-sig__name{margin:0 0 .6rem;font-family:var(--tr-font-display);font-size:1.9rem;font-weight:500;line-height:1.1;letter-spacing:-.015em;color:var(--tr-cream)}
.exp-sig__line{margin:0 0 1.1rem;font-family:var(--tr-font-display);font-size:1.15rem;font-style:italic;line-height:1.4;color:var(--tr-gold-pale)}
.exp-sig__p{margin:0;font-family:var(--tr-font-body);font-size:.9rem;line-height:1.8;color:rgba(250,250,248,.66);text-wrap:pretty}
.exp-sig__when{margin:1.25rem 0 0;font-family:var(--tr-font-body);font-size:.6rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:rgba(250,250,248,.4)}

/* ---------- HOW WE HELP ---------- */
.exp-how{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:start}
.exp-how__points{list-style:none;margin:0;padding:0}
.exp-how__points li{padding:1.5rem 0;border-top:1px solid var(--tr-border)}
.exp-how__points li:first-child{padding-top:0;border-top:0}
.exp-how__points b{display:block;margin-bottom:.4rem;font-family:var(--tr-font-display);font-size:1.3rem;font-weight:500;letter-spacing:-.01em;color:var(--tr-heading)}
.exp-how__points p{margin:0;font-family:var(--tr-font-body);font-size:.88rem;line-height:1.75;color:var(--tr-text-muted);text-wrap:pretty}

/* ---------- CALENDAR ---------- */
.exp-cal{display:grid;grid-template-columns:repeat(2,1fr);gap:0 4rem}
.exp-cal__row{display:grid;grid-template-columns:7rem 1fr;gap:1.5rem;align-items:baseline;padding:1.05rem 0;border-top:1px solid var(--tr-border)}
.exp-cal__m{font-family:var(--tr-font-display);font-size:1.2rem;font-weight:500;letter-spacing:-.01em;color:var(--tr-heading)}
.exp-cal__e{font-family:var(--tr-font-body);font-size:.85rem;line-height:1.65;color:var(--tr-text-muted);text-wrap:pretty}

/* ---------- STAY BAND ---------- */
.exp-stay{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
.exp-stay__media{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--tr-linen)}
.exp-stay__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.exp-stay__acts{display:flex;flex-wrap:wrap;align-items:center;gap:1.5rem;margin-top:2.25rem}

/* ---------- RESPONSIVE ---------- */
@media (max-width:1100px){
  .exp-rail__cta{display:none}
  .exp-rail__btn{padding:.85rem 1.1rem}
  .exp-rail__btn b{font-size:1rem}
  .exp-season__top{grid-template-columns:1fr;gap:2.5rem}
  .exp-season__name{font-size:2.2rem}
  .exp-season__h{font-size:1.8rem}
  .exp-cats{grid-template-columns:1fr}
  .exp-cats__col{padding:2rem 0 0;border-left:0;border-top:1px solid var(--tr-border)}
  .exp-cats__col:first-child{padding-top:0;border-top:0}
  .exp-sig{grid-template-columns:1fr}
  .exp-sig__cell{padding:2.25rem 0;border-left:0}
  .exp-sig__cell:first-child{padding-top:2.25rem}
  .exp-how,.exp-stay{grid-template-columns:1fr;gap:2.5rem}
  .exp-cal{grid-template-columns:1fr;gap:0}
}
@media (max-width:899px){
  .exp-rail__inner{gap:0}
  .exp-rail__list{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;margin-left:0}
  .exp-rail__list::-webkit-scrollbar{display:none}
  .exp-rail__btn{flex:0 0 auto;min-width:10.5rem;padding:.8rem 1rem}
  .exp-rail__list li:first-child .exp-rail__btn{padding-left:1rem}
  .exp-rail__btn b{font-size:.95rem}
  .exp-season{scroll-margin-top:4.5rem}
  .exp-season__name{font-size:1.9rem}
  .exp-season__h{font-size:1.5rem}
  .exp-sig__name{font-size:1.5rem}
  .exp-sig__line{font-size:1.05rem}
  .exp-cal__row{grid-template-columns:1fr;gap:.3rem;padding:.9rem 0}
}