/* Drake's shared preference component and audited site integration. */
html { font-size: calc(100% * var(--display-scale)); scroll-padding-top: calc(var(--nav-height) + 5rem); }
body { font-variant-numeric: lining-nums tabular-nums; overflow-wrap: anywhere; }
@media (forced-colors: none) {
  html[data-display-theme="dark"] { color-scheme: dark; background: var(--display-surface); }
}
.display-preferences { --display-bottom: max(1rem, env(safe-area-inset-bottom)); position: fixed; inset: auto auto var(--display-bottom) max(1rem, env(safe-area-inset-left)); display: flex; flex-direction: column-reverse; align-items: flex-start; gap: 0.5rem; z-index: 2147483638; max-width: calc(100% - 2rem); font-family: var(--font-body); color: var(--display-ink); }
.display-preferences [hidden] { display: none !important; }
.display-launcher, .display-panel button, .display-panel select { font: inherit; font-size: var(--display-body); min-height: var(--display-target); border: 1px solid var(--display-border); border-radius: var(--display-radius); padding: 0.5rem 0.75rem; cursor: pointer; }
.display-launcher { display: grid; place-items: center; flex: none; width: 3.5rem; height: 3.5rem; padding: 0.65rem; border-radius: 50%; background: var(--display-button); color: var(--display-on-button); box-shadow: var(--display-shadow); }
.display-launcher svg { display: block; width: 100%; height: 100%; pointer-events: none; }
.display-launcher:hover { background: var(--display-button-hover); }
.display-panel { position: relative; width: var(--display-panel-width); max-width: 100%; max-height: calc(100dvh - var(--nav-height) - var(--display-bottom) - 5rem); overflow-y: auto; overscroll-behavior: contain; padding: var(--display-pad); border: 1px solid var(--display-border); border-radius: var(--display-radius); background: var(--display-surface); box-shadow: var(--display-shadow); }
.display-heading { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--display-gap); margin-bottom: var(--display-pad); }
.display-heading h2 { font-family: var(--font-display); font-size: var(--display-title); line-height: 1.35; margin: 0; color: var(--display-ink); }
.display-panel button { color: var(--display-ink); background: var(--display-surface-soft); }
.display-panel button:hover { text-decoration: underline; }
.display-field { display: grid; gap: 0.375rem; margin-bottom: var(--display-gap); }
.display-field label { font-weight: 700; }
.display-panel select { width: 100%; color: var(--display-ink); background: var(--display-surface); }
.display-check { display: flex; align-items: start; gap: var(--display-gap); min-height: var(--display-target); padding: 0.5rem 0; cursor: pointer; line-height: 1.5; }
.display-check input { flex: 0 0 auto; width: 1.25rem; height: 1.25rem; margin-top: 0.15rem; accent-color: var(--display-button); }
.display-panel p { font-size: var(--display-small); line-height: 1.55; color: var(--display-muted); margin: 0.5rem 0 1rem; }
.display-panel #display-status { margin-bottom: 0; }
.display-preferences :focus-visible { outline: 3px solid var(--display-focus); outline-offset: 3px; }

