/*!
Theme Name: Let Me Cab
Theme URI: http://underscores.me/
Author: Web Emporium
Author URI: https://webemporium.in/
Description: Let Me Cab\'s official website
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: let-me-cab
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Let Me Cab is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	- Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Generic
--------------------------------------------------------------*/

/* Normalize
--------------------------------------------- */

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
	 ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
html {
	line-height: 1.15;
	-webkit-text-size-adjust: 100%;
}

/* Sections
	 ========================================================================== */

/**
 * Remove the margin in all browsers.
 */
body {
	margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */
main {
	display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
	font-size: 2em;
	margin: 0.67em 0;
}

/* Grouping content
	 ========================================================================== */

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
	box-sizing: content-box;
	height: 0;
	overflow: visible;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
	font-family: monospace, monospace;
	font-size: 1em;
}

/* Text-level semantics
	 ========================================================================== */

/**
 * Remove the gray background on active links in IE 10.
 */
a {
	background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
	border-bottom: none;
	text-decoration: underline;
	text-decoration: underline dotted;
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
	font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
	font-family: monospace, monospace;
	font-size: 1em;
}

/**
 * Add the correct font size in all browsers.
 */
small {
	font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sub {
	bottom: -0.25em;
}

sup {
	top: -0.5em;
}

/* Embedded content
	 ========================================================================== */

/**
 * Remove the border on images inside links in IE 10.
 */
img {
	border-style: none;
}

/* Forms
	 ========================================================================== */

/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
	font-family: inherit;
	font-size: 100%;
	line-height: 1.15;
	margin: 0;
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
	overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
	text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type="button"],
[type="reset"],
[type="submit"] {
	-webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
	border-style: none;
	padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
	outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */
fieldset {
	padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *		`fieldset` elements in all browsers.
 */
legend {
	box-sizing: border-box;
	color: inherit;
	display: table;
	max-width: 100%;
	padding: 0;
	white-space: normal;
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
	vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
	overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
[type="checkbox"],
[type="radio"] {
	box-sizing: border-box;
	padding: 0;
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
	height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type="search"] {
	-webkit-appearance: textfield;
	outline-offset: -2px;
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
	-webkit-appearance: button;
	font: inherit;
}

/* Interactive
	 ========================================================================== */

/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
	display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
	display: list-item;
}

/* Misc
	 ========================================================================== */

/**
 * Add the correct display in IE 10+.
 */
template {
	display: none;
}

/**
 * Add the correct display in IE 10.
 */
[hidden] {
	display: none;
}

/* Box sizing
--------------------------------------------- */

/* Inherit box-sizing to more easily change it's value on a component level.
@link http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
*,
*::before,
*::after {
	box-sizing: inherit;
}

html {
	box-sizing: border-box;
}

/*--------------------------------------------------------------
# Base
--------------------------------------------------------------*/

/* Typography
--------------------------------------------- */
body,
button,
input,
select,
optgroup,
textarea {
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	font-size: 1rem;
	line-height: 1.5;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	clear: both;
}

p {
	margin-bottom: 1.5em;
}

dfn,
cite,
em,
i {
	font-style: italic;
}

blockquote {
	margin: 0 1.5em;
}

address {
	margin: 0 0 1.5em;
}

pre {
	background: #eee;
	font-family: "Courier 10 Pitch", courier, monospace;
	line-height: 1.6;
	margin-bottom: 1.6em;
	max-width: 100%;
	overflow: auto;
	padding: 1.6em;
}

code,
kbd,
tt,
var {
	font-family: monaco, consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
}

abbr,
acronym {
	border-bottom: 1px dotted #666;
	cursor: help;
}

mark,
ins {
	background: #fff9c0;
	text-decoration: none;
}

big {
	font-size: 125%;
}

/* Elements
--------------------------------------------- */
body {
	background: #fff;
}

hr {
	background-color: #ccc;
	border: 0;
	height: 1px;
	margin-bottom: 1.5em;
}

ul,
ol {
}

ul {
	list-style: disc;
}

ol {
	list-style: decimal;
}

li > ul,
li > ol {
	margin-bottom: 0;
	margin-left: 1.5em;
}

dt {
	font-weight: 700;
}

dd {
	margin: 0 1.5em 1.5em;
}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
	max-width: 100%;
}

img {
	height: auto;
	max-width: 100%;
}

figure {
	margin: 1em 0;
}

table {
	margin: 0 0 1.5em;
	width: 100%;
}

/* Links
--------------------------------------------- */
a {
	color: #4169e1;
}



a:hover,
a:focus,
a:active {
}

a:focus {
	outline: thin dotted;
}

a:hover,
a:active {
	outline: 0;
}

/* Forms
--------------------------------------------- */
button,
input[type="button"],
input[type="reset"], {
	border: 1px solid;
	border-color: #ccc #ccc #bbb;
	border-radius: 3px;
	background: #e6e6e6;
	color: rgba(0, 0, 0, 0.8);
	line-height: 1;
	padding: 0.6em 1em 0.4em;
}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
	border-color: #ccc #bbb #aaa;
}

button:active,
button:focus,
input[type="button"]:active,
input[type="button"]:focus,
input[type="reset"]:active,
input[type="reset"]:focus,
input[type="submit"]:active,
input[type="submit"]:focus {
	border-color: #aaa #bbb #bbb;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
	color: #666;
	border: 1px solid #ccc;
	border-radius: 3px;
	padding: 3px;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
	color: #111;
}

select {
	border: 1px solid #ccc;
}

textarea {
	width: 100%;
}

/*--------------------------------------------------------------
# Layouts
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Components
--------------------------------------------------------------*/

/* Navigation
--------------------------------------------- */
.main-navigation {
	display: block;
	width: 100%;
}

.main-navigation ul {
	display: none;
	list-style: none;
	margin: 0;
	padding-left: 0;
}

.main-navigation ul ul {
	box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
	float: left;
	position: absolute;
	top: 100%;
	left: -999em;
	z-index: 99999;
}

.main-navigation ul ul ul {
	left: -999em;
	top: 0;
}

.main-navigation ul ul li:hover > ul,
.main-navigation ul ul li.focus > ul {
	display: block;
	left: auto;
}

.main-navigation ul ul a {
	width: 200px;
}

.main-navigation ul li:hover > ul,
.main-navigation ul li.focus > ul {
	left: auto;
}

.main-navigation li {
	position: relative;
}

.main-navigation a {
	display: block;
	text-decoration: none;
}

/* Small menu. */
.menu-toggle,
.main-navigation.toggled ul {
	display: block;
}

@media screen and (min-width: 37.5em) {

	.menu-toggle {
		display: none;
	}

	.main-navigation ul {
		display: flex;
	}
}

.site-main .comment-navigation,
.site-main
.posts-navigation,
.site-main
.post-navigation {
	margin: 0 0 1.5em;
}

.comment-navigation .nav-links,
.posts-navigation .nav-links,
.post-navigation .nav-links {
	display: flex;
}

.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
	flex: 1 0 50%;
}

.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
	text-align: end;
	flex: 1 0 50%;
}

/* Posts and pages
--------------------------------------------- */
.sticky {
	display: block;
}

.post,
.page {
	margin: 0 0 1.5em;
}

.updated:not(.published) {
	display: none;
}

.page-content,
.entry-content,
.entry-summary {
	margin: 1.5em 0 0;
}

.page-links {
	clear: both;
	margin: 0 0 1.5em;
}

/* Comments
--------------------------------------------- */
.comment-content a {
	word-wrap: break-word;
}

.bypostauthor {
	display: block;
}

/* Widgets
--------------------------------------------- */
.widget {
	margin: 0 0 1.5em;
}

.widget select {
	max-width: 100%;
}

/* Media
--------------------------------------------- */
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
	border: none;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}

/* Make sure logo link wraps around logo image. */
.custom-logo-link {
	display: inline-block;
}

