/* micaalu.com theme modern: lớp phủ 13/11/2026 (repo micaalu-web, live-site/redesign/home-2026-11-13/theme/).
   Phần 1: trang chủ mới (#mh, trong main_procate.tpl theme default). Phần 2: điện thoại cho mọi trang (header.tpl có viewport). */

/* 1. Trang chủ */
#mh{--azure:#0A5FAF;--steel:#56626F;--ink:#0E2236;--card:#FFFFFF;--text:#1B2733;--muted:#4A5562;--line:#D9DEE4;--r:10px;color:var(--text);font:15px/1.6 -apple-system,"Segoe UI",Roboto,Arial,sans-serif;padding:4px 0 8px}
#mh *{box-sizing:border-box}
#mh a{color:var(--azure)}
#mh a:focus-visible{outline:3px solid var(--azure);outline-offset:2px}
#mh img{max-width:100%;height:auto;display:block}
#mh h1,#mh h2,#mh h3{line-height:1.3;color:var(--ink);font-weight:700;text-transform:none}
#mh h1{font-size:26px;margin:.2em 0 .4em}
#mh h2{font-size:21px;margin:1.4em 0 .6em}
#mh h3{font-size:16px;margin:.6em 0 .3em}
#mh p{margin:.4em 0}
#mh ul{margin:.3em 0 0;padding-left:1.2em;list-style:disc}
#mh li{margin:.2em 0}
#mh small{color:var(--muted);font-weight:400;font-size:13px}
#mh .hero{display:grid;gap:14px;grid-template-columns:1fr;align-items:center}
#mh .heroimg{border-radius:var(--r);aspect-ratio:4/3;object-fit:cover;width:100%}
#mh .chips{list-style:none;padding:0;margin:.8em 0 0;display:flex;flex-wrap:wrap;gap:8px}
#mh .chips li{background:#E3EEF8;color:var(--ink);border-radius:999px;padding:5px 12px;font-size:13px;margin:0}
#mh .grid,#mh .grid3{display:grid;gap:12px;grid-template-columns:1fr}
#mh .cat,#mh .proj{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:12px}
#mh .cat img{border-radius:6px;aspect-ratio:4/3;object-fit:cover;width:100%}
#mh .cat li a{display:inline-block;min-height:30px}
#mh .cat.txt{border-top:4px solid var(--steel)}
#mh .price{display:block;color:var(--steel);font-size:13px;font-weight:600}
#mh .spec,#mh .bai{font-size:14px;line-height:1.5}
#mh .rest{margin:1em 0 0;line-height:1.9}
#mh .rest a{white-space:nowrap}
#mh .strip .row{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
#mh .strip figure{margin:0}
#mh .strip img{border-radius:6px;aspect-ratio:4/3;object-fit:cover;width:100%}
#mh figcaption{font-size:13px;color:var(--muted);margin-top:4px;line-height:1.4}
#mh .proj{border-top:4px solid var(--azure)}
#mh .proj .big{font-size:24px;font-weight:800;color:var(--azure);margin:0;line-height:1.2}
#mh .mat{color:var(--steel);font-weight:600}
#mh .more{font-weight:700}
@media (min-width:600px){#mh .grid{grid-template-columns:repeat(2,1fr)}#mh .grid3{grid-template-columns:repeat(3,1fr)}#mh .strip .row{grid-template-columns:repeat(3,1fr)}}
@media (min-width:820px){#mh .hero{grid-template-columns:1.05fr 1fr}#mh .grid{grid-template-columns:repeat(3,1fr)}#mh .strip .row{grid-template-columns:repeat(5,1fr)}#mh h1{font-size:28px}}

/* 2. Điện thoại, mọi trang (khung cũ rộng cố định 1170px) */
@media (max-width:1000px){
  body{background:#fff!important}
  .wrapper,#footer{width:auto!important;box-shadow:none!important}
  .topbar{display:none!important}
  .header{margin-top:0!important;height:auto!important;min-height:64px;background:#fff!important}
  .logo{position:static!important;width:auto!important;height:auto!important;padding:10px 12px}
  .logo img{height:auto!important;max-height:56px;width:auto;max-width:100%}
  .topadv{display:none!important}
  .main{margin:0 12px 10px!important}
  .col-a1,.col-a2,.col-b1,.col-b2,.col-b3{float:none!important;width:auto!important;margin-right:0!important}
  .ddsmoothmenu ul{display:flex;flex-wrap:wrap}
  .ddsmoothmenu ul li{float:none!important}
  .ddsmoothmenu ul li a{min-height:44px;line-height:24px!important;padding:10px 12px!important}
  img{max-width:100%;height:auto}
  table{max-width:100%}
  .col-a1 table{display:block;overflow-x:auto}
  iframe,video{max-width:100%}
  #footer *{max-width:100%}
  .items{width:50%!important;box-sizing:border-box}
  .items img{max-width:100%!important;height:auto!important}
  .items_content,.content_top,.items_content *{max-width:100%;box-sizing:border-box;overflow-wrap:anywhere}
  #detail .image-demo{float:none!important;display:block!important;width:auto!important;position:relative}
  #detail .image-demo img{width:100%!important;height:auto!important;box-sizing:border-box}
  #detail .info_product{float:none!important;width:auto!important;margin-left:0!important;padding-left:0!important;clear:both}
  #detail .info_product p{clear:both}
  .sb-cta{font-size:16px!important}
  body{padding-bottom:110px}
}
