/* ============================================================
   Niagara River fishing charters: page layer
   Spine: shared .page-hero (portrait river frame, tuned crop),
   breadcrumb, horizontal season strip, a short winter program
   block, then the one package stacked full width above a
   full-width packing band. Requires tokens.css then base.css.
   Tokens only for colour and type, no border-radius,
   --red stays on .btn-book and .btn-action.
   ============================================================ */

/* ============ 1. Hero crop override ============
   Image 12 is a 1440x1920 portrait frame, so the shared
   .page-hero crop (center 40%) sits too low and cuts the angler.
   The page keeps the tuned band treatment from the old
   .river-band: subject held near the upper third, cold grade. */
.river-hero .page-hero-img{
  object-position:50% 34%;
  filter:saturate(.88) contrast(1.03) brightness(.92);
}

/* ============ 2. Breadcrumb rail ============ */
.crumbs{padding-top:1.1rem;padding-bottom:.35rem}

/* ============ 3. Season strip ============
   One horizontal run of facts, read left to right, directly
   under the breadcrumb so price and season land on screen one. */
.river-open{padding-top:clamp(1.25rem,2.5vw,2rem)}
.season-strip{
  list-style:none;
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  margin:0;
  border-top:2px solid var(--blue-bright);
  border-bottom:1px solid var(--line);
}
.season-strip li{
  display:flex;
  flex-direction:column;
  gap:.42rem;
  padding:1.15rem clamp(.85rem,1.5vw,1.3rem) 1.25rem;
  border-left:1px solid var(--line);
}
.season-strip li:nth-child(6n+1){border-left:0;padding-left:0}
.strip-label{
  font-family:var(--display);
  font-stretch:125%;
  font-variation-settings:'wdth' 125;
  font-weight:600;
  font-size:.7rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--dim);
}
.strip-value{
  font-size:.98rem;
  line-height:1.3;
  color:var(--ice);
}

/* ============ 4. Winter program ============ */
.winter-split{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);
  gap:clamp(1.75rem,4vw,3.25rem);
  align-items:start;
}
.winter-copy p{color:var(--dim)}
.winter-copy .display-head{margin-bottom:1.35rem}
.species-chips{
  margin-top:1.4rem;
  margin-bottom:1.4rem;
}
.winter-photo img{
  width:100%;
  height:auto;
  aspect-ratio:4/3;
  object-fit:cover;
  border:1px solid var(--line);
  filter:saturate(.92) brightness(.94);
}

/* one note card only: a rule-topped footnote under the split */
.winter-notes{
  margin-top:clamp(2rem,4vw,3rem);
  border-top:1px solid var(--line);
  padding-top:clamp(1.6rem,3vw,2.4rem);
}
.note-card{max-width:52rem}
.note-card h3{
  font-family:var(--display);
  font-stretch:125%;
  font-variation-settings:'wdth' 125;
  font-weight:700;
  font-size:1.02rem;
  letter-spacing:.03em;
  text-transform:uppercase;
  color:var(--cream);
  margin-bottom:.7rem;
  padding-left:.9rem;
  border-left:3px solid var(--blue);
}
.note-card p{color:var(--dim);font-size:.96rem}
.note-card a{color:var(--blue-bright)}

/* ============ 5. The one package, stacked full width ============ */
.river-pkg{margin-bottom:clamp(1.5rem,3vw,2.25rem)}
.river-pkg .card-body{padding:clamp(1.6rem,3vw,2.25rem)}
/* this card runs the full measure, so the 4:3 crop from base.css's
   .card-photo img is overridden to a banner ratio, biased down to hold
   the catch */