/* Complete owned color pairs, including forms, icons, image text and states. */
.form-group input, .form-group textarea, .form-group select { border-color: var(--display-border); }
.form-group input::placeholder, .form-group textarea::placeholder { color: var(--display-muted); opacity: 1; }
.form-group :user-invalid { border-color: var(--display-error); outline: 2px solid var(--display-error); outline-offset: 2px; }
.cta-form input, .cta-form select, .cta-form textarea { background: var(--display-field); color: var(--display-reverse-ink); border-color: var(--display-border); }
.cta-form input:focus, .cta-form select:focus, .cta-form textarea:focus { background: var(--display-field); border-color: var(--display-reverse-ink); }
.cta-form input::placeholder, .cta-form textarea::placeholder { color: var(--display-reverse-muted); opacity: 1; }
.cta-form select { color: var(--display-reverse-ink); }
.breadcrumb, .breadcrumb a, .mobile-menu .mobile-contact p, .mobile-menu .mobile-contact a { color: var(--display-reverse-muted); }
.project-lightbox-meta-label, .error-desc { color: var(--display-reverse-muted); }
.error-page { padding-top: calc(var(--nav-height) + 5rem); }
.error-code { color: var(--blue-light); }
.nav.scrolled .logo-blue, .nav.scrolled .nav-logo .logo-blue { fill: var(--blue-light); }
.nav.scrolled .logo-gray, .nav.scrolled .nav-logo .logo-gray { fill: var(--gray-light); }
.project-card-overlay, .project-card:hover .project-card-overlay { background: var(--display-project-scrim); }
.hero-sub, .page-hero-sub { color: var(--display-reverse-ink); }
.hero-overlay { background: var(--display-hero-scrim); }
.cta-inner .section-desc, .cta-inner p, .cta-phone { color: var(--display-reverse-ink); }
.section-title .orange, .process-step:last-child .step-number, .core-card:hover .core-card-link { color: var(--display-accent); }
.why-local .section-title .orange { color: var(--display-reverse-accent); }
.check-item { display: block; position: relative; padding-left: 1.5rem; }
.check-item .check-icon { position: absolute; left: 0; top: 0.25rem; }
.ind-pill { color: var(--display-link); }
.adv-num { color: var(--display-link); }
.error-btn--primary { background: var(--display-button); color: var(--display-on-button); }
.error-btn--primary:hover { background: var(--display-button-hover); }
.privacy-content a:focus-visible { outline-color: var(--display-focus); }
main :focus-visible, footer :focus-visible, .nav :focus-visible, .mobile-menu :focus-visible { outline: 3px solid var(--display-focus); outline-offset: 4px; }
.nav :focus-visible, .mobile-menu :focus-visible, .hero :focus-visible, .cta-banner :focus-visible, footer :focus-visible { outline-color: var(--blue-light); }

