@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@600;700&display=swap');

:root{
  --navy:#071a38;
  --red:#bd0b10;
  --cream:#f5f1eb;
}

*{
  box-sizing:border-box;
}

html,body{
  margin:0;
  padding:0;
  background:#d7d7d7;
}

body{
  font-family:Arial,Helvetica,sans-serif;
}

.pricing-page{
  position:relative;
  width:min(100%,1024px);
  margin:0 auto;
  aspect-ratio:2 / 3;
  overflow:hidden;
  background:var(--cream);
}

.visual-base{
  display:block;
  width:100%;
  height:100%;
  object-fit:fill;
}

/*
  EDITABLE PRICE PANELS
  ---------------------
  These cover only the printed price portion of the reference image.
  The hero, category headers, icons, borders, prepaid notice, banner,
  address, phone number and lane-availability notice remain exactly
  as shown in the source visual.
*/

.editable-price{
  position:absolute;
  width:21.9%;
  height:8.49275%;
  background:#eeedeb;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
}

.editable-price strong{
  color:var(--red);
  font-family:Oswald,Impact,"Arial Narrow",sans-serif;
  font-size:clamp(34px,6.05vw,62px);
  line-height:.92;
  font-weight:700;
  letter-spacing:-1px;
}

.editable-price span{
  margin-top:.48em;
  color:var(--navy);
  font-family:Oswald,Impact,"Arial Narrow",sans-serif;
  font-size:clamp(14px,2.15vw,22px);
  line-height:1;
  font-weight:700;
}

/* Positions tuned for the supplied 1024 × 1536 visual */
.adult-price{
  left:7.05%;
  top:40.497825%;
}

.child-price{
  left:38.38%;
  top:40.497825%;
}

.league-price{
  left:69.72%;
  top:40.497825%;
}

.senior-price{
  left:7.05%;
  top:62.197825%;
}

.shoe-price{
  left:38.38%;
  top:62.197825%;
}

.school-price{
  left:69.72%;
  top:62.197825%;
}

@media(max-width:650px){
  .editable-price strong{
    letter-spacing:0;
  }
}

/* Price card height update: 10.55% × 1.15 = 12.1325% */

/* Price card height decreased by 30% from the previous version. */

/* Adjustable pricing overlays moved down by 10% of their current overlay height. */

/* Pricing overlays moved down an additional 10% from the previous version. */

/* Overlay background matched to the dominant interior card color
   sampled from the supplied visual: RGB(238, 237, 235) / #EEEDEB. */

/* All adjustable price overlays moved down an additional 10% of overlay height. */