/*
 * GoTaxi public site — design system.
 *
 * One sheet, loaded last on every public page, that everything the visitor
 * sees is styled against. It is written in layers so the cascade is
 * predictable: tokens, then base typography, then primitives (buttons,
 * fields, cards…), then the site chrome (header, footer), then page sections,
 * then the booking wizard, then inner pages, then the Reka islands.
 *
 * Two values come from the install rather than from here: the brand colour
 * (--site-color, declared by layout/theme-vars) and the chosen font
 * (--gt-font-setting, same place). Everything else derives from them.
 *
 * Nothing in here knows about the booking form's JavaScript. The wizard moves
 * fields between steps by id, so ids and names are never used as styling
 * hooks — only classes and data-attributes that the script does not read.
 */

/* ------------------------------------------------------------------ */
/* 1. Tokens                                                            */
/* ------------------------------------------------------------------ */

:root {
    /* Brand */
    --gt-accent: var(--site-color, #ffcd71);
    --gt-accent-ink: #1a1300;               /* text on the accent — the brand is light */
    --gt-accent-deep: #97690f;              /* the accent when it has to be read on white; 4.8:1 */
    --gt-accent-soft: #fff4d6;
    --gt-accent-line: #f3d999;

    /* Ink and neutrals — a cool grey with a touch of the brand's warmth */
    --gt-ink: #0d1117;
    --gt-text: #171c24;
    --gt-text-2: #3a4351;
    --gt-muted: #5f6977;
    --gt-faint: #8a94a3;
    --gt-line: #e4e7ec;
    --gt-line-2: #d3d9e1;
    --gt-bg: #ffffff;
    --gt-bg-2: #f6f7f9;
    --gt-bg-3: #eef1f4;

    /* Dark surfaces (hero, footer) */
    --gt-dark: #0b0d10;
    --gt-dark-2: #14181f;
    --gt-dark-3: #1d232c;
    --gt-dark-line: rgba(255, 255, 255, .1);
    --gt-on-dark: #f4f6f8;
    --gt-on-dark-2: #c3cad3;
    --gt-on-dark-muted: #8f99a6;

    /* Semantic */
    --gt-success: #147b3b;                  /* 4.79:1 on its own soft ground; #15803d read 4.49 */
    --gt-success-soft: #e7f6ec;
    --gt-warning: #b45309;
    --gt-warning-soft: #fdf1e1;
    --gt-danger: #b91c1c;
    --gt-danger-soft: #fdecec;
    --gt-info: #1d4ed8;
    --gt-info-soft: #e8efff;

    /* Type */
    --gt-font: var(--gt-font-setting, "Roboto"), ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --gt-fs-xs: .75rem;
    --gt-fs-sm: .8125rem;
    --gt-fs-md: .9375rem;
    --gt-fs-base: 1rem;
    --gt-fs-lg: 1.125rem;
    --gt-fs-xl: 1.25rem;
    --gt-fs-2xl: 1.5rem;
    --gt-fs-3xl: 1.875rem;
    --gt-fs-4xl: clamp(2rem, 1.5rem + 2vw, 2.75rem);
    --gt-fs-5xl: clamp(2.4rem, 1.6rem + 3.4vw, 4rem);
    --gt-lh-tight: 1.1;
    --gt-lh-snug: 1.25;
    --gt-lh-body: 1.55;

    /* Space (4-based) */
    --gt-s1: 4px;  --gt-s2: 8px;  --gt-s3: 12px; --gt-s4: 16px; --gt-s5: 20px;
    --gt-s6: 24px; --gt-s8: 32px; --gt-s10: 40px; --gt-s12: 48px; --gt-s16: 64px;
    --gt-s20: 80px; --gt-s24: 96px;

    /* Radius */
    --gt-r-xs: 6px;
    --gt-r-sm: 8px;
    --gt-r-md: 12px;
    --gt-r-lg: 16px;
    --gt-r-xl: 24px;
    --gt-r-pill: 999px;

    /* Elevation — hairlines first, shadow only where something floats */
    --gt-sh-1: 0 1px 2px rgba(16, 24, 40, .06);
    --gt-sh-2: 0 6px 20px -6px rgba(16, 24, 40, .14);
    --gt-sh-3: 0 24px 56px -20px rgba(16, 24, 40, .28);
    --gt-focus: 0 0 0 3px rgba(255, 205, 113, .55);

    /* Layout */
    --gt-container: 1200px;
    --gt-container-narrow: 860px;
    --gt-gutter: clamp(16px, 4vw, 32px);
    --gt-header-h: 72px;

    /* Motion */
    --gt-ease: cubic-bezier(.2, .7, .2, 1);
    --gt-t-fast: 120ms;
    --gt-t: 200ms;
    --gt-t-slow: 320ms;
}

/* The brand-derived values (ink, tint, line, deep, focus) are computed in PHP
   by layout/theme-vars, which knows the install's colour and can pick the text
   colour that reads on it. Nothing here may re-derive them. */

/* ------------------------------------------------------------------ */
/* 2. Base                                                              */
/* ------------------------------------------------------------------ */

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body.gt-site {
    margin: 0;
    background: var(--gt-bg);
    color: var(--gt-text);
    font-family: var(--gt-font);
    font-size: var(--gt-fs-base);
    line-height: var(--gt-lh-body);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    overflow-x: clip;
}

.gt-site *, .gt-site *::before, .gt-site *::after { box-sizing: border-box; }

/* :where() so this carries no specificity of its own. As `.gt-site img` it
   out-specified every single-class rule that gives an image a height - the
   logo among them - and `height: auto` won, so the logo rendered at its
   natural size and filled the screen. A base rule must never outrank the
   rules built on top of it. */
.gt-site :where(img, svg, video) { max-width: 100%; height: auto; display: block; }

.gt-site :where(h1, h2, h3, h4, h5, h6) {
    margin: 0;
    color: var(--gt-ink);
    font-weight: 700;
    line-height: var(--gt-lh-snug);
    letter-spacing: -.01em;
    text-wrap: balance;
}
.gt-site :where(p) { margin: 0 0 var(--gt-s4); }
.gt-site :where(p:last-child) { margin-bottom: 0; }
.gt-site :where(a) { color: var(--gt-accent-deep); text-decoration: none; transition: color var(--gt-t-fast) var(--gt-ease); }
.gt-site :where(a:hover) { color: var(--gt-ink); }
.gt-site :where(ul, ol) { margin: 0; padding: 0; }
.gt-site :where(button) { font: inherit; color: inherit; }
.gt-site :where(input, select, textarea) { font: inherit; }
.gt-site :where(hr) { border: 0; border-top: 1px solid var(--gt-line); margin: var(--gt-s6) 0; }

.gt-site :focus-visible { outline: none; box-shadow: var(--gt-focus); border-radius: var(--gt-r-xs); }

/* Type scale */
.gt-h1 { font-size: var(--gt-fs-5xl); line-height: var(--gt-lh-tight); letter-spacing: -.025em; font-weight: 800; }
.gt-h2 { font-size: var(--gt-fs-4xl); letter-spacing: -.02em; font-weight: 800; }
.gt-h3 { font-size: var(--gt-fs-2xl); }
.gt-h4 { font-size: var(--gt-fs-xl); }
.gt-h5 { font-size: var(--gt-fs-lg); }
.gt-lead { font-size: var(--gt-fs-lg); color: var(--gt-text-2); max-width: 62ch; }
.gt-muted { color: var(--gt-muted); }
.gt-small { font-size: var(--gt-fs-sm); }
.gt-eyebrow {
    display: inline-flex; align-items: center; gap: var(--gt-s2);
    font-size: var(--gt-fs-xs); font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
    color: var(--gt-accent-deep);
}
.gt-eyebrow::before { content: ""; width: 20px; height: 2px; background: var(--gt-accent); border-radius: 2px; }
.gt-on-dark .gt-eyebrow { color: var(--gt-accent-on-dark, var(--gt-accent)); }
.gt-on-dark, .gt-on-dark :where(h1, h2, h3, h4, h5, h6) { color: var(--gt-on-dark); }
.gt-on-dark .gt-lead, .gt-on-dark .gt-muted { color: var(--gt-on-dark-2); }

.gt-sr-only {
    position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

/* Layout */
.gt-container { width: 100%; max-width: var(--gt-container); margin-inline: auto; padding-inline: var(--gt-gutter); }
.gt-container--narrow { max-width: var(--gt-container-narrow); }
.gt-section { padding-block: clamp(56px, 8vw, 104px); }
.gt-section--tight { padding-block: clamp(40px, 5vw, 64px); }
.gt-section--alt { background: var(--gt-bg-2); }
.gt-section--dark { background: var(--gt-dark); }
.gt-section-head { max-width: 640px; margin-bottom: clamp(28px, 4vw, 48px); display: grid; gap: var(--gt-s3); }
.gt-section-head--center { margin-inline: auto; text-align: center; justify-items: center; }
.gt-grid { display: grid; gap: var(--gt-s6); }
.gt-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.gt-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.gt-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 991px) { .gt-grid--3, .gt-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 599px) { .gt-grid--2, .gt-grid--3, .gt-grid--4 { grid-template-columns: minmax(0, 1fr); } }
.gt-stack { display: grid; gap: var(--gt-s4); }
.gt-cluster { display: flex; flex-wrap: wrap; gap: var(--gt-s3); align-items: center; }
.gt-scroll-x { overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: thin; }

/* ------------------------------------------------------------------ */
/* 3. Primitives                                                        */
/* ------------------------------------------------------------------ */

/* Buttons */
.gt-btn {
    --_bg: var(--gt-ink); --_fg: #fff; --_bd: var(--gt-ink);
    display: inline-flex; align-items: center; justify-content: center; gap: var(--gt-s2);
    min-height: 46px; padding: 0 var(--gt-s5);
    border: 1px solid var(--_bd); border-radius: var(--gt-r-md);
    background: var(--_bg); color: var(--_fg) !important;
    font-weight: 600; font-size: var(--gt-fs-md); line-height: 1; letter-spacing: .01em;
    white-space: nowrap; cursor: pointer; text-decoration: none !important;
    transition: background var(--gt-t-fast) var(--gt-ease), border-color var(--gt-t-fast) var(--gt-ease), color var(--gt-t-fast) var(--gt-ease), transform var(--gt-t-fast) var(--gt-ease), box-shadow var(--gt-t-fast) var(--gt-ease);
}
.gt-btn:hover { --_bg: var(--gt-dark-3); --_bd: var(--gt-dark-3); }
.gt-btn:active { transform: translateY(1px); }
.gt-btn:disabled, .gt-btn[aria-disabled="true"] { opacity: .5; cursor: not-allowed; transform: none; }
.gt-btn i { font-size: .95em; }
.gt-btn--primary { --_bg: var(--gt-accent); --_fg: var(--gt-accent-ink); --_bd: var(--gt-accent); }
.gt-btn--primary:hover { --_bg: var(--gt-accent-line); --_bd: var(--gt-accent-line); box-shadow: var(--gt-sh-2); }
.gt-btn--outline { --_bg: transparent; --_fg: var(--gt-ink); --_bd: var(--gt-line-2); }
.gt-btn--outline:hover { --_bg: var(--gt-bg-2); --_bd: var(--gt-line-2); }
.gt-btn--ghost { --_bg: transparent; --_fg: var(--gt-text); --_bd: transparent; }
.gt-btn--ghost:hover { --_bg: var(--gt-bg-3); --_bd: transparent; }
.gt-btn--soft { --_bg: var(--gt-accent-soft); --_fg: var(--gt-accent-ink); --_bd: var(--gt-accent-soft); }
.gt-btn--soft:hover { --_bg: var(--gt-accent-line); --_bd: var(--gt-accent-line); }
.gt-on-dark .gt-btn--outline { --_fg: var(--gt-on-dark); --_bd: rgba(255, 255, 255, .28); }
.gt-on-dark .gt-btn--outline:hover { --_bg: rgba(255, 255, 255, .08); }
.gt-on-dark .gt-btn--ghost { --_fg: var(--gt-on-dark); }
.gt-on-dark .gt-btn--ghost:hover { --_bg: rgba(255, 255, 255, .08); }
.gt-btn--sm { min-height: 38px; padding-inline: var(--gt-s4); font-size: var(--gt-fs-sm); border-radius: var(--gt-r-sm); }
.gt-btn--lg { min-height: 54px; padding-inline: var(--gt-s8); font-size: var(--gt-fs-base); border-radius: var(--gt-r-lg); }
.gt-btn--pill { border-radius: var(--gt-r-pill); }
.gt-btn--block { width: 100%; }
.gt-btn--icon { width: 42px; min-height: 42px; padding: 0; border-radius: var(--gt-r-md); }
.gt-btn.is-loading { position: relative; color: transparent !important; pointer-events: none; }
.gt-btn.is-loading::after {
    content: ""; position: absolute; width: 18px; height: 18px; border-radius: 50%;
    border: 2px solid currentColor; border-right-color: transparent; color: var(--_fg);
    animation: gt-spin .7s linear infinite;
}
@keyframes gt-spin { to { transform: rotate(360deg); } }

/* Fields */
.gt-field { display: grid; gap: 6px; min-width: 0; }
.gt-label { font-size: var(--gt-fs-sm); font-weight: 600; color: var(--gt-text-2); }
.gt-label .req { color: var(--gt-danger); }
.gt-hint { font-size: var(--gt-fs-xs); color: var(--gt-muted); }
.gt-control {
    position: relative; display: flex; align-items: center; min-width: 0;
    min-height: 48px; border: 1px solid var(--gt-line-2); border-radius: var(--gt-r-md);
    background: var(--gt-bg); transition: border-color var(--gt-t-fast) var(--gt-ease), box-shadow var(--gt-t-fast) var(--gt-ease);
}
.gt-control:focus-within { border-color: var(--gt-ink); box-shadow: var(--gt-focus); }
.gt-control--invalid, .gt-control:has(.is-invalid), .gt-control:has(.error) { border-color: var(--gt-danger); }
.gt-control--invalid:focus-within { box-shadow: 0 0 0 3px rgba(185, 28, 28, .18); }
.gt-control > .gt-control-icon {
    flex: 0 0 44px; display: inline-flex; align-items: center; justify-content: center;
    color: var(--gt-faint); font-size: 15px; pointer-events: none;
}
.gt-control > .gt-control-icon + .gt-input,
.gt-control > .gt-control-icon + .gt-select,
.gt-control > .gt-control-icon + .gt-textarea,
.gt-control > .gt-control-icon + .gt-control-slot { padding-inline-start: 0; }
.gt-input, .gt-select, .gt-textarea, .gt-control-slot {
    flex: 1 1 auto; min-width: 0; width: 100%; height: 46px; padding: 0 var(--gt-s4);
    border: 0; border-radius: inherit; background: transparent; color: var(--gt-text);
    font-size: var(--gt-fs-md); outline: none; appearance: none; -webkit-appearance: none;
}
.gt-input::placeholder, .gt-textarea::placeholder { color: var(--gt-faint); opacity: 1; }
.gt-textarea { height: auto; min-height: 112px; padding-block: var(--gt-s3); resize: vertical; }
.gt-control:has(.gt-textarea) { align-items: stretch; }
.gt-select {
    padding-inline-end: 40px; cursor: pointer;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%235f6977' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><path d='m6 9 6 6 6-6'/></svg>");
    background-repeat: no-repeat; background-position: right 14px center;
}
[dir="rtl"] .gt-select { background-position: left 14px center; padding-inline-end: var(--gt-s4); padding-inline-start: 40px; }
.gt-control-slot { display: flex; align-items: center; }
.gt-control-action {
    flex: 0 0 auto; align-self: stretch; display: inline-flex; align-items: center; padding: 0 var(--gt-s4);
    border: 0; border-inline-start: 1px solid var(--gt-line); background: var(--gt-bg-2); color: var(--gt-ink);
    font-weight: 600; font-size: var(--gt-fs-sm); border-radius: 0 var(--gt-r-md) var(--gt-r-md) 0; cursor: pointer;
}
[dir="rtl"] .gt-control-action { border-radius: var(--gt-r-md) 0 0 var(--gt-r-md); border-inline-start: 0; border-inline-end: 1px solid var(--gt-line); }
.gt-control-action:hover { background: var(--gt-bg-3); }
.gt-error { display: block; font-size: var(--gt-fs-xs); color: var(--gt-danger); margin-top: 2px; }

/* Checks and radios */
.gt-check { display: inline-flex; align-items: flex-start; gap: var(--gt-s3); cursor: pointer; font-size: var(--gt-fs-md); color: var(--gt-text-2); }
.gt-check input { appearance: none; -webkit-appearance: none; flex: 0 0 auto; width: 20px; height: 20px; margin: 2px 0 0; border: 1.5px solid var(--gt-line-2); border-radius: 6px; background: var(--gt-bg); display: grid; place-content: center; transition: background var(--gt-t-fast), border-color var(--gt-t-fast); cursor: pointer; }
.gt-check input[type="radio"] { border-radius: 50%; }
.gt-check input::before { content: ""; width: 10px; height: 10px; transform: scale(0); transition: transform var(--gt-t-fast) var(--gt-ease); background: var(--gt-accent-ink); clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%); }
.gt-check input[type="radio"]::before { clip-path: none; border-radius: 50%; width: 8px; height: 8px; }
.gt-check input:checked { background: var(--gt-accent); border-color: var(--gt-accent); }
.gt-check input:checked::before { transform: scale(1); }
.gt-check input:focus-visible { box-shadow: var(--gt-focus); }