/* Text growth must not leave measured accordion heights or fixed heroes behind. */
.faq-answer[aria-hidden="false"] { max-height: none !important; overflow: visible; }
.faq-answer[aria-hidden="true"] { visibility: hidden; }
.hero, .hero.shrunk { min-height: 44rem; height: auto; }
.hero-content { position: relative; padding-top: 13rem; padding-bottom: 7rem; }
.hero-actions { opacity: 1; animation: none; }
.hero-title, .page-hero-title { overflow-wrap: anywhere; hyphens: auto; }
.service-card-title { overflow-wrap: anywhere; hyphens: auto; }
.hero-buttons, .footer-bottom, .cta-inner, .form-row { flex-wrap: wrap; }
.hero-pause-toggle { position: absolute; bottom: 1rem; left: 5.5rem; z-index: 12; min-width: 44px; min-height: 44px; border: 1px solid var(--gray-light); border-radius: var(--display-radius); background: var(--display-dark-surface); color: var(--display-reverse-ink); padding: 0.5rem; font: inherit; font-size: var(--display-small); }
.hero-pause-toggle[aria-disabled="true"] { cursor: default; }
.hero-pause-toggle.is-paused .icon-pause { display: none; }
.hero-pause-toggle.is-paused .icon-play { display: block !important; }
.related-service-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; margin-top: 2rem; }
.service-list-industries { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.comparison-scroll { overflow-x: auto; max-width: 100%; border: 1px solid var(--display-border); border-radius: var(--display-radius); }
.comparison-scroll .compare-table { min-width: 40rem; margin-top: 0; overflow-wrap: normal; }
.comparison-help { margin-bottom: 0.75rem; font-size: var(--display-small); }
.core-card-featured, .service-card.featured { display: flex; flex-direction: column; background: var(--display-dark-surface); }
.core-card-featured .core-card-img, .service-card.featured .service-card-img { display: block; height: 24rem !important; min-height: 0 !important; }
.core-card-featured .core-card-body, .service-card.featured .service-card-content { position: relative !important; background: var(--display-dark-surface) !important; }
.footer { padding-bottom: 8rem; }
.sticky-cta { border: none; }
@media (max-width: 70rem) {
  .nav-hamburger { display: flex; }
  .nav-links { display: none; }
}
@media (max-width: 48rem) {
  .display-preferences { --display-bottom: max(5.5rem, calc(env(safe-area-inset-bottom) + 5.5rem)); left: max(0.5rem, env(safe-area-inset-left)); max-width: calc(100% - 1rem); }
  .container, .page-hero-content { padding-left: 1rem; padding-right: 1rem; }
  .contact-grid, .footer-grid, .stats-grid, .geo-stats-grid, .story-grid, .split-grid { grid-template-columns: minmax(0, 1fr); }
  .contact-grid > *, .form-group, .form-group input, .form-group select, .form-group textarea { min-width: 0; }
  .contact-form { padding: 1rem; }
  .nav { padding-inline: 1rem; }
  .nav-logo svg { max-width: 65vw; }
  .hero-content { padding-top: 12rem; }
  .page-hero-content { padding-top: 12rem; }
  .hero-title { font-size: var(--display-hero-type); }
  .mobile-menu { width: min(25rem, 100%); padding-inline: 1rem; }
  .project-lightbox.open .project-lightbox-inner { max-height: calc(100dvh - 2rem); overflow-y: auto; }
  .form-row { display: flex; flex-direction: column; }
  .sticky-cta a { font-size: var(--display-small); padding: 0.5rem; min-height: 44px; }
  .compare-table { font-size: var(--display-small); }
  .related-service-grid { grid-template-columns: minmax(0, 1fr); }
  .related-service-grid > a, .related-card { flex-direction: column; align-items: flex-start !important; padding: var(--display-pad) !important; }
  .service-card-content, .service-card.featured .service-card-content, .review-card { padding: var(--display-pad); }
  .core-card-body { padding: var(--display-pad) !important; }
  .core-card-featured .core-card-img, .service-card.featured .service-card-img { height: 12rem !important; }
  .service-list-industries { grid-template-columns: minmax(0, 1fr); }
  .db-step { grid-template-columns: minmax(0, 1fr); gap: 1rem; padding: 1rem; }
}
/* Short viewports keep the panel scrollable and return the CTA to document flow. */
@media (max-height: 35rem) {
  .display-preferences { --display-bottom: max(0.5rem, env(safe-area-inset-bottom)); flex-direction: column; max-height: calc(100dvh - var(--nav-height) - 1rem); overflow-y: auto; overscroll-behavior: contain; padding: 4px; }
  .display-panel { flex: none; max-height: none; overflow: visible; }
  .sticky-cta { position: static; }
}

/* Stop only owned motion. Third-party embeds keep their own controls. */
html[data-display-motion="stop"] { scroll-behavior: auto; }
html[data-display-motion="stop"] :is(main, .nav, .mobile-menu, .mobile-overlay, .stats-bar, footer) *,
html[data-display-motion="stop"] :is(main, .nav, .mobile-menu, .mobile-overlay, .stats-bar, footer) *::before,
html[data-display-motion="stop"] :is(main, .nav, .mobile-menu, .mobile-overlay, .stats-bar, footer) *::after,
html[data-display-motion="stop"] :is(.hero, .hero-slide, .hero-slide img, .hero-light-leak, .dust, .reveal, .title-underline, .dci-divider)::before,
html[data-display-motion="stop"] :is(.hero, .hero-slide, .hero-slide img, .hero-light-leak, .dust, .reveal, .title-underline, .dci-divider, .nav, .mobile-menu, .mobile-overlay, footer) { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
html[data-display-motion="stop"] :is(.reveal, .hero-title .word, .hero-sub, .hero-actions) { opacity: 1 !important; transform: none !important; }
html[data-display-motion="stop"] :is([data-parallax], .dci-divider::before) { transform: none !important; }
html[data-display-motion="stop"] .title-underline { background-size: 100% 3px; }
html[data-display-motion="stop"] :is(.hero-light-leak, .hero-particles) { display: none; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
@media (forced-colors: active) {
  .display-preferences *, .display-preferences { forced-color-adjust: auto; }
  .display-launcher, .display-panel, .display-panel button, .display-panel select { background: Canvas; color: CanvasText; border-color: ButtonText; box-shadow: none; }
  .display-preferences :focus-visible { outline-color: Highlight; }
  .shimmer { background: none; color: CanvasText; -webkit-text-fill-color: currentColor; }
  .hero-overlay, .page-hero-overlay { background: Canvas; }
}
@media print { .display-preferences { display: none; } }
