/* Shared interaction finish. The colour of each demo stays with its own brand. */
button { font:inherit; }
input,select,textarea { font-family:inherit; }
button, a, summary { -webkit-tap-highlight-color:transparent; touch-action:manipulation; }
button { cursor:pointer; }
button:disabled { cursor:not-allowed; }
:where(button,a,input,select,textarea,summary):focus-visible { outline:3px solid #8cb7ff; outline-offset:4px; }
button[hidden], [hidden] { display:none!important; }
.button,.demo-button,.pro-action,.btn,.primary-button,.secondary-button {
  gap:12px; text-decoration:none; text-align:center; text-wrap:pretty;
  transition:background-color .18s,border-color .18s,box-shadow .18s,transform .18s;
}
.button>span[aria-hidden],.demo-button>span[aria-hidden],.pro-action>svg,.btn>svg { flex-shrink:0; }
.button:active,.demo-button:active,.pro-action:active,.btn:active { transform:translateY(1px); }
button:disabled { opacity:.45; box-shadow:none; transform:none; }

/* Landing navigation and actions */
.site-header { position:fixed; z-index:50; }
html:has(.site-header) { scroll-padding-top:110px; }
.site-header .desktop-nav a { display:flex; align-items:center; min-height:44px; border-radius:9px; padding:0 3px; }
.site-header .desktop-nav a[aria-current=location] { color:#c4daff; text-decoration:underline; text-decoration-color:#8cadd4; text-underline-offset:7px; }
.site-header .menu-toggle { width:44px; min-width:44px; height:44px; align-items:center; border-radius:12px; border:1px solid #8eadd33b; background:#c6dcff08; padding:0; }
.menu-toggle span { transition:transform .2s; }
.menu-toggle[aria-expanded=true] span:first-child { transform:translateY(3.5px) rotate(45deg); }
.menu-toggle[aria-expanded=true] span:last-child { transform:translateY(-3.5px) rotate(-45deg); }
.mobile-nav:not([hidden]) { max-height:calc(100svh - 112px); overflow-y:auto; gap:5px; }
.mobile-nav a { padding:10px 13px; border-radius:12px; }
.button,.contact-form .button { background:#d3e2ff; color:#162e4d; border:1px solid #d3e2ff; font-weight:700; }
.text-link { min-height:44px; display:inline-flex; align-items:center; gap:13px; border-color:#6682a6; line-height:1.65; }
.text-link:active { border-color:#d6e5ff; }
.hero-entry-prices>a,.hero-footer>a,.card-maintenance,.footer-bottom>a { min-height:44px; display:inline-flex; align-items:center; }
.business-selector { gap:6px; padding:6px; background:#0d1d32; border:1px solid #435b7d; border-radius:18px; }
.business-selector button { min-height:44px; border:1px solid transparent; border-radius:12px; color:#e9f1ff; background:transparent; font-weight:600; line-height:1.5; padding:10px 13px; }
.business-selector button[aria-pressed=true] { background:#d3e2ff; color:#173254; border-color:#d3e2ff; box-shadow:0 3px 10px #020d2820; }
.device-switch { border-radius:17px; border-color:#4a6386; padding:5px; }
.device-switch button { min-height:44px; border-radius:12px; line-height:1.5; }
.filter { min-height:44px; font-weight:600; border-color:#46617f; }
.filter.active { border-color:#d3e2ff; }
.round-button { width:44px; height:44px; border-color:#5a7495; color:#edf5ff; background:#152942; font-size:26px; }
.round-button:disabled { opacity:.4; background:transparent; }
.example-picker { gap:6px; }
.example-picker button { min-height:44px; border:1px solid #496382; border-radius:12px; line-height:1.6; color:#eff5ff; background:#13263d; }
.example-picker button[aria-pressed=true] { color:#183454; background:#d3e2ff; border-color:#d3e2ff; }
.demo-button { justify-content:space-between; color:#17314f; min-height:50px; padding:13px 18px; font-weight:700; }
.demo-button:after { content:'↗'; font-size:19px; font-weight:500; flex-shrink:0; }
.lab-close { display:inline-flex; align-items:center; justify-content:center; gap:12px; min-height:44px; padding:10px 16px; border:1px solid #718aa7; border-radius:13px; background:#16314e; color:#f0f6ff; line-height:1.5; }
.lab-close>span { font-size:24px; font-weight:400; line-height:1; }
.solution-details summary,.faq-list summary,.website-offer summary { border-radius:12px; cursor:pointer; }
.solution-details summary { padding-top:12px; padding-bottom:12px; gap:15px; }
.solution-details summary .disclosure-icon { flex-shrink:0; }
.website-offer summary { grid-template-columns:minmax(0,1fr) auto 30px; }
.faq-list summary>span,.web-offer-more { display:grid; place-items:center; width:30px; height:30px; flex:0 0 30px; font-size:0; color:#d9e9ff; border:1px solid #5a7391; border-radius:50%; background:#1e344f; transform:none; }
.faq-list summary>span:before,.web-offer-more:before { content:'+'; font:400 22px/1 Manrope,Arial,sans-serif; }
.faq-list details[open] summary>span,.website-offer[open] .web-offer-more { transform:none; color:#173252; background:#d3e2ff; border-color:#d3e2ff; }
.faq-list details[open] summary>span:before,.website-offer[open] .web-offer-more:before { content:'−'; }
.website-demo-toolbar button,.cinema-controls button { min-height:44px; border-radius:13px; border-color:#607a9d; color:#f1f6ff; line-height:1.5; }
.website-demo-toolbar button[aria-pressed=true],.cinema-controls button[aria-pressed=true] { background:#d4e4ff; border-color:#d4e4ff; color:#173251; }
.video-toggle { min-height:44px; border:1px solid #a6c4ef70; box-shadow:0 3px 15px #0003; }
.motion-hero .video-toggle { min-height:44px; min-width:84px; }
.website-dialog-head>button { display:grid; place-items:center; width:44px; min-width:44px; height:44px; padding:0; border-radius:50%; line-height:1; font-size:26px; }
.website-dialog .button { min-height:48px; }
.contact-section :is(button,a,input,select,textarea):focus-visible { outline-color:#bcd6ff; }
.contact-status { border-radius:12px; }
.contact-status:not(:empty) { padding:12px 15px; background:#10253b; border:1px solid #6687ac; line-height:1.8; }
.contact-form select { cursor:pointer; padding-right:35px; }
.contact-form input::placeholder,.contact-form textarea::placeholder { color:#becfe5; opacity:1; }
.site-extension button { line-height:1.6; }

/* App controls, forms and dialogs */
.btn,.pro-action,.primary-button,.secondary-button,.service-option,.slot { min-height:44px; }
.btn.small { min-height:40px; }
.icon-button { width:44px; min-width:44px; height:44px; border-radius:12px; }
.workspace-tools button,.studio-controls button { min-height:44px; border-radius:12px; padding:9px 12px; line-height:1.6; }
.workspace-tools { flex-wrap:wrap; }
.panel-head,.quote-actions,.modal-footer,.row-actions { flex-wrap:wrap; }
.panel-head>* { min-width:0; }
.quote-actions>*,.row-actions>* { max-width:100%; }
.callout:after { inset:0; width:auto; height:auto; border:0; border-radius:inherit; background:radial-gradient(ellipse at 100% 0,#ffffff20,transparent 70%); }
.callout { isolation:isolate; }
.callout>* { position:relative; z-index:1; }
.task-footer>span { min-width:0; overflow-wrap:anywhere; }
.task-footer>.icon-button { flex-shrink:0; }
.pro-owner-filter { white-space:normal; }
.phone-nav button { min-height:48px; min-width:44px; }
.phone-profile h1 { font-size:29px; line-height:1.25; overflow-wrap:anywhere; }
.favorite,.product-favorite { min-width:44px; min-height:44px; }
.mobile-service .favorite { right:7px; top:8px; width:44px; height:44px; }
.service-option:focus-visible { outline-color:var(--accent); }
.request-journey { flex-wrap:wrap; row-gap:8px; }
.upload-label { max-width:100%; min-width:0; }
.upload-label input[type=file] { width:100%; max-width:100%; min-width:0; }
#app-dialog .modal-footer { position:sticky; bottom:-28px; padding-bottom:15px; background:#f8faff; }

/* Local business demos */
.venue-nav button,.categories button,.add-button,.close-button,.quantity-control button { min-height:44px; min-width:44px; }
.venue-nav button { border-radius:13px; }
.categories button { line-height:1.5; }
.categories { scrollbar-width:thin; scrollbar-color:var(--accent) transparent; }
.categories button { flex-shrink:0; white-space:nowrap; }
.product-favorite { top:14px; right:14px; }
.product .product-tag { max-width:calc(100% - 51px); }
.quantity-control { display:inline-flex; align-items:center; }
.quantity-control button { padding:0; }
.option-label { min-width:0; flex-wrap:wrap; }
.option-label span { min-width:0; flex:1; overflow-wrap:anywhere; }
.modal-bottom { flex-wrap:wrap; }
.record-actions,.booking-actions { flex-wrap:wrap; }
.slot:disabled { text-decoration:line-through; }
.venue-order-track .current i { border-color:var(--accent); box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 12%,transparent); }
.venue-order-track .current small { color:var(--ink); font-weight:700; }
.venue-footer-links a,.venue-footer-links button { display:inline-flex; align-items:center; min-height:44px; }

@media(hover:hover) and (pointer:fine) {
  .button:hover,.contact-form .button:hover,.demo-button:hover { color:#102843; background:#e6efff; border-color:#e6efff; box-shadow:0 8px 24px #648dc31b; transform:translateY(-1px); }
  .text-link:hover { color:#d3e6ff; border-color:#c4dcff; }
  .business-selector button:not([aria-pressed=true]):hover,.example-picker button:not([aria-pressed=true]):hover,.filter:not(.active):hover,.mobile-nav a:hover { background:#284564; color:#fff; border-color:#7e9bc0; }
  .round-button:not(:disabled):hover,.lab-close:hover { background:#d3e2ff; color:#183455; border-color:#d3e2ff; }
  .btn:not(:disabled):hover,.pro-action:hover,.primary-button:not(:disabled):hover,.secondary-button:not(:disabled):hover { box-shadow:0 5px 16px #193a6020; transform:translateY(-1px); }
}
@media(hover:none) {
  .button:hover,.demo-button:hover,.pro-action:hover,.btn:hover { transform:none; box-shadow:none; }
}
@media(max-width:600px) {
  html:has(.site-header) { scroll-padding-top:96px; }
  .business-selector { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .business-selector button { padding:10px; font-size:12px; }
  .text-link { font-size:13px; }
  .light-actions .text-link { justify-content:center; }
  .lab-close { font-size:12px; padding:9px 12px; }
  .inline-lab-heading { align-items:start; }
  .website-demo-toolbar button { padding:10px 12px; }
  .website-offer summary { grid-template-columns:minmax(0,1fr) 30px; }
  .video-toggle { min-width:88px; }
  .venue-nav button { padding:10px 8px; }
  .modal-bottom>.primary-button { flex:1 1 140px; }
  .btn.small { min-height:44px; }
  #app-dialog .modal-footer { bottom:-24px; }
}
@media(max-width:360px) {
  .site-header .brand { font-size:19px; }
  .site-header .brand-mark { width:27px; height:27px; margin-right:7px; }
  .site-header .header-cta { font-size:10px; padding:10px; }
  .site-header { gap:8px; }
  .device-switch { flex-wrap:nowrap; }
  .device-switch button { padding:10px 9px; font-size:11px; gap:6px; }
  .device-switch button svg { width:15px; }
  .website-demo-toolbar>div { display:flex; flex-wrap:wrap; gap:7px; }
  .workspace-tools { gap:5px; }
  .workspace-tools button { padding:8px; font-size:10px; }
  .venue-nav { gap:3px; }
  .venue-nav button { font-size:11px; padding:10px 7px; }
  .option-label b { font-size:11px; }
  .modal-bottom>.primary-button { flex-basis:100%; }
}
@media(prefers-reduced-motion:reduce) {
  .button,.demo-button,.pro-action,.btn,.primary-button,.secondary-button,.menu-toggle span { transition:none; }
}
