/* ==========================================================================
   CMOB — Main stylesheet
   Layout: tokens → reset → base → utilities → nav → footer → page sections
   All classes prefixed with cmob- to avoid collisions.
   ========================================================================== */

/* ============================================
   FONTS — self-hosted, woff2 only
   ============================================ */
@font-face {
	font-family: 'Space Grotesk';
	font-style: normal;
	font-weight: 300 700;
	font-display: swap;
	src: url('../fonts/space-grotesk-latin-variable.woff2') format('woff2');
}

@font-face {
	font-family: 'DM Sans';
	font-style: normal;
	font-weight: 100 1000;
	font-display: swap;
	src: url('../fonts/dm-sans-latin-variable.woff2') format('woff2');
}

/* ============================================
   DESIGN TOKENS
   ============================================ */
:root {
	--cmob-black: #0a0a0a;
	--cmob-white: #ffffff;
	--cmob-yellow: #FFC72C;
	--cmob-yellow-dim: rgba(255, 199, 44, 0.15);
	--cmob-yellow-glow: rgba(255, 199, 44, 0.08);
	--cmob-claude-orange: #D4845A;
	--cmob-whatsapp: #25D366;

	--cmob-gray-50: #fafafa;
	--cmob-gray-100: #f5f5f5;
	--cmob-gray-200: #e5e5e5;
	--cmob-gray-300: #d4d4d4;
	--cmob-gray-400: #a3a3a3;
	--cmob-gray-500: #737373;
	--cmob-gray-600: #525252;
	--cmob-gray-700: #404040;
	--cmob-gray-800: #262626;
	--cmob-gray-900: #171717;

	--cmob-max-width: 1200px;

	--cmob-space-xs: 0.5rem;
	--cmob-space-sm: 1rem;
	--cmob-space-md: 1.5rem;
	--cmob-space-lg: 2.5rem;
	--cmob-space-xl: 4rem;
	--cmob-space-2xl: 6rem;
	--cmob-space-section: 7rem;

	--cmob-radius: 20px;
	--cmob-radius-sm: 14px;
	--cmob-radius-xs: 10px;
	--cmob-radius-pill: 100px;

	--cmob-ease-spring: cubic-bezier(0.16, 1, 0.3, 1);

	--cmob-font-display: 'Space Grotesk', system-ui, sans-serif;
	--cmob-font-body: 'DM Sans', -apple-system, BlinkMacSystemFont, sans-serif;
}

/* ============================================
   RESET & BASE
   ============================================ */
*,
*::before,
*::after {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
}

body.cmob-body {
	font-family: var(--cmob-font-body);
	color: var(--cmob-black);
	background: var(--cmob-white);
	line-height: 1.7;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--cmob-font-display);
}

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

a {
	color: inherit;
}

button {
	font-family: inherit;
}

/* Skip-link for accessibility */
.cmob-skip-link {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 9999;
	padding: 12px 20px;
	background: var(--cmob-black);
	color: var(--cmob-white);
	text-decoration: none;
}
.cmob-skip-link:focus {
	left: 0;
}

/* ============================================
   UTILITIES
   ============================================ */
.cmob-container {
	max-width: var(--cmob-max-width);
	margin: 0 auto;
	padding: 0 24px;
}

.cmob-section-divider {
	height: 1px;
	background: linear-gradient(90deg, transparent, rgba(255, 199, 44, 0.15), transparent);
}

.cmob-section-label {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: var(--cmob-font-display);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--cmob-gray-400);
	margin-bottom: var(--cmob-space-sm);
}

.cmob-section-label .cmob-dot {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--cmob-yellow);
}

.cmob-icon {
	display: inline-block;
	flex-shrink: 0;
	vertical-align: middle;
}

/* ============================================
   SCROLL PROGRESS
   ============================================ */
.cmob-scroll-progress {
	position: fixed;
	top: 0;
	left: 0;
	height: 3px;
	z-index: 1001;
	background: linear-gradient(90deg, var(--cmob-yellow), #FFD866);
	width: 0%;
	transition: width 0.1s linear;
}

/* ============================================
   NAV
   ============================================ */
.cmob-nav {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 1000;
	background: rgba(10, 10, 10, 0.85);
	backdrop-filter: blur(24px);
	-webkit-backdrop-filter: blur(24px);
	border-bottom: 1px solid rgba(255, 255, 255, 0.04);
	transition: all 0.3s var(--cmob-ease-spring);
}

.cmob-nav.cmob-nav-scrolled {
	background: rgba(10, 10, 10, 0.97);
	box-shadow: 0 4px 30px rgba(0, 0, 0, 0.3);
}

.cmob-nav-inner {
	max-width: var(--cmob-max-width);
	margin: 0 auto;
	padding: 16px 24px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.cmob-logo {
	font-family: var(--cmob-font-display);
	font-size: 18px;
	font-weight: 700;
	letter-spacing: 0.14em;
	color: var(--cmob-white);
	text-decoration: none;
}

.cmob-logo-lines {
	display: inline-block;
	border-top: 2px solid var(--cmob-white);
	border-bottom: 2px solid var(--cmob-white);
	padding: 3px 0;
}

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

.cmob-nav-links a {
	color: var(--cmob-white);
	text-decoration: none;
	font-size: 15px;
	font-weight: 600;
	font-family: var(--cmob-font-display);
	letter-spacing: 0.01em;
	transition: color 0.2s;
}

.cmob-nav-links a:hover,
.cmob-nav-links a.cmob-nav-active {
	color: var(--cmob-yellow);
}

.cmob-nav-cta-btn {
	background: var(--cmob-whatsapp);
	color: var(--cmob-white) !important;
	padding: 10px 24px;
	border-radius: var(--cmob-radius-pill);
	text-decoration: none;
	font-size: 14px;
	font-weight: 700;
	font-family: var(--cmob-font-display);
	transition: all 0.3s var(--cmob-ease-spring);
	display: inline-flex;
	align-items: center;
	gap: 8px;
	box-shadow: 0 2px 12px rgba(37, 211, 102, 0.2);
}

.cmob-nav-cta-btn:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 24px rgba(37, 211, 102, 0.35);
}

.cmob-nav-divider {
	width: 1px;
	height: 16px;
	background: var(--cmob-gray-700);
}

/* HAMBURGER */
.cmob-hamburger {
	display: none;
	background: none;
	border: none;
	cursor: pointer;
	width: 32px;
	height: 32px;
	position: relative;
	z-index: 1002;
	padding: 0;
	flex-shrink: 0;
}

.cmob-hamburger span {
	display: block;
	width: 20px;
	height: 2px;
	background: var(--cmob-white);
	position: absolute;
	left: 6px;
	transition: all 0.3s var(--cmob-ease-spring);
}

.cmob-hamburger span:nth-child(1) { top: 9px; }
.cmob-hamburger span:nth-child(2) { top: 15px; }
.cmob-hamburger span:nth-child(3) { top: 21px; }

.cmob-hamburger.cmob-active span:nth-child(1) {
	top: 15px;
	transform: rotate(45deg);
}
.cmob-hamburger.cmob-active span:nth-child(2) {
	opacity: 0;
}
.cmob-hamburger.cmob-active span:nth-child(3) {
	top: 15px;
	transform: rotate(-45deg);
}

/* MOBILE MENU */
.cmob-mobile-menu {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(10, 10, 10, 0.98);
	z-index: 1001;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 24px;
	opacity: 0;
	transition: opacity 0.3s var(--cmob-ease-spring);
}

.cmob-mobile-menu.cmob-open {
	display: flex;
	opacity: 1;
}

.cmob-mobile-menu a {
	color: var(--cmob-white);
	text-decoration: none;
	font-family: var(--cmob-font-display);
	font-size: 20px;
	font-weight: 600;
	padding: 8px 0;
	transition: color 0.2s;
}

.cmob-mobile-menu a:hover {
	color: var(--cmob-yellow);
}

.cmob-mobile-menu .cmob-nav-cta-btn {
	font-size: 16px;
	margin-top: 16px;
}

@media (max-width: 768px) {
	.cmob-nav-links {
		display: none;
	}
	.cmob-hamburger {
		display: block;
	}
}

/* ============================================
   BUTTONS
   ============================================ */
.cmob-btn-whatsapp {
	background: var(--cmob-whatsapp);
	color: var(--cmob-white);
	padding: 16px 32px;
	border-radius: var(--cmob-radius-sm);
	text-decoration: none;
	font-size: 16px;
	font-weight: 700;
	font-family: var(--cmob-font-display);
	transition: all 0.3s var(--cmob-ease-spring);
	display: inline-flex;
	align-items: center;
	gap: 10px;
	box-shadow: 0 4px 20px rgba(37, 211, 102, 0.3);
	border: none;
	cursor: pointer;
}

.cmob-btn-whatsapp:hover {
	transform: translateY(-3px);
	box-shadow: 0 8px 30px rgba(37, 211, 102, 0.4);
}

.cmob-btn-secondary {
	background: transparent;
	color: var(--cmob-gray-400);
	padding: 16px 32px;
	border-radius: var(--cmob-radius-sm);
	text-decoration: none;
	font-size: 16px;
	font-weight: 500;
	border: 1px solid var(--cmob-gray-700);
	font-family: var(--cmob-font-display);
	transition: all 0.3s var(--cmob-ease-spring);
	display: inline-flex;
	align-items: center;
	gap: 8px;
	cursor: pointer;
}

.cmob-btn-secondary:hover {
	color: var(--cmob-white);
	border-color: var(--cmob-gray-500);
	transform: translateY(-2px);
}

.cmob-btn-details {
	background: transparent;
	color: var(--cmob-gray-400);
	padding: 14px 24px;
	border-radius: var(--cmob-radius-sm);
	text-decoration: none;
	font-size: 14px;
	font-weight: 600;
	border: 1px solid var(--cmob-gray-700);
	font-family: var(--cmob-font-display);
	transition: all 0.3s var(--cmob-ease-spring);
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.cmob-btn-details:hover {
	color: var(--cmob-white);
	border-color: var(--cmob-gray-500);
	transform: translateY(-2px);
}

.cmob-btn-details svg {
	transition: transform 0.3s var(--cmob-ease-spring);
}

.cmob-btn-details:hover svg {
	transform: translateX(4px);
}

/* ============================================
   FLOATING WHATSAPP
   ============================================ */
.cmob-wa-float {
	position: fixed;
	bottom: 24px;
	right: 24px;
	z-index: 999;
	width: 60px;
	height: 60px;
	border-radius: 50%;
	background: var(--cmob-whatsapp);
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 4px 20px rgba(37, 211, 102, 0.4);
	transition: all 0.3s var(--cmob-ease-spring);
	text-decoration: none;
	color: var(--cmob-white);
}

.cmob-wa-float:hover {
	transform: scale(1.1);
	box-shadow: 0 8px 30px rgba(37, 211, 102, 0.5);
}

/* ============================================
   FOOTER
   ============================================ */
.cmob-footer {
	padding: 40px 24px;
	background: var(--cmob-black);
	border-top: 1px solid var(--cmob-gray-800);
	text-align: center;
}

.cmob-footer p {
	font-size: 13px;
	color: var(--cmob-gray-600);
}

.cmob-footer a {
	color: var(--cmob-gray-500);
	text-decoration: none;
}

.cmob-footer a:hover {
	color: var(--cmob-gray-400);
}

.cmob-footer-logo {
	margin-bottom: 8px;
}

.cmob-footer-links {
	margin-top: 16px;
}

.cmob-footer-copy {
	margin-top: 8px;
}

/* ============================================
   ANIMATIONS
   ============================================ */
.cmob-fade-in {
	opacity: 0;
	transform: translateY(24px);
	transition: opacity 0.7s ease, transform 0.7s ease;
}

.cmob-fade-in.cmob-visible {
	opacity: 1;
	transform: translateY(0);
}

@keyframes cmob-pulse-dot {
	0%, 100% { opacity: 1; }
	50% { opacity: 0.4; }
}

@keyframes cmob-float-char {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-12px); }
}

