/* One screen per section on laptops and desktops.
   Menu links land each section exactly below the floating header, and every
   section is compacted so its content fits in the remaining screen height.
   Phones and very short windows keep normal scrolling. Loaded last. */

.ag-cities { grid-column: 1 / -1; }

@media (min-width: 960px) and (min-height: 540px) {
  :root { --head: 90px; }
  section, [id] { scroll-margin-top: var(--head); }
  main > section:not(.hero2):not(.loc-hero) { min-height: calc(100vh - var(--head)); display: flex; flex-direction: column; justify-content: center; padding: 24px 0; }
  main > section > .wrap { width: 100%; }
  .hero2 { min-height: calc(100vh - var(--head) - 12px); padding: 36px 0; }
  .contact2 { padding-bottom: 24px; }

  .work-head { margin-bottom: 16px; }
  section h2 { font-size: clamp(1.7rem, 2.4vw, 2.3rem); }
  .work-head p { font-size: 14px; }
  .label { margin-bottom: 8px; }

  /* pricing */
  .tiers { gap: 16px; }
  .tier { padding: 18px 22px; }
  .tier h3 { font-size: 1.2rem; }
  .tier-for { display: none; }
  .tier-price { font-size: 2.4rem; margin-top: 8px; }
  .tier-per { margin: 4px 0 12px; }
  .tier .btn { margin-bottom: 12px; padding: 9px 16px; font-size: 14px; }
  .tier ul { padding-top: 12px; font-size: 13.5px; }
  .tier li { margin-bottom: 5px; gap: 8px; }
  .tier li svg { margin-top: 2px; }
  .tier-pick { padding-top: 18px; padding-bottom: 18px; }
  .tier-badge { top: -11px; }
  .price-notes { margin-top: 12px; }
  .price-notes > div { padding: 12px 16px; }
  .price-notes h3 { font-size: .9rem; margin-bottom: 6px; }
  .price-notes ul { grid-template-columns: 1fr 1fr; gap: 3px 12px; font-size: 13px; }
  .pay-chips { margin-bottom: 4px; }
  .pay-chips span { padding: 4px 8px; font-size: 12px; }
  .price-notes .muted.small { margin: 0; font-size: 13px; }
  .price-notes .btn { margin-top: 6px; padding: 6px 14px; font-size: 13px; }

  /* services */
  .bento { gap: 12px; }
  .bx { padding: 16px 18px; gap: 6px; border-radius: 18px; }
  .bx h3 { font-size: 1rem; }
  .bx p { font-size: 13.5px; line-height: 1.45; }
  .svc-ic { width: 34px; height: 34px; border-radius: 10px; margin-bottom: 2px; }
  .svc-ic svg { width: 18px; height: 18px; }
  .bx-web h3 { font-size: 1.25rem; }
  .bx-mock img { max-height: 230px; width: auto; max-width: 100%; margin: 0 auto; }
  .bx-mock figcaption { margin-top: 4px; }
  .bx-seo .svc-ic, .bx-wa .svc-ic { display: none; }
  .mock-pay { padding: 12px; }
  .m-paybtn { margin-top: 8px; padding: 8px; }
  .mock-serp, .mock-chat { margin: 2px 0; }
  .mock-chat p { padding: 6px 10px; font-size: 12.5px; }
  .bx-sm { flex-direction: row; align-items: center; gap: 10px; padding: 12px 16px; }
  .bx-sm .svc-ic { margin: 0; }
  .bx-sm h3 { font-size: .95rem; }
  .bx-sm p { display: none; }
  .bx-sm .svc-price { margin: 0 0 0 auto; font-size: 13px; }

  /* work */
  .work-grid { grid-template-columns: repeat(4, 1fr); gap: 12px; }
  .wk { padding: 8px; border-radius: 16px; }
  .wk-bar { display: none; }
  .wk-shot img { aspect-ratio: 16 / 9; }
  .wk-meta { padding: 8px 4px 2px; }
  .wk-meta b { font-size: 14px; }
  .wk-meta small { font-size: 12px; }
  .wk-go { width: 26px; height: 26px; right: 12px; bottom: 12px; font-size: 13px; }
  .work-more { margin-top: 10px; font-size: 13px; }

  /* process + reviews */
  .steps-row li { padding: 20px; }
  .step-n { margin-bottom: 12px; }
  .rev { padding: 20px; gap: 10px; }
  .rev blockquote { font-size: 15px; }
  .rev-cta { margin-top: 16px; }

  /* areas */
  .area-layout .area-groups > div { padding: 11px 14px; }
  .area-layout .area-groups h3 { font-size: .85rem; margin-bottom: 6px; }
  .area-layout .chips { gap: 5px; }
  .area-layout .chips a { padding: 3px 9px; font-size: 12.5px; }
  .area-layout .lmap-canvas { min-height: 280px; }
  .lmap-legend { padding: 8px 14px; font-size: 12px; }

  /* FAQ */
  .faq-layout .faq { gap: 8px; }
  .faq-layout .faq summary { padding: 11px 30px 11px 0; font-size: 15px; }
  .faq-layout .faq summary::after { top: 9px; }
  .faq-side p { margin: 10px 0 14px; }

  /* contact */
  .contact-card { padding: 32px 40px; }
}

