/* Shared header used by the homepage and all public inner pages. */
html,body{max-width:100%;overflow-x:hidden}
@supports(overflow:clip){html,body{overflow-x:clip}}
.site-header{position:fixed;inset:0 0 auto;z-index:60;transition:transform .45s cubic-bezier(.16,1,.3,1),filter .35s ease;will-change:transform}
.site-header.header-hidden{transform:translateY(-102%)}
.site-header.scrolled{filter:drop-shadow(0 10px 22px rgba(3,31,91,.1))}
.site-header .head-main{background:transparent;border-bottom:1px solid rgba(255,255,255,.16);backdrop-filter:none;transition:background .35s ease,border-color .35s ease,backdrop-filter .35s ease}
.site-header.scrolled .head-main{background:rgba(255,255,255,.97);border-bottom-color:rgba(223,230,239,.9);backdrop-filter:blur(14px)}
.site-header .head-top{height:96px;display:grid;grid-template-columns:170px minmax(280px,1fr) auto;align-items:center;gap:20px;width:min(calc(100% - 48px),1280px);margin-inline:auto}
.site-header .brand{display:inline-flex;align-items:center;gap:12px;width:max-content}
.site-header .site-logo{width:118px;height:auto;max-height:93px;padding:0;object-fit:contain;background:transparent;border-radius:0;box-shadow:none;filter:brightness(1.35) saturate(1.08) drop-shadow(0 2px 5px rgba(255,255,255,.16))}
.site-header .search-trigger{min-width:0;height:48px;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:0 20px;color:#7a879a;background:#f3f7fc;border:1px solid #dfe6ef;border-radius:999px;font:13px/1 "Be Vietnam Pro",sans-serif;text-align:left;transition:border-color .25s,box-shadow .25s,background .25s}
.site-header .search-trigger:hover{color:#13213a;background:#fff;border-color:rgba(0,91,255,.45);box-shadow:0 0 0 4px rgba(0,91,255,.07)}
.site-header:not(.scrolled) .search-trigger{color:#c9d8ee;background:rgba(2,19,55,.3);border-color:rgba(255,255,255,.22)}
.site-header .head-actions{position:relative;display:flex;align-items:center;gap:8px}
.site-header .header-contact-button{position:relative;width:42px;height:42px;flex:0 0 42px;display:grid;place-items:center;color:#005bff;background:#fff;border:1px solid rgba(0,91,255,.22);border-radius:50%;box-shadow:0 7px 18px rgba(3,31,91,.09);transition:transform .25s ease,color .25s ease,background .25s ease,border-color .25s ease,box-shadow .25s ease}
.site-header .header-contact-button:hover{color:#fff;background:#005bff;border-color:#005bff;box-shadow:0 12px 28px rgba(0,91,255,.28);transform:translateY(-2px)}
.site-header .header-contact-button .icon{width:18px;height:18px}.site-header .header-contact-button img{width:24px;height:24px;object-fit:contain}.site-header .header-zalo-button{background:#fff;border-color:rgba(0,104,255,.28);box-shadow:0 7px 18px rgba(0,104,255,.12)}.site-header .header-zalo-button img{width:31px;height:31px}
.site-header:not(.scrolled) .header-contact-button{color:#fff;background:rgba(3,31,91,.42);border-color:rgba(255,255,255,.38);box-shadow:none;backdrop-filter:blur(8px)}
.site-header:not(.scrolled) .header-zalo-button{background:rgba(255,255,255,.96);border-color:rgba(255,255,255,.72);box-shadow:0 8px 20px rgba(0,45,120,.18)}
.site-header:not(.scrolled) .header-contact-button:hover{background:#005bff;border-color:#65d6ff}
.site-header .header-contact-button:after{content:attr(data-tooltip);position:absolute;top:calc(100% + 9px);left:50%;padding:6px 8px;visibility:hidden;opacity:0;color:#fff;background:#031f5b;border-radius:5px;font-size:9px;font-weight:700;white-space:nowrap;transform:translate(-50%,-3px);transition:.2s;pointer-events:none}
.site-header .header-contact-button:hover:after,.site-header .header-contact-button:focus-visible:after{visibility:visible;opacity:1;transform:translate(-50%,0)}
.site-header .quote-btn{min-height:42px;height:42px;padding-inline:20px;white-space:nowrap;border-radius:999px;font-size:10.5px;letter-spacing:.025em;box-shadow:0 9px 22px rgba(0,91,255,.22)}
.site-header .quote-phone-popover{position:absolute;z-index:10;top:calc(100% + 12px);left:0;min-width:226px;padding:12px;visibility:hidden;opacity:0;background:#fff;border:1px solid #dfe6ef;border-radius:16px;box-shadow:0 20px 48px rgba(3,31,91,.18);transform:translateY(-7px);transition:opacity .22s,transform .25s,visibility .22s}.site-header .head-actions.phone-open .quote-phone-popover{visibility:visible;opacity:1;transform:none}.site-header .quote-phone-popover small{display:block;margin:0 0 7px;color:#607089;font-size:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.site-header .quote-phone-popover a{min-height:44px;display:flex;align-items:center;gap:10px;padding:0 13px;color:#031f5b;background:#f3f7fc;border-radius:11px;font-size:16px;font-weight:800}.site-header .quote-phone-popover a:hover{color:#fff;background:#005bff}.site-header .quote-phone-popover .icon{width:19px;height:19px}
.site-header .icon-button{width:42px;height:42px;display:none;place-items:center;color:#031f5b;background:#f3f7fc;border:1px solid #dfe6ef;border-radius:10px}
.site-header:not(.scrolled) .icon-button{color:#fff;background:rgba(2,19,55,.28);border-color:rgba(255,255,255,.25)}
.site-header .nav-row{height:44px;display:flex;align-items:stretch;justify-content:space-between;width:min(calc(100% - 48px),1280px);margin-inline:auto;border-top:1px solid #edf1f6}
.site-header .primary-nav{width:100%;display:flex;align-items:stretch;justify-content:center;gap:clamp(18px,2.2vw,34px)}
.site-header .nav-item{position:relative;display:flex;align-items:stretch}
.site-header .nav-link{display:flex;align-items:center;gap:6px;padding-inline:3px;color:#36445b;font-size:12px;font-weight:650;white-space:nowrap;border-bottom:2px solid transparent}
.site-header:not(.scrolled) .nav-link{color:#edf4ff}
.site-header .nav-link:hover,.site-header .nav-item:focus-within>.nav-link,.site-header .nav-link.active{color:#005bff;border-color:#005bff}
.site-header .icon{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;display:block}
.site-header .icon-sm{width:17px;height:17px}.site-header .chev{width:12px;height:12px;transition:transform .3s}.site-header .nav-item:hover .chev,.site-header .nav-item:focus-within .chev{transform:rotate(180deg)}
.site-header .mega{position:absolute;top:calc(100% + 1px);left:-22px;width:620px;padding:22px;display:grid;grid-template-columns:repeat(2,1fr);gap:8px;visibility:hidden;opacity:0;transform:translateY(12px);pointer-events:none;background:#fff;border:1px solid #dfe6ef;border-radius:0 0 18px 18px;box-shadow:0 24px 70px rgba(3,31,91,.12);transition:opacity .28s,transform .35s,visibility .28s}
.site-header .mega-products{width:min(700px,calc(100vw - 48px))}.site-header .mega-right{left:auto;right:-22px}.site-header .nav-item:hover .mega,.site-header .nav-item:focus-within .mega{visibility:visible;opacity:1;transform:none;pointer-events:auto}
.site-header .mega a{display:flex;gap:12px;padding:13px;border-radius:10px;transition:background .25s,color .25s}.site-header .mega a:hover{color:#005bff;background:#f3f7fc}.site-header .mega-ico{width:36px;height:36px;flex:0 0 auto;display:grid;place-items:center;color:#005bff;background:#e9f1ff;border-radius:9px}.site-header .mega strong{display:block;font-size:13px}.site-header .mega span span{display:block;margin-top:2px;color:#607089;font-size:11px;font-weight:400}
.site-header .search-modal{position:fixed;inset:0;z-index:110;display:grid;place-items:start center;padding:14vh 24px 24px;visibility:hidden;opacity:0;background:rgba(2,13,39,.78);backdrop-filter:blur(14px);transition:opacity .3s,visibility .3s}.site-header .search-modal.open{visibility:visible;opacity:1}.site-header .search-box{position:relative;width:min(720px,100%);padding:28px;background:#fff;border-radius:20px;box-shadow:0 30px 90px rgba(0,0,0,.3);transform:translateY(-18px);transition:transform .4s}.site-header .search-modal.open .search-box{transform:none}.site-header .search-row{display:grid;grid-template-columns:1fr 44px;gap:10px}.site-header .search-row input{min-width:0;height:50px;padding:0 18px;color:#13213a;background:#f3f7fc;border:1px solid #dfe6ef;border-radius:10px;font-size:14px}.site-header .search-row button{display:grid;place-items:center;color:#fff;background:#005bff;border:0;border-radius:10px}.site-header .search-results{margin-top:16px;display:grid;gap:8px}.site-header .search-results a{padding:12px 14px;border-radius:8px;font-size:13px}.site-header .search-results a:hover{color:#005bff;background:#f3f7fc}.site-header .search-hint{margin:14px 0 0;color:#607089;font-size:11px}.site-header .modal-close{position:absolute;z-index:2;top:18px;right:18px;width:40px;height:40px;display:grid;place-items:center;color:#031f5b;background:#f3f7fc;border:1px solid #dfe6ef;border-radius:10px}
.site-header .drawer-backdrop{position:fixed;inset:0;z-index:89;width:100vw;height:100vh;height:100dvh;visibility:hidden;opacity:0;background:rgba(2,13,39,.65);transition:opacity .3s,visibility .3s}.site-header .drawer{position:fixed;top:0;right:0;bottom:auto;left:auto;z-index:90;width:min(390px,90vw);height:100vh;height:100dvh;max-height:100dvh;padding:26px;overflow-y:auto;overscroll-behavior:contain;color:#13213a;background:#fff;transform:translateX(100%);transition:transform .45s}.site-header .drawer-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:32px}.site-header .drawer-close{width:42px;height:42px;display:grid;place-items:center;color:#031f5b;background:#f3f7fc;border:1px solid #dfe6ef;border-radius:10px}.site-header .drawer-nav a{display:flex;align-items:center;justify-content:space-between;padding:15px 2px;border-bottom:1px solid #dfe6ef;font-size:14px;font-weight:600}.site-header .drawer-meta{margin:28px 0;display:grid;grid-template-columns:repeat(2,1fr);gap:10px;color:#607089;font-size:11px}.site-header .drawer .btn{width:100%}body.menu-open{overflow:hidden}body.menu-open .site-header{transform:none;filter:none;will-change:auto}body.menu-open .site-header .drawer-backdrop{visibility:visible;opacity:1}body.menu-open .site-header .drawer{transform:none}
@media(max-width:1120px){.site-header .primary-nav,.site-header .head-search,.site-header .nav-row{display:none}.site-header .head-top{height:90px;grid-template-columns:1fr auto}.site-header .site-logo{width:112px;max-height:86px}.site-header .icon-button{display:grid}.site-header .head-main{border-bottom-color:#dfe6ef}}
@media(max-width:820px){.site-header .head-top{height:88px;width:min(calc(100% - 36px),1280px)}.site-header:not(.scrolled) .head-main{background:linear-gradient(180deg,rgba(3,20,57,.46),rgba(3,20,57,.18) 58%,transparent);border-bottom-color:transparent;backdrop-filter:none}.site-header.scrolled .head-main{background:rgba(255,255,255,.94);backdrop-filter:blur(18px)}}
@media(max-width:560px){.site-header .head-top{height:92px;width:min(calc(100% - 28px),1280px);gap:10px}.site-header .head-main,.site-header.scrolled .head-main,.site-header:not(.scrolled) .head-main{background:#fff;border-bottom-color:#dfe6ef;backdrop-filter:blur(14px)}.site-header .site-logo{width:104px;max-height:82px}.site-header .head-actions{gap:6px}.site-header .icon-button{width:42px;height:42px;border-radius:13px}.site-header .quote-btn{display:none}.site-header .search-modal{padding:max(74px,env(safe-area-inset-top)) 14px 18px}.site-header .search-box{padding:22px 18px 18px;border-radius:18px}.site-header .search-row{grid-template-columns:minmax(0,1fr) 44px;gap:8px}.site-header .search-row input{height:46px;padding-inline:13px;font-size:12px}.site-header .search-results{margin-top:12px;gap:4px}.site-header .search-results a{padding:10px 11px;font-size:11px;line-height:1.45}.site-header .search-hint{margin-top:11px;font-size:9px;line-height:1.5}.site-header .modal-close{top:12px;right:12px;width:36px;height:36px}.site-header .modal-close .icon{width:19px;height:19px}}
.site-header+main .catalog-hero{margin-top:140px}.site-header~main.product,.site-header~main.not-found,.site-header~main.archive,.site-header~main.article{margin-top:140px}
@media(max-width:1120px){.site-header+main .catalog-hero{margin-top:90px}.site-header~main.product,.site-header~main.not-found,.site-header~main.archive,.site-header~main.article{margin-top:90px}}
@media(max-width:820px){.site-header+main .catalog-hero{margin-top:88px}.site-header~main.product,.site-header~main.not-found,.site-header~main.archive,.site-header~main.article{margin-top:88px}}
@media(max-width:560px){.site-header+main .catalog-hero{margin-top:92px}.site-header~main.product,.site-header~main.not-found,.site-header~main.archive,.site-header~main.article{margin-top:92px}}
/* Keep the public header legible on its permanent white background. */
.site-header .head-main,.site-header.scrolled .head-main,.site-header:not(.scrolled) .head-main{background:#fff;border-bottom-color:#dfe6ef;backdrop-filter:blur(14px)}
.site-header .head-top>.brand .site-logo{content:url("/assets/dai-duong-logo-header-light.png?v=20260816a");filter:none}
.site-header:not(.scrolled) .search-trigger{color:#7a879a;background:#f3f7fc;border-color:#dfe6ef}
.site-header:not(.scrolled) .header-contact-button{color:#005bff;background:#fff;border-color:rgba(0,91,255,.22);box-shadow:0 7px 18px rgba(3,31,91,.09);backdrop-filter:none}
.site-header:not(.scrolled) .header-zalo-button{background:#fff;border-color:rgba(0,104,255,.28);box-shadow:0 7px 18px rgba(0,104,255,.12)}
.site-header:not(.scrolled) .icon-button{color:#031f5b;background:#f3f7fc;border-color:#dfe6ef;backdrop-filter:none}
.site-header:not(.scrolled) .nav-link{color:#36445b}
