/* =========================================================
   TheGolfers - giao dien tap chi (magazine redesign)
   Theo thegolfers-magazine/DESIGN-SPEC.md + index/category/detail.html
   Moi class co tien to tg- de khong dung bootstrap.css / style.css cu.
   ========================================================= */
:root{
  --tg-paper:#faf7f0;
  --tg-ink:#16140f;
  --tg-muted:#6f6a5d;
  --tg-line:#2a2720;
  --tg-hair:#d9d2c0;
  --tg-green:#1d3a2c;
  --tg-gold:#a58a4b;
  --tg-card:#fffdf8;
  --tg-gold-light:#d8c284;
  --tg-serif:'Playfair Display','Cormorant Garamond',Georgia,serif;
  --tg-text:'Cormorant Garamond',Georgia,serif;
  --tg-sans:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
}
/* Nen kem cho ca trang: style.css cu dat .light-mode-on/.dark-mode-on {background} tren body
   (manh hon body{}) nen phai ghi de bang selector cung muc va dat sau. */
html,body,body.light-mode-on,body.dark-mode-on{background:var(--tg-paper);background-color:var(--tg-paper)}
body,body.light-mode-on,body.dark-mode-on{color:var(--tg-ink);-webkit-font-smoothing:antialiased}
body .wrapper,body .main-content{background:transparent}

.tg-topbar *,.tg-header *,.tg-main *,.tg-letter *,.tg-footer *{box-sizing:border-box}
.tg-topbar a,.tg-header a,.tg-main a,.tg-letter a,.tg-footer a{color:inherit;text-decoration:none}
.tg-topbar a:hover span,.tg-header a:hover span,.tg-main a:hover span,.tg-footer a:hover span{border-color:inherit}
.tg-main img,.tg-header img,.tg-footer img{display:block;width:100%;max-width:100%}
.tg-main h1,.tg-main h2,.tg-main h3,.tg-main h4,.tg-main h5,
.tg-letter h4,.tg-footer h5{font-family:var(--tg-serif);font-weight:400;line-height:1.25;margin:0;color:inherit}
.tg-main p,.tg-letter p,.tg-footer p{margin:0}
.tg-main ul,.tg-footer ul{margin:0;padding:0}
.tg-main figure{margin:0}

.tg-wrap{max-width:1280px;margin:0 auto;padding:0 32px}
.tg-main{font-family:var(--tg-text);font-size:18px;line-height:1.5;color:var(--tg-ink)}

/* ---------- Thanh tren cung ---------- */
.tg-topbar{border-bottom:1px solid var(--tg-hair);font-family:var(--tg-sans);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--tg-muted);background:var(--tg-paper)}
.tg-topbar .tg-wrap{display:flex;justify-content:space-between;align-items:center;height:36px;gap:16px}
.tg-topbar .tg-social{display:flex;gap:20px;align-items:center}
.tg-topbar a:hover{color:var(--tg-green)}
.tg-install{color:var(--tg-green);font-weight:600;border-bottom:1px solid var(--tg-gold);line-height:1.4}
.tg-install[hidden]{display:none}
.tg-search{display:flex;align-items:center;border-bottom:1px solid transparent;transition:.2s}
.tg-search:focus-within{border-color:var(--tg-gold)}
.tg-search input{width:110px;border:0;background:transparent;font-family:var(--tg-sans);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--tg-ink);padding:2px 0;outline:none}
.tg-search input::placeholder{color:var(--tg-muted)}
.tg-search button{border:0;background:transparent;padding:0 0 0 6px;color:var(--tg-muted);cursor:pointer;line-height:1}
.tg-search svg{width:12px;height:12px;fill:currentColor;display:block}

