/* ============================================================
   regna-nav.css — thanh nav ngang tĩnh, dựng lại theo đúng nav
   đang chạy trên regna.ai (dải đỏ #b90a2e + thanh xám #323232,
   font Geomanist 15px, logo 200x27).

   Hành vi: ở đầu trang hiện nav ngang này và ẨN header pill của
   Framer. Cuộn xuống thì ngược lại — ẩn nav, hiện pill Framer.

   Tạm BỎ search / account / minicart theo yêu cầu.
   Muốn bỏ hẳn: xoá file này + regna-nav.js + 2 dòng <link>/<script>
   trong index.html, trang về đúng bản Framer gốc.
   ============================================================ */
@font-face{font-family:'Geomanist';src:url('../assets/fonts/Geomanist-Regular.woff2') format('woff2');
  font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Geomanist';src:url('../assets/fonts/Geomanist-Medium.woff2') format('woff2');
  font-weight:500;font-style:normal;font-display:swap}

#regna-topnav{position:fixed;top:0;left:0;right:0;z-index:100;
  font-family:'Geomanist',system-ui,sans-serif;
  transition:opacity .3s ease,transform .3s ease}
#regna-topnav.rn-hidden{opacity:0;transform:translateY(-14px);pointer-events:none}

/* dải đỏ trên */
.rn-strip{background:#b90a2e;height:38px;display:flex;align-items:center;
  justify-content:flex-end;gap:22px;padding:0 40px}
.rn-strip a{display:flex;align-items:center;color:#fff;opacity:.95;transition:opacity .2s}
.rn-strip a:hover{opacity:1}
.rn-strip svg{width:17px;height:17px;fill:currentColor}

/* thanh chính */
.rn-bar{background:#323232;height:76px;display:flex;align-items:center;
  padding:0 40px;gap:40px}
.rn-logo{flex:0 0 auto;display:block}
.rn-logo img{width:200px;height:27px;display:block}
.rn-menu{flex:1;display:flex;align-items:center;justify-content:center;gap:26px}
.rn-menu a{color:#fff;font-size:15px;font-weight:400;line-height:1;
  text-transform:capitalize;text-decoration:none;padding:8px 6px;
  white-space:nowrap;opacity:.92;transition:opacity .2s}
.rn-menu a:hover{opacity:1;text-decoration:underline;text-underline-offset:5px}
.rn-spacer{flex:0 0 200px}   /* cân đối với logo để menu nằm giữa */

/* ẩn header pill của Framer khi đang ở đầu trang */
/* !important vì Framer đặt opacity bằng inline style */
body:not(.rn-scrolled) [data-framer-name="Default"]{opacity:0 !important;
  pointer-events:none !important;transition:opacity .3s ease !important}
body.rn-scrolled [data-framer-name="Default"]{opacity:1 !important;
  transition:opacity .3s ease !important}

/* đẩy nội dung xuống cho khỏi bị nav che */
body{padding-top:0}

@media (max-width:1199px){
  .rn-bar{padding:0 24px;gap:24px}
  .rn-menu{gap:16px}
  .rn-menu a{font-size:14px}
  .rn-spacer{display:none}
  .rn-strip{padding:0 24px}
}
@media (max-width:809px){
  #regna-topnav{display:none}   /* mobile: dùng luôn pill Framer */
}