/*
 * Yılmaz Yangın Optimizer Child 2.0
 * Update-safe responsive, rendering and accessibility corrections.
 */

html {
    max-width: 100%;
    overflow-x: clip;
    text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
}

body {
    max-width: 100%;
    min-width: 320px;
    overflow-wrap: break-word;
}

img,
svg,
video,
canvas {
    max-width: 100%;
}

/* Prevent imported Joomla content from forcing horizontal scrolling. */
.yy-entry-content,
.yy-main-column,
.yy-category-page-intro,
.yy-listing-intro,
.yy-page-layout,
.yy-content-grid {
    min-width: 0;
    max-width: 100%;
}

.yy-entry-content img,
.yy-entry-content video,
.yy-entry-content iframe,
.yy-entry-content embed,
.yy-entry-content object,
.yy-category-page-intro img,
.yy-category-page-intro video,
.yy-category-page-intro iframe {
    max-width: 100%;
}

.yy-entry-content iframe,
.yy-category-page-intro iframe {
    width: 100%;
    border: 0;
}

.yy-entry-content table {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.yy-entry-content pre,
.yy-entry-content code {
    max-width: 100%;
}

.yy-entry-content pre {
    overflow-x: auto;
}

.yy-entry-content a,
.yy-category-page-intro a,
.yy-listing-intro a {
    overflow-wrap: anywhere;
}

/* Strong keyboard visibility without changing mouse/touch appearance. */
:where(a, button, input, select, textarea):focus-visible {
    outline: 3px solid #ffbf47;
    outline-offset: 3px;
}

/*
 * Hero video optimization: a compressed existing site image paints immediately.
 * The decorative MP4 is selected and loaded later by optimizations.js.
 */
.yy-optimized-hero {
    background-color: #151515;
    background-image: var(--yy-hero-poster-desktop);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.yy-smart-hero-video,
.yy-lazy-video {
    display: block;
}

.yy-smart-hero-video:not([src]) {
    color: transparent;
}

/* Reserve stable space for media before it loads. */
.yy-alarm-video-wrap .yy-lazy-video {
    width: 100%;
    height: 100%;
    min-height: inherit;
    object-fit: cover;
}

/* Skip layout/paint work for sections far below the first viewport. */
@supports (content-visibility: auto) {
    .yy-services-section,
    .yy-alarm-band,
    .yy-cert-band,
    .yy-products-section,
    .yy-blog-section {
        content-visibility: auto;
        contain-intrinsic-size: 800px;
    }
}

/* Keep embedded media and legacy fixed-width blocks responsive. */
.yy-entry-content [style*="width"],
.yy-category-page-intro [style*="width"] {
    max-width: 100%;
}

@media (max-width: 920px) {
    :root {
        --yy-mobile-bottom-safe: env(safe-area-inset-bottom, 0px);
        --yy-mobile-bottom-total: calc(var(--yy-mobile-bottom-height, 78px) + var(--yy-mobile-bottom-safe));
    }

    body {
        padding-bottom: var(--yy-mobile-bottom-total);
    }

    .yy-optimized-hero {
        background-image: var(--yy-hero-poster-mobile);
        background-position: center;
    }

    .yy-mobile-bottom-nav {
        min-height: var(--yy-mobile-bottom-total);
        padding-bottom: var(--yy-mobile-bottom-safe);
    }

    .yy-mobile-bar {
        min-width: 0;
    }

    .yy-mobile-menu-toggle {
        width: 48px;
        height: 48px;
        min-width: 48px;
        min-height: 48px;
        place-content: center;
        justify-items: center;
        flex: 0 0 48px;
        touch-action: manipulation;
    }

    .yy-mobile-menu-toggle span {
        width: 26px;
    }

    .yy-logo-link,
    .yy-mobile-bottom-nav a,
    .yy-icon-button,
    .yy-search-toggle,
    .yy-side-toggle {
        touch-action: manipulation;
    }

    .yy-hero-content {
        min-width: 0;
        width: 100%;
    }

    .yy-hero h1 {
        max-width: 100%;
        font-size: clamp(30px, 9vw, 38px);
        line-height: 1.12;
        overflow-wrap: anywhere;
    }

    .yy-hero p {
        width: min(100%, 440px);
        max-width: 100%;
    }

    .yy-feature-card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .yy-feature-card,
    .yy-service-slide,
    .yy-product-card,
    .yy-blog-card {
        min-width: 0;
    }

    .yy-feature-card strong,
    .yy-feature-card small,
    .yy-service-body,
    .yy-product-body,
    .yy-blog-card h3 {
        overflow-wrap: anywhere;
    }

    .yy-drawer-panel,
    .yy-side-content {
        width: min(430px, 100vw);
        max-width: 100%;
        padding-right: max(24px, env(safe-area-inset-right, 0px));
        padding-left: max(24px, env(safe-area-inset-left, 0px));
    }

    .yy-modal-card {
        width: min(92vw, 680px);
        max-height: calc(100dvh - 32px);
        overflow-y: auto;
    }

    .yy-whatsapp-float {
        bottom: calc(var(--yy-mobile-bottom-total) + 16px);
    }
}

@media (max-width: 600px) {
    .yy-hero-inner {
        min-height: min(500px, calc(100svh - 70px));
    }

    .yy-feature-card-grid {
        gap: 10px;
    }

    .yy-feature-card {
        padding-inline: 10px;
    }
}

@media (max-width: 480px) {
    .yy-container,
    .yy-container-wide {
        width: calc(100% - 24px);
    }

    .yy-search-form {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
    }

    .yy-search-form input,
    .yy-search-form button {
        width: 100%;
        min-width: 0;
    }

    .yy-search-form button {
        min-height: 46px;
    }

    .yy-footer-phone-list a,
    .yy-footer-phone-list a span {
        width: auto;
        max-width: 100%;
        white-space: normal;
        overflow-wrap: anywhere;
    }
}

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

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

    .yy-smart-hero-video,
    .yy-lazy-video {
        display: none;
    }
}