/* MB76 P02 — exact visual-language fidelity to approved homepage reference.
   Scoped to .mmb-home-refresh: no navbar, footer, sidebar, or global styles. */
.mmb-home-refresh{--ink:#102647;--teal:#078eaf;--line:#dceaf4;background:#f2f9fc;color:var(--ink);overflow:hidden}
.mmb-home-refresh .mmb-home-container{width:min(1280px,calc(100% - 40px));max-width:1280px;margin-inline:auto}
.mmb-home-refresh .mmb-home-main{padding:0 0 25px;background:linear-gradient(180deg,#eaf9ff 0,#f3f9fc 420px,#f4f9fc 100%)}
.mmb-home-refresh .mmb-home-section{padding:8px 0}
.mmb-home-refresh .mmb-home-panel{border-radius:23px;padding:20px;background:rgba(255,255,255,.96);border:1px solid #e1edf4;box-shadow:0 8px 25px rgba(22,87,120,.075)}
.mmb-home-refresh .mmb-home-heading{display:flex;align-items:center;gap:16px;justify-content:space-between;margin-bottom:15px}
.mmb-home-refresh .mmb-home-heading h2{font-size:23px;color:#172b53;font-weight:850;letter-spacing:-.025em;line-height:1.28;margin:0 0 4px}
.mmb-home-refresh .mmb-home-heading h2 i{color:#0e96b5;font-size:24px}
.mmb-home-refresh .mmb-home-heading p{font-size:13px;color:#6a8297}
.mmb-home-refresh .mmb-home-heading>a{color:#f04448;font-size:13px}
.mmb-home-refresh .mmb-section-note{font-size:12px;text-align:right;max-width:410px;line-height:1.5}
/* hero — full-width seascape as in reference, not the old separate rectangular hero image */
.mmb-home-refresh .mmb-home-hero{position:relative;isolation:isolate;padding:22px 0 28px;background:#d7f3fd;overflow:hidden}
.mmb-home-refresh .mmb-home-hero:before{content:"";position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,rgba(232,248,255,.98) 0%,rgba(227,248,255,.96) 29%,rgba(223,247,253,.72) 49%,rgba(218,245,249,.18) 69%,rgba(35,175,199,.04) 100%),url('/images/mmb-home/region-banners-p07/vung-tau.webp') center 45%/cover no-repeat;filter:saturate(1.16)}
.mmb-home-refresh .mmb-home-hero:after{content:"";position:absolute;inset:auto 0 0;height:100px;z-index:-1;background:linear-gradient(0deg,rgba(119,230,216,.60),rgba(255,255,255,0));pointer-events:none;border-radius:0}
.mmb-home-refresh .mmb-hero-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.93fr);gap:0;min-height:370px;align-items:center}
.mmb-home-refresh .mmb-hero-copy{position:relative;z-index:2;width:calc(100% + 130px);min-width:0;padding:12px 0 6px}
.mmb-home-refresh .mmb-hero-badge{font-size:13px;padding:8px 17px;box-shadow:0 5px 12px rgba(23,97,142,.12)}
.mmb-home-refresh .mmb-hero-title{margin:16px 0 10px;font-size:clamp(33px,3.2vw,49px);line-height:1.08;white-space:nowrap;color:#18244c;letter-spacing:-.035em}
.mmb-home-refresh .mmb-hero-title .accent{margin-top:5px;font-size:clamp(25px,2.45vw,36px);line-height:1.15;white-space:nowrap;background:linear-gradient(90deg,#087b9d,#0f91b7 72%,#1685a1);background-clip:text;-webkit-background-clip:text;color:transparent}
.mmb-home-refresh .mmb-hero-lead{max-width:650px;font-size:15px;color:#354f6a;margin:0 0 16px;line-height:1.6}
.mmb-home-refresh .mmb-hero-search{width:min(100%,785px);grid-template-columns:170px minmax(0,1fr) 130px;border-radius:20px;padding:6px;box-shadow:0 10px 24px rgba(10,87,134,.18)}
.mmb-home-refresh .mmb-hero-search__location,.mmb-home-refresh .mmb-hero-search__input{height:46px;font-size:13px}
.mmb-home-refresh .mmb-hero-search__location{padding-inline:12px}
.mmb-home-refresh .mmb-hero-search__input{padding-inline:12px}
.mmb-home-refresh .mmb-hero-search__input input{font-size:13px;min-width:0}
.mmb-home-refresh .mmb-hero-search__submit{height:46px;border-radius:14px}
.mmb-home-refresh .mmb-hero-tabs{margin-top:12px;gap:11px}
.mmb-home-refresh .mmb-hero-tabs a{min-width:117px;padding:10px 20px;font-size:13px;background:rgba(255,255,255,.88)}
.mmb-home-refresh .mmb-hero-map{position:relative;background:none!important;box-shadow:none!important;border:0!important;border-radius:0!important;min-height:370px;height:370px;overflow:visible;isolation:isolate}
.mmb-home-refresh .mmb-hero-map__bg{display:none}
.mmb-home-refresh .mmb-hero-map__shape{display:block;position:absolute;inset:5px 0 8px auto;width:min(99%,545px);height:95%;z-index:-1;backdrop-filter:none!important;border:0!important;border-radius:0!important;background:none!important;filter:drop-shadow(0 3px 9px rgba(0,106,139,.15))}
.mmb-home-refresh .mmb-hero-pin{z-index:1;white-space:nowrap;gap:6px;padding:6px 12px 6px 6px;max-width:none;font-size:12px;box-shadow:0 5px 13px rgba(12,84,119,.14);border:1px solid rgba(238,253,255,.7)}
.mmb-home-refresh .mmb-hero-pin img{width:33px;height:33px;border-width:2px}
.mmb-home-refresh .mmb-hero-pin--pm{top:8px;left:40px}.mmb-home-refresh .mmb-hero-pin--br{top:102px;left:125px}.mmb-home-refresh .mmb-hero-pin--ld{top:170px;left:52px}.mmb-home-refresh .mmb-hero-pin--vt{top:268px;left:2px}.mmb-home-refresh .mmb-hero-pin--cd{top:34px;right:4px}.mmb-home-refresh .mmb-hero-pin--dd{top:142px;right:6px}.mmb-home-refresh .mmb-hero-pin--xm{top:256px;right:0}
.mmb-home-refresh .mmb-hero-map__center{bottom:15px;left:59%;padding:10px 17px;font-size:12px;white-space:nowrap}
/* Section titles + hero in every one of the 4 pastel cards */
.mmb-home-refresh .mmb-group-shell,.mmb-home-refresh .mmb-category-grid,.mmb-home-refresh .mmb-region-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px}
.mmb-home-refresh .mmb-group-card,.mmb-home-refresh .mmb-category-card{padding:0 10px 10px;gap:0;border-radius:17px;min-width:0;overflow:hidden;box-shadow:0 4px 14px rgba(16,70,113,.07);background:#fff}
.mmb-home-refresh .mmb-group-card:before{display:none}
.mmb-home-refresh .mmb-group-card__top{display:grid;grid-template-columns:minmax(0,1fr) 78px;min-height:82px;gap:5px;align-items:center;padding:12px 4px 9px}
.mmb-home-refresh .mmb-group-card__title{font-size:14px;line-height:1.24;letter-spacing:-.012em;color:#1b2b53}
.mmb-home-refresh .mmb-group-card__title i{font-size:25px;flex-shrink:0}
.mmb-home-refresh .mmb-group-card__desc{font-size:10.5px;line-height:1.3;color:#5f7587}
.mmb-home-refresh .mmb-group-card__thumb{width:84px;height:68px;border:0;border-radius:12px;box-shadow:none}
.mmb-home-refresh .mmb-group-card__thumb img{object-fit:cover;object-position:center}
.mmb-home-refresh .mmb-group-items,.mmb-home-refresh .mmb-category-card .mmb-group-items{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;margin:0}
.mmb-home-refresh .mmb-group-item{min-height:102px;border-radius:12px;padding:8px 3px;gap:7px;border:1px solid rgba(222,230,239,.8);box-shadow:0 2px 5px rgba(25,66,99,.04);background:rgba(255,255,255,.88)!important;min-width:0;transition:transform .16s,box-shadow .16s}
.mmb-home-refresh .mmb-group-item__icon{display:grid;place-items:center;width:33px;height:37px;border-radius:8px;background:transparent;box-shadow:none;font-size:24px;line-height:1.2}
.mmb-home-refresh .mmb-group-item__icon .bi{display:inline-block;font-size:25px;line-height:1;min-width:25px;min-height:25px}
.mmb-home-refresh .mmb-group-item__label{font-size:10.5px;line-height:1.25;font-weight:800;color:#203b55;overflow-wrap:anywhere}
.mmb-home-refresh .mmb-group-card--amber{background:linear-gradient(160deg,#fff3e5,#ffebd9)}
.mmb-home-refresh .mmb-group-card--blue{background:linear-gradient(160deg,#edf3ff,#e8f1ff)}
.mmb-home-refresh .mmb-group-card--green{background:linear-gradient(160deg,#e9fbef,#e0f7ed)}
.mmb-home-refresh .mmb-group-card--purple{background:linear-gradient(160deg,#f4edff,#eee9ff)}
.mmb-home-refresh .mmb-chip-row{margin-top:14px;gap:7px;flex-wrap:wrap;align-items:center}
.mmb-home-refresh .mmb-chip{padding:7px 11px;font-size:11px;box-shadow:0 2px 6px rgba(6,84,132,.04)}
.mmb-home-refresh .mmb-category-card{min-height:0;padding:0 10px 10px}
.mmb-home-refresh .mmb-category-card .mmb-group-card__thumb{position:static;float:right;width:78px;height:67px;margin:9px 0 0 4px}
.mmb-home-refresh .mmb-category-card .mmb-group-card__top{display:block;padding:12px 0 9px;min-height:82px}
.mmb-home-refresh .mmb-category-card .mmb-group-items{clear:both}
.mmb-home-refresh .mmb-category-card .mmb-group-item{min-height:102px;padding:8px 3px}
/* Listings maintain six fixed desktop columns: do not break at 1280px as P01 incorrectly did */
.mmb-home-refresh .mmb-home-listing-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
.mmb-home-refresh .mmb-home-listing-card{border-radius:12px;min-width:0}
.mmb-home-refresh .mmb-home-listing-card__media{aspect-ratio:1.28/1;overflow:hidden}
.mmb-home-refresh .mmb-home-listing-card__media img{width:100%;height:100%;object-fit:cover;display:block}
.mmb-home-refresh .mmb-home-listing-card__body{padding:9px}
.mmb-home-refresh .mmb-home-listing-card__body strong{font-size:12px}
.mmb-home-refresh .mmb-home-listing-card h3{font-size:12px;line-height:1.4}
/* Regions: 4 columns on desktop, 4+3 cards in two rows, 7 subitems max in 4+3 internal columns */
.mmb-home-refresh .mmb-region-grid{gap:12px}
.mmb-home-refresh .mmb-region-card{min-width:0;padding:0 10px 11px;display:flex;flex-direction:column;overflow:hidden;border-radius:18px;box-shadow:0 5px 16px rgba(17,82,119,.08)}
.mmb-home-refresh .mmb-region-card__media{position:relative;display:block;margin:0 -10px 0;height:100px;overflow:hidden;border-radius:17px 17px 0 0}
.mmb-home-refresh .mmb-region-card__media:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(247,252,255,.95) 0%,rgba(247,252,255,.55) 48%,rgba(247,252,255,0) 100%)}
.mmb-home-refresh .mmb-region-card__media img{width:100%;height:100%;object-fit:cover}
.mmb-home-refresh .mmb-region-card__title{position:relative;margin:-80px 0 5px;z-index:1;min-height:28px;font-size:13.5px;line-height:1.22;padding:0 2px;color:#193354;letter-spacing:-.018em}
.mmb-home-refresh .mmb-region-card__title i{font-size:19px;color:#1785c7}
.mmb-home-refresh .mmb-region-card--rose .mmb-region-card__title i{color:#e83c7b}
.mmb-home-refresh .mmb-region-card--green .mmb-region-card__title i{color:#10a870}
.mmb-home-refresh .mmb-region-card--amber .mmb-region-card__title i{color:#f08319}
.mmb-home-refresh .mmb-region-card--violet .mmb-region-card__title i{color:#8a43db}
.mmb-home-refresh .mmb-region-card__desc{position:relative;z-index:1;margin:0 0 36px;font-size:10px;line-height:1.36;min-height:26px;max-width:62%;color:#38546b;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.mmb-home-refresh .mmb-region-card__areas{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;align-content:start;margin-top:auto}
.mmb-home-refresh .mmb-region-pill{display:flex;flex-direction:column;gap:5px;align-items:center;justify-content:center;border-radius:11px;min-width:0;min-height:81px;padding:8px 3px;color:#23405b;background:rgba(255,255,255,.88);font-size:10px;font-weight:750;line-height:1.2;overflow-wrap:anywhere;box-shadow:inset 0 1px 0 #fff}
.mmb-home-refresh .mmb-region-pill i{font-size:19px;line-height:1;color:#188bd0}
.mmb-home-refresh .mmb-region-card--rose .mmb-region-pill i{color:#e83c7b}
.mmb-home-refresh .mmb-region-card--green .mmb-region-pill i{color:#10a870}
.mmb-home-refresh .mmb-region-card--amber .mmb-region-pill i{color:#f08319}
.mmb-home-refresh .mmb-region-card--violet .mmb-region-pill i{color:#8a43db}
.mmb-home-refresh .mmb-region-pill span{display:block;text-align:center}
.mmb-home-refresh .mmb-region-card__cta{width:auto;align-self:flex-end;margin-top:9px;padding:8px 12px;font-size:10.5px;white-space:normal;text-align:center}
/* Images in Tourism and Shop must be landscape, not full-height columns. Root cause: original spans are inline. */
.mmb-home-refresh .mmb-tourism-grid,.mmb-home-refresh .mmb-shop-grid{display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:10px}
.mmb-home-refresh .mmb-tile-card{display:flex!important;flex-direction:column;min-width:0;overflow:hidden;border-radius:12px;box-shadow:0 3px 10px rgba(15,77,121,.08)}
.mmb-home-refresh .mmb-tile-card__media{display:block!important;width:100%;height:auto!important;aspect-ratio:1.8/1;flex:0 0 auto;overflow:hidden}
.mmb-home-refresh .mmb-tile-card__media img{display:block!important;width:100%!important;height:100%!important;object-fit:cover!important}
.mmb-home-refresh .mmb-tile-card__body{display:block!important;padding:10px 9px;flex:1}
.mmb-home-refresh .mmb-tile-card__body b{font-size:12.5px;line-height:1.32}
.mmb-home-refresh .mmb-tile-card__body small{font-size:10.5px;line-height:1.34}
.mmb-home-refresh .mmb-shop-card .mmb-tile-card__body{display:flex!important;flex-direction:column;padding:10px 8px}
.mmb-home-refresh .mmb-shop-btn{display:flex;align-items:center;justify-content:center;margin-top:auto;padding:9px 6px;font-size:11px;border-radius:8px}
/* CTA; original footer remains unchanged */
.mmb-home-refresh .mmb-home-cta{border-radius:16px;padding:14px 24px}
.mmb-home-refresh .mmb-home-cta__icon{height:54px;width:54px;font-size:29px}
.mmb-home-refresh .mmb-home-cta h2{font-size:22px}
.mmb-home-refresh .mmb-home-cta p{font-size:12px}
.mmb-home-refresh .mmb-home-cta a{padding:12px 20px}
/* The background-image and cards are page-local; never touch site header/footer */
@media(max-width:1180px){
 .mmb-home-refresh .mmb-group-shell,.mmb-home-refresh .mmb-category-grid,.mmb-home-refresh .mmb-region-grid{gap:8px}
 .mmb-home-refresh .mmb-group-card__thumb{width:56px;height:52px}
 .mmb-home-refresh .mmb-group-card__top{grid-template-columns:minmax(0,1fr) 56px}
 .mmb-home-refresh .mmb-category-card .mmb-group-card__thumb{width:56px;height:52px}
 .mmb-home-refresh .mmb-hero-title{font-size:clamp(28px,3.1vw,44px)}
 .mmb-home-refresh .mmb-hero-title .accent{font-size:clamp(22px,2.5vw,31px)}
 .mmb-home-refresh .mmb-group-item__label{font-size:9.5px}
 .mmb-home-refresh .mmb-group-item{min-height:96px}
}
@media(max-width:1020px){
 .mmb-home-refresh .mmb-hero-card{grid-template-columns:minmax(0,1fr) minmax(0,.85fr)}
 .mmb-home-refresh .mmb-hero-copy{width:calc(100% + 70px)}
 .mmb-home-refresh .mmb-group-shell,.mmb-home-refresh .mmb-category-grid,.mmb-home-refresh .mmb-region-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .mmb-home-refresh .mmb-home-listing-grid,.mmb-home-refresh .mmb-tourism-grid,.mmb-home-refresh .mmb-shop-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
 .mmb-home-refresh .mmb-group-item__label{font-size:11px}
}
@media(max-width:700px){
 .mmb-home-refresh .mmb-home-container{width:calc(100% - 20px)}
 .mmb-home-refresh .mmb-home-hero{padding:14px 0 18px}
 .mmb-home-refresh .mmb-home-hero:before{background:linear-gradient(180deg,rgba(231,249,253,.98) 0%,rgba(230,250,252,.95) 55%,rgba(213,245,249,.24) 100%),url('/images/mmb-home/region-banners-p07/vung-tau.webp') center/cover}
 .mmb-home-refresh .mmb-hero-card{display:block;min-height:0}
 .mmb-home-refresh .mmb-hero-copy{width:100%;padding:0;min-width:0}
 .mmb-home-refresh .mmb-hero-title{font-size:31px;white-space:normal}
 .mmb-home-refresh .mmb-hero-title .accent{font-size:23px;white-space:normal}
 .mmb-home-refresh .mmb-hero-lead{font-size:13px}
 .mmb-home-refresh .mmb-hero-search{display:grid;grid-template-columns:1fr 112px;gap:0;width:100%}
 .mmb-home-refresh .mmb-hero-search__location{display:none}
 .mmb-home-refresh .mmb-hero-search__input{height:44px}
 .mmb-home-refresh .mmb-hero-search__submit{height:44px}
 .mmb-home-refresh .mmb-hero-tabs{gap:7px}
 .mmb-home-refresh .mmb-hero-tabs a{flex:1 1 calc(50% - 5px);min-width:0;padding:9px 8px;font-size:12px}
 .mmb-home-refresh .mmb-hero-map{margin-top:12px;height:230px;min-height:230px}
 .mmb-home-refresh .mmb-hero-map__shape{width:80%;height:99%;right:6%;top:0}
 .mmb-home-refresh .mmb-hero-pin{font-size:10px;padding:3px 6px 3px 3px}
 .mmb-home-refresh .mmb-hero-pin img{width:23px;height:23px}
 .mmb-home-refresh .mmb-hero-pin--pm{top:0;left:8%}.mmb-home-refresh .mmb-hero-pin--br{top:53px;left:24%}.mmb-home-refresh .mmb-hero-pin--ld{top:102px;left:15%}.mmb-home-refresh .mmb-hero-pin--vt{top:170px;left:0}.mmb-home-refresh .mmb-hero-pin--cd{top:15px;right:3%}.mmb-home-refresh .mmb-hero-pin--dd{top:91px;right:0}.mmb-home-refresh .mmb-hero-pin--xm{top:162px;right:0}
 .mmb-home-refresh .mmb-hero-map__center{bottom:3px;left:50%;font-size:10px;padding:7px 10px}
 .mmb-home-refresh .mmb-home-panel{padding:13px 11px}
 .mmb-home-refresh .mmb-home-heading{align-items:flex-start;gap:5px;flex-wrap:wrap}
 .mmb-home-refresh .mmb-home-heading h2{font-size:19px}
 .mmb-home-refresh .mmb-section-note{text-align:left;font-size:11px}
 .mmb-home-refresh .mmb-group-shell,.mmb-home-refresh .mmb-category-grid,.mmb-home-refresh .mmb-region-grid{grid-template-columns:1fr;gap:10px}
 .mmb-home-refresh .mmb-group-card__top{grid-template-columns:minmax(0,1fr) 80px}
 .mmb-home-refresh .mmb-group-card__thumb{width:80px;height:65px}
 .mmb-home-refresh .mmb-group-item__label{font-size:11px}
 .mmb-home-refresh .mmb-home-listing-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))!important}
 .mmb-home-refresh .mmb-tourism-grid,.mmb-home-refresh .mmb-shop-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 .mmb-home-refresh .mmb-region-card__areas{grid-template-columns:repeat(4,minmax(0,1fr))}
 .mmb-home-refresh .mmb-region-pill{min-height:74px;font-size:10px}
 .mmb-home-refresh .mmb-home-cta{display:flex;flex-direction:column;align-items:flex-start}
 .mmb-home-refresh .mmb-home-cta a{width:100%}
}

/* Self-contained vectors prevent empty mini-tiles if Bootstrap Icons CDN is unavailable. */
.mmb-home-refresh .mmb-home-icon-defs{position:absolute!important;width:0!important;height:0!important;overflow:hidden!important}
.mmb-home-refresh .mmb-group-item__icon .mmb-inline-icon{display:block;width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.mmb-home-refresh .mmb-region-pill .mmb-inline-icon{display:block;width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;color:#168ad0}
.mmb-home-refresh .mmb-region-card--rose .mmb-region-pill .mmb-inline-icon{color:#e83c7b}
.mmb-home-refresh .mmb-region-card--green .mmb-region-pill .mmb-inline-icon{color:#10a870}
.mmb-home-refresh .mmb-region-card--amber .mmb-region-pill .mmb-inline-icon{color:#f08319}
.mmb-home-refresh .mmb-region-card--violet .mmb-region-pill .mmb-inline-icon{color:#8a43db}
