/* ==========================================================================
   LUXURY SEA THEME — trang chủ (nạp CUỐI CÙNG, chỉ đổi font / màu / viền / bóng).
   Không đổi bố cục -> chức năng đặt phòng, lịch, slideshow giữ nguyên.
   Bảng màu: xanh biển sâu #0c3341 · xanh ngọc #0f5f73 · vàng champagne #b08d57 · ngà #fbf8f2
   Font: Cormorant Garamond (tiêu đề, có tiếng Việt) + Be Vietnam Pro (nội dung)
   Specificity: tiền tố "html body.home-page main" để thắng các luật body:has(...) cũ.
   ========================================================================== */

html body.home-page{background:var(--lx-ivory)!important;color:var(--lx-text)!important;font-family:var(--lx-sans)!important;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
html body.home-page :is(input,select,textarea,button){font-family:var(--lx-sans)}

/* ---- Thanh trên cùng & menu ---- */
html body.home-page .hotel-top{background:var(--lx-ink)!important;color:var(--lx-gold-soft)!important;font-size:12px;letter-spacing:.18em;text-transform:uppercase}
html body.home-page .hotel-nav{box-shadow:0 1px 0 rgba(176,141,87,.28)}
html body.home-page .hotel-nav nav a:not(.nav-book){color:var(--lx-ink)!important;font-size:14.5px;letter-spacing:.02em}
html body.home-page .hotel-nav nav a:not(.nav-book):hover{color:var(--lx-gold-deep)!important}
html body.home-page .hotel-logo{font-family:var(--lx-serif)!important;color:var(--lx-sea)!important;letter-spacing:.06em}
html body.home-page .hotel-nav .nav-book{background:linear-gradient(135deg,#c9a56a 0%,#b08d57 55%,#8a6a35 100%)!important;border-radius:999px!important}

/* ---- Hero ---- */
html body.home-page main .hotel-hero .hero-copy>.eyebrow{font-family:var(--lx-sans)!important;color:var(--lx-gold-soft)!important;font-size:clamp(12px,1.2vw,14px)!important;font-weight:500;letter-spacing:.32em!important;text-transform:uppercase}
html body.home-page main .hotel-hero .hero-copy h1{font-family:var(--lx-serif)!important;font-weight:600!important;color:#fff!important;font-size:clamp(38px,5.4vw,78px)!important;line-height:1.06!important;letter-spacing:-.005em!important;margin:16px 0 20px;text-shadow:0 2px 26px rgba(6,35,44,.55);text-wrap:balance}
html body.home-page main .hotel-hero .hero-copy p{font-family:var(--lx-sans)!important;font-weight:400;font-size:clamp(15px,1.25vw,17.5px);line-height:1.8;max-width:600px;color:rgba(255,255,255,.94)!important}
html body.home-page main .hotel-hero .hero-copy .outline-btn{font-family:var(--lx-sans)!important;font-weight:600;letter-spacing:.08em;text-transform:uppercase;font-size:13px;background:linear-gradient(135deg,#f1dfb8,#d9b878)!important;border-color:transparent!important;color:var(--lx-ink)!important;border-radius:999px!important;padding:15px 34px!important;box-shadow:0 10px 26px rgba(6,27,50,.28)}
html body.home-page main .hotel-hero .hero-copy .outline-btn:hover{filter:brightness(1.05);transform:translateY(-2px)}

html body.home-page main .hotel-hero .hero-copy h1 .h1-brand{display:block}
html body.home-page main .hotel-hero .hero-copy h1 .h1-keywords{display:block;margin-top:clamp(10px,1.4vw,18px);font-family:var(--lx-sans);font-style:normal;font-weight:500;font-size:clamp(12px,1.35vw,17px);letter-spacing:.2em;line-height:1.6;text-transform:uppercase;color:var(--lx-gold-soft);text-shadow:0 2px 12px rgba(6,35,44,.7)}

/* ---- Tiêu đề các mục ---- */
html body.home-page main :is(.section-title,.section-copy) h2,
html body.home-page main :is(#welcome,#stays,#gallery,#journal,#amenities,#contact,#booking,#why) h2{font-family:var(--lx-serif)!important;font-weight:600!important;color:var(--lx-ink)!important;font-size:clamp(30px,3.4vw,46px)!important;line-height:1.15!important;letter-spacing:0!important;text-wrap:balance}
html body.home-page main .hotel-section .eyebrow{font-family:var(--lx-sans)!important;color:var(--lx-gold-deep)!important;font-weight:600;font-size:12px!important;letter-spacing:.26em!important}
html body.home-page main .section-title h2::after{content:"";display:block;width:56px;height:1.5px;margin:16px auto 0;background:linear-gradient(90deg,transparent,var(--lx-gold),transparent)}
html body.home-page main .hotel-section :is(h3){font-family:var(--lx-serif)!important;font-weight:600!important;color:var(--lx-ink)!important}
html body.home-page main :is(#welcome,#stays,#gallery,#journal,#contact,#why) p{font-family:var(--lx-sans);color:var(--lx-text)!important;font-size:15.5px!important;line-height:1.85!important}

/* ---- Giới thiệu ---- */
html body.home-page main #welcome .section-copy h2{margin:10px 0 18px;text-align:left}
html body.home-page main #welcome .section-copy h2::after{margin-left:0}
html body.home-page main #welcome .facts>div{border-color:rgba(176,141,87,.35)!important}
html body.home-page main #welcome .facts b{font-family:var(--lx-serif)!important;font-weight:600!important;color:var(--lx-gold-deep)!important;font-size:30px!important}
html body.home-page main #welcome .facts span{letter-spacing:.06em;text-transform:uppercase;font-size:11px!important;color:var(--lx-muted)!important}
html body.home-page main #welcome .welcome-images img{border-radius:14px;box-shadow:0 18px 40px rgba(12,51,65,.16)}
html body.home-page main .luxury-text-link{color:var(--lx-gold-deep)!important;font-weight:600;letter-spacing:.04em}

/* ---- Khối "Vì sao chọn villa" (mới) ---- */
html body.home-page main #why{max-width:1180px;margin:0 auto;padding:64px 24px 24px;text-align:center}
html body.home-page main #why .section-title{text-align:center}
html body.home-page main #why .why-lead{max-width:760px;margin:0 auto 34px;text-align:center}
html body.home-page main #why .why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;text-align:left}
html body.home-page main #why .why-card{background:#fff;border:1px solid rgba(176,141,87,.32);border-radius:14px;padding:28px 26px;box-shadow:0 12px 30px rgba(12,51,65,.07)}
html body.home-page main #why .why-card h3{font-size:24px!important;line-height:1.25!important;margin:0 0 10px}
html body.home-page main #why .why-card p{margin:0;font-size:14.5px!important;line-height:1.75!important}
@media(max-width:860px){html body.home-page main #why .why-grid{grid-template-columns:1fr}}

/* ---- Gallery, đánh giá, liên hệ, cẩm nang ---- */
html body.home-page main .gallery-main{border-radius:16px;overflow:hidden;box-shadow:0 22px 50px rgba(12,51,65,.18)}
html body.home-page main .gallery-item{border-radius:10px;overflow:hidden}
html body.home-page main .reviews .review-carousel blockquote{background:#fff;border:1px solid rgba(176,141,87,.28);border-radius:14px;box-shadow:0 10px 26px rgba(12,51,65,.06)}
html body.home-page main .reviews .review-carousel blockquote>b{color:var(--lx-gold)!important;letter-spacing:.12em}
html body.home-page main .reviews .review-carousel blockquote p{font-family:var(--lx-serif);font-size:19px!important;line-height:1.6!important;font-style:italic}
html body.home-page main #contact .contact-links a{border-radius:999px!important;background:#fff!important;border:1px solid rgba(176,141,87,.5)!important;color:var(--lx-ink)!important;font-weight:600}
html body.home-page main #contact .contact-links a:hover{background:var(--lx-ink)!important;color:#fff!important}
html body.home-page main #journal .journal-card{border:1px solid rgba(176,141,87,.28);border-radius:14px;background:#fff;box-shadow:0 10px 26px rgba(12,51,65,.06);transition:transform .25s,box-shadow .25s}
html body.home-page main #journal .journal-card:hover{transform:translateY(-4px);box-shadow:0 18px 38px rgba(12,51,65,.12)}
html body.home-page main #journal .journal-card h3{font-size:22px!important;line-height:1.3!important}
html body.home-page main #journal .journal-read{color:var(--lx-gold-deep);font-weight:600}
html body.home-page main #journal .journal-more a{color:var(--lx-gold-deep)!important;font-weight:600;letter-spacing:.06em}

/* ---- Đặt phòng & chân trang: chỉ đổi font tiêu đề ---- */
html body.home-page main #booking .booking-heading h2{font-family:var(--lx-serif)!important}
html body.home-page .hotel-footer .footer-brand b{font-family:var(--lx-serif)!important;letter-spacing:.06em}

/* ---- Tiếng Trung: giữ font CJK ---- */
html[lang="zh"] body.home-page,html[lang="zh"] body.home-page main :is(h1,h2,h3){font-family:"Noto Serif SC","Songti SC","Microsoft YaHei",serif!important}
html[lang="zh"] body.home-page :is(p,a,span,button,input,select){font-family:"Microsoft YaHei","PingFang SC","Noto Sans CJK SC",Arial,sans-serif!important}

/* ---- Địa chỉ trong ô "Vị trí & liên hệ": thu nhỏ chữ (đặt cuối file để thắng luật H2 chung) ---- */
html body.home-page main #contact h2{font-size:clamp(15px,1.3vw,18px)!important;line-height:1.5!important;font-weight:600!important;margin:16px 0 10px!important}

/* ==========================================================================
   KHUNG VIỀN NGHỆ THUẬT BAO TOÀN TRANG — toàn bộ nội dung nằm TRONG khung.
   Khung là viền của <body> (không cố định theo màn hình) nên bao trọn từ đầu đến cuối trang.
   ========================================================================== */
html:has(body.home-page){background:var(--lx-ivory)}
html body.home-page{position:relative;margin:14px;border:1.5px solid rgba(176,141,87,.9);border-radius:4px;overflow-x:clip}
html body.home-page .hotel-nav{left:0;right:0}
/* đường viền trong (viền kép) */
html body.home-page::before{content:"";position:absolute;inset:5px;z-index:30;pointer-events:none;border:1px solid rgba(176,141,87,.45);border-radius:2px}
/* hoa văn 4 góc + hạt kim cương giữa 4 cạnh */
html body.home-page::after{content:"";position:absolute;inset:0;z-index:31;pointer-events:none;background-repeat:no-repeat;
  background-image:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2264%22 height=%2264%22 viewBox=%220 0 64 64%22%3E%3Cg transform=%22%22 fill=%22none%22 stroke=%22%23b08d57%22 stroke-width=%221.4%22 stroke-linecap=%22round%22%3E%3Cpath d=%22M4 60V16Q4 4 16 4H60%22/%3E%3Cpath d=%22M12 60V22Q12 12 22 12H60%22 stroke-width=%220.8%22/%3E%3Cpath d=%22M22 34Q34 34 34 22Q34 14 26 16%22 /%3E%3Cpath d=%22M16 30Q26 40 38 30%22 stroke-width=%220.8%22/%3E%3Cpath d=%22M34 22L38 26L34 30L30 26Z%22 fill=%22%23b08d57%22 stroke=%22none%22/%3E%3Ccircle cx=%224%22 cy=%224%22 r=%222.2%22 fill=%22%23b08d57%22 stroke=%22none%22/%3E%3C/g%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2264%22 height=%2264%22 viewBox=%220 0 64 64%22%3E%3Cg transform=%22translate(64 0) scale(-1 1)%22 fill=%22none%22 stroke=%22%23b08d57%22 stroke-width=%221.4%22 stroke-linecap=%22round%22%3E%3Cpath d=%22M4 60V16Q4 4 16 4H60%22/%3E%3Cpath d=%22M12 60V22Q12 12 22 12H60%22 stroke-width=%220.8%22/%3E%3Cpath d=%22M22 34Q34 34 34 22Q34 14 26 16%22 /%3E%3Cpath d=%22M16 30Q26 40 38 30%22 stroke-width=%220.8%22/%3E%3Cpath d=%22M34 22L38 26L34 30L30 26Z%22 fill=%22%23b08d57%22 stroke=%22none%22/%3E%3Ccircle cx=%224%22 cy=%224%22 r=%222.2%22 fill=%22%23b08d57%22 stroke=%22none%22/%3E%3C/g%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2264%22 height=%2264%22 viewBox=%220 0 64 64%22%3E%3Cg transform=%22translate(0 64) scale(1 -1)%22 fill=%22none%22 stroke=%22%23b08d57%22 stroke-width=%221.4%22 stroke-linecap=%22round%22%3E%3Cpath d=%22M4 60V16Q4 4 16 4H60%22/%3E%3Cpath d=%22M12 60V22Q12 12 22 12H60%22 stroke-width=%220.8%22/%3E%3Cpath d=%22M22 34Q34 34 34 22Q34 14 26 16%22 /%3E%3Cpath d=%22M16 30Q26 40 38 30%22 stroke-width=%220.8%22/%3E%3Cpath d=%22M34 22L38 26L34 30L30 26Z%22 fill=%22%23b08d57%22 stroke=%22none%22/%3E%3Ccircle cx=%224%22 cy=%224%22 r=%222.2%22 fill=%22%23b08d57%22 stroke=%22none%22/%3E%3C/g%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2264%22 height=%2264%22 viewBox=%220 0 64 64%22%3E%3Cg transform=%22translate(64 64) scale(-1 -1)%22 fill=%22none%22 stroke=%22%23b08d57%22 stroke-width=%221.4%22 stroke-linecap=%22round%22%3E%3Cpath d=%22M4 60V16Q4 4 16 4H60%22/%3E%3Cpath d=%22M12 60V22Q12 12 22 12H60%22 stroke-width=%220.8%22/%3E%3Cpath d=%22M22 34Q34 34 34 22Q34 14 26 16%22 /%3E%3Cpath d=%22M16 30Q26 40 38 30%22 stroke-width=%220.8%22/%3E%3Cpath d=%22M34 22L38 26L34 30L30 26Z%22 fill=%22%23b08d57%22 stroke=%22none%22/%3E%3Ccircle cx=%224%22 cy=%224%22 r=%222.2%22 fill=%22%23b08d57%22 stroke=%22none%22/%3E%3C/g%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2264%22 height=%2220%22 viewBox=%220 0 64 20%22%3E%3Cg transform=%22%22 fill=%22none%22 stroke=%22%23b08d57%22 stroke-width=%221.4%22 stroke-linecap=%22round%22%3E%3Cpath d=%22M2 10H12M52 10H62%22 stroke-width=%221%22/%3E%3Cpath d=%22M32 3L39 10L32 17L25 10Z%22 fill=%22%23b08d57%22 stroke=%22none%22/%3E%3Cpath d=%22M14 10Q22 4 28 10M50 10Q42 4 36 10%22 stroke-width=%220.9%22/%3E%3C/g%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2264%22 height=%2220%22 viewBox=%220 0 64 20%22%3E%3Cg transform=%22translate(0 20) scale(1 -1)%22 fill=%22none%22 stroke=%22%23b08d57%22 stroke-width=%221.4%22 stroke-linecap=%22round%22%3E%3Cpath d=%22M2 10H12M52 10H62%22 stroke-width=%221%22/%3E%3Cpath d=%22M32 3L39 10L32 17L25 10Z%22 fill=%22%23b08d57%22 stroke=%22none%22/%3E%3Cpath d=%22M14 10Q22 4 28 10M50 10Q42 4 36 10%22 stroke-width=%220.9%22/%3E%3C/g%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2264%22 viewBox=%220 0 20 64%22%3E%3Cg transform=%22%22 fill=%22none%22 stroke=%22%23b08d57%22 stroke-width=%221.4%22 stroke-linecap=%22round%22%3E%3Cpath d=%22M10 2V12M10 52V62%22 stroke-width=%221%22/%3E%3Cpath d=%22M3 32L10 25L17 32L10 39Z%22 fill=%22%23b08d57%22 stroke=%22none%22/%3E%3Cpath d=%22M10 14Q4 22 10 28M10 50Q4 42 10 36%22 stroke-width=%220.9%22/%3E%3C/g%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2264%22 viewBox=%220 0 20 64%22%3E%3Cg transform=%22translate(20 0) scale(-1 1)%22 fill=%22none%22 stroke=%22%23b08d57%22 stroke-width=%221.4%22 stroke-linecap=%22round%22%3E%3Cpath d=%22M10 2V12M10 52V62%22 stroke-width=%221%22/%3E%3Cpath d=%22M3 32L10 25L17 32L10 39Z%22 fill=%22%23b08d57%22 stroke=%22none%22/%3E%3Cpath d=%22M10 14Q4 22 10 28M10 50Q4 42 10 36%22 stroke-width=%220.9%22/%3E%3C/g%3E%3C/svg%3E");
  background-size:64px 64px,64px 64px,64px 64px,64px 64px,64px 20px,64px 20px,20px 64px,20px 64px;
  background-position:left top,right top,left bottom,right bottom,center top,center bottom,left center,right center}
@media(max-width:700px){
  html body.home-page{margin:7px}
  html body.home-page::before{inset:3px}
  html body.home-page::after{background-size:40px 40px,40px 40px,40px 40px,40px 40px,40px 13px,40px 13px,13px 40px,13px 40px}
}
@media print{html body.home-page::before,html body.home-page::after{display:none}html body.home-page{margin:0;border:0}}

/* ==========================================================================
   Khung "Tiện ích + Căn nghỉ": giữ nguyên như cũ, chỉ thêm bóng mờ nhẹ dưới chân
   ========================================================================== */
html body.home-page main .hero-discovery-panel{box-shadow:0 20px 28px -16px rgba(6,32,44,.38)}
html body.home-page main .discovery-amenity,
html body.home-page main .discovery-hotel{box-shadow:0 10px 14px -10px rgba(6,32,44,.32)}

/* ---- Đánh giá trên các nền tảng ---- */
html body.home-page main .platform-reviews{padding-top:48px;padding-bottom:8px}
html body.home-page main .platform-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:18px;max-width:1100px;margin:28px auto 0}
html body.home-page main .platform-card{display:flex;flex-direction:column;align-items:center;gap:6px;padding:24px 18px 20px;text-align:center;text-decoration:none;background:#fff;border:1px solid rgba(176,141,87,.35);border-top:3px solid var(--ota-color,#174b70);border-radius:14px;box-shadow:0 10px 14px -10px rgba(6,32,44,.32);transition:transform .25s,box-shadow .25s}
html body.home-page main .platform-card:hover{transform:translateY(-4px);box-shadow:0 18px 26px -14px rgba(6,32,44,.4)}
html body.home-page main .platform-name{font-family:var(--lx-sans);font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--lx-muted)}
html body.home-page main .platform-score{font-family:var(--lx-serif);font-weight:700;font-size:44px;line-height:1;color:var(--lx-ink)}
html body.home-page main .platform-score small{font-size:16px;color:var(--lx-muted);margin-left:3px}
html body.home-page main .platform-stars{font-size:20px;letter-spacing:3px;line-height:1;background:linear-gradient(90deg,var(--lx-gold) var(--pct,0%),#e4dccb var(--pct,0%));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
html body.home-page main .platform-count{font-size:12.5px;color:var(--lx-muted)}
html body.home-page main .platform-cta{margin-top:8px;font-size:13px;font-weight:600;color:var(--lx-gold-deep);letter-spacing:.04em}
