:root {
	/*
	 * Brand tokens prefer Elementor Site Settings globals when present.
	 * Fallbacks keep the Next.js visual design if Kit CSS is unavailable.
	 */
	--tm-primary: var(--e-global-color-primary, #ee560b);
	--tm-primary-hover: var(--e-global-color-tmprimaryhover, #ff7a2f);
	--tm-primary-soft: var(--e-global-color-tmprimarysoft, #ff9e5d);
	--tm-secondary: var(--e-global-color-accent, #425365);
	--tm-secondary-dark: #324253;

	/* Surfaces — Kit custom colors */
	--tm-background: var(--e-global-color-tmwhite, #ffffff);
	--tm-section: var(--e-global-color-tmsection, #f8f9fa);
	--tm-heading: var(--e-global-color-secondary, #1e293b);
	--tm-paragraph: var(--e-global-color-text, #64748b);
	--tm-border: var(--e-global-color-tmborder, #e5e7eb);
	--tm-white: var(--e-global-color-tmwhite, #ffffff);
	--tm-black: var(--e-global-color-tmblack, #000000);

	/* Feedback — Kit custom colors */
	--tm-success: var(--e-global-color-tmsuccess, #22c55e);
	--tm-warning: var(--e-global-color-tmwarning, #f59e0b);
	--tm-error: var(--e-global-color-tmerror, #ef4444);
	--tm-whatsapp: var(--e-global-color-tmwhatsapp, #25d366);

	/*
	 * Typography — headings: Inter; body/UI: Roboto.
	 * Prefer Elementor Kit globals when present.
	 */
	--tm-font-heading: var(--e-global-typography-primary-font-family, "Inter"), "Inter", sans-serif;
	--tm-font-body: var(--e-global-typography-text-font-family, Roboto), "Roboto", sans-serif;
	--tm-font: "Roboto", sans-serif;

	/* Exact Next.js type scale (px) */
	--tm-text-hero: 64px;
	--tm-text-desktop-heading: 48px;
	--tm-text-section: 40px;
	--tm-text-subheading: 28px;
	--tm-text-card-title: 22px;
	--tm-text-body: 16px;
	--tm-text-small: 14px;
	--tm-text-caption: 12px;

	--tm-text-xs: 0.75rem;   /* 12px */
	--tm-text-sm: 0.875rem;  /* 14px */
	--tm-text-base: 1rem;    /* 16px */
	--tm-text-lg: 1.125rem;  /* 18px */
	--tm-text-xl: 1.25rem;   /* 20px */
	--tm-text-2xl: 1.5rem;   /* 24px */
	--tm-text-3xl: 1.875rem; /* 30px */
	--tm-text-4xl: 2.25rem;  /* 36px */
	--tm-text-5xl: 3rem;     /* 48px */

	--tm-leading-heading: 1.2;
	--tm-leading-body: 1.7;
	--tm-leading-tight: 1.2;
	--tm-leading-snug: 1.375;
	--tm-leading-normal: 1.7;
	--tm-leading-relaxed: 1.7;

	--tm-tracking-footer: 0.14em;

	/* Spacing scale */
	--tm-space-1: 0.25rem;
	--tm-space-2: 0.5rem;
	--tm-space-3: 0.75rem;
	--tm-space-4: 1rem;
	--tm-space-5: 1.25rem;
	--tm-space-6: 1.5rem;
	--tm-space-8: 2rem;
	--tm-space-10: 2.5rem;
	--tm-space-12: 3rem;
	--tm-space-14: 3.5rem;
	--tm-space-16: 4rem;
	--tm-space-20: 5rem;

	/* Layout */
	--tm-header-height: 80px;
	--tm-container-max: 1320px;
	--tm-radius-button: 14px;
	--tm-radius-nav: 12px;
	--tm-radius-card: 24px;
	--tm-radius-hero-card: 30px;
	--tm-section-y: clamp(3.5rem, 6vw, 6rem);
	--tm-section-y-lg: clamp(4.5rem, 7vw, 7rem);
	--tm-glass-bg: rgba(255, 255, 255, 0.18);
	--tm-glass-border: rgba(255, 255, 255, 0.25);
	--tm-glass-blur: 20px;
	--tm-shadow-large: 0 22px 50px rgba(30, 41, 59, 0.14);
	--tm-shadow-glass: 0 16px 48px rgba(30, 41, 59, 0.16);

	/* Shadows — Next.js tokens */
	--tm-shadow-soft: 0 4px 14px rgba(30, 41, 59, 0.06);
	--tm-shadow-medium: 0 12px 30px rgba(30, 41, 59, 0.1);
	--tm-shadow-glow: 0 12px 32px rgba(238, 86, 11, 0.38);
	--tm-shadow-glow-strong: 0 16px 40px rgba(238, 86, 11, 0.48);
	--tm-radius-image: 24px;
	--tm-radius-input: 14px;

	/* Motion */
	--tm-ease: cubic-bezier(0.4, 0, 0.2, 1);
	--tm-duration: 300ms;
}

html {
	scroll-behavior: smooth;
}

/* Kit globals — headings Inter; body / buttons / captions remain Roboto. */
.elementor-kit-6,
:root {
	--e-global-typography-primary-font-family: "Inter";
	--e-global-typography-secondary-font-family: "Inter";
	--e-global-typography-text-font-family: "Roboto";
	--e-global-typography-accent-font-family: "Roboto";
	--e-global-typography-tm_h1-font-family: "Inter";
	--e-global-typography-tm_h2-font-family: "Inter";
	--e-global-typography-tm_h3-font-family: "Inter";
	--e-global-typography-tm_h4-font-family: "Inter";
	--e-global-typography-tm_h5-font-family: "Inter";
	--e-global-typography-tm_h6-font-family: "Inter";
	--e-global-typography-tm_body-font-family: "Roboto";
	--e-global-typography-tm_button-font-family: "Roboto";
	--e-global-typography-tmhero-font-family: "Inter";
	--e-global-typography-tmsection-font-family: "Inter";
	--e-global-typography-tmsubheading-font-family: "Inter";
	--e-global-typography-tmcardtitle-font-family: "Inter";
	--e-global-typography-tmsmall-font-family: "Roboto";
	--e-global-typography-tmcaption-font-family: "Roboto";
}

/* Body / UI chrome — keep existing Roboto (not headings). */
body,
.elementor-page,
.elementor-kit-6,
.elementor,
.elementor-widget,
.elementor-widget-container,
.elementor-button,
.elementor-field-group,
.elementor-field-textual,
input,
button,
select,
textarea,
.tm-btn,
.tm-site-header,
.tm-site-footer,
.tm-section-desc,
.tm-card,
.tm-card__text,
.tm-faq__desc {
	font-family: "Roboto", sans-serif !important;
}

/* Preserve icon fonts */
.eicon,
.eicons,
[class^="eicon-"],
[class*=" eicon-"],
.dashicons,
.dashicons-before:before,
.fa,
.fas,
.far,
.fab {
	font-family: inherit;
}

.eicon,
[class^="eicon-"],
[class*=" eicon-"] {
	font-family: eicons !important;
}

.dashicons,
.dashicons-before:before {
	font-family: dashicons !important;
}

body {
	margin: 0;
	font-family: "Roboto", sans-serif !important;
	font-size: var(--tm-text-body);
	line-height: var(--tm-leading-body);
	font-weight: 400;
	color: var(--tm-paragraph);
	background: var(--tm-background);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6,
.elementor-heading-title {
	margin: 0;
	font-family: "Inter", sans-serif !important;
	color: var(--tm-heading);
	line-height: var(--tm-leading-heading);
	font-weight: 700;
}

/* Heading classes — font-family only (size/weight/spacing unchanged). */
.tm-section-title,
.tm-card__title,
.tm-faq__title,
.tm-accordion__trigger,
.tm-page-hero__title,
.tm-hero__title,
.tm-booking-card__title,
.tm-cta-banner__title,
.tm-service-hero__title,
.tm-footer-title,
.tm-drawer__title,
.tm-blog-article__title,
.tm-blog-sidebar__heading,
.tm-blog-related__heading {
	font-family: "Inter", sans-serif !important;
}

a {
	color: inherit;
	text-decoration: none;
}

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

.tm-container {
	width: 100%;
	max-width: var(--tm-container-max);
	margin-inline: auto;
	padding-inline: max(20px, env(safe-area-inset-left));
	box-sizing: border-box;
}

@media (min-width: 768px) {
	.tm-container {
		padding-inline: 24px;
	}
}

@media (min-width: 1024px) {
	.tm-container {
		padding-inline: 32px;
	}
}

.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;
	width: 1px;
	word-wrap: normal !important;
}

.tm-spacer-header {
	height: var(--tm-header-height);
}

body.tm-transparent-header .tm-spacer-header {
	display: none;
}