/* ==========================================================================
   Lanka Trip Guide — Design System
   Modeled on the Indie Campers design language (indiecampers.com):
   bold orange CTAs, indigo secondary, near-black ink, Figtree type,
   rounded cards + pill buttons, clean white space, energetic feel.
   Tokens are CSS custom properties so they can be reused inside Elementor
   "Custom CSS" fields too (e.g. color: var(--ic-orange)).
   ========================================================================== */

/* Self-hosted Figtree (variable, weights 300-900) — replaces the render-blocking
   Google Fonts request for better LCP. font-display:swap avoids invisible text. */
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-weight: 300 900;
  font-display: swap;
  src: url('../fonts/figtree-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-weight: 300 900;
  font-display: swap;
  src: url('../fonts/figtree-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
  /* ---- Brand: primary (energy / CTA) ---- */
  --ic-orange:      #FF5900;
  --ic-orange-600:  #E04F00;
  --ic-orange-700:  #C24500;
  --ic-orange-soft: #FFE9DD;

  /* ---- Brand: secondary (indigo) ---- */
  --ic-indigo:      #5642CD;
  --ic-indigo-400:  #8A75FF;
  --ic-indigo-soft: #ECE9FB;

  /* ---- Ink / dark ---- */
  --ic-ink:         #140E34;   /* headings, dark sections (near-black navy) */
  --ic-ink-800:     #221A4A;

  /* ---- Support ---- */
  --ic-green:       #008C60;   /* success / "available" */
  --ic-red:         #DC3545;
  --ic-star:        #FF5900;

  /* ---- Neutrals ---- */
  --ic-white:       #FFFFFF;
  --ic-bg:          #F7F7F8;   /* light section background */
  --ic-bg-2:        #F2F2F2;
  --ic-line:        #E6E6E6;   /* hairline border */
  --ic-line-2:      #D9D9D9;
  --ic-mute-3:      #BFBFBF;
  --ic-text-soft:   #737373;
  --ic-text:        #595959;   /* body text */
  --ic-text-strong: #2B2B2B;

  /* ---- Typography ---- */
  --ic-font: "Figtree", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;

  /* Fluid type scale */
  --fs-display: clamp(2.75rem, 1.6rem + 4.6vw, 4.75rem);
  --fs-h1:      clamp(2.2rem, 1.5rem + 2.8vw, 3.4rem);
  --fs-h2:      clamp(1.8rem, 1.3rem + 2vw, 2.7rem);
  --fs-h3:      clamp(1.4rem, 1.15rem + 1vw, 1.85rem);
  --fs-h4:      clamp(1.15rem, 1.05rem + 0.45vw, 1.4rem);
  --fs-lead:    clamp(1.05rem, 1rem + 0.45vw, 1.3rem);
  --fs-body:    1.0625rem;
  --fs-small:   0.875rem;

  /* ---- Spacing (8pt) ---- */
  --sp-1: 0.5rem;  --sp-2: 1rem;   --sp-3: 1.5rem;  --sp-4: 2rem;
  --sp-5: 3rem;    --sp-6: 4rem;   --sp-7: 6rem;    --sp-8: 8rem;

  /* ---- Radii (Indie uses 5 / 8 / 10 / 20, pill 50) ---- */
  --r-sm: 5px;  --r-md: 8px;  --r-lg: 10px;  --r-xl: 20px;  --r-pill: 50px;

  /* ---- Elevation (soft, modern) ---- */
  --shadow-sm: 0 1px 3px rgba(20,14,52,.06), 0 1px 2px rgba(20,14,52,.04);
  --shadow-md: 0 8px 24px rgba(20,14,52,.10);
  --shadow-lg: 0 20px 50px rgba(20,14,52,.16);

  /* ---- Layout ---- */
  --container: 1240px;
  --container-narrow: 880px;
  --ease: cubic-bezier(.22,.61,.36,1);
}

/* ==========================================================================
   Base
   ========================================================================== */
body {
  font-family: var(--ic-font);
  color: var(--ic-text);
  font-size: var(--fs-body);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6,
.elementor-heading-title {
  font-family: var(--ic-font);
  color: var(--ic-ink);
  line-height: 1.08;
  letter-spacing: -0.02em;
  font-weight: 700;
}
h1, .elementor-heading-title.elementor-size-xxl { font-weight: 800; }

a { color: var(--ic-indigo); transition: color .2s var(--ease); }
a:hover { color: var(--ic-orange); }

::selection { background: var(--ic-orange); color: #fff; }
html { scroll-behavior: smooth; }

:where(a, button, input, select, textarea):focus-visible {
  outline: 3px solid var(--ic-indigo-400);
  outline-offset: 2px;
  border-radius: 6px;
}

/* ==========================================================================
   Reusable components (use as Elementor CSS Classes or in templates)
   ========================================================================== */

/* Eyebrow / kicker */
.gtm-eyebrow {
  display: inline-block;
  font-weight: 600;
  font-size: var(--fs-small);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ic-orange);
}

/* Pills / badges */
.gtm-pill {
  display: inline-flex; align-items: center; gap: .5em;
  padding: .45em 1em;
  border-radius: var(--r-pill);
  background: var(--ic-bg-2);
  color: var(--ic-ink);
  font-size: var(--fs-small);
  font-weight: 600;
}
.gtm-pill--orange { background: var(--ic-orange-soft); color: var(--ic-orange-700); }
.gtm-pill--indigo { background: var(--ic-indigo-soft); color: var(--ic-indigo); }
.gtm-pill--green  { background: #E2F4EC; color: var(--ic-green); }

/* Buttons */
.gtm-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .6em;
  padding: .95em 1.8em;
  border-radius: var(--r-pill);
  font-family: var(--ic-font);
  font-weight: 700;
  font-size: 1rem;
  line-height: 1;
  text-decoration: none;
  border: 2px solid transparent;
  cursor: pointer;
  transition: transform .18s var(--ease), box-shadow .18s var(--ease),
              background-color .18s var(--ease), color .18s var(--ease);
}
.gtm-btn:hover { transform: translateY(-2px); }
/* Filled buttons keep white text even though the theme colours links orange
   (without !important the link colour would render orange-on-orange). */
.gtm-btn--primary { background: var(--ic-orange); color: #fff !important; box-shadow: 0 6px 18px rgba(255,89,0,.28); }
.gtm-btn--primary:hover { background: var(--ic-orange-600); color: #fff !important; box-shadow: 0 10px 26px rgba(255,89,0,.34); }
.gtm-btn--indigo  { background: var(--ic-indigo); color: #fff !important; }
.gtm-btn--indigo:hover { background: #4836b0; color: #fff !important; }
.gtm-btn--dark    { background: var(--ic-ink); color: #fff !important; }
.gtm-btn--dark:hover { background: var(--ic-ink-800); color: #fff !important; }
.gtm-btn--ghost   { background: #fff; color: var(--ic-ink) !important; border-color: var(--ic-line-2); }
.gtm-btn--ghost:hover { border-color: var(--ic-ink); }
/* Outline button for use on dark/ink backgrounds (white text + translucent border). */
.gtm-btn--on-dark { background: transparent; color: #fff !important; border-color: rgba(255,255,255,.5); }
.gtm-btn--on-dark:hover { background: #fff; color: var(--ic-ink) !important; border-color: #fff; }
.gtm-btn--lg { padding: 1.1em 2.2em; font-size: 1.0625rem; }

/* Card */
.gtm-card {
  background: var(--ic-white);
  border: 1px solid var(--ic-line);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
  transition: transform .25s var(--ease), box-shadow .25s var(--ease);
}
.gtm-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); }

/* Vehicle/product card image keeps a consistent ratio */
.gtm-card__media { aspect-ratio: 16/10; object-fit: cover; width: 100%; display: block; }
.gtm-card__body { padding: var(--sp-3); }

/* Sections */
.gtm-section { padding-block: var(--sp-7); }
.gtm-section--bg   { background: var(--ic-bg); }
.gtm-section--ink  { background: var(--ic-ink); color: #C9C4DE; }
.gtm-section--ink h1, .gtm-section--ink h2, .gtm-section--ink h3 { color: #fff; }
.gtm-container { max-width: var(--container); margin-inline: auto; padding-inline: var(--sp-3); }
.gtm-container--narrow { max-width: var(--container-narrow); }

/* Star rating row */
.gtm-stars { color: var(--ic-star); letter-spacing: 2px; }

/* Search / booking widget shell (Indie-style floating bar) */
.gtm-searchbar {
  background: #fff;
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-md);
  padding: 14px;
  margin: var(--sp-4) auto 0;
  max-width: 1080px;
  text-align: left;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr)) auto;
  gap: 10px;
  align-items: end;
}
.gtm-searchbar--4 { grid-template-columns: 1fr 1.5fr 1fr 1fr auto; }
.gtm-sb-field--dates .gtm-date-range {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236E6E78' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2'/%3E%3Cpath d='M3 10h18M8 2v4M16 2v4'/%3E%3C/svg%3E");
}
.gtm-sb-field { display: flex; flex-direction: column; min-width: 0; }
.gtm-sb-field label {
  font-size: 10.5px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .03em; color: var(--ic-text-soft);
  margin: 0 0 6px; height: 14px; line-height: 14px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.gtm-sb-field select,
.gtm-sb-field input {
  width: 100%; height: 48px; padding: 0 38px 0 14px;
  border: 1px solid var(--ic-line-2); border-radius: var(--r-md);
  font-family: var(--ic-font); font-size: 15px; color: var(--ic-ink);
  background-color: #fff; background-repeat: no-repeat;
  background-position: right 12px center; background-size: 16px;
  appearance: none; -webkit-appearance: none;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer;
}
.gtm-sb-field select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236E6E78' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
}
.gtm-sb-field input.gtm-date,
.gtm-sb-field input[type="date"] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236E6E78' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2'/%3E%3Cpath d='M3 10h18M8 2v4M16 2v4'/%3E%3C/svg%3E");
}
.gtm-sb-field select:focus,
.gtm-sb-field input:focus { border-color: var(--ic-indigo); outline: none; }
.gtm-sb-submit { height: 48px; align-self: end; white-space: nowrap; padding-inline: 1.6em; }
.gtm-sb-note { color: #C9C4DE; font-size: var(--fs-small); margin: 12px 0 0; }
@media (max-width: 980px) {
  .gtm-searchbar { grid-template-columns: 1fr 1fr; }
  .gtm-sb-submit { grid-column: 1 / -1; }
}
@media (max-width: 520px) {
  .gtm-searchbar { grid-template-columns: 1fr; }
}

/* flatpickr — brand the calendar (selected day orange, today indigo) */
.flatpickr-day.selected, .flatpickr-day.selected:hover,
.flatpickr-day.startRange, .flatpickr-day.endRange {
  background: var(--ic-orange); border-color: var(--ic-orange);
}
.flatpickr-day.today { border-color: var(--ic-indigo); }
.flatpickr-months .flatpickr-month, .flatpickr-current-month { color: var(--ic-ink); }

/* Two-button row on the vehicle page */
.gtm-btn-row { display: flex; gap: 12px; margin-top: 10px; flex-wrap: wrap; }
.gtm-btn-row .single_add_to_cart_button { flex: 1 1 0; min-width: 160px; margin: 0 !important; }
.woocommerce div.product form.cart .button.gtm-addcart-btn {
  background: #fff !important; color: var(--ic-ink) !important; border: 2px solid var(--ic-line-2) !important;
}
.woocommerce div.product form.cart .button.gtm-addcart-btn:hover { border-color: var(--ic-ink) !important; background: #fff !important; }
.woocommerce div.product form.cart .button.gtm-proceed-btn { background: var(--ic-orange) !important; color: #fff !important; }
.woocommerce div.product form.cart .button.gtm-proceed-btn:hover { background: var(--ic-orange-600) !important; }

/* Remove PayPal / express smart buttons on the vehicle & cart pages
   (they stay on Checkout, where payment is chosen). */
.single-product .ppc-button-wrapper, .single-product .ppcp-messages, .single-product .ppcp-button-apm,
.single-product .wc-block-components-express-payment, .single-product div[id^="ppc-button"],
.woocommerce-cart .ppc-button-wrapper, .woocommerce-cart .ppcp-messages, .woocommerce-cart .ppcp-button-apm,
.woocommerce-cart .wc-block-components-express-payment, .woocommerce-cart div[id^="ppc-button"],
.woocommerce-cart .wc-block-cart__payment-options,
.woocommerce-cart .wc-block-components-express-payment-continue-rule { display: none !important; }

/* Product booking block: single calendar + time slots */
.gtm-bk { margin: 0 0 18px; }
.gtm-bk-field { display: flex; flex-direction: column; margin-bottom: 12px; }
.gtm-bk-field label { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--ic-text-soft); margin: 0 0 6px; }
.gtm-bk-field select, .gtm-bk-field input {
  width: 100%; height: 50px; padding: 0 40px 0 14px;
  border: 1px solid var(--ic-line-2); border-radius: var(--r-md);
  font-family: var(--ic-font); font-size: 15px; color: var(--ic-ink);
  background-color: #fff; background-repeat: no-repeat; background-position: right 12px center; background-size: 16px;
  appearance: none; -webkit-appearance: none; cursor: pointer;
}
.gtm-bk-field select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236E6E78' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
}
.gtm-bk-field input.gtm-bk-dates {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236E6E78' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2'/%3E%3Cpath d='M3 10h18M8 2v4M16 2v4'/%3E%3C/svg%3E");
}
.gtm-bk-field select:focus, .gtm-bk-field input:focus { border-color: var(--ic-indigo); outline: none; }
.gtm-bk-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }

/* "Please select a time" error on the booking form */
.gtm-time-error {
  display: flex; align-items: center; gap: 8px;
  background: #FCEBEB; color: #A32D2D; border: 1px solid #F09595;
  border-radius: var(--r-md); padding: 10px 14px; margin: 0 0 14px;
  font-weight: 600; font-size: 14px;
}
.gtm-time-invalid { border-color: var(--ic-red) !important; box-shadow: 0 0 0 2px rgba(220,53,69,.15); }

/* "Your trip" banner on the vehicle page (carried-over search) */
.gtm-trip-banner {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px;
  background: var(--ic-indigo-soft); color: var(--ic-ink);
  border: 1px solid #d9d2f7; border-radius: var(--r-md);
  padding: 12px 16px; margin: 0 0 18px; font-size: 14px;
}
.gtm-trip-eyebrow { font-weight: 700; color: var(--ic-indigo); display: inline-flex; align-items: center; gap: 6px; }
.gtm-trip-item strong { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--ic-text-soft); font-weight: 600; }
.gtm-trip-sep { color: var(--ic-indigo); font-weight: 700; }
.gtm-trip-edit { margin-left: auto; font-weight: 700; color: var(--ic-indigo) !important; text-decoration: underline; }

/* ==========================================================================
   Global polish — WooCommerce + Elementor pick up the Indie look sitewide
   ========================================================================== */

/* Primary Woo buttons -> orange pills */
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce #respond input#submit.alt,
.wc-block-components-button,
.woocommerce a.button,
.woocommerce button.button {
  background: var(--ic-orange) !important;
  color: #fff !important;
  border-radius: var(--r-pill) !important;
  font-weight: 700 !important;
  text-transform: none !important;
  padding: .85em 1.6em !important;
  transition: background-color .18s var(--ease), transform .18s var(--ease) !important;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover { background: var(--ic-orange-600) !important; transform: translateY(-1px); }

/* Secondary / outline Woo buttons */
.woocommerce a.button.wc-backward,
.woocommerce a.added_to_cart {
  background: #fff !important;
  color: var(--ic-ink) !important;
  border: 2px solid var(--ic-line-2) !important;
}

/* Prices in brand ink */
.woocommerce ul.products li.product .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price { color: var(--ic-ink); font-weight: 800; }

/* Product cards on shop/category archives -> rounded, hover lift */
.woocommerce ul.products li.product {
  background: #fff;
  border: 1px solid var(--ic-line);
  border-radius: var(--r-lg);
  padding: 0 0 1rem;
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  transition: transform .25s var(--ease), box-shadow .25s var(--ease);
}
.woocommerce ul.products li.product:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); }
/* Uniform, centered image panel: every vehicle shows in full (contain, no
   crop) inside an identical fixed-height white box, so all cards align. */
.woocommerce ul.products li.product a img,
.woocommerce ul.products li.product img {
  display: block;
  width: 100%;
  height: 240px;
  object-fit: contain;
  object-position: center;
  background: #fff;
  padding: 14px;
  margin: 0 0 1rem;
  border-radius: 0;
  border-bottom: 1px solid var(--ic-line);
}
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product .price,
.woocommerce ul.products li.product .button { padding-inline: 1rem; }
.woocommerce ul.products li.product .woocommerce-loop-product__title { color: var(--ic-ink); font-weight: 700; }

/* Form inputs -> soft rounded */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce .select2-container--default .select2-selection--single,
input[type="text"], input[type="email"], input[type="tel"],
input[type="number"], input[type="date"], select, textarea {
  border-radius: var(--r-md) !important;
  border: 1px solid var(--ic-line-2) !important;
}

/* Hide the redundant Site Title row in the Elementor header — the logo already
   carries the brand. Hiding the whole container removes the leftover white
   strip its padding left behind. (Reversible: delete these rules.) */
.elementor-location-header .e-con:has(.elementor-widget-theme-site-title) { display: none !important; }
.elementor-location-header .elementor-widget-theme-site-title { display: none; }

/* ==========================================================================
   Travel content components (destinations, experience band, stats, quotes)
   ========================================================================== */

/* Destination image cards */
.gtm-dest-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--sp-3); }
.gtm-dest {
  position: relative; display: flex; align-items: end;
  aspect-ratio: 3 / 4; border-radius: var(--r-lg); overflow: hidden;
  text-decoration: none; box-shadow: var(--shadow-sm); isolation: isolate;
}
.gtm-dest::before {
  content: ""; position: absolute; inset: 0; z-index: -2;
  background-image: var(--img); background-size: cover; background-position: center;
  transition: transform .5s var(--ease);
}
.gtm-dest::after {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(to top, rgba(20,14,52,.82) 0%, rgba(20,14,52,.25) 45%, rgba(20,14,52,0) 75%);
}
.gtm-dest:hover::before { transform: scale(1.07); }
.gtm-dest__body { padding: var(--sp-3); color: #fff; }
.gtm-dest__tag { display: inline-block; font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--ic-orange); margin-bottom: 4px; }
.gtm-dest__title { display: block; font-family: var(--ic-font); font-weight: 700; font-size: 1.25rem; line-height: 1.15; color: #fff; }
.gtm-dest__sub { display: block; color: #D7D3E6; font-size: var(--fs-small); margin-top: 4px; }

/* Full-bleed experience band */
.gtm-experience {
  background-size: cover; background-position: center;
  padding-block: clamp(4rem, 9vw, 8rem); padding-inline: var(--sp-3);
}

/* Stats strip */
.gtm-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: var(--sp-3); text-align: center; }
.gtm-stat__num { font-family: var(--ic-font); font-weight: 800; font-size: clamp(2.2rem, 1.6rem + 2vw, 3.2rem); color: var(--ic-ink); line-height: 1; letter-spacing: -.02em; }
.gtm-stat__num span { color: var(--ic-orange); }
.gtm-stat__label { color: var(--ic-text-soft); font-weight: 600; margin-top: 6px; font-size: var(--fs-small); text-transform: uppercase; letter-spacing: .06em; }

/* Testimonial / quote cards */
.gtm-quote { background: #fff; border: 1px solid var(--ic-line); border-radius: var(--r-lg); padding: var(--sp-4); box-shadow: var(--shadow-sm); display: flex; flex-direction: column; }
.gtm-quote__stars { color: var(--ic-orange); letter-spacing: 2px; margin-bottom: var(--sp-2); }
.gtm-quote__text { color: var(--ic-text-strong); font-size: 1.05rem; line-height: 1.6; margin: 0 0 var(--sp-3); }
.gtm-quote__who { display: flex; align-items: center; gap: 12px; margin-top: auto; }
.gtm-quote__avatar { width: 42px; height: 42px; border-radius: 50%; background: var(--ic-indigo-soft); color: var(--ic-indigo); display: flex; align-items: center; justify-content: center; font-weight: 700; }
.gtm-quote__name { font-weight: 700; color: var(--ic-ink); font-size: .95rem; }
.gtm-quote__place { color: var(--ic-text-soft); font-size: var(--fs-small); }

/* Honour reduced motion */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { animation-duration: .001ms !important; transition-duration: .001ms !important; }
}

/* ==========================================================================
   Lanka Trip Guide — SEO content components (answer blocks, guides, FAQ)
   ========================================================================== */
.gtm-answer{
  background: var(--ic-orange-soft);
  border-left: 4px solid var(--ic-orange);
  border-radius: 12px;
  padding: var(--sp-3) var(--sp-3);
  margin: 0 0 var(--sp-4);
  font-size: var(--fs-lead);
  line-height: 1.55;
  color: var(--ic-ink);
}
.gtm-answer p{ margin: 0; }

/* Verified badge */
.ltg-verified{
  display: inline-flex; align-items: center; gap: .5em;
  background: #E9F7F1; color: var(--ic-green);
  border: 1px solid #BfE7D8; border-radius: 999px;
  padding: .35em .9em; font-size: var(--fs-small); font-weight: 700;
  margin-bottom: var(--sp-3);
}
.ltg-verified::before{ content:"✔"; }

/* TL;DR box */
.ltg-tldr{
  background: var(--ic-white); border: 1px solid var(--ic-line);
  border-radius: 14px; padding: var(--sp-3) var(--sp-4);
  box-shadow: var(--shadow-sm); margin: 0 0 var(--sp-4);
}
.ltg-tldr h2{ font-size: var(--fs-h4); margin: 0 0 var(--sp-2); }
.ltg-tldr ul{ margin: 0; padding-left: 1.2em; }
.ltg-tldr li{ margin: .4em 0; color: var(--ic-text-strong); }

/* Table of contents */
.ltg-toc{
  background: var(--ic-bg); border-radius: 14px; padding: var(--sp-3) var(--sp-4);
  margin: 0 0 var(--sp-4);
}
.ltg-toc strong{ display:block; margin-bottom: var(--sp-1); color: var(--ic-ink); }
.ltg-toc ol{ margin: 0; padding-left: 1.3em; columns: 2; }
@media (max-width: 640px){ .ltg-toc ol{ columns: 1; } }
.ltg-toc a{ color: var(--ic-indigo); text-decoration: none; }
.ltg-toc a:hover{ text-decoration: underline; }

/* Comparison / data tables */
.ltg-table-wrap{ overflow-x: auto; margin: 0 0 var(--sp-4); }
.ltg-table{ width: 100%; border-collapse: collapse; font-size: var(--fs-body); min-width: 520px; }
.ltg-table th, .ltg-table td{ text-align: left; padding: .8em 1em; border-bottom: 1px solid var(--ic-line); vertical-align: top; }
.ltg-table thead th{ background: var(--ic-ink); color: #fff; font-weight: 700; }
.ltg-table tbody tr:nth-child(even){ background: var(--ic-bg); }

/* FAQ accordion (native details/summary) */
.ltg-faq{ margin: var(--sp-4) 0; }
.ltg-faq details{ border: 1px solid var(--ic-line); border-radius: 12px; margin-bottom: var(--sp-2); background: #fff; }
.ltg-faq summary{ cursor: pointer; padding: var(--sp-2) var(--sp-3); font-weight: 700; color: var(--ic-ink); list-style: none; position: relative; }
.ltg-faq summary::-webkit-details-marker{ display:none; }
.ltg-faq summary::after{ content:"+"; position:absolute; right: var(--sp-3); font-weight: 800; color: var(--ic-orange); }
.ltg-faq details[open] summary::after{ content:"–"; }
.ltg-faq details > div{ padding: 0 var(--sp-3) var(--sp-3); color: var(--ic-text); }

/* Guide body rhythm */
.gtm-landing__content h2{ font-size: var(--fs-h2); margin: var(--sp-5) 0 var(--sp-2); color: var(--ic-ink); }
.gtm-landing__content h3{ font-size: var(--fs-h3); margin: var(--sp-4) 0 var(--sp-2); color: var(--ic-ink); }
.gtm-landing__content p{ margin: 0 0 var(--sp-2); line-height: 1.7; }
.gtm-landing__content ul, .gtm-landing__content ol{ margin: 0 0 var(--sp-3); padding-left: 1.3em; line-height: 1.7; }

/* Sources / outbound authority list */
.ltg-sources{ font-size: var(--fs-small); color: var(--ic-text-soft); border-top: 1px solid var(--ic-line); margin-top: var(--sp-5); padding-top: var(--sp-3); }
.ltg-sources a{ color: var(--ic-indigo); }