/* Captions
--------------------------------------------- */
.wp-caption {
	margin-bottom: 1.5em;
	max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.wp-caption .wp-caption-text {
	margin: 0.8075em 0;
}

.wp-caption-text {
	text-align: center;
}

/* Galleries
--------------------------------------------- */
.gallery {
	margin-bottom: 1.5em;
	display: grid;
	grid-gap: 1.5em;
}

.gallery-item {
	display: inline-block;
	text-align: center;
	width: 100%;
}

.gallery-columns-2 {
	grid-template-columns: repeat(2, 1fr);
}

.gallery-columns-3 {
	grid-template-columns: repeat(3, 1fr);
}

.gallery-columns-4 {
	grid-template-columns: repeat(4, 1fr);
}

.gallery-columns-5 {
	grid-template-columns: repeat(5, 1fr);
}

.gallery-columns-6 {
	grid-template-columns: repeat(6, 1fr);
}

.gallery-columns-7 {
	grid-template-columns: repeat(7, 1fr);
}

.gallery-columns-8 {
	grid-template-columns: repeat(8, 1fr);
}

.gallery-columns-9 {
	grid-template-columns: repeat(9, 1fr);
}

.gallery-caption {
	display: block;
}

/*--------------------------------------------------------------
# Plugins
--------------------------------------------------------------*/

/* Jetpack infinite scroll
--------------------------------------------- */

/* Hide the Posts Navigation and the Footer when Infinite Scroll is in use. */
.infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer {
	display: none;
}

/* Re-display the Theme Footer when Infinite Scroll has reached its end. */
.infinity-end.neverending .site-footer {
	display: block;
}

/*--------------------------------------------------------------
# Utilities
--------------------------------------------------------------*/

/* Accessibility
--------------------------------------------- */

/* Text meant only for screen readers. */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	clip-path: none;
	color: #21759b;
	display: block;
	font-size: 0.875rem;
	font-weight: 700;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
}

/* Do not show the outline on the skip link target. */
#primary[tabindex="-1"]:focus {
	outline: 0;
}

/* Alignments
--------------------------------------------- */
.alignleft {

	/*rtl:ignore*/
	float: left;

	/*rtl:ignore*/
	margin-right: 1.5em;
	margin-bottom: 1.5em;
}

.alignright {

	/*rtl:ignore*/
	float: right;

	/*rtl:ignore*/
	margin-left: 1.5em;
	margin-bottom: 1.5em;
}

.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 1.5em;
}






/* CODE BY ME*/

:root {
    --bg-dark: #1a1a1a;
    --text-white: #ffffff;
    --text-gray: #a0a0a0;
    --text-dark: #111111;
    --accent-orange: #FFC000;
    --accent-hover: #e0a800;
    --font-main: 'Inter', sans-serif;
    --container-max-width: 1400px;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: var(--font-main);
    background-color: #f9f9f9;
    color: var(--text-dark);
    overflow-x: hidden;
}

/* Navbar */
.navbar {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    max-width: var(--container-max-width);
    padding: 42px 50px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    z-index: 100;
}

.logo img {
    width: 131px;
    padding-top: 20px;
}

.nav-links {
    display: flex;
    align-items: center;
    gap: 30px;
}

.menu-primary-menu-container ul {
    display: flex;
    gap: 30px;
	list-style-type: none;
}


.nav-links a {
    text-decoration: none;
    color: var(--text-white);
    font-size: 14px;
    font-weight: 500;
    opacity: 0.9;
    transition: opacity 0.3s;
}

.nav-links a:hover {
    opacity: 1;
}

.btn-contact {
    background: #fff;
    color: #000 !important;
    padding: 10px 20px;
    border-radius: 30px;
    font-weight: 700 !important;
    display: flex;
    align-items: center;
    gap: 8px;
}

.icon-arrow {
    background: #000;
    color: white;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 10px;
}

/* Hero Section */
.hero {
    position: relative;
    margin: 10px auto;
    width: calc(100% - 40px);
    /* max-width: var(--container-max-width); Removed to allow almost full width */
    min-height: 90vh;
    background-color: #1e1e1e;
    /* Kept background image on main hero as established in form step, but reverted display to flex */
    background: url('https://letmecab.com/wp-content/uploads/2026/02/hero-bg.jpg') no-repeat center center/cover;
    display: block;
    /* Changed to block so inner container governs internal layout */
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
    z-index: 1;
}

.hero-inner-container {
    display: flex;
    width: 100%;
    max-width: var(--container-max-width);
    margin: 0 auto;
    height: 100%;
    min-height: 90vh;
    align-items: center;
    /* Vertically center content if desired, or flex-start */
}

.hero-content {
    flex: 1;
    padding-top: 80px;
    background: linear-gradient(90deg, #181818 0%, rgba(24, 24, 24, 0.9) 60%, transparent 100%);
    z-index: 2;
    color: white;
    display: flex;
    justify-content: center;
    /* Centers the inner container horizontally */
}

.hero-text-container {
    width: 100%;
    padding-left: 50px;
    padding-bottom: 35px;
}

.hero h1 {
    font-size: 3.8rem;
    line-height: 1.1;
    margin-bottom: 40px;
    font-weight: 600;
    letter-spacing: -0.5px;
}
a.btn-footer-cta:hover {
    background: var(--accent-orange);
}
.btn-primary {
    display: inline-flex;
    align-items: center;
    gap: 15px;
    background-color: #fff;
    color: #000;
    padding: 12px 30px;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 700;
    font-size: 16px;
    text-transform: uppercase;
    transition: transform 0.2s;
}

.btn-primary:hover {
    transform: scale(1.05);
    background: #000;
    color: #fff;
}

.btn-primary:hover .icon-arrow-circle {
    background: var(--accent-orange);
    color: #000;
}

.icon-arrow-circle {
    background: #000;
    color: white;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 14px;
    transition: background 0.3s, color 0.3s;
}

.hero-description {
    margin-top: 60px;
    border-left: 3px solid rgba(255, 255, 255, 0.2);
    padding-left: 25px;
}

.hero-description p {
    color: #e0e0e0;
    font-size: 16px;
    line-height: 1.6;
}

/* Hero Image Container - Now holds the Form */
.hero-image-container {
    position: relative;
    /* Changed from absolute to relative for flex layout */
    width: 45%;
    /* Fixed width for form area */
    display: flex;
    justify-content: center;
    align-items: center;
    padding-right: 50px;
}

.hero-bg-img {
    display: none;
    /* Hide background image as requested, or keep as background? User said "hero section text and all other elements except background image". Wait, previously I had a full width background.  */
}

/* Re-apply background image to the main hero container if needed, or maybe the user meant KEEP the background image but place form on top? 
   User said: "opposite of the text and button". 
   Structure: Text (Left) - Form (Right). Background should cover both.
*/

.hero {
    /* Ensure background image is on the main container now since we removed the img tag */
    background: url('<?php the_field('hero_section_banner_image_background'); ?>') no-repeat center center/cover;
    /* Overlay */
    position: relative;
    z-index: 1;
}

.hero::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, #181818 0%, rgba(24, 24, 24, 0.9) 50%, rgba(24, 24, 24, 0.6) 100%);
    z-index: -1;
}

/* Booking Form Styles */
.booking-form-card {
    background: white;
    padding: 20px;
    border-radius: 20px;
    width: 100%;
    max-width: 450px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
	    margin-top: 100px;
}

.form-tabs {
    display: flex;
    gap: 8px;
    margin-bottom: 15px;
    border-bottom: 1px solid #eee;
    padding-bottom: 10px;
}

.form-tab {
    flex: 1;
    padding: 8px;
    border: none;
    background: #000;
    /* Matching button black */
    color: white;
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
    border-radius: 5px;
    text-transform: uppercase;
}

.form-tab.active {
    background: white;
    color: #000;
    border: 1px solid #ddd;
}

.booking-form-card h3 {
    text-align: center;
    margin-bottom: 20px;
    font-size: 1.2rem;
    color: #111;
}

.form-group {
    margin-bottom: 15px;
}

.form-group label {
    display: block;
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 8px;
    color: #333;
}

.form-group input {
    width: 100%;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 30px;
    /* Rounded inputs like screenshot */
    font-size: 13px;
    outline: none;
}

.form-row {
    display: flex;
    gap: 15px;
}

.form-row .form-group {
    flex: 1;
}

