/* ==========================================================
   HEALTH GOLD — Front-end template
   Phong cách tham chiếu: SquareMeal (UK restaurant & venue guide)
   Toàn bộ màu / spacing / chữ dùng token — không hard-code hex trong component
   ========================================================== */

:root{
  /* ---- Font ---- */
  --font-primary: "Be Vietnam Pro", "brandon-grotesque", system-ui, sans-serif;
  --font-display: "Josefin Sans", "Be Vietnam Pro", sans-serif;

  /* ---- Typography scale ---- */
  --fs-xs: 12px; --fs-sm: 13px; --fs-md: 14px; --fs-lg: 15px;
  --fs-xl: 16px; --fs-2xl: 18px; --fs-3xl: 21px; --fs-4xl: 26px;
  --fs-5xl: clamp(28px, 4vw, 40px); --fs-6xl: clamp(34px, 6vw, 64px);
  --fw-regular: 400; --fw-medium: 500; --fw-semibold: 600; --fw-bold: 700;
  --lh-tight: 1.15; --lh-base: 1.55;

  /* ---- Color (semantic) ---- */
  --color-text-primary: #383838;
  --color-text-strong: #222222;
  --color-text-muted: #6b6b6b;
  --color-text-inverse: #ffffff;
  --color-surface-base: #ffffff;
  --color-surface-soft: #f6f4f1;
  --color-surface-dark: #000000;
  --color-surface-strong: #343a40;
  --color-brand: #f1607c;          /* hồng chủ đạo kiểu SquareMeal */
  --color-brand-strong: #c8314f;   /* dùng cho text/nút cần tương phản AA trên nền trắng */
  --color-gold: #c9a227;           /* Health Gold — huy hiệu điểm/giải */
  --color-gold-soft: #f7efd4;
  --color-border: #e3e0db;
  --color-focus: #1a73e8;
  --color-error: #b3261e;
  --color-success: #1e7a46;

  /* ---- Spacing ---- */
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px;
  --space-5: 24px; --space-6: 32px; --space-7: 48px; --space-8: 64px; --space-9: 96px;

  /* ---- Radius / shadow / motion ---- */
  --radius-xs: 3px; --radius-md: 4px; --radius-lg: 12px; --radius-pill: 160px;
  --shadow-1: rgba(0,0,0,.2) 0 1px 1px 0;
  --shadow-2: rgba(0,0,0,.5) 0 1px 6px 0;
  --shadow-3: 0 12px 32px rgba(0,0,0,.12);
  --dur-instant: 150ms; --dur-fast: 200ms; --ease: cubic-bezier(.2,.7,.3,1);

  --container: 1240px;
  --header-h: 64px;
}

/* ---------- Reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font-primary);font-size:var(--fs-xl);line-height:var(--lh-base);color:var(--color-text-primary);background:var(--color-surface-base);font-weight:var(--fw-regular)}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,h4{margin:0;color:var(--color-text-strong);line-height:var(--lh-tight)}
p{margin:0 0 var(--space-4)}
ul{margin:0;padding:0;list-style:none}
:focus-visible{outline:3px solid var(--color-focus);outline-offset:2px;border-radius:var(--radius-xs)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip-link{position:absolute;left:var(--space-4);top:-60px;background:var(--color-surface-dark);color:var(--color-text-inverse);padding:var(--space-2) var(--space-4);z-index:200;border-radius:var(--radius-md)}
.skip-link:focus{top:var(--space-2)}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.container{max-width:var(--container);margin:0 auto;padding:0 var(--space-4)}
@media (min-width:768px){.container{padding:0 var(--space-5)}}

/* ---------- Kicker / heading ---------- */
.kicker{font-family:var(--font-display);text-transform:uppercase;letter-spacing:.12em;font-size:var(--fs-sm);font-weight:var(--fw-bold);color:var(--color-brand-strong)}
.h-display{font-family:var(--font-display);text-transform:uppercase;letter-spacing:.02em;font-weight:var(--fw-bold)}
.section{padding:var(--space-8) 0}
.section--soft{background:var(--color-surface-soft)}
.section--dark{background:var(--color-surface-dark);color:var(--color-text-inverse)}
.section--dark h2,.section--dark h3{color:var(--color-text-inverse)}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--space-4);margin-bottom:var(--space-5);flex-wrap:wrap}
.section-head h2{font-family:var(--font-display);text-transform:uppercase;font-size:var(--fs-5xl);letter-spacing:.01em}
.section-head p{margin:var(--space-2) 0 0;color:var(--color-text-muted);max-width:60ch}
.section--dark .section-head p{color:rgba(255,255,255,.75)}

/* ---------- Buttons ---------- */
.btn{white-space:nowrap;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:44px;padding:0 var(--space-5);border-radius:var(--radius-md);border:2px solid transparent;font-weight:var(--fw-semibold);font-size:var(--fs-md);text-transform:uppercase;letter-spacing:.06em;cursor:pointer;transition:background var(--dur-fast) var(--ease),color var(--dur-fast),border-color var(--dur-fast),transform var(--dur-instant)}
.btn:active{transform:translateY(1px)}
.btn--primary{background:var(--color-brand-strong);color:var(--color-text-inverse)}
.btn--primary:hover{background:var(--color-surface-dark)}
.btn--dark{background:var(--color-surface-dark);color:var(--color-text-inverse)}
.btn--dark:hover{background:var(--color-brand-strong)}
.btn--outline{border-color:currentColor;background:transparent}
.btn--outline:hover{background:var(--color-surface-dark);color:var(--color-text-inverse);border-color:var(--color-surface-dark)}
.btn--block{width:100%}
.btn[disabled],.btn[aria-disabled="true"]{opacity:.45;cursor:not-allowed;transform:none}
.btn.is-loading{color:transparent!important;position:relative;pointer-events:none}
.btn.is-loading::after{content:"";position:absolute;width:18px;height:18px;border:2px solid var(--color-text-inverse);border-right-color:transparent;border-radius:50%;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.link-more{font-weight:var(--fw-semibold);font-size:var(--fs-md);text-transform:uppercase;letter-spacing:.08em;border-bottom:2px solid var(--color-brand);padding-bottom:2px;white-space:nowrap}
.link-more:hover{color:var(--color-brand-strong)}

/* ---------- Topbar + Header ---------- */
.topbar{background:var(--color-brand);color:var(--color-surface-dark);font-size:var(--fs-sm);font-weight:var(--fw-semibold);text-align:center;padding:6px var(--space-4)}
.topbar a{text-decoration:underline}
.header{position:sticky;top:0;z-index:100;background:var(--color-surface-dark);color:var(--color-text-inverse)}
.header__inner{display:flex;align-items:center;gap:var(--space-5);height:var(--header-h)}
.logo{display:flex;align-items:center;gap:10px;font-family:var(--font-display);font-weight:var(--fw-bold);font-size:22px;text-transform:uppercase;letter-spacing:.06em;white-space:nowrap}
.logo__mark{width:34px;height:34px;border-radius:50%;background:var(--color-gold);color:var(--color-surface-dark);display:grid;place-items:center;font-size:15px;letter-spacing:0}
.logo b{color:var(--color-gold)}
.nav{display:none;gap:var(--space-1);flex:1}
.nav a{padding:var(--space-2) var(--space-3);font-size:var(--fs-md);font-weight:var(--fw-semibold);text-transform:uppercase;letter-spacing:.06em;border-bottom:3px solid transparent}
.nav a:hover,.nav a[aria-current="page"]{border-bottom-color:var(--color-brand)}
.header__actions{margin-left:auto;display:flex;align-items:center;gap:var(--space-2)}
.icon-btn{width:44px;height:44px;display:grid;place-items:center;border-radius:50%;background:transparent;border:0;color:inherit;cursor:pointer;transition:background var(--dur-fast)}
.icon-btn:hover{background:rgba(255,255,255,.12)}
.icon-btn svg{width:22px;height:22px}
.header .btn--primary{display:none}
@media (min-width:1024px){.nav{display:flex}.menu-toggle{display:none}.header .btn--primary{display:inline-flex;min-height:38px}}

/* Mobile drawer */
.drawer{position:fixed;inset:0;z-index:150;visibility:hidden}
.drawer__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.5);opacity:0;transition:opacity var(--dur-fast)}
.drawer__panel{position:absolute;top:0;left:0;bottom:0;width:min(86vw,360px);background:var(--color-surface-dark);color:var(--color-text-inverse);padding:var(--space-5);transform:translateX(-100%);transition:transform var(--dur-fast) var(--ease);overflow:auto}
.drawer.is-open{visibility:visible}
.drawer.is-open .drawer__backdrop{opacity:1}
.drawer.is-open .drawer__panel{transform:none}
.drawer__panel nav a{display:block;padding:var(--space-3) 0;border-bottom:1px solid rgba(255,255,255,.12);font-weight:var(--fw-semibold);text-transform:uppercase;letter-spacing:.06em}
.drawer__close{margin-left:auto;display:flex}

