.elementor-kit-5995{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-typography-primary-font-family:"Heebo";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Heebo";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Heebo";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Heebo";--e-global-typography-accent-font-weight:500;--e-global-typography-bf02e41-font-size:24px;--e-global-typography-bf02e41-font-weight:600;--e-global-typography-5ca3ddd-font-family:"Heebo";--e-global-typography-5ca3ddd-font-weight:400;}.elementor-kit-5995 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}
/* Start custom CSS *//* ==========================================================================
   TAYA TOURISM · SITE CSS
   גרסה נקייה, מסודרת וללא כפילויות

   תוכן עניינים
   01  משתני עיצוב וצבעים
   02  כללי בסיס
   03  עברית ו-RTL
   04  רקעי מקטעים
   05  ריווח מקטעים
   06  כותרות
   07  סגנונות טקסט
   08  פירורי לחם
   09  מקטע פתיחה
   10  קווי הפרדה
   11  שורת כותרת פתיחה
   12  כפתורים
   13  חצים ואייקונים
   14  קרוסלת מלונות ישנה
   15  התאמות רספונסיביות כלליות
   16  טבלת השוואה
   17  שאלות נפוצות
   18  אקורדיון מידע
   19  מפת יעדים
   20  מדריך מקסיקו
   21  קרוסלת כרטיסי מלונות
   22  קרוסלת כרטיסי יעדים
   23  כפתור CTA כללי
   24  Hero של יעד
   25  Hero ראשי של טאיה
   26  טפסים, השלמה אוטומטית ולוח שנה
   27  עמוד Start Planning
   28  תיקוני גלילה וחצים בקרוסלה
   29  תיקוני עיצוב כלליים
   30  שאלות נפוצות בעברית
   31  טבלת השוואה בעברית
   32  קרוסלת יעדים בעברית, מבנה
   33  קרוסלת יעדים בעברית, כרטיסים
   34  קרוסלת מלונות ומתגי שפה
   35  תיקוני טפסים במובייל
   36  עמוד כל המלונות
   37  גלריית מלון
   38  עיצוב פוסט ומדריך
   39  פוסט ומדריך בעברית
   40  הודעת Cookies
   41  הגדרות פונט Ploni
   42  תיקוני Hero במובייל
   43  תיקונים סופיים לפוסטים
   ========================================================================== */

/* ════════════════════════════════════════════════════════════════════
   01 · DESIGN TOKENS
   Brand color palette. Change a value here and it updates site-wide.
   ════════════════════════════════════════════════════════════════════ */
:root {
  --light: #f8f8f7;
  --dark: #1a1a19;
  --accent: #00218a;
  --warm: #d6c3a3;
  --gray: #a6a6a6;
  --soft: #f0f0ef;
  --font-ui-en: "Heebo", Arial, sans-serif;
  --font-ui-he: "Ploni", "Heebo", Arial, sans-serif;
  --font-serif: "Cormorant Garamond", Georgia, serif;
  --font-mono: "IBM Plex Mono", monospace;
  --hero-overlay: rgba(0, 0, 0, 0.75); /* dark scrim over the hero image */
  --divider-dark-line: rgba(26, 26, 25, 0.14); /* shared dark divider line color */
}
/* ════════════════════════════════════════════════════════════════════
   02 · BASE
   Page-wide defaults: no horizontal scroll, base bg + text colors.
   ════════════════════════════════════════════════════════════════════ */
html,
body {
  overflow-x: hidden;
}
body {
  background-color: var(--light) !important;
  color: var(--dark) !important;
  font-family: var(--font-ui-en);
}
body a:not([class*="button"]) {
  color: var(--accent);
}
body p,
body span,
body li {
  color: inherit;
}
/* ════════════════════════════════════════════════════════════════════
   03 · HEBREW / RTL
   Applied only to pages with the .custom-hebrew-page body class.
   ════════════════════════════════════════════════════════════════════ */
body.custom-hebrew-page {
  font-family: var(--font-ui-he) !important;
}
body.custom-hebrew-page :where(h1,h2,h3,h4,h5,h6,p,li,a,button,input,select,textarea,option,label,small,strong,b,.elementor-button,.elementor-heading-title,.elementor-field,.elementor-nav-menu a,.rank-math-breadcrumb,.flatpickr-calendar) {
  font-family: inherit !important;
}
body.custom-hebrew-page input,
body.custom-hebrew-page textarea {
  direction: rtl;
}

/* ════════════════════════════════════════════════════════════════════
   04 · SECTION BACKGROUNDS
   Every section needs the .ts class. Each section maps to a bg color.
   ════════════════════════════════════════════════════════════════════ */
.ts,
.ts.e-con,
.ts.elementor-element {
  background-color: var(--section-bg, transparent) !important;
}
/* Light-background sections */
.ts.s-opening,
.ts.s-cta,
.ts.s-info-map,
.ts.s-hotels,
.ts.s-comparison {
  --section-bg: var(--light);
}
/* Dark-background sections */
.ts.faq,
.ts.destinations-carousel,
.ts.s-steps {
  --section-bg: var(--dark);
}
/* Hero — self-contained: dark overlay + centered flex column.
   Works on BOTH classic sections and Atomic Flexbox elements.
   (class order doesn't matter: .ts.s-hero == "ts s-hero" == "s-hero ts") */
.ts.s-hero {
  --section-bg: transparent;
  position: relative !important;
  display: flex !important;
  flex-direction: column !important; /* stack: heading → paragraph → next element … */
  align-items: center !important; /* horizontal centering */
  justify-content: center !important; /* vertical centering */
  text-align: center !important;
  gap: 50px !important; /* ← space between hero elements. Change this number. */
  /* Dark scrim over the bg image. Inset box-shadow paints ABOVE the
     background but BELOW all text/content — no z-index / nesting issues.
     Change the color/opacity via the --hero-overlay token (section 01). */
  box-shadow: inset 0 0 0 2000px var(--hero-overlay) !important;
}
/* Fix: inner carousel bg must match its parent section */
.ts.s-hotels .hotel-carousel,
.ts.s-hotels .hotel-carousel.e-con {
  background-color: var(--light) !important;
}
/* ════════════════════════════════════════════════════════════════════
   05 · SECTION PADDING
   Central place to control top/bottom/side spacing of each section.
   ════════════════════════════════════════════════════════════════════ */
.ts.s-hero {
  padding-top: 120px !important;
  padding-bottom: 120px !important;
}
.ts.s-opening {
  padding-top: 50px !important;
  padding-bottom: 20px !important;
}
.ts.s-cta {
  padding-top: 0px !important;
  padding-bottom: 100px !important;
}
.ts.s-info-map {
  padding-top: 100px !important;
  padding-right: 150px !important;
  padding-bottom: 100px !important;
  padding-left: 150px !important;
}
.ts.s-info-map .two-boxes-map {
  gap: 32px !important;
} /* info-map inner column gap */
.ts.s-hotels {
  padding-top: 100px !important;
  padding-bottom: 100px !important;
}
.ts.faq {
  padding-top: 100px !important;
  padding-bottom: 100px !important;
  padding-left: 200px !important;
  padding-right: 200px !important;
}
.ts.destinations-carousel {
  padding-top: 40px !important;
  padding-bottom: 100px !important;
}
.ts.s-comparison {
  padding-top: 100px !important;
  padding-bottom: 100px !important;
  padding-left: 200px !important;
  padding-right: 200px !important;
}
/* +50px מעל כותרת קרוסלת הערים בלבד */
.ts.destinations-carousel > h2 {
  margin-top: 50px !important;
}
.ts.s-steps {
  padding-top: 100px !important;
  padding-bottom: 100px !important;
}
.ts.s-contact {
  padding-top: 100px !important;
  padding-bottom: 100px !important;
}
.ts.hotel-carousel {
  padding-top: 100px !important;
  padding-bottom: 30px !important;
}
.ts.hotel-carousel-section {
  padding-bottom: 100px !important;
}
/* ════════════════════════════════════════════════════════════════════
   06 · HEADLINES
   Global heading defaults, then hero + per-section overrides.
   ════════════════════════════════════════════════════════════════════ */
/* Global defaults */
.ts h1,
.ts h2,
.ts h3,
.ts [class*="heading-title"],
.ts [class*="e-n-heading"] {
  font-size: 36px !important;
  line-height: 1.1 !important;
  text-align: center !important;
  font-weight: 800 !important;
  margin: 0 !important;
  text-transform: none !important;
  padding-bottom: 30px;
}
/* Hero — large light headline */
.ts.s-hero h1,
.ts.s-hero h2,
.ts.s-hero h3,
.ts.s-hero [class*="heading-title"] {
  font-size: clamp(40px, 6vw, 80px) !important;
  color: var(--light) !important;
}
/* Hero — white paragraph text */
.ts.s-hero p,
.ts.s-hero p * {
  color: var(--light) !important;
}
/* Light sections — dark headlines */
.ts.s-opening [class*="heading-title"],
.ts.s-cta [class*="heading-title"],
.ts.s-info-map [class*="heading-title"],
.ts.s-hotels [class*="heading-title"],
.ts.s-comparison [class*="heading-title"] {
  color: var(--dark) !important;
}
/* Dark sections — light headlines */
.ts.destinations-carousel [class*="heading-title"],
.ts.destinations-carousel h1,
.ts.destinations-carousel h2,
.ts.destinations-carousel h3,
.ts.s-steps [class*="heading-title"],
.ts.s-steps h1,
.ts.s-steps h2,
.ts.s-steps h3,
.ts.s-contact [class*="heading-title"],
.ts.s-contact h1,
.ts.s-contact h2,
.ts.s-contact h3 {
  color: var(--light) !important;
}
/* Per-section headline spacing */
.ts.s-info-map [class*="heading-title"] {
  padding-top: 50px !important;
  padding-bottom: 20px !important;
}
.ts.s-hotels [class*="heading-title"] {
  padding-top: 50px !important;
  padding-bottom: 20px !important;
}
.ts.faq [class*="heading-title"] {
  padding-bottom: 20px !important;
}
.ts.destinations-carousel [class*="heading-title"] {
  padding-top: 50px !important;
  padding-bottom: 20px !important;
}
.ts.faq [class*="heading-title"],
.ts.faq h1,
.ts.faq h2,
.ts.faq h3 {
  color: var(--faq-heading-color) !important;
  text-align: center !important;
}
/* ════════════════════════════════════════════════════════════════════
   07 · TEXT ROLES
   Reusable text styles applied via helper classes on any section.
   ════════════════════════════════════════════════════════════════════ */
.ts .kicker-dark [class*="heading-title"] {
  color: var(--dark) !important;
}
.ts .kicker-light [class*="heading-title"] {
  color: var(--warm) !important;
}
.ts .kicker-gray,
.ts .kicker-gray [class*="heading-title"] {
  color: var(--gray) !important;
  text-align: center !important;
  font-size: 10px !important;
}
.ts .kicker-first,
.ts .kicker-first [class*="heading-title"] {
  color: var(--dark) !important;
  text-align: center !important;
  font-size: 12px !important;
  text-transform: uppercase !important;
}
.ts .text-dark,
.ts .text-dark p,
.ts .text-dark li,
.ts .text-dark span,
.ts .text-dark strong {
  color: var(--gray) !important;
  text-align: center !important;
}
.ts .text-light,
.ts .text-light p,
.ts .text-light li,
.ts .text-light span,
.ts .text-light strong {
  color: var(--light) !important;
}
.ts .label-sm [class*="heading-title"],
.ts .label-sm h1,
.ts .label-sm h2,
.ts .label-sm h3 {
  font-size: 7px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
/* ════════════════════════════════════════════════════════════════════
   08 · BREADCRUMBS (Rank Math)
   Full-bleed, minimalist breadcrumb bar.
   ════════════════════════════════════════════════════════════════════ */
.rank-math-breadcrumb {
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  background-color: transparent;
  border: none;
  padding: 12px 0 12px 195px;
  text-align: left;
  font-family: inherit;
  font-size: 12px;
}
/* Links + text — uniform color and weight */
.rank-math-breadcrumb *,
.rank-math-breadcrumb a,
.rank-math-breadcrumb > a,
.rank-math-breadcrumb span,
.rank-math-breadcrumb span a,
.rank-math-breadcrumb [href] {
  color: #666 !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  padding: 2px 6px !important;
  transition: color 0.15s ease !important;
}
.rank-math-breadcrumb a:hover,
.rank-math-breadcrumb [href]:hover {
  color: #000 !important;
}
.rank-math-breadcrumb .separator {
  color: #bbb !important;
  font-weight: 400 !important;
  padding: 0 !important;
}
@media (max-width: 768px) {
  .rank-math-breadcrumb {
    font-size: 13px;
    padding: 10px 0 10px 16px;
  }
}
/* ════════════════════════════════════════════════════════════════════
   09 · OPENING SECTION
   Narrow, centered intro block with a small uppercase heading.
   ════════════════════════════════════════════════════════════════════ */
.ts.s-opening {
  padding-left: 500px !important;
  padding-right: 500px !important;
  text-align: center !important;
}
.ts.s-opening.e-con {
  flex-direction: column !important;
  align-items: center !important;
}
.ts.s-opening > .e-con-inner {
  flex-direction: column !important;
  align-items: center !important;
}
.ts.s-opening h1,
.ts.s-opening h2,
.ts.s-opening h3,
.ts.s-opening [class*="heading-title"] {
  font-size: 12px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
.ts.s-opening p {
  font-size: 15px !important;
}
/* ════════════════════════════════════════════════════════════════════
   10 · DIVIDER SECTIONS
   Thin full-width horizontal rules (light on dark / dark on light).
   Targets ANY divider inside the section — no need for a divider-light /
   divider-dark class on the widget itself.
   ════════════════════════════════════════════════════════════════════ */
.ts.divider-section-light {
  background-color: var(--dark) !important;
}
.ts.divider-section-dark {
  background-color: var(--light) !important;
}
/* ── LIGHT divider line (inside a .divider-section-light) ──────────── */
.ts.divider-section-light .elementor-divider,
.ts.divider-section-light .elementor-divider-separator,
.ts.divider-section-light .elementor-divider-separator::before,
.ts.divider-section-light .elementor-divider-separator::after,
.ts.divider-section-light .divider-light .elementor-divider-separator::after {
  --divider-color: var(--light) !important;
  border-top-color: var(--light) !important;
  border-block-start-color: var(--light) !important;
  border-color: var(--light) !important;
  background: var(--light) !important;
  color: var(--light) !important;
  opacity: 1 !important;
}
/* ── DARK divider line (inside a .divider-section-dark) — hero color ─
   KEY FIX: Elementor reads the line color from --divider-color set on the
   WIDGET WRAPPER (.elementor-widget-divider), so we override it there —
   plus on the separator + :after that actually paints the line. Works
   even when the widget has NO divider-dark class. ─────────────────── */
.ts.divider-section-dark .elementor-widget-divider,
.ts.divider-section-dark .elementor-divider,
.ts.divider-section-dark .elementor-divider-separator,
.ts.divider-section-dark .elementor-divider-separator::before,
.ts.divider-section-dark .elementor-divider-separator::after,
.ts.divider-section-dark .divider-dark .elementor-divider-separator::after {
  --divider-color: var(--divider-dark-line) !important;
  --e-divider-color: var(--divider-dark-line) !important;
  border-top-color: var(--divider-dark-line) !important;
  border-block-start-color: var(--divider-dark-line) !important;
  border-color: var(--divider-dark-line) !important;
  background: var(--divider-dark-line) !important;
  color: var(--divider-dark-line) !important;
  opacity: 1 !important;
}
/* ── Plain <hr> dividers ──────────────────────────────────────────── */
hr.divider-light {
  width: min(100%, 1300px) !important;
  max-width: 1300px !important;
  height: 1px !important;
  border: none !important;
  border-top: 1px solid var(--light) !important;
  background: var(--light) !important;
  opacity: 1 !important;
  margin: 0 auto !important;
}
hr.divider-dark,
.ts.divider-section-dark hr {
  width: min(100%, 1300px) !important;
  max-width: 1300px !important;
  height: 1px !important;
  border: none !important;
  border-top: 1px solid var(--divider-dark-line) !important;
  background: var(--divider-dark-line) !important;
  opacity: 1 !important;
  margin: 0 auto !important;
}
/* ── Elementor divider-dark widgets anywhere, kept in sync ─────────── */
.ts .divider-dark .elementor-divider,
.ts .divider-dark .elementor-divider-separator,
.ts .divider-dark .elementor-divider-separator::before,
.ts .divider-dark .elementor-divider-separator::after {
  --divider-color: var(--divider-dark-line) !important;
  border-top-color: var(--divider-dark-line) !important;
  border-block-start-color: var(--divider-dark-line) !important;
  border-color: var(--divider-dark-line) !important;
  background: var(--divider-dark-line) !important;
  color: var(--divider-dark-line) !important;
}
/* ════════════════════════════════════════════════════════════════════
   11 · OPENING HEADLINE ROW
   A small label on the left + a horizontal line filling the rest.
   ════════════════════════════════════════════════════════════════════ */
.ts.s-opening-headline {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  width: 100% !important;
}
.ts.s-opening-headline > *:first-child {
  width: 5% !important;
  flex: 0 0 5% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
}
.ts.s-opening-headline > *:last-child {
  width: 95% !important;
  flex: 0 0 95% !important;
  text-align: left !important;
}
.ts.s-opening-headline [class*="heading-title"],
.ts.s-opening-headline h1,
.ts.s-opening-headline h2,
.ts.s-opening-headline h3 {
  font-size: 12px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  text-align: left !important;
  color: var(--dark) !important;
  margin: 0 !important;
}
.ts.s-opening-headline [class*="divider-separator"],
.ts.s-opening-headline hr {
  border-color: var(--divider-dark-line) !important;
  background-color: var(--divider-dark-line) !important;
  width: 100% !important;
}
/* ════════════════════════════════════════════════════════════════════
   12 · BUTTONS
   Shared button shape, then color variants: dark / light / accent + outlines.
   ════════════════════════════════════════════════════════════════════ */
.ts .btn-dark [class*="button"],
.ts .btn-dark a[class*="button"],
.ts .btn-dark-outline [class*="button"],
.ts .btn-dark-outline a[class*="button"],
.ts .btn-light [class*="button"],
.ts .btn-light a[class*="button"],
.ts .btn-light-outline [class*="button"],
.ts .btn-light-outline a[class*="button"],
.ts .btn-accent [class*="button"],
.ts .btn-accent a[class*="button"] {
  border-radius: 100px !important;
  padding: 15px 23px !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  box-shadow: none !important;
  text-decoration: none !important;
}
.ts .btn-dark [class*="button"],
.ts .btn-dark a[class*="button"] {
  background: var(--dark) !important;
  color: var(--light) !important;
  border: 1px solid var(--dark) !important;
}
.ts .btn-dark [class*="button"]:hover,
.ts .btn-dark a[class*="button"]:hover {
  background: #2a2a2a !important;
  border-color: #2a2a2a !important;
}
.ts .btn-dark-outline [class*="button"],
.ts .btn-dark-outline a[class*="button"] {
  background: transparent !important;
  color: var(--dark) !important;
  border: 1px solid var(--dark) !important;
}
.ts .btn-light [class*="button"],
.ts .btn-light a[class*="button"] {
  background: var(--light) !important;
  color: var(--dark) !important;
  border: 1px solid var(--light) !important;
}
.ts .btn-light-outline [class*="button"],
.ts .btn-light-outline a[class*="button"] {
  background: transparent !important;
  color: var(--light) !important;
  border: 1px solid var(--light) !important;
}
.ts .btn-accent [class*="button"],
.ts .btn-accent a[class*="button"] {
  background: var(--accent) !important;
  color: var(--light) !important;
  border: 1px solid var(--accent) !important;
}
/* ════════════════════════════════════════════════════════════════════
   13 · ARROWS
   Generic svg arrow icon colors (dark / light variants).
   ════════════════════════════════════════════════════════════════════ */
.ts .arrow-dark svg rect,
.ts .arrow-dark svg circle {
  stroke: rgba(26, 26, 25, 0.25) !important;
}
.ts .arrow-dark svg path {
  stroke: var(--dark) !important;
  fill: var(--dark) !important;
}
.ts .arrow-light svg rect,
.ts .arrow-light svg circle {
  stroke: rgba(248, 248, 247, 0.25) !important;
}
.ts .arrow-light svg path {
  stroke: var(--light) !important;
  fill: var(--light) !important;
}
/* ════════════════════════════════════════════════════════════════════
   14 · HOTEL CAROUSEL — LEGACY (slick-based)
   The OLD hotel slider (.hotel-*, .slick-*). Superseded by the new
   .thc carousel (section 21) but kept for any page still using it.
   ════════════════════════════════════════════════════════════════════ */
/* Top CTA pill */
.ts .hotel-top-cta [class*="button"],
.ts .hotel-top-cta a {
  background: var(--light) !important;
  color: var(--dark) !important;
  border-radius: 100px !important;
  padding: 4px 12px !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  box-shadow: none !important;
  text-decoration: none !important;
  outline: none !important;
  white-space: nowrap !important;
}
.ts .hotel-top-cta svg {
  width: 9px !important;
}
.ts .hotel-top-cta svg path {
  fill: transparent !important;
  stroke: var(--dark) !important;
}
.ts .hotel-top-cta:hover svg path {
  fill: transparent !important;
  stroke: var(--dark) !important;
}
/* Prev / next arrows */
.ts .hotel-arrow-prev,
.ts .hotel-arrow-next {
  cursor: pointer;
}
.ts .hotel-arrow-prev [class*="icon"],
.ts .hotel-arrow-next [class*="icon"] {
  border-radius: 50%;
  display: flex;
  align-items: center;
}
.ts .hotel-arrow-prev:hover [class*="icon"] svg,
.ts .hotel-arrow-next:hover [class*="icon"] svg {
  background: var(--accent) !important;
  border-radius: 50%;
}
/* Card corner button + title + price */
.ts .hotel-card-corner-btn [class*="icon"] svg,
.ts .hotel-card-corner-btn [class*="icon"] svg * {
  fill: var(--dark) !important;
  transition: fill 0.1s ease !important;
}
.ts .hotel-card-corner-btn [class*="icon"]:hover svg * {
  fill: #444 !important;
}
.ts .hotel-card-title [class*="heading-title"] {
  font-family: inherit !important;
  font-size: 4.8rem !important;
  font-weight: 700 !important;
  line-height: 1.08 !important;
  letter-spacing: -0.04em !important;
  color: var(--light) !important;
  margin: 0 !important;
  text-transform: none !important;
}
.ts .hotel-card-price,
.ts .hotel-card-price [class*="heading-title"],
.ts .hotel-card-price span {
  font-family: inherit !important;
  font-size: 2.8rem !important;
  font-weight: 700 !important;
  line-height: 3rem !important;
  color: var(--light) !important;
}
.ts .hotel-card-price s {
  font-size: 1.6rem !important;
  font-weight: 500 !important;
  color: var(--light) !important;
  opacity: 0.8 !important;
}
.ts .hotel-card-price span {
  font-size: 16px !important;
  line-height: 16px !important;
  vertical-align: middle !important;
}
.ts.hotel-carousel .hotel-card-price,
.ts.hotel-carousel .hotel-card-price [class*="heading-title"] {
  width: 100% !important;
  text-align: left !important;
  align-self: flex-start !important;
}
/* Slide image + overlays */
.ts .hotel-slide-img {
  position: relative !important;
}
.ts .hotel-slide-img::before,
.ts .hotel-slide-img::after {
  content: "";
  position: absolute;
  width: 100%;
  left: 0;
  background: linear-gradient(179.27deg, #000 16.88%, rgba(102, 102, 102, 0) 68.66%);
  opacity: 0.65;
  border-radius: 4rem;
  z-index: 1;
  pointer-events: none;
}
.ts .hotel-slide-img::before {
  height: 369px;
  top: -20px;
}
.ts .hotel-slide-img::after {
  height: calc(100% + 72px);
  bottom: -20px;
  transform: rotate(180deg);
}
.ts .hotel-slide-img img {
  width: 100% !important;
  height: 65.8rem !important;
  object-fit: cover !important;
  opacity: 0.65 !important;
  border-radius: 4rem !important;
  display: block !important;
}
/* Slick track + dots */
.ts .hotel-carousel-track {
  position: relative;
}
.ts .hotel-carousel-track .slick-slide {
  width: 48rem !important;
  margin: 0 2rem !important;
}
.ts .hotel-carousel-track .slick-list {
  margin: 0 -2rem !important;
  overflow: visible !important;
}
.ts .hotel-carousel-track .slick-prev,
.ts .hotel-carousel-track .slick-next {
  background: rgba(0, 0, 0, 0.5);
  border-radius: 50%;
  width: 47px;
  height: 47px;
  padding: 11px;
  border: 1px solid #000;
  z-index: 1000;
  top: -85px;
}
.ts .hotel-carousel-track .slick-prev {
  right: 67px !important;
  left: auto !important;
}
.ts .hotel-carousel-track .slick-next {
  right: 0 !important;
}
.ts .hotel-carousel-track .slick-slide > a {
  padding: 0 !important;
}
.ts .hotel-carousel-track .hotel-slide-img {
  clip-path: url(#hotel-offers-cp);
}
.ts .hotel-carousel-track li.slick-active {
  width: 28px !important;
  height: 12px !important;
  background: #000 !important;
  border-radius: 16px;
  transition: 0.35s all ease;
}
.ts .hotel-carousel-track .slick-dots li {
  width: 12px;
  height: 12px;
  background: rgba(0, 0, 0, 0.25);
  border-radius: 16px;
}
.ts .hotel-carousel-track .slick-dots li button {
  padding: 0 !important;
  height: 12px !important;
}
.ts .hotel-carousel-track .slick-dots li button:before {
  line-height: 12px;
  color: transparent;
}
.ts .hotel-carousel-track ul.slick-dots {
  bottom: -44px;
}
.ts .hotel-carousel-track .slick-dots {
  display: none !important;
}
/* ════════════════════════════════════════════════════════════════════
   15 · RESPONSIVE (global)
   Breakpoints for everything above. Card carousels (.thc / .tdc) have
   their own responsive rules in sections 21–22.
   ════════════════════════════════════════════════════════════════════ */
@media (max-width: 1200px) {
  .ts.s-opening {
    padding-left: 200px !important;
    padding-right: 200px !important;
  }
}
@media (max-width: 1000px) {
  .ts .hotel-carousel-track .slick-slide {
    width: 440px !important;
    margin-right: 30px !important;
  }
}
@media (max-width: 767px) {
  /* Side padding */
  .ts {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
  .ts.s-opening {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  .ts.s-info-map {
    padding-top: 40px !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
  .ts.s-info-map [class*="heading-title"] {
    padding-top: 20px !important;
  }
  .ts.s-comparison {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  .ts.faq {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  .ts.s-hero .form-button {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  .ts .hotel-card-price span {
    font-size: 1.6rem !important;
  }
  /* CTA + carousel submit buttons: full-width */
  .ts.s-cta .cta-submit-button,
  .ts.hotel-carousel-section .hotel-carousel-button {
    width: calc(100% - 20px) !important;
    max-width: calc(100% - 20px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
    display: block !important;
  }
  .ts.s-cta .cta-submit-button .elementor-widget-container,
  .ts.hotel-carousel-section .hotel-carousel-button .elementor-widget-container {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  .ts.s-cta .cta-submit-button .elementor-button,
  .ts.hotel-carousel-section .hotel-carousel-button .elementor-button {
    width: 100% !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    padding: 15px 23px !important;
    border-radius: 100px !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
  }
}
@media (max-width: 600px) {
  .ts .hotel-carousel-track .slick-slide {
    width: 365px !important;
    max-width: calc(100vw - 12px);
    margin: 0 5px !important;
  }
  .ts .hotel-carousel-track .slick-list {
    margin: 0 -5px !important;
  }
}
/* Legacy hotel carousel: mobile section hidden on desktop, desktop padding */
@media (min-width: 768px) {
  .ts.hotel-carousel-section,
  .ts.hotel-carousel-section.e-con,
  .ts.hotel-carousel-section.elementor-element {
    display: none !important;
  }
  .ts.hotel-carousel,
  .ts.hotel-carousel.e-con,
  .ts.hotel-carousel.elementor-element {
    padding-bottom: 100px !important;
  }
}
/* ════════════════════════════════════════════════════════════════════
   16 · COMPARISON SECTION
   Table + verdict/decision cards. Restyle via the --comp-* tokens.
   ════════════════════════════════════════════════════════════════════ */
.ts.s-comparison {
  --comp-border: rgba(17, 17, 17, 0.09);
  --comp-row-hover: rgba(17, 17, 17, 0.02);
  --comp-eyebrow-size: 10px;
  --comp-heading-size: 36px;
  --comp-intro-size: 15px;
  --comp-th-size: 10px;
  --comp-td-size: 13px;
  --comp-factor-size: 10px;
  --comp-block-label-size: 11px;
  --comp-dest-size: 9px;
  --comp-verdict-size: 12px;
  --comp-decision-dest-size: 18px;
  --comp-decision-size: 12px;
  --comp-eyebrow-color: var(--gray);
  --comp-heading-color: var(--dark);
  --comp-intro-color: var(--gray);
  --comp-th-color: var(--gray);
  --comp-th-main-color: var(--dark);
  --comp-td-color: var(--gray);
  --comp-td-main-color: var(--dark);
  --comp-factor-color: var(--gray);
  --comp-dest-color: var(--dark);
  --comp-dest-bg: rgba(17, 17, 17, 0.06);
  --comp-dest-border: rgba(17, 17, 17, 0.16);
  --comp-card-bg: var(--light);
  --comp-card-main-bg: var(--soft);
  --comp-card-main-border: var(--dark);
}
/* Legacy comparison-table helpers (centered layout) */
.ts.s-comparison .subheadline-dark,
.ts.s-comparison .subheadline-dark [class*="heading-title"],
.ts.s-comparison .subheadline-dark h1,
.ts.s-comparison .subheadline-dark h2,
.ts.s-comparison .subheadline-dark h3 {
  color: var(--gray) !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  text-align: center !important;
}
.ts.s-comparison .comparison-table,
.ts.s-comparison .comparison-table * {
  text-align: center !important;
}
.ts.s-comparison .comparison-table.e-con,
.ts.s-comparison .comparison-table .e-con {
  justify-content: center !important;
}
/* Header + intro */
.ts.s-comparison .comparison-inner {
  width: min(100%, 960px);
  margin-inline: auto;
}
.ts.s-comparison .comp-eyebrow {
  font-size: var(--comp-eyebrow-size);
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--comp-eyebrow-color);
  text-align: center;
  margin: 0 0 14px;
}
.ts.s-comparison .comp-heading {
  font-size: var(--comp-heading-size) !important;
  color: var(--comp-heading-color) !important;
  text-align: center !important;
  margin: 0 0 16px !important;
  padding-bottom: 0 !important;
}
.ts.s-comparison .comp-intro {
  font-size: var(--comp-intro-size);
  line-height: 1.7;
  color: var(--comp-intro-color);
  text-align: center;
  max-width: 620px;
  margin: 0 auto 48px;
}
.ts.s-comparison .comp-block-label {
  font-size: var(--comp-block-label-size);
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--comp-factor-color);
  text-align: center;
  margin: 0 0 16px;
}
/* Table */
.ts.s-comparison .comp-table-wrap {
  border: 1px solid var(--comp-border);
  border-radius: 16px;
  overflow: hidden;
  margin-bottom: 48px;
  width: 100%;
}
.ts.s-comparison .comp-table {
  width: 100%;
  border-collapse: collapse;
}
.ts.s-comparison .comp-table thead tr {
  background: rgba(17, 17, 17, 0.025);
  border-bottom: 1px solid var(--comp-border);
}
.ts.s-comparison .comp-table th {
  padding: 14px 16px;
  font-size: var(--comp-th-size);
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--comp-th-color);
  text-align: center;
}
.ts.s-comparison .comp-table th.col-main {
  color: var(--comp-th-main-color);
}
.ts.s-comparison .comp-table th.col-factor {
  text-align: left;
}
.ts.s-comparison .comp-table td {
  padding: 13px 16px;
  vertical-align: top;
  line-height: 1.55;
  border-bottom: 1px solid var(--comp-border);
  color: var(--comp-td-color);
  font-size: var(--comp-td-size);
  text-align: center;
}
.ts.s-comparison .comp-table tr:last-child td {
  border-bottom: none;
}
.ts.s-comparison .comp-table tbody tr:hover td {
  background: var(--comp-row-hover);
}
.ts.s-comparison .comp-table td.col-factor {
  font-size: var(--comp-factor-size);
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--comp-factor-color);
  white-space: nowrap;
  text-align: left;
  width: 120px;
}
.ts.s-comparison .comp-table td.col-main {
  color: var(--comp-td-main-color);
  font-weight: 500;
}
/* Table → stacked cards on mobile */
@media (max-width: 767px) {
  .ts.s-comparison .comp-table-wrap {
    border: none;
    border-radius: 0;
    background: transparent;
    overflow: visible;
  }
  .ts.s-comparison .comp-table thead {
    display: none;
  }
  .ts.s-comparison .comp-table,
  .ts.s-comparison .comp-table tbody,
  .ts.s-comparison .comp-table tr,
  .ts.s-comparison .comp-table td {
    display: block;
    width: 100%;
  }
  .ts.s-comparison .comp-table tbody tr {
    border: 1px solid var(--comp-border);
    border-radius: 14px;
    overflow: hidden;
    margin-bottom: 14px;
    background: var(--comp-card-bg);
  }
  .ts.s-comparison .comp-table td.col-factor {
    display: block;
    width: 100%;
    background: rgba(17, 17, 17, 0.04);
    border-bottom: 1px solid var(--comp-border);
    padding: 11px 16px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--comp-heading-color);
    text-align: left;
    white-space: normal;
  }
  .ts.s-comparison .comp-table td.col-factor::before {
    content: none;
  }
  .ts.s-comparison .comp-table td:not(.col-factor) {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    text-align: left;
    padding: 11px 16px;
    border-bottom: 1px solid var(--comp-border);
  }
  .ts.s-comparison .comp-table td:not(.col-factor):last-child {
    border-bottom: none;
  }
  .ts.s-comparison .comp-table td:not(.col-factor)::before {
    content: attr(data-label);
    flex-shrink: 0;
    width: 92px;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--comp-factor-color);
    padding-top: 2px;
  }
}
/* Verdict cards */
.ts.s-comparison .verdict-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin-bottom: 48px;
}
@media (min-width: 480px) {
  .ts.s-comparison .verdict-grid {
    grid-template-columns: 1fr 1fr;
  }
}
@media (min-width: 768px) {
  .ts.s-comparison .verdict-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}
.ts.s-comparison .verdict-card {
  border: 1px solid var(--comp-border);
  border-radius: 14px;
  padding: 18px 16px 20px;
  background: var(--comp-card-bg);
  text-align: center;
}
.ts.s-comparison .verdict-label {
  font-size: var(--comp-block-label-size);
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--comp-factor-color);
  margin: 0 0 8px;
}
.ts.s-comparison .verdict-dest {
  display: inline-block;
  font-size: var(--comp-dest-size);
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--comp-dest-color);
  background: var(--comp-dest-bg);
  border: 1px solid var(--comp-dest-border);
  border-radius: 100px;
  padding: 3px 10px;
  margin-bottom: 10px;
}
.ts.s-comparison .verdict-text {
  font-size: var(--comp-verdict-size);
  line-height: 1.65;
  color: var(--comp-td-color);
  margin: 0;
}
/* Decision cards */
.ts.s-comparison .decision-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}
@media (min-width: 600px) {
  .ts.s-comparison .decision-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
.ts.s-comparison .decision-card {
  border: 1px solid var(--comp-border);
  border-radius: 14px;
  padding: 20px 18px 22px;
  background: var(--comp-card-bg);
  text-align: center;
}
.ts.s-comparison .decision-card--main {
  border-color: var(--comp-card-main-border);
  background: var(--comp-card-main-bg);
}
.ts.s-comparison .decision-prompt {
  font-size: var(--comp-factor-size);
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--comp-factor-color);
  margin: 0 0 4px;
}
.ts.s-comparison .decision-dest {
  font-size: var(--comp-decision-dest-size);
  font-weight: 800;
  letter-spacing: -0.01em;
  color: var(--comp-heading-color);
  margin: 0 0 10px;
  line-height: 1.2;
}
.ts.s-comparison .decision-text {
  font-size: var(--comp-decision-size);
  line-height: 1.65;
  color: var(--comp-td-color);
  margin: 0;
}
/* ════════════════════════════════════════════════════════════════════
   17 · FAQ SECTION (.taya-faq)
   Accordion list + sidebar CTA. Restyle via the --faq-* tokens.
   ════════════════════════════════════════════════════════════════════ */
.ts.faq {
  --faq-cta-image: url("https://i.imghippo.com/files/fQL8308xEg.png");
  --faq-q-size: 13px;
  --faq-q-size-md: 14px;
  --faq-a-size: 13px;
  --faq-check-title-size: 10px;
  --faq-check-item-size: 12px;
  --faq-glass-title-size: 14px;
  --faq-btn-size: 13px;
  --faq-item-bg: #1a1a1a;
  --faq-item-border: rgba(248, 248, 247, 0.1);
  --faq-item-bg-hover: #222222;
  --faq-item-border-hover: rgba(248, 248, 247, 0.2);
  --faq-open-bg: #f8f8f7;
  --faq-open-border: rgba(248, 248, 247, 0.3);
  --faq-open-shadow: 0 4px 20px rgba(0, 0, 0, 0.25);
  --faq-q-color: #f8f8f7;
  --faq-q-color-open: #1a1a19;
  --faq-icon-border: rgba(248, 248, 247, 0.2);
  --faq-icon-bg-open: #1a1a19;
  --faq-icon-stroke: rgba(248, 248, 247, 0.5);
  --faq-icon-stroke-open: #f8f8f7;
  --faq-a-border: rgba(26, 26, 25, 0.1);
  --faq-a-color: rgba(26, 26, 25, 0.65);
  --faq-a-strong: #1a1a19;
  --faq-check-bg: #1a1a1a;
  --faq-check-border: rgba(248, 248, 247, 0.1);
  --faq-check-title-color: rgba(248, 248, 247, 0.35);
  --faq-check-item-color: #f8f8f7;
  --faq-dot-bg: rgba(26, 26, 25, 0.35);
  --faq-dot-stroke: #f0f0ef;
  --faq-heading-color: var(--light);
  --faq-glass-bg: rgba(26, 26, 25, 0.6);
  --faq-glass-border: rgba(248, 248, 247, 0.15);
  --faq-glass-title-color: #f8f8f7;
  --faq-btn-bg: #ede8df;
  --faq-btn-color: #1a1a19;
  --faq-gap: 6px;
  --faq-sidebar-width: 300px;
  --faq-sidebar-width-lg: 340px;
  --faq-item-radius: 12px;
  --faq-icon-size: 24px;
}
.taya-faq {
  font-family: inherit;
  -webkit-font-smoothing: antialiased;
  width: 100%;
}
.taya-faq *,
.taya-faq *::before,
.taya-faq *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
/* Layout: list + sidebar */
.taya-faq .tf-wrap {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
}
.taya-faq .tf-body {
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 100%;
}
@media (min-width: 768px) {
  .taya-faq .tf-body {
    flex-direction: row;
    gap: 32px;
    align-items: flex-start;
  }
}
.taya-faq .tf-list {
  display: flex;
  flex-direction: column;
  gap: var(--faq-gap);
  width: 100%;
}
@media (min-width: 768px) {
  .taya-faq .tf-list {
    flex: 1;
    min-width: 0;
  }
}
.taya-faq .tf-sidebar {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
}
@media (min-width: 768px) {
  .taya-faq .tf-sidebar {
    width: var(--faq-sidebar-width);
    flex-shrink: 0;
    position: sticky;
    top: 24px;
  }
}
@media (min-width: 1024px) {
  .taya-faq .tf-sidebar {
    width: var(--faq-sidebar-width-lg);
  }
}
/* Accordion item */
.taya-faq .tf-item {
  background: var(--faq-item-bg);
  border: 1px solid var(--faq-item-border);
  border-radius: var(--faq-item-radius);
  overflow: hidden;
  transition:
    background 0.18s,
    border-color 0.18s,
    box-shadow 0.18s;
  width: 100%;
}
.taya-faq .tf-item:not(.tf-open):hover {
  background: var(--faq-item-bg-hover);
  border-color: var(--faq-item-border-hover);
}
.taya-faq .tf-item.tf-open {
  background: var(--faq-open-bg);
  border-color: var(--faq-open-border);
  box-shadow: var(--faq-open-shadow);
}
.taya-faq .tf-q {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 14px;
  background: none;
  border: none;
  cursor: pointer;
  text-align: left;
  -webkit-appearance: none;
  appearance: none;
  outline: none;
  -webkit-tap-highlight-color: transparent;
}
@media (min-width: 768px) {
  .taya-faq .tf-q {
    padding: 18px 20px;
  }
}
.taya-faq .tf-q-text {
  font-size: var(--faq-q-size);
  font-weight: 500;
  color: var(--faq-q-color);
  line-height: 1.5;
  flex: 1 1 auto;
  min-width: 0;
  transition: color 0.18s;
  white-space: normal !important;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.taya-faq .tf-icon {
  flex: 0 0 auto;
} /* icon never shrinks or overlaps the text */
@media (min-width: 768px) {
  .taya-faq .tf-q-text {
    font-size: var(--faq-q-size-md);
  }
}
.taya-faq .tf-item.tf-open .tf-q-text {
  color: var(--faq-q-color-open);
}
.taya-faq .tf-icon {
  width: var(--faq-icon-size);
  height: var(--faq-icon-size);
  flex-shrink: 0;
  margin-top: 2px;
  border-radius: 50%;
  border: 1px solid var(--faq-icon-border);
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  transition:
    background 0.25s,
    border-color 0.25s,
    transform 0.3s ease;
}
.taya-faq .tf-item.tf-open .tf-icon {
  background: var(--faq-icon-bg-open);
  border-color: var(--faq-icon-bg-open);
  transform: rotate(45deg);
}
.taya-faq .tf-icon svg {
  width: 10px;
  height: 10px;
  stroke: var(--faq-icon-stroke);
  transition: stroke 0.18s;
  display: block;
}
.taya-faq .tf-item.tf-open .tf-icon svg {
  stroke: var(--faq-icon-stroke-open);
}
.taya-faq .tf-answer {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.taya-faq .tf-item.tf-open .tf-answer {
  grid-template-rows: 1fr;
}
.taya-faq .tf-answer-inner {
  overflow: hidden;
}
.taya-faq .tf-body-text {
  padding: 10px 14px 16px;
  border-top: 1px solid var(--faq-a-border);
  font-size: var(--faq-a-size);
  line-height: 1.8;
  color: var(--faq-a-color);
  text-align: left !important;
}
@media (min-width: 768px) {
  .taya-faq .tf-body-text {
    padding: 12px 20px 18px;
  }
}
.taya-faq .tf-body-text strong {
  color: var(--faq-a-strong);
  font-weight: 600;
}
/* Sidebar CTA card */
.taya-faq .tf-cta {
  border-radius: var(--faq-item-radius);
  overflow: hidden;
  position: relative;
  display: block;
  width: 100%;
}
.taya-faq .tf-cta-img {
  width: 100%;
  aspect-ratio: 16 / 9;
  background-image: var(--faq-cta-image);
  background-size: cover;
  background-position: center;
  display: block;
}
@media (min-width: 768px) {
  .taya-faq .tf-cta-img {
    aspect-ratio: 4 / 3;
  }
}
.taya-faq .tf-glass {
  position: absolute;
  bottom: 12px;
  left: 12px;
  right: 12px;
  background: var(--faq-glass-bg);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid var(--faq-glass-border);
  border-radius: 10px;
  padding: 14px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}
.taya-faq .tf-glass-title {
  font-size: var(--faq-glass-title-size);
  font-weight: 700;
  color: var(--faq-glass-title-color);
  text-align: center;
}
.taya-faq .tf-btn {
  display: block;
  width: 100%;
  text-align: center;
  background: var(--faq-btn-bg);
  color: var(--faq-btn-color) !important;
  font-family: inherit;
  font-size: var(--faq-btn-size);
  font-weight: 600;
  padding: 11px 16px;
  border-radius: 100px;
  border: none;
  cursor: pointer;
  text-decoration: none !important;
  transition: opacity 0.18s;
}
.taya-faq .tf-btn:hover {
  opacity: 0.85;
}
/* Sidebar checklist */
.taya-faq .tf-check {
  background: var(--faq-check-bg);
  border: 1px solid var(--faq-check-border);
  border-radius: var(--faq-item-radius);
  padding: 18px 16px;
  width: 100%;
}
.taya-faq .tf-check-title {
  font-size: var(--faq-check-title-size);
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--faq-check-title-color);
  margin-bottom: 12px;
}
.taya-faq .tf-check-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.taya-faq .tf-check-list li {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  font-size: var(--faq-check-item-size);
  color: var(--faq-check-item-color);
  line-height: 1.5;
}
.taya-faq .tf-dot {
  flex-shrink: 0;
  margin-top: 2px;
  width: 17px;
  height: 17px;
  border-radius: 50%;
  background: var(--faq-dot-bg);
  display: flex;
  align-items: center;
  justify-content: center;
}
.taya-faq .tf-dot svg {
  width: 9px;
  height: 9px;
  stroke: var(--faq-dot-stroke);
  stroke-width: 2.2;
}
/* Bottom alignment (desktop): make the sidebar match the questions-list
   height and stretch the checklist card down so both columns end level.
   Note: this replaces the sticky sidebar with a full-height one. */
@media (min-width: 768px) {
  .taya-faq .tf-body {
    align-items: stretch;
  }
  .taya-faq .tf-sidebar {
    position: static;
  }
  .taya-faq .tf-check {
    flex: 1 1 auto;
  }
}
/* ════════════════════════════════════════════════════════════════════
   18 · INFO ACCORDION  (.taya-panel)
   The tabbed accordion in the left column of the info-map section.
   Restyle via the --info-* tokens.
   ════════════════════════════════════════════════════════════════════ */
.taya-panel {
  --info-tab-bar-bg: #111111;
  --info-tab-bar-radius: 999px;
  --info-tab-bar-padding: 6px;
  --info-pill-bg: #f4f1ec;
  --info-btn-color: rgba(244, 241, 236, 0.42);
  --info-btn-color-hover: rgba(244, 241, 236, 0.7);
  --info-btn-color-active: #1a1a1a;
  --info-btn-size: 13px;
  --info-btn-size-sm: 11px;
  --info-desc-color: #3c3936;
  --info-desc-size: 15px;
  --info-item-bg: #111111;
  --info-item-radius: 14px;
  --info-item-margin: 8px;
  --info-title-color: #f4f1ec;
  --info-title-size: 15px;
  --info-title-size-sm: 14px;
  --info-icon-opacity: 0.3;
  --info-icon-opacity-open: 0.7;
  --info-body-color: #777777;
  --info-body-size: 14px;
  --info-body-size-sm: 13px;
  --info-toggle-color: #f4f1ec;
}
.taya-panel,
.taya-panel * {
  box-sizing: border-box;
}
.taya-panel {
  width: 100%;
}
.taya-panel .tdw-inner {
  width: 100%;
  max-width: none;
  margin: 0 auto;
}
/* Tab bar + sliding pill */
.taya-panel .tdw-tab-bar {
  position: relative;
  display: flex;
  align-items: stretch;
  width: 100%;
  background: var(--info-tab-bar-bg);
  border-radius: var(--info-tab-bar-radius);
  padding: var(--info-tab-bar-padding);
  overflow: hidden;
  margin-bottom: 36px;
}
.taya-panel .tdw-pill {
  position: absolute;
  top: var(--info-tab-bar-padding);
  left: var(--info-tab-bar-padding);
  height: calc(100% - (var(--info-tab-bar-padding) * 2));
  width: calc((100% - (var(--info-tab-bar-padding) * 2)) / var(--tdw-n, 2));
  border-radius: var(--info-tab-bar-radius);
  background: var(--info-pill-bg);
  z-index: 0;
  pointer-events: none;
  transform: translateX(calc(var(--tdw-i, 0) * 100%));
  transition: transform 0.32s cubic-bezier(0.4, 0, 0.2, 1);
}
.taya-panel .tdw-tab-btn {
  position: relative;
  z-index: 1;
  flex: 1 1 0;
  min-width: 0;
  appearance: none;
  border: none;
  background: transparent;
  border-radius: var(--info-tab-bar-radius);
  cursor: pointer;
  padding: 11px 14px;
  font-family: inherit;
  font-size: var(--info-btn-size);
  font-weight: 700;
  line-height: 1.15;
  color: var(--info-btn-color);
  text-align: center;
  transition: color 0.22s ease;
  white-space: nowrap;
}
.taya-panel .tdw-tab-btn:hover {
  color: var(--info-btn-color-hover);
}
.taya-panel .tdw-tab-btn.is-active {
  color: var(--info-btn-color-active);
}
.taya-panel .tdw-tab-panel {
  display: none;
}
.taya-panel .tdw-tab-panel.is-active {
  display: block;
}
.taya-panel .tdw-description {
  max-width: 460px;
  margin: 0 auto 20px;
  padding: 0 4px;
  text-align: center;
  font-size: var(--info-desc-size);
  font-weight: 400;
  line-height: 1.84;
  color: var(--info-desc-color);
}
/* Accordion items */
.taya-panel .tdw-accordion-item {
  background: var(--info-item-bg);
  border-radius: var(--info-item-radius);
  overflow: hidden;
  margin-bottom: var(--info-item-margin);
}
.taya-panel .tdw-accordion-header {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 18px 20px;
  background: transparent;
  border: none;
  cursor: pointer;
  text-align: left;
}
.taya-panel .tdw-accordion-header-left {
  display: flex;
  align-items: center;
  gap: 12px;
}
.taya-panel .tdw-accordion-icon {
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  opacity: var(--info-icon-opacity);
  transition: opacity 0.25s ease;
}
.taya-panel .tdw-accordion-item.is-open .tdw-accordion-icon {
  opacity: var(--info-icon-opacity-open);
}
.taya-panel .tdw-accordion-title {
  font-size: var(--info-title-size);
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 0.01em;
  color: var(--info-title-color);
}
.taya-panel .tdw-accordion-toggle {
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  position: relative;
}
.taya-panel .tdw-accordion-toggle::before,
.taya-panel .tdw-accordion-toggle::after {
  content: "";
  position: absolute;
  background: var(--info-toggle-color);
  border-radius: 2px;
  transition:
    transform 0.25s ease,
    opacity 0.25s ease;
}
.taya-panel .tdw-accordion-toggle::before {
  width: 12px;
  height: 2px;
  top: 9px;
  left: 4px;
}
.taya-panel .tdw-accordion-toggle::after {
  width: 2px;
  height: 12px;
  top: 4px;
  left: 9px;
}
.taya-panel .tdw-accordion-item.is-open .tdw-accordion-toggle::after {
  opacity: 0;
  transform: rotate(90deg);
}
.taya-panel .tdw-accordion-body {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.3s ease;
}
.taya-panel .tdw-accordion-item.is-open .tdw-accordion-body {
  grid-template-rows: 1fr;
}
.taya-panel .tdw-accordion-body-inner {
  overflow: hidden;
}
.taya-panel .tdw-accordion-body p {
  margin: 0;
  padding: 0 20px 22px;
  font-size: var(--info-body-size);
  line-height: 1.75;
  color: var(--info-body-color);
}
@media (max-width: 767px) {
  .taya-panel .tdw-tab-bar {
    --info-tab-bar-padding: 5px;
    margin-bottom: 28px;
  }
  .taya-panel .tdw-tab-btn {
    padding: 10px 8px;
    font-size: var(--info-btn-size-sm);
  }
  .taya-panel .tdw-description {
    font-size: var(--info-desc-size);
    margin-bottom: 16px;
  }
  .taya-panel .tdw-accordion-header {
    padding: 16px;
  }
  .taya-panel .tdw-accordion-title {
    font-size: var(--info-title-size-sm);
  }
  .taya-panel .tdw-accordion-body p {
    padding: 0 16px 18px;
    font-size: var(--info-body-size-sm);
    line-height: 1.7;
  }
}
/* Accordion title — wrap cleanly + keep a gap before the + toggle */
.taya-panel .tdw-accordion-header {
  align-items: flex-start; /* אייקון + פלוס מיושרים לשורה הראשונה */
  gap: 14px; /* ← המרווח הקבוע בין הטקסט לפלוס */
}
.taya-panel .tdw-accordion-header-left {
  flex: 1 1 auto !important;
  min-width: 0 !important; /* מאפשר לטקסט להתכווץ ולרדת שורה */
}
.taya-panel .tdw-accordion-title {
  min-width: 0 !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}
.taya-panel .tdw-accordion-icon,
.taya-panel .tdw-accordion-toggle {
  flex: 0 0 20px !important;
  margin-top: 2px; /* יישור לשורה הראשונה כשיש שתי שורות */
}
/* Country panel — 3 main destination rows + "more" button */
.taya-panel.is-country .tdw-dest-row {
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--info-item-bg, #111);
  border-radius: var(--info-item-radius, 14px);
  margin-bottom: var(--info-item-margin, 8px);
  padding: 16px 18px;
  text-decoration: none !important;
  color: #f4f1ec !important;
  transition:
    background 0.18s ease,
    transform 0.18s ease;
}
.taya-panel.is-country .tdw-dest-row:hover {
  background: #1c1c1c;
  transform: translateX(2px);
}
.taya-panel.is-country .tdw-dest-pin {
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  color: var(--warm, #d6c3a3);
}
.taya-panel.is-country .tdw-dest-name {
  font-size: 15px;
  font-weight: 700;
  flex: 1;
}
.taya-panel.is-country .tdw-dest-region {
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #8a8681;
}
.taya-panel.is-country .tdw-dest-arrow {
  color: var(--warm, #d6c3a3);
  flex: 0 0 16px;
}
.taya-panel.is-country .tdw-more {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr) 18px;
  align-items: center;
  justify-items: start;
  gap: 12px;
  margin-top: 14px;
  padding: 16px 18px;
  border-radius: var(--info-item-radius, 14px);
  background: var(--info-item-bg, #111111);
  color: var(--info-title-color, #f4f1ec) !important;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.3;
  text-align: left;
  text-decoration: none !important;
  cursor: pointer;
  transition:
    background 0.18s ease,
    transform 0.18s ease;
}
.taya-panel.is-country .tdw-more::before {
  content: "";
  width: 18px;
  height: 18px;
  grid-column: 1;
  justify-self: center;
  background: var(--warm, #d6c3a3);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18l-6 3V6l6-3 6 3 6-3v15l-6 3-6-3z'/%3E%3Cpath d='M9 3v15M15 6v15'/%3E%3C/svg%3E")
    center/contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18l-6 3V6l6-3 6 3 6-3v15l-6 3-6-3z'/%3E%3Cpath d='M9 3v15M15 6v15'/%3E%3C/svg%3E")
    center/contain no-repeat;
}
.taya-panel.is-country .tdw-more:hover {
  background: #2a2a2a;
  transform: translateY(-1px);
}
.taya-panel.is-country .tdw-more > svg,
.taya-panel.is-country .tdw-more .tdw-more-arrow,
.taya-panel.is-country .tdw-more .tdw-arrow {
  grid-column: 3;
  justify-self: end;
  width: 18px;
  height: 18px;
  color: var(--warm, #d6c3a3) !important;
  stroke: currentColor !important;
}
.taya-panel.is-country .tdw-more svg * {
  stroke: currentColor !important;
}
.taya-panel.is-country .tdw-tab-bar {
  --tdw-n: 2;
}
.taya-panel.is-city .tdw-tab-bar {
  --tdw-n: 3;
}
/* ════════════════════════════════════════════════════════════════════
   19 · MAP WIDGET  (#tlm-map-widget)
   The Mapbox card in the right column of the info-map section.
   Restyle via the --map-* tokens.
   ════════════════════════════════════════════════════════════════════ */
#tlm-map-widget {
  --map-card-border: #e8e4de;
  --map-card-radius: 16px;
  --map-card-bg: #ffffff;
  --map-stats-border: #e8e4de;
  --map-stat-padding: 28px 24px;
  --map-val-font: "Cormorant Garamond", Georgia, serif;
  --map-val-size: 24px;
  --map-val-weight: 300;
  --map-val-color: #1a1814;
  --map-lbl-size: 11px;
  --map-lbl-spacing: 0.04em;
  --map-lbl-color: #a09b94;
  --map-dot-color: #1a1814;
  --map-ring-color: rgba(26, 24, 20, 0.35);
  --map-ring2-color: rgba(26, 24, 20, 0.15);
  --map-label-bg: rgba(255, 255, 255, 0.95);
  --map-label-border: rgba(26, 24, 20, 0.14);
  --map-label-color: #1a1814;
  --map-label-size: 11px;
  --map-label-spacing: 0.09em;
}
#tlm-map-widget,
#tlm-map-widget * {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
#tlm-map-widget {
  width: 100%;
  display: flex;
}
/* Card + map area */
#tlm-map-card {
  width: 100%;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--map-card-border);
  border-radius: var(--map-card-radius);
  overflow: hidden;
  background: var(--map-card-bg);
}
#tlm-map-wrap {
  position: relative;
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
}
#tlm-map {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
#tlm-map-card .mapboxgl-canvas,
#tlm-map-card .mapboxgl-canvas-container {
  width: 100% !important;
  height: 100% !important;
}
#tlm-map-card .mapboxgl-ctrl-bottom-left,
#tlm-map-card .mapboxgl-ctrl-bottom-right {
  display: none !important;
}
/* Stats row */
#tlm-map-stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  flex: 0 0 auto;
  background: var(--map-card-bg);
  border-top: 1px solid var(--map-stats-border);
}
.tlm-stat {
  padding: var(--map-stat-padding);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}
.tlm-stat + .tlm-stat {
  border-left: 1px solid var(--map-stats-border);
}
.tlm-stat-val {
  display: block;
  font-family: var(--map-val-font);
  font-size: var(--map-val-size);
  font-weight: var(--map-val-weight);
  line-height: 1.05;
  color: var(--map-val-color);
}
.tlm-stat-lbl {
  display: block;
  margin-top: 5px;
  font-family: inherit;
  font-size: var(--map-lbl-size);
  letter-spacing: var(--map-lbl-spacing);
  color: var(--map-lbl-color);
}
/* Animated marker + label */
.tlm-marker {
  display: flex;
  align-items: center;
  gap: 8px;
  pointer-events: none;
}
.tlm-dot-wrap {
  position: relative;
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}
.tlm-dot {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: var(--map-dot-color);
}
.tlm-ring {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  border: 1.5px solid var(--map-ring-color);
  animation: tlmPulse 2.4s ease-out infinite;
}
.tlm-ring2 {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 1px solid var(--map-ring2-color);
  animation: tlmPulse 2.4s ease-out infinite 0.7s;
}
@keyframes tlmPulse {
  0% {
    opacity: 1;
    transform: translate(-50%, -50%) scale(0.65);
  }
  100% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(1.15);
  }
}
.tlm-label {
  background: var(--map-label-bg);
  border: 1px solid var(--map-label-border);
  border-radius: 6px;
  padding: 4px 9px;
  white-space: nowrap;
  font-family: inherit;
  font-size: var(--map-label-size);
  font-weight: 500;
  letter-spacing: var(--map-label-spacing);
  color: var(--map-label-color);
}
/* ════════════════════════════════════════════════════════════════════
   20 · MEXICO GUIDE  (.tl-*)
   Standalone long-form guide page: hero, nav tabs, destination blocks,
   hotel/activity cards, tools, CTA and FAQ.
   ════════════════════════════════════════════════════════════════════ */

