/* ═══════════════════════════════════════════════════
   JUT KRAFT — Swiss Brutalism x Jewel Luxury
   ═══════════════════════════════════════════════════ */

:root {
    --bg: #0A0A0A;
    --s1: #111111;
    --s2: #1A1A1A;
    --gold: #C8A84B;
    --gold-h: #E6C669;
    --gold-d: #8A6F28;
    --tx: #F5F5F5;
    --tx2: #A3A3A3;
    --cream: #F5F0E8;
    --white: #FFFFFF;
    --brd: rgba(200,168,75,0.15);
    --brd-s: rgba(200,168,75,0.4);
    --err: #FF3B30;
    --ok: #34C759;
    --hf: 'DM Sans','Manrope',-apple-system,sans-serif;
    --bf: 'Manrope',-apple-system,sans-serif;
    --ease: 150ms ease-out;
}

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--bf);background:var(--bg);color:var(--tx2);line-height:1.6;-webkit-font-smoothing:antialiased}
a{text-decoration:none;color:inherit;transition:color var(--ease)}
img{max-width:100%;height:auto;display:block}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}

.container{max-width:1280px;margin:0 auto;padding:0 2rem}

/* ─── Utility ─── */
.gold{color:var(--gold)}
.dark{color:var(--s2)!important}

/* ─── Buttons ─── */
.btn{
    display:inline-flex;align-items:center;justify-content:center;gap:0.5rem;
    padding:0.875rem 1.75rem;font-size:0.75rem;font-weight:800;
    border:none;cursor:pointer;transition:all var(--ease);
    text-transform:uppercase;letter-spacing:0.12em;white-space:nowrap;
    flex-shrink:0;min-height:48px;font-family:var(--bf);
}
.btn-primary{background:var(--gold);color:var(--bg)}
.btn-primary:hover{background:var(--gold-h);transform:translateY(-1px)}
.btn-ghost{background:transparent;color:var(--tx2);border:1px solid var(--brd)}
.btn-ghost:hover{color:var(--gold);border-color:var(--brd-s)}
.btn-outline{background:transparent;color:var(--tx);border:1px solid var(--brd)}
.btn-outline:hover{border-color:var(--gold);color:var(--gold)}
.btn-lg{padding:1rem 2rem;font-size:0.8rem}
.navbar .nav-right .btn{padding:0.625rem 1rem;font-size:0.65rem;min-height:36px}

.btn-quote{display:none}
@media(min-width:1024px){.btn-quote{display:inline-flex}}

/* ─── Navbar ─── */
.navbar{
    position:fixed;top:0;left:0;right:0;z-index:1000;
    background:rgba(10,10,10,0.92);backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
    border-bottom:1px solid var(--brd);transition:background var(--ease);
}
.navbar.scrolled{background:rgba(10,10,10,0.98)}
.navbar .container{display:flex;align-items:center;justify-content:space-between;height:72px;gap:1rem}

.logo{display:flex;align-items:center;gap:0.625rem;flex-shrink:0;white-space:nowrap}
.logo img{height:40px;width:auto;max-width:100%;display:block}
.logo-icon{
    width:36px;height:36px;display:flex;align-items:center;justify-content:center;
    border:2px solid var(--gold);font-size:0.65rem;font-weight:900;
    letter-spacing:0.05em;color:var(--gold);background:transparent;
}
.logo-text{font-family:var(--hf);font-size:1.125rem;font-weight:800;letter-spacing:0.1em;color:var(--tx)}

.nav-links-desktop{display:flex;gap:0}
.nav-links-desktop a{
    padding:0.5rem 0.55rem;font-size:0.6rem;font-weight:700;
    text-transform:uppercase;letter-spacing:0.1em;color:var(--tx2);white-space:nowrap;
}
.nav-links-desktop a:hover,.nav-links-desktop a.active{color:var(--gold)}

.nav-right{display:flex;align-items:center;gap:0.375rem;flex-shrink:0;flex-wrap:nowrap}
.lang-switch{
    display:flex;align-items:center;gap:0.375rem;padding:0.4rem 0.6rem;
    border:1px solid var(--brd);font-size:0.65rem;font-weight:700;
    color:var(--tx2);flex-shrink:0;letter-spacing:0.08em;
}
.lang-switch:hover{border-color:var(--brd-s);color:var(--tx)}
.mobile-menu-btn{display:none;background:none;border:none;color:var(--tx);font-size:1.25rem;cursor:pointer}

