.page-products .pd-hero{position:relative;overflow:hidden}
.page-products .pd-hero__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.2;filter:saturate(.75)}
.page-products .pd-hero__inner{position:relative;z-index:1;padding-block:clamp(1.5rem,4vw,2.4rem) clamp(2.2rem,5vw,3.4rem)}
.page-products .pd-hero .crumbs__list{display:flex;flex-wrap:wrap;gap:.4rem;list-style:none;margin:0 0 1.4rem;padding:0;font-size:.8rem}
.page-products .pd-hero .crumbs__item{display:flex;align-items:center;gap:.4rem;color:var(--stand)}
.page-products .pd-hero .crumbs__item+ .crumbs__item::before{content:"/";color:var(--line-cyan)}
.page-products .pd-hero .crumbs__link{color:var(--stand);text-decoration:none;border-bottom:1px solid transparent}
.page-products .pd-hero .crumbs__link:hover,.page-products .pd-hero .crumbs__link:focus-visible{color:var(--cyan);border-bottom-color:var(--line-cyan)}
.page-products .pd-hero .crumbs__current{color:var(--mist)}
.page-products .pd-hero__kicker{margin:0 0 .9rem;font-family:var(--font-mono);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--cyan)}
.page-products .eyebrow{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--stand);margin:0 0 .8rem}
.page-products .pd-hero__title{margin:0;max-width:20ch;font-family:var(--font-display);font-weight:900;font-size:clamp(1.9rem,7vw,3.5rem);line-height:1.1;letter-spacing:-.02em;color:var(--white)}
.page-products .pd-hero__lede{max-width:42ch;margin:1.1rem 0 0;font-size:clamp(.95rem,2.4vw,1.08rem);line-height:1.8;color:rgba(244,247,243,.84)}

.page-products .pd-stats{display:flex;flex-wrap:wrap;gap:1.2rem 2.2rem;margin:1.8rem 0 0;padding:1.1rem 0 0;list-style:none;border-top:1px solid var(--line-dark)}
.page-products .pd-stats__item{display:flex;flex-direction:column;gap:.2rem}
.page-products .pd-stats__num{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:clamp(1.5rem,4.5vw,2rem);font-weight:700;line-height:1;color:var(--cyan)}
.page-products .pd-stats__plus{font-size:.7em;margin-left:.1em}
.page-products .pd-stats__label{font-size:.78rem;color:var(--stand)}

