/* ============================================
   SINOCLOUD.IT - ADAPTIVE DEVICE LAYER
   Global device-aware overrides for speed,
   accessibility and responsive consistency
   ============================================ */

:root {
    --mobile-action-bar-height: 0px;
    --adaptive-inline-gap: clamp(0.75rem, 2vw, 1.25rem);
}

html[data-viewport="mobile"] {
    scroll-padding-top: calc(var(--header-height) + var(--space-4));
}

body.mobile-nav-open {
    overflow: hidden;
}

body.mobile-nav-open .mobile-action-bar,
body.mobile-nav-open .telegram-widget-button {
    opacity: 0;
    pointer-events: none;
    transform: translateY(120%);
}

.mobile-action-bar,
.telegram-widget-button {
    transition: opacity 0.25s ease, transform 0.25s ease;
}

main {
    overflow-x: clip;
}

main iframe {
    max-width: 100%;
}

.adaptive-table-wrapper {
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    margin-bottom: var(--space-6);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-xl);
    background: var(--bg-card);
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
}

.adaptive-table-wrapper:focus-visible {
    outline: 2px solid var(--primary-500);
    outline-offset: 4px;
}

.adaptive-table-wrapper table {
    margin-bottom: 0;
}

.adaptive-table-wrapper[data-scrollable="true"] table {
    width: max-content;
    min-width: 100%;
}

.adaptive-table-wrapper[data-scrollable="true"] th,
.adaptive-table-wrapper[data-scrollable="true"] td {
    white-space: nowrap;
}

main .faq-question[role="button"] {
    cursor: pointer;
}

html[data-performance="constrained"] [data-animate],
html[data-motion="reduced"] [data-animate] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
}

html[data-performance="constrained"] .contatta-btn,
html[data-performance="constrained"] .mobile-action-item.contatta,
html[data-performance="constrained"] .terremoti-bell i,
html[data-performance="constrained"] .preloader-logo,
html[data-performance="constrained"] .preloader-bar,
html[data-motion="reduced"] .contatta-btn,
html[data-motion="reduced"] .mobile-action-item.contatta,
html[data-motion="reduced"] .terremoti-bell i,
html[data-motion="reduced"] .preloader-logo,
html[data-motion="reduced"] .preloader-bar {
    animation: none !important;
}

html[data-performance="constrained"] .hero__video,
html[data-motion="reduced"] .hero__video,
html[data-viewport="tablet"] .hero__video {
    display: none !important;
}

html[data-performance="constrained"] .hero__video-container,
html[data-motion="reduced"] .hero__video-container,
html[data-viewport="tablet"] .hero__video-container {
    background: url('../img/portfolio/webgis/Webgis.webp') no-repeat center center;
    background-size: cover;
}

@media (max-width: 1023px) {
    main .adaptive-stack {
        grid-template-columns: 1fr !important;
    }

    main .adaptive-wrap {
        flex-wrap: wrap !important;
        gap: var(--adaptive-inline-gap) !important;
    }

    main .adaptive-wrap > * {
        flex: 1 1 16rem;
        min-width: min(100%, 16rem);
    }
}

@media (max-width: 768px) {
    main {
        padding-bottom: calc(var(--mobile-action-bar-height) + var(--space-4) + env(safe-area-inset-bottom)) !important;
    }

    .mobile-nav {
        padding-bottom: calc(var(--mobile-action-bar-height) + var(--space-8) + env(safe-area-inset-bottom));
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}