/* Chips — selectable, used for the service category radios */
.gt-chips { display: flex; flex-wrap: wrap; gap: var(--gt-s2); }
.gt-chip {
    position: relative; display: inline-flex; align-items: center; gap: var(--gt-s2);
    min-height: 40px; padding: 0 var(--gt-s4); margin: 0;
    border: 1px solid var(--gt-line-2); border-radius: var(--gt-r-pill); background: var(--gt-bg);
    color: var(--gt-text-2); font-size: var(--gt-fs-sm); font-weight: 600; letter-spacing: .02em; text-transform: uppercase;
    cursor: pointer; user-select: none; transition: background var(--gt-t-fast), border-color var(--gt-t-fast), color var(--gt-t-fast), box-shadow var(--gt-t-fast);
}
.gt-chip:hover { border-color: var(--gt-ink); color: var(--gt-ink); }
.gt-chip input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; }
.gt-chip:has(input:checked) { background: var(--gt-ink); border-color: var(--gt-ink); color: #fff; }
.gt-chip:has(input:focus-visible) { box-shadow: var(--gt-focus); }
.gt-chip > span { padding: 0 !important; background: transparent !important; color: inherit !important; border: 0 !important; box-shadow: none !important; }
.gt-chip > span::before, .gt-chip > span::after { display: none !important; }

/* Segmented control (one-way / return) */
.gt-segment { display: inline-flex; padding: 4px; border-radius: var(--gt-r-md); background: var(--gt-bg-3); gap: 2px; }
.gt-segment label { position: relative; display: inline-flex; align-items: center; justify-content: center; min-height: 38px; padding: 0 var(--gt-s4); border-radius: var(--gt-r-sm); font-size: var(--gt-fs-sm); font-weight: 600; color: var(--gt-muted); cursor: pointer; margin: 0; transition: background var(--gt-t-fast), color var(--gt-t-fast); }
.gt-segment input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; }
.gt-segment label:has(input:checked) { background: var(--gt-bg); color: var(--gt-ink); box-shadow: var(--gt-sh-1); }

/* Cards */
.gt-card { background: var(--gt-bg); border: 1px solid var(--gt-line); border-radius: var(--gt-r-lg); }
.gt-card--pad { padding: clamp(20px, 3vw, 28px); }
.gt-card--hover { transition: border-color var(--gt-t) var(--gt-ease), transform var(--gt-t) var(--gt-ease), box-shadow var(--gt-t) var(--gt-ease); }
.gt-card--hover:hover { border-color: var(--gt-line-2); transform: translateY(-2px); box-shadow: var(--gt-sh-2); }
.gt-card--dark { background: var(--gt-dark-2); border-color: var(--gt-dark-line); color: var(--gt-on-dark); }

/* Badges */
.gt-badge { display: inline-flex; align-items: center; gap: 6px; min-height: 26px; padding: 0 10px; border-radius: var(--gt-r-pill); background: var(--gt-bg-3); color: var(--gt-text-2); font-size: var(--gt-fs-xs); font-weight: 700; letter-spacing: .02em; white-space: nowrap; }
.gt-badge--accent { background: var(--gt-accent-soft); color: var(--gt-accent-ink); }
.gt-badge--success { background: var(--gt-success-soft); color: var(--gt-success); }
.gt-badge--warning { background: var(--gt-warning-soft); color: var(--gt-warning); }
.gt-badge--danger { background: var(--gt-danger-soft); color: var(--gt-danger); }
.gt-badge--info { background: var(--gt-info-soft); color: var(--gt-info); }
.gt-badge--dark { background: var(--gt-ink); color: #fff; }

/* Alerts */
.gt-alert { display: flex; gap: var(--gt-s3); padding: var(--gt-s4); border: 1px solid var(--gt-line); border-radius: var(--gt-r-md); background: var(--gt-bg-2); color: var(--gt-text-2); font-size: var(--gt-fs-md); }
.gt-alert i { flex: 0 0 auto; margin-top: 2px; }
.gt-alert--success { background: var(--gt-success-soft); border-color: transparent; color: var(--gt-success); }
.gt-alert--warning { background: var(--gt-warning-soft); border-color: transparent; color: var(--gt-warning); }
.gt-alert--danger { background: var(--gt-danger-soft); border-color: transparent; color: var(--gt-danger); }
.gt-alert--info { background: var(--gt-info-soft); border-color: transparent; color: var(--gt-info); }

/* Skeletons and empty states */
.gt-skeleton { position: relative; overflow: hidden; background: var(--gt-bg-3); border-radius: var(--gt-r-sm); color: transparent !important; }
.gt-skeleton::after { content: ""; position: absolute; inset: 0; transform: translateX(-100%); background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .6), transparent); animation: gt-shimmer 1.4s infinite; }
@keyframes gt-shimmer { to { transform: translateX(100%); } }
.gt-empty { display: grid; justify-items: center; gap: var(--gt-s2); padding: var(--gt-s10) var(--gt-s4); text-align: center; color: var(--gt-muted); border: 1px dashed var(--gt-line-2); border-radius: var(--gt-r-lg); }
.gt-empty i { font-size: 28px; color: var(--gt-faint); }

