/**
 * Light agency theme — homepage and global surfaces.
 */

html,
body.theme-light {
	background:
		radial-gradient(ellipse 70% 45% at 8% -8%, rgba(79, 70, 229, 0.08), transparent 52%),
		radial-gradient(ellipse 50% 36% at 100% 0%, rgba(124, 58, 237, 0.06), transparent 48%),
		var(--wpdp-bg);
	color: var(--wpdp-text);
}

/* Header */
.site-header {
	background: #fff;
	border-bottom: 1px solid var(--wpdp-border);
	box-shadow: none;
	z-index: 1030;
}

.site-header .navbar .container {
	display: flex;
	align-items: center;
	gap: 1rem;
}

.site-header .brand-lockup {
	flex-shrink: 0;
}

.site-header.is-scrolled {
	background: rgba(255, 255, 255, 0.96);
	box-shadow: 0 8px 28px rgba(15, 23, 42, 0.06);
	border-bottom-color: var(--wpdp-border);
}

.navbar .nav-link {
	color: #475569;
}

.navbar .nav-link:hover,
.navbar .nav-link.active {
	color: var(--wpdp-text);
}

.toggler-lines span {
	background: var(--wpdp-text);
}

#navOffcanvas.offcanvas {
	background: #fff;
	color: var(--wpdp-text);
	border-left: 1px solid var(--wpdp-border);
}

#navOffcanvas .nav-link {
	color: var(--wpdp-text);
	padding: 0.7rem 0;
}

/* Brand lockup — replaces dark-background PNG on white chrome */
.brand-lockup {
	display: inline-flex;
	align-items: center;
	gap: 0.7rem;
	text-decoration: none !important;
	color: inherit;
	line-height: 1.15;
}

.brand-lockup-mark {
	width: 42px;
	height: 42px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 12px;
	background: var(--wpdp-gradient);
	color: #fff;
	font-weight: 800;
	font-size: 1.15rem;
	flex-shrink: 0;
}

.brand-lockup-copy {
	display: flex;
	flex-direction: column;
	gap: 0.1rem;
}

.brand-lockup-copy strong {
	font-size: 0.98rem;
	font-weight: 700;
	letter-spacing: -0.02em;
}

.brand-lockup-copy small {
	font-size: 0.7rem;
	font-weight: 500;
	letter-spacing: 0.02em;
}

.brand-lockup--light {
	color: #0f172a;
}

.brand-lockup--light small {
	color: #64748b;
}

.brand-lockup--dark {
	color: #fff;
}

.brand-lockup--dark small {
	color: #94a3b8;
}

.brand-lockup:hover {
	color: inherit;
	opacity: 0.88;
}

.wpdp-region-switcher {
	background: rgba(15, 23, 42, 0.04);
}

.btn-outline-light:hover {
	background: #eef2ff;
	color: var(--wpdp-accent);
}

.btn-outline-accent {
	background: #fff;
}

/* Dark buttons always keep white labels */
.btn-accent,
.btn-accent:hover,
.btn-accent:focus,
.btn-accent span,
.btn-accent i,
.hero-pill-accent,
.hero-pill-accent i,
.hero-scoreboard,
.hero-scoreboard strong,
.hero-scoreboard span {
	color: #fff !important;
	-webkit-text-fill-color: #fff !important;
}

/* Hero copy — do not inherit onto buttons */
.hero-title,
.hero-title-main,
.hero-brand,
.hero-lead,
.hero-line,
.hero-line-tag,
.hero-metric-value,
.hero-metric-label,
.hero-serp-desc {
	color: #0f172a !important;
	-webkit-text-fill-color: #0f172a;
	background-image: none;
}

.hero-line-sub {
	color: #4f46e5 !important;
	-webkit-text-fill-color: #4f46e5;
	background: none;
}

.hero-title-accent {
	display: inline-block;
	color: #4f46e5 !important;
	-webkit-text-fill-color: #4f46e5;
	background-image: linear-gradient(120deg, rgba(79, 70, 229, 0.14), rgba(37, 99, 235, 0.1));
	background-size: 100% 38%;
	background-repeat: no-repeat;
	background-position: 0 92%;
	padding: 0 0.12em;
}

.hero-title-main,
.hero-title-accent {
	display: block;
}

.hero {
	width: 100%;
	min-height: calc(100vh - var(--wpdp-header-h));
	padding: 3rem 0 4rem;
	background: transparent;
}

.hero-stage,
.hero-proof,
.hero-scoreboard,
.hero-avail,
.hero-visual-orb {
	display: none;
}

.hero-row {
	min-height: 0;
	padding: 1rem 0;
}

.hero-visual {
	position: relative;
	min-height: 0;
	padding: 0;
}

.hero-art {
	display: block;
	position: relative;
	width: 100%;
	max-width: 520px;
	margin-left: auto;
	opacity: 1;
}

.hero-art svg {
	width: 100%;
	height: auto;
	overflow: visible;
}

.hero-mesh {
	background:
		radial-gradient(ellipse 90% 60% at 12% 18%, rgba(79, 70, 229, 0.12), transparent 55%),
		radial-gradient(ellipse 70% 50% at 88% 78%, rgba(124, 58, 237, 0.08), transparent 50%);
}

