/*
Theme Name: Tritex Theme
Theme URI: https://tritexmembrane.id/
Author: Web Developer
Author URI: https://tritexmembrane.id/
Description: Tema kustom premium dengan Tailwind CSS. Kombinasi warna Biru Langit, Abu-abu Slate, dan Hitam.
Version: 1.0.1
Text Domain: tritex-theme
*/

/* STREAMING_CHUNK:Configuring global HTML and Body resets... */
html {
scroll-behavior: smooth;
}

body {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}

/* STREAMING_CHUNK:Customizing scrollbar to match theme colors... */
::-webkit-scrollbar {
width: 10px;
}
::-webkit-scrollbar-track {
background: #0f172a;
}
::-webkit-scrollbar-thumb {
background: #334155;
border-radius: 5px;
}
::-webkit-scrollbar-thumb:hover {
background: #0ea5e9;
}

::selection {
background: #0ea5e9;
color: #ffffff;
}

/* STREAMING_CHUNK:Styling specific components (Hero, Header, Marquee, Swiper)... /
/ Wajib: Fallback warna background gelap agar teks putih tetap terlihat meski gambar gagal dimuat */
.hero-bg {
background-color: #0f172a;
background-image: linear-gradient(135deg, rgba(2, 6, 23, 0.92) 0%, rgba(30, 41, 59, 0.8) 100%), url('https://images.unsplash.com/photo-1541882672323-95b86ea61439?q=80&w=2000&auto=format&fit=crop');
background-size: cover;
background-position: center;
background-attachment: fixed;
}

.header-scrolled {
background-color: rgba(15, 23, 42, 0.95) !important;
backdrop-filter: blur(16px);
-webkit-backdrop-filter: blur(16px);
border-bottom: 1px solid rgba(14, 165, 233, 0.15) !important;
box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.5);
}

.swiper-pagination-bullet {
background: #94a3b8;
opacity: 0.5;
}
.swiper-pagination-bullet-active {
background: #0ea5e9;
width: 24px;
border-radius: 4px;
opacity: 1;
}

.marquee-container {
display: flex;
overflow-x: hidden;
width: 100%;
}
.marquee-content {
display: flex;
animation: marquee 25s linear infinite;
}
.marquee-content:hover {
animation-play-state: paused;
}
@keyframes marquee {
0% { transform: translateX(0); }
100% { transform: translateX(-50%); }
}

.img-zoom-container {
overflow: hidden;
}
.img-zoom-container img {
transition: transform 0.7s ease;
}
.img-zoom-container:hover img {
transform: scale(1.08);
}

/* Fix mobile scaling issues */
@media (max-width: 380px) {
h1 { font-size: 2.25rem !important; line-height: 2.5rem !important; }
}