/* Header + Footer — visual parity with Next.js chrome */



.tm-site-header {

	position: fixed;

	inset: 0 0 auto 0;

	z-index: 50;

	height: var(--tm-header-height);

	transition: background-color var(--tm-duration) var(--tm-ease),

		border-color var(--tm-duration) var(--tm-ease),

		box-shadow var(--tm-duration) var(--tm-ease),

		backdrop-filter var(--tm-duration) var(--tm-ease);

}



.tm-site-header.is-solid {

	border-bottom: 1px solid color-mix(in srgb, var(--tm-border) 80%, transparent);

	background: color-mix(in srgb, var(--tm-white) 95%, transparent);

	box-shadow: var(--tm-shadow-soft);

	backdrop-filter: blur(12px);

	-webkit-backdrop-filter: blur(12px);

}



.tm-site-header.is-transparent {

	background: transparent;

	border-bottom: 1px solid transparent;

	box-shadow: none;

}



.tm-site-header__inner {

	display: flex;

	align-items: center;

	justify-content: space-between;

	gap: var(--tm-space-4);

	height: var(--tm-header-height);

}



.tm-logo {

	position: relative;

	display: inline-flex;

	align-items: center;

	flex-shrink: 0;

}



.tm-logo img {

	display: block;

	height: 2.25rem;

	width: auto;

	object-fit: contain;

}



@media (min-width: 768px) {

	.tm-logo img {

		height: 2.5rem;

	}

}



/* Header logos — only ONE visible; smooth opacity/visibility swap */

.tm-logo--header .tm-logo__dark,

.tm-logo--header .tm-logo__light {

	transition: opacity var(--tm-duration) var(--tm-ease),

		visibility var(--tm-duration) var(--tm-ease);

}



.tm-logo--header .tm-logo__light {

	position: absolute;

	left: 0;

	top: 50%;

	transform: translateY(-50%);

	opacity: 0;

	visibility: hidden;

	pointer-events: none;

}



.tm-logo--header .tm-logo__dark {

	opacity: 1;

	visibility: visible;

}



/* Transparent header (homepage top): WHITE logo only */

.tm-site-header.is-transparent:not(.is-solid) .tm-logo--header .tm-logo__dark {

	opacity: 0;

	visibility: hidden;

	pointer-events: none;

}



.tm-site-header.is-transparent:not(.is-solid) .tm-logo--header .tm-logo__light {

	opacity: 1;

	visibility: visible;

	pointer-events: auto;

}



/* Scrolled / solid header: DARK logo only */

.tm-site-header.is-solid .tm-logo--header .tm-logo__dark {

	opacity: 1;

	visibility: visible;

	pointer-events: auto;

}



.tm-site-header.is-solid .tm-logo--header .tm-logo__light {

	opacity: 0;

	visibility: hidden;

	pointer-events: none;

}



.tm-primary-nav {

	display: none;

	align-items: center;

	gap: 0.125rem;

}



.tm-primary-nav .menu,

.tm-footer-nav .menu,

.tm-legal-nav .menu {

	list-style: none;

	margin: 0;

	padding: 0;

	display: flex;

	align-items: center;

	gap: 0.125rem;

}



.tm-primary-nav a {

	display: inline-flex;

	align-items: center;

	border-radius: var(--tm-radius-nav);

	padding: 0.5rem 0.625rem;

	font-family: var(--tm-font-body);

	font-size: var(--tm-text-sm);

	font-weight: 500;

	color: var(--tm-heading);

	transition: background-color var(--tm-duration) var(--tm-ease),

		color var(--tm-duration) var(--tm-ease);

}



.tm-site-header.is-solid .tm-primary-nav a:hover,

.tm-site-header:not(.is-transparent) .tm-primary-nav a:hover {

	background: var(--tm-section);

	color: var(--tm-primary);

}



.tm-site-header.is-solid .tm-primary-nav .current-menu-item > a,

