@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;600;800;900&family=Plus+Jakarta+Sans:wght@400;600;800;900&display=swap');

/* ==========================================================================
   CROWNORAFIX APPLICATIONS - 2026 SAAS ELITE 3D DESIGN SYSTEM
   ========================================================================== */

:root {
    --primary: #0B1F3A;
    --primary-dark: #061128;
    --primary-light: #FFFDF8;
    --accent-orange: #C5A572;
    --accent-pink: #D4243A;
    --accent-gold: #8B6B32;
    --accent-green: #059669;
    --accent-purple: #9A7A4A;
    --accent-blue: #C5A572;
    --shopier-orange: #C5A572;
    --shopier-pink: #D4243A;

    --bg-white: #FFFDF8;
    --bg-light: #FBF6EA;
    --bg-beige: #F6EFD9;
    --bg-dark: #061128;
    --bg-page: #F6EFD9;
    --bg-card: #FFFDF8;

    --text-heading: #0B1F3A;
    --text-body: #3A3228;
    --text-muted: #5C5348;

    --border-color: rgba(197, 165, 114, 0.38);
    --border-dark: #0B1F3A;

    --font-heading: 'Outfit', 'Plus Jakarta Sans', sans-serif;
    --font-main: 'Plus Jakarta Sans', 'Inter', -apple-system, sans-serif;
    --transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html, body {
    overflow-x: hidden;
    width: 100%;
    position: relative;
    scroll-behavior: smooth;
    font-size: 16px;
    font-family: var(--font-main);
    background-color: #F6EFD9;
    color: #0B1F3A;
    line-height: 1.65;
    -webkit-font-smoothing: antialiased;
}

body.modal-open {
    overflow: hidden !important;
    height: 100vh !important;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-heading);
    letter-spacing: -0.03em;
}

.benefit-glass-card:hover {
    transform: translateY(-8px) scale(1.02) !important;
    background: rgba(255, 255, 255, 0.07) !important;
    border-color: rgba(255, 255, 255, 0.22) !important;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4), 0 0 20px rgba(197, 165, 114, 0.15) !important;
}

a { text-decoration: none; color: inherit; transition: var(--transition); }
ul { list-style: none; }
img { max-width: 100%; height: auto; display: block; }

.container {
    width: 100%;
    max-width: 1340px;
    margin: 0 auto;
    padding: 0 24px;
}

.relative-container { position: relative; }
.section { padding: 90px 0; }
.light-section { 
    background: linear-gradient(180deg, #FBF6EA 0%, #F6EFD9 100%); 
    border-top: 1px solid var(--border-color); 
    border-bottom: 1px solid var(--border-color); 
}
.text-center { text-align: center; }
.hidden { display: none !important; }
.margin-t { margin-top: 36px; }

/* ----------------------------------------------------
   SHIMMER BUTTONS & NEON GLOW EFFECTS
---------------------------------------------------- */
.btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 16px 32px;
    border-radius: 18px;
    font-weight: 800;
    font-size: 1.02rem;
    overflow: hidden;
    cursor: pointer;
    z-index: 1;
    transition: var(--transition);
}

.btn::after {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: linear-gradient(60deg, transparent, rgba(255, 255, 255, 0.35), transparent);
    transform: rotate(30deg);
    transition: all 0.6s ease;
}

.btn:hover::after {
    left: 100%;
}