/* Search overlay */
.search-overlay{position:fixed;inset:0;z-index:160;background:rgba(0,0,0,.92);color:var(--color-text-inverse);display:none;padding:var(--space-8) var(--space-4)}
.search-overlay.is-open{display:block}
.search-overlay form{max-width:760px;margin:0 auto}
.search-overlay input{width:100%;background:transparent;border:0;border-bottom:2px solid var(--color-brand);font-size:var(--fs-5xl);padding:var(--space-3) 0;color:var(--color-text-inverse)}
.search-overlay input::placeholder{color:rgba(255,255,255,.5)}
.search-overlay__close{position:absolute;top:var(--space-4);right:var(--space-4)}
.chips{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-top:var(--space-5)}
.chip{display:inline-flex;align-items:center;min-height:36px;padding:0 var(--space-4);border-radius:var(--radius-pill);border:1px solid currentColor;font-size:var(--fs-sm);font-weight:var(--fw-semibold);background:transparent;cursor:pointer;transition:background var(--dur-fast),color var(--dur-fast)}
.chip:hover,.chip[aria-pressed="true"]{background:var(--color-surface-dark);color:var(--color-text-inverse);border-color:var(--color-surface-dark)}
.search-overlay .chip:hover{background:var(--color-brand);border-color:var(--color-brand);color:var(--color-surface-dark)}

/* ---------- Hero ---------- */
.hero{position:relative;min-height:clamp(480px,78vh,720px);display:flex;align-items:flex-end;color:var(--color-text-inverse);overflow:hidden}
.hero__media{position:absolute;inset:0}
.hero__media img{width:100%;height:100%;object-fit:cover}
.hero__media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.15) 0%,rgba(0,0,0,.2) 40%,rgba(0,0,0,.82) 100%)}
.hero__content{position:relative;padding-bottom:var(--space-7);width:100%}
.hero h1{color:var(--color-text-inverse);font-family:var(--font-display);text-transform:uppercase;font-size:var(--fs-6xl);max-width:16ch;letter-spacing:.01em}
.hero p.lead{font-size:var(--fs-2xl);max-width:52ch;margin:var(--space-4) 0 var(--space-5);color:rgba(255,255,255,.9)}
.hero .kicker{color:var(--color-brand)}

/* Search box (hero) */
.finder{background:var(--color-surface-base);color:var(--color-text-primary);border-radius:var(--radius-md);box-shadow:var(--shadow-3);display:grid;grid-template-columns:1fr;gap:1px;overflow:hidden;max-width:920px}
.finder__field{display:flex;flex-direction:column;padding:var(--space-3) var(--space-4);background:var(--color-surface-base)}
.finder__field label{font-size:var(--fs-xs);font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.1em;color:var(--color-text-muted)}
.finder__field input,.finder__field select{border:0;padding:4px 0;font-size:var(--fs-xl);background:transparent;min-height:32px;outline-offset:4px}
.finder .btn{border-radius:0;min-height:56px}
@media (min-width:768px){.finder{grid-template-columns:2fr 1.2fr 1.2fr auto;background:var(--color-border)}.finder .btn{min-height:100%}}

/* ---------- Category tiles ---------- */
.cat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-3)}
@media (min-width:768px){.cat-grid{grid-template-columns:repeat(3,1fr)}}
@media (min-width:1024px){.cat-grid{grid-template-columns:repeat(6,1fr)}}
.cat{position:relative;aspect-ratio:3/4;border-radius:var(--radius-md);overflow:hidden;color:var(--color-text-inverse);display:flex;align-items:flex-end;padding:var(--space-4)}
.cat img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.cat::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(0,0,0,.8))}
.cat span{position:relative;z-index:1;font-family:var(--font-display);text-transform:uppercase;font-weight:var(--fw-bold);font-size:var(--fs-2xl);letter-spacing:.04em}
.cat small{display:block;font-family:var(--font-primary);text-transform:none;font-weight:var(--fw-medium);font-size:var(--fs-sm);letter-spacing:0;opacity:.85}
.cat:hover img{transform:scale(1.06)}