.tm-site-header.is-solid .tm-primary-nav .current_page_item > a,

.tm-site-header:not(.is-transparent) .tm-primary-nav .current-menu-item > a {

	background: color-mix(in srgb, var(--tm-primary) 10%, transparent);

	color: var(--tm-primary);

}



.tm-site-header.is-transparent:not(.is-solid) .tm-primary-nav a {

	color: rgba(255, 255, 255, 0.9);

}



.tm-site-header.is-transparent:not(.is-solid) .tm-primary-nav a:hover {

	color: var(--tm-white);

	background: transparent;

}



.tm-site-header.is-transparent:not(.is-solid) .tm-primary-nav .current-menu-item > a,

.tm-site-header.is-transparent:not(.is-solid) .tm-primary-nav .current_page_item > a {

	color: var(--tm-primary-soft);

	background: transparent;

}



.tm-header-actions {

	display: none;

	align-items: center;

	gap: var(--tm-space-3);

}



.tm-phone-link {

	display: inline-flex;

	align-items: center;

	gap: 0.4rem;

	font-family: var(--tm-font-body);

	font-size: var(--tm-text-sm);

	font-weight: 600;

	color: var(--tm-heading);

	transition: color var(--tm-duration) var(--tm-ease);

}



.tm-phone-link svg {

	width: 1rem;

	height: 1rem;

	stroke: currentColor;

	fill: none;

	stroke-width: 2;

}



.tm-site-header.is-transparent:not(.is-solid) .tm-phone-link {

	color: var(--tm-white);

}



.tm-phone-link:hover {

	color: var(--tm-primary);

}



/* Phone pulse — adapts to transparent (dark) vs solid (light) header */

.tm-phone-attention {

	animation: tm-phone-highlight-light 2.8s ease-in-out infinite;

}



.tm-site-header.is-transparent:not(.is-solid) .tm-phone-attention {

	animation-name: tm-phone-highlight-dark;

}



@keyframes tm-phone-highlight-light {

	0%, 100% {

		color: var(--tm-heading);

		transform: scale(1);

		text-shadow: none;

		filter: none;

	}

	50% {

		color: var(--tm-primary);

		transform: scale(1.02);

		text-shadow: 0 0 12px rgba(238, 86, 11, 0.28);

	}

}



