/* ============================================================================
   ADVANCED ROBOTIC SOLUTIONS — SITE WIDGET RAIL.
   AppWT Web & AI Solutions, 2026-09-25, Assistant 1, Leverage Department.

   THE RAIL, exactly as the AppWT build standard specifies it:
     ADA / accessibility   bottom LEFT   bottom:25px  left:20px
     back to top           bottom RIGHT  bottom:25px  right:20px
     translate             bottom RIGHT  bottom:85px  right:20px
     cookie consent        full-width banner, ONE include point
     under 480px: back-to-top 20, translate 74, right:12px, buttons 44px
   NO THEME TOGGLE. Removed from the AppWT standard 2026-09-14 and not re-added.
   The ADA panel's contrast, invert, saturation and reading modes are
   ACCESSIBILITY controls and they stay. They are not a theme switch.

   ⭐ THIS IS THE REAL IMPLEMENTATION, COPIED, NOT A REBUILD FROM A DESCRIPTION.
   The accessibility widget is prohoodclean.appwt.cc/includes/ada-widget.php
   byte for byte, with three kinds of change and no others:
     1. PALETTE. Its petrol #0B1F21 and brass #C8912F are repointed to THIS
        site's own tokens so the client keeps its own brand. Values only, never
        a selector or a rule.
     2. DELIVERY. See the CSP note below.
     3. IDENTITY. The accessibility statement names Advanced Robotic Solutions
        and carries ARS's phone and address, read from inc/config.php. It never
        hardcodes either one.

   ⛔ WHY THIS IS A FILE AND NOT A <style> BLOCK, AND WHY THAT IS NOT OPTIONAL.
   soon.arsrobots.com sends  style-src 'self'  with no 'unsafe-inline'. I did not
   assume what that does, I measured it against the live page: a <style> element
   created by script lands in the DOM, reports styleElInDom true, and its .sheet
   is NULL. The rules never apply. The console carries one refusal and the page
   answers 200 with every control present and every control inert.
   That is the worst failure shape there is - an accessibility tool that LOOKS
   installed. Adding 'unsafe-inline' would have made it work by switching the
   control off, so delivery moved instead: every rule is in this file, served
   from 'self', and every dynamic adjustment is a CSS CUSTOM PROPERTY set with
   documentElement.style.setProperty(), which I measured as ALLOWED under the
   same policy. Same behavior, same selectors, nothing weakened.
   Measured 2026-09-25: injected <style> BLOCKED · setProperty ALLOWED ·
   insertRule on a same-origin sheet ALLOWED · element.style ALLOWED.
   ============================================================================ */