/* ---------- Venue card ---------- */
.grid{display:grid;gap:var(--space-5)}
.grid--4{grid-template-columns:1fr}
.grid--3{grid-template-columns:1fr}
@media (min-width:640px){.grid--4,.grid--3{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1024px){.grid--4{grid-template-columns:repeat(4,1fr)}.grid--3{grid-template-columns:repeat(3,1fr)}}

.card{position:relative;display:flex;flex-direction:column;background:var(--color-surface-base);border-radius:var(--radius-md);transition:box-shadow var(--dur-fast),transform var(--dur-fast)}
.card__media{position:relative;aspect-ratio:4/3;border-radius:var(--radius-md);overflow:hidden;background:var(--color-surface-soft)}
.card__media img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.card:hover .card__media img{transform:scale(1.05)}
.card__body{padding:var(--space-3) 0 0;display:flex;flex-direction:column;gap:6px;flex:1}
.card__meta{font-size:var(--fs-xs);font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.1em;color:var(--color-text-muted)}
.card__title{font-size:var(--fs-3xl);font-weight:var(--fw-bold);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.card__title a::after{content:"";position:absolute;inset:0;z-index:1}  /* toàn card click được */
.card__title a:focus-visible{outline:none}
.card:focus-within{outline:3px solid var(--color-focus);outline-offset:4px}
.card__desc{font-size:var(--fs-md);color:var(--color-text-muted);margin:0;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.card__foot{display:flex;align-items:center;gap:var(--space-3);font-size:var(--fs-sm);margin-top:auto;padding-top:var(--space-2)}
.price{font-weight:var(--fw-bold);letter-spacing:.05em}
.price i{font-style:normal;color:var(--color-border)}

/* Score badge (giống "SquareMeal score") */
.score{position:absolute;left:var(--space-3);top:var(--space-3);z-index:2;width:52px;height:52px;border-radius:50%;background:var(--color-gold);color:var(--color-surface-dark);display:grid;place-items:center;text-align:center;font-weight:var(--fw-bold);font-size:var(--fs-2xl);line-height:1;box-shadow:var(--shadow-2)}
.score small{display:block;font-size:8px;letter-spacing:.08em;text-transform:uppercase;margin-top:-6px}
.badge{display:inline-flex;align-items:center;gap:4px;padding:3px var(--space-2);border-radius:var(--radius-xs);font-size:var(--fs-xs);font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.08em;background:var(--color-surface-dark);color:var(--color-text-inverse)}
.badge--gold{background:var(--color-gold-soft);color:var(--color-surface-dark)}
.badge--pink{background:var(--color-brand);color:var(--color-surface-dark)}
.card__badges{position:absolute;right:var(--space-3);bottom:var(--space-3);z-index:2;display:flex;gap:4px;flex-wrap:wrap;justify-content:flex-end}

/* Favourite (tim) */
.fav{position:absolute;right:var(--space-3);top:var(--space-3);z-index:3;width:40px;height:40px;border-radius:50%;border:0;background:rgba(255,255,255,.95);display:grid;place-items:center;cursor:pointer;box-shadow:var(--shadow-1);transition:transform var(--dur-instant)}
.fav svg{width:20px;height:20px;fill:none;stroke:var(--color-text-strong);stroke-width:2}
.fav:hover{transform:scale(1.08)}
.fav[aria-pressed="true"] svg{fill:var(--color-brand);stroke:var(--color-brand)}

/* Rating stars */
.stars{display:inline-flex;align-items:center;gap:2px;color:var(--color-gold)}
.stars svg{width:14px;height:14px;fill:currentColor}
.rating-text{font-weight:var(--fw-semibold);color:var(--color-text-strong)}

/* ---------- Editorial feature (split) ---------- */
.feature{display:grid;gap:var(--space-5);align-items:center}
@media (min-width:900px){.feature{grid-template-columns:1.2fr 1fr;gap:var(--space-7)}}
.feature__media{border-radius:var(--radius-md);overflow:hidden;aspect-ratio:4/3}
.feature__media img{width:100%;height:100%;object-fit:cover}
.feature h2{font-family:var(--font-display);text-transform:uppercase;font-size:var(--fs-5xl);margin:var(--space-3) 0}
.feature ol{counter-reset:n;margin:var(--space-4) 0 var(--space-5);padding:0;list-style:none}
.feature li{counter-increment:n;display:flex;gap:var(--space-3);padding:var(--space-3) 0;border-bottom:1px solid var(--color-border);font-weight:var(--fw-semibold)}
.feature li::before{content:counter(n,decimal-leading-zero);color:var(--color-brand-strong);font-family:var(--font-display);font-weight:var(--fw-bold)}
.section--dark .feature li{border-color:rgba(255,255,255,.15)}
.section--dark .feature li::before{color:var(--color-brand)}

/* ---------- Horizontal scroller ---------- */
.scroller{display:grid;grid-auto-flow:column;grid-auto-columns:80%;gap:var(--space-4);overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:var(--space-3);scrollbar-width:thin}
.scroller>*{scroll-snap-align:start}
@media (min-width:640px){.scroller{grid-auto-columns:45%}}
@media (min-width:1024px){.scroller{grid-auto-columns:calc((100% - 3*var(--space-4))/4)}}
.scroller-nav{display:flex;gap:var(--space-2)}
.scroller-nav button{width:44px;height:44px;border-radius:50%;border:1px solid var(--color-border);background:var(--color-surface-base);cursor:pointer;display:grid;place-items:center}
.scroller-nav button:hover{background:var(--color-surface-dark);color:var(--color-text-inverse)}
.scroller-nav button[disabled]{opacity:.35;cursor:not-allowed}

/* ---------- Awards banner ---------- */
.awards{position:relative;border-radius:var(--radius-lg);overflow:hidden;color:var(--color-text-inverse);padding:var(--space-8) var(--space-5);text-align:center}
.awards img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.awards::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.65)}
.awards>*:not(img){position:relative;z-index:1}
.awards h2{color:var(--color-gold);font-family:var(--font-display);text-transform:uppercase;font-size:var(--fs-6xl)}
.awards p{max-width:56ch;margin:var(--space-4) auto var(--space-5)}

/* ---------- Article cards ---------- */
.post{display:flex;flex-direction:column;gap:var(--space-3);position:relative}
.post__media{aspect-ratio:16/10;border-radius:var(--radius-md);overflow:hidden}
.post__media img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.post:hover img{transform:scale(1.05)}
.post h3{font-size:var(--fs-3xl)}
.post h3 a::after{content:"";position:absolute;inset:0}

/* ---------- Newsletter ---------- */
.newsletter{display:grid;gap:var(--space-5);align-items:center}
@media (min-width:900px){.newsletter{grid-template-columns:1fr 1fr}}
.newsletter h2{font-family:var(--font-display);text-transform:uppercase;font-size:var(--fs-5xl)}
.form-row{display:flex;gap:var(--space-2);flex-wrap:wrap}
.input{flex:1;min-width:220px;min-height:48px;padding:0 var(--space-4);border:2px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface-base);transition:border-color var(--dur-fast)}
.input:hover{border-color:var(--color-text-muted)}
.input:focus-visible{border-color:var(--color-surface-dark);outline:3px solid var(--color-focus);outline-offset:1px}
.input[aria-invalid="true"]{border-color:var(--color-error)}
.input:disabled{background:var(--color-surface-soft);cursor:not-allowed}
.field-msg{font-size:var(--fs-sm);margin-top:var(--space-2);min-height:1.4em}
.field-msg.is-error{color:var(--color-error)}
.field-msg.is-success{color:var(--color-success)}
.section--dark .input{background:transparent;color:var(--color-text-inverse);border-color:rgba(255,255,255,.4)}
.section--dark .field-msg.is-error{color:var(--color-brand)}
.section--dark .field-msg.is-success{color:var(--color-gold)}