.btn-check-rates {
    width: 100%;
    padding: 15px;
    background: var(--accent-orange);
    color: #000;
    border: none;
    border-radius: 5px;
    font-weight: 700;
    font-size: 16px;
    cursor: pointer;
    margin-top: 10px;
    transition: background 0.3s;
}

.btn-check-rates:hover {
    background: #000;
    color: #fff;
}

/* Feature Section */
.feature-section {
    display: flex;
    padding: 88px 50px;
    gap: 60px;
    align-items: center;
    background: #fff;
    width: 100%;
    max-width: var(--container-max-width);
    margin: 0 auto;
    margin-top: 29px;
    border-radius: 30px;
}

.feature-image {
    flex: 1;
    border-radius: 20px;
    overflow: hidden;
}

.feature-image img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 20px;
}

.feature-content {
    flex: 1;
}

.subtitle {
    color: black;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    display: block;
    margin-bottom: 15px;
}

.feature-content h2 {
    font-size: 3rem;
    font-weight: 600;
    line-height: 1.2;
    margin-bottom: 30px;
    color: #111;
}

.feature-content p {
    color: #666;
    line-height: 1.6;
    margin-bottom: 40px;
    max-width: 90%;
}

.btn-secondary {
    display: inline-flex;
    align-items: center;
    gap: 15px;
    background: var(--accent-orange);
    color: #000;
    padding: 15px 30px;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    box-shadow: 0 5px 15px rgba(255, 94, 20, 0.3);
    transition: background 0.3s;
}

.btn-secondary:hover {
    background: #000;
    color: #fff;
}

/* Process Section */
.process-section {
    padding: 100px 50px;
    max-width: var(--container-max-width);
    margin: 0 auto;
}

.process-header {
    margin-bottom: 60px;
    max-width: 600px;
}

.process-header h2 {
    font-size: 2.5rem;
    font-weight: 600;
    margin-bottom: 20px;
}

.section-desc {
    color: #666;
    line-height: 1.6;
}

.process-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 40px;
}

.process-card {
    padding: 30px;
    background: #fff;
    border-radius: 20px;
    /* Could add boundary or border if needed */
}

.process-card h3 {
    font-size: 1.2rem;
    margin-bottom: 15px;
    position: relative;
    padding-left: 20px;
}

.process-card h3::before {
    content: '';
    position: absolute;
    left: 0;
    top: 6px;
    width: 6px;
    height: 6px;
    background: #000;
    border-radius: 50%;
}

.process-card p {
    color: #666;
    font-size: 14px;
    line-height: 1.6;
}

/* Services Section */
.services-section {
    padding: 100px 50px;
    max-width: var(--container-max-width);
    margin: 0 auto;
}

.services-header h2 {
    font-size: 2.5rem;
    font-weight: 600;
    margin-bottom: 60px;
}

.services-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 30px;
}

.service-card {
    background: #fff;
    border-radius: 20px;
    overflow: hidden;
    transition: transform 0.3s;
}

.service-card:hover {
    transform: translateY(-5px);
}

.service-image {
    position: relative;
    height: 350px;
    overflow: hidden;
    border-radius: 20px 20px 0 0;
    /* Only top or all based on design, sticking to 20 for now */
}

.service-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s;
}

.service-card:hover .service-image img {
    transform: scale(1.1);
}

.discount-badge {
    position: absolute;
    top: 20px;
    right: 20px;
    background: #fff;
    color: #111;
    font-weight: 700;
    font-size: 12px;
    padding: 8px 15px;
    border-radius: 20px;
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
}

.service-info {
    padding: 22px 22px;
}

.service-info h3 {
    font-size: 1.25rem;
    margin-bottom: 10px;
}

.service-info p {
    color: #666;
    font-size: 14px;
    margin-bottom: 20px;
}

.btn-text {
    text-decoration: none;
    color: #111;
    font-weight: 600;
    font-size: 14px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.icon-arrow-small {
    background: #111;
    color: white;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 10px;
    transition: background 0.3s;
}

.btn-text:hover .icon-arrow-small {
    background: #000;
}

/* Responsive */
@media (max-width: 900px) {
    .navbar {
        width: 100%;
        padding: 20px;
    }

    .hero {
        flex-direction: column;
        width: 100%;
        margin: 0;
        border-radius: 0;
        height: auto;
        min-height: auto;
    }

    .hero-content {
        padding: 100px 20px 50px;
        background: #181818;
    }

    .hero-image-container {
        position: relative;
        width: 100%;
        height: 300px;
    }

    .hero-bg-img {
        mask-image: none;
        -webkit-mask-image: none;
    }

    .hero h1 {
        font-size: 2.5rem;
    }

    .feature-section {
        flex-direction: column;
        padding: 50px 20px;
    }

    .process-section,
    .services-section {
        padding: 50px 20px;
    }
}

/* Testimonials */
.testimonials-section {
    padding: 100px 50px;
    max-width: var(--container-max-width);
    margin: 0 auto;
}

.testimonials-header h2 {
    font-size: 2.5rem;
    font-weight: 600;
    margin-bottom: 60px;
}

.testimonials-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 40px;
}

.testimonial-card {
    background: #fff;
    padding: 30px;
    border-radius: 20px;
    border: 1px solid #eee;
}

.client-meta {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 20px;
}

.client-meta img {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    object-fit: cover;
}

.client-meta h4 {
    font-size: 1rem;
    margin-bottom: 5px;
}

.client-meta span {
    font-size: 12px;
    color: #888;
}

.testimonial-card p {
    color: #444;
    line-height: 1.6;
    font-style: italic;
}

/* Footer */
/* Footer */
.footer {
    background: #000;
    padding: 80px 50px 40px;
    color: white;
    margin-top: 100px;
    border-radius: 30px 30px 30px 30px;
    margin: 10px 20px;
}

.footer-container {
    max-width: var(--container-max-width);
    margin: 0 auto;
}

.footer-top {
    display: flex;
    justify-content: space-between;
    gap: 60px;
    padding-bottom: 60px;
    position: relative;
}

.footer-left,
.footer-right {
    flex: 1;
}

.footer-logo {
    margin-bottom: 30px;
}

.footer-logo-img {
    height: 70px;
    /* Increased size as requested */
    width: auto;
}

.footer-heading {
    font-size: 2rem;
    font-weight: 600;
    margin-bottom: 20px;
    line-height: 1.3;
}

.footer-desc {
    color: #999;
    line-height: 1.6;
    margin-bottom: 40px;
    max-width: 400px;
}

.footer-partners {
    display: flex;
    gap: 30px;
    align-items: center;
}

.partner-logo {
    color: #555;
    font-weight: 700;
    font-size: 0.9rem;
    letter-spacing: 1px;
}

.footer-divider {
    width: 1px;
    background: #333;
    /* Vertical line handled by border on parent or pseudo element? 
       Using specific div gives clear control */
}

.btn-footer-cta {
    display: inline-flex;
    align-items: center;
    gap: 15px;
    background-color: #fff;
    color: #000;
    padding: 15px 30px;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
}

.icon-arrow-circle-orange {
    background: #000;
    color: white;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 12px;
}

/* Horizontal Separator */
.footer-logo img {
    width: 131px;
}
.footer-separator {
    height: 1px;
    background: #333;
    margin-bottom: 40px;
}

.footer-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.footer-nav {
    display: flex;
    gap: 30px;
}

.footer-nav a {
    color: #999;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    transition: color 0.3s;
}

.footer-nav a:hover {
    color: white;
}

.footer-copyright {
    color: #555;
    font-size: 14px;
}

/* Responsive Footer */
@media (max-width: 900px) {
    .footer-top {
        flex-direction: column;
        gap: 40px;
    }

    .footer-divider {
        display: none;
    }

    .footer-bottom {
        flex-direction: column;
        gap: 30px;
        align-items: flex-start;
    }

    .footer-nav {
        flex-wrap: wrap;
        gap: 20px;
    }
}

/* Our Cabs Section */
.our-cabs-section {
    padding: 80px 50px;
    max-width: var(--container-max-width);
    margin: 0 auto;
    background-color: #f9f9f9;
}

.section-header-center {
    text-align: center;
    margin-bottom: 50px;
}

.section-header-center h2 {
    font-size: 2.5rem;
    font-weight: 600;
    color: black;
    text-align: left;
}

