.compare-page { --cp-ink: #10100f; --cp-paper: #f3f0e8; --cp-lime: #d8ff39; --cp-orange: #ff5c35; min-height: 100vh; overflow-x: clip; background: var(--cp-paper); color: var(--cp-ink); font-family: Arial, Helvetica, sans-serif; }
.compare-page *, .compare-page *::before, .compare-page *::after { box-sizing: border-box; }
.compare-topline { min-height: 36px; padding: 7px 4vw; display: flex; justify-content: space-between; align-items: center; background: var(--cp-lime); border-bottom: 1px solid var(--cp-ink); font-size: 8px; font-weight: 900; letter-spacing: .13em; }
.compare-topline a { border-bottom: 1px solid; }
.compare-header { min-height: 82px; padding: 0 4vw; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; position: sticky; z-index: 20; top: 0; background: rgba(243,240,232,.94); border-bottom: 1px solid rgba(16,16,15,.18); backdrop-filter: blur(14px); }
.compare-brand { display: inline-flex; align-items: center; gap: 10px; width: fit-content; font-size: 17px; letter-spacing: -.04em; }
.compare-brand b { width: 35px; height: 35px; display: grid; place-items: center; background: var(--cp-ink); color: var(--cp-lime); border-radius: 50%; font-size: 10px; transform: rotate(-7deg); }
.compare-header nav { display: flex; gap: 32px; font-size: 10px; font-weight: 800; }
.compare-header nav a:hover { opacity: .55; }
.compare-cta { justify-self: end; padding: 13px 16px; background: var(--cp-ink); color: #fff; font-size: 9px; font-weight: 900; }
.compare-cta span { margin-left: 25px; color: var(--cp-lime); }
.compare-hero { padding: 100px 7vw 115px; background: var(--cp-ink); color: #fff; }
.compare-hero > p { margin: 0 0 30px; color: var(--cp-lime); font-size: 9px; font-weight: 900; letter-spacing: .18em; text-transform: uppercase; }
.compare-hero h1 { max-width: 1150px; margin: 0; font-size: clamp(65px, 9vw, 132px); line-height: .78; letter-spacing: -.085em; }
.compare-hero h1 em { color: var(--cp-orange); font-family: Georgia, serif; font-weight: 400; }
.compare-hero > div { max-width: 800px; margin: 58px 0 0 auto; display: grid; grid-template-columns: 1fr auto; gap: 45px; align-items: end; }
.compare-hero > div p { margin: 0; color: #aaa89f; font-size: 15px; line-height: 1.7; }
.compare-hero > div a { padding-bottom: 5px; border-bottom: 1px solid var(--cp-lime); color: var(--cp-lime); font-size: 9px; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; white-space: nowrap; }
.compare-standout { padding: 100px 5vw 120px; }
.compare-intro { max-width: 850px; }
.compare-intro > p, .provider-heading > p, .compare-method > div > p { margin: 0 0 20px; color: #b6381e; font-size: 9px; font-weight: 900; letter-spacing: .17em; text-transform: uppercase; }
.compare-intro h2, .provider-heading h2, .compare-method h2 { margin: 0; font-size: clamp(48px, 6vw, 84px); line-height: .88; letter-spacing: -.07em; }
.compare-intro > span, .provider-heading > span { max-width: 670px; margin-top: 26px; display: block; color: #706f68; font-size: 12px; line-height: 1.65; }
.standout-grid { margin-top: 65px; display: grid; grid-template-columns: repeat(4,1fr); border-top: 1px solid var(--cp-ink); border-left: 1px solid var(--cp-ink); }
.standout-grid article { min-height: 330px; padding: 25px; display: flex; flex-direction: column; border-right: 1px solid var(--cp-ink); border-bottom: 1px solid var(--cp-ink); }
.standout-grid article:nth-child(3) { background: var(--cp-lime); }
.standout-grid b { color: #b6381e; font-size: 9px; }
.standout-grid h3 { margin: auto 0 18px; font-size: 25px; line-height: .95; letter-spacing: -.055em; }
.standout-grid p { margin: 0; color: #65635d; font-size: 11px; line-height: 1.6; }
.provider-section { padding: 120px 5vw; background: #fffdf8; }
.provider-heading { display: grid; grid-template-columns: 1fr .8fr; column-gap: 8vw; }
.provider-heading > p { grid-column: 1 / -1; }
.provider-heading h2 em { color: var(--cp-orange); font-family: Georgia, serif; font-weight: 400; }
.provider-heading > span { margin-top: 0; align-self: end; }
.provider-list { margin-top: 70px; border-top: 1px solid var(--cp-ink); }
.provider-row { padding: 23px 18px; display: grid; grid-template-columns: .72fr 1.15fr 1fr 1.2fr; gap: 25px; align-items: start; border-bottom: 1px solid rgba(16,16,15,.18); }
.provider-head { padding-top: 13px; padding-bottom: 13px; color: #77766f; font-size: 8px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.provider-row > span:first-child a { font-size: 15px; font-weight: 900; letter-spacing: -.03em; border-bottom: 1px solid; }
.provider-row small { margin-top: 7px; display: block; color: #4c6400; font-size: 8px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.provider-row p { margin: 0; color: #62615b; font-size: 11px; line-height: 1.55; }
.provider-row p strong { color: var(--cp-ink); }
.provider-ours { margin-top: -1px; background: var(--cp-lime); border: 1px solid var(--cp-ink); }
.nearcut-focus { padding: 100px 7vw; display: grid; grid-template-columns: .8fr 1.2fr; gap: 10vw; background: #6d4aff; color: #fff; }
.nearcut-focus > div:first-child p { margin: 0 0 20px; color: var(--cp-lime); font-size: 9px; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; }
.nearcut-focus h2 { margin: 0; font-size: clamp(70px, 9vw, 130px); line-height: .75; letter-spacing: -.09em; }
.nearcut-focus > div:last-child p { margin: 0 0 20px; color: #e1dcff; font-size: 15px; line-height: 1.7; }
.nearcut-focus .nearcut-note { padding-left: 14px; border-left: 3px solid var(--cp-orange); color: #d5cff7; font-size: 10px; }
.nearcut-focus a { margin-top: 17px; padding: 16px 18px; display: inline-flex; gap: 40px; background: var(--cp-lime); color: var(--cp-ink); font-size: 9px; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.booking-section { background: var(--cp-paper); }
.booking-grid { margin-top: 70px; display: grid; grid-template-columns: repeat(2,1fr); gap: 18px; }
.booking-grid article { padding: 32px; display: grid; grid-template-columns: 1fr 1fr; gap: 25px; background: #fffdf8; border: 1px solid var(--cp-ink); box-shadow: 7px 7px 0 rgba(16,16,15,.1); }
.booking-grid article > span { color: var(--cp-orange); font-size: 9px; font-weight: 900; }
.booking-grid h3 { margin: 0; justify-self: end; font-size: 28px; letter-spacing: -.055em; }
.booking-strength { grid-column: 1 / -1; min-height: 80px; margin: 25px 0 0; font-size: 15px; font-weight: 750; line-height: 1.45; }
.booking-grid article > div { padding-top: 20px; border-top: 1px solid rgba(16,16,15,.18); }
.booking-grid small { color: #77766f; font-size: 8px; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.booking-grid article > div p { margin: 12px 0 0; color: #66645f; font-size: 10px; line-height: 1.6; }
.booking-grid article > a { grid-column: 1 / -1; margin-top: 12px; padding-top: 16px; display: flex; justify-content: space-between; border-top: 1px solid var(--cp-ink); font-size: 9px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.compare-method { padding: 120px 7vw; display: grid; grid-template-columns: .8fr 1.2fr; gap: 9vw; background: var(--cp-ink); color: #fff; }
.compare-method > div > p { color: var(--cp-lime); }
.compare-method ul { margin: 0; padding: 0; list-style: none; border-top: 1px solid #4d4d47; }
.compare-method li { padding: 18px 0; border-bottom: 1px solid #363631; color: #aaa89f; font-size: 11px; line-height: 1.55; }
.compare-method li b { color: #fff; }
.compare-independence { grid-column: 2; margin: 0; color: #73716a; font-size: 9px; line-height: 1.6; }
.compare-final { padding: 120px 5vw; text-align: center; background: var(--cp-orange); }
.compare-final > p { margin: 0 0 25px; font-size: 9px; font-weight: 900; letter-spacing: .18em; text-transform: uppercase; }
.compare-final h2 { margin: 0 0 45px; font-size: clamp(65px, 9vw, 125px); line-height: .77; letter-spacing: -.085em; }
.compare-final h2 em { color: #fff; font-family: Georgia, serif; font-weight: 400; }
.compare-final > div { display: flex; justify-content: center; gap: 15px; }
.compare-final > div a { padding: 17px 20px; min-width: 250px; display: flex; justify-content: space-between; background: var(--cp-ink); color: #fff; font-size: 9px; font-weight: 900; letter-spacing: .09em; }
.compare-final > div a:first-child { background: #fffdf8; color: var(--cp-ink); }
.compare-footer { padding: 36px 4vw 92px; display: grid; grid-template-columns: 1fr 1fr auto; gap: 25px; align-items: center; background: var(--cp-ink); color: #fff; }
.compare-footer p { margin: 0; color: #8a8881; font-size: 10px; }
.compare-footer > div { display: flex; gap: 22px; font-size: 9px; }
.compare-footer .compare-brand b { background: var(--cp-lime); color: var(--cp-ink); }

@media (max-width: 1000px) {
  .compare-header { grid-template-columns: 1fr auto; }
  .compare-header nav { display: none; }
  .standout-grid { grid-template-columns: 1fr 1fr; }
  .provider-heading { grid-template-columns: 1fr; gap: 25px; }
  .provider-heading > span { max-width: 760px; }
  .booking-grid { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
  .compare-topline { padding: 8px 14px; font-size: 7px; }
  .compare-header { min-height: 68px; padding: 0 16px; }
  .compare-cta { padding: 11px; }
  .compare-cta span { margin-left: 9px; }
  .compare-hero { padding: 75px 20px 85px; }
  .compare-hero h1 { font-size: 60px; }
  .compare-hero > div { margin-top: 40px; grid-template-columns: 1fr; gap: 25px; }
  .compare-standout, .provider-section { padding: 80px 20px; }
  .compare-intro h2, .provider-heading h2, .compare-method h2 { font-size: 49px; }
  .standout-grid { grid-template-columns: 1fr; }
  .standout-grid article { min-height: 245px; }
  .provider-head { display: none; }
  .provider-row { padding: 24px 14px; grid-template-columns: 1fr; gap: 13px; }
  .provider-row p[data-label]::before { content: attr(data-label) ": "; color: #77766f; font-size: 8px; font-weight: 900; letter-spacing: .07em; text-transform: uppercase; }
  .nearcut-focus { padding: 80px 20px; grid-template-columns: 1fr; gap: 45px; }
  .nearcut-focus h2 { font-size: 80px; }
  .booking-grid article { padding: 24px 18px; grid-template-columns: 1fr; }
  .booking-grid h3 { justify-self: start; }
  .booking-strength, .booking-grid article > a { grid-column: auto; }
  .booking-strength { min-height: 0; margin-top: 5px; }
  .compare-method { padding: 80px 20px; grid-template-columns: 1fr; gap: 50px; }
  .compare-independence { grid-column: auto; }
  .compare-final { padding: 90px 20px; }
  .compare-final h2 { font-size: 58px; }
  .compare-final > div { flex-direction: column; align-items: stretch; }
  .compare-footer { grid-template-columns: 1fr; }
}