@keyframes cmob-float-orb {
	0%, 100% { transform: translate(0, 0); }
	50% { transform: translate(30px, -20px); }
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
	.cmob-fade-in {
		opacity: 1;
		transform: none;
	}
}

/* ============================================
   HERO (homepage)
   ============================================ */
.cmob-hero {
	padding: 160px 24px 120px;
	background: var(--cmob-black);
	color: var(--cmob-white);
	position: relative;
	overflow: hidden;
}

.cmob-hero-orb-1 {
	position: absolute;
	width: 600px;
	height: 600px;
	border-radius: 50%;
	background: var(--cmob-yellow);
	filter: blur(200px);
	opacity: 0.06;
	top: -200px;
	right: -200px;
	animation: cmob-float-orb 8s ease-in-out infinite;
}

.cmob-hero-orb-2 {
	position: absolute;
	width: 400px;
	height: 400px;
	border-radius: 50%;
	background: var(--cmob-claude-orange);
	filter: blur(160px);
	opacity: 0.05;
	bottom: -100px;
	left: -100px;
	animation: cmob-float-orb 10s ease-in-out infinite reverse;
}

.cmob-hero-grid {
	max-width: var(--cmob-max-width);
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1.1fr 0.9fr;
	gap: 60px;
	align-items: center;
	position: relative;
}

.cmob-hero-content {
	position: relative;
}

.cmob-hero-label {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: rgba(255, 199, 44, 0.1);
	border: 1px solid rgba(255, 199, 44, 0.2);
	padding: 6px 16px;
	border-radius: var(--cmob-radius-pill);
	font-size: 13px;
	font-weight: 600;
	color: var(--cmob-yellow);
	margin-bottom: var(--cmob-space-md);
	font-family: var(--cmob-font-display);
}

.cmob-hero-label .cmob-dot {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--cmob-yellow);
	animation: cmob-pulse-dot 2s ease-in-out infinite;
}

.cmob-hero h1 {
	font-size: clamp(42px, 5.5vw, 72px);
	font-weight: 700;
	line-height: 1.05;
	letter-spacing: -0.04em;
	margin-bottom: var(--cmob-space-md);
}