/* Hero */
.tl-hero {
  background: #1a1a19 !important;
  padding: 100px 20px 56px !important;
  text-align: center !important;
  position: relative !important;
  overflow: hidden !important;
}
.tl-hero::before {
  content: "MX" !important;
  position: absolute !important;
  left: -12px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  font-family: var(--font-mono) !important;
  font-size: 180px !important;
  font-weight: 500 !important;
  color: rgba(255, 255, 255, 0.03) !important;
  line-height: 1 !important;
  pointer-events: none !important;
  user-select: none !important;
}
.tl-hero::after {
  content: "" !important;
  position: absolute !important;
  top: 20% !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 400px !important;
  height: 200px !important;
  background: radial-gradient(ellipse, rgba(0, 33, 138, 0.2) 0%, transparent 70%) !important;
  pointer-events: none !important;
  filter: blur(40px) !important;
}
.tl-hero-title {
  font-family: inherit !important;
  font-size: clamp(36px, 10vw, 68px) !important;
  font-weight: 900 !important;
  color: #fff !important;
  line-height: 1.02 !important;
  letter-spacing: -0.025em !important;
  margin-bottom: 10px !important;
  position: relative !important;
  z-index: 1 !important;
}
.tl-hero-sub {
  font-size: 15px !important;
  font-weight: 300 !important;
  letter-spacing: 0.06em !important;
  color: rgba(255, 255, 255, 0.45) !important;
  margin-bottom: 36px !important;
  display: block !important;
  position: relative !important;
  z-index: 1 !important;
}
/* Sticky nav tabs */
.tl-nav {
  position: -webkit-sticky !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 8000 !important;
  background: #fff !important;
  border-bottom: 1.5px solid #e2ddd6 !important;
  border-top: none !important;
  overflow-x: auto !important;
  scrollbar-width: none !important;
  -webkit-overflow-scrolling: touch !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}