/* Stepper */
.gt-stepper { display: flex; align-items: center; justify-content: center; gap: 0; }
.gt-stepper-step {
    display: inline-flex; align-items: center; gap: 10px; padding: 6px 10px; border: 0; background: none;
    color: var(--gt-muted); font-weight: 600; font-size: var(--gt-fs-sm); cursor: default; white-space: nowrap;
}
.gt-stepper-step::before {
    content: attr(data-step-number); display: inline-grid; place-content: center; width: 28px; height: 28px;
    border-radius: 50%; border: 1.5px solid var(--gt-line-2); background: var(--gt-bg); color: var(--gt-muted);
    font-size: var(--gt-fs-xs); font-weight: 700; transition: background var(--gt-t), border-color var(--gt-t), color var(--gt-t);
}
.gt-stepper-step.active { color: var(--gt-ink); }
.gt-stepper-step.active::before { background: var(--gt-ink); border-color: var(--gt-ink); color: #fff; }
.gt-stepper-step.completed { color: var(--gt-text-2); }
.gt-stepper-step.completed::before { content: "✓"; background: var(--gt-accent); border-color: var(--gt-accent); color: var(--gt-accent-ink); }
.gt-stepper-line { flex: 0 1 56px; min-width: 20px; height: 2px; background: var(--gt-line-2); border-radius: 2px; transition: background var(--gt-t); }
.gt-stepper-line.completed { background: var(--gt-accent); }
@media (max-width: 480px) {
    .gt-stepper-step { font-size: var(--gt-fs-xs); padding-inline: 6px; gap: 6px; }
    .gt-stepper-step::before { width: 24px; height: 24px; }
    .gt-stepper-line { flex-basis: 20px; }
}

/* Store buttons */
.gt-store { display: inline-flex; align-items: center; gap: 10px; min-height: 48px; padding: 0 16px 0 12px; border-radius: var(--gt-r-md); background: var(--gt-ink); color: #fff !important; text-decoration: none !important; border: 1px solid rgba(255,255,255,.08); transition: background var(--gt-t-fast), transform var(--gt-t-fast); }
.gt-store:hover { background: var(--gt-dark-3); transform: translateY(-1px); }
.gt-store i { font-size: 22px; }
.gt-store span { display: grid; line-height: 1.05; }
.gt-store small { font-size: 10px; letter-spacing: .04em; text-transform: uppercase; opacity: .7; }
.gt-store strong { font-size: var(--gt-fs-md); font-weight: 600; }
.gt-on-light .gt-store { background: var(--gt-ink); }

/* Star rating */
.gt-stars { display: inline-flex; gap: 2px; color: #f5b301; font-size: 14px; letter-spacing: 1px; }

/* Tooltips (CSS, for icon buttons the booking script owns) */
.gt-site [data-tooltip] { position: relative; }
.gt-site [data-tooltip]::after {
    content: attr(data-tooltip); position: absolute; left: 50%; bottom: calc(100% + 8px); transform: translate(-50%, 4px);
    padding: 6px 10px; border-radius: var(--gt-r-xs); background: var(--gt-ink); color: #fff; font-size: var(--gt-fs-xs); font-weight: 500;
    white-space: nowrap; opacity: 0; pointer-events: none; transition: opacity var(--gt-t-fast), transform var(--gt-t-fast); z-index: 20;
}
.gt-site [data-tooltip]:hover::after, .gt-site [data-tooltip]:focus-visible::after { opacity: 1; transform: translate(-50%, 0); }

/* bootstrap-select, restyled — the booking script refreshes these, so the
   markup is bootstrap-select's own; only its look changes. */
.gt-site .bootstrap-select { width: 100% !important; }
.gt-site .bootstrap-select > .dropdown-toggle {
    display: flex; align-items: center; width: 100%; min-height: 46px; padding: 0 40px 0 var(--gt-s4) !important;
    border: 0 !important; border-radius: var(--gt-r-md) !important; background: transparent !important; box-shadow: none !important;
    color: var(--gt-text) !important; font-size: var(--gt-fs-md) !important; font-weight: 400; text-transform: none !important;
}
.gt-site .bootstrap-select > .dropdown-toggle::after { position: absolute; right: 16px; top: 50%; transform: translateY(-50%); border: 0; width: 16px; height: 16px; margin: 0; background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%235f6977' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><path d='m6 9 6 6 6-6'/></svg>") no-repeat center; }
[dir="rtl"] .gt-site .bootstrap-select > .dropdown-toggle { padding: 0 var(--gt-s4) 0 40px !important; }
[dir="rtl"] .gt-site .bootstrap-select > .dropdown-toggle::after { right: auto; left: 16px; }
.gt-site .bootstrap-select > .dropdown-toggle:focus { outline: none !important; }
.gt-site .bootstrap-select .filter-option-inner-inner { text-transform: none; }
.gt-site .bootstrap-select .dropdown-menu { padding: 6px; border: 1px solid var(--gt-line); border-radius: var(--gt-r-md); box-shadow: var(--gt-sh-3); margin-top: 6px; }
.gt-site .bootstrap-select .dropdown-menu li a { display: flex; align-items: center; min-height: 40px; padding: 0 12px; border-radius: var(--gt-r-sm); color: var(--gt-text); font-size: var(--gt-fs-md); text-transform: none; }
.gt-site .bootstrap-select .dropdown-menu li a:hover, .gt-site .bootstrap-select .dropdown-menu li a:focus { background: var(--gt-bg-2); color: var(--gt-ink); }
.gt-site .bootstrap-select .dropdown-menu li.selected a, .gt-site .bootstrap-select .dropdown-menu li a.active { background: var(--gt-accent-soft) !important; color: var(--gt-accent-ink) !important; }
.gt-site .bootstrap-select .bs-searchbox .form-control { border: 1px solid var(--gt-line-2); border-radius: var(--gt-r-sm); min-height: 40px; }
.gt-site .bootstrap-select .bs-ok-default::after { border-color: var(--gt-accent-ink); }

/* Legacy .form-control inside the system, for controls the scripts create */
.gt-site .gt-control .form-control { border: 0; background: transparent; box-shadow: none; height: 46px; padding: 0 var(--gt-s4); border-radius: var(--gt-r-md); font-size: var(--gt-fs-md); color: var(--gt-text); }
.gt-site .gt-control .form-control:focus { box-shadow: none; }

/* Motion preference */
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .gt-site *, .gt-site *::before, .gt-site *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* ------------------------------------------------------------------ */
/* 4. Header                                                            */
/* ------------------------------------------------------------------ */

.gt-header { position: sticky; top: 0; z-index: 1000; background: var(--gt-dark); color: var(--gt-on-dark); border-bottom: 1px solid var(--gt-dark-line); }
/* One row, always.

   This wrapped, and once the links and the three actions together were
   wider than the container the actions dropped onto a second line and the
   bar became two rows deep. The nav is the part that gives: it shrinks and
   scrolls rather than pushing anything onto a new line. */
.gt-header-bar { display: flex; flex-wrap: nowrap; align-items: center; gap: var(--gt-s3); min-height: var(--gt-header-h); }
.gt-header-bar > .gt-brand { flex: 0 0 auto; }
.gt-header-bar > .gt-header-actions { flex: 0 0 auto; }
/* The bar gets more room than the rest of the page.

   Everything else sits in a 1200px column, and the header did too - but
   the logo, nine links and three actions need about 1350px together, so
   inside 1200 the links were clipped at both ends. The bar is the one
   place the page runs wider; the content inside it is unchanged. */
.gt-header .gt-header-bar { max-width: 1560px; }
.gt-brand { display: inline-flex; align-items: center; flex: 0 0 auto; margin-inline-end: var(--gt-s2); }
.gt-brand-logo { height: 38px !important; width: auto; max-width: 160px; object-fit: contain; }
.gt-nav { flex: 1 1 auto; min-width: 0; display: flex; justify-content: center; overflow-x: auto; scrollbar-width: none; }
.gt-nav::-webkit-scrollbar { display: none; }
.gt-nav-list { display: flex; align-items: center; gap: 2px; list-style: none; margin: 0; padding: 0; }
.gt-nav-item { position: relative; }
.gt-nav-link {
    display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 12px;
    border-radius: var(--gt-r-sm); color: var(--gt-on-dark-2) !important; font-size: var(--gt-fs-sm); font-weight: 600; letter-spacing: .01em;
    white-space: nowrap; text-decoration: none !important; background: transparent; border: 0; cursor: pointer;
    transition: color var(--gt-t-fast), background var(--gt-t-fast);
}
.gt-nav .gt-nav-link:hover, .gt-nav .gt-nav-item.is-current > .gt-nav-link, .gt-nav .gt-nav-link.is-current { color: #fff !important; background: rgba(255, 255, 255, .07); }
.gt-nav .gt-nav-item.is-current > .gt-nav-link::after { content: ""; position: absolute; left: 12px; right: 12px; bottom: -1px; height: 2px; background: var(--gt-accent); border-radius: 2px; }
.gt-nav .gt-nav-item--driver > .gt-nav-link { color: var(--gt-accent) !important; }
/* The plain nested list — a hover menu until the island replaces it */
.gt-nav-sub { position: absolute; top: 100%; inset-inline-start: 0; min-width: 240px; margin: 6px 0 0; padding: 8px; list-style: none; background: var(--gt-bg); border: 1px solid var(--gt-line); border-radius: var(--gt-r-md); box-shadow: var(--gt-sh-3); opacity: 0; visibility: hidden; transform: translateY(6px); transition: opacity var(--gt-t-fast), transform var(--gt-t-fast), visibility var(--gt-t-fast); z-index: 30; }
.gt-nav-item--sub:hover > .gt-nav-sub, .gt-nav-item--sub:focus-within > .gt-nav-sub { opacity: 1; visibility: visible; transform: none; }
.gt-nav-sub li a { display: block; padding: 8px 12px; border-radius: var(--gt-r-sm); color: var(--gt-text); font-size: var(--gt-fs-sm); white-space: nowrap; }
.gt-nav-sub li a:hover { background: var(--gt-bg-2); color: var(--gt-ink); }
.gt-nav-sub .dt-sub-head { padding: 10px 12px 4px; font-size: var(--gt-fs-xs); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--gt-faint); }
.gt-header-actions { display: flex; align-items: center; gap: var(--gt-s2); flex: 0 0 auto; margin-inline-start: auto; }
.gt-header-link { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 12px; border-radius: var(--gt-r-sm); color: var(--gt-on-dark-2) !important; font-size: var(--gt-fs-sm); font-weight: 600; white-space: nowrap; }
.gt-header-link:hover { color: #fff !important; background: rgba(255, 255, 255, .07); }
.gt-header-phone { min-height: 42px; padding-inline: 14px 18px; gap: 10px; }
.gt-header-phone-tag { display: none; }
.gt-lang-native { min-height: 40px; padding: 0 30px 0 10px; border: 1px solid var(--gt-dark-line); border-radius: var(--gt-r-sm); background: transparent; color: var(--gt-on-dark-2); font-size: var(--gt-fs-sm); }
.gt-lang-native option { color: var(--gt-text); }
.gt-header-burger { display: none; }
.gt-burger { display: inline-grid; place-content: center; width: 44px; height: 44px; border: 1px solid var(--gt-dark-line); border-radius: var(--gt-r-md); background: transparent; color: var(--gt-on-dark); cursor: pointer; }
.gt-burger-bar, .gt-burger-bar::before, .gt-burger-bar::after { display: block; width: 18px; height: 2px; background: currentColor; border-radius: 2px; position: relative; }
.gt-burger-bar::before, .gt-burger-bar::after { content: ""; position: absolute; left: 0; }
.gt-burger-bar::before { top: -6px; } .gt-burger-bar::after { top: 6px; }
.gt-header.is-open .gt-nav { display: block; flex-basis: 100%; padding: 8px var(--gt-gutter) 16px; border-top: 1px solid var(--gt-dark-line); }
.gt-header.is-open .gt-nav-list { flex-direction: column; align-items: stretch; }
.gt-header.is-open .gt-nav-link { min-height: 46px; }
.gt-header.is-open .gt-nav-sub { position: static; opacity: 1; visibility: visible; transform: none; background: transparent; border: 0; box-shadow: none; padding: 0 0 0 12px; }
.gt-header.is-open .gt-nav-sub li a { color: var(--gt-on-dark-2); }

/* Ticker */
.gt-ticker { overflow: hidden; background: var(--gt-accent); color: var(--gt-accent-ink); font-size: var(--gt-fs-sm); font-weight: 600; }
.gt-ticker-track { display: flex; gap: 64px; width: max-content; padding: 6px 0; animation: gt-ticker 28s linear infinite; }
.gt-ticker-track span { white-space: nowrap; padding-inline-start: 64px; }
@keyframes gt-ticker { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .gt-ticker-track { animation: none; } .gt-ticker-track span:last-child { display: none; } }

@media (max-width: 1439px) {
    .gt-nav-link { padding-inline: 9px; font-size: var(--gt-fs-xs); }
    .gt-header-link--auth span { display: none; }
    .gt-header-link--auth { padding-inline: 10px; }
    .gt-lang-value { display: none; }
    .gt-lang { padding-inline: 10px 8px; }
    .gt-header-phone-number { font-size: var(--gt-fs-sm); }
}
/* The burger takes over here, not at 1023.

   The full bar needs about 1150px for the logo, the links and the three
   actions. Between 1024 and 1150 the links were still shown and the row
   scrolled sideways, hiding the first and last of them; a menu that hides
   half its links is worse than a burger. */
@media (max-width: 1149px) {
    .gt-nav { display: none; }
    .gt-header-burger { display: block; }
    .gt-header-link--auth { display: none; }
    .gt-lang-host { display: none; }
    .gt-header-phone-number { display: none; }
    .gt-header-phone { width: 42px; padding: 0; justify-content: center; }
    .gt-header-bar { min-height: 64px; }
    .gt-brand-logo { height: 32px !important; }
}

/* Reka: services menu */
.gt-navmenu { position: relative; }
.gt-navmenu-list { display: flex; list-style: none; margin: 0; padding: 0; }
.gt-navmenu-trigger[data-state="open"] { color: #fff !important; background: rgba(255, 255, 255, .07); }
.gt-navmenu-caret { transition: transform var(--gt-t-fast); }
.gt-navmenu-trigger[data-state="open"] .gt-navmenu-caret { transform: rotate(180deg); }
.gt-navmenu-viewport-wrap { position: absolute; top: 100%; inset-inline-start: 0; padding-top: 8px; z-index: 40; }
.gt-navmenu-viewport { width: var(--reka-navigation-menu-viewport-width); height: var(--reka-navigation-menu-viewport-height); background: var(--gt-bg); border: 1px solid var(--gt-line); border-radius: var(--gt-r-lg); box-shadow: var(--gt-sh-3); overflow: hidden; transition: width var(--gt-t) var(--gt-ease), height var(--gt-t) var(--gt-ease); transform-origin: top center; }
.gt-navmenu-viewport[data-state="open"] { animation: gt-pop-in var(--gt-t) var(--gt-ease); }
.gt-navmenu-viewport[data-state="closed"] { animation: gt-pop-out var(--gt-t-fast) var(--gt-ease); }
.gt-navmenu-content { width: max-content; min-width: 280px; }
.gt-navmenu-panel { display: grid; gap: 4px; padding: 10px; }
.gt-navmenu-group { display: grid; }
.gt-navmenu-head { padding: 10px 12px 4px; font-size: var(--gt-fs-xs); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--gt-faint); }
.gt-navmenu-link { display: block; padding: 9px 12px; border-radius: var(--gt-r-sm); color: var(--gt-text) !important; font-size: var(--gt-fs-md); }
.gt-navmenu-link.is-strong { font-weight: 700; color: var(--gt-ink) !important; }
.gt-navmenu-link:hover, .gt-navmenu-link:focus-visible { background: var(--gt-bg-2); }
.gt-navmenu-all { display: flex; justify-content: space-between; margin-top: 4px; padding: 10px 12px; border-top: 1px solid var(--gt-line); color: var(--gt-accent-deep) !important; font-size: var(--gt-fs-sm); font-weight: 700; }
@keyframes gt-pop-in { from { opacity: 0; transform: translateY(-6px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes gt-pop-out { from { opacity: 1; } to { opacity: 0; transform: translateY(-4px); } }

/* Reka: mobile sheet */
.gt-sheet-overlay { position: fixed; inset: 0; z-index: 1100; background: rgba(8, 10, 14, .55); backdrop-filter: blur(2px); animation: gt-fade-in var(--gt-t) var(--gt-ease); }
.gt-sheet { position: fixed; top: 0; bottom: 0; inset-inline-end: 0; z-index: 1101; width: min(360px, 88vw); display: flex; flex-direction: column; background: var(--gt-bg); color: var(--gt-text); box-shadow: var(--gt-sh-3); overflow-y: auto; animation: gt-slide-in var(--gt-t-slow) var(--gt-ease); }
[dir="rtl"] .gt-sheet { animation-name: gt-slide-in-rtl; }
.gt-sheet[data-state="closed"] { animation: gt-fade-out var(--gt-t-fast) var(--gt-ease); }
.gt-sheet-head { display: flex; align-items: center; justify-content: space-between; padding: 16px 16px 12px 20px; border-bottom: 1px solid var(--gt-line); }
.gt-sheet-title { font-size: var(--gt-fs-base); font-weight: 700; color: var(--gt-ink); }
.gt-sheet-close { display: inline-grid; place-content: center; width: 40px; height: 40px; border: 1px solid var(--gt-line); border-radius: var(--gt-r-sm); background: var(--gt-bg); color: var(--gt-text); cursor: pointer; }
.gt-sheet-nav { padding: 8px 12px; }
.gt-sheet-list { list-style: none; margin: 0; padding: 0; display: grid; }
.gt-sheet-list > li > a { display: flex; align-items: center; min-height: 48px; padding: 0 10px; border-radius: var(--gt-r-sm); color: var(--gt-ink) !important; font-size: var(--gt-fs-base); font-weight: 600; }
.gt-sheet-list > li > a:hover { background: var(--gt-bg-2); }
.gt-sheet-list > li.is-current > a { color: var(--gt-accent-deep) !important; }
.gt-sheet-list .gt-nav-sub { position: static; opacity: 1; visibility: visible; transform: none; border: 0; box-shadow: none; background: transparent; margin: 0 0 8px; padding: 0 0 0 10px; }
.gt-sheet-list .gt-nav-sub li a { color: var(--gt-text-2); min-height: 40px; display: flex; align-items: center; }
.gt-sheet-extras { margin-top: auto; padding: 16px 20px 24px; border-top: 1px solid var(--gt-line); display: grid; gap: 10px; }
.gt-sheet-meta { font-size: var(--gt-fs-sm); color: var(--gt-muted) !important; text-align: center; }
.gt-sheet-langs { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; }
.gt-sheet-langs a { padding: 6px 12px; border: 1px solid var(--gt-line-2); border-radius: var(--gt-r-pill); color: var(--gt-text-2) !important; font-size: var(--gt-fs-sm); font-weight: 600; }
.gt-sheet-langs a.is-active { background: var(--gt-ink); border-color: var(--gt-ink); color: #fff !important; }
@keyframes gt-fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes gt-fade-out { from { opacity: 1; } to { opacity: 0; } }
@keyframes gt-slide-in { from { transform: translateX(24px); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes gt-slide-in-rtl { from { transform: translateX(-24px); opacity: 0; } to { transform: none; opacity: 1; } }

/* Reka: language select */
.gt-lang { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 10px 0 12px; border: 1px solid var(--gt-dark-line); border-radius: var(--gt-r-sm); background: transparent; color: var(--gt-on-dark-2); font-size: var(--gt-fs-sm); font-weight: 600; cursor: pointer; white-space: nowrap; }
.gt-lang:hover, .gt-lang[data-state="open"] { color: #fff; background: rgba(255, 255, 255, .07); }
.gt-lang-caret { opacity: .7; }
.gt-lang-menu { z-index: 1200; min-width: 200px; padding: 6px; background: var(--gt-bg); border: 1px solid var(--gt-line); border-radius: var(--gt-r-md); box-shadow: var(--gt-sh-3); animation: gt-pop-in var(--gt-t-fast) var(--gt-ease); }
.gt-lang-list { display: grid; }
.gt-lang-item { display: flex; align-items: center; gap: 10px; min-height: 40px; padding: 0 10px; border-radius: var(--gt-r-sm); color: var(--gt-text); font-size: var(--gt-fs-md); cursor: pointer; outline: none; }
.gt-lang-item[data-highlighted] { background: var(--gt-bg-2); }
.gt-lang-item[data-state="checked"] { color: var(--gt-ink); font-weight: 600; }
.gt-lang-code { display: inline-grid; place-content: center; width: 28px; height: 22px; border-radius: 6px; background: var(--gt-bg-3); color: var(--gt-muted); font-size: 10px; font-weight: 700; letter-spacing: .04em; }
.gt-lang-check { margin-inline-start: auto; color: var(--gt-accent-deep); display: inline-flex; }

/* Reka: accordion */
.gt-acc { display: grid; gap: 10px; }
.gt-acc-item { border: 1px solid var(--gt-line); border-radius: var(--gt-r-md); background: var(--gt-bg); overflow: hidden; transition: border-color var(--gt-t-fast); }
.gt-acc-item[data-state="open"] { border-color: var(--gt-line-2); }
.gt-acc-head { margin: 0; font-size: inherit; }
.gt-acc-trigger { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 20px; border: 0; background: transparent; text-align: start; color: var(--gt-ink); font-size: var(--gt-fs-base); font-weight: 600; cursor: pointer; }
.gt-acc-trigger:hover { background: var(--gt-bg-2); }
.gt-acc-icon { flex: 0 0 auto; color: var(--gt-muted); transition: transform var(--gt-t) var(--gt-ease); }
.gt-acc-trigger[data-state="open"] .gt-acc-icon { transform: rotate(45deg); }
.gt-acc-content { overflow: hidden; }
.gt-acc-content[data-state="open"] { animation: gt-acc-down var(--gt-t) var(--gt-ease); }
.gt-acc-content[data-state="closed"] { animation: gt-acc-up var(--gt-t-fast) var(--gt-ease); }
.gt-acc-body { padding: 0 20px 20px; color: var(--gt-text-2); font-size: var(--gt-fs-md); }
.gt-acc-body :where(p:last-child) { margin-bottom: 0; }
@keyframes gt-acc-down { from { height: 0; } to { height: var(--reka-accordion-content-height); } }
@keyframes gt-acc-up { from { height: var(--reka-accordion-content-height); } to { height: 0; } }

/* ------------------------------------------------------------------ */
/* 5. Footer                                                            */
/* ------------------------------------------------------------------ */

.gt-footer { background: var(--gt-dark); color: var(--gt-on-dark-2); padding: clamp(48px, 7vw, 80px) 0 28px; border-top: 1px solid var(--gt-dark-line); }
.gt-footer-grid { display: grid; grid-template-columns: 1.6fr repeat(4, 1fr); gap: clamp(24px, 4vw, 48px); }
.gt-footer-grid:has(.gt-footer-apps) { grid-template-columns: 1.6fr repeat(4, 1fr) 1.2fr; }
.gt-footer-brand { display: grid; gap: var(--gt-s4); align-content: start; }
.gt-footer-logo img { height: 40px !important; width: auto; max-width: 170px; object-fit: contain; }
.gt-footer-address { font-style: normal; display: grid; font-size: var(--gt-fs-sm); line-height: 1.6; color: var(--gt-on-dark-2); }
.gt-footer-contact { list-style: none; display: grid; gap: 6px; font-size: var(--gt-fs-sm); }
.gt-footer-contact a { color: var(--gt-on-dark) !important; display: inline-flex; align-items: center; gap: 8px; }
.gt-footer-contact i { color: var(--gt-accent-on-dark, var(--gt-accent)); width: 16px; text-align: center; }
.gt-footer-social { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.gt-footer-social a { display: inline-grid; place-content: center; width: 38px; height: 38px; border: 1px solid var(--gt-dark-line); border-radius: var(--gt-r-sm); color: var(--gt-on-dark) !important; font-size: 15px; transition: background var(--gt-t-fast), border-color var(--gt-t-fast), transform var(--gt-t-fast); }
.gt-footer-social a:hover { background: var(--gt-accent); border-color: var(--gt-accent); color: var(--gt-accent-ink) !important; transform: translateY(-2px); }
.gt-footer-title { font-size: var(--gt-fs-xs); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--gt-on-dark); margin-bottom: 16px; }
.gt-footer-links { list-style: none; display: grid; gap: 9px; }
.gt-footer-links a { color: var(--gt-on-dark-2) !important; font-size: var(--gt-fs-md); }
.gt-footer-links a:hover { color: #fff !important; }
.gt-footer-stores { display: grid; gap: 8px; }
.gt-store--light { background: var(--gt-dark-2); border-color: var(--gt-dark-line); }
.gt-store--light:hover { background: var(--gt-dark-3); }
.gt-footer-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; margin-top: clamp(32px, 5vw, 56px); padding-top: 20px; border-top: 1px solid var(--gt-dark-line); font-size: var(--gt-fs-sm); color: var(--gt-on-dark-muted); }
.gt-footer-bottom p { margin: 0; }
.gt-footer-copy a { color: var(--gt-accent-on-dark, var(--gt-accent)) !important; }
@media (max-width: 1023px) { .gt-footer-grid, .gt-footer-grid:has(.gt-footer-apps) { grid-template-columns: 1fr 1fr 1fr; } .gt-footer-brand { grid-column: 1 / -1; } }
@media (max-width: 599px) { .gt-footer-grid, .gt-footer-grid:has(.gt-footer-apps) { grid-template-columns: 1fr 1fr; } .gt-footer-apps { grid-column: 1 / -1; } .gt-footer-stores { grid-template-columns: 1fr 1fr; } }

/* ------------------------------------------------------------------ */
/* 6. Homepage                                                          */
/* ------------------------------------------------------------------ */

.gt-hero { position: relative; isolation: isolate; background: var(--gt-dark); overflow: hidden; }
.gt-hero-media { position: absolute; inset: 0; z-index: -2; }
.gt-hero-media, .gt-hero-media .slick-list, .gt-hero-media .slick-track { height: 100%; }
.gt-hero-slide { height: 100%; min-height: 100%; }
@media (max-width: 767px) { .gt-hero-slide { background-image: var(--mobile-bg) !important; } }
.gt-hero-scrim { position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(8, 10, 14, .92) 0%, rgba(8, 10, 14, .78) 45%, rgba(8, 10, 14, .35) 100%); }
.gt-hero-inner { display: grid; grid-template-columns: minmax(0, 640px); padding-block: clamp(64px, 10vw, 128px) clamp(96px, 12vw, 160px); }
.gt-hero-copy { display: grid; gap: var(--gt-s5); justify-items: start; }
.gt-hero-rating { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px 6px 10px; border: 1px solid var(--gt-dark-line); border-radius: var(--gt-r-pill); background: rgba(255, 255, 255, .06); color: var(--gt-on-dark-2) !important; font-size: var(--gt-fs-sm); }
.gt-hero-rating strong { color: #fff; }
.gt-hero .gt-h1 { max-width: 14ch; }
.gt-hero-actions { display: flex; flex-wrap: wrap; gap: var(--gt-s3); margin-top: var(--gt-s2); }
.gt-hero-apps { display: grid; gap: 10px; margin-top: var(--gt-s4); padding-top: var(--gt-s5); border-top: 1px solid var(--gt-dark-line); width: 100%; }
.gt-hero-apps-label { font-size: var(--gt-fs-xs); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--gt-on-dark-muted); }
.gt-hero-stores { display: flex; flex-wrap: wrap; gap: 10px; }
.gt-hero .gt-store { background: rgba(255, 255, 255, .08); border-color: var(--gt-dark-line); }
.gt-hero .gt-store:hover { background: rgba(255, 255, 255, .14); }

/* The booking form sits over the hero's bottom edge */
.gt-booking-anchor { position: relative; z-index: 2; margin-top: clamp(-72px, -8vw, -110px); }

/* Services */
.gt-services { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gt-s5); }
.gt-service { display: grid; gap: var(--gt-s3); padding: clamp(20px, 3vw, 28px); align-content: start; }
/* These carry photographs, not glyphs. A 30px picture inside a tinted
   56px tile read as a broken icon; the image fills the tile and the tile
   is big enough to see what is in it. */
.gt-service-icon { overflow: hidden; width: 100%; aspect-ratio: 16 / 9; border-radius: var(--gt-r-md); background: var(--gt-accent-soft); }
.gt-service-icon img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 991px) { .gt-services { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 599px) { .gt-services { grid-template-columns: 1fr; } }

/* Trust strip */
.gt-trust { list-style: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--gt-s4) var(--gt-s8); }
.gt-trust-item { display: flex; gap: var(--gt-s3); align-items: flex-start; }
.gt-trust-item img { width: 40px; height: 40px; object-fit: contain; flex: 0 0 auto; }
.gt-trust-item strong { display: block; color: var(--gt-ink); }
.gt-trust-item span { display: block; font-size: var(--gt-fs-sm); color: var(--gt-muted); }

/* App section */
.gt-app { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(32px, 6vw, 96px); align-items: center; }
.gt-app-copy { display: grid; gap: var(--gt-s5); justify-items: start; }
.gt-app-benefits { list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--gt-s5) var(--gt-s6); margin-block: var(--gt-s2); }
.gt-app-benefits li { display: flex; gap: var(--gt-s3); align-items: flex-start; }
.gt-app-benefits strong { display: block; color: #fff; margin-bottom: 4px; }
.gt-app-benefits p { margin: 0; font-size: var(--gt-fs-sm); color: var(--gt-on-dark-2); }
.gt-app-num { flex: 0 0 auto; font-size: var(--gt-fs-xs); font-weight: 800; color: var(--gt-accent-on-dark, var(--gt-accent)); letter-spacing: .06em; padding-top: 3px; font-variant-numeric: tabular-nums; }
.gt-app-visual { display: grid; place-items: center; }
.gt-phone { width: min(280px, 70vw); aspect-ratio: 9 / 18.5; padding: 12px; border-radius: 40px; background: #1a1f27; border: 1px solid rgba(255, 255, 255, .12); box-shadow: 0 40px 80px -30px rgba(0, 0, 0, .8), inset 0 0 0 2px rgba(0, 0, 0, .5); }
.gt-phone-screen { height: 100%; border-radius: 30px; background: linear-gradient(180deg, var(--gt-dark-3), var(--gt-dark)); padding: 28px 18px; display: grid; align-content: start; gap: 14px; overflow: hidden; }
.gt-phone-screen img { height: 36px; width: auto; max-width: 120px; object-fit: contain; margin-bottom: 8px; }
.gt-phone-card { height: 64px; border-radius: 14px; background: rgba(255, 255, 255, .08); padding: 14px; display: grid; gap: 8px; align-content: center; }
.gt-phone-card span { display: block; height: 8px; border-radius: 4px; background: rgba(255, 255, 255, .22); }
.gt-phone-card span:last-child { width: 60%; }
.gt-phone-card--accent { background: var(--gt-accent); }
.gt-phone-card--accent span { background: rgba(0, 0, 0, .25); }
.gt-phone-cta { height: 46px; border-radius: 12px; background: #fff; margin-top: auto; }
@media (max-width: 991px) { .gt-app { grid-template-columns: 1fr; } .gt-app-visual { order: -1; } .gt-phone { width: min(220px, 60vw); } }
@media (max-width: 599px) { .gt-app-benefits { grid-template-columns: 1fr; } }

/* Advantages */
/* The heading column is narrower than the list and no longer leaves a
   column of empty page beside it: it sits at the top of its own column and
   the list takes the room it needs. */
.gt-advantages { display: grid; grid-template-columns: minmax(0, .62fr) minmax(0, 1.6fr); gap: clamp(28px, 4vw, 56px); align-items: start; }
.gt-advantages-head { display: grid; gap: var(--gt-s3); position: sticky; top: calc(var(--gt-header-h) + 24px); }
.gt-advantages-list { list-style: none; display: grid; }
.gt-advantage { display: grid; grid-template-columns: 36px 84px minmax(0, 1fr); gap: var(--gt-s4); align-items: start; padding: var(--gt-s6) 0; border-top: 1px solid var(--gt-line); }
.gt-advantage:last-child { border-bottom: 1px solid var(--gt-line); }
.gt-advantage-num { font-size: var(--gt-fs-sm); font-weight: 800; color: var(--gt-faint); font-variant-numeric: tabular-nums; padding-top: 4px; }
.gt-advantage-icon { overflow: hidden; width: 84px; height: 64px; border-radius: var(--gt-r-md); background: var(--gt-bg-2); }
.gt-advantage-icon img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gt-advantage p { margin: 4px 0 0; font-size: var(--gt-fs-md); }
@media (max-width: 991px) { .gt-advantages { grid-template-columns: 1fr; } .gt-advantages-head { position: static; } }
@media (max-width: 480px) { .gt-advantage { grid-template-columns: 68px minmax(0, 1fr); } .gt-advantage-num { display: none; } .gt-advantage-icon { width: 68px; height: 52px; } }

/* Drivers */
.gt-drivers { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 6vw, 96px); align-items: center; }
.gt-drivers-media img { width: 100%; border-radius: var(--gt-r-xl); aspect-ratio: 4 / 3; object-fit: cover; box-shadow: var(--gt-sh-3); }
.gt-drivers-media img.is-flipped { transform: scaleX(-1); }
.gt-drivers-copy { display: grid; gap: var(--gt-s5); justify-items: start; }
.gt-drivers-text { color: var(--gt-text-2); max-width: 60ch; }
.gt-drivers-text p { margin: 0; }
.gt-checklist { list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--gt-s3) var(--gt-s5); }
.gt-checklist li { display: flex; gap: 10px; align-items: flex-start; font-size: var(--gt-fs-md); color: var(--gt-text); }
.gt-checklist i { flex: 0 0 auto; display: grid; place-content: center; width: 22px; height: 22px; border-radius: 50%; background: var(--gt-accent); color: var(--gt-accent-ink); font-size: 11px; margin-top: 1px; }
@media (max-width: 991px) { .gt-drivers { grid-template-columns: 1fr; } }
@media (max-width: 480px) { .gt-checklist { grid-template-columns: 1fr; } }

/* Reviews */
.gt-review-agg { display: inline-flex; align-items: center; gap: 8px; color: var(--gt-text) !important; font-size: var(--gt-fs-sm); font-weight: 600; }
.gt-review-agg i { font-size: 12px; color: var(--gt-accent-deep); }
.gt-reviews { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(300px, 1fr); gap: var(--gt-s5); scroll-snap-type: x mandatory; padding-bottom: 6px; }
.gt-review { scroll-snap-align: start; display: grid; gap: var(--gt-s4); padding: clamp(20px, 3vw, 28px); margin: 0; }
.gt-review blockquote { margin: 0; color: var(--gt-text-2); font-size: var(--gt-fs-md); line-height: 1.6; }
.gt-review figcaption { display: flex; align-items: center; gap: 12px; margin-top: auto; }
.gt-review figcaption span:last-child { display: grid; }
.gt-review figcaption strong { color: var(--gt-ink); font-size: var(--gt-fs-sm); }
.gt-review figcaption small { color: var(--gt-muted); font-size: var(--gt-fs-xs); }
.gt-review-avatar { display: grid; place-content: center; width: 40px; height: 40px; border-radius: 50%; color: #fff; font-weight: 700; flex: 0 0 auto; }
@media (min-width: 1024px) { .gt-reviews { grid-auto-flow: row; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-columns: auto; overflow: visible; } }

/* ------------------------------------------------------------------ */
/* 7. Booking form                                                      */
/* ------------------------------------------------------------------ */

.gt-booking { position: relative; padding-bottom: clamp(24px, 4vw, 48px); }
.gt-booking-wrap--wide { max-width: 1400px; }
/* No overflow clip: the address suggestion list opens inside the card's
   box and was cut off at its bottom edge. Nothing else in the card bleeds. */
.gt-booking-card { background: var(--gt-bg); border: 1px solid var(--gt-line); border-radius: var(--gt-r-xl); box-shadow: var(--gt-sh-3); }
.gt-booking-card--split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .8fr); }
.gt-booking-main { padding: clamp(20px, 4vw, 40px); min-width: 0; }
.gt-booking-head { display: grid; gap: 6px; margin-bottom: var(--gt-s6); }
.gt-booking-video { background: var(--gt-dark); }
.gt-booking-video .video, .gt-booking-video video { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 991px) { .gt-booking-card--split { grid-template-columns: 1fr; } .gt-booking-video { aspect-ratio: 16 / 9; } }

/* The wizard */
.gt-bf-source { display: block; }
.booking-wizard-shell { display: block; }
.booking-wizard-progress { margin-bottom: var(--gt-s6); }
.booking-wizard-step { display: none; }
.booking-wizard-step.booking-wizard-step-active { display: block; animation: gt-step-in var(--gt-t) var(--gt-ease); }
@keyframes gt-step-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.gt-bf-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: var(--gt-s4) var(--gt-s4); align-items: start; }
.gt-bf-col { grid-column: span 3; min-width: 0; }
.gt-bf--three .gt-bf-col { grid-column: span 2; }
.gt-bf-col--half { grid-column: span 3 !important; }
.gt-bf-col--full { grid-column: 1 / -1 !important; }
.gt-bf-col--center { justify-self: center; width: min(100%, 420px); }
@media (max-width: 767px) { .gt-bf-col, .gt-bf--three .gt-bf-col, .gt-bf-col--half { grid-column: 1 / -1 !important; } .gt-bf-col--center { width: 100%; } }
.gt-bf-heading { display: grid; gap: var(--gt-s3); margin-top: var(--gt-s2); padding-top: var(--gt-s4); border-top: 1px solid var(--gt-line); }
.gt-bf-heading:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.gt-bf-heading h5 { font-size: var(--gt-fs-xs); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--gt-muted); }
.gt-bf-actions { display: flex; justify-content: space-between; align-items: center; gap: var(--gt-s3); margin-top: var(--gt-s6); padding-top: var(--gt-s4); border-top: 1px solid var(--gt-line); }
.gt-bf-actions--center { justify-content: center; border-top: 0; padding-top: 0; }
.gt-bf-actions .gt-btn { min-width: 140px; }
@media (max-width: 480px) { .gt-bf-actions { flex-direction: column-reverse; } .gt-bf-actions .gt-btn, .gt-bf-actions [data-booking-submit-slot] { width: 100%; } .gt-bf-actions [data-booking-submit-slot] .gt-btn { width: 100%; } }

/* Categories */
.gt-bf-categories { margin: 0 0 var(--gt-s2); }
.gt-bf-fieldset { border: 0; padding: 0; margin: 0; display: grid; gap: var(--gt-s3); }
.gt-bf-help { margin: 0; color: var(--gt-muted); font-size: var(--gt-fs-sm); }
.gt-bf-categories .gt-chips { justify-content: flex-start; }

/* Fields: labels are visible now; the icon sits in the control */
.gt-bf .gt-field { gap: 6px; }
.gt-bf .gt-control .form-control { flex: 1 1 0%; min-width: 0; width: 1%; }
.gt-bf .gt-control > input.form-control:first-child { padding-inline-start: var(--gt-s4); }
.gt-bf .gt-control { flex-wrap: wrap; }
.gt-bf .gt-control > label.error, .gt-bf .gt-field > label.error, .gt-bf-errors label.error { flex-basis: 100%; margin: 0; padding: 0 0 8px var(--gt-s4); font-size: var(--gt-fs-xs); font-weight: 500; color: var(--gt-danger); }
.gt-bf .gt-field > label.error { padding: 0; }
.gt-bf .gt-control:has(label.error), .gt-bf .gt-control:has(.error) { border-color: var(--gt-danger); }
.gt-bf .gt-control .bootstrap-select { flex: 1 1 0% !important; min-width: 0; width: 1% !important; float: none; margin: 0; }
/* The select is a field inside the control, not a second box: the control
   already draws the border, so the toggle draws none whatever bootstrap-select
   or the theme give it. */
.gt-bf .gt-control .bootstrap-select > .dropdown-toggle { border: 0 !important; border-radius: var(--gt-r-md) !important; background: transparent !important; box-shadow: none !important; outline: 0 !important; min-height: 46px; }
.gt-bf .gt-control > .intl-tel-input { flex: 1 1 auto; min-width: 0; }
.gt-bf .gt-control > .intl-tel-input .form-control { padding-inline-start: 52px; width: 100%; }
.gt-bf .gt-control .flag-container { border-radius: var(--gt-r-md) 0 0 var(--gt-r-md); }
.gt-bf .gt-control .selected-flag { padding-inline-start: 12px; }
.gt-bf .gt-control .date-input-css-disable { cursor: pointer; }
.gt-bf .gt-control--stripe { padding: 0 var(--gt-s4); }
.gt-bf .gt-control--stripe .StripeElement { width: 100%; padding: 14px 0; height: auto; }
.gt-bf-grid--card { margin-bottom: 8px; }
.gt-bf-grid--card > .gt-control { grid-column: span 2; }
@media (max-width: 767px) { .gt-bf-grid--card > .gt-control { grid-column: 1 / -1; } }
.gt-bf .sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; }

/* Places: the Google element lives inside .gt-place; the map buttons on its edge */
/* The suggestions list is drawn inside the address widget, so it paints
   inside this field's stacking order. Without this the list slid under the
   Get Quote button below it and the last suggestion was unclickable. */
.gt-control--place { min-height: 50px; position: relative; z-index: 1; }
.gt-control--place:focus-within { z-index: 40; }
.gt-place gmp-place-autocomplete { position: relative; z-index: 2; }
.gt-place { position: relative; display: flex; align-items: center; height: auto !important; min-height: 46px; padding: 0 !important; }
.gt-place gmp-place-autocomplete { flex: 1 1 auto; min-width: 0; width: 100%; --gmpx-color-surface: transparent; }
.gt-place-actions { display: flex; gap: 2px; flex: 0 0 auto; padding-inline-end: 6px; }
.gt-place-actions .btn { display: inline-grid; place-content: center; width: 34px; height: 34px; padding: 0; border: 0; border-radius: var(--gt-r-sm); background: var(--gt-bg-2); color: var(--gt-muted); font-size: 13px; cursor: pointer; }
.gt-place-actions .btn:hover { background: var(--gt-accent-soft); color: var(--gt-accent-ink); }
.gt-control-icon--pickup { color: var(--gt-accent-deep); }
.gt-control-icon--drop { color: var(--gt-ink); }
.gt-bf-errors:empty { display: none; }
.gt-bf-errors { font-size: var(--gt-fs-xs); color: var(--gt-danger); }

/* Journey summary */
.gt-journey { display: grid; gap: 8px; margin-bottom: var(--gt-s5); }
.gt-journey-row { display: flex; align-items: center; gap: 12px; min-height: 48px; padding: 8px 8px 8px 14px; border: 1px solid var(--gt-line); border-radius: var(--gt-r-md); background: var(--gt-bg-2); }
.gt-journey-icon { color: var(--gt-accent-deep); font-size: 14px; flex: 0 0 auto; }
.gt-journey-stop-no { display: inline-grid; place-content: center; width: 20px; height: 20px; border-radius: 50%; background: var(--gt-accent-deep); color: #fff; font-size: 11px; font-weight: 700; line-height: 1; }
.gt-journey-text { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--gt-fs-md); }
/* "Stop 2" and the address it names are two different things and read as two
   different things now. They used to be one string in one colour, so the part
   that tells you which leg this is had exactly the same weight as the part you
   are actually reading, and every row looked the same at a glance. The label
   is the quiet half; the address is what the row is for. */
.gt-journey-label { font-weight: 600; color: var(--gt-muted); }
.gt-journey-label::after { content: ':'; }
.gt-journey-value { margin-inline-start: 6px; font-weight: 600; color: var(--gt-ink); }
.gt-journey-value:empty::before { content: '\2014'; color: var(--gt-muted); }
.gt-journey-edit { flex: 0 0 auto; display: inline-grid; place-content: center; width: 34px; height: 34px; border: 0; border-radius: var(--gt-r-sm); background: var(--gt-bg); color: var(--gt-muted); font-size: 12px; cursor: pointer; box-shadow: var(--gt-sh-1); }
.gt-journey-edit:hover { color: var(--gt-ink); }

/* Native controls the script drives through cards and buttons */
.service-select-native, .trip-type-native { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

/* Return offer */
/* The body text sits on the soft tint, not on the accent: on a dark brand
   colour `--gt-accent-ink` is white, and white on the tint is unreadable. */
.gt-offer { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid var(--gt-accent-line); border-radius: var(--gt-r-md); background: var(--gt-accent-soft); color: var(--gt-text); font-size: var(--gt-fs-sm); }
.gt-offer-icon { display: grid; place-content: center; width: 36px; height: 36px; border-radius: 50%; background: var(--gt-accent); color: var(--gt-accent-ink); flex: 0 0 auto; }
.gt-offer-body { display: grid; gap: 2px; min-width: 0; }
.gt-offer-body strong { color: var(--gt-ink); }
.gt-offer-info { margin-inline-start: auto; color: var(--gt-muted); cursor: help; }

/* Service cards, rendered by the script */
.gt-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: var(--gt-s4); margin-top: 4px; }
.gt-cards:empty { display: none; }
.service-select-card { position: relative; display: grid; gap: var(--gt-s3); padding: var(--gt-s4); border: 1.5px solid var(--gt-line); border-radius: var(--gt-r-lg); background: var(--gt-bg); transition: border-color var(--gt-t-fast), box-shadow var(--gt-t-fast), transform var(--gt-t-fast); }
.service-select-card:hover { border-color: var(--gt-line-2); box-shadow: var(--gt-sh-2); }
.service-select-card.selected { border-color: var(--gt-ink); box-shadow: 0 0 0 3px var(--gt-accent-soft); }
.service-card-top { display: flex; align-items: center; gap: 12px; }
.service-select-card-image { flex: 0 0 auto; display: grid; place-content: center; width: 64px; height: 48px; border-radius: var(--gt-r-sm); background: var(--gt-bg-2); overflow: hidden; }
.service-select-card-image img { width: 100%; height: 100%; object-fit: contain; }
.service-select-card-placeholder { color: var(--gt-faint); font-size: 20px; }
.service-select-card-info { display: grid; gap: 2px; min-width: 0; flex: 1 1 auto; }
.service-select-card-title { font-weight: 700; color: var(--gt-ink); font-size: var(--gt-fs-base); }
.service-select-card-description { font-size: var(--gt-fs-xs); color: var(--gt-muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.service-card-check { flex: 0 0 auto; display: grid; place-content: center; width: 24px; height: 24px; border-radius: 50%; border: 1.5px solid var(--gt-line-2); color: transparent; font-size: 11px; transition: background var(--gt-t-fast), border-color var(--gt-t-fast), color var(--gt-t-fast); }
.service-select-card.selected .service-card-check { background: var(--gt-accent); border-color: var(--gt-accent); color: var(--gt-accent-ink); }
.service-select-card-body { display: grid; gap: 10px; }
.service-card-stats { display: flex; flex-wrap: wrap; gap: 6px 14px; }
.service-card-stat { display: inline-flex; align-items: center; gap: 6px; font-size: var(--gt-fs-xs); color: var(--gt-text-2); }
.service-card-stat i { color: var(--gt-faint); }
.service-card-badges { display: flex; flex-wrap: wrap; gap: 6px; }
.service-card-badge { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: var(--gt-r-pill); background: var(--gt-bg-2); font-size: var(--gt-fs-xs); color: var(--gt-text-2); }
.service-card-badge i { color: var(--gt-faint); }
.service-card-metric-label { color: var(--gt-muted); }
.service-card-metric-value { font-weight: 700; color: var(--gt-ink); }
.service-price-options { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.service-price-options.single-price-option { grid-template-columns: 1fr; }
.service-price-button { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 52px; padding: 8px 12px; border: 1.5px solid var(--gt-line); border-radius: var(--gt-r-md); background: var(--gt-bg); text-align: start; cursor: pointer; transition: border-color var(--gt-t-fast), background var(--gt-t-fast); }
.service-price-button:hover { border-color: var(--gt-line-2); background: var(--gt-bg-2); }
.service-price-button > span:not(.service-price-choice):not(.service-price-saving) { display: grid; gap: 2px; min-width: 0; }
.service-price-label { font-size: var(--gt-fs-xs); font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--gt-muted); }
.service-price-value { font-size: var(--gt-fs-base); font-weight: 800; color: var(--gt-ink); font-variant-numeric: tabular-nums; }
.service-price-choice { flex: 0 0 auto; display: grid; place-content: center; width: 20px; height: 20px; border-radius: 50%; border: 1.5px solid var(--gt-line-2); color: transparent; font-size: 9px; }
.service-price-button.selected { border-color: var(--gt-ink); background: var(--gt-ink); }
.service-price-button.selected .service-price-label { color: var(--gt-on-dark-2); }
.service-price-button.selected .service-price-value { color: #fff; }
.service-price-button.selected .service-price-choice { background: var(--gt-accent); border-color: var(--gt-accent); color: var(--gt-accent-ink); }
.service-price-saving { position: absolute; top: -9px; inset-inline-end: 10px; padding: 2px 8px; border-radius: var(--gt-r-pill); background: var(--gt-success); color: #fff; font-size: 10px; font-weight: 700; letter-spacing: .03em; }
.service-price-button:disabled { opacity: .5; cursor: not-allowed; }

/* Estimate */
.gt-bf-estimate { padding: var(--gt-s4); border-radius: var(--gt-r-md); background: var(--gt-bg-2); }
.gt-estimate-body { display: grid; gap: 8px; font-size: var(--gt-fs-md); }
.gt-estimate-body label { margin: 0; }
.gt-bf-labels { display: flex; flex-wrap: wrap; gap: 8px; }
.gt-bf-labels:has(> .d-none:only-child), .gt-bf-labels:not(:has(> :not(.d-none))) { display: none; }
.gt-bf-labels .gt-badge { min-height: 32px; padding-inline: 14px; font-size: var(--gt-fs-sm); }
.gt-bf-labels .gt-badge > span { padding: 0 !important; }

/* Submit */
.gt-bf-submit { display: grid; gap: var(--gt-s3); justify-items: center; }
.gt-bf-submit .form-group { margin: 0; }
.gt-bf-submit .form-result { width: 100%; }
.gt-bf-submit .form-result.alert-success { background: var(--gt-success-soft); color: var(--gt-success); }
.gt-bf-submit .form-result.alert-danger { background: var(--gt-danger-soft); color: var(--gt-danger); }
.gt-bf-submit .form-result.alert-warning { background: var(--gt-warning-soft); color: var(--gt-warning); }

/* Flatpickr, restyled */
.gt-site .flatpickr-calendar { border: 1px solid var(--gt-line); border-radius: var(--gt-r-md); box-shadow: var(--gt-sh-3); font-family: var(--gt-font); }
.gt-site .flatpickr-day.selected, .gt-site .flatpickr-day.selected:hover { background: var(--gt-ink); border-color: var(--gt-ink); }
.gt-site .flatpickr-day.today { border-color: var(--gt-accent); }
.gt-site .flatpickr-day:hover { background: var(--gt-bg-2); border-color: var(--gt-bg-2); }
.gt-site .flatpickr-months .flatpickr-month, .gt-site .flatpickr-current-month { color: var(--gt-ink); }

/* Google Places dropdown */
.gt-site .pac-container { border: 1px solid var(--gt-line); border-radius: var(--gt-r-md); box-shadow: var(--gt-sh-3); font-family: var(--gt-font); padding: 4px; margin-top: 4px; }
.gt-site .pac-item { border: 0; border-radius: var(--gt-r-sm); padding: 8px 10px; font-size: var(--gt-fs-sm); color: var(--gt-text-2); }
.gt-site .pac-item:hover, .gt-site .pac-item-selected { background: var(--gt-bg-2); }
.gt-site .pac-item-query { color: var(--gt-ink); font-size: var(--gt-fs-md); }

/* ------------------------------------------------------------------ */
/* 8. Inner pages                                                       */
/* ------------------------------------------------------------------ */

/* Page hero */
.gt-page-hero { position: relative; isolation: isolate; background: var(--gt-dark); overflow: hidden; }
.gt-page-hero::before { content: ""; position: absolute; inset: 0; z-index: -2; background: var(--gt-hero-img, none) center / cover no-repeat; }
@media (max-width: 767px) { .gt-page-hero::before { background-image: var(--gt-hero-img-m, var(--gt-hero-img, none)); } }
.gt-page-hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(8, 10, 14, .82), rgba(8, 10, 14, .9)); }
.gt-page-hero-inner { display: grid; gap: var(--gt-s4); justify-items: start; padding-block: clamp(48px, 8vw, 96px); max-width: 820px; }
.gt-page-hero--compact .gt-page-hero-inner { padding-block: clamp(36px, 5vw, 56px); }
.gt-page-hero .gt-h1 { font-size: var(--gt-fs-4xl); }

/* Prose: CMS and article HTML */
.gt-prose { color: var(--gt-text-2); font-size: var(--gt-fs-base); line-height: 1.7; }
.gt-prose > :first-child { margin-top: 0; }
.gt-prose :where(h1, h2, h3, h4) { margin: 1.6em 0 .6em; color: var(--gt-ink); }
.gt-prose :where(h1) { font-size: var(--gt-fs-3xl); }
.gt-prose :where(h2) { font-size: var(--gt-fs-2xl); }
.gt-prose :where(h3) { font-size: var(--gt-fs-xl); }
.gt-prose :where(h4) { font-size: var(--gt-fs-lg); }
.gt-prose :where(p, ul, ol, blockquote, table, figure) { margin: 0 0 1.1em; }
.gt-prose :where(ul, ol) { padding-inline-start: 1.4em; }
.gt-prose :where(li) { margin: .3em 0; }
.gt-prose :where(a) { text-decoration: underline; text-underline-offset: 3px; }
.gt-prose :where(strong) { color: var(--gt-ink); }
.gt-prose :where(blockquote) { padding: var(--gt-s4) var(--gt-s5); border-inline-start: 3px solid var(--gt-accent); background: var(--gt-bg-2); border-radius: 0 var(--gt-r-md) var(--gt-r-md) 0; }
.gt-prose :where(img) { border-radius: var(--gt-r-md); }
.gt-prose :where(table) { width: 100%; border-collapse: collapse; font-size: var(--gt-fs-md); }
.gt-prose :where(th, td) { padding: 10px 12px; border-bottom: 1px solid var(--gt-line); text-align: start; }
.gt-prose :where(th) { color: var(--gt-ink); background: var(--gt-bg-2); }
.gt-prose :where(hr) { margin: 2em 0; }
.gt-prose :where(br:first-child) { display: none; }

/* FAQ page: before the island mounts, the plain pairs */
.gt-faq { display: grid; gap: var(--gt-s3); }
.gt-faq-item { padding: var(--gt-s5); border: 1px solid var(--gt-line); border-radius: var(--gt-r-md); }
.gt-faq-item .gt-h5 { margin-bottom: 8px; }
.gt-faq-a { color: var(--gt-text-2); font-size: var(--gt-fs-md); }

/* Reviews page */
.gt-rv-summary { position: relative; z-index: 2; margin-top: -36px; }
.gt-rv-summary-card { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: var(--gt-s6) var(--gt-s12); padding: clamp(20px, 3vw, 32px); box-shadow: var(--gt-sh-3); }
.gt-rv-score { text-align: center; display: grid; gap: 2px; }
.gt-rv-num { font-size: 56px; font-weight: 800; line-height: 1; color: var(--gt-ink); font-variant-numeric: tabular-nums; }
.gt-rv-stars { font-size: 22px; justify-content: center; }
.gt-rv-badges { display: grid; gap: 8px; }
.gt-rv-badge { display: inline-flex; align-items: center; gap: 12px; min-width: 250px; padding: 10px 16px; border: 1px solid var(--gt-line-2); border-radius: var(--gt-r-md); color: var(--gt-ink) !important; font-weight: 600; font-size: var(--gt-fs-md); transition: border-color var(--gt-t-fast), box-shadow var(--gt-t-fast); }
.gt-rv-badge:hover { border-color: var(--gt-ink); box-shadow: var(--gt-sh-2); }
.gt-rv-badge i { width: 32px; height: 32px; display: inline-grid; place-content: center; border-radius: var(--gt-r-sm); background: var(--gt-accent-soft); color: var(--gt-accent-ink); }
.gt-rv-badge small { display: block; font-weight: 400; font-size: var(--gt-fs-xs); color: var(--gt-muted); }
.gt-rv-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: var(--gt-s5); }
.gt-review-top { display: flex; justify-content: space-between; align-items: center; }
.gt-rv-lg { color: var(--gt-info); font-weight: 600; }
.gt-rv-form { max-width: 560px; margin-inline: auto; }
.gt-rv-google { display: block; text-align: center; margin-top: var(--gt-s4); font-weight: 600; font-size: var(--gt-fs-sm); }
/* The data-retention rows on the contact page are Bootstrap grid rows, and
   a grid row carries negative side margins that only a grid column cancels.
   These are not in a column, so the page ran 14px wider than the screen. */
.gt-site .data-box .row { margin-inline: 0; }

/* A link that is the whole list item is a control, not a word in a
   sentence, and on a phone it needs a target worth aiming at. */
@media (max-width: 767px) {
    .rel-links-col li > a:only-child,
    .gt-footer-col li > a:only-child,
    td > a:only-child { display: inline-block; padding-block: 7px; min-height: 32px; }
    /* The brand mark in the sign-in bar is a link too. */
    .gtl-brand { display: inline-flex; align-items: center; min-height: 34px; padding-block: 4px; }
}

/* A standalone link is a control, and on a phone it needs a target worth
   aiming at. Links inside a sentence are exempt and keep their size. */
@media (max-width: 767px) {
    .gt-rv-google, .gt-rv-badge, .gt-footer-nav a, .gt-cookie a { display: inline-block; padding-block: 7px; min-height: 32px; }
    .gt-rv-google { display: block; }
}
.gt-file { display: block; width: 100%; padding: 10px; border: 1px dashed var(--gt-line-2); border-radius: var(--gt-r-md); background: var(--gt-bg-2); font-size: var(--gt-fs-sm); }

/* Blog */
.gt-blog-meta { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: var(--gt-fs-xs); font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--gt-muted); }
.gt-blog-meta a { color: var(--gt-accent-deep) !important; }
.gt-blog-featured { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); overflow: hidden; margin-bottom: var(--gt-s8); }
.gt-blog-media { position: relative; background: var(--gt-bg-3); min-height: 320px; }
.gt-blog-media .background_slider, .gt-blog-media .slick-list, .gt-blog-media .slick-track, .gt-blog-media .slider-item, .gt-blog-media .bg_img { height: 100%; min-height: 320px; }
.gt-blog-media .slider-video { width: 100%; height: 100%; object-fit: cover; display: block; }
.gt-blog-featured-body { display: grid; gap: var(--gt-s4); align-content: center; justify-items: start; padding: clamp(24px, 4vw, 40px); }
.gt-blog-featured-body .gt-h2 a { color: var(--gt-ink); }
.gt-blog-excerpt { max-height: 9.5em; overflow: hidden; -webkit-mask-image: linear-gradient(#000 70%, transparent); mask-image: linear-gradient(#000 70%, transparent); font-size: var(--gt-fs-md); }
.gt-blog-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: var(--gt-s5); }
.gt-blog-card { overflow: hidden; display: grid; grid-template-rows: auto 1fr; }
.gt-blog-card-media { display: block; aspect-ratio: 16 / 10; background: var(--gt-bg-3); }
.gt-blog-card-media img { width: 100%; height: 100%; object-fit: cover; }
.gt-blog-card-body { display: grid; gap: 10px; padding: var(--gt-s5); align-content: start; justify-items: start; }
.gt-blog-card-body .gt-h4 a { color: var(--gt-ink); }
.gt-blog-card-body .gt-h4 a:hover { color: var(--gt-accent-deep); }
.gt-article { display: grid; gap: var(--gt-s6); }
.gt-article-title { color: var(--gt-ink); }
.gt-article-media { border-radius: var(--gt-r-lg); overflow: hidden; }
.gt-pagination { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 6px; margin-top: var(--gt-s10); }
.gt-page { display: inline-grid; place-content: center; min-width: 40px; height: 40px; padding: 0 12px; border: 1px solid var(--gt-line-2); border-radius: var(--gt-r-sm); color: var(--gt-text) !important; font-weight: 600; font-size: var(--gt-fs-sm); }
.gt-page:hover { border-color: var(--gt-ink); }
.gt-page.is-active { background: var(--gt-ink); border-color: var(--gt-ink); color: #fff !important; }
.gt-page.is-disabled { opacity: .4; pointer-events: none; }
.gt-page-gap { color: var(--gt-faint); padding: 0 4px; }
@media (max-width: 991px) { .gt-blog-featured { grid-template-columns: 1fr; } .gt-blog-media { min-height: 240px; } .gt-blog-media .background_slider, .gt-blog-media .bg_img { min-height: 240px; } }

/* Location and route landing pages (.loc-*) */
.loc-page .container { width: 100%; max-width: var(--gt-container-narrow); margin-inline: auto; padding-inline: var(--gt-gutter); }
.loc-hero { background: var(--gt-dark); color: var(--gt-on-dark); padding-block: clamp(48px, 8vw, 96px); }
.loc-hero h1 { color: #fff; font-size: var(--gt-fs-4xl); letter-spacing: -.02em; font-weight: 800; margin-bottom: var(--gt-s4); max-width: 18ch; }
.loc-hero p.loc-lede { color: var(--gt-on-dark-2); font-size: var(--gt-fs-lg); max-width: 62ch; }
.loc-hero p.loc-lede strong { color: var(--gt-accent-on-dark, var(--gt-accent)); }
.loc-cta-row { display: flex; flex-wrap: wrap; gap: var(--gt-s3); margin-top: var(--gt-s6); }
.loc-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 50px; padding: 0 var(--gt-s6); border-radius: var(--gt-r-md); border: 1px solid transparent; font-weight: 600; text-decoration: none !important; transition: background var(--gt-t-fast), border-color var(--gt-t-fast), transform var(--gt-t-fast); }
.loc-btn:active { transform: translateY(1px); }
.loc-btn-primary { background: var(--gt-accent); color: var(--gt-accent-ink) !important; border-color: var(--gt-accent); }
.loc-btn-primary:hover, .loc-btn-primary:focus { background: var(--gt-accent-line); border-color: var(--gt-accent-line); }
.loc-btn-ghost { background: transparent; color: var(--gt-on-dark) !important; border-color: rgba(255, 255, 255, .3); }
.loc-btn-ghost:hover, .loc-btn-ghost:focus { background: rgba(255, 255, 255, .08); }
.loc-final-cta .loc-btn-ghost { color: var(--gt-ink) !important; border-color: var(--gt-line-2); }
.loc-final-cta .loc-btn-ghost:hover { background: var(--gt-bg-2); }
.loc-section { padding-block: clamp(40px, 6vw, 72px); }
.loc-section.alt { background: var(--gt-bg-2); }
.loc-section h2 { font-size: var(--gt-fs-2xl); margin-bottom: var(--gt-s4); }
.loc-section p, .loc-section li { color: var(--gt-text-2); line-height: 1.7; }
.loc-section p { margin-bottom: var(--gt-s4); }
.loc-section ul { list-style: disc; padding-inline-start: 1.3em; }
.loc-fare-note { font-size: var(--gt-fs-sm); color: var(--gt-muted); }
.loc-table-wrap { overflow-x: auto; margin: var(--gt-s5) 0; border: 1px solid var(--gt-line); border-radius: var(--gt-r-md); }
table.loc-fares { width: 100%; border-collapse: collapse; font-size: var(--gt-fs-md); font-variant-numeric: tabular-nums; }
table.loc-fares th, table.loc-fares td { padding: 12px 14px; border-bottom: 1px solid var(--gt-line); text-align: start; white-space: nowrap; }
table.loc-fares th { background: var(--gt-bg-2); color: var(--gt-ink); font-size: var(--gt-fs-xs); text-transform: uppercase; letter-spacing: .06em; }
table.loc-fares tr:last-child td { border-bottom: 0; }
table.loc-fares td strong { color: var(--gt-ink); }
.loc-badges { list-style: none !important; padding: 0 !important; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 10px; margin-top: var(--gt-s4); }
.loc-badges li { padding: 10px 14px; border: 1px solid var(--gt-line); border-radius: var(--gt-r-md); background: var(--gt-bg); color: var(--gt-text); font-size: var(--gt-fs-md); }
.loc-faq-item { padding: var(--gt-s5); border: 1px solid var(--gt-line); border-radius: var(--gt-r-md); background: var(--gt-bg); margin-bottom: 10px; }
.loc-faq-item h3 { font-size: var(--gt-fs-lg); margin-bottom: 6px; }
.loc-faq-item p { margin: 0; font-size: var(--gt-fs-md); }
.loc-crosslinks { display: flex; flex-wrap: wrap; gap: 8px; }
.loc-crosslinks a { display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px; border: 1px solid var(--gt-line-2); border-radius: var(--gt-r-pill); color: var(--gt-text) !important; font-weight: 600; font-size: var(--gt-fs-sm); }
.loc-crosslinks a:hover { border-color: var(--gt-ink); color: var(--gt-ink) !important; }
.loc-final-cta { padding-block: clamp(48px, 7vw, 80px); text-align: center; background: var(--gt-bg-2); }
.loc-final-cta h2 { font-size: var(--gt-fs-3xl); }
.loc-final-cta p { color: var(--gt-muted); }
.loc-final-cta .loc-cta-row { justify-content: center; }
.rel-links-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: var(--gt-s5) var(--gt-s8); margin-top: var(--gt-s3); }
.rel-links-col h3 { font-size: var(--gt-fs-xs); text-transform: uppercase; letter-spacing: .1em; margin: 0 0 12px; color: var(--gt-accent-deep); }
.rel-links-col ul { list-style: none !important; padding: 0 !important; margin: 0; }
.rel-links-col li { margin: 0 0 8px; }
.rel-links-col a { font-weight: 500; color: var(--gt-text-2) !important; }
.rel-links-col a:hover { color: var(--gt-ink) !important; }

/* Offers (create-booking) and phone banner */
.gt-offers { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gt-s5); }
.gt-offer-card { display: grid; gap: 10px; align-content: start; padding: clamp(20px, 3vw, 28px); position: relative; }
.gt-offer-card .gt-badge { justify-self: start; }
.gt-offer-num { font-size: var(--gt-fs-3xl); font-weight: 800; letter-spacing: -.02em; color: var(--gt-ink); line-height: 1; margin-top: 6px; }
.gt-offer-num em { font-style: normal; color: var(--gt-accent-deep); }
.gt-offer-card h3 { font-size: var(--gt-fs-lg); }
.gt-offer-card p { color: var(--gt-muted); font-size: var(--gt-fs-md); margin: 0; }
.gt-offer-stores { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.gt-nudge { display: flex; gap: 12px; align-items: flex-start; margin-top: var(--gt-s5); padding: 14px 16px; border-radius: var(--gt-r-md); background: var(--gt-accent-soft); border: 1px solid var(--gt-accent-line); color: var(--gt-accent-ink); font-size: var(--gt-fs-md); }
.gt-nudge i { color: var(--gt-accent-deep); margin-top: 3px; }
.gt-trust-row { display: flex; flex-wrap: wrap; gap: 8px 20px; font-size: var(--gt-fs-sm); color: var(--gt-on-dark-2); }
.gt-trust-row span { display: inline-flex; align-items: center; gap: 8px; }
.gt-trust-row i { color: var(--gt-accent-on-dark, var(--gt-accent)); }
.gt-phone-banner { text-align: center; }
.gt-phone-banner .gt-section-head { margin-bottom: var(--gt-s5); }
.gt-phone-big { display: inline-flex; align-items: center; gap: 12px; font-size: clamp(1.5rem, 4vw, 2.25rem); font-weight: 800; color: var(--gt-ink) !important; letter-spacing: -.01em; }
.gt-phone-big i { display: inline-grid; place-content: center; width: 52px; height: 52px; border-radius: 50%; background: var(--gt-accent); color: var(--gt-accent-ink); font-size: 20px; }
.gt-sticky-cta { position: fixed; left: 0; right: 0; bottom: 0; z-index: 900; display: none; gap: 10px; padding: 10px var(--gt-gutter) calc(10px + env(safe-area-inset-bottom)); background: rgba(255, 255, 255, .92); backdrop-filter: blur(8px); border-top: 1px solid var(--gt-line); }
.gt-sticky-cta .gt-btn { flex: 1 1 0; }
@media (max-width: 767px) { .gt-sticky-cta { display: flex; } body.gt-site:has(.gt-sticky-cta) { padding-bottom: 72px; } }
@media (max-width: 991px) { .gt-offers { grid-template-columns: 1fr; } }

/* ------------------------------------------------------------------ */
/* 9. Map selector modal (opened by the booking script)                 */
/* ------------------------------------------------------------------ */

.map-selector-modal { display: none; position: fixed; inset: 0; z-index: 3000; background: rgba(8, 10, 14, .6); backdrop-filter: blur(3px); padding: 16px; }
.map-selector-modal.is-open, .map-selector-modal[style*="display: block"], .map-selector-modal[style*="display:block"], .map-selector-modal[style*="display: flex"] { display: grid !important; place-items: center; }
.map-selector-content { width: min(760px, 100%); max-height: calc(100vh - 32px); display: grid; grid-template-rows: auto 1fr auto; background: var(--gt-bg); border-radius: var(--gt-r-lg); overflow: hidden; box-shadow: var(--gt-sh-3); }
.map-selector-header { display: flex; align-items: center; gap: 10px; padding: 12px; border-bottom: 1px solid var(--gt-line); }
.map-selector-close { order: 2; flex: 0 0 auto; width: 40px; height: 40px; border: 1px solid var(--gt-line); border-radius: var(--gt-r-sm); background: var(--gt-bg); font-size: 22px; line-height: 1; cursor: pointer; color: var(--gt-text); }
.map-search-input { flex: 1 1 auto; min-height: 44px; padding: 0 14px; border: 1px solid var(--gt-line-2); border-radius: var(--gt-r-md); font: inherit; font-size: var(--gt-fs-md); }
.map-search-input:focus { outline: none; border-color: var(--gt-ink); box-shadow: var(--gt-focus); }
.map-selector-body { position: relative; min-height: min(60vh, 460px); background: var(--gt-bg-3); }
#mapSelectorCanvas { position: absolute; inset: 0; }
/* The centre pin, Uber-style: the pin's tip sits on the point being read and
   a separate shadow marks that point on the ground. While the map is moving
   the pin lifts and the shadow shrinks under it, so a drag reads as "picking
   this up and putting it down" rather than as the map twitching. The two are
   positioned from the same origin - the centre of the viewport - so the tip
   and the shadow cannot drift apart. */
.map-marker-center { position: absolute; left: 50%; top: 50%; width: 0; height: 0; color: var(--gt-danger); pointer-events: none; z-index: 2; }
.map-marker-pin { position: absolute; left: 50%; bottom: 0; transform: translate(-50%, 0); transition: transform .18s cubic-bezier(.2, .7, .3, 1); filter: drop-shadow(0 3px 4px rgba(8, 10, 14, .28)); }
.map-marker-shadow { position: absolute; left: 50%; top: 0; width: 14px; height: 5px; transform: translate(-50%, -50%); border-radius: 50%; background: rgba(8, 10, 14, .32); transition: transform .18s cubic-bezier(.2, .7, .3, 1), opacity .18s linear; }
.map-marker-center.is-moving .map-marker-pin { transform: translate(-50%, -10px); }
.map-marker-center.is-moving .map-marker-shadow { transform: translate(-50%, -50%) scale(.55); opacity: .7; }
@media (prefers-reduced-motion: reduce) {
    .map-marker-pin, .map-marker-shadow { transition: none; }
    .map-marker-center.is-moving .map-marker-pin { transform: translate(-50%, 0); }
}

/* Reads as "working on it" rather than as the previous point's answer sitting
   there while the map is somewhere else. */
/* The recent-places chips under an address field.
   A row that wraps rather than scrolls: five short labels fit a desktop field
   on one line and a phone's on two, and neither needs a scrollbar to reach the
   last one. Hidden entirely when there is nothing stored, so a first-time
   visitor sees the form they always saw. */
/* Below the field, and only while it is focused. Hidden by default and while
   empty (no saved places), so no field carries a stray strip of chips; the
   focused field's row opens under it. */
.gt-recent-row { display: none; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.gt-recent-row.is-open:not(:empty) { display: flex; }
.gt-recent-chip { display: inline-flex; align-items: center; gap: 6px; max-width: 100%; padding: 5px 10px; border: 1px solid var(--gt-line-2); border-radius: 999px; background: var(--gt-bg-2); color: var(--gt-text-2); font: inherit; font-size: var(--gt-fs-sm); line-height: 1.2; cursor: pointer; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gt-recent-chip > i { flex: 0 0 auto; font-size: 11px; color: var(--gt-muted); }
.gt-recent-chip:hover { border-color: var(--gt-ink); color: var(--gt-ink); }
.gt-recent-chip:focus-visible { outline: none; box-shadow: var(--gt-focus); }

.map-selector-address.is-locating { opacity: .6; }
.map-confirm-btn[disabled] { opacity: .5; cursor: default; }
.map-selector-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; border-top: 1px solid var(--gt-line); }
.map-selector-address { flex: 1 1 auto; min-width: 0; font-size: var(--gt-fs-sm); color: var(--gt-text-2); }
.map-confirm-btn { flex: 0 0 auto; min-height: 44px; padding: 0 18px; border: 0; border-radius: var(--gt-r-md); background: var(--gt-accent); color: var(--gt-accent-ink); font-weight: 700; cursor: pointer; }
@media (max-width: 599px) { .map-selector-footer { flex-direction: column; align-items: stretch; } }

/* ------------------------------------------------------------------ */
/* 10. Sign-in and registration pages (standalone views)                */
/* ------------------------------------------------------------------ */

.gt-auth-page .tj-banner-form { display: none !important; }
.gt-auth-page .tj-wrapper { background: var(--gt-bg-2); }
.gt-auth-page .tj-login, .gt-auth-page .tj-login-page { max-width: 560px; margin: 40px auto 72px; padding: 0 var(--gt-gutter); }
.gt-auth-page .tj-login > .container, .gt-auth-page .tj-login .container { width: 100%; max-width: none; padding: 0; }
.gt-auth-page .tj-login h2.text-center, .gt-auth-page .tj-login .section_title h2 { font-size: var(--gt-fs-2xl); margin-bottom: var(--gt-s5); }
.gt-auth-page .nav-tabs { display: flex; gap: 4px; padding: 4px; margin: 0 0 var(--gt-s5); border: 0; border-radius: var(--gt-r-md); background: var(--gt-bg-3); }
.gt-auth-page .nav-tabs .nav-item { flex: 1 1 0; margin: 0; }
.gt-auth-page .nav-tabs .nav-link { display: flex; justify-content: center; min-height: 40px; align-items: center; border: 0 !important; border-radius: var(--gt-r-sm); color: var(--gt-muted); font-weight: 600; font-size: var(--gt-fs-sm) !important; }
.gt-auth-page .nav-tabs .nav-link.active, .gt-auth-page .nav-tabs .nav-item.active .nav-link { background: var(--gt-bg); color: var(--gt-ink); box-shadow: var(--gt-sh-1); }
.gt-auth-page .tab-pane > .col-md-12 > .row, .gt-auth-page .col-md-12[style*="F9F9F9"], .gt-auth-page .row[style*="F9F9F9"] { background: var(--gt-bg) !important; border: 1px solid var(--gt-line); border-radius: var(--gt-r-xl) !important; box-shadow: var(--gt-sh-2); margin: 0; padding: clamp(16px, 3vw, 28px); }
.gt-auth-page center { text-align: start; }
.gt-auth-page .m-auto { width: 100% !important; max-width: none !important; }
.gt-auth-page .login-frm, .gt-auth-page .reg-frm { max-width: none !important; padding: 0 !important; margin-top: 8px !important; }
.gt-auth-page .field-holder { position: relative; margin: 0 0 14px; }
.gt-auth-page .field-holder > span[class*="fa-"] { position: absolute; inset-inline-start: 14px; top: 15px; margin: 0 !important; color: var(--gt-faint); font-size: 14px; pointer-events: none; z-index: 2; }
.gt-auth-page .field-holder .form-control, .gt-auth-page .field-holder input[type="text"], .gt-auth-page .field-holder input[type="email"], .gt-auth-page .field-holder input[type="password"], .gt-auth-page .field-holder input[type="date"], .gt-auth-page .field-holder select {
    width: 100%; min-height: 48px; padding: 0 14px 0 42px; border: 1px solid var(--gt-line-2) !important; border-radius: var(--gt-r-md) !important; background: var(--gt-bg); box-shadow: none !important; font-size: var(--gt-fs-md); margin: 0 !important; color: var(--gt-text);
}
[dir="rtl"] .gt-auth-page .field-holder .form-control { padding: 0 42px 0 14px; }
.gt-auth-page .field-holder > .row .form-control, .gt-auth-page .field-holder:not(:has(> span[class*="fa-"])) .form-control { padding-inline-start: 14px; }
.gt-auth-page .field-holder .form-control:focus { border-color: var(--gt-ink) !important; box-shadow: var(--gt-focus) !important; }
.gt-auth-page .field-holder .intl-tel-input { width: 100%; }
.gt-auth-page .field-holder .intl-tel-input .form-control { padding-inline-start: 52px; }
.gt-auth-page #show_hide_password { position: relative; }
.gt-auth-page .input-group-addon-password { position: absolute; inset-inline-end: 12px; top: 50%; transform: translateY(-50%); }
.gt-auth-page .help-block { display: block; margin-top: 4px; font-size: var(--gt-fs-xs); color: var(--gt-danger); }
.gt-auth-page .reg-btn, .gt-auth-page .btn-new, .gt-auth-page .log-teal-btn, .gt-auth-page .btn.btn-dark, .gt-auth-page .btn-success {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 48px; padding: 0 20px;
    border: 0 !important; border-radius: var(--gt-r-md) !important; background: var(--gt-accent) !important; color: var(--gt-accent-ink) !important;
    font-size: var(--gt-fs-md) !important; font-weight: 700 !important; cursor: pointer; margin-top: 6px; text-decoration: none !important; box-shadow: none !important;
}
.gt-auth-page .reg-btn:hover, .gt-auth-page .btn-new:hover { background: var(--gt-accent-line) !important; }
.gt-auth-page .otp-block { width: 44px !important; height: 52px !important; margin: 0 3px; border: 1px solid var(--gt-line-2) !important; border-radius: var(--gt-r-sm) !important; text-align: center; font-size: var(--gt-fs-xl); font-weight: 700; }
.gt-auth-page .otp-block:focus { outline: none; border-color: var(--gt-ink) !important; box-shadow: var(--gt-focus); }
.gt-auth-page .reg-cta, .gt-auth-page .cta-list { display: none; }
.gt-auth-page .radio-inline { margin-inline-end: 12px; }
.gt-auth-page .dropify-wrapper { border-radius: var(--gt-r-md); border: 1px dashed var(--gt-line-2); }
/* The two Bootstrap-only pages: register and register-driver */
.gt-auth-page #login-block { background: var(--gt-bg) !important; }
.gt-auth-page #login-block .form-control { min-height: 48px; border: 1px solid var(--gt-line-2); border-radius: var(--gt-r-md); font-size: var(--gt-fs-md); box-shadow: none; }
.gt-auth-page #login-block .form-control:focus { border-color: var(--gt-ink); box-shadow: var(--gt-focus); }
.gt-auth-page #login-block label { font-size: var(--gt-fs-sm); font-weight: 600; color: var(--gt-text-2); }
.gt-auth-page #login-block h2 { font-size: var(--gt-fs-2xl); }
.gt-auth-page #bg-block { border-radius: 0; }
/* The auth views nest Bootstrap columns inside tab panes; on the system every
   pane is the card, full width, one column. */
.gt-auth-page .tj-login .row { margin: 0; display: block; }
.gt-auth-page .tj-login [class*="col-"], .gt-auth-page .tj-login .tab-pane[class*="col-"] { width: 100%; max-width: 100%; flex: 0 0 100%; padding: 0; float: none; }
.gt-auth-page .tj-login .tab-content, .gt-auth-page .tj-login .tab-pane { width: 100%; }
.gt-auth-page .tj-login .tab-pane.fade:not(.active):not(.show) { display: none; }
.gt-auth-page .tj-login .w-lg-75, .gt-auth-page .tj-login .w-xl-50 { width: 100% !important; }
.gt-auth-page .tj-login input, .gt-auth-page .tj-login select { max-width: 100%; }
.gt-auth-page .tj-login a[href*="reset"], .gt-auth-page .tj-login .forgot { display: inline-block; margin: 4px 0 12px; font-size: var(--gt-fs-sm); font-weight: 600; }

/* ------------------------------------------------------------------ */
/* 11. Bootstrap leftovers inside the system's controls                 */
/* ------------------------------------------------------------------ */

/* The booking form's icons are Bootstrap `.input-group-text`, which brings its
   own grey fill and border - inside a .gt-control that reads as a second box
   around the icon. The icon is a mark, not a field: no fill, no border. */
.gt-site .gt-control > .input-group-text,
.gt-site .gt-control .gt-control-icon {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    min-width: 44px;
    height: auto;
    color: var(--gt-faint);
    font-size: 15px;
}
.gt-site .gt-control > .input-group-text > i { line-height: 1; }

/* Google renders its own bordered, padded text box inside
   <gmp-place-autocomplete>. Its shadow root is styled by the booking script;
   these are the host-side halves - no second border, no double height. */
.gt-site .gt-place gmp-place-autocomplete {
    display: block; width: 100%; min-width: 0;
    border: 0; background: transparent;
    --gmpx-color-surface: transparent;
    --gmpx-font-family-base: var(--gt-font);
    --gmpx-font-family-headings: var(--gt-font);
}

/* intl-tel-input sits where a field goes, so it fills the control. */
.gt-site .gt-control .intl-tel-input,
.gt-site .gt-control .iti { flex: 1 1 0%; min-width: 0; width: 1%; }
.gt-site .gt-control .intl-tel-input .flag-container { border: 0; }
.gt-site .gt-control .intl-tel-input .selected-flag { border-radius: var(--gt-r-md) 0 0 var(--gt-r-md); background: transparent; padding-inline-start: 14px; }
.gt-site .gt-control .intl-tel-input .selected-flag:hover { background: var(--gt-bg-2); }
.gt-site .gt-control .intl-tel-input .country-list { border: 1px solid var(--gt-line); border-radius: var(--gt-r-md); box-shadow: var(--gt-sh-3); margin-top: 6px; }


/* ------------------------------------------------------------------ */
/* 12. What the site audit found                                        */
/* ------------------------------------------------------------------ */

/* Stars are a rating, not decoration - they have to be readable. */
/* 4.75:1 on white. The lighter amber this was reads at 3.63:1. */
.gt-stars { color: #976b00; }
.gt-on-dark .gt-stars, .gt-hero .gt-stars { color: #f5b301; }

/* A footer link 17px tall is not a tap target. Everything a thumb has to
   find gets 44px on a phone. */
@media (max-width: 767px) {
    .gt-footer-links a, .gt-footer-contact a, .gt-sheet-langs a, .gt-footer-social a {
        display: inline-flex; align-items: center; min-height: 44px;
    }
    .gt-footer-links { gap: 0; }
    .gt-nav-sub li a, .gt-navmenu-link { min-height: 44px; display: flex; align-items: center; }
    .gt-page { min-height: 44px; min-width: 44px; }
    .gt-review-agg, .gt-hero-rating { min-height: 44px; }
}

/* Bootstrap's .row carries -15px side margins; inside the contact card that
   pushed its rows past the edge of the page. */
.gt-contact .row { margin-inline: 0; }
.gt-contact .data-box .row { flex-wrap: wrap; }

/* The standalone auth pages put the footer inside the theme's fixed-width
   wrappers, which the footer grid then overflowed. */
.gt-auth-page .gt-footer .gt-container { max-width: 100%; }
.gt-auth-page .gt-footer-grid { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }

/* The debug toolbar is a development tool; it is not part of the site. */
.phpdebugbar { display: none !important; }


/* ------------------------------------------------------------------ */
/* The Reka Select that stands in front of a native <select>            */
/*                                                                      */
/* Every dropdown across the portals was bootstrap-select, a jQuery      */
/* plugin off a CDN whose button is 30px tall on a phone and cannot be   */
/* reached from the keyboard. The native <select> is kept in the         */
/* document - it is still what the form posts and what `required`        */
/* validation checks - so it is hidden the way a skip link is, not with  */
/* display:none, which would make a required select unfocusable and      */
/* break the browser's own error message.                               */
/* ------------------------------------------------------------------ */

/* Visually hidden, whatever the page's own field rules say about a select's
   size: the ride screens size every select in a .gtr-field, and without
   !important the native control drew at full size under the Reka one. */
.gt-native-select {
    position: absolute !important;
    width: 1px !important; height: 1px !important;
    min-height: 0 !important;
    padding: 0 !important; margin: -1px !important;
    overflow: hidden !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
    border: 0 !important;
    opacity: 0 !important;
}
.gt-select-host { display: block; width: 100%; }
.gt-nsel {
    display: inline-flex; align-items: center; justify-content: space-between; gap: 10px;
    width: 100%; min-height: 46px;
    padding: 0 14px;
    border: 1px solid var(--gt-line-2, #d3d9e1);
    border-radius: var(--gt-r-sm, 8px);
    background: var(--gt-bg, #fff);
    color: var(--gt-text, #171c24);
    font-size: var(--gt-fs-md, 15px);
    font-weight: 500;
    text-align: start;
    line-height: 1.2;
    cursor: pointer;
}
.gt-nsel:hover { border-color: var(--gt-faint, #8a94a3); }
.gt-nsel[data-state="open"], .gt-nsel:focus-visible {
    border-color: var(--gt-accent, #ffcd71);
    box-shadow: var(--gt-focus, 0 0 0 3px rgba(255, 205, 113, .55));
    outline: none;
}
.gt-nsel-value { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gt-nsel-caret { flex: 0 0 auto; color: var(--gt-muted, #5f6977); }
.gt-nsel-menu {
    z-index: 1200;
    min-width: var(--reka-select-trigger-width, 220px);
    max-height: min(320px, var(--reka-select-content-available-height, 320px));
    padding: 6px;
    background: var(--gt-bg, #fff);
    border: 1px solid var(--gt-line, #e4e7ec);
    border-radius: var(--gt-r-md, 12px);
    box-shadow: var(--gt-sh-3, 0 24px 56px -20px rgba(16, 24, 40, .28));
    overflow-y: auto;
}
.gt-nsel-label {
    padding: 8px 10px 4px;
    font-size: var(--gt-fs-xs, 12px); font-weight: 700; letter-spacing: .07em;
    text-transform: uppercase; color: var(--gt-muted, #5f6977);
}
.gt-nsel-item {
    display: flex; align-items: center; gap: 10px;
    min-height: 44px; padding: 0 10px;
    border-radius: var(--gt-r-sm, 8px);
    font-size: var(--gt-fs-md, 15px);
    color: var(--gt-text, #171c24);
    cursor: pointer; outline: none; user-select: none;
}
.gt-nsel-item[data-highlighted] { background: var(--gt-bg-2, #f6f7f9); color: var(--gt-ink, #0d1117); }
.gt-nsel-item[data-state="checked"] { font-weight: 600; color: var(--gt-ink, #0d1117); }
.gt-nsel-item[data-disabled] { opacity: .5; cursor: not-allowed; }
.gt-nsel-check { margin-inline-start: auto; color: var(--gt-accent-deep, #97690f); display: inline-flex; }

/* In the portals the select follows the panel's own Reka select: a 10px
   trigger, a menu with the chosen row on the accent wash and its check on
   the right, the hovered row on the soft surface. */
.gtp .gt-nsel { min-height: 48px; border-radius: 10px; font-weight: 400; font-size: 16px; }
.gtp .gt-nsel[data-state="open"] .gt-nsel-caret { transform: rotate(180deg); }
.gt-nsel-caret { transition: transform .15s ease; }
.gt-nsel-menu.gtp-menu, body.gtp .gt-nsel-menu { border-radius: 12px; padding: 6px; }
body.gtp .gt-nsel-item { min-height: 44px; padding: 0 12px; border-radius: 8px; font-size: 16px; }
body.gtp .gt-nsel-item[data-highlighted] { background: var(--gt-bg-2, #f6f7f9); }
body.gtp .gt-nsel-item[data-state="checked"] { background: color-mix(in srgb, var(--gt-accent, #ffcd71) 22%, var(--gt-bg, #fff)); font-weight: 600; }
body.gtp .gt-nsel-item[data-state="checked"][data-highlighted] { background: color-mix(in srgb, var(--gt-accent, #ffcd71) 32%, var(--gt-bg, #fff)); }
body.gtp .gt-nsel-check { color: var(--gt-accent-deep, #97690f); }
/* the page's own focus rules drew a dark ring on the highlighted row; the
   wash is the focus state here */
body.gtp .gt-nsel-item, body.gtp .gt-nsel-item:focus, body.gtp .gt-nsel-item:focus-visible { outline: none !important; box-shadow: none !important; }

/* On a phone the menu is a sheet against the bottom of the screen rather
   than a popover that can end up half off it. */
@media (max-width: 599px) {
    .gt-nsel-menu { min-width: min(92vw, 420px); }
    .gt-nsel-item { min-height: 48px; font-size: var(--gt-fs-base, 16px); }
}

/* ------------------------------------------------------------------ */
/* The floating chat button, and dialogs                                */
/* ------------------------------------------------------------------ */

/* `.whatsapp-floating-btn` is fixed at z-index 9999; the map picker is a
   dialog at 3000. Below 576px the button also stops being a pill in the
   corner and becomes a full-width bar - so it landed flat on top of the
   picker's Confirm Location button with nothing between them. A floating
   action has no business sitting over a dialog's primary action, so it
   stands down while one is open. The attribute selectors match the inline
   style the picker's own script sets, which is how its open state is
   already detected further up this file. */
body:has(.map-selector-modal[style*="display: block"]) .whatsapp-floating-btn,
body:has(.map-selector-modal[style*="display:block"]) .whatsapp-floating-btn,
body:has(.map-selector-modal[style*="display: flex"]) .whatsapp-floating-btn,
body:has(.map-selector-modal.is-open) .whatsapp-floating-btn,
body:has(dialog[open]) .whatsapp-floating-btn,
body.modal-open .whatsapp-floating-btn { display: none !important; }

/* And so two buttons are never flush against each other even where one is
   allowed to stay: the bar is 66px tall at this width plus its own 20px
   inset, and anything fixed to the bottom of the screen keeps clear of it. */
@media (max-width: 599px) {
    .map-selector-modal { padding-bottom: 24px; }
    .map-selector-footer { gap: 12px; padding: 14px; }
    .map-selector-content { max-height: calc(100vh - 48px); }
}