.sales-page { background: #f7f7f5; }
.sales-header { position: sticky; top: 0; z-index: 50; display: flex; align-items: center; justify-content: space-between; height: 76px; padding: 0 5vw; background: rgba(247,247,245,.92); border-bottom: 1px solid var(--line); backdrop-filter: blur(14px); }
.sales-header nav { display: flex; align-items: center; gap: clamp(1.2rem,2.5vw,3rem); font-size: .72rem; }
.header-cta { padding: 11px 14px; border-radius: 7px; color: white; background: var(--dark); }
.sales-kicker { margin: 0 0 1.5rem; color: #818487; font-size: .65rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; }

.sales-hero { display: grid; grid-template-columns: 1.05fr .95fr; min-height: 700px; margin: 0 5vw 5vw; overflow: hidden; background: #edeef0; border-radius: 22px; }
.sales-hero-copy { display: flex; flex-direction: column; justify-content: center; padding: clamp(3rem,6vw,7rem); }
.sales-hero h1 { max-width: 880px; margin: 0; font-size: clamp(4.3rem,7.2vw,8.4rem); font-weight: 600; letter-spacing: -.09em; line-height: .8; }
.sales-hero h1 span { display: block; color: #a1a4a7; }
.sales-lead { max-width: 650px; margin: 2rem 0 0; color: #5e6164; font-size: 1rem; line-height: 1.6; }
.hero-credibility { margin: 1.2rem 0 0; color: #777a7d; font-size: .68rem; letter-spacing: .02em; }
.sales-actions { display: flex; gap: .6rem; margin-top: 2rem; }
.hero-facts { display: grid; grid-template-columns: repeat(3,auto); justify-content: start; gap: clamp(1.8rem,4vw,4.5rem); margin-top: auto; padding-top: 3rem; }
.hero-facts div { display: flex; flex-direction: column; }
.hero-facts strong { font-size: 1.9rem; font-weight: 500; letter-spacing: -.06em; }
.hero-facts span { color: #777a7d; font-size: .67rem; }
.hero-product { position: relative; display: flex; align-items: center; justify-content: center; min-height: 700px; padding: 4vw; background: #dfe1e3; }
.browser-frame { width: 100%; max-width: 620px; overflow: hidden; background: white; border: 1px solid #c9cbcd; border-radius: 12px; box-shadow: 0 35px 80px rgba(20,22,24,.16); transform: rotate(1.5deg); }
.browser-bar { display: flex; align-items: center; gap: 6px; height: 38px; padding: 0 12px; background: #f2f2f2; border-bottom: 1px solid #dedede; }
.browser-bar i { width: 7px; height: 7px; border-radius: 50%; background: #bebfc1; }
.browser-bar span { margin-left: auto; margin-right: auto; color: #929497; font-size: .55rem; }
.browser-content { min-height: 440px; padding: 55px 42px; background-image: linear-gradient(rgba(0,0,0,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.035) 1px,transparent 1px); background-size: 25% 25%; }
.browser-content small { color: #8b8d90; font-size: .58rem; text-transform: uppercase; }
.browser-content h2 { max-width: 480px; margin: 1.5rem 0 0; font-size: clamp(2.7rem,4vw,4.5rem); font-weight: 500; letter-spacing: -.075em; line-height: .9; }
.browser-buttons { display: flex; gap: 8px; margin-top: 2rem; }
.browser-buttons b { width: 95px; height: 30px; background: #1c1d20; border-radius: 5px; }
.browser-buttons b + b { width: 70px; background: #ddd; }
.browser-cards { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; margin-top: 4rem; }
.browser-cards i { height: 95px; border: 1px solid #ddd; background: rgba(255,255,255,.7); }
.floating-proof { position: absolute; right: 2vw; bottom: 2vw; width: min(330px,80%); padding: 20px 65px 20px 20px; color: white; background: rgba(24,25,28,.88); border-radius: 17px; backdrop-filter: blur(14px); }
.floating-proof span { color: rgba(255,255,255,.45); font-size: .63rem; }
.floating-proof strong { display: block; margin-top: 8px; font-size: .95rem; font-weight: 500; line-height: 1.35; }
.floating-proof a { position: absolute; right: 17px; bottom: 17px; display: grid; width: 36px; height: 36px; place-items: center; color: var(--dark); background: white; border-radius: 9px; }

.tension, .assets-section, .authority { display: grid; grid-template-columns: .35fr 1.65fr; gap: 5vw; padding: clamp(6rem,10vw,10rem) 7vw; background: white; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.side-label { font-size: .7rem; font-weight: 600; }
.tension h2, .assets-section h2, .authority h2 { max-width: 1150px; margin: 0; font-size: clamp(3.3rem,6vw,7rem); font-weight: 500; letter-spacing: -.08em; line-height: .9; }
.tension div > p, .authority div > p:last-child { max-width: 680px; margin: 2.5rem 0 0 auto; color: #64676a; font-size: .93rem; line-height: 1.65; }
.section-wrap { padding: clamp(6rem,10vw,10rem) 7vw; }
.section-intro { display: grid; grid-template-columns: 1.35fr .65fr; gap: 5vw; align-items: end; margin-bottom: 4rem; }
.section-intro .sales-kicker { grid-column: 1 / -1; margin-bottom: 0; }
.section-intro h2 { max-width: 1000px; margin: 0; font-size: clamp(3.4rem,6vw,7rem); font-weight: 500; letter-spacing: -.08em; line-height: .9; }
.section-intro > p:last-child { margin: 0; color: #66696c; font-size: .86rem; line-height: 1.6; }
.opportunity { background: #f7f7f5; }
.opportunity-grid { display: grid; grid-template-columns: repeat(3,1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.opportunity-grid article { display: flex; flex-direction: column; min-height: 275px; padding: 18px; background: #fff; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.opportunity-grid span, .offer-ladder-grid span { color: var(--muted); font-size: .65rem; letter-spacing: .05em; }
.opportunity-grid h3 { margin: auto 0 0; max-width: 330px; font-size: clamp(1.6rem,2.5vw,2.6rem); font-weight: 500; letter-spacing: -.06em; line-height: .95; }
.opportunity-grid p { max-width: 350px; margin: .8rem 0 0; color: #6d7073; font-size: .76rem; line-height: 1.5; }
.result-grid { display: grid; grid-template-columns: repeat(4,1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.result-grid article { display: flex; flex-direction: column; min-height: 310px; padding: 18px; background: white; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.result-grid span { color: var(--muted); font-size: .65rem; }
.result-grid h3 { margin: auto 0 0; font-size: 1.75rem; font-weight: 500; letter-spacing: -.055em; }
.result-grid p { margin: 1rem 0 0; color: #6d7073; font-size: .75rem; line-height: 1.5; }
.showcase-heading { display: grid; grid-template-columns: 1.2fr .8fr; gap: 5vw; align-items: end; margin: clamp(6rem,9vw,9rem) 0 2.5rem; }
.showcase-heading .sales-kicker { grid-column: 1 / -1; margin-bottom: -.5rem; }
.showcase-heading h3 { max-width: 850px; margin: 0; font-size: clamp(2.7rem,4.6vw,5.2rem); font-weight: 500; letter-spacing: -.075em; line-height: .92; }
.showcase-heading > p:last-child { max-width: 480px; margin: 0; color: #6d7073; font-size: .8rem; line-height: 1.6; }
.website-showcase { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; }
.website-concept { --concept-bg: #ecf0ed; --concept-ink: #182420; position: relative; min-height: 620px; overflow: hidden; color: var(--concept-ink); background: var(--concept-bg); border: 1px solid rgba(0,0,0,.08); border-radius: 13px; box-shadow: 0 22px 50px rgba(15,17,18,.06); }
.website-concept > img { position: absolute; top: 55px; left: 0; width: 100%; height: 45%; object-fit: cover; transition: transform 600ms cubic-bezier(.2,.75,.25,1); }
.website-concept:hover > img { transform: scale(1.025); }
.concept-shade { display: none; }
.concept-nav { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 8px; height: 55px; padding: 0 20px; background: var(--concept-bg); }
.concept-nav strong { font-size: .9rem; letter-spacing: -.04em; }
.concept-nav strong span { color: #688e78; }
.concept-nav > span { font-size: .49rem; letter-spacing: .08em; text-transform: uppercase; }
.concept-nav i { justify-self: end; padding: 7px 10px; font-size: .48rem; font-style: normal; text-transform: uppercase; border: 1px solid currentColor; border-radius: 999px; }
.concept-copy { position: absolute; right: 0; bottom: 0; left: 0; display: flex; flex-direction: column; min-height: 42%; padding: 24px 24px 35px; background: var(--concept-bg); }
.concept-copy small { display: block; margin-bottom: .8rem; color: currentColor; font-size: .52rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; opacity: .55; }
.concept-copy h4 { max-width: 460px; margin: 0; font-size: clamp(2rem,2.45vw,2.85rem); font-weight: 500; letter-spacing: -.072em; line-height: .95; }
.concept-copy p { max-width: 310px; margin: .85rem 0 1rem; font-size: .65rem; line-height: 1.5; opacity: .7; }
.concept-cta { display: inline-flex; align-items: center; gap: 18px; width: max-content; margin-top: auto; padding: 8px 8px 8px 13px; color: white; background: var(--concept-ink); border-radius: 999px; font-size: .58rem; font-weight: 600; }
.concept-cta b { display: grid; width: 23px; height: 23px; place-items: center; color: var(--concept-ink); background: var(--concept-bg); border-radius: 50%; }
.concept-tag { position: absolute; right: 20px; bottom: 17px; font-size: .45rem; letter-spacing: .05em; text-transform: uppercase; opacity: .45; }
.concept-dental > img { object-position: center 43%; }
.concept-aesthetic { --concept-bg: #eee7e0; --concept-ink: #302722; }
.concept-aesthetic > img { object-position: center 42%; }
.concept-physio { --concept-bg: #18232c; --concept-ink: #f2f5f7; }
.concept-physio > img { object-position: center 55%; }
.concept-physio .concept-nav strong span { color: #8db7db; }
.concept-physio .concept-cta { color: #18232c; background: #e7eef3; }
.concept-physio .concept-cta b { color: #e7eef3; background: #18232c; }

.method { padding: clamp(6rem,10vw,10rem) 7vw; color: white; background: var(--dark); }
.method-title { display: grid; grid-template-columns: .35fr 1.65fr; gap: 5vw; margin-bottom: 5rem; }
.method-title h2 { max-width: 1050px; margin: 0; font-size: clamp(3.5rem,6vw,7rem); font-weight: 500; letter-spacing: -.08em; line-height: .88; }
.method-steps article { display: grid; grid-template-columns: .2fr 1.5fr .3fr; gap: 2rem; align-items: center; min-height: 150px; border-top: 1px solid rgba(255,255,255,.16); }
.method-steps article:last-child { border-bottom: 1px solid rgba(255,255,255,.16); }
.method-steps > article > span, .method-steps small { color: rgba(255,255,255,.38); font-size: .65rem; }
.method-steps h3 { margin: 0; font-size: clamp(2rem,3.5vw,4rem); font-weight: 500; letter-spacing: -.065em; }
.method-steps p { margin: .5rem 0 0; color: rgba(255,255,255,.55); font-size: .75rem; }
.method-steps small { text-align: right; text-transform: uppercase; }
.method-note { max-width: 560px; margin: 2.5rem 0 0 auto; color: rgba(255,255,255,.58); font-size: .78rem; line-height: 1.6; }

.module-list { border-top: 1px solid var(--line); }
.module-list article { display: grid; grid-template-columns: .16fr 1.5fr .34fr; gap: 2rem; align-items: center; min-height: 135px; border-bottom: 1px solid var(--line); }
.module-list > article > span, .module-list b { color: var(--muted); font-size: .65rem; font-weight: 500; }
.module-list h3 { margin: 0; font-size: clamp(1.55rem,2.5vw,2.8rem); font-weight: 500; letter-spacing: -.055em; }
.module-list p { max-width: 750px; margin: .5rem 0 0; color: #6d7073; font-size: .75rem; line-height: 1.5; }
.module-list b { text-align: right; text-transform: uppercase; }

.asset-grid { display: grid; grid-template-columns: repeat(3,1fr); margin-top: 4rem; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.asset-grid article { min-height: 220px; padding: 17px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.asset-grid span { color: var(--muted); font-size: .65rem; }
.asset-grid h3 { margin: 5rem 0 0; font-size: 1.35rem; font-weight: 500; letter-spacing: -.045em; }
.asset-grid p { margin: .8rem 0 0; color: #6b6e71; font-size: .72rem; line-height: 1.5; }

.offer-ladder { background: #fff; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.offer-ladder-grid { display: grid; grid-template-columns: repeat(4,1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.offer-ladder-grid article { display: flex; flex-direction: column; min-height: 300px; padding: 18px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.offer-ladder-grid article.is-current { color: white; background: var(--dark); border-color: rgba(255,255,255,.2); }
.offer-ladder-grid article.is-current span, .offer-ladder-grid article.is-current p { color: rgba(255,255,255,.55); }
.offer-ladder-grid h3 { margin: auto 0 0; font-size: clamp(1.45rem,2.2vw,2.25rem); font-weight: 500; letter-spacing: -.055em; line-height: .98; }
.offer-ladder-grid p { margin: .9rem 0 0; color: #6d7073; font-size: .75rem; line-height: 1.5; }
.offer-ladder-grid a { display: inline-block; width: max-content; margin-top: auto; padding-top: 1.5rem; color: inherit; font-size: .7rem; font-weight: 600; }
.offer-ladder-grid small { margin-top: auto; padding-top: 1.5rem; color: #777a7d; font-size: .65rem; line-height: 1.45; }

.fit { display: grid; grid-template-columns: 1.15fr .85fr; gap: 8vw; align-items: center; }
.fit-copy h2 { max-width: 830px; margin: 0; font-size: clamp(3.3rem,5.6vw,6.4rem); font-weight: 500; letter-spacing: -.08em; line-height: .9; }
.fit-copy > p:last-child { max-width: 650px; margin: 2rem 0 0; color: #66696c; font-size: .86rem; line-height: 1.6; }
.fit-checklist { border-top: 1px solid var(--line); }
.fit-checklist label { display: flex; align-items: center; gap: .8rem; min-height: 70px; padding: 10px; border-bottom: 1px solid var(--line); font-size: .76rem; cursor: pointer; }
.fit-checklist input { width: 17px; height: 17px; accent-color: var(--dark); }
.fit-checklist p { color: #777a7d; font-size: .7rem; line-height: 1.5; }
.fit-checklist p.ready { color: #137a37; }

.authority { background: #edeef0; }
.authority-number { align-self: start; font-size: clamp(5rem,10vw,12rem); font-weight: 700; letter-spacing: -.12em; line-height: .7; }
.authority-story { max-width: 680px; margin: 2rem 0 0 auto; color: #64676a; font-size: .93rem; line-height: 1.65; }
.authority-story p { margin: 0 0 1rem; }
.text-link { display: inline-block; margin: 1rem 0 0; color: var(--dark); font-size: .72rem; font-weight: 600; }
.faq-list { border-top: 1px solid var(--line); }
.faq-list details { border-bottom: 1px solid var(--line); }
.faq-list summary { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: 1.6rem 0; font-size: 1rem; font-weight: 500; cursor: pointer; list-style: none; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary span { font-size: 1.4rem; font-weight: 400; transition: transform 160ms ease; }
.faq-list details[open] summary span { transform: rotate(45deg); }
.faq-list details p { max-width: 760px; margin: 0; padding: 0 0 1.8rem; color: #686b6e; font-size: .82rem; line-height: 1.65; }

.checkout { display: grid; grid-template-columns: 1.2fr .8fr; gap: 8vw; margin: 0 5vw 5vw; padding: clamp(4rem,8vw,8rem); color: white; background: var(--dark); border-radius: 22px; }
.checkout-copy h2 { max-width: 850px; margin: 0; font-size: clamp(3.8rem,6.5vw,7.5rem); font-weight: 500; letter-spacing: -.085em; line-height: .85; }
.checkout-copy > p:last-child { max-width: 600px; margin: 2rem 0 0; color: rgba(255,255,255,.58); font-size: .88rem; line-height: 1.6; }
.price-card { position: relative; align-self: center; padding: 28px; overflow: hidden; color: var(--dark); background: white; border-radius: 16px; }
.price-card > span { color: #777a7d; font-size: .68rem; }
.price { display: flex; align-items: flex-start; margin-top: 1rem; }
.price strong { font-size: clamp(5rem,8vw,8rem); font-weight: 600; letter-spacing: -.1em; line-height: .8; }
.price sup { margin: .3rem 0 0 .5rem; font-size: 1.5rem; }
.price-card ul { margin: 2.5rem 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.price-card li { padding: 12px 0; border-bottom: 1px solid var(--line); font-size: .75rem; }
.stripe-button { display: flex; align-items: center; justify-content: space-between; padding: 16px; color: white; background: var(--dark); border-radius: 8px; font-size: .75rem; font-weight: 600; }
.stripe-button:disabled { width: 100%; border: 0; font-family: inherit; cursor: not-allowed; }
.price-card.is-locked > :not(.checkout-lock) { filter: blur(1.3px); opacity: .67; }
.checkout-lock { position: absolute; inset: 0; z-index: 2; display: grid; place-items: center; padding: 24px; background: linear-gradient(155deg, rgba(255,255,255,.22) 0%, rgba(242,243,243,.78) 48%, rgba(232,234,235,.94) 100%); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); text-align: center; }
.checkout-lock-content { display: flex; flex-direction: column; align-items: center; width: min(340px,100%); padding: 28px 24px; border: 1px solid rgba(255,255,255,.7); border-radius: 14px; background: rgba(255,255,255,.84); box-shadow: 0 18px 50px rgba(25,27,29,.1); }
.checkout-lock svg { width: 34px; height: 34px; margin-bottom: 25px; }
.checkout-lock span { color: #777d80; font-size: .59rem; font-weight: 700; letter-spacing: .11em; }
.checkout-lock strong { max-width: 280px; margin-top: 12px; font-size: clamp(1.65rem,2.25vw,2.35rem); font-weight: 550; letter-spacing: -.065em; line-height: 1.03; }
.checkout-lock p { max-width: 280px; margin: 14px 0 0; color: #73797c; font-size: .73rem; line-height: 1.5; }
.price-card small { display: block; margin-top: 1rem; color: #85878a; font-size: .62rem; text-align: center; }
.checkout-status { min-height: 1em; margin: .8rem 0 0; color: #6c5a14; font-size: .68rem; text-align: center; }
.sales-footer { display: grid; grid-template-columns: 1fr 1fr auto; gap: 2rem; align-items: end; padding: 3rem 5vw; border-top: 1px solid var(--line); }
.sales-footer p, .sales-footer > a:last-child { margin: 0; color: var(--muted); font-size: .7rem; }

@media (max-width: 1000px) {
  .sales-hero { grid-template-columns: 1fr; }
  .hero-product { min-height: 650px; }
  .result-grid { grid-template-columns: repeat(2,1fr); }
  .opportunity-grid, .offer-ladder-grid { grid-template-columns: repeat(2,1fr); }
  .website-showcase { grid-template-columns: 1fr; }
  .website-concept { min-height: 620px; }
  .fit, .checkout { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
  .sales-header { height: 68px; padding: 0 20px; }
  .sales-header nav > a:not(.header-cta) { display: none; }
  .sales-hero { margin: 0 14px 3rem; border-radius: 18px; }
  .sales-hero-copy { padding: 4rem 22px; }
  .sales-hero h1 { font-size: 4.05rem; }
  .sales-actions { align-items: flex-start; flex-direction: column; }
  .hero-facts { justify-content: space-between; gap: .8rem; }
  .hero-product { min-height: 520px; padding: 20px; }
  .browser-content { min-height: 380px; padding: 45px 24px; }
  .floating-proof { right: 14px; bottom: 14px; }
  .tension, .assets-section, .authority, .method-title { grid-template-columns: 1fr; gap: 2.5rem; }
  .tension, .assets-section, .authority { padding: 5rem 20px; }
  .section-wrap, .method { padding-right: 20px; padding-left: 20px; }
  .section-intro { grid-template-columns: 1fr; gap: 2rem; }
  .result-grid, .asset-grid, .opportunity-grid, .offer-ladder-grid { grid-template-columns: 1fr; }
  .showcase-heading { grid-template-columns: 1fr; gap: 1.5rem; margin-top: 5rem; }
  .website-concept { min-height: 560px; }
  .concept-nav { padding: 0 16px; }
  .concept-nav > span { display: none; }
  .concept-nav { grid-template-columns: 1fr auto; }
  .concept-copy { right: 0; bottom: 0; left: 0; padding: 22px 18px 35px; }
  .concept-copy h4 { font-size: 2.5rem; }
  .method-steps article { grid-template-columns: .18fr 1fr; padding: 1.5rem 0; }
  .method-steps small { display: none; }
  .module-list article { grid-template-columns: .15fr 1fr; padding: 1.5rem 0; }
  .module-list b { display: none; }
  .checkout { grid-template-columns: 1fr; margin: 0 14px 3rem; padding: 4rem 22px; border-radius: 18px; }
  .checkout-copy h2 { font-size: 3.7rem; }
  .sales-footer { grid-template-columns: 1fr; padding: 2.5rem 20px; }
}