.tl-nav::-webkit-scrollbar {
  display: none !important;
}
.tl-nav.tl-fixed {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  z-index: 8000 !important;
}
.tl-nav-inner {
  display: flex !important;
  flex-direction: row !important;
  justify-content: center !important;
  min-width: 100% !important;
  width: max-content !important;
  margin: 0 auto !important;
  padding: 0 6px !important;
}
.tl-tab {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 1px !important;
  padding: 11px 14px 9px !important;
  cursor: pointer !important;
  border-bottom: 3px solid transparent !important;
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
  background: none !important;
  margin: 0 0 -1.5px 0 !important;
  transition: all 0.18s !important;
  white-space: nowrap !important;
  user-select: none !important;
}
.tl-tab-num {
  font-family: var(--font-mono) !important;
  font-size: 9px !important;
  letter-spacing: 0.1em !important;
  color: #a6a6a6 !important;
  display: block !important;
}
.tl-tab-label {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #555 !important;
  display: block !important;
}
.tl-tab:hover .tl-tab-label,
.tl-tab:hover .tl-tab-num,
.tl-tab.tl-active .tl-tab-num,
.tl-tab.tl-active .tl-tab-label {
  color: #00218a !important;
}
.tl-tab.tl-active .tl-tab-label {
  font-weight: 700 !important;
}
.tl-tab.tl-active {
  border-bottom-color: #00218a !important;
}
/* Destination headers + labels */
.tl-dest {
  padding-bottom: 8px !important;
}
.tl-dh {
  padding: 44px 20px 38px !important;
  text-align: center !important;
  position: relative !important;
  overflow: hidden !important;
  border-radius: 0 !important;
}
.tl-dh.c01 {
  background: linear-gradient(135deg, #edf4ff, #dbeafe) !important;
  border-bottom: 1px solid #bfdbfe !important;
}
.tl-dh.c02 {
  background: linear-gradient(135deg, #ecfdf5, #ccfbf1) !important;
  border-bottom: 1px solid #99f6e4 !important;
}
.tl-dh.c03 {
  background: linear-gradient(135deg, #f0fdf4, #dcfce7) !important;
  border-bottom: 1px solid #bbf7d0 !important;
}
.tl-dh.c04 {
  background: linear-gradient(135deg, #ecfeff, #cffafe) !important;
  border-bottom: 1px solid #a5f3fc !important;
}
.tl-dh.c05 {
  background: linear-gradient(135deg, #f5f3ff, #ede9fe) !important;
  border-bottom: 1px solid #ddd6fe !important;
}
.tl-dh.c06 {
  background: linear-gradient(135deg, #fffbeb, #fef3c7) !important;
  border-bottom: 1px solid #fde68a !important;
}
.tl-dh.c07 {
  background: linear-gradient(135deg, #fff5f5, #fee2e2) !important;
  border-bottom: 1px solid #fecaca !important;
}
.tl-dh-num {
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  font-family: var(--font-mono) !important;
  font-size: 130px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  opacity: 0.05 !important;
  color: #1a1a19 !important;
  pointer-events: none !important;
  user-select: none !important;
}
.tl-dh-meta {
  font-family: var(--font-mono) !important;
  font-size: 10px !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  color: #a6a6a6 !important;
  margin-bottom: 10px !important;
  display: block !important;
  text-align: center !important;
}
.tl-dh-name {
  font-family: inherit !important;
  font-size: clamp(30px, 8vw, 48px) !important;
  font-weight: 900 !important;
  color: #1a1a19 !important;
  line-height: 1.05 !important;
  letter-spacing: -0.02em !important;
  margin-bottom: 4px !important;
  text-align: center !important;
  display: block !important;
}
.tl-dh-en {
  font-family: var(--font-mono) !important;
  font-size: 11px !important;
  color: #a6a6a6 !important;
  letter-spacing: 0.08em !important;
  margin-bottom: 14px !important;
  display: block !important;
  text-align: center !important;
}
.tl-dh-desc,
.tl-guide .tl-dh .tl-dh-desc,
.tl-guide .tl-dh-desc {
  font-size: 15px !important;
  font-weight: 400 !important;
  line-height: 1.8 !important;
  color: #555 !important;
  max-width: 560px !important;
  margin: 0 auto !important;
  text-align: center !important;
  display: block !important;
  width: 100% !important;
}
.tl-label {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 24px 16px 12px !important;
  max-width: 700px !important;
  margin: 0 auto !important;
  background: none !important;
  border: none !important;
}
.tl-label-line {
  flex: 1 !important;
  height: 1px !important;
  background: #e2ddd6 !important;
  display: block !important;
}
.tl-label-text {
  font-family: var(--font-mono) !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  color: #a6a6a6 !important;
  white-space: nowrap !important;
}
.tl-sep {
  max-width: 700px !important;
  margin: 28px auto 0 !important;
  padding: 0 16px !important;
}
.tl-sep-line {
  height: 1px !important;
  background: #e8e4dc !important;
  display: block !important;
}
.tl-rv {
  opacity: 1 !important;
  transform: none !important;
}
.tl-rv.tl-in {
  opacity: 1 !important;
  transform: none !important;
}
/* Hotel rows */
.tl-hotels {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  max-width: 700px !important;
  margin: 0 auto !important;
  padding: 0 16px !important;
}
.tl-hotel,
.tl-hotel:link,
.tl-hotel:visited {
  display: flex !important;
  align-items: center !important;
  gap: 0 !important;
  padding: 0 !important;
  background: #fff !important;
  border: 1px solid #e8e4dc !important;
  border-radius: 14px !important;
  color: #1a1a19 !important;
  margin: 0 !important;
  overflow: hidden !important;
  transition:
    border-color 0.2s,
    box-shadow 0.2s,
    transform 0.2s !important;
}
.tl-hotel:hover,
.tl-hotel:active {
  border-color: rgba(0, 33, 138, 0.3) !important;
  box-shadow: 0 6px 24px rgba(0, 33, 138, 0.08) !important;
  transform: translateY(-2px) !important;
  color: #1a1a19 !important;
}
.tl-hotel-accent {
  width: 4px !important;
  align-self: stretch !important;
  background: linear-gradient(180deg, #00218a, #3b5fd4) !important;
  flex-shrink: 0 !important;
  display: block !important;
}
.tl-hotel-info {
  display: flex !important;
  flex-direction: column !important;
  gap: 5px !important;
  flex: 1 !important;
  min-width: 0 !important;
  padding: 16px 18px !important;
}
.tl-hotel-name {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #1a1a19 !important;
  line-height: 1.25 !important;
  margin: 0 !important;
  padding: 0 !important;
}
.tl-hotel-meta {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  flex-wrap: wrap !important;
}
.tl-stars {
  font-size: 11px !important;
  color: #c8a84b !important;
  letter-spacing: 1px !important;
}
.tl-tag {
  font-size: 9px !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  padding: 2px 8px !important;
  border-radius: 100px !important;
  background: rgba(0, 33, 138, 0.06) !important;
  color: #00218a !important;
  display: inline-block !important;
}
.tl-book,
.tl-book:link,
.tl-book:visited,
.tl-book:hover,
.tl-book:active {
  flex-shrink: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 14px 18px !important;
  background: transparent !important;
  color: #00218a !important;
  border-right: none !important;
  border-left: 1px solid #e8e4dc !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  font-family: inherit !important;
  white-space: nowrap !important;
  border-top: none !important;
  border-bottom: none !important;
  text-decoration: none !important;
  align-self: stretch !important;
  transition:
    background 0.18s,
    color 0.18s !important;
}
.tl-book svg {
  width: 13px !important;
  height: 13px !important;
  flex-shrink: 0 !important;
}
.tl-hotel:hover .tl-book {
  background: rgba(0, 33, 138, 0.05) !important;
  color: #001670 !important;
}
/* Activity + place cards */
.tl-ext-icon {
  display: inline-block !important;
  vertical-align: middle !important;
  flex-shrink: 0 !important;
  transform: scaleX(-1) !important;
}
.tl-acts-wrap {
  max-width: 700px !important;
  margin: 0 auto !important;
  padding: 0 16px !important;
}
.tl-acts {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
}
.tl-act,
.tl-act:link,
.tl-act:visited {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  padding: 14px 12px !important;
  background: #fff !important;
  border: 1px solid #e8e4dc !important;
  border-radius: 10px !important;
  color: #1a1a19 !important;
  margin: 0 !important;
  transition:
    border-color 0.18s,
    box-shadow 0.18s !important;
}
.tl-act-maps,
.tl-act-maps:link,
.tl-act-maps:visited {
  background: #fff !important;
  border-color: #e8e4dc !important;
}
.tl-act:hover,
.tl-act:active,
.tl-act-maps:hover,
.tl-act-maps:active {
  border-color: rgba(0, 33, 138, 0.22) !important;
  box-shadow: 0 2px 12px rgba(0, 33, 138, 0.06) !important;
  color: #1a1a19 !important;
}
.tl-act-icon {
  font-size: 20px !important;
  line-height: 1 !important;
  display: block !important;
}
.tl-act-name {
  font-size: 12px !important;
  font-weight: 600 !important;
  color: #1a1a19 !important;
  line-height: 1.3 !important;
  flex: 1 !important;
  margin: 0 !important;
}
.tl-act-arrow {
  display: flex !important;
  align-items: center !important;
  color: #00218a !important;
  align-self: flex-end !important;
  margin-top: auto !important;
  opacity: 0.7 !important;
}
.tl-act-maps .tl-act-arrow {
  color: #16a34a !important;
}
/* Tools + CTA */
.tl-eyebrow {
  font-family: var(--font-mono) !important;
  font-size: 10px !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
  color: #d6c3a3 !important;
  margin-bottom: 14px !important;
  display: block !important;
  position: relative !important;
  z-index: 1 !important;
}
.tl-tools {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  justify-content: center !important;
  position: relative !important;
  z-index: 1 !important;
}
.tl-pill,
.tl-pill:link,
.tl-pill:visited,
.tl-pill:hover,
.tl-pill:active {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 10px 16px !important;
  border-radius: 100px !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  background: rgba(255, 255, 255, 0.07) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #fff !important;
  cursor: pointer !important;
}
.tl-pill:hover,
.tl-pill:active {
  background: rgba(0, 33, 138, 0.35) !important;
  border-color: rgba(0, 33, 138, 0.6) !important;
}
.tl-cta {
  max-width: 520px !important;
  margin: 0 auto !important;
  padding: 44px 16px 24px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  text-align: center !important;
}
.tl-cta-title {
  font-family: inherit !important;
  font-size: 22px !important;
  font-weight: 900 !important;
  color: #1a1a19 !important;
  letter-spacing: -0.01em !important;
  line-height: 1.2 !important;
}
.tl-cta-sub {
  font-size: 14px !important;
  font-weight: 400 !important;
  color: #666 !important;
  line-height: 1.65 !important;
  margin-bottom: 4px !important;
}
.tl-cta-heading {
  font-family: var(--font-mono) !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
  color: #a6a6a6 !important;
  margin-bottom: 4px !important;
  display: block !important;
}
.tl-cta-btn,
.tl-cta-btn:link,
.tl-cta-btn:visited {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-direction: row !important;
  gap: 10px !important;
  padding: 15px 24px !important;
  border-radius: 12px !important;
  font-family: inherit !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  border: none !important;
  cursor: pointer !important;
}
.tl-btn-emoji {
  flex-shrink: 0 !important;
}
.tl-btn-text {
  flex: 1 !important;
  text-align: center !important;
}
.tl-cta-wa,
.tl-cta-wa:link,
.tl-cta-wa:visited,
.tl-cta-wa:hover,
.tl-cta-wa:active {
  background: #25d366 !important;
  color: #fff !important;
}
.tl-cta-fb,
.tl-cta-fb:link,
.tl-cta-fb:visited {
  background: #fff !important;
  color: #1a1a19 !important;
  border: 1.5px solid #d4cec4 !important;
}
.tl-cta-fb:hover,
.tl-cta-fb:active {
  border-color: rgba(0, 33, 138, 0.25) !important;
  background: rgba(0, 33, 138, 0.04) !important;
  color: #00218a !important;
}
/* FAQ accordion (guide-page version, RTL) */
.tl-faq {
  max-width: 700px !important;
  margin: 0 auto !important;
  padding: 40px 16px 48px !important;
  direction: rtl !important;
  text-align: right !important;
}
.tl-faq * {
  direction: rtl !important;
  text-align: right !important;
}
.tl-faq-heading {
  font-size: 18px !important;
  font-weight: 800 !important;
  color: #1a1a19 !important;
  margin-bottom: 20px !important;
  text-align: center !important;
  letter-spacing: -0.01em !important;
  direction: rtl !important;
}
.tl-faq-item {
  background: #fff !important;
  border: 1px solid #e8e4dc !important;
  border-radius: 12px !important;
  margin-bottom: 8px !important;
  overflow: hidden !important;
  transition: border-color 0.18s !important;
}
.tl-faq-item[open] {
  border-color: rgba(0, 33, 138, 0.2) !important;
}
.tl-faq-q {
  list-style: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 16px 20px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #1a1a19 !important;
  cursor: pointer !important;
  user-select: none !important;
  direction: rtl !important;
  text-align: right !important;
}
.tl-faq-q::-webkit-details-marker {
  display: none !important;
}
.tl-faq-q::after {
  content: "" !important;
  display: inline-block !important;
  width: 8px !important;
  height: 8px !important;
  border-right: 2px solid #00218a !important;
  border-bottom: 2px solid #00218a !important;
  transform: rotate(45deg) !important;
  flex-shrink: 0 !important;
  margin-left: 0 !important;
  margin-right: auto !important;
  transition: transform 0.2s !important;
}
.tl-faq-item[open] .tl-faq-q::after {
  transform: rotate(-135deg) !important;
}
.tl-faq-a {
  padding: 0 20px 18px !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  color: #555 !important;
  line-height: 1.75 !important;
  direction: rtl !important;
  text-align: right !important;
}
/* Misc guide resets */
.tl-guide h2,
.tl-guide h3 {
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  background: none !important;
}
.tl-guide p {
  margin: 0 !important;
  padding: 0 !important;
}
/* Guide responsive */
@media (min-width: 600px) {
  .tl-acts {
    grid-template-columns: repeat(auto-fit, minmax(0, 1fr)) !important;
    grid-auto-flow: column !important;
    grid-auto-columns: 1fr !important;
  }
  .tl-act {
    align-items: center !important;
    text-align: center !important;
  }
  .tl-act-arrow {
    align-self: center !important;
  }
}
@media (min-width: 768px) {
  .tl-hotel-name {
    font-size: 16px !important;
  }
  .tl-book {
    padding: 16px 22px !important;
    font-size: 13px !important;
  }
  .tl-hero {
    padding: 110px 32px 64px !important;
  }
  .tl-hotels,
  .tl-acts-wrap,
  .tl-faq {
    padding-right: 20px !important;
    padding-left: 20px !important;
  }
  .tl-label {
    padding: 28px 20px 14px !important;
  }
  .tl-dh-desc,
  .tl-guide .tl-dh .tl-dh-desc {
    max-width: 620px !important;
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .tl-faq-heading {
    font-size: 22px !important;
  }
  .tl-faq {
    direction: rtl !important;
    text-align: right !important;
  }
}
/* ════════════════════════════════════════════════════════════════════
   21 · HOTEL CARDS CAROUSEL  (.thc) — NEW
   Clean-HTML carousel. All styling lives here; the HTML stays class-only.
   Desktop: JS transform carousel (centers the middle of three).
   Mobile:  native scroll-snap (1 full card + right peek).
   To restyle: edit the --thc-* tokens below.
   ════════════════════════════════════════════════════════════════════ */
.thc {
  --thc-card-h: 452px; /* card height */
  --thc-card-radius: 24px; /* card corners */
  --thc-fab-radius: 22px; /* button corners (rounded SQUARE, not circle) */
  --thc-gap-x: 26px; /* space between cards */
  --thc-bg: var(--light); /* section bg = notch gap color */
  --thc-fab: var(--dark); /* corner button color */
  --thc-star: #f7931e; /* rating star color */
  --thc-title: var(--light); /* card title / price text */
  --thc-fab-size: 56px; /* corner button size */
  --thc-notch-r: 20px; /* concave notch radius */
  --thc-notch-gap: 12px; /* gap between button and card */
  --thc-card-w: min(360px, 86vw); /* FIXED width — never stretches with the section */
  --thc-arrow-bg: #efebe4; /* arrow idle */
  --thc-arrow-hover: #e4dcce; /* arrow hover */
  --thc-arrow-active: #d6cbb6; /* arrow active — same warm hue, a touch deeper */
  direction: ltr;
  width: 100%;
  position: relative;
  font-family: inherit;
}
.thc *,
.thc *::before,
.thc *::after {
  box-sizing: border-box;
}
/* Top bar: quote button + arrows */
.thc-head {
  display: flex;
  align-items: center;
  justify-content: flex-end; /* quote + arrows grouped on the right */
  gap: 12px;
  margin-bottom: 30px;
  padding: 20px 24px 0 4px; /* top space + right space so arrows aren't flush to edge */
}
.thc-quote {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  background: var(--thc-bg);
  color: #000 !important; /* black text — override the site's blue link color */
  border: 1px solid rgba(26, 26, 25, 0.14);
  border-radius: 100px;
  padding: 13px 22px;
  font-size: 15px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition:
    background 0.18s,
    border-color 0.18s;
}
.thc-quote:hover {
  background: #fff;
  border-color: rgba(26, 26, 25, 0.28);
}
.thc-quote::after {
  content: "";
  width: 7px;
  height: 7px;
  border-right: 2px solid #000;
  border-bottom: 2px solid #000;
  transform: rotate(-45deg);
}
.thc-nav {
  display: flex;
  gap: 10px;
  flex-shrink: 0;
}
.thc-arrow {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: 1px solid rgba(26, 26, 25, 0.14);
  background: var(--thc-arrow-bg);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  outline: none;
  -webkit-tap-highlight-color: transparent;
  transition:
    background 0.18s,
    border-color 0.18s;
}
.thc-arrow:hover {
  background: var(--thc-arrow-hover);
  border-color: rgba(26, 26, 25, 0.3);
}
/* keep active/focus in the same warm hue — never the theme's pink/red */
.thc-arrow:active,
.thc-arrow:focus,
.thc-arrow:focus-visible {
  background: var(--thc-arrow-active) !important;
  border-color: rgba(26, 26, 25, 0.34) !important;
  outline: none !important;
  box-shadow: none !important;
  color: var(--dark) !important;
}
.thc-arrow::before {
  content: "";
  width: 8px;
  height: 8px;
  border-top: 2px solid var(--dark);
  border-right: 2px solid var(--dark);
}
.thc-prev::before {
  transform: rotate(-135deg);
  margin-left: 3px;
}
.thc-next::before {
  transform: rotate(45deg);
  margin-right: 3px;
}
/* Viewport + track */
.thc-viewport {
  overflow: hidden;
  width: 100%;
  padding: 6px 0;
}
.thc-track {
  display: flex;
  gap: var(--thc-gap-x);
  will-change: transform;
}
/* Card + image + gradient */
.thc-card {
  position: relative;
  flex: 0 0 var(--thc-card-w);
  height: var(--thc-card-h);
  border-radius: var(--thc-card-radius);
  overflow: hidden;
  color: var(--thc-title);
  isolation: isolate;
  background: #3a3f45;
}
.thc-card-img {
  position: absolute;
  inset: 0;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover !important;
  object-position: center !important;
  z-index: 0;
}
.thc-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    180deg,
    rgba(20, 22, 26, 0.12) 0%,
    rgba(20, 22, 26, 0.3) 45%,
    rgba(20, 22, 26, 0.74) 100%
  );
}
/* Tags */
.thc-card-tags {
  position: relative;
  z-index: 2;
  display: flex;
  gap: 8px;
  justify-content: center;
  padding-top: 22px;
}
.thc-tag {
  background: rgba(255, 255, 255, 0.14);
  border: 1px solid rgba(255, 255, 255, 0.24);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  color: #f2f2f2;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.16em;
  padding: 8px 14px;
  border-radius: 100px;
}
/* Title / stars / price */
.thc-card-body {
  position: absolute;
  left: 26px;
  bottom: 28px;
  z-index: 2;
  max-width: calc(100% - 52px);
}
.thc-card-title {
  font-size: 40px;
  font-weight: 700;
  letter-spacing: -0.04em;
  line-height: 1.02;
  margin: 0 0 16px;
  text-transform: none;
  text-shadow: 0 2px 18px rgba(0, 0, 0, 0.35);
}
.thc-stars {
  width: 110px;
  height: 20px;
  margin-bottom: 13px;
  background-color: var(--thc-star);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l2.9 6.26L21 9.27l-4.5 4.14L17.8 21 12 17.27 6.2 21l1.3-7.59L3 9.27l6.1-1.01z'/%3E%3C/svg%3E")
    repeat-x left center;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l2.9 6.26L21 9.27l-4.5 4.14L17.8 21 12 17.27 6.2 21l1.3-7.59L3 9.27l6.1-1.01z'/%3E%3C/svg%3E")
    repeat-x left center;
  -webkit-mask-size: 22px 20px;
  mask-size: 22px 20px;
  filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.3));
}
.thc-card-price {
  margin: 0;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
}
.thc-price-now {
  font-size: 24px;
  font-weight: 800;
}
.thc-card-price s {
  font-size: 16px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.6);
  margin-left: 7px;
}
/* Bottom-right notch + corner button */
.thc-card::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  width: calc(var(--thc-fab-size) + var(--thc-notch-gap));
  height: calc(var(--thc-fab-size) + var(--thc-notch-gap));
  background: var(--thc-bg);
  border-top-left-radius: var(--thc-notch-r);
  z-index: 3;
}
.thc-fab {
  position: absolute;
  right: 0;
  bottom: 0;
  width: var(--thc-fab-size);
  height: var(--thc-fab-size);
  background: var(--thc-fab);
  /* rounded square. bottom-right is clipped by the card corner; keep card
     radius >= fab radius so that corner never looks rounder than the rest. */
  border-radius: var(--thc-fab-radius);
  z-index: 5;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition:
    background 0.15s,
    transform 0.15s;
}
.thc-fab:hover {
  transform: scale(1.05);
}
/* concave fillets where the notch meets the card edges */
.thc-fab::before,
.thc-fab::after {
  content: "";
  position: absolute;
  width: var(--thc-notch-r);
  height: var(--thc-notch-r);
  z-index: 4;
  background: radial-gradient(circle at top left, transparent var(--thc-notch-r), var(--thc-bg) 0);
}
.thc-fab::before {
  /* rounds junction on the card's right edge */
  top: calc(-1 * (var(--thc-notch-gap) + var(--thc-notch-r)));
  right: 0;
}
.thc-fab::after {
  /* rounds junction on the card's bottom edge */
  left: calc(-1 * (var(--thc-notch-gap) + var(--thc-notch-r)));
  bottom: 0;
}
.thc-fab-icon {
  width: 23px;
  height: 23px;
  background-color: #fff;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 6h10v10h-2.2V9.75L7.4 18.05 6 16.6 14.25 8.2H8z'/%3E%3C/svg%3E")
    no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 6h10v10h-2.2V9.75L7.4 18.05 6 16.6 14.25 8.2H8z'/%3E%3C/svg%3E")
    no-repeat center / contain;
}
/* Hotel carousel — responsive */
@media (max-width: 767px) {
  .thc {
    --thc-card-h: 500px;
    --thc-card-w: 80vw;
    --thc-gap-x: 16px;
  }
  .ts.hotel-carousel-section,
  .ts.e-con:has(.thc) {
    padding-bottom: 100px !important;
  }
  .thc-card-title {
    font-size: 34px;
  }
  .thc-head {
    justify-content: center;
  }
}
/* Section full width — edge to edge, NO side gaps (desktop + mobile).
   The side gaps were the section's horizontal padding; it was only being
   removed on mobile, so it stayed on desktop. Now removed at all widths. */
.e-con:has(.thc) > .e-con-inner {
  max-width: 100% !important;
}
.e-con:has(.thc) {
  padding-left: 0 !important;
  padding-right: 0 !important;
}
/* Mobile: native touch scroll. transform:none neutralizes any leftover JS
   translate so the track is positioned only by native scroll →
   1 full card + right peek, small 16px left gap, no left peek. */
@media (max-width: 767px) {
  .thc-viewport {
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scroll-padding-left: 16px;
    scrollbar-width: none;
  }
  .thc-viewport::-webkit-scrollbar {
    display: none;
  }
  .thc-track {
    padding-left: 16px;
    padding-right: 16px;
    transform: none !important;
  }
  .thc-card {
    scroll-snap-align: start;
  }
}
/* ════════════════════════════════════════════════════════════════════
   22 · DESTINATION CARDS CAROUSEL  (.tdc) — NEW
   Section class: .destinations-carousel  (was .s-cities)
   Same look/size as the hotel cards, but:
   - corner button in the TOP-RIGHT (white button, dark notch)
   - region badge top-left, destination name centered
   - no visible arrows; auto-scrolls one card at a time (via JS)
   To restyle: edit the --tdc-* tokens below.
   ════════════════════════════════════════════════════════════════════ */
.tdc {
  --tdc-card-h: 452px; /* card height (same as hotels) */
  --tdc-card-radius: 24px;
  --tdc-fab-radius: 22px;
  --tdc-gap-x: 26px;
  --tdc-bg: #1a1a19; /* dark backing behind the button (the notch effect) */
  --tdc-fab: #ffffff; /* button background — white */
  --tdc-fab-icon: #1a1a19; /* arrow glyph — black */
  --tdc-title: var(--light);
  --tdc-fab-size: 56px;
  --tdc-notch-r: 20px;
  --tdc-notch-gap: 12px;
  --tdc-card-w: min(360px, 86vw); /* FIXED width — never stretches with the section */
  direction: ltr;
  width: 100%;
  position: relative;
  font-family: inherit;
}
.tdc *,
.tdc *::before,
.tdc *::after {
  box-sizing: border-box;
}
/* Viewport + track */
.tdc-viewport {
  overflow: hidden;
  width: 100%;
  padding: 6px 0;
}
.tdc-track {
  display: flex;
  gap: var(--tdc-gap-x);
  will-change: transform;
}
/* Card + image + overlay */
.tdc-card {
  position: relative;
  flex: 0 0 var(--tdc-card-w);
  height: var(--tdc-card-h);
  border-radius: var(--tdc-card-radius);
  overflow: hidden;
  color: var(--tdc-title);
  isolation: isolate;
  background: #3a3f45;
}
.tdc-card-img {
  position: absolute;
  inset: 0;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover !important;
  object-position: center !important;
  z-index: 0;
}
.tdc-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    radial-gradient(120% 78% at 50% 45%, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0) 60%),
    linear-gradient(
      180deg,
      rgba(0, 0, 0, 0.32) 0%,
      rgba(0, 0, 0, 0.06) 28%,
      rgba(0, 0, 0, 0) 55%,
      rgba(0, 0, 0, 0.2) 100%
    );
}
/* Region badge + centered name */
.tdc-badge {
  position: absolute;
  top: 22px;
  left: 22px;
  z-index: 2;
  background: rgba(255, 255, 255, 0.14);
  border: 1px solid rgba(255, 255, 255, 0.24);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  color: #f2f2f2;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  padding: 8px 15px;
  border-radius: 100px;
}
.tdc-card-title {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 0 26px;
  margin: 0;
  font-size: 40px;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.04;
  text-transform: uppercase;
  text-shadow: 0 2px 20px rgba(0, 0, 0, 0.4);
}
/* Top-right notch + corner button */
.tdc-card::after {
  content: "";
  position: absolute;
  right: -2px;
  top: -2px; /* overshoot the edges — the card clips it, killing the seam */
  width: calc(var(--tdc-fab-size) + var(--tdc-notch-gap) + 2px);
  height: calc(var(--tdc-fab-size) + var(--tdc-notch-gap) + 2px);
  background: var(--tdc-bg);
  border-bottom-left-radius: var(--tdc-notch-r);
  z-index: 3;
}
.tdc-fab {
  position: absolute;
  right: 0;
  top: 0;
  width: var(--tdc-fab-size);
  height: var(--tdc-fab-size);
  background: var(--tdc-fab);
  border-radius: var(--tdc-fab-radius);
  z-index: 5;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition:
    background 0.15s,
    transform 0.15s;
}
.tdc-fab:hover {
  transform: scale(1.05);
}
/* concave fillets where the notch meets the card edges */
.tdc-fab::before,
.tdc-fab::after {
  content: "";
  position: absolute;
  width: var(--tdc-notch-r);
  height: var(--tdc-notch-r);
  z-index: 4;
  background: radial-gradient(
    circle at bottom left,
    transparent var(--tdc-notch-r),
    var(--tdc-bg) 0
  );
}
.tdc-fab::before {
  /* rounds junction on the card's right edge (below the notch) */
  top: calc(var(--tdc-fab-size) + var(--tdc-notch-gap));
  right: -2px; /* overshoot right edge — clipped by the card */
  width: calc(var(--tdc-notch-r) + 2px);
}
.tdc-fab::after {
  /* rounds junction on the card's top edge (left of the notch) */
  right: calc(var(--tdc-fab-size) + var(--tdc-notch-gap));
  top: 0;
}
.tdc-fab-icon {
  width: 23px;
  height: 23px;
  background-color: var(--tdc-fab-icon);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 6h10v10h-2.2V9.75L7.4 18.05 6 16.6 14.25 8.2H8z'/%3E%3C/svg%3E")
    no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 6h10v10h-2.2V9.75L7.4 18.05 6 16.6 14.25 8.2H8z'/%3E%3C/svg%3E")
    no-repeat center / contain;
}
/* Destination carousel — responsive */
@media (max-width: 767px) {
  .tdc {
    --tdc-card-h: 430px;
    --tdc-gap-x: 16px;
  }
  .tdc-card-title {
    font-size: 34px;
  }
}
/* Section full width — without breaking centering */
.ts.destinations-carousel > .e-con-inner {
  max-width: 100% !important;
}
@media (max-width: 767px) {
  .ts.destinations-carousel {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}
/* ── כפתור Get a Quote — גרסה בהירה על רקע כהה ── */
.tdc-head {
  padding: 0 24px 26px;
}
.tdc-quote,
.tdc-quote:link,
.tdc-quote:visited {
  background: var(--light);
  color: var(--dark) !important;
}
.tcta-link,
.tcta-link:link,
.tcta-link:visited {
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  background: transparent;
  color: var(--dark) !important;
  font-family: inherit;
  font-size: 15px;
  font-weight: 700;
  line-height: 1;
  padding: 14px 28px;
  border-radius: 100px;
  border: 1px solid rgba(26, 26, 25, 0.28);
  cursor: pointer;
  text-decoration: none !important;
  white-space: nowrap;
  transition:
    background 0.18s ease,
    color 0.18s ease,
    transform 0.18s ease;
}
.tcta-link:hover,
.tcta-link:active {
  background: var(--dark);
  color: var(--light) !important;
  transform: translateY(-1px);
} /* ════════════════════════════════════════════════════════════════════
   23 · CTA BUTTON  (.tcta) — reusable black pill
   Clean-HTML button used across sections. Pair with .contact-webhook
   and data-section="..." so every click fires the global webhook.
   ════════════════════════════════════════════════════════════════════ */
.tcta,
.tcta:link,
.tcta:visited {
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto; /* self-centering, no matter the parent */
  background: var(--dark) !important;
  color: var(--light) !important;
  font-family: inherit !important;
  font-size: 18px;
  font-weight: 700;
  line-height: 1;
  padding: 20px 40px;
  border-radius: 100px;
  border: none;
  cursor: pointer;
  text-decoration: none !important;
  white-space: nowrap;
  transition:
    background 0.18s ease,
    transform 0.18s ease;
}
.tcta:hover,
.tcta:active {
  background: #2a2a2a !important;
  transform: translateY(-1px);
}
.tcta-sm {
  padding: 14px 28px;
  font-size: 15px;
} /* smaller variant */
/* CTA block at the end of the comparison section */
.ts.s-comparison .comp-cta {
  text-align: center;
  margin-top: 8px;
}
.ts.s-comparison .comp-cta-text {
  font-size: var(--comp-intro-size);
  line-height: 1.7;
  color: var(--comp-td-color);
  max-width: 560px;
  margin: 0 auto 20px;
}
.tcta-ghost,
.tcta-ghost:link,
.tcta-ghost:visited {
  background: transparent !important;
  color: var(--dark) !important;
  border: 1px solid rgba(26, 26, 25, 0.28) !important;
}
.tcta-ghost:hover,
.tcta-ghost:active {
  background: var(--dark) !important;
  color: var(--light) !important;
  transform: translateY(-1px);
}
/* ════════════════════════════════════════════════════════════════════
   24 · HERO — DESTINATION  (.thero) — modern SaaS, split layout
   Left = copy (eyebrow, headline w/ rotating word, sub, CTAs).
   Right = offset "bento" tile cluster (glass, tinted, floating).
   Background = destination photo + dark overlay (stronger on the left for
   text legibility). Content lives in the HTML widget; the rotating-word
   behavior lives in the "Hero" footer snippet. Restyle via --thero-*.
   ════════════════════════════════════════════════════════════════════ */
.thero {
  --thero-img: url("https://tayatourism.com/wp-content/uploads/2026/03/Untitled-design-scaled.png");
  --thero-overlay: linear-gradient(
    90deg,
    rgba(18, 17, 16, 0.94) 0%,
    rgba(18, 17, 16, 0.8) 46%,
    rgba(18, 17, 16, 0.52) 100%
  );
  --thero-eyebrow: #d6c3a3;
  --thero-title: #f8f8f7;
  --thero-accent: #d6c3a3; /* rotating word color */
  --thero-sub: rgba(248, 248, 247, 0.68);
  --thero-btn-bg: #f8f8f7;
  --thero-btn-fg: #1a1a19;
  --thero-ghost-bd: rgba(248, 248, 247, 0.28);
  --thero-ghost-fg: #f8f8f7;
  --thero-tile-bd: rgba(248, 248, 247, 0.18);
  --thero-tile-val: #f8f8f7;
  --thero-tile-lbl: rgba(248, 248, 247, 0.72);
  --thero-star: #f7931e;
  --thero-btn-radius: 100px;
  direction: ltr;
  position: relative;
  overflow: hidden;
  isolation: isolate;
  width: 100%;
  background: var(--thero-overlay), var(--thero-img);
  background-size: cover, cover;
  background-position: center, center;
  padding: clamp(70px, 9vw, 120px) clamp(20px, 6vw, 90px);
  font-family: inherit;
}
.thero *,
.thero *::before,
.thero *::after {
  box-sizing: border-box;
}
/* Let the hero fill its Elementor section edge-to-edge — no manual
   full-width / zero-padding settings needed in the editor. */
.e-con:has(.thero) > .e-con-inner {
  max-width: 100% !important;
}
.e-con:has(.thero) {
  padding: 0 !important;
}
/* Split layout */
.thero-inner {
  position: relative;
  z-index: 1;
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: clamp(30px, 5vw, 64px);
  align-items: center;
}
/* LEFT — copy */
.thero-copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
}
.thero-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--thero-eyebrow);
  border: 1px solid var(--thero-ghost-bd);
  border-radius: 100px;
  padding: 8px 16px;
  margin-bottom: 24px;
  background: rgba(255, 255, 255, 0.04);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}
