/* Shared pricing and service pages. All component classes are independent of home. */
.services-page { overflow-wrap: anywhere; }
.services-page main { min-width: 0; }
.services-page .button { white-space: normal; }
.svc-kicker { display: inline-block; margin-bottom: 24px; color: var(--ink); font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .12em; }
.svc-kicker::before { content: ''; display: inline-block; width: 8px; height: 8px; margin-right: 10px; background: var(--brand-accent); border-radius: 50%; }
a.svc-kicker:hover { text-decoration: underline; text-underline-offset: 5px; }
.svc-hero { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); align-items: center; gap: clamp(32px, 5vw, 88px); padding-block: clamp(56px, 7vw, 112px) 64px; }
.svc-hero h1 { font-size: clamp(48px, 5.7vw, 88px); line-height: 1.03; letter-spacing: -.055em; }
.svc-intro-line { max-width: 660px; margin-top: 28px; font-size: clamp(18px, 1.8vw, 24px); line-height: 1.5; }
.svc-actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 32px; }
.svc-visual { position: relative; display: grid; place-items: center; min-width: 0; aspect-ratio: 1; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.svc-film { overflow: hidden; }
.svc-film video { display: block; position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.svc-sample { position: absolute; z-index: 1; top: 18px; right: 18px; max-width: calc(100% - 36px); padding: 7px 11px; border: 1px solid var(--line); border-radius: 4px; background: var(--bg); color: var(--ink); font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; }
.svc-search-stage { padding: 76px 32px 40px; background: var(--brand-film-bg); }
.svc-search-result { width: 100%; padding: clamp(20px, 2.5vw, 38px); border: 1px solid var(--line); border-radius: 10px; background: var(--bg); color: var(--ink); box-shadow: 0 18px 50px var(--brand-shadow-heavy); }
.svc-search-result .svc-sponsored { font-size: 11px; text-transform: uppercase; letter-spacing: .09em; }
.svc-search-result .svc-search-name { margin-top: 10px; color: var(--ink); font-size: 14px; }
.svc-search-result .svc-search-title { margin-top: 24px; font-size: clamp(23px, 2.3vw, 34px); line-height: 1.15; letter-spacing: -.035em; color: var(--ink); }
.svc-search-result p:last-of-type { margin-top: 14px; font-size: 14px; }
.svc-search-call { display: inline-block; margin-top: 24px; padding: 10px 28px; border-radius: 4px; background: var(--brand-accent); color: var(--brand-ink); font-size: 14px; }
.svc-phone-stage { padding: 56px 24px 32px; background: radial-gradient(ellipse at 50% 60%, var(--brand-shader-flow), var(--surface) 70%); }
.svc-phone { position: absolute; top: 56px; left: 50%; height: calc(100% - 84px); width: auto; max-width: 250px; aspect-ratio: 9 / 18.5; transform: translateX(-50%); padding: 6px; border: 1px solid var(--brand-device-edge); border-radius: 28px; background: var(--brand-device); box-shadow: 0 20px 44px var(--brand-shadow-heavy); }
.svc-phone video { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 22px; }
.svc-phone::after { content: ''; position: absolute; top: 10px; left: 36%; width: 28%; height: 6px; border-radius: 8px; background: var(--brand-device); }
.svc-section { margin-block: clamp(72px, 8vw, 120px); }
.svc-section h2 { font-size: clamp(36px, 4.2vw, 64px); line-height: 1.08; }
.svc-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 36px; }
.svc-section-heading > p { max-width: 350px; }
.svc-inclusions, .svc-faq, .svc-addons { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.45fr); gap: clamp(32px, 6vw, 96px); border-top: 1px solid var(--line); padding-top: 32px; }
.svc-feature-list { list-style: none; padding: 0; margin: 0; }
.svc-feature-list li { position: relative; padding: 18px 0 18px 28px; border-bottom: 1px solid var(--line); font-size: clamp(17px, 1.5vw, 21px); line-height: 1.5; }
.svc-feature-list li:first-child { padding-top: 0; }
.svc-feature-list li::before { content: '+'; position: absolute; left: 0; color: var(--brand-accent); font-weight: 600; }
.svc-process { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; list-style: none; counter-reset: svc-step; margin: 0; padding: 0; }
.svc-process li { counter-increment: svc-step; border-top: 1px solid var(--line); padding-top: 20px; }
.svc-process li::before { content: counter(svc-step, decimal-leading-zero); display: block; margin-bottom: 32px; font-size: 13px; font-variant-numeric: tabular-nums; color: var(--muted); }
.svc-process h3 { max-width: 22ch; font-size: clamp(22px, 2.3vw, 30px); line-height: 1.25; }
.svc-website-offer, .svc-monthly-offer { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 48px; padding: clamp(28px, 4vw, 56px); border: 1px solid var(--line); border-radius: 10px; background: var(--raised); }
.svc-website-offer { border-top: 4px solid var(--brand-accent); }
.svc-website-offer h3, .svc-monthly-offer h3 { font-size: clamp(23px, 2.2vw, 30px); line-height: 1.2; }
.svc-price { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px; margin-top: 24px; font-size: clamp(54px, 6.5vw, 96px); line-height: 1.05; letter-spacing: -.055em; font-weight: 550; font-variant-numeric: lining-nums tabular-nums; color: var(--ink); }
.svc-period { font-size: 16px; font-weight: 400; letter-spacing: 0; color: var(--muted); }
.svc-regular { margin-block: 14px 18px; font-size: 14px; }
.svc-regular s { margin-left: 8px; }
.svc-founding > p:first-of-type { margin-top: 22px; }
.svc-founding .svc-preview-note { margin-top: 24px; color: var(--ink); }
.svc-text-link { display: inline-block; padding-block: 12px; margin-top: 16px; font-size: 15px; text-decoration: underline; text-underline-offset: 6px; text-decoration-thickness: 1px; }
.svc-text-link:hover { text-decoration-thickness: 2px; }
.svc-ad-extra { margin-top: 12px; font-size: 15px; }
.svc-monthly-terms > p:first-child { color: var(--ink); }
.svc-monthly-terms p + p { margin-top: 24px; }
.svc-pricing-intro { padding-block: clamp(56px, 8vw, 120px) 0; }
.svc-pricing-intro h1 { max-width: 1100px; font-size: clamp(58px, 10vw, 152px); line-height: 1.04; letter-spacing: -.065em; }
.svc-price-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.svc-price-card { min-width: 0; display: flex; flex-direction: column; align-items: start; padding: clamp(24px, 2.7vw, 38px); border: 1px solid var(--line); border-radius: 10px; }
.svc-price-card h3 { font-size: clamp(23px, 2.1vw, 30px); line-height: 1.2; }
.svc-card-title:hover { text-decoration: underline; text-underline-offset: 5px; }
.svc-price-card .svc-price { margin-top: 28px; font-size: clamp(48px, 4.4vw, 68px); }
.svc-price-card ul { margin: 28px 0 0; padding-left: 18px; font-size: 15px; line-height: 1.65; }
.svc-price-card li + li { margin-top: 12px; }
.svc-price-card li::marker { color: var(--brand-accent); }
.svc-card-description { margin-block: 28px 12px; font-size: 15px; line-height: 1.65; }
.svc-price-card .svc-text-link { margin-top: auto; }
.svc-budget-note { max-width: 780px; margin-top: 28px; font-size: 15px; line-height: 1.65; }
.svc-addons p { font-size: 18px; line-height: 1.6; }
.svc-addons p + p { margin-top: 16px; font-size: 15px; }
.svc-faq-list details { border-bottom: 1px solid var(--line); }
.svc-faq-list summary { position: relative; padding: 24px 36px 24px 0; font-size: 18px; font-weight: 500; line-height: 1.5; cursor: pointer; list-style: none; }
.svc-faq-list summary::-webkit-details-marker { display: none; }
.svc-faq-list summary::after { content: '+'; position: absolute; top: 24px; right: 0; color: var(--muted); font-weight: 400; }
.svc-faq-list details[open] > summary::after { content: '−'; }
.svc-faq-list details:first-child > summary { padding-top: 0; }
.svc-faq-list details:first-child > summary::after { top: 0; }
.svc-faq-answer { padding-bottom: 24px; }
.svc-faq-answer p { font-size: 16px; line-height: 1.7; }
.svc-cta { padding-block: clamp(64px, 8vw, 120px); }
.svc-cta h2 { max-width: 1000px; margin-top: 28px; font-size: clamp(48px, 8vw, 116px); line-height: 1.05; }
.svc-cta .svc-actions { margin-top: 40px; }
@media (max-width: 900px) {
  .svc-hero { grid-template-columns: minmax(0, 1fr); gap: 40px; padding-bottom: 0; }
  .svc-hero h1 { max-width: 850px; font-size: clamp(48px, 8vw, 76px); }
  .svc-visual { aspect-ratio: 16 / 10; }
  .svc-film video { position: static; aspect-ratio: 16 / 10; }
  .svc-phone-stage { aspect-ratio: 4 / 3; }
  .svc-search-result { max-width: 460px; }
  .svc-section-heading { display: block; }
  .svc-section-heading > p { margin-top: 18px; }
  .svc-inclusions, .svc-faq, .svc-addons { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .svc-price-grid { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .svc-price-card { padding: 32px; }
  .svc-price-card .svc-price { font-size: 64px; }
  .svc-price-card .svc-text-link { margin-top: 12px; }
}
@media (max-width: 600px) {
  .svc-hero { padding-top: 44px; }
  .svc-hero h1 { font-size: clamp(42px, 11.7vw, 66px); line-height: 1.06; }
  .svc-kicker { margin-bottom: 20px; }
  .svc-intro-line { margin-top: 22px; font-size: 18px; }
  .svc-visual { border-radius: 8px; }
  .svc-search-stage { aspect-ratio: auto; padding: 68px 18px 24px; }
  .svc-search-result { padding: 22px; }
  .svc-phone-stage { aspect-ratio: 4 / 5; }
  .svc-phone { border-radius: 22px; padding: 5px; }
  .svc-phone video { border-radius: 17px; }
  .svc-sample { top: 14px; right: 14px; }
  .svc-process { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .svc-process li::before { margin-bottom: 18px; }
  .svc-process h3 { max-width: 100%; font-size: 24px; }
  .svc-website-offer, .svc-monthly-offer { grid-template-columns: minmax(0, 1fr); gap: 36px; padding: 26px; }
  .svc-price { font-size: 68px; }
  .svc-pricing-intro { padding-top: 44px; }
  .svc-pricing-intro h1 { font-size: clamp(54px, 15vw, 80px); }
  .svc-section-heading { margin-bottom: 28px; }
  .svc-actions { flex-direction: column; align-items: stretch; }
  .svc-hero .svc-actions { align-items: start; }
  .svc-price-card { padding: 28px; }
}
@media (prefers-reduced-motion: reduce) {
  .services-page *, .services-page *::before, .services-page *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}