.page-products .pd-modules{padding-block:clamp(2rem,5vw,3.4rem) clamp(2.4rem,5vw,3.6rem)}
.page-products .pd-modules__head{margin-bottom:1.5rem}
.page-products .section-head__kicker{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--cyan);margin:0 0 .55rem}
.page-products .section-head__title{margin:0;font-family:var(--font-display);font-weight:900;font-size:clamp(1.4rem,4.2vw,2.1rem);line-height:1.2;letter-spacing:-.01em}
.page-products .band--grass .section-head__title{color:var(--white)}
.page-products .band--mist .section-head__title,.page-products .band--sand .section-head__title{color:var(--ink)}
.page-products .band--night .section-head__title{color:var(--white)}
.page-products .band--mist .section-head__kicker,.page-products .band--sand .section-head__kicker{color:#0b6b52}

.page-products .pd-panels{display:grid;gap:var(--gap);grid-template-columns:1fr}
.page-products .pd-panel{
  display:flex;flex-direction:column;gap:.6rem;
  padding:1.35rem 1.25rem 1.5rem;
  text-decoration:none;color:var(--mist);
  background:linear-gradient(158deg,rgba(8,40,28,.95),rgba(16,26,43,.95));
  clip-path:polygon(0 0,calc(100% - var(--cut)) 0,100% var(--cut),100% 100%,var(--cut) 100%,0 calc(100% - var(--cut)));
  transition:clip-path .35s var(--ease),background .35s var(--ease),box-shadow .35s var(--ease);
  min-height:100%;
}
.page-products .pd-panel:hover,.page-products .pd-panel:focus-visible{
  clip-path:polygon(0 0,calc(100% - var(--cut) * 2.2) 0,100% calc(var(--cut) * 2.2),100% 100%,calc(var(--cut) * 2.2) 100%,0 calc(100% - var(--cut) * 2.2));
  background:linear-gradient(158deg,rgba(12,59,42,.98),rgba(16,26,43,.98));
  box-shadow:inset 0 0 0 2px var(--cyan);
  outline:none;
}
.page-products .pd-panel__num{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:.78rem;letter-spacing:.1em;color:var(--stand)}
.page-products .pd-panel .label-tag{align-self:flex-start}
.page-products .label-tag{display:inline-block;padding:.2rem .55rem;font-family:var(--font-mono);font-size:.68rem;letter-spacing:.12em;line-height:1.5;border-radius:1px}
.page-products .label-tag--cyan{background:var(--cyan);color:var(--ink)}
.page-products .label-tag--orange{background:var(--orange);color:var(--ink)}
.page-products .label-tag--violet{background:var(--violet);color:var(--white)}
.page-products .label-tag--sand{background:var(--sand);color:var(--ink)}
.page-products .label-tag--night{background:var(--night);color:var(--cyan)}
.page-products .pd-panel__title{font-family:var(--font-display);font-weight:900;font-size:1.15rem;line-height:1.3;color:var(--white);margin-top:.1rem}
.page-products .pd-panel__text{font-size:.88rem;line-height:1.72;color:rgba(244,247,243,.8)}
.page-products .pd-panel__meta{margin-top:auto;padding-top:.8rem;font-size:.7rem;letter-spacing:.1em;color:var(--cyan);border-top:1px solid var(--line-dark)}

.page-products .pd-indexsec{padding-block:clamp(2.2rem,5vw,3.6rem)}
.page-products .pd-split{display:grid;gap:clamp(1.5rem,3.5vw,2.6rem);grid-template-columns:1fr;align-items:start}
.page-products .pd-indexsec__hint{margin:0 0 .9rem;font-size:.85rem;color:#3d5648}
.page-products .pd-index{border:1px solid var(--line-light);background:var(--white);box-shadow:0 14px 30px -24px rgba(6,26,19,.7)}
.page-products .pd-index__season,.page-products .pd-index__month{border-top:1px solid var(--line-light)}
.page-products .pd-index__season:first-child{border-top:0}
.page-products .pd-index__summary{display:flex;align-items:center;gap:.65rem;padding:.75rem .9rem;cursor:pointer;list-style:none;font-size:.88rem;font-weight:600;color:var(--ink);transition:background .2s var(--ease)}
.page-products .pd-index__summary::-webkit-details-marker{display:none}
.page-products .pd-index__summary:hover{background:rgba(46,230,182,.12)}
.page-products .pd-index__summary:focus-visible{outline:2px solid var(--cyan);outline-offset:-3px}
.page-products .pd-index__summary::after{content:"+";margin-left:auto;font-family:var(--font-mono);color:#0b6b52}
.page-products details[open]>.pd-index__summary::after{content:"–"}
.page-products .pd-index__summary--sub{padding-left:1.9rem;background:rgba(6,26,19,.03);font-weight:500;font-size:.84rem}
.page-products .pd-index__code{font-size:.68rem;letter-spacing:.1em;color:#0b6b52}
.page-products .pd-index__name{flex:1}
.page-products .pd-index__count{font-size:.7rem;color:var(--stand);letter-spacing:.06em}
.page-products .pd-index__list{list-style:none;margin:0;padding:0 0 .3rem}
.page-products .pd-index__row{display:flex;align-items:center;gap:.8rem;padding:.55rem .9rem .55rem 2.6rem;border-top:1px dashed var(--line-light)}
.page-products .pd-index__link{flex:1;font-size:.83rem;color:var(--ink);text-decoration:none;border-bottom:1px solid transparent}
.page-products .pd-index__link:hover,.page-products .pd-index__link:focus-visible{color:#0b6b52;border-bottom-color:var(--cyan)}
.page-products .pd-index__meta{font-size:.68rem;color:var(--stand);letter-spacing:.06em}
.page-products .pd-indexsec__prose p,.page-products .pd-schedsec__prose p,.page-products .pd-lineup__prose p{margin:0 0 1rem;font-size:.94rem;line-height:1.8;color:#22362c;max-width:42ch}
.page-products .pd-indexsec__prose p:last-child,.page-products .pd-schedsec__prose p:last-child,.page-products .pd-lineup__prose p:last-child{margin-bottom:0}

.page-products .pd-figure{position:relative;margin:1.6rem 0 0;overflow:hidden}
.page-products .pd-figure img{display:block;width:100%;height:auto;object-fit:cover}
.page-products .pd-figure--slant img{clip-path:polygon(0 0,100% 0,100% 100%,0 calc(100% - 8%));aspect-ratio:14/9}
.page-products .pd-figure--screen img{border:1px solid var(--line-light);aspect-ratio:3/2}
.page-products .pd-figure--board{margin:0}
.page-products .pd-figure--board img{aspect-ratio:1/1;clip-path:polygon(0 0,calc(100% - 12%) 0,100% 12%,100% 100%,0 100%)}
.page-products .pd-figure--ticket{margin:0}
.page-products .pd-figure--ticket img{aspect-ratio:1/1;clip-path:polygon(10% 0,100% 0,100% 100%,0 100%,0 10%)}
.page-products .pd-figure__tag{position:absolute;top:.9rem;left:.9rem;z-index:2}
.page-products .media__caption{margin:.65rem 0 0;font-size:.76rem;line-height:1.6;color:var(--stand)}
.page-products .pd-figure--board .media__caption,.page-products .pd-figure--ticket .media__caption{color:rgba(244,247,243,.62)}

.page-products .pd-schedsec{padding-block:clamp(2.2rem,5vw,3.6rem)}
.page-products .pd-schedsec__prose p{color:#2c2519}
.page-products .pd-range{list-style:none;margin:1.6rem 0 0;padding:0}
.page-products .pd-range__row{position:relative;display:grid;grid-template-columns:5.6rem 1fr auto;align-items:center;gap:.7rem;padding:.72rem .15rem;border-top:1px solid rgba(6,26,19,.15)}
.page-products .pd-range__row:last-child{border-bottom:1px solid rgba(6,26,19,.15)}
.page-products .pd-range__zone{font-size:.8rem;font-weight:600;color:var(--ink)}
.page-products .pd-range__track{position:relative;height:12px;background:rgba(6,26,19,.09)}
.page-products .pd-range__fill{position:absolute;top:0;bottom:0;left:var(--a,20%);right:calc(100% - var(--b,60%));background:rgba(255,122,41,.26);border-left:2px solid var(--orange);border-right:2px solid var(--orange);transition:background .25s var(--ease)}
.page-products .pd-range__row:hover .pd-range__fill{background:rgba(255,122,41,.42)}
.page-products .pd-range__value{font-size:.7rem;letter-spacing:.08em;color:#8a4b18}
.page-products .pd-range__tip{position:absolute;left:0;bottom:calc(100% - .1rem);z-index:3;max-width:24rem;padding:.45rem .6rem;font-size:.74rem;line-height:1.5;color:var(--mist);background:var(--night);border-left:2px solid var(--orange);opacity:0;visibility:hidden;transform:translateY(4px);transition:opacity .22s var(--ease),transform .22s var(--ease),visibility .22s}
.page-products .pd-range__row:hover .pd-range__tip{opacity:1;visibility:visible;transform:translateY(0)}

.page-products .pd-lineup{padding-block:clamp(2.2rem,5vw,3.6rem)}
.page-products .pd-lineup__grid{display:grid;gap:clamp(1.4rem,3.5vw,2.4rem);grid-template-columns:1fr}
.page-products .pd-lineup__prose p{color:rgba(244,247,243,.82)}
.page-products .pd-lineup__links{display:flex;flex-wrap:wrap;gap:.7rem;margin:1.4rem 0 0}
.page-products .btn{display:inline-flex;align-items:center;gap:.5rem;padding:.62rem 1.05rem;font-size:.84rem;font-weight:600;text-decoration:none;border:1px solid transparent;transition:background .2s var(--ease),color .2s var(--ease),border-color .2s var(--ease)}
.page-products .btn--action{background:var(--orange);color:var(--ink)}
.page-products .btn--action:hover,.page-products .btn--action:focus-visible{background:#ff8f4c}
.page-products .btn--ghost{border-color:var(--line-cyan);color:var(--cyan);background:transparent}
.page-products .btn--ghost:hover,.page-products .btn--ghost:focus-visible{background:rgba(46,230,182,.14);color:var(--white)}
.page-products .btn--sm{padding:.5rem .85rem;font-size:.78rem}
.page-products .btn__arrow{font-family:var(--font-mono);font-size:.85em}
.page-products .btn:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}

.page-products .pd-matrix{padding-block:clamp(2.2rem,5vw,3.6rem)}
.page-products .pd-matrix__head{margin-bottom:1.4rem}
.page-products .pd-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line-light);background:var(--white)}
.page-products .pd-table{width:100%;min-width:640px;border-collapse:collapse;font-size:.86rem}
.page-products .pd-table__caption{caption-side:top;text-align:left;padding:.8rem .95rem;font-family:var(--font-mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--stand);border-bottom:1px solid var(--line-light)}
.page-products .pd-table th,.page-products .pd-table td{padding:.82rem .95rem;text-align:left;vertical-align:top;border-bottom:1px solid var(--line-light)}
.page-products .pd-table thead th{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:#0b6b52;background:rgba(6,26,19,.045);border-bottom:2px solid var(--ink)}
.page-products .pd-table tbody th{font-weight:700;color:var(--ink)}
.page-products .pd-table tbody tr:nth-child(even){background:rgba(6,26,19,.035)}
.page-products .pd-table tbody tr:hover{background:rgba(46,230,182,.13)}
.page-products .pd-table td{color:#22362c}
.page-products .pd-table .mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:.78rem;color:var(--stand);white-space:nowrap}
.page-products .pd-table a{color:#0b6b52;text-decoration:none;border-bottom:1px solid var(--line-cyan)}
.page-products .pd-table a:hover,.page-products .pd-table a:focus-visible{color:var(--ink);border-bottom-color:var(--orange)}
.page-products .pd-table__hint{margin:.7rem 0 0;font-size:.7rem;letter-spacing:.08em;color:var(--stand)}

.page-products .pd-start{padding-block:calc(var(--slant-h) + clamp(1.8rem,4vw,3rem)) clamp(2.2rem,5vw,3.6rem)}
.page-products .pd-start__grid{display:grid;gap:clamp(1.5rem,3.5vw,2.6rem);grid-template-columns:1fr;align-items:start}
.page-products .pd-steps{list-style:none;margin:1.4rem 0 0;padding:0;display:grid;gap:.9rem}
.page-products .pd-steps__item{display:grid;grid-template-columns:2.4rem 1fr;gap:.15rem .8rem;padding:.85rem .9rem;background:rgba(244,247,243,.06);border-left:2px solid var(--orange)}
.page-products .pd-steps__num{grid-row:span 2;align-self:center;font-size:1.1rem;font-weight:700;color:var(--orange)}
.page-products .pd-steps__title{font-family:var(--font-display);font-weight:900;font-size:1rem;color:var(--white)}
.page-products .pd-steps__text{font-size:.85rem;line-height:1.7;color:rgba(244,247,243,.78)}
.page-products .pd-start__note{margin:1.3rem 0 0;max-width:42ch;font-size:.9rem;line-height:1.8;color:rgba(244,247,243,.8)}
.page-products .pd-start__links{display:flex;flex-wrap:wrap;gap:.7rem;margin:1.4rem 0 0}

@media (min-width:640px){
  .page-products .pd-panels{grid-template-columns:repeat(2,1fr)}
  .page-products .pd-stats{gap:1.4rem 2.8rem}
}

@media (min-width:900px){
  .page-products .pd-split--index{grid-template-columns:7fr 5fr}
  .page-products .pd-split--sched{grid-template-columns:5fr 7fr;align-items:center}
  .page-products .pd-split--sched .pd-figure{margin:0}
  .page-products .pd-lineup__grid{grid-template-columns:7fr 5fr;align-items:center}
  .page-products .pd-start__grid{grid-template-columns:7fr 5fr;align-items:center}
  .page-products .pd-hero__title{font-size:clamp(2.6rem,4.4vw,3.6rem)}
}

@media (min-width:1080px){
  .page-products .pd-panels{grid-template-columns:repeat(4,1fr)}
  .page-products .pd-panel{padding:1.5rem 1.2rem 1.6rem}
  .page-products .pd-indexsec{padding-block:clamp(3rem,4.5vw,4.2rem)}
  .page-products .pd-schedsec,.page-products .pd-lineup,.page-products .pd-matrix{padding-block:clamp(3rem,4.5vw,4.2rem)}
}

@media (prefers-reduced-motion:reduce){
  .page-products .pd-panel,
  .page-products .pd-range__fill,
  .page-products .pd-range__tip,
  .page-products .pd-index__summary,
  .page-products .btn{transition:none}
  .page-products .pd-panel:hover,.page-products .pd-panel:focus-visible{clip-path:polygon(0 0,calc(100% - var(--cut)) 0,100% var(--cut),100% 100%,var(--cut) 100%,0 calc(100% - var(--cut)))}
  .page-products .pd-range__tip{transform:none}
}
<<<END>>>

.page-products {
  --a: inherit;
  --b: inherit;
}