.thero-title {
  margin: 0 0 22px;
  font-size: clamp(38px, 4.8vw, 66px);
  font-weight: 900;
  line-height: 1.04;
  letter-spacing: -0.03em;
  color: var(--thero-title);
}
.thero-rotate {
  display: inline-block;
  color: var(--thero-accent);
  transition:
    opacity 0.35s ease,
    transform 0.35s ease;
}
.thero-rotate.is-swap {
  opacity: 0;
  transform: translateY(10px);
}
.thero-sub {
  margin: 0 0 32px;
  max-width: 520px;
  font-size: clamp(15px, 1.4vw, 18px);
  font-weight: 400;
  line-height: 1.7;
  color: var(--thero-sub);
}
.thero-cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: flex-start;
}
.thero-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 16px 30px;
  border-radius: var(--thero-btn-radius);
  font-size: 16px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none !important;
  cursor: pointer;
  white-space: nowrap;
  transition:
    transform 0.18s ease,
    background 0.18s ease,
    border-color 0.18s ease;
}
.thero-btn-primary,
.thero-btn-primary:link,
.thero-btn-primary:visited {
  background: var(--thero-btn-bg);
  color: var(--thero-btn-fg) !important;
  border: 1px solid var(--thero-btn-bg);
}
.thero-btn-primary:hover {
  transform: translateY(-2px);
}
.thero-btn-primary::after {
  content: "";
  width: 7px;
  height: 7px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(-45deg);
}
.thero-btn-ghost,
.thero-btn-ghost:link,
.thero-btn-ghost:visited {
  background: transparent;
  color: var(--thero-ghost-fg) !important;
  border: 1px solid var(--thero-ghost-bd);
}
.thero-btn-ghost:hover {
  border-color: var(--thero-ghost-fg);
  transform: translateY(-2px);
}
/* RIGHT — offset tile cluster */
.thero-cluster {
  position: relative;
  width: 100%;
  min-height: 430px;
}
.thero-tile {
  position: absolute;
  width: 54%;
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 18px 20px;
  border-radius: 16px;
  border: 1px solid var(--thero-tile-bd);
  background: rgba(255, 255, 255, 0.08);
  -webkit-backdrop-filter: blur(13px);
  backdrop-filter: blur(13px);
  box-shadow: 0 22px 55px rgba(0, 0, 0, 0.38);
  animation: theroFloat 6s ease-in-out infinite;
}
.thero-tile-val {
  font-family: var(--font-serif);
  font-size: 34px;
  font-weight: 300;
  line-height: 1;
  color: var(--thero-tile-val);
}
.thero-tile-lbl {
  font-size: 12px;
  letter-spacing: 0.03em;
  color: var(--thero-tile-lbl);
}
.thero-tile-stars {
  font-size: 18px;
  letter-spacing: 2px;
  line-height: 1;
  color: var(--thero-star);
}
.thero-tile-a {
  left: 0;
  top: 0;
  background: rgba(55, 138, 221, 0.26);
  animation-delay: 0s;
}
.thero-tile-b {
  right: 0;
  top: 19%;
  background: rgba(214, 195, 163, 0.24);
  animation-delay: 0.8s;
}
.thero-tile-c {
  left: 4%;
  top: 45%;
  background: rgba(216, 90, 48, 0.24);
  animation-delay: 1.6s;
}
.thero-tile-d {
  right: 3%;
  top: 63%;
  background: rgba(248, 248, 247, 0.13);
  animation-delay: 2.4s;
}
@keyframes theroFloat {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-10px);
  }
}
/* Entrance fade-up — pure CSS */
@keyframes theroUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
.thero-copy > * {
  animation: theroUp 0.7s cubic-bezier(0.4, 0, 0.2, 1) both;
}
.thero-copy > *:nth-child(1) {
  animation-delay: 0.05s;
}
.thero-copy > *:nth-child(2) {
  animation-delay: 0.15s;
}
.thero-copy > *:nth-child(3) {
  animation-delay: 0.25s;
}
.thero-copy > *:nth-child(4) {
  animation-delay: 0.35s;
}
.thero-cluster {
  animation: theroUp 0.8s cubic-bezier(0.4, 0, 0.2, 1) both 0.35s;
}
@media (prefers-reduced-motion: reduce) {
  .thero-copy > *,
  .thero-cluster,
  .thero-tile {
    animation: none;
  }
  .thero-rotate {
    transition: none;
  }
}
/* Responsive */
@media (max-width: 900px) {
  .thero-inner {
    grid-template-columns: 1fr;
    gap: 44px;
  }
  .thero-copy {
    align-items: center;
    text-align: center;
  }
  .thero-sub {
    margin-left: auto;
    margin-right: auto;
  }
  .thero-cta-row {
    justify-content: center;
  }
  .thero-cluster {
    width: 100%;
    max-width: 400px;
    margin: 0 auto;
    min-height: 380px;
  }
}
@media (max-width: 480px) {
  .thero-tile {
    width: 60%;
    padding: 14px 16px;
  }
  .thero-tile-val {
    font-size: 28px;
  }
  .thero-cta-row {
    width: 100%;
  }
  .thero-btn {
    flex: 1 1 auto;
  }
}
/* ════════════════════════════════════════════════════════════════════
   25 · HERO — TULUM EDITORIAL  (.taya / .ty-*)
   Editorial split hero: big copy (left) + tall image panel (right) with
   a detached stats card and a floating lead form, followed by the intro
   block. Markup lives in the page HTML widget; the rotating word +
   favourite-heart behaviour lives in the "Hero" footer snippet.
   Uses the site tokens from section 01 (--light/--dark/--warm/--gray/--soft).
   ════════════════════════════════════════════════════════════════════ */