/* ─── Mobile Menu (sits OUTSIDE nav, avoids backdrop-filter stacking) ─── */
.mobile-menu{
    display:none;
    position:fixed;top:72px;left:0;right:0;bottom:0;
    background:var(--bg);z-index:999;overflow-y:auto;
}
.mobile-menu.active{display:flex;flex-direction:column}
.mobile-menu a{
    display:block;padding:1.125rem 1.5rem;font-size:0.95rem;
    border-bottom:1px solid var(--brd);color:var(--tx);font-weight:600;
    letter-spacing:0.05em;transition:all var(--ease);
}
.mobile-menu a:hover,.mobile-menu a.active{color:var(--gold);background:var(--s1)}
.mobile-menu .mobile-auth-btns{display:flex;flex-direction:column;gap:0.75rem;padding:1.5rem;border-top:2px solid var(--gold)}
.mobile-menu .mobile-auth-btns .btn{width:100%;justify-content:center;padding:1rem;font-size:0.85rem}

/* ═══════════════════════════════════════════
   HERO — Video Background
   ═══════════════════════════════════════════ */
.hero{
    min-height:100vh;display:flex;align-items:center;padding-top:72px;
    position:relative;overflow:hidden;background:var(--bg);
}
.hero-video{
    position:absolute;inset:0;width:100%;height:100%;
    object-fit:cover;object-position:center center;z-index:0;
}
.hero-overlay{
    position:absolute;inset:0;z-index:1;
    background:linear-gradient(105deg,rgba(10,10,10,0.88) 0%,rgba(10,10,10,0.55) 60%,rgba(10,10,10,0.3) 100%);
}
.hero .container{position:relative;z-index:2}
.hero-content{max-width:720px}
.hero-badge{
    display:inline-flex;align-items:center;gap:0.5rem;
    padding:0.5rem 1rem;border:1px solid var(--brd-s);margin-bottom:1.5rem;
}
.hero-badge .badge-dot{width:6px;height:6px;border-radius:50%;background:var(--ok)}
.hero-badge span{font-size:0.65rem;font-weight:700;letter-spacing:0.15em;text-transform:uppercase;color:var(--gold)}

.hero h1{
    font-family:var(--hf);font-size:clamp(3rem,6vw,5rem);
    font-weight:900;line-height:0.95;letter-spacing:-0.04em;
    color:var(--tx);margin-bottom:1.25rem;
}
.hero-subtitle{
    font-size:0.7rem;font-weight:700;letter-spacing:0.2em;text-transform:uppercase;
    color:var(--gold);margin-bottom:1rem;display:block;
}
.hero-desc{font-size:1.05rem;color:var(--tx2);line-height:1.7;margin-bottom:2rem;max-width:540px}
.hero-cta{display:flex;gap:0.75rem;flex-wrap:wrap;margin-bottom:3rem}

/* ─── Stats ─── */
.stats-grid{
    display:grid;grid-template-columns:repeat(4,1fr);
    border:1px solid var(--brd);border-collapse:collapse;
}
.stat-item{
    padding:1.5rem 1.25rem;text-align:center;
    border-right:1px solid var(--brd);
}
.stat-item:last-child{border-right:none}
.stat-num{font-family:var(--hf);font-size:2.5rem;font-weight:900;color:var(--tx);line-height:1;letter-spacing:-0.03em}
.stat-label{font-size:0.6rem;font-weight:700;text-transform:uppercase;letter-spacing:0.15em;color:var(--tx2);margin-top:0.375rem}

/* ─── Trust Bar ─── */
.trust-bar{border-top:1px solid var(--brd);border-bottom:1px solid var(--brd);padding:1rem 0}
.trust-items{display:flex;align-items:center;justify-content:center;gap:2rem;flex-wrap:wrap}
.trust-item{font-size:0.7rem;font-weight:600;color:var(--tx2);display:flex;align-items:center;gap:0.375rem}
.trust-item i{color:var(--gold);font-size:0.75rem}
.trust-divider{width:1px;height:16px;background:var(--brd)}