/* ---------- Footer ---------- */
.footer{background:var(--color-surface-dark);color:rgba(255,255,255,.8);padding:var(--space-8) 0 var(--space-5);font-size:var(--fs-md)}
.footer__grid{display:grid;gap:var(--space-6);grid-template-columns:1fr 1fr}
@media (min-width:900px){.footer__grid{grid-template-columns:1.6fr repeat(4,1fr)}}
.footer__brand{grid-column:1/-1}
@media (min-width:900px){.footer__brand{grid-column:auto}}
.footer h4{color:var(--color-text-inverse);font-size:var(--fs-sm);text-transform:uppercase;letter-spacing:.12em;margin-bottom:var(--space-3)}
.footer li{margin-bottom:var(--space-2)}
.footer a:hover{color:var(--color-brand)}
.footer__bottom{border-top:1px solid rgba(255,255,255,.15);margin-top:var(--space-7);padding-top:var(--space-4);display:flex;justify-content:space-between;flex-wrap:wrap;gap:var(--space-3);font-size:var(--fs-sm)}
.socials{display:flex;gap:var(--space-2);margin-top:var(--space-4)}
.socials a{width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.3);display:grid;place-items:center}
.socials a:hover{background:var(--color-brand);border-color:var(--color-brand);color:var(--color-surface-dark)}
.socials svg{width:18px;height:18px;fill:currentColor}

/* ==========================================================
   LISTING PAGE
   ========================================================== */
.page-head{background:var(--color-surface-soft);padding:var(--space-6) 0 var(--space-5)}
.breadcrumb{font-size:var(--fs-sm);color:var(--color-text-muted);display:flex;flex-wrap:wrap;gap:6px}
.breadcrumb a:hover{color:var(--color-brand-strong);text-decoration:underline}
.breadcrumb li+li::before{content:"/";margin-right:6px}
.page-head h1{font-family:var(--font-display);text-transform:uppercase;font-size:var(--fs-5xl);margin:var(--space-3) 0 var(--space-2)}
.page-head p{color:var(--color-text-muted);max-width:70ch;margin:0}

.filterbar{position:sticky;top:var(--header-h);z-index:50;background:var(--color-surface-base);border-bottom:1px solid var(--color-border);padding:var(--space-3) 0}
.filterbar__inner{display:flex;gap:var(--space-2);overflow-x:auto;scrollbar-width:none;align-items:center}
.filterbar__inner::-webkit-scrollbar{display:none}
.filterbar .chip{flex:0 0 auto}
.select{min-height:36px;border:1px solid var(--color-text-strong);border-radius:var(--radius-pill);padding:0 var(--space-5) 0 var(--space-4);font-size:var(--fs-sm);font-weight:var(--fw-semibold);background:var(--color-surface-base) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23222' stroke-width='1.6' fill='none'/%3E%3C/svg%3E") no-repeat right 12px center;appearance:none;cursor:pointer;flex:0 0 auto}

.listing{display:grid;gap:var(--space-6);padding-top:var(--space-6);padding-bottom:var(--space-8)}
@media (min-width:1024px){.listing{grid-template-columns:1fr 380px}}
.result-bar{display:flex;justify-content:space-between;align-items:center;gap:var(--space-3);margin-bottom:var(--space-4);flex-wrap:wrap;font-size:var(--fs-md)}
.result-bar strong{color:var(--color-text-strong)}

.row-card{display:grid;grid-template-columns:1fr;gap:var(--space-4);padding:var(--space-5) 0;border-bottom:1px solid var(--color-border);position:relative}
@media (min-width:640px){.row-card{grid-template-columns:260px 1fr}}
.row-card .card__media{aspect-ratio:4/3}
.row-card .card__title{font-size:var(--fs-4xl)}
.row-card__tags{display:flex;flex-wrap:wrap;gap:6px}
.row-card__actions{display:flex;gap:var(--space-2);margin-top:var(--space-3);position:relative;z-index:2}
.row-card__actions .btn{min-height:40px;padding:0 var(--space-4)}

.map-panel{position:sticky;top:calc(var(--header-h) + 72px);height:calc(100vh - var(--header-h) - 96px);border-radius:var(--radius-md);overflow:hidden;background:var(--color-surface-soft);display:none}
@media (min-width:1024px){.map-panel{display:block}}
.map-panel svg{width:100%;height:100%}
.map-pin{cursor:pointer}
.map-pin circle{fill:var(--color-surface-dark);stroke:var(--color-text-inverse);stroke-width:2;transition:fill var(--dur-fast)}
.map-pin text{fill:var(--color-text-inverse);font-size:11px;font-weight:700;text-anchor:middle;pointer-events:none}
.map-pin.is-active circle,.map-pin:hover circle{fill:var(--color-brand-strong)}

.empty{text-align:center;padding:var(--space-8) var(--space-4);border:2px dashed var(--color-border);border-radius:var(--radius-lg)}
.empty h3{margin-bottom:var(--space-2)}
.pagination{display:flex;justify-content:center;gap:var(--space-2);margin-top:var(--space-6)}
.pagination a,.pagination span{min-width:44px;height:44px;display:grid;place-items:center;border-radius:var(--radius-md);border:1px solid var(--color-border);font-weight:var(--fw-semibold)}
.pagination a:hover{border-color:var(--color-surface-dark)}
.pagination [aria-current="page"]{background:var(--color-surface-dark);color:var(--color-text-inverse);border-color:var(--color-surface-dark)}

/* Skeleton loading */
.skeleton{background:linear-gradient(90deg,var(--color-surface-soft) 25%,var(--color-border) 50%,var(--color-surface-soft) 75%);background-size:200% 100%;animation:shimmer 1.2s infinite;border-radius:var(--radius-md)}
@keyframes shimmer{to{background-position:-200% 0}}

/* ==========================================================
   DETAIL PAGE
   ========================================================== */
.gallery{display:grid;gap:var(--space-2);grid-template-columns:1fr;margin-top:var(--space-4)}
.gallery a{border-radius:var(--radius-md);overflow:hidden;position:relative;display:block}
.gallery img{width:100%;height:100%;object-fit:cover;transition:transform .4s var(--ease)}
.gallery a:hover img{transform:scale(1.04)}
.gallery a:first-child{aspect-ratio:4/3}
.gallery a:not(:first-child){display:none}
@media (min-width:768px){
  .gallery{grid-template-columns:2fr 1fr 1fr;grid-template-rows:220px 220px}
  .gallery a:first-child{grid-row:1/3;aspect-ratio:auto}
  .gallery a:not(:first-child){display:block}
}
.gallery__more{position:absolute;inset:0;background:rgba(0,0,0,.55);color:var(--color-text-inverse);display:grid;place-items:center;font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.08em}

.venue-head{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--space-4);flex-wrap:wrap;margin-top:var(--space-5)}
.venue-head h1{font-family:var(--font-display);text-transform:uppercase;font-size:var(--fs-5xl)}
.venue-head__meta{display:flex;flex-wrap:wrap;gap:var(--space-3);align-items:center;margin-top:var(--space-2);font-size:var(--fs-md);color:var(--color-text-muted)}
.venue-head__meta>*+*::before{content:"·";margin-right:var(--space-3);color:var(--color-border)}
.score--lg{position:static;width:76px;height:76px;font-size:30px;flex:0 0 auto}
.score--lg small{font-size:10px}