.cmob-hero h1 .cmob-highlight {
	background: linear-gradient(135deg, var(--cmob-yellow), #FFE082);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
}

.cmob-hero .cmob-subtitle {
	font-size: clamp(17px, 2vw, 20px);
	color: var(--cmob-gray-400);
	max-width: 480px;
	line-height: 1.6;
	margin-bottom: var(--cmob-space-lg);
}

.cmob-hero-buttons {
	display: flex;
	gap: 14px;
	flex-wrap: wrap;
}

.cmob-hero-visual {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
}

.cmob-hero-character {
	position: relative;
	z-index: 2;
}

.cmob-hero-character img {
	width: 320px;
	height: auto;
	filter: drop-shadow(0 20px 60px rgba(0, 0, 0, 0.5));
	animation: cmob-float-char 4s ease-in-out infinite;
}

.cmob-hero-glow {
	position: absolute;
	width: 300px;
	height: 300px;
	background: radial-gradient(circle, var(--cmob-yellow-glow) 0%, transparent 70%);
	border-radius: 50%;
	z-index: 1;
}

.cmob-hero-trust {
	display: flex;
	gap: 32px;
	margin-top: var(--cmob-space-xl);
	padding-top: var(--cmob-space-lg);
	border-top: 1px solid var(--cmob-gray-800);
	position: relative;
}

.cmob-trust-stat {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.cmob-trust-num {
	font-size: 28px;
	font-weight: 700;
	color: var(--cmob-white);
	font-family: var(--cmob-font-display);
	letter-spacing: -0.02em;
}

.cmob-trust-label {
	font-size: 12px;
	font-weight: 500;
	color: var(--cmob-gray-500);
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

@media (max-width: 900px) {
	.cmob-hero-grid {
		grid-template-columns: 1fr;
		text-align: center;
	}
	.cmob-hero .cmob-subtitle {
		margin: 0 auto var(--cmob-space-lg);
	}
	.cmob-hero-buttons {
		justify-content: center;
	}
	.cmob-hero-visual {
		margin-top: var(--cmob-space-lg);
	}
	.cmob-hero-character img {
		width: 220px;
	}
	.cmob-hero-trust {
		justify-content: center;
		flex-wrap: wrap;
	}
}

@media (max-width: 600px) {
	.cmob-hero {
		padding: 140px 20px 80px;
	}
	.cmob-hero h1 {
		font-size: clamp(32px, 9vw, 42px);
	}
	.cmob-hero-buttons {
		flex-direction: column;
		align-items: stretch;
	}
	.cmob-hero-buttons .cmob-btn-whatsapp,
	.cmob-hero-buttons .cmob-btn-secondary {
		text-align: center;
		justify-content: center;
	}
	.cmob-hero-trust {
		gap: 20px;
	}
	.cmob-trust-num {
		font-size: 22px;
	}
}

/* ============================================
   PAIN POINTS
   ============================================ */
.cmob-pain-points {
	padding: var(--cmob-space-section) 0;
	background: var(--cmob-white);
}

.cmob-pain-points h2 {
	font-size: clamp(30px, 4vw, 48px);
	font-weight: 700;
	letter-spacing: -0.03em;
	margin-bottom: var(--cmob-space-xl);
	max-width: 600px;
	line-height: 1.1;
}

.cmob-pain-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
}

.cmob-pain-card {
	padding: var(--cmob-space-lg) 32px;
	background: var(--cmob-white);
	border-radius: var(--cmob-radius);
	border: 1px solid rgba(0, 0, 0, 0.06);
	transition: all 0.4s var(--cmob-ease-spring);
	position: relative;
	overflow: hidden;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 12px 40px rgba(0, 0, 0, 0.02);
}

.cmob-pain-card::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	background: var(--cmob-yellow);
	opacity: 0;
	transition: opacity 0.3s;
}

.cmob-pain-card:hover {
	border-color: rgba(255, 199, 44, 0.3);
	transform: translateY(-4px);
	box-shadow: 0 12px 40px rgba(0, 0, 0, 0.08);
}

.cmob-pain-card:hover::before {
	opacity: 1;
}

.cmob-pain-stat {
	font-family: var(--cmob-font-display);
	font-size: 17px;
	font-weight: 700;
	color: var(--cmob-black);
	line-height: 1.3;
	margin-bottom: var(--cmob-space-sm);
	padding-bottom: var(--cmob-space-sm);
	border-bottom: 2px solid var(--cmob-gray-100);
}

.cmob-pain-card h3 {
	font-size: 20px;
	font-weight: 700;
	margin-bottom: 8px;
	letter-spacing: -0.01em;
}

.cmob-pain-card p {
	font-size: 15px;
	color: var(--cmob-gray-500);
	line-height: 1.6;
}

@media (max-width: 768px) {
	.cmob-pain-grid {
		grid-template-columns: 1fr;
	}
}

/* ============================================
   SERVICES
   ============================================ */
.cmob-services {
	padding: var(--cmob-space-section) 0;
	background: var(--cmob-gray-900);
	color: var(--cmob-white);
}

.cmob-services h2 {
	font-size: clamp(30px, 4vw, 48px);
	font-weight: 700;
	letter-spacing: -0.03em;
	margin-bottom: 12px;
	line-height: 1.1;
}

.cmob-section-intro {
	font-size: 18px;
	color: var(--cmob-gray-400);
	margin-bottom: var(--cmob-space-xl);
	max-width: 600px;
	line-height: 1.6;
}

.cmob-services-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
}

.cmob-service-card {
	padding: 48px 40px;
	background: var(--cmob-gray-800);
	border-radius: var(--cmob-radius);
	border: 1px solid var(--cmob-gray-700);
	transition: all 0.4s var(--cmob-ease-spring);
	position: relative;
	overflow: hidden;
	display: flex;
	flex-direction: column;
}

.cmob-service-card:hover {
	border-color: rgba(255, 199, 44, 0.3);
	transform: translateY(-4px);
}

.cmob-service-badge {
	display: inline-block;
	font-family: var(--cmob-font-display);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--cmob-yellow);
	background: var(--cmob-yellow-dim);
	padding: 5px 14px;
	border-radius: var(--cmob-radius-pill);
	margin-bottom: var(--cmob-space-md);
	align-self: flex-start;
}

.cmob-service-card h3 {
	font-size: 26px;
	font-weight: 700;
	letter-spacing: -0.02em;
	margin-bottom: 12px;
	line-height: 1.2;
}

.cmob-service-card p {
	font-size: 15px;
	color: var(--cmob-gray-400);
	line-height: 1.6;
	margin-bottom: var(--cmob-space-md);
}

.cmob-service-features {
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin-bottom: var(--cmob-space-lg);
	padding-top: var(--cmob-space-md);
	border-top: 1px solid var(--cmob-gray-700);
}

.cmob-service-features li {
	font-size: 14px;
	color: var(--cmob-gray-300);
	display: flex;
	align-items: center;
	gap: 10px;
}

.cmob-service-icon {
	color: var(--cmob-yellow);
	width: 16px;
	height: 16px;
	flex-shrink: 0;
}

.cmob-service-actions {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin-top: auto;
}

.cmob-service-actions .cmob-btn-whatsapp,
.cmob-service-actions .cmob-btn-details {
	width: 100%;
	justify-content: center;
}

.cmob-service-actions .cmob-btn-whatsapp {
	font-size: 14px;
	padding: 12px 24px;
}

@media (max-width: 768px) {
	.cmob-services-grid {
		grid-template-columns: 1fr;
	}
}

/* ============================================
   AUDIT TIMELINE
   ============================================ */
.cmob-audit {
	padding: var(--cmob-space-section) 0;
	background: var(--cmob-white);
}

.cmob-audit h2 {
	font-size: clamp(30px, 4vw, 48px);
	font-weight: 700;
	letter-spacing: -0.03em;
	margin-bottom: 12px;
	line-height: 1.1;
}

.cmob-audit .cmob-intro {
	font-size: 18px;
	color: var(--cmob-gray-500);
	margin-bottom: var(--cmob-space-xl);
	max-width: 600px;
	line-height: 1.6;
}

.cmob-timeline {
	position: relative;
}

.cmob-timeline::before {
	content: '';
	position: absolute;
	left: 24px;
	top: 0;
	bottom: 0;
	width: 2px;
	background: linear-gradient(to bottom, var(--cmob-yellow), var(--cmob-gray-200));
}

.cmob-timeline-step {
	display: grid;
	grid-template-columns: 50px 1fr;
	gap: 32px;
	margin-bottom: 48px;
	position: relative;
}

.cmob-timeline-step:last-child {
	margin-bottom: 0;
}

.cmob-timeline-dot {
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background: var(--cmob-black);
	color: var(--cmob-white);
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--cmob-font-display);
	font-size: 16px;
	font-weight: 700;
	position: relative;
	z-index: 2;
	border: 3px solid var(--cmob-white);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.cmob-timeline-content {
	padding: 36px;
	background: var(--cmob-white);
	border-radius: var(--cmob-radius);
	border: 1px solid rgba(0, 0, 0, 0.06);
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 12px 40px rgba(0, 0, 0, 0.02);
	transition: all 0.3s var(--cmob-ease-spring);
}

.cmob-timeline-content:hover {
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06), 0 20px 50px rgba(0, 0, 0, 0.06);
}

.cmob-timeline-content h3 {
	font-size: 22px;
	font-weight: 700;
	margin-bottom: 6px;
	letter-spacing: -0.02em;
}

.cmob-week-sub {
	font-size: 14px;
	color: var(--cmob-gray-500);
	margin-bottom: var(--cmob-space-sm);
}

