/* Final premium QA layer. Loaded after the legacy maintenance layer by design. */
:root {
  --premium-ease: cubic-bezier(.22, .8, .22, 1);
  --premium-duration: 320ms;
}

html { overflow-x: clip; text-wrap: pretty; }
body { max-width: 100%; overflow-x: clip; }
*, *::before, *::after { box-sizing: border-box; }
img, svg, video, canvas { max-width: 100%; }

/* Pointer focus is quiet; keyboard focus remains visible and accessible. */
button, a, input, textarea, select, summary { -webkit-tap-highlight-color: transparent; }
button:focus:not(:focus-visible), a:focus:not(:focus-visible), summary:focus:not(:focus-visible) { outline: none !important; box-shadow: none !important; }
button:active, a:active, summary:active { outline: none !important; box-shadow: none !important; }
button:focus-visible, a:focus-visible, summary:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible { outline: 2px solid var(--maintenance-focus, #f0b09a) !important; outline-offset: 4px; }

/* Every interactive control visibly compresses, then returns to rest. */
.site-shell button, .site-shell a, .site-shell summary, .site-shell [role="button"] { transition: transform 320ms cubic-bezier(.22, .8, .22, 1), color 240ms ease, background-color 240ms ease, border-color 240ms ease, filter 240ms ease !important; }
.site-shell button:active, .site-shell a:active, .site-shell summary:active, .site-shell [role="button"]:active { transform: scale(.98) translateY(1px) !important; filter: brightness(.94) !important; }
.site-shell button.is-pressed, .site-shell a.is-pressed, .site-shell summary.is-pressed, .site-shell [role="button"].is-pressed { animation: premium-button-press 420ms cubic-bezier(.22, .8, .22, 1) both !important; }
@keyframes premium-button-press {
  0% { transform: scale(1) translateY(0); filter: brightness(1); }
  28% { transform: scale(.955) translateY(2px); filter: brightness(.84); }
  68% { transform: scale(.985) translateY(.5px); filter: brightness(.95); }
  100% { transform: scale(1) translateY(0); filter: brightness(1); }
}

/* Remove the compiled hard line segmentation; JS protects the final two words. */
.title-line,
.request-stage h2 .title-line,
.question-card h2 .title-line,
.review-card h2 .title-line { display: inline !important; max-width: none !important; white-space: normal !important; overflow: visible !important; overflow-wrap: normal !important; word-break: normal !important; text-wrap: balance !important; }
.title-line:not(:last-child) { margin-right: .24em; }
h1, h2, h3, h4, p, li, blockquote, summary { text-wrap: pretty; }
h1, h2, h3, h4 { overflow-wrap: normal; word-break: normal; }

/* First visit only: calm staggered entrance, with reduced-motion respect. */
html.premium-entering body > #root { opacity: 0; transform: translateY(10px); }
html.premium-entered body > #root { opacity: 1; transform: translateY(0); transition: opacity 720ms cubic-bezier(.22, .8, .22, 1), transform 720ms cubic-bezier(.22, .8, .22, 1); }
html.premium-entered [data-reveal], html.premium-entered .site-header, html.premium-entered .site-footer { animation: premium-rise 720ms cubic-bezier(.22, .8, .22, 1) both; animation-delay: calc(var(--reveal-index, 0) * 55ms); }
@keyframes premium-rise { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) {
  html.premium-entering body > #root { opacity: 1; transform: none; }
  html.premium-entered body > #root, html.premium-entered [data-reveal], html.premium-entered .site-header, html.premium-entered .site-footer { animation: none !important; transition: none !important; }
  button.is-pressed, a.is-pressed, summary.is-pressed, [role="button"].is-pressed { animation: none !important; }
}

/* Four service points on one desktop row, with safe responsive fallbacks. */
.services-route .module-list { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: clamp(18px, 2.6vw, 48px) !important; align-items: start; }
.services-route .module-item { min-width: 0; }
.services-route .module-item h3 { text-wrap: balance; }
.services-route .module-item p { text-wrap: pretty; }
@media (max-width: 900px) { .services-route .module-list { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; row-gap: 30px !important; } }
@media (max-width: 600px) { .services-route .module-list { grid-template-columns: 1fr !important; gap: 24px !important; } }

/* No accidental wide child can create horizontal scrolling on touch devices. */
button, a.action-link, .plain-button, .menu-button, input, textarea, select, summary { min-height: 44px; }
textarea { max-width: 100%; resize: vertical; }
@media (max-width: 760px) {
  .content-shell, .section, .detail-page, .page-main, .page-view { max-width: 100% !important; }
  .content-shell { width: 100%; }
  .site-header, .site-footer { padding-left: max(18px, env(safe-area-inset-left)); padding-right: max(18px, env(safe-area-inset-right)); }
  .action-link, .plain-button { max-width: 100%; }
}

/* Premium delivery error presentation and direct-email fallback. */
.error-summary.premium-delivery-error { border: 0 !important; border-left: 2px solid var(--maintenance-focus, #f0b09a) !important; background: rgba(240, 176, 154, .08); border-radius: 3px; padding: 16px 18px; animation: premium-state-in 420ms cubic-bezier(.22, .8, .22, 1) both; }
.delivery-error-note { margin: 10px 0 0; color: var(--muted, #8b827a); font-size: 12px; line-height: 1.6; }
.delivery-error-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 14px; }
.delivery-error-actions a { color: var(--accent-light, #f0b09a); font: 700 10px/1.2 var(--sans, sans-serif); letter-spacing: .08em; text-transform: uppercase; text-decoration: none; }
@keyframes premium-state-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }

/* Preserve form controls as native editable regions. */
.request-experience, .request-experience *, .request-experience *::before, .request-experience *::after { min-width: 0; }
.request-experience input, .request-experience textarea, .request-experience select { box-sizing: border-box; max-width: 100%; min-width: 0; }