/* ---------- Header dinh ---------- */
.tg-header{position:sticky;top:0;z-index:1000;background:rgba(250,247,240,.96);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-bottom:1px solid var(--tg-line)}
.tg-header .tg-wrap{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:64px}
.tg-brand{display:inline-flex;align-items:center;justify-self:start}
.tg-header .tg-brand img{height:30px;width:auto}
.tg-menu{display:flex;gap:34px;font-family:var(--tg-sans);font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;margin:0;padding:0;list-style:none}
.tg-menu>li{position:relative;list-style:none}
.tg-menu>li>a{display:block;padding:6px 0;border-bottom:1px solid transparent;transition:.2s;white-space:nowrap}
.tg-menu>li>a:hover,.tg-menu>li>a.on{border-color:var(--tg-gold);color:var(--tg-green)}
.tg-sub{position:absolute;left:50%;top:100%;transform:translateX(-50%);min-width:190px;margin:0;padding:10px 0;list-style:none;background:var(--tg-card);border:1px solid var(--tg-line);opacity:0;visibility:hidden;transition:opacity .2s;z-index:20}
.tg-menu>li:hover>.tg-sub,.tg-menu>li:focus-within>.tg-sub{opacity:1;visibility:visible}
.tg-sub a{display:block;padding:8px 18px;font-size:11px;letter-spacing:.14em;color:var(--tg-ink);white-space:nowrap}
.tg-sub a:hover{color:var(--tg-green);background:#f3eddd}
.tg-right{justify-self:end;display:flex;align-items:center;gap:10px}
.tg-cta{display:inline-block;font-family:var(--tg-sans);font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;background:var(--tg-green);color:#f4eedd !important;padding:11px 22px;border-radius:999px;border:0;transition:.2s;cursor:pointer;line-height:1.2}
.tg-cta:hover{background:var(--tg-ink)}
.tg-user{position:relative}
.tg-user-menu{position:absolute;right:0;top:calc(100% + 8px);min-width:200px;background:var(--tg-card);border:1px solid var(--tg-line);padding:8px 0;margin:0;list-style:none;display:none;z-index:30}
.tg-user.open .tg-user-menu{display:block}
.tg-user-menu a{display:block;padding:9px 18px;font-family:var(--tg-sans);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--tg-ink)}
.tg-user-menu a:hover{background:#f3eddd;color:var(--tg-green)}

/* ---------- Chung ---------- */
.tg-meta{display:flex;justify-content:space-between;align-items:center;gap:12px;font-family:var(--tg-sans);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--tg-muted)}
.tg-tag{display:inline-block;border:1px solid var(--tg-ink);color:var(--tg-ink);border-radius:999px;padding:3px 12px;font-family:var(--tg-sans);font-size:10px;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap}
.tg-more{display:inline-block;margin-top:30px;font-family:var(--tg-sans);font-size:11px;letter-spacing:.18em;text-transform:uppercase;font-weight:600;border-bottom:1px solid var(--tg-ink);padding-bottom:3px;align-self:flex-start;transition:.2s}
a:hover .tg-more,.tg-more:hover{color:var(--tg-green);border-color:var(--tg-gold)}
.tg-sec-title{display:flex;align-items:center;gap:20px;margin:0 0 26px}
.tg-main .tg-sec-title h2{font-size:clamp(26px,3vw,38px);white-space:nowrap}
.tg-sec-title h2 em{color:var(--tg-green)}
.tg-sec-title::after{content:"";flex:1;height:1px;background:var(--tg-line)}
.tg-crumb{font-family:var(--tg-sans);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--tg-muted);padding-top:22px}
.tg-crumb a:hover{color:var(--tg-green)}
.tg-crumb span{margin:0 8px;color:var(--tg-gold)}
.tg-btn{display:inline-block;font-family:var(--tg-sans);font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:600;border:1px solid var(--tg-ink);padding:15px 38px;border-radius:999px;transition:.25s;background:transparent;color:var(--tg-ink);cursor:pointer}
.tg-btn:hover{background:var(--tg-ink);color:var(--tg-paper) !important}
.tg-chip{display:inline-block;font-family:var(--tg-sans);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;border:1px solid var(--tg-ink);background:transparent;color:var(--tg-ink);border-radius:999px;padding:6px 15px;cursor:pointer;transition:.2s;line-height:1.5}
.tg-chip:hover{background:#ece5d3}
.tg-chip.on{background:var(--tg-green);border-color:var(--tg-green);color:#f4eedd !important}
.tg-noimg{background:#e7e0cf}

/* ---------- Ten bao ---------- */
.tg-masthead{text-align:center;padding:64px 0 36px}
.tg-kicker{font-family:var(--tg-sans);font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:var(--tg-gold);margin-bottom:22px}
.tg-main .tg-masthead h1{font-size:clamp(56px,13vw,176px);line-height:.92;letter-spacing:-.02em;text-transform:uppercase}
.tg-masthead h1 em{font-style:italic;font-weight:400;color:var(--tg-green);text-transform:none;letter-spacing:-.01em}
.tg-rule{display:flex;align-items:center;gap:18px;justify-content:center;margin-top:34px;color:var(--tg-muted);font-style:italic;font-size:20px}
.tg-rule::before,.tg-rule::after{content:"";height:1px;width:90px;background:var(--tg-gold);flex:none}

/* ---------- Bai noi bat ---------- */
.tg-feature{border:1px solid var(--tg-line);display:grid;grid-template-columns:1.15fr 1fr;margin-bottom:56px;background:var(--tg-card)}
.tg-feature .tg-pic{overflow:hidden;min-height:480px;background:#e7e0cf;position:relative}
.tg-main .tg-feature .tg-pic img{position:absolute;inset:0;height:100%;object-fit:cover;transition:transform .8s}
.tg-feature:hover .tg-pic img{transform:scale(1.03)}
.tg-feature .tg-fbody{padding:48px 48px 40px;display:flex;flex-direction:column;border-left:1px solid var(--tg-line)}
.tg-main .tg-feature h2{font-size:clamp(28px,3.2vw,44px);line-height:1.15;margin:34px 0 20px}
.tg-feature p{font-size:20px;color:#3a362c;margin-bottom:auto}

/* ---------- Xu huong ---------- */
.tg-trend{margin-bottom:64px}
.tg-trend-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.tg-trend-item{display:block}
.tg-trend-item .tg-ph{position:relative;aspect-ratio:3/4;overflow:hidden;background:#e7e0cf;margin-bottom:16px}
.tg-main .tg-trend-item .tg-ph img{height:100%;object-fit:cover;transition:transform .8s}
.tg-trend-item:hover .tg-ph img{transform:scale(1.06)}
.tg-trend-item .tg-no{position:absolute;left:14px;bottom:4px;font-family:var(--tg-serif);font-size:84px;line-height:1;color:#faf7f0;text-shadow:0 2px 18px rgba(0,0,0,.35)}
.tg-cat{font-family:var(--tg-sans);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--tg-gold);font-weight:600;margin-bottom:6px}
.tg-main .tg-trend-item h3{font-size:19px;line-height:1.3;transition:color .2s}
.tg-trend-item:hover h3{color:var(--tg-green)}

/* ---------- Bo loc ---------- */
.tg-filterbar{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:22px;flex-wrap:wrap}
.tg-filterbar .tg-label{font-family:var(--tg-sans);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--tg-muted)}
.tg-chips{display:flex;gap:8px;flex-wrap:wrap}

/* ---------- Luoi bai ---------- */
.tg-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--tg-line);border-left:1px solid var(--tg-line)}
.tg-card{border-right:1px solid var(--tg-line);border-bottom:1px solid var(--tg-line);padding:26px 26px 28px;display:flex;flex-direction:column;transition:background .3s}
.tg-card:hover{background:var(--tg-card)}
.tg-card .tg-img{aspect-ratio:4/3;overflow:hidden;margin:20px 0 24px;background:#e7e0cf}
.tg-main .tg-card .tg-img img{height:100%;object-fit:cover;transition:transform .7s}
.tg-card:hover .tg-img img{transform:scale(1.05)}
.tg-main .tg-card h3{font-size:23px;line-height:1.25;margin-bottom:12px}
.tg-card p{font-size:17px;color:#4a463a;line-height:1.45;margin-bottom:22px}
.tg-card .tg-more{margin-top:auto;font-size:10.5px}
.tg-card[hidden]{display:none}
.tg-empty{padding:60px;text-align:center;font-style:italic;color:var(--tg-muted);border:1px solid var(--tg-line);border-top:0}
.tg-empty[hidden]{display:none}
.tg-loadmore{text-align:center;margin:56px 0 80px}

/* ---------- Khoanh khac ---------- */
.tg-moments{margin:0 0 80px}
.tg-mosaic{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:240px;gap:10px}
.tg-mosaic a{position:relative;overflow:hidden;background:#e7e0cf;display:block}
.tg-mosaic a:first-child{grid-column:span 2;grid-row:span 2}
.tg-mosaic a:nth-child(4){grid-column:span 2}
.tg-main .tg-mosaic img{height:100%;object-fit:cover;transition:transform .9s}
.tg-mosaic a:hover img{transform:scale(1.07)}
.tg-mosaic a::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(14,22,17,.78),rgba(14,22,17,0) 55%);opacity:.9;transition:opacity .3s}
.tg-mosaic figcaption{position:absolute;z-index:1;left:20px;right:20px;bottom:18px;color:#faf7f0}
.tg-mosaic figcaption small{display:block;font-family:var(--tg-sans);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--tg-gold-light);margin-bottom:6px}
.tg-mosaic figcaption span{font-family:var(--tg-serif);font-size:18px;line-height:1.28;display:block}
.tg-mosaic a:first-child figcaption span{font-size:28px}

/* ---------- Trang chuyen muc ---------- */
.tg-cat-head{text-align:center;padding:40px 0 34px}
.tg-cat-head .tg-kicker{margin-bottom:18px}
.tg-main .tg-cat-head h1{font-size:clamp(48px,9vw,120px);line-height:.95;letter-spacing:-.02em}
.tg-cat-head h1 em{font-style:italic;color:var(--tg-green)}
.tg-cat-head .tg-rule{margin-top:26px}
.tg-subnav{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:30px}
.tg-grid.tg-mb{margin-bottom:72px}
.tg-cols{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:56px;margin-bottom:40px}
.tg-row{display:grid;grid-template-columns:220px 1fr;gap:28px;padding:26px 0;border-bottom:1px solid var(--tg-hair)}
.tg-row:first-of-type{padding-top:0}
.tg-row .tg-img{aspect-ratio:4/3;overflow:hidden;background:#e7e0cf}
.tg-main .tg-row .tg-img img{height:100%;object-fit:cover;transition:transform .7s}
.tg-row:hover .tg-img img{transform:scale(1.05)}
.tg-row .tg-cat{margin-bottom:8px}
.tg-row .tg-cat time{color:var(--tg-muted);font-weight:400;margin-left:10px}
.tg-main .tg-row h3{font-size:24px;line-height:1.25;margin-bottom:14px;transition:color .2s}
.tg-row:hover h3{color:var(--tg-green)}
.tg-row .tg-more{margin-top:0;font-size:10.5px}
.tg-aside .tg-box{border:1px solid var(--tg-line);background:var(--tg-card);padding:28px 26px;position:sticky;top:90px}
.tg-main .tg-aside h4{font-family:var(--tg-sans);font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:600;padding-bottom:16px;border-bottom:1px solid var(--tg-line);margin-bottom:6px}
.tg-pop{display:grid;grid-template-columns:44px 1fr;gap:12px;padding:16px 0;border-bottom:1px solid var(--tg-hair)}
.tg-pop:last-child{border-bottom:0;padding-bottom:0}
.tg-pop .tg-no{font-family:var(--tg-serif);font-size:34px;line-height:1;color:var(--tg-gold);font-style:italic}
.tg-pop small{display:block;font-family:var(--tg-sans);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--tg-muted);margin-bottom:4px}
.tg-pop .tg-pt{font-family:var(--tg-serif);font-size:17px;line-height:1.3;display:block}
.tg-pop:hover .tg-pt{color:var(--tg-green)}

/* Phan trang: bọc HTML cua include/pagination.php (ul.pagination > li.page-item > a.page-link) */
.tg-pager{margin:48px 0 80px}
.tg-pager nav{display:block}
.tg-pager .pagination{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none;font-family:var(--tg-sans);font-size:12px;font-weight:500}
.tg-pager .page-item{list-style:none}
.tg-pager .page-link{min-width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--tg-ink) !important;border-radius:999px !important;padding:0 14px;margin:0;background:transparent;color:var(--tg-ink);transition:.2s;line-height:1;box-shadow:none !important}
.tg-pager a.page-link:hover{background:var(--tg-ink);color:var(--tg-paper)}
.tg-pager .page-item.active .page-link{background:var(--tg-green);border-color:var(--tg-green) !important;color:#f4eedd;font-weight:600}
.tg-pager .page-link.dots{border:0 !important;min-width:auto;padding:0 4px;color:var(--tg-muted)}
.tg-pager .page-item:empty{display:none}
.tg-pager .page-link .fa{font-size:11px}

/* ---------- Trang chi tiet ---------- */
.tg-progress{position:fixed;top:0;left:0;height:3px;width:0;background:var(--tg-gold);z-index:1100}
.tg-a-head{max-width:920px;margin:0 auto;text-align:center;padding:48px 0 40px}
.tg-a-head .tg-tag{padding:4px 14px}
.tg-main .tg-a-head h1{font-size:clamp(34px,5vw,64px);line-height:1.1;letter-spacing:-.01em;margin:26px 0 24px}
.tg-stand{font-style:italic;font-size:clamp(20px,2vw,24px);line-height:1.5;color:#3a362c;max-width:760px;margin:0 auto}
.tg-byline{display:flex;justify-content:center;align-items:center;gap:14px;flex-wrap:wrap;margin-top:30px;font-family:var(--tg-sans);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--tg-muted)}
.tg-byline b{color:var(--tg-ink);font-weight:600}
.tg-byline i{width:4px;height:4px;border-radius:50%;background:var(--tg-gold);display:inline-block}
.tg-hero{border:1px solid var(--tg-line);background:#e7e0cf;aspect-ratio:16/9;overflow:hidden}
.tg-main .tg-hero img{height:100%;object-fit:cover;object-position:center 30%}
.tg-a-wrap{display:grid;grid-template-columns:1fr minmax(0,700px) 1fr;gap:40px;margin:56px 0 0}
.tg-share{justify-self:end;position:sticky;top:96px;align-self:start;display:flex;flex-direction:column;gap:10px;font-family:var(--tg-sans);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--tg-muted);text-align:center}
.tg-share a{width:44px;height:44px;border:1px solid var(--tg-ink);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--tg-ink);font-weight:600;font-size:11px;letter-spacing:0;transition:.2s}
.tg-share a:hover{background:var(--tg-green);border-color:var(--tg-green);color:#f4eedd}

/* Noi dung bai (HTML tu CMS) */
.tg-article{font-size:21px;line-height:1.7;color:#24211a;min-width:0;overflow-wrap:break-word}
.tg-article .tg-content p{margin:0 0 24px}
.tg-article .tg-content>p:first-of-type::first-letter{font-family:var(--tg-serif);float:left;font-size:84px;line-height:.82;padding:8px 12px 0 0;color:var(--tg-green)}
.tg-article .tg-content h2,.tg-article .tg-content h3{font-family:var(--tg-serif);font-weight:400;font-size:clamp(26px,2.6vw,34px);line-height:1.2;margin:52px 0 22px;color:var(--tg-ink)}
.tg-article .tg-content h2::before,.tg-article .tg-content h3::before{content:"";display:block;width:48px;height:1px;background:var(--tg-gold);margin-bottom:22px}
.tg-article .tg-content h4,.tg-article .tg-content h5{font-family:var(--tg-serif);font-weight:500;font-size:24px;margin:36px 0 16px}
.tg-article .tg-content img{display:block;max-width:100% !important;width:auto;height:auto !important;margin:0 auto;background:#e7e0cf}
.tg-article .tg-content figure,.tg-article .tg-content .image{margin:36px auto 40px;max-width:100% !important;width:auto !important}
.tg-article .tg-content figcaption,.tg-article .tg-content .image-caption{font-style:italic;font-size:16px;color:var(--tg-muted);margin-top:10px;line-height:1.45;text-align:left}
.tg-article .tg-content table{max-width:100%;height:auto !important}
.tg-article .tg-content table img{margin:0 auto}
.tg-article .tg-content td{font-style:italic;font-size:16px;color:var(--tg-muted);line-height:1.45}
.tg-article .tg-content blockquote{margin:48px 0;padding:34px 0;border:0;border-top:1px solid var(--tg-gold);border-bottom:1px solid var(--tg-gold);text-align:center;font-family:var(--tg-serif);font-style:italic;font-size:clamp(24px,2.6vw,32px);line-height:1.35;color:var(--tg-green)}
.tg-article .tg-content a{color:var(--tg-green);text-decoration:underline;text-decoration-color:var(--tg-gold)}
.tg-article .tg-content ul,.tg-article .tg-content ol{margin:0 0 24px 1.2em;padding:0}
.tg-article .tg-content iframe,.tg-article .tg-content video{max-width:100%}
.tg-author{display:grid;grid-template-columns:72px 1fr;gap:20px;align-items:center;border-top:1px solid var(--tg-line);border-bottom:1px solid var(--tg-line);padding:26px 0;margin:44px 0 0}
.tg-author .tg-av{width:72px;height:72px;border-radius:50%;background:var(--tg-green);color:var(--tg-gold-light);display:flex;align-items:center;justify-content:center;font-family:var(--tg-serif);font-size:28px;font-style:italic;overflow:hidden}
.tg-main .tg-author .tg-av img{width:100%;height:100%;object-fit:cover}
.tg-author small{display:block;font-family:var(--tg-sans);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--tg-gold);font-weight:600;margin-bottom:4px}
.tg-author b{font-family:var(--tg-serif);font-weight:400;font-size:22px;display:block}
.tg-share-end{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:28px;font-family:var(--tg-sans);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--tg-muted)}
.tg-share-end a{border:1px solid var(--tg-ink);color:var(--tg-ink);border-radius:999px;padding:7px 16px;font-size:10.5px;transition:.2s}
.tg-share-end a:hover{background:var(--tg-green);border-color:var(--tg-green);color:#f4eedd}

/* Binh luan */
.tg-comments{margin:56px 0 0}
.tg-comment{padding:18px 0;border-bottom:1px solid var(--tg-hair)}
.tg-comment b{font-family:var(--tg-sans);font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;display:block;margin-bottom:6px}
.tg-comment div{font-size:18px;line-height:1.55}
.tg-comment-form{margin-top:26px}
.tg-comment-form label{font-family:var(--tg-sans);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--tg-muted);display:block;margin-bottom:8px}
.tg-comment-form textarea{width:100%;min-height:120px;border:1px solid var(--tg-line);background:var(--tg-card);padding:14px 16px;font-family:var(--tg-text);font-size:18px;color:var(--tg-ink);outline:none;border-radius:0}
.tg-comment-form textarea:focus{border-color:var(--tg-green)}
.tg-comment-form .error{color:#a94442;font-family:var(--tg-sans);font-size:12px;letter-spacing:0;text-transform:none;margin-top:6px}
.tg-comment-form .tg-btn{margin-top:16px;padding:12px 30px}
.tg-related{margin:88px 0 80px}
.tg-related .tg-card h3{margin-bottom:22px}
.tg-ads{display:none}

/* ---------- Ban tin ---------- */
.tg-letter{border-top:1px solid var(--tg-line);border-bottom:1px solid var(--tg-line);background:var(--tg-green);color:#efe8d4;text-align:center;padding:64px 20px}
.tg-letter h4{font-size:clamp(28px,4vw,46px);margin-bottom:10px;color:#efe8d4}
.tg-letter h4 em{color:var(--tg-gold-light)}
.tg-letter p{font-family:var(--tg-text);font-style:italic;font-size:19px;opacity:.85;margin-bottom:28px}
.tg-letter form{display:inline-flex;max-width:480px;width:100%;border:1px solid var(--tg-gold-light);border-radius:999px;overflow:hidden;margin:0}
.tg-letter input{flex:1;min-width:0;background:transparent;border:0;padding:15px 24px;color:#fff;font-family:var(--tg-sans);font-size:13px;outline:none}
.tg-letter input::placeholder{color:#b9b49f}
.tg-letter button{background:var(--tg-gold-light);color:var(--tg-green);border:0;padding:0 28px;font-family:var(--tg-sans);font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;cursor:pointer}

/* Popup thong bao (dang ky ban tin) */
.tg-popup{position:fixed;inset:0;z-index:2000;background:rgba(22,20,15,.55);display:flex;align-items:center;justify-content:center;padding:20px}
.tg-popup[hidden]{display:none}
.tg-popup-card{position:relative;width:100%;max-width:440px;background:var(--tg-paper);border:1px solid var(--tg-line);padding:44px 36px 36px;text-align:center;box-shadow:0 20px 60px rgba(0,0,0,.25);animation:tg-pop .25s ease-out}
@keyframes tg-pop{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.tg-popup-x{position:absolute;top:12px;right:14px;border:0;background:transparent;font-size:16px;color:var(--tg-muted);cursor:pointer;line-height:1}
.tg-popup-x:hover{color:var(--tg-ink)}
.tg-popup-icon{width:56px;height:56px;margin:0 auto 18px;border-radius:50%;background:var(--tg-green);color:var(--tg-gold-light);display:flex;align-items:center;justify-content:center;font-family:var(--tg-serif);font-size:26px}
.tg-popup.is-error .tg-popup-icon{background:#8a2f24;color:#f4eedd}
.tg-popup h4{font-family:var(--tg-serif);font-weight:400;font-size:28px;line-height:1.2;margin:0 0 12px;color:var(--tg-ink)}
.tg-popup p{font-family:var(--tg-text);font-size:19px;line-height:1.5;color:#3a362c;margin:0 0 26px}
.tg-popup .tg-btn{padding:12px 34px}
.tg-letter button:disabled{opacity:.7;cursor:wait}

/* ---------- Chan trang ---------- */
.tg-footer{background:var(--tg-paper);color:var(--tg-ink);font-family:var(--tg-text)}
.tg-fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.4fr}
.tg-fgrid>div{padding:40px 28px;border-right:1px solid var(--tg-line)}
.tg-fgrid>div:first-child{padding-left:0}
.tg-fgrid>div:last-child{border-right:0}
.tg-flogo{font-family:var(--tg-serif);font-size:26px;margin-bottom:12px}
.tg-footer h5{font-family:var(--tg-sans);font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:600;margin-bottom:18px}
.tg-footer li{list-style:none;font-size:17px;margin-bottom:8px}
.tg-footer li a:hover{color:var(--tg-green);text-decoration:underline;text-decoration-color:var(--tg-gold)}
.tg-legal{font-size:15px;color:var(--tg-muted);line-height:1.55}
.tg-copy{border-top:1px solid var(--tg-line);font-family:var(--tg-sans);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--tg-muted)}
.tg-copy .tg-wrap{display:flex;justify-content:space-between;gap:20px;height:52px;align-items:center}
.tg-copy a:hover{color:var(--tg-green)}

/* ---------- Diem ngat ---------- */
@media (max-width:1180px){
  .tg-article .tg-content figure{margin-left:0;margin-right:0}
}
@media (max-width:980px){
  .tg-trend-grid{grid-template-columns:repeat(2,1fr)}
  .tg-mosaic{grid-template-columns:repeat(2,1fr);grid-auto-rows:200px}
  .tg-mosaic a:nth-child(4){grid-column:span 1}
  .tg-grid{grid-template-columns:repeat(2,1fr)}
  .tg-feature{grid-template-columns:1fr}
  .tg-feature .tg-fbody{border-left:0;border-top:1px solid var(--tg-line);padding:32px 26px}
  .tg-feature .tg-pic{min-height:320px}
  .tg-cols{grid-template-columns:1fr;gap:40px}
  .tg-aside .tg-box{position:static}
  .tg-a-wrap{grid-template-columns:minmax(0,1fr);margin-top:40px}
  .tg-a-wrap>.tg-share,.tg-a-wrap>.tg-spacer{display:none}
  .tg-article{max-width:700px;margin:0 auto;width:100%}
  .tg-fgrid{grid-template-columns:1fr 1fr}
  .tg-fgrid>div{border-bottom:1px solid var(--tg-line)}
  .tg-menu{gap:20px;justify-content:center}
  .tg-header .tg-wrap{grid-template-columns:auto 1fr auto}
}
@media (max-width:640px){
  .tg-wrap{padding:0 18px}
  .tg-grid{grid-template-columns:1fr}
  .tg-topbar .tg-date{display:none}
  .tg-topbar .tg-wrap{height:auto;padding-top:9px;padding-bottom:9px}
  .tg-topbar .tg-social{width:100%;justify-content:space-between;gap:12px;flex-wrap:nowrap}
  .tg-topbar .tg-social a{white-space:nowrap}
  .tg-topbar .tg-social a:not(.tg-install){display:none}
  .tg-install{font-size:10.5px}
  .tg-search{flex:1;min-width:0}
  .tg-menu>li>a{white-space:nowrap}
  .tg-search input{width:100%}
  .tg-header .tg-brand img{height:24px}
  .tg-header .tg-wrap{grid-template-columns:1fr auto;grid-template-areas:"brand cta" "menu menu";height:auto;padding-top:10px;padding-bottom:6px;row-gap:6px}
  .tg-brand{grid-area:brand}
  .tg-right{grid-area:cta}
  .tg-cta{padding:9px 16px}
  .tg-menu{grid-area:menu;font-size:10.5px;gap:14px;justify-content:flex-start;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .tg-sub{display:none}
  .tg-trend-item .tg-no{font-size:64px}
  .tg-mosaic a:first-child figcaption span{font-size:22px}
  .tg-row{grid-template-columns:120px 1fr;gap:16px;padding:20px 0}
  .tg-main .tg-row h3{font-size:19px;margin-bottom:0}
  .tg-row .tg-more{display:none}
  .tg-a-head{padding:32px 0 28px}
  .tg-hero{aspect-ratio:4/3;margin:0 -18px;border-left:0;border-right:0}
  .tg-article{font-size:19px}
  .tg-article .tg-content>p:first-of-type::first-letter{font-size:64px}
  .tg-fgrid{grid-template-columns:1fr}
  .tg-fgrid>div{padding-left:0;padding-right:0;border-right:0}
  .tg-copy .tg-wrap{flex-direction:column;height:auto;padding:14px 18px;text-align:center;gap:6px}
}