/* scope the reset locally instead of a global *{} */
.taya,
.taya * {
  box-sizing: border-box;
}
.taya {
  background: transparent;
  font-family: inherit;
  color: var(--dark);
  -webkit-font-smoothing: antialiased;
  padding: clamp(80px, 9vw, 130px) clamp(20px, 6vw, 90px) clamp(56px, 7vw, 90px);
}
.taya-wrap {
  max-width: 1220px;
  margin: 0 auto;
}
/* ── breadcrumb ──────────────────────────────────────────────────── */
.taya .ty-crumb {
  margin: 0 0 clamp(26px, 3.5vw, 40px);
  font-family: inherit;
  font-size: 12px;
  font-weight: 700;
  color: #6b6b68;
}
.taya .ty-crumb a {
  color: #6b6b68;
  text-decoration: none;
}
.taya .ty-crumb a:hover {
  color: #000;
}
.taya .ty-crumb .sep {
  color: #c7c7c4;
  padding: 0 6px;
  font-weight: 400;
}
.taya .ty-crumb .last {
  color: #111;
}
/* ── HERO GRID ───────────────────────────────────────────────────── */
.taya .ty-hero {
  display: grid;
  grid-template-columns: 1.08fr 0.92fr;
  grid-template-areas: "copy stage" "trust stage";
  grid-template-rows: auto auto;
  column-gap: clamp(34px, 4.5vw, 74px);
  align-items: center;
}
.taya .ty-copy {
  grid-area: copy;
  align-self: end;
  max-width: 560px;
}
.taya .ty-trust {
  grid-area: trust;
  align-self: start;
  margin-top: 30px;
}
.taya .ty-stage {
  grid-area: stage;
  grid-row: 1 / span 2;
  align-self: center;
}
/* LEFT — copy */
.taya .ty-eyebrow {
  display: inline-flex;
  align-items: center;
  margin-bottom: 26px;
  border: none;
  background: #cbb68f;
  color: var(--dark);
  font-family: var(--font-mono);
  font-size: 8.5px;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  line-height: 1;
  padding: 4px 12px;
  border-radius: 100px;
}
.taya .ty-title {
  margin: 0 0 26px;
  font-weight: 900;
  letter-spacing: -0.035em;
  font-size: clamp(40px, 5.6vw, 74px);
  line-height: 0.98;
  color: var(--dark);
}
.taya .ty-title .line2 {
  display: inline;
}
.taya .ty-rotate {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 400;
  color: var(--warm);
  letter-spacing: -0.01em;
  transition:
    opacity 0.4s ease,
    transform 0.4s ease;
  display: inline-block;
}
.taya .ty-rotate.swap {
  opacity: 0;
  transform: translateY(12px);
}
.taya .ty-sub {
  margin: 0 0 30px;
  max-width: 470px;
  font-size: clamp(15px, 1.35vw, 17px);
  line-height: 1.75;
  color: #565654;
}
/* trust row */
.taya .ty-trust {
  display: flex;
  align-items: center;
  gap: 14px;
}
.taya .ty-avatars {
  display: flex;
}
.taya .ty-avatars span {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 2px solid var(--light);
  margin-left: -10px;
  background-size: cover;
  background-position: center;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12);
}
.taya .ty-avatars span:first-child {
  margin-left: 0;
}
.taya .ty-trust p {
  margin: 0;
  font-size: 13px;
  line-height: 1.4;
  color: #565654;
}
.taya .ty-trust b {
  color: var(--dark);
  font-weight: 800;
}
.taya .ty-stars {
  color: var(--warm);
  letter-spacing: 1px;
  font-size: 12px;
}
/* RIGHT — stage = shared positioning context for image + floating cards */
.taya .ty-stage {
  position: relative;
  width: 100%;
  max-width: 470px;
  margin: 0 auto;
}
.taya .ty-panel {
  position: relative;
  border-radius: 26px;
  overflow: visible;
  width: 100%;
  aspect-ratio: 4/5;
  min-height: 440px;
}
.taya .ty-panel .frame {
  position: absolute;
  inset: 0;
  border-radius: 26px;
  overflow: hidden;
  box-shadow: 0 30px 70px rgba(26, 26, 25, 0.16);
}
.taya .ty-panel img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.taya .ty-panel .frame::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.08) 0%,
    rgba(0, 0, 0, 0) 34%,
    rgba(0, 0, 0, 0) 72%,
    rgba(0, 0, 0, 0.14) 100%
  );
}
/* glass destination chip (top-left) */
.taya .ty-chip {
  position: absolute;
  top: 16px;
  left: 16px;
  z-index: 3;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 9px 15px 9px 12px;
  border-radius: 100px;
  color: #fff;
  background: rgba(255, 255, 255, 0.14);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.28);
}
.taya .ty-chip .dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--warm);
  box-shadow: 0 0 0 4px rgba(214, 195, 163, 0.3);
}
.taya .ty-chip b {
  font-size: 14px;
  font-weight: 800;
  letter-spacing: -0.01em;
}
.taya .ty-chip small {
  font-size: 11px;
  opacity: 0.82;
  margin-left: 2px;
}
/* favourite heart (top-right) */
.taya .ty-fav {
  position: absolute;
  top: 16px;
  right: 16px;
  z-index: 3;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.16);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.32);
  transition:
    background 0.18s,
    transform 0.18s;
}
.taya .ty-fav:hover {
  background: rgba(255, 255, 255, 0.28);
  transform: scale(1.06);
}
.taya .ty-fav svg {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: #fff;
  stroke-width: 2;
}
.taya .ty-fav.on svg {
  fill: #fff;
}
/* headline over image bottom */
.taya .ty-panel .cap {
  position: absolute;
  left: 20px;
  right: 20px;
  bottom: 20px;
  z-index: 2;
  color: #fff;
}
.taya .ty-panel .cap h3 {
  margin: 0;
  font-size: 34px;
  font-weight: 800;
  letter-spacing: -0.03em;
  text-shadow: 0 2px 18px rgba(0, 0, 0, 0.4);
}
.taya .ty-panel .cap p {
  margin: 5px 0 0;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.86);
}
/* ── DETACHED STATS CARD (the "counter") ─────────────────────────── */
.taya .ty-stats {
  position: absolute;
  z-index: 5;
  right: -104px;
  top: 31%;
  transform: translateY(-50%);
  width: 168px;
  background: #fff;
  border-radius: 20px;
  border: 1px solid rgba(26, 26, 25, 0.07);
  box-shadow: 0 24px 55px rgba(26, 26, 25, 0.2);
  padding: 16px 18px;
}
.taya .ty-stats .row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 9px 0;
  border-bottom: 1px solid rgba(26, 26, 25, 0.07);
}
.taya .ty-stats .row:last-child {
  border-bottom: none;
  padding-bottom: 2px;
}
.taya .ty-stats .row:first-child {
  padding-top: 2px;
}
.taya .ty-stats .k {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: #7a7a77;
  font-weight: 500;
}
.taya .ty-stats .k svg {
  width: 15px;
  height: 15px;
  stroke: var(--warm);
  fill: none;
  stroke-width: 1.9;
}
.taya .ty-stats .v {
  font-size: 15px;
  font-weight: 800;
  color: var(--dark);
  letter-spacing: -0.01em;
}
.taya .ty-stats .v small {
  font-size: 11px;
  font-weight: 600;
  color: #9a9895;
}
.taya .ty-badge {
  position: absolute;
  top: -13px;
  right: 16px;
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #fff;
  background: var(--dark);
  padding: 5px 11px;
  border-radius: 100px;
}
/* ── FLOATING VERTICAL FORM (4 rows) ─────────────────────────────── */
.taya .ty-form {
  position: absolute;
  z-index: 6;
  top: 61%;
  left: -46px;
  transform: translateY(-50%);
  width: 238px;
  background: #fff;
  border-radius: 22px;
  border: 1px solid rgba(26, 26, 25, 0.07);
  box-shadow: 0 28px 64px rgba(26, 26, 25, 0.22);
  padding: 20px;
  color-scheme: light;
}
.taya .ty-form h4 {
  margin: 0 0 3px;
  font-size: 17px;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--dark);
}
.taya .ty-form .fsub {
  margin: 0 0 15px;
  font-size: 12px;
  line-height: 1.5;
  color: #7a7a77;
}
.taya .ty-row {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #f6f5f3;
  border: 1px solid rgba(26, 26, 25, 0.08);
  border-radius: 12px;
  padding: 11px 14px;
  margin-bottom: 9px;
  transition:
    border-color 0.18s,
    background 0.18s;
}
.taya .ty-row:focus-within {
  border-color: var(--warm);
  background: #fff;
}
.taya .ty-row svg {
  width: 17px;
  height: 17px;
  stroke: #8a7a5c;
  fill: none;
  stroke-width: 1.8;
  flex-shrink: 0;
}
.taya .ty-row input {
  border: none;
  outline: none;
  background: transparent;
  font-family: inherit;
  font-size: 14px;
  font-weight: 500;
  color: var(--dark);
  width: 100%;
  min-width: 0;
  -webkit-appearance: none;
  appearance: none;
}
.taya .ty-row input::placeholder {
  color: #a8a6a2;
  font-weight: 500;
}
.taya .ty-row input[type="date"] {
  color: #a8a6a2;
}
.taya .ty-row input[type="date"]:valid {
  color: var(--dark);
}
.taya .ty-row input[type="date"]::-webkit-calendar-picker-indicator {
  opacity: 0.5;
  cursor: pointer;
}
.taya .ty-submit {
  width: 100%;
  margin-top: 5px;
  border: none;
  cursor: pointer;
  background: var(--dark);
  color: #fff;
  border-radius: 12px;
  padding: 13px;
  font-family: inherit;
  font-size: 15px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  transition:
    background 0.18s,
    transform 0.18s;
}
.taya .ty-submit:hover {
  background: #2a2a2a;
  transform: translateY(-1px);
}
.taya .ty-submit svg {
  width: 17px;
  height: 17px;
  stroke: #fff;
  fill: none;
  stroke-width: 2.2;
}
/* ── INTRO block ─────────────────────────────────────────────────── */
.taya .ty-divider {
  width: 100%;
  height: 1px;
  background: var(--divider-dark-line);
  margin: clamp(52px, 7vw, 84px) 0 0;
  border: none;
}
.taya .ty-intro {
  max-width: 720px;
  padding-top: clamp(48px, 6vw, 80px);
}
.taya .ty-intro .kicker {
  margin: 0 auto clamp(24px, 3vw, 32px);
}
.taya .ty-intro h2 {
  margin: 0 0 16px;
  font-size: clamp(21px, 2.6vw, 28px);
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: -0.015em;
  color: var(--dark);
}
.taya .ty-intro h2 em {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 400;
  color: var(--warm);
}
.taya .ty-intro p {
  margin: 0 auto 38px;
  max-width: 520px;
  font-size: 16px;
  line-height: 1.85;
  color: #565654;
}
.taya .ty-intro .cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: var(--dark);
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  padding: 17px 34px;
  border-radius: 100px;
  border: none;
  cursor: pointer;
  text-decoration: none;
  transition:
    background 0.18s,
    transform 0.18s;
}
.taya .ty-intro .cta:hover {
  background: #2a2a2a;
  transform: translateY(-1px);
}
.taya .ty-intro .cta::after {
  content: "";
  width: 7px;
  height: 7px;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(-45deg);
}
/* ── responsive ──────────────────────────────────────────────────── */
/* desktop: nudge the whole right cluster (image + stats + form) up ~8px */
@media (min-width: 941px) {
  .taya .ty-stage {
    transform: translateY(-30px);
  }
}
/* tighten overhangs on mid-desktop so nothing runs off screen */
@media (max-width: 1080px) and (min-width: 941px) {
  .taya .ty-form {
    left: -14px;
    width: 222px;
  }
  .taya .ty-stats {
    right: -60px;
    width: 158px;
  }
  .taya .ty-stage {
    max-width: 400px;
  }
}
/* ══ TABLET / MOBILE (≤940): single column ══
   Image + search form merge into ONE card (image top, form bottom).
   Stats card + gold eyebrow hidden; trust row moves below the card. */
@media (max-width: 940px) {
  .taya {
    padding: clamp(96px, 22vw, 136px) clamp(18px, 6vw, 48px) 100px;
  }
  .taya .ty-hero {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
  }
  .taya .ty-copy {
    order: 1;
    align-self: stretch;
    max-width: none;
    text-align: center;
    margin: 0 auto 26px;
  }
  .taya .ty-eyebrow {
    display: none;
  }
  .taya .ty-sub {
    margin-left: auto;
    margin-right: auto;
  }
  .taya .ty-trust {
    order: 3;
    align-self: center;
    justify-content: center;
    margin: 22px auto 0;
  }
  .taya .ty-stage {
    order: 2;
    align-self: center;
    width: 100%;
    max-width: 420px;
    background: #fff;
    border-radius: 24px;
    overflow: hidden;
    border: 1px solid rgba(26, 26, 25, 0.06);
    box-shadow: 0 24px 52px rgba(26, 26, 25, 0.14);
  }
  .taya .ty-panel {
    aspect-ratio: 4/3;
    min-height: 0;
    border-radius: 0;
  }
  .taya .ty-panel .frame {
    border-radius: 0;
    box-shadow: none;
  }
  .taya .ty-form {
    position: static;
    transform: none;
    width: 100%;
    max-width: none;
    margin: 0;
    border-radius: 0;
    box-shadow: none;
    background: transparent;
    padding: 20px clamp(18px, 5vw, 24px) 22px;
  }
  .taya .ty-stats {
    display: none;
  }
  .taya .ty-trust {
    margin-bottom: 0;
  }
  .taya .ty-divider {
    margin-top: 52px;
  }
  .taya .ty-intro {
    padding-top: 48px;
  }
}
/* ══ SMALL PHONES (≤430) ══ */
@media (max-width: 430px) {
  .taya .ty-title {
    font-size: clamp(34px, 10vw, 44px);
  }
  .taya .ty-panel {
    aspect-ratio: 5/4;
  }
  .taya .ty-intro {
    padding-top: clamp(40px, 10vw, 60px);
  }
}
/* Divider line inside .divider-section-dark — identical to the hero .ty-divider */
body .elementor .ts.divider-section-dark hr,
body .elementor .ts.divider-section-dark hr.e-divider-base,
body .elementor .ts.divider-section-dark hr.divider-dark {
  height: 1px !important;
  border: 0 !important;
  border-top: 0 !important;
  border-block-start: 0 !important;
  background-color: var(--divider-dark-line) !important;
  opacity: 1 !important;
  width: 90% !important; /* ← אורך הקו. קטן יותר = קצר יותר */
  max-width: 1100px !important; /* ← תקרה קשיחה לאורך */
  margin: 0 auto !important; /* ← ממרכז אותו */
}
/* Hide the hero↔intro line at ALL breakpoints + control the gap */
.taya .ty-divider {
  background: transparent !important; /* מסתיר את הקו */
  height: 0 !important;
  border: 0 !important;
  margin: 0 !important; /* מאפס את הרווח שלו */
}
/* ← זה הרווח בין ה-hero ל-intro. שנה את הערך */
.taya .ty-intro {
  padding-top: 60px !important;
}
/* מובייל */
@media (max-width: 940px) {
  .taya .ty-intro {
    padding-top: 40px !important;
  }
}
.taya .ty-intro .kicker,
.taya .ty-intro h2 {
  display: none !important;
}
.taya .ty-intro {
  max-width: 620px;
  margin: 0 auto;
  text-align: center !important;
  padding-top: 60px;
}
.taya .ty-intro h2 {
  display: none !important;
} /* כותרת מוסתרת */
/* קו הזהב הקטן חוזר */
.taya .ty-intro .kicker {
  display: block !important;
  width: 44px;
  height: 3px;
  border-radius: 2px;
  background: var(--warm) !important;
  margin: 0 auto 28px !important;
}
.taya .ty-intro p {
  font-size: 18px;
  line-height: 1.9;
  color: #3c3936;
  max-width: none !important;
  margin: 0 0 30px !important;
  text-align: center !important;
}
/* אות פתיחה מורמת — עובדת עם מרכוז (בלי float) */
.taya .ty-intro p::first-letter {
  font-family: var(--font-serif);
  font-weight: 400;
  font-size: 50px;
  line-height: 1;
  color: var(--dark);
  vertical-align: -7px;
  margin-right: 1px;
}
.taya .ty-intro p em {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 400;
  color: var(--warm);
}
.taya .ty-intro .cta {
  margin: 0 auto !important;
}
@media (max-width: 940px) {
  .taya .ty-intro {
    padding-top: 40px;
  }
  .taya .ty-intro p {
    font-size: 16px;
  }
  .taya .ty-intro p::first-letter {
    font-size: 42px;
  }
}
/* Intro CTA — underlined text link (option A) */
.taya .ty-intro .ty-link {
  display: inline-block;
  font-family: inherit;
  font-size: 16px;
  font-weight: 500;
  color: var(--dark) !important;
  text-decoration: none !important;
  background: none !important;
  border: none !important;
  padding: 0 0 3px 0 !important;
  border-bottom: 1.5px solid var(--warm) !important;
  cursor: pointer;
  transition:
    border-color 0.18s ease,
    opacity 0.18s ease;
}
.taya .ty-intro .ty-link:hover {
  opacity: 0.7;
  border-bottom-color: var(--dark) !important;
}
/* ════════════════════════════════════════════════════════════════════
   26 · Forms — autocomplete + date picker (.ty-ac / flatpickr)
   Destination autocomplete, form header, and themed date picker.
   ════════════════════════════════════════════════════════════════════ */
/* ══════════════════════════════════════════════════════════════
   (A) DESTINATIONS AUTOCOMPLETE DROPDOWN  (Where to?)
   Requires the HTML input to have  id="ty-dest"  — see note below.
   ══════════════════════════════════════════════════════════════ */
.ty-ac {
  position: fixed;
  z-index: 99999;
  background: #fff;
  border: 1px solid rgba(26, 26, 25, 0.1);
  border-radius: 14px;
  box-shadow: 0 18px 44px rgba(26, 26, 25, 0.18);
  padding: 6px;
  max-height: 280px;
  overflow-y: auto;
  font-family: inherit;
  -webkit-overflow-scrolling: touch;
}
.ty-ac-group {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #8a7a5c;
  padding: 10px 12px 6px;
}
.ty-ac-item {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 9px 12px;
  border-radius: 9px;
  font-size: 14px;
  font-weight: 500;
  color: var(--dark);
  cursor: pointer;
}
.ty-ac-item:hover,
.ty-ac-item.is-active {
  background: #f0eee9;
}
.ty-ac-item .pin {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  color: #b8a985;
}
.ty-ac-empty {
  padding: 14px 12px;
  font-size: 13px;
  color: #9a9895;
  text-align: center;
}
/* ══════════════════════════════════════════════════════════════
   (C) FORM HEADER — title + date icon button (Option B)
   Phone has its own row; the date lives as a dark icon button in the
   form header. Picking a date reveals it as small text below the sub.
   ══════════════════════════════════════════════════════════════ */
.taya .ty-form-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 15px;
}
.taya .ty-form-head-txt {
  min-width: 0;
}
.taya .ty-form-head h4 {
  margin: 0 0 3px;
  font-size: 17px;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--dark);
}
.taya .ty-form-head .fsub {
  margin: 0;
  font-size: 12px;
  line-height: 1.5;
  color: #7a7a77;
}
.taya .ty-date-label {
  display: none;
  margin-top: 7px;
  font-size: 12px;
  font-weight: 700;
  color: var(--dark);
}
.taya .ty-date-label::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--warm);
  margin-right: 7px;
  vertical-align: 1px;
}
.taya .ty-date-btn {
  flex-shrink: 0;
  width: 38px;
  height: 38px;
  border-radius: 11px;
  border: none;
  cursor: pointer;
  background: var(--dark);
  display: flex;
  align-items: center;
  justify-content: center;
  transition:
    transform 0.18s ease,
    box-shadow 0.18s ease;
}
.taya .ty-date-btn:hover {
  transform: translateY(-1px);
}
.taya .ty-date-btn svg {
  width: 18px;
  height: 18px;
  color: var(--warm);
}
.taya .ty-date-btn.is-set {
  box-shadow: 0 0 0 2px var(--warm);
}
/* hidden flatpickr target — present in the DOM but invisible */
.taya .ty-date-input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: 0;
  border: 0;
  opacity: 0;
  pointer-events: none;
}
/* ══════════════════════════════════════════════════════════════
   (B) CUSTOM DATE PICKER (flatpickr) — themed to the site
   The date field is now a normal text input, so its empty state uses
   the same grey ::placeholder as every other field automatically.
   These rules restyle the flatpickr calendar popup: dark selected day,
   gold hover, rounded corners, Heebo font.
   (You can delete the two old native-date lines from section 25:
       .taya .ty-row input[type=date]{color:#a8a6a2;}
       .taya .ty-row input[type=date]:valid{color:var(--dark);}  )
   ══════════════════════════════════════════════════════════════ */
.flatpickr-calendar {
  border-radius: 16px !important;
  border: 1px solid rgba(26, 26, 25, 0.1) !important;
  box-shadow: 0 18px 44px rgba(26, 26, 25, 0.18) !important;
  font-family: inherit !important;
  padding: 6px !important;
}
.flatpickr-months .flatpickr-month,
.flatpickr-current-month .flatpickr-monthDropdown-months,
.flatpickr-current-month input.cur-year,
.flatpickr-weekday {
  color: var(--dark) !important;
  fill: var(--dark) !important;
  font-weight: 700 !important;
}
.flatpickr-months .flatpickr-prev-month svg,
.flatpickr-months .flatpickr-next-month svg {
  fill: var(--dark) !important;
}
.flatpickr-months .flatpickr-prev-month:hover svg,
.flatpickr-months .flatpickr-next-month:hover svg {
  fill: var(--warm) !important;
}
.flatpickr-day {
  border-radius: 10px !important;
  color: var(--dark) !important;
  font-weight: 500 !important;
}
.flatpickr-day:hover,
.flatpickr-day.prevMonthDay:hover,
.flatpickr-day.nextMonthDay:hover {
  background: #f0eee9 !important;
  border-color: #f0eee9 !important;
}
.flatpickr-day.today {
  border-color: var(--warm) !important;
}
.flatpickr-day.today:hover {
  background: var(--warm) !important;
  border-color: var(--warm) !important;
  color: var(--dark) !important;
}
.flatpickr-day.selected,
.flatpickr-day.selected:hover,
.flatpickr-day.startRange,
.flatpickr-day.endRange {
  background: var(--dark) !important;
  border-color: var(--dark) !important;
  color: #fff !important;
  border-radius: 10px !important;
}
.flatpickr-day.flatpickr-disabled,
.flatpickr-day.flatpickr-disabled:hover,
.flatpickr-day.prevMonthDay,
.flatpickr-day.nextMonthDay {
  color: #c7c5c1 !important;
}
/* ══════════════════════════════════════════════════════════════
   27 · Start-planning page (.tsp)
   LEFT = about us + benefits box · RIGHT = lead form (static card).
   ══════════════════════════════════════════════════════════════ */
.taya.tsp {
  padding: clamp(80px, 9vw, 120px) clamp(20px, 6vw, 90px);
}
.tsp .tsp-grid {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: clamp(34px, 5vw, 72px);
  align-items: center;
  max-width: 1180px;
  margin: 0 auto;
}
/* LEFT — about */
.tsp .tsp-about {
  max-width: 540px;
}
.tsp .tsp-about h1 {
  margin: 22px 0 18px;
  font-size: clamp(32px, 3.9vw, 52px);
  font-weight: 900;
  letter-spacing: -0.03em;
  line-height: 1.04;
  color: var(--dark);
}
.tsp .tsp-about p {
  margin: 0 0 24px;
  max-width: 450px;
  font-size: 16px;
  line-height: 1.8;
  color: #565654;
}
/* trust row — static, left aligned */
.tsp .tsp-trust {
  margin-top: 8px;
}
/* RIGHT — reuse .ty-form but as a normal static card (kill hero floating) */
.tsp .tsp-formcol {
  display: flex;
  justify-content: center;
  width: 100%;
}
.tsp .ty-form {
  position: static !important;
  transform: none !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  width: 100% !important;
  max-width: 400px !important;
  margin: 0 !important;
  background: #fff !important;
  border: 1px solid rgba(26, 26, 25, 0.07) !important;
  border-radius: 22px !important;
  padding: 20px !important;
  box-shadow: 0 28px 64px rgba(26, 26, 25, 0.16) !important;
}
/* responsive: stack, center */
@media (max-width: 940px) {
  .tsp .tsp-grid {
    grid-template-columns: 1fr;
    gap: 38px;
  }
  .tsp .tsp-about {
    max-width: none;
    text-align: center;
    margin: 0 auto;
  }
  .tsp .tsp-about p {
    margin-left: auto;
    margin-right: auto;
  }
  .tsp .tsp-benefits {
    margin-left: auto;
    margin-right: auto;
  }
  .tsp .tsp-trust {
    justify-content: center;
  }
  .tsp .ty-form {
    margin: 0 auto !important;
  }
}
/* ════════════════════════════════════════════════════════════════════
   28 · Destination carousel — scroll + arrows (.tdc)
   Native scroll, head/quote layout, and carousel arrow behavior.
   ════════════════════════════════════════════════════════════════════ */
