/* =========================================================
   LACCOT CLEAN MOBILE SYSTEM v30
   Mobile only. Desktop untouched.
========================================================= */

@media (max-width: 900px) {

    html,
    body {
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: hidden !important;
    }

    body.lc-mobile-open {
        overflow: hidden !important;
    }

    img,
    video,
    iframe {
        max-width: 100% !important;
        height: auto !important;
    }

    .container,
    [class*="container"] {
        width: calc(100% - 28px) !important;
        max-width: 100% !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    /* =====================================================
       HEADER
    ===================================================== */

    .site-header,
    .marketing-header,
    header.lc-mobile-ready {
        position: fixed !important;
        top: 12px !important;
        left: 12px !important;
        right: 12px !important;
        width: auto !important;
        max-width: none !important;
        z-index: 10040 !important;
        margin: 0 !important;
        padding: 10px !important;
        border-radius: 26px !important;
        overflow: visible !important;
    }

    .site-header-inner,
    .marketing-header-inner,
    .header-inner,
    .site-header > .container,
    .marketing-header > .container,
    header.lc-mobile-ready > .container {
        width: 100% !important;
        max-width: 100% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 10px !important;
        position: relative !important;
    }

    .site-brand,
    .header-brand,
    .brand {
        max-width: calc(100% - 66px) !important;
        min-width: 0 !important;
        display: flex !important;
        align-items: center !important;
        gap: 9px !important;
    }

    .site-brand strong,
    .header-brand strong,
    .brand strong {
        font-size: 14px !important;
        line-height: 1 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    .site-brand small,
    .header-brand small,
    .brand small {
        display: none !important;
    }

    .site-brand span:first-child,
    .header-brand span:first-child,
    .brand span:first-child {
        width: 44px !important;
        height: 44px !important;
        min-width: 44px !important;
        border-radius: 16px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    /* Eski masaüstü nav ve eski hamburgerler mobilde tamamen kapalı */
    .site-header nav,
    .marketing-header nav,
    .site-header .site-nav,
    .marketing-header .site-nav,
    .site-header .header-nav,
    .marketing-header .header-nav,
    .laccot-mobile-nav,
    .laccot-mobile-menu-toggle,
    .laccot-old-menu-toggle,
    .lc-hide-mobile-button {
        display: none !important;
    }

    .site-header a[class*="btn"],
    .marketing-header a[class*="btn"],
    .site-header .btn,
    .marketing-header .btn {
        display: none !important;
    }

    /* Yeni hamburger */
    .lc-mobile-toggle {
        width: 48px !important;
        height: 48px !important;
        min-width: 48px !important;
        margin-left: auto !important;
        border: 0 !important;
        border-radius: 18px !important;
        background: rgba(255,255,255,.10) !important;
        color: #ffffff !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex-direction: column !important;
        gap: 5px !important;
        cursor: pointer !important;
        z-index: 10060 !important;
        box-shadow: inset 0 0 0 1px rgba(255,255,255,.08) !important;
    }

    .lc-mobile-toggle span {
        display: block !important;
        width: 21px !important;
        height: 2px !important;
        border-radius: 99px !important;
        background: currentColor !important;
        transition: transform .22s ease, opacity .18s ease !important;
    }

    .lc-mobile-toggle.is-open span:nth-child(1) {
        transform: translateY(7px) rotate(45deg) !important;
    }

    .lc-mobile-toggle.is-open span:nth-child(2) {
        opacity: 0 !important;
    }

    .lc-mobile-toggle.is-open span:nth-child(3) {
        transform: translateY(-7px) rotate(-45deg) !important;
    }

    /* =====================================================
       DRAWER
    ===================================================== */

    .lc-mobile-backdrop {
        position: fixed !important;
        inset: 0 !important;
        background: rgba(0,0,0,.58) !important;
        backdrop-filter: blur(8px) !important;
        z-index: 10020 !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
        transition: .22s ease !important;
    }

    body.lc-mobile-open .lc-mobile-backdrop {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }

    .lc-mobile-drawer {
        position: fixed !important;
        top: 88px !important;
        left: 12px !important;
        right: 12px !important;
        bottom: 14px !important;
        z-index: 10050 !important;

        display: flex !important;
        flex-direction: column !important;
        gap: 14px !important;

        padding: 16px !important;
        border-radius: 28px !important;

        background:
            linear-gradient(180deg, rgba(26,26,28,.98), rgba(13,13,15,.98)) !important;
        border: 1px solid rgba(255,255,255,.12) !important;
        box-shadow: 0 34px 110px rgba(0,0,0,.56) !important;
        backdrop-filter: blur(24px) !important;

        transform: translateY(16px) scale(.98) !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
        transition: .22s ease !important;
        overflow: hidden !important;
    }

    body.lc-mobile-open .lc-mobile-drawer {
        transform: translateY(0) scale(1) !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }

    .lc-mobile-drawer-head {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 12px !important;
        padding: 4px 4px 2px !important;
    }

    .lc-mobile-drawer-head span {
        font-size: 11px !important;
        font-weight: 900 !important;
        letter-spacing: .09em !important;
        text-transform: uppercase !important;
        opacity: .55 !important;
        color: #fff !important;
    }

    .lc-mobile-drawer-head strong {
        font-size: 13px !important;
        font-weight: 850 !important;
        color: #fff !important;
    }

    .lc-mobile-menu-list {
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        padding-right: 2px !important;
        scrollbar-width: thin !important;
    }

    .lc-mobile-link,
    .lc-mobile-accordion-btn,
    .lc-mobile-cta {
        width: 100% !important;
        min-height: 52px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        padding: 14px 16px !important;
        border-radius: 18px !important;

        background: rgba(255,255,255,.075) !important;
        border: 1px solid rgba(255,255,255,.065) !important;

        color: #fff !important;
        text-decoration: none !important;
        text-align: center !important;

        font-size: 15px !important;
        font-weight: 800 !important;
        line-height: 1.1 !important;
    }

    .lc-mobile-link:hover,
    .lc-mobile-accordion-btn:hover {
        background: rgba(255,255,255,.12) !important;
    }

    .lc-mobile-accordion {
        display: flex !important;
        flex-direction: column !important;
        gap: 8px !important;
    }

    .lc-mobile-accordion-btn {
        border: 1px solid rgba(255,255,255,.08) !important;
        cursor: pointer !important;
        justify-content: center !important;
    }

    .lc-mobile-accordion-btn i {
        width: 8px !important;
        height: 8px !important;
        margin-left: 10px !important;
        border-right: 2px solid rgba(255,255,255,.65) !important;
        border-bottom: 2px solid rgba(255,255,255,.65) !important;
        transform: rotate(45deg) translateY(-2px) !important;
        transition: .18s ease !important;
    }

    .lc-mobile-accordion.is-open .lc-mobile-accordion-btn i {
        transform: rotate(-135deg) translateY(-1px) !important;
    }

    .lc-mobile-submenu {
        display: none !important;
        grid-template-columns: 1fr !important;
        gap: 8px !important;
        padding: 8px !important;
        border-radius: 22px !important;
        background: rgba(255,255,255,.04) !important;
        border: 1px solid rgba(255,255,255,.08) !important;
    }

    .lc-mobile-accordion.is-open .lc-mobile-submenu {
        display: grid !important;
    }

    .lc-mobile-submenu a {
        min-height: 56px !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        align-items: center !important;
        gap: 10px !important;

        padding: 13px 14px !important;
        border-radius: 16px !important;

        background: rgba(255,255,255,.065) !important;
        border: 1px solid rgba(255,255,255,.055) !important;
        color: #fff !important;
        text-decoration: none !important;
    }

    .lc-mobile-submenu a span {
        min-width: 0 !important;
        font-size: 14px !important;
        font-weight: 800 !important;
        line-height: 1.12 !important;
        text-align: left !important;
        color: #fff !important;
    }

    .lc-mobile-submenu a em {
        font-style: normal !important;
        white-space: nowrap !important;
        font-size: 10px !important;
        font-weight: 950 !important;
        letter-spacing: .045em !important;
        text-transform: uppercase !important;
        color: #d7ff25 !important;
    }

    .lc-mobile-cta {
        margin-top: 4px !important;
        background: linear-gradient(135deg, #742cff 0%, #6b35ff 100%) !important;
        border-color: rgba(255,255,255,.10) !important;
        box-shadow: 0 18px 48px rgba(116,44,255,.28) !important;
    }

    /* =====================================================
       PAGE RESPONSIVE
    ===================================================== */

    main {
        padding-top: 0 !important;
    }

    .sales-home-hero,
    .florist-hero,
    .software-hero,
    .about-hero,
    .faq-hero,
    .pricing-direct-hero,
    .catalog-hero,
    .demo-request-hero {
        padding-top: 120px !important;
        padding-bottom: 44px !important;
        overflow: hidden !important;
    }

    .sales-home-hero-inner,
    .florist-hero-inner,
    .software-hero-inner,
    .about-hero-inner,
    .faq-hero-inner,
    .pricing-direct-hero-inner,
    .catalog-hero-inner,
    .demo-request-hero-inner,
    .hero-inner {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 24px !important;
    }

    h1,
    .sales-home-hero h1,
    .florist-hero h1,
    .software-hero h1,
    .about-hero h1,
    .faq-hero h1,
    .pricing-direct-hero h1,
    .catalog-hero h1,
    .demo-request-hero h1 {
        font-size: clamp(36px, 11vw, 54px) !important;
        line-height: .98 !important;
        max-width: 100% !important;
    }

    h2 {
        font-size: clamp(28px, 8vw, 42px) !important;
        line-height: 1.04 !important;
    }

    h3 {
        font-size: clamp(22px, 6vw, 30px) !important;
        line-height: 1.1 !important;
    }

    p,
    li {
        font-size: 15.5px !important;
        line-height: 1.58 !important;
    }

    .hero-actions,
    .sales-home-actions,
    .florist-actions,
    .software-actions,
    .pricing-actions {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 10px !important;
        width: 100% !important;
    }

    .hero-actions a,
    .sales-home-actions a,
    .florist-actions a,
    .software-actions a,
    .pricing-actions a {
        width: 100% !important;
        min-height: 52px !important;
        justify-content: center !important;
    }

    .sales-home-grid,
    .solution-grid,
    .florist-feature-grid,
    .software-feature-grid,
    .about-focus-grid,
    .about-timeline-grid,
    .pricing-direct-grid,
    .catalog-grid,
    .demo-request-grid,
    .faq-grid,
    .footer-grid,
    .site-footer-grid {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }

    .sales-home-card,
    .solution-card,
    .florist-feature-card,
    .software-feature-card,
    .faq-group,
    .faq-summary-card,
    .about-focus-card,
    .about-timeline-card,
    .pricing-direct-card,
    .catalog-card,
    .demo-request-card,
    .demo-request-form,
    .card,
    article {
        width: 100% !important;
        max-width: 100% !important;
        border-radius: 24px !important;
        padding: 24px !important;
    }

    .pricing-control-bar,
    .pricing-direct-toolbar,
    .pricing-toolbar,
    .pricing-filter-bar,
    .pricing-topbar {
        position: sticky !important;
        top: 86px !important;
        z-index: 50 !important;
        border-radius: 24px !important;
        padding: 12px !important;
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }

    .pricing-panel-tabs,
    .pricing-billing-tabs,
    .pricing-sector-switch,
    .pricing-switch {
        display: flex !important;
        gap: 8px !important;
        overflow-x: auto !important;
        scrollbar-width: none !important;
    }

    .pricing-panel-tabs::-webkit-scrollbar,
    .pricing-billing-tabs::-webkit-scrollbar,
    .pricing-sector-switch::-webkit-scrollbar,
    .pricing-switch::-webkit-scrollbar {
        display: none !important;
    }

    [data-pricing-panel-btn],
    [data-pricing-billing] {
        flex: 0 0 auto !important;
        min-height: 42px !important;
        padding: 11px 14px !important;
        border-radius: 999px !important;
        font-size: 13px !important;
        white-space: nowrap !important;
    }

    .pricing-direct-grid,
    .pricing-grid,
    .plans-grid {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }

    input,
    textarea,
    select {
        width: 100% !important;
        min-height: 48px !important;
        font-size: 16px !important;
    }
}

@media (max-width: 420px) {
    .container,
    [class*="container"] {
        width: calc(100% - 22px) !important;
    }

    .site-header,
    .marketing-header,
    header.lc-mobile-ready {
        top: 8px !important;
        left: 8px !important;
        right: 8px !important;
        border-radius: 22px !important;
    }

    .lc-mobile-drawer {
        top: 82px !important;
        left: 8px !important;
        right: 8px !important;
        bottom: 10px !important;
        border-radius: 24px !important;
    }
}

/* =========================================================
   DESKTOP CLEANUP FOR MOBILE DRAWER
   Mobil menü elemanları masaüstünde asla görünmesin
========================================================= */

.lc-mobile-backdrop,
.lc-mobile-drawer,
.lc-mobile-toggle {
    display: none !important;
}

@media (max-width: 900px) {
    .lc-mobile-toggle {
        display: inline-flex !important;
    }

    body.lc-mobile-open .lc-mobile-backdrop {
        display: block !important;
    }

    .lc-mobile-drawer {
        display: flex !important;
    }
}

@media (min-width: 901px) {
    body.lc-mobile-open {
        overflow: auto !important;
    }

    .lc-mobile-backdrop,
    .lc-mobile-drawer,
    .lc-mobile-toggle {
        display: none !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }
}