.cabs-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.cab-card {
    background: #ffff;
    border-radius: 20px;
    padding: 30px 20px;
    text-align: left;
    transition: transform 0.3s, box-shadow 0.3s;
}

.cab-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}

.cab-image {
    height: 300px;
    width: 100%;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 5px;
    background: white;
}

.cab-image img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.cab-card h3 {
    font-size: 1.1rem;
    font-weight: 700;
    color: #000;
    text-transform: uppercase;
    margin-bottom: 20px;
    letter-spacing: 0.5px;
}

.btn-book-cab {
    display: inline-block;
    background: var(--accent-orange);
    color: #000;
    padding: 10px 25px;
    text-decoration: none;
    font-weight: 600;
    font-size: 14px;
    border-radius: 5px;
    text-transform: uppercase;
    transition: background 0.3s;
}

.btn-book-cab:hover {
    background: #000;
    color: #fff;
}

.cab-card-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 15px;
}

.price-text {
    font-size: 13px;
    font-weight: 700;
    color: #333;
    letter-spacing: 0.5px;
}

.cab-features {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 15px;
    margin-bottom: 20px;
    color: #555;
    font-size: 14px;
    font-weight: 500;
}

.feature-item {
    display: flex;
    align-items: center;
    gap: 6px;
}

.feature-icon svg {
    width: 18px;
    height: 18px;
    fill: var(--accent-orange);
    color: var(--accent-orange);
}

.feature-divider {
    width: 1px;
    height: 15px;
    background-color: #ddd;
}

/* Responsive adjustments for Our Cabs */
@media (max-width: 768px) {
    .our-cabs-section {
        padding: 50px 20px;
    }

    .cabs-grid {
        grid-template-columns: 1fr;
    }
}

/* --- Multi-Page Expansion Styles --- */

/* Page Hero Section */
.page-hero {
    position: relative;
    width: 100%;
    height: 60vh;
    min-height: 400px;
    background-image: url('https://images.unsplash.com/photo-1449965408869-eaa3f722e40d?auto=format&fit=crop&q=80&w=1600');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
    justify-content: center;
    /* Center the content container */
    color: white;
    margin-top: -80px;
    padding-top: 80px;
    /* Keep vertical padding */
}

.hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1;
}

.page-hero-content {
    position: relative;
    z-index: 2;
    text-align: left;
    width: 100%;
    max-width: 1400px;
    /* Match navbar max-width */
    padding: 0 50px;
    /* Match navbar padding */
}

.page-hero-content h1 {
    font-size: 4rem;
    font-weight: 700;
    margin-bottom: 20px;
}

.page-hero-content p {
    font-size: 1.2rem;
    line-height: 1.6;
    opacity: 0.9;
}

/* Specific Page Hero Backgrounds */
.page-hero-about {
    background-image: url('https://letmecab.com/wp-content/uploads/2026/02/services-banner-image.jpg');
}

.page-hero-services {
    background-image: url('https://letmecab.com/wp-content/uploads/2026/02/about-us-banner-image.jpg');
}

.page-hero-fleet {
    background-image: url('https://letmecab.com/wp-content/uploads/2026/02/our-fleets-banner-image.jpg');
}

.page-hero-tours {
    background-image: url('https://letmecab.com/wp-content/uploads/2026/02/tour-packages-banner-image.jpg');
}

.page-hero-contact {
    background-image: url('https://letmecab.com/wp-content/uploads/2026/02/contact-us-banner-image.jpg');
}

/* About Split Section */
.about-split-section {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding: 80px 50px;
    gap: 50px;
    background-color: #fff;
    max-width: 1400px;
    margin: 50px auto;
    width: 100%;
    border-radius: 35px;
}

.about-content {
    flex: 1;
    min-width: 300px;
}

.about-content h2 {
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 20px;
    color: var(--text-dark);
}

.about-content p {
    font-size: 1rem;
    line-height: 1.8;
    color: var(--text-light);
    margin-bottom: 20px;
}

.about-image {
    flex: 1;
    min-width: 300px;
    height: 500px;
    border-radius: 20px;
    overflow: hidden;
}

.about-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.about-image:hover img {
    transform: scale(1.05);
}

/* Contact Page Section */
.contact-page-section {
    display: flex;
    flex-wrap: wrap;
    padding: 80px 50px;
    gap: 50px;
    background-color: #f9f9f9;
    width: 100%;
    max-width: var(--container-max-width);
    margin: 0 auto;
}

.contact-form-container {
    flex: 1;
    min-width: 300px;
    background: white;
    padding: 40px;
    border-radius: 20px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}

