/* =========================================================
   TREFYLN BARN — LUXE v2.3
   All-out boutique hotel finish
   RULE: never hide images (no clip-path wipe, no opacity:0 on media)
   ========================================================= */

body.tb-front.tb-luxe {
  --luxe-gold: #d4b07a;
  --luxe-gold-bright: #f3e0b8;
  --luxe-ink: #0a100e;
  --luxe-paper: #fffcf8;
  --luxe-ease: cubic-bezier(0.16, 1, 0.3, 1);
  background:
    radial-gradient(ellipse 100% 60% at 50% -10%, rgba(201, 166, 107, 0.09), transparent 55%),
    #f7f2ea;
}

/* —— Media always visible —— */
body.tb-luxe img,
body.tb-luxe .exp-visual,
body.tb-luxe .final-cta-bg,
body.tb-luxe .location-map,
body.tb-luxe .location-map iframe {
  opacity: 1 !important;
  visibility: visible !important;
  clip-path: none !important;
}

body.tb-luxe .hero-slide:not(.active) {
  opacity: 0 !important;
}
body.tb-luxe .hero-slide.active {
  opacity: 1 !important;
}

/* —— Hero: cinematic luxury —— */
body.tb-luxe .hero {
  isolation: isolate;
}

body.tb-luxe .hero-veil {
  background:
    radial-gradient(ellipse 55% 55% at 15% 40%, rgba(8, 14, 11, 0.55), transparent 70%),
    linear-gradient(105deg, rgba(6, 10, 8, 0.9) 0%, rgba(6, 10, 8, 0.45) 46%, rgba(6, 10, 8, 0.18) 70%, rgba(6, 10, 8, 0.55) 100%),
    linear-gradient(180deg, rgba(6, 10, 8, 0.55) 0%, transparent 32%, transparent 58%, rgba(6, 10, 8, 0.82) 100%) !important;
}

body.tb-luxe .hero h1 {
  font-size: clamp(3rem, 7.2vw, 5.6rem) !important;
  letter-spacing: -0.035em !important;
  line-height: 0.96 !important;
  text-shadow: 0 12px 48px rgba(0, 0, 0, 0.45);
}

