/* Start custom CSS for html, class: .elementor-element-336b04a */.elementor-element-4f435d2 {}
.elementor-element-4f435d2 .elementor-container{width:100% !important;max-width: 100% !important;}
.elementor-element-4f435d2 .elementor-container .elementor-widget-wrap{padding:0;}
.elementor-element-336b04a{margin-block-end:0 !important;}
  /* ====== Header ====== */
  header{
    position:relative; top:0; z-index:1000;
    background:transparent;
    
  }
  /* Class mới cho trạng thái sticky */
.header-sticky {
    background-color: #000; /* Màu nền trắng, ví dụ */
    position: sticky;
}
  .topbar{
    height:97px;
    display:grid;
    grid-template-columns:1fr auto 1fr;
    align-items:center;
    gap:16px;
  }
  nav ul{display:flex; align-items:center; gap:32px; list-style:none}
  .nav-right{display:flex;}
  .nav-right ul{gap:15px;}
  nav a{
    text-transform:uppercase; font-size:var(--fontsmallmedium); letter-spacing:.02em; color:#f1f1f1;
    position:relative; transition:color .25s ease;
  }
  nav a::after{
    content:""; position:absolute; left:0; right:0; bottom:-8px; height:2px;
    background:var(--gold); transform:scaleX(0); transform-origin:left; transition:transform .25s ease;
  }
  nav a:hover{color:var(--gold)}
  nav a:hover::after{transform:scaleX(1)}
  nav .custom-language-switcher a::after{content:none; }
  /* centered brand */
  .brand{
    display:flex; align-items:center; gap:10px; justify-self:center;
  }
  .brand-mark{
    display:inline-grid; place-items:center;
    width:36px; height:36px; border:1.5px solid var(--gold);
    border-radius:6px; color:var(--gold); font-weight:800; font-size:13px;
    letter-spacing:.06em;
  }
  .brand-name{
    color:#f7f7f7; font-weight:700; font-size:12px; letter-spacing:.12em;
  }
	.mobile-panel{display:none;}
  /* mobile trigger */
  .hamburger{display:none; width:28px; height:20px; gap:5px; flex-direction:column; justify-content:center; cursor:pointer}
  .hamburger span{height:2px; width:100%; background:#fff; transition:transform .3s ease,opacity .3s ease}
/* ====== Responsive ====== */
    @media (max-width: 1366px){
		.topbar{grid-template-columns:auto 1fr auto}
		nav,.nav-right{display:none}
		.hamburger{display:flex; justify-self:end}
		/* mobile menu panel */
		.mobile-panel{
		          position: fixed;
        inset: 95px 0 0 0;
        background: #050505;
        display: none;
        padding: 18px 22px;
        z-index: 999;
        text-align: right;
		}
		.mobile-panel.open{display:block; animation:slideDown .28s ease forwards}
		.mobile-panel a{display:block; padding:8px 6px; border-bottom:1px solid var(--gold); text-transform:uppercase; }
		@keyframes slideDown{from{opacity:0; transform:translateY(-8px)} to{opacity:1; transform:none}}
		/* hamburger animation */
		.hamburger.active span:nth-child(1){transform:translateY(7px) rotate(45deg)}
		.hamburger.active span:nth-child(2){opacity:0}
		.hamburger.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
		.headline .row-2, .headline .row-3{font-size:30px}
	  }
	  @media (max-width: 1024px){
		body{}
		.hero{grid-template-columns:1fr}
		.info{margin-left:0}
		.headline .row-2, .headline .row-3{font-size:36px}
	  }
	  @media (max-width: 880px){
		nav ul{gap:22px}
	  }/* End custom CSS */