/* ─── Sections ─── */
.section{padding:5rem 0}
.section-dark{background:var(--bg)}
.section-alt{background:var(--s1)}
.section-light{background:var(--cream);color:var(--s2)}
.section-light .section-title{color:var(--s2)}
.section-light .section-desc{color:#555}
.section-light .feature-title{color:var(--s2)}
.section-light .feature-desc{color:#555}
.section-light .feature-num{color:var(--gold-d)}
.section-light .feature-item{border-bottom-color:rgba(0,0,0,0.08)}
.section-light .feature-item:hover{background:rgba(0,0,0,0.03)}
.section-steel{background:var(--s1)}
.section-label{
    font-size:0.6rem;font-weight:800;letter-spacing:0.2em;text-transform:uppercase;
    color:var(--gold);margin-bottom:0.75rem;
}
.section-title{
    font-family:var(--hf);font-size:clamp(1.75rem,4vw,2.75rem);
    font-weight:900;line-height:1.1;letter-spacing:-0.03em;
    color:var(--tx);margin-bottom:1rem;
}
.section-desc{font-size:1rem;color:var(--tx2);max-width:600px;line-height:1.7;margin-bottom:2.5rem}

/* ─── Feature Grid ─── */
.features-grid,.features-list{display:flex;flex-direction:column;border:1px solid var(--brd)}
.feature-item{
    display:grid;grid-template-columns:60px 1fr;gap:1.25rem;
    padding:1.25rem 1.5rem;border-bottom:1px solid var(--brd);
    transition:background var(--ease);
}
.feature-item:last-child{border-bottom:none}
.feature-item:hover{background:var(--s1)}
.feature-num{font-family:var(--hf);font-size:2rem;font-weight:900;color:var(--gold);line-height:1}
.feature-title{font-family:var(--hf);font-size:1rem;font-weight:800;color:var(--tx);margin-bottom:0.25rem}
.feature-desc{font-size:0.85rem;color:var(--tx2);line-height:1.6}

/* ─── Product Cards ─── */
.products-stack{display:flex;flex-direction:column;gap:0}
.product-card{
    display:block;padding:1.75rem 2rem;
    background:var(--s1);border:1px solid var(--brd);
    transition:all var(--ease);position:relative;
    margin-bottom:-1px;
}
.product-card:hover{background:var(--s2);border-color:var(--brd-s);z-index:1}
.product-card h3{font-family:var(--hf);font-size:1.125rem;font-weight:800;color:var(--tx);margin-bottom:0.375rem;padding-right:2rem}
.product-card p{font-size:0.85rem;color:var(--tx2);line-height:1.5;margin-bottom:0.5rem}
.product-num{font-size:0.55rem;font-weight:800;letter-spacing:0.15em;text-transform:uppercase;color:var(--gold);display:block;margin-bottom:0.5rem}
.product-subtitle{font-size:0.7rem;color:var(--tx2);font-style:italic}
.product-tags{display:flex;gap:0.5rem;flex-wrap:wrap}
.product-tag{font-size:0.6rem;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:var(--gold);padding:0.25rem 0.625rem;border:1px solid var(--brd)}
.product-arrow{position:absolute;top:1.75rem;right:1.75rem;color:var(--gold);font-size:1.25rem;transition:transform var(--ease)}
.product-card:hover .product-arrow{transform:translateX(4px)}

/* ─── Sectors ─── */
.sectors-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--brd)}
.sector-card{
    padding:2rem 1.5rem;border-right:1px solid var(--brd);
    transition:all var(--ease);position:relative;
}
.sector-card:last-child{border-right:none}
.sector-card:hover{background:var(--s1)}
.sector-icon{font-size:1.5rem;color:var(--gold);margin-bottom:1rem;display:block}
.sector-card h3{font-family:var(--hf);font-size:0.95rem;font-weight:800;color:var(--tx);margin-bottom:0.375rem}
.sector-card p{font-size:0.8rem;color:var(--tx2);line-height:1.5}
.sector-subtitle{font-size:0.65rem;color:var(--tx2);font-style:italic;display:block;margin-bottom:0.25rem}

/* ─── Export ─── */
.export-grid{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--brd)}
.export-card{
    padding:2rem;border-right:1px solid var(--brd);border-bottom:1px solid var(--brd);
    transition:all var(--ease);
}
.export-card:nth-child(2n){border-right:none}
.export-card:nth-last-child(-n+2){border-bottom:none}
.export-card:hover{background:var(--s1)}
.export-icon{font-size:1.5rem;color:var(--gold);margin-bottom:1rem;display:block}
.export-card h3{font-family:var(--hf);font-size:0.95rem;font-weight:800;color:var(--tx);margin-bottom:0.375rem}
.export-card p{font-size:0.8rem;color:var(--tx2);line-height:1.5}
.export-tag{font-size:0.55rem;font-weight:800;letter-spacing:0.1em;text-transform:uppercase;color:var(--gold);margin-top:0.5rem;display:inline-block}

/* ─── CTA Bar ─── */
.cta-bar{
    display:flex;align-items:center;justify-content:space-between;
    padding:2rem 2.5rem;border:1px solid var(--brd-s);
    background:var(--s1);gap:2rem;margin-top:2rem;
}
.cta-bar h3{font-family:var(--hf);font-size:1.5rem;font-weight:900;color:var(--tx);letter-spacing:-0.02em}
.cta-bar p{font-size:0.85rem;color:var(--tx2);margin-top:0.25rem}