body.tb-luxe .hero h1 em {
  font-style: italic;
  /* Solid only — gradient clip + shimmer flickered on Brave mobile / Firefox */
  background: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  color: var(--champagne-soft, #e0c49a) !important;
  -webkit-text-fill-color: var(--champagne-soft, #e0c49a) !important;
  animation: none !important;
}

@keyframes luxeShimmer {
  0%, 100% { background-position: 0% center; }
  50% { background-position: 100% center; }
}

body.tb-luxe .hero-trust {
  border: 1px solid rgba(240, 215, 176, 0.28) !important;
  background: rgba(255, 252, 248, 0.1) !important;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

body.tb-luxe .hero-card {
  border-radius: 24px !important;
  border: 1px solid rgba(240, 215, 176, 0.28) !important;
  background: linear-gradient(160deg, rgba(15, 28, 22, 0.62), rgba(10, 16, 14, 0.72)) !important;
  backdrop-filter: blur(22px) saturate(1.2);
  -webkit-backdrop-filter: blur(22px) saturate(1.2);
  box-shadow:
    0 30px 80px rgba(0, 0, 0, 0.4),
    0 0 0 1px rgba(255, 252, 248, 0.06) inset !important;
}

body.tb-luxe .hc-badge {
  background: linear-gradient(135deg, #c9a66b, #f0d7b0) !important;
  color: #0f1c16 !important;
  letter-spacing: 0.14em;
  box-shadow: 0 6px 18px rgba(201, 166, 107, 0.35);
}

body.tb-luxe .hc-list li {
  border-color: rgba(255, 252, 248, 0.1) !important;
  transition: background 0.25s, transform 0.3s var(--luxe-ease);
}

body.tb-luxe .hc-list li:hover {
  background: rgba(255, 252, 248, 0.06);
  transform: translateX(3px);
}

/* Gold CTA liquid */
body.tb-luxe .btn-gold {
  background: linear-gradient(125deg, #a8874f 0%, #d4b07a 35%, #fff0c8 50%, #c9a66b 65%, #9a7a45 100%) !important;
  background-size: 220% 220% !important;
  color: #0a100e !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  border: 0 !important;
  box-shadow:
    0 14px 36px rgba(168, 135, 79, 0.42),
    inset 0 1px 0 rgba(255, 255, 255, 0.4) !important;
  transition: background-position 0.7s var(--luxe-ease), transform 0.35s var(--luxe-ease), box-shadow 0.35s !important;
}

body.tb-luxe .btn-gold:hover {
  background-position: 100% 40% !important;
  transform: translateY(-3px) !important;
  box-shadow:
    0 20px 48px rgba(168, 135, 79, 0.5),
    inset 0 1px 0 rgba(255, 255, 255, 0.5) !important;
}

body.tb-luxe .btn-ghost {
  border-width: 1.5px !important;
  border-color: rgba(240, 215, 176, 0.5) !important;
  backdrop-filter: blur(8px);
}

/* —— Header glass —— */
body.tb-luxe .site-header.scrolled {
  background: rgba(255, 252, 248, 0.9) !important;
  backdrop-filter: blur(18px) saturate(1.25);
  -webkit-backdrop-filter: blur(18px) saturate(1.25);
  box-shadow: 0 10px 40px rgba(15, 20, 16, 0.08) !important;
  border-bottom: 1px solid rgba(201, 166, 107, 0.18) !important;
}

body.tb-luxe .nav-cta {
  box-shadow: 0 8px 24px rgba(201, 166, 107, 0.35) !important;
}

/* —— Trust bar —— */
body.tb-luxe .trust-bar {
  background:
    radial-gradient(ellipse 80% 120% at 20% 50%, rgba(201, 166, 107, 0.14), transparent 55%),
    linear-gradient(180deg, #0c1611, #0a100e) !important;
}

body.tb-luxe .tb-item strong {
  font-size: clamp(1.2rem, 2.4vw, 1.55rem) !important;
  color: var(--luxe-gold-bright) !important;
}

/* —— Stats glass —— */
body.tb-luxe .stats-band-inner {
  border-radius: 28px !important;
  border: 1px solid rgba(201, 166, 107, 0.35) !important;
  background:
    linear-gradient(145deg, rgba(255, 252, 248, 0.98), rgba(244, 236, 224, 0.96)) !important;
  box-shadow:
    0 32px 70px rgba(8, 14, 11, 0.14),
    0 0 0 1px rgba(255, 255, 255, 0.7) inset !important;
}

body.tb-luxe .stat-value {
  font-size: clamp(2.1rem, 4vw, 2.9rem) !important;
  background: linear-gradient(180deg, #1a2e24, #0a100e);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* —— Promise cards —— */
body.tb-luxe .promise-grid {
  border-radius: 24px !important;
  overflow: hidden;
  border: 1px solid rgba(201, 166, 107, 0.2) !important;
  box-shadow: 0 28px 60px rgba(15, 20, 16, 0.1) !important;
}

body.tb-luxe .promise-card {
  background: linear-gradient(180deg, #fffcf8, #f6f0e6) !important;
  transition: background 0.35s, transform 0.45s var(--luxe-ease) !important;
}

body.tb-luxe .promise-card:hover {
  background: #fffcf8 !important;
  z-index: 2;
}

body.tb-luxe .promise-card h3 {
  font-family: var(--font-display, Georgia, serif);
  font-size: 1.5rem;
  font-weight: 500;
}

/* —— Checklist —— */
body.tb-luxe .stay-checklist-inner {
  border-radius: 28px !important;
  border: 1px solid rgba(201, 166, 107, 0.28) !important;
  background: linear-gradient(145deg, #fffcf8, #f2ebe0) !important;
  box-shadow: 0 30px 70px rgba(15, 20, 16, 0.1) !important;
}

body.tb-luxe .check-item {
  border-radius: 16px !important;
  transition: transform 0.4s var(--luxe-ease), box-shadow 0.35s !important;
}

body.tb-luxe .check-item:hover {
  transform: translateY(-4px);
  box-shadow: 0 14px 32px rgba(15, 20, 16, 0.08);
}

body.tb-luxe .check-mark {
  background: linear-gradient(145deg, rgba(201, 166, 107, 0.3), rgba(201, 166, 107, 0.12)) !important;
}

/* —— About —— */
body.tb-luxe .about-images .main {
  border-radius: 24px !important;
  box-shadow: 0 28px 60px rgba(15, 20, 16, 0.14) !important;
}

body.tb-luxe .about-images .side {
  border-radius: 18px !important;
  box-shadow: 0 16px 36px rgba(15, 20, 16, 0.1) !important;
}

body.tb-luxe .about-copy h2 {
  font-size: clamp(2.1rem, 4vw, 3rem) !important;
  letter-spacing: -0.02em;
}

body.tb-luxe .floor-plan > div {
  border-radius: 16px !important;
  border: 1px solid rgba(201, 166, 107, 0.25) !important;
  background: linear-gradient(160deg, #fffcf8, #f4eee4) !important;
}

/* —— Pull quote theater —— */
body.tb-luxe .pull-quote {
  background:
    radial-gradient(ellipse 70% 80% at 50% 0%, rgba(201, 166, 107, 0.16), transparent 55%),
    linear-gradient(180deg, #0c1611, #070d0a) !important;
  padding: clamp(4rem, 8vw, 6rem) 0 !important;
}

body.tb-luxe .pull-quote p {
  font-size: clamp(1.7rem, 3.6vw, 2.55rem) !important;
  line-height: 1.32 !important;
  text-shadow: 0 8px 40px rgba(0, 0, 0, 0.3);
}

/* —— Gallery —— */
body.tb-luxe .gallery-item {
  border-radius: 18px !important;
  box-shadow: 0 8px 28px rgba(15, 20, 16, 0.08);
  transition: transform 0.5s var(--luxe-ease), box-shadow 0.45s !important;
}

body.tb-luxe .gallery-item:hover {
  transform: translateY(-4px);
  box-shadow: 0 22px 48px rgba(15, 20, 16, 0.16);
  z-index: 2;
}

body.tb-luxe .gallery-item img {
  transition: transform 0.9s var(--luxe-ease), filter 0.45s !important;
}

body.tb-luxe .gallery-item:hover img {
  transform: scale(1.06);
  filter: saturate(1.08) contrast(1.04);
}

body.tb-luxe .gallery-caption {
  opacity: 1 !important;
  font-size: 0.72rem !important;
  letter-spacing: 0.08em !important;
}

body.tb-luxe .gallery-filters button.is-active {
  background: #0f1c16 !important;
  color: #f0d7b0 !important;
  box-shadow: 0 10px 28px rgba(15, 28, 22, 0.2);
}

/* —— Sleep dark luxury —— */
body.tb-luxe .sleep-section {
  background:
    radial-gradient(ellipse 60% 50% at 80% 0%, rgba(201, 166, 107, 0.12), transparent 50%),
    linear-gradient(180deg, #101c16, #0a100e) !important;
}

body.tb-luxe .sleep-card {
  border-radius: 20px !important;
  border: 1px solid rgba(255, 252, 248, 0.1) !important;
  overflow: hidden;
  transition: transform 0.5s var(--luxe-ease), box-shadow 0.45s !important;
}

body.tb-luxe .sleep-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 24px 50px rgba(0, 0, 0, 0.35);
}

/* —— Filmstrip —— */
body.tb-luxe .film-card {
  border-radius: 22px !important;
  box-shadow: 0 22px 50px rgba(8, 14, 11, 0.16) !important;
}

body.tb-luxe .film-card.is-center,
body.tb-luxe .film-card:hover {
  transform: scale(1.03);
}

/* —— Experience —— */
body.tb-luxe .exp-card {
  border-radius: 22px !important;
  overflow: hidden;
  border: 1px solid rgba(15, 28, 22, 0.06);
  box-shadow: 0 18px 44px rgba(15, 20, 16, 0.1);
  transition: transform 0.5s var(--luxe-ease), box-shadow 0.45s !important;
}

body.tb-luxe .exp-card:hover {
  transform: translateY(-10px);
  box-shadow: 0 28px 60px rgba(15, 20, 16, 0.16);
}

body.tb-luxe .exp-body h3 {
  font-family: var(--font-display, Georgia, serif);
  font-size: 1.45rem;
  font-weight: 500;
}

/* Day rhythm */
body.tb-luxe .day-rhythm {
  border-radius: 28px !important;
  border: 1px solid rgba(201, 166, 107, 0.22) !important;
  box-shadow: 0 30px 70px rgba(8, 14, 11, 0.2) !important;
}

/* —— Location —— */
body.tb-luxe .loc-photo {
  border-radius: 18px !important;
  box-shadow: 0 16px 40px rgba(15, 20, 16, 0.12) !important;
}

body.tb-luxe .location-map {
  border-radius: 18px !important;
  height: 300px !important;
  min-height: 300px !important;
  box-shadow: 0 18px 44px rgba(15, 20, 16, 0.12) !important;
}

body.tb-luxe .location-map iframe {
  min-height: 300px !important;
}

body.tb-luxe .nearby-chips span {
  border-radius: 999px;
  border: 1px solid rgba(201, 166, 107, 0.28);
  background: #fffcf8;
  transition: transform 0.3s, box-shadow 0.3s, border-color 0.25s;
}

body.tb-luxe .nearby-chips span:hover {
  transform: translateY(-3px);
  border-color: rgba(201, 166, 107, 0.55);
  box-shadow: 0 10px 24px rgba(15, 20, 16, 0.08);
}

body.tb-luxe .season-card {
  border-radius: 18px !important;
  border: 1px solid rgba(201, 166, 107, 0.18) !important;
  background: linear-gradient(180deg, #fffcf8, #f4eee4) !important;
  transition: transform 0.4s var(--luxe-ease), box-shadow 0.35s !important;
}

body.tb-luxe .season-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 36px rgba(15, 20, 16, 0.1);
}

/* —— Reviews —— */
body.tb-luxe .rf-viewport {
  border-radius: 28px !important;
  border: 1px solid rgba(201, 166, 107, 0.35) !important;
  box-shadow: 0 28px 70px rgba(15, 20, 16, 0.12) !important;
  background: linear-gradient(165deg, #fffcf8, #f3ebe0) !important;
}

body.tb-luxe .rf-slide blockquote {
  font-size: clamp(1.35rem, 2.8vw, 1.85rem) !important;
}

body.tb-luxe .review-card {
  border-radius: 20px !important;
  border: 1px solid rgba(201, 166, 107, 0.18) !important;
  background: linear-gradient(165deg, #fffcf8, #f6f0e6) !important;
  transition: transform 0.45s var(--luxe-ease), box-shadow 0.4s !important;
}

body.tb-luxe .review-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 22px 48px rgba(15, 20, 16, 0.12);
}

/* —— Rules / FAQ —— */
body.tb-luxe .rule-card {
  border-radius: 20px !important;
  border: 1px solid rgba(15, 28, 22, 0.08);
  background: linear-gradient(180deg, #fffcf8, #f7f2ea);
  transition: transform 0.4s var(--luxe-ease), box-shadow 0.35s;
}

body.tb-luxe .rule-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 18px 40px rgba(15, 20, 16, 0.1);
}

body.tb-luxe .faq-item {
  border-radius: 16px !important;
  border: 1px solid rgba(15, 28, 22, 0.08) !important;
  background: #fffcf8 !important;
  transition: box-shadow 0.35s, border-color 0.3s, transform 0.35s;
}

body.tb-luxe .faq-item.open {
  border-color: rgba(201, 166, 107, 0.4) !important;
  box-shadow: 0 16px 40px rgba(15, 20, 16, 0.08);
  transform: translateY(-2px);
}

body.tb-luxe .faq-search input {
  border-radius: 999px !important;
  border: 1px solid rgba(201, 166, 107, 0.35) !important;
  box-shadow: 0 10px 28px rgba(15, 20, 16, 0.06);
}

/* —— Booking —— */
body.tb-luxe .book-reason {
  border-radius: 18px !important;
  border: 1px solid rgba(201, 166, 107, 0.28) !important;
  background: linear-gradient(165deg, #fffcf8, #f3ebe0) !important;
  transition: transform 0.4s var(--luxe-ease), box-shadow 0.35s;
}

body.tb-luxe .book-reason:hover {
  transform: translateY(-5px);
  box-shadow: 0 16px 36px rgba(15, 20, 16, 0.1);
}

body.tb-luxe .booking-wrap {
  border-radius: 28px !important;
  overflow: hidden;
  box-shadow: 0 32px 80px rgba(15, 20, 16, 0.14) !important;
}

body.tb-luxe .book-steps {
  background: rgba(15, 28, 22, 0.04);
  border-radius: 999px;
  padding: 0.3rem;
}

body.tb-luxe .book-step.is-active {
  background: #0f1c16 !important;
  color: #f0d7b0 !important;
  box-shadow: 0 10px 24px rgba(15, 28, 22, 0.2);
}

body.tb-luxe .field input:focus,
body.tb-luxe .field select:focus,
body.tb-luxe .field textarea:focus {
  border-color: rgba(201, 166, 107, 0.65) !important;
  box-shadow: 0 0 0 4px rgba(201, 166, 107, 0.16) !important;
}

/* —— Final CTA —— */
body.tb-luxe .final-cta {
  min-height: 54vh;
}

body.tb-luxe .final-cta-inner h2 {
  font-size: clamp(2.6rem, 5.8vw, 4.2rem) !important;
  text-shadow: 0 12px 48px rgba(0, 0, 0, 0.5);
}

body.tb-luxe .final-cta-inner h2 em {
  background: linear-gradient(120deg, #f0d7b0, #fff, #c9a66b);
  background-size: 200% auto;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: luxeShimmer 6s ease-in-out infinite;
}

/* —— Host —— */
body.tb-luxe .host-card {
  border-radius: 28px !important;
  border: 1px solid rgba(201, 166, 107, 0.3) !important;
  background: linear-gradient(135deg, #fffcf8, #f2ebe0) !important;
  box-shadow: 0 24px 56px rgba(15, 20, 16, 0.1) !important;
}

body.tb-luxe .host-photo {
  border: 3px solid rgba(201, 166, 107, 0.5) !important;
  box-shadow: 0 12px 28px rgba(15, 20, 16, 0.15);
}

/* —— Footer —— */
body.tb-luxe .site-footer {
  background:
    radial-gradient(ellipse 90% 60% at 50% 0%, rgba(201, 166, 107, 0.12), transparent 55%),
    linear-gradient(180deg, #0c1611, #060a08) !important;
}

/* —— Back top —— */
body.tb-luxe .back-top {
  width: 54px !important;
  height: 54px !important;
  right: 1.35rem !important;
  background: #0a100e !important;
  color: #f3e0b8 !important;
  border: 1px solid rgba(240, 215, 176, 0.55) !important;
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.3) !important;
}

body.tb-luxe .back-top:hover {
  background: linear-gradient(135deg, #c9a66b, #f0d7b0) !important;
  color: #0a100e !important;
}

/* —— Section titles —— */
body.tb-luxe .section-head h2 {
  font-size: clamp(2.15rem, 4.2vw, 3.2rem) !important;
  letter-spacing: -0.025em !important;
  line-height: 1.1 !important;
}

body.tb-luxe .eyebrow {
  letter-spacing: 0.24em !important;
  color: #a8874f !important;
}

body.tb-luxe .eyebrow::before {
  content: "";
  display: inline-block;
  width: 20px;
  height: 1px;
  margin-right: 0.55rem;
  vertical-align: middle;
  background: #c9a66b;
}

/* —— Soft reveal (safe — never zero-opacity trap on media parents for long) —— */
body.tb-luxe.js-reveal .reveal:not(.visible) {
  opacity: 0.15;
  transform: translateY(18px);
  filter: none;
  clip-path: none;
  transition: opacity 0.75s var(--luxe-ease), transform 0.75s var(--luxe-ease);
}

body.tb-luxe.js-reveal .reveal.visible {
  opacity: 1;
  transform: none;
}

/* Parents that contain photos: always fully visible */
body.tb-luxe .gallery-grid.reveal,
body.tb-luxe .about-images.reveal,
body.tb-luxe .location-visual.reveal,
body.tb-luxe .location-visual {
  opacity: 1 !important;
  transform: none !important;
  filter: none !important;
}

/* —— Atmosphere —— */
body.tb-luxe .atm-chip {
  border-color: rgba(201, 166, 107, 0.3);
  box-shadow: 0 6px 16px rgba(15, 20, 16, 0.04);
}

body.tb-luxe .atm-chip:hover {
  background: #0f1c16;
  color: #f0d7b0;
  border-color: #0f1c16;
}

/* —— Amenities —— */
body.tb-luxe .amenity-cat {
  border-radius: 20px !important;
  border: 1px solid rgba(201, 166, 107, 0.18);
  background: linear-gradient(165deg, #fffcf8, #f5efe6);
  transition: transform 0.4s var(--luxe-ease), box-shadow 0.35s;
}

body.tb-luxe .amenity-cat:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 36px rgba(15, 20, 16, 0.08);
}

body.tb-luxe .amenity-chips li:hover {
  background: #0f1c16 !important;
  color: #f0d7b0 !important;
  border-color: #0f1c16 !important;
}

/* —— Scroll progress —— */
body.tb-luxe .scroll-progress {
  height: 3px !important;
  background: linear-gradient(90deg, #8f7140, #f0d7b0, #c9a66b, #fff4d6, #8f7140) !important;
  background-size: 300% 100% !important;
  box-shadow: 0 0 18px rgba(201, 166, 107, 0.7) !important;
}

/* —— Mobile book bar —— */
body.tb-luxe .mobile-book-bar-inner {
  background: rgba(10, 16, 14, 0.94) !important;
  border-top: 1px solid rgba(201, 166, 107, 0.25);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

body.tb-luxe .mobile-book-bar .info strong {
  color: #f0d7b0;
}

body.tb-luxe .mobile-book-bar .info span {
  color: rgba(255, 252, 248, 0.65);
}

/* —— Luxe entrance badge —— */
.luxe-est {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  margin-bottom: 0.85rem;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(240, 215, 176, 0.85);
}

.luxe-est::before,
.luxe-est::after {
  content: "";
  width: 18px;
  height: 1px;
  background: rgba(240, 215, 176, 0.45);
}

/* —— Reduced motion —— */
@media (prefers-reduced-motion: reduce) {
  body.tb-luxe .hero h1 em,
  body.tb-luxe .final-cta-inner h2 em,
  body.tb-luxe .scroll-progress {
    animation: none !important;
  }

  body.tb-luxe.js-reveal .reveal:not(.visible),
  body.tb-luxe.js-reveal .reveal.visible {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* —— Mobile polish —— */
@media (max-width: 720px) {
  body.tb-luxe .hero h1 {
    font-size: clamp(2.3rem, 10vw, 3rem) !important;
  }

  body.tb-luxe .location-map {
    height: 250px !important;
    min-height: 250px !important;
  }

  body.tb-luxe .promise-card:hover,
  body.tb-luxe .exp-card:hover,
  body.tb-luxe .review-card:hover,
  body.tb-luxe .sleep-card:hover {
    transform: none;
  }
}