/* Enhanced Accessibility Widget Styles */
:root {
    --ada-primary: #0E131C;   /* site petrol, was AppWT blue */
    --ada-secondary: var(--gold, #C4A052); /* site brass, was AppWT orange */
    --ada-text: #000000;
    --ada-bg: #FFFFFF;
    --ada-border: #2A3546;    /* site hairline */
    --ada-success: #155724;
    --ada-warning: #856404;
    --ada-danger: #721C24;
    --ada-info: #0C5460;
    --ada-dark: #000000;
    --ada-light: #FFFFFF;
}

/* ADA-FIX 4: a page marks its own fixed furniture (sticky header, side rail, chat launcher)
   with data-ada-exempt. A CSS filter or transform makes an element the containing block for its
   position:fixed descendants, which tears those elements out of the viewport. Filter and text
   metrics are reverted here; transform/scale deliberately are NOT, because the exempt element
   still has to travel with the scaled layout rather than float free of it. */
[data-ada-exempt],
[data-ada-exempt] * {
    filter: none !important;
    font-size: revert !important;
    line-height: revert !important;
    letter-spacing: revert !important;
}

/* ADA Widget - COMPLETELY IMMUNE TO ALL CHANGES */
.developed-by-appwt-llc-ada-widget,
.developed-by-appwt-llc-ada-widget * {
    transform: none !important;
    font-size: revert !important;
    line-height: revert !important;
    letter-spacing: revert !important;
    zoom: 1 !important;
    scale: 1 !important;
    filter: none !important;
}

/* Main Widget Container */
.developed-by-appwt-llc-ada-widget {
    position: fixed;
    bottom: 25px;
    left: 20px;
    z-index: 9999999;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}

/* Accessibility Button - 50px circle on all devices */
.developed-by-appwt-llc-ada-button {
    width: 50px !important;
    min-width: 50px !important;
    max-width: 50px !important;
    height: 50px !important;
    padding: 0 !important;
    border-radius: 50%;
    background: var(--gold, #C4A052);
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.6);
    transition: all 0.3s ease;
    outline: none;
}

.developed-by-appwt-llc-ada-button img,
.developed-by-appwt-llc-ada-button svg {
    width: 28px !important;
    height: 28px !important;
    max-width: 28px !important;
    border-radius: 0 !important;
}

.developed-by-appwt-llc-ada-button:hover,
.developed-by-appwt-llc-ada-button:focus {
    transform: scale(1.05);
    outline: none;
    box-shadow: 0 0 0 3px var(--paper, #07090C), 0 0 0 6px var(--gold, #C4A052), 0 6px 20px rgba(0, 0, 0, 0.7);
}

.developed-by-appwt-llc-ada-button svg {
    width: 28px;
    height: 28px;
    fill: #0A0A0A;
}

/* Main Panel - Opens ABOVE the button, scrollable content */
.developed-by-appwt-llc-ada-panel {
    position: fixed !important;
    left: 20px !important;
    right: auto !important;
    bottom: 85px !important;
    top: auto !important;
    width: 380px;
    max-width: calc(100vw - 40px);
    max-height: calc(100vh - 120px);
    background: var(--ada-bg);
    border: 2px solid var(--ada-primary);
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.3);
    display: none;
    overflow: hidden;
    animation: slideInUp 0.3s ease-out;
    z-index: 9999999 !important;
}

@keyframes slideInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.developed-by-appwt-llc-ada-panel.show {
    display: block;
}

/* Panel Header */
.developed-by-appwt-llc-ada-header {
    /* Tony 2026-08-23: header is WHITE. The close button and byline below were coloured for a dark
       band, so they move with it -- a white-on-white control is not a style slip, it is an
       accessibility control that has become invisible inside the accessibility widget. */
    background: #FFFFFF;
    color: var(--ada-primary);
    border-bottom: 2px solid var(--ada-secondary);
    padding: 15px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: sticky;
    top: 0;
    z-index: 10;
}

.developed-by-appwt-llc-ada-header h3 {
    margin: 0;
    font-size: 18px;
    font-weight: 600;
}

.developed-by-appwt-llc-ada-close {
    background: none;
    border: none;
    color: var(--ada-primary);
    font-size: 24px;
    cursor: pointer;
    padding: 0;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    transition: all 0.2s ease;
}

.developed-by-appwt-llc-ada-close:hover,
.developed-by-appwt-llc-ada-close:focus {
    background: rgba(255,255,255,0.2);
    outline: 2px solid var(--ada-secondary);
}

/* Panel Content - Scrollable with VISIBLE scrollbar */
.developed-by-appwt-llc-ada-content {
    height: auto;
    max-height: calc(100vh - 200px);
    overflow-y: scroll !important;
    overflow-x: hidden;
    padding: 0;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: var(--ada-primary) #E9ECEF;
}

/* Custom Scrollbar Styling - ALWAYS VISIBLE on all browsers */
.developed-by-appwt-llc-ada-content::-webkit-scrollbar {
    width: 12px !important;
    display: block !important;
}

.developed-by-appwt-llc-ada-content::-webkit-scrollbar-track {
    background: #E9ECEF !important;
    border-radius: 6px;
}

.developed-by-appwt-llc-ada-content::-webkit-scrollbar-thumb {
    background: var(--ada-primary) !important;
    border-radius: 6px;
    border: 2px solid #E9ECEF;
    min-height: 50px;
}

.developed-by-appwt-llc-ada-content::-webkit-scrollbar-thumb:hover {
    background: var(--ada-secondary) !important;
}

/* Force scrollbar visibility on iOS Safari */
.developed-by-appwt-llc-ada-content {
    scrollbar-width: auto;
    -ms-overflow-style: scrollbar;
}

/* MOBILE: Always show scrollbar track as visual indicator */
@media (max-width: 768px) {
    .developed-by-appwt-llc-ada-content {
        /* Add right padding to show scroll area */
        padding-right: 5px !important;
        /* Create visible scroll track effect */
        background:
            linear-gradient(to right, transparent calc(100% - 14px), #E9ECEF calc(100% - 14px)) !important;
    }

    .developed-by-appwt-llc-ada-content::-webkit-scrollbar {
        width: 14px !important;
        background: #E9ECEF !important;
    }

    .developed-by-appwt-llc-ada-content::-webkit-scrollbar-thumb {
        background: var(--ada-primary) !important;
        border: 3px solid #E9ECEF !important;
        border-radius: 7px !important;
        min-height: 60px !important;
    }
}

/* Tab Navigation */
.developed-by-appwt-llc-ada-tabs {
    display: flex;
    background: #E9ECEF;
    border-bottom: 1px solid var(--ada-border);
}

.developed-by-appwt-llc-ada-tab {
    flex: 1;
    background: none;
    border: none;
    padding: 12px 8px;
    cursor: pointer;
    font-size: 12px;
    font-weight: 500;
    color: var(--ada-text);
    transition: all 0.2s ease;
    text-align: center;
}

.developed-by-appwt-llc-ada-tab:hover,
.developed-by-appwt-llc-ada-tab:focus {
    background: var(--ada-light);
    outline: 2px solid var(--ada-secondary);
    outline-offset: -2px;
}

.developed-by-appwt-llc-ada-tab.active {
    background: var(--ada-secondary);
    color: #FFFFFF;
    font-weight: 600;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.5);
}

/* Tab Content - FIXED height for all tabs (ensures consistency) */
.developed-by-appwt-llc-ada-tab-content {
    padding: 20px;
    display: none;
    color: var(--ada-text);
    box-sizing: border-box;
}

.developed-by-appwt-llc-ada-tab-content.active {
    display: block;
}

.developed-by-appwt-llc-ada-tab-content span {
    color: var(--ada-text);
}

/* Section Headers */
.developed-by-appwt-llc-ada-section-header {
    font-size: 16px;
    font-weight: 600;
    color: var(--ada-primary);
    margin: 0 0 15px 0;
    padding-bottom: 8px;
    border-bottom: 2px solid var(--ada-border);
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Option Groups */
.developed-by-appwt-llc-ada-option-group {
    margin-bottom: 20px;
}

.developed-by-appwt-llc-ada-option-group:last-child {
    margin-bottom: 0;
}

/* Buttons and Controls */
.developed-by-appwt-llc-ada-option-btn {
    width: 100%;
    padding: 12px 16px;
    margin-bottom: 8px;
    background: var(--ada-light);
    color: var(--ada-text);
    border: 1px solid var(--ada-border);
    border-radius: 6px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    text-align: left;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.developed-by-appwt-llc-ada-option-btn:hover,
.developed-by-appwt-llc-ada-option-btn:focus {
    background: var(--ada-secondary);
    color: #FFFFFF;
    border-color: var(--ada-primary);
    outline: 2px solid var(--ada-primary);
    outline-offset: -2px;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.5);
}

.developed-by-appwt-llc-ada-option-btn.active {
    background: var(--ada-primary);
    color: var(--ada-light);
    border-color: var(--ada-primary);
}

/* Toggle Switch */
.developed-by-appwt-llc-ada-toggle {
    position: relative;
    width: 44px;
    height: 24px;
    background: #6C757D;
    border-radius: 12px;
    transition: all 0.3s ease;
    border: 1px solid var(--ada-border);
    cursor: pointer;
}

.developed-by-appwt-llc-ada-toggle::after {
    content: '';
    position: absolute;
    top: 2px;
    left: 2px;
    width: 20px;
    height: 20px;
    background: var(--ada-light);
    border-radius: 50%;
    transition: all 0.3s ease;
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
}

.developed-by-appwt-llc-ada-toggle.active {
    background: #28a745;
    border-color: #28a745;
}

.developed-by-appwt-llc-ada-toggle.active::after {
    left: 22px;
    transform: translateX(0);
}

/* Range Sliders */
.developed-by-appwt-llc-ada-slider-group {
    margin-bottom: 15px;
}

.developed-by-appwt-llc-ada-slider-label {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
    font-size: 14px;
    font-weight: 500;
    color: var(--ada-text);
}

.developed-by-appwt-llc-ada-slider {
    width: 100%;
    height: 6px;
    border-radius: 3px;
    background: var(--ada-border);
    outline: none;
    -webkit-appearance: none;
}

.developed-by-appwt-llc-ada-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--ada-primary);
    cursor: pointer;
    border: 2px solid var(--ada-light);
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
}

.developed-by-appwt-llc-ada-slider::-moz-range-thumb {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--ada-primary);
    cursor: pointer;
    border: 2px solid var(--ada-light);
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
}

/* Color Picker */
.developed-by-appwt-llc-ada-color-picker {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 8px;
    margin-top: 10px;
}

.developed-by-appwt-llc-ada-color-option {
    width: 40px;
    height: 40px;
    border-radius: 6px;
    cursor: pointer;
    border: 2px solid var(--ada-border);
    transition: all 0.2s ease;
}

.developed-by-appwt-llc-ada-color-option:hover,
.developed-by-appwt-llc-ada-color-option:focus {
    transform: scale(1.1);
    border-color: var(--ada-primary);
    outline: 2px solid var(--ada-secondary);
    outline-offset: 2px;
}

.developed-by-appwt-llc-ada-color-option.active {
    border-color: var(--ada-primary);
    box-shadow: 0 0 0 3px var(--ada-secondary);
}

