/* ============================================
   Hotel Price Live — Main CSS
   Luxury aesthetic inspired by Fairmont / Booking
============================================ */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,600;1,300&family=DM+Sans:wght@300;400;500&display=swap');

:root {
  --hpl-gold:      #b8986a;
  --hpl-gold-l:    #d4b483;
  --hpl-gold-pale: #f5ede0;
  --hpl-dark:      #1a1510;
  --hpl-ink:       #3d3228;
  --hpl-stone:     #8c7d6e;
  --hpl-mist:      #f9f6f2;
  --hpl-white:     #ffffff;
  --hpl-border:    #e8ddd0;
  --hpl-primary:   #003580;
  --hpl-green:     #22c55e;
  --hpl-red:       #ef4444;
  --hpl-shadow:    0 2px 16px rgba(26,21,16,.10);
  --hpl-shadow-lg: 0 8px 40px rgba(26,21,16,.16);
  --hpl-radius:    6px;
  --hpl-trans:     all .25s ease;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }

.hpl-single,
.hpl-listing-wrap {
  font-family: 'DM Sans', sans-serif;
  color: var(--hpl-ink);
  font-size: 15px;
  line-height: 1.7;
}

/* ── Sticky Nav ── */
.hpl-sticky-nav {
  position: sticky; top: 0; z-index: 90;
  background: rgba(26,21,16,.96);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(184,152,106,.25);
}
.hpl-snav-inner {
  display: flex; align-items: center; justify-content: space-between;
  max-width: 1280px; margin: 0 auto; padding: 0 24px; height: 56px; gap: 20px;
}
.hpl-snav-title { font-family:'Cormorant Garamond',serif; font-size:14px; color:var(--hpl-gold-l); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:280px; }
.hpl-snav-links { display:flex; gap:20px; list-style:none; flex-shrink:0; }
.hpl-snav-links a { font-size:12px; letter-spacing:1px; text-transform:uppercase; color:rgba(255,255,255,.55); text-decoration:none; transition:color .2s; }
.hpl-snav-links a:hover, .hpl-snav-links a.active { color:var(--hpl-gold-l); }
.hpl-snav-cta { padding:8px 18px; background:var(--hpl-gold); color:white; border-radius:3px; font-size:12px; font-weight:500; letter-spacing:1px; text-transform:uppercase; text-decoration:none; transition:var(--hpl-trans); flex-shrink:0; }
.hpl-snav-cta:hover { background:var(--hpl-gold-l); }