.tdc-viewport {
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scroll-padding-left: 24px;
  scrollbar-width: none;
  cursor: grab;
}
.tdc-viewport::-webkit-scrollbar {
  display: none;
  height: 0;
  width: 0;
}
.tdc-track {
  padding-left: 24px;
  padding-right: 24px;
  transform: none !important;
}
.tdc-card {
  scroll-snap-align: start;
}
/* head: quote (שמאל) + חיצים (ימין), מקובצים בצד ימין */
.tdc-head {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  padding: 0 24px 22px;
}
/* כפתור quote בהיר (על רקע הסקשן הכהה) */
.tdc-quote,
.tdc-quote:link,
.tdc-quote:visited {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  background: var(--light, #f8f8f7);
  color: var(--dark, #1a1a19) !important;
  border: 1px solid rgba(248, 248, 247, 0.25);
  border-radius: 100px;
  padding: 13px 22px;
  font-size: 15px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none !important;
  white-space: nowrap;
  cursor: pointer;
  transition:
    background 0.18s,
    border-color 0.18s,
    transform 0.18s;
}
.tdc-quote:hover {
  background: #fff;
  border-color: rgba(248, 248, 247, 0.5);
  transform: translateY(-1px);
}
.tdc-quote::after {
  content: "";
  width: 7px;
  height: 7px;
  border-right: 2px solid var(--dark, #1a1a19);
  border-bottom: 2px solid var(--dark, #1a1a19);
  transform: rotate(-45deg);
}
/* חיצים (אותה צורה כמו .thc, צבעים בהירים) */
.tdc-nav {
  display: flex;
  gap: 10px;
  flex-shrink: 0;
}
.tdc-arrow {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: 1px solid rgba(248, 248, 247, 0.35);
  background: var(--light, #f8f8f7);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  outline: none;
  -webkit-tap-highlight-color: transparent;
  transition:
    background 0.18s,
    border-color 0.18s,
    opacity 0.18s,
    transform 0.06s;
}
.tdc-arrow:hover {
  background: #fff;
  border-color: rgba(248, 248, 247, 0.6);
}
/* מנטרל את הוורוד/אדום של הערכה על focus/active — שומר על המראה הבהיר */
.tdc-arrow:focus,
.tdc-arrow:focus-visible,
.tdc-arrow:active {
  background: var(--light, #f8f8f7) !important;
  border-color: rgba(248, 248, 247, 0.6) !important;
  color: var(--dark, #1a1a19) !important;
  outline: none !important;
  box-shadow: none !important;
}
.tdc-arrow:active {
  transform: scale(0.93);
}
.tdc-arrow:disabled {
  opacity: 0.3;
  cursor: default;
}
.tdc-arrow::before {
  content: "";
  width: 8px;
  height: 8px;
  border-top: 2px solid var(--dark, #1a1a19);
  border-right: 2px solid var(--dark, #1a1a19);
}
.tdc-prev::before {
  transform: rotate(-135deg);
  margin-left: 3px;
}
.tdc-next::before {
  transform: rotate(45deg);
  margin-right: 3px;
}
@media (max-width: 767px) {
  .tdc-head {
    justify-content: center;
    padding: 0 16px 22px;
  }
}
/* ════════════════════════════════════════════════════════════════════
   29 · Patches — corner-button hover + comparison text
   Corner-button hover fix and darker comparison text overrides.
   ════════════════════════════════════════════════════════════════════ */
/* Corner-button hover fix */
.tdc-fab,
.thc-fab {
  transition: background 0.15s ease !important;
}
.tdc-fab:hover {
  background: #eeeae2 !important;
  transform: none !important;
}
.thc-fab:hover {
  background: #000 !important;
  transform: none !important;
}
.tdc-fab:active,
.tdc-fab:focus,
.thc-fab:active,
.thc-fab:focus {
  transform: none !important;
  box-shadow: none !important;
}
/* Comparison section: darker, more readable text */
.ts.s-comparison {
  --comp-td-color: #4a4a47 !important; /* body cell text, verdict + decision text */
  --comp-intro-color: #4a4a47 !important; /* intro paragraph under the heading */
  --comp-th-color: #6b6b67 !important; /* table column headers */
  --comp-factor-color: #6b6b67 !important; /* row labels + small block labels */
  --comp-eyebrow-color: #6b6b67 !important; /* top eyebrow */
}
/* subheadline helper (if used) — was light gray too */
.ts.s-comparison .subheadline-dark,
.ts.s-comparison .subheadline-dark [class*="heading-title"],
.ts.s-comparison .subheadline-dark h1,
.ts.s-comparison .subheadline-dark h2,
.ts.s-comparison .subheadline-dark h3 {
  color: #4a4a47 !important;
}
/* Hero — "for + מתחלף" always on its own second line, never a 3rd line */
.taya .ty-title .line2 {
  display: block;
}
.taya .ty-rotate {
  white-space: nowrap;
}
.taya .ty-stats .row {
  justify-content: flex-start;
}
.taya .ty-stats .k {
  flex: 0 0 72px;
}
/* פונט Ploni על כל ההירו */
body.custom-hebrew-page .taya {
  font-family: inherit !important;
}
/* צ'יפ לימין · לב לשמאל */
body.custom-hebrew-page .ty-chip {
  left: auto !important;
  right: 16px !important;
}
body.custom-hebrew-page .ty-fav {
  right: auto !important;
  left: 16px !important;
}
body.custom-hebrew-page .ty-avatars {
  direction: ltr;
}
/* טופס לימין · כרטיס סטטיסטיקות לשמאל · אותו גובה */
@media (min-width: 941px) {
  body.custom-hebrew-page .ty-form {
    left: auto !important;
    right: -46px !important;
    top: 20% !important;
    transform: none !important;
  }
  body.custom-hebrew-page .ty-stats {
    right: auto !important;
    left: -104px !important;
    top: 12% !important;
    transform: none !important;
  }
}
@media (max-width: 1080px) and (min-width: 941px) {
  body.custom-hebrew-page .ty-form {
    right: -14px !important;
    left: auto !important;
  }
  body.custom-hebrew-page .ty-stats {
    left: -60px !important;
    right: auto !important;
  }
}
/* ── פאנל מידע (.taya-panel) — RTL ── */
/* הגלולה זזה לצד הנכון (מימין, בכיוון הפוך) */
body.custom-hebrew-page .taya-panel .tdw-pill {
  left: auto;
  right: var(--info-tab-bar-padding);
  transform: translateX(calc(var(--tdw-i, 0) * -100%));
}
/* יישור טקסט לימין */
body.custom-hebrew-page .taya-panel .tdw-accordion-header,
body.custom-hebrew-page .taya-panel .tdw-accordion-body p,
body.custom-hebrew-page .taya-panel.is-country .tdw-more {
  text-align: right;
}
/* חצים פונים החוצה (שמאלה) */
body.custom-hebrew-page .taya-panel .tdw-dest-arrow,
body.custom-hebrew-page .taya-panel.is-country .tdw-more svg {
  transform: scaleX(-1);
}
/* hover של שורת יעד — לכיוון הנכון */
body.custom-hebrew-page .taya-panel.is-country .tdw-dest-row:hover {
  transform: translateX(-2px);
}
/* ── מרווח לפני פסיק · כפתור נפרד לכל סוג (משחקים כאן) ── */
.custom-hebrew-page .he-cg {
  display: inline-block;
  width: 0;
} /* ברירת מחדל */
.custom-hebrew-page p .he-cg {
  width: 0;
} /* טקסט רגיל — בד"כ לא צריך */
.custom-hebrew-page strong .he-cg,
.custom-hebrew-page b .he-cg {
  width: 0.18em;
} /* מודגש */
.custom-hebrew-page h3 .he-cg {
  width: 0.16em;
} /* כותרת קטנה */
.custom-hebrew-page h2 .he-cg {
  width: 0.2em;
} /* כותרת בינונית */
.custom-hebrew-page h1 .he-cg {
  width: 0.01em;
} /* כותרת גדולה */
.custom-hebrew-page h1 {
  letter-spacing: 0.03em !important;
}
@media (max-width: 940px) {
  .custom-hebrew-page .ty-title .line2 {
    text-align: right;
    padding-right: 0.8em; /* ← מראה־מראה של האנגלית */
  }
}
@media (max-width: 940px) {
  body:not(.custom-hebrew-page) .ty-title .line2 {
    text-align: left;
    padding-left: 0.8em; /* ← ההזזה לאמצע. כוונן את הערך */
  }
}
/* ════════════════════════════════════════════════════════════════════
   30 · FAQ (.taya-faq) — RTL / Hebrew
   Mirrors the accordion for Hebrew pages and right-aligns the text that
   section 17 hard-codes to the left.
   ════════════════════════════════════════════════════════════════════ */
body.custom-hebrew-page .taya-faq {
  direction: rtl;
}
/* question row + answer text → right-aligned (overrides section 17) */
body.custom-hebrew-page .taya-faq .tf-q {
  text-align: right;
}
body.custom-hebrew-page .taya-faq .tf-body-text {
  text-align: right !important;
}
/* sidebar checklist → right-aligned */
body.custom-hebrew-page .taya-faq .tf-check-title,
body.custom-hebrew-page .taya-faq .tf-check-list li {
  text-align: right;
}

/* Hebrew FAQ desktop: keep the left sidebar exactly level with the
   bottom FAQ row, and distribute checklist items evenly in the card. */
@media (min-width: 768px) {
  body.custom-hebrew-page .taya-faq .tf-body {
    align-items: stretch !important;
  }

  body.custom-hebrew-page .taya-faq .tf-sidebar {
    position: static !important;
    top: auto !important;
    align-self: stretch !important;
    height: auto !important;
  }

  body.custom-hebrew-page .taya-faq .tf-check {
    flex: 1 1 0 !important;
    min-height: 0;
    display: flex;
    flex-direction: column;
  }

  body.custom-hebrew-page .taya-faq .tf-check-list {
    flex: 1 1 auto;
    min-height: 0;
    gap: 0;
    justify-content: space-evenly;
  }
}

/* ════════════════════════════════════════════════════════════════════
   31 · COMPARISON (.s-comparison) — RTL / Hebrew + fully centered
   Mirrors the section for Hebrew pages and centers the factor column +
   mobile card labels that section 16 hard-codes to the left.
   ════════════════════════════════════════════════════════════════════ */
body.custom-hebrew-page .ts.s-comparison {
  direction: rtl;
}
/* factor column: left → center (desktop table) */
body.custom-hebrew-page .ts.s-comparison .comp-table th.col-factor,
body.custom-hebrew-page .ts.s-comparison .comp-table td.col-factor {
  text-align: center;
}
/* mobile stacked cards: left → center */
@media (max-width: 767px) {
  body.custom-hebrew-page .ts.s-comparison .comp-table td.col-factor {
    text-align: center;
  }
  body.custom-hebrew-page .ts.s-comparison .comp-table td:not(.col-factor) {
    justify-content: center;
    text-align: center;
  }
  /* the small "column label" before each mobile value */
  body.custom-hebrew-page .ts.s-comparison .comp-table td:not(.col-factor)::before {
    width: auto;
  }
}
/* ════════════════════════════════════════════════════════════════════
   32 · DESTINATIONS CAROUSEL (.tdc) — הגרסה העברית בלבד
   ════════════════════════════════════════════════════════════════════ */
body.custom-hebrew-page .tdc {
  font-family: inherit !important;
}
/* החץ בתוך כפתור הצעת המחיר → מצביע שמאלה */
body.custom-hebrew-page .tdc-quote {
  flex-direction: row-reverse;
}
body.custom-hebrew-page .tdc-quote::after {
  transform: rotate(135deg);
}
/* דסקטופ: המשפט + החיצים בצד ימין */
@media (min-width: 768px) {
  body.custom-hebrew-page .tdc-head {
    justify-content: flex-end;
  }
}
/* מובייל: הצעת המחיר בימין, החיצים בשמאל */
@media (max-width: 767px) {
  body.custom-hebrew-page .tdc-head {
    flex-direction: row-reverse;
    justify-content: space-between;
  }
}
/* TAYA Hebrew fixes: breadcrumbs + airport stat */
body.custom-hebrew-page .rank-math-breadcrumb {
  text-align: right !important;
  direction: rtl !important;
  padding: 12px 195px 12px 0 !important;
}

@media (max-width: 768px) {
  body.custom-hebrew-page .rank-math-breadcrumb {
    padding: 10px 16px 10px 0 !important;
  }
}

body.custom-hebrew-page .taya .ty-stats .k {
  white-space: nowrap !important;
  flex: 0 0 86px !important;
}
/* ════════════════════════════════════════════════════════════════════
   33 · DESTINATIONS CAROUSEL (.tdc) — RTL / Hebrew card mirror
   ────────────────────────────────────────────────────────────────────
   Complements section 32 (which already flips the quote button + head).
   The .tdc carousel uses NATIVE scroll on both desktop and mobile
   (section 28 forces transform:none), so direction:rtl flips the scroll
   direction everywhere with no JS needed.
   Adds, for body.custom-hebrew-page only:
     • region badge → top-RIGHT
     • corner button + notch → top-LEFT (mirror of section 22)
     • scroll starts from the RIGHT, peek card on the LEFT (desktop + mobile)
   ════════════════════════════════════════════════════════════════════ */

/* ── region badge → top-right ── */
body.custom-hebrew-page .tdc-badge {
  left: auto;
  right: 22px;
}

/* ── corner button + concave notch → top-LEFT (mirror of section 22) ── */
body.custom-hebrew-page .tdc-card::after {
  right: auto;
  left: -2px;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: var(--tdc-notch-r);
}
body.custom-hebrew-page .tdc-fab {
  right: auto;
  left: 0;
}
/* fillet on the card's LEFT edge (below the notch) */
body.custom-hebrew-page .tdc-fab::before {
  right: auto;
  left: -2px;
  background: radial-gradient(
    circle at bottom right,
    transparent var(--tdc-notch-r),
    var(--tdc-bg) 0
  );
}
/* fillet on the card's TOP edge (right of the notch) */
body.custom-hebrew-page .tdc-fab::after {
  right: auto;
  left: calc(var(--tdc-fab-size) + var(--tdc-notch-gap));
  background: radial-gradient(
    circle at bottom right,
    transparent var(--tdc-notch-r),
    var(--tdc-bg) 0
  );
}
/* flip the little open-arrow icon to match the mirrored corner */
body.custom-hebrew-page .tdc-fab-icon {
  transform: scaleX(-1);
}

/* ── scroll starts from the RIGHT, peek card on the LEFT (desktop + mobile) ──
   direction:rtl on the scrolling element (.tdc-viewport) reverses the card
   order and the scroll origin. Native scroll → works at every width. ── */
body.custom-hebrew-page .tdc-viewport {
  direction: rtl;
  scroll-padding-left: 0;
  scroll-padding-right: 24px;
}
/* ════════════════════════════════════════════════════════════════════
   34.1 · HOTELS CAROUSEL (.thc) — RTL / Hebrew final
   ────────────────────────────────────────────────────────────────────
   Keeps the markup at dir="ltr" (so the carousel JS + scroll stay intact)
   and mirrors each card *visually* for Hebrew pages only:
     • quote-button chevron → left, pointing left
     • text block (title / stars / price) → bottom-RIGHT, right-aligned
       (so Hebrew reads from the right edge of the card)
     • corner button + notch → bottom-LEFT
   Scoped to body.custom-hebrew-page — English pages are untouched.
   ════════════════════════════════════════════════════════════════════ */

/* ── quote button: chevron on the left, pointing left ── */
body.custom-hebrew-page .thc-quote {
  flex-direction: row-reverse;
}
body.custom-hebrew-page .thc-quote::after {
  transform: rotate(135deg);
}

/* ── text block → bottom-right, right-aligned ── */
body.custom-hebrew-page .thc-card-body {
  left: auto;
  right: 26px;
  text-align: right;
}
/* stars block + strikethrough price: push to the right edge */
body.custom-hebrew-page .thc-stars {
  margin-left: auto;
  margin-right: 0;
}
body.custom-hebrew-page .thc-card-price s {
  margin-left: 0;
  margin-right: 7px;
}

/* ── corner button + concave notch → bottom-LEFT (mirror of section 21) ── */
body.custom-hebrew-page .thc-card::after {
  right: auto;
  left: 0;
  border-top-left-radius: 0;
  border-top-right-radius: var(--thc-notch-r);
}
body.custom-hebrew-page .thc-fab {
  right: auto;
  left: 0;
}
/* fillet on the card's LEFT edge (top of the notch) */
body.custom-hebrew-page .thc-fab::before {
  right: auto;
  left: 0;
  background: radial-gradient(circle at top right, transparent var(--thc-notch-r), var(--thc-bg) 0);
}
/* fillet on the card's BOTTOM edge (right of the notch) */
body.custom-hebrew-page .thc-fab::after {
  left: auto;
  right: calc(-1 * (var(--thc-notch-gap) + var(--thc-notch-r)));
  background: radial-gradient(circle at top right, transparent var(--thc-notch-r), var(--thc-bg) 0);
}
/* flip the little open-arrow icon to match the mirrored corner */
body.custom-hebrew-page .thc-fab-icon {
  transform: scaleX(-1);
}

/* ── MOBILE: native scroll starts from the RIGHT, peek card on the LEFT ──
   Mobile uses native scroll-snap (section 21). direction:rtl must go on the
   SCROLLING element (.thc-viewport) so the browser starts the scroll at the
   right; the flex track inherits it, laying cards right-to-left, so the first
   card sits on the right and the "peek" card shows on the left. ── */
@media (max-width: 767px) {
  body.custom-hebrew-page .thc-viewport {
    direction: rtl;
    scroll-padding-left: 0;
    scroll-padding-right: 16px;
  }
}

/* ── DESKTOP: mirror the transform-carousel so it reads right-to-left ──
   The hotels DESKTOP carousel is JS-transform driven (not native scroll),
   so direction:rtl won't move it. Instead we mirror the whole viewport
   horizontally and un-mirror each card: cards end up reading right-to-left
   and the arrows advance in the RTL direction, while the JS math stays
   untouched. Card contents stay correct (double flip = identity).
   Mobile is excluded — it keeps its own direction:rtl native scroll above. ── */
@media (min-width: 768px) {
  body.custom-hebrew-page .thc-viewport {
    transform: scaleX(-1);
  }
  body.custom-hebrew-page .thc-card {
    transform: scaleX(-1);
  }
}

/* ──────────────────────────────────────────────────────────────────────────
   34.2 · DESTINATION CAROUSEL · LANGUAGE SWITCH + RTL
   ────────────────────────────────────────────────────────────────────────── */

/* Default: English visible, Hebrew hidden */
.tdc-en {
  display: block !important;
}

.tdc-he {
  display: none !important;
}

/* Hebrew pages: hide English, show Hebrew */
body.custom-hebrew-page .tdc-en,
body.rtl .tdc-en,
html[dir="rtl"] body .tdc-en,
html[lang|="he"] body .tdc-en,
html[lang^="he"] body .tdc-en {
  display: none !important;
}

body.custom-hebrew-page .tdc-he,
body.rtl .tdc-he,
html[dir="rtl"] body .tdc-he,
html[lang|="he"] body .tdc-he,
html[lang^="he"] body .tdc-he {
  display: block !important;
}

/* Hebrew RTL styling */
body.custom-hebrew-page .tdc,
body.rtl .tdc,
html[dir="rtl"] body .tdc,
html[lang|="he"] body .tdc,
html[lang^="he"] body .tdc {
  font-family: inherit !important;
}

body.custom-hebrew-page .tdc-quote,
body.rtl .tdc-quote,
html[dir="rtl"] body .tdc-quote,
html[lang|="he"] body .tdc-quote,
html[lang^="he"] body .tdc-quote {
  flex-direction: row-reverse;
}

body.custom-hebrew-page .tdc-quote::after,
body.rtl .tdc-quote::after,
html[dir="rtl"] body .tdc-quote::after,
html[lang|="he"] body .tdc-quote::after,
html[lang^="he"] body .tdc-quote::after {
  transform: rotate(135deg);
}

body.custom-hebrew-page .tdc-badge,
body.rtl .tdc-badge,
html[dir="rtl"] body .tdc-badge,
html[lang|="he"] body .tdc-badge,
html[lang^="he"] body .tdc-badge {
  left: auto;
  right: 22px;
}

body.custom-hebrew-page .tdc-viewport,
body.rtl .tdc-viewport,
html[dir="rtl"] body .tdc-viewport,
html[lang|="he"] body .tdc-viewport,
html[lang^="he"] body .tdc-viewport {
  direction: rtl;
  scroll-padding-left: 0;
  scroll-padding-right: 24px;
}
/* ──────────────────────────────────────────────────────────────────────────
   34.3 · FULL CAROUSEL SECTION · LANGUAGE VISIBILITY
   ────────────────────────────────────────────────────────────────────────── */
.tdc-sec-he {
  display: none !important;
} /* עברית מוסתרת כברירת מחדל (עמודים אנגליים) */
body.custom-hebrew-page .tdc-sec-en {
  display: none !important;
} /* בעמוד עברי — מסתיר את הסקשן האנגלי */
body.custom-hebrew-page .tdc-sec-he {
  display: flex !important;
} /* ומראה את הסקשן העברי */

/* ──────────────────────────────────────────────────────────────────────────
   34.4 · HOTEL TIMELINE WIDGET · LANGUAGE + RTL
   ────────────────────────────────────────────────────────────────────────── */
.htw-sec-he {
  display: none !important;
}
body.custom-hebrew-page .htw-sec-en {
  display: none !important;
}
body.custom-hebrew-page .htw-sec-he {
  display: flex !important;
}
/* הגנה על ווידג'ט htw מהחוקים הגלובליים של האתר */
.htw-en h3.htw-title,
.htw-he h3.htw-title {
  font-size: 23px !important;
  line-height: 1.2 !important;
  font-weight: 800 !important;
  min-height: 56px !important;
  margin-bottom: 12px !important;
  padding-bottom: 0 !important;
  text-align: center !important;
}
/* תיקון פס טווח התאריכים בלוח השנה — גרסה עברית */
body.custom-hebrew-page .htw-he .htw-day.htw-bstart::before {
  left: 0 !important;
  right: auto !important;
}
body.custom-hebrew-page .htw-he .htw-day.htw-bend::before {
  right: 0 !important;
  left: auto !important;
}

/* ════════════════════════════════════════════════════════════
   34.5 · HERO — החלפת שפה לפי שפת העמוד
   container אנגלי → taya-hero-en · container עברי → taya-hero-he
   ════════════════════════════════════════════════════════════ */
body:not(.custom-hebrew-page) .taya-hero-he {
  display: none !important;
} /* עמוד אנגלי → מסתיר עברית */
body.custom-hebrew-page .taya-hero-en {
  display: none !important;
} /* עמוד עברי → מסתיר אנגלית */

.taya-hero-en,
.taya-hero-he {
  width: 100% !important;
  max-width: 100% !important;
  flex: 1 1 100% !important;
  align-self: stretch !important;
}
.taya-hero-en > .e-con-inner,
.taya-hero-he > .e-con-inner {
  width: 100% !important;
  max-width: 100% !important;
}

/* ════════════════════════════════════════════════════════════════════
   35 · FORM FIXES — mobile zoom · date-button emphasis · calendar overflow
   הדבק בסוף קובץ ה-CSS של האתר.
   ════════════════════════════════════════════════════════════════════ */

/* ── FIX 1 · מונע זום-אין באייפון ──────────────────────────────────
   iOS מזמזם על focus בכל שדה שהפונט שלו < 16px. מעלים ל-16px במובייל
   (בדסקטופ נשאר 14px כמו במקור). מכסה גם את שדה היעד וגם flatpickr. */
@media (max-width: 940px) {
  .taya .ty-row input,
  .taya .ty-form input,
  #ty-dest {
    font-size: 16px !important;
  }
}

/* ── FIX 2 · הדגשה מינימלית לכפתור התאריך עד שבוחרים ──────────────
   שורש הריצוד: הבהוב ה-caret של flatpickr (כשהיומן פתוח) מצייר מחדש אזור
   גדול במובייל, כולל הכפתור שלידו. הפתרון: לבודד את הכפתור לשכבת GPU משלו
   (translateZ) כך שציורים-מחדש חיצוניים לא נוגעים בו. הפעימה = opacity בלבד. */
.taya .ty-date-btn {
  position: relative;
  transform: translateZ(0); /* שכבת GPU נפרדת → אין ריצוד מה-caret */
  backface-visibility: hidden;
}
.taya .ty-date-btn:not(.is-set)::after {
  content: "";
  position: absolute;
  inset: -3px;
  border-radius: 14px;
  border: 2px solid var(--warm);
  opacity: 0;
  pointer-events: none;
  will-change: opacity;
  animation: tyDateGlow 1.8s ease-in-out infinite;
}
@keyframes tyDateGlow {
  0%,
  100% {
    opacity: 0.12;
  }
  50% {
    opacity: 0.85;
  }
}
.taya .ty-date-btn.is-set::after {
  animation: none;
  content: none;
}
@media (prefers-reduced-motion: reduce) {
  .taya .ty-date-btn:not(.is-set)::after {
    animation: none;
    content: none;
  }
}

/* ── FIX 3 · היומן לא יחרוג מהמסגרת במובייל ───────────────────────
   שתי בעיות:
   1. flatpickr מצמיד את היומן לכפתור בפינה + רוחב קבוע → צד אחד נחתך.
   2. שדה ה-flatpickr הנסתר מקבל focus כשפותחים → זום של אייפון (fix 1).
   הפתרון: מצמידים את היומן לשני צידי המסך (12px), ומכריחים את רשת הימים
   למלא את הרוחב שווה בשווה במקום להישאר ברוחב הקבוע של flatpickr. */
@media (max-width: 767px) {
  /* השדה הנסתר חייב 16px גם הוא — אחרת ה-focus מזמזם את העמוד */
  .taya .ty-date-input {
    font-size: 16px !important;
  }

  /* מצמידים את היומן בין שני צידי המסך → ממורכז אוטומטית */
  .flatpickr-calendar {
    left: 12px !important;
    right: 12px !important;
    width: auto !important;
    max-width: none !important;
    transform: none !important;
  }
  /* מקפלים מחדש את רשת הימים כדי שתמלא את הרוחב החדש */
  .flatpickr-calendar .flatpickr-rContainer,
  .flatpickr-calendar .flatpickr-days {
    width: 100% !important;
  }
  .flatpickr-calendar .dayContainer {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  .flatpickr-calendar .flatpickr-day {
    max-width: none !important;
    height: 42px !important;
    line-height: 42px !important;
  }
  /* מסתיר את החץ של היומן — לא רלוונטי אחרי ההצמדה */
  .flatpickr-calendar:before,
  .flatpickr-calendar:after {
    display: none !important;
  }
}

/* ── FIX 4 · בחירת תאריך לא תקפיץ לראש העמוד ──────────────────────
   אחרי הבחירה flatpickr מחזיר focus לשדה הנסתר. השדה היה position:absolute
   בראש ההירו, אז הדפדפן גלל אליו למעלה. position:fixed משאיר אותו תמיד
   בתוך המסך → אין צורך בגלילה → אין קפיצה.
   בנוסף caret-color:transparent מסתיר את הסמן המהבהב שגרם לריצוד באייקון. */
.taya .ty-date-input {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  caret-color: transparent !important;
  color: transparent !important;
}

/* ── FIX 5 · תווית התאריך בעמוד עברי — RTL, לא דחוסה ──────────────
   התאריך הנבחר מוצג בעברית (ראה שינוי ה-JS: locale='he' + פורמט עברי).
   כאן רק מיישרים את התווית ומעבירים את הנקודה לצד ימין. */
body.custom-hebrew-page .taya .ty-date-label {
  direction: rtl;
  text-align: right;
}
body.custom-hebrew-page .taya .ty-date-label::before {
  margin-right: 0;
  margin-left: 7px;
}

/* ════════════════════════════════════════════════════════════════════
   36 · ACCOMMODATIONS  (.tacc)
   ────────────────────────────────────────────────────────────────────
   Hub/directory page for every hotel across all countries & cities.
   Structure: hero → sticky filter bar (country · city · style) →
   city groups (heading + "All hotels in X" button + 3 preview cards).
   Data + rendering live in the footer snippet "Accommodations".
   The HTML widget holds only the shell; the JS fills it.
   Uses the global site tokens from section 01.
   ════════════════════════════════════════════════════════════════════ */
.tacc {
  --tacc-card-h: 380px; /* preview card height */
  --tacc-radius: 24px; /* card corners */
  --tacc-fab-radius: 22px; /* corner button corners */
  --tacc-fab-size: 52px; /* corner button size */
  --tacc-notch-r: 20px; /* concave notch radius */
  --tacc-notch-gap: 12px; /* gap between button and card */
  --tacc-gap: 26px; /* gap between cards */
  --tacc-bg: var(--light); /* section bg = notch gap color */
  --tacc-star: #f7931e; /* rating star color */
  --tacc-nav-h: 80px; /* site navbar height (sticky offset) */
  direction: ltr;
  width: 100%;
  font-family: inherit;
  color: var(--dark);
}
.tacc *,
.tacc *::before,
.tacc *::after {
  box-sizing: border-box;
}

/* language switch — English default, Hebrew on .custom-hebrew-page */
.tacc .tacc-he {
  display: none !important;
}
body.custom-hebrew-page .tacc .tacc-en {
  display: none !important;
}
body.custom-hebrew-page .tacc .tacc-he {
  display: inline !important;
}

/* ── Hero ─────────────────────────────────────────────────────────── */
.tacc-hero {
  position: relative;
  background:
    linear-gradient(rgba(18, 17, 16, 0.72), rgba(18, 17, 16, 0.82)),
    url("https://tayatourism.com/wp-content/uploads/2026/01/beach-1.jpg") center/cover no-repeat;
  padding: clamp(80px, 10vw, 130px) clamp(20px, 6vw, 90px) clamp(60px, 7vw, 90px);
  text-align: center;
}
.tacc-hero-eyebrow {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--warm);
  margin-bottom: 18px;
}
.tacc-hero-title {
  margin: 0 0 16px;
  font-size: clamp(34px, 5vw, 60px);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.03em;
  color: var(--light);
}
.tacc-hero-sub {
  margin: 0 auto;
  max-width: 560px;
  font-size: clamp(15px, 1.4vw, 18px);
  line-height: 1.7;
  color: rgba(248, 248, 247, 0.72);
}

/* hero destination search */
.tacc-hero-search {
  display: flex;
  gap: 10px;
  justify-content: center;
  align-items: stretch;
  flex-wrap: wrap;
  margin: 30px auto 0;
  max-width: 560px;
}
.tacc-hero-field {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1 1 260px;
  min-width: 240px;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(248, 248, 247, 0.28);
  border-radius: 100px;
  padding: 0 6px 0 18px;
}
.tacc-hero-field svg {
  width: 18px;
  height: 18px;
  color: var(--warm);
  flex: 0 0 auto;
}
.tacc-hero-field select {
  appearance: none;
  -webkit-appearance: none;
  background: transparent;
  border: none;
  outline: none;
  color: var(--light);
  font-family: inherit;
  font-size: 15px;
  font-weight: 500;
  padding: 15px 8px;
  width: 100%;
  cursor: pointer;
}
.tacc-hero-field select option,
.tacc-hero-field select optgroup {
  color: #1a1a19;
}
.tacc-hero-btn {
  flex: 0 0 auto;
  background: var(--accent);
  color: var(--light);
  border: none;
  border-radius: 100px;
  padding: 15px 36px;
  font-family: inherit;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  transition:
    transform 0.18s,
    filter 0.18s;
}
.tacc-hero-btn:hover {
  transform: translateY(-1px);
  filter: brightness(1.1);
}

/* block-level language toggle for the select fields (overrides the inline switch) */
.tacc .tacc-hero-field.tacc-he {
  display: none !important;
}
body.custom-hebrew-page .tacc .tacc-hero-field.tacc-en {
  display: none !important;
}
body.custom-hebrew-page .tacc .tacc-hero-field.tacc-he {
  display: flex !important;
}

/* ── Sticky filter bar ────────────────────────────────────────────── */
.tacc-filter {
  position: sticky;
  top: var(--tacc-nav-h);
  z-index: 60;
  background: rgba(248, 248, 247, 0.9);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
  backdrop-filter: blur(16px) saturate(140%);
  border-bottom: 1px solid rgba(26, 26, 25, 0.1);
  padding: 16px clamp(16px, 5vw, 90px);
}
.tacc-filter-inner {
  max-width: 1280px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.tacc-frow {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.tacc-frow-label {
  flex: 0 0 auto;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--gray);
  width: 62px;
}
.tacc-cities-row.is-hidden {
  display: none;
}

/* country tabs */
.tacc-tab {
  appearance: none;
  border: 1px solid rgba(26, 26, 25, 0.16);
  background: transparent;
  border-radius: 100px;
  padding: 9px 18px;
  cursor: pointer;
  font-family: inherit;
  font-size: 14px;
  font-weight: 700;
  color: var(--dark);
  transition:
    background 0.16s,
    color 0.16s,
    border-color 0.16s;
  white-space: nowrap;
}
.tacc-tab:hover {
  background: rgba(26, 26, 25, 0.05);
}
.tacc-tab.is-active {
  background: var(--dark);
  color: var(--light);
  border-color: var(--dark);
}

/* city + style chips */
.tacc-chip {
  appearance: none;
  border: 1px solid rgba(26, 26, 25, 0.14);
  background: transparent;
  border-radius: 100px;
  padding: 6px 14px;
  cursor: pointer;
  font-family: inherit;
  font-size: 13px;
  font-weight: 500;
  color: var(--dark);
  transition:
    background 0.16s,
    color 0.16s,
    border-color 0.16s;
  white-space: nowrap;
}
.tacc-chip:hover {
  background: rgba(26, 26, 25, 0.05);
}
.tacc-chip.is-active {
  background: var(--accent);
  color: var(--light);
  border-color: var(--accent);
}
.tacc-styles-row .tacc-chip.is-active {
  background: var(--accent);
  color: var(--light);
  border-color: var(--accent);
}

/* ── Results ──────────────────────────────────────────────────────── */
.tacc-results {
  max-width: 1280px;
  margin: 0 auto;
  padding: clamp(40px, 6vw, 72px) clamp(16px, 5vw, 40px) 100px;
}
.tacc-group {
  margin-bottom: 56px;
}
.tacc-group.is-hidden {
  display: none;
}
.tacc-group-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 22px;
}
.tacc-group-titles {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.tacc-group-region {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--gray);
}
.tacc-group-title {
  margin: 0;
  font-size: clamp(24px, 3vw, 34px);
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.05;
  color: var(--dark);
}
.tacc-all,
.tacc-all:link,
.tacc-all:visited {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: transparent;
  color: var(--dark) !important;
  border: 1px solid rgba(26, 26, 25, 0.18);
  border-radius: 100px;
  padding: 11px 20px;
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none !important;
  white-space: nowrap;
  cursor: pointer;
  transition:
    background 0.16s,
    border-color 0.16s,
    transform 0.16s;
}
.tacc-all:hover {
  background: var(--dark);
  color: var(--light) !important;
  border-color: var(--dark);
  transform: translateY(-1px);
}
.tacc-all::after {
  content: "";
  width: 7px;
  height: 7px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(-45deg);
}

.tacc-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--tacc-gap);
}

/* ── Card (matches .thc-card look) ────────────────────────────────── */
.tacc-card {
  position: relative;
  height: var(--tacc-card-h);
  border-radius: var(--tacc-radius);
  overflow: hidden;
  color: var(--light);
  isolation: isolate;
  background: #3a3f45;
}
.tacc-card.is-hidden {
  display: none;
}
.tacc-card-img {
  position: absolute;
  inset: 0;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover !important;
  object-position: center !important;
  z-index: 0;
}
.tacc-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    180deg,
    rgba(20, 22, 26, 0.12) 0%,
    rgba(20, 22, 26, 0.3) 45%,
    rgba(20, 22, 26, 0.74) 100%
  );
}
.tacc-card-tags {
  position: relative;
  z-index: 2;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: center;
  padding: 20px 16px 0;
}
.tacc-tag {
  background: rgba(255, 255, 255, 0.14);
  border: 1px solid rgba(255, 255, 255, 0.24);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  color: #f2f2f2;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 7px 12px;
  border-radius: 100px;
}
.tacc-card-body {
  position: absolute;
  left: 24px;
  bottom: 26px;
  z-index: 2;
  max-width: calc(100% - 48px);
}
.tacc-card-title {
  font-size: 30px;
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.03;
  margin: 0 0 12px;
  text-transform: none;
  text-shadow: 0 2px 18px rgba(0, 0, 0, 0.35);
}
.tacc-stars {
  height: 18px;
  margin-bottom: 11px;
  background-color: var(--tacc-star);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l2.9 6.26L21 9.27l-4.5 4.14L17.8 21 12 17.27 6.2 21l1.3-7.59L3 9.27l6.1-1.01z'/%3E%3C/svg%3E")
    repeat-x left center;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l2.9 6.26L21 9.27l-4.5 4.14L17.8 21 12 17.27 6.2 21l1.3-7.59L3 9.27l6.1-1.01z'/%3E%3C/svg%3E")
    repeat-x left center;
  -webkit-mask-size: 20px 18px;
  mask-size: 20px 18px;
  filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.3));
}
.tacc-card-price {
  margin: 0;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
}
.tacc-price-now {
  font-size: 22px;
  font-weight: 800;
}
.tacc-card-price s {
  font-size: 15px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.6);
  margin-left: 7px;
}

/* bottom-right notch + corner button (identical mechanism to .thc) */
.tacc-card::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  width: calc(var(--tacc-fab-size) + var(--tacc-notch-gap));
  height: calc(var(--tacc-fab-size) + var(--tacc-notch-gap));
  background: var(--tacc-bg);
  border-top-left-radius: var(--tacc-notch-r);
  z-index: 3;
}
.tacc-fab {
  position: absolute;
  right: 0;
  bottom: 0;
  width: var(--tacc-fab-size);
  height: var(--tacc-fab-size);
  background: var(--dark);
  border-radius: var(--tacc-fab-radius);
  z-index: 5;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition:
    background 0.15s,
    transform 0.15s;
}
.tacc-fab:hover {
  background: #000;
  transform: scale(1.05);
}
.tacc-fab::before,
.tacc-fab::after {
  content: "";
  position: absolute;
  width: var(--tacc-notch-r);
  height: var(--tacc-notch-r);
  z-index: 4;
  background: radial-gradient(
    circle at top left,
    transparent var(--tacc-notch-r),
    var(--tacc-bg) 0
  );
}
.tacc-fab::before {
  top: calc(-1 * (var(--tacc-notch-gap) + var(--tacc-notch-r)));
  right: 0;
}
.tacc-fab::after {
  left: calc(-1 * (var(--tacc-notch-gap) + var(--tacc-notch-r)));
  bottom: 0;
}
.tacc-fab-icon {
  width: 22px;
  height: 22px;
  background-color: #fff;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 6h10v10h-2.2V9.75L7.4 18.05 6 16.6 14.25 8.2H8z'/%3E%3C/svg%3E")
    no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 6h10v10h-2.2V9.75L7.4 18.05 6 16.6 14.25 8.2H8z'/%3E%3C/svg%3E")
    no-repeat center / contain;
}

