/* v4 — 8Tech visual identity */
:root{--ink:#102b3a!important;--green:#007fb3!important;--gold:#00adef!important;--cream:#f2faff!important;--paper:#fff!important;--muted:#607783!important}
.site-header{background:rgba(244,251,254,.96)!important;border-bottom-color:#d5ebf4!important}.brand--8tech .brand-mark{width:42px;height:42px;border-radius:11px;object-fit:cover}.brand--8tech .brand-copy strong{font-family:"Noto Sans VN",sans-serif;color:#153747;font-size:21px;font-weight:700}.brand--8tech .brand-copy strong b{color:#00adef}.brand--8tech .brand-copy small{color:#607783}.eyebrow,.section-title span,.flame,.arrow{color:#00adef!important}.hero{background:linear-gradient(115deg,rgba(0,99,143,.97),rgba(0,173,239,.9)),radial-gradient(circle at 80% 20%,#58d3ff,transparent 45%)!important}footer{background:#073b52!important}a:focus-visible,button:focus-visible{outline-color:#00adef}
@font-face{font-family:"Noto Sans VN";src:url("fonts/noto-sans-400.ttf") format("truetype");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:"Noto Sans VN";src:url("fonts/noto-sans-600.ttf") format("truetype");font-style:normal;font-weight:600;font-display:swap}
@font-face{font-family:"Noto Sans VN";src:url("fonts/noto-sans-700.ttf") format("truetype");font-style:normal;font-weight:700;font-display:swap}
@font-face{font-family:"Noto Serif VN";src:url("fonts/noto-serif-400.ttf") format("truetype");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:"Noto Serif VN";src:url("fonts/noto-serif-italic-400.ttf") format("truetype");font-style:italic;font-weight:400;font-display:swap}
:root{--ink:#182820;--green:#244e3a;--gold:#b88731;--cream:#f4f0e6;--paper:#fffdf8;--muted:#6d746f}
*{box-sizing:border-box}
body{margin:0;background:var(--cream);color:var(--ink);font:16px/1.55 "Noto Sans VN",Arial,sans-serif}
.site-header{height:84px;padding:0 max(5vw,24px);display:flex;align-items:center;justify-content:space-between;background:rgba(244,240,230,.94);border-bottom:1px solid #d9d2c2;position:sticky;top:0;z-index:5;backdrop-filter:blur(12px)}
.brand{display:flex;gap:12px;align-items:center;color:var(--ink);text-decoration:none;font-family:"Noto Serif VN",serif;font-size:20px;line-height:1.05}
.brand small{display:block;font:10px/1.5 "Noto Sans VN",sans-serif;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.mark{display:grid;place-items:center;width:42px;height:42px;border:1px solid var(--gold);border-radius:50%;color:var(--gold)}
nav{display:flex;gap:28px}
nav a{color:var(--ink);text-decoration:none;font-size:14px}
.hero{background:linear-gradient(115deg,rgba(19,51,37,.97),rgba(32,76,55,.9)),radial-gradient(circle at 80% 20%,#a57c36,transparent 45%);color:#fff;padding:78px max(7vw,28px) 62px}
.eyebrow{color:#d8b266;font-size:12px;letter-spacing:.24em;font-weight:700}
.hero h1,.detail h1,.tour h1{font:clamp(42px,6vw,78px)/1.08 "Noto Serif VN",serif;margin:18px 0}
.hero em,.tour em{color:#e1ba6d;font-weight:400}
.hero>p{max-width:650px;color:#dce5df;font-size:18px}
.search{display:grid;grid-template-columns:minmax(260px,1fr) 190px 130px;max-width:920px;margin-top:34px;background:#fff;padding:7px;border-radius:6px;box-shadow:0 14px 34px #0a1e1655}
.search input,.search select,.search button{font-family:"Noto Sans VN",sans-serif}
.search input,.search select{border:0;background:#fff;padding:15px;font-size:15px;outline:none}
.search select{border-left:1px solid #ddd}
.search button{border:0;border-radius:4px;background:var(--gold);color:#fff;font-weight:700}
.stats{display:flex;align-items:center;gap:14px;margin-top:34px;color:#dce5df}
.stats b{font:32px "Noto Serif VN",serif;color:#e1ba6d}
.results,.detail{max-width:1180px;margin:auto;padding:58px 24px}
.section-title{display:flex;justify-content:space-between;align-items:end;border-bottom:1px solid #d5cebd;padding-bottom:20px;margin-bottom:25px}
.section-title span{font-size:11px;letter-spacing:.2em;color:var(--gold);font-weight:700}
.section-title h2{font:34px "Noto Serif VN",serif;margin:6px 0 0}
.section-title p{color:var(--muted)}
.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.card{display:grid;grid-template-columns:42px 1fr 24px;gap:14px;align-items:start;padding:22px;background:var(--paper);border:1px solid #ded7c8;color:var(--ink);text-decoration:none;transition:.2s}
.card:hover{transform:translateY(-2px);border-color:var(--gold);box-shadow:0 8px 24px #47381715}
.card h3{font:22px "Noto Serif VN",serif;margin:0 0 5px}
.card p{margin:0;color:var(--muted);font-size:14px}
.flame{color:var(--gold);font-size:20px}
.arrow{color:var(--gold)}
dl{display:flex;gap:25px;margin:18px 0 0}
dl div{display:flex;flex-direction:column}
dt{font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}
dd{margin:0;font-weight:700}
.pagination{justify-content:center;margin-top:35px;align-items:center}
.pagination a{background:var(--green);color:white;padding:10px 18px;border-radius:4px}
.pagination span{color:var(--muted)}
.empty{padding:40px;background:white;border:1px solid #ddd}
.back{color:var(--green)}
.memorial-card{display:flex;align-items:center;gap:30px;padding:50px 0;border-bottom:1px solid #d5cebd}
.portrait{width:110px;height:110px;border:1px solid var(--gold);border-radius:50%;display:grid;place-items:center;color:var(--gold);font-size:32px}
.memorial-card h1{font-size:clamp(40px,6vw,68px);margin:12px 0}
.place{color:var(--muted);font-size:18px}
.facts{display:grid;grid-template-columns:repeat(5,1fr);margin:30px 0;background:var(--paper);border:1px solid #d9d2c2}
.facts div{padding:22px;border-right:1px solid #ddd}
.facts div:last-child{border:0}
.facts span{display:block;font-size:11px;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.source,.notice{padding:20px;border-left:3px solid var(--gold);background:#ece4d2}
.source a{color:var(--green)}
.tour{min-height:calc(100vh - 84px);display:grid;grid-template-columns:1fr 1fr;gap:7vw;align-items:center;padding:70px max(7vw,28px);background:var(--green);color:#fff}
.tour p{color:#dae5df;font-size:18px}
.notice{color:var(--ink);margin-top:30px}
.tour-placeholder{aspect-ratio:1;border-radius:50%;display:grid;place-items:center;align-content:center;text-align:center;border:1px solid #c9a55c;background:radial-gradient(circle at 35% 25%,#65806f,#142b20 65%);box-shadow:inset 0 0 70px #07130d}
.tour-placeholder span{font:64px "Noto Serif VN",serif;color:#dfb966}
.tour-placeholder p{font-size:14px}
footer{padding:35px max(5vw,24px);background:#14251d;color:#aebbb4;text-align:center;font-size:12px}
footer p{margin:4px}
@media(max-width:760px){.site-header nav{display:none}
.hero{padding-top:50px}
.search{grid-template-columns:1fr}
.search select{border-left:0;border-top:1px solid #ddd}
.search button{padding:14px}
.cards{grid-template-columns:1fr}
.section-title{align-items:start}
.facts{grid-template-columns:repeat(2,1fr)}
.facts div{border-bottom:1px solid #ddd}
.tour{grid-template-columns:1fr}
.tour-placeholder{max-width:440px}
.memorial-card{align-items:flex-start}
.portrait{width:70px;height:70px;flex:none}
dl{gap:15px}
}