/* ─── About Stats ─── */
.about-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--brd)}
.about-stat{padding:1.5rem;text-align:center;border-right:1px solid var(--brd)}
.about-stat:last-child{border-right:none}
.about-stat-num{font-family:var(--hf);font-size:2.25rem;font-weight:900;color:var(--tx);line-height:1}
.section-light .about-stat-num{color:var(--s2)}
.about-stat-label{font-size:0.6rem;font-weight:700;text-transform:uppercase;letter-spacing:0.12em;color:var(--tx2);margin-top:0.375rem}
.section-light .about-stat{border-right-color:rgba(0,0,0,0.08)}
.section-light .about-stats{border-color:rgba(0,0,0,0.08)}
.about-stat-desc{font-size:0.75rem;color:var(--tx2);margin-top:0.25rem}

/* ─── Location ─── */
.location-item{
    display:grid;grid-template-columns:auto 1fr;gap:1rem;
    padding:1rem 0;border-bottom:1px solid var(--brd);
}
.section-light .location-item{border-bottom-color:rgba(0,0,0,0.08)}
.location-item:last-child{border-bottom:none}
.location-label{font-size:0.55rem;font-weight:800;letter-spacing:0.12em;text-transform:uppercase;color:var(--gold-d);padding-top:0.15rem}
.location-icon{color:var(--gold);font-size:1rem;display:flex;align-items:flex-start;justify-content:center;padding-top:0.25rem}
.location-title{font-size:0.85rem;font-weight:700;color:var(--tx)}
.section-light .location-title{color:var(--s2)}
.location-desc{font-size:0.8rem;color:var(--tx2);margin-top:0.125rem}

/* ─── Forms ─── */
.form-group{margin-bottom:1.25rem}
.form-label{display:block;font-size:0.6rem;font-weight:800;letter-spacing:0.15em;text-transform:uppercase;color:var(--tx2);margin-bottom:0.5rem}
.form-input,.form-textarea,.form-select{
    width:100%;padding:0.75rem 0;
    background:transparent;border:none;border-bottom:1px solid rgba(163,163,163,0.3);
    color:var(--tx);font-family:var(--bf);font-size:0.95rem;
    transition:border-color var(--ease);min-height:44px;
}
.form-input:focus,.form-textarea:focus,.form-select:focus{outline:none;border-bottom-color:var(--gold)}
.form-input::placeholder,.form-textarea::placeholder{color:rgba(163,163,163,0.5)}
.form-textarea{resize:vertical;min-height:100px}
.form-select{cursor:pointer;-webkit-appearance:none;appearance:none}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
.form-error{font-size:0.75rem;color:var(--err);margin-top:0.25rem}

/* ─── Cards ─── */
.card{background:var(--s1);border:1px solid var(--brd);padding:2rem;transition:border-color var(--ease)}
.card:hover{border-color:var(--brd-s)}

/* ─── FAQ ─── */
.faq-list{display:flex;flex-direction:column;gap:0}
.faq-item{background:var(--s1);border:1px solid var(--brd);margin-bottom:-1px}
.faq-question{
    width:100%;padding:1rem 1.5rem;display:flex;justify-content:space-between;align-items:center;
    cursor:pointer;color:var(--tx);background:var(--s1);font-weight:700;font-size:0.9rem;
    transition:all var(--ease);min-height:52px;gap:1rem;
    text-align:left;font-family:var(--bf);border:none;
}
.faq-question:hover{background:var(--s2);color:var(--tx)}
.faq-item.active .faq-question{background:var(--s2);color:var(--gold)}
.faq-question i{color:var(--gold);transition:transform var(--ease);flex-shrink:0}
.faq-item.active .faq-question i{transform:rotate(180deg)}
.faq-answer{max-height:0;overflow:hidden;transition:max-height 300ms ease}
.faq-item.active .faq-answer{max-height:500px}
.faq-answer-inner{padding:0 1.5rem 1.25rem;font-size:0.85rem;color:var(--tx2);line-height:1.7}
/* PHP dosyasında faq-answer-inner div'i yoksa direkt faq-answer içine padding ver */
.faq-answer>p,.faq-answer>span,.faq-answer>div:not(.faq-answer-inner){padding:0 1.5rem 1.25rem;font-size:0.85rem;color:var(--tx2);line-height:1.7;display:block}

/* ─── Gallery ─── */
.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px}
.gallery-item{
    position:relative;aspect-ratio:1;overflow:hidden;
    background:var(--s1);border:1px solid var(--brd);cursor:pointer;
}
.gallery-item img{width:100%;height:100%;object-fit:cover;transition:transform 400ms ease}
.gallery-item:hover img{transform:scale(1.05)}
.gallery-overlay{
    position:absolute;inset:0;display:flex;align-items:flex-end;
    padding:1rem;background:linear-gradient(0deg,rgba(10,10,10,0.8) 0%,transparent 50%);
    opacity:0;transition:opacity var(--ease);
}
.gallery-item:hover .gallery-overlay{opacity:1}
.gallery-overlay h4{font-family:var(--hf);font-size:0.85rem;font-weight:800;color:var(--tx)}

