/* Theme 0005 — Magazine. Dải màu kem/nâu/màu nhấn xen kẽ, ảnh khung vòm, chuyển từ
   demo Layout 5. Font hệ thống (CSP chặn webfont ngoài): Georgia thay DM Serif. */
:root { --bg:#f7efe6; --cream:#f7efe6; --surface:#ffffff; --dark:#2a1d16;
        --text:#2a1d16; --muted:#8c7a6b; --accent:#c26b3d; --accent-text:#ffffff;
        --soft:color-mix(in srgb,var(--accent) 14%,#ffffff); --line:rgba(42,29,22,.12);
        --radius:18px; --head:Georgia,'Times New Roman',serif; }

* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--bg); color:var(--text); font-family:system-ui,-apple-system,sans-serif; line-height:1.6; }
a { color:inherit; text-decoration:none; }
img { max-width:100%; display:block; }
section[id] { scroll-margin-top:72px; }
.t5-wrap { max-width:1180px; margin:0 auto; padding-left:clamp(18px,5vw,44px); padding-right:clamp(18px,5vw,44px); }
.t5-lbl { text-transform:uppercase; letter-spacing:.2em; font-weight:700; font-size:11px; }
.t5-h2 { font-family:var(--head); font-weight:400; font-size:clamp(28px,3.8vw,48px); line-height:1.05; margin:0 0 10px; text-wrap:balance; }
.t5-h2.dark { color:var(--dark); }
.t5-btn { display:inline-block; background:var(--accent); color:var(--accent-text); padding:14px 28px; border-radius:40px; font-weight:600; font-size:15px; cursor:pointer; }
.t5-btn.outline { background:transparent; border:1px solid currentColor; color:inherit; }
.t5-btn.outline.dark { color:var(--accent); border-color:var(--accent); padding:11px 26px; font-size:14px; }
.t5-btn.ghost { background:transparent; border:1px solid rgba(255,255,255,.4); color:inherit; }
.kick { color:var(--accent); margin-bottom:16px; }
.kick.light { color:inherit; opacity:.8; }
.t5-center { text-align:center; max-width:620px; margin:0 auto 40px; }

/* NAV wordmark giữa */
.t5-nav { position:sticky; top:0; z-index:40; background:var(--cream); border-bottom:1px solid var(--line); }
.t5-nav .in { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:16px; padding-top:13px; padding-bottom:13px; }
.t5-nav .side { display:flex; gap:22px; align-items:center; }
.t5-nav .side.right { justify-content:flex-end; }
.t5-nav .side a { opacity:.85; }
.t5-nav .side a:hover { color:var(--accent); opacity:1; }
.t5-nav .side .cta { background:var(--accent); color:var(--accent-text); padding:9px 16px; border-radius:24px; opacity:1; font-weight:700; }
.t5-nav .menu { list-style:none; display:flex; gap:20px; margin:0; padding:0; flex-wrap:wrap; }
.t5-nav .menu .submenu { display:none; }
.t5-brand { font-family:var(--head); font-size:26px; color:var(--dark); text-align:center; line-height:1; display:flex; align-items:center; gap:9px; justify-content:center; }
.t5-brand img { height:34px; width:auto; }

/* HERO */
.t5-hero { background:var(--cream); text-align:center; padding:clamp(40px,6vw,80px) clamp(18px,5vw,44px) 0; }
.t5-hero .in { max-width:1000px; margin:0 auto; }
.t5-hero h1 { font-family:var(--head); font-weight:400; font-size:clamp(42px,7.5vw,104px); line-height:.98; margin:0; color:var(--dark); letter-spacing:-.5px; text-wrap:balance; }
.t5-hero .sub { font-size:clamp(15px,1.7vw,19px); line-height:1.6; color:var(--muted); max-width:56ch; margin:24px auto 30px; }
.t5-hero .cta { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-bottom:clamp(36px,5vw,60px); color:var(--dark); }
.t5-hero .arch { max-width:1180px; margin:0 auto; height:clamp(280px,42vw,480px); border-radius:340px 340px 0 0; background:#2b2622 center/cover no-repeat; overflow:hidden;
  background-image:repeating-linear-gradient(135deg,rgba(0,0,0,.06) 0 1px,transparent 1px 14px); }