.river-pkg .card-photo img{aspect-ratio:16/9;object-position:50% 35%}
.pkg-points{
  list-style:none;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  column-gap:clamp(1.5rem,3vw,3.25rem);
  margin:0 0 1.5rem;
  border-top:1px solid var(--line);
  padding-top:1rem;
}
.pkg-points li{
  color:var(--dim);
  font-size:.95rem;
  padding:.34rem 0 .34rem 1.15rem;
  position:relative;
}
.pkg-points li::before{
  content:"";
  position:absolute;left:0;top:.82em;
  width:.5rem;height:1px;
  background:var(--blue-bright);
}
/* ticket footer: chips, price and the book action on one line */
.pkg-foot{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:1.2rem clamp(1.5rem,3vw,2.5rem);
  border-top:1px solid var(--line);
  padding-top:1.35rem;
}
.river-pkg .chips{margin:0}
.river-pkg .price-row{
  display:flex;
  align-items:baseline;
  gap:.85rem;
  border-top:0;
  padding-top:0;
  margin-bottom:0;
}
.river-pkg .price-note{margin-top:0}

/* ============ 6. Full-width packing band ============ */
.bring-band{
  background:var(--panel);
  border:1px solid var(--line);
  border-top:3px solid var(--blue-bright);
  padding:clamp(1.6rem,3vw,2.4rem);
}
.bring-band-head{max-width:46rem}
.bring-band h3{
  font-family:var(--display);
  font-stretch:125%;
  font-variation-settings:'wdth' 125;
  font-weight:760;
  font-size:clamp(1.3rem,2.2vw,1.75rem);
  line-height:1.1;
  text-transform:uppercase;
  color:var(--cream);
  margin:.55rem 0 0;
}
.bring-list{
  list-style:none;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  column-gap:clamp(1.5rem,3vw,3.25rem);
  margin:clamp(1.35rem,2.5vw,1.85rem) 0;
}
.bring-list li{
  color:var(--ice);
  font-size:.96rem;
  padding:.5rem 0 .5rem 1.5rem;
  border-bottom:1px solid var(--line);
  position:relative;
}
.bring-list li::before{
  content:"";
  position:absolute;left:0;top:1.05em;
  width:.6rem;height:.6rem;
  border-left:1px solid var(--blue-bright);
  border-bottom:1px solid var(--blue-bright);
  transform:translateY(-50%) rotate(-45deg);
}
.bring-list a{color:var(--blue-bright)}
.bring-band-foot{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:1.1rem clamp(1.5rem,3vw,2.5rem);
  border-top:1px solid var(--line);
  padding-top:1.35rem;
}
.bring-foot{
  color:var(--dim);
  font-size:.9rem;
  max-width:40rem;
}
.bring-foot a{color:var(--blue-bright)}

/* ============ Responsive ============ */
@media (max-width:1000px){
  .winter-split{grid-template-columns:1fr}
  .season-strip{grid-template-columns:repeat(3,minmax(0,1fr))}
  .season-strip li{border-left:1px solid var(--line);padding-left:clamp(.85rem,1.5vw,1.3rem)}
  .season-strip li:nth-child(3n+1){border-left:0;padding-left:0}
  .season-strip li:nth-child(n+4){border-top:1px solid var(--line)}
  .bring-list{grid-template-columns:1fr}
  .bring-list li:last-child{border-bottom:0}
}
@media (max-width:880px){
  .river-hero .page-hero-img{object-position:50% 30%}
  .pkg-points{grid-template-columns:1fr}
  .pkg-foot{justify-content:flex-start}
}
@media (max-width:640px){
  .river-hero .page-hero-img{object-position:50% 26%}
  .season-strip{grid-template-columns:repeat(2,minmax(0,1fr))}
  .season-strip li:nth-child(3n+1){border-left:1px solid var(--line);padding-left:clamp(.85rem,1.5vw,1.3rem)}
  .season-strip li:nth-child(2n+1){border-left:0;padding-left:0}
  .season-strip li:nth-child(n+3){border-top:1px solid var(--line)}
  .pkg-foot .btn,
  .bring-band-foot .btn{flex:1 1 100%;text-align:center}
}