.cmob-timeline-features {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.cmob-timeline-feature {
	display: flex;
	gap: 12px;
	align-items: flex-start;
}

.cmob-timeline-feature .cmob-icon {
	margin-top: 2px;
}

.cmob-timeline-feature strong {
	display: block;
	font-size: 15px;
	font-weight: 600;
	color: var(--cmob-black);
	margin-bottom: 2px;
}

.cmob-timeline-feature span {
	font-size: 13px;
	color: var(--cmob-gray-500);
	line-height: 1.5;
}

.cmob-timeline-session {
	margin-top: 16px;
	padding-top: 16px;
	border-top: 1px solid var(--cmob-gray-100);
	font-size: 13px;
	color: var(--cmob-gray-500);
	display: flex;
	align-items: center;
	gap: 8px;
}

@media (max-width: 768px) {
	.cmob-timeline::before {
		left: 20px;
	}
	.cmob-timeline-step {
		grid-template-columns: 42px 1fr;
		gap: 20px;
	}
	.cmob-timeline-dot {
		width: 42px;
		height: 42px;
		font-size: 14px;
	}
	.cmob-timeline-content {
		padding: 24px;
	}
}

/* ============================================
   DELIVERABLES (homepage)
   ============================================ */
.cmob-deliverables {
	padding: var(--cmob-space-section) 0;
	background: var(--cmob-gray-50);
}

.cmob-deliverables h2 {
	font-size: clamp(30px, 4vw, 48px);
	font-weight: 700;
	letter-spacing: -0.03em;
	margin-bottom: 12px;
	line-height: 1.1;
}

.cmob-deliverables .cmob-section-intro {
	color: var(--cmob-gray-500);
}

.cmob-outcomes-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
	margin-bottom: var(--cmob-space-lg);
}

.cmob-outcome-card {
	padding: 36px 28px;
	border-radius: var(--cmob-radius);
	background: var(--cmob-white);
	border: 1px solid rgba(0, 0, 0, 0.06);
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 12px 40px rgba(0, 0, 0, 0.02);
	transition: all 0.4s var(--cmob-ease-spring);
	position: relative;
}

.cmob-outcome-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 40px rgba(0, 0, 0, 0.08);
}

.cmob-outcome-card h3 {
	font-size: 18px;
	font-weight: 700;
	letter-spacing: -0.01em;
	margin-bottom: 10px;
	line-height: 1.3;
}

.cmob-outcome-card p {
	font-size: 14px;
	color: var(--cmob-gray-500);
	line-height: 1.6;
}

.cmob-outcome-featured {
	background: var(--cmob-black);
	color: var(--cmob-white);
	grid-column: span 3;
	display: grid;
	grid-template-columns: 1.2fr 0.8fr;
	gap: 48px;
	align-items: center;
	padding: 48px 40px;
}

.cmob-outcome-featured p {
	color: var(--cmob-gray-400);
}

.cmob-outcome-featured:hover {
	transform: none;
}

.cmob-claude-spin {
	width: 64px;
	height: 64px;
	position: relative;
	margin-bottom: var(--cmob-space-md);
	animation: cmob-bob 3s ease-in-out infinite;
}

.cmob-outcome-featured .cmob-claude-spin {
	width: 100px;
	height: 100px;
}

.cmob-claude-spin img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: contain;
	opacity: 0;
	filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.25));
}

.cmob-claude-spin img:nth-child(1) { animation: cmob-spin-fade 4s ease-in-out infinite; }
.cmob-claude-spin img:nth-child(2) { animation: cmob-spin-fade 4s ease-in-out -3s infinite; }
.cmob-claude-spin img:nth-child(3) { animation: cmob-spin-fade 4s ease-in-out -2s infinite; }
.cmob-claude-spin img:nth-child(4) { animation: cmob-spin-fade 4s ease-in-out -1s infinite; }

@keyframes cmob-spin-fade {
	0%   { opacity: 0; }
	5%   { opacity: 1; }
	25%  { opacity: 1; }
	30%  { opacity: 0; }
	100% { opacity: 0; }
}

@keyframes cmob-bob {
	0%, 100% { transform: translateY(0); }
	50%      { transform: translateY(-6px); }
}

.cmob-outcome-highlights {
	display: flex;
	flex-direction: column;
	gap: 28px;
}

.cmob-outcome-highlight {
	font-family: var(--cmob-font-display);
	font-size: 48px;
	font-weight: 700;
	letter-spacing: -0.04em;
	line-height: 1;
	color: var(--cmob-yellow);
}

.cmob-outcome-highlight-sub {
	font-size: 14px;
	color: var(--cmob-gray-400);
	line-height: 1.5;
	margin-top: 4px;
}

@media (max-width: 900px) {
	.cmob-outcomes-grid {
		grid-template-columns: 1fr;
	}
	.cmob-outcome-featured {
		grid-column: span 1;
		grid-template-columns: 1fr;
	}
}

/* ============================================
   MID-PAGE CTA
   ============================================ */
.cmob-mid-cta {
	padding: var(--cmob-space-xl) 0;
	background: var(--cmob-black);
	border-top: 1px solid var(--cmob-gray-800);
	border-bottom: 1px solid var(--cmob-gray-800);
}

.cmob-mid-cta-heading {
	font-family: var(--cmob-font-display);
	font-size: clamp(1.3rem, 2.5vw, 1.6rem);
	font-weight: 600;
	color: var(--cmob-white);
	line-height: 1.3;
	margin-bottom: var(--cmob-space-md);
}

.cmob-mid-cta-text {
	color: var(--cmob-gray-400);
	margin-bottom: var(--cmob-space-lg);
	line-height: 1.7;
}

/* ============================================
   ABOUT (Tommy)
   ============================================ */
.cmob-about {
	padding: var(--cmob-space-section) 0;
	background: var(--cmob-white);
}

.cmob-about-grid {
	display: grid;
	grid-template-columns: 0.8fr 1.2fr;
	gap: 80px;
	align-items: center;
}

.cmob-about-photo-wrap {
	position: relative;
}

.cmob-about-photo {
	aspect-ratio: 3/4;
	background: var(--cmob-gray-100);
	border-radius: var(--cmob-radius);
	overflow: hidden;
	border: 1px solid var(--cmob-gray-100);
}

.cmob-about-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center top;
}

.cmob-about-character {
	position: absolute;
	bottom: -20px;
	right: -30px;
	width: 100px;
	z-index: 2;
}

.cmob-about-character img {
	width: 100%;
	filter: drop-shadow(0 8px 24px rgba(0, 0, 0, 0.2));
}

.cmob-about-content h2 {
	font-size: clamp(28px, 3.5vw, 40px);
	font-weight: 700;
	letter-spacing: -0.02em;
	margin-bottom: 6px;
}

.cmob-about-subtitle {
	font-size: 15px;
	color: var(--cmob-gray-500);
	margin-bottom: var(--cmob-space-lg);
}

.cmob-about-content p {
	font-size: 16px;
	color: var(--cmob-gray-500);
	line-height: 1.7;
	margin-bottom: 16px;
}

.cmob-about-content p strong,
.cmob-about-content p b {
	color: var(--cmob-black);
	font-weight: 600;
}

.cmob-about-stats {
	display: flex;
	gap: 32px;
	margin-top: var(--cmob-space-lg);
	padding-top: var(--cmob-space-lg);
	border-top: 1px solid var(--cmob-gray-100);
}

.cmob-about-num {
	font-family: var(--cmob-font-display);
	font-size: 32px;
	font-weight: 700;
	color: var(--cmob-black);
	letter-spacing: -0.02em;
}

.cmob-about-desc {
	font-size: 13px;
	color: var(--cmob-gray-500);
	margin-top: 2px;
}

@media (max-width: 900px) {
	.cmob-about-grid {
		grid-template-columns: 1fr;
		gap: 48px;
	}
	.cmob-about-photo {
		max-width: 360px;
	}
	.cmob-about-stats {
		gap: 24px;
		flex-wrap: wrap;
	}
}

/* ============================================
   FAQ
   ============================================ */
.cmob-faq {
	padding: var(--cmob-space-section) 0;
	background: var(--cmob-gray-50);
}

.cmob-faq h2 {
	font-size: clamp(28px, 4vw, 44px);
	font-weight: 700;
	letter-spacing: -0.02em;
	margin-bottom: var(--cmob-space-xl);
	text-align: center;
}

.cmob-faq-list {
	max-width: 720px;
	margin: 0 auto;
}

.cmob-faq-item {
	border-bottom: 1px solid var(--cmob-gray-200);
}

.cmob-faq-question {
	width: 100%;
	background: none;
	border: none;
	padding: 24px 0;
	font-size: 17px;
	font-weight: 600;
	text-align: left;
	cursor: pointer;
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-family: var(--cmob-font-display);
	color: var(--cmob-black);
	transition: color 0.2s;
}

