/* ============================================
FCC LINKS — fcchauffeurs.co.uk (EN site)
Version: 1.1
Date: 2026-05-26
Scope: NARROWED — only inside .text-content
and .content (legacy container, e.g. /about-us)
Does NOT touch .__link (menu), buttons, logo,
header/footer nav.
WCAG 2.1 AA compliant (4.5:1 contrast).
============================================ */
/* ============================================
NEWS LIST PREVIEW — uniform 16:9 thumbnails
Added 2026-06-16 (TZ News Block 2A)
============================================ */
.news-index .news-list-item img.img-responsive{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;object-position:center;}
/* ============================================
1. BASE TEXT LINKS
============================================ */
.text-content a,
.text-content a:link,
.text-content a:visited,
.content a,
.content a:link,
.content a:visited {
color: #1A1A1A !important;
text-decoration: underline !important;
text-decoration-color: rgba(26, 26, 26, 0.4) !important;
text-decoration-thickness: 1px !important;
text-underline-offset: 3px !important;
transition: color 0.2s ease, text-decoration-color 0.2s ease !important;
font-weight: 400 !important;
}
.text-content a:hover,
.text-content a:focus,
.content a:hover,
.content a:focus {
color: #BC9950 !important;
text-decoration-color: #BC9950 !important;
text-decoration-thickness: 1px !important;
}
.text-content a:focus-visible,
.content a:focus-visible {
outline: 2px solid #BC9950 !important;
outline-offset: 2px !important;
border-radius: 1px !important;
}
/* ============================================
2. CTA LINKS (.link-cta)
============================================ */
.text-content a.link-cta,
.content a.link-cta {
color: #9A7B2E !important;
font-weight: 600 !important;
text-decoration: underline !important;
text-decoration-color: rgba(154, 123, 46, 0.5) !important;
text-decoration-thickness: 1.5px !important;
text-underline-offset: 3px !important;
}
.text-content a.link-cta:hover,
.text-content a.link-cta:focus,
.content a.link-cta:hover,
.content a.link-cta:focus {
color: #7A6024 !important;
text-decoration-color: #7A6024 !important;
}
/* ============================================
3. EXTERNAL LINKS — small arrow icon
============================================ */
.text-content a[href^="http"]:not([href*="fcchauffeurs.co.uk"]):not([href*="fcccars.co.uk"])::after,
.content a[href^="http"]:not([href*="fcchauffeurs.co.uk"]):not([href*="fcccars.co.uk"])::after {
content: " \2197";
display: inline-block;
margin-left: 2px;
font-size: 0.85em;
color: inherit;
text-decoration: none;
}
/* ============================================
4. TEL / EMAIL LINKS — dotted underline
============================================ */
.text-content a[href^="tel:"],
.text-content a[href^="mailto:"],
.content a[href^="tel:"],
.content a[href^="mailto:"], .text-content a[href*="whatsapp"], .text-content a[href*="wa.me"], .content a[href*="whatsapp"], .content a[href*="wa.me"] {
color: #1A1A1A !important;
text-decoration: underline !important;
text-decoration-style: dotted !important;
text-decoration-color: rgba(26, 26, 26, 0.5) !important;
text-decoration-thickness: 1px !important;
text-underline-offset: 3px !important;
font-weight: 400 !important;
}
.text-content a[href^="tel:"]:hover,
.text-content a[href^="mailto:"]:hover,
.text-content a[href^="tel:"]:focus,
.text-content a[href^="mailto:"]:focus,
.content a[href^="tel:"]:hover,
.content a[href^="mailto:"]:hover,
.content a[href^="tel:"]:focus,
.content a[href^="mailto:"]:focus, .text-content a[href*="whatsapp"]:hover, .text-content a[href*="whatsapp"]:focus, .text-content a[href*="wa.me"]:hover, .text-content a[href*="wa.me"]:focus, .content a[href*="whatsapp"]:hover, .content a[href*="whatsapp"]:focus, .content a[href*="wa.me"]:hover, .content a[href*="wa.me"]:focus {
color: #1A1A1A !important;
text-decoration-color: #1A1A1A !important;
}
/* ============================================
5. MOBILE OPTIMIZATION
============================================ */
@media (max-width: 768px) {
.text-content a,
.text-content a:link,
.text-content a:visited,
.content a,
.content a:link,
.content a:visited {
color: #2A2A2A !important;
text-decoration-thickness: 1.5px !important;
text-decoration-color: rgba(42, 42, 42, 0.5) !important;
}
}
/* ============================================
6. HELPER CLASSES (optional, for exceptions)
============================================ */
.text-content a.link-gold,
.content a.link-gold {
color: #9A7B2E !important;
}
.text-content a.link-black,
.content a.link-black {
color: #1A1A1A !important;
}
.text-content a.link-no-underline,
.content a.link-no-underline {
text-decoration: none !important;
}
.text-content a.link-bold,
.content a.link-bold {
font-weight: 600 !important;
}
/* ============================================
7. RESET inherited font-weight
Old site styled content links font-weight:700.
============================================ */
.text-content p a,
.text-content li a,
.text-content span a,
.content p a,
.content li a,
.content span a {
font-weight: 400 !important;
}
.text-content p a.link-cta,
.text-content p a.link-bold,
.text-content li a.link-cta,
.text-content li a.link-bold,
.content p a.link-cta,
.content p a.link-bold,
.content li a.link-cta,
.content li a.link-bold {
font-weight: 600 !important;
}
/* ============================================================
BACK-TO-SERVICES BUTTON — restore black text
Was previously black, became hard to read on burgundy bg.
Force black text on default (burgundy) and hover (green) states.
============================================================ */
.text-content .back-to-services,
.text-content .back-to-services a,
.text-content .back-to-services a:link,
.text-content .back-to-services a:visited,
.content .back-to-services,
.content .back-to-services a,
.content .back-to-services a:link,
.content .back-to-services a:visited,
button.back-to-services,
button.back-to-services a,
.back-to-services,
.back-to-services a,
.back-to-services a:link,
.back-to-services a:visited {
color: #FFFFFF !important; text-decoration: underline !important;
text-decoration-thickness: 1px !important;
text-underline-offset: 3px !important;
text-decoration-color: rgba(255, 255, 255, 0.7) !important; border-bottom: none !important;
}
.text-content .back-to-services:hover,
.text-content .back-to-services:focus,
.text-content .back-to-services a:hover,
.text-content .back-to-services a:focus,
.content .back-to-services:hover,
.content .back-to-services:focus,
.content .back-to-services a:hover,
.content .back-to-services a:focus,
.back-to-services:hover,
.back-to-services:focus,
.back-to-services a:hover,
.back-to-services a:focus {
color: #1A1A1A !important;
text-decoration: underline !important;
text-decoration-thickness: 1.5px !important;
text-underline-offset: 3px !important;
text-decoration-color: #1A1A1A !important;
}
/* =============================================
EXCLUSIVE OFFERS menu item — brand gold instead of red
Overrides app build: ul.main-menu > li > .__link.red
Added 2026-06-03. Covers desktop (tablet-hide) & mobile (tablet-shown).
============================================= */
ul.main-menu > li > .__link.red {
color: #BC9950 !important;
}
ul.main-menu > li > .__link.red:hover,
ul.main-menu > li > .__link.red:focus {
color: #A8853F !important;
}
/* ============================================
8. HOMEPAGE / GENERIC CONTENT PARAGRAPHS
Added 2026-06-04. Extend base link style to
content paragraphs that are not wrapped in
.text-content / .content (e.g. homepage blocks
use .w-page-content). Excludes car slider links,
menu links and tel/mailto contact links.
============================================ */
.w-page-content p a:not(.car-link):not(.__link):not([href^="tel:"]):not([href^="mailto:"]):not([href*="whatsapp"]):not([href*="wa.me"]), .w-page-content li a:not(.car-link):not(.__link):not([href^="tel:"]):not([href^="mailto:"]):not([href*="whatsapp"]):not([href*="wa.me"]) { color: #1A1A1A !important; font-weight: 400 !important; text-decoration: underline !important; text-decoration-color: rgba(26, 26, 26, 0.4) !important; text-decoration-thickness: 1px !important; text-underline-offset: 3px !important; transition: color 0.2s ease, text-decoration-color 0.2s ease !important; }
.w-page-content p a:not(.car-link):not(.__link):not([href^="tel:"]):not([href^="mailto:"]):not([href*="whatsapp"]):not([href*="wa.me"]):hover, .w-page-content p a:not(.car-link):not(.__link):not([href^="tel:"]):not([href^="mailto:"]):not([href*="whatsapp"]):not([href*="wa.me"]):focus, .w-page-content li a:not(.car-link):not(.__link):not([href^="tel:"]):not([href^="mailto:"]):not([href*="whatsapp"]):not([href*="wa.me"]):hover, .w-page-content li a:not(.car-link):not(.__link):not([href^="tel:"]):not([href^="mailto:"]):not([href*="whatsapp"]):not([href*="wa.me"]):focus { color: #BC9950 !important; text-decoration-color: #BC9950 !important; }
.w-page-content p a:not(.car-link):not(.__link):focus-visible, .w-page-content li a:not(.car-link):not(.__link):focus-visible { outline: 2px solid #BC9950 !important; outline-offset: 2px !important; border-radius: 1px !important; }
/* 8b. Override theme -webkit-text-fill-color so the link color is actually visible (added 2026-06-04) */
.w-page-content p a:not(.car-link):not(.__link):not([href^="tel:"]):not([href^="mailto:"]):not([href*="whatsapp"]):not([href*="wa.me"]), .w-page-content li a:not(.car-link):not(.__link):not([href^="tel:"]):not([href^="mailto:"]):not([href*="whatsapp"]):not([href*="wa.me"]) { -webkit-text-fill-color: #1A1A1A !important; }
.w-page-content p a:not(.car-link):not(.__link):not([href^="tel:"]):not([href^="mailto:"]):not([href*="whatsapp"]):not([href*="wa.me"]):hover, .w-page-content p a:not(.car-link):not(.__link):not([href^="tel:"]):not([href^="mailto:"]):not([href*="whatsapp"]):not([href*="wa.me"]):focus, .w-page-content li a:not(.car-link):not(.__link):not([href^="tel:"]):not([href^="mailto:"]):not([href*="whatsapp"]):not([href*="wa.me"]):hover, .w-page-content li a:not(.car-link):not(.__link):not([href^="tel:"]):not([href^="mailto:"]):not([href*="whatsapp"]):not([href*="wa.me"]):focus { -webkit-text-fill-color: #BC9950 !important; }
/* ============================================
BOOK THIS CAR button link — always white
Keeps the link text readable on both the
green and the maroon (hover/active) states.
============================================ */
a.purple_btn,
a.purple_btn:link,
a.purple_btn:visited,
a.purple_btn:hover,
a.purple_btn:active,
a.purple_btn:focus {
color: #ffffff !important;
-webkit-text-fill-color: #ffffff !important;
text-decoration-color: #ffffff !important;
}
/* ============================================
Slightly rounded corners for the buttons
(BACK TO SERVICES, BOOK THIS CAR, etc.)
============================================ */
.purple_btn,
a.purple_btn,
button.purple_btn {
border-radius: 6px !important;
}
/* =========================================
HERO BOOK NOW / GET A QUOTE button (.btn-type02)
Bigger size + hover. Keeps gold #BC9950, white text,
font and border-radius untouched.
========================================= */
.btn-type02 {
padding: 18px 52px !important;
transition: background 0.25s ease, transform 0.15s ease !important;
}
.btn-type02:hover {
background: #A8852F !important;
transform: translateY(-2px) !important;
}
/* Raise hero CTA button onto the dark part of the photo (~70px up) */
.w-submit-button {
margin-bottom: 70px !important;
}
/* =========================================
HEADER two-bar colour scheme - DESKTOP ONLY
Top bar light cream, main nav graphite with
white text and gold accent. Mobile untouched.
Real classes: .col-header-nav-top (top bar),
.col-header-nav (main nav), .__link (links),
.b-dropper (caret), .inset (dropdown).
========================================= */
@media (min-width: 992px) {
/* TOP BAR - theme default (white); custom cream removed 2026-07-14 */
/* .col-header-nav-top background/color removed - use theme */
/* .col-header-nav-top link color removed - use theme */
/* .col-header-nav-top hover color removed - use theme */
/* MAIN NAV - one even color (white), dark text 2026-07-14 */
.col-header-nav { background: #FFFFFF !important; color: #1a1a1a !important; }
.col-header-nav .__link { color: #1a1a1a !important; transition: color .2s ease !important; }
.col-header-nav .__link:hover, .col-header-nav .__link.active { color: #BC9950 !important; }
.col-header-nav .b-dropper { color: #BC9950 !important; }
/* DROPDOWNS in main nav */
.col-header-nav .inset, .col-header-nav .ul-inset { background: #FFFFFF !important; box-shadow: 0 10px 22px rgba(0,0,0,.3) !important; padding: 8px 0 !important; }
.col-header-nav .ul-inset { border-top: 2px solid #BC9950 !important; }
.col-header-nav .ul-inset .__link { display: block !important; padding: 11px 22px !important; font-size: 13.5px !important; font-weight: 600 !important; letter-spacing: .02em !important; text-decoration: none !important; color: #1a1a1a !important; border-left: 3px solid transparent !important; transition: color .2s ease, background .2s ease, border-color .2s ease !important; }
.col-header-nav .ul-inset .__link .text { color: #1a1a1a !important; }
.col-header-nav .ul-inset .__link:hover { color: #BC9950 !important; background: #F5F1E9 !important; border-left-color: #BC9950 !important; }
.col-header-nav .ul-inset .__link:hover .text { color: #BC9950 !important; }
}
/* =========================================
HEADER STICKY (Variant 2) + top-bar caret
Whole .s-header is fixed (keeps flex layout
intact). Main nav (.col-header-nav) hides on
scroll down via .fcc-nav-hidden (desktop only,
so mobile burger is not affected). Body
padding-top is set dynamically by JS.
========================================= */
.s-header { position: fixed !important; top: 0 !important; left: 0 !important; right: 0 !important; z-index: 1100 !important; }
@media (min-width: 992px) {
/* .col-header-nav-top caret color removed 2026-07-14 - use theme */
/* (sticky hide animation removed 2026-07-14) */
/* (fcc-nav-hidden transform removed) */
}
/* =========================================
BUGFIX sticky (Variant 2): remove leftover dark
rectangles at edges after nav hides. Keep the
graphite bg only on .col-header-nav (which also
carries the transform); make inner full-width nav
blocks transparent; slide fully out (-200%).
========================================= */
@media (min-width: 992px) {
.col-header-nav .navigation-menu, .col-header-nav .menu-layout { background: transparent !important; }
/* (fcc-nav-hidden transform removed) */
}
/* Smooth content pull-up: body padding-top animates in sync
with the nav slide (.35s, same as .col-header-nav). */
/* (body padding-top transition removed 2026-07-14) */
/* =========================================
HERO BANNER under fixed header: zero any own
top offset so it sits flush under the header.
Space under header is reserved only by body
padding-top (set dynamically by JS).
========================================= */
#home-slider, .servicepage-chauffeurs, .homepage-slider { margin-top: 0 !important; padding-top: 0 !important; }
/* Home service photos: the width=700 height=500 attrs forced a tall box that stretched the
landscape source. height:auto lets them keep their natural proportions (the pre-attr look). */
.w-image .img { height: auto !important; }
/* =========================================
FIX (gap under fixed header): the element
immediately after the header (.s-header + *)
carried its OWN padding-top (175/154/96px),
duplicating the body offset and producing a
white gap. Zero it so the space under the
header is reserved only once, by body
padding-top (= real header height, set by JS).
========================================= */
/* CLEARANCE = the header's REAL measured height (--fcc-hh, set by the
layout script on every page at the top of the scroll). The numbers are
only first-paint fallbacks — hard-coding them alone clipped page tops
whenever the real header ran taller than the guess (2026-07-15). */
.s-header + * { padding-top: var(--fcc-hh, 175px) !important; }
@media (max-width: 1799px){ .s-header + * { padding-top: var(--fcc-hh, 136px) !important; } }
@media (max-width: 1199px){ .s-header + * { padding-top: var(--fcc-hh, 96px) !important; } }
/* DROPDOWN FIX: dark tail + invisible hover row (desktop) */
@media (min-width: 1200px) {
.col-header-nav .inset { background: transparent !important; box-shadow: none !important; border: none !important; }
.col-header-nav .ul-inset { background: #FFFFFF !important; border-radius: 10px !important; }
.col-header-nav .li-inset:hover > .__link { background: #F5F1E9 !important; color: #BC9950 !important; }
.col-header-nav .li-inset:hover > .__link .text { color: #BC9950 !important; }
}
/* DROPDOWN TAIL FIX (>=992px): dark bg only on rounded .ul-inset, wrapper .inset transparent; NO overflow clip so nested model submenus stay visible */
@media (min-width: 992px) {
.col-header-nav .inset { background: transparent !important; box-shadow: none !important; padding: 0 !important; }
}
/* TICKET: gold instead of red (Exclusive Offers) + gold category arrows */
ul.main-menu > li > .__link.red,
ul.main-menu > li > .__link.red:hover,
ul.main-menu > li > .__link.red:focus { color: #BC9950 !important; }
@media (min-width: 1200px) {
ul.main-menu > li > .__link.red > .dashed::after { background-color: #BC9950 !important; }
ul.main-menu .li-dropper .li-dropper .b-dropper { color: #BC9950 !important; }
ul.main-menu .li-dropper .li-dropper .b-dropper::after { border-color: #BC9950 !important; }
}
/* TICKET: uniform cream top bar - color edge columns (logo + phone) to match center */
@media (min-width: 992px) {
.row-header .col-header-logo,
.row-header .col-header-phone { background: #FFFFFF !important; background-image: none !important; }
/* .col-header-nav-top cream bg removed 2026-07-14 - use theme (white) */
}
/* TICKET: sticky - hide graphite nav on scroll down, keep top bar (Path A) */
@media (min-width: 992px) {
/* (max-height sticky collapse removed 2026-07-14) */
/* (nav-collapsed collapse removed 2026-07-14) */
}
/* TICKET: grey halo around phone icon - make header backdrop white */
.s-header { background: #FFFFFF !important; background-image: none !important; }
/* TICKET: grey bands above/below top bar - replace row glow with bottom-only shadow */
.row-header { box-shadow: 0 2px 6px rgba(0,0,0,0.08) !important; }
/* TICKET: mobile hero banner cut off under fixed header - restore top offset (html body padding-top:0 was overriding intended offset) */
@media (max-width: 991px) {
body.fc-is-home .servicepage-chauffeurs { margin-top: 0 !important; }
body.fc-is-home .servicepage-chauffeurs .swiper-container.home17 { overflow: visible !important; }
}
/* TICKET 2026-06-11: dropdown back to WHITE (Variant A) - graphite nav bar untouched */
@media (min-width: 992px) {
.col-header-nav .ul-inset { background: #FFFFFF !important; border-top: 2px solid #BC9950 !important; box-shadow: 0 10px 22px rgba(0,0,0,.14) !important; }
.col-header-nav .ul-inset .__link { color: #1a1a1a !important; border-left: 3px solid transparent !important; }
.col-header-nav .ul-inset .__link .text { color: #1a1a1a !important; }
.col-header-nav .ul-inset .__link:hover, .col-header-nav .li-inset:hover > .__link { color: #BC9950 !important; background: #FAF7F1 !important; border-left-color: #BC9950 !important; }
.col-header-nav .ul-inset .__link:hover .text, .col-header-nav .li-inset:hover > .__link .text { color: #BC9950 !important; }
.col-header-nav .ul-inset .b-dropper, .col-header-nav .li-inset:hover > .__link .b-dropper { color: #BC9950 !important; }
}
/* TICKET 2026-06-11: compact bar in collapsed header (Step 2) */
.bar-collapsed{ display:none; align-items:center; justify-content:space-between; height:96px; padding:0 26px; background:#FFFFFF; }
.s-header.nav-collapsed .bar-collapsed{ display:flex; }
.s-header.nav-collapsed .col-header-logo, .s-header.nav-collapsed .col-header-phone, .s-header.nav-collapsed .col-header-nav-top, .s-header.nav-collapsed .col-header-burger{ display:none !important; }
.bar-collapsed .crest{ height:46px; width:auto; margin:0 auto; }
.bar-collapsed .menu-toggle{ display:flex; align-items:center; gap:8px; background:none; border:none; cursor:pointer; font-weight:700; font-size:13px; letter-spacing:.04em; color:#1a1a1a; }
.bar-collapsed .burger{ width:20px; height:15px; display:flex; flex-direction:column; justify-content:space-between; }
.bar-collapsed .burger span{ display:block; height:2.5px; background:#1a1a1a; border-radius:2px; }
.s-header.nav-collapsed .row-header{ display:none !important; }
/* BUGFIX 2026-06-11: серый фон #f9f9f9 у шапки на max-width:1799px давал серые полоски сверху/снизу телефонного блока. Делаем шапку однотонно белой. */
.s-header, .row-header{ background:#ffffff !important; background-image:none !important; }
/* TICKET 2026-06-11: edinoe vydelenie stroki v podmenyu (verkhnee + nizhnee menyu) */
@media (min-width: 992px) {
.s-header .ul-inset .__link:hover, .s-header .ul-inset .__link:focus, .s-header .ul-inset .li-inset:hover > .__link, .s-header .ul-inset .li-inset.active > .__link, .s-header .ul-inset .__link.active { background: #FAF7F1 !important; color: #BC9950 !important; }
.s-header .ul-inset .__link:hover .text, .s-header .ul-inset .li-inset:hover > .__link .text, .s-header .ul-inset .li-inset.active > .__link .text { color: #BC9950 !important; }
.s-header .ul-inset .__link:hover .b-dropper, .s-header .ul-inset .li-inset:hover > .__link .b-dropper, .s-header .ul-inset .li-inset.active > .__link .b-dropper { color: #BC9950 !important; }
}
/* TICKET 2026-06-11: ubrat zolotuyu polosku sleva (border-left) vo vsekh podmenyu */
@media (min-width: 992px) {
.s-header .ul-inset .__link, .s-header .ul-inset .__link:hover, .s-header .ul-inset .__link:focus, .s-header .ul-inset .li-inset:hover > .__link, .s-header .ul-inset .li-inset.active > .__link, .s-header .ul-inset .__link.active { border-left: none !important; }
}
/* TICKET 2026-06-12: edinyy telefon (partial) - vyravnivanie svyornutoy polosy s polnoy shapkoy */
.s-header .bar-collapsed { box-sizing: border-box !important; padding-left: 15px !important; padding-right: 15px !important; margin-left: 0 !important; margin-right: 0 !important; }
.s-header .bar-collapsed .header-phone-item { flex-shrink: 0 !important; white-space: nowrap !important; }
.s-header .bar-collapsed .menu-toggle{ flex-shrink:0 !important; }
/* TICKET 2026-06-12: gerb po centru svyornutoy polosy (absolyutnoe pozicionirovanie) */
.s-header .bar-collapsed { position: relative !important; }
.s-header .bar-collapsed .crest { position: static !important; transform: none !important; left: auto !important; margin: 0 !important; }
/* TICKET 2026-06-12: skryt ikonku telefona na mobilnoy versii (<=991px), ostavit tolko nomer */
@media (max-width: 991px) {
.header-phone-item .icon { display: none !important; }
.header-phone-item .text { padding-left: 0 !important; }
.bar-collapsed .phone-ic, .header-phone-item .phone-ic { display: none !important; }
}
/* TICKET 2026-06-13: gerb v svyornutoy polose - ssylka na glavnuyu, centrirovanie na .crest-link */
.bar-collapsed .crest-link { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: inline-flex; align-items: center; }
.bar-collapsed .crest { height: 46px; width: auto; display: block; margin: 0; position: static; transform: none; } /* TICKET 2026-06-13: mobilnoe menu - vernut vidimost pri _menu-open (zerkalno desktopu) */ @media (max-width: 991px) { .s-header._menu-open .row-header { display: block !important; } .s-header._menu-open .col-header-nav { opacity: 1 !important; max-height: none !important; overflow: visible !important; } } ._js-navigation-menu._toggled .menu-layout._toggled { pointer-events: none !important; } ._js-navigation-menu._toggled .menu-layout._toggled a, ._js-navigation-menu._toggled .menu-layout._toggled button, ._js-navigation-menu._toggled .menu-layout._toggled .navigation-menu-body { pointer-events: auto !important; }/* TICKET 2026-06-14: desktop - tonshe grafitovaya polosa menu (umenshit vertikalnye otstupy) */@media (min-width: 992px) { .col-header-nav { padding-top: 8px !important; padding-bottom: 8px !important; align-items: center !important; } }/* TICKET 2026-06-14: desktop - tonshe grafitovaya polosa menu (umenshit vertikalnye otstupy) */ /* TICKET 2026-06-15 (Variant B) UDALEN - zamenen na TICKET 2026-06-23 (flex-setka s gap 34px, karta 300px, foto 170px contain + hover brightness, figcaption #efe9df, knopka temnaya -> zolotaya, adaptiv <=768px). */ /* TICKET 2026-06-24 (Igor odobril): vyrovnyat odinochnuyu kartu po centru. Setka flex justify-center gap 34px width:100%; karta flex:0 0 300px bez calc()/min-width margin:0; adaptiv <=992px flex:0 0 280px, <=768px flex:0 0 100% max-width:360px. Ostalnye stili kartochek (foto/hover/figcaption #efe9df/knopka) ne tronuty. */ /* TICKET 2026-06-25 (Igor odobril): cvetovaya shema 'Xolodnoe serebro'. Tolko cvet figcaption i knopki View more: figcaption fon #efe9df -> #edeff1; knopka pokoy fon #1a1a1a -> #1f2225, ramka #BC9950 -> #c9ccd0. Hover knopki ostaetsya zolotym #BC9950. Cena #a8852f i tekst bags/seats bez izmeneniy. Geometriya/foto/zatemnenie ne tronuty. */ border-right: 0 !/* TICKET 2026-06-27 (Igor odobril): ubrana belaya vertikalnaya cherta sprava u strok v figcaption (byl border-right:1px solid #fff) - na holodno-serom fone #edeff1 stala vidna; dobavlen border-right:0 v pravilo figcaption p. */ /* TICKET 2026-06-26important; padding (Igor odobril): vyrovnyat polnye ryady i odinochnuyu kartu po odnoy osi. Prichina smescheniya na ~17px - ostatochnye bootstrap .clearfix DIV vnutri .portfolio.grid-3 (po odnomu posle kazhdogo ryada iz 3), kotorye kak flex-elementy lomali justify-content:center. Reshenie: .portfolio.grid-3 .clearfix { display:none } - vse ryady i odinochnaya karta teper centriruyutsya po centru 756px. Setka flex/center/gap34 i figure float:none flex:0 0 300px uzhe vnedreny (TICKET 06-24), otdelnogo pravila centrirovaniya last-child net. */ /* TICKET 2026-06-16: ubrat beluyu polosu na styke shapki i video-bannera (Variant 1 - sdvinut kadr video object-position) */ section.servicepage-chauffeurs video.player { object-fit: cover !important; object-position: center 35% !important; } /* TICKET 2026-06-17: ubrat beluyu polosu na styke shapki i bannera na VSEH stranicah - obshiy konteyner section.servicepage-chauffeurs (video na glavnoy/chauffeurs + swiper-slider s bg-image na avto/gorodah/uslugah). Gradient-vual poverh verha bannera, pokryvaet lyuboy tip kontenta. */ section.servicepage-chauffeurs { position: relative; } section.servicepage-chauffeurs::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 90px; background: linear-gradient(to bottom, rgba(26,26,26,.28), rgba(26,26,26,0)); z-index: 5; pointer-events: none; } /* TICKET 2026-06-23: Our Fleet cards (Igor odobril; zamenyaet TICKET 2026-06-22). Setka flex s gap, karta max-width 300px, foto 170px contain + hover brightness(.72), figcaption #efe9df, knopka View more temnaya #1a1a1a -> zolotaya #BC9950 pri hover karty/knopki. Adaptiv <=768px v odin ryad. Primenyaetsya na .portfolio.grid-3 (stranica /chauffeurs). */ .portfolio.grid-3 .clearfix { display: none !important; } .portfolio.grid-3 { --fleet-gap: 34px; display: flex !important; flex-wrap: wrap !important; justify-content: center !important; align-items: flex-start !important; gap: var(--fleet-gap) !important; width: 100% !important; margin: 24px auto !important; padding: 0 !important; box-sizing: border-box !important; } .portfolio.grid-3 figure { float: none !important; flex: 0 0 300px !important; width: 300px !important; max-width: 300px !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; border: 1px solid #e7e2d8 !important; border-radius: 14px !important; overflow: hidden !important; box-shadow: 0 6px 18px rgba(0,0,0,.07) !important; background: #fff !important; display: flex !important; flex-direction: column !important; transition: box-shadow .35s ease !important; } .portfolio.grid-3 figure img { display: block !important; width: 100% !important; height: 170px !important; object-fit: contain !important; background: #fff !important; padding: 10px 12px 4px !important; transition: filter .35s ease, transform .35s ease !important; } .portfolio.grid-3 figure:hover img { filter: brightness(.72) !important; } .portfolio.grid-3 figure figcaption { position: static !important; inset: auto !important; opacity: 1 !important; transform: none !important; display: block !important; background: #edeff1 !important; padding: 10px 16px 16px !important; text-align: center !important; border: none !important; outline: none !important; box-shadow: none !important; border-radius: 0 !important; } .portfolio.grid-3 figure figcaption p { margin: 0 !important; border-right: 0 !important; padding: 1px 0 !important; opacity: 1 !important; transform: none !important; color: #555 !important; text-transform: none !important; font-size: 13px !important; text-align: center !important; font-weight: 500 !important; } .portfolio.grid-3 figure figcaption p:nth-of-type(1) { display: none !important; } .portfolio.grid-3 figure figcaption p:nth-of-type(4) { color: #A8852F !important; font-weight: 700 !important; font-size: 16px !important; margin-top: 6px !important; } .portfolio.grid-3 figure figcaption a { position: static !important; height: auto !important; text-indent: 0 !important; white-space: normal !important; display: inline-block !important; margin-top: 12px !important; background: #1f2225 !important; color: #fff !important; border: 1px solid #c9ccd0 !important; border-radius: 30px !important; font-weight: 700 !important; font-size: 11.5px !important; letter-spacing: .08em !important; text-transform: uppercase !important; padding: 9px 26px !important; text-decoration: none !important; opacity: 1 !important; transition: background .3s ease, color .3s ease, border-color .3s ease !important; } .portfolio.grid-3 figure:hover figcaption a, .portfolio.grid-3 figure figcaption a:hover { background: #BC9950 !important; color: #fff !important; border-color: #BC9950 !important; } .portfolio.grid-3 figure > a { display: block !important; text-align: center !important; margin: 12px 0 14px !important; padding: 0 !important; border: none !important; outline: none !important; background: none !important; font-family: Georgia, 'Times New Roman', serif !important; font-size: 17px !important; color: #1a1a1a !important; text-decoration: underline !important; opacity: 1 !important; } @media (max-width: 992px) { .portfolio.grid-3 figure { flex: 0 0 280px !important; width: 280px !important; max-width: 280px !important; } } @media (max-width: 768px) { .portfolio.grid-3 figure { flex: 0 0 100% !important; width: 100% !important; max-width: 360px !important; } }
/* TZ#3: кнопка «Get a quote» — бордо → золото (модалка бронирования) */
.w-pop-book-form .btn-type02{ background:#6E2A39 !important; background-image:none !important; color:#fff !important; border:none !important; transition:background .25s ease,color .25s ease,box-shadow .15s ease; }
.w-pop-book-form .btn-type02 .overlay{ display:none !important; }
.w-pop-book-form .btn-type02 .text{ color:#fff !important; }
.w-pop-book-form .btn-type02:hover{ background:#BC9950 !important; background-image:none !important; color:#3A1620 !important; }
.w-pop-book-form .btn-type02:hover .text{ color:#3A1620 !important; }
.w-pop-book-form .btn-type02:active{ background:#A07E38 !important; background-image:none !important; color:#3A1620 !important; }
.w-pop-book-form .btn-type02:active .text{ color:#3A1620 !important; }
.w-pop-book-form .btn-type02:focus-visible{ outline:none; box-shadow:0 0 0 3px rgba(188,153,80,.45); }
/* TZ#4: убрать отступы тёмной полосы шапки (по запросу) */
.col-header-nav { padding-top: 0 !important; padding-bottom: 0 !important; }
/* T9: FAQ/content headings — H3/H4 left (theme h1..h6{text-align:center} centers H4 questions) */
.text-content h3,
.text-content h4 { text-align: left; }
/* TZ: Header — staggered fade of the 4 top utility links tied to the slim header (2026-06-27)
The 4 top links (Hospitality Tickets/Hotel Booking/Concierge/Sign Up) fade out one-by-one
when the theme is in slim mode (fcc-slim), and fade back in the same way at the top.
We do NOT collapse the menu's width — the links keep their box, so logo/phone never shift
and no white band appears; the middle simply becomes empty space.
Rollback: revert these rules + restore the deleted inline script. */
/* Animate the 4 top links per item; keep their box so logo/phone never shift.
Delays are on the base rule so BOTH hide and show stagger left-to-right. */
header.s-header ul.main-menu:not(.tablet-hide):not(.tablet-shown) > li{
transition: opacity .55s ease, transform .55s ease; /* "Slow" */
}
header.s-header ul.main-menu:not(.tablet-hide):not(.tablet-shown) > li:nth-child(1){ transition-delay: 0s; }
header.s-header ul.main-menu:not(.tablet-hide):not(.tablet-shown) > li:nth-child(2){ transition-delay: .07s; }
header.s-header ul.main-menu:not(.tablet-hide):not(.tablet-shown) > li:nth-child(3){ transition-delay: .14s; }
header.s-header ul.main-menu:not(.tablet-hide):not(.tablet-shown) > li:nth-child(4){ transition-delay: .21s; }
/* Slim state: fade + rise, staggered (the bottom nav already collapses via the theme's fcc-slim) */
header.s-header.fcc-slim ul.main-menu:not(.tablet-hide):not(.tablet-shown) > li{
opacity: 0;
transform: translateY(-10px);
pointer-events: none;
}
/* Accessibility: reduced motion — still fades, but no transform */
@media (prefers-reduced-motion: reduce){
header.s-header ul.main-menu:not(.tablet-hide):not(.tablet-shown) > li{ transition: opacity .3s ease; transform: none; }
header.s-header.fcc-slim ul.main-menu:not(.tablet-hide):not(.tablet-shown) > li{ transform: none; }
}
/* ===== FCC mobile fix: content price tables (hotel transfer tables) =====
Transfer tables on mobile: full width of the content column, no clipping.
Scoped strictly to .text-content table, only <=767px. Desktop unaffected. */
@media (max-width: 767px) {
/* Full-width table: fills the column from left to right edge
(overrides any theme rule that shrinks the table on mobile) */
.text-content table {
width: 100% !important;
display: table !important;
table-layout: auto !important;
}
/* Smaller padding and font so all 4 columns fit WITHOUT overflow */
.text-content table th,
.text-content table td {
padding: 6px 8px !important;
font-size: 0.85rem !important;
}
/* Long headings ("Hourly (from)") wrap instead of widening the column */
.text-content table th {
white-space: normal !important;
}
}
/* ===== FCC: unified FAQ question style across the whole site =====
FAQ questions are
inside .text-content.
The global rule renders in UPPERCASE; here we restore sentence case,
bold weight and size as on the reference pages (hotels/services). */
.text-content h4 {
text-transform: none !important; /* remove the global UPPERCASE */
font-weight: 700 !important; /* bold, as on the reference */
font-size: 1.1em !important; /* same size as hotel FAQ questions */
text-align: left !important;
margin-bottom: 0.5em;
}
/* ============================================
HEADER MAIN MENU LAYOUT FIX
Added 2026-07-13 (TZ: fix header main menu)
Scope: desktop inline menu (.tablet-hide) ONLY.
Does NOT change justify-content or item padding
(keeps space between item text and dropdown caret).
Overrides app build, so !important is required.
============================================ */
/* 1. No wrap / no overlap: desktop menu stays on one line */
.row-header .col-header-nav ul.main-menu.tablet-hide { flex-wrap: nowrap !important; }
/* 2. No jump when opening dropdowns (reserve scrollbar space) */
html { scrollbar-gutter: stable; }
/* 5. Restore dropdown-caret gap on desktop (TZ 2026-07-14) */
.row-header .col-header-nav ul.main-menu.tablet-hide li.li-dropper > .__link { padding-right: 25px !important; }
/* SMOOTH PAGE-TO-PAGE LOADING (owner 2026-07-14): browser-native cross-document view
transitions. On same-site navigation the browser keeps showing the OLD page until the
new one is ready, then cross-fades — no white flash. The fixed header is named as its
own transition group: identical on both pages, so it appears to STAY PUT while only
the content underneath changes. Chrome/Edge/newer Safari; other browsers simply do a
normal page load (graceful fallback). Pure CSS — no script behaviour is touched. */
@view-transition { navigation: auto; }
.s-header { view-transition-name: fcc-header; }
@media (prefers-reduced-motion: reduce) {
@view-transition { navigation: none; }
}
/* TRUSTPILOT PAID WIDGET RETIRED (owner 2026-07-15): the floating widget is injected by
Google Tag Manager, not our templates — kill it site-wide until the GTM tag is removed.
Our own badge (includes/tp-badge.blade.php) replaces all embedded widgets. */
#trustpilot-gtm-floating-wrapper{display:none !important;}
/* ============================================================================
AI CHAT RETIRED SITE-WIDE (owner 2026-07-21) — KEPT DORMANT FOR FUTURE USE.
The chatbot is a Google Dialogflow "df-messenger" (project-e0be1b2c-d3e6-4b33-95a,
agent e4b048cf-f9e6-4f25-9cfc-72d5656a2f07). Its loader + element live in the admin
DB: settings table row 3 (data_key "analytics", the "in_head" value) together with
the "please request your quote here" caption (#fc-chat-hint) and the homepage-only
logic. Everything still loads — only THIS rule hides it.
TO REVIVE: delete the one rule below (and optionally re-scope to desktop with a
min-width media query). The white/black theme block underneath stays ready. */
df-messenger:not(#fc_dormant),
df-messenger-chat-bubble:not(#fc_dormant),
#fc-chat-hint:not(#fc_dormant){display:none !important;}
/* ^ :not(#fc_dormant) is a specificity booster only (no such id exists): it lends each
selector an ID level, so this rule beats the CMS homepage force-show
(body.fc-is-home …{display:block !important}) everywhere.
DO NOT scope this with body classes. History: until 2026-07-21 the in_head chat markup
(, the caption div) was flow content inside , so the parser opened
an implicit classless and the real body tag's class was ignored site-wide. The
head is clean now (FC_CHAT_DOM script-injects those elements), but the theme's "new"
class stays DELIBERATELY un-rendered — its CSS rules have been dead for years and the
approved look was built without them. body.new still never matches. */
/* AI chat in the house style (owner 2026-07-21): MODERN WHITE + thin black contour.
Bubble: white round, 1px black line, thin black chat icon. Window: white titlebar with
black text (no blue anywhere), neutral greys for messages, black send icon, gold focus.
html-prefixed so the widget defaults and the CMS-injected vars can never outrank it. */
html df-messenger{
--df-messenger-primary-color:#1a1a1a;
--df-messenger-focus-color:#BC9950;
--df-messenger-titlebar-background:#ffffff;
--df-messenger-titlebar-font-color:#1a1a1a;
--df-messenger-titlebar-icon-color:#1a1a1a;
--df-messenger-chat-background:#ffffff;
--df-messenger-chat-border:1px solid #1a1a1a;
--df-messenger-chat-border-radius:14px;
--df-messenger-message-bot-background:#f5f5f4;
--df-messenger-message-bot-font-color:#1a1a1a;
--df-messenger-message-user-background:#eeedeb;
--df-messenger-message-user-font-color:#1a1a1a;
--df-messenger-send-icon-color:#1a1a1a;
--df-messenger-input-background:#ffffff;
--df-messenger-input-font-color:#1a1a1a;
--df-messenger-chat-bubble-background:#ffffff;
--df-messenger-chat-bubble-background-hover:#f4f4f4;
--df-messenger-chat-bubble-icon-color:#1a1a1a;
--df-messenger-chat-bubble-border:1px solid #1a1a1a;
--df-messenger-chat-bubble-border-radius:50%;
}