/* Reset Button */
.developed-by-appwt-llc-ada-reset {
    width: 100%;
    padding: 12px;
    background: var(--ada-danger);
    color: var(--ada-light);
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    margin-top: 20px;
}

.developed-by-appwt-llc-ada-reset:hover,
.developed-by-appwt-llc-ada-reset:focus {
    background: #c82333;
    outline: 2px solid var(--ada-primary);
    outline-offset: 2px;
}

/* Profile Indicators */
.developed-by-appwt-llc-ada-profile-indicator {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--ada-success);
    margin-left: 8px;
    display: none;
}

.developed-by-appwt-llc-ada-option-btn.active .developed-by-appwt-llc-ada-profile-indicator {
    display: block;
}

/* Accessibility Classes for Applied Changes */
.ada-seizure-safe * {
    animation: none !important;
    transition: none !important;
}

.ada-seizure-safe video,
.ada-seizure-safe .gif,
.ada-seizure-safe [data-auto-play] {
    animation-play-state: paused !important;
}

.ada-stop-animations,
.ada-stop-animations * {
    animation: none !important;
    transition: none !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
}

.ada-vision-impaired {
    font-size: 1.2em !important;
    line-height: 1.6 !important;
    letter-spacing: 0.05em !important;
}

.ada-adhd-friendly {
    background: #f8f9fa !important;
    color: #212529 !important;
}

.ada-adhd-friendly a {
    text-decoration: underline !important;
    font-weight: bold !important;
}

.ada-cognitive-disability * {
    font-family: 'Arial', sans-serif !important;
    font-size: 1.1em !important;
    line-height: 1.8 !important;
}

/* IMPORTANT: Filter effects are applied via JavaScript to avoid breaking fixed positioning */
/* Do NOT apply filter directly to body - it creates a new stacking context that breaks position:fixed */

.ada-high-contrast-content {
    filter: contrast(150%) !important;
}

.ada-dark-mode {
    background: #161D29 !important;
    color: #ffffff !important;
}

.ada-dark-mode a {
    color: #66b3ff !important;
}

.ada-monochrome-content {
    filter: grayscale(100%) !important;
}

.ada-low-saturation-content {
    filter: saturate(0.5) !important;
}

.ada-high-saturation-content {
    filter: saturate(1.5) !important;
}

.ada-hide-images img,
.ada-hide-images [style*="background-image"] {
    opacity: 0 !important;
}

.ada-mute-sounds audio,
.ada-mute-sounds video {
    muted: true !important;
    volume: 0 !important;
}

.ada-big-cursor,
.ada-big-cursor * {
    cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><path d="M2 2l28 14-8-2-6 12-4-2 6-12-16-10z" fill="black"/></svg>') 16 16, auto !important;
}

.ada-big-white-cursor,
.ada-big-white-cursor * {
    cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><path d="M2 2l28 14-8-2-6 12-4-2 6-12-16-10z" fill="white" stroke="black" stroke-width="1"/></svg>') 16 16, auto !important;
}

.ada-highlight-links a {
    background: #ffeb3b !important;
    color: #000 !important;
    padding: 2px 4px !important;
    border-radius: 3px !important;
}

.ada-reading-guide {
    position: relative;
}

.ada-reading-guide::after {
    content: '';
    position: fixed;
    /* ADA-FIX 1: was top:0. updateReadingGuide() sets --reading-guide-top on every mousemove,
       but nothing ever read it, so the guide sat frozen at the top of the viewport. */
    top: var(--reading-guide-top, 0px);
    left: 0;
    right: 0;
    height: 3px;
    background: var(--ada-secondary);
    z-index: 9999;
    pointer-events: none;
    transition: top 0.1s ease;
}

.ada-reading-mask {
    position: relative;
}

.ada-reading-mask::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(transparent 45%, rgba(0,0,0,0.8) 50%, rgba(0,0,0,0.8) 55%, transparent 60%);
    z-index: 9998;
    pointer-events: none;
}

.ada-highlight-titles h1,
.ada-highlight-titles h2,
.ada-highlight-titles h3,
.ada-highlight-titles h4,
.ada-highlight-titles h5,
.ada-highlight-titles h6 {
    background: #e3f2fd !important;
    color: #1565c0 !important;
    padding: 4px 8px !important;
    border-radius: 4px !important;
    border-left: 4px solid #1565c0 !important;
}

.ada-text-magnifier {
    position: relative;
}

.ada-text-magnifier *:hover {
    font-size: 1.2em !important;
    background: rgba(255, 235, 59, 0.3) !important;
    padding: 2px 4px !important;
    border-radius: 3px !important;
    transition: all 0.2s ease !important;
}

.ada-keyboard-navigation *:focus {
    outline: 3px solid #F4A261 !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 5px rgba(255, 90, 92, 0.3) !important;
}

/* Responsive Design */

/* Tablet specific styles (481px - 1024px) */
@media (min-width: 481px) and (max-width: 1024px) {
    .developed-by-appwt-llc-ada-widget {
        bottom: 20px !important;
        left: 20px !important;
    }

    .developed-by-appwt-llc-ada-button {
        width: 50px !important;
        height: 50px !important;
        border-width: 3px;
    }

    .developed-by-appwt-llc-ada-panel {
        width: 340px !important;
        max-width: calc(100vw - 40px) !important;
        max-height: calc(100vh - 220px) !important;
        left: 15px !important;
        right: auto !important;
        bottom: 80px !important;
        top: auto !important;
        border-radius: 12px;
    }

    .developed-by-appwt-llc-ada-content {
        height: auto !important;
        max-height: calc(100vh - 320px) !important;
        overflow-y: auto !important;
    }

    .developed-by-appwt-llc-ada-tab {
        padding: 10px 6px;
        font-size: 12px;
    }

    /* Better touch targets for tablets */
    .developed-by-appwt-llc-ada-button,
    .developed-by-appwt-llc-ada-tab,
    .developed-by-appwt-llc-ada-color-option,
    .developed-by-appwt-llc-ada-toggle {
        cursor: pointer;
        -webkit-tap-highlight-color: transparent;
    }
}