.contact-info-container {
    flex: 1;
    min-width: 300px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.contact-info-container h2 {
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 20px;
}

.contact-info-container p {
    margin-bottom: 40px;
    color: var(--text-light);
    line-height: 1.6;
}

.info-item {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
}

.info-icon {
    width: 40px;
    height: 40px;
    background: rgba(255, 69, 0, 0.1);
    color: #000;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 15px;
    font-size: 1.2rem;
}

/* Contact Form Styles */
.contact-form-group {
    margin-bottom: 20px;
}

.contact-form-group label {
    display: block;
    margin-bottom: 8px;
    font-weight: 500;
    color: var(--text-dark);
}

.contact-form-group input,
.contact-form-group select,
.contact-form-group textarea {
    width: 100%;
    padding: 12px 15px;
    border: 1px solid #ddd;
    border-radius: 8px;
    font-family: inherit;
    font-size: 1rem;
    background: #fdfdfd;
}

.contact-form-group input:focus,
.contact-form-group select:focus,
.contact-form-group textarea:focus {
    outline: none;
    border-color: var(--accent-orange);
}

.btn-submit {
    background: var(--accent-orange);
    color: white;
    padding: 12px 30px;
    border: none;
    border-radius: 50px;
    font-weight: 600;
    cursor: pointer;
    width: 100%;
    font-size: 1rem;
    transition: background 0.3s;
}

.btn-submit:hover {
    background: #e03e00;
}

/* Map Section */
.map-section {
    width: 100%;
    max-width: var(--container-max-width);
    margin: 0 auto 50px auto;
    height: 400px;
}

.map-section iframe {
    width: 100%;
    height: 100%;
    border: 0;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .page-hero-content h1 {
        font-size: 2.5rem;
    }

    .about-split-section,
    .contact-page-section {
        flex-direction: column;
        padding: 50px 20px;
    }

    .about-image {
        height: 300px;
        width: 100%;
    }
}

/* Tour Package Price Formatting */
.price-text-container {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    line-height: 1.2;
}

.price-label {
    font-size: 13px;
    font-weight: 500;
    color: #555;
    text-transform: capitalize;
}

.price-amount {
    font-size: 21px;
    font-weight: 700;
    color: #000;
    margin-top: 2px;
}

/* --- Responsive Adjustments for 760px and 420px --- */

/* 760px Breakpoint (incorporating into existing 768px logic where suitable, or adding specific overrides) */
/* --- Responsive Adjustments for 760px and 420px --- */

/* Hamburger Menu Styling */
.hamburger {
    display: none;
    cursor: pointer;
    flex-direction: column;
    justify-content: space-between;
    width: 30px;
    height: 21px;
    position: relative;
    z-index: 1001;
    /* Above mobile menu */
}

.hamburger span {
    display: block;
    width: 100%;
    height: 3px;
    background-color: white;
    border-radius: 3px;
    transition: all 0.3s ease;
}

@media (max-width: 900px) {

    /* Matched with existing 900px breakpoint for consistnecy, covers 768px */
    .logo {
        display: flex;
        justify-content: space-between;
        align-items: center;
        width: 100%;
    }

    .hamburger {
        display: flex;
        /* Show hamburger on tablet/mobile */
    }

    .nav-links {
        display: none;
        /* Hide default links */
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        flex-direction: column;
        background-color: rgba(0, 0, 0, 0.95);
        padding: 20px;
        text-align: center;
        z-index: 999;
    }

    .nav-links.active {
        display: flex;
        /* Show when active */
    }

    /* Hamburger Animation */
    .hamburger.active span:nth-child(1) {
        transform: translateY(9px) rotate(45deg);
    }

    .hamburger.active span:nth-child(2) {
        opacity: 0;
    }

    .hamburger.active span:nth-child(3) {
        transform: translateY(-9px) rotate(-45deg);
    }

    /* ... rest of 760px styles ... */

    /* Ensure grids cascade to single column or tight 2-col */
    .services-grid,
    .testimonials-grid,
    .process-grid {
        grid-template-columns: 1fr;
    }

    /* Adjust padding for main sections */
    .hero-content,
    .feature-section,
    .process-section,
    .services-section,
    .testimonials-section,
    .footer {
        padding-left: 30px;
        padding-right: 30px;
    }

    /* Navbar adjustments */
    .navbar {
        position: relative;
        /* Change from absolute to relative to prevent overlap */
        background-color: #000;
        /* Add background since it's now in flow */
        transform: none;
        left: 0;
        padding: 15px 20px;
        width: 100%;
        max-width: 100%;
    }
    
    .logo img {
        width: 90px;
        height: auto;
        /* Reduce logo size */
        padding-top: 5px;
    }

    .nav-links {
        gap: 15px;
    }

	
    .nav-links a {
        font-size: 13px;
    }

    /* Hero Text */
    .hero {
        background-position: center bottom;
        /* Adjust bg alignment if needed */
        height: auto;
        min-height: auto;
    }

    .hero-content {
        /* Reduce top padding since navbar is relative now */
        padding-bottom: 40px;
        background: none;
        /* Let the main hero bg show, or keep gradient if needed. */
    }

    .hero h1 {
        font-size: 2.2rem;
    }

    /* Form Card */
    .booking-form-card {
        max-width: 100%;
        margin: 0;
        width: 100%;
    }

    .hero-image-container {
        width: 100%;
        padding-right: 0;
        margin-top: 20px;
    }
}


/* 768px Breakpoint */
@media (max-width: 768px) {

    .about-split-section,
    .contact-page-section {
        flex-direction: column-reverse;
        padding: 5px 10px;
    }

    /* Hero Adjustments for Tablet */
    .hero h1 {
        font-size: 1.8rem;
        /* Check: decreased font size */
    }

    .booking-form-card {
        max-width: 85%;
        margin: 0 auto;
        padding: 15px;
        /* Reduced padding for tablet */
    }

    .hero-text-container .btn-primary {
        padding: 12px 30px;
        /* Reduced from default */
        font-size: 14px;
        /* Reduced font size */
        width: auto;
        /* Ensure it's not too wide */
    }
}

/* 420px Breakpoint - Deep Mobile Optimization */
@media (max-width: 420px) {

    /* Container & Padding */
    .navbar,
    .hero-content,
    .feature-section,
    .process-section,
    .services-section,
    .testimonials-section,
    .about-split-section,
    .contact-page-section,
    .footer {
        padding-left: 15px;
        padding-right: 15px;
    }

    /* Navigation - Vertical Stack for very small screens */
    .navbar {
        flex-direction: column;
        gap: 15px;
        align-items: center;
    }

    .logo {
        width: 100%;
        /* Ensure logo div takes full width for flex-between */
    }

    .nav-links {
        flex-direction: column;
        width: 100%;
        gap: 10px;
        text-align: center;
        /* Position is handled by 900px query, but ensure it works here */
    }

    .nav-links a {
        display: block;
        padding: 12px 0;
        /* Increase tap area */
        font-size: 16px;
        /* readable size */
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
        width: 100%;
    }

    .btn-contact {
        display: inline-flex;
        justify-content: center;
        align-items: center;
        gap: 6px;
        /* Reduced gap */
        margin-top: 15px;
        width: auto;
        max-width: 100%;
        padding: 10px 16px;
        /* Reduced width via padding */
        font-size: 15px;
        /* Slightly smaller font */
        white-space: nowrap;
    }

    .btn-contact .icon-arrow {
        display: inline-block;
        transform: translateY(1px);
        font-size: 16px;
        line-height: 1;
        width: auto;
        height: auto;
    }

    /* Hero Text & Button Alignment */
    .hero-text-container {
        padding-left: 0;
        text-align: center;
        display: flex;
        flex-direction: column;
        align-items: center;
        margin-bottom: 20px;
		margin-top: 190px;
        /* Space between text/button and form */
    }

    .hero h1 {
        font-size: 2rem;
        /* Slightly larger for impact */
        margin-bottom: 20px;
        line-height: 1.2;
    }

    .hero-description {
        display: block;
        /* Show description again */
        margin-top: 20px;
        font-size: 14px;
        padding-left: 0;
        border-left: none;
        /* Remove desktop border style */
        color: #ddd;
    }


    .hero-inner-container {
        flex-direction: column-reverse;
        padding-top: 120px;
    }




    /* Hero Form Optimization */
    .hero-image-container {
        margin-top: 5px;
        /* Reduced margin */
        padding: 0 5px;
    }

    .booking-form-card {
        margin: auto;
        padding: 12px 10px;
        /* Tighter padding */
        border-radius: 15px;
        width: 100%;
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
        /* Lighter shadow */
    }

    .booking-form-card h3 {
        text-align: center;
        font-size: 1.1rem;
        /* Smaller title */
        margin-bottom: 10px;
        /* Reduced margin */
    }

    /* Form Elements Spacing */
    .form-group {
        margin-bottom: 8px;
        /* Tighter spacing */
    }

    .form-group label {
        font-size: 12px;
        /* Smaller label */
        margin-bottom: 4px;
    }

    .form-tabs {
        gap: 5px;
        margin-bottom: 12px;
        justify-content: center;
        flex-wrap: wrap;
    }

    .form-tab {
        padding: 6px 10px;
        /* Smaller tabs */
        font-size: 11px;
        flex: 1;
        text-align: center;
    }

    /* Form Input Fixes */
    .form-group input,
    .form-group select {
        font-size: 14px;
        /* Reduced input font */
        padding: 8px 12px;
        /* reduced padding */
    }

    .form-row {
        flex-direction: row;
        /* Keep row layout on mobile if possible, or stacked? User wants robust height reduction. Stacked takes more height. Let's try row if fits, but inputs might be too small. Sticking to stack or row? Row saves height! */
        display: flex;
        gap: 8px;
    }

    .form-row .form-group {
        flex: 1;
    }

    /* Buttons */
    .btn-check-rates {
        padding: 10px;
        /* Smaller button */
        font-size: 14px;
        margin-top: 5px;
    }

    /* Buttons */
    .btn-primary,
    .btn-secondary,
    .btn-footer-cta,
    .btn-check-rates {
        width: 100%;
        justify-content: center;
        padding: 15px;
        /* Larger tap area */
        font-size: 16px;
    }

    /* Footer */
	.footer-logo img {
    width: 131px;
	}

    .footer-logo-img {
        height: 50px;
    }
}

.form-content{
    display:none;
}

.form-content.active{
    display:block;
}

.form-tabs{
    display:flex;
    gap:10px;
    margin-bottom:15px;
}

.form-tab{
    flex:1;
	color: #000;
    padding:10px;
    border-radius:6px;
    border:1px solid #ccc;
    background:#fff;
    cursor:pointer;
    font-weight:600;
}

.form-tab.active{
    background:#000;
    color:#fff;
}
.wpcf7-form-control-wrap{
    display:inline-block;
}
.wpcf7-form-control-wrap{
    display:block !important;
    width:100%;
}

.wpcf7-form-control{
    width:100% !important;
}

.booking-form-card .wpcf7 p{
    margin:0;
}
.date-row{
    display:flex;
    gap:15px;
}

.date-col{
    flex:1;
}

.booking-form-card input[type="date"],
.booking-form-card input[type="text"],
.booking-form-card input[type="tel"]{
    height:48px;
    border-radius:30px;
    padding:0 20px;
    border:1px solid #ddd;
}

.booking-form-card input[type="submit"]{
    background:#f4b400;
    border:none;
    height:48px;
    border-radius:6px;
    width:100%;
    font-weight:600;
}
.wpcf7-submit:disabled{
    background:#f4b400 !important;
    opacity:1 !important;
    color:#000 !important;
}
.wpcf7-not-valid-tip{
    position:absolute !important;
    bottom:-18px;
    left:20px;
    font-size:12px;
}

.date-col{
    position:relative;
}

.form-group{
    position:relative;
    margin-bottom:25px;
}
.date-col .wpcf7-form-control-wrap{
    display:block !important;
}
.wpcf7-response-output{
    position:relative;
    z-index:1;
}

.form-tabs{
    position:relative;
    z-index:9999;
}
.date-row{
    display:flex;
    gap:15px;
    overflow:hidden;
}

.date-col input[type="date"]{
    width:100% !important;
    min-width:0 !important;
}
.wpcf7-form-control-wrap{
    min-width:0 !important;
}
.wpcf7-not-valid-tip{
    pointer-events:none;
}


/* Contact Form 7 Custom Styles for Let Me CAB */
:root {
    --text-dark: #111111;
    --accent-orange: #FFC000;
}

/* Fix width for CF7 span wrappers */
.wpcf7-form-control-wrap {
    display: block;
    width: 100%;
}

.contact-form-group {
    margin-bottom: 20px;
}

.contact-form-group label {
    display: block;
    margin-bottom: 8px;
    font-weight: 500;
    color: var(--text-dark);
}

.contact-form-group input,
.contact-form-group select,
.contact-form-group textarea {
    width: 100%;
    padding: 12px 15px;
    border: 1px solid #ddd;
    border-radius: 8px;
    font-family: inherit;
    font-size: 1rem;
    background: #fdfdfd;
}

.contact-form-group input:focus,
.contact-form-group select:focus,
.contact-form-group textarea:focus {
    outline: none;
    border-color: var(--accent-orange);
}

/* Button Submit Styling matching Let Me Cab theme */
.btn-submit,
.wpcf7-submit {
    background: var(--accent-orange);
    color: #fff;
    padding: 12px 30px;
    border: none;
    border-radius: 50px;
    font-weight: 600;
    cursor: pointer;
    width: 100%;
    font-size: 1rem;
    transition: background 0.3s;
}

.btn-submit:hover,
.wpcf7-submit:hover {
    background: #e03e00;
}

/* CF7 Validation Messages Styling */
span.wpcf7-not-valid-tip {
    font-size: 0.85em;
    color: #dc3232;
    margin-top: 5px;
    display: block;
}

div.wpcf7-validation-errors,
div.wpcf7-acceptance-missing {
    border: 1px solid #dc3232;
    padding: 10px;
    border-radius: 8px;
    font-size: 0.9em;
    margin-top: 15px;
}

div.wpcf7-mail-sent-ok {
    border: 1px solid #16a34a;
    background-color: #f0fdf4;
    color: #166534;
    padding: 10px;
    border-radius: 8px;
    font-size: 0.9em;
    margin-top: 15px;
}





/*Fleet CPT*/
/* ================================
   Fleet Single Page (Matched Style)
================================ */

.fleet-container {
    max-width: var(--container-max-width);
    margin: 80px auto;
    padding: 0 50px;
}

.fleet-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.fleet-image {
    background: #fff;
    border-radius: 20px;
    padding: 30px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.05);
}

