html,body{overflow-x:hidden;max-width:100%}
.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}
.scrollbar-hide::-webkit-scrollbar{display:none}
@media(max-width:767px){#modal-img{height:260px}#modal-img img{max-height:220px;padding:16px}}

.hero-gradient{background:linear-gradient(135deg,#0B3D91 0%,#1565C0 50%,#0d47a1 100%);position:relative;overflow:hidden}
.hero-bg-img{position:absolute;inset:-20% 0 -20% 0;z-index:0;background-image:url('../images/hero-index.jpg');background-size:cover;background-position:70% center;opacity:.38;will-change:transform}
.hero-gradient::before{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(110deg,rgba(11,61,145,.97) 0%,rgba(11,61,145,.88) 40%,rgba(11,61,145,.2) 100%)}
.hero-gradient>*:not(.hero-bg-img){position:relative;z-index:2}
.page-hero-bg{background-image:url('../images/hero-branslar.jpg')}

.card-hover{transition:transform .3s,box-shadow .3s}
.card-hover:hover{transform:translateY(-6px);box-shadow:0 20px 40px rgba(11,61,145,.15)}
.nav-link{position:relative}
.nav-link::after{content:'';position:absolute;bottom:-2px;left:0;width:0;height:2px;background:#E53935;transition:width .3s}
.nav-link:hover::after{width:100%}
.fade-up{opacity:0;transform:translateY(30px);transition:opacity .6s,transform .6s}
.fade-up.visible{opacity:1;transform:translateY(0)}
.stat-grad{background:linear-gradient(135deg,#0B3D91,#1565C0);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.brand-card{border:2px solid transparent;transition:border-color .3s,box-shadow .3s,transform .3s}
.brand-card:hover{border-color:#1565C0;box-shadow:0 12px 40px rgba(11,61,145,.15);transform:translateY(-4px)}
.mobile-menu{max-height:0;overflow:hidden;transition:max-height .4s}
.mobile-menu.open{max-height:300px}
.lang-btn.active{color:#0B3D91;font-weight:700}
.pulse{animation:pulse-r 2s ease infinite}
@keyframes pulse-r{0%{box-shadow:0 0 0 0 rgba(229,57,53,.4)}70%{box-shadow:0 0 0 14px rgba(229,57,53,0)}100%{box-shadow:0 0 0 0 rgba(229,57,53,0)}}
.ecg-path{stroke-dasharray:1200;stroke-dashoffset:1200;animation:draw 4s ease forwards 1s}
@keyframes draw{to{stroke-dashoffset:0}}

.prod-card{transition:transform .25s,box-shadow .25s;cursor:pointer}
.prod-card:hover{transform:translateY(-5px);box-shadow:0 16px 40px rgba(11,61,145,.14)}
.prod-img{background:#f8faff;display:flex;align-items:center;justify-content:center;height:180px;overflow:hidden}
.prod-img img{max-height:160px;max-width:100%;object-fit:contain;padding:12px}

#modal{position:fixed;inset:0;z-index:999;display:none;align-items:center;justify-content:center;padding:16px}
#modal.open{display:flex}
#modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.65);backdrop-filter:blur(4px)}
#modal-box{position:relative;z-index:1;background:#fff;border-radius:24px;max-width:560px;width:100%;box-shadow:0 32px 80px rgba(0,0,0,.3)}
#modal-img{background:#f0f6ff;height:380px;display:flex;align-items:center;justify-content:center;border-radius:24px 24px 0 0;overflow:hidden}
#modal-img img{max-height:340px;max-width:100%;object-fit:contain;padding:24px}

input,textarea{transition:border-color .3s,box-shadow .3s}
input:focus,textarea:focus{outline:none;border-color:#1565C0;box-shadow:0 0 0 3px rgba(21,101,192,.1)}
.spin{animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

#navbar{background:transparent!important;box-shadow:none!important}
#navbar.scrolled .nav-logo-panel,#navbar.scrolled .nav-bar-strip{box-shadow:0 4px 22px rgba(11,61,145,.12)}
.nav-logo-panel{background:#fff;border-radius:1.25rem 0 1.25rem 1.25rem;box-shadow:0 2px 14px rgba(11,61,145,.08);padding:.625rem 1rem 1rem;margin-bottom:-1.25rem;z-index:2}
.nav-bar-strip{background:#fff;border-radius:0 1.25rem 1.25rem 1.25rem;box-shadow:0 2px 14px rgba(11,61,145,.08);z-index:1}
@media(min-width:768px){.nav-logo-panel{padding:.75rem 1.25rem 1.35rem;margin-bottom:-1.75rem;border-radius:1.5rem 0 1.5rem 1.5rem}.nav-bar-strip{border-radius:0 1.5rem 1.5rem 1.5rem}}
@media(max-width:767px){.nav-logo-panel{margin-bottom:-1rem;padding:.5rem .75rem .875rem}.site-logo{height:3rem!important;max-width:12.5rem!important}}
.site-logo{display:block;height:3.5rem;width:auto;max-width:16rem;object-fit:contain}
@media(min-width:768px){.site-logo{height:4.5rem;max-width:21rem}}

html.dark body{background:#0f172a;color:#e2e8f0}
html.dark .nav-logo-panel{background:#fff!important}
html.dark .nav-bar-strip{background:rgba(15,23,42,.97)!important}
html.dark #navbar.scrolled .nav-bar-strip{box-shadow:0 2px 20px rgba(0,0,0,.4)}
html.dark .mobile-menu{background:#0f172a}
html.dark .bg-white{background:#1e293b!important}
html.dark .bg-surface{background:#0f172a!important}
html.dark .text-gray-900{color:#f1f5f9!important}
html.dark .text-gray-800{color:#e2e8f0!important}
html.dark .text-gray-700{color:#cbd5e1!important}
html.dark .text-gray-600{color:#94a3b8!important}
html.dark .text-gray-500{color:#64748b!important}
html.dark .border-gray-100,.dark .border-blue-100{border-color:#334155!important}
html.dark .shadow-sm{box-shadow:0 1px 6px rgba(0,0,0,.5)!important}
html.dark .card-hover:hover{box-shadow:0 20px 40px rgba(0,0,0,.5)!important}
html.dark .brand-card{border-color:transparent}
html.dark #modal-box{background:#1e293b!important}
html.dark .spec-table td{color:#cbd5e1!important;border-bottom:1px solid #334155!important}
html.dark .spec-table tr:nth-child(even) td{background:#0f172a!important}
html.dark input,html.dark textarea,html.dark select{background:#1e293b!important;color:#e2e8f0!important;border-color:#334155!important}
html.dark .hover\:bg-gray-100:hover{background:#334155!important}
html.dark .hover\:bg-surface:hover{background:#1e293b!important}
.sun-icon{display:none}
.moon-icon{display:block}
html.dark .sun-icon{display:block!important}
html.dark .moon-icon{display:none!important}