/* Mobile styles (480px and below) */
@media (max-width: 480px) {
    .developed-by-appwt-llc-ada-widget {
        bottom: 70px !important;
        left: 12px !important;
    }

    .developed-by-appwt-llc-ada-button {
        width: 44px !important;
        min-width: 44px !important;
        max-width: 44px !important;
        height: 44px !important;
        min-height: 44px !important;
        max-height: 44px !important;
    }

    .developed-by-appwt-llc-ada-button svg {
        width: 22px !important;
        height: 22px !important;
    }

    /* Panel opens ABOVE button on mobile - near full width */
    .developed-by-appwt-llc-ada-panel {
        width: calc(100vw - 30px) !important;
        max-width: none !important;
        left: 15px !important;
        right: 15px !important;
        bottom: 75px !important;
        top: auto !important;
        max-height: calc(100vh - 220px) !important;
        border-radius: 12px;
    }

    /* Content area with visible scrollbar */
    .developed-by-appwt-llc-ada-content {
        height: auto !important;
        max-height: calc(100vh - 320px) !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
    }

    .developed-by-appwt-llc-ada-tabs {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 4px;
        padding: 8px;
        background: #E9ECEF;
    }

    .developed-by-appwt-llc-ada-tab {
        padding: 8px 4px;
        font-size: 11px;
    }

    .developed-by-appwt-llc-ada-slider {
        width: 100%;
        height: 8px;
        border-radius: 4px;
    }

    .developed-by-appwt-llc-ada-slider::-webkit-slider-thumb {
        width: 24px;
        height: 24px;
        border: 3px solid var(--ada-light);
    }

    .developed-by-appwt-llc-ada-slider::-moz-range-thumb {
        width: 24px;
        height: 24px;
        border: 3px solid var(--ada-light);
    }

    .developed-by-appwt-llc-ada-color-picker {
        grid-template-columns: repeat(6, 1fr);
        gap: 6px;
    }

    .developed-by-appwt-llc-ada-color-option {
        width: 32px;
        height: 32px;
    }

    .developed-by-appwt-llc-ada-toggle {
        width: 44px;
        height: 24px;
    }

    .developed-by-appwt-llc-ada-toggle::after {
        width: 20px;
        height: 20px;
        top: 2px;
        left: 2px;
    }

    .developed-by-appwt-llc-ada-toggle.active::after {
        left: 22px;
    }
}

/* Desktop screens (1024px and up) - Consistent tab heights */
@media (min-width: 1024px) {
    .developed-by-appwt-llc-ada-panel {
        width: 380px !important;
        max-height: calc(100vh - 120px) !important;
        bottom: 85px !important;
        top: auto !important;
    }

    .developed-by-appwt-llc-ada-content {
        height: auto !important;
        max-height: calc(100vh - 200px) !important;
        overflow-y: auto !important;
    }

    /* CONSISTENT TAB HEIGHT - All tabs same height on desktop */
    .developed-by-appwt-llc-ada-tab-content {
        min-height: 480px !important;
        max-height: 560px !important;
        overflow-y: auto !important;
    }
}

/* Large desktop screens (1367px - 1920px) */
@media (min-width: 1367px) and (max-width: 1920px) {
    .developed-by-appwt-llc-ada-panel {
        width: 400px !important;
    }

    .developed-by-appwt-llc-ada-tab-content {
        min-height: 500px !important;
        max-height: 600px !important;
    }
}

/* Extra large / 4K screens (1921px+) */
@media (min-width: 1921px) {
    .developed-by-appwt-llc-ada-panel {
        width: 420px !important;
    }

    .developed-by-appwt-llc-ada-tab-content {
        min-height: 520px !important;
        max-height: 650px !important;
    }
}


/* Accessibility Statement Modal Styles */
.developed-by-appwt-llc-ada-statement-modal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9999999;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.developed-by-appwt-llc-ada-statement-modal.active {
    display: flex;
    align-items: center;
    justify-content: center;
}

.developed-by-appwt-llc-ada-statement-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.8);
    backdrop-filter: blur(5px);
}