.cmob-faq-question:hover {
	color: var(--cmob-gray-600);
}

.cmob-faq-question .cmob-icon {
	margin-left: 16px;
	transition: transform 0.3s var(--cmob-ease-spring);
}

.cmob-faq-item.cmob-open .cmob-faq-question .cmob-icon {
	transform: rotate(45deg);
}

.cmob-faq-answer {
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.4s var(--cmob-ease-spring);
}

.cmob-faq-item.cmob-open .cmob-faq-answer {
	max-height: 500px;
}

.cmob-faq-answer p {
	padding-bottom: 24px;
	font-size: 15px;
	color: var(--cmob-gray-600);
	line-height: 1.7;
}

.cmob-faq-cta {
	text-align: center;
	margin-top: var(--cmob-space-xl);
}

.cmob-faq-cta p {
	font-family: var(--cmob-font-display);
	font-size: 18px;
	font-weight: 500;
	color: var(--cmob-gray-500);
	margin-bottom: var(--cmob-space-md);
}

/* ============================================
   FINAL CTA (homepage)
   ============================================ */
.cmob-final-cta {
	padding: var(--cmob-space-section) 0;
	background: var(--cmob-black);
	color: var(--cmob-white);
	text-align: center;
	position: relative;
	overflow: hidden;
}

.cmob-final-cta-orb {
	position: absolute;
	width: 500px;
	height: 500px;
	border-radius: 50%;
	background: var(--cmob-yellow);
	filter: blur(200px);
	opacity: 0.06;
	top: -200px;
	left: 50%;
	transform: translateX(-50%);
}

.cmob-final-cta .cmob-container {
	position: relative;
	z-index: 2;
}

.cmob-final-cta-character {
	width: 120px;
	margin: 0 auto var(--cmob-space-lg);
}

.cmob-final-cta-character img {
	width: 100%;
	filter: drop-shadow(0 12px 40px rgba(0, 0, 0, 0.5));
	animation: cmob-float-char 4s ease-in-out infinite;
}

.cmob-final-cta h2 {
	font-size: clamp(34px, 5vw, 56px);
	font-weight: 700;
	letter-spacing: -0.04em;
	margin-bottom: 12px;
	line-height: 1.1;
}

.cmob-final-cta p {
	font-size: 18px;
	color: var(--cmob-gray-400);
	margin-bottom: var(--cmob-space-lg);
	max-width: 500px;
	margin-left: auto;
	margin-right: auto;
	line-height: 1.6;
}

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

@media (max-width: 600px) {
	.cmob-cta-buttons {
		flex-direction: column;
		align-items: stretch;
		padding: 0 20px;
	}
	.cmob-cta-buttons .cmob-btn-whatsapp,
	.cmob-cta-buttons .cmob-btn-secondary {
		text-align: center;
		justify-content: center;
	}
}

/* ============================================
   AUDIT PAGE — PROBLEM
   ============================================ */
.cmob-problem {
	padding: var(--cmob-space-section) 0;
	background: var(--cmob-white);
	position: relative;
}

.cmob-problem h2 {
	font-size: clamp(32px, 4.5vw, 52px);
	font-weight: 700;
	letter-spacing: -0.03em;
	margin-bottom: var(--cmob-space-md);
	line-height: 1.05;
	color: var(--cmob-black);
}

.cmob-problem-sub {
	font-size: clamp(16px, 1.8vw, 19px);
	color: var(--cmob-gray-500);
	max-width: 560px;
	line-height: 1.6;
	margin-bottom: var(--cmob-space-xl);
}

.cmob-problem-stats-row {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
	margin-bottom: 48px;
}

.cmob-problem-stat {
	padding: 36px 28px;
	border-radius: 16px;
	position: relative;
	overflow: hidden;
	background: var(--cmob-white);
	border: 1px solid rgba(0, 0, 0, 0.06);
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 8px 32px rgba(0, 0, 0, 0.03);
	transition: border-color 0.3s, transform 0.4s var(--cmob-ease-spring), box-shadow 0.3s;
}

.cmob-problem-stat:hover {
	border-color: rgba(255, 199, 44, 0.25);
	transform: translateY(-6px);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06), 0 20px 48px rgba(0, 0, 0, 0.06);
}

.cmob-problem-stat::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	background: linear-gradient(90deg, #FFC72C, #f87171);
}

.cmob-problem-stat-number {
	font-family: var(--cmob-font-display);
	font-weight: 800;
	letter-spacing: -0.04em;
	line-height: 1;
	margin-bottom: 12px;
	font-size: clamp(48px, 5vw, 64px);
	background: linear-gradient(135deg, var(--cmob-black) 0%, var(--cmob-gray-700) 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
}

.cmob-problem-stat-label {
	font-size: 15px;
	color: var(--cmob-gray-500);
	line-height: 1.5;
}

.cmob-problem-stat-source {
	font-size: 10px;
	color: var(--cmob-gray-400);
	margin-top: 12px;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	font-weight: 500;
}

.cmob-problem-text-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 40px;
	padding-top: 40px;
	border-top: 1px solid var(--cmob-gray-200);
}

.cmob-problem-text-col p {
	font-size: 16px;
	color: var(--cmob-gray-600);
	line-height: 1.75;
	margin-bottom: var(--cmob-space-md);
}

.cmob-problem-text-col p:last-child {
	margin-bottom: 0;
}

.cmob-problem-text-col strong {
	color: var(--cmob-black);
	font-weight: 600;
}

.cmob-problem-highlight {
	display: inline-block;
	padding: 2px 10px;
	border-radius: 4px;
	background: rgba(255, 199, 44, 0.12);
	color: var(--cmob-black);
	font-weight: 600;
}

@media (max-width: 900px) {
	.cmob-problem-stats-row {
		grid-template-columns: 1fr;
		max-width: 420px;
	}
	.cmob-problem-text-row {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 600px) {
	.cmob-problem-stat {
		padding: 28px 20px;
	}
	.cmob-problem-stat-number {
		font-size: 44px;
	}
}

/* ============================================
   AUDIT PAGE — WEEK BY WEEK
   ============================================ */
.cmob-week-by-week {
	padding: var(--cmob-space-section) 0;
	background: var(--cmob-gray-50);
}

.cmob-week-by-week h2 {
	font-size: clamp(30px, 4vw, 48px);
	font-weight: 700;
	letter-spacing: -0.03em;
	margin-bottom: var(--cmob-space-xl);
	line-height: 1.1;
}

.cmob-week-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 28px;
}

.cmob-week-card {
	padding: 40px 32px;
	background: var(--cmob-white);
	border-radius: var(--cmob-radius);
	border: 1px solid rgba(0, 0, 0, 0.06);
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 12px 40px rgba(0, 0, 0, 0.02);
	transition: all 0.4s var(--cmob-ease-spring);
	position: relative;
	overflow: hidden;
}

.cmob-week-card::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	background: var(--cmob-yellow);
	opacity: 0;
	transition: opacity 0.3s;
}

.cmob-week-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 40px rgba(0, 0, 0, 0.08);
	border-color: rgba(255, 199, 44, 0.2);
}

.cmob-week-card:hover::before {
	opacity: 1;
}

.cmob-week-label {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: var(--cmob-font-display);
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	color: var(--cmob-yellow);
	background: var(--cmob-yellow-dim);
	padding: 4px 12px;
	border-radius: var(--cmob-radius-pill);
	margin-bottom: var(--cmob-space-md);
}

.cmob-week-card h3 {
	font-size: 22px;
	font-weight: 700;
	margin-bottom: var(--cmob-space-sm);
	letter-spacing: -0.02em;
}

.cmob-week-card .cmob-week-sub {
	font-size: 14px;
	color: var(--cmob-gray-500);
	margin-bottom: var(--cmob-space-lg);
}