@keyframes tm-phone-highlight-dark {

	0%, 100% {

		color: #fff;

		transform: scale(1);

		text-shadow: none;

	}

	40% {

		color: var(--tm-primary);

		transform: scale(1.02);

		text-shadow: 0 0 14px rgba(238, 86, 11, 0.35);

	}

	70% {

		color: color-mix(in srgb, #25d366 70%, #fff);

		transform: scale(1.015);

		text-shadow: 0 0 10px rgba(37, 211, 102, 0.22);

	}

}



.tm-menu-toggle {

	display: inline-flex;
	border: none !important;
    padding: 0 !important;

}



.tm-site-header.is-transparent:not(.is-solid) .tm-menu-toggle {

	border-color: rgba(255, 255, 255, 0.3);

	background: rgba(255, 255, 255, 0.1);

	color: var(--tm-white);

}



.tm-site-header.is-transparent:not(.is-solid) .tm-menu-toggle:hover {

	background: rgba(255, 255, 255, 0.2);

	color: var(--tm-white);

}



/* Desktop: show nav, hide mobile toggle (xl+ / 1280 — Next.js Navbar) */

@media (min-width: 1280px) {

	.tm-primary-nav,

	.tm-header-actions {

		display: flex;

	}



	.tm-menu-toggle {

		display: none !important;

	}

}



@media (max-width: 1279px) {

	.tm-primary-nav,

	.tm-header-actions {

		display: none;

	}



	.tm-menu-toggle {

		display: inline-flex !important;

	}

}



/* Mobile drawer */

.tm-drawer-overlay {

	position: fixed;

	inset: 0;

	z-index: 60;

	background: rgba(15, 23, 42, 0.45);

	opacity: 0;

	visibility: hidden;

	transition: opacity var(--tm-duration) var(--tm-ease),

		visibility var(--tm-duration) var(--tm-ease);

}



.tm-drawer-overlay.is-open {

	opacity: 1;

	visibility: visible;

}



.tm-drawer {

	position: fixed;

	top: 0;

	right: 0;

	z-index: 70;

	display: flex;

	flex-direction: column;

	width: min(100%, 360px);

	height: 100%;

	background: var(--tm-white);

	box-shadow: var(--tm-shadow-soft);

	transform: translateX(100%);

	transition: transform var(--tm-duration) var(--tm-ease);

}



.tm-drawer.is-open {

	transform: translateX(0);

}



.tm-drawer__header {

	display: flex;

	align-items: center;

	justify-content: space-between;

	padding: 1rem 1.25rem;

	border-bottom: 1px solid var(--tm-border);

}



.tm-drawer__title {

	margin: 0;

	font-size: var(--tm-text-lg);

	font-weight: 600;

	color: var(--tm-heading);

	font-family: var(--tm-font-heading);

}



.tm-drawer__body {

	padding: 1.25rem;

	overflow-y: auto;

	flex: 1;

}



.tm-mobile-nav .menu {

	list-style: none;

	margin: 0 0 1.25rem;

	padding: 0;

	display: flex;

	flex-direction: column;

	gap: 0.25rem;

}



.tm-mobile-nav a {

	display: block;

	border-radius: 14px;

	padding: 0.75rem 1rem;

	font-family: var(--tm-font-body);

	font-size: var(--tm-text-base);

	font-weight: 500;

	color: var(--tm-heading);

	transition: background-color var(--tm-duration) var(--tm-ease),

		color var(--tm-duration) var(--tm-ease);

}



.tm-mobile-nav a:hover {

	background: var(--tm-section);

	color: var(--tm-primary);

}



.tm-mobile-nav .current-menu-item > a,

.tm-mobile-nav .current_page_item > a {

	background: color-mix(in srgb, var(--tm-primary) 10%, transparent);

	color: var(--tm-primary);

}



.tm-mobile-actions {

	display: flex;

	flex-direction: column;

	gap: 0.75rem;

	padding-top: 1.25rem;

	border-top: 1px solid var(--tm-border);

}



body.tm-nav-open {

	overflow: hidden;

}



/* Footer */

.tm-site-footer {

	position: relative;

	overflow: hidden;

	background: var(--tm-black);

	color: var(--tm-white);

}



.tm-site-footer__glow {

	pointer-events: none;

	position: absolute;

	inset: 0;

	opacity: 0.4;

	background-image:

		radial-gradient(circle at 10% 20%, rgba(238, 86, 11, 0.22), transparent 35%),

		radial-gradient(circle at 90% 80%, rgba(238, 86, 11, 0.12), transparent 40%);

}



.tm-site-footer__inner {

	position: relative;

	/* Top matches Next.js footer; bottom handled by copyright py-5 only */

	padding-top: var(--tm-space-16);

	padding-bottom: 0;

}



@media (min-width: 768px) {

	.tm-site-footer__inner {

		padding-top: var(--tm-space-20);

		padding-bottom: 0;

	}

}



.tm-footer-grid {

	display: grid;

	gap: var(--tm-space-12);

}



@media (min-width: 1024px) {

	.tm-footer-grid {

		grid-template-columns: repeat(12, minmax(0, 1fr));

		gap: var(--tm-space-10);

	}



	.tm-footer-brand {

		grid-column: span 4;

	}



	.tm-footer-mid {

		grid-column: span 5;

	}



	.tm-footer-newsletter {

		grid-column: span 3;

	}

}



.tm-footer-brand .tm-logo {

	margin-bottom: var(--tm-space-5);

}



.tm-footer-brand .tm-logo__dark {

	display: none;

}



.tm-footer-brand .tm-logo__light {

	display: block;

}



.tm-footer-tagline {

	margin: 0 0 var(--tm-space-6);

	max-width: 24rem;

	font-size: var(--tm-text-sm);

	line-height: var(--tm-leading-relaxed);

	color: rgba(255, 255, 255, 0.7);

}



.tm-social-list {

	display: flex;

	align-items: center;

	gap: var(--tm-space-3);

	margin: 0 0 var(--tm-space-6);

	padding: 0;

	list-style: none;

}



.tm-social-list a {

	display: inline-flex;

	align-items: center;

	justify-content: center;

	width: 2.75rem;

	height: 2.75rem;

	border-radius: var(--tm-radius-button);

	border: 1px solid rgba(255, 255, 255, 0.12);

	background: rgba(255, 255, 255, 0.03);

	color: var(--tm-white);

	transition: transform var(--tm-duration) var(--tm-ease),

		background-color var(--tm-duration) var(--tm-ease),

		border-color var(--tm-duration) var(--tm-ease),

		box-shadow var(--tm-duration) var(--tm-ease);

}



.tm-social-list a:hover {

	transform: translateY(-4px);

	border-color: var(--tm-primary);

	background: var(--tm-primary);

	box-shadow: var(--tm-shadow-glow);

}



.tm-social-list svg {

	width: 1rem;

	height: 1rem;

	fill: currentColor;

}



.tm-footer-mid {

	display: grid;

	grid-template-columns: repeat(2, minmax(0, 1fr));

	gap: var(--tm-space-8);

}



.tm-footer-title {

	margin: 0 0 var(--tm-space-5);

	font-family: var(--tm-font-heading);

	font-size: var(--tm-text-sm);

	font-weight: 600;

	letter-spacing: var(--tm-tracking-footer);

	text-transform: uppercase;

	color: var(--tm-white);

}



.tm-footer-nav .menu {

	flex-direction: column;

	align-items: flex-start;

	gap: var(--tm-space-3);

}



.tm-footer-nav a {

	display: inline-flex;

	align-items: center;

	font-size: var(--tm-text-sm);

	color: rgba(255, 255, 255, 0.7);

	transition: transform var(--tm-duration) var(--tm-ease),

		color var(--tm-duration) var(--tm-ease);

}



.tm-footer-nav a::before {

	content: "";

	display: inline-block;

	width: 0;

	height: 1px;

	margin-right: 0;

	background: var(--tm-primary);

	transition: width var(--tm-duration) var(--tm-ease),

		margin-right var(--tm-duration) var(--tm-ease);

}



.tm-footer-nav a:hover {

	color: var(--tm-primary);

	transform: translateX(4px);

}



.tm-footer-nav a:hover::before {

	width: 0.75rem;

	margin-right: 0.5rem;

}



.tm-footer-contact {

	list-style: none;

	margin: 0;

	padding: 0;

	display: flex;

	flex-direction: column;

	gap: var(--tm-space-3);

	font-size: var(--tm-text-sm);

	color: rgba(255, 255, 255, 0.7);

}



.tm-footer-contact a,

.tm-footer-contact span {

	display: inline-flex;

	align-items: flex-start;

	gap: 0.5rem;

	color: inherit;

	transition: color var(--tm-duration) var(--tm-ease);

}



.tm-footer-contact a:hover {

	color: var(--tm-primary);

}



.tm-footer-contact svg {

	width: 1rem;

	height: 1rem;

	margin-top: 0.15rem;

	flex-shrink: 0;

	stroke: currentColor;

	fill: none;

	stroke-width: 2;

}



.tm-footer-newsletter p {

	margin: 0 0 var(--tm-space-4);

	font-size: var(--tm-text-sm);

	line-height: var(--tm-leading-relaxed);

	color: rgba(255, 255, 255, 0.7);

}



.tm-newsletter-form {

	display: flex;

	flex-direction: column;

	gap: var(--tm-space-3);

}



.tm-footer-trust {

	display: flex;

	flex-direction: column;

	gap: var(--tm-space-6);

	margin-top: var(--tm-space-14);

	padding-top: var(--tm-space-8);

	border-top: 1px solid rgba(255, 255, 255, 0.1);

}



@media (min-width: 768px) {

	.tm-footer-trust {

		flex-direction: row;

		justify-content: space-between;

		align-items: flex-start;

	}



	/* Payment Options — right side (Next.js md:ml-auto md:text-right) */

	.tm-footer-payment {

		margin-left: auto;

		text-align: right;

	}



	.tm-footer-payment .tm-payment-chips {

		justify-content: flex-end;

	}

}



.tm-footer-label {

	display: block;

	margin-bottom: var(--tm-space-3);

	font-size: var(--tm-text-xs);

	font-weight: 600;

	letter-spacing: var(--tm-tracking-footer);

	text-transform: uppercase;

	color: rgba(255, 255, 255, 0.55);

}



.tm-trust-badges,

.tm-payment-chips {

	display: flex;

	flex-wrap: wrap;

	gap: var(--tm-space-3);

	margin: 0;

	padding: 0;

	list-style: none;

}



.tm-trust-badges li,

.tm-payment-chips li {

	display: inline-flex;

	align-items: center;

	gap: 0.4rem;

	padding: 0.4rem 0.75rem;

	border-radius: 999px;

	border: 1px solid rgba(255, 255, 255, 0.12);

	background: rgba(255, 255, 255, 0.03);

	font-size: var(--tm-text-xs);

	font-weight: 500;

	color: rgba(255, 255, 255, 0.8);

}



.tm-trust-badges svg {

	width: 0.9rem;

	height: 0.9rem;

	stroke: var(--tm-primary);

	fill: none;

	stroke-width: 2;

}



.tm-footer-bottom {

	display: flex;

	flex-direction: column;

	gap: 0.75rem;

	margin-top: var(--tm-space-8);

	padding-top: 1.25rem; /* Next.js py-5 */

	padding-bottom: 1.25rem;

	border-top: 1px solid rgba(255, 255, 255, 0.1);

	font-size: var(--tm-text-sm);

	color: rgba(255, 255, 255, 0.65);

}



@media (min-width: 768px) {

	.tm-footer-bottom {

		flex-direction: row;

		align-items: center;

		justify-content: space-between;

	}

}



.tm-legal-nav .menu {

	flex-wrap: wrap;

	gap: var(--tm-space-5);

}



.tm-legal-nav a {

	color: rgba(255, 255, 255, 0.65);

	transition: color var(--tm-duration) var(--tm-ease);

}



.tm-legal-nav a:hover {

	color: var(--tm-primary);

}



/* WhatsApp float — global chrome parity with Next.js SiteShell */

.tm-whatsapp-float {

	position: fixed;

	right: 1.25rem;

	bottom: 1.25rem;

	z-index: 40;

	display: inline-flex;

	align-items: center;

	justify-content: center;

	width: 3.5rem;

	height: 3.5rem;

	border-radius: 999px;

	background: var(--tm-whatsapp);

	color: var(--tm-white);

	box-shadow: 0 10px 30px rgba(37, 211, 102, 0.4);

	transition: transform var(--tm-duration) var(--tm-ease);

}



.tm-whatsapp-float:hover {

	transform: scale(1.05);

	color: var(--tm-white);

}



.tm-whatsapp-float svg {

	width: 1.5rem;

	height: 1.5rem;

	fill: currentColor;

}



@media (min-width: 768px) {

	.tm-whatsapp-float {

		right: 2rem;

		bottom: 2rem;

	}

}

