/* ==========================================================================
   LiveTelePro — Base / Reset
   ========================================================================== */

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

html { scroll-behavior: smooth; }

body {
	margin: 0;
	background: var(--color-bg);
	color: var(--color-text);
	font-family: var(--font-body);
	font-size: var(--fs-base);
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	transition: background var(--transition-base), color var(--transition-base);
	overflow-x: hidden;
}

img, svg, video { max-width: 100%; height: auto; display: block; }

.post-card-thumb img,
.wc-product-card img { width: 100%; height: 220px; object-fit: cover; }

a { color: var(--color-primary); text-decoration: none; transition: color var(--transition-base); }
a:hover { color: var(--color-secondary); }
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
	outline: 2px solid var(--color-primary);
	outline-offset: 2px;
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-display);
	font-weight: 700;
	line-height: 1.2;
	margin: 0 0 var(--space-4);
	color: var(--color-text);
}

p { margin: 0 0 var(--space-4); color: var(--color-text-muted); }

ul, ol { padding-left: 1.25rem; }

button, input, select, textarea { font-family: inherit; font-size: inherit; color: inherit; }
button { cursor: pointer; }

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

.skip-link {
	position: fixed;
	top: -100px;
	left: 1rem;
	z-index: 9999;
	background: var(--color-primary);
	color: #fff;
	padding: 0.75rem 1.25rem;
	border-radius: var(--radius-sm);
	transition: top var(--transition-base);
}
.skip-link:focus { top: 1rem; }

.container {
	width: 100%;
	max-width: var(--container-width);
	margin-inline: auto;
	padding-inline: var(--space-6);
}

/* Utility classes */
.glass-card {
	background: var(--glass-bg);
	border: 1px solid var(--glass-border);
	border-radius: var(--radius-lg);
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	box-shadow: var(--shadow-md);
}

.neumorph {
	background: var(--color-bg-elevated);
	border-radius: var(--radius-lg);
	box-shadow: var(--neumorph-shadow);
}

.gradient-text {
	background: var(--gradient-primary);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.no-js .js-only { display: none !important; }