/* Minimal reset */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; } /* overflow-x:hidden safety net removed — it broke position:sticky (setting only overflow-x implicitly turns overflow-y into auto, changing body's scroll container behavior); the actual overflow bug is fixed at its root (honeypot clip-path) so this isn't needed */
img, video { max-width: 100%; height: auto; display: block; }
img.emoji { display: inline-block; width: 1em; height: 1em; vertical-align: -0.1em; }
* { min-width: 0; } /* prevents flex/grid children from refusing to shrink below their content's intrinsic size */
/* Browsers don't let form controls inherit the page font by default (they
   use the OS UI font — Arial/Segoe UI/etc.) — without this, every
   <button>/<input>/<select>/<textarea> silently falls back off Cairo,
   which is easy to miss since it only shows up on those elements. */
button, input, select, textarea { font-family: inherit; }

:root {
	--codma-color-bg: #ffffff;
	--codma-color-text: #1a1a1a;
	--codma-color-primary: #16a34a;
	--codma-color-accent: #f59e0b;
	--codma-color-cta: #ff5c28;
	--codma-font: 'Cairo', system-ui, sans-serif;
}

/* Soft purple wash so plain-white sections don't read as flat/dead — pure
   CSS gradients, zero extra requests/weight, safe for mobile speed. This
   file is only enqueued on our own theme's pages, so a plain `body`
   selector is correctly scoped without needing a theme body-class (WP
   only adds wp-theme-* classes in wp-admin contexts, not the frontend —
   that class would never have matched here). */
body {
	font-family: var(--codma-font);
	color: var(--codma-color-text);
	line-height: 1.5;
	background:
		radial-gradient(600px circle at 8% 0%, rgba(93,63,211,.07), transparent 60%),
		radial-gradient(700px circle at 100% 35%, rgba(93,63,211,.05), transparent 55%),
		radial-gradient(650px circle at 0% 80%, rgba(93,63,211,.06), transparent 55%),
		var(--codma-color-bg);
	/* No background-attachment:fixed — known scroll-jank cause on iOS
	   Safari, and this site's traffic is ~99% mobile from ads. */
}

/*
 * Use logical properties (margin-inline-start/end, etc.) instead of left/right
 * throughout the theme so layouts mirror correctly between RTL (Arabic) and
 * LTR (French/Spanish) pages without duplicating rules.
 */

/* Base CTA button — shared across Home/Landing/Thank-you; page-specific
   variants (e.g. the bundle-selection glow) live in their own stylesheet. */
.codma-cta {
	display: inline-block; text-align: center; text-decoration: none;
	font-weight: 800; font-size: 1.05rem; padding: 16px 24px;
	border-radius: 12px; border: none; cursor: pointer;
	position: relative; overflow: hidden;
	animation: codma-cta-shake 4s ease-in-out infinite;
}
/* Brief attention-grabbing wiggle near the end of each cycle, then still —
   layered under each variant's own glow/flash so it never fights them. */
@keyframes codma-cta-shake {
	0%, 90%, 100% { transform: translateX(0); }
	91% { transform: translateX(-3px); }
	92% { transform: translateX(3px); }
	93% { transform: translateX(-3px); }
	94% { transform: translateX(3px); }
	95% { transform: translateX(-2px); }
	96% { transform: translateX(2px); }
	97%, 98%, 99% { transform: translateX(0); }
}
.codma-cta-primary { background: var(--codma-color-cta); color: #fff; }
/* Moving light-sweep flash, matches the reference site's CTA treatment */
.codma-cta-primary::after {
	content: ''; position: absolute; top: 0; inset-inline-start: -110%;
	width: 50%; height: 100%;
	background: linear-gradient(90deg, transparent, rgba(255,255,255,.45), transparent);
	animation: codma-cta-flash 2.5s ease-in-out infinite;
}
@keyframes codma-cta-flash { 0% { inset-inline-start: -110%; } 38% { inset-inline-start: 120%; } 100% { inset-inline-start: 120%; } }
/* Reusable flash-sweep for any CTA-family button, not just the primary
   one — .codma-cta-secondary, and (declared in landing.css since that's
   where the sticky bar lives) the sticky order/WhatsApp buttons. */
.codma-cta-flash-sweep::after {
	content: ''; position: absolute; top: 0; inset-inline-start: -110%;
	width: 50%; height: 100%;
	background: linear-gradient(90deg, transparent, rgba(255,255,255,.5), transparent);
	animation: codma-cta-flash 2.5s ease-in-out infinite;
}

.codma-site-header { text-align: center; padding: 16px; }
.codma-site-header img { max-height: 48px; width: auto; margin: 0 auto; }

.codma-footer {
	text-align: center; padding: 40px 16px 120px; margin-top: 0;
	font-size: 0.85rem; color: rgba(255, 255, 255, .6); background: #16171f;
	border-top: 2px solid #5d3fd3;
}
.codma-footer-copy {
	color: #fff; font-weight: 600; font-size: .8rem; letter-spacing: .02em;
	margin: 0; opacity: .85;
}
.codma-footer-links {
	display: flex; flex-wrap: wrap; justify-content: center; align-items: center;
	gap: 4px 0; margin-top: 18px;
}
.codma-footer-links a {
	color: rgba(255, 255, 255, .7); text-decoration: none; font-weight: 500;
	padding: 6px 14px; border-inline-end: 1px solid rgba(255, 255, 255, .15);
	transition: color .15s ease;
}
.codma-footer-links a:last-child { border-inline-end: 0; }
.codma-footer-links a:hover { color: #a78bfa; }