.fleet-image img {
    width: 100%;
    height: auto;
    object-fit: contain;
}

.fleet-details {
    background: #fff;
    padding: 40px;
    border-radius: 20px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.05);
}

.fleet-title {
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 25px;
    text-transform: uppercase;
}

.fleet-meta {
    display: flex;
    gap: 20px;
    margin-bottom: 30px;
    flex-wrap: wrap;
}

.meta-box {
    background: #f9f9f9;
    padding: 12px 18px;
    border-radius: 30px;
    font-size: 14px;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
}

.fleet-content {
    margin-bottom: 30px;
    line-height: 1.7;
    color: #555;
}

/* Price Box */
.fleet-price-box {
    margin-bottom: 30px;
}

.fleet-price-label {
    font-size: 14px;
    color: #555;
}

.fleet-price-amount {
    font-size: 28px;
    font-weight: 700;
    color: #000;
}

/* CTA Button (Matching Theme) */
.book-btn {
    display: inline-block;
    background: var(--accent-orange);
    color: #000;
    padding: 14px 30px;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 700;
    text-transform: uppercase;
    transition: 0.3s ease;
}

.book-btn:hover {
    background: #000;
    color: #fff;
}

/* Responsive */
@media (max-width: 900px) {
    .fleet-container {
        padding: 0 20px;
    }

    .fleet-grid {
        grid-template-columns: 1fr;
    }

    .fleet-details {
        padding: 25px;
    }

    .fleet-title {
        font-size: 1.8rem;
    }
}



/*Packages CPT*/
/* ================================
   Packages Single Page (Matched Style)
================================ */
.single-package-section {
    padding: 100px 50px;
    max-width: var(--container-max-width);
    margin: 0 auto;
}

.single-package-header {
    text-align: center;
    margin-bottom: 70px;
}

.single-package-header h1 {
    font-size: 3rem;
    font-weight: 700;
    margin-bottom: 15px;
    color: var(--text-dark);
}

.package-subtitle {
    font-size: 1rem;
    color: #666;
    max-width: 700px;
    margin: 0 auto;
}

/* Grid */
.package-vehicle-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
}

/* Card */
.package-vehicle-card {
    background: #fff;
    border-radius: 25px;
    overflow: hidden;
    transition: 0.3s ease;
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
}

.package-vehicle-card:hover {
    transform: translateY(-8px);
}

/* Highlight Middle Card */
.package-vehicle-card.highlight:hover {
    border: 2px solid var(--accent-orange);
}*/

/* Image */
.vehicle-image {
    height: 260px;
    background: #f9f9f9;
    display: flex;
    align-items: center;
    justify-content: center;
}

.vehicle-image img {
    max-width: 90%;
    max-height: 100%;
    object-fit: contain;
}

/* Content */
.vehicle-content {
    padding: 30px;
}

.vehicle-content h3 {
    font-size: 1.3rem;
    font-weight: 700;
    margin-bottom: 10px;
}

.vehicle-price {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--accent-orange);
    margin-bottom: 20px;
}

/* Features */
.vehicle-features {
    list-style: none;
    padding: 0;
    margin-bottom: 25px;
}

.vehicle-features li {
    font-size: 14px;
    padding: 8px 0;
    border-bottom: 1px solid #eee;
    color: #555;
}

/* Button */
.btn-book-package {
    display: inline-block;
    width: 100%;
    text-align: center;
    background: var(--accent-orange);
    color: #000;
    padding: 14px;
    border-radius: 50px;
    font-weight: 600;
    text-decoration: none;
    transition: 0.3s;
}

.btn-book-package:hover {
    background: #000;
    color: #fff;
}

/* Responsive */
@media (max-width: 992px) {
    .package-vehicle-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .single-package-section {
        padding: 60px 20px;
    }

    .package-vehicle-grid {
        grid-template-columns: 1fr;
    }

    .single-package-header h1 {
        font-size: 2.2rem;
    }
}


/* ===============================
   Package Split Section
================================ */

.package-split-section {
    display: flex;
    align-items: center;
    gap: 60px;
    padding: 80px 60px;
    margin-bottom: 80px;
    background: #ffffff;
    border-radius: 30px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.05);
}

.package-split-content {
    flex: 1;
}

.package-split-content .subtitle {
    display: inline-block;
    font-size: 14px;
    letter-spacing: 2px;
    color: black;
    margin-bottom: 15px;
    font-weight: 600;
}

.package-split-content h2 {
    font-size: 36px;
    margin-bottom: 20px;
    font-weight: 700;
    line-height: 1.3;
}

.package-split-content p {
    color: #555;
    line-height: 1.8;
    margin-bottom: 15px;
}

.package-split-image {
    flex: 1;
    text-align: center;
}

.package-split-image img {
    width: 100%;
    max-width: 500px;
}

/* Responsive */

@media (max-width: 992px) {
    .package-split-section {
        flex-direction: column;
        padding: 60px 30px;
        text-align: center;
    }

    .package-split-image img {
        max-width: 400px;
    }
}