.hero-grid {
	background-image:
		linear-gradient(rgba(79, 70, 229, 0.06) 1px, transparent 1px),
		linear-gradient(90deg, rgba(79, 70, 229, 0.06) 1px, transparent 1px);
	opacity: 0.55;
}

.hero-glow {
	opacity: 0.18;
}

.hero-beam {
	opacity: 0.35;
}

.hero-pill {
	background: #eef2ff;
	border-color: rgba(79, 70, 229, 0.16);
	box-shadow: none;
	color: #312e81;
	-webkit-text-fill-color: #312e81;
}

.hero-pill i {
	color: inherit;
	-webkit-text-fill-color: inherit;
}

.hero-pill-accent,
.hero .hero-pill-accent {
	background: var(--wpdp-gradient) !important;
	border-color: transparent;
	color: #fff !important;
	-webkit-text-fill-color: #fff !important;
	box-shadow: 0 10px 28px var(--wpdp-accent-glow);
}

.hero-pill-accent i {
	color: #fff !important;
	-webkit-text-fill-color: #fff !important;
}

.btn-hero-secondary {
	background: #fff;
	box-shadow: 0 8px 20px rgba(15, 23, 42, 0.05);
}

.btn-hero-secondary:hover {
	color: var(--wpdp-accent);
	background: #eef2ff;
}

.hero-float-chip {
	background: #fff;
	box-shadow: 0 14px 30px rgba(15, 23, 42, 0.1);
}

.hero-scroll-hint {
	color: var(--wpdp-muted);
}

/* Section rhythm */
.section-roles,
.section-stats,
.section-services,
.section-testimonials {
	background: #fff;
}

.reviews-grid {
	position: relative;
	z-index: 1;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr));
}

.review-card {
	overflow: hidden;
	isolation: isolate;
	min-width: 0;
}

.reviews-cta {
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	z-index: 2;
	margin: 2rem 0 0;
	padding: 0 0 0.25rem;
}

.reviews-cta-btn {
	position: relative;
	z-index: 2;
	white-space: normal;
	max-width: 100%;
}

.section-intro,
.section-portfolio,
.section-audit-banner,
.section-tech-stack,
.section-faq {
	background: transparent;
}

.section-title {
	color: var(--wpdp-text);
}

.section-intro p,
.section-roles p,
.section-desc {
	color: var(--wpdp-muted);
}

/* Cards */
.intro-card,
.role-card,
.service-card,
.tech-grid-card,
.review-card,
.blog-card,
.contact-trust-card,
.contact-service-card,
.pricing-card,
.about-visual-card,
.about-hero-stats,
.faq-accordion .faq-item,
.google-rating-badge {
	background: #fff;
	box-shadow: 0 10px 28px rgba(15, 23, 42, 0.045);
}

.intro-card:hover,
.role-card:hover,
.service-card:hover,
.blog-card:hover,
.review-card:hover,
.tech-grid-card:hover {
	transform: translateY(-5px);
	border-color: rgba(79, 70, 229, 0.28);
	box-shadow: 0 20px 40px rgba(79, 70, 229, 0.1);
}

.intro-card i,
.role-card-icon,
.service-icon {
	width: 48px;
	height: 48px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 14px;
	background: #eef2ff;
	color: var(--wpdp-accent);
	font-size: 1.35rem;
	margin-bottom: 0.85rem;
}

.role-card {
	padding: 2rem;
}

.role-card p {
	color: var(--wpdp-muted);
}

/* Portfolio */
.portfolio-header {
	border-bottom-color: rgba(15, 23, 42, 0.08);
}

.portfolio-frame {
	background: #fff;
	box-shadow: var(--wpdp-shadow);
}