.detail{display:grid;gap:var(--space-7);padding-top:var(--space-6);padding-bottom:var(--space-8)}
@media (min-width:1024px){.detail{grid-template-columns:1fr 360px}}
.tabs{display:flex;gap:var(--space-1);border-bottom:1px solid var(--color-border);overflow-x:auto;position:sticky;top:var(--header-h);background:var(--color-surface-base);z-index:40}
.tabs a{padding:var(--space-3) var(--space-4);font-weight:var(--fw-semibold);font-size:var(--fs-md);text-transform:uppercase;letter-spacing:.06em;white-space:nowrap;border-bottom:3px solid transparent}
.tabs a:hover,.tabs a.is-active{border-bottom-color:var(--color-brand)}
.block{padding:var(--space-6) 0;border-bottom:1px solid var(--color-border);scroll-margin-top:calc(var(--header-h) + 60px)}
.block h2{font-family:var(--font-display);text-transform:uppercase;font-size:var(--fs-4xl);margin-bottom:var(--space-4)}
.verdict{background:var(--color-gold-soft);border-left:4px solid var(--color-gold);padding:var(--space-4) var(--space-5);border-radius:0 var(--radius-md) var(--radius-md) 0;font-size:var(--fs-2xl);font-weight:var(--fw-medium);color:var(--color-text-strong)}
.facts{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:var(--space-3)}
.fact{display:flex;gap:var(--space-3);align-items:center;font-size:var(--fs-md)}
.fact svg{width:22px;height:22px;flex:0 0 auto;color:var(--color-brand-strong)}
.readmore{position:relative;max-height:220px;overflow:hidden;transition:max-height var(--dur-fast)}
.readmore:not(.is-open)::after{content:"";position:absolute;left:0;right:0;bottom:0;height:80px;background:linear-gradient(transparent,var(--color-surface-base))}
.readmore.is-open{max-height:none}
.btn-text{background:none;border:0;padding:var(--space-2) 0;font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.08em;font-size:var(--fs-sm);cursor:pointer;border-bottom:2px solid var(--color-brand)}

.menu-list{display:grid;gap:var(--space-3)}
.menu-item{display:flex;justify-content:space-between;gap:var(--space-4);padding-bottom:var(--space-3);border-bottom:1px dashed var(--color-border)}
.menu-item h4{font-size:var(--fs-xl)}
.menu-item p{font-size:var(--fs-sm);color:var(--color-text-muted);margin:2px 0 0}
.menu-item b{white-space:nowrap}

.score-break{display:grid;gap:var(--space-3)}
.bar{display:grid;grid-template-columns:120px 1fr 32px;gap:var(--space-3);align-items:center;font-size:var(--fs-md)}
.bar__track{height:8px;background:var(--color-surface-soft);border-radius:var(--radius-pill);overflow:hidden}
.bar__fill{height:100%;background:var(--color-gold);border-radius:inherit}

.review{padding:var(--space-4) 0;border-bottom:1px solid var(--color-border)}
.review__head{display:flex;gap:var(--space-3);align-items:center;margin-bottom:var(--space-2)}
.avatar{width:44px;height:44px;border-radius:50%;background:var(--color-surface-strong);color:var(--color-text-inverse);display:grid;place-items:center;font-weight:var(--fw-bold)}
.review__name{font-weight:var(--fw-bold);color:var(--color-text-strong)}
.review__date{font-size:var(--fs-sm);color:var(--color-text-muted)}

/* Booking widget */
.booking{position:sticky;top:calc(var(--header-h) + var(--space-4));border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-3);overflow:hidden;align-self:start}
.booking__head{background:var(--color-surface-dark);color:var(--color-text-inverse);padding:var(--space-4) var(--space-5)}
.booking__head h2{color:var(--color-text-inverse);font-family:var(--font-display);text-transform:uppercase;font-size:var(--fs-3xl)}
.booking__head p{margin:4px 0 0;font-size:var(--fs-sm);opacity:.8}
.booking form{padding:var(--space-5);display:grid;gap:var(--space-4)}
.booking label{font-size:var(--fs-xs);font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.1em;display:block;margin-bottom:6px}
.booking .input{width:100%;min-width:0}
.slots{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-2)}
.slot{min-height:40px;border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface-base);font-weight:var(--fw-semibold);font-size:var(--fs-sm);cursor:pointer;transition:all var(--dur-fast)}
.slot:hover{border-color:var(--color-surface-dark)}
.slot[aria-pressed="true"]{background:var(--color-surface-dark);color:var(--color-text-inverse);border-color:var(--color-surface-dark)}
.slot:disabled{text-decoration:line-through;color:var(--color-text-muted);background:var(--color-surface-soft);cursor:not-allowed}
.booking__info{padding:0 var(--space-5) var(--space-5);font-size:var(--fs-sm)}
.booking__info li{display:flex;gap:var(--space-2);padding:var(--space-2) 0;border-top:1px solid var(--color-border)}
.booking__info strong{min-width:90px;color:var(--color-text-strong)}

.mobile-cta{position:fixed;left:0;right:0;bottom:0;z-index:90;background:var(--color-surface-base);border-top:1px solid var(--color-border);padding:var(--space-3) var(--space-4);display:flex;gap:var(--space-2)}
.mobile-cta .btn{flex:1}
@media (min-width:1024px){.mobile-cta{display:none}}

/* Lightbox */
.lightbox{position:fixed;inset:0;z-index:180;background:rgba(0,0,0,.94);display:none;align-items:center;justify-content:center;padding:var(--space-7) var(--space-4)}
.lightbox.is-open{display:flex}
.lightbox img{max-height:84vh;width:auto;border-radius:var(--radius-md)}
.lightbox .icon-btn{position:absolute;color:var(--color-text-inverse)}
.lightbox__close{top:var(--space-4);right:var(--space-4)}
.lightbox__prev{left:var(--space-3);top:50%}
.lightbox__next{right:var(--space-3);top:50%}
.lightbox__count{position:absolute;bottom:var(--space-4);color:var(--color-text-inverse);font-size:var(--fs-sm)}