/* second pass: trim the sections that still overflowed at 1366x657 */
@media (min-width: 960px) and (min-height: 540px) {
  /* pricing: name and price on one line, notes as a compact strip */
  .tier { display: grid; grid-template-columns: 1fr auto; column-gap: 12px; align-content: start; padding: 16px 20px; }
  .tier h3 { grid-column: 1; grid-row: 1; align-self: center; }
  .tier-price { grid-column: 2; grid-row: 1 / span 2; margin: 0; font-size: 2.2rem; align-self: center; }
  .tier-per { grid-column: 1; grid-row: 2; margin: 2px 0 0; font-size: 12px; }
  .tier .btn { grid-column: 1 / -1; margin: 12px 0 10px; }
  .tier ul { grid-column: 1 / -1; padding-top: 10px; font-size: 13px; }
  .tier li { margin-bottom: 4px; line-height: 1.4; }
  .tier-pick { padding-top: 16px; padding-bottom: 16px; }
  .price-notes { grid-template-columns: 1.5fr 1.1fr .9fr; }
  .price-notes > div { padding: 10px 14px; }
  .price-notes ul { display: flex; flex-wrap: wrap; gap: 2px 14px; font-size: 12.5px; }
  .price-notes li svg { width: 13px; height: 13px; flex-basis: 13px; }
  .price-notes .muted.small { font-size: 12.5px; }
  .pay-chips + .muted.small { display: none; }
  .price-notes .btn { padding: 0; border: 0; background: none; color: var(--accent-ink); font-weight: 600; margin-top: 4px; }

  /* services: shorter cards */
  .bx { padding: 14px 16px; }
  .bx-mock img { max-height: 165px; }
  .bx-mock figcaption { display: none; }
  .bx-pay { gap: 12px; }
  .mock-pay { padding: 10px; }
  .m-methods span { padding: 4px 8px; font-size: 11.5px; }
  .mock-pay small { margin-top: 4px; }
  .bx-seo h3, .bx-wa h3 { font-size: .95rem; }
  .mock-serp { padding: 8px; }
  .m-q { padding: 4px 10px; font-size: 12px; }
  .m-res { margin-top: 6px; }

  /* work: wider, shorter thumbnails */
  .wk-shot img { aspect-ratio: 2 / 1; }

  /* areas: tighter list, list gets more width */
  .area-layout { grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 20px; }
  .area-layout .area-groups { grid-template-columns: repeat(3, 1fr); }
  .area-layout .area-groups > div { padding: 9px 12px; }
  .area-layout .area-groups h3 { margin-bottom: 5px; }
  .area-layout .chips { gap: 4px; }
  .area-layout .chips a { padding: 2px 8px; font-size: 12px; line-height: 1.45; }
}
@media (min-width: 960px) and (min-height: 540px) { main > section#services { padding: 14px 0; } .bento { gap: 10px; } }
@media (min-width: 960px) and (max-width: 1180px) and (min-height: 540px) {
  .tier ul { font-size: 12.5px; } .tier li { margin-bottom: 3px; } .tier .btn { margin: 10px 0 8px; }
  .area-layout { grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr); }
  .area-layout .chips a { font-size: 11.5px; padding: 2px 7px; }
  .area-layout .area-groups > div { padding: 8px 10px; }
}

/* location pages: two-column body */
.loc-grid { display: grid; gap: 24px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 900px) { .loc-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px; align-items: start; } .loc-side .loc-facts { margin-top: 0; } }
.loc-side h3:first-child { margin-top: 0; }
@media (min-width: 960px) and (min-height: 540px) { .loc-body h3 { margin: 18px 0 6px; } .loc-body p, .loc-body li { font-size: 15.5px; } .loc-body li { margin-bottom: 4px; } .loc-facts { margin: 0 0 16px; } .loc-facts > div { padding: 12px 16px; } .loc-facts dd { font-size: 14px; } }
@media (min-width: 960px) and (min-height: 540px) { #pricing .work-head p { display: none; } #pricing .work-head > div { width: 100%; } }
.legal-cols { max-width: 46em; }
@media (min-width: 960px) { .legal-cols { max-width: none; column-count: 2; column-gap: 56px; } .legal-cols h3 { break-after: avoid; margin-top: 0; padding-top: 14px; } .legal-cols p { break-inside: avoid; } }
@media (min-width: 960px) and (min-height: 540px) { .legal-cols p { font-size: 15px; margin-bottom: .7em; } .legal-cols h3 { font-size: 1.05rem; } }
/* snappier reveals so a section looks complete as soon as you land on it */
.anim .rv { transition-duration: .45s !important; transition-delay: calc(var(--i, 0) * 35ms) !important; }