/* BANDS */
.t5-band { padding:clamp(52px,7vw,104px) 0; background:var(--cream); }
.t5-band.accent { background:var(--accent); color:#fff; }
.t5-band.dark { background:var(--dark); color:var(--cream); }
.grid2 { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:clamp(28px,5vw,64px); align-items:center; }
.grid2 .lead { font-size:16px; line-height:1.8; opacity:.94; margin:0 0 24px; }
.t5-stats { display:flex; flex-wrap:wrap; gap:34px; padding-top:22px; border-top:1px solid rgba(255,255,255,.3); }
.t5-stats b { font-family:var(--head); font-weight:400; font-size:40px; line-height:1; display:block; }
.t5-stats small { font-size:10px; opacity:.8; margin-top:5px; display:block; }

/* ROOMS ảnh vòm */
.t5-rooms { display:grid; grid-template-columns:repeat(auto-fit,minmax(270px,1fr)); gap:22px; }
.t5-room { text-align:center; }
.t5-room .ph { aspect-ratio:3/4; border-radius:200px 200px 18px 18px; margin-bottom:20px; overflow:hidden; background:#2b2622 center/cover no-repeat; position:relative;
  background-image:repeating-linear-gradient(135deg,rgba(0,0,0,.06) 0 1px,transparent 1px 14px); }
.t5-room .ph .hot { position:absolute; top:16px; left:50%; transform:translateX(-50%); background:var(--accent); color:#fff; font-size:10px; font-weight:700; padding:6px 12px; border-radius:20px; white-space:nowrap; }
.t5-room h3 { font-family:var(--head); font-weight:400; font-size:26px; margin:0 0 4px; color:var(--dark); }
.t5-room .meta { font-size:13px; color:var(--muted); margin-bottom:12px; }
.t5-room .desc { font-size:14px; color:var(--muted); line-height:1.7; margin:0 0 16px; }
.t5-room .price { font-family:var(--head); font-size:32px; color:var(--accent); line-height:1; margin-bottom:16px; }
.t5-room .price span { font-size:13px; color:var(--muted); font-family:system-ui,sans-serif; }

/* GALLERY */
.t5-gallery { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); grid-auto-rows:190px; gap:12px; }
.t5-gallery .g { border-radius:16px; background:#2b2622 center/cover no-repeat; }
.t5-gallery .g-big { grid-column:span 2; grid-row:span 2; }
.t5-gallery .g-wide { grid-column:span 2; }

/* AMENITIES */
.t5-amen { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:14px; }
.t5-amen .it { text-align:center; padding:24px 14px; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); }
.t5-amen .mk { width:46px; height:46px; border-radius:50%; background:var(--soft); color:var(--accent); display:inline-flex; align-items:center; justify-content:center; font-family:var(--head); font-size:20px; margin-bottom:12px; }
.t5-amen .nm { font-weight:600; font-size:15px; color:var(--dark); }

/* EXPERIENCES ảnh vòm */
.t5-exp { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:16px; }
.t5-exp .card { aspect-ratio:3/4; border-radius:160px 160px 14px 14px; position:relative; overflow:hidden; color:#fff; background:#2b2622 center/cover no-repeat;
  background-image:repeating-linear-gradient(135deg,rgba(0,0,0,.06) 0 1px,transparent 1px 14px); }
.t5-exp .shade { position:absolute; inset:0; background:linear-gradient(180deg,transparent 50%,rgba(0,0,0,.6)); }
.t5-exp .cap { position:absolute; bottom:0; padding:20px; text-align:center; width:100%; }
.t5-exp .tm { font-size:10px; opacity:.9; margin-bottom:5px; }
.t5-exp h3 { font-family:var(--head); font-weight:400; font-size:20px; margin:0; }

/* REVIEWS */
.t5-revs { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:20px; }
.t5-rev { background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:28px; }
.t5-rev .stars { color:var(--accent); letter-spacing:2px; margin-bottom:14px; }
.t5-rev p { font-size:15.5px; line-height:1.7; margin:0 0 20px; font-style:italic; color:var(--dark); }
.t5-rev .who { display:flex; align-items:center; gap:12px; }
.t5-rev .av { width:42px; height:42px; border-radius:50%; background:var(--soft); color:var(--accent); display:inline-flex; align-items:center; justify-content:center; font-family:var(--head); font-size:18px; }
.t5-rev .who .nm { font-weight:600; font-size:14px; color:var(--dark); }

/* BOOKING dải tối */
.t5-band.dark .note { opacity:.7; margin:0; font-size:15px; }
.t5-book { background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.16); border-radius:var(--radius); padding:clamp(22px,4vw,36px); position:relative; }
.t5-book .row { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:14px; margin-bottom:14px; }
.t5-book label span { display:block; font-size:12px; font-weight:600; opacity:.85; margin-bottom:6px; }
.t5-book input, .t5-book select { width:100%; padding:12px; border:none; border-radius:10px; background:var(--cream); color:#222; font-size:15px; font-family:inherit; }
.t5-book button[type=submit] { width:100%; background:var(--accent); color:var(--accent-text); border:none; padding:16px; border-radius:40px; font-weight:700; font-size:16px; cursor:pointer; margin-top:6px; }
.t5-book .links { display:flex; gap:16px; justify-content:center; margin-top:14px; font-size:13px; flex-wrap:wrap; opacity:.85; }
.t5-book .links a { font-weight:600; }

/* FAQ */
.t5-faq details { border-bottom:1px solid var(--line); padding:18px 0; }
.t5-faq summary { list-style:none; cursor:pointer; display:flex; justify-content:space-between; gap:12px; font-weight:600; font-size:17px; color:var(--dark); }
.t5-faq summary::-webkit-details-marker { display:none; }
.t5-faq summary span { color:var(--accent); font-size:22px; }
.t5-faq details p { margin:14px 0 0; color:var(--muted); line-height:1.7; font-size:15px; }

/* FOOTER */
.t5-footer { background:var(--dark); color:var(--cream); padding:clamp(44px,6vw,72px) 0 26px; }
.t5-footer .mark-wrap { text-align:center; margin-bottom:34px; }
.t5-footer .mark { font-family:var(--head); font-size:clamp(40px,7vw,80px); line-height:1; }
.t5-footer .mark-wrap p { opacity:.65; font-size:14px; margin:8px 0 0; }
.t5-footer .ctas { display:flex; justify-content:center; gap:12px; flex-wrap:wrap; margin-bottom:34px; }
.t5-footer .fmenu { text-align:center; margin-bottom:24px; }
.t5-footer .fmenu .menu { list-style:none; padding:0; margin:0; display:inline-flex; gap:18px; flex-wrap:wrap; font-size:14px; opacity:.85; }
.t5-footer .fmenu .submenu { display:none; }
.t5-footer .base { border-top:1px solid rgba(255,255,255,.15); padding-top:24px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; font-size:13px; opacity:.6; }
.t5-footer .footer-map iframe { border:0; border-radius:var(--radius); }

/* Float contact (kế thừa hành vi base) */
.float-contact { position:fixed; right:14px; bottom:14px; display:flex; flex-direction:column; gap:10px; z-index:50; }
.float-btn { width:46px; height:46px; border-radius:50%; display:grid; place-items:center; color:#fff; font-weight:700; font-size:18px; box-shadow:0 3px 10px rgba(0,0,0,.22); }
.float-btn.call { background:#1ca05c; } .float-btn.zalo { background:#0068ff; } .float-btn.mess { background:#0084ff; } .float-btn.top { background:#444; }

.header-widgets, .footer-widgets { max-width:1180px; margin:0 auto; padding:12px clamp(18px,5vw,44px); }
@media (max-width:760px) { .t5-nav .side { display:none; } .t5-nav .in { grid-template-columns:1fr; } }