/* ═══════════════ GLOBAL RESET & FONTS ═══════════════ */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;0,800;0,900;1,400;1,500;1,600;1,700&display=swap');

.T * { box-sizing: border-box; }
.T { font-family: 'Playfair Display', serif; background: #fff; color: #1e293b; margin: 0; padding: 0; text-align: left; line-height: 1.5; }
.T a { text-decoration: none; }
.T h1, .T h2, .T h3, .T h4, .T .num, .T .BTN { font-family: 'Playfair Display', serif !important; }
.CX { max-width: 1200px; margin: 0 auto; padding: 0 20px; }

/* Hide global floating widgets on homepage */
.floating-actions, .box-phone, .btn-hotline { display: none !important; }
.hotline-phone-ring-wrap, .vr-button, #button-contact-vr { display: none !important; }

/* ═══════════════ HERO SECTION ═══════════════ */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&family=Inter:wght@300;400;500;600&display=swap');

.HERO {
    background: #ffffff;
    color: #0F172A;
    padding: 100px 0 120px;
    position: relative;
    overflow: hidden;
    font-family: 'Inter', sans-serif;
}

.HERO .CX { display: grid; grid-template-columns: 1.05fr 0.95fr; gap: 80px; align-items: center; position: relative; z-index: 2; }
.HERO .HL { padding-left: 20px; position: relative; }

/* Thin decorative line */
.HERO .HL::before {
    content: ''; position: absolute; top: 10px; bottom: 10px; left: -10px;
    width: 1px; background: #E2E8F0;
}

/* Logos & Certs */
.H-LOGOS {
    display: flex; align-items: center; gap: 16px; margin-bottom: 30px;
    border-bottom: 1px solid #F1F5F9; padding-bottom: 20px;
}
.H-LOGOS .SINCE {
    font-family: 'Playfair Display', serif; font-style: italic; font-weight: 600; font-size: 20px; color: #94A3B8;
}
.H-LOGOS .LOGO-BOX {
    font-weight: 500; font-size: 11px; letter-spacing: 1px; padding: 0 10px; color: #475569;
    position: relative; border-right: 1px solid #E2E8F0; border-top: none; border-bottom: none; border-left: none; border-radius: 0;
}
.H-LOGOS .LOGO-BOX:last-child { border-right: none; }

.HERO h2 {
    font-family: 'Inter', sans-serif !important;
    color: #C9A84C; font-size: 13px; font-weight: 600; margin-bottom: 16px; text-transform: uppercase; letter-spacing: 4px;
}
.HERO h1 {
    font-family: 'Playfair Display', serif !important;
    font-size: 68px; font-weight: 500; line-height: 1.1; margin-bottom: 35px; text-transform: none;
    color: #0F172A; letter-spacing: -1px;
}
.HERO h1 span { font-style: italic; color: #C9A84C; font-weight: 400; }

.H-DESC-BOX {
    font-family: 'Playfair Display', serif; font-style: italic; background: transparent; box-shadow: none;
    color: #475569; font-size: 20px; font-weight: 400; line-height: 1.6;
    margin-bottom: 45px; padding: 0; padding-left: 20px; border-left: 2px solid #C9A84C; border-radius: 0;
}

.H-ACTS { display: flex; gap: 24px; align-items: center; }
.BTN { 
    display: inline-flex; align-items: center; gap: 12px;
    padding: 16px 40px; border-radius: 0; box-shadow: none;
    font-family: 'Inter', sans-serif !important; font-weight: 500; text-transform: uppercase; font-size: 12px; letter-spacing: 2px;
    cursor: pointer; text-decoration: none; transition: 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
.BTN-RED { background: #0F172A; color: #fff; border: 1px solid #0F172A; }
.BTN-WHITE { background: transparent; color: #0F172A; border: 1px solid #CBD5E1; }
.BTN-RED:hover { background: #C9A84C; border-color: #C9A84C; color: #fff; transform: translateY(-2px); box-shadow: 0 10px 20px rgba(201,168,76,0.15); }
.BTN-WHITE:hover { border-color: #0F172A; transform: translateY(-2px); }

/* Right Image Area */
.HR { position: relative; text-align: center; display: flex; align-items: center; justify-content: center; overflow: visible; }
.HR-COMPOSITE { position: relative; width: 100%; max-width: 950px; margin-right: -50px; }
.HR-SPLASH {
    position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
    width: 170%; max-width: none; z-index: 1; pointer-events: none; opacity: 0.8;
}
.HR-IMG { 
    width: 100%; height: auto; 
    position: relative; z-index: 3; 
    filter: drop-shadow(0 40px 60px rgba(15,23,42,0.15));
    animation: float-product 7s ease-in-out infinite;
}
@keyframes float-product {
    0% { transform: translateY(0px); }
    50% { transform: translateY(-12px); }
    100% { transform: translateY(0px); }
}

.HR-CAP {
    position: absolute; bottom: -30px; right: 20px;
    background: rgba(255, 255, 255, 0.95); backdrop-filter: blur(10px);
    padding: 14px 32px; border-radius: 0;
    font-family: 'Inter', sans-serif; font-size: 11px; font-weight: 500; color: #475569; text-transform: uppercase; letter-spacing: 2px;
    border: 1px solid #F1F5F9;
    box-shadow: 0 15px 35px rgba(0,0,0,0.05); z-index: 4;
}

/* ═══════════════ TRUST BAR (Feature Icons) ═══════════════ */
.TRUST-BAR {
    background: #F8FAFC;
    padding: 50px 0;
    border-bottom: 1px solid #E2E8F0;
}
.TRUST-BAR .CX { display: grid; grid-template-columns: repeat(4, 1fr); gap: 40px; }
.TB-ITEM { display: flex; align-items: flex-start; gap: 20px; color: #0F172A; }
.TB-ICON { width: 30px; height: 30px; border: 1px solid #C9A84C; display: flex; align-items: center; justify-content: center; font-size: 14px; font-family: 'Playfair Display', serif; color: #C9A84C; border-radius: 50%; flex-shrink: 0; }
.TB-TEXT h4 { font-size: 11px; font-weight: 600; text-transform: uppercase; margin-bottom: 6px; color: #0F172A; letter-spacing: 2px; }
.TB-TEXT p { font-size: 13px; color: #64748B; font-family: 'Playfair Display', serif; font-style: italic; }

/* ═══════════════ 3D SHOWCASE SECTION ═══════════════ */
.SC-3D-SHOWCASE { padding: 120px 0; background: #ffffff; color: #334155; overflow: hidden; }
.SHOWCASE-FLEX { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 80px; align-items: center; }
.SHOWCASE-IMG-WRAP { position: relative; perspective: 1000px; text-align: center; }
.SHOWCASE-GLOW { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 400px; height: 400px; background: rgba(201, 168, 76, 0.05); border-radius: 50%; filter: blur(60px); z-index: 1; }
.SHOWCASE-IMG { position: relative; z-index: 2; width: 100%; max-width: 550px; animation: float3d 8s ease-in-out infinite; transform-style: preserve-3d; filter: drop-shadow(0 30px 40px rgba(15,23,42,0.1)); }
@keyframes float3d {
    0%, 100% { transform: translateY(0) rotateX(2deg) rotateY(-2deg); }
    50% { transform: translateY(-10px) rotateX(4deg) rotateY(2deg); }
}
.SHOWCASE-BADGE { display: inline-block; background: transparent; border: 1px solid #C9A84C; padding: 8px 20px; border-radius: 0; font-size: 10px; font-weight: 600; margin-bottom: 30px; color: #C9A84C; text-transform: uppercase; letter-spacing: 3px; }
.SHOWCASE-TEXT h2 { font-family: 'Playfair Display', serif !important; font-size: 52px; font-weight: 500; line-height: 1.1; margin-bottom: 24px; color: #0F172A; text-transform: none; }
.SHOWCASE-TEXT h2 span { color: #C9A84C; font-style: italic; font-weight: 400; }
.SHOWCASE-TEXT p { font-family: 'Playfair Display', serif; font-size: 18px; color: #475569; line-height: 1.8; margin-bottom: 40px; }
.SHOWCASE-FEATS { list-style: none; margin-bottom: 40px; border-left: 1px solid #E2E8F0; padding-left: 20px; }
.SHOWCASE-FEATS li { display: flex; align-items: center; gap: 16px; margin-bottom: 16px; font-size: 14px; font-weight: 400; color: #0F172A; }
.SHOWCASE-FEATS li span { color: #C9A84C; font-weight: 300; }

/* ═══════════════ PRODUCT CATEGORIES ═══════════════ */
.SC-PRODUCTS { padding: 120px 0; background: #F8FAFC; border-top: 1px solid #E2E8F0; }
.SH-FLEX { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 60px; }
.SH-TITLE { position: relative; padding-top: 0; }
.SH-TITLE h2 { font-family: 'Playfair Display', serif !important; font-size: 42px; font-weight: 500; color: #0F172A; text-transform: none; }
.SH-TITLE::before { display: none; }

.BTN-OUTLINE {
    border: 1px solid #CBD5E1; border-radius: 0;
    padding: 12px 30px; font-size: 11px; font-weight: 500;
    color: #475569; text-transform: uppercase; letter-spacing: 2px;
    text-decoration: none; transition: 0.4s;
}
.BTN-OUTLINE:hover { border-color: #0F172A; color: #0F172A; }

.PC-GRID { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }
.PC-CARD {
    background: transparent; border: 1px solid #E2E8F0; padding: 40px 30px;
    transition: 0.4s cubic-bezier(0.4, 0, 0.2, 1); position: relative;
    text-decoration: none; display: flex; flex-direction: column; align-items: center; text-align: center;
}
.PC-CARD:hover { transform: translateY(-10px); border-color: #C9A84C; background: #fff; box-shadow: 0 20px 40px rgba(15,23,42,0.05); }
.PC-IMG { width: 100%; height: 200px; object-fit: contain; margin-bottom: 30px; mix-blend-mode: multiply; transition: 0.4s; }
.PC-CARD:hover .PC-IMG { transform: scale(1.05); }
.PC-CARD h3 { font-size: 13px; font-weight: 600; color: #0F172A; margin-bottom: 8px; text-transform: uppercase; letter-spacing: 2px; }
.PC-CARD p { font-family: 'Playfair Display', serif; font-style: italic; font-size: 15px; color: #64748B; line-height: 1.4; }
.PC-ARROW {
    position: absolute; bottom: 30px; right: 30px;
    color: #C9A84C; font-size: 20px; font-weight: 300; opacity: 0; transition: 0.4s; transform: translateX(-10px);
}
.PC-CARD:hover .PC-ARROW { opacity: 1; transform: translateX(0); }

/* ═══════════════ HEADER CSS OVERRIDES ═══════════════ */
.elementor-nav-menu--main .menu-item.current-menu-item a {
    color: #C9A84C !important;
}
.elementor-nav-menu--main .menu-item.current-menu-item a::after {
    height: 1px; background: #C9A84C; bottom: 0; left: 16px; right: 16px;
}

/* ═══════════════ EVENT GALLERY SECTION ═══════════════ */
.SC-GALLERY { padding: 120px 0; background: #ffffff; overflow: hidden; border-top: 1px solid #E2E8F0; }
.marquee-wrap { width: 100vw; max-width: 100%; overflow: hidden; white-space: nowrap; position: relative; margin-left: calc(-50vw + 50%); margin-right: calc(-50vw + 50%); padding: 20px 0; }
.marquee { display: inline-flex; animation: scroll 50s linear infinite; gap: 30px; }
.marquee:hover { animation-play-state: paused; }
@keyframes scroll {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}
.GAL-ITEM { display: inline-block; width: 400px; overflow: hidden; border-radius: 0; position: relative; flex-shrink: 0; cursor: pointer; }
.GAL-ITEM img { width: 100%; height: 280px; object-fit: cover; transition: 0.7s cubic-bezier(0.4, 0, 0.2, 1); display: block; }
.GAL-ITEM:hover img { transform: scale(1.05); }

/* ═══════════════ LIGHTBOX ═══════════════ */
.lightbox { display: none; position: fixed; z-index: 9999; padding-top: 60px; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgba(15,23,42,0.95); justify-content: center; align-items: center; backdrop-filter: blur(10px); }
.lightbox-content { margin: auto; display: block; max-width: 90%; max-height: 80vh; border-radius: 0; box-shadow: 0 20px 50px rgba(0,0,0,0.5); object-fit: contain; animation: zoomIn 0.5s cubic-bezier(0.4, 0, 0.2, 1); }
@keyframes zoomIn { from {transform:scale(0.9); opacity:0;} to {transform:scale(1); opacity:1;} }
.close-lightbox { position: absolute; top: 40px; right: 50px; color: #94A3B8; font-size: 40px; font-weight: 300; cursor: pointer; transition: 0.3s; }
.close-lightbox:hover { color: #fff; transform: rotate(90deg); }

/* ═══════════════ COMPANY ABOUT SECTION ═══════════════ */
.SC-ABOUT { padding: 120px 0; background: #F8FAFC; border-top: 1px solid #E2E8F0; }
.AB-GRID { display: grid; grid-template-columns: 0.85fr 1.15fr; gap: 80px; align-items: center; }
.AB-IMG-WRAP { position: relative; }
.AB-IMG { width: 100%; border-radius: 0; object-fit: cover; height: 500px; filter: grayscale(20%); }
.AB-BADGE-BOX {
    position: absolute; bottom: -30px; left: -30px;
    background: rgba(255, 255, 255, 0.95); backdrop-filter: blur(10px);
    border: 1px solid #E2E8F0; border-radius: 0; padding: 30px 40px;
    display: flex; align-items: center; gap: 40px;
    box-shadow: 0 20px 40px rgba(15,23,42,0.05);
}
.AB-STAT { text-align: center; }
.AB-NUM { display: block; font-family: 'Playfair Display', serif; font-size: 48px; font-weight: 500; color: #0F172A; line-height: 1; }
.AB-LBL { font-family: 'Inter', sans-serif; font-size: 10px; color: #64748B; text-transform: uppercase; letter-spacing: 2px; margin-top: 8px; display: block; }
.AB-DIVIDER { width: 1px; height: 50px; background: #E2E8F0; }

.AB-TAG { font-family: 'Inter', sans-serif; font-size: 11px; font-weight: 600; color: #C9A84C; text-transform: uppercase; letter-spacing: 3px; margin-bottom: 20px; }
.AB-TITLE { font-family: 'Playfair Display', serif; font-size: 48px; font-weight: 500; color: #0F172A; line-height: 1.1; margin-bottom: 30px; }
.AB-DESC { font-family: 'Playfair Display', serif; font-size: 18px; color: #475569; line-height: 1.8; margin-bottom: 20px; }
.AB-FEATS { display: grid; grid-template-columns: 1fr; gap: 16px; margin-top: 30px; border-top: 1px solid #E2E8F0; padding-top: 30px; }
.AB-FEAT { display: flex; align-items: center; gap: 16px; font-family: 'Inter', sans-serif; font-size: 13px; color: #0F172A; text-transform: uppercase; letter-spacing: 1px; }
.AB-FEAT-ICON { color: #C9A84C; font-size: 16px; flex-shrink: 0; font-weight: 300; }

/* ═══════════════ RESPONSIVE ═══════════════ */
@media (max-width: 1024px) {
    .HERO h1 { font-size: 44px; }
    .HERO .HL { padding-left: 0; }
    .SHOWCASE-FLEX { grid-template-columns: 1fr; text-align: center; gap: 40px; }
    .SHOWCASE-TEXT { display: flex; flex-direction: column; align-items: center; }
    .SHOWCASE-FEATS { text-align: left; width: 100%; max-width: 400px; }
    .PC-GRID { grid-template-columns: repeat(2, 1fr); }
    .TRUST-BAR .CX { grid-template-columns: repeat(2, 1fr); }
    .AB-GRID { grid-template-columns: 1fr; gap: 60px; }
    .AB-BADGE-BOX { position: static; margin-top: 20px; flex-direction: column; gap: 20px; padding: 20px; }
    .AB-DIVIDER { width: 100%; height: 1px; }
}
@media (max-width: 600px) {
    .HERO .CX { grid-template-columns: 1fr; }
    .H-ACTS { flex-direction: column; }
    .PC-GRID, .TRUST-BAR .CX { grid-template-columns: 1fr; }
    .AB-FEATS { grid-template-columns: 1fr; }
    .GAL-ITEM { width: 280px; }
    .GAL-ITEM img { height: 200px; }
}