.developed-by-appwt-llc-ada-statement-content {
    position: relative;
    background: linear-gradient(135deg, #0E131C 0%, #161D29 100%);
    border-radius: 20px;
    max-width: 800px;
    width: 90%;
    max-height: 85vh;
    overflow-y: auto;
    box-shadow: 0 25px 80px rgba(0, 0, 0, 0.5);
    border: 1px solid rgba(244, 162, 97, 0.3);
}

.developed-by-appwt-llc-ada-statement-close {
    position: absolute;
    top: 15px;
    right: 20px;
    background: rgba(255, 255, 255, 0.1);
    border: none;
    color: #C4A052;
    font-size: 2rem;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

.developed-by-appwt-llc-ada-statement-close:hover {
    background: #F4A261;
    color: #0E131C;
    transform: rotate(90deg);
}

.developed-by-appwt-llc-ada-statement-header {
    text-align: center;
    padding: 2rem 2rem 1rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.developed-by-appwt-llc-ada-statement-body {
    padding: 1.5rem 2rem 2rem;
}

.developed-by-appwt-llc-ada-statement-section {
    margin-bottom: 1.5rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.developed-by-appwt-llc-ada-statement-section:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}

.developed-by-appwt-llc-ada-statement-section h3 {
    color: #C4A052;
    font-size: 1.2rem;
    margin: 0 0 0.75rem 0;
    font-weight: 600;
}

.developed-by-appwt-llc-ada-statement-section p {
    color: #E9ECEF;
    line-height: 1.7;
    margin: 0 0 0.75rem 0;
}

.developed-by-appwt-llc-ada-statement-section p:last-child {
    margin-bottom: 0;
}

.developed-by-appwt-llc-ada-statement-section ul {
    color: #E9ECEF;
    margin: 0;
    padding-left: 1.5rem;
    line-height: 1.8;
}

.developed-by-appwt-llc-ada-statement-section li {
    margin-bottom: 0.4rem;
}

.developed-by-appwt-llc-ada-statement-contact {
    background: rgba(244, 162, 97, 0.1);
    padding: 1rem;
    border-radius: 10px;
    border-left: 4px solid #F4A261;
    margin-top: 0.75rem;
}

.developed-by-appwt-llc-ada-statement-contact p {
    margin-bottom: 0.5rem;
}

.developed-by-appwt-llc-ada-statement-contact p:last-child {
    margin-bottom: 0;
}

.developed-by-appwt-llc-ada-statement-contact a {
    color: #C4A052;
    text-decoration: none;
}

.developed-by-appwt-llc-ada-statement-contact a:hover {
    text-decoration: underline;
}

/* Mobile responsive for modal */
@media (max-width: 600px) {
    .developed-by-appwt-llc-ada-statement-content {
        width: 95%;
        max-height: 90vh;
        border-radius: 15px;
    }

    .developed-by-appwt-llc-ada-statement-header {
        padding: 1.5rem 1.5rem 1rem;
    }

    .developed-by-appwt-llc-ada-statement-body {
        padding: 1rem 1.5rem 1.5rem;
    }

    .developed-by-appwt-llc-ada-statement-close {
        top: 10px;
        right: 15px;
        width: 40px;
        height: 40px;
        font-size: 1.5rem;
    }
}


/* ============================================================================
   PART 2 — THE RULES THAT REPLACE THE SEVEN INJECTED <style> ELEMENTS.
   Each one is the SAME selector and the SAME declaration the original shipped.
   What changed is where the number comes from: a CSS custom property that the
   script sets with documentElement.style.setProperty(), which this host's CSP
   allows, instead of a <style> element, which it refuses.

   ⭐ EVERY RULE IS GATED ON A FLAG CLASS, AND THAT IS NOT TIDINESS.
   transform:scale(1) is not a no-op. An element with ANY transform becomes the
   containing block for its position:fixed descendants, so an ungated
   transform:scale(var(--ada-content-scale,1)) on every child of body would tear
   the fixed header, the widget rail and the consent banner out of the viewport
   on every page view, for every visitor, whether or not anybody ever opened the
   accessibility panel. The same is true of filter:saturate(1). The flag class is
   what keeps the rule from existing at all until the visitor asks for it.
   The original had this property for free because the <style> element did not
   exist until the control was used. Reproducing that is the whole job here.
   ============================================================================ */

html.ada-scale-on body > *:not(.developed-by-appwt-llc-ada-widget):not([data-ada-exempt]){
  transform:scale(var(--ada-content-scale,1)) !important;
  transform-origin:top left !important;
}
html.ada-scale-on .developed-by-appwt-llc-ada-widget,
html.ada-scale-on .developed-by-appwt-llc-ada-widget *{
  transform:none !important;font-size:revert !important;
  line-height:revert !important;letter-spacing:revert !important;
}

/* ADA-FIX 3 is preserved: scale ONCE at the root. Setting font-size on every
   descendant with a multiple of 1em compounds at each level of nesting, which
   turned 16px into 410px nine levels deep at a 150% setting. */
html.ada-font-on{font-size:calc(100% * var(--ada-font-scale,1)) !important}
html.ada-font-on .developed-by-appwt-llc-ada-widget,
html.ada-font-on .developed-by-appwt-llc-ada-widget *{font-size:revert !important}

html.ada-lh-on body *:not(.developed-by-appwt-llc-ada-widget):not(.developed-by-appwt-llc-ada-widget *){
  line-height:var(--ada-line-height,1.4) !important}
html.ada-lh-on .developed-by-appwt-llc-ada-widget,
html.ada-lh-on .developed-by-appwt-llc-ada-widget *{line-height:revert !important}

html.ada-ls-on body *:not(.developed-by-appwt-llc-ada-widget):not(.developed-by-appwt-llc-ada-widget *){
  letter-spacing:var(--ada-letter-spacing,0px) !important}
html.ada-ls-on .developed-by-appwt-llc-ada-widget,
html.ada-ls-on .developed-by-appwt-llc-ada-widget *{letter-spacing:revert !important}

html.ada-sat-on body > *:not(.developed-by-appwt-llc-ada-widget):not([data-ada-exempt]){
  filter:saturate(var(--ada-saturate,1)) !important}

html.ada-custom-text-on *{color:var(--ada-custom-text) !important}
html.ada-custom-bg-on body,html.ada-custom-bg-on *{background-color:var(--ada-custom-bg) !important}
/* The widget itself must stay legible while a visitor is choosing those colors. */
html.ada-custom-text-on .developed-by-appwt-llc-ada-widget *,
html.ada-custom-bg-on .developed-by-appwt-llc-ada-widget *{color:revert !important;background-color:revert !important}

.ada-keyboard-navigation *:focus{outline:3px solid var(--ada-secondary) !important;outline-offset:2px !important}
.ada-keyboard-navigation .developed-by-appwt-llc-ada-button:focus{outline:none !important;box-shadow:0 0 0 3px var(--paper, #07090C), 0 0 0 6px var(--gold, #C4A052), 0 6px 20px rgba(0, 0, 0, 0.7) !important}

html.ada-no-motion *,html.ada-no-motion *::before,html.ada-no-motion *::after{
  animation-duration:.01ms !important;animation-iteration-count:1 !important;
  transition-duration:.01ms !important;scroll-behavior:auto !important}

/* ============================================================================
   PART 3 — THE TEN style="..." ATTRIBUTES THAT WERE IN THE MARKUP.
   A style ATTRIBUTE is inline style too. Under style-src 'self' each one is
   refused exactly like the <style> elements were, so the panel would have
   shipped with its heading unstyled and its reset button unpainted. Same
   declarations, now class-bound.
   ============================================================================ */
.ada-a-brandline{font-size:11px;color:#8B9AAC;margin-top:2px}
.ada-a-h{margin:0;font-size:18px}
.ada-a-row{display:flex;gap:8px;align-items:center}
.ada-a-accent{color:var(--ada-secondary)}
.ada-a-statement-h{color:var(--ada-secondary);margin:0 0 .5rem 0;font-size:1.8rem}
.ada-a-statement-p{color:#E9ECEF;margin:0;opacity:.9}
.ada-a-bigicon{font-size:3rem;margin-bottom:.5rem}
.ada-a-resetrow{justify-content:center;margin-top:15px;border-top:1px solid var(--ada-border);padding-top:15px}
.ada-a-resetbtn{background:var(--ada-danger);color:#FFFFFF;border:none;padding:6px 12px;
  border-radius:4px;font-size:12px;cursor:pointer;min-height:44px}

/* ============================================================================
   PART 4 — THE BOTTOM-RIGHT RAIL: back to top, then translate above it.
   Geometry is the AppWT standard. The circle is the one place --r-round rather
   than the site's 2px machined corner is correct, because the rail is shared
   furniture across every AppWT site and a visitor should recognize it.
   Colors are driven from THIS site's tokens so the client keeps its own brand.
   ============================================================================ */
.ars-rail-btn{
  position:fixed;right:20px;z-index:9999990;
  width:50px;height:50px;border-radius:var(--r-round,9999px);
  display:flex;align-items:center;justify-content:center;cursor:pointer;
  border:1px solid var(--gold,#C4A052);
  background:var(--paper-2,#0E131C);color:var(--gold,#C4A052);
  box-shadow:0 4px 18px rgba(0,0,0,.6);
  transition:transform .2s ease,box-shadow .2s ease,background .2s ease}
.ars-rail-btn:hover{transform:scale(1.06);background:var(--paper-3,#161D29);
  box-shadow:0 8px 24px rgba(0,0,0,.7)}
.ars-rail-btn:focus-visible{outline:3px solid var(--gold,#C4A052);outline-offset:3px}
#ars-top{bottom:calc(25px + var(--consent-h,0px));display:none}
#ars-translate{bottom:calc(25px + var(--consent-h,0px))} /* repair drew-ars-1019r: the page has no back-to-top button, so translate takes its slot (was 85px/74px) and clears content above the consent bar */

#ars-translate-panel{
  position:fixed;right:20px;bottom:calc(85px + var(--consent-h,0px));z-index:9999991;
  width:280px;display:none;background:var(--paper-2,#0E131C);
  border:1px solid var(--line-2,#2A3546);border-radius:var(--r-sm,2px);
  box-shadow:0 10px 40px rgba(0,0,0,.7);overflow:hidden}
#ars-translate-panel .hd{padding:12px 16px;background:rgba(196,160,82,.12);
  border-bottom:1px solid var(--line-2,#2A3546);display:flex;justify-content:space-between;
  align-items:center;color:var(--gold,#C4A052);font-weight:650;font-size:.9rem}
#ars-translate-panel .hd button{background:none;border:0;color:var(--ink,#F4F7FA);font-size:20px;
  cursor:pointer;line-height:1;min-width:44px;min-height:44px}
#ars-translate-panel .bd{padding:16px}
#ars-translate-panel select{width:100%;padding:12px 14px;font-size:16px;border-radius:var(--r-sm,2px);
  border:1px solid var(--line-2,#2A3546);background:var(--paper,#080B11);
  color:var(--ink,#F4F7FA);cursor:pointer;min-height:48px}
#ars-translate-panel label.sr{position:absolute;left:-9999px}

/* ⛔ NO THEME TOGGLE. Removed from the AppWT standard 2026-09-14 and not re-added.
   Nothing here sets data-theme and there is no rule keyed on it. */

/* ============================================================================
   PART 5 — COOKIE CONSENT. One banner, one include point, full width.

   ⭐⭐ IT CANNOT COVER A CALL TO ACTION, AND THAT IS STRUCTURAL RATHER THAN A
   CAREFUL CHOICE OF HEIGHT. An opaque 140px consent bar once covered Add to
   Cart on a live store while a paid ad was running, and the visibility check
   called the button visible because getBoundingClientRect describes the ELEMENT
   and knows nothing about the stack above it.
   The fix here is that the banner MEASURES ITSELF and publishes its height as
   --consent-h, and this sheet reserves exactly that much room at the bottom of
   the document and lifts the rail by the same amount. There is no height at
   which the banner overlaps page content, because the content ends above it.
   Proven with document.elementFromPoint on the center of the hero CTA, which is
   the only question that actually answers "is it covered".
   ============================================================================ */
body{padding-bottom:var(--consent-h,0px)}

.ars-consent{position:fixed;left:0;right:0;bottom:0;z-index:9999995;
  background:var(--night,#04060A);border-top:1px solid var(--gold,#C4A052);
  box-shadow:0 -10px 40px rgba(0,0,0,.6);
  font-family:var(--body,system-ui,sans-serif);color:var(--ink-2,#C9D4E0);
  display:none}
.ars-consent[data-open="1"]{display:block}
.ars-consent-in{max-width:var(--wrap,1280px);margin:0 auto;padding:18px var(--gut,20px);
  display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px}
.ars-consent-tx{flex:1 1 380px;min-width:0;font-size:14.5px;line-height:1.65;margin:0}
.ars-consent-tx a{color:var(--gold,#C4A052);text-decoration:underline;text-underline-offset:3px}
.ars-consent-acts{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.ars-consent-btn{display:inline-flex;align-items:center;justify-content:center;
  min-height:44px;padding:11px 20px;font-size:14.5px;font-weight:600;cursor:pointer;
  border-radius:var(--r-sm,2px);border:1px solid var(--line-2,#2A3546);
  background:transparent;color:var(--ink,#F4F7FA);font-family:inherit;
  transition:border-color .2s ease,background .2s ease,color .2s ease}
.ars-consent-btn:hover{border-color:var(--gold,#C4A052);color:var(--gold,#C4A052)}
.ars-consent-btn.is-primary{background:var(--gold,#C4A052);border-color:var(--gold,#C4A052);
  color:var(--paper,#080B11)}
.ars-consent-btn.is-primary:hover{background:var(--gold-dk,#D8B96E);border-color:var(--gold-dk,#D8B96E);
  color:var(--paper,#080B11)}
.ars-consent-btn:focus-visible{outline:3px solid var(--gold,#C4A052);outline-offset:3px}

.ars-consent-prefs{display:none;border-top:1px solid var(--line,#1C2533);
  max-width:var(--wrap,1280px);margin:0 auto;padding:18px var(--gut,20px)}
.ars-consent[data-prefs="1"] .ars-consent-prefs{display:block}
.ars-consent-cats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:0 0 16px}
.ars-consent-cat{border:1px solid var(--line,#1C2533);border-radius:var(--r-sm,2px);
  padding:14px;background:var(--paper-2,#0E131C)}
.ars-consent-cat label{display:flex;align-items:center;gap:10px;min-height:44px;
  font-weight:600;font-size:14.5px;color:var(--ink,#F4F7FA);cursor:pointer}
.ars-consent-cat input{width:20px;height:20px;accent-color:var(--gold,#C4A052);cursor:pointer}
.ars-consent-cat input:disabled{cursor:not-allowed;opacity:.65}
.ars-consent-cat p{margin:6px 0 0;font-size:13px;line-height:1.6;color:var(--mute,#8B9AAC)}

@media (max-width:900px){ .ars-consent-cats{grid-template-columns:1fr 1fr} }
@media (max-width:640px){
  .ars-consent-cats{grid-template-columns:1fr}
  .ars-consent-acts{width:100%}
  .ars-consent-btn{flex:1 1 auto}
}

/* ============================================================================
   PART 6 — THE SUB-480 GEOMETRY THE STANDARD NAMES, PLUS THE ADA BUTTON.
   back-to-top 20 · translate 74 · right 12 · 44px buttons.
   ============================================================================ */
@media (max-width:480px){
  .ars-rail-btn{right:12px;width:44px;height:44px}
  #ars-top{bottom:calc(20px + var(--consent-h,0px))}
  #ars-translate{bottom:calc(20px + var(--consent-h,0px))}
  #ars-translate-panel{right:12px;bottom:calc(72px + var(--consent-h,0px));
    width:calc(100vw - 24px);max-width:280px}
}
/* ⚠ THE LIFT GOES ON THE CONTAINER, NOT ON THE BUTTON, AND I HAD IT WRONG.
   I first wrote these rules against .developed-by-appwt-llc-ada-button, which is
   the element you can see. It is not the element that is positioned: the BUTTON
   is static inside .developed-by-appwt-llc-ada-widget, and the WIDGET is the
   position:fixed one at bottom 25px / left 20px. Offsetting a static element's
   `bottom` does nothing at all.
   Nothing reported it. The button still measured 44px, still sat bottom left,
   and the elementFromPoint assertion still returned CLEAR for it, because the
   widget's z-index is 9999999 against the banner's 9999995 so the button paints
   ON TOP. It was CLEAR and it was sitting over the banner's Privacy Policy link.
   Found by looking at the screenshot. The coverage test was answering a true
   question about the wrong element. */
.developed-by-appwt-llc-ada-widget{bottom:calc(25px + var(--consent-h,0px)) !important}
.developed-by-appwt-llc-ada-panel{bottom:calc(85px + var(--consent-h,0px)) !important}
@media (max-width:480px){
  .developed-by-appwt-llc-ada-widget{left:12px !important;bottom:calc(20px + var(--consent-h,0px)) !important}
  .developed-by-appwt-llc-ada-panel{left:12px !important}
}
@media (prefers-reduced-motion:reduce){
  .ars-rail-btn,.ars-consent-btn{transition:none}
}

/* ============================================================================
   PART 7 — THE TWO ODDS AND ENDS.
   ============================================================================ */
/* Google's translate host element. It was style="display:none" in the original,
   which style-src 'self' refuses, so it is a class. */
.ada-a-hidden{display:none}

/* ⭐ THE BACK-TO-TOP BUTTON THIS SITE ALREADY SHIPS, ADOPTED INTO THE RAIL.
   inc/chrome-footer.php renders #toTop and assets/js/motion.js drives it. A
   second button from this rail would have put two working back-to-top controls
   in one corner, so the existing one is given the standard rail geometry here
   instead. These declarations load after assets/css/site.css and supersede its
   .to-top block. Nothing was removed from either file. */
.to-top{right:20px;bottom:calc(25px + var(--consent-h,0px));width:50px;height:50px;
  border-radius:var(--r-round,9999px);border:1px solid var(--gold,#C4A052);
  background:var(--paper-2,#0E131C);color:var(--gold,#C4A052);
  box-shadow:0 4px 18px rgba(0,0,0,.6);z-index:9999990}
.to-top:hover{border-color:var(--gold-dk,#D8B96E);background:var(--paper-3,#161D29);
  color:var(--gold-dk,#D8B96E)}
.to-top:focus-visible{outline:3px solid var(--gold,#C4A052);outline-offset:3px}
@media (max-width:480px){
  .to-top{right:12px;bottom:calc(20px + var(--consent-h,0px));width:44px;height:44px}
}

/* ============================================================================
   PART 8 — THE CONSENT BANNER COVERED THE HERO CTA AT 390px. MEASURED, FIXED,
   AND THE FIX IS STRUCTURAL RATHER THAN A SMALLER HEIGHT.

   WHAT I GOT WRONG THE FIRST TIME, WRITTEN DOWN BECAUSE IT IS THE INTERESTING
   PART. I reserved the banner's height as padding at the BOTTOM OF THE
   DOCUMENT and called the problem solved. That guarantee is real but it is the
   wrong guarantee: it stops the last element on the page being cut off, and it
   does nothing at all about a FIXED bar sitting over whatever happens to be at
   that screen position in the FIRST viewport. document.elementFromPoint on the
   center of the hero CTA returned P.ars-consent-tx at 390px. Measured overlap
   64px: CTA bottom 650, banner top 586, banner height 258 of an 844px screen.
   getBoundingClientRect had called that button perfectly visible the whole time,
   because it describes the element and knows nothing about the stack above it.

   TWO CHANGES, AND BOTH ARE NEEDED.
   1. STRUCTURAL: every full-height hero reserves the banner's own measured
      height at its foot, so its content is laid out above the bar at EVERY
      width rather than at the width somebody happened to open. --consent-h is
      0px once consent is given, so the hero returns to its full height and
      nothing is permanently shortened for a visitor who already answered.
   2. SIZE: the banner was 258px on an 844px screen, 31% of the viewport. The
      copy is shorter and the buttons hold one row, which is worth doing on its
      own merits even with the structural fix in place.
   ============================================================================ */
.hero{padding-bottom:calc(var(--s6) + var(--consent-h,0px))}
@media (max-width:900px){ .hero{padding-bottom:calc(var(--s5) + var(--consent-h,0px))} }
.scroll-cue{bottom:calc(26px + var(--consent-h,0px))}
html{scroll-padding-bottom:calc(var(--consent-h,0px) + 16px)}

/* The two policy links, now their own row and a real 44px target each. */
.ars-consent-links{margin:0;display:flex;flex-wrap:wrap;gap:0 22px;flex:1 1 100%}
.ars-consent-links a{display:inline-flex;align-items:center;min-height:44px;
  color:var(--gold,#C4A052);font-size:14px;text-decoration:underline;text-underline-offset:3px}
.ars-consent-links a:hover{color:var(--gold-dk,#D8B96E)}

@media (max-width:640px){
  .ars-consent-in{padding:8px var(--gut,20px);gap:2px 14px}
  .ars-consent-tx{flex:1 1 100%;font-size:13.5px;line-height:1.55}
  .ars-consent-links{gap:0 18px}
  .ars-consent-links a{min-height:44px;font-size:13px}
  .ars-consent-prefs{padding:12px var(--gut,20px)}
  /* One row of three. flex:1 1 0 with a 0 basis is what keeps them on one line;
     flex:1 1 auto sizes from the text and wraps "Preferences" onto its own row,
     which is what made the action block 98px tall. */
  .ars-consent-btn{flex:1 1 0;min-width:0;padding:11px 8px;font-size:13.5px}
}

/* ⭐ AND A CAP, SO THIS CANNOT COME BACK THE NEXT TIME SOMEBODY EDITS THE COPY.
   Shortening the sentence fixed the overlap TODAY. It is not a guarantee: the
   next person to add a clause to that paragraph re-creates the defect, and the
   measurement that would catch it is one nobody runs by habit. The banner is
   capped at 24% of the viewport height, which is true for any copy anyone ever
   puts in it. It scrolls inside itself past that rather than growing, and the
   Accept button stays reachable because elementFromPoint is asserted on it too,
   not only on the page's CTA.
   A cap at 24vh of an 844px screen is 202px. Measured height with the current
   copy is well under that, so nothing scrolls today and the cap is a backstop
   rather than a mechanism the visitor ever meets. */
@media (max-width:640px){
  .ars-consent{max-height:24vh;overflow-y:auto;overscroll-behavior:contain}
  .ars-consent[data-prefs="1"]{max-height:76vh}
}

/* ============================================================================
   PART 9 — TRIMMING THE BANNER WAS NOT A FIX, AND THE TEST PROVED IT.
   I shortened the copy until the hero CTA cleared the bar at 390x844, measured
   14px of clearance, and that looked like a pass. Then I ran the same
   elementFromPoint assertion at SEVEN viewport sizes instead of one:

     390x844  CLEAR      390x667  COVERED      360x740  COVERED
     414x896  CLEAR      768x1024 CLEAR        1440x900 CLEAR
     1280x720 COVERED

   FOUR OF SEVEN. Every one of the failures is a SHORT viewport, and not one of
   them is exotic: 667 is an iPhone SE, 740 is an ordinary Android, and 720 is a
   laptop. Trimming pixels off a bar only ever moves the width at which it
   breaks. The bar's height barely changed across those runs (160 to 182); what
   changed is how much room the hero needed, and a fixed overlay does not know
   or care.

   THE TWO CHANGES THAT ARE ACTUALLY STRUCTURAL:
   1. THE BANNER IS ONE ROW ON ANYTHING WIDER THAN A PHONE. The policy links
      were taking a full row of their own at every width, which is what made the
      desktop bar 182px tall for four short lines of content. Inline, it is
      about 80px, and 80px of a 720px laptop is a band the hero was never
      competing for.
   2. THE MOBILE HERO PUTS ITS CALL TO ACTION ABOVE THE FOLD. A hero whose only
      button sits 587px down a 667px screen is a weak hero with or without a
      consent bar, and the honest reading of these measurements is that the
      mobile hero was already too tall and the banner only made it visible. The
      type scale, the top padding and the gaps come in on phones so the button
      lands in the upper part of the screen, where it belongs.
   ============================================================================ */

/* 1. ONE ROW ABOVE 640px. The 100% basis is now scoped to phones only. */
.ars-consent-links{flex:0 1 auto}
@media (max-width:640px){ .ars-consent-links{flex:1 1 100%} }

/* 2. THE MOBILE HERO. Nothing is removed, everything is scaled. */
@media (max-width:640px){
  .hero{padding-top:118px}
  .hero .s-label{font-size:11px;letter-spacing:.2em;margin-bottom:10px}
  .h-hero{font-size:clamp(1.55rem,7.2vw,2.4rem)}
  .hero .lede-hero{font-size:1rem;line-height:1.6;margin-top:14px}
  .hero-acts{margin-top:22px}
  .hero-alt{margin-top:10px}
  .spec{margin-top:28px;padding-top:16px}
  .spec li{font-size:11px}
}

/* ============================================================================
   PART 10 — THE SECOND ROUND, AND THE INSTRUMENT THAT WAS MISSING.
   After Part 9 the primary CTA was clear at all seven sizes and the SECONDARY
   action under it, "See the seven capabilities", was still covered at 390x667
   and 1280x720. That link is a call to action as much as the button is, and
   "the button is clear" is not the claim that was asked for.

   Both failures are SHORT viewports, and every rule I had written was keyed on
   WIDTH. A 1280x720 laptop is a wide screen with a short one's problem, and no
   width breakpoint can see that. These are keyed on height, which is the
   dimension that was actually varying.
   ============================================================================ */
@media (max-height:780px){
  .hero{padding-top:140px;min-height:min(78vh,760px)}
  .hero-acts{margin-top:26px}
  .hero-alt{margin-top:6px}
  .spec{margin-top:24px;padding-top:16px}
  .hero-sub{min-height:min(52vh,460px)}
  .legal{padding-top:150px}
}
@media (max-height:700px) and (max-width:640px){
  .hero{padding-top:100px}
  .h-hero{font-size:clamp(1.4rem,6.6vw,2rem)}
  .hero .lede-hero{font-size:.95rem;line-height:1.55;margin-top:12px}
  .spec{margin-top:18px}
}

/* ============================================================================
   PART 11 — SEVEN DEFECTS INSIDE THE ACCESSIBILITY WIDGET ITSELF.
   Found by opening the panel, walking all four tabs, and computing the real
   contrast ratio of every text node against its real painted background plus
   the rendered height of every control. Not by reading the CSS.

   AN ACCESSIBILITY TOOL THAT FAILS ITS OWN CHECKS IS WORSE THAN NOT SHIPPING
   ONE, because it is the thing a visitor reaches for when the page has already
   let them down. Three of these are contrast, four are target size.

     H3 "Accessibility"        1.08:1   near-white on the white header
     "by Advanced Robotic..."  2.87:1
     active tab label          2.47:1   white on champagne
     close button              30px
     four tab buttons          39px
     six profile buttons       41px
     five range sliders        6px

   ⚠ THE FIRST THREE ARE MINE AND THE LAST FOUR ARE NOT.
   The contrast failures are a direct consequence of this site turning dark. The
   panel is a LIGHT panel on purpose, and it inherited h3 colors from the page,
   which used to be near-black and is now near-white. The sizes were already
   like that in the implementation this was copied from, so the same four are
   live on every AppWT site carrying this widget today. Reported, not just
   patched here.

   ⚠ WHY EVERY font-size BELOW CARRIES !important. The widget declares
   `.developed-by-appwt-llc-ada-widget * { font-size: revert !important }` so it
   cannot be resized by its own content-scale control. An author !important
   declaration also beats an inline style attribute, so the original's
   style="font-size:11px" was being reverted too and always had been. Matching
   the !important is the only way a size inside this panel means anything.
   ============================================================================ */

/* 1-2. The header sits on #FFFFFF, so its type is stated against #FFFFFF. */
.developed-by-appwt-llc-ada-header .ada-a-h{
  color:#111827 !important;font-size:18px !important;font-weight:600}
.developed-by-appwt-llc-ada-header .ada-a-brandline{
  color:#4B5563 !important;font-size:11px !important}

/* 3. The active tab is champagne. White measures 2.47:1 on it; near-black is 7.9:1. */
.developed-by-appwt-llc-ada-tab.active,
.developed-by-appwt-llc-ada-tab[aria-selected="true"]{color:#0E131C !important}
.developed-by-appwt-llc-ada-tabs .developed-by-appwt-llc-ada-tab.active{color:#0E131C !important}

/* 4. The close control. A 30px box on the ONE control that dismisses the panel. */
.developed-by-appwt-llc-ada-close{
  min-width:44px !important;min-height:44px !important;
  display:inline-flex !important;align-items:center;justify-content:center}

/* 5. The four tabs. */
.developed-by-appwt-llc-ada-tab{min-height:44px !important;display:inline-flex !important;
  align-items:center;justify-content:center}

/* 6. The profile and feature buttons. */
.developed-by-appwt-llc-ada-option-btn{min-height:44px !important;display:flex !important;
  align-items:center}

/* 7. THE SLIDERS WERE A 6px TARGET. The track stays 6px because that is what the
   control should LOOK like; the hit area becomes 44px with transparent padding
   and a background-clip that keeps the painted track exactly where it was.
   Height and hit area are different questions and this answers the second. */
.developed-by-appwt-llc-ada-slider{
  min-height:44px !important;height:44px !important;
  padding:19px 0 !important;background-clip:content-box !important;
  box-sizing:border-box !important;cursor:pointer}
.developed-by-appwt-llc-ada-slider::-webkit-slider-runnable-track{height:6px;border-radius:3px}
.developed-by-appwt-llc-ada-slider::-moz-range-track{height:6px;border-radius:3px}
.developed-by-appwt-llc-ada-slider::-webkit-slider-thumb{margin-top:-7px}

/* ⭐ AND THE ONE THAT WOULD HAVE BITTEN NEXT: the panel's own default text color.
   .developed-by-appwt-llc-ada-content has no background of its own and inherits
   its color from the page, which is now #C9D4E0. Any plain paragraph inside the
   white panel would render at 1.5:1. The profile buttons set their own color so
   they looked fine, which is exactly why this needed stating rather than
   spotting. The panel declares its own ink instead of borrowing the page's. */
.developed-by-appwt-llc-ada-panel{color:#111827}
.developed-by-appwt-llc-ada-content,
.developed-by-appwt-llc-ada-content p,
.developed-by-appwt-llc-ada-content li,
.developed-by-appwt-llc-ada-content span,
.developed-by-appwt-llc-ada-content label{color:#111827}
.developed-by-appwt-llc-ada-content h1,
.developed-by-appwt-llc-ada-content h2,
.developed-by-appwt-llc-ada-content h3,
.developed-by-appwt-llc-ada-content h4{color:#111827}