/*Saperate Landing Page For Tour Packages Post */
/* Landing Page Specific Custom CSS */
        :root {
            --lp-primary: #1e3a8a;
            /* Deep trust blue */
            --lp-secondary: #0f172a;
            --lp-success: #16a34a;
            --lp-accent: #FFC000;
            --lp-bg: #f8fafc;
            --lp-text: #334155;
            --lp-light: #f1f5f9;
        }

        body {
            background-color: var(--lp-bg);
            color: var(--lp-text);
            margin-bottom: 70px;
            /* Space for mobile sticky CTA */
        }

        .navbar {
            background: transparent;
            position: absolute;
            top: 0;
            width: 100%;
            z-index: 1000;
        }

        /* Hero Section */
        .lp-hero {
            position: relative;
            min-height: 90vh;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 120px 20px 60px 20px;
            background:
                linear-gradient(to right, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.4) 100%),
                url('https://letmecab.com/wp-content/uploads/2026/02/jaipur-pushkar-tour-image.jpg') center/cover;
            color: white;
            text-align: left;
        }

        .lp-hero-content {
            max-width: 1200px;
            width: 100%;
            margin: 0 auto;
            display: flex;
            flex-direction: column;
            gap: 20px;
        }

        .lp-hero-text {
            max-width: 800px;
        }

        .lp-badge {
            display: inline-block;
            background: rgba(255, 192, 0, 0.2);
            color: var(--lp-accent);
            padding: 6px 16px;
            border-radius: 30px;
            font-size: 14px;
            font-weight: 600;
            margin-bottom: 20px;
            border: 1px solid rgba(255, 192, 0, 0.5);
        }

        .lp-badge i {
            color: #FFC000;
        }

        .lp-hero h1 {
            font-size: 2.8rem;
            font-weight: 800;
            line-height: 1.2;
            margin-bottom: 15px;
        }

        .lp-hero h1 .hindi {
            display: block;
            font-size: 1.8rem;
            font-weight: 500;
            color: #d1d5db;
            margin-top: 10px;
        }

        .lp-hero p.subhead {
            font-size: 1.1rem;
            line-height: 1.6;
            color: #e2e8f0;
            margin-bottom: 30px;
            border-left: 4px solid var(--lp-accent);
            padding-left: 15px;
        }

        .lp-hero p.subhead .hindi {
            display: block;
            font-size: 1.05rem;
            margin-top: 8px;
            color: #cbd5e1;
        }

        .lp-benefits-list {
            list-style: none;
            margin-bottom: 40px;
        }

        .lp-benefits-list li {
            display: flex;
            align-items: center;
            margin-bottom: 12px;
            font-size: 1.1rem;
            font-weight: 500;
        }

        .lp-benefits-list li i {
            color: #FFC000;
            margin-right: 12px;
            font-size: 1.2rem;
        }

        .lp-hero-ctas {
            display: flex;
            gap: 15px;
            flex-wrap: wrap;
            align-items: center;
        }

        .btn-primary i {
            color: #FFC000;
        }

        .btn-call {
            display: inline-flex;
            align-items: center;
            gap: 15px;
            background-color: #fff;
            color: #000;
            padding: 12px 30px;
            border-radius: 50px;
            text-decoration: none;
            font-weight: 700;
            font-size: 16px;
            text-transform: uppercase;
            transition: transform 0.2s, background 0.3s, color 0.3s;
        }

        .btn-call:hover {
            transform: scale(1.05);
            background: #000;
            color: #fff;
        }

        .btn-call .icon-arrow-circle {
            background: #000;
            color: white;
            width: 28px;
            height: 28px;
            border-radius: 50%;
            display: flex;
            justify-content: center;
            align-items: center;
            font-size: 14px;
            transition: background 0.3s, color 0.3s;
        }

        .btn-call:hover .icon-arrow-circle {
            background: var(--lp-accent);
            color: #000;
        }

        .btn-call i {
            color: #FFC000;
        }

        .btn-whatsapp {
            display: inline-flex;
            align-items: center;
            gap: 15px;
            background-color: #fff;
            color: #000;
            padding: 12px 30px;
            border-radius: 50px;
            text-decoration: none;
            font-weight: 700;
            font-size: 16px;
            text-transform: uppercase;
            transition: transform 0.2s, background 0.3s, color 0.3s;
        }

        .btn-whatsapp:hover {
            transform: scale(1.05);
            background: #000;
            color: #fff;
        }

        .btn-whatsapp .icon-arrow-circle {
            background: #000;
            color: white;
            width: 28px;
            height: 28px;
            border-radius: 50%;
            display: flex;
            justify-content: center;
            align-items: center;
            font-size: 14px;
            transition: background 0.3s, color 0.3s;
        }

        .btn-whatsapp:hover .icon-arrow-circle {
            background: var(--lp-accent);
            color: #000;
        }

        .btn-whatsapp i {
            color: #fff;
            transition: color 0.3s;
        }

        .btn-whatsapp:hover i {
            color: #000;
        }

        .lp-trust-line {
            display: block;
            margin-top: 25px;
            font-size: 0.95rem;
            color: #cbd5e1;
            font-style: italic;
        }

        /* Global Section Styling */
        .lp-section {
            padding: 80px 20px;
            max-width: 1200px;
            margin: 0 auto;
        }

        .lp-section-header {
            text-align: center;
            margin-bottom: 50px;
            max-width: 800px;
            margin-left: auto;
            margin-right: auto;
        }

        .lp-section-header h2 {
            font-size: 2.2rem;
            color: var(--lp-secondary);
            font-weight: 700;
            margin-bottom: 15px;
        }

        .lp-section-header h2 .hindi {
            display: block;
            font-size: 1.5rem;
            color: #64748b;
            font-weight: 500;
            margin-top: 5px;
        }

        .lp-section.bg-light {
            background-color: #ffffff;
            max-width: 100%;
        }

        .lp-section.bg-light .lp-container {
            max-width: 1200px;
            margin: 0 auto;
        }

        /* Pain Point Section Enhancements */
        .pain-points-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            gap: 30px;
            margin-top: 50px;
        }

        .pain-card {
            background: #fff;
            padding: 40px 30px;
            border-radius: 20px;
            box-shadow: 0 10px 40px rgba(0, 0, 0, 0.05);
            text-align: center;
            border: 1px solid #f1f5f9;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
            position: relative;
            overflow: hidden;
        }

        .pain-card::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 4px;
            background: var(--lp-accent);
            /* Yellow accent to match brand */
        }

        .pain-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 15px 50px rgba(0, 0, 0, 0.08);
        }

        .pain-icon-wrapper {
            width: 80px;
            height: 80px;
            background: #fffbeb;
            /* Light yellow background */
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0 auto 25px auto;
        }

        .pain-card i {
            font-size: 35px;
            color: var(--lp-accent);
        }

        .pain-card h4 {
            font-size: 1.3rem;
            color: var(--lp-secondary);
            margin-bottom: 15px;
            font-weight: 700;
        }

        .pain-card p {
            color: #64748b;
            font-size: 1rem;
            line-height: 1.6;
        }

        .pain-solution {
            background: #FFC000;
            color: #000;
            padding: 50px 40px;
            border-radius: 20px;
            text-align: center;
            margin-top: 60px;
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4);
            position: relative;
            overflow: hidden;
        }

        .pain-solution h3 {
            font-size: 2rem;
            margin-bottom: 15px;
            font-weight: 800;
        }

        .pain-solution p {
            font-size: 1.15rem;
            opacity: 0.9;
            max-width: 800px;
            margin: 0 auto;
            line-height: 1.6;
        }

        /* Cab Options */
        .cab-options-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
            gap: 30px;
        }

        .lp-cab-card {
            background: #fff;
            border-radius: 20px;
            overflow: hidden;
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
            display: flex;
            flex-direction: column;
            border: 1px solid #e2e8f0;
            transition: all 0.3s ease;
        }

        .lp-cab-card:hover {
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
            transform: translateY(-5px);
        }

        .lp-cab-img {
            height: 220px;
            background: #f1f5f9;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 20px;
        }

        .lp-cab-img img {
            max-width: 100%;
            height: auto;
            object-fit: contain;
        }

        .lp-cab-content {
            padding: 25px;
            flex-grow: 1;
            display: flex;
            flex-direction: column;
        }

        .lp-cab-content h3 {
            font-size: 1.5rem;
            color: var(--lp-secondary);
            margin-bottom: 5px;
        }

        .lp-cab-content .cab-desc {
            color: #64748b;
            font-size: 0.95rem;
            margin-bottom: 15px;
            font-weight: 500;
        }

        .lp-cab-content .hindi-desc {
            color: #94a3b8;
            font-size: 0.9rem;
            margin-bottom: 20px;
            display: block;
        }

        .lp-cab-features {
            display: flex;
            gap: 15px;
            margin-bottom: 25px;
            border-top: 1px solid #f1f5f9;
            border-bottom: 1px solid #f1f5f9;
            padding: 15px 0;
        }

        .lp-cab-feature {
            display: flex;
            align-items: center;
            gap: 6px;
            color: #475569;
            font-size: 0.9rem;
            font-weight: 600;
        }

        .lp-cab-feature i {
            color: #FFC000;
        }

        .lp-btn-book {
            margin-top: auto;
            display: block;
            width: 100%;
            text-align: center;
            background: var(--lp-accent);
            color: #000;
            padding: 14px;
            border-radius: 10px;
            font-weight: 700;
            text-decoration: none;
            transition: background 0.3s;
        }

        .lp-btn-book:hover {
            background: #000;
            color: #fff;
        }

        /* Safety Section */
        .safety-section {
            display: flex;
            align-items: center;
            gap: 50px;
        }

        .safety-img {
            flex: 1;
            border-radius: 20px;
            overflow: hidden;
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
        }

        .safety-img img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
        }

        .safety-content {
            flex: 1;
        }

        .safety-content h2 {
            font-size: 2.2rem;
            margin-bottom: 10px;
            color: var(--lp-secondary);
        }

        .safety-content .hindi {
            font-size: 1.4rem;
            color: #64748b;
            margin-bottom: 30px;
            display: block;
        }

        .safety-list {
            list-style: none;
        }

        .safety-list li {
            display: flex;
            align-items: flex-start;
            gap: 15px;
            margin-bottom: 20px;
        }

        .safety-icon {
            background: #e0e7ff;
            color: #FFC000;
            width: 40px;
            height: 40px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.2rem;
            flex-shrink: 0;
        }

        .safety-text h4 {
            font-size: 1.1rem;
            color: var(--lp-secondary);
            margin-bottom: 4px;
        }

        .safety-text p {
            color: #64748b;
            font-size: 0.95rem;
        }

        .emotional-quote {
            background: #fffbeb;
            border-left: 4px solid var(--lp-accent);
            padding: 20px;
            border-radius: 0 10px 10px 0;
            margin-top: 30px;
            font-style: italic;
            color: #92400e;
            font-weight: 500;
        }

        .emotional-quote .hindi {
            display: block;
            margin-top: 5px;
            color: #b45309;
        }

        /* Social Proof */
        .reviews-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            gap: 30px;
        }

        .review-card {
            background: #fff;
            padding: 30px;
            border-radius: 20px;
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
            position: relative;
        }

        .review-stars {
            color: #FFC000;
            margin-bottom: 15px;
            font-size: 1.2rem;
        }

        .review-text {
            font-size: 1.05rem;
            color: #334155;
            line-height: 1.6;
            margin-bottom: 20px;
            font-style: italic;
        }

        .review-author {
            display: flex;
            align-items: center;
            gap: 15px;
        }

        .review-author-avatar {
            width: 50px;
            height: 50px;
            border-radius: 50%;
            background: #e2e8f0;
            display: flex;
            align-items: center;
            justify-content: center;
            color: #64748b;
            font-weight: bold;
            font-size: 1.2rem;
        }

        .review-author-info h4 {
            color: var(--lp-secondary);
            font-size: 1rem;
        }

        .review-author-info p {
            color: #94a3b8;
            font-size: 0.85rem;
        }

        /* FAQs */
        .faq-container {
            max-width: 800px;
            margin: 0 auto;
        }

        .faq-item {
            background: #fff;
            border-radius: 12px;
            margin-bottom: 15px;
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.02);
            border: 1px solid #e2e8f0;
            overflow: hidden;
        }

        .faq-question {
            padding: 20px;
            cursor: pointer;
            display: flex;
            justify-content: space-between;
            align-items: center;
            font-weight: 600;
            color: var(--lp-secondary);
            font-size: 1.1rem;
        }

        .faq-answer {
            padding: 0 20px 20px 20px;
            color: #64748b;
            line-height: 1.6;
            display: none;
        }

        .faq-item.active .faq-answer {
            display: block;
        }

        .faq-item.active .faq-question {
            color: var(--lp-primary);
        }

        .faq-question i {
            color: #FFC000;
        }

        /* Final CTA */
        .final-cta {
            background: black;
            color: #ffffff;
            text-align: center;
            padding: 100px 20px;
        }

        .final-cta h2 {
            font-size: 2.8rem;
            margin-bottom: 15px;
            font-weight: 800;
        }

        .final-cta h2 .hindi {
            display: block;
            font-size: 1.8rem;
            font-weight: 500;
            color: #94a3b8;
            margin-top: 10px;
        }

        .final-cta p {
            font-size: 1.2rem;
            color: #f1f5f9;
            margin-bottom: 40px;
            max-width: 600px;
            margin-left: auto;
            margin-right: auto;
        }

        .final-cta-buttons {
            display: flex;
            justify-content: center;
            gap: 20px;
            flex-wrap: wrap;
        }

        .final-cta-buttons a i {
            color: white;
        }

        .btn-large {
            padding: 18px 40px;
            font-size: 1.2rem;
        }

        .urgency-text {
            display: block;
            margin-top: 30px;
            font-size: 1rem;
            color: #ffff;
            font-weight: 600;
            padding: 10px 20px;
            border-radius: 30px;
            display: inline-block;
        }

        .urgency-text i {
            color: #FFC000;
        }

        /* Mobile CRO Sticky Elements */
        .mobile-sticky-cta {
            display: none;
            position: fixed;
            bottom: 0;
            left: 0;
            width: 100%;
            background: #fff;
            padding: 15px;
            box-shadow: 0 -5px 20px rgba(0, 0, 0, 0.1);
            z-index: 999;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
        }

        .mobile-sticky-cta i {
            color: #FFC000 !important;
        }

        .floating-wa {
            position: fixed;
            bottom: 30px;
            right: 30px;
            background: #25D366;
            color: white;
            width: 60px;
            height: 60px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 30px;
            box-shadow: 0 10px 25px rgba(37, 211, 102, 0.4);
            z-index: 1000;
            transition: transform 0.3s;
        }

        .floating-wa:hover {
            transform: scale(1.1);
        }

        .floating-lang {
            position: fixed;
            bottom: 105px;
            right: 35px;
            display: flex;
            flex-direction: column;
            background: #fff;
            border-radius: 30px;
            padding: 5px;
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
            border: 1px solid #e2e8f0;
            z-index: 1000;
        }

        .floating-lang a {
            width: 40px;
            height: 40px;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
            font-weight: 700;
            text-decoration: none;
            font-size: 13px;
            transition: all 0.3s ease;
        }

        .floating-lang a.active {
            background: var(--lp-accent);
            color: #000;
        }

        .floating-lang a:not(.active) {
            color: #64748b;
        }

        @media (max-width: 900px) {
            .safety-section {
                flex-direction: column;
            }
        }

        @media (max-width: 768px) {
            .lp-hero h1 {
                font-size: 2.2rem;
            }

            .lp-hero h1 .hindi {
                font-size: 1.4rem;
            }

            .lp-section-header h2 {
                font-size: 1.8rem;
            }

            .lp-section-header h2 .hindi {
                font-size: 1.3rem;
            }

            .final-cta h2 {
                font-size: 2.2rem;
            }

            .final-cta h2 .hindi {
                font-size: 1.5rem;
            }

            .mobile-sticky-cta {
                display: flex;
                /* Show on mobile */
            }

            .mobile-sticky-cta i {
                color: #FFC000 !important;
            }

            .floating-wa {
                bottom: 100px;
                /* Above sticky cta */
                right: 20px;
                width: 50px;
                height: 50px;
                font-size: 25px;
            }

            .floating-lang {
                bottom: 165px;
                right: 20px;
            }

            .lp-hero {
                padding-top: 100px;
            }
        }