/* ── Gallery ── */
.hpl-gallery { display:grid; grid-template-columns:1fr 1fr; grid-template-rows:360px 180px; gap:3px; background:var(--hpl-dark); overflow:hidden; max-height:543px; }
.hpl-gallery-main { grid-row:1/3; position:relative; overflow:hidden; }
.hpl-gallery-side { display:grid; grid-template-columns:1fr 1fr; gap:3px; }
.hpl-gallery-main img, .hpl-gthumb img { width:100%; height:100%; object-fit:cover; transition:transform .5s ease, opacity .15s; }
.hpl-gallery-main img { display:block; }
.hpl-gthumb { overflow:hidden; cursor:pointer; position:relative; }
.hpl-gthumb:hover img { transform:scale(1.06); }
.hpl-gmore { position:absolute; inset:0; background:rgba(0,0,0,.55); color:#fff; display:flex; align-items:center; justify-content:center; font-size:18px; font-weight:600; }
.hpl-gnav { position:absolute; top:50%; transform:translateY(-50%); width:100%; display:flex; justify-content:space-between; padding:0 16px; pointer-events:none; }
.hpl-gprev, .hpl-gnext { pointer-events:all; width:42px; height:42px; border-radius:50%; background:rgba(0,0,0,.5); color:#fff; border:none; cursor:pointer; font-size:16px; display:flex; align-items:center; justify-content:center; transition:background .2s; }
.hpl-gprev:hover,.hpl-gnext:hover { background:rgba(0,0,0,.8); }
.hpl-gcounter { position:absolute; bottom:14px; right:14px; background:rgba(0,0,0,.55); color:#fff; padding:5px 12px; border-radius:3px; font-size:12px; display:flex; align-items:center; gap:6px; }
.hpl-gbadge { position:absolute; padding:5px 14px; font-size:12px; font-weight:600; border-radius:3px; }
.hpl-gbadge-feat { top:14px; left:14px; background:var(--hpl-gold); color:white; }
.hpl-gbadge-michelin { bottom:14px; left:14px; background:rgba(0,0,0,.75); color:var(--hpl-gold-l); border:1px solid var(--hpl-gold); }

/* ── Hotel Header ── */
.hpl-hotel-head {
  display:flex; justify-content:space-between; align-items:flex-start; gap:32px;
  background:var(--hpl-white); border-bottom:1px solid var(--hpl-border); padding:28px 40px;
}
.hpl-head-left { flex:1; }
.hpl-head-top { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:8px; }
.hpl-stars { color:#f59e0b; font-size:16px; letter-spacing:2px; }
.hpl-type-chip { background:var(--hpl-gold-pale); color:var(--hpl-gold); padding:3px 10px; border-radius:3px; font-size:11px; letter-spacing:1px; text-transform:uppercase; }
.hpl-michelin-chip { background:#fff3cd; color:#92640a; padding:3px 10px; border-radius:3px; font-size:11px; font-weight:600; }
.hpl-hotel-name { font-family:'Cormorant Garamond',serif; font-size:36px; font-weight:300; color:var(--hpl-dark); margin-bottom:10px; line-height:1.1; }
.hpl-hotel-loc { display:flex; align-items:center; gap:8px; color:var(--hpl-stone); font-size:14px; margin-bottom:12px; }
.hpl-hotel-loc i { color:var(--hpl-gold); }
.hpl-quick-facts { display:flex; flex-wrap:wrap; gap:18px; }
.hpl-quick-facts span { display:flex; align-items:center; gap:6px; font-size:13px; color:var(--hpl-stone); }
.hpl-quick-facts i { color:var(--hpl-gold); width:14px; }

.hpl-head-right { flex-shrink:0; text-align:right; min-width:240px; }
.hpl-rating-block { display:flex; align-items:center; gap:14px; justify-content:flex-end; margin-bottom:16px; }
.hpl-rating-score { width:54px; height:54px; background:var(--hpl-dark); color:var(--hpl-gold-l); font-family:'Cormorant Garamond',serif; font-size:24px; font-weight:600; display:flex; align-items:center; justify-content:center; border-radius:4px 4px 4px 0; }
.hpl-rating-lbl { font-size:15px; font-weight:500; color:var(--hpl-dark); }
.hpl-rating-rev { font-size:12px; color:var(--hpl-stone); }
.hpl-discount-badge { background:var(--hpl-red); color:#fff; padding:3px 10px; border-radius:3px; font-size:12px; font-weight:600; display:inline-block; margin-bottom:8px; }
.hpl-price-meta { font-size:11px; letter-spacing:1px; text-transform:uppercase; color:var(--hpl-stone); }
.hpl-price-row { display:flex; align-items:flex-end; gap:8px; justify-content:flex-end; }
.hpl-price-orig { font-size:14px; color:var(--hpl-stone); text-decoration:line-through; margin-bottom:3px; }
.hpl-price-main { font-family:'Cormorant Garamond',serif; font-size:14px; color:var(--hpl-stone); }
.hpl-price-main strong { font-size:34px; color:var(--hpl-dark); font-weight:600; }
.hpl-price-note { font-size:11px; color:var(--hpl-stone); margin-top:4px; }
.hpl-btn-book-head { display:block; margin-top:14px; padding:13px 20px; background:var(--hpl-gold); color:#fff; text-align:center; font-size:13px; font-weight:500; letter-spacing:1.5px; text-transform:uppercase; text-decoration:none; border-radius:3px; transition:var(--hpl-trans); }
.hpl-btn-book-head:hover { background:var(--hpl-gold-l); transform:translateY(-1px); }

/* ── Single Grid ── */
.hpl-single-grid { display:grid; grid-template-columns:1fr 360px; gap:28px; max-width:1280px; margin:0 auto; padding:28px 40px 60px; align-items:start; }
.hpl-single-sidebar { position:sticky; top:70px; }

/* ── Sections ── */
.hpl-sec { background:var(--hpl-white); border:1px solid var(--hpl-border); border-radius:var(--hpl-radius); padding:28px; margin-bottom:20px; }
.hpl-sec-title { font-family:'Cormorant Garamond',serif; font-size:22px; font-weight:400; color:var(--hpl-dark); margin-bottom:18px; padding-bottom:12px; border-bottom:1px solid var(--hpl-border); display:flex; align-items:center; gap:10px; }
.hpl-sec-title::before { content:''; width:3px; height:20px; background:var(--hpl-gold); border-radius:2px; flex-shrink:0; }
.hpl-about-text { font-size:15px; color:var(--hpl-stone); line-height:1.85; }
.hpl-about-text p+p { margin-top:12px; }

/* ── Amenities ── */
.hpl-amenities-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.hpl-amenity { display:flex; align-items:center; gap:10px; padding:10px 12px; background:var(--hpl-mist); border:1px solid var(--hpl-border); border-radius:4px; font-size:13px; transition:var(--hpl-trans); }
.hpl-amenity:hover { border-color:var(--hpl-gold); background:var(--hpl-gold-pale); }
.hpl-amenity i { color:var(--hpl-gold); width:16px; text-align:center; flex-shrink:0; }

/* ── Rooms ── */
.hpl-rooms-list { display:flex; flex-direction:column; gap:12px; }
.hpl-room-card { display:grid; grid-template-columns:1fr auto; gap:20px; padding:20px; border:1px solid var(--hpl-border); border-radius:var(--hpl-radius); position:relative; transition:box-shadow .2s, border-color .2s; }
.hpl-room-card:hover { box-shadow:var(--hpl-shadow); border-color:var(--hpl-gold); }
.hpl-room-featured { border-color:var(--hpl-gold); background:linear-gradient(135deg,#fffdf9,#fff); }
.hpl-room-badge { position:absolute; top:-10px; left:16px; background:var(--hpl-gold); color:#fff; padding:3px 12px; border-radius:20px; font-size:11px; font-weight:600; }
.hpl-room-info h4 { font-family:'Cormorant Garamond',serif; font-size:17px; font-weight:600; color:var(--hpl-dark); margin-bottom:8px; }
.hpl-room-meta { display:flex; flex-wrap:wrap; gap:12px; font-size:13px; color:var(--hpl-stone); margin-bottom:8px; }
.hpl-room-meta span { display:flex; align-items:center; gap:4px; }
.hpl-room-meta i { color:var(--hpl-gold); }
.hpl-room-tags { display:flex; flex-wrap:wrap; gap:5px; }
.hpl-rtag { padding:3px 9px; background:var(--hpl-gold-pale); color:var(--hpl-gold); border-radius:3px; font-size:11px; }
.hpl-room-price-block { text-align:right; flex-shrink:0; display:flex; flex-direction:column; align-items:flex-end; justify-content:center; gap:6px; }
.hpl-room-ppm { font-size:11px; color:var(--hpl-stone); text-transform:uppercase; letter-spacing:0.5px; }
.hpl-room-price { font-family:'Cormorant Garamond',serif; font-size:26px; font-weight:600; color:var(--hpl-dark); }
.hpl-btn-room { padding:8px 18px; border:1px solid var(--hpl-gold); color:var(--hpl-gold); border-radius:3px; font-size:12px; font-weight:500; letter-spacing:1px; text-transform:uppercase; text-decoration:none; transition:var(--hpl-trans); }
.hpl-btn-room:hover { background:var(--hpl-gold); color:#fff; }

/* ── Dining ── */
.hpl-dining-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.hpl-dining-card { padding:18px; border:1px solid var(--hpl-border); border-radius:var(--hpl-radius); transition:box-shadow .2s; }
.hpl-dining-card:hover { box-shadow:var(--hpl-shadow); }
.hpl-dining-icon { font-size:28px; margin-bottom:8px; }
.hpl-dining-name { font-family:'Cormorant Garamond',serif; font-size:17px; font-weight:600; color:var(--hpl-dark); margin-bottom:4px; }
.hpl-dining-type { font-size:11px; color:var(--hpl-gold); text-transform:uppercase; letter-spacing:1px; margin-bottom:6px; }
.hpl-dining-desc { font-size:13px; color:var(--hpl-stone); line-height:1.6; }
.hpl-dining-badge { display:inline-flex; align-items:center; gap:5px; margin-top:8px; background:#eff6ff; color:#2563eb; padding:4px 10px; font-size:11px; border-radius:3px; }

/* ── Reviews ── */
.hpl-reviews-wrap { display:flex; gap:28px; align-items:center; margin-bottom:20px; }
.hpl-review-score-big { background:var(--hpl-dark); padding:20px 24px; border-radius:var(--hpl-radius); text-align:center; flex-shrink:0; }
.hpl-rsb-num { font-family:'Cormorant Garamond',serif; font-size:48px; font-weight:300; color:var(--hpl-gold-l); line-height:1; }
.hpl-rsb-max { font-size:13px; color:rgba(255,255,255,.45); }
.hpl-rsb-lbl { font-size:14px; color:var(--hpl-gold-l); margin-top:4px; }
.hpl-rsb-count { font-size:12px; color:rgba(255,255,255,.5); margin-top:2px; }
.hpl-review-bars { flex:1; }
.hpl-rbar-row { display:flex; align-items:center; gap:10px; margin-bottom:8px; font-size:13px; }
.hpl-rbar-lbl { width:95px; color:var(--hpl-stone); flex-shrink:0; }
.hpl-rbar-track { flex:1; height:6px; background:var(--hpl-border); border-radius:3px; overflow:hidden; }
.hpl-rbar-fill { height:100%; background:var(--hpl-gold); border-radius:3px; transition:width 1.2s ease; }
.hpl-rbar-num { width:28px; text-align:right; font-weight:500; color:var(--hpl-ink); flex-shrink:0; }
.hpl-reviews-cta { font-size:13px; color:var(--hpl-stone); }
.hpl-reviews-cta a { color:var(--hpl-gold); }

/* ── Map ── */
.hpl-map-wrap { border-radius:var(--hpl-radius); overflow:hidden; height:300px; border:1px solid var(--hpl-border); margin-bottom:16px; }
.hpl-map-wrap iframe { width:100%; height:100%; border:none; display:block; }
.hpl-loc-facts { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
.hpl-loc-item { display:flex; align-items:flex-start; gap:10px; font-size:13px; }
.hpl-loc-item i { color:var(--hpl-gold); margin-top:2px; flex-shrink:0; }
.hpl-loc-item strong { display:block; font-size:11px; text-transform:uppercase; letter-spacing:.5px; color:var(--hpl-ink); margin-bottom:1px; }
.hpl-loc-item span { color:var(--hpl-stone); }

/* ── Sidebar Cards ── */
.hpl-sidebar-card { background:var(--hpl-white); border:1px solid var(--hpl-border); border-radius:var(--hpl-radius); overflow:hidden; margin-bottom:16px; box-shadow:var(--hpl-shadow); }
.hpl-scard-header { background:var(--hpl-dark); padding:14px 18px; display:flex; align-items:center; justify-content:space-between; }
.hpl-scard-title { font-family:'Cormorant Garamond',serif; font-size:13px; letter-spacing:2px; text-transform:uppercase; color:var(--hpl-gold-l); }
.hpl-scard-body { padding:18px; }
.hpl-live-indicator { font-size:11px; color:var(--hpl-stone); transition:color .3s; }

/* ── Booking Widget ── */
.hpl-date-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:10px; }
.hpl-date-field label, .hpl-guests-field label { display:block; font-size:10px; text-transform:uppercase; letter-spacing:1px; color:var(--hpl-stone); margin-bottom:4px; }
.hpl-date-field input, .hpl-guests-field select { width:100%; padding:10px 12px; border:1px solid var(--hpl-border); border-radius:4px; font-size:14px; background:var(--hpl-mist); font-family:'DM Sans',sans-serif; color:var(--hpl-ink); outline:none; transition:border-color .2s; }
.hpl-date-field input:focus, .hpl-guests-field select:focus { border-color:var(--hpl-gold); }
.hpl-guests-field { margin-bottom:14px; }

.hpl-search-price-btn { width:100%; padding:13px; background:var(--hpl-gold); color:#fff; border:none; border-radius:4px; font-size:14px; font-weight:500; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:8px; transition:var(--hpl-trans); letter-spacing:.5px; }
.hpl-search-price-btn:hover { background:var(--hpl-gold-l); transform:translateY(-1px); }

.hpl-price-results { margin-top:14px; }
.hpl-price-loading { display:flex; align-items:center; justify-content:center; gap:10px; padding:20px; color:var(--hpl-stone); font-size:13px; }
.hpl-spinner { width:18px; height:18px; border:2px solid var(--hpl-border); border-top-color:var(--hpl-gold); border-radius:50%; animation:hpl-spin 0.7s linear infinite; }
@keyframes hpl-spin { to{transform:rotate(360deg)} }

.hpl-ota-btn { display:flex; align-items:center; justify-content:space-between; padding:12px 14px; border-radius:4px; text-decoration:none; font-size:13px; font-weight:500; transition:var(--hpl-trans); margin-bottom:8px; position:relative; overflow:hidden; }
.hpl-ota-left { display:flex; align-items:center; gap:8px; }
.hpl-ota-left i { font-size:15px; }
.hpl-ota-right { display:flex; flex-direction:column; align-items:flex-end; }
.hpl-ota-price { font-size:15px; font-weight:700; }
.hpl-ota-right small { font-size:10px; opacity:.75; }
.hpl-cheapest-badge { background:rgba(255,255,255,.25); padding:2px 8px; border-radius:10px; font-size:10px; margin-top:3px; font-weight:600; }
.hpl-cheapest { outline:2px solid rgba(255,255,255,.5); }
.hpl-ota-hotels  { background:#d93025; color:#fff; }
.hpl-ota-hotels:hover  { background:#b5261e; color:#fff; }
.hpl-ota-booking { background:#003580; color:#fff; }
.hpl-ota-booking:hover { background:#00224f; color:#fff; }
.hpl-ota-expedia { background:#1b0088; color:#fff; }
.hpl-ota-expedia:hover { background:#13005e; color:#fff; }
.hpl-ota-direct  { background:transparent; border:1px solid var(--hpl-gold); color:var(--hpl-gold); }
.hpl-ota-direct:hover  { background:var(--hpl-gold); color:#fff; }
.hpl-ota-manual { font-size:11px; opacity:.7; margin-left:4px; }

.hpl-price-summary { margin-top:14px; padding:14px; background:var(--hpl-mist); border:1px solid var(--hpl-border); border-radius:4px; }
.hpl-ps-row { display:flex; justify-content:space-between; font-size:13px; color:var(--hpl-stone); margin-bottom:5px; }
.hpl-ps-total { display:flex; justify-content:space-between; font-size:15px; font-weight:600; color:var(--hpl-dark); padding-top:8px; border-top:1px solid var(--hpl-border); margin-top:8px; }

.hpl-price-error { text-align:center; padding:14px; color:var(--hpl-stone); font-size:13px; }
.hpl-direct-note { font-size:11px; color:var(--hpl-stone); margin-top:8px; line-height:1.5; }

.hpl-contact-list { display:flex; flex-direction:column; gap:2px; }
.hpl-contact-row { display:flex; align-items:center; gap:10px; padding:9px 0; border-bottom:1px solid var(--hpl-border); color:var(--hpl-ink); text-decoration:none; font-size:14px; transition:color .2s; }
.hpl-contact-row:last-child { border-bottom:none; }
.hpl-contact-row:hover { color:var(--hpl-gold); }
.hpl-contact-row i { color:var(--hpl-stone); width:16px; }

.hpl-policies-card .hpl-scard-body { display:flex; flex-direction:column; gap:2px; }
.hpl-policy { display:flex; align-items:flex-start; gap:10px; padding:9px 0; border-bottom:1px solid var(--hpl-border); font-size:13px; }
.hpl-policy:last-child { border-bottom:none; }
.hpl-policy i { color:var(--hpl-gold); margin-top:1px; flex-shrink:0; width:14px; }
.hpl-policy div { flex:1; }
.hpl-policy strong { display:block; color:var(--hpl-ink); margin-bottom:1px; }
.hpl-policy span { color:var(--hpl-stone); }

/* ── CARD / LISTING ── */
.hpl-listing-wrap { background:var(--hpl-mist); }
.hpl-listing-search { background:var(--hpl-primary); padding:24px 32px; }
.hpl-lsearch-inner { display:flex; max-width:700px; margin:0 auto; background:#fff; border-radius:4px; overflow:hidden; box-shadow:0 4px 20px rgba(0,0,0,.15); }
.hpl-lsearch-inner i { padding:0 14px; color:var(--hpl-stone); display:flex; align-items:center; }
.hpl-lsearch-inner input { flex:1; border:none; outline:none; font-size:15px; padding:13px 0; font-family:'DM Sans',sans-serif; }
.hpl-lsearch-inner button { padding:13px 24px; background:var(--hpl-gold); color:#fff; border:none; font-size:14px; font-weight:500; cursor:pointer; transition:background .2s; }
.hpl-lsearch-inner button:hover { background:var(--hpl-gold-l); }

.hpl-listing-layout { display:grid; grid-template-columns:270px 1fr; gap:24px; max-width:1280px; margin:0 auto; padding:24px 32px 60px; }

.hpl-listing-filters { background:var(--hpl-white); border:1px solid var(--hpl-border); border-radius:var(--hpl-radius); padding:20px; position:sticky; top:20px; box-shadow:var(--hpl-shadow); }
.hpl-lf-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:18px; padding-bottom:12px; border-bottom:2px solid var(--hpl-gold); }
.hpl-lf-header h3 { font-family:'Cormorant Garamond',serif; font-size:18px; color:var(--hpl-dark); }
.hpl-lf-header button { background:none; border:none; color:var(--hpl-gold); cursor:pointer; font-size:12px; text-decoration:underline; }
.hpl-lf-group { margin-bottom:18px; padding-bottom:14px; border-bottom:1px solid var(--hpl-border); }
.hpl-lf-group:last-of-type { border-bottom:none; }
.hpl-lf-group h4 { font-size:12px; text-transform:uppercase; letter-spacing:.5px; color:var(--hpl-stone); margin-bottom:10px; font-weight:600; }
.hpl-lf-select, .hpl-lf-input { width:100%; padding:9px 10px; border:1px solid var(--hpl-border); border-radius:4px; font-size:13px; font-family:'DM Sans',sans-serif; outline:none; }
.hpl-lf-select:focus, .hpl-lf-input:focus { border-color:var(--hpl-gold); }
.hpl-lf-radio { display:flex; align-items:center; gap:8px; padding:5px 0; cursor:pointer; font-size:13px; color:var(--hpl-stone); }
.hpl-lf-radio input { accent-color:var(--hpl-gold); cursor:pointer; }
.hpl-lf-apply { width:100%; padding:11px; background:var(--hpl-primary); color:#fff; border:none; border-radius:4px; font-size:14px; font-weight:500; cursor:pointer; transition:background .2s; display:flex; align-items:center; justify-content:center; gap:6px; }
.hpl-lf-apply:hover { background:#00224f; }

.hpl-lr-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:14px; background:var(--hpl-white); padding:12px 16px; border-radius:var(--hpl-radius); border:1px solid var(--hpl-border); }
.hpl-lr-count { font-size:14px; color:var(--hpl-ink); }
.hpl-lr-count span { font-weight:700; color:var(--hpl-primary); font-size:18px; margin-right:4px; }
.hpl-lr-layout { display:flex; gap:4px; }
.hpl-layout-btn { padding:7px 11px; background:var(--hpl-mist); border:1px solid var(--hpl-border); border-radius:4px; cursor:pointer; color:var(--hpl-stone); transition:var(--hpl-trans); }
.hpl-layout-btn.active, .hpl-layout-btn:hover { background:var(--hpl-primary); color:#fff; border-color:var(--hpl-primary); }

.hpl-grid.hpl-layout-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(290px,1fr)); gap:18px; }
.hpl-grid.hpl-layout-list { display:flex; flex-direction:column; gap:14px; }

/* Card */
.hpl-card { background:var(--hpl-white); border:1px solid var(--hpl-border); border-radius:var(--hpl-radius); overflow:hidden; transition:var(--hpl-trans); }
.hpl-card:hover { box-shadow:var(--hpl-shadow-lg); transform:translateY(-3px); }
.hpl-layout-list .hpl-card { display:flex; flex-direction:row; }
.hpl-card-img { position:relative; height:190px; overflow:hidden; flex-shrink:0; }
.hpl-layout-list .hpl-card-img { width:260px; height:auto; min-height:185px; }
.hpl-card-img a { display:block; height:100%; }
.hpl-card-img img { width:100%; height:100%; object-fit:cover; transition:transform .4s ease; }
.hpl-card:hover .hpl-card-img img { transform:scale(1.05); }
.hpl-card-noimg { width:100%; height:100%; background:linear-gradient(135deg,#e8ecf0,#d1d9e6); display:flex; align-items:center; justify-content:center; font-size:44px; }
.hpl-card-disc { position:absolute; top:10px; left:10px; background:var(--hpl-red); color:#fff; padding:3px 9px; border-radius:3px; font-size:11px; font-weight:700; }
.hpl-card-feat { position:absolute; bottom:10px; left:10px; background:var(--hpl-gold); color:#fff; padding:3px 9px; border-radius:3px; font-size:11px; font-weight:600; }
.hpl-card-body { padding:14px; flex:1; display:flex; flex-direction:column; gap:7px; }
.hpl-card-top { display:flex; justify-content:space-between; align-items:flex-start; gap:10px; }
.hpl-card-left { flex:1; }
.hpl-card-stars { color:#f59e0b; font-size:13px; margin-bottom:3px; }
.hpl-card-title { font-size:15px; font-weight:600; color:var(--hpl-ink); line-height:1.3; margin:0; }
.hpl-card-title a { color:inherit; text-decoration:none; transition:color .2s; }
.hpl-card-title a:hover { color:var(--hpl-gold); }
.hpl-card-loc { font-size:12px; color:var(--hpl-stone); display:flex; align-items:center; gap:5px; margin-top:3px; }
.hpl-card-loc i { color:var(--hpl-gold); font-size:11px; }
.hpl-card-rating { text-align:right; flex-shrink:0; }
.hpl-cr-score { display:inline-block; padding:5px 9px; border-radius:4px 4px 4px 0; color:#fff; font-weight:700; font-size:13px; }
.hpl-rating-ex   { background:var(--hpl-primary); }
.hpl-rating-vg   { background:#00853d; }
.hpl-rating-good { background:#5cb85c; }
.hpl-rating-ok   { background:#f0ad4e; }
.hpl-cr-lbl { font-size:11px; color:var(--hpl-stone); margin-top:2px; }
.hpl-cr-rev { font-size:10px; color:var(--hpl-stone); }
.hpl-card-amenities { display:flex; flex-wrap:wrap; gap:4px; }
.hpl-cam { display:flex; align-items:center; gap:4px; padding:3px 7px; background:var(--hpl-mist); border-radius:20px; font-size:11px; color:var(--hpl-ink); white-space:nowrap; }
.hpl-cam i { color:var(--hpl-gold); font-size:10px; }
.hpl-cam-more { font-size:11px; color:var(--hpl-stone); align-self:center; }
.hpl-card-foot { display:flex; justify-content:space-between; align-items:flex-end; margin-top:auto; padding-top:10px; border-top:1px solid var(--hpl-border); }
.hpl-card-price { display:flex; flex-direction:column; gap:1px; }
.hpl-cp-orig { font-size:12px; color:var(--hpl-stone); text-decoration:line-through; }
.hpl-cp-main { display:flex; flex-direction:column; }
.hpl-cp-main small { font-size:10px; color:var(--hpl-stone); }
.hpl-cp-main strong { font-size:18px; font-weight:700; color:var(--hpl-dark); }
.hpl-cp-request { font-size:13px; color:var(--hpl-stone); font-style:italic; }
.hpl-live-price-tag { font-size:10px; color:var(--hpl-stone); }
.hpl-card-actions { display:flex; flex-direction:column; gap:5px; align-items:flex-end; }
.hpl-btn-detail { padding:7px 13px; background:transparent; border:1px solid var(--hpl-gold); color:var(--hpl-gold); border-radius:3px; font-size:12px; font-weight:500; text-decoration:none; transition:var(--hpl-trans); }
.hpl-btn-detail:hover { background:var(--hpl-gold); color:#fff; }
.hpl-btn-book-card { padding:7px 13px; background:var(--hpl-gold); color:#fff; border-radius:3px; font-size:12px; font-weight:500; text-decoration:none; transition:var(--hpl-trans); }
.hpl-btn-book-card:hover { background:var(--hpl-gold-l); }

.hpl-no-results { text-align:center; padding:50px 20px; background:var(--hpl-white); border-radius:var(--hpl-radius); }
.hpl-no-icon { font-size:44px; margin-bottom:12px; }
.hpl-no-results h3 { font-size:18px; color:var(--hpl-dark); margin-bottom:6px; }
.hpl-no-results p { color:var(--hpl-stone); font-size:14px; }

.hpl-loadmore-wrap { text-align:center; margin-top:28px; }
#hpl-loadmore { padding:12px 32px; background:var(--hpl-white); color:var(--hpl-primary); border:2px solid var(--hpl-primary); border-radius:4px; font-size:14px; font-weight:500; cursor:pointer; transition:var(--hpl-trans); display:inline-flex; align-items:center; gap:8px; }
#hpl-loadmore:hover { background:var(--hpl-primary); color:#fff; }

.hpl-mobile-filter-btn { display:none; position:fixed; bottom:20px; left:50%; transform:translateX(-50%); padding:12px 28px; background:var(--hpl-primary); color:#fff; border:none; border-radius:50px; font-size:14px; font-weight:500; cursor:pointer; z-index:80; box-shadow:0 4px 20px rgba(0,0,0,.2); }

/* ── Responsive ── */
@media(max-width:1024px){
  .hpl-single-grid { grid-template-columns:1fr 320px; padding:20px 24px 40px; }
  .hpl-listing-layout { grid-template-columns:240px 1fr; padding:20px 24px 40px; }
  .hpl-amenities-grid { grid-template-columns:repeat(2,1fr); }
}
@media(max-width:768px){
  .hpl-hotel-head { flex-direction:column; padding:20px; }
  .hpl-head-right { width:100%; text-align:left; }
  .hpl-rating-block { justify-content:flex-start; }
  .hpl-price-row { justify-content:flex-start; }
  .hpl-single-grid { grid-template-columns:1fr; padding:16px; }
  .hpl-single-sidebar { position:static; }
  .hpl-listing-layout { grid-template-columns:1fr; }
  .hpl-listing-filters { display:none; position:fixed; inset:0; z-index:200; overflow-y:auto; border-radius:0; }
  .hpl-listing-filters.open { display:block; }
  .hpl-mobile-filter-btn { display:flex; align-items:center; gap:8px; }
  .hpl-gallery { grid-template-columns:1fr; grid-template-rows:280px; }
  .hpl-gallery-side { display:none; }
  .hpl-gallery-main { grid-row:auto; }
  .hpl-snav-links { display:none; }
  .hpl-dining-grid { grid-template-columns:1fr; }
  .hpl-hotel-name { font-size:26px; }
  .hpl-grid.hpl-layout-grid { grid-template-columns:1fr; }
  .hpl-layout-list .hpl-card { flex-direction:column; }
  .hpl-layout-list .hpl-card-img { width:100%; min-height:auto; height:180px; }
}