.portfolio-chrome {
	background: linear-gradient(180deg, #f8fafc 0%, #eef2f7 100%);
}

.portfolio-chrome-url {
	background: #fff;
	border-color: rgba(15, 23, 42, 0.08);
	color: #475569;
}

.portfolio-duration {
	background: rgba(37, 99, 235, 0.06);
}

/* Stats */
.stats-bar {
	background: #fff;
	border-color: var(--wpdp-border);
	box-shadow: var(--wpdp-shadow);
}

.tech-grid-card:hover {
	box-shadow: 0 14px 32px rgba(15, 23, 42, 0.08);
}

/* Audit */
.audit-banner-card {
	background:
		radial-gradient(120% 140% at 0% 0%, rgba(79, 70, 229, 0.1), transparent 50%),
		#fff;
	border-color: rgba(79, 70, 229, 0.16);
	box-shadow: var(--wpdp-shadow);
}

/* Tech stack — was still dark */
.tech-mosaic-panel {
	background: linear-gradient(160deg, rgba(79, 70, 229, 0.07), #fff 40%) !important;
	box-shadow: var(--wpdp-shadow);
}

.tech-mosaic-item {
	background: #fff !important;
	border-color: rgba(15, 23, 42, 0.08);
}

.tech-mosaic-ring {
	opacity: 0.16;
}

.page-hero .hero-topline .section-label {
	margin-bottom: 0;
	align-self: center;
}

.page-hero .page-title {
	color: var(--wpdp-text);
}

.page-hero-lead {
	color: var(--wpdp-muted);
}

.contact-hero-tags li span {
	background: #eef2ff;
	color: #312e81;
	border-color: rgba(79, 70, 229, 0.16);
}

.service-hero-pills span {
	background: #fff;
	color: #312e81;
}

.service-hero-card {
	background: linear-gradient(160deg, rgba(79, 70, 229, 0.08), #fff 42%);
	box-shadow: var(--wpdp-shadow);
}

/* FAQ */
.faq-item-icon {
	background: #eef2ff !important;
	color: var(--wpdp-accent);
}

.faq-accordion .accordion-button {
	color: var(--wpdp-text) !important;
}

.faq-accordion .accordion-button:not(.collapsed) {
	background: linear-gradient(90deg, rgba(79, 70, 229, 0.08), transparent) !important;
	color: var(--wpdp-accent) !important;
}

/* Forms */
.contact-form .form-control,
.page-contact .wpcf7-form-control-wrap input,
.page-contact .wpcf7-form-control-wrap select,
.page-contact .wpcf7-form-control-wrap textarea {
	background: #fff;
	color: var(--wpdp-text);
	border-color: var(--wpdp-border);
}

.page-contact .wpcf7 form.sent .wpcf7-response-output {
	color: #166534;
	background: rgba(34, 197, 94, 0.1);
}

.page-contact .wpcf7 form.invalid .wpcf7-response-output,
.page-contact .wpcf7 form.failed .wpcf7-response-output {
	color: #b91c1c;
}

/* Footer — dark band so it is not the old inverted header */
.site-footer {
	background: #0f172a;
	color: #cbd5e1;
	border-top: 0;
	margin-top: 0;
}

.site-footer .footer-widget-title,
.site-footer .footer-cta-title,
.site-footer .footer-status {
	color: #fff;
}

.site-footer .footer-brand-pitch,
.site-footer .footer-cta-text,
.site-footer .footer-links a,
.site-footer .footer-contact-line,
.site-footer .footer-services-grid a,
.site-footer .footer-bottom,
.site-footer .text-muted-light {
	color: #94a3b8 !important;
}

.site-footer .footer-links a:hover,
.site-footer .footer-contact-line:hover,
.site-footer .footer-services-grid a:hover,
.site-footer .footer-services-all {
	color: #e0e7ff !important;
}

.footer-cta-box {
	background:
		radial-gradient(130% 150% at 0% 0%, rgba(99, 102, 241, 0.28), transparent 46%),
		#111827;
	border-color: rgba(148, 163, 184, 0.16);
	box-shadow: none;
}

.footer-cta-points li,
.footer-cta-whatsapp {
	color: #e2e8f0;
}

.footer-cta-accent {
	-webkit-text-fill-color: #a5b4fc;
	color: #a5b4fc;
}

.footer-social-btn {
	background: rgba(255, 255, 255, 0.04);
	border-color: rgba(148, 163, 184, 0.18);
	color: #cbd5e1;
}

.footer-social-btn:hover {
	color: #fff;
}

.footer-main,
.footer-services,
.footer-bottom {
	border-color: rgba(148, 163, 184, 0.12);
}

/* About illustration */
.scene-art {
	position: relative;
	width: min(100%, 420px);
	margin-inline: auto;
	opacity: 1;
}

.about-art svg,
.scene-art svg {
	width: 100%;
	height: auto;
	overflow: visible;
}

.hero-art-float {
	transform-box: fill-box;
	transform-origin: center;
	animation: artFloat 6.5s ease-in-out infinite;
}

.hero-art-float-2 { animation-delay: -2s; }
.hero-art-float-3 { animation-delay: -3.4s; }

.hero-art-dash {
	stroke-dasharray: 8 10;
	animation: artDash 18s linear infinite;
}

.hero-art-pulse {
	transform-box: fill-box;
	transform-origin: center;
	animation: artPulse 3.2s ease-in-out infinite;
}

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

@keyframes artDash {
	to { stroke-dashoffset: -180; }
}

@keyframes artPulse {
	0%, 100% { transform: scale(1); opacity: 0.9; }
	50% { transform: scale(1.08); opacity: 1; }
}

.magnetic-ready .btn-accent {
	transition: transform 0.25s ease, box-shadow 0.25s ease, filter 0.25s ease;
}

@media (prefers-reduced-motion: reduce) {
	.hero-art-float,
	.hero-art-dash,
	.hero-art-pulse,
	.hero-float-chip,
	.hero-brand-dot,
	.footer-cta-orb,
	.footer-status-dot {
		animation: none !important;
	}
}

@media (max-width: 767.98px) {
	.reviews-cta {
		justify-content: flex-start;
		padding: 0 4.5rem 3.75rem 0;
	}

	.hero {
		padding-bottom: 2.5rem;
	}

	.hero-art {
		max-width: 360px;
		margin: 0 auto;
	}

	.brand-lockup-copy small {
		display: none;
	}
}