.cmob-week-features {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.cmob-week-feature {
	display: flex;
	gap: 12px;
	align-items: flex-start;
}

.cmob-week-feature .cmob-icon {
	margin-top: 2px;
}

.cmob-week-feature strong {
	display: block;
	font-size: 15px;
	font-weight: 600;
	color: var(--cmob-black);
	margin-bottom: 2px;
}

.cmob-week-feature span {
	font-size: 14px;
	color: var(--cmob-gray-500);
	line-height: 1.5;
}

@media (max-width: 1024px) {
	.cmob-week-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 768px) {
	.cmob-week-grid {
		grid-template-columns: 1fr;
	}
}

/* ============================================
   AUDIT PAGE — DELIVERABLES (4-col grid)
   ============================================ */
.cmob-deliverables-grid-section {
	padding: var(--cmob-space-section) 0;
	background: var(--cmob-white);
}

.cmob-deliverables-grid-section h2 {
	font-size: clamp(30px, 4vw, 48px);
	font-weight: 700;
	letter-spacing: -0.03em;
	margin-bottom: 12px;
	line-height: 1.1;
}

.cmob-deliverable-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}

.cmob-deliverable-item {
	padding: 32px;
	background: var(--cmob-gray-50);
	border-radius: var(--cmob-radius-sm);
	border: 1px solid rgba(0, 0, 0, 0.04);
	transition: all 0.3s var(--cmob-ease-spring);
}

.cmob-deliverable-item:hover {
	background: var(--cmob-white);
	border-color: rgba(255, 199, 44, 0.2);
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
}

.cmob-deliverable-icon {
	width: 52px;
	height: 52px;
	background: linear-gradient(135deg, #1a1a1a 0%, #2a2a2a 100%);
	border-radius: var(--cmob-radius-sm);
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: var(--cmob-space-md);
	border: 1px solid rgba(255, 199, 44, 0.15);
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08), 0 0 0 1px rgba(255, 199, 44, 0.05);
}

.cmob-deliverable-item h3 {
	font-size: 16px;
	font-weight: 700;
	letter-spacing: -0.01em;
	margin-bottom: 8px;
	color: var(--cmob-black);
}

.cmob-deliverable-item p {
	font-size: 14px;
	color: var(--cmob-gray-500);
	line-height: 1.6;
}

@media (max-width: 1024px) {
	.cmob-deliverable-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 600px) {
	.cmob-deliverable-grid {
		grid-template-columns: 1fr;
	}
}

/* ============================================
   AUDIT PAGE — WHO IS FOR
   ============================================ */
.cmob-who-is-for {
	padding: var(--cmob-space-section) 0;
	background: var(--cmob-gray-900);
	color: var(--cmob-white);
}

.cmob-who-is-for h2 {
	font-size: clamp(30px, 4vw, 48px);
	font-weight: 700;
	letter-spacing: -0.03em;
	margin-bottom: var(--cmob-space-xl);
	line-height: 1.1;
}

.cmob-profile-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 28px;
}

.cmob-profile-card {
	padding: 40px;
	background: var(--cmob-gray-800);
	border-radius: var(--cmob-radius);
	border: 1px solid var(--cmob-gray-700);
	transition: all 0.4s var(--cmob-ease-spring);
}

.cmob-profile-card:hover {
	border-color: rgba(255, 199, 44, 0.2);
	transform: translateY(-4px);
	box-shadow: 0 12px 40px rgba(0, 0, 0, 0.3);
}

.cmob-profile-card h3 {
	font-size: 20px;
	font-weight: 700;
	margin-bottom: 8px;
	letter-spacing: -0.01em;
}

.cmob-profile-card p {
	font-size: 15px;
	color: var(--cmob-gray-400);
	line-height: 1.7;
}

@media (max-width: 768px) {
	.cmob-profile-grid {
		grid-template-columns: 1fr;
	}
}

/* ============================================
   AUDIT PAGE — 12 SECTIONS GRID
   ============================================ */
.cmob-sections-assessed {
	padding: var(--cmob-space-section) 0;
	background: var(--cmob-white);
}

.cmob-sections-assessed h2 {
	font-size: clamp(30px, 4vw, 48px);
	font-weight: 700;
	letter-spacing: -0.03em;
	margin-bottom: 12px;
	line-height: 1.1;
}

.cmob-sections-sub {
	font-size: 16px;
	color: var(--cmob-gray-500);
	margin-bottom: var(--cmob-space-xl);
	max-width: 520px;
}

.cmob-sections-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 16px;
}

.cmob-section-item {
	padding: 24px;
	background: var(--cmob-gray-50);
	border-radius: var(--cmob-radius-sm);
	border: 1px solid rgba(0, 0, 0, 0.04);
	transition: all 0.3s var(--cmob-ease-spring);
}

.cmob-section-item:hover {
	border-color: rgba(0, 0, 0, 0.1);
	transform: translateY(-2px);
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
}

.cmob-section-item h3 {
	font-size: 15px;
	font-weight: 700;
	letter-spacing: -0.01em;
	margin: 0 0 6px;
}

.cmob-si-summary {
	font-size: 13px;
	line-height: 1.6;
	color: var(--cmob-gray-500);
}

@media (max-width: 768px) {
	.cmob-sections-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 12px;
	}
}

@media (max-width: 600px) {
	.cmob-sections-grid {
		grid-template-columns: 1fr;
	}
}

/* ============================================
   SETUP PAGE — PROBLEM (with checklist)
   ============================================ */
.cmob-problem-section {
	padding: var(--cmob-space-section) 0;
	background: var(--cmob-white);
}

.cmob-problem-section-grid {
	display: grid;
	grid-template-columns: 1.2fr 0.8fr;
	gap: 60px;
	align-items: center;
}

.cmob-problem-content h2 {
	font-size: clamp(30px, 4vw, 48px);
	font-weight: 700;
	letter-spacing: -0.03em;
	margin-bottom: var(--cmob-space-xl);
	line-height: 1.1;
}

.cmob-problem-content p {
	font-size: 18px;
	color: var(--cmob-gray-500);
	line-height: 1.7;
	margin-bottom: 1rem;
}

.cmob-problem-content strong {
	color: var(--cmob-black);
}

.cmob-problem-visual {
	background: var(--cmob-gray-50);
	border-radius: var(--cmob-radius);
	padding: 40px;
	text-align: center;
	position: relative;
}

.cmob-problem-visual-accent {
	position: absolute;
	top: 20px;
	right: 20px;
	width: 80px;
	height: 80px;
	opacity: 0.35;
	z-index: 1;
}

.cmob-problem-visual-accent img {
	width: 100%;
}

.cmob-problem-list {
	text-align: left;
	list-style: none;
	padding: 0;
	position: relative;
	z-index: 2;
}

.cmob-problem-list li {
	font-size: 16px;
	color: var(--cmob-black);
	margin-bottom: 20px;
	padding-left: 40px;
	position: relative;
	font-weight: 500;
	line-height: 1.5;
}

.cmob-problem-list li::before {
	content: '';
	position: absolute;
	left: 0;
	top: 1px;
	width: 26px;
	height: 26px;
	background: linear-gradient(135deg, #25D366, #1ebd5a);
	border-radius: 50%;
	box-shadow: 0 2px 8px rgba(37, 211, 102, 0.25);
}

.cmob-problem-list li::after {
	content: '';
	position: absolute;
	left: 8px;
	top: 7px;
	width: 10px;
	height: 6px;
	border-left: 2px solid white;
	border-bottom: 2px solid white;
	transform: rotate(-45deg);
}

@media (max-width: 900px) {
	.cmob-problem-section-grid {
		grid-template-columns: 1fr;
	}
}

/* ============================================
   SETUP PAGE — PAIN STATS (dark theme)
   ============================================ */
.cmob-pain-stats {
	padding: 80px 0;
	position: relative;
	overflow: hidden;
	background: var(--cmob-black);
}

.cmob-pain-stats::before {
	content: '';
	position: absolute;
	inset: 0;
	background: radial-gradient(ellipse 70% 50% at 50% 30%, rgba(255, 199, 44, 0.08) 0%, transparent 70%);
	pointer-events: none;
}

.cmob-pain-stats-header {
	text-align: center;
	margin-bottom: 48px;
	position: relative;
}

.cmob-pain-stats-header .cmob-section-label {
	margin-bottom: 16px;
	color: var(--cmob-gray-400);
}

.cmob-pain-stats-header h2 {
	font-family: var(--cmob-font-display);
	font-size: clamp(28px, 4vw, 40px);
	font-weight: 800;
	color: var(--cmob-white);
	margin: 0 0 12px;
}

.cmob-pain-stats-header p {
	color: var(--cmob-gray-300);
	font-size: 17px;
	max-width: 520px;
	margin: 0 auto;
}

.cmob-pain-stats-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
	position: relative;
}

