/* ⚠️ FILE NÀY DO MÁY SINH — scripts/site-menu.mjs · sinh lại: npm run web:menu
   Menu kiểu corgi.insure (chủ sản phẩm 13/10): chữ trơn + mũi tên, gạch chân trượt dưới nhóm đang
   mở, tấm thả xuống phẳng chia cột bằng đường kẻ mảnh, mỗi cột một tiêu đề in nhỏ, mục chỉ icon +
   tên, cột "Nổi bật" bên phải. Tắt JS vẫn mở được: :hover / :focus-within cho tấm thả xuống,
   <details> cho điện thoại. Có JS (html.mm-js) thì JS lo mở/đóng để có độ trễ rê chuột, bấm lần
   hai là đóng, Esc, và gạch chân. */
.mm-bar{position:relative}
.mm-lift{position:relative;z-index:2}
.mm{display:flex;align-items:center;justify-content:center;flex:1 1 auto;min-width:0}
.mm ul{list-style:none;margin:0;padding:0}
.mm li{margin:0;padding:0}
.mm p{margin:0}
.mm a{text-decoration:none}
.mm svg{fill:currentColor;display:block}
.mm-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.mm-tops{display:flex;align-items:center;gap:2px}
.mm-top{position:relative;display:inline-flex;align-items:center;gap:5px;height:40px;padding:0 11px;border:0;border-radius:8px;
  background:transparent;font:400 13.5px/1 'Be Vietnam Pro',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;color:#5C5C5C;cursor:pointer;white-space:nowrap;transition:color .2s}
/* Cầu nối vô hình từ chữ xuống tấm: rê chuột xuống không bị rơi khỏi nhóm giữa chừng. */
.mm-top::after{content:'';position:absolute;left:0;right:0;top:100%;height:30px}
.mm-top:hover,.mm-item.open>.mm-top,html:not(.mm-js) .mm-item:focus-within>.mm-top{color:#0A0A0A}
.mm-caret{width:10px;height:10px;transition:transform .3s cubic-bezier(.2,.7,.2,1)}
.mm-item.open .mm-caret,html:not(.mm-js) .mm-item:hover .mm-caret{transform:rotate(180deg)}
/* Gạch chân trượt từ nhóm này sang nhóm kia (JS đặt left/width). Lần đầu hiện thì không trượt. */
.mm-ink{position:absolute;left:0;width:0;height:1.5px;background:#0A0A0A;opacity:0;pointer-events:none;
  transition:left .35s cubic-bezier(.2,.7,.2,1),width .35s cubic-bezier(.2,.7,.2,1),opacity .2s}
.mm-ink.on{opacity:1}
.mm-ink.jump{transition:opacity .2s}
.mm-attach .mm-ink{bottom:-1px}
.mm-float .mm-ink{bottom:10px}
.mm-panel{position:absolute;left:0;right:0;top:100%;z-index:5;visibility:hidden;opacity:0;transform:translateY(-6px);pointer-events:none;
  transition:opacity .2s cubic-bezier(.2,.7,.2,1),transform .3s cubic-bezier(.2,.7,.2,1),visibility 0s linear .3s}
.mm-attach .mm-panel{top:calc(100% + 1px)}
.mm-float .mm-panel{top:calc(100% + 8px)}
.mm-item.open>.mm-panel,html:not(.mm-js) .mm-item:hover>.mm-panel,html:not(.mm-js) .mm-item:focus-within>.mm-panel{
  visibility:visible;opacity:1;transform:none;pointer-events:auto;transition-delay:0s}
/* Đổi từ nhóm này sang nhóm kia: tấm đứng yên, chỉ chữ bên trong hiện lên (không chớp nền). */
.mm-swap .mm-panel{transition:none}
.mm-grid{display:flex;align-items:stretch;background:#FFFFFF;border:1px solid #E6E6E6;box-shadow:0 28px 50px -30px rgba(0,0,0,.3);overflow:hidden}
.mm-attach .mm-grid{border-top:0}
.mm-float .mm-grid{border-radius:18px}
.mm-item.open .mm-grid>*,html:not(.mm-js) .mm-item:hover .mm-grid>*{animation:mm-in .32s cubic-bezier(.2,.7,.2,1) both}
.mm-grid>:nth-child(2){animation-delay:.03s}
.mm-grid>:nth-child(3){animation-delay:.06s}
/* Cột ôm theo chữ dài nhất (tên + nhãn trên MỘT dòng, như corgi.insure), không chật hơn 220px. */
.mm-col{display:flex;flex-direction:column;flex:0 0 auto;min-width:220px;padding-bottom:12px;border-right:1px solid #E6E6E6}
.mm-ch{padding:16px 20px 12px;border-bottom:1px solid #E6E6E6;font:500 10.5px/1.4 'Be Vietnam Pro',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#8C8C8C}
.mm-ul{display:grid;gap:1px;padding:10px 10px 0}
.mm-l{display:flex;align-items:center;gap:10px;min-height:34px;padding:6px 10px;border-radius:8px;font:400 13.5px/1.35 'Be Vietnam Pro',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;color:#262626;
  transition:background-color .15s}
.mm-l svg{flex:none;width:16px;height:16px;color:#5C5C5C}
.mm-l:hover,.mm-l[aria-current]{background:#F4F4F4}
.mm-l:hover svg,.mm-l[aria-current] svg{color:#0A0A0A}
.mm-lt{flex:1 1 auto;min-width:0;white-space:nowrap}
.mm-row .mm-lt{white-space:normal}
.mm-badge{flex:none;padding:2px 6px;border-radius:5px;background:#EFEFEF;font:500 9.5px/1.5 'Be Vietnam Pro',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;letter-spacing:.05em;
  text-transform:uppercase;color:#5C5C5C;white-space:nowrap}
.mm-badge.on{background:#9FE870;color:#0A0A0A}
.mm-more{display:inline-flex;align-self:flex-start;align-items:center;gap:6px;margin:auto 20px 0;padding-top:16px;font:400 13px/1.3 'Be Vietnam Pro',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;color:#0A0A0A}
.mm-more svg{width:13px;height:13px;transition:transform .3s cubic-bezier(.2,.7,.2,1)}
.mm-more:hover{text-decoration:underline;text-underline-offset:3px}
.mm-more:hover svg{transform:translateX(3px)}
.mm-hl{flex:1 1 auto;min-width:0}
.mm-cards{display:grid;grid-template-columns:repeat(2,minmax(0,220px));gap:14px;padding:14px}
.mm-hc{display:block;padding:6px;border-radius:12px;color:#0A0A0A;transition:background-color .15s}
.mm-hc:hover{background:#F4F4F4}
.mm-art{display:block;aspect-ratio:3/2;border-radius:9px;overflow:hidden;background:#F2F2F2;color:#8C8C8C}
.mm-art.dark{background:#0A0A0A;color:#FFFFFF}
.mm-art svg{width:100%;height:100%;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.mm-hc:hover .mm-art svg{transform:scale(1.05)}
.mm-art .lf{fill:#9FE870}
.mm-art .ln{stroke:#9FE870}
.mm-art .ok{stroke:#0A0A0A}
.mm-ht{display:block;margin-top:10px;font:500 12.5px/1.35 'Be Vietnam Pro',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;color:#0A0A0A}
.mm-hs{display:block;margin-top:3px;font:400 12px/1.45 'Be Vietnam Pro',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;color:#5C5C5C}
.mm a:focus-visible,.mm button:focus-visible,.mm summary:focus-visible{outline:2px solid #0A0A0A;outline-offset:2px;border-radius:8px}

/* ---- Điện thoại: nút hai vạch + tấm phủ kín màn ---- */
.mm-burger{display:none;position:relative}
.mm-burger summary{position:relative;z-index:3;list-style:none;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;
  background:#FFFFFF;border:1px solid #E6E6E6;color:#0A0A0A;cursor:pointer}
.mm-burger summary::-webkit-details-marker{display:none}
.mm-bars{position:relative;display:block;width:18px;height:10px}
.mm-bars i{position:absolute;left:0;width:100%;height:1.5px;border-radius:2px;background:currentColor;transition:top .4s cubic-bezier(.2,.7,.2,1),transform .4s cubic-bezier(.2,.7,.2,1)}
.mm-bars i:first-child{top:0}
.mm-bars i:last-child{top:8.5px}
.mm-burger[open] .mm-bars i{top:4.25px}
.mm-burger[open] .mm-bars i:first-child{transform:rotate(45deg)}
.mm-burger[open] .mm-bars i:last-child{transform:rotate(-45deg)}
/* Phủ kín màn. Thanh nav chứa nó KHÔNG được mang backdrop-filter / transform / filter: mấy thuộc
   tính đó biến thanh nav thành khung chứa của con position:fixed — tấm phủ bị nhốt trong thanh. */
.mm-sheet{position:fixed;inset:0;z-index:1;overflow-y:auto;padding:88px 20px 44px;background:rgba(255,255,255,.96);
  -webkit-backdrop-filter:blur(22px) saturate(1.3);backdrop-filter:blur(22px) saturate(1.3);animation:mm-fade .3s cubic-bezier(.2,.7,.2,1)}
.mm-sheet-in{display:grid;gap:26px;max-width:560px;margin:0 auto}
.mm-group{margin:0;padding:0}
.mm-gh{margin:0 0 2px;font:500 10.5px/1.4 'Be Vietnam Pro',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#8C8C8C}
.mm-row{display:flex;align-items:center;gap:12px;padding:12px 2px;border-bottom:1px solid #E6E6E6;font:400 15px/1.35 'Be Vietnam Pro',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  color:#262626;animation:mm-in .45s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(.04s + var(--i,0) * .025s)}
.mm-row svg{flex:none;width:18px;height:18px;color:#5C5C5C}
.mm-row[aria-current] svg{color:#0A0A0A}
.mm-row[aria-current] .mm-lt{color:#0A0A0A;text-decoration:underline;text-decoration-color:#9FE870;text-decoration-thickness:2px;text-underline-offset:5px}
.mm-sheet-cta{display:flex;align-items:center;justify-content:center;gap:10px;min-height:50px;border-radius:999px;background:#0A0A0A;
  color:#FFFFFF;font:500 15px/1.2 'Be Vietnam Pro',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;animation:mm-in .45s cubic-bezier(.2,.7,.2,1) .3s both}
.mm-sheet-cta svg{width:18px;height:18px}
html.mm-open body{overflow:hidden}
@keyframes mm-fade{from{opacity:0}to{opacity:1}}
@keyframes mm-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media (max-width:1000px){
  .mm-tops,.mm-ink{display:none}
  .mm{flex:0 0 auto;order:3}
  .mm-burger{display:block}
}
@media (prefers-reduced-motion:reduce){
  .mm *,.mm *::before,.mm *::after{animation:none!important;transition:none!important}
}