/* ─── Contact ─── */
.contact-card{
    display:flex;gap:1rem;padding:1.25rem;
    background:var(--s1);border:1px solid var(--brd);
    transition:border-color var(--ease);
}
.contact-card:hover{border-color:var(--brd-s)}
.contact-icon{color:var(--gold);font-size:1rem;flex-shrink:0;padding-top:0.125rem}
.contact-title{font-size:0.85rem;font-weight:700;color:var(--tx)}
.contact-desc{font-size:0.8rem;color:var(--tx2)}
.contact-link{font-size:0.8rem;color:var(--gold);font-weight:600}
.contact-link:hover{color:var(--gold-h)}

/* ─── Footer ─── */
.footer{background:var(--s1);border-top:1px solid var(--brd);padding:4rem 0 2rem}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:3rem;align-items:start}
.footer-brand{display:flex;flex-direction:column;align-items:flex-start;gap:0}
.footer-brand .logo{display:flex;align-items:center;gap:0.625rem;margin-bottom:1rem;flex-shrink:0}
.footer-brand .logo img{height:40px!important;width:auto!important;max-width:180px;display:block!important}
.footer-brand>p{font-size:0.8rem;color:var(--tx2);line-height:1.7;margin-bottom:1rem;width:100%}
.footer-brand .social-links{display:flex;gap:0.75rem}
.footer-brand p{font-size:0.8rem;color:var(--tx2);line-height:1.7;margin-bottom:1rem}
.social-links{display:flex;gap:0.75rem}
.social-links a{
    width:36px;height:36px;display:flex;align-items:center;justify-content:center;
    border:1px solid var(--brd);color:var(--tx2);font-size:0.85rem;transition:all var(--ease);
}
.social-links a:hover{border-color:var(--gold);color:var(--gold)}
.footer-menu h4,.footer-contact h4{font-family:var(--hf);font-size:0.65rem;font-weight:800;letter-spacing:0.2em;text-transform:uppercase;color:var(--gold);margin-bottom:1.25rem}
.footer-menu ul{list-style:none}
.footer-menu ul li a{display:block;font-size:0.8rem;color:var(--tx2);padding:0.25rem 0;transition:color var(--ease)}
.footer-menu ul li a:hover{color:var(--gold)}
.footer-contact .contact-item{display:flex;gap:0.75rem;margin-bottom:0.75rem;font-size:0.8rem;color:var(--tx2)}
.footer-contact .contact-item i{color:var(--gold);width:16px;flex-shrink:0;padding-top:0.15rem}
.footer-contact .contact-item a{color:var(--tx2);display:block;transition:color var(--ease)}
.footer-contact .contact-item a:hover{color:var(--gold)}
.footer-title{font-family:var(--hf);font-size:0.65rem;font-weight:800;letter-spacing:0.2em;text-transform:uppercase;color:var(--gold);margin-bottom:1.25rem}
.footer-text{font-size:0.8rem;color:var(--tx2);line-height:1.7}
.footer-link{display:block;font-size:0.8rem;color:var(--tx2);padding:0.25rem 0;transition:color var(--ease)}
.footer-link:hover{color:var(--gold)}
.footer-bottom{
    display:flex;justify-content:space-between;align-items:center;
    margin-top:3rem;padding-top:1.5rem;border-top:1px solid var(--brd);
}
.footer-bottom p{font-size:0.75rem;color:var(--tx2)}
.footer-links{display:flex;gap:1.5rem}
.footer-links a{font-size:0.75rem;color:var(--tx2)}
.footer-links a:hover{color:var(--gold)}

/* ─── WhatsApp ─── */
.whatsapp-widget{
    position:fixed;bottom:2rem;right:2rem;z-index:998;
    width:56px;height:56px;display:flex;align-items:center;justify-content:center;
    background:#25D366;color:var(--white);font-size:1.75rem;
    border:2px solid rgba(255,255,255,0.2);border-radius:50%;
    transition:transform var(--ease);
}
.whatsapp-widget:hover{transform:translateY(-3px)}

/* ─── Cookie Consent ─── */
.cookie-consent{
    position:fixed;bottom:0;left:0;right:0;z-index:9998;
    background:var(--s1);border-top:1px solid var(--brd);
    padding:1.25rem 2rem;display:none;
}
.cookie-consent.show{display:block}
.cookie-content{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;max-width:1280px;margin:0 auto}
.cookie-icon{font-size:1.5rem;color:var(--gold);flex-shrink:0}
.cookie-text{flex:1}
.cookie-text h4{font-size:0.85rem;font-weight:700;color:var(--tx);margin-bottom:0.125rem}
.cookie-text p{font-size:0.75rem;color:var(--tx2)}
.cookie-text a{color:var(--gold);text-decoration:underline}
.cookie-buttons{display:flex;gap:0.5rem;flex-shrink:0}