.cmob-pain-stat-card {
	text-align: center;
	padding: 44px 24px 36px;
	background: rgba(255, 255, 255, 0.04);
	border-radius: var(--cmob-radius-sm);
	border: 1px solid rgba(255, 199, 44, 0.2);
	position: relative;
	overflow: hidden;
	transition: transform 0.3s ease, border-color 0.3s ease, background 0.3s ease;
}

.cmob-pain-stat-card:hover {
	transform: translateY(-4px);
	border-color: rgba(255, 199, 44, 0.45);
	background: rgba(255, 199, 44, 0.06);
}

.cmob-pain-stat-card::before {
	content: '';
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 60px;
	height: 3px;
	background: var(--cmob-yellow);
	border-radius: 0 0 4px 4px;
}

.cmob-pain-stat-number {
	font-family: var(--cmob-font-display);
	font-size: 52px;
	font-weight: 800;
	background: linear-gradient(135deg, #FFC72C 0%, #FFE082 50%, #FFC72C 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
	margin-bottom: 14px;
	line-height: 1;
}

.cmob-pain-stat-card p {
	color: rgba(255, 255, 255, 0.6);
	font-size: 14px;
	line-height: 1.6;
	margin: 0;
}

.cmob-pain-stats-caption {
	text-align: center;
	margin-top: 40px;
	color: var(--cmob-white);
	font-size: 18px;
	font-weight: 600;
	max-width: 640px;
	margin-left: auto;
	margin-right: auto;
	font-family: var(--cmob-font-display);
	position: relative;
}

.cmob-pain-stats-cta {
	text-align: center;
	margin-top: 40px;
	position: relative;
}

@media (max-width: 900px) {
	.cmob-pain-stats-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 640px) {
	.cmob-pain-stats-grid {
		grid-template-columns: 1fr;
	}
	.cmob-pain-stat-number {
		font-size: 44px;
	}
}

/* ============================================
   SETUP PAGE — SIX OUTCOMES (3-col with icons)
   ============================================ */
.cmob-six-outcomes {
	padding: var(--cmob-space-section) 0;
	background: var(--cmob-gray-50);
}

.cmob-six-outcomes h2 {
	font-size: clamp(30px, 4vw, 48px);
	font-weight: 700;
	letter-spacing: -0.03em;
	margin-bottom: 12px;
	line-height: 1.1;
}

.cmob-six-outcomes-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
}

.cmob-six-outcome-card {
	padding: 36px 28px;
	border-radius: var(--cmob-radius);
	background: var(--cmob-white);
	border: 1px solid rgba(0, 0, 0, 0.06);
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 12px 40px rgba(0, 0, 0, 0.02);
	transition: all 0.4s var(--cmob-ease-spring);
	position: relative;
}

.cmob-six-outcome-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 40px rgba(0, 0, 0, 0.08);
}

.cmob-six-outcome-icon {
	width: 52px;
	height: 52px;
	background: linear-gradient(135deg, #1a1a1a 0%, #2a2a2a 100%);
	border-radius: var(--cmob-radius-sm);
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: var(--cmob-space-md);
	border: 1px solid rgba(255, 199, 44, 0.15);
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08), 0 0 0 1px rgba(255, 199, 44, 0.05);
}

.cmob-six-outcome-card h3 {
	font-size: 18px;
	font-weight: 700;
	letter-spacing: -0.01em;
	margin-bottom: 10px;
	line-height: 1.3;
}

.cmob-six-outcome-card p {
	font-size: 14px;
	color: var(--cmob-gray-500);
	line-height: 1.6;
}

@media (max-width: 768px) {
	.cmob-six-outcomes-grid {
		grid-template-columns: 1fr;
	}
}

/* ============================================
   SETUP PAGE — WHAT'S INSIDE (numbered timeline)
   ============================================ */
.cmob-whats-inside {
	padding: var(--cmob-space-section) 0;
	background: var(--cmob-white);
}

.cmob-whats-inside h2 {
	font-size: clamp(30px, 4vw, 48px);
	font-weight: 700;
	letter-spacing: -0.03em;
	margin-bottom: 12px;
	line-height: 1.1;
}

.cmob-inside-intro {
	font-size: 18px;
	color: var(--cmob-gray-500);
	margin-bottom: var(--cmob-space-xl);
	max-width: 680px;
	line-height: 1.6;
}

.cmob-inside-timeline {
	position: relative;
}

.cmob-inside-timeline::before {
	content: '';
	position: absolute;
	left: 24px;
	top: 0;
	bottom: 0;
	width: 2px;
	background: linear-gradient(to bottom, var(--cmob-yellow), var(--cmob-gray-200));
}

.cmob-inside-step {
	display: grid;
	grid-template-columns: 50px 1fr;
	gap: 32px;
	margin-bottom: 48px;
	position: relative;
}

.cmob-inside-step:last-child {
	margin-bottom: 0;
}

.cmob-inside-dot {
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background: var(--cmob-black);
	color: var(--cmob-white);
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--cmob-font-display);
	font-size: 16px;
	font-weight: 700;
	position: relative;
	z-index: 2;
	border: 3px solid var(--cmob-white);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
	flex-shrink: 0;
}

.cmob-inside-content {
	padding: 32px;
	background: var(--cmob-white);
	border-radius: var(--cmob-radius);
	border: 1px solid rgba(0, 0, 0, 0.06);
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 12px 40px rgba(0, 0, 0, 0.02);
	transition: all 0.3s var(--cmob-ease-spring);
}

.cmob-inside-content:hover {
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06), 0 20px 50px rgba(0, 0, 0, 0.06);
}

.cmob-inside-content h3 {
	font-size: 22px;
	font-weight: 700;
	margin-bottom: 8px;
	letter-spacing: -0.02em;
}

.cmob-inside-content p {
	font-size: 15px;
	color: var(--cmob-gray-500);
	line-height: 1.6;
}

@media (max-width: 768px) {
	.cmob-inside-timeline::before {
		left: 20px;
	}
	.cmob-inside-step {
		grid-template-columns: 42px 1fr;
		gap: 20px;
	}
	.cmob-inside-dot {
		width: 42px;
		height: 42px;
		font-size: 14px;
	}
	.cmob-inside-content {
		padding: 24px;
	}
}

/* ============================================
   SETUP PAGE — HOW IT WORKS (process steps)
   ============================================ */
.cmob-how-it-works {
	padding: var(--cmob-space-section) 0;
	background: var(--cmob-gray-900);
	color: var(--cmob-white);
}

.cmob-how-it-works h2 {
	font-size: clamp(30px, 4vw, 48px);
	font-weight: 700;
	letter-spacing: -0.03em;
	margin-bottom: 12px;
	line-height: 1.1;
}

.cmob-how-intro {
	font-size: 18px;
	color: var(--cmob-gray-400);
	margin-bottom: var(--cmob-space-xl);
	max-width: 680px;
	line-height: 1.6;
}

.cmob-process-steps {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0;
}

.cmob-process-step {
	display: grid;
	grid-template-columns: 180px 1fr;
	gap: 40px;
	padding: 40px 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
	align-items: start;
}

.cmob-process-step:last-child {
	border-bottom: none;
}

.cmob-step-day {
	font-family: var(--cmob-font-display);
	font-size: 28px;
	font-weight: 700;
	color: var(--cmob-yellow);
	letter-spacing: -0.02em;
}