/* empty state (no results for current filters) */
.tacc-empty {
  display: none;
  text-align: center;
  padding: 60px 20px;
  color: var(--gray);
  font-size: 16px;
}
.tacc-empty.is-shown {
  display: block;
}
.tacc-empty button {
  display: inline-block;
  margin-top: 16px;
  background: var(--dark);
  color: var(--light);
  border: none;
  border-radius: 100px;
  padding: 12px 24px;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
}

/* ── Responsive ───────────────────────────────────────────────────── */
@media (max-width: 1000px) {
  .tacc-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 640px) {
  .tacc-grid {
    grid-template-columns: 1fr;
  }
  .tacc-frow-label {
    width: 100%;
  }
  .tacc-group-head {
    align-items: flex-start;
  }
}

/* ════════════════════════════════════════════════════════════════════
   36.1 · ACCOMMODATIONS — RTL / Hebrew (body.custom-hebrew-page)
   Mirrors the layout for Hebrew pages; card markup stays dir="ltr" so the
   corner button + notch move to the bottom-LEFT (mirror of the LTR card).
   ════════════════════════════════════════════════════════════════════ */
body.custom-hebrew-page .tacc {
  font-family: inherit !important;
}
body.custom-hebrew-page .tacc {
  direction: rtl;
}

/* "All hotels" chevron flips to point the other way */
body.custom-hebrew-page .tacc-all::after {
  transform: rotate(135deg);
}

/* card text block → bottom-right, right-aligned */
body.custom-hebrew-page .tacc-card-body {
  left: auto;
  right: 24px;
  text-align: right;
}
body.custom-hebrew-page .tacc-card-price s {
  margin-left: 0;
  margin-right: 7px;
}

/* corner button + notch → bottom-LEFT */
body.custom-hebrew-page .tacc-card::after {
  right: auto;
  left: 0;
  border-top-left-radius: 0;
  border-top-right-radius: var(--tacc-notch-r);
}
body.custom-hebrew-page .tacc-fab {
  right: auto;
  left: 0;
}
body.custom-hebrew-page .tacc-fab::before {
  right: auto;
  left: 0;
  background: radial-gradient(
    circle at top right,
    transparent var(--tacc-notch-r),
    var(--tacc-bg) 0
  );
}
body.custom-hebrew-page .tacc-fab::after {
  left: auto;
  right: calc(-1 * (var(--tacc-notch-gap) + var(--tacc-notch-r)));
  background: radial-gradient(
    circle at top right,
    transparent var(--tacc-notch-r),
    var(--tacc-bg) 0
  );
}
body.custom-hebrew-page .tacc-fab-icon {
  transform: scaleX(-1);
}

/* ════════════════════════════════════════════════════════════════════
   37 · HOTEL GALLERY CAROUSEL  (.taya-hotel-gallery / .hotel-gallery__*)
   ────────────────────────────────────────────────────────────────────
   Full-bleed image carousel with centered heading, right-aligned nav
   arrows (identical to .thc-arrow, section 21), progress line (site
   divider color/size) and a thumbnail strip.
   Markup lives in the page HTML widget; JS lives in the "Hotel Gallery
   Carousel" footer snippet. Restyle via the --gallery-* tokens.
   ════════════════════════════════════════════════════════════════════ */
