/* Service package section and cards
   Reorganized from the verified working production build. */

.services-section {
  isolation: isolate;
  background-color: #0b0e14;
  background-image: radial-gradient(circle at 12% 18%,#d70b1714,#0000 24%),radial-gradient(circle at 94% 70%,#42b0de12,#0000 25%),linear-gradient(#ffffff06 1px,#0000 1px),none;
  background-position: 0 0,0 0,0 0,0 0;
  background-repeat: repeat,repeat,repeat,repeat;
  background-size: 100% 76px;
  background-attachment: scroll,scroll,scroll,scroll;
  background-origin: padding-box,padding-box,padding-box,padding-box;
  background-clip: border-box,border-box,border-box,border-box;
  padding: 102px max(40px,50vw - 590px);
  position: relative;
  overflow: hidden;
}

.services-section:before {
  z-index: -1;
  content: "";
  border: 1px solid #62c7ec14;
  border-radius: 50%;
  width: 360px;
  height: 360px;
  position: absolute;
  top: 96px;
  right: -110px;
  box-shadow: 0 0 0 42px #62c7ec06,0 0 0 92px #d70b1705;
}

.section-heading {
  grid-template-columns: minmax(0,1.3fr) minmax(280px,.7fr);
  align-items: end;
  gap: 50px;
  margin-bottom: 44px;
  display: grid;
}

.section-kicker {
  color: var(--pink);
}

.section-heading h2 {
  letter-spacing: -.04em;
  text-transform: uppercase;
  margin: 12px 0 0;
  font-size: clamp(36px,4vw,54px);
  font-style: italic;
  font-weight: 900;
  line-height: 1;
  position: relative;
}

.services-section .section-heading h2:after {
  content: "";
  background: linear-gradient(90deg, var(--pink), #f05b64 52%, #6fc7e9);
  border-radius: 999px;
  width: 92px;
  height: 3px;
  margin-top: 17px;
  display: block;
  box-shadow: 0 0 18px #d70b173d;
}

.section-heading>p {
  color: var(--muted);
  margin: 0;
  font-size: 15px;
  line-height: 1.7;
}

.section-heading>.pricing-explainer {
  border: 1px solid #ffffff21;
  border-left: 3px solid var(--pink);
  color: #b9bfcb;
  background: #d70b170e;
  border-radius: 10px;
  padding: 18px 20px;
  font-size: 13px;
  line-height: 1.65;
}

.pricing-explainer strong {
  color: var(--white);
  letter-spacing: .13em;
  text-transform: uppercase;
  margin-bottom: 6px;
  font-size: 10px;
  font-weight: 900;
  display: block;
}

.package-grid {
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 18px;
  display: grid;
}

.package-card {
  --card-accent: #e42a35;
  --card-glow: #d70b1726;
  isolation: isolate;
  background: radial-gradient(circle at 88% 7%,#d6d9de14,#0000 29%),linear-gradient(145deg,#ffffff0e,#ffffff03);
  border: 1px solid #ffffff21;
  border-radius: 20px;
  min-height: 0;
  padding: 27px;
  transition: transform .18s,border-color .18s,box-shadow .18s;
  position: relative;
  overflow: hidden;
  box-shadow: inset 0 1px #ffffff09;
}

.package-card:before {
  z-index: 2;
  content: "";
  background: linear-gradient(90deg, transparent, var(--card-accent), transparent);
  opacity: .78;
  height: 2px;
  position: absolute;
  top: 0;
  left: 24px;
  right: 24px;
}

.package-card:after {
  z-index: 0;
  content: "";
  pointer-events: none;
  position: absolute;
}

.package-full:after {
  opacity: .96;
  filter: drop-shadow(0 0 17px #55c0e821);
  background: radial-gradient(circle at 3% 9%,#ffffff2b 0 3px,#0000 4px 11px,#6fcff238 12px 15px,#0000 16px),radial-gradient(circle at 18% 1%,#0000 0 9px,#e0f8ff33 10px 12px,#0000 13px),radial-gradient(circle at 82% 2%,#ffffff21 0 4px,#0000 5px 16px,#5bc5eb33 17px 20px,#0000 21px),radial-gradient(circle at 97% 14%,#0000 0 24px,#79d3f430 25px 29px,#0000 30px),radial-gradient(circle at 100% 39%,#ffffff1f 0 3px,#0000 4px 13px,#e4f8ff2e 14px 17px,#0000 18px),radial-gradient(circle at 98% 69%,#0000 0 16px,#59c2e933 17px 20px,#0000 21px),radial-gradient(circle at 86% 99%,#ffffff1c 0 3px,#0000 4px 11px,#cff2ff30 12px 15px,#0000 16px),radial-gradient(circle at 10% 98%,#0000 0 21px,#67caef2b 22px 25px,#0000 26px),radial-gradient(circle at 1% 76%,#ffffff1f 0 3px,#0000 4px 12px,#dff6ff2e 13px 16px,#0000 17px),radial-gradient(circle at 0 44%,#0000 0 12px,#61c9ef33 13px 16px,#0000 17px),radial-gradient(circle at 73% 18%,#0000 0 8px,#e0f8ff29 9px 11px,#0000 12px),radial-gradient(circle at 92% 86%,#0000 0 7px,#71d1f333 8px 10px,#0000 11px);
  inset: 0;
}

.full-detail-art {
  z-index: 2;
  pointer-events: none;
  filter: drop-shadow(0 17px 22px #0000006b)drop-shadow(0 0 17px #d70b1733);
  width: clamp(230px,31%,355px);
  height: auto;
  display: block;
  position: absolute;
  top: 17px;
  right: 25px;
}

.package-full .package-details {
  padding-top: 128px;
}

.package-interior {
  --card-accent: #d9dce3;
  --card-glow: #d6d9e11f;
}

.package-interior:after {
  opacity: .72;
  background: radial-gradient(circle at 84% 12%,#0000 0 13px,#78d3f22e 14px 16px,#0000 17px),radial-gradient(circle at 94% 23%,#ffffff1a 0 3px,#0000 4px 9px,#65c5e626 10px 12px,#0000 13px),linear-gradient(45deg,#0000 47%,#dadee70e 48% 50%,#0000 51%) 0 0/34px 34px,linear-gradient(-45deg,#0000 47%,#dadee70a 48% 50%,#0000 51%) 0 0/34px 34px;
  inset: 0;
  -webkit-mask-image: linear-gradient(145deg,#000,#000000b8 42%,#0000 82%);
  mask-image: linear-gradient(145deg,#000,#000000b8 42%,#0000 82%);
}

.package-exterior {
  --card-accent: #ef3b46;
  --card-glow: #d70b1724;
}

.package-exterior:after {
  opacity: .68;
  background: radial-gradient(circle at 28% 34%,#ffffff1f 0 3px,#0000 4px 10px,#ee454f2e 11px 13px,#0000 14px),radial-gradient(circle at 62% 19%,#0000 0 17px,#dadee524 18px 20px,#0000 21px),radial-gradient(circle at 77% 66%,#0000 0 9px,#ef3b462b 10px 12px,#0000 13px),linear-gradient(115deg,#0000 24%,#ffffff14 48%,#0000 66%);
  width: 245px;
  height: 210px;
  top: -20px;
  right: -35px;
  transform: rotate(-13deg);
}

.package-golf-car {
  --card-accent: #61c6ec;
  --card-glow: #3db2de24;
}

.package-golf-car:after {
  opacity: .72;
  background: linear-gradient(135deg,#0000 47%,#56bbe10e 48% 50%,#0000 51%) 0 0/42px 42px,radial-gradient(circle at 92% 8%,#5bc5ed1f,#0000 30%);
  inset: 0;
  -webkit-mask-image: linear-gradient(145deg,#0000 22%,#000000c7,#0000 92%);
  mask-image: linear-gradient(145deg,#0000 22%,#000000c7,#0000 92%);
}

.golf-car-art {
  z-index: 2;
  pointer-events: none;
  filter: drop-shadow(0 12px 14px #00000057)drop-shadow(0 0 10px #4ebee721);
  width: clamp(96px,31%,122px);
  height: auto;
  display: block;
  position: absolute;
  top: 14px;
  right: 14px;
}

.package-golf-car .package-badges {
  padding-right: 108px;
}

.package-golf-car h3 {
  max-width: calc(100% - 104px);
}

.package-card.featured {
  background: linear-gradient(112deg,#0000 16%,#ffffff0b 36%,#0000 48%),radial-gradient(circle at 82% 30%,#d70b1726,#0000 29%),linear-gradient(120deg,#d70b1714,#ffffff09 45%,#ffffff03);
  border-color: #d70b17a3;
  grid-column: 1/-1;
  min-height: 0;
  padding: 34px;
  box-shadow: inset 0 1px #ffffff1a,0 22px 60px #d70b171a;
}

.package-card.featured:before {
  background: linear-gradient(90deg,#0000,#ed2935 40%,#dfe4eb 62%,#6cc6e8 82%,#0000);
  left: 34px;
  right: 34px;
}

.package-card:not(.featured):hover {
  border-color: #ffffff3d;
  transform: translateY(-3px);
  box-shadow: inset 0 1px #ffffff0f,0 18px 40px #00000038;
}

.package-content,.package-details {
  z-index: 1;
  flex-direction: column;
  height: 100%;
  display: flex;
  position: relative;
}

.featured .package-content {
  grid-template-columns: minmax(0,.82fr) minmax(0,1.18fr);
  align-items: center;
  gap: 64px;
  display: grid;
}

.package-badges {
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 18px;
  display: flex;
}

.package-type,.best-value {
  color: #cbd0d8;
  letter-spacing: .1em;
  text-transform: uppercase;
  background: #d6d9de0f;
  border: 1px solid #d6d9de2e;
  border-radius: 999px;
  width: max-content;
  padding: 7px 11px;
  font-size: 10px;
  font-weight: 900;
  display: inline-flex;
}

.best-value {
  color: #ff626b;
  background: #d70b1724;
  border: 1px solid #eb273273;
}

.package-card h3 {
  color: #fff;
  letter-spacing: -.035em;
  width: max-content;
  max-width: none;
  text-shadow: 0 0 22px var(--card-glow);
  margin: 2px 0 12px;
  padding-bottom: 10px;
  font-size: 27px;
  font-weight: 950;
  display: inline-block;
  position: relative;
}

.package-card h3:after {
  content: "";
  background: linear-gradient(90deg, var(--card-accent), #ffffffb8, transparent);
  width: 54px;
  height: 3px;
  box-shadow: 0 0 13px var(--card-glow);
  border-radius: 999px;
  position: absolute;
  bottom: 0;
  left: 0;
}

.featured h3 {
  text-transform: uppercase;
  max-width: none;
  font-size: clamp(30px,3vw,43px);
  font-style: italic;
}

.featured h3:after {
  background: linear-gradient(90deg,#ef3540,#f4f7fa 58%,#69c7eb);
  width: 84px;
  box-shadow: 0 0 13px #d70b1757,0 0 20px #5ec2e829;
}

.package-description {
  color: #9da4b2;
  max-width: none;
  min-height: 44px;
  margin: 0 0 18px;
  font-size: 13px;
  line-height: 1.55;
}

.featured .package-description {
  max-width: 380px;
  min-height: 0;
  font-size: 15px;
}

.package-price {
  border: 1px solid #ffffff21;
  border-left: 3px solid var(--card-accent);
  background: linear-gradient(105deg, var(--card-glow), #ffffff09);
  border-radius: 11px;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
  width: 100%;
  min-height: 98px;
  padding: 14px 17px 15px;
  display: flex;
  position: relative;
  overflow: hidden;
  box-shadow: inset 0 1px #ffffff0f,0 12px 28px #00000029;
}

.package-price:after {
  content: "";
  background: var(--card-glow);
  filter: blur(22px);
  border-radius: 50%;
  width: 105px;
  height: 105px;
  position: absolute;
  top: -36px;
  right: -28px;
}

.package-price strong {
  z-index: 1;
  color: #fff;
  letter-spacing: -.04em;
  font-size: 46px;
  font-style: italic;
  line-height: 1;
  position: relative;
}

.package-price small {
  z-index: 1;
  color: #a1a7b4;
  letter-spacing: .1em;
  text-transform: uppercase;
  font-size: 10px;
  font-weight: 800;
  position: relative;
}

.includes-label {
  color: #7f8796;
  letter-spacing: .14em;
  text-transform: uppercase;
  font-size: 9px;
  font-weight: 900;
}

.package-card ul {
  gap: 12px;
  margin: 10px 0 25px;
  padding: 0;
  list-style: none;
  display: grid;
}

.featured ul {
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 14px 22px;
  margin-top: 10px;
}

.package-card li {
  color: #b8bdc8;
  align-items: flex-start;
  gap: 9px;
  font-size: 13px;
  line-height: 1.5;
  display: flex;
}

.package-card li .glyph {
  background: var(--card-glow);
  width: 18px;
  height: 18px;
  color: var(--card-accent);
  border: 1px solid #ffffff14;
  border-radius: 50%;
  flex: none;
  margin-top: 1px;
  font-size: 11px;
}

.package-cta {
  color: #fff;
  letter-spacing: .01em;
  background: linear-gradient(105deg,#e31320,#a80711);
  border: 1px solid #ff5a63b8;
  border-radius: 10px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 50px;
  margin-top: auto;
  font-size: 13px;
  font-weight: 900;
  transition: border-color .16s,background .16s,box-shadow .16s,transform .16s;
  display: inline-flex;
  box-shadow: inset 0 1px #ffffff29,0 12px 28px #d70b1733;
}

.package-cta:hover,.package-cta:focus-visible {
  background: linear-gradient(105deg,#f01825,#b30913);
  border-color: #ffa0a5e6;
  transform: translateY(-2px);
  box-shadow: inset 0 1px #fff3,0 15px 34px #d70b1747;
}

.package-cta .glyph {
  color: #fff;
  transition: transform .16s;
}

.package-cta:hover .glyph,.package-cta:focus-visible .glyph {
  transform: translate(3px);
}