.btn-primary-lg {
    background: linear-gradient(135deg, #C5A572 0%, #D4243A 100%);
    color: #FFFFFF !important;
    border: none;
    box-shadow: 0 12px 30px -5px rgba(197, 165, 114, 0.35);
}

.btn-primary-lg:hover {
    transform: translateY(-5px) scale(1.03);
    box-shadow: 0 20px 45px -5px rgba(212, 36, 58, 0.45);
}

.btn-orange-lg {
    background: linear-gradient(135deg, #C5A572 0%, #D97706 100%);
    color: #FFFFFF !important;
    border: none;
    box-shadow: 0 12px 30px -5px rgba(197, 165, 114, 0.3);
}

.btn-orange-lg:hover {
    transform: translateY(-5px) scale(1.03);
    box-shadow: 0 20px 45px -5px rgba(197, 165, 114, 0.45);
}

a { text-decoration: none; color: inherit; transition: var(--transition); }
ul { list-style: none; }
img { max-width: 100%; height: auto; display: block; }
button, input, select, textarea { font-family: inherit; }

.container {
    width: 100%;
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 20px;
}

.relative-container { position: relative; }
.section { padding: 80px 0; }
.light-section { background-color: var(--bg-light); border-top: 1px solid var(--border-color); border-bottom: 1px solid var(--border-color); }
.text-center { text-align: center; }
.hidden { display: none !important; }
.margin-t { margin-top: 32px; }

.link-inline { color: var(--accent-orange); font-weight: 700; text-decoration: underline; word-break: break-word; overflow-wrap: anywhere; }
.link-inline:hover { color: #E8C98A; }
.icon-lemon { color: var(--lemon-yellow); }

/* ----------------------------------------------------
   TOP BAR & HEADER (SHOPIER INTEGRATED)
---------------------------------------------------- */
.top-bar {
    background: var(--bg-dark);
    color: #A8A29E;
    padding: 8px 0;
    font-size: 0.82rem;
    border-bottom: 1px solid #292524;
}

.top-bar-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.top-bar-left, .top-bar-right {
    display: flex;
    align-items: center;
    gap: 12px;
}

.top-bar-link {
    color: #E8C98A;
    font-weight: 700;
}

.top-bar-link:hover { color: #FFF; }

.badge-announcement {
    background: linear-gradient(135deg, var(--shopier-orange) 0%, var(--shopier-pink) 100%);
    color: #FFF;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 0.72rem;
    font-weight: 800;
}

.dot-sep { opacity: 0.3; }

.lang-selector select {
    background: transparent;
    color: #FFF;
    border: none;
    outline: none;
    font-size: 0.82rem;
    cursor: pointer;
}

/* STICKY HEADER NAVBAR (LUXURY COHESIVE DARK BAR) */
.header {
    position: sticky;
    top: 0;
    z-index: 1000;
    background: linear-gradient(135deg, #061128 0%, #0B1F3A 50%, #102646 100%);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    border-bottom: 2px solid rgba(197, 165, 114, 0.4);
    box-shadow: 0 12px 35px rgba(0, 0, 0, 0.45);
    transition: var(--transition);
}

.header-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    min-height: 98px;
    padding: 6px 0;
}

.header-logo-wrap {
    display: flex;
    align-items: center;
    padding: 2px 4px;
    transition: var(--transition);
}

.header-logo-wrap:hover {
    transform: scale(1.05);
}

.brand-logo-img {
    height: 84px;
    width: auto;
    object-fit: contain;
    filter: drop-shadow(0 4px 16px rgba(0,0,0,0.45));
}

.footer-logo-card {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 18px;
}

.footer-brand-img {
    height: 120px;
    width: auto;
    object-fit: contain;
    filter: drop-shadow(0 4px 14px rgba(0,0,0,0.3));
}

.nav-menu {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    flex-wrap: wrap;
}

.nav-link {
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--text-body);
    white-space: nowrap;
    padding: 6px 2px;
    position: relative;
    transition: var(--transition);
}

.nav-link:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 0;
    height: 2px;
    background: var(--accent-orange);
    transition: var(--transition);
    transform: translateX(-50%);
}

.nav-link:hover, .nav-link.active {
    color: var(--accent-orange);
}

.nav-link:hover:after, .nav-link.active:after {
    width: 80%;
}

.header-actions-b {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}

.btn-badge-store {
    padding: 7px 11px;
    font-size: 0.8rem;
    font-weight: 700;
    border-radius: 9px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    white-space: nowrap;
    transition: var(--transition);
}

.btn-badge-store.chrome {
    background: #EFF6FF;
    color: #1D4ED8;
    border: 1px solid #BFDBFE;
}

.btn-badge-store.chrome:hover {
    background: #2563EB;
    color: #FFF;
    border-color: #2563EB;
    transform: translateY(-1px);
}

.btn-badge-store.firefox {
    background: #102646;
    color: #C2410C;
    border: 1px solid #0B1F3A;
}

.btn-badge-store.firefox:hover {
    background: #E66000;
    color: #FFF;
    border-color: #E66000;
    transform: translateY(-1px);
}

.btn-badge-store.shopier {
    background: #FFF1F2;
    color: #D4243A;
    border: 1px solid #FECDD3;
}

.btn-badge-store.shopier:hover {
    background: #D4243A;
    color: #FFF;
    border-color: #D4243A;
    transform: translateY(-1px);
}

.mobile-toggle {
    display: none;
    background: transparent;
    border: none;
    font-size: 1.4rem;
    cursor: pointer;
    color: var(--text-heading);
    padding: 6px;
}

/* BUTTON SYSTEM */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-weight: 700;
    border-radius: 12px;
    cursor: pointer;
    border: 1px solid transparent;
    transition: var(--transition);
}

.btn-shopier {
    background: linear-gradient(135deg, var(--shopier-orange) 0%, var(--shopier-pink) 100%);
    color: #FFFFFF;
    border: 1px solid rgba(255, 255, 255, 0.2);
    box-shadow: 0 4px 14px rgba(197, 165, 114, 0.3);
}

.btn-shopier:hover {
    background: linear-gradient(135deg, var(--shopier-pink) 0%, #9B1B30 100%);
    color: #FFF;
    border-color: var(--shopier-pink);
    transform: translateY(-2px);
}

.btn-firefox-store-sm {
    padding: 10px 16px;
    font-size: 0.86rem;
    background: linear-gradient(135deg, #E66000 0%, #FF9500 100%);
    color: #FFF;
    box-shadow: 0 4px 12px rgba(230, 96, 0, 0.25);
}

.btn-firefox-store-sm:hover {
    background: #D15200;
    transform: translateY(-2px);
}

.btn-firefox-store-lg {
    padding: 14px 28px;
    font-size: 0.98rem;
    background: linear-gradient(135deg, #E66000 0%, #FF9500 100%);
    color: #FFF;
    box-shadow: 0 6px 18px rgba(230, 96, 0, 0.3);
}

.btn-firefox-store-lg:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(230, 96, 0, 0.4);
}

.btn-chrome-store-sm {
    padding: 10px 16px;
    font-size: 0.86rem;
    background: #2563EB;
    color: #FFF;
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.25);
}

.btn-chrome-store-sm:hover {
    background: #1D4ED8;
    transform: translateY(-2px);
}

.btn-chrome-store-lg {
    padding: 14px 28px;
    font-size: 0.98rem;
    background: #2563EB;
    color: #FFF;
    box-shadow: 0 6px 18px rgba(37, 99, 235, 0.3);
}

.btn-chrome-store-lg:hover {
    background: #1D4ED8;
    transform: translateY(-2px);
}

.btn-primary-sm { padding: 10px 20px; font-size: 0.88rem; background: var(--primary); color: #FFF; }
.btn-primary-sm:hover { background: var(--primary-dark); }

.btn-secondary-sm { padding: 6px 12px; font-size: 0.8rem; background: var(--bg-light); border: 1px solid var(--border-color); color: var(--text-heading); border-radius: 6px; cursor: pointer; }
.btn-secondary-sm:hover { background: #EFE8DC; }

.btn-primary-lg {
    padding: 14px 28px;
    font-size: 0.98rem;
    background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%);
    color: #FFF;
    box-shadow: 0 6px 18px rgba(30, 41, 59, 0.3);
}

.btn-primary-lg:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(30, 41, 59, 0.4);
}

.btn-orange-lg {
    padding: 14px 28px;
    font-size: 0.98rem;
    background: linear-gradient(135deg, var(--accent-orange) 0%, #E8C98A 100%);
    color: #FFF;
    box-shadow: 0 6px 18px rgba(194, 65, 12, 0.3);
}

.btn-orange-lg:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(194, 65, 12, 0.4);
}

.btn-primary-full { width: 100%; padding: 12px; background: var(--primary); color: #FFF; border: none; font-size: 0.95rem; border-radius: 10px; font-weight: 700; cursor: pointer; }
.btn-secondary-full { width: 100%; padding: 12px; background: var(--bg-light); color: var(--text-heading); border: 1px solid var(--border-color); font-size: 0.95rem; border-radius: 10px; font-weight: 700; cursor: pointer; }

/* ==========================================================================
   2026 ULTRA-MODERN 3D PERSPECTIVE & ANIMATED MESH ORBS SYSTEM
/* ==========================================================================
   INDEPENDENT TOP IMAGE SLIDER & BOTTOM 6-STEP PRESENTATION GUIDE
   ========================================================================== */

.hero-section {
    padding: 50px 0 70px 0;
    background: linear-gradient(180deg, #FBF6EA 0%, #F6EFD9 100%);
    position: relative;
}

/* ÜST BAĞIMSIZ GÖRSEL SLAYT ALANI (SIFIRA SIFIR ALANI KAPLAYAN BANNER) */
.hero-top-image-slider {
    position: relative;
    width: 100%;
    max-width: 1140px;
    margin: 0 auto 40px auto;
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 20px 45px rgba(0, 0, 0, 0.1);
    border: 3px solid #FFFFFF;
    background: #FFFFFF;
}

.top-img-slide {
    display: none;
    position: relative;
    cursor: pointer;
    width: 100%;
}

.top-img-slide.active {
    display: block;
}

.full-banner-img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
    border-radius: 20px;
}

/* ALT BAĞIMSIZ 6-ADIMLI REHBER SUNUM SLAYT ALANI */
.hero-presentation-guide-container {
    width: 100%;
    max-width: 980px;
    margin: 0 auto;
}

.guide-slide {
    display: none;
}

.guide-slide.active {
    display: block;
}

.guide-slide-card {
    background: rgba(11, 31, 58, 0.85);
    border: 1px solid rgba(197, 165, 114, 0.28);
    padding: 36px 32px;
    border-radius: 24px;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.04);
}

.guide-slide-title {
    font-size: 1.4rem;
    font-weight: 900;
    color: #E8C98A;
    margin-bottom: 14px;
}

.guide-detail-content p {
    font-size: 0.96rem;
    color: #475569;
    line-height: 1.75;
    margin-bottom: 10px;
}

.guide-detail-content strong {
    color: #0F172A;
}

.guide-detail-content em {
    font-style: normal;
    background: #EFF6FF;
    color: #1D4ED8;
    padding: 2px 8px;
    border-radius: 6px;
    font-weight: 700;
}

/* PRESENTATION SLIDE BADGE & TYPOGRAPHY */
.step-presentation-badge {
    display: inline-block;
    padding: 6px 14px;
    border-radius: 20px;
    background: #102646;
    color: #C2410C;
    border: 1px solid #9A7A4A;
    font-weight: 800;
    font-size: 0.8rem;
    letter-spacing: 0.5px;
    margin-bottom: 14px;
}

.step-presentation-badge.badge-blue { background: #F0F9FF; color: #0369A1; border-color: #BAE6FD; }
.step-presentation-badge.badge-pink { background: #FDF2F8; color: #9B1B30; border-color: #FBCFE8; }
.step-presentation-badge.badge-purple { background: #F3E8FF; color: #6B21A8; border-color: #E9D5FF; }
.step-presentation-badge.badge-gold { background: #FEF3C7; color: #B45309; border-color: #FDE68A; }

.presentation-body {
    margin-top: 12px;
}

.presentation-body .slide-desc {
    font-size: 0.96rem;
    color: #475569;
    line-height: 1.7;
}

.presentation-body strong {
    color: #0F172A;
}

/* RIGHT-SIDE POSTER FRAME (TRANSPARENT GLASS BACKGROUND) */
.compact-poster-frame {
    width: 100%;
    max-width: 530px;
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.08);
    border: 2px solid #E2E8F0;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    position: relative;
    cursor: pointer;
    transition: var(--transition);
}

.compact-poster-frame::before {
    content: '🔴  🟡  🟢';
    display: block;
    background: #F8FAFC;
    padding: 8px 16px;
    font-size: 11px;
    border-bottom: 1px solid #E2E8F0;
}

.compact-poster-frame:hover {
    transform: translateY(-4px);
    box-shadow: 0 25px 55px rgba(0, 0, 0, 0.18);
}

/* SLIDER CONTROLS & DOTS */
.slider-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.95);
    color: #0F172A;
    border: 1px solid #E2E8F0;
    cursor: pointer;
    font-size: 1.1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    z-index: 10;
    transition: var(--transition);
}

.slider-btn:hover {
    background: #C5A572;
    color: #FFF;
    border-color: #C5A572;
}

.prev-btn { left: 14px; }
.next-btn { right: 14px; }

.slider-dots-container {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 24px;
}

.dot-item {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #CBD5E1;
    cursor: pointer;
    transition: var(--transition);
}

.dot-item.active {
    width: 32px;
    border-radius: 10px;
    background: #C5A572;
}

.slide-grid {
    display: grid;
    grid-template-columns: 1.15fr 0.85fr;
    gap: 40px;
    align-items: center;
}

.poster-slogan-card {
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.8);
    padding: 38px 36px;
    border-radius: 28px;
    box-shadow: 0 25px 50px -12px rgba(28, 25, 23, 0.08), 0 0 0 1px rgba(231, 224, 214, 0.6);
    position: relative;
    overflow: hidden;
}

.poster-slogan-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 6px;
    height: 100%;
    background: linear-gradient(180deg, #C5A572 0%, #D4243A 100%);
}

.poster-slogan-title {
    font-size: 1.45rem;
    font-weight: 800;
    line-height: 1.35;
    margin-bottom: 14px;
    padding: 12px 16px;
    border-left: 5px solid var(--accent-orange);
    background: rgba(194, 65, 12, 0.04);
    border-radius: 0 12px 12px 0;
    color: #E8C98A;
}

.slogan-pink { border-left-color: var(--accent-pink); background: rgba(190, 24, 93, 0.04); color: #831843; }
.slogan-blue { border-left-color: #0284C7; background: rgba(2, 132, 199, 0.04); color: #0369A1; }
.slogan-gold { border-left-color: var(--accent-gold); background: rgba(180, 83, 9, 0.04); color: #78350F; }
.slogan-purple { border-left-color: var(--accent-purple); background: rgba(107, 33, 168, 0.04); color: #581C87; }

.slide-desc {
    font-size: 0.98rem;
    color: var(--text-body);
    margin-bottom: 20px;
    line-height: 1.6;
}

.slide-actions {
    display: flex;
    gap: 10px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.poster-widget-box {
    background: var(--bg-light);
    border: 1px solid var(--border-color);
    border-radius: 14px;
    padding: 12px 16px;
}

.widget-row-pills {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.status-chip {
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 0.76rem;
    font-weight: 800;
}

.chip-red { background: #FEE2E2; color: #991B1B; }
.chip-green { background: #DCFCE7; color: #14532D; }
.chip-gold { background: #FEF3C7; color: #78350F; }
.chip-orange { background: #0B1F3A; color: #C2410C; }

/* LUXURY BROWSER WINDOW FRAME FOR POSTERS */
.slide-img-col {
    display: flex;
    justify-content: center;
}

.compact-poster-frame {
    width: 100%;
    max-width: 530px;
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 25px 60px -15px rgba(28, 25, 23, 0.22);
    border: 3px solid #FFFFFF;
    background: #1C1917;
    position: relative;
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.compact-poster-frame::before {
    content: '🔴  🟡  🟢';
    display: block;
    background: #292524;
    padding: 8px 16px;
    font-size: 11px;
    border-bottom: 1px solid #383533;
}

.compact-poster-frame:hover {
    transform: translateY(-8px) scale(1.02);
    box-shadow: 0 35px 80px -15px rgba(197, 165, 114, 0.28);
}

.compact-poster-frame:hover {
    box-shadow: 0 30px 60px -10px rgba(41, 37, 36, 0.28);
}

.compact-poster-img {
    width: 100%;
    max-height: 380px;
    object-fit: contain;
    display: block;
    background: #1C1917;
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.compact-poster-frame:hover .compact-poster-img {
    transform: scale(1.06);
}

.zoom-hint-overlay {
    position: absolute;
    bottom: 14px;
    right: 14px;
    background: rgba(28, 25, 23, 0.88);
    color: #FFF;
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 700;
    backdrop-filter: blur(8px);
    border: 1px solid rgba(255,255,255,0.2);
    opacity: 0;
    transform: translateY(6px);
    transition: var(--transition);
    pointer-events: none;
    display: flex;
    align-items: center;
    gap: 6px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.3);
}

.compact-poster-frame:hover .zoom-hint-overlay {
    opacity: 1;
    transform: translateY(0);
}

/* LIGHTBOX MODAL */
.lightbox-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(28, 25, 23, 0.95);
    backdrop-filter: blur(14px);
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
}

.lightbox-modal.open {
    opacity: 1;
    pointer-events: auto;
}

.lightbox-content-box {
    position: relative;
    max-width: 90vw;
    max-height: 88vh;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.lightbox-full-img {
    max-width: 88vw;
    max-height: 80vh;
    border-radius: 18px;
    box-shadow: 0 30px 70px rgba(0, 0, 0, 0.6);
    border: 2px solid rgba(255, 255, 255, 0.25);
    object-fit: contain;
    background: #000;
}

.lightbox-close-btn {
    position: absolute;
    top: -50px;
    right: 0;
    background: transparent;
    border: none;
    color: #FFF;
    font-size: 2rem;
    cursor: pointer;
    transition: var(--transition);
}

.lightbox-close-btn:hover { color: var(--accent-orange); transform: scale(1.15); }

.lightbox-nav-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 255, 255, 0.3);
    color: #FFF;
    font-size: 1.4rem;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: var(--transition);
    z-index: 10001;
}

.lightbox-nav-btn:hover { background: var(--accent-orange); border-color: var(--accent-orange); transform: translateY(-50%) scale(1.1); }
.lightbox-prev-btn { left: -75px; }
.lightbox-next-btn { right: -75px; }

.lightbox-counter {
    margin-top: 14px;
    color: #A8A29E;
    font-size: 0.92rem;
    font-weight: 700;
}

.slider-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #FFFFFF;
    border: 1px solid var(--border-color);
    color: var(--text-heading);
    font-size: 1.1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 10;
    box-shadow: 0 6px 16px rgba(41,37,36,0.1);
    transition: var(--transition);
}

.slider-btn:hover {
    background: var(--accent-orange);
    color: #FFF;
    border-color: var(--accent-orange);
    transform: translateY(-50%) scale(1.05);
}

.prev-btn { left: -16px; }
.next-btn { right: -16px; }

.slider-dots-container {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 24px;
}

.dot-item {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #D6CEC3;
    cursor: pointer;
    transition: var(--transition);
}

.dot-item.active {
    width: 28px;
    border-radius: 14px;
    background: var(--accent-orange);
}

/* ----------------------------------------------------
   TRUST METRICS BAR & SHOPIER LOGOS
---------------------------------------------------- */
.trust-bar {
    background: var(--bg-dark);
    color: #FFF;
    padding: 30px 0;
    border-top: 1px solid #292524;
    border-bottom: 1px solid #292524;
}

.trust-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}

.trust-box {
    display: flex;
    align-items: center;
    gap: 14px;
}

.trust-icon-wrap {
    width: 46px;
    height: 46px;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.08);
    color: #E8C98A;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    flex-shrink: 0;
}

.trust-box strong { display: block; font-size: 1.15rem; font-weight: 800; }
.trust-box span { font-size: 0.8rem; color: #A8A29E; }

/* Shopier Security Banner */
.lemon-security-bar {
    background: #FFFFFF;
    border: 1px solid var(--border-color);
    border-radius: 16px;
    padding: 28px 32px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
    word-break: break-word;
    overflow-wrap: anywhere;
}

.lemon-sec-item {
    display: flex;
    align-items: flex-start;
    gap: 18px;
}

.lemon-sec-item div {
    min-width: 0;
    flex: 1;
}

.lemon-sec-item strong {
    display: block;
    font-size: 1.1rem;
    color: var(--text-heading);
    margin-bottom: 4px;
}

.lemon-sec-item p {
    font-size: 0.88rem;
    color: var(--text-body);
    line-height: 1.6;
    word-break: break-word;
    overflow-wrap: anywhere;
}

.shopier-store-logo-img {
    height: 52px;
    width: auto;
    max-width: 220px;
    object-fit: contain;
    flex-shrink: 0;
}

.shopier-footer-badge {
    max-height: 48px;
    width: auto;
    object-fit: contain;
    margin-top: 14px;
}

/* ----------------------------------------------------
   SECTION TYPOGRAPHY & HEADERS
---------------------------------------------------- */
.section-title-wrapper {
    margin-bottom: 44px;
}

.section-tag {
    display: inline-block;
    padding: 4px 12px;
    background: var(--primary-light);
    color: var(--accent-orange);
    font-weight: 800;
    font-size: 0.78rem;
    border-radius: 4px;
    letter-spacing: 1px;
    margin-bottom: 12px;
}

.tag-orange { background: #0B1F3A; color: var(--accent-orange); }

.section-main-title {
    font-size: 2.1rem;
    font-weight: 800;
    color: var(--text-heading);
    margin-bottom: 12px;
}

.section-sub-title {
    font-size: 1.02rem;
    color: var(--text-body);
    max-width: 680px;
    margin: 0 auto;
}

/* ----------------------------------------------------
   STEPS & DOWNLOAD GUIDE BOX
---------------------------------------------------- */
.steps-container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
}

.step-item-card {
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    padding: 36px 28px;
    border-radius: 24px;
    border: 1px solid rgba(231, 224, 214, 0.9);
    position: relative;
    box-shadow: 0 12px 30px rgba(28, 25, 23, 0.04);
    transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.step-item-card:hover {
    transform: translateY(-12px) scale(1.02);
    box-shadow: 0 30px 60px -10px rgba(197, 165, 114, 0.2);
    border-color: #C5A572;
}

.step-icon {
    width: 50px;
    height: 50px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    margin-bottom: 20px;
    background: var(--primary-light);
    color: var(--accent-orange);
}

.step-badge {
    position: absolute;
    top: 20px;
    right: 24px;
    font-size: 2.5rem;
    font-weight: 900;
    color: #E7E0D6;
}

.step-item-card h3 { font-size: 1.2rem; margin-bottom: 10px; }
.step-item-card p { font-size: 0.92rem; color: var(--text-body); line-height: 1.65; }

/* Download Guide Box */
.download-guide-box {
    background: var(--bg-white);
    border: 1px solid var(--border-color);
    border-left: 5px solid var(--accent-orange);
    border-radius: 16px;
    padding: 32px;
}

.download-guide-box h3 {
    font-size: 1.25rem;
    margin-bottom: 18px;
    color: #E8C98A;
    display: flex;
    align-items: center;
    gap: 10px;
}

.download-steps-ol {
    padding-left: 20px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.download-steps-ol li {
    font-size: 0.95rem;
    color: var(--text-body);
    line-height: 1.6;
}

.download-steps-ol li strong {
    color: var(--text-heading);
}

/* ----------------------------------------------------
   PRODUCT SHOWCASE & REAL SCREENSHOT SWITCHER
---------------------------------------------------- */
.showcase-switcher-tabs {
    display: flex;
    justify-content: center;
    gap: 16px;
    margin-bottom: 32px;
}

.showcase-tab {
    padding: 12px 24px;
    border-radius: 10px;
    background: var(--bg-white);
    border: 1px solid var(--border-color);
    font-weight: 700;
    font-size: 0.95rem;
    color: var(--text-body);
    cursor: pointer;
    transition: var(--transition);
}

.showcase-tab.active {
    background: var(--primary);
    color: #FFF;
    border-color: var(--primary);
}

.real-screenshot-container {
    display: none;
    max-width: 600px;
    margin: 0 auto;
}

.real-screenshot-container.active {
    display: block;
}

.window-browser-frame {
    background: rgba(255, 255, 255, 0.95);
    border-radius: 20px;
    overflow: hidden;
    border: 2px solid #E2E8F0;
    box-shadow: 0 15px 35px rgba(0,0,0,0.06);
}

.window-browser-frame::before {
    content: '🔴  🟡  🟢';
    display: block;
    background: #F8FAFC;
    padding: 8px 16px;
    font-size: 11px;
    border-bottom: 1px solid #E2E8F0;
}

.showcase-real-img {
    width: 100%;
    display: block;
    max-height: 650px;
    object-fit: contain;
    background: transparent;
}

/* ----------------------------------------------------
   PRICING (EXACT 5-COLUMN TAKIPFIX PACKAGES)
---------------------------------------------------- */
.price-cards-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.price-cards-5col {
    grid-template-columns: repeat(5, 1fr);
    gap: 18px;
}

.price-card {
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    padding: 26px 20px;
    border-radius: 24px;
    border: 1.5px solid rgba(231, 224, 214, 0.9);
    display: flex;
    flex-direction: column;
    position: relative;
    transition: all 0.35 cubic-bezier(0.34, 1.56, 0.64, 1);
    box-shadow: 0 10px 30px rgba(28, 25, 23, 0.04);
}

.price-card:hover {
    transform: translateY(-8px) scale(1.02);
    box-shadow: 0 25px 45px -10px rgba(197, 165, 114, 0.18);
    border-color: #C5A572;
}

.price-badge-top {
    font-size: 0.7rem;
    font-weight: 800;
    padding: 3px 8px;
    border-radius: 10px;
    background: var(--bg-light);
    color: var(--text-body);
    display: inline-block;
    width: fit-content;
    margin-bottom: 10px;
}

.badge-blue-top { background: #E0F2FE; color: #0369A1; }
.badge-gold-top { background: #FEF3C7; color: #78350F; }
.badge-purple-top { background: #F3E8FF; color: #581C87; }

.featured-price-card {
    border: 2px solid var(--accent-orange);
    position: relative;
    box-shadow: 0 12px 28px rgba(194,65,12,0.12);
}

.border-purple {
    border: 2px solid var(--accent-purple);
    box-shadow: 0 12px 28px rgba(107, 33, 168, 0.12);
}

.featured-ribbon {
    position: absolute;
    top: -12px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--accent-orange);
    color: #FFF;
    padding: 2px 10px;
    border-radius: 10px;
    font-size: 0.68rem;
    font-weight: 800;
    white-space: nowrap;
}

.ribbon-purple {
    background: var(--accent-purple);
}

.price-card h3 { font-size: 1.15rem; margin-bottom: 4px; }
.plan-sub { font-size: 0.78rem; color: var(--text-body); margin-bottom: 12px; min-height: 34px; line-height: 1.4; }

.price-value {
    font-size: 1.95rem;
    font-weight: 900;
    margin-bottom: 4px;
    color: var(--text-heading);
}

.price-value span { font-size: 0.8rem; color: var(--text-body); font-weight: 600; }

.price-sub-calc {
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--accent-orange);
    margin-bottom: 14px;
}

.plan-list { margin-bottom: 20px; flex-grow: 1; }
.plan-list li { font-size: 0.82rem; margin-bottom: 8px; display: flex; align-items: center; gap: 6px; color: var(--text-body); line-height: 1.35; }

/* ----------------------------------------------------
   FAQ & CONTACT
---------------------------------------------------- */
.faq-list-wrapper {
    max-width: 780px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.faq-box {
    background: var(--bg-white);
    border: 1px solid var(--border-color);
    border-radius: 12px;
    overflow: hidden;
}

.faq-header-bar {
    padding: 18px 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 700;
    font-size: 1rem;
    cursor: pointer;
}

.faq-header-bar span { display: flex; align-items: center; gap: 10px; }
.faq-header-bar span i { color: var(--accent-orange); }

.faq-content-body {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
    padding: 0 24px;
    color: var(--text-body);
    font-size: 0.95rem;
}

.faq-box.active .faq-content-body {
    max-height: 180px;
    padding: 0 24px 18px 24px;
}

.faq-box.active .faq-arrow { transform: rotate(180deg); }

.faq-item .faq-answer {
    display: none;
}

.faq-item.open .faq-answer {
    display: block;
}

.faq-item .faq-question {
    cursor: pointer;
}

.contact-box-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: center;
}

.contact-details { margin-top: 28px; display: flex; flex-direction: column; gap: 20px; }
.detail-row { display: flex; gap: 14px; align-items: flex-start; }

.detail-icon {
    width: 42px;
    height: 42px;
    border-radius: 10px;
    background: var(--primary-light);
    color: var(--accent-orange);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    flex-shrink: 0;
}

.clean-form {
    background: var(--bg-white);
    padding: 36px;
    border-radius: 16px;
    border: 1px solid var(--border-color);
    box-shadow: 0 10px 25px rgba(41,37,36,0.04);
}

.clean-form h3 { margin-bottom: 20px; font-size: 1.3rem; }
.input-group { margin-bottom: 16px; }
.input-group label { display: block; font-weight: 700; font-size: 0.85rem; margin-bottom: 6px; }
.input-group input, .input-group select, .input-group textarea {
    width: 100%;
    padding: 10px 14px;
    border-radius: 8px;
    border: 1px solid var(--border-color);
    outline: none;
    font-size: 0.9rem;
    background: var(--bg-beige);
}

/* ----------------------------------------------------
   POLICY MODAL STYLING
---------------------------------------------------- */
.modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(28, 25, 23, 0.85);
    backdrop-filter: blur(8px);
    z-index: 10000;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 24px 12px;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
}

.modal-card {
    background: #FFFFFF;
    border-radius: 20px;
    padding: 36px;
    max-width: 680px;
    width: 100%;
    max-height: 85vh;
    overflow-y: auto;
    position: relative;
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.25);
    border: 1px solid var(--border-color);
}

.modal-close {
    position: absolute;
    top: 20px;
    right: 20px;
    background: var(--bg-light);
    border: 1px solid var(--border-color);
    border-radius: 50%;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    cursor: pointer;
    color: var(--text-heading);
    transition: var(--transition);
}

.modal-close:hover { background: var(--accent-orange); color: #FFF; border-color: var(--accent-orange); }

.policy-modal-body h4 {
    font-size: 1.1rem;
    margin: 18px 0 8px 0;
    color: var(--primary-dark);
}

.policy-modal-body p {
    font-size: 0.92rem;
    color: var(--text-body);
    line-height: 1.65;
    margin-bottom: 12px;
}

#adminLicenseModal.hidden,
#adminLicenseModal[style*="display: none"],
#adminLicenseModal[style*="display:none"] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

#adminLicenseModal:not(.hidden) {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch !important;
    z-index: 1000000 !important;
    /* DÜZ BEYAZ LÜKS DERİ DOKUSU (INFINITE SEAMLESS WHITE LEATHER TEXTURE) */
    background-color: #F8FAFC !important;
    
    
    
    
    padding: 30px 12px 60px 12px !important;
    box-sizing: border-box !important;
    display: flex !important;
    justify-content: center !important;
    align-items: flex-start !important;
}

.admin-modal-card {
    background: #FFFFFF;
    border-radius: 16px;
    padding: 24px 32px;
    width: 98vw !important;
    max-width: 1800px !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    margin: 0 auto;
    position: relative;
    box-shadow: 0 25px 60px rgba(0, 0, 0, 0.3);
    border: 1px solid var(--border-color);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    flex-direction: column;
}

/* Custom Scrollbar for Fluid Window */
.admin-modal-card::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

.admin-modal-card::-webkit-scrollbar-thumb {
    background: #D6CEC3;
    border-radius: 4px;
}

.admin-modal-card::-webkit-scrollbar-thumb:hover {
    background: var(--accent-orange);
}



/* FULLSCREEN DASHBOARD MODE */
.admin-modal-card.fullscreen-mode {
    max-width: 99vw !important;
    width: 99vw !important;
    max-height: 98vh !important;
    height: 98vh !important;
    border-radius: 12px !important;
    padding: 20px 24px !important;
}

.admin-nav-tabs {
    display: flex;
    gap: 8px;
    margin-top: 16px;
    border-bottom: 2px solid var(--border-color);
    padding-bottom: 4px;
    overflow-x: auto;
    flex-shrink: 0;
    scrollbar-width: thin;
}

.admin-tab-btn {
    padding: 10px 16px;
    border: none;
    background: transparent;
    font-weight: 700;
    font-size: 0.86rem;
    color: var(--text-body);
    cursor: pointer;
    border-radius: 10px 10px 0 0;
    transition: var(--transition);
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.admin-tab-btn.active {
    background: linear-gradient(135deg, #C5A572 0%, #D4243A 100%) !important;
    color: #FFFFFF !important;
    font-weight: 900 !important;
    border-bottom: 3px solid #FFFFFF !important;
    box-shadow: 0 4px 14px rgba(197, 165, 114, 0.35) !important;
    border-radius: 10px 10px 0 0 !important;
}

.admin-tab-content {
    flex: 1;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    margin-top: 16px;
    padding-right: 4px;
}

.admin-panel-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 20px;
    height: 100%;
}

.gen-card-box {
    background: var(--bg-beige);
    border: 1px solid var(--border-color);
    border-radius: 16px;
    padding: 20px;
    height: fit-content;
    box-sizing: border-box;
}

.table-card-box {
    background: #FFFFFF;
    border: 1px solid var(--border-color);
    border-radius: 16px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    min-width: 0;
}

.table-toolbar {
    display: flex;
    gap: 12px;
    margin-bottom: 16px;
    flex-wrap: wrap;
}

.table-toolbar input, .table-toolbar select {
    padding: 8px 12px;
    border-radius: 8px;
    border: 1px solid var(--border-color);
    outline: none;
    font-size: 0.85rem;
}

.license-table-wrapper {
    overflow-x: scroll !important;
    overflow-y: auto !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    border: 1px solid var(--border-color);
    border-radius: 12px;
    flex: 1;
    max-height: 550px;
    -webkit-overflow-scrolling: touch;
}

.license-table-wrapper::-webkit-scrollbar {
    height: 10px !important;
}

.license-table-wrapper::-webkit-scrollbar-track {
    background: #F1F5F9;
    border-radius: 6px;
}

.license-table-wrapper::-webkit-scrollbar-thumb {
    background: #C5A572;
    border-radius: 6px;
}

.fullscreen-mode .license-table-wrapper {
    max-height: calc(82vh - 120px);
}

.license-table {
    min-width: 900px !important;
    width: 100% !important;
    border-collapse: collapse !important;
    font-size: 0.78rem !important;
    border: 1.5px solid #CBD5E1 !important;
    background: #FFFFFF !important;
}

.license-table th {
    background: #1E293B !important;
    color: #F8FAFC !important;
    padding: 5px 8px !important;
    text-align: left !important;
    white-space: nowrap !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 10 !important;
    font-weight: 800 !important;
    font-size: 0.78rem !important;
    border: 1px solid #334155 !important;
    line-height: 1.2 !important;
}

.license-table td {
    padding: 3px 6px !important;
    border: 1px solid #E2E8F0 !important;
    vertical-align: middle !important;
    white-space: nowrap !important;
    font-size: 0.78rem !important;
    line-height: 1.15 !important;
    height: 28px !important;
}

.license-table tbody tr:nth-child(even) {
    background-color: #F8FAFC;
}

.license-table tbody tr:hover {
    background-color: #F1F5F9;
}

/* ----------------------------------------------------
   FOOTER
---------------------------------------------------- */
.footer {
    background: linear-gradient(180deg, #0B1F3A 0%, #061128 100%);
    color: #E4D5C2;
    padding: 60px 0 24px 0;
    border-top: 2px solid rgba(197, 165, 114, 0.45);
}

.footer-grid-layout {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    gap: 40px;
    margin-bottom: 40px;
}

.footer-col-main p { font-size: 0.88rem; line-height: 1.6; }

.footer-col h4 { color: #FFF; font-size: 1rem; margin-bottom: 16px; }
.footer-col a { display: block; color: #A8A29E; font-size: 0.88rem; margin-bottom: 10px; }
.footer-col a:hover { color: #FFF; }

.social-links-row { display: flex; gap: 10px; }
.social-links-row a { width: 36px; height: 36px; border-radius: 50%; background: rgba(255,255,255,0.08); color: #FFF; display: flex; align-items: center; justify-content: center; }

.footer-bottom-bar {
    padding-top: 10px;
    border-top: none !important;
    font-size: 0.82rem;
}

/* ----------------------------------------------------
   ASSISTANT FLOATING WIDGET
---------------------------------------------------- */
.assistant-widget-container { position: fixed; bottom: 24px; right: 24px; z-index: 9999; }

.assistant-trigger-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 20px;
    border-radius: 24px;
    background: var(--accent-orange);
    color: #FFF;
    border: none;
    font-weight: 700;
    font-size: 0.9rem;
    cursor: pointer;
    box-shadow: 0 8px 20px rgba(194,65,12,0.35);
}

.assistant-box {
    position: absolute;
    bottom: 60px;
    right: 0;
    width: 360px;
    background: #FFF;
    border-radius: 16px;
    box-shadow: 0 15px 35px rgba(0,0,0,0.2);
    border: 1px solid var(--border-color);
    display: none;
    flex-direction: column;
    overflow: hidden;
}

.assistant-box.open { display: flex; }
.assistant-header { background: var(--bg-dark); color: #FFF; padding: 14px 18px; display: flex; justify-content: space-between; align-items: center; }
.close-assistant-btn { background: transparent; border: none; color: #FFF; font-size: 1.1rem; cursor: pointer; }

.assistant-messages { padding: 14px; max-height: 300px; overflow-y: auto; display: flex; flex-direction: column; gap: 10px; }
.msg-bubble { padding: 10px 14px; border-radius: 12px; font-size: 0.85rem; line-height: 1.5; }
.bot-msg .msg-bubble { background: var(--bg-light); color: var(--text-heading); }
.user-msg .msg-bubble { background: var(--accent-orange); color: #FFF; }

.assistant-quick-options { display: flex; flex-direction: column; gap: 6px; }
.quick-btn { text-align: left; padding: 8px 10px; background: #FFF; border: 1px solid var(--border-color); border-radius: 8px; font-size: 0.78rem; font-weight: 700; cursor: pointer; }
.btn-escalate { background: #FEF3C7; color: #78350F; }

.assistant-input-bar { padding: 10px; border-top: 1px solid var(--border-color); display: flex; gap: 6px; }
.assistant-input-bar input { flex: 1; padding: 6px 12px; border-radius: 16px; border: 1px solid var(--border-color); outline: none; font-size: 0.82rem; }
.assistant-input-bar button { width: 30px; height: 30px; border-radius: 50%; background: var(--accent-orange); color: #FFF; border: none; cursor: pointer; }

.input-group-sm { margin-bottom: 8px; }
.input-group-sm input, .input-group-sm textarea { width: 100%; padding: 6px 10px; border-radius: 6px; border: 1px solid var(--border-color); font-size: 0.8rem; }
.form-actions-sm { display: flex; justify-content: flex-end; gap: 6px; }



/* ==========================================================================
   ADVANCED MOBILE & TABLET RESPONSIVE BREAKPOINTS
   ========================================================================== */

@media (max-width: 1200px) {
    .price-cards-5col { grid-template-columns: repeat(3, 1fr); gap: 16px; }
    .nav-menu { gap: 16px; }
    .nav-link { font-size: 0.86rem; }
    .admin-panel-grid { grid-template-columns: 1fr; }
}

@media (max-width: 992px) {
    .section { padding: 50px 0; }
    .header-container { height: 68px; }
    
    .mobile-toggle { display: block; }
    
    .nav-menu {
        position: fixed;
        top: 68px;
        left: 0;
        width: 100%;
        height: calc(100vh - 68px);
        background: var(--bg-beige);
        flex-direction: column;
        align-items: stretch;
        padding: 24px 20px;
        gap: 12px;
        border-bottom: 1px solid var(--border-color);
        box-shadow: 0 15px 35px rgba(41,37,36,0.18);
        display: none;
        overflow-y: auto;
        z-index: 999;
    }
    
    .nav-menu.open { display: flex; }

    .nav-menu .nav-link {
        font-size: 1.05rem;
        padding: 12px;
        border-bottom: 1px solid rgba(0,0,0,0.06);
        text-align: left;
        width: 100%;
    }

    .admin-panel-grid { grid-template-columns: 1fr; gap: 20px; }

    .slide-grid { grid-template-columns: 1fr; text-align: center; gap: 24px; }
    .poster-slogan-title { text-align: left; }
    .slide-actions { justify-content: center; }
    
    .steps-container { grid-template-columns: 1fr; gap: 18px; }
    .price-cards-5col { grid-template-columns: repeat(2, 1fr); gap: 16px; }
    
    .lemon-security-bar {
        grid-template-columns: 1fr;
        padding: 24px 20px;
        gap: 20px;
    }

    .lemon-sec-item {
        flex-direction: row;
        align-items: center;
        gap: 16px;
        padding: 16px;
        background: var(--bg-beige);
        border: 1px solid var(--border-color);
        border-radius: 14px;
    }

    .contact-box-grid { grid-template-columns: 1fr; gap: 32px; }
    .footer-grid-layout { grid-template-columns: 1fr 1fr; gap: 32px; }
    .trust-grid { grid-template-columns: repeat(2, 1fr); gap: 16px; }

    .slider-btn { width: 38px; height: 38px; font-size: 0.95rem; }
    .prev-btn { left: 4px; }
    .next-btn { right: 4px; }
    
    .lightbox-prev-btn { left: 8px; width: 44px; height: 44px; }
    .lightbox-next-btn { right: 8px; width: 44px; height: 44px; }
}

@media (max-width: 768px) {
    .container { padding: 0 16px; }
    
    .top-bar-content { flex-direction: column; gap: 6px; text-align: center; padding: 6px 12px; }
    .top-bar-left, .top-bar-right { font-size: 0.76rem; flex-wrap: wrap; justify-content: center; gap: 6px; }
    
    .brand-logo-img { height: 52px; max-width: 180px; object-fit: contain; }
    
    .header-container { padding: 10px 14px; }
    .header-actions-b { gap: 6px; }
    .btn-badge-store { padding: 7px 10px; font-size: 0.75rem; border-radius: 8px; font-weight: 800; }
    
    .hero-section { padding: 20px 0 30px 0; }
    .poster-slogan-card { padding: 18px 14px; border-radius: 16px; box-shadow: 0 8px 24px rgba(0,0,0,0.06); }
    .poster-slogan-title { font-size: clamp(1.15rem, 4.5vw, 1.4rem); line-height: 1.38; padding: 12px 14px; text-align: center; border-radius: 12px; }
    .slide-desc { font-size: 0.88rem; line-height: 1.55; text-align: center; margin: 12px 0 16px 0; }
    
    .slide-actions { flex-direction: column; width: 100%; gap: 10px; }
    .slide-actions .btn { width: 100%; justify-content: center; padding: 14px; font-size: 0.92rem; min-height: 48px; border-radius: 12px; font-weight: 800; }
    
    .compact-poster-frame { max-width: 100%; max-height: 280px; border-radius: 16px; margin-top: 14px; }
    .compact-poster-img { max-height: 280px; object-fit: contain; }
    
    .showcase-switcher-tabs { flex-direction: column; width: 100%; gap: 8px; }
    .showcase-tab { width: 100%; text-align: center; padding: 12px; font-size: 0.9rem; border-radius: 10px; }
    
    .price-cards-5col { grid-template-columns: 1fr; gap: 20px; }
    .price-card { padding: 24px 18px; border-radius: 18px; }
    .price-value { font-size: 1.85rem; }
    
    .lemon-security-bar {
        padding: 18px 14px;
        gap: 16px;
        border-radius: 18px;
    }

    .lemon-sec-item {
        flex-direction: column;
        text-align: center;
        align-items: center;
        gap: 10px;
        padding: 16px 14px;
        background: #FFFFFF;
        border: 1px solid var(--border-color);
        border-radius: 14px;
        box-shadow: 0 4px 12px rgba(0,0,0,0.03);
    }

    .lemon-sec-item div { width: 100%; }
    .lemon-sec-item strong { font-size: 1rem; margin-bottom: 4px; display: block; color: var(--primary-dark); }
    .lemon-sec-item p { font-size: 0.85rem; line-height: 1.5; color: var(--text-muted); }

    .shopier-store-logo-img {
        height: 40px;
        max-width: 150px;
        margin: 0 auto;
    }
    
    .download-guide-box { padding: 20px 16px; border-radius: 14px; }
    .download-guide-box h3 { font-size: 1.1rem; }
    .download-steps-ol li { font-size: 0.88rem; line-height: 1.6; margin-bottom: 8px; }

    .clean-form { padding: 20px 16px; border-radius: 16px; }
    
    .trust-grid { grid-template-columns: 1fr; gap: 12px; }
    .trust-box { padding: 14px; border-radius: 12px; }
    
    .footer-grid-layout { grid-template-columns: 1fr; text-align: center; gap: 24px; }
    .footer-col-main p { margin: 0 auto; }
    .social-links-row { justify-content: center; }
    .footer-logo-card { margin: 0 auto 16px auto; }
    
    .admin-modal-card { padding: 18px 12px; width: 96vw; max-height: 92vh; overflow-y: auto; border-radius: 16px; }
    .admin-nav-tabs { gap: 6px; overflow-x: auto; padding-bottom: 6px; flex-wrap: nowrap; }
    .admin-tab-btn { font-size: 0.78rem; padding: 8px 12px; white-space: nowrap; flex-shrink: 0; }
    .table-toolbar { flex-direction: column; gap: 8px; }
    .table-toolbar input, .table-toolbar select { width: 100%; }

    .modal-card { padding: 20px 16px; max-width: 95vw; border-radius: 16px; }
    
    .assistant-widget-container { bottom: 16px; right: 16px; }
}

/* ==========================================================================
   LANDSCAPE A4 PRINT & FULLSCREEN TABLE STYLES
   ========================================================================== */
.table-fullscreen-active,
.table-fullscreen-active:fullscreen,
.table-fullscreen-active:-webkit-full-screen {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    z-index: 999999 !important;
    background: #FFFFFF !important;
    padding: 16px 20px !important;
    overflow: auto !important;
    box-sizing: border-box !important;
}

.fullscreen-close-bar {
    position: sticky;
    top: 0;
    z-index: 100005;
    background: #0F172A;
    color: #FFF;
    padding: 12px 20px;
    border-radius: 12px;
    margin-bottom: 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-shadow: 0 8px 24px rgba(0,0,0,0.25);
    border: 1px solid #1E293B;
}

/* 3D LUXURY RED EXIT BUTTON */
.btn-3d-exit {
    background: linear-gradient(180deg, #EF4444 0%, #DC2626 100%);
    color: #FFFFFF !important;
    border: none;
    padding: 10px 22px;
    border-radius: 10px;
    font-weight: 900;
    font-size: 0.92rem;
    cursor: pointer;
    letter-spacing: 0.5px;
    box-shadow: 0 5px 0 #991B1B, 0 8px 15px rgba(220, 38, 38, 0.4);
    transition: all 0.15s ease;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.btn-3d-exit:hover {
    transform: translateY(-2px);
    box-shadow: 0 7px 0 #991B1B, 0 12px 20px rgba(220, 38, 38, 0.5);
}

.btn-3d-exit:active {
    transform: translateY(3px);
    box-shadow: 0 2px 0 #991B1B, 0 4px 8px rgba(220, 38, 38, 0.3);
}

.action-icon-btn {
    width: 28px;
    height: 28px;
    border-radius: 6px;
    border: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 0.82rem;
    transition: all 0.2s ease;
}

.action-icon-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.15);
}

@media print {
    @page {
        size: landscape;
        margin: 8mm;
    }
    body * {
        visibility: hidden !important;
    }
    .print-area-active, .print-area-active * {
        visibility: visible !important;
    }
    .print-area-active {
        position: absolute !important;
        left: 0 !important;
        top: 0 !important;
        width: 100% !important;
    }
    .no-print {
        display: none !important;
    }
    .license-table-wrapper {
        overflow: visible !important;
        max-height: none !important;
        border: none !important;
    }
    .license-table {
        min-width: 100% !important;
        width: 100% !important;
        font-size: 11px !important;
        border-collapse: collapse !important;
    }
    .license-table th, .license-table td {
        padding: 6px 8px !important;
        border: 1px solid #94A3B8 !important;
        word-break: break-all !important;
    }
}    .assistant-trigger-btn { padding: 10px 16px; font-size: 0.84rem; }
    .assistant-box { width: calc(100vw - 32px); right: 0; bottom: 65px; border-radius: 16px; }
}

@media (max-width: 480px) {
    .header-container { padding: 0 10px; }
    .btn-badge-store { padding: 6px 8px; font-size: 0.72rem; }
    .poster-slogan-title { font-size: 1.1rem; padding: 10px; }
    .compact-poster-frame { max-height: 230px; }
    .compact-poster-img { max-height: 230px; }
}

/* ADMIN PANEL FULLSCREEN ENGINE - MONİTÖR EKRANINI %100 KAPLAYAN DEVASA MODAL STİLİ */
#adminLicenseModal.admin-panel-fullscreen-active,
#adminLicenseModal.admin-panel-fullscreen-active .admin-modal-card,
.admin-modal-card.admin-panel-fullscreen-active,
.admin-panel-fullscreen-active {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    max-width: 100vw !important;
    max-height: 100vh !important;
    min-width: 100vw !important;
    min-height: 100vh !important;
    margin: 0 !important;
    border-radius: 0 !important;
    border: none !important;
    z-index: 99999999 !important;
    background: #FFFFFF !important;
    overflow-y: auto !important;
    box-sizing: border-box !important;
    padding: 20px 24px !important;
}

/* ==========================================================================
   3D DARK ANIMATED HEADERS & NAVBAR SYSTEM (2026 LUXURY SAAS EDITION)
   ========================================================================== */

@keyframes textShimmer3D {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

@keyframes iconPulse3D {
    0%, 100% { transform: scale(1) rotate(0deg); filter: drop-shadow(0 0 8px rgba(197, 165, 114, 0.7)); }
    50% { transform: scale(1.18) rotate(8deg); filter: drop-shadow(0 0 16px rgba(212, 36, 58, 0.95)); }
}

@keyframes iconGearSpin3D {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* CLEAN TEXT NAV MENU (NO BUTTON BAR, ANIMATED TEXT OVER HEADER BACKGROUND) */
.nav-menu {
    display: flex;
    align-items: center;
    gap: 10px;
    background: transparent !important;
    padding: 0 !important;
    border-radius: 0 !important;
    border: none !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
}

.nav-3d-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 2px !important;
    border-radius: 0 !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    color: #F8FAFC !important;
    font-weight: 800;
    font-size: 0.95rem;
    white-space: nowrap;
    text-decoration: none;
    transition: transform 0.3s ease, color 0.3s ease;
    position: relative;
    overflow: visible !important;
}

.nav-3d-link .nav-text {
    background: linear-gradient(90deg, #F0EAE0 0%, #E8C98A 30%, #C5A572 55%, #9A7A4A 80%, #F0EAE0 100%);
    background-size: 200% auto;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: textShimmer3D 4s linear infinite;
    font-weight: 800;
    letter-spacing: -0.01em;
}

.nav-3d-link i {
    font-size: 1.05rem;
    transition: transform 0.3s ease, filter 0.3s ease;
}

.nav-3d-link .icon-home { color: #C5A572; filter: drop-shadow(0 0 6px rgba(197,165,114,0.8)); }
.nav-3d-link .icon-about { color: #E8C98A; filter: drop-shadow(0 0 6px rgba(232,201,138,0.7)); }
.nav-3d-link .icon-gear { color: #C5A572; filter: drop-shadow(0 0 6px rgba(197,165,114,0.7)); }
.nav-3d-link .icon-sparkle { color: #D4243A; filter: drop-shadow(0 0 6px rgba(212,36,58,0.7)); }
.nav-3d-link .icon-tag { color: #E8C98A; filter: drop-shadow(0 0 6px rgba(232,201,138,0.8)); }
.nav-3d-link .icon-support { color: #C5A572; filter: drop-shadow(0 0 6px rgba(197,165,114,0.7)); }
.nav-3d-link .icon-contact { color: #C5A572; filter: drop-shadow(0 0 6px rgba(197,165,114,0.7)); }
.nav-3d-link .icon-faq { color: #E8C98A; filter: drop-shadow(0 0 6px rgba(232,201,138,0.7)); }

/* GLOWING GRADIENT UNDERLINE EFFECT ON HOVER & ACTIVE */
.nav-3d-link::after {
    content: '';
    position: absolute;
    bottom: -4px;
    left: 50%;
    transform: translateX(-50%);
    width: 0%;
    height: 2.5px;
    background: linear-gradient(90deg, #8B6B32 0%, #C5A572 50%, #E8C98A 100%);
    border-radius: 4px;
    box-shadow: 0 0 10px rgba(197, 165, 114, 0.8);
    transition: width 0.3s ease;
}

.nav-3d-link:hover, .nav-3d-link.active {
    transform: translateY(-2px);
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.nav-3d-link:hover::after {
    width: 100%;
}

.nav-3d-link:hover i {
    animation: iconPulse3D 1s ease infinite;
}

.nav-3d-link:hover .icon-gear {
    animation: iconGearSpin3D 2.5s linear infinite;
}

/* 12-LANGUAGE DROPDOWN MENU STYLES */
.nav-3d-link .icon-globe { color: #C5A572; filter: drop-shadow(0 0 6px rgba(197,165,114,0.8)); }
.nav-3d-link .icon-products { color: #C5A572; filter: drop-shadow(0 0 6px rgba(197,165,114,0.7)); }
.nav-3d-link .fa-bag-shopping { color: #C5A572; filter: drop-shadow(0 0 6px rgba(197,165,114,0.7)); }

.lang-dropdown-wrapper {
    position: relative;
    display: inline-block;
}

.nav-3d-link.lang-btn {
    cursor: pointer;
    background: transparent !important;
    border: none !important;
    font-family: inherit;
}

.lang-chevron {
    font-size: 0.75rem !important;
    color: #94A3B8;
    margin-left: 2px;
    transition: transform 0.3s ease;
}

.lang-dropdown-wrapper.open .lang-chevron {
    transform: rotate(180deg);
}

.lang-dropdown-menu {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    min-width: 260px;
    background: rgba(15, 23, 42, 0.96);
    backdrop-filter: blur(18px);
    border: 1.5px solid rgba(255, 255, 255, 0.16);
    border-radius: 16px;
    padding: 10px;
    box-shadow: 0 20px 45px rgba(0, 0, 0, 0.65), 0 0 20px rgba(197, 165, 114, 0.15);
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 6px;
    z-index: 1100;
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}

.lang-dropdown-menu.show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.lang-option-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border-radius: 10px;
    color: #F1F5F9;
    font-size: 0.86rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.2s ease;
    background: transparent;
    border: 1px solid transparent;
    width: 100%;
    text-align: left;
}

.lang-option-item:hover {
    background: rgba(197, 165, 114, 0.18);
    border-color: rgba(197, 165, 114, 0.4);
    color: #FFFFFF;
    transform: translateX(2px);
}

.lang-option-item.active {
    background: linear-gradient(135deg, #C5A572 0%, #D4243A 100%);
    color: #FFFFFF;
    border-color: transparent;
    box-shadow: 0 4px 14px rgba(197,165,114,0.35);
}

.lang-flag {
    font-size: 1.15rem;
    line-height: 1;
}

/* 3D DARK ANIMATED SECTION HEADER CARD SHOWCASE */
.section-header-3d-container {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-bottom: 40px;
}

.section-header-3d-dark {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: linear-gradient(145deg, #090D16 0%, #151D2A 100%);
    border: 1.5px solid rgba(255, 255, 255, 0.14);
    border-radius: 28px;
    padding: 26px 40px;
    box-shadow: 0 25px 60px rgba(0, 0, 0, 0.55), inset 0 1px 1px rgba(255, 255, 255, 0.22), inset 0 -3px 0 rgba(0, 0, 0, 0.85);
    position: relative;
    overflow: hidden;
    max-width: 1800px; width: 98vw;
    width: 100%;
    text-align: center;
    transition: transform 0.4s ease, box-shadow 0.4s ease;
}

.section-header-3d-dark:hover {
    transform: translateY(-5px) scale(1.01);
    box-shadow: 0 30px 70px rgba(197, 165, 114, 0.2), inset 0 1px 1px rgba(255, 255, 255, 0.3);
}

.section-header-3d-dark::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; height: 3px;
    background: linear-gradient(90deg, transparent, #C5A572, #D4243A, #38BDF8, #FBBF24, transparent);
    animation: textShimmer3D 3s linear infinite;
    background-size: 200% 100%;
}

.section-header-3d-dark .badge-3d-icon {
    width: 60px;
    height: 60px;
    border-radius: 20px;
    background: linear-gradient(135deg, rgba(197,165,114,0.2) 0%, rgba(212,36,58,0.2) 100%);
    border: 1.5px solid rgba(255,255,255,0.18);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.8rem;
    margin-bottom: 16px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.45), inset 0 1px 0 rgba(255,255,255,0.25);
    animation: iconPulse3D 3s ease-in-out infinite;
}

.title-3d-animated {
    font-size: 2.3rem;
    font-weight: 950;
    line-height: 1.25;
    margin-bottom: 10px;
    background: linear-gradient(90deg, #F0EAE0 0%, #E8C98A 30%, #C5A572 55%, #9A7A4A 80%, #F0EAE0 100%);
    background-size: 200% auto;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: textShimmer3D 4s linear infinite;
    letter-spacing: -0.03em;
}

.subtitle-3d-dark {
    font-size: 1.05rem;
    color: #94A3B8;
    font-weight: 600;
    margin: 0;
    line-height: 1.6;
}

@media (max-width: 768px) {
    .nav-menu {
        flex-direction: column;
        width: 100%;
        border-radius: 20px;
        padding: 14px;
    }
    .nav-3d-link {
        width: 100%;
        justify-content: center;
    }
    .section-header-3d-dark {
        padding: 20px 18px;
        border-radius: 20px;
    }
    .title-3d-animated {
        font-size: 1.75rem;
    }
}


/* ==========================================================================
   UNIFIED LUXURY SECTION HEADING STYLES (MATCHING "Neden Binlerce Kullanıcı...")
   ========================================================================== */
.section-title-unified {
    font-size: 2.4rem !important;
    font-weight: 950 !important;
    letter-spacing: -0.03em !important;
    line-height: 1.25 !important;
    margin-top: 0 !important;
    margin-bottom: 14px !important;
    text-align: center;
}

.section-title-unified .title-gradient,
.section-title-unified span.highlight-gradient {
    background: linear-gradient(135deg, #8B6B32 0%, #C5A572 50%, #6B4E1F 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    filter: drop-shadow(0 4px 14px rgba(197, 165, 114, 0.3)) !important;
    display: inline-block;
}

@media (max-width: 768px) {
    .section-title-unified {
        font-size: 1.85rem !important;
    }
}

/* ==========================================================================
   MASTER UNIFIED SECTION HEADING STYLES (MATCHING "Neden Binlerce Kullanıcı...")
   ========================================================================== */
.section-title-unified,
h2.section-title-unified,
h1.section-title-unified {
    font-size: 2.4rem !important;
    font-weight: 950 !important;
    letter-spacing: -0.03em !important;
    line-height: 1.25 !important;
    margin-top: 0 !important;
    margin-bottom: 16px !important;
    text-align: center !important;
}

.section-title-unified .title-gradient,
.section-title-unified span.title-gradient,
.section-title-unified span.highlight-gradient,
.title-gradient {
    background: linear-gradient(135deg, #8B6B32 0%, #C5A572 50%, #6B4E1F 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    color: transparent !important;
    filter: drop-shadow(0 4px 14px rgba(197, 165, 114, 0.3)) !important;
    display: inline-block !important;
    font-weight: 950 !important;
}

@media (max-width: 768px) {
    .section-title-unified,
    h2.section-title-unified,
    h1.section-title-unified {
        font-size: 1.85rem !important;
    }
}


/* ----------------------------------------------------
   100% PURE CSS ULTRA-TIGHT CANDLE LIGHT AMBILIGHT FOR LOGO
---------------------------------------------------- */
.footer-brand-logo-glow {
    height: 220px !important;
    width: auto !important;
    display: inline-block !important;
    transition: transform 0.3s ease;
    filter: drop-shadow(0 0 4px rgba(255, 175, 0, 0.85));
    animation: tightCandleBreathing 3.6s infinite ease-in-out;
}

@keyframes tightCandleBreathing {
    0% {
        filter: drop-shadow(0 0 2px rgba(255, 160, 0, 0.5));
    }
    50% {
        filter: drop-shadow(0 0 5px rgba(255, 190, 0, 0.9));
    }
    100% {
        filter: drop-shadow(0 0 2px rgba(255, 160, 0, 0.5));
    }
}



/* ----------------------------------------------------
   RESPONSIVE SINGLE-ROW LEGAL SUB-NAVIGATION TABS
---------------------------------------------------- */
.legal-tabs-nav {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 6px !important;
    justify-content: space-between !important;
    align-items: center !important;
    margin: -20px auto 35px auto !important;
    padding: 8px 10px !important;
    background: #FFFFFF !important;
    border-radius: 18px !important;
    border: 1.5px solid #E2E8F0 !important;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.04) !important;
    max-width: 1020px !important;
    width: 100% !important;
    overflow-x: auto !important;
    scrollbar-width: none !important; /* Firefox */
    -ms-overflow-style: none !important; /* IE 10+ */
}

.legal-tabs-nav::-webkit-scrollbar {
    display: none !important; /* Chrome, Safari, Opera */
}

.legal-tab-btn {
    flex: 1 1 0px !important;
    min-width: 0 !important;
    white-space: nowrap !important;
    padding: 8px 10px !important;
    border-radius: 12px !important;
    font-weight: 800 !important;
    font-size: clamp(0.70rem, 1.05vw, 0.85rem) !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
    transition: all 0.2s ease !important;
    text-align: center !important;
}

.legal-tab-btn i {
    font-size: 0.88em !important;
    flex-shrink: 0 !important;
}

.legal-tab-btn span {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

@media (max-width: 640px) {
    .legal-tabs-nav {
        justify-content: flex-start !important;
        padding: 6px 8px !important;
    }
    .legal-tab-btn {
        flex: 0 0 auto !important;
        padding: 7px 10px !important;
        font-size: 0.76rem !important;
    }
}





/* TOC ITEM LINK HOVER ANIMATION */
.toc-item-link {
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
}
.toc-item-link:hover {
    transform: translateY(-3px) scale(1.01) !important;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08) !important;
    filter: brightness(0.97) !important;
}

/* ----------------------------------------------------
   ULTRA SLIM EXECUTIVE DATA DENSITY FOR LICENSE TABLE
---------------------------------------------------- */
.table-card-box {
    padding: 10px 14px !important;
}

.license-table-wrapper {
    max-height: 650px !important;
    overflow-y: auto !important;
    border-radius: 8px !important;
}

.license-table {
    min-width: 900px !important;
    width: 100% !important;
    border-collapse: collapse !important;
    font-size: 0.78rem !important;
    border: 1.5px solid #CBD5E1 !important;
    background: #FFFFFF !important;
}

.license-table th {
    background: #1E293B !important;
    color: #F8FAFC !important;
    padding: 5px 8px !important;
    text-align: left !important;
    white-space: nowrap !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 10 !important;
    font-weight: 800 !important;
    font-size: 0.78rem !important;
    border: 1px solid #334155 !important;
    line-height: 1.2 !important;
}

.license-table td {
    padding: 3px 6px !important;
    border: 1px solid #E2E8F0 !important;
    vertical-align: middle !important;
    white-space: nowrap !important;
    font-size: 0.78rem !important;
    line-height: 1.15 !important;
    height: 28px !important;
}

.license-table .action-icon-btn {
    width: 22px !important;
    height: 22px !important;
    border-radius: 4px !important;
    border: none !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 0.70rem !important;
    transition: all 0.15s ease !important;
    padding: 0 !important;
}

.license-table .action-icon-btn:hover {
    transform: scale(1.15) !important;
    filter: brightness(0.9) !important;
}

.license-table .status-chip {
    padding: 1px 5px !important;
    font-size: 0.71rem !important;
    border-radius: 4px !important;
    font-weight: 800 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 3px !important;
    line-height: 1.1 !important;
}

.license-table code {
    font-size: 0.81rem !important;
    letter-spacing: 0px !important;
}

/* ULTRA-SLIM MODAL SECURITY TABLE STYLES */
.stat-detail-slim-table th,
.stat-detail-slim-table td {
    padding: 3px 6px !important;
    font-size: 0.73rem !important;
    line-height: 1.25 !important;
    white-space: nowrap !important;
}

.stat-detail-slim-table tr {
    height: 28px !important;
}

.stat-detail-slim-table .status-chip {
    padding: 1px 5px !important;
    font-size: 0.68rem !important;
}

/* LUXURY PERFECTLY CENTERED CLOSE BUTTON STYLES */
.btn-close-modal {
    background: #F1F5F9 !important;
    border: 1px solid #CBD5E1 !important;
    color: #475569 !important;
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    min-height: 32px !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    font-size: 0.90rem !important;
    line-height: 1 !important;
    padding: 0 !important;
    margin: 0 !important;
    outline: none !important;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
    box-sizing: border-box !important;
}

.btn-close-modal:hover {
    background: #DC2626 !important;
    color: #FFFFFF !important;
    border-color: #DC2626 !important;
    transform: scale(1.1) rotate(90deg) !important;
    box-shadow: 0 4px 12px rgba(220, 38, 38, 0.3) !important;
}

/* ==========================================================================
   UNIVERSAL WHITE LEATHER TEXTURE FOR ALL MODALS, DRAWERS & ADMIN PANELS
   (PREVENTS INDEX/LANDING PAGE FROM BLEEDING THROUGH ON SCROLL OR WINDOW OPEN)
   ========================================================================== */

body.modal-open,
body.admin-open {
    overflow: hidden !important;
    height: 100vh !important;
}

.admin-panel-modal,
#customer360Backdrop,
#modalBackupTaskEditor,
#statCardDetailModal,
#deviceActionDetailModal,
#todayBlockedListModal,
#todayQuotaLimitModal,
#adminCalendarNotesModal,
#emailDebugModal,
#restoreShopierOrdersModal,
#changeShopierLicenseKeyModal,
#extendLicenseModal,
#changePackageModal,
#changeSourceModal,
#modalSendMailLangPicker,
#modalSendDemoOffer,
#editFullLicenseDetailsModal,
#adminAuthModal,
#modalServerMediaLibrary,
#modalAnnouncementFullscreen,
#announcementLivePreviewModal,
#otonomSimulateModal {
    background-color: #F8FAFC !important;
    
    
    
    
}

/* 🚨 KÜRESEL ACİL DURUM & İTFAİYE İKAZ LAMBASI ANİMASYONLARI */
@keyframes sirenFlashPulse {
    0% {
        transform: scale(1);
        filter: drop-shadow(0 0 3px #EF4444);
        opacity: 0.9;
    }
    50% {
        transform: scale(1.28);
        filter: drop-shadow(0 0 12px #FF0000) drop-shadow(0 0 20px rgba(239,68,68,0.9));
        opacity: 1;
    }
    100% {
        transform: scale(1);
        filter: drop-shadow(0 0 3px #EF4444);
        opacity: 0.9;
    }
}

.siren-active-lamp {
    display: inline-block;
    animation: sirenFlashPulse 0.7s infinite ease-in-out !important;
}

@keyframes sirenBannerGlow {
    0% {
        box-shadow: 0 0 6px rgba(220, 38, 38, 0.4);
        border-color: #EF4444;
    }
    50% {
        box-shadow: 0 0 16px rgba(220, 38, 38, 0.9);
        border-color: #FCA5A5;
    }
    100% {
        box-shadow: 0 0 6px rgba(220, 38, 38, 0.4);
        border-color: #EF4444;
    }
}

.siren-active-pill {
    animation: sirenBannerGlow 1.1s infinite ease-in-out !important;
}


/* ========================================================================= */
/* CROWNORAFIX MULTI-PRODUCT ECOSYSTEM SHOWCASE */
/* ========================================================================= */
.products-ecosystem-section {
    padding: 90px 0;
    background: linear-gradient(180deg, #FBF6EA 0%, #F6EFD9 100%);
    border-bottom: 1px solid rgba(197, 165, 114, 0.28);
    position: relative;
}

.products-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(330px, 1fr));
    gap: 30px;
    margin-top: 45px;
}

.product-card-lux {
    background: #FFFDF8;
    border-radius: 24px;
    padding: 36px 30px;
    border: 1.5px solid rgba(197, 165, 114, 0.42);
    box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.06);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: relative;
    overflow: hidden;
}

.product-card-lux:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 45px -12px rgba(197, 165, 114, 0.18);
    border-color: #FED7AA;
}

.product-card-lux.active-flagship {
    border: 2px solid #9A7A4A;
    background: linear-gradient(180deg, rgba(11, 31, 58, 0.95) 0%, rgba(6, 17, 40, 0.95) 100%);
}

.product-card-lux.labs-preview {
    background: linear-gradient(180deg, rgba(11, 31, 58, 0.7) 0%, rgba(6, 17, 40, 0.85) 100%);
    border: 1.5px dashed rgba(197, 165, 114, 0.35);
}

.product-badge-live {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #DCFCE7;
    color: #15803D;
    font-size: 0.82rem;
    font-weight: 900;
    padding: 6px 14px;
    border-radius: 20px;
    border: 1px solid #86EFAC;
}

.product-badge-dev {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #FEF3C7;
    color: #B45309;
    font-size: 0.82rem;
    font-weight: 900;
    padding: 6px 14px;
    border-radius: 20px;
    border: 1px solid #FDE68A;
}

.product-badge-coming {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #F1F5F9;
    color: #475569;
    font-size: 0.82rem;
    font-weight: 900;
    padding: 6px 14px;
    border-radius: 20px;
    border: 1px solid #CBD5E1;
}


/* ========================================================================= */
/* CROWNORAFIX LUXURY UI HELPERS & VISUAL SIGNATURE */
/* ========================================================================= */
.badge-glow {
    background: linear-gradient(135deg, #102646 0%, #0B1F3A 100%);
    color: #C5A572;
    border: 1px solid #FED7AA;
    padding: 8px 18px;
    border-radius: 30px;
    font-size: 0.85rem;
    font-weight: 800;
    letter-spacing: 0.02em;
    box-shadow: 0 4px 15px rgba(197, 165, 114, 0.12);
    display: inline-flex;
    align-items: center;
}

.title-gradient {
    background: linear-gradient(135deg, #8B6B32 0%, #C5A572 50%, #6B4E1F 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    color: transparent !important;
    display: inline-block !important;
}

.product-card-lux {
    background: rgba(11, 31, 58, 0.82);
    border-radius: 24px;
    padding: 34px 28px;
    border: 1.5px solid rgba(197, 165, 114, 0.32);
    box-shadow: 0 12px 35px -10px rgba(0, 0, 0, 0.05);
    transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: relative;
    overflow: hidden;
}

.product-card-lux::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, #C5A572, #D4243A);
    opacity: 0;
    transition: opacity 0.3s ease;
}

.product-card-lux:hover {
    transform: translateY(-8px);
    box-shadow: 0 24px 50px -12px rgba(197, 165, 114, 0.20);
    border-color: #FED7AA;
}

.product-card-lux:hover::before {
    opacity: 1;
}

.product-card-lux.active-flagship {
    border: 2px solid #9A7A4A;
    background: linear-gradient(180deg, rgba(11, 31, 58, 0.95) 0%, rgba(6, 17, 40, 0.95) 100%);
    box-shadow: 0 16px 40px -12px rgba(197, 165, 114, 0.14);
}

.product-card-lux.active-flagship::before {
    opacity: 1;
}

.product-card-lux.labs-preview {
    background: linear-gradient(180deg, rgba(11, 31, 58, 0.7) 0%, rgba(6, 17, 40, 0.85) 100%);
    border: 1.5px dashed rgba(197, 165, 114, 0.35);
}

.product-card-lux.labs-preview:hover {
    border-color: #94A3B8;
    box-shadow: 0 20px 40px -12px rgba(0, 0, 0, 0.08);
}


/* ========================================================================= */
/* ULTRA-LUXURY MOBILE RESPONSIVE ENGINE & 3-LINE HAMBURGER MENU */
/* ========================================================================= */

@media (max-width: 992px) {
    .mobile-toggle {
        display: flex !important;
        align-items: center;
        justify-content: center;
        width: 44px;
        height: 44px;
        background: #FFFFFF !important;
        border: 1.5px solid #FED7AA !important;
        border-radius: 12px !important;
        color: #C5A572 !important;
        font-size: 1.25rem !important;
        box-shadow: 0 4px 14px rgba(197, 165, 114, 0.15) !important;
        cursor: pointer;
        transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
        z-index: 1001;
    }
    
    .mobile-toggle:active {
        transform: scale(0.92);
        background: #102646 !important;
    }

    .nav-menu {
        position: fixed !important;
        top: 68px !important;
        left: 0 !important;
        width: 100% !important;
        height: calc(100vh - 68px) !important;
        background: rgba(255, 255, 255, 0.98) !important;
        backdrop-filter: blur(16px) !important;
        -webkit-backdrop-filter: blur(16px) !important;
        flex-direction: column !important;
        align-items: stretch !important;
        padding: 24px 20px 40px 20px !important;
        gap: 10px !important;
        border-top: 1px solid #FED7AA !important;
        box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25) !important;
        display: none !important;
        overflow-y: auto !important;
        z-index: 9999 !important;
    }

    .nav-menu.open {
        display: flex !important;
        animation: slideDownNav 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    }

    @keyframes slideDownNav {
        0% { opacity: 0; transform: translateY(-12px); }
        100% { opacity: 1; transform: translateY(0); }
    }

    .nav-menu .nav-3d-link {
        display: flex !important;
        align-items: center !important;
        gap: 14px !important;
        background: #FFFFFF !important;
        border: 1.5px solid #E2E8F0 !important;
        border-radius: 14px !important;
        padding: 14px 18px !important;
        font-size: 1.05rem !important;
        font-weight: 800 !important;
        color: #1E293B !important;
        box-shadow: 0 3px 10px rgba(0, 0, 0, 0.04) !important;
        transition: all 0.2s ease !important;
        min-height: 52px !important;
        width: 100% !important;
    }

    .nav-menu .nav-3d-link:hover,
    .nav-menu .nav-3d-link:active {
        background: linear-gradient(135deg, #102646 0%, #FFFFFF 100%) !important;
        border-color: #C5A572 !important;
        transform: translateX(4px);
        color: #C5A572 !important;
    }

    .nav-menu .lang-dropdown-wrapper {
        width: 100% !important;
        margin-top: 10px !important;
    }

    .nav-menu .lang-btn {
        width: 100% !important;
        justify-content: space-between !important;
        background: #F8FAFC !important;
        border: 1.5px solid #CBD5E1 !important;
        padding: 14px 18px !important;
    }
}

@media (max-width: 768px) {
    .products-grid {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }

    .product-card-lux {
        padding: 26px 20px !important;
        border-radius: 20px !important;
    }

    .slide-actions .btn,
    .product-actions .btn,
    .price-actions .btn {
        width: 100% !important;
        min-height: 50px !important;
        font-size: 0.95rem !important;
        border-radius: 12px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
}


/* ==========================================================================
   MASTER BULLETPROOF MOBILE NAVIGATION & RESPONSIVE ENGINE (OVERRIDE ALL)
   ========================================================================== */

@media (min-width: 993px) {
    .mobile-toggle {
        display: none !important;
    }
}

@media (max-width: 992px) {
    html, body {
        overflow-x: hidden !important;
        width: 100% !important;
        position: relative !important;
    }

    .header-container {
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        height: 68px !important;
        padding: 0 16px !important;
    }

    .header-actions-b {
        display: flex !important;
        align-items: center !important;
    }

    .mobile-toggle {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 44px !important;
        height: 44px !important;
        background: #0F172A !important;
        border: 2px solid #38BDF8 !important;
        border-radius: 12px !important;
        color: #38BDF8 !important;
        font-size: 1.35rem !important;
        cursor: pointer !important;
        z-index: 100001 !important;
        box-shadow: 0 4px 14px rgba(56, 189, 248, 0.35) !important;
        transition: all 0.25s ease !important;
    }

    .mobile-toggle:active {
        transform: scale(0.92) !important;
        background: #1E293B !important;
    }

    /* THE NAV MENU MUST BE HIDDEN BY DEFAULT ON MOBILE */
    .nav-menu {
        display: none !important;
        position: fixed !important;
        top: 68px !important;
        left: 0 !important;
        width: 100vw !important;
        height: calc(100vh - 68px) !important;
        background: rgba(15, 23, 42, 0.98) !important;
        backdrop-filter: blur(20px) !important;
        -webkit-backdrop-filter: blur(20px) !important;
        flex-direction: column !important;
        align-items: stretch !important;
        padding: 20px 16px 50px 16px !important;
        gap: 10px !important;
        border-top: 1px solid rgba(56, 189, 248, 0.3) !important;
        box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5) !important;
        overflow-y: auto !important;
        z-index: 99999 !important;
    }

    /* WHEN OPEN CLASS IS ADDED BY JAVASCRIPT, DISPLAY AS FLEX */
    .nav-menu.open {
        display: flex !important;
        animation: mobileNavSlide 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards !important;
    }

    @keyframes mobileNavSlide {
        0% { opacity: 0; transform: translateY(-15px); }
        100% { opacity: 1; transform: translateY(0); }
    }

    .nav-menu .nav-3d-link {
        display: flex !important;
        align-items: center !important;
        gap: 14px !important;
        background: #1E293B !important;
        border: 1.5px solid rgba(56, 189, 248, 0.25) !important;
        border-radius: 14px !important;
        padding: 14px 18px !important;
        font-size: 1.05rem !important;
        font-weight: 800 !important;
        color: #F8FAFC !important;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25) !important;
        transition: all 0.2s ease !important;
        min-height: 52px !important;
        width: 100% !important;
        text-decoration: none !important;
    }

    .nav-menu .nav-3d-link:hover,
    .nav-menu .nav-3d-link:active {
        background: linear-gradient(135deg, #1E293B 0%, #0F172A 100%) !important;
        border-color: #38BDF8 !important;
        transform: translateX(4px) !important;
        color: #38BDF8 !important;
    }

    .nav-menu .lang-dropdown-wrapper {
        width: 100% !important;
        margin-top: 10px !important;
    }

    .nav-menu .lang-btn {
        width: 100% !important;
        justify-content: space-between !important;
        background: #1E293B !important;
        border: 1.5px solid rgba(56, 189, 248, 0.4) !important;
        padding: 14px 18px !important;
        color: #F8FAFC !important;
    }
}


/* ==========================================================================
   COMPREHENSIVE FULL-PAGE MOBILE RESPONSIVENESS OVERRIDE (EVERY SECTION)
   ========================================================================== */

@media (min-width: 993px) {
    .mobile-toggle {
        display: none !important;
    }
}

@media (max-width: 992px) {
    html, body {
        overflow-x: hidden !important;
        width: 100% !important;
        position: relative !important;
    }

    /* Header & Mobile Drawer */
    .header-container {
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        height: 68px !important;
        padding: 0 16px !important;
    }

    .mobile-toggle {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 44px !important;
        height: 44px !important;
        background: #0F172A !important;
        border: 2px solid #38BDF8 !important;
        border-radius: 12px !important;
        color: #38BDF8 !important;
        font-size: 1.35rem !important;
        cursor: pointer !important;
        z-index: 100001 !important;
        box-shadow: 0 4px 14px rgba(56, 189, 248, 0.35) !important;
        transition: all 0.25s ease !important;
    }

    .mobile-toggle:active {
        transform: scale(0.92) !important;
        background: #1E293B !important;
    }

    .nav-menu {
        display: none !important;
        position: fixed !important;
        top: 68px !important;
        left: 0 !important;
        width: 100vw !important;
        height: calc(100vh - 68px) !important;
        background: rgba(15, 23, 42, 0.98) !important;
        backdrop-filter: blur(20px) !important;
        -webkit-backdrop-filter: blur(20px) !important;
        flex-direction: column !important;
        align-items: stretch !important;
        padding: 20px 16px 50px 16px !important;
        gap: 10px !important;
        border-top: 1px solid rgba(56, 189, 248, 0.3) !important;
        box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5) !important;
        overflow-y: auto !important;
        z-index: 99999 !important;
    }

    .nav-menu.open {
        display: flex !important;
        animation: mobileNavSlideIn 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards !important;
    }

    @keyframes mobileNavSlideIn {
        0% { opacity: 0; transform: translateY(-15px); }
        100% { opacity: 1; transform: translateY(0); }
    }

    .nav-menu .nav-3d-link {
        display: flex !important;
        align-items: center !important;
        gap: 14px !important;
        background: #1E293B !important;
        border: 1.5px solid rgba(56, 189, 248, 0.25) !important;
        border-radius: 14px !important;
        padding: 14px 18px !important;
        font-size: 1.05rem !important;
        font-weight: 800 !important;
        color: #F8FAFC !important;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25) !important;
        transition: all 0.2s ease !important;
        min-height: 52px !important;
        width: 100% !important;
        text-decoration: none !important;
    }

    .nav-menu .nav-3d-link:hover,
    .nav-menu .nav-3d-link:active {
        background: linear-gradient(135deg, #1E293B 0%, #0F172A 100%) !important;
        border-color: #38BDF8 !important;
        transform: translateX(4px) !important;
        color: #38BDF8 !important;
    }

    .nav-menu .lang-dropdown-wrapper {
        width: 100% !important;
        margin-top: 10px !important;
    }

    .nav-menu .lang-btn {
        width: 100% !important;
        justify-content: space-between !important;
        background: #1E293B !important;
        border: 1.5px solid rgba(56, 189, 248, 0.4) !important;
        padding: 14px 18px !important;
        color: #F8FAFC !important;
    }

    /* Headings & Texts across sections */
    .section, section {
        padding: 45px 0 !important;
    }

    .section-title-unified, h2.section-title-unified, h2 {
        font-size: clamp(1.35rem, 5.5vw, 1.95rem) !important;
        white-space: normal !important;
        line-height: 1.35 !important;
        word-break: break-word !important;
    }

    /* Benefits Slider Section (#benefits-slider) */
    .benefit-slide-item,
    div[id="benefitsSlidesTrack"] > div {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
        text-align: center !important;
    }

    /* Steps & Features */
    .steps-container,
    .price-cards-5col,
    .price-cards-grid,
    .products-grid {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }

    .price-card,
    .product-card-lux {
        width: 100% !important;
        padding: 24px 18px !important;
        border-radius: 20px !important;
    }

    .lemon-security-bar {
        grid-template-columns: 1fr !important;
        padding: 20px 16px !important;
        gap: 16px !important;
    }

    .lemon-sec-item {
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
    }

    .footer-grid-layout {
        grid-template-columns: 1fr !important;
        gap: 28px !important;
        text-align: center !important;
    }
}

@media (max-width: 768px) {
    .container {
        padding: 0 14px !important;
        max-width: 100% !important;
    }

    .top-bar-content {
        flex-direction: column !important;
        gap: 6px !important;
        text-align: center !important;
        padding: 8px 12px !important;
    }

    .top-bar-left, .top-bar-right {
        font-size: 0.76rem !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
        gap: 6px !important;
    }

    .brand-logo-img {
        height: 48px !important;
        max-width: 160px !important;
        object-fit: contain !important;
    }

    .hero-section {
        padding: 15px 0 25px 0 !important;
    }

    .slide-grid {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
        text-align: center !important;
    }

    .poster-slogan-card {
        padding: 20px 16px !important;
        border-radius: 18px !important;
    }

    .poster-slogan-title {
        font-size: clamp(1.15rem, 4.8vw, 1.45rem) !important;
        line-height: 1.4 !important;
        text-align: center !important;
        padding: 10px 12px !important;
    }

    .slide-actions {
        flex-direction: column !important;
        width: 100% !important;
        gap: 10px !important;
    }

    .slide-actions .btn,
    .btn-primary-full,
    .btn-shopier,
    .price-btn {
        width: 100% !important;
        min-height: 52px !important;
        font-size: 1rem !important;
        font-weight: 800 !important;
        border-radius: 12px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .compact-poster-frame {
        max-width: 100% !important;
        max-height: 280px !important;
        border-radius: 16px !important;
        margin: 12px auto 0 auto !important;
    }

    .compact-poster-img {
        max-height: 280px !important;
        width: 100% !important;
        object-fit: contain !important;
    }

    .showcase-switcher-tabs {
        flex-direction: column !important;
        width: 100% !important;
        gap: 8px !important;
    }

    .showcase-tab {
        width: 100% !important;
        padding: 12px !important;
        text-align: center !important;
    }

    .modal-card {
        width: 95vw !important;
        max-width: 95vw !important;
        padding: 22px 16px !important;
        border-radius: 18px !important;
        margin: 10px auto !important;
    }
}


/* ==========================================================================
   PERFECT VISUAL, IMAGE & CARD LAYOUT FOR MOBILE SCREENS
   ========================================================================== */

@media (max-width: 992px) {
    /* 1. HERO SECTION VISUAL & TEXT STACKING */
    #hero .container > div[style*="grid-template-columns"],
    div[style*="grid-template-columns: 1.3fr 0.7fr"] {
        grid-template-columns: 1fr !important;
        gap: 28px !important;
        text-align: center !important;
    }

    #hero h1 {
        font-size: clamp(1.45rem, 5.5vw, 2.1rem) !important;
        text-align: center !important;
        line-height: 1.3 !important;
    }

    #hero ul {
        text-align: left !important;
        max-width: 540px !important;
        margin: 0 auto 28px auto !important;
    }

    #hero ul li {
        font-size: 0.95rem !important;
    }

    #hero div[style*="flex-direction: row"] {
        flex-direction: column !important;
        width: 100% !important;
        gap: 10px !important;
    }

    #hero div[style*="flex-direction: row"] a {
        width: 100% !important;
        flex: 1 1 100% !important;
        min-height: 52px !important;
        font-size: 0.95rem !important;
        font-weight: 800 !important;
        border-radius: 14px !important;
        box-sizing: border-box !important;
    }

    /* Hero Showcase Visual Window */
    #hero div[style*="max-width: 310px"],
    #hero div[style*="max-width:310px"] {
        max-width: 340px !important;
        width: 92% !important;
        margin: 10px auto 0 auto !important;
        padding: 8px !important;
        border-radius: 22px !important;
    }

    #hero div[style*="max-width: 310px"] img,
    #hero div[style*="max-width:310px"] img {
        width: 100% !important;
        height: auto !important;
        border-radius: 16px !important;
        display: block !important;
    }

    /* 2. BENEFITS SLIDER SLIDES (TEXT TOP, IMAGE BOTTOM, PERFECT HARMONY) */
    .benefit-slide-item,
    div[style*="grid-template-columns: 1.1fr 0.9fr"] {
        grid-template-columns: 1fr !important;
        gap: 24px !important;
        text-align: center !important;
        padding: 10px !important;
    }

    .benefit-slide-item ul {
        text-align: left !important;
        max-width: 480px !important;
        margin: 0 auto !important;
    }

    .benefit-slide-item h3 {
        font-size: 1.35rem !important;
        text-align: center !important;
    }

    .benefit-slide-item img {
        width: 100% !important;
        max-width: 340px !important;
        height: auto !important;
        margin: 14px auto 0 auto !important;
        border-radius: 16px !important;
        display: block !important;
        box-shadow: 0 12px 30px rgba(0, 0, 0, 0.35) !important;
    }

    /* Slider Container Frame */
    div[id="benefits-slider"] div[style*="max-width: 920px"],
    div[id="benefits-slider"] div[style*="max-width:920px"] {
        padding: 24px 16px !important;
        border-radius: 20px !important;
    }

    /* 3. SCREENSHOT SHOWCASE & COMPARISON SECTIONS */
    div[style*="grid-template-columns: 1fr 1fr"],
    div[style*="grid-template-columns: 1.4fr 1fr"] {
        grid-template-columns: 1fr !important;
        gap: 24px !important;
    }

    /* Section Headings Across Entire Site */
    .section-title-unified,
    h2.section-title-unified,
    h2 {
        font-size: clamp(1.35rem, 5.2vw, 1.95rem) !important;
        white-space: normal !important;
        line-height: 1.35 !important;
        word-break: break-word !important;
        text-align: center !important;
    }

    /* Feature & Stat Cards */
    div[style*="grid-template-columns: repeat(auto-fit"] {
        grid-template-columns: 1fr !important;
        gap: 18px !important;
    }
}


/* ==========================================================================
   HEADER ACTIONS & MOBILE HAMBURGER WITH LEFT-ALIGNED LANGUAGE SELECTOR
   ========================================================================== */

.header-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
}

.header-actions-b {
    display: flex;
    align-items: center;
    gap: 12px;
}

.header-lang-pill {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    background: #0F172A !important;
    border: 1.5px solid rgba(197, 165, 114, 0.4) !important;
    border-radius: 12px !important;
    padding: 8px 14px !important;
    color: #F8FAFC !important;
    font-weight: 800 !important;
    font-size: 0.86rem !important;
    cursor: pointer !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
    transition: all 0.2s ease !important;
    white-space: nowrap !important;
}

.header-lang-pill:hover,
.header-lang-pill:active {
    border-color: #C5A572 !important;
    box-shadow: 0 4px 16px rgba(197, 165, 114, 0.35) !important;
    background: #1E293B !important;
}

.header-lang-pill i.icon-globe {
    color: #38BDF8 !important;
    font-size: 0.95rem !important;
}

/* 3-LINE HAMBURGER BUTTON STYLED MATCHING HEADER COLOR SYSTEM */
.mobile-toggle {
    display: none;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    background: linear-gradient(135deg, #0F172A 0%, #1E293B 100%) !important;
    border: 2px solid #C5A572 !important;
    border-radius: 12px !important;
    color: #C5A572 !important;
    font-size: 1.35rem !important;
    cursor: pointer !important;
    box-shadow: 0 4px 16px rgba(197, 165, 114, 0.35) !important;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.mobile-toggle:hover,
.mobile-toggle:active {
    transform: scale(0.94) !important;
    border-color: #38BDF8 !important;
    color: #38BDF8 !important;
    box-shadow: 0 4px 18px rgba(56, 189, 248, 0.45) !important;
}

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

    .header-actions-b {
        display: flex !important;
        align-items: center !important;
        gap: 10px !important;
    }

    .header-lang-pill {
        padding: 7px 11px !important;
        font-size: 0.80rem !important;
        border-radius: 10px !important;
    }

    .lang-dropdown-menu {
        top: 50px !important;
        right: 0 !important;
        max-height: 70vh !important;
        overflow-y: auto !important;
    }
}


/* ==========================================================================
   MATCHING TITLE-GRADIENT HEADER ACTION BUTTONS (GLOBE & HAMBURGER)
   ========================================================================== */

.header-actions-b {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
}

.header-lang-globe-btn,
.mobile-toggle {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 44px !important;
    height: 44px !important;
    background: linear-gradient(135deg, #8B6B32 0%, #C5A572 50%, #6B4E1F 100%) !important;
    border: none !important;
    border-radius: 12px !important;
    color: #FFFFFF !important;
    font-size: 1.25rem !important;
    cursor: pointer !important;
    box-shadow: 0 4px 18px rgba(197, 165, 114, 0.4) !important;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
    flex-shrink: 0 !important;
    position: relative !important;
}

.header-lang-globe-btn:hover,
.header-lang-globe-btn:active,
.header-lang-globe-btn.open,
.mobile-toggle:hover,
.mobile-toggle:active,
.mobile-toggle.active {
    background: linear-gradient(135deg, #D4243A 0%, #9A7A4A 50%, #C5A572 100%) !important;
    box-shadow: 0 6px 24px rgba(212, 36, 58, 0.6) !important;
    transform: scale(0.93) !important;
}

.header-lang-globe-btn i,
.mobile-toggle i {
    color: #FFFFFF !important;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.3)) !important;
}

@media (min-width: 993px) {
    .mobile-toggle {
        display: none !important;
    }
}

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

    .header-actions-b {
        display: flex !important;
        align-items: center !important;
        gap: 10px !important;
    }

    .lang-dropdown-menu {
        top: 52px !important;
        right: 0 !important;
        max-height: 70vh !important;
        overflow-y: auto !important;
        z-index: 100005 !important;
    }
}


/* ==========================================================================
   SLIM MOBILE TOP-BAR & ENLARGED CROWNORAFIX LOGO
   ========================================================================== */

@media (max-width: 992px) {
    /* 1. SUPER-SLIM LOW PROFILE TOP-BAR ON MOBILE */
    .top-bar {
        padding: 3px 0 !important;
        background: #0F172A !important;
        border-bottom: 1px solid rgba(197, 165, 114, 0.25) !important;
        line-height: 1.2 !important;
    }

    .top-bar-content {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 2px 10px !important;
        gap: 6px !important;
        min-height: 26px !important;
        width: 100% !important;
    }

    .top-bar-left {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 6px !important;
        font-size: 0.72rem !important;
        color: #E2E8F0 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        max-width: 100% !important;
    }

    .top-bar-left .badge-announcement {
        padding: 2px 6px !important;
        font-size: 0.64rem !important;
        font-weight: 900 !important;
        border-radius: 6px !important;
        flex-shrink: 0 !important;
    }

    .top-bar-right {
        display: none !important; /* Hide redundant items on mobile to keep top-bar strictly on 1 slim line */
    }

    /* 2. ENLARGED LUXURY CROWNORAFIX LOGO */
    .header-container {
        height: 74px !important;
        padding: 0 14px !important;
    }

    .header-logo-wrap {
        display: flex !important;
        align-items: center !important;
    }

    .brand-logo-img {
        height: 60px !important;
        max-height: 60px !important;
        max-width: 220px !important;
        width: auto !important;
        object-fit: contain !important;
        filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.12)) !important;
        transition: transform 0.2s ease !important;
    }

    .nav-menu {
        top: 74px !important;
        height: calc(100vh - 74px) !important;
    }
}

@media (max-width: 480px) {
    .brand-logo-img {
        height: 56px !important;
        max-height: 56px !important;
        max-width: 190px !important;
    }

    .header-container {
        height: 70px !important;
    }

    .nav-menu {
        top: 70px !important;
        height: calc(100vh - 70px) !important;
    }
}


/* ==========================================================================
   REFINED PROPORTIONS: SLEEK BUTTONS & PROMINENT LUXURY LOGO
   ========================================================================== */

/* 1. DESKTOP BUTTON SIZING (SLEEK & REFINED) */
@media (min-width: 993px) {
    .header-lang-globe-btn {
        width: 36px !important;
        height: 36px !important;
        font-size: 0.95rem !important;
        border-radius: 10px !important;
        box-shadow: 0 3px 12px rgba(197, 165, 114, 0.3) !important;
    }
}

/* 2. MOBILE PROPORTIONS (PROMINENT LOGO, COMPACT SLEEK BUTTONS) */
@media (max-width: 992px) {
    .header-container {
        height: 76px !important;
        padding: 0 14px !important;
    }

    .header-logo-wrap {
        display: flex !important;
        align-items: center !important;
    }

    .brand-logo-img {
        height: 64px !important;
        max-height: 64px !important;
        max-width: 240px !important;
        width: auto !important;
        object-fit: contain !important;
        filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.12)) !important;
    }

    .header-actions-b {
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
    }

    .header-lang-globe-btn,
    .mobile-toggle {
        width: 36px !important;
        height: 36px !important;
        font-size: 1.02rem !important;
        border-radius: 10px !important;
        box-shadow: 0 3px 10px rgba(197, 165, 114, 0.35) !important;
    }

    .nav-menu {
        top: 76px !important;
        height: calc(100vh - 76px) !important;
    }

    .lang-dropdown-menu {
        top: 46px !important;
    }
}

@media (max-width: 480px) {
    .header-container {
        height: 72px !important;
        padding: 0 12px !important;
    }

    .brand-logo-img {
        height: 58px !important;
        max-height: 58px !important;
        max-width: 210px !important;
    }

    .header-actions-b {
        gap: 7px !important;
    }

    .header-lang-globe-btn,
    .mobile-toggle {
        width: 35px !important;
        height: 35px !important;
        font-size: 0.98rem !important;
        border-radius: 9px !important;
    }

    .nav-menu {
        top: 72px !important;
        height: calc(100vh - 72px) !important;
    }
}


/* ==========================================================================
   ULTRA-LUXURY DESKTOP & MOBILE LANGUAGE DROPDOWN (VIBRANT FLAGS & CARDS)
   ========================================================================== */

.lang-dropdown-wrapper {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.lang-dropdown-menu {
    position: absolute !important;
    top: calc(100% + 12px) !important;
    right: 0 !important;
    min-width: 300px !important;
    background: rgba(15, 23, 42, 0.98) !important;
    backdrop-filter: blur(24px) !important;
    -webkit-backdrop-filter: blur(24px) !important;
    border: 1.5px solid rgba(197, 165, 114, 0.35) !important;
    border-radius: 18px !important;
    padding: 12px !important;
    box-shadow: 0 25px 60px -10px rgba(0, 0, 0, 0.8), 0 0 25px rgba(197, 165, 114, 0.25) !important;
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
    z-index: 100010 !important;
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px) scale(0.96);
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.lang-dropdown-menu.show {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) scale(1) !important;
}

.lang-option-item {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 9px 12px !important;
    border-radius: 12px !important;
    color: #F8FAFC !important;
    font-size: 0.88rem !important;
    font-weight: 800 !important;
    cursor: pointer !important;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
    background: rgba(30, 41, 59, 0.75) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    width: 100% !important;
    text-align: left !important;
    box-sizing: border-box !important;
}

.lang-option-item:hover {
    background: linear-gradient(135deg, rgba(197, 165, 114, 0.25) 0%, rgba(212, 36, 58, 0.2) 100%) !important;
    border-color: #C5A572 !important;
    color: #FFFFFF !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 14px rgba(197, 165, 114, 0.3) !important;
}

.lang-option-item.active {
    background: linear-gradient(135deg, #C5A572 0%, #D4243A 100%) !important;
    color: #FFFFFF !important;
    border-color: transparent !important;
    box-shadow: 0 4px 16px rgba(197, 165, 114, 0.45) !important;
    font-weight: 900 !important;
}

.lang-flag {
    font-size: 1.25rem !important;
    line-height: 1 !important;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.3)) !important;
    flex-shrink: 0 !important;
}

.lang-name {
    flex: 1 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}


/* ==========================================================================
   FLAGGED PILL LANGUAGE BUTTON & LUXURY MULTI-FLAG DROPDOWN (PC & MOBILE)
   ========================================================================== */

.lang-dropdown-wrapper {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.header-lang-pill-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    background: linear-gradient(135deg, #0F172A 0%, #1E293B 100%) !important;
    border: 2px solid #C5A572 !important;
    border-radius: 12px !important;
    padding: 8px 14px !important;
    color: #FFFFFF !important;
    font-weight: 800 !important;
    font-size: 0.88rem !important;
    cursor: pointer !important;
    box-shadow: 0 4px 14px rgba(197, 165, 114, 0.35) !important;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
    white-space: nowrap !important;
    height: 40px !important;
}

.header-lang-pill-btn:hover,
.header-lang-pill-btn:active,
.lang-dropdown-wrapper.open .header-lang-pill-btn {
    border-color: #38BDF8 !important;
    box-shadow: 0 4px 18px rgba(56, 189, 248, 0.45) !important;
    background: #1E293B !important;
    transform: translateY(-1px);
}

.header-lang-pill-btn i.icon-globe {
    color: #38BDF8 !important;
    font-size: 1rem !important;
    filter: drop-shadow(0 0 6px rgba(56, 189, 248, 0.6)) !important;
}

.header-lang-pill-btn span.nav-text {
    color: #F8FAFC !important;
    font-weight: 900 !important;
    font-size: 0.88rem !important;
}

.header-lang-pill-btn i.lang-chevron {
    color: #C5A572 !important;
    font-size: 0.78rem !important;
    transition: transform 0.25s ease !important;
}

.lang-dropdown-wrapper.open .header-lang-pill-btn i.lang-chevron {
    transform: rotate(180deg) !important;
    color: #38BDF8 !important;
}

/* 13-LANGUAGE DROPDOWN WINDOW (LUXURY GLASSMORPHIC CARDS) */
.lang-dropdown-menu {
    position: absolute !important;
    top: calc(100% + 10px) !important;
    right: 0 !important;
    min-width: 310px !important;
    background: rgba(15, 23, 42, 0.98) !important;
    backdrop-filter: blur(24px) !important;
    -webkit-backdrop-filter: blur(24px) !important;
    border: 1.5px solid rgba(197, 165, 114, 0.4) !important;
    border-radius: 18px !important;
    padding: 12px !important;
    box-shadow: 0 25px 60px -10px rgba(0, 0, 0, 0.8), 0 0 25px rgba(197, 165, 114, 0.25) !important;
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
    z-index: 100010 !important;
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px) scale(0.96);
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.lang-dropdown-menu.show {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) scale(1) !important;
}

.lang-option-item {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 9px 12px !important;
    border-radius: 12px !important;
    color: #F8FAFC !important;
    font-size: 0.88rem !important;
    font-weight: 800 !important;
    cursor: pointer !important;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
    background: rgba(30, 41, 59, 0.85) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    width: 100% !important;
    text-align: left !important;
    box-sizing: border-box !important;
}

.lang-option-item:hover {
    background: linear-gradient(135deg, rgba(197, 165, 114, 0.25) 0%, rgba(212, 36, 58, 0.2) 100%) !important;
    border-color: #C5A572 !important;
    color: #FFFFFF !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 14px rgba(197, 165, 114, 0.3) !important;
}

.lang-option-item.active {
    background: linear-gradient(135deg, #C5A572 0%, #D4243A 100%) !important;
    color: #FFFFFF !important;
    border-color: transparent !important;
    box-shadow: 0 4px 16px rgba(197, 165, 114, 0.45) !important;
    font-weight: 900 !important;
}

.lang-flag {
    font-size: 1.3rem !important;
    line-height: 1 !important;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.3)) !important;
    flex-shrink: 0 !important;
}

@media (max-width: 992px) {
    .header-lang-pill-btn {
        padding: 6px 10px !important;
        font-size: 0.78rem !important;
        height: 36px !important;
        border-radius: 10px !important;
        gap: 6px !important;
    }

    .header-lang-pill-btn span.nav-text {
        font-size: 0.78rem !important;
    }

    .lang-dropdown-menu {
        top: 48px !important;
        right: 0 !important;
        min-width: 290px !important;
        max-height: 70vh !important;
        overflow-y: auto !important;
    }
}

@media (max-width: 480px) {
    .header-lang-pill-btn {
        padding: 5px 8px !important;
        font-size: 0.75rem !important;
        height: 35px !important;
    }

    .header-lang-pill-btn span.nav-text {
        font-size: 0.75rem !important;
    }
}


/* ==========================================================================
   PERFECT ICON-SHAPED GLOBE BUTTON & MULTI-FLAG DROPDOWN (PC & MOBILE)
   ========================================================================== */

.lang-dropdown-wrapper {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.header-actions-b {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

.header-lang-globe-btn,
.mobile-toggle {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 36px !important;
    height: 36px !important;
    background: linear-gradient(135deg, #8B6B32 0%, #C5A572 50%, #6B4E1F 100%) !important;
    border: none !important;
    border-radius: 10px !important;
    color: #FFFFFF !important;
    font-size: 1.05rem !important;
    cursor: pointer !important;
    box-shadow: 0 3px 12px rgba(197, 165, 114, 0.35) !important;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
    flex-shrink: 0 !important;
}

.header-lang-globe-btn:hover,
.header-lang-globe-btn:active,
.lang-dropdown-wrapper.open .header-lang-globe-btn,
.mobile-toggle:hover,
.mobile-toggle:active,
.mobile-toggle.active {
    background: linear-gradient(135deg, #D4243A 0%, #9A7A4A 50%, #C5A572 100%) !important;
    box-shadow: 0 5px 18px rgba(212, 36, 58, 0.55) !important;
    transform: scale(0.93) !important;
}

.header-lang-globe-btn i,
.mobile-toggle i {
    color: #FFFFFF !important;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.25)) !important;
}

/* 13-LANGUAGE DROPDOWN MENU WITH FULL FLAGS & NAMES */
.lang-dropdown-menu {
    position: absolute !important;
    top: calc(100% + 10px) !important;
    right: 0 !important;
    min-width: 300px !important;
    background: rgba(15, 23, 42, 0.98) !important;
    backdrop-filter: blur(24px) !important;
    -webkit-backdrop-filter: blur(24px) !important;
    border: 1.5px solid rgba(197, 165, 114, 0.4) !important;
    border-radius: 16px !important;
    padding: 10px !important;
    box-shadow: 0 25px 60px -10px rgba(0, 0, 0, 0.8), 0 0 25px rgba(197, 165, 114, 0.25) !important;
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
    z-index: 100010 !important;
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px) scale(0.96);
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.lang-dropdown-menu.show {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) scale(1) !important;
}

.lang-option-item {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 9px 12px !important;
    border-radius: 12px !important;
    color: #F8FAFC !important;
    font-size: 0.88rem !important;
    font-weight: 800 !important;
    cursor: pointer !important;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
    background: rgba(30, 41, 59, 0.85) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    width: 100% !important;
    text-align: left !important;
    box-sizing: border-box !important;
}

.lang-option-item:hover {
    background: linear-gradient(135deg, rgba(197, 165, 114, 0.25) 0%, rgba(212, 36, 58, 0.2) 100%) !important;
    border-color: #C5A572 !important;
    color: #FFFFFF !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 14px rgba(197, 165, 114, 0.3) !important;
}

.lang-option-item.active {
    background: linear-gradient(135deg, #C5A572 0%, #D4243A 100%) !important;
    color: #FFFFFF !important;
    border-color: transparent !important;
    box-shadow: 0 4px 16px rgba(197, 165, 114, 0.45) !important;
    font-weight: 900 !important;
}

.lang-flag {
    font-size: 1.3rem !important;
    line-height: 1 !important;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.3)) !important;
    flex-shrink: 0 !important;
}

@media (min-width: 993px) {
    .mobile-toggle {
        display: none !important;
    }
}

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

    .header-container {
        height: 76px !important;
        padding: 0 14px !important;
    }

    .brand-logo-img {
        height: 64px !important;
        max-height: 64px !important;
        max-width: 240px !important;
    }

    .lang-dropdown-menu {
        top: 48px !important;
        right: 0 !important;
        min-width: 285px !important;
        max-height: 70vh !important;
        overflow-y: auto !important;
    }
}

@media (max-width: 480px) {
    .header-container {
        height: 72px !important;
        padding: 0 12px !important;
    }

    .brand-logo-img {
        height: 58px !important;
        max-height: 58px !important;
        max-width: 210px !important;
    }

    .header-lang-globe-btn,
    .mobile-toggle {
        width: 35px !important;
        height: 35px !important;
        font-size: 0.98rem !important;
        border-radius: 9px !important;
    }
}


/* ==========================================================================
   REAL COLOR VECTOR/PNG FLAG IMAGES (CHROME PC & WINDOWS SUPPORT)
   ========================================================================== */

.lang-flag-img {
    width: 24px !important;
    height: 16px !important;
    object-fit: cover !important;
    border-radius: 3px !important;
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.4) !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    flex-shrink: 0 !important;
    display: inline-block !important;
}

.lang-option-item {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}


/* ==========================================================================
   SLEEK COMPACT DESKTOP LANGUAGE GLOBE BUTTON (REFINED 30PX)
   ========================================================================== */

@media (min-width: 993px) {
    .header-lang-globe-btn {
        width: 30px !important;
        height: 30px !important;
        font-size: 0.85rem !important;
        border-radius: 8px !important;
        box-shadow: 0 2px 8px rgba(197, 165, 114, 0.3) !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .header-lang-globe-btn i {
        font-size: 0.85rem !important;
    }

    .lang-dropdown-menu {
        top: calc(100% + 8px) !important;
    }
}


/* ==========================================================================
   PERFECTLY PROPORTIONED CROWNORAFIX PRODUCTS ECOSYSTEM & ENLARGED LOGO
   ========================================================================== */

.products-ecosystem-section {
    padding: 65px 0 70px 0 !important;
    background: linear-gradient(180deg, #FBF6EA 0%, #F6EFD9 100%) !important;
    border-bottom: 1px solid rgba(197, 165, 114, 0.28) !important;
    position: relative !important;
}

.products-ecosystem-header {
    text-align: center;
    max-width: 880px;
    margin: 0 auto 38px auto;
}

.products-grid-container {
    max-width: 1160px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    align-items: stretch;
}

.product-window-card {
    background: #FFFDF8;
    border-radius: 22px;
    padding: 28px 24px;
    border: 1.5px solid rgba(197, 165, 114, 0.42);
    box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.05);
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: relative;
    box-sizing: border-box;
}

.product-window-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 40px -10px rgba(0, 0, 0, 0.1);
    border-color: #CBD5E1;
}

.product-window-card.card-flagship {
    background: linear-gradient(180deg, rgba(11, 31, 58, 0.95) 0%, rgba(6, 17, 40, 0.95) 100%);
    border: 2px solid rgba(197, 165, 114, 0.45);
    box-shadow: 0 15px 35px -10px rgba(197, 165, 114, 0.12);
}

.product-window-card.card-flagship:hover {
    transform: translateY(-6px);
    border-color: #C5A572;
    box-shadow: 0 22px 45px -10px rgba(197, 165, 114, 0.22);
}

.takipfix-lang-logo {
    height: 60px !important;
    max-height: 60px !important;
    max-width: 220px !important;
    width: auto !important;
    object-fit: contain !important;
    margin: 0 auto 12px auto !important;
    display: block !important;
    filter: drop-shadow(0 4px 14px rgba(197, 165, 114, 0.22)) !important;
    transition: transform 0.2s ease !important;
}

.product-window-card:hover .takipfix-lang-logo {
    transform: scale(1.03);
}

.product-window-card.card-labs {
    background: linear-gradient(180deg, rgba(11, 31, 58, 0.7) 0%, rgba(6, 17, 40, 0.85) 100%);
    border: 1.5px dashed rgba(197, 165, 114, 0.35);
}

.product-window-card.card-labs:hover {
    border-style: solid;
    border-color: #94A3B8;
}

.product-card-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.78rem;
    font-weight: 800;
    padding: 4px 12px;
    border-radius: 20px;
}

.product-card-badge.badge-live {
    background: #DCFCE7;
    color: #15803D;
    border: 1px solid #86EFAC;
}

.product-card-badge.badge-amber {
    background: #FEF3C7;
    color: #B45309;
    border: 1px solid #FDE68A;
}

.product-card-badge.badge-purple {
    background: #F3E8FF;
    color: #7E22CE;
    border: 1px solid #E9D5FF;
}

.product-card-icon-box {
    width: 58px;
    height: 58px;
    border-radius: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.6rem;
    margin: 0 auto 10px auto;
}

.product-card-desc {
    font-size: 0.90rem;
    color: #475569;
    line-height: 1.65;
    margin-bottom: 22px;
}

.product-card-footer {
    border-top: 1.5px solid #F1F5F9;
    padding-top: 18px;
}

.product-card-footer.dashed {
    border-top: 1.5px dashed #E2E8F0;
    text-align: center;
}

@media (max-width: 992px) {
    .products-grid-container {
        grid-template-columns: 1fr !important;
        max-width: 520px !important;
        gap: 20px !important;
    }
}


/* ==========================================================================
   ULTRA-LUXURY WINDOW CARD TOP BARS & STATUS BADGES
   ========================================================================== */

.product-card-top-bar {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding-bottom: 14px !important;
    margin-bottom: 16px !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important;
}

.status-live-chip {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    background: rgba(22, 163, 74, 0.1) !important;
    border: 1.5px solid rgba(22, 163, 74, 0.3) !important;
    color: #15803D !important;
    font-size: 0.76rem !important;
    font-weight: 900 !important;
    padding: 5px 12px !important;
    border-radius: 20px !important;
    letter-spacing: 0.4px !important;
}

.live-pulse-dot {
    width: 8px !important;
    height: 8px !important;
    border-radius: 50% !important;
    background: #16A34A !important;
    box-shadow: 0 0 10px #16A34A !important;
    animation: livePulseRadar 1.8s infinite !important;
}

@keyframes livePulseRadar {
    0% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(22, 163, 74, 0.7);
    }
    70% {
        transform: scale(1.15);
        box-shadow: 0 0 0 8px rgba(22, 163, 74, 0);
    }
    100% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(22, 163, 74, 0);
    }
}

.status-labs-chip {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    font-size: 0.76rem !important;
    font-weight: 900 !important;
    padding: 5px 12px !important;
    border-radius: 20px !important;
    letter-spacing: 0.4px !important;
}

.status-labs-chip.chip-amber {
    background: rgba(245, 158, 11, 0.12) !important;
    border: 1.5px solid rgba(245, 158, 11, 0.35) !important;
    color: #B45309 !important;
}

.status-labs-chip.chip-purple {
    background: rgba(147, 51, 234, 0.12) !important;
    border: 1.5px solid rgba(147, 51, 234, 0.35) !important;
    color: #7E22CE !important;
}

.suite-brand-chip {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    font-size: 0.78rem !important;
    font-weight: 800 !important;
    color: #64748B !important;
    background: #F8FAFC !important;
    border: 1px solid #E2E8F0 !important;
    padding: 4px 10px !important;
    border-radius: 12px !important;
}

.product-status-pill {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    font-size: 0.82rem !important;
    font-weight: 800 !important;
    width: 100% !important;
}

.product-status-pill.pill-amber {
    color: #D97706 !important;
}

.product-status-pill.pill-purple {
    color: #9333EA !important;
}


/* ==========================================================================
   PURE SINGLE OVER-TITLE BADGES & HIGH-TECH BOTTOM STATUS CAPSULES
   ========================================================================== */

.product-card-header-single {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    padding-bottom: 12px !important;
    margin-bottom: 14px !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05) !important;
}

.product-overtitle-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    font-size: 0.78rem !important;
    font-weight: 900 !important;
    padding: 5px 14px !important;
    border-radius: 20px !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
}

.product-overtitle-badge.badge-green {
    background: #ECFDF5 !important;
    color: #059669 !important;
    border: 1.5px solid #A7F3D0 !important;
    box-shadow: 0 2px 8px rgba(16, 185, 129, 0.15) !important;
}

.product-overtitle-badge.badge-amber {
    background: #FFFBEB !important;
    color: #D97706 !important;
    border: 1.5px solid #FDE68A !important;
    box-shadow: 0 2px 8px rgba(217, 119, 6, 0.15) !important;
}

.product-overtitle-badge.badge-purple {
    background: #FAF5FF !important;
    color: #9333EA !important;
    border: 1.5px solid #E9D5FF !important;
    box-shadow: 0 2px 8px rgba(147, 51, 234, 0.15) !important;
}

.product-card-footer-labs {
    border-top: 1.5px solid #F1F5F9 !important;
    padding-top: 16px !important;
    margin-top: auto !important;
}

.labs-status-capsule {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 10px 14px !important;
    border-radius: 12px !important;
    font-size: 0.82rem !important;
    font-weight: 800 !important;
    text-align: center !important;
    transition: all 0.25s ease !important;
    box-sizing: border-box !important;
}

.labs-status-capsule.capsule-amber {
    background: linear-gradient(135deg, #FFFBEB 0%, #FEF3C7 100%) !important;
    border: 1.5px solid #FDE68A !important;
    color: #92400E !important;
    box-shadow: 0 3px 10px rgba(217, 119, 6, 0.1) !important;
}

.labs-status-capsule.capsule-purple {
    background: linear-gradient(135deg, #FAF5FF 0%, #F3E8FF 100%) !important;
    border: 1.5px solid #E9D5FF !important;
    color: #6B21A8 !important;
    box-shadow: 0 3px 10px rgba(147, 51, 234, 0.1) !important;
}

.capsule-beacon {
    width: 7px !important;
    height: 7px !important;
    border-radius: 50% !important;
    flex-shrink: 0 !important;
}

.capsule-beacon.beacon-amber {
    background: #D97706 !important;
    box-shadow: 0 0 8px #D97706 !important;
    animation: livePulseRadar 2s infinite !important;
}

.capsule-beacon.beacon-purple {
    background: #9333EA !important;
    box-shadow: 0 0 8px #9333EA !important;
    animation: livePulseRadar 2s infinite !important;
}

.capsule-icon {
    font-size: 0.95rem !important;
    flex-shrink: 0 !important;
}

/* ==========================================================================
   CROWNORAFIX MAĞAZA — LÜX KURUMSAL TEMA
   Palet: Metalik Gold (#C5A572 / #E8C98A) · Koyu Lacivert (#0B1F3A / #061128)
          Kırmızı-Crimson (#D4243A / #9B1B30) · Gri · Beyaz
   ========================================================================== */
.shop-page {
    background: linear-gradient(160deg, #FBF6EA 0%, #F6EFD9 55%, #F3E6C8 100%);
    color: #0B1F3A;
    min-height: 100vh;
}

.shop-hero {
    background: linear-gradient(135deg, #061128 0%, #0B1F3A 100%);
    color: #F0EAE0;
    padding: 48px 20px 40px;
    text-align: center;
    border-bottom: 2px solid #C5A572;
}

.shop-hero h1 {
    font-size: 1.85rem;
    font-weight: 900;
    margin: 0 0 10px 0;
    color: #E8C98A;
}

.shop-hero p {
    max-width: 720px;
    margin: 0 auto;
    color: #B0A898;
    line-height: 1.6;
    font-size: 0.98rem;
}

.shop-hero-gold {
    color: #C5A572;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    font-size: 0.78rem;
    margin-bottom: 10px;
}

.shop-catalog {
    display: grid;
    grid-template-columns: repeat(auto-fill, 320px);
    justify-content: start;
    justify-items: start;
    gap: 22px;
    max-width: 1180px;
    margin: 36px auto 60px;
    padding: 0 20px;
}

.shop-catalog.shop-catalog--single {
    grid-template-columns: 320px;
    justify-content: center;
    justify-items: center;
}

.shop-card {
    width: 320px;
    max-width: 320px;
    box-sizing: border-box;
    background: #FFFDF8;
    border: 1px solid rgba(197, 165, 114, 0.42);
    border-top: 3px solid #C5A572;
    border-radius: 14px;
    padding: 14px 16px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    box-shadow: 0 8px 24px rgba(61, 42, 16, 0.08);
    transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}

.shop-card:hover {
    transform: translateY(-4px);
    border-color: rgba(232, 201, 138, 0.55);
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.45), 0 0 24px rgba(197, 165, 114, 0.12);
}

.shop-card-brand,
[data-brand-en] {
    font-size: 0.70rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: none;
    color: #8B6B32;
    margin: 0;
}

.shop-card-title {
    font-size: 1.12rem;
    font-weight: 900;
    color: #0B1F3A;
    margin: 0;
}

.shop-card-meta {
    font-size: 0.88rem;
    color: #5C5348;
    margin: 0;
}

.shop-card-price {
    font-size: 1.5rem;
    font-weight: 900;
    color: #8B6B32;
    margin: 2px 0;
    letter-spacing: -0.02em;
    text-shadow: none;
}

.shop-card-features {
    list-style: none;
    padding: 0;
    margin: 0 0 6px 0;
    font-size: 0.88rem;
    color: #3A3228;
}

.shop-card-features li {
    padding: 3px 0;
    border-bottom: 1px solid rgba(197, 165, 114, 0.14);
}

.shop-card-features li::before {
    content: "✦ ";
    color: #9A7A4A;
    font-size: 0.62rem;
}

.shop-card-actions {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: auto;
}

.btn-shop-cart,
.btn-shop-pay {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 12px 14px;
    border-radius: 9px;
    font-weight: 800;
    font-size: 0.9rem;
    text-decoration: none;
    border: none;
    cursor: pointer;
    box-sizing: border-box;
    letter-spacing: 0.02em;
    transition: transform 0.18s ease, box-shadow 0.18s ease, filter 0.18s ease;
}

.btn-shop-cart {
    /* Dikkat çekici Kırmızı-Crimson CTA — "Sepete Ekle" */
    background: linear-gradient(135deg, #D4243A 0%, #9B1B30 100%);
    color: #FFFFFF;
    box-shadow: 0 6px 20px rgba(155, 27, 48, 0.45);
    border: 1px solid rgba(212, 36, 58, 0.5);
}

.btn-shop-cart:hover {
    filter: brightness(1.12);
    transform: translateY(-1px);
    box-shadow: 0 8px 24px rgba(155, 27, 48, 0.6), 0 0 0 1.5px rgba(197, 165, 114, 0.6);
}

#pricing .btn-shop-cart {
    border-radius: 12px;
    padding: 12px 24px;
}

.btn-shop-pay {
    /* Premium Gold — "Satın Al" */
    background: linear-gradient(135deg, #A8783A 0%, #C5A572 45%, #E8C98A 100%);
    color: #0B1F3A;
    box-shadow: 0 6px 20px rgba(197, 165, 114, 0.4);
    border: 1px solid rgba(232, 201, 138, 0.5);
    font-weight: 900;
}

.btn-shop-pay:hover {
    filter: brightness(1.08);
    transform: translateY(-1px);
    box-shadow: 0 10px 28px rgba(197, 165, 114, 0.55);
}

.btn-shop-pay-sm {
    padding: 8px 10px;
    font-size: 0.8rem;
    width: auto;
}

.header-cart-link {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 10px;
    background: linear-gradient(135deg, #A8783A 0%, #C5A572 60%, #E8C98A 100%);
    color: #0B1F3A;
    text-decoration: none;
    border: 1px solid rgba(232, 201, 138, 0.5);
    box-shadow: 0 3px 14px rgba(197, 165, 114, 0.35);
    transition: box-shadow 0.2s, transform 0.2s;
}

.header-cart-link:hover {
    transform: scale(1.08);
    box-shadow: 0 6px 20px rgba(197, 165, 114, 0.5);
}

.header-cart-link i {
    color: #0B1F3A;
}

.header-cart-badge {
    position: absolute;
    top: -6px;
    right: -6px;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 9px;
    background: #D4243A;
    color: #FFF;
    font-size: 0.68rem;
    font-weight: 900;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.nav-3d-link .header-cart-badge {
    position: static;
    margin-left: 4px;
}

.cart-toast {
    position: fixed;
    bottom: 24px;
    left: 50%;
    transform: translateX(-50%) translateY(16px);
    background: #0F172A;
    color: #F8FAFC;
    border: 1px solid #C5A572;
    padding: 10px 16px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 0.88rem;
    z-index: 100000;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease, transform 0.2s ease;
}

.cart-toast.show {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

.cart-page {
    max-width: 960px;
    margin: 32px auto 70px;
    padding: 0 20px;
}

.cart-empty {
    background: rgba(11, 31, 58, 0.7);
    border: 1px solid rgba(197, 165, 114, 0.3);
    border-radius: 14px;
    padding: 40px 24px;
    text-align: center;
    color: #C8BFB4;
}

.cart-note {
    background: rgba(11, 31, 58, 0.6);
    border-left: 4px solid #C5A572;
    padding: 12px 14px;
    font-size: 0.88rem;
    color: #B0A898;
    margin-bottom: 18px;
    border-radius: 0 8px 8px 0;
}

.cart-table-wrap {
    overflow-x: auto;
    background: #FFFDF8;
    border: 1px solid rgba(197, 165, 114, 0.42);
    border-radius: 14px;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.cart-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.cart-table th,
.cart-table td {
    padding: 12px 14px;
    text-align: left;
    border-bottom: 1px solid rgba(197, 165, 114, 0.14);
    vertical-align: middle;
    color: #0B1F3A;
}

.cart-table th {
    background: #F4E8C8;
    color: #0B1F3A;
    font-weight: 800;
    letter-spacing: 0.04em;
    border-bottom: 2px solid rgba(197, 165, 114, 0.45);
}

.cart-line-meta {
    color: #7A6E65;
    font-size: 0.8rem;
}

.cart-qty-cell {
    white-space: nowrap;
}

.cart-qty-btn {
    width: 28px;
    height: 28px;
    border: 1px solid rgba(197, 165, 114, 0.35);
    background: rgba(6, 17, 40, 0.7);
    color: #C5A572;
    font-weight: 900;
    cursor: pointer;
    border-radius: 6px;
    transition: background 0.15s, color 0.15s;
}

.cart-qty-btn:hover {
    background: rgba(197, 165, 114, 0.2);
    color: #E8C98A;
}

.cart-qty-cell span {
    display: inline-block;
    min-width: 22px;
    text-align: center;
    font-weight: 800;
}

.cart-remove-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    margin: 0;
    padding: 0;
    background: transparent;
    border: 1px solid rgba(212, 36, 58, 0.35);
    border-radius: 8px;
    color: #D4243A;
    cursor: pointer;
    transition: color 0.15s, background 0.15s, border-color 0.15s;
}

.cart-remove-btn:hover {
    color: #fff;
    background: #D4243A;
    border-color: #D4243A;
}

.cart-remove-icon {
    display: block;
    pointer-events: none;
}

.cart-line-actions {
    min-width: 48px;
    text-align: center;
    vertical-align: middle;
}

.cart-summary {
    margin-top: 18px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    background: rgba(11, 31, 58, 0.7);
    border: 1px solid rgba(197, 165, 114, 0.32);
    border-radius: 14px;
    padding: 16px 18px;
}

.cart-summary p {
    margin: 0;
    font-size: 1.05rem;
    color: #E8C98A;
    font-weight: 700;
}

.cart-summary .btn-shop-cart {
    width: auto;
    min-width: 180px;
}

.btn-shop-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 11px 14px;
    border-radius: 9px;
    font-weight: 800;
    font-size: 0.9rem;
    text-decoration: none;
    box-sizing: border-box;
    background: transparent;
    color: #C5A572;
    border: 1.5px solid rgba(197, 165, 114, 0.65);
    cursor: pointer;
    transition: background 0.18s, color 0.18s, border-color 0.18s;
}

.btn-shop-link:hover {
    background: rgba(197, 165, 114, 0.12);
    color: #E8C98A;
    border-color: #C5A572;
}

#pricing .btn-shop-link {
    border-radius: 12px;
    padding: 12px 24px;
}

.shop-card-title a {
    color: inherit;
    text-decoration: none;
}

.shop-card-media {
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 0;
    outline: 0;
    box-shadow: none;
    border-radius: 0;
    padding: 0;
    margin: 0 auto;
    text-align: center;
    width: 100%;
    max-width: 100%;
    height: 96px;
    min-height: 96px;
    aspect-ratio: auto;
    box-sizing: border-box;
    overflow: hidden;
}

.shop-card-media img {
    display: block;
    margin: 0 auto;
    max-width: 100%;
    width: auto;
    height: auto;
    max-height: 80px;
    object-fit: contain;
    background: transparent;
    border: 0;
    box-shadow: none;
}

.product-media img {
    display: block;
    margin: 0 auto;
    max-width: 148px;
    width: auto;
    height: auto;
    max-height: 76px;
    object-fit: contain;
    background: transparent;
    border: 0;
    box-shadow: none;
}

.shop-trust {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 12px;
    max-width: 1180px;
    margin: -8px auto 8px;
    padding: 0 20px;
}

.shop-trust div {
    background: rgba(11, 31, 58, 0.65);
    border: 1px solid rgba(197, 165, 114, 0.22);
    border-top: 3px solid #C5A572;
    border-radius: 10px;
    padding: 14px 12px;
}

.shop-trust strong {
    display: block;
    color: #E8C98A;
    font-size: 0.88rem;
    margin-bottom: 4px;
}

.shop-trust span {
    color: #94867A;
    font-size: 0.8rem;
}

.shop-section-head {
    max-width: 1180px;
    margin: 28px auto 0;
    padding: 0 20px;
}

.shop-kicker {
    margin: 0 0 6px 0;
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #C5A572;
}

.shop-section-head h2 {
    margin: 0 0 6px 0;
    color: #0F172A;
    font-size: 1.45rem;
}

.shop-section-head p {
    margin: 0;
    color: #64748B;
}

.shop-breadcrumb {
    font-size: 0.85rem;
    color: #7A6E65;
    margin-bottom: 18px;
}

.shop-breadcrumb a {
    color: #C5A572;
    font-weight: 700;
    transition: color 0.15s;
}

.shop-breadcrumb a:hover {
    color: #E8C98A;
}

.product-layout {
    display: grid;
    grid-template-columns: minmax(220px, 340px) 1fr;
    gap: 28px;
    align-items: start;
    background: #FFFDF8;
    border: 1px solid rgba(197, 165, 114, 0.42);
    border-top: 3px solid #C5A572;
    border-radius: 14px;
    padding: 24px;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.product-media {
    background: transparent;
    border: 0;
    box-shadow: none;
    border-radius: 0;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: auto;
    max-width: 100%;
    min-height: 0;
    aspect-ratio: auto;
    box-sizing: border-box;
}

.product-media img {
    max-width: 180px;
    max-height: 120px;
}

.product-info h1 {
    margin: 0 0 8px 0;
    font-size: 1.55rem;
    color: #0B1F3A;
}

.product-desc,
.product-delivery,
.product-pay-note {
    color: #3A3228;
    font-size: 0.92rem;
    line-height: 1.55;
}

.product-pay-note a {
    color: #8B6B32;
    font-weight: 700;
}

.shop-footer {
    background: rgba(6, 17, 40, 0.9);
    color: #94867A;
    padding: 28px 20px;
    text-align: center;
    margin-top: 48px;
    border-top: 2px solid rgba(197, 165, 114, 0.35);
}

.shop-footer a {
    color: #C5A572;
    font-weight: 700;
    text-decoration: none;
    transition: color 0.15s;
}

.shop-footer a:hover {
    color: #E8C98A;
}

.shop-footer p {
    margin: 0 0 8px 0;
    font-size: 0.88rem;
}

.cart-summary-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.cart-summary-actions .btn-shop-link,
.cart-summary-actions .btn-shop-pay {
    width: auto;
    min-width: 160px;
}

.checkout-legal {
    background: rgba(11, 31, 58, 0.6);
    border: 1px solid rgba(197, 165, 114, 0.28);
    border-radius: 14px;
    padding: 16px 18px;
    margin: 18px 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.checkout-legal label {
    font-size: 0.9rem;
    color: #C8BFB4;
    display: flex;
    gap: 8px;
    align-items: flex-start;
}

.checkout-legal a {
    color: #C5A572;
    font-weight: 700;
    text-decoration: underline;
    text-decoration-color: rgba(197, 165, 114, 0.4);
}

.checkout-legal a:hover {
    color: #E8C98A;
}

.checkout-legal-hint {
    margin: 0;
    color: #D4243A;
    font-size: 0.85rem;
    font-weight: 700;
}

.checkout-total {
    margin: 16px 0 0 0;
    font-size: 1.15rem;
    color: #E8C98A;
    font-weight: 800;
}

.checkout-pay-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.checkout-pay-line {
    background: rgba(11, 31, 58, 0.6);
    border: 1px solid rgba(197, 165, 114, 0.25);
    border-radius: 14px;
    padding: 16px;
}

.checkout-pay-line .btn-shop-pay {
    max-width: 320px;
}

.checkout-pay-line .btn-shop-pay.is-disabled {
    opacity: 0.45;
    pointer-events: none;
}

.checkout-qty-note {
    font-size: 0.85rem;
    color: #94867A;
    margin: 6px 0 12px 0;
}

.shop-brand-header {
    background: linear-gradient(135deg, #061128 0%, #0B1F3A 100%);
    border-bottom: 2px solid rgba(197, 165, 114, 0.45);
    position: relative;
}

.shop-brand-bar {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 16px;
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    box-sizing: border-box;
    min-height: 98px;
    padding: 6px 28px;
    position: relative;
}

.shop-brand-logo-wrap {
    display: flex;
    align-items: center;
}

.shop-brand-logo-wrap .header-logo-wrap {
    padding: 0;
}

.shop-brand-logo-wrap .brand-logo-img,
.shop-brand-logo-wrap img {
    height: 84px !important;
    width: auto !important;
    max-width: none !important;
    max-height: none !important;
    object-fit: contain;
    filter: drop-shadow(0 4px 16px rgba(0, 0, 0, 0.45));
}

.shop-brand-nav {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

.shop-brand-nav a {
    color: inherit;
    font-weight: 700;
    text-decoration: none;
    font-size: 0.88rem;
    padding: 6px 4px;
    border-bottom: none;
    letter-spacing: 0.03em;
}

.shop-brand-nav a:hover,
.shop-brand-nav a[aria-current="page"] {
    color: inherit;
    border-bottom: none;
}

.shop-brand-nav a[aria-current="page"]::after {
    width: 100%;
}

.shop-brand-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    justify-self: end;
}

.shop-masthead {
    text-align: center;
    padding: 42px 20px 24px;
    background: linear-gradient(180deg, #FBF6EA 0%, #F6EFD9 100%);
    border-bottom: 2px solid rgba(197, 165, 114, 0.4);
    position: relative;
    overflow: hidden;
}

.shop-masthead::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 70% 120% at 50% 0%, rgba(197,165,114,0.07) 0%, transparent 70%);
    pointer-events: none;
}

.shop-masthead a {
    display: flex;
    justify-content: center;
}

.shop-masthead-logo {
    height: 220px;
    width: auto;
    max-width: 90%;
    object-fit: contain;
    display: inline-block;
    filter: drop-shadow(0 16px 40px rgba(197, 165, 114, 0.42));
}

.page-brand-hero {
    background: linear-gradient(180deg, #FBF6EA 0%, #F4E8C8 100%) !important;
    color: #0B1F3A !important;
    border-bottom: 1px solid rgba(197, 165, 114, 0.35) !important;
    padding: 70px 20px !important;
    text-align: center;
}

.page-brand-hero img {
    height: 220px !important;
    width: auto !important;
    max-width: 90%;
    filter: drop-shadow(0 16px 40px rgba(197, 165, 114, 0.42)) !important;
    margin: 0 auto 28px auto !important;
    display: inline-block !important;
}

.page-brand-hero h1,
.page-brand-hero h2.section-title-unified,
.page-brand-hero .section-title-unified {
    color: #0B1F3A !important;
    text-transform: uppercase;
}

.page-brand-hero p,
.page-brand-hero h2:not(.section-title-unified) {
    color: #475569 !important;
}

.page-brand-hero h1 .title-gradient,
.page-brand-hero h2 .title-gradient,
.page-brand-hero .section-title-unified .title-gradient,
.page-brand-hero .title-gradient {
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
    background: linear-gradient(135deg, #8B6B32 0%, #C5A572 50%, #6B4E1F 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
}

.back-to-top {
    position: fixed;
    right: 22px;
    bottom: 22px;
    z-index: 90000;
    width: 48px;
    height: 48px;
    border: 1px solid rgba(197, 165, 114, 0.55);
    border-radius: 14px;
    background: linear-gradient(135deg, #0B1F3A 0%, #061128 100%);
    color: #E8C98A;
    box-shadow: 0 10px 28px rgba(6, 17, 40, 0.35);
    cursor: pointer;
    opacity: 0;
    pointer-events: none;
    transform: translateY(10px);
    transition: opacity 0.2s ease, transform 0.2s ease, filter 0.2s ease;
}

.back-to-top.is-visible {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}

.back-to-top:hover {
    color: #FFFDF8;
    filter: brightness(1.08);
}

.footer-own-store-badge {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 1 1 0;
    min-width: 0;
    max-width: 210px;
    width: 49%;
    background: #FFFDF8;
    border: 1.5px solid #E7E0D6;
    border-radius: 14px;
    padding: 8px 12px;
    text-decoration: none;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
}

.footer-own-store-badge img {
    width: 38px;
    height: 38px;
    object-fit: contain;
}

.footer-own-store-badge strong {
    display: block;
    font-size: 0.82rem;
    font-weight: 900;
    letter-spacing: 0.04em;
    color: #0B1F3A;
}

.footer-own-store-badge span {
    display: block;
    font-size: 0.68rem;
    font-weight: 800;
    color: #8B6B32;
}

.page-brand-kicker {
    margin: 0 0 8px 0;
    font-size: 0.82rem;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #8B6B32;
}

.shop-masthead-title {
    margin: 10px 0 0 0;
    font-size: 2.3rem !important;
    font-weight: 900;
    letter-spacing: -0.03em;
    color: #0B1F3A;
    text-transform: uppercase;
    text-shadow: none;
}

.shop-masthead-title .title-gradient,
.shop-page-heading .title-gradient,
.card-title .title-gradient,
.page-brand-hero .title-gradient,
h1 .title-gradient,
h2 .title-gradient,
h3 .title-gradient,
strong .title-gradient {
    background: linear-gradient(135deg, #8B6B32 0%, #C5A572 50%, #6B4E1F 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    color: transparent !important;
    filter: drop-shadow(0 4px 14px rgba(197, 165, 114, 0.3));
    display: inline-block !important;
}

.dark-theme-card h2.card-title span:not(.title-gradient) {
    color: #FFFFFF !important;
}

.shop-masthead-title::after {
    content: '';
    display: block;
    width: 80px;
    height: 2px;
    background: linear-gradient(90deg, transparent 0%, #C5A572 40%, #E8C98A 60%, transparent 100%);
    margin: 14px auto 0;
}

.shop-intro {
    max-width: 760px;
    margin: 18px auto 4px;
    padding: 0 20px;
    color: #5C5348;
    text-align: center;
    line-height: 1.55;
    font-size: 0.95rem;
}

.shop-page .shop-page-heading {
    max-width: 1180px;
}

.shop-page [hidden] {
    display: none !important;
}

.shop-page-heading {
    max-width: 1180px;
    margin: 24px auto 8px;
    padding: 0 20px;
    color: #0B1F3A;
    font-size: 2.1rem !important;
    font-weight: 950;
    letter-spacing: -0.03em;
    text-transform: none;
    text-align: center;
}

.shop-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    max-width: 1180px;
    margin: 18px auto 0;
    padding: 18px 20px 14px;
    background: #FFFDF8;
    border: 1px solid rgba(197, 165, 114, 0.38);
    border-radius: 12px;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.shop-filters label {
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    color: #8B6B32;
    text-transform: uppercase;
}

.shop-filters select {
    min-width: 170px;
    padding: 8px 10px;
    border: 1px solid rgba(197, 165, 114, 0.45);
    border-radius: 8px;
    font-weight: 700;
    color: #0B1F3A;
    background: #FFFDF8;
}

.shop-card-line {
    font-size: 0.78rem;
    color: #7A6E65;
    margin: 0;
}

.shop-info {
    max-width: 1180px;
    margin: 12px auto 48px;
    padding: 24px 22px;
    background: #FFFDF8;
    border: 1px solid rgba(197, 165, 114, 0.42);
    border-radius: 14px;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.shop-info h2 {
    margin: 0 0 16px 0;
    color: #8B6B32;
    font-size: 1.12rem;
    border-bottom: 1px solid rgba(197, 165, 114, 0.28);
    padding-bottom: 10px;
}

.shop-info dl {
    margin: 0;
    display: grid;
    gap: 14px;
}

.shop-info dt {
    font-weight: 800;
    color: #8B6B32;
    font-size: 0.76rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.shop-info dd {
    margin: 4px 0 0 0;
    color: #3A3228;
    font-size: 0.92rem;
    line-height: 1.5;
}

.shop-info a {
    color: #C5A572;
    font-weight: 700;
    transition: color 0.15s;
}

.shop-info a:hover {
    color: #E8C98A;
}

/* Paycell Sanal POS — bilgilendirme çerçevesi genişliğinde */
.shop-info-paycell {
    margin: 18px 0 0 0;
    padding: 0;
    width: 100%;
    max-width: 100%;
}

.shop-info-paycell img,
.shop-info-paycell-img {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    border-radius: 10px;
    vertical-align: middle;
}

.product-facts {
    margin: 16px 0 0 0;
    display: grid;
    gap: 10px;
}

.product-facts div {
    border-top: 1px solid rgba(197, 165, 114, 0.15);
    padding-top: 8px;
}

.product-facts dt {
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #E8C98A;
}

.product-facts dd {
    margin: 4px 0 0 0;
    color: #B0A898;
    font-size: 0.88rem;
}

.product-article {
    margin-bottom: 28px;
}

.product-loading {
    text-align: center;
    color: #64748B;
    font-weight: 700;
}

.sanal-pos-slot {
    border: 1px dashed rgba(197, 165, 114, 0.5);
    border-radius: 12px;
    padding: 16px;
    margin: 12px 0;
    background: rgba(11, 31, 58, 0.5);
    color: #94867A;
}

.shop-trust.hidden-trust {
    display: none;
}

@media (max-width: 720px) {
    .product-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 992px) {
    .shop-brand-bar {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 10px 16px;
    }

    .shop-brand-nav {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        width: 100%;
        height: auto;
        max-height: calc(100vh - 64px);
        background: linear-gradient(180deg, #061128 0%, #0B1F3A 100%);
        border-bottom: 1px solid rgba(197, 165, 114, 0.3);
        display: none;
        flex-direction: column;
        align-items: stretch;
        padding: 12px 16px;
        gap: 6px;
        z-index: 1200;
        box-shadow: 0 16px 32px rgba(0, 0, 0, 0.5);
    }

    .shop-brand-nav.open {
        display: flex;
    }

    .shop-brand-nav a {
        color: #C5A572;
        background: rgba(11, 31, 58, 0.7);
        border: 1px solid rgba(197, 165, 114, 0.25);
        border-radius: 10px;
        padding: 12px 16px;
        font-weight: 800;
    }

    .shop-brand-nav a:hover,
    .shop-brand-nav a[aria-current="page"] {
        background: rgba(197, 165, 114, 0.15);
        color: #E8C98A;
        border-color: rgba(197, 165, 114, 0.45);
    }

    .shop-brand-logo-wrap .brand-logo-img,
    .shop-brand-logo-wrap img {
        height: 64px !important;
        max-width: 240px !important;
    }

    .shop-masthead-logo,
    .page-brand-hero img {
        height: 140px !important;
    }

    .shop-masthead-title {
        font-size: 1.25rem;
        letter-spacing: 0.08em;
    }
}

/* ==========================================================================
   AÇIK GOLD SAYFA ZEMİNİ + OKUNURLUK
   Header / footer lacivert kalır. İçerik açık champagne-gold.
   ========================================================================== */
html, body {
    background-color: #F6EFD9 !important;
    color: #0B1F3A !important;
}

.modal-overlay.hidden,
#modalRequestDemo.hidden,
#policyModal.hidden,
#modalRequestDemo[style*="display: none"],
#modalRequestDemo[style*="display:none"] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

.header,
.shop-brand-header {
    background: linear-gradient(135deg, #061128 0%, #0B1F3A 100%) !important;
}

.footer {
    background: linear-gradient(180deg, #0B1F3A 0%, #061128 100%) !important;
    color: #E8DFD0 !important;
}

.footer a {
    color: #E8C98A;
}

.footer a:hover {
    color: #FFFDF8;
}

.footer-col h4 {
    color: #F6EFD9 !important;
}

.shop-card,
.product-layout,
.product-window-card,
.product-card-lux,
.shop-info,
.shop-filters,
.cart-table-wrap,
.cart-summary,
.checkout-legal,
.checkout-pay-line,
.guide-slide-card,
.process-card {
    background: #FFFDF8 !important;
    color: #0B1F3A !important;
    border-color: rgba(139, 107, 50, 0.28) !important;
}

.shop-card-title,
.product-info h1,
.guide-slide-title,
.section-title-unified {
    color: #0B1F3A;
}

.shop-card-price,
.shop-card-brand,
[data-brand-en],
.shop-info dt,
.shop-filters label {
    color: #8B6B32 !important;
}

.shop-card-meta,
.shop-card-features,
.shop-intro,
.product-desc,
.product-delivery,
.product-pay-note,
.shop-info dd,
.cart-line-meta {
    color: #3A3228 !important;
}

.cart-table th,
.cart-table td {
    color: #0B1F3A !important;
}

.cart-summary p,
.checkout-total {
    color: #8B6B32 !important;
}

.btn-shop-link {
    background: #FFFDF8 !important;
    color: #8B6B32 !important;
    border-color: #C5A572 !important;
}

.product-window-card.card-labs,
.product-card-lux.labs-preview {
    background: #FBF6EA !important;
}

/* Slim 3D hero CTAs + gold language names + gold nav underline lock */
.hero-cta-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
}

.hero-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 9px 16px;
    font-size: 0.82rem;
    font-weight: 800;
    letter-spacing: 0.01em;
    line-height: 1.2;
    text-decoration: none;
    border-radius: 10px;
    border: 1px solid transparent;
    white-space: nowrap;
    position: relative;
    font-family: inherit;
    transition: transform 0.15s ease, box-shadow 0.15s ease, filter 0.15s ease;
}

.hero-cta-3d {
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.45),
        inset 0 -3px 0 rgba(0, 0, 0, 0.28),
        0 5px 0 rgba(0, 0, 0, 0.22),
        0 10px 16px rgba(0, 0, 0, 0.16);
}

.hero-cta-3d:hover {
    transform: translateY(-2px);
    filter: brightness(1.06);
}

.hero-cta-3d:active {
    transform: translateY(3px);
    box-shadow:
        inset 0 2px 5px rgba(0, 0, 0, 0.28),
        0 1px 0 rgba(255, 255, 255, 0.2);
}

.hero-cta-demo {
    background: linear-gradient(180deg, #16345C 0%, #0B1F3A 100%);
    color: #E8C98A;
    border-color: #C5A572;
}

.hero-cta-chrome {
    background: linear-gradient(180deg, #5A9BFF 0%, #4285F4 52%, #3367D6 100%);
    color: #FFFFFF;
    border-color: #1A73E8;
}

.hero-cta-firefox {
    background: linear-gradient(180deg, #FF8A56 0%, #FF7139 52%, #E24E1B 100%);
    color: #FFFFFF;
    border-color: #C13804;
}

.hero-cta-shop {
    background: linear-gradient(180deg, #E8C98A 0%, #C5A572 48%, #8B6B32 100%);
    color: #0B1F3A;
    border-color: #9A7A4A;
}

.lang-option-item .lang-name {
    background: linear-gradient(90deg, #F0EAE0 0%, #E8C98A 30%, #C5A572 55%, #9A7A4A 80%, #F0EAE0 100%) !important;
    background-size: 200% auto !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
    animation: textShimmer3D 4s linear infinite !important;
    font-weight: 800 !important;
    color: transparent !important;
}

.lang-option-item.active {
    background: linear-gradient(135deg, #102646 0%, #0B1F3A 100%) !important;
    border-color: #C5A572 !important;
    box-shadow: 0 4px 14px rgba(197, 165, 114, 0.35) !important;
    color: #E8C98A !important;
}

.lang-option-item:hover {
    background: rgba(197, 165, 114, 0.18) !important;
    border-color: rgba(197, 165, 114, 0.45) !important;
    color: #E8C98A !important;
    transform: translateX(2px) !important;
}

.nav-3d-link::after {
    background: linear-gradient(90deg, #8B6B32 0%, #C5A572 50%, #E8C98A 100%) !important;
    box-shadow: 0 0 10px rgba(197, 165, 114, 0.55) !important;
}

.nav-3d-link .icon-globe {
    color: #C5A572 !important;
    filter: drop-shadow(0 0 6px rgba(197, 165, 114, 0.8)) !important;
}

.nav-3d-link span:not(.nav-text):not(.header-cart-badge):not(.lang-chevron) {
    background: linear-gradient(90deg, #F0EAE0 0%, #E8C98A 30%, #C5A572 55%, #9A7A4A 80%, #F0EAE0 100%);
    background-size: 200% auto;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    animation: textShimmer3D 4s linear infinite;
    font-weight: 800;
}

@media (max-width: 640px) {
    .hero-cta {
        font-size: 0.78rem;
        padding: 8px 13px;
    }
}

.feat-grid-8 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    max-width: 1140px;
    margin: 0 auto 8px;
    text-align: left;
}

.feat-grid-8 .process-card {
    padding: 18px 16px !important;
}

.feat-grid-8 .process-card h3 {
    font-size: 0.98rem !important;
    color: #0B1F3A !important;
}

.feat-grid-8 .process-card p {
    font-size: 0.8rem !important;
    color: #5C5348 !important;
}

.growth-slogan {
    font-size: 1.2rem;
    font-weight: 800;
    color: #E8C98A;
    margin: 0 0 20px 0;
    letter-spacing: 0.01em;
}

.growth-chart-bars {
    display: flex;
    align-items: flex-end;
    gap: 10px;
    height: 168px;
    padding: 4px 2px 0;
}

.growth-bar {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 100%;
}

.growth-bar-track {
    flex: 1;
    width: 100%;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.growth-bar-fill {
    display: block;
    width: 100%;
    max-width: 40px;
    border-radius: 8px 8px 2px 2px;
    background: linear-gradient(180deg, #E8C98A 0%, #C5A572 55%, #8B6B32 100%);
    box-shadow: 0 0 12px rgba(197, 165, 114, 0.28);
}

.growth-bar b {
    margin-top: 8px;
    font-size: 0.7rem;
    color: #C5B8A4;
    font-weight: 700;
}

.investor-lux-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.investor-lux a.investor-wa {
    background: #25D366;
    color: #fff;
    border: 1px solid #1da851;
}

.why-lux-card .why-lux-badge {
    display: inline-block;
    margin-bottom: 8px;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #8B6B32;
    background: rgba(197, 165, 114, 0.14);
    border: 1px solid rgba(197, 165, 114, 0.32);
    padding: 2px 8px;
    border-radius: 999px;
}

.why-lux-section {
    background: linear-gradient(180deg, #FBF6EA 0%, #F6EFD9 100%);
    padding: 80px 0;
    border-bottom: 1px solid rgba(197, 165, 114, 0.22);
}

.why-lux-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}

.why-lux-card {
    background:
        linear-gradient(90deg, #8B6B32, #C5A572, #E8C98A) top center / 100% 3px no-repeat,
        #FFFDF8;
    border: 1.5px solid rgba(197, 165, 114, 0.38);
    border-radius: 18px;
    padding: 22px 18px 20px;
    text-align: left;
    box-shadow: 0 10px 24px rgba(11, 31, 58, 0.06);
    position: relative;
    overflow: hidden;
    background-clip: padding-box, padding-box;
}

.why-lux-card::before {
    content: none;
}

.why-lux-icon {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: linear-gradient(180deg, #16345C 0%, #0B1F3A 100%);
    color: #E8C98A;
    border: 1px solid #C5A572;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    margin-bottom: 12px;
}

.why-lux-card h3 {
    font-size: 1.02rem;
    font-weight: 900;
    color: #0B1F3A;
    margin: 0 0 8px 0;
}

.why-lux-card p {
    font-size: 0.86rem;
    color: #5C5348;
    line-height: 1.55;
    margin: 0;
}

.why-lux-grid--steps {
    grid-template-columns: repeat(3, 1fr);
    max-width: 1080px;
    margin: 0 auto;
}

.why-lux-card--accent {
    box-shadow: 0 12px 28px rgba(197, 165, 114, 0.14);
}

.why-lux-cta-wrap {
    margin-top: 36px;
}

.why-lux-cta {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 14px 28px;
    border-radius: 14px;
    text-decoration: none;
    font-weight: 800;
    font-size: 0.95rem;
    color: #0B1F3A;
    background: linear-gradient(180deg, #E8C98A 0%, #C5A572 55%, #8B6B32 100%);
    border: 1px solid #9A7A4A;
    box-shadow: 0 10px 24px rgba(11, 31, 58, 0.12);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.why-lux-cta:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 28px rgba(11, 31, 58, 0.18);
    color: #061128;
}

#pricing {
    background: linear-gradient(180deg, #FBF6EA 0%, #F6EFD9 100%);
    padding: 72px 0;
    border-bottom: 1px solid rgba(197, 165, 114, 0.22);
}

.license-grid-3x2 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
    max-width: 1080px;
    margin: 28px auto 0;
    text-align: left;
}

.license-slim-card {
    background: #FFFDF8;
    border: 1.5px solid rgba(197, 165, 114, 0.4);
    border-radius: 14px;
    padding: 14px 16px 16px;
    display: flex;
    flex-direction: column;
    min-height: 0;
    box-shadow: 0 8px 18px rgba(11, 31, 58, 0.05);
}

.license-slim-card.is-featured {
    border-color: #C5A572;
    border-width: 2px;
    box-shadow: 0 10px 22px rgba(197, 165, 114, 0.2);
}

.license-slim-card .pkg-kicker {
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #8B6B32;
    background: rgba(197, 165, 114, 0.14);
    border: 1px solid rgba(197, 165, 114, 0.35);
    display: inline-block;
    padding: 2px 8px;
    border-radius: 999px;
    margin-bottom: 8px;
}

.license-slim-card h3 {
    font-size: 1.02rem;
    font-weight: 900;
    color: #0B1F3A;
    margin: 0 0 8px 0;
    line-height: 1.3;
}

.license-slim-card ul {
    list-style: none;
    padding: 0;
    margin: 0 0 10px 0;
    font-size: 0.8rem;
    color: #3A3228;
    line-height: 1.45;
}

.license-slim-card ul li {
    margin: 0 0 3px 0;
}

.license-slim-price {
    margin-top: auto;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
    padding-top: 8px;
    border-top: 1px solid rgba(197, 165, 114, 0.28);
}

.license-slim-price strong {
    font-size: 1.35rem;
    font-weight: 900;
    color: #8B6B32;
}

.license-slim-price span {
    font-size: 0.72rem;
    font-weight: 700;
    color: #8B6B32;
}

.license-slim-buy {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 10px;
    padding: 8px 12px;
    font-size: 0.8rem;
    font-weight: 800;
    text-decoration: none;
    border-radius: 9px;
    color: #0B1F3A;
    background: linear-gradient(180deg, #E8C98A 0%, #C5A572 50%, #8B6B32 100%);
    border: 1px solid #9A7A4A;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.4), 0 3px 0 rgba(0,0,0,0.16);
}

.license-slim-buy:active {
    transform: translateY(2px);
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.22);
}

.growth-lux-section {
    background: linear-gradient(180deg, #061128 0%, #0B1F3A 100%);
    color: #FFF;
    padding: 72px 0;
    border-bottom: 1px solid rgba(197, 165, 114, 0.25);
}

.growth-stat-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 28px 0 32px;
}

.growth-stat-card {
    background: rgba(255, 253, 248, 0.04);
    border: 1px solid rgba(197, 165, 114, 0.28);
    border-radius: 14px;
    padding: 18px 14px;
}

.growth-stat-card strong {
    display: block;
    font-size: 1.7rem;
    font-weight: 900;
    color: #E8C98A;
    line-height: 1.15;
    margin-bottom: 6px;
}

.growth-stat-card b {
    display: block;
    font-size: 0.88rem;
    color: #F0EAE0;
    margin-bottom: 4px;
}

.growth-stat-card span {
    font-size: 0.76rem;
    color: #C5B8A4;
}

.growth-chart-wrap {
    background: rgba(255, 253, 248, 0.04);
    border: 1px solid rgba(197, 165, 114, 0.28);
    border-radius: 16px;
    padding: 18px 20px 12px;
    margin-bottom: 28px;
}

.growth-chart-wrap h3 {
    margin: 0 0 6px 0;
    color: #E8C98A;
    font-size: 1rem;
}

.growth-chart-wrap p {
    margin: 0 0 12px 0;
    color: #C5B8A4;
    font-size: 0.82rem;
}

.investor-lux {
    background: linear-gradient(135deg, #102646 0%, #0B1F3A 100%);
    border: 1.5px solid #C5A572;
    border-radius: 18px;
    padding: 26px 28px;
    text-align: left;
    box-shadow: 0 16px 36px rgba(0, 0, 0, 0.28);
}

.investor-lux .investor-kicker {
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #C5A572;
    margin: 0 0 8px 0;
}

.investor-lux h3 {
    font-size: 1.45rem;
    font-weight: 900;
    color: #E8C98A;
    margin: 0 0 10px 0;
    line-height: 1.3;
}

.investor-lux p {
    margin: 0 0 16px 0;
    color: #E8E0D2;
    font-size: 0.95rem;
    line-height: 1.6;
}

.investor-lux a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 16px;
    border-radius: 10px;
    text-decoration: none;
    font-weight: 800;
    font-size: 0.84rem;
    color: #0B1F3A;
    background: linear-gradient(180deg, #E8C98A 0%, #C5A572 55%, #8B6B32 100%);
    border: 1px solid #9A7A4A;
}

@media (max-width: 992px) {
    .feat-grid-8,
    .why-lux-grid,
    .why-lux-grid--steps,
    .license-grid-3x2,
    .growth-stat-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 640px) {
    .feat-grid-8,
    .why-lux-grid,
    .why-lux-grid--steps,
    .license-grid-3x2,
    .growth-stat-grid {
        grid-template-columns: 1fr;
    }
}

.shop-currency-note {
    max-width: 1100px;
    margin: -8px auto 22px;
    padding: 0 20px;
    color: #5B5348;
    font-size: 0.9rem;
    font-weight: 600;
    text-align: center;
}

.header-account-wrap {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.header-account-btn {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    border: 1px solid rgba(197, 165, 114, 0.45);
    background: linear-gradient(180deg, #0B1F3A 0%, #16345A 100%);
    color: #E8C98A;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.header-account-btn:hover,
.header-account-wrap.is-open .header-account-btn {
    color: #FFF8E8;
    box-shadow: 0 4px 14px rgba(11, 31, 58, 0.28);
}

.header-account-trigger {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 0;
    background: transparent;
    padding: 0;
    cursor: pointer;
    max-width: min(220px, 42vw);
}

.header-account-name {
    color: #E8C98A;
    font-size: 0.82rem;
    font-weight: 800;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: right;
    max-width: 150px;
}

.header-account-wrap.is-open .header-account-name,
.header-account-trigger:hover .header-account-name {
    color: #FFF8E8;
}

@media (max-width: 720px) {
    .header-account-name {
        display: none;
    }
}

.header-account-out {
    border: 0;
    background: transparent;
    color: #8B6B32;
    font-size: 0.72rem;
    font-weight: 800;
    cursor: pointer;
    padding: 0;
}

.header-account-menu {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    width: min(300px, calc(100vw - 24px));
    background: #FFFDF8;
    border: 1px solid rgba(197, 165, 114, 0.4);
    border-radius: 16px;
    box-shadow: 0 18px 40px rgba(11, 31, 58, 0.22);
    padding: 12px;
    z-index: 1200;
    display: none;
}

.header-account-wrap.is-open .header-account-menu {
    display: block;
}

.header-account-menu-head {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 8px 12px;
    border-bottom: 1px solid rgba(197, 165, 114, 0.28);
    margin-bottom: 8px;
}

.header-account-avatar {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    background: linear-gradient(180deg, #0B1F3A 0%, #16345A 100%);
    color: #E8C98A;
    border: 1px solid #C5A572;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 900;
    font-size: 0.92rem;
    flex-shrink: 0;
}

.header-account-meta {
    min-width: 0;
    text-align: left;
}

.header-account-meta strong {
    display: block;
    color: #0B1F3A;
    font-size: 0.92rem;
    font-weight: 800;
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.header-account-meta span {
    display: block;
    color: #78716C;
    font-size: 0.78rem;
    line-height: 1.35;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.header-account-meta em {
    display: inline-block;
    margin-top: 4px;
    font-style: normal;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #8B6B32;
    background: rgba(197, 165, 114, 0.14);
    border: 1px solid rgba(197, 165, 114, 0.32);
    padding: 2px 8px;
    border-radius: 999px;
}

.header-account-menu a,
.header-account-menu button.header-account-menu-item {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 10px;
    border: 0;
    background: transparent;
    color: #0B1F3A;
    text-decoration: none;
    font-size: 0.88rem;
    font-weight: 700;
    text-align: left;
    padding: 10px 10px;
    border-radius: 10px;
    cursor: pointer;
}

.header-account-menu a:hover,
.header-account-menu button.header-account-menu-item:hover {
    background: rgba(197, 165, 114, 0.14);
}

.header-account-menu a i,
.header-account-menu button.header-account-menu-item i {
    width: 18px;
    color: #8B6B32;
    text-align: center;
}

.header-account-menu-item.is-danger {
    color: #B91C1C;
    margin-top: 4px;
    border-top: 1px solid rgba(197, 165, 114, 0.22);
    border-radius: 0 0 10px 10px;
}

.header-account-menu-item.is-danger i {
    color: #B91C1C;
}

.acc-checkout {
    background: #FFFDF8;
    border: 1px solid rgba(197, 165, 114, 0.35);
    border-radius: 16px;
    padding: 20px 18px;
    margin: 0 0 22px 0;
}

.acc-checkout h2,
.acc-checkout h3,
.acc-modal-card h2 {
    margin: 0 0 8px 0;
    color: #0B1F3A;
    font-size: 1.15rem;
}

.acc-checkout h3 {
    margin-top: 18px;
}

.acc-lead,
.acc-note {
    margin: 0 0 14px 0;
    color: #5B5348;
    font-size: 0.88rem;
    line-height: 1.5;
}

.acc-note {
    font-size: 0.8rem;
    color: #78716C;
}

.buyer-billing-panel {
    margin-top: 12px;
}

.buyer-billing-note {
    margin: 0 0 14px 0;
    padding: 12px 14px;
    background: #F8FAFC;
    border: 1px solid #E2E8F0;
    border-radius: 10px;
    color: #334155;
    font-size: 0.8rem;
    line-height: 1.5;
    font-weight: 600;
}

.buyer-billing-note--export {
    background: #FFF7ED;
    border-color: #FED7AA;
    color: #9A3412;
    margin-top: 12px;
}

.buyer-billing-hint {
    margin: 8px 0 0 0;
    font-size: 0.78rem;
    color: #78716C;
    font-weight: 600;
}

.buyer-type-toggle {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0 0 12px 0;
}

.buyer-type-option {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border: 1px solid rgba(197, 165, 114, 0.4);
    border-radius: 10px;
    background: #FFF;
    cursor: pointer;
    font-size: 0.84rem;
    font-weight: 700;
    color: #0B1F3A;
}

.buyer-type-option:has(input:checked) {
    border-color: #C5A572;
    background: #FFF8EB;
}

.buyer-field-full {
    grid-column: 1 / -1;
}

.buyer-check {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 0.84rem;
    font-weight: 700;
    color: #0B1F3A;
    cursor: pointer;
}

.buyer-check input {
    margin-top: 3px;
}

.acc-modal-card--wide {
    max-width: 640px;
}

.acc-form-grid textarea {
    width: 100%;
    min-height: 64px;
    resize: vertical;
    font: inherit;
    padding: 10px 12px;
    border: 1px solid rgba(11, 31, 58, 0.18);
    border-radius: 10px;
}

.btn-shop-pay.is-busy,
a.is-busy {
    opacity: 0.65;
    pointer-events: none;
}

.acc-choice-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-bottom: 12px;
}

.acc-choice {
    text-align: left;
    border: 1px solid rgba(197, 165, 114, 0.4);
    background: #FBF6EA;
    border-radius: 14px;
    padding: 14px 12px;
    cursor: pointer;
    color: #0B1F3A;
}

.acc-choice strong {
    display: block;
    margin-bottom: 6px;
    font-size: 0.92rem;
}

.acc-choice span {
    display: block;
    font-size: 0.78rem;
    color: #5B5348;
    line-height: 1.4;
}

.acc-choice.is-active,
.acc-choice:hover {
    border-color: #C5A572;
    background: linear-gradient(180deg, #FFF8E8 0%, #F4E8C8 100%);
    box-shadow: 0 6px 16px rgba(197, 165, 114, 0.2);
}

.acc-choice.is-off span {
    color: #D4243A;
    font-weight: 700;
}

.acc-form-grid,
.acc-form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.acc-form {
    margin-top: 8px;
}

.acc-form-grid label,
.acc-form label {
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-size: 0.8rem;
    font-weight: 700;
    color: #0B1F3A;
}

.acc-form-grid input,
.acc-form-grid select,
.acc-form input {
    border: 1px solid rgba(11, 31, 58, 0.18);
    border-radius: 10px;
    padding: 10px 12px;
    font: inherit;
    background: #FFF;
    color: #0B1F3A;
}

.acc-form .btn-shop-pay {
    grid-column: 1 / -1;
    width: auto;
    justify-self: start;
}

body.acc-modal-open {
    overflow: hidden;
}

.acc-modal {
    position: fixed;
    inset: 0;
    z-index: 80;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 18px;
}

.acc-modal[hidden] {
    display: none !important;
}

.acc-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(6, 17, 40, 0.62);
}

.acc-modal-card {
    position: relative;
    z-index: 1;
    width: min(720px, 100%);
    max-height: calc(100vh - 36px);
    overflow: auto;
    background: #FFFDF8;
    border: 1px solid rgba(197, 165, 114, 0.45);
    border-radius: 18px;
    padding: 24px 20px 20px;
    box-shadow: 0 24px 50px rgba(6, 17, 40, 0.28);
}

.acc-modal-x {
    position: absolute;
    top: 10px;
    right: 12px;
    width: 34px;
    height: 34px;
    border: 0;
    background: transparent;
    font-size: 1.4rem;
    color: #0B1F3A;
    cursor: pointer;
}

.acc-tabs {
    display: flex;
    gap: 8px;
    margin: 8px 0;
}

.acc-tab {
    border: 1px solid rgba(197, 165, 114, 0.4);
    background: #F6EFD9;
    color: #0B1F3A;
    border-radius: 999px;
    padding: 6px 14px;
    font-weight: 800;
    cursor: pointer;
}

.acc-tab.is-active {
    background: #0B1F3A;
    color: #E8C98A;
}

.acc-msg {
    margin: 10px 0 0 0;
    font-size: 0.86rem;
    font-weight: 700;
    color: #0B1F3A;
}

.acc-msg.is-error {
    color: #D4243A;
}

@media (max-width: 800px) {
    .acc-choice-grid,
    .acc-form-grid,
    .acc-form {
        grid-template-columns: 1fr;
    }
}

/* === 2026-09-04 nav / kısayol / buton standartı (wrap & kalıntı temizliği) === */
.header-container {
    flex-wrap: nowrap;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.header-actions-b,
.shop-brand-actions {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}

.header-actions-b .nav-3d-link {
    display: none; /* aksiyon barında eski metin kısayol kalıntısı olmasın */
}

.header-cart-link {
    flex-shrink: 0;
    overflow: visible;
    width: 38px;
    height: 38px;
    padding: 0;
    position: relative;
}

.header-cart-link .nav-text {
    display: none;
}

.header-cart-badge {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    z-index: 3;
    top: -7px;
    right: -7px;
    pointer-events: none;
}

.header-actions-b,
.shop-brand-actions,
.header-container {
    overflow: visible;
}

.nav-menu {
    flex-wrap: nowrap;
    min-width: 0;
    gap: 10px !important;
}

.shop-brand-nav {
    flex-wrap: nowrap !important;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    min-width: 0;
    gap: 10px !important;
}

.shop-brand-nav::-webkit-scrollbar {
    display: none;
}

.shop-brand-nav .nav-3d-link,
.nav-menu .nav-3d-link {
    flex-shrink: 0;
    white-space: nowrap;
    gap: 6px;
}

.shop-brand-actions .header-action-btn,
.header-actions-b .header-action-btn {
    flex-shrink: 0;
}

.btn-shop-cart,
.btn-shop-pay,
.btn-shop-link,
.license-slim-buy,
.acc-form .btn-shop-pay,
.header-account-out,
.acc-logout-btn {
    white-space: nowrap;
    max-width: 100%;
    box-sizing: border-box;
}

.license-slim-buy {
    min-height: 36px;
}

.shop-masthead,
.page-brand-hero {
    text-align: center;
}

.shop-masthead-title,
.page-brand-hero h1.section-title-unified,
.page-brand-hero .section-title-unified {
    display: block !important;
    width: 100%;
    max-width: 920px;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
    line-height: 1.2;
}

.shop-masthead-title > span,
.page-brand-hero h1.section-title-unified > span,
.page-brand-hero .section-title-unified > span {
    display: inline;
    white-space: normal;
}

.shop-catalog {
    justify-content: center !important;
    justify-items: stretch !important;
    align-items: stretch;
}

.shop-card {
    height: 100%;
    min-height: 100%;
}

.shop-card-media {
    width: 100%;
    height: 96px;
    min-height: 96px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.shop-card-media img {
    max-height: 80px;
    max-width: 100%;
    width: auto;
    object-fit: contain;
}

.shop-card-brand,
.shop-card-line {
    min-height: 1.05em;
}

.shop-card-title {
    min-height: 2.2em;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 1.35;
}

.shop-card-meta {
    min-height: 1.4em;
}

.shop-card-price {
    min-height: 1.5em;
}

.shop-card-features {
    flex: 1 1 auto;
    min-height: 6.5em;
}

.shop-card-actions {
    margin-top: auto;
}

.guide-hub-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 22px;
    margin-bottom: 40px;
    align-items: stretch;
}

.guide-hub-card {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 18px;
    background: #FFFDF8;
    border: 1.5px solid rgba(197, 165, 114, 0.28);
    border-radius: 20px;
    padding: 26px 22px;
    text-decoration: none;
    color: inherit;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.04);
    min-height: 280px;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.guide-hub-card:hover {
    transform: translateY(-3px);
    border-color: rgba(197, 165, 114, 0.55);
    box-shadow: 0 14px 28px rgba(61, 42, 16, 0.1);
}

.guide-hub-card.is-featured {
    border: 2px solid rgba(197, 165, 114, 0.45);
    position: relative;
}

.guide-hub-card .guide-hub-icon {
    width: 56px;
    height: 56px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
    background: #102646;
    color: #C5A572;
    font-size: 1.5rem;
}

.guide-hub-card .card-title {
    font-size: 1.2rem !important;
    font-weight: 900;
    letter-spacing: -0.01em;
    margin: 0 0 10px 0;
    line-height: 1.3;
    min-height: 2.6em;
}

.guide-hub-card .guide-hub-desc {
    font-size: 0.92rem;
    color: #64748B;
    line-height: 1.55;
    margin: 0;
    min-height: 4.2em;
}

.guide-hub-card .guide-hub-cta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #8B6B32;
    font-weight: 900;
    font-size: 0.95rem;
    margin-top: auto;
}

.guide-hub-badge {
    position: absolute;
    top: 14px;
    right: 14px;
    background: #C5A572;
    color: #FFF;
    font-size: 0.72rem;
    font-weight: 900;
    padding: 4px 12px;
    border-radius: 20px;
    text-transform: uppercase;
}

.guide-switcher {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
    gap: 12px;
    margin-bottom: 28px;
}

.guide-switcher a,
.guide-switcher .nav-3d-link,
.guide-switcher button {
    white-space: normal;
    text-align: center;
    justify-content: center;
    min-height: 44px;
    line-height: 1.25;
    padding: 10px 14px !important;
}

@media (max-width: 992px) {
    .shop-brand-nav {
        overflow: visible !important;
        overflow-x: visible !important;
        flex-wrap: nowrap !important;
    }

    .shop-brand-nav.open {
        display: flex !important;
        flex-direction: column !important;
        flex-wrap: nowrap !important;
        align-items: stretch !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        height: auto !important;
        max-height: calc(100vh - 64px) !important;
        width: 100% !important;
        left: 0 !important;
        right: 0 !important;
        z-index: 1300 !important;
    }

    .shop-brand-nav.open .nav-3d-link,
    .shop-brand-nav.open a {
        width: 100%;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        font-size: clamp(0.78rem, 2.6vw, 0.95rem) !important;
    }
}

@media (max-width: 720px) {
    .shop-masthead-title,
    .page-brand-hero h1.section-title-unified,
    .page-brand-hero .section-title-unified {
        font-size: 1.55rem !important;
    }

    .guide-hub-card .card-title,
    .guide-hub-card .guide-hub-desc {
        min-height: 0;
    }

    .shop-card-title,
    .shop-card-features {
        min-height: 0;
    }
}


/* FAQ LUX + CONTACT PAGE */
.faq-lux-section {
    background: linear-gradient(180deg, #FBF6EA 0%, #F6EFD9 100%);
    padding: 72px 0 80px;
    border-top: 1px solid rgba(197, 165, 114, 0.22);
}
.faq-lux-sub {
    font-size: 1.05rem;
    color: #5C5348;
    max-width: 760px;
    margin: 0 auto 28px;
    line-height: 1.6;
}
.faq-lux-list {
    max-width: 920px;
    margin: 0 auto;
    text-align: left;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.faq-lux-item {
    background: #FFFDF8;
    border: 1.5px solid rgba(197, 165, 114, 0.38);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 10px 24px rgba(11, 31, 58, 0.05);
    background-image: linear-gradient(90deg, #8B6B32, #C5A572, #E8C98A);
    background-size: 100% 3px;
    background-repeat: no-repeat;
    background-position: top center;
}
.faq-lux-q {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 18px 20px;
    font-size: 1.02rem;
    font-weight: 800;
    color: #0B1F3A;
}
.faq-lux-chevron {
    color: #8B6B32;
    transition: transform 0.2s ease;
    flex-shrink: 0;
}
.faq-lux-item.open .faq-lux-chevron {
    transform: rotate(180deg);
}
.faq-lux-a {
    padding: 0 20px 18px;
    font-size: 0.92rem;
    color: #5C5348;
    line-height: 1.65;
    border-top: 1px solid rgba(197, 165, 114, 0.22);
    margin-top: 0;
    padding-top: 14px;
}
.faq-lux-cta {
    margin-top: 28px;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
}
.contact-page-main {
    padding: 20px 0 72px;
    background: linear-gradient(180deg, #FBF6EA 0%, #F6EFD9 100%);
}
.contact-page-wrap {
    max-width: 980px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 22px;
    text-align: left;
}
.contact-lux-card {
    position: relative;
    background-color: #FFFDF8;
    background-image: linear-gradient(90deg, #8B6B32, #C5A572, #E8C98A);
    background-size: 100% 3px;
    background-repeat: no-repeat;
    background-position: top center;
    border: 1.5px solid rgba(197, 165, 114, 0.42);
    border-radius: 18px;
    padding: 26px 24px 28px;
    box-shadow: 0 12px 28px rgba(11, 31, 58, 0.07);
    overflow: hidden;
}
.contact-lux-card h2 {
    margin: 0 0 8px;
    color: #0B1F3A;
    font-size: 1.28rem;
    font-weight: 900;
}
.contact-lux-card .lead {
    margin: 0 0 20px;
    color: #5C5348;
    font-size: 0.92rem;
    line-height: 1.55;
}
.contact-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px 18px;
    margin-bottom: 16px;
}
.contact-field {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 0;
    font-size: 0.86rem;
    font-weight: 800;
    color: #0B1F3A;
}
.contact-route-hint {
    margin: -4px 0 16px;
    font-size: 0.84rem;
    font-weight: 700;
    color: #8B6B32;
    line-height: 1.45;
}
.contact-field-message {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 0 0 18px;
}
.contact-lux-form optgroup {
    font-weight: 800;
    color: #0B1F3A;
    font-style: normal;
}
.contact-lux-form option {
    font-weight: 600;
    color: #0B1F3A;
}
.contact-lux-form input,
.contact-lux-form select,
.contact-lux-form textarea {
    display: block;
    width: 100%;
    margin: 0;
    padding: 13px 14px;
    border-radius: 12px;
    border: 2px solid #C5A572;
    background: #FFFFFF;
    font: inherit;
    font-weight: 600;
    color: #0B1F3A;
    box-sizing: border-box;
    min-height: 48px;
    box-shadow: inset 0 1px 2px rgba(11, 31, 58, 0.04);
}
.contact-lux-form input:focus,
.contact-lux-form select:focus,
.contact-lux-form textarea:focus {
    outline: none;
    border-color: #8B6B32;
    box-shadow: 0 0 0 3px rgba(197, 165, 114, 0.28);
}
.contact-lux-form textarea {
    min-height: 180px;
    height: 180px;
    resize: vertical;
    line-height: 1.55;
    background: #FFFEFA;
}
.contact-submit-btn,
.contact-lux-form button[type="submit"] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    max-width: 320px;
    margin: 0;
    border: 1px solid #9A7A4A;
    border-radius: 12px;
    padding: 14px 18px;
    font-weight: 800;
    font-size: 1rem;
    cursor: pointer;
    color: #0B1F3A;
    background: linear-gradient(180deg, #E8C98A 0%, #C5A572 55%, #8B6B32 100%);
}
.contact-secondary-grid {
    display: grid;
    grid-template-columns: 1fr 1.15fr;
    gap: 22px;
    align-items: stretch;
}
.contact-channel-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.contact-channel-list a {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    border-radius: 12px;
    text-decoration: none;
    color: #0B1F3A;
    background: #FFFFFF;
    border: 1.5px solid rgba(197, 165, 114, 0.35);
    font-weight: 700;
    font-size: 0.95rem;
}
.contact-channel-list a:hover {
    border-color: #C5A572;
    background: rgba(197, 165, 114, 0.08);
}
.contact-channel-list a i {
    color: #8B6B32 !important;
    -webkit-text-fill-color: #8B6B32 !important;
    width: 22px;
    text-align: center;
    font-size: 1.1rem;
}
.contact-address-block {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 16px;
    border-radius: 12px;
    background: #FFFFFF;
    border: 1.5px solid rgba(197, 165, 114, 0.45);
}
.contact-address-block > i {
    color: #8B6B32;
    margin-top: 3px;
    width: 22px;
    text-align: center;
    font-size: 1.15rem;
    flex-shrink: 0;
}
.contact-address-block strong {
    display: block;
    color: #0B1F3A;
    font-size: 0.86rem;
    font-weight: 800;
    margin-bottom: 4px;
}
.contact-address-block p {
    margin: 0;
    color: #5C5348;
    font-size: 0.9rem;
    line-height: 1.5;
    font-weight: 600;
}
.contact-map-address {
    margin: 12px 0 8px;
    color: #0B1F3A;
    font-size: 0.92rem;
    font-weight: 700;
    line-height: 1.5;
}
.contact-map-open {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
    color: #8B6B32;
    font-weight: 800;
    font-size: 0.9rem;
    text-decoration: none;
}
.contact-map-open:hover { color: #0B1F3A; }
.contact-map-wrap {
    margin-top: 4px;
    border-radius: 14px;
    overflow: hidden;
    border: 1.5px solid rgba(197, 165, 114, 0.35);
    background: #E8E0D0;
    min-height: 260px;
}
.contact-map-frame {
    display: block;
    width: 100%;
    height: 260px;
    min-height: 260px;
    border: 0;
}
.contact-map-note {
    margin-top: 14px;
    margin-bottom: 0;
    font-size: 0.84rem;
    color: #5C5348;
    line-height: 1.55;
}
@media (max-width: 800px) {
    .contact-form-grid,
    .contact-secondary-grid {
        grid-template-columns: 1fr;
    }
    .contact-lux-card {
        padding: 22px 18px 24px;
    }
    .contact-submit-btn,
    .contact-lux-form button[type="submit"] {
        max-width: none;
    }
}

/* === RESPONSIVE_FIX_20260905: single-line UI + fluid shrink === */
html {
    font-size: clamp(13.5px, 0.28vw + 12.6px, 16px);
}

.nav-menu .nav-3d-link,
.nav-menu .nav-link,
.shop-brand-nav .nav-3d-link,
.header-actions-b .nav-3d-link,
.guide-switcher .nav-3d-link,
.license-slim-buy,
.btn-shop-cart,
.btn-shop-pay,
.btn-shop-link,
.acc-logout-btn,
.header-account-out,
.contact-submit-btn {
    white-space: nowrap;
    max-width: 100%;
}

.nav-menu .nav-text,
.shop-brand-nav .nav-text {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    font-size: clamp(0.72rem, 0.55vw + 0.62rem, 0.92rem);
    line-height: 1.15;
}

.shop-masthead-title,
.page-brand-hero h1,
.page-brand-hero .section-title-unified,
.section-title-unified {
    font-size: clamp(1.15rem, 2.2vw + 0.55rem, 2.35rem) !important;
    line-height: 1.2;
}

.shop-card-title,
.card-title,
.guide-hub-card .card-title {
    font-size: clamp(0.95rem, 1.1vw + 0.7rem, 1.25rem);
    line-height: 1.25;
}

.btn-shop-pay,
.btn-shop-cart,
.btn-shop-link,
.license-slim-buy,
.contact-submit-btn {
    font-size: clamp(0.78rem, 0.45vw + 0.68rem, 0.95rem) !important;
    padding-inline: clamp(10px, 1.2vw, 18px);
}

@media (max-width: 1200px) and (min-width: 993px) {
    .shop-brand-bar {
        gap: 10px;
        padding: 6px 16px;
        min-height: 84px;
    }

    .shop-brand-nav {
        gap: 6px !important;
    }

    .shop-brand-nav .nav-text,
    .nav-menu .nav-text {
        font-size: clamp(0.68rem, 0.7vw + 0.5rem, 0.84rem);
    }

    .shop-brand-logo-wrap .brand-logo-img,
    .shop-brand-logo-wrap img {
        height: clamp(48px, 6vw, 72px) !important;
        max-width: clamp(160px, 22vw, 260px) !important;
    }

    .header-container {
        gap: 8px;
        padding-inline: 14px;
    }

    .nav-menu {
        gap: 6px !important;
    }
}

@media (max-width: 992px) {
    .nav-menu .nav-text,
    .shop-brand-nav .nav-text {
        font-size: clamp(0.86rem, 2.8vw, 1.02rem);
        white-space: nowrap;
    }

    .nav-menu .nav-3d-link,
    .shop-brand-nav .nav-3d-link {
        min-height: 44px;
        align-items: center;
    }

    .shop-masthead-title,
    .page-brand-hero h1,
    .page-brand-hero .section-title-unified {
        font-size: clamp(1.2rem, 4.5vw, 1.65rem) !important;
        white-space: normal;
    }

    .license-slim-buy,
    .btn-shop-pay,
    .btn-shop-cart {
        font-size: clamp(0.74rem, 2.4vw, 0.9rem) !important;
    }

    .price-card-title,
    .shop-card-title {
        font-size: clamp(0.88rem, 2.8vw, 1.05rem);
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}

@media (max-width: 480px) {
    .nav-menu .nav-text,
    .shop-brand-nav .nav-text {
        font-size: 0.9rem;
    }

    .shop-brand-logo-wrap .brand-logo-img,
    .shop-brand-logo-wrap img {
        height: 52px !important;
        max-width: 180px !important;
    }

    .header-cart-link {
        width: 34px;
        height: 34px;
    }
}