/* Extend the existing palette and keep the seven-section navigation readable. */
@media (max-width: 1280px) {
  .site-header { grid-template-columns: 1fr auto; gap: .85rem; }
  .site-tabs { grid-column: 1 / -1; grid-row: 2; justify-self: stretch; display: flex; flex-wrap: wrap; gap: .2rem; }
  .site-tabs button { flex: 1 0 auto; min-height: 44px; }
  .site-header .nav-cta { grid-column: 2; grid-row: 1; }
}
.pricing { position: relative; isolation: isolate; overflow: clip; padding: clamp(2rem, 5vw, 4.5rem) clamp(1.2rem, 5vw, 5rem) 4.5rem; color: var(--white); background: var(--ink); }
.pricing::before { content: ""; position: absolute; inset: 0; z-index: -1; background: rgba(17, 24, 32, .08); pointer-events: none; }
.pricing-opening { text-align: center; }
.pricing-intro { margin: 0 auto; }
.pricing .section-label { margin-bottom: 1.1rem; color: #f4cfbd; font-size: .875rem; }
.pricing h1 { margin: 0 auto 1.6rem; font: 400 clamp(3.3rem, 6.1vw, 5.5rem)/1.04 var(--serif); letter-spacing: -.025em; }
.pricing h1 em { color: var(--white); font-weight: 400; }
.pricing-lead { max-width: 42rem; margin: 0 auto; color: var(--white); font-size: clamp(1.125rem, 1.6vw, 1.375rem); line-height: 1.65; }
.pricing-quote { margin-top: 1.6rem; }
.pricing-quote h2 { margin: 0 0 .8rem; font: 400 clamp(2.75rem, 5vw, 4.5rem)/1.12 var(--serif); letter-spacing: -.015em; text-wrap: balance; }
.pricing-quote p { max-width: 38rem; margin: 0 auto 1.6rem; color: var(--white); font-size: 1.125rem; line-height: 1.6; }
.pricing .button { max-width: 100%; font-size: 1rem; text-align: center; white-space: normal; }
.pricing .button-primary { color: var(--ink); background: #f0c7b3; }
.pricing .button-primary:hover, .pricing .button-primary:focus-visible { background: #fff1e9; }
.pricing .button:focus-visible { outline: 2px solid white; outline-offset: 4px; }
.pricing-photo { position: absolute; inset: 0; z-index: -2; margin: 0; }
.pricing-photo img { position: sticky; top: 0; display: block; width: 100%; height: 100vh; height: 100svh; object-fit: cover; object-position: center 65%; }
.pricing-photo figcaption { position: absolute; right: 1rem; bottom: 1rem; max-width: calc(100% - 2rem); padding: .4rem .7rem; border-radius: .3rem; background: rgba(17, 24, 32, .86); color: var(--white); font: 400 .875rem/1.4 var(--sans); }
.pricing-intro, .pricing-details, .pricing-next { max-width: 70rem; padding: clamp(1.5rem, 3.5vw, 3rem); border: 1px solid rgba(255, 255, 255, .32); border-radius: .8rem; background: rgba(42, 47, 50, .66); backdrop-filter: blur(5px); }
.pricing-details { margin: clamp(2.5rem, 5vw, 4rem) auto 0; }
.pricing-details-intro { text-align: center; }
.pricing-details h2, .pricing-next h2 { margin: 0 0 1rem; font: 700 clamp(1.65rem, 2.4vw, 2.15rem)/1.3 Georgia, serif; letter-spacing: -.015em; }
.pricing-details-intro > p:last-child { margin: 0 auto 2rem; color: var(--white); font-size: clamp(1.125rem, 1.6vw, 1.375rem); line-height: 1.6; }
.pricing-factors { font-size: clamp(1.125rem, 1.7vw, 1.5rem); }
.pricing-factors article { position: relative; padding: 0 0 0 1.4rem; line-height: 1.6; }
.pricing-factors article + article { margin-top: 1.6rem; }
.pricing-factors article::before { content: ""; position: absolute; top: .67em; left: 0; width: .3em; height: .3em; border-radius: 50%; background: var(--white); }
.pricing-factors h3 { display: inline; margin: 0; font: 700 1em/1.6 var(--sans); }
.pricing-factors h3::after { content: " — "; font-weight: 400; }
.pricing-factors p { display: inline; margin: 0; color: var(--white); line-height: 1.6; }
.pricing-next { margin: 2.75rem auto 0; text-align: center; }
.pricing-next p { max-width: 45rem; margin: 0 auto 1.75rem; color: var(--white); font-size: clamp(1.125rem, 1.7vw, 1.5rem); line-height: 1.6; }
.pricing-next .button-primary { padding: 1rem 1.7rem; border-radius: .65rem; background: var(--white); color: var(--ink); font-size: clamp(1.125rem, 1.6vw, 1.375rem); }
.pricing-next .button-primary:hover, .pricing-next .button-primary:focus-visible { background: #f0c7b3; }
@media (max-width: 480px) {
  .pricing { padding-right: 1rem; padding-left: 1rem; }
  .pricing-intro, .pricing-details, .pricing-next { padding: 1.5rem 1.15rem; }
  .pricing h1 { font-size: clamp(2.6rem, 11vw, 3.3rem); }
  .pricing-factors h3 { display: block; }
  .pricing-factors h3::after { content: none; }
}