.cmob-step-day-sub {
	font-size: 13px;
	color: var(--cmob-gray-400);
	margin-top: 4px;
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

.cmob-step-content h3 {
	font-size: 22px;
	font-weight: 700;
	margin-bottom: 12px;
}

.cmob-step-content p {
	font-size: 15px;
	color: var(--cmob-gray-400);
	line-height: 1.6;
}

@media (max-width: 900px) {
	.cmob-process-step {
		grid-template-columns: 1fr;
		gap: 16px;
	}
}

/* ============================================
   SETUP PAGE — WHO IS FOR (light theme variant)
   ============================================ */
.cmob-setup-who {
	padding: var(--cmob-space-section) 0;
	background: var(--cmob-white);
}

.cmob-setup-who h2 {
	font-size: clamp(30px, 4vw, 48px);
	font-weight: 700;
	letter-spacing: -0.03em;
	margin-bottom: 12px;
	line-height: 1.1;
}

.cmob-who-intro {
	font-size: 18px;
	color: var(--cmob-gray-500);
	margin-bottom: var(--cmob-space-xl);
	max-width: 680px;
	line-height: 1.6;
}

.cmob-setup-who-cards {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 24px;
}

.cmob-setup-who-card {
	padding: 40px 32px;
	border-radius: var(--cmob-radius);
	background: var(--cmob-white);
	border: 1px solid rgba(0, 0, 0, 0.06);
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 12px 40px rgba(0, 0, 0, 0.02);
	transition: all 0.4s var(--cmob-ease-spring);
}

.cmob-setup-who-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 40px rgba(0, 0, 0, 0.08);
}

.cmob-setup-who-card h3 {
	font-size: 20px;
	font-weight: 700;
	margin-bottom: 12px;
	letter-spacing: -0.01em;
}

.cmob-setup-who-card p {
	font-size: 15px;
	color: var(--cmob-gray-500);
	line-height: 1.6;
}

@media (max-width: 768px) {
	.cmob-setup-who-cards {
		grid-template-columns: 1fr;
	}
}

/* ============================================
   THANK YOU PAGE
   ============================================ */
.cmob-ty-hero {
	padding: 180px 24px 100px;
	background: var(--cmob-black);
	color: var(--cmob-white);
	text-align: center;
}

.cmob-ty-check {
	width: 80px;
	height: 80px;
	background: var(--cmob-white);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 32px;
}

.cmob-ty-hero h1 {
	font-size: clamp(32px, 4.5vw, 52px);
	font-weight: 900;
	letter-spacing: -0.04em;
	line-height: 1.1;
	margin-bottom: 16px;
}

.cmob-ty-hero p {
	font-size: 18px;
	color: var(--cmob-gray-400);
	max-width: 520px;
	margin: 0 auto;
	line-height: 1.6;
}

.cmob-ty-next {
	padding: 100px 0;
	background: var(--cmob-white);
}

.cmob-ty-next h2,
.cmob-ty-weeks h2,
.cmob-ty-expect h2 {
	font-size: clamp(28px, 3.5vw, 40px);
	font-weight: 800;
	letter-spacing: -0.03em;
	margin-bottom: 16px;
}

.cmob-ty-intro {
	font-size: 17px;
	color: var(--cmob-gray-500);
	line-height: 1.6;
	margin-bottom: 64px;
	max-width: 560px;
}

.cmob-ty-timeline {
	position: relative;
	max-width: 720px;
}

.cmob-ty-timeline::before {
	content: '';
	position: absolute;
	left: 23px;
	top: 0;
	bottom: 0;
	width: 2px;
	background: var(--cmob-gray-100);
}

.cmob-ty-timeline-item {
	display: flex;
	gap: 32px;
	margin-bottom: 48px;
	position: relative;
}

.cmob-ty-timeline-item:last-child {
	margin-bottom: 0;
}

.cmob-ty-timeline-dot {
	width: 48px;
	height: 48px;
	background: var(--cmob-black);
	border-radius: 14px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	position: relative;
	z-index: 1;
}

.cmob-ty-timeline-content {
	padding-top: 4px;
}

.cmob-ty-when {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--cmob-gray-400);
	margin-bottom: 8px;
	display: block;
}

.cmob-ty-timeline-content h3 {
	font-size: 18px;
	font-weight: 700;
	letter-spacing: -0.01em;
	margin-bottom: 6px;
}

.cmob-ty-timeline-content p {
	font-size: 15px;
	color: var(--cmob-gray-500);
	line-height: 1.6;
}

.cmob-ty-weeks {
	padding: 100px 0;
	background: var(--cmob-gray-900);
	color: var(--cmob-white);
}

.cmob-ty-weeks-cards {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
}

.cmob-ty-week-card {
	padding: 36px 32px;
	background: var(--cmob-gray-800);
	border-radius: 20px;
	border: 1px solid var(--cmob-gray-700);
}

.cmob-ty-week-badge {
	display: inline-block;
	background: var(--cmob-white);
	color: var(--cmob-black);
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	padding: 5px 12px;
	border-radius: 6px;
	margin-bottom: 16px;
}

.cmob-ty-week-card h3 {
	font-size: 20px;
	font-weight: 700;
	letter-spacing: -0.02em;
	margin-bottom: 10px;
}

.cmob-ty-week-card p {
	font-size: 14px;
	color: var(--cmob-gray-400);
	line-height: 1.6;
}

.cmob-ty-session-note {
	margin-top: 16px;
	padding-top: 16px;
	border-top: 1px solid var(--cmob-gray-700);
	font-size: 13px;
	color: var(--cmob-gray-500);
	display: flex;
	align-items: center;
	gap: 8px;
}

.cmob-ty-expect {
	padding: 100px 0;
	background: var(--cmob-white);
}

.cmob-ty-expect-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
	max-width: 720px;
}

.cmob-ty-expect-item {
	padding: 32px;
	background: var(--cmob-gray-50);
	border-radius: 16px;
	border: 1px solid var(--cmob-gray-100);
}

.cmob-ty-expect-item h3 {
	font-size: 16px;
	font-weight: 700;
	margin-bottom: 8px;
}

.cmob-ty-expect-item p {
	font-size: 14px;
	color: var(--cmob-gray-500);
	line-height: 1.6;
}

.cmob-ty-contact {
	padding: 80px 24px;
	background: var(--cmob-gray-50);
	text-align: center;
}

.cmob-ty-contact h2 {
	font-size: clamp(24px, 3vw, 32px);
	font-weight: 800;
	letter-spacing: -0.02em;
	margin-bottom: 12px;
}

.cmob-ty-contact p {
	font-size: 16px;
	color: var(--cmob-gray-500);
	line-height: 1.6;
	margin-bottom: 8px;
}

.cmob-ty-contact a {
	color: var(--cmob-black);
	font-weight: 600;
	text-decoration: none;
}

.cmob-ty-contact a:hover {
	text-decoration: underline;
}

@media (max-width: 900px) {
	.cmob-ty-weeks-cards {
		grid-template-columns: 1fr;
	}
	.cmob-ty-expect-grid {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 600px) {
	.cmob-ty-hero {
		padding: 150px 20px 80px;
	}
	.cmob-ty-timeline-item {
		gap: 20px;
	}
	.cmob-ty-week-card {
		padding: 28px 24px;
	}
}

/* ============================================
   DEFAULT PAGE / 404
   ============================================ */
.cmob-main {
	padding: 160px 24px 100px;
	min-height: 60vh;
}

.cmob-default-page .cmob-default-article h1 {
	font-size: clamp(28px, 4vw, 44px);
	font-weight: 700;
	letter-spacing: -0.02em;
	margin-bottom: var(--cmob-space-lg);
}

.cmob-default-content {
	font-size: 16px;
	color: var(--cmob-gray-700);
	line-height: 1.75;
}

.cmob-default-content p,
.cmob-default-content ul,
.cmob-default-content ol {
	margin-bottom: 1rem;
}

.cmob-default-content h2 {
	font-size: 24px;
	margin-top: 2rem;
	margin-bottom: 0.75rem;
}

.cmob-default-content h3 {
	font-size: 20px;
	margin-top: 1.5rem;
	margin-bottom: 0.5rem;
}

.cmob-default-content a {
	color: var(--cmob-black);
	text-decoration: underline;
}

.cmob-404 {
	text-align: center;
	padding-top: 200px;
}

.cmob-404 h1 {
	font-size: clamp(40px, 6vw, 64px);
	font-weight: 700;
	letter-spacing: -0.03em;
	margin-bottom: 16px;
}

.cmob-404 p {
	font-size: 18px;
	color: var(--cmob-gray-500);
	margin-bottom: var(--cmob-space-lg);
}

.cmob-404-actions {
	display: flex;
	gap: 14px;
	justify-content: center;
	flex-wrap: wrap;
}