/* Toast */
.toast{position:fixed;left:50%;bottom:var(--space-6);transform:translate(-50%,20px);background:var(--color-surface-dark);color:var(--color-text-inverse);padding:var(--space-3) var(--space-5);border-radius:var(--radius-pill);font-size:var(--fs-md);font-weight:var(--fw-semibold);opacity:0;pointer-events:none;transition:all var(--dur-fast);z-index:200;box-shadow:var(--shadow-2)}
.toast.is-show{opacity:1;transform:translate(-50%,0)}

/* Reveal on scroll */
.reveal{opacity:0;transform:translateY(16px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.reveal.is-in{opacity:1;transform:none}
@media (max-width:1023px){body:has(.mobile-cta){padding-bottom:72px}}
@media (max-width:479px){.header__inner{gap:var(--space-2)}.logo{font-size:18px}.logo__mark{width:30px;height:30px;font-size:13px}.header__actions .icon-btn[aria-label="Tài khoản"]{display:none}}
.detail>*,.listing>*{min-width:0}
.nav a{white-space:nowrap;padding:var(--space-2);letter-spacing:.04em}
@media (min-width:1024px) and (max-width:1279px){.nav{display:none}.menu-toggle{display:grid}}

/* ---------- Card v2 (gọn hơn) ---------- */
.card{background:transparent;border-radius:0}
.card__media{box-shadow:none}
.card__media::after{content:"";position:absolute;inset:auto 0 0;height:45%;background:linear-gradient(transparent,rgba(0,0,0,.45));pointer-events:none}
.hg-chip{position:absolute;left:var(--space-3);bottom:var(--space-3);z-index:2;display:inline-flex;align-items:baseline;gap:4px;padding:5px 10px 4px;border-radius:var(--radius-md);background:var(--color-surface-dark);color:var(--color-text-inverse);line-height:1}
.hg-chip b{font-family:var(--font-display);font-size:22px;color:var(--color-gold);letter-spacing:.02em}
.hg-chip span{font-size:10px;font-weight:var(--fw-bold);letter-spacing:.08em;text-transform:uppercase;opacity:.85}
.award-tag{position:absolute;left:var(--space-3);top:var(--space-3);z-index:2;padding:4px 8px;border-radius:var(--radius-xs);background:var(--color-gold);color:var(--color-surface-dark);font-size:10px;font-weight:var(--fw-bold);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}
.fav{width:36px;height:36px}
.fav svg{width:18px;height:18px}
.card__body{padding:var(--space-4) 0 0;gap:6px}
.card__meta{color:var(--color-brand-strong);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.card__title{font-size:var(--fs-3xl);line-height:1.2;-webkit-line-clamp:1}
.card__loc{display:flex;align-items:center;gap:5px;margin:0;font-size:var(--fs-sm);color:var(--color-text-muted);min-width:0}
.card__loc svg{width:14px;height:14px;flex:0 0 auto}
.card__loc span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.card__desc{margin-top:2px}
.card__foot{justify-content:space-between;gap:var(--space-3);margin-top:auto;padding-top:var(--space-3);border-top:1px solid var(--color-border);white-space:nowrap;font-size:var(--fs-sm)}
.card__body>.card__desc{margin-bottom:var(--space-2)}
.rate{display:inline-flex;align-items:center;gap:5px;color:var(--color-text-muted)}
.rate svg{width:15px;height:15px;fill:var(--color-gold)}
.rate b{color:var(--color-text-strong);font-size:var(--fs-md)}
.price{font-size:var(--fs-md);color:var(--color-text-strong)}
.price i{color:var(--color-border)}
.row-card .card__foot{margin-top:var(--space-3);max-width:360px}
.row-card .card__title{-webkit-line-clamp:2}
.breadcrumb{list-style:none;padding:0;margin:0}
/* Logo ảnh */
.logo img{height:40px;width:auto}
.logo--footer img{height:52px}
@media (max-width:479px){.logo img{height:32px}}
/* Danh sách không còn bản đồ: 1 cột, ảnh lớn hơn */
@media (min-width:1024px){.listing{grid-template-columns:1fr}}
.row-card .card__body{max-width:720px}
@media (min-width:768px){.row-card{grid-template-columns:340px 1fr;gap:var(--space-5)}}
/* Điểm HG trên trang chi tiết */
.venue-head{align-items:center}
.venue-head>div:first-child{min-width:0}
.venue-head__tags{display:flex;align-items:center;gap:var(--space-3);flex-wrap:wrap;margin-bottom:var(--space-2)}
.award-tag--static{position:static}
.venue-head__side{display:flex;align-items:center;gap:var(--space-4);flex-wrap:wrap}
.hg-score{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-4) var(--space-2) var(--space-3);border-radius:var(--radius-md);background:var(--color-surface-dark);color:var(--color-text-inverse);line-height:1}
.hg-score__num{font-family:var(--font-display);font-weight:var(--fw-bold);font-size:40px;color:var(--color-gold);font-variant-numeric:tabular-nums;white-space:nowrap}
.hg-score__num small{font-family:var(--font-primary);font-size:var(--fs-sm);color:var(--color-text-inverse);opacity:.7;margin-left:2px}
.hg-score__label{font-size:var(--fs-xs);font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.1em;line-height:1.35;padding-left:var(--space-3);border-left:1px solid rgba(255,255,255,.25)}
@media (max-width:639px){.venue-head__side{width:100%;justify-content:space-between}}
.booking__row{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:var(--space-3)}
.booking .input{padding:0 var(--space-3);font-size:var(--fs-lg)}
@media (min-width:1024px) and (max-width:1279px){.detail{grid-template-columns:minmax(0,1fr) 340px;gap:var(--space-6)}}

/* ==========================================================
   TIN TỨC
   ========================================================== */
.post__ex{font-size:var(--fs-md);color:var(--color-text-muted);margin:0;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.post__date{font-size:var(--fs-sm);color:var(--color-text-muted);margin:0}
.post .card__meta{color:var(--color-brand-strong);margin:0}
.post h3{font-size:var(--fs-2xl);line-height:1.3}
.post h3 a:hover,.post h2 a:hover{color:var(--color-brand-strong)}

.news-lead{display:grid;gap:var(--space-5);padding-top:var(--space-6);padding-bottom:var(--space-6);border-bottom:1px solid var(--color-border)}
@media (min-width:1024px){.news-lead{grid-template-columns:minmax(0,1.9fr) minmax(0,1fr)}}
.post--lead{display:grid;gap:var(--space-4)}
.post--lead .post__media{aspect-ratio:16/9}
.post--lead h2{font-size:var(--fs-5xl);line-height:1.15;margin:var(--space-2) 0 var(--space-3);text-wrap:balance}
.post--lead h2 a::after{content:"";position:absolute;inset:0}
.post--lead .post__ex{-webkit-line-clamp:3;font-size:var(--fs-xl);margin-bottom:var(--space-2)}
.news-lead__side{display:grid;gap:var(--space-5);align-content:start}
.post--row{display:grid;grid-template-columns:140px minmax(0,1fr);gap:var(--space-3);align-items:start}
.post--row .post__media{aspect-ratio:4/3}
.post--row h3{font-size:var(--fs-xl);margin:4px 0}
@media (min-width:1024px){.news-lead__side .post--row{grid-template-columns:1fr}.news-lead__side .post--row .post__media{aspect-ratio:16/9}}

.news-layout{display:grid;gap:var(--space-7);padding-top:var(--space-6);padding-bottom:var(--space-8)}
.news-layout>*{min-width:0}
@media (min-width:1024px){.news-layout{grid-template-columns:minmax(0,1fr) 320px}}
.grid--news{grid-template-columns:1fr;row-gap:var(--space-6)}
@media (min-width:640px){.grid--news{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1280px){.grid--news{grid-template-columns:repeat(3,1fr)}}
.news-aside{display:grid;gap:var(--space-5);align-content:start}
@media (min-width:1024px){.news-aside{position:sticky;top:calc(var(--header-h) + 72px)}}
.aside-box{border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-5)}
.aside-box--dark{background:var(--color-surface-dark);border-color:var(--color-surface-dark);color:var(--color-text-inverse)}
.aside-box--dark .aside-title{color:var(--color-text-inverse)}
.aside-box--dark .input{width:100%;background:transparent;color:var(--color-text-inverse);border-color:rgba(255,255,255,.4)}
.aside-box--dark .field-msg.is-error{color:var(--color-brand)}
.aside-box--dark .field-msg.is-success{color:var(--color-gold)}
.aside-box p{font-size:var(--fs-md)}
.aside-title{font-family:var(--font-display);text-transform:uppercase;font-size:var(--fs-2xl);letter-spacing:.02em;margin:0 0 var(--space-4);color:var(--color-text-strong)}
.popular{list-style:none;margin:0;padding:0;display:grid}
.popular a{display:grid;grid-template-columns:32px minmax(0,1fr);gap:var(--space-3);padding:var(--space-3) 0;border-top:1px solid var(--color-border)}
.popular li:first-child a{border-top:0;padding-top:0}
.popular__n{font-family:var(--font-display);font-weight:var(--fw-bold);font-size:26px;line-height:1;color:var(--color-brand-strong)}
.popular b{display:block;font-size:var(--fs-md);line-height:1.35;color:var(--color-text-strong)}
.popular small{display:block;margin-top:4px;color:var(--color-text-muted);font-size:var(--fs-xs)}
.popular a:hover b{color:var(--color-brand-strong)}
.aside-box .chip{color:var(--color-text-strong)}

/* Chi tiết bài viết */
.article-head{padding-top:var(--space-5);max-width:900px}
.article-head .kicker{margin-top:var(--space-5)}
.article-head h1{font-size:var(--fs-6xl);line-height:1.08;margin:var(--space-3) 0 var(--space-4);text-wrap:balance;font-family:var(--font-display);text-transform:uppercase}
.article-head__ex{font-size:var(--fs-2xl);color:var(--color-text-muted);max-width:62ch}
.article-meta{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-2) var(--space-4);font-size:var(--fs-sm);color:var(--color-text-muted);padding:var(--space-4) 0;border-top:1px solid var(--color-border)}
.article-meta__by{display:inline-flex;align-items:center;gap:var(--space-2);font-weight:var(--fw-bold);color:var(--color-text-strong)}
.article-meta__by img{width:32px;height:32px;border-radius:50%;background:var(--color-surface-dark);padding:4px}
.share{display:flex;gap:var(--space-2);margin-left:auto}
.share__btn{width:40px;height:40px;border-radius:50%;border:1px solid var(--color-border);background:var(--color-surface-base);display:grid;place-items:center;cursor:pointer;color:var(--color-text-strong);transition:background var(--dur-fast)}
.share__btn svg{width:18px;height:18px;fill:currentColor}
.share__btn[data-copy-link] svg{fill:none}
.share__btn:hover{background:var(--color-surface-dark);color:var(--color-text-inverse);border-color:var(--color-surface-dark)}
.article-hero{margin-top:var(--space-2);margin-bottom:0}
.article-hero img{width:100%;max-height:620px;object-fit:cover;border-radius:var(--radius-md)}
.article-hero figcaption{font-size:var(--fs-sm);color:var(--color-text-muted);margin-top:var(--space-2)}

.article-layout{display:grid;gap:var(--space-6);padding-top:var(--space-7);padding-bottom:var(--space-8)}
.article-layout>*{min-width:0}
@media (min-width:1024px){.article-layout{grid-template-columns:240px minmax(0,720px);justify-content:center;gap:var(--space-8)}}
.toc{border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-4)}
@media (min-width:1024px){.toc{position:sticky;top:calc(var(--header-h) + var(--space-5));align-self:start;border:0;padding:0}}
.toc ol{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.toc a{display:block;padding:var(--space-2) var(--space-3);border-left:2px solid var(--color-border);font-size:var(--fs-md);color:var(--color-text-muted);line-height:1.35}
.toc a:hover{color:var(--color-text-strong)}
.toc a.is-active{border-left-color:var(--color-brand);color:var(--color-text-strong);font-weight:var(--fw-semibold)}

/* entry-content: định dạng nội dung WordPress classic editor */
.entry-content{font-size:18px;line-height:1.75;color:var(--color-text-primary)}
.entry-content>*+*{margin-top:var(--space-5)}
.entry-content p{margin:0}
.entry-content>p:first-child{font-size:20px;color:var(--color-text-strong)}
.entry-content h2{font-family:var(--font-display);text-transform:uppercase;font-size:var(--fs-4xl);line-height:1.2;margin-top:var(--space-7);scroll-margin-top:calc(var(--header-h) + 24px)}
.entry-content h2 strong{font-weight:inherit}
.entry-content h3{font-size:var(--fs-3xl);margin-top:var(--space-6)}
.entry-content strong{color:var(--color-text-strong)}
.entry-content a{color:var(--color-brand-strong);text-decoration:underline;text-underline-offset:3px}
.entry-content a:hover{color:var(--color-text-strong)}
.entry-content ul{list-style:none;padding:0;display:grid;gap:var(--space-2)}
.entry-content li{position:relative;padding-left:var(--space-5)}
.entry-content li::before{content:"";position:absolute;left:4px;top:.7em;width:8px;height:8px;border-radius:50%;background:var(--color-brand)}
.wp-caption{margin-left:auto;margin-right:auto;width:100%}
.wp-caption img{width:100%;height:auto;border-radius:var(--radius-md)}
.wp-caption-text{font-size:var(--fs-sm);color:var(--color-text-muted);text-align:center;margin-top:var(--space-2)}
.table-wrap{overflow-x:auto;border:1px solid var(--color-border);border-radius:var(--radius-md)}
.entry-content table{width:100%;border-collapse:collapse;font-size:var(--fs-md);line-height:1.55}
.table-wrap table{min-width:520px}
.entry-content th{background:var(--color-surface-dark);color:var(--color-text-inverse);text-align:left;padding:var(--space-3) var(--space-4);font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.08em}
.entry-content td{padding:var(--space-3) var(--space-4);border-top:1px solid var(--color-border);vertical-align:top}
.entry-content tbody tr:nth-child(even){background:var(--color-surface-soft)}
.entry-content .tablepress{border:2px solid var(--color-surface-dark);border-radius:var(--radius-md);overflow:hidden}
.entry-content .tablepress th{background:var(--color-surface-dark);text-transform:none;letter-spacing:0;font-size:var(--fs-lg);font-weight:var(--fw-regular);line-height:1.8;padding:var(--space-5)}
.entry-content .tablepress th img{height:44px;width:auto;margin-bottom:var(--space-3)}
.entry-content .tablepress b{color:var(--color-gold)}
.entry-content .tablepress a{color:var(--color-text-inverse)}

.venue-embed{display:grid;grid-template-columns:120px minmax(0,1fr) auto;gap:var(--space-4);align-items:center;margin-top:var(--space-7);padding:var(--space-3);border:1px solid var(--color-border);border-radius:var(--radius-md);transition:border-color var(--dur-fast),box-shadow var(--dur-fast)}
.venue-embed:hover{border-color:var(--color-surface-dark);box-shadow:var(--shadow-3)}
.venue-embed img{width:120px;aspect-ratio:4/3;object-fit:cover;border-radius:var(--radius-xs)}
.venue-embed__body{display:grid;gap:4px;min-width:0}
.venue-embed__body b{font-size:var(--fs-3xl);color:var(--color-text-strong)}
.hg-chip--static{position:static}
@media (max-width:519px){.venue-embed{grid-template-columns:96px minmax(0,1fr)}.venue-embed img{width:96px}.venue-embed .hg-chip{grid-column:2;justify-self:start}}
.article-tags{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2);margin-top:var(--space-6);padding-top:var(--space-5);border-top:1px solid var(--color-border);font-weight:var(--fw-semibold);font-size:var(--fs-sm)}
.article-tags .chip{color:var(--color-text-strong)}
.article-head,.article-hero{max-width:calc(1024px + 2*var(--space-5))}
.entry-content .venue-embed{margin-top:var(--space-5);text-decoration:none;color:inherit}
.entry-content .venue-embed__body b{color:var(--color-text-strong)}
.entry-content .venue-embed .card__meta{color:var(--color-brand-strong)}
.entry-content h3+p{margin-top:var(--space-2)}
/* Hero ảnh phố đêm: phủ tối bên trái để chữ dễ đọc */
.hero__media::after{background:linear-gradient(90deg,rgba(0,0,0,.82) 0%,rgba(0,0,0,.6) 38%,rgba(0,0,0,.15) 75%,rgba(0,0,0,0) 100%),linear-gradient(180deg,rgba(0,0,0,0) 55%,rgba(0,0,0,.55) 100%)}
@media (max-width:767px){.hero__media::after{background:linear-gradient(180deg,rgba(0,0,0,.35) 0%,rgba(0,0,0,.6) 45%,rgba(0,0,0,.88) 100%)}}
.hero h1,.hero p.lead{text-shadow:0 2px 12px rgba(0,0,0,.35)}

/* ---------- Health Gold Awards (cúp) ---------- */
.awards2{position:relative;overflow:hidden;background:#0d0709;color:var(--color-text-inverse);padding-top:var(--space-8);padding-bottom:var(--space-8);isolation:isolate}
.awards2::before{content:"";position:absolute;inset:0;z-index:-1;background:
  radial-gradient(40% 70% at 26% 50%,rgba(241,96,124,.35),transparent 70%),
  radial-gradient(30% 50% at 34% 40%,rgba(201,162,39,.28),transparent 70%)}
.awards2__inner{display:grid;gap:var(--space-6);align-items:center}
@media (min-width:900px){.awards2__inner{grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:var(--space-8)}}
.awards2__media{display:flex;justify-content:center}
.awards2__media img{width:100%;max-width:420px;height:auto;
  -webkit-mask-image:radial-gradient(70% 62% at 50% 50%,#000 58%,transparent 100%);mask-image:radial-gradient(70% 62% at 50% 50%,#000 58%,transparent 100%)}
@media (max-width:899px){.awards2__media img{max-width:280px}}
.awards2__date{display:inline-flex;align-items:center;gap:var(--space-2);padding:6px var(--space-3);border:1px solid rgba(255,255,255,.25);border-radius:var(--radius-pill);font-size:var(--fs-sm);font-weight:var(--fw-semibold);margin:0 0 var(--space-5)}
.awards2__date span{color:var(--color-brand);font-size:10px;animation:pulse 1.6s ease-in-out infinite}
@keyframes pulse{50%{opacity:.3}}
.awards2 h2{font-family:var(--font-display);text-transform:uppercase;font-size:clamp(40px,6vw,76px);line-height:1;letter-spacing:.01em;color:var(--color-text-inverse);text-wrap:balance}
.awards2 h2 em{font-style:normal;background:linear-gradient(100deg,#f6d77a 0%,var(--color-gold) 45%,#f1a0b2 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.awards2__lead{font-size:var(--fs-2xl);color:rgba(255,255,255,.82);max-width:46ch;margin:var(--space-5) 0 var(--space-6)}
.awards2__stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:0 0 var(--space-6);border-top:1px solid rgba(255,255,255,.18);border-bottom:1px solid rgba(255,255,255,.18);max-width:480px}
.awards2__stats div{padding:var(--space-4) 0}
.awards2__stats div+div{padding-left:var(--space-4);border-left:1px solid rgba(255,255,255,.18)}
.awards2__stats dt{font-size:var(--fs-xs);font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.12em;color:rgba(255,255,255,.65)}
.awards2__stats dd{margin:6px 0 0;font-family:var(--font-display);font-weight:var(--fw-bold);font-size:40px;line-height:1;color:var(--color-gold);font-variant-numeric:tabular-nums}
.awards2__cta{min-height:52px;padding:0 var(--space-6)}
.awards2__cta:hover{background:var(--color-gold);color:var(--color-surface-dark)}
.awards2__media img{-webkit-mask-image:radial-gradient(closest-side,#000 80%,transparent 100%);mask-image:radial-gradient(closest-side,#000 80%,transparent 100%)}
@media (max-width:899px){.awards2::before{background:radial-gradient(70% 35% at 50% 22%,rgba(241,96,124,.32),transparent 70%)}}
@media (prefers-reduced-motion:reduce){.awards2__date span{animation:none}}
/* Cúp: hiển thị nguyên ảnh, không làm mờ viền */
.awards2__media img{-webkit-mask-image:none;mask-image:none;border-radius:var(--radius-lg);max-width:440px;box-shadow:0 30px 80px -20px rgba(241,96,124,.35),0 0 0 1px rgba(255,255,255,.06)}
@media (max-width:899px){.awards2__media img{max-width:300px}}