/* ─── Page Header ─── */
.page-header{padding-top:112px;padding-bottom:1rem}
.page-header .section-title{margin-bottom:0.5rem}

/* ─── Table ─── */
table{width:100%;border-collapse:collapse}
th,td{padding:0.75rem 1rem;text-align:left;border-bottom:1px solid var(--brd)}
th{font-size:0.6rem;font-weight:800;letter-spacing:0.15em;text-transform:uppercase;color:var(--tx2)}
td{font-size:0.85rem;color:var(--tx)}
tr:hover td{background:var(--s2)}

/* ─── Badges ─── */
.badge{display:inline-block;padding:0.25rem 0.625rem;font-size:0.6rem;font-weight:800;letter-spacing:0.1em;text-transform:uppercase}
.badge-pending{background:rgba(234,179,8,0.15);color:#eab308}
.badge-approved{background:rgba(34,197,94,0.15);color:var(--ok)}
.badge-rejected{background:rgba(255,59,48,0.15);color:var(--err)}
.badge-converted{background:rgba(59,130,246,0.15);color:#3b82f6}
.badge-confirmed{background:rgba(59,130,246,0.15);color:#3b82f6}
.badge-production{background:rgba(234,179,8,0.15);color:#eab308}
.badge-shipped{background:rgba(168,85,247,0.15);color:#a855f7}
.badge-delivered{background:rgba(34,197,94,0.15);color:var(--ok)}
.badge-cancelled{background:rgba(255,59,48,0.15);color:var(--err)}
.badge-active{background:rgba(34,197,94,0.15);color:var(--ok)}
.badge-inactive{background:rgba(255,59,48,0.15);color:var(--err)}
.badge-admin{background:rgba(200,168,75,0.15);color:var(--gold)}
.badge-customer{background:rgba(163,163,163,0.15);color:var(--tx2)}
.badge-new{background:rgba(234,179,8,0.15);color:#eab308}
.badge-read{background:rgba(59,130,246,0.15);color:#3b82f6}
.badge-replied{background:rgba(34,197,94,0.15);color:var(--ok)}

/* ─── Alerts ─── */
.alert{padding:0.875rem 1.25rem;font-size:0.85rem;font-weight:600;border-left:3px solid var(--gold);margin-bottom:1.5rem;background:var(--s1)}
.alert-success{border-left-color:var(--ok);color:var(--ok)}
.alert-error{border-left-color:var(--err);color:var(--err)}

/* ─── Switch ─── */
.switch{position:relative;display:inline-block;width:44px;height:24px}
.switch input{opacity:0;width:0;height:0}
.switch-slider{position:absolute;cursor:pointer;inset:0;background:var(--s2);border:1px solid var(--brd);transition:var(--ease)}
.switch-slider::before{content:'';position:absolute;height:16px;width:16px;left:3px;bottom:3px;background:var(--tx2);transition:var(--ease)}
.switch input:checked+.switch-slider{background:var(--gold);border-color:var(--gold)}
.switch input:checked+.switch-slider::before{transform:translateX(20px);background:var(--bg)}

/* ═══════════════════════════════════════════
   MOBILE BOTTOM NAV
   ═══════════════════════════════════════════ */
.mobile-bottom-nav{display:none}

@media(max-width:768px){
    .mobile-bottom-nav{
        display:flex;position:fixed;bottom:0;left:0;right:0;height:56px;
        background:rgba(17,17,17,0.96);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
        border-top:1px solid var(--brd);z-index:9999;
        justify-content:space-around;align-items:center;
        padding-bottom:env(safe-area-inset-bottom,0);
    }
    .mobile-bottom-nav a{
        display:flex;flex-direction:column;align-items:center;gap:2px;
        color:var(--tx2);font-size:0.5rem;font-weight:800;
        text-transform:uppercase;letter-spacing:0.06em;
        padding:4px 10px;min-width:52px;min-height:44px;justify-content:center;
        transition:color 150ms;-webkit-tap-highlight-color:transparent;
    }
    .mobile-bottom-nav a i{font-size:1.1rem}
    .mobile-bottom-nav a.active,.mobile-bottom-nav a:active{color:var(--gold)}
    .mobile-bottom-nav a.whatsapp-nav{color:#25D366}
    body{padding-bottom:56px}
    .whatsapp-widget{display:none!important}
}

/* ═══════════════════════════════════════════
   TABLET (max-width: 1024px)
   ═══════════════════════════════════════════ */
@media(max-width:1024px){
    .nav-links-desktop{display:none}
    .mobile-menu-btn{display:flex;align-items:center;justify-content:center;width:44px;height:44px;order:99}
    .nav-right .btn-ghost,.nav-right .btn-primary:not(.btn-quote),.nav-right .btn-quote{display:none}

    body.menu-open main,body.menu-open .footer,body.menu-open .mobile-bottom-nav,body.menu-open .cookie-consent{visibility:hidden}

    .footer-grid{grid-template-columns:1fr 1fr;gap:2rem}
    .export-grid{grid-template-columns:1fr}
    .sectors-grid{grid-template-columns:1fr 1fr}
    .section{padding:3.5rem 0}
}

/* ═══════════════════════════════════════════
   MOBILE (max-width: 768px)
   ═══════════════════════════════════════════ */
@media(max-width:768px){
    .container{padding:0 1rem}
    .navbar .container{height:56px}
    .logo-icon{width:30px;height:30px;font-size:0.6rem}
    .logo-text{font-size:0.95rem}

    /* Mobile menu top position matches navbar height */
    .mobile-menu{top:56px}

    /* ─── Hero Mobile — compact, video portrait center ─── */
    .hero{min-height:auto;padding-top:56px;padding-bottom:0}
    .hero-video{object-position:center center}
    .hero-overlay{background:linear-gradient(180deg,rgba(10,10,10,0.75) 0%,rgba(10,10,10,0.6) 50%,rgba(10,10,10,0.85) 100%)}
    .hero-content{padding:2rem 0 1.5rem}
    .hero h1{font-size:clamp(2rem,9vw,2.75rem);line-height:1.05;letter-spacing:-0.03em}
    .hero-subtitle{font-size:0.6rem;margin-bottom:0.5rem}
    .hero-desc{font-size:0.85rem;margin-bottom:1.25rem}
    .hero-badge{padding:0.3rem 0.65rem;margin-bottom:0.75rem}
    .hero-badge span{font-size:0.55rem}
    .hero-cta{gap:0.5rem;margin-bottom:1.25rem}
    .hero-cta .btn{padding:0.75rem 1.25rem;font-size:0.75rem}

    /* ─── Stats mobile — horizontal scroll ─── */
    .stats-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;gap:0;border:1px solid var(--brd)}
    .stats-grid::-webkit-scrollbar{display:none}
    .stat-item{flex:0 0 33.333%;scroll-snap-align:start;padding:0.75rem;border-right:1px solid var(--brd)}
    .stat-num{font-size:1.5rem}
    .stat-label{font-size:0.5rem}

    /* Trust bar */
    .trust-items{gap:0.5rem;overflow-x:auto;scrollbar-width:none;flex-wrap:nowrap;-webkit-overflow-scrolling:touch}
    .trust-items::-webkit-scrollbar{display:none}
    .trust-item{font-size:0.65rem;flex-shrink:0}
    .trust-divider{display:none}

    /* ─── Sections mobile ─── */
    .section{padding:2rem 0}
    .section-title{font-size:clamp(1.3rem,6vw,1.6rem)}
    .section-desc{font-size:0.85rem}
    .section-label{font-size:0.55rem;margin-bottom:0.375rem}
    .page-header{padding-top:68px;padding-bottom:0.25rem}
    .page-header .section-title{font-size:1.4rem}

    /* Feature items */
    .feature-item{grid-template-columns:1fr;gap:0.125rem;padding:0.5rem 0.75rem}
    .feature-num{font-size:1.25rem}
    .feature-title{font-size:0.9rem}

    /* Product horizontal scroll */
    .products-stack{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;gap:0;flex-direction:row}
    .products-stack::-webkit-scrollbar{display:none}
    .product-card{flex:0 0 82%;scroll-snap-align:start;padding:1rem;margin-bottom:0}
    .product-card h3{font-size:1rem;padding-right:1.5rem}

    /* Sectors horizontal scroll */
    .sectors-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;gap:0}
    .sectors-grid::-webkit-scrollbar{display:none}
    .sector-card{flex:0 0 72%;scroll-snap-align:start;padding:1.25rem;border-right:1px solid var(--brd)}

    .export-grid{grid-template-columns:1fr;gap:0}
    .export-card{padding:1.25rem}

    .cta-bar{flex-direction:column;text-align:center;padding:1.25rem;gap:1rem}
    .cta-bar h3{font-size:1.15rem}

    .about-stats{grid-template-columns:1fr 1fr;gap:0}
    .about-stat{padding:0.75rem}
    .about-stat-num{font-size:1.5rem}
    .location-item{grid-template-columns:1fr;gap:0.125rem;padding:0.5rem 0}

    .form-row{grid-template-columns:1fr;gap:0}
    .form-group{margin-bottom:0.875rem}
    .card{padding:1.25rem}

    .gallery-grid{grid-template-columns:1fr 1fr;gap:2px}
    .faq-question{padding:0.75rem 1rem;font-size:0.85rem;min-height:48px}
    .faq-answer-inner{padding:0 1rem 0.75rem;font-size:0.8rem}

    .contact-card{flex-direction:column;gap:0.5rem;padding:0.875rem}
    .contact-grid{grid-template-columns:1fr!important;gap:1.25rem!important}

    /* ─── INLINE GRID OVERRIDE — force single column on mobile ─── */
    [style*="grid-template-columns: 1fr 1fr"],
    [style*="grid-template-columns: 1fr 1.2fr"],
    [style*="grid-template-columns:1fr 1fr"],
    [style*="grid-template-columns: repeat(2"],
    [style*="grid-template-columns:repeat(2"]{grid-template-columns:1fr!important;gap:1.25rem!important}
    
    /* Stats grid on mobile - 2 columns with overflow fix */
    [style*="grid-template-columns: repeat(4"],
    [style*="grid-template-columns:repeat(4"],
    .stat-cards{grid-template-columns:1fr 1fr!important;gap:2px!important}
    .stat-cards > div{padding:1rem!important;overflow:hidden}
    .stat-cards > div > div:first-child{font-size:1.75rem!important}

    /* ─── Footer mobile — compact 2x2 grid ─── */
    .footer{padding:2rem 0 1rem}
    .footer-grid{grid-template-columns:1fr 1fr;gap:1.25rem}
    .footer-brand{grid-column:1 / -1}
    .footer-brand p{font-size:0.75rem}
    .footer-menu h4,.footer-contact h4{font-size:0.6rem;margin-bottom:0.75rem}
    .footer-menu ul li a{font-size:0.75rem;padding:0.15rem 0}
    .footer-contact .contact-item{font-size:0.75rem;margin-bottom:0.5rem}
    .footer-bottom{flex-direction:row;flex-wrap:wrap;justify-content:center;gap:0.5rem;margin-top:1rem;padding-top:0.75rem}
    .footer-bottom p{font-size:0.65rem;width:100%;text-align:center}
    .footer-links{flex-wrap:wrap;justify-content:center;gap:0.625rem}
    .footer-links a{font-size:0.65rem}

    /* ─── Cookie mobile ─── */
    .cookie-consent{bottom:56px}
    .cookie-content{flex-direction:row;align-items:center;gap:0.75rem;padding:0}
    .cookie-icon{display:none}
    .cookie-text h4{font-size:0.75rem}
    .cookie-text p{font-size:0.65rem}
    .cookie-buttons{display:flex;gap:0.375rem;flex-shrink:0}
    .cookie-buttons .btn{padding:0.5rem 0.75rem;font-size:0.6rem;min-height:36px}

    table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;white-space:nowrap}
    .alert{padding:0.625rem 0.875rem;font-size:0.8rem}
}

/* ═══════════════════════════════════════════
   SMALL MOBILE (max-width: 420px)
   ═══════════════════════════════════════════ */
@media(max-width:420px){
    .lang-switch span{display:none}
    .hero h1{font-size:1.75rem}
    .hero-content{padding:1.5rem 0 1rem}
    .stat-item{flex:0 0 50%;padding:0.625rem}
    .stat-num{font-size:1.3rem}
    .gallery-grid{grid-template-columns:1fr}
    .about-stats{grid-template-columns:1fr 1fr}
    .product-card{flex:0 0 88%}
    .sector-card{flex:0 0 82%}
    .section{padding:1.75rem 0}
    .section-title{font-size:1.2rem}
}

/* ═══════════════════════════════════════════
   ADMIN & PORTAL
   ═══════════════════════════════════════════ */
@media(max-width:1024px){
    .admin-layout{flex-direction:column}
    .admin-sidebar{width:100%!important;border-right:none!important;border-bottom:1px solid var(--brd);padding:0.375rem!important}
    .admin-sidebar h2{display:none}
    .admin-nav{display:flex!important;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;gap:0}
    .admin-nav::-webkit-scrollbar{display:none}
    .admin-nav a{padding:0.5rem 0.625rem!important;font-size:0.6rem!important;border-left:none!important;border-bottom:2px solid transparent;margin-bottom:0!important;flex-shrink:0;white-space:nowrap}
    .admin-nav a:hover,.admin-nav a.active{border-left:none!important;border-bottom:2px solid var(--gold)!important}
    .admin-content{padding:0.75rem!important}
    .admin-content h1{font-size:1.15rem!important}
}

@media(max-width:768px){
    .portal-tabs,.tab-list,.portal-nav{display:flex;overflow-x:auto;-webkit-overflow-scrolling:touch;gap:0.25rem;white-space:nowrap;scrollbar-width:none}
    .portal-tabs::-webkit-scrollbar,.tab-list::-webkit-scrollbar,.portal-nav::-webkit-scrollbar{display:none}
    .portal-tabs a,.tab-list a,.portal-nav a{flex-shrink:0}
}