.taya-hotel-gallery {
  --gallery-gap: 26px;
  --gallery-radius: 24px;
  --gallery-slide-w: min(52vw, 780px);
  --gallery-slide-h: clamp(300px, 32vw, 440px);
  --gallery-arrow-bg: #efebe4;
  --gallery-arrow-hover: #e4dcce;
  --gallery-arrow-active: #d6cbb6;
}
.taya-hotel-gallery,
.taya-hotel-gallery *,
.taya-hotel-gallery *::before,
.taya-hotel-gallery *::after {
  box-sizing: border-box;
}
.taya-hotel-gallery button {
  font: inherit;
}
.taya-hotel-gallery {
  position: relative;
  left: 50%;
  width: 100vw;
  max-width: 100vw;
  margin-left: -50vw;
  padding: clamp(64px, 7vw, 112px) 0 clamp(72px, 8vw, 124px);
  overflow: hidden;
  background: var(--light, #f8f8f7);
}
.hotel-gallery__top {
  width: min(1320px, calc(100% - 48px));
  margin: 0 auto 38px;
  display: flex;
  flex-direction: column;
  gap: 22px;
}
.hotel-gallery__title-wrap {
  min-width: 0;
  text-align: center;
}
.hotel-gallery__kicker {
  margin: 0 0 8px;
  color: var(--warm, #d6c3a3);
  font-size: 16px;
  font-weight: 500;
  line-height: 1.2;
  text-align: center;
}
.taya-hotel-gallery .hotel-gallery__title {
  margin: 0 !important;
  padding: 0 !important;
  color: var(--dark, #1a1a19) !important;
  font-size: 36px !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  line-height: 1.1 !important;
  text-align: center !important;
  text-transform: none !important;
}
.hotel-gallery__controls {
  direction: ltr;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex: 0 0 auto;
}
.hotel-gallery__counter {
  min-width: 84px;
  color: var(--dark, #1a1a19);
  font-size: 17px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-align: center;
  font-variant-numeric: tabular-nums;
}
/* Arrows — identical to .thc-arrow (site CSS section 21) */
.hotel-gallery__arrow {
  width: 48px;
  height: 48px;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(26, 26, 25, 0.14);
  border-radius: 50%;
  background: var(--gallery-arrow-bg) !important;
  color: var(--dark, #1a1a19) !important;
  cursor: pointer;
  outline: none;
  transition:
    background 180ms ease,
    border-color 180ms ease;
  -webkit-tap-highlight-color: transparent;
}
.hotel-gallery__arrow:hover {
  background: var(--gallery-arrow-hover) !important;
  border-color: rgba(26, 26, 25, 0.3) !important;
}
.hotel-gallery__arrow:active,
.hotel-gallery__arrow:focus,
.hotel-gallery__arrow:focus-visible {
  background: var(--gallery-arrow-active) !important;
  border-color: rgba(26, 26, 25, 0.34) !important;
  color: var(--dark, #1a1a19) !important;
  outline: none !important;
  box-shadow: none !important;
}
.hotel-gallery__arrow::before {
  content: "";
  width: 8px;
  height: 8px;
  border-top: 2px solid var(--dark, #1a1a19);
  border-right: 2px solid var(--dark, #1a1a19);
}
.hotel-gallery__prev::before {
  transform: rotate(-135deg);
  margin-left: 3px;
}
.hotel-gallery__next::before {
  transform: rotate(45deg);
  margin-right: 3px;
}
.hotel-gallery__thumb:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--accent, #00218a) 24%, transparent);
  outline-offset: 3px;
}
.hotel-gallery__viewport {
  width: 100%;
  overflow: hidden;
  touch-action: pan-y;
  cursor: grab;
}
.hotel-gallery__viewport.is-dragging {
  cursor: grabbing;
}
.hotel-gallery__track {
  direction: ltr;
  width: max-content;
  display: flex;
  align-items: stretch;
  gap: var(--gallery-gap);
  visibility: hidden;
  will-change: transform;
  transition: transform 450ms cubic-bezier(0.4, 0, 0.2, 1);
}
.taya-hotel-gallery.is-ready .hotel-gallery__track {
  visibility: visible;
}
.hotel-gallery__viewport.is-dragging .hotel-gallery__track {
  transition: none;
}
.hotel-gallery__slide {
  position: relative;
  flex: 0 0 var(--gallery-slide-w);
  height: var(--gallery-slide-h);
  margin: 0;
  overflow: hidden;
  border-radius: var(--gallery-radius);
  background: color-mix(in srgb, var(--soft, #f0f0ef) 70%, var(--warm, #d6c3a3));
  isolation: isolate;
  opacity: 0.72;
  transform: scale(0.965);
  transition:
    opacity 450ms cubic-bezier(0.4, 0, 0.2, 1),
    transform 450ms cubic-bezier(0.4, 0, 0.2, 1);
}
.hotel-gallery__slide.is-active {
  opacity: 1;
  transform: scale(1);
}
.hotel-gallery__image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center;
  user-select: none;
  -webkit-user-drag: none;
  transition: transform 450ms cubic-bezier(0.4, 0, 0.2, 1);
}
.hotel-gallery__slide.is-active .hotel-gallery__image {
  transform: scale(1.015);
}
.hotel-gallery__footer {
  width: min(1140px, calc(100% - 48px));
  margin: 34px auto 0;
}
.hotel-gallery__progress {
  position: relative;
  width: 100%;
  height: 1px;
  margin-bottom: 28px;
  overflow: hidden;
  background: var(--divider-dark-line);
}
.hotel-gallery__progress-fill {
  position: absolute;
  top: 0;
  left: 0;
  width: calc(100% / 6);
  height: 100%;
  background: var(--warm, #d6c3a3);
  transform-origin: left center;
  transition: width 450ms cubic-bezier(0.4, 0, 0.2, 1);
}
.hotel-gallery__thumbs {
  direction: ltr;
  display: flex;
  justify-content: center;
  gap: 14px;
}
.hotel-gallery__thumb {
  position: relative;
  width: min(138px, 11.5vw);
  aspect-ratio: 1.8 / 1;
  padding: 4px;
  overflow: hidden;
  border: 1px solid transparent;
  border-radius: 13px;
  background: transparent !important;
  opacity: 0.62;
  cursor: pointer;
  transition:
    opacity 180ms ease,
    border-color 180ms ease,
    transform 180ms ease;
  -webkit-tap-highlight-color: transparent;
}
.hotel-gallery__thumb:hover {
  background: transparent !important;
  opacity: 0.86;
  transform: translateY(-2px);
}
.hotel-gallery__thumb:active,
.hotel-gallery__thumb:focus,
.hotel-gallery__thumb:focus-visible {
  background: transparent !important;
  box-shadow: none !important;
}
.hotel-gallery__thumb.is-active {
  border-color: var(--dark, #1a1a19);
  opacity: 1;
}
.hotel-gallery__thumb img {
  width: 100%;
  height: 100%;
  display: block;
  border-radius: 8px;
  object-fit: cover;
  pointer-events: none;
}
.taya-hotel-gallery .sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
@media (max-width: 900px) {
  .taya-hotel-gallery {
    --gallery-gap: 16px;
    --gallery-radius: 18px;
    --gallery-slide-w: 72vw;
    --gallery-slide-h: clamp(280px, 52vw, 380px);
  }
  .hotel-gallery__top {
    width: min(100% - 32px, 720px);
    margin-bottom: 28px;
  }
  .hotel-gallery__kicker {
    font-size: 14px;
  }
  .hotel-gallery__counter {
    min-width: 70px;
    font-size: 14px;
  }
  .hotel-gallery__arrow {
    width: 44px;
    height: 44px;
  }
  .hotel-gallery__footer {
    width: calc(100% - 32px);
    margin-top: 24px;
  }
  .hotel-gallery__thumbs {
    justify-content: flex-start;
    gap: 12px;
    overflow-x: auto;
    padding: 4px 2px 8px;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
  }
  .hotel-gallery__thumbs::-webkit-scrollbar {
    display: none;
  }
  .hotel-gallery__thumb {
    flex: 0 0 126px;
    width: 126px;
    scroll-snap-align: start;
  }
}
@media (max-width: 620px) {
  .taya-hotel-gallery {
    padding-top: 52px;
  }
  .hotel-gallery__top {
    gap: 18px;
  }
  .hotel-gallery__kicker {
    margin-bottom: 5px;
    font-size: 12px;
  }
  .taya-hotel-gallery .hotel-gallery__title {
    font-size: 30px !important;
  }
  .hotel-gallery__controls {
    justify-content: center;
  }
  .hotel-gallery__arrow {
    width: 40px;
    height: 40px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .hotel-gallery__track,
  .hotel-gallery__slide,
  .hotel-gallery__image,
  .hotel-gallery__progress-fill {
    transition-duration: 1ms !important;
  }
}

/* ════════════════════════════════════════════════════════════════════
   COMPANY & LEGAL PAGES
   Shared design for company, contact and policy pages.
   ════════════════════════════════════════════════════════════════════ */

.taya-info-page,
.taya-info-page * {
  box-sizing: border-box;
}

.taya-info-page {
  width: min(100%, 760px);
  margin: 0 auto;
  padding: 60px 24px 80px;
  color: var(--dark);
  direction: ltr;
  text-align: left;
}

.taya-info-page .taya-info-page__title {
  margin: 0 0 40px !important;
  padding: 0 0 20px !important;
  border-bottom: 1px solid var(--divider-dark-line);
  color: var(--dark) !important;
  font-size: 28px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  letter-spacing: -0.3px !important;
  text-align: left !important;
}

.taya-info-page .taya-info-page__section {
  padding: 28px 0;
  border-bottom: 1px solid var(--divider-dark-line);
}

.taya-info-page .taya-info-page__section:last-child {
  border-bottom: 0;
}

.taya-info-page .taya-info-page__label {
  margin: 0 0 14px !important;
  color: var(--gray) !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
  letter-spacing: 1.4px !important;
  text-transform: uppercase;
}

.taya-info-page .taya-info-page__heading {
  margin: 0 0 12px !important;
  padding: 0 !important;
  color: var(--dark) !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  line-height: 1.5 !important;
  text-align: left !important;
}

.taya-info-page .taya-info-page__text,
.taya-info-page .taya-info-page__text * {
  color: rgba(26, 26, 25, 0.76) !important;
  font-size: 15px !important;
  font-weight: 300 !important;
  line-height: 1.85 !important;
  text-align: left !important;
}

.taya-info-page .taya-info-page__text + .taya-info-page__text {
  margin-top: 12px !important;
}

.taya-info-page .taya-info-page__list {
  margin: 14px 0 0;
  padding: 0 0 0 18px;
  list-style: none;
}

.taya-info-page .taya-info-page__list li {
  position: relative;
  padding: 6px 0;
  border-bottom: 1px solid rgba(26, 26, 25, 0.06);
  color: rgba(26, 26, 25, 0.76) !important;
  font-size: 15px !important;
  font-weight: 300 !important;
  line-height: 1.85 !important;
}

.taya-info-page .taya-info-page__list li:last-child {
  border-bottom: 0;
}

.taya-info-page .taya-info-page__list li::before {
  content: "–";
  position: absolute;
  left: -18px;
  color: var(--gray);
}

.taya-info-page .taya-info-page__box {
  margin-top: 20px;
  padding: 22px 24px;
  border: 1px solid var(--divider-dark-line);
}

.taya-info-page .taya-info-page__box p {
  margin: 0 !important;
  color: rgba(26, 26, 25, 0.76) !important;
  font-size: 14px !important;
  font-weight: 300 !important;
  line-height: 1.85 !important;
  text-align: left !important;
}

.taya-info-page strong {
  color: var(--dark) !important;
  font-weight: 500 !important;
}

.taya-info-page a {
  color: var(--dark) !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  border-bottom: 1px solid rgba(26, 26, 25, 0.3);
}

.taya-info-page a:hover,
.taya-info-page a:focus-visible {
  border-color: var(--dark);
}

@media (max-width: 520px) {
  .taya-info-page {
    padding: 40px 16px 60px;
  }

  .taya-info-page .taya-info-page__title {
    font-size: 22px !important;
  }

  .taya-info-page .taya-info-page__box {
    padding: 18px;
  }
}

/* ════════════════════════════════════════════════════════════════════
   38 · BLOG POST  (.tbp)
   ────────────────────────────────────────────────────────────────────
   Single-column editorial blog/guide post, SEO + AEO oriented.
   Markup lives in the page HTML widget (class-only); JSON-LD lives with it.
   Uses the global tokens from section 01 (--light/--dark/--accent/--warm/
   --gray/--soft). Only --read/--wide/--line/--ink are local to .tbp.
   Fonts: Heebo (body/headings) · Cormorant Garamond (serif accents) ·
   IBM Plex Mono (eyebrows/labels/numbers).
   Block map: 01 breadcrumb · 03 header+byline · 04 hero · 05 quick answer
   (.quick-answer-lead = speakable) · 06 key facts · 07 TOC · 08 comparison
   table · 09/16 CTA · 10 body H2 · 11 tip · 12 scenarios · 13 checklist ·
   14 FAQ · 15 related · 16b author box · 16c back link · 17 sources · 18 figcaptions.
   RTL/Hebrew mirror lives in section 39 (below).
   ════════════════════════════════════════════════════════════════════ */

.tbp {
  --read: 740px; /* single content column — everything aligns to this */
  --wide: 740px; /* same width so all blocks share left/right edges */
  --line: #e4dfd6; /* hairline border */
  --ink: #3c3936; /* body text */
  font-family: inherit;
  color: var(--dark);
  background: var(--light);
  -webkit-font-smoothing: antialiased;
  line-height: 1.85;
}
.tbp * {
  box-sizing: border-box;
}
.tbp-read {
  max-width: var(--read);
  margin: 0 auto;
  padding: 0 24px;
}
.tbp-wide {
  max-width: var(--wide);
  margin: 0 auto;
  padding: 0 24px;
}

/* shared motifs */
.tbp-eyebrow {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--gray);
  margin: 0;
}
.tbp-kicker {
  display: block;
  width: 46px;
  height: 3px;
  border-radius: 2px;
  background: var(--warm);
}
.tbp em,
.tbp .serif {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 500;
  color: var(--warm);
}

/* 01 breadcrumb */
.tbp-crumb {
  max-width: var(--wide);
  margin: 0 auto;
  padding: 20px 24px;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.06em;
  color: #8a857c;
}
.tbp-crumb a {
  color: #8a857c;
  text-decoration: none;
}
.tbp-crumb a:hover {
  color: var(--dark);
}
.tbp-crumb .sep {
  padding: 0 8px;
  color: #c9c4ba;
}

/* 03 header */
.tbp-head {
  max-width: var(--read);
  margin: 0 auto;
  padding: 40px 24px 4px;
  text-align: center;
}
.tbp-head .tbp-eyebrow {
  color: var(--warm);
}
.tbp-h1 {
  font-size: clamp(34px, 5.4vw, 56px);
  font-weight: 900;
  letter-spacing: -0.025em;
  line-height: 1.08;
  margin: 18px 0 16px;
}
.tbp-h1 em {
  font-size: 0.92em;
}
.tbp-byline {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 11px;
  margin: 28px 0 0;
}
.tbp-byline img {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  object-fit: contain;
  padding: 8px;
  background: #fff;
  border: 1px solid var(--line);
  flex: 0 0 38px;
}
.tbp-byline-txt {
  text-align: left;
}
.tbp-byline-name {
  font-size: 14px;
  font-weight: 500;
  color: var(--dark);
  line-height: 1.3;
}
.tbp-byline-name a {
  text-decoration: none;
}
.tbp-byline-name a:hover {
  opacity: 0.75;
}
.tbp-byline-meta {
  font-family: var(--font-mono);
  font-size: 10.5px;
  letter-spacing: 0.02em;
  color: var(--gray);
  margin-top: 4px;
}

/* 04 hero — smaller, centered, capped height
   margin-inline:auto !important overrides the theme's figure{margin:0} reset */
.tbp-hero {
  width: 100%;
  max-width: 740px;
  margin-top: 72px;
  margin-inline: auto !important;
  padding: 0 24px;
}
.tbp-hero img {
  width: 100%;
  height: clamp(230px, 32vw, 360px);
  object-fit: cover;
  object-position: center;
  border-radius: 20px;
  display: block;
  margin: 0 auto;
}

/* body prose */
.tbp-body {
  padding: 60px 24px 90px;
}
.tbp-body p {
  font-size: 18px;
  line-height: 1.95;
  margin: 0 0 22px;
  color: var(--ink);
}
.tbp-body a {
  color: var(--accent);
  text-underline-offset: 3px;
}
.tbp-body figure {
  margin: 0 0 28px;
}
.tbp-body > .tbp-read > img,
.tbp-body figure img {
  width: 100%;
  height: clamp(190px, 26vw, 290px);
  object-fit: cover;
  object-position: center;
  border-radius: 16px;
  display: block;
}

/* numbered question H2 */
.tbp-h2 {
  display: flex;
  align-items: baseline;
  gap: 14px;
  margin: 76px 0 18px;
}
.tbp-h2 .n {
  font-family: var(--font-mono);
  font-size: 13px;
  font-weight: 500;
  color: var(--warm);
  letter-spacing: 0.06em;
  flex: 0 0 auto;
  padding-top: 6px;
}
.tbp-h2 h2 {
  font-size: clamp(24px, 3.4vw, 32px);
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.18;
  margin: 0;
  scroll-margin-top: 90px;
}
.tbp-body h3 {
  font-size: 19px;
  font-weight: 700;
  margin: 28px 0 8px;
}

/* 05 quick answer — warm, editorial (NOT a blue card) */
.tbp-answer {
  max-width: var(--read);
  margin: 0 auto 76px;
  background: rgba(214, 195, 163, 0.1);
  border: 1px solid rgba(214, 195, 163, 0.45);
  border-radius: 20px;
  padding: 30px 34px;
}
.tbp-answer-top {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 16px;
}
.tbp-answer-top .tbp-kicker {
  width: 28px;
}
.tbp-answer-top .tbp-eyebrow {
  color: #9a8253;
}
.quick-answer-lead {
  font-size: 20px;
  line-height: 1.65;
  font-weight: 500;
  margin: 0 0 18px;
  color: var(--dark);
}
.quick-answer-lead em {
  font-size: 1.05em;
}
.tbp-check {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 9px;
}
.tbp-check li {
  position: relative;
  padding-right: 28px;
  font-size: 15.5px;
  line-height: 1.5;
  color: var(--ink);
}
.tbp-check li::before {
  content: "";
  position: absolute;
  right: 0;
  top: 6px;
  width: 14px;
  height: 8px;
  border-left: 2px solid var(--warm);
  border-bottom: 2px solid var(--warm);
  transform: rotate(-45deg);
}

/* 06 key facts — airy, hairline rows (no heavy box) */
.tbp-facts {
  max-width: var(--read);
  margin: 0 auto 76px;
}
.tbp-facts .tbp-eyebrow {
  margin-bottom: 16px;
}
.tbp-facts dl {
  margin: 0;
  border-top: 1px solid var(--line);
}
.tbp-facts .row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 20px;
  padding: 16px 4px;
  border-bottom: 1px solid var(--line);
}
.tbp-facts dt {
  margin: 0;
  font-size: 14px;
  color: var(--gray);
}
.tbp-facts dd {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
  color: var(--dark);
  text-align: right;
}

/* 07 toc — defined pill buttons */
.tbp-toc {
  max-width: var(--read);
  margin: 0 auto 76px;
}
.tbp-toc .tbp-eyebrow {
  margin-bottom: 16px;
}
.tbp-toc ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.tbp-toc a {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-size: 14px;
  font-weight: 500;
  color: var(--dark);
  text-decoration: none;
  padding: 11px 20px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 100px;
  transition:
    border-color 0.18s,
    background 0.18s,
    transform 0.18s;
}
.tbp-toc a::before {
  content: "";
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--warm);
  flex: 0 0 auto;
}
.tbp-toc a:hover {
  border-color: var(--warm);
  background: rgba(214, 195, 163, 0.12);
  transform: translateY(-1px);
}

/* 08 comparison table — matches the site .s-comparison look
   (explicit resets so inherited WordPress/Elementor table styles —
   zebra rows, column borders — can't bleed in) */
.tbp-table-wrap {
  max-width: var(--wide);
  margin: 0 auto 76px;
  padding: 0 24px;
}
.tbp-table {
  border: 1px solid rgba(17, 17, 17, 0.09);
  border-radius: 16px;
  overflow: hidden;
  background: #fff;
}
.tbp-table table {
  width: 100%;
  border-collapse: collapse;
  background: transparent;
}
.tbp-table thead tr {
  background: rgba(17, 17, 17, 0.025);
}
.tbp-table th {
  padding: 15px 18px;
  border: 0;
  border-bottom: 1px solid rgba(17, 17, 17, 0.09);
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #6b6b67;
  text-align: left;
}
.tbp-table td {
  padding: 17px 18px;
  border: 0;
  border-bottom: 1px solid rgba(17, 17, 17, 0.09);
  background: #fff;
  vertical-align: top;
  font-size: 15px;
  line-height: 1.6;
  color: #4a4a47;
}
.tbp-table tbody tr:last-child td {
  border-bottom: 0;
}
.tbp-table td:first-child {
  font-weight: 700;
  color: var(--dark);
}

/* 09 + inline CTA row */
.tbp-cta-row {
  text-align: center;
  margin: 8px 0 76px;
}
.tbp-cta,
.tbp-cta:link,
.tbp-cta:visited {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: var(--dark);
  color: var(--light);
  font-size: 16px;
  font-weight: 700;
  padding: 16px 34px;
  border-radius: 100px;
  text-decoration: none;
  transition:
    background 0.18s,
    transform 0.18s;
}
.tbp-cta:hover {
  background: #2a2a2a;
  transform: translateY(-1px);
}
.tbp-cta::after {
  content: "";
  width: 7px;
  height: 7px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(-45deg);
}

/* 11 tip callout — warm, minimal */
.tbp-tip {
  max-width: var(--read);
  margin: 0 auto 76px;
  background: rgba(214, 195, 163, 0.1);
  border-radius: 16px;
  padding: 22px 26px;
}
.tbp-tip .tbp-eyebrow {
  color: #9a8253;
  margin-bottom: 8px;
}
.tbp-tip p {
  margin: 0;
  font-size: 16px;
  line-height: 1.75;
  color: var(--ink);
}

/* 12 scenario cards */
.tbp-scen {
  max-width: var(--wide);
  margin: 0 auto 76px;
  padding: 0 24px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.tbp-scen-card {
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 24px 22px;
  background: #fff;
}
.tbp-scen-card .tbp-eyebrow {
  color: #9a8253;
  margin-bottom: 12px;
}
.tbp-scen-card h3 {
  font-size: 18px;
  font-weight: 800;
  margin: 0 0 10px;
  letter-spacing: -0.01em;
}
.tbp-scen-card p {
  font-size: 14.5px;
  line-height: 1.7;
  color: var(--ink);
  margin: 0;
}
@media (max-width: 720px) {
  .tbp-scen {
    grid-template-columns: 1fr;
  }
}

/* 13 decision checklist */
.tbp-decide {
  max-width: var(--read);
  margin: 0 auto 76px;
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 28px 30px;
  background: #fff;
}
.tbp-decide .tbp-eyebrow {
  margin-bottom: 16px;
}
.tbp-decide ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.tbp-decide li {
  padding: 14px 0;
  border-top: 1px solid var(--line);
  font-size: 15.5px;
  line-height: 1.6;
  color: var(--ink);
}
.tbp-decide li:first-child {
  border-top: none;
  padding-top: 0;
}
.tbp-decide b {
  color: var(--dark);
  font-weight: 700;
}

/* 14 FAQ */
.tbp-faq {
  max-width: var(--read);
  margin: 0 auto 44px;
}
.tbp-faq details {
  border: 1px solid var(--line);
  border-radius: 14px;
  margin: 0 0 10px;
  overflow: hidden;
  background: #fff;
  transition: border-color 0.18s;
}
.tbp-faq details[open] {
  border-color: rgba(214, 195, 163, 0.6);
}
.tbp-faq summary {
  list-style: none;
  cursor: pointer;
  padding: 18px 22px;
  font-size: 16px;
  font-weight: 700;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
}
.tbp-faq summary::-webkit-details-marker {
  display: none;
}
.tbp-faq summary::after {
  content: "";
  flex: 0 0 auto;
  width: 8px;
  height: 8px;
  border-right: 2px solid var(--warm);
  border-bottom: 2px solid var(--warm);
  transform: rotate(45deg);
  transition: transform 0.2s;
}
.tbp-faq details[open] summary::after {
  transform: rotate(-135deg);
}
.tbp-faq details p {
  padding: 0 22px 20px;
  font-size: 15px;
  line-height: 1.85;
  color: var(--ink);
  margin: 0;
}

/* 15 related guides */
.tbp-related {
  max-width: var(--wide);
  margin: 0 auto 44px;
  padding: 0 24px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.tbp-related a {
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 22px;
  text-decoration: none;
  color: var(--dark);
  background: #fff;
  transition:
    border-color 0.18s,
    transform 0.18s,
    box-shadow 0.18s;
}
.tbp-related a:hover {
  border-color: var(--warm);
  transform: translateY(-2px);
  box-shadow: 0 8px 26px rgba(26, 26, 25, 0.06);
}
.tbp-related .tbp-eyebrow {
  margin-bottom: 10px;
}
.tbp-related-title {
  font-size: 16px;
  font-weight: 700;
  letter-spacing: -0.01em;
}
@media (max-width: 720px) {
  .tbp-related {
    grid-template-columns: 1fr;
  }
}

/* 16 final CTA box */
.tbp-ctabox {
  max-width: var(--wide);
  margin: 72px auto 0;
  padding: 0 24px;
}
.tbp-ctabox-inner {
  background: var(--dark);
  border-radius: 22px;
  padding: 48px 32px;
  text-align: center;
}
.tbp-ctabox-inner .tbp-kicker {
  margin: 0 auto 20px;
}
.tbp-ctabox-inner .tbp-eyebrow {
  color: var(--warm);
  margin-bottom: 12px;
}
.tbp-ctabox-inner h3 {
  color: var(--light);
  font-size: clamp(22px, 3vw, 30px);
  font-weight: 800;
  letter-spacing: -0.02em;
  margin: 0 0 10px;
}
.tbp-ctabox-inner h3 em {
  color: var(--warm);
}
.tbp-ctabox-inner p {
  color: rgba(248, 248, 247, 0.7);
  font-size: 16px;
  margin: 0 auto 24px;
  max-width: 440px;
}
.tbp-ctabox-inner .tbp-cta {
  background: var(--light);
  color: var(--dark);
}

/* 18 · figcaptions · author box · back link (E-E-A-T) */
.tbp-hero figcaption,
.tbp-body figure figcaption {
  margin-top: 10px;
  text-align: center;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.03em;
  color: var(--gray);
  line-height: 1.6;
}
.tbp-authorbox {
  width: 100%;
  max-width: var(--read);
  margin: 28px auto 0;
  margin-inline: auto !important;
  display: flex;
  gap: 18px;
  align-items: flex-start;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 24px 26px;
}
.tbp-authorbox img {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  object-fit: contain;
  padding: 9px;
  background: #fff;
  flex: 0 0 60px;
  border: 1px solid var(--line);
}
.tbp-authorbox .tbp-eyebrow {
  margin: 0 0 6px;
}
.tbp-authorbox-name {
  font-size: 17px;
  font-weight: 800;
  letter-spacing: -0.01em;
  margin: 0 0 8px;
}
.tbp-authorbox p {
  font-size: 14.5px;
  line-height: 1.7;
  color: var(--ink);
  margin: 0;
}
.tbp-authorbox a {
  color: var(--accent);
}
@media (max-width: 520px) {
  .tbp-authorbox {
    flex-direction: column;
  }
}
.tbp-back {
  display: block;
  width: 100%;
  max-width: var(--read);
  margin: 28px auto 0;
  margin-inline: auto !important;
  padding: 0 24px;
  text-align: center;
  font-size: 15px;
  font-weight: 500;
  color: var(--dark);
  text-decoration: none;
}
.tbp-back:hover {
  color: var(--accent);
}
.tbp-back span {
  color: var(--warm);
  margin-inline: 6px;
}

/* 17 sources — small, centered
   margin-inline:auto !important overrides the theme's p{margin:0} reset */
.tbp-sources {
  width: 100%;
  max-width: 560px;
  margin-top: 64px;
  margin-inline: auto !important;
  padding: 22px 24px 0;
  border-top: 1px solid var(--line);
  text-align: center;
  font-family: var(--font-mono);
  font-size: 11px;
  line-height: 2;
  letter-spacing: 0.02em;
  color: var(--gray);
}
.tbp-sources a {
  color: var(--accent);
}
.tbp-sources b {
  color: var(--dark);
  font-weight: 500;
}

/* ════════════════════════════════════════════════════════════════════
   39 · BLOG POST (.tbp) — RTL / Hebrew mirror (body.custom-hebrew-page)
   Ploni font + right-alignment for the few blocks section 38 hard-codes
   to the left. Add dir="rtl" on the article for Hebrew posts.
   ════════════════════════════════════════════════════════════════════ */
body.custom-hebrew-page .tbp {
  font-family: inherit !important;
}
body.custom-hebrew-page .tbp {
  direction: rtl;
}
/* left-aligned bits → right */
body.custom-hebrew-page .tbp-byline-txt,
body.custom-hebrew-page .tbp-table th,
body.custom-hebrew-page .tbp-table td {
  text-align: right;
}
/* checklist tick → right edge, pointing the other way */
body.custom-hebrew-page .tbp-check li {
  padding-right: 0;
  padding-left: 28px;
}
body.custom-hebrew-page .tbp-check li::before {
  right: auto;
  left: 0;
}
/* facts value → left; TOC dot already fine */
body.custom-hebrew-page .tbp-facts dd {
  text-align: left;
}
/* CTA + FAQ chevrons flip */
body.custom-hebrew-page .tbp-cta::after,
body.custom-hebrew-page .tbp-faq summary::after {
  transform: rotate(135deg);
}
body.custom-hebrew-page .tbp-faq details[open] summary::after {
  transform: rotate(-45deg);
}

.blog-breadcrumbs {
  padding-top: 100px !important;
}

@media (max-width: 767px) {
  .blog-breadcrumbs {
    font-size: 8px !important;
  }
}

/* ==========================================================================
   40 · COOKIE CONSENT
   ========================================================================== */

#cookieConsent {
  position: fixed;
  bottom: 30px;
  left: 30px;
  max-width: 550px;
  background: #ffffff;
  border-radius: 20px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
  padding: 24px;
  z-index: 9999;
  animation: slideInLeft 0.4s ease-out;
  font-family: inherit;
  border: 2px solid #f5f5f5;
  direction: rtl;
  text-align: right;
}
#cookieConsent.hidden {
  display: none;
}
@keyframes slideInLeft {
  from {
    opacity: 0;
    transform: translateX(-50px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}
.cookie-header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 16px;
}
.cookie-header h3 {
  font-size: 28px;
  font-weight: 700;
  color: #000000;
  margin: 0;
}
.cookie-emoji {
  font-size: 28px;
}
.cookie-text {
  margin-bottom: 28px;
}
.cookie-text p {
  color: #4a4a4a;
  font-size: 16px;
  line-height: 1.6;
  margin: 0 0 20px 0;
}
.cookie-text a {
  color: #000000;
  text-decoration: underline;
  font-weight: 500;
  font-size: 13px;
}
.cookie-text a:hover {
  color: #333333;
}
.cookie-buttons {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
}
.cookie-buttons-right {
  display: flex;
  gap: 12px;
}
.cookie-btn {
  padding: 14px 32px;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  font-size: 15px;
  font-weight: 600;
  transition: all 0.2s;
}
.cookie-btn-allow {
  background: #000000;
  color: #ffffff;
}
.cookie-btn-allow:hover {
  background: #333333;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}
.cookie-btn-deny {
  background: transparent;
  color: #4a4a4a;
  padding: 14px 24px;
  font-weight: 500;
  border: 1px solid #e0e0e0;
}
.cookie-btn-deny:hover {
  color: #000000;
  border-color: #c0c0c0;
  background: #f9f9f9;
}
@media (max-width: 768px) {
  #cookieConsent {
    bottom: 20px;
    left: 20px;
    right: 20px;
    max-width: none;
    padding: 24px;
  }
  .cookie-header h3 {
    font-size: 20px;
  }
  .cookie-text p {
    font-size: 14px;
  }
  .cookie-buttons {
    flex-direction: column-reverse;
    gap: 16px;
  }
  .cookie-buttons-right {
    width: 100%;
    gap: 10px;
  }
  .cookie-btn {
    width: 100%;
    padding: 12px 20px;
    text-align: center;
    font-size: 14px;
  }
}
/* ==========================================================================
   41 · PLONI FONT DEFINITIONS
   ========================================================================== */

@font-face {
  font-family: "Ploni";
  font-style: normal;
  font-weight: 200;
  font-display: swap;
  src: url("https://tayatourism.com/wp-content/uploads/2024/04/PloniULight.ttf") format("truetype");
}

@font-face {
  font-family: "Ploni";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("https://tayatourism.com/wp-content/uploads/2024/04/PloniLight.ttf") format("truetype");
}

@font-face {
  font-family: "Ploni";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("https://tayatourism.com/wp-content/uploads/2024/04/PloniRegular.ttf") format("truetype");
}

@font-face {
  font-family: "Ploni";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("https://tayatourism.com/wp-content/uploads/2024/04/PloniMedium.ttf") format("truetype");
}

@font-face {
  font-family: "Ploni";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("https://tayatourism.com/wp-content/uploads/2024/04/PloniDBold.ttf") format("truetype");
}

@font-face {
  font-family: "Ploni";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("https://tayatourism.com/wp-content/uploads/2024/04/PloniBold.ttf") format("truetype");
}

@font-face {
  font-family: "Ploni";
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("https://tayatourism.com/wp-content/uploads/2024/04/PloniUBold.ttf") format("truetype");
}

@font-face {
  font-family: "Ploni";
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("https://tayatourism.com/wp-content/uploads/2024/04/PloniBlack.ttf") format("truetype");
}

/* ==========================================================================
   42 · HERO TITLE · MOBILE WRAPPING FIX
   ========================================================================== */
@media (max-width: 940px) {
  .taya .ty-copy,
  .taya .ty-title {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .taya .ty-title {
    width: auto !important;
    position: static !important;
    left: auto !important;
    transform: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    text-align: center !important;
  }

  .taya .ty-title .line2 {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    white-space: normal !important;
    text-align: center !important;
  }

  .taya .ty-title .ty-rotate {
    display: inline !important;
    max-width: 100% !important;
    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
  }
}

/* Keep "for" fixed while rotating text changes */
.taya .ty-title .line2 {
  display: flex !important;
  width: fit-content !important;
  margin-left: auto !important;
  margin-right: auto !important;
  align-items: baseline !important;
  justify-content: flex-start !important;
  gap: 0.22em !important;
  white-space: nowrap !important;
}

.taya .ty-title .line2 .ty-rotate {
  display: inline-block !important;
  flex: 0 0 15ch !important;
  width: 15ch !important;
  min-width: 15ch !important;
  text-align: left !important;
  white-space: nowrap !important;
}

/* ==========================================================================
   43 · BLOG POST · FINAL PATCHES
   ========================================================================== */

/* Case-study fixes */ /* טקסט ממורכז ולא מקצה לקצה */ /* שם מעל התאריך, לא זרוק לצד */
.tbp-answer {
  margin-top: 36px;
} /* מרווח מתחת לתמונה */
.tbp-related {
  margin-top: 48px;
} /* מרווח מעל "Read also" */
.tbp-crumb {
  padding-top: 10px;
  padding-bottom: 10px;
} /* breadcrumb נמוך יותר */
.tbp-body a {
  color: var(--dark);
} /* בלי לינקים כחולים */

/* ===== TBP blog-post fixes (add once) ===== */

/* בלי כחול — גובר על הכלל הגלובלי body a */
.tbp a {
  color: var(--dark) !important;
}
.tbp a:hover {
  color: var(--warm) !important;
}

/* טקסט הגוף ממורכז ולא מקצה לקצה */
.tbp-body {
  max-width: 740px;
  margin: 0 auto;
}

/* byline + author box: לעצור את דחיסת השם לעמודה צרה */
.tbp-byline {
  flex-direction: column;
  gap: 4px;
}
.tbp-authorbox {
  flex-direction: column;
  gap: 8px;
}

/* מרווחים מוקטנים בין סקשנים */
.tbp-h2 {
  margin-top: 44px;
}
.tbp-answer {
  margin-top: 32px;
}
.tbp-answer,
.tbp-facts,
.tbp-toc {
  margin-bottom: 40px;
}
.tbp-related {
  margin-top: 40px;
}
.tbp-crumb {
  padding-block: 10px;
}

/* Key facts — tiles */
.tbp-facts{ max-width:740px; margin:0 auto 56px; }
.tbp-facts > .tbp-eyebrow{ display:block; margin-bottom:16px; }
.tbp-facts dl{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:12px;
  margin:0;
  border-top:none;
}
.tbp-facts .row{
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:8px;
  padding:18px 17px;
  margin:0;
  background:#fff;
  border:1px solid var(--line);
  border-radius:14px;
}
.tbp-facts dt{
  margin:0;
  font-family: var(--font-mono);
  font-size:10.5px;
  letter-spacing:.13em;
  text-transform:uppercase;
  color:var(--gray);
}
.tbp-facts dd{
  margin:0;
  text-align:left;
  font-size:16.5px;
  font-weight:700;
  line-height:1.35;
  color:var(--dark);
}
@media (max-width:640px){
  .tbp-facts dl{ grid-template-columns:repeat(2, minmax(0,1fr)); }
}
@media (max-width:400px){
  .tbp-facts dl{ grid-template-columns:1fr; }
}

/* ==========================================================================
   44 · GLOBAL TYPOGRAPHY
   One language-aware UI font source. Decorative serif/mono remain opt-in.
   ========================================================================== */
button,
input,
select,
textarea,
option,
label,
.wp-element-button,
.wp-block-button__link,
.elementor-button,
.elementor-field,
.elementor-nav-menu a,
.rank-math-breadcrumb,
.flatpickr-calendar,
.ty-ac,
.taya-faq,
.thc,
.tdc,
.tacc,
.tbp,
.taya,
#cookieConsent {
  font-family: inherit;
}

.elementor-kit-5995 {
  --e-global-typography-5ca3ddd-font-family: "Heebo";
}


/* Cookie banner is injected in the footer after the main stylesheet. */
#cookieConsent,
#cookieConsent * {
  font-family: inherit !important;
}/* End custom CSS */