/* =========================================================================
   Arneeon Media — main stylesheet
   Foundation only. Page-specific styles are appended as templates are built.
   ========================================================================= */

/* ---------- Tokens ---------- */
:root {
	--background:       #030712;
	--foreground:       #d8dde8;
	--muted:            #0e1525;
	--muted-foreground: #7e8a9d;
	--card:             #0a1020;
	--card-elevated:    #111a2e;
	--border:           #1d2738;
	--input:            #1d2738;

	--primary:               #2454e6;
	--primary-hover:         #3361f0;
	--primary-foreground:    #f8fafc;

	--accent:               #ed5a26;
	--accent-hover:         #f06b3c;
	--accent-foreground:    #f8fafc;

	--secondary:               #88d35c;
	--secondary-foreground:    #030712;

	--destructive:          #b03030;

	--radius:           0.5rem;
	--radius-lg:        1rem;
	--radius-xl:        1.5rem;

	--container:        1200px;
	--container-narrow: 768px;
	--header-h:         64px;

	--font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
		"Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

	--shadow-sm:  0 1px 2px rgba(0,0,0,.4);
	--shadow-md:  0 6px 16px rgba(0,0,0,.45);
	--shadow-xl:  0 24px 60px rgba(0,0,0,.55);
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
	margin: 0;
	background: var(--background);
	color: var(--foreground);
	font-family: var(--font-sans);
	font-size: 1rem;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}
img, svg, video { display: block; max-width: 100%; height: auto; }
a { color: var(--primary); text-decoration: none; transition: color .15s ease; }
a:hover { color: var(--primary-hover); }
button { font: inherit; cursor: pointer; }
h1, h2, h3, h4, h5, h6 { margin: 0 0 .75em; line-height: 1.2; color: var(--foreground); font-weight: 700; }
h1 { font-size: clamp(2.5rem, 5vw, 4.5rem); font-weight: 800; letter-spacing: -.02em; }
h2 { font-size: clamp(2rem, 4vw, 3rem); font-weight: 700; letter-spacing: -.01em; }
h3 { font-size: 1.5rem; }
h4 { font-size: 1.125rem; }
p  { margin: 0 0 1em; color: var(--muted-foreground); }
.lead { font-size: 1.25rem; color: var(--muted-foreground); }
.eyebrow { display: inline-block; font-size: .75rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--primary); margin-bottom: .75rem; }

/* ---------- Accessibility ---------- */
.screen-reader-text {
	position: absolute !important;
	clip: rect(1px, 1px, 1px, 1px);
	height: 1px; width: 1px; overflow: hidden;
	word-wrap: normal !important;
}
.skip-link {
	position: absolute; left: -9999px; top: -9999px; z-index: 100;
	background: var(--primary); color: var(--primary-foreground);
	padding: .75rem 1rem; border-radius: var(--radius);
}
.skip-link:focus { left: 1rem; top: 1rem; }

/* ---------- Layout primitives ---------- */
.container { width: 100%; max-width: var(--container); margin: 0 auto; padding: 0 1.25rem; }
.container--narrow { max-width: var(--container-narrow); }
.section { padding: 5rem 0; position: relative; }
.section--narrow { padding: 3rem 0; }
.section--muted { background: rgba(14, 21, 37, .5); }
.text-center { text-align: center; }

/* ---------- Buttons ---------- */
.btn {
	display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
	padding: .65rem 1.25rem; height: 2.75rem;
	border: 1px solid transparent; border-radius: var(--radius);
	font-weight: 600; font-size: .95rem; line-height: 1;
	transition: background .15s ease, border-color .15s ease, color .15s ease, transform .15s ease;
	cursor: pointer; text-decoration: none;
}
.btn:hover { transform: translateY(-1px); }
.btn:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
.btn--primary { background: var(--primary); color: var(--primary-foreground); }
.btn--primary:hover { background: var(--primary-hover); color: var(--primary-foreground); }
.btn--outline { background: transparent; color: var(--foreground); border-color: var(--border); }
.btn--outline:hover { border-color: var(--primary); color: var(--primary); background: rgba(36, 84, 230, .08); }
.btn--ghost { background: transparent; color: var(--muted-foreground); }
.btn--ghost:hover { color: var(--foreground); background: rgba(255,255,255,.04); }
.btn--accent { background: var(--accent); color: var(--accent-foreground); }
.btn--accent:hover { background: var(--accent-hover); }
.btn--secondary { background: var(--secondary); color: var(--secondary-foreground); }
.btn--secondary:hover { background: color-mix(in srgb, var(--secondary) 85%, white); color: var(--secondary-foreground); }
.btn--lg { height: 3.5rem; padding: 0 2rem; font-size: 1.05rem; }
.btn[disabled] { opacity: .5; pointer-events: none; }

.cta-row { display: flex; gap: 1rem; flex-wrap: wrap; justify-content: center; }

/* ---------- Header ---------- */
.site-header {
	position: sticky; top: 0; z-index: 50;
	width: 100%;
	background: color-mix(in srgb, var(--background) 92%, transparent);
	border-bottom: 1px solid var(--border);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
}
.site-header__inner {
	display: flex; align-items: center; justify-content: space-between;
	height: var(--header-h); gap: 1.5rem;
}
.site-header__logo { display: inline-flex; align-items: center; flex-shrink: 0; }
.site-header__logo img,
.site-header__logo .custom-logo {
	height: 48px;
	width: auto;
	max-width: 240px;
	object-fit: contain;
	filter: drop-shadow(0 0 6px rgba(255,255,255,.6));
}
.site-header__nav { display: flex; align-items: center; gap: 2rem; }
.site-header__nav .primary-menu {
	display: flex; gap: 2rem; list-style: none; margin: 0; padding: 0;
	font-size: .9rem; font-weight: 500;
}
.site-header__nav .primary-menu a {
	color: var(--foreground); text-decoration: none;
	transition: color .15s ease;
}
.site-header__nav .primary-menu a:hover,
.site-header__nav .primary-menu .current-menu-item > a,
.site-header__nav .primary-menu .current_page_item > a {
	color: var(--primary);
}
.site-header__cta { height: 2.5rem; padding: 0 1.25rem; }

.site-header__toggle {
	display: none; background: transparent; border: 0; color: var(--foreground);
	padding: .5rem; border-radius: var(--radius);
}
.site-header__icon { width: 24px; height: 24px; }
.site-header__icon--close { display: none; }
[data-arneeon-nav-open] .site-header__icon--open { display: none; }
[data-arneeon-nav-open] .site-header__icon--close { display: block; }

@media (max-width: 900px) {
	.site-header__nav { display: none; }
	.site-header__toggle { display: inline-flex; }
	[data-arneeon-nav-open] .site-header__nav {
		display: flex; position: absolute; top: var(--header-h); left: 0; right: 0;
		flex-direction: column; align-items: stretch; gap: 1rem;
		padding: 1rem 1.25rem; background: var(--background);
		border-bottom: 1px solid var(--border);
	}
	[data-arneeon-nav-open] .site-header__nav .primary-menu {
		flex-direction: column; gap: 1rem;
	}
	.site-header__cta { width: 100%; }
}

/* ---------- Footer ---------- */
.site-footer {
	border-top: 1px solid var(--border);
	padding: 3rem 0 1.5rem;
	background: var(--background);
}
.site-footer__grid {
	display: grid; gap: 2.5rem; margin-bottom: 2rem;
	grid-template-columns: 2fr 1fr 1fr;
}
.site-footer__brand { max-width: 28rem; }
.site-footer__logo img {
	height: 60px;
	width: auto;
	max-width: 280px;
	object-fit: contain;
	margin-bottom: 1rem;
	filter: drop-shadow(0 0 6px rgba(255,255,255,.6));
}
.site-footer__tagline { color: var(--muted-foreground); margin-bottom: 1.25rem; }
.site-footer__social {
	display: flex; gap: .75rem; list-style: none; margin: 0; padding: 0;
}
.site-footer__social a {
	display: inline-flex; align-items: center; justify-content: center;
	width: 40px; height: 40px; border-radius: 50%;
	background: var(--muted); color: var(--muted-foreground);
	transition: background .15s ease, color .15s ease;
}
.site-footer__social a:hover { background: var(--primary); color: var(--primary-foreground); }

.site-footer__col h4 {
	color: var(--foreground); font-size: 1rem; margin-bottom: 1rem; font-weight: 700;
}
.site-footer__menu { list-style: none; margin: 0; padding: 0; }
.site-footer__menu li { margin-bottom: .5rem; }
.site-footer__menu a {
	color: var(--muted-foreground); text-decoration: none;
}
.site-footer__menu a:hover { color: var(--primary); }

.site-footer__bottom {
	padding-top: 1.5rem; border-top: 1px solid var(--border);
	text-align: center; color: var(--muted-foreground); font-size: .85rem;
}

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

/* ---------- Cards (used across pages) ---------- */
.card {
	background: rgba(10, 16, 32, .5);
	border: 1px solid var(--border);
	border-radius: var(--radius-xl);
	padding: 2rem;
	transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.card:hover { border-color: rgba(36, 84, 230, .4); transform: translateY(-4px); box-shadow: var(--shadow-md); }
.card__icon {
	width: 56px; height: 56px; border-radius: var(--radius);
	display: flex; align-items: center; justify-content: center;
	margin-bottom: 1.5rem;
}
.card__icon--primary   { background: rgba(36, 84, 230, .2); color: var(--primary); }
.card__icon--accent    { background: rgba(237, 90, 38, .2); color: var(--accent); }
.card__icon--secondary { background: rgba(136, 211, 92, .2); color: var(--secondary); }

/* ---------- Post list (default index) ---------- */
.post-list { display: grid; gap: 2rem; margin-top: 2rem; }
.post-card {
	background: var(--card); border: 1px solid var(--border);
	border-radius: var(--radius-xl); overflow: hidden;
}
.post-card__thumb img { width: 100%; height: auto; object-fit: cover; }
.post-card__body { padding: 1.5rem; }
.post-card__title { margin: 0 0 .5rem; font-size: 1.5rem; }
.post-card__title a { color: var(--foreground); }
.post-card__title a:hover { color: var(--primary); }
.post-card__meta { color: var(--muted-foreground); font-size: .85rem; margin-bottom: .75rem; }
.post-card__excerpt p { color: var(--muted-foreground); }
.post-card__more { font-weight: 600; }

/* ---------- Booking modal ---------- */
.booking-modal {
	position: fixed; inset: 0; z-index: 100;
	display: none;
	align-items: center; justify-content: center;
	padding: 1rem;
}
.booking-modal[data-state="open"] { display: flex; }
.booking-modal__overlay {
	position: absolute; inset: 0;
	background: rgba(0, 0, 0, .7);
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
}
.booking-modal__dialog {
	position: relative;
	background: var(--card); border: 1px solid var(--border);
	border-radius: var(--radius-xl);
	width: 100%; max-width: 880px; max-height: 92vh;
	overflow: hidden;
	box-shadow: var(--shadow-xl);
	display: flex; flex-direction: column;
}
.booking-modal__close {
	position: absolute; top: 1rem; right: 1rem; z-index: 5;
	width: 32px; height: 32px;
	display: inline-flex; align-items: center; justify-content: center;
	background: transparent; border: 0; color: var(--muted-foreground);
	border-radius: 50%;
	transition: background .15s ease, color .15s ease;
}
.booking-modal__close:hover { background: var(--card-elevated); color: var(--foreground); }
.booking-modal__layout {
	display: grid; grid-template-columns: 1fr; flex: 1; min-height: 0;
}
@media (min-width: 768px) {
	.booking-modal__layout { grid-template-columns: 1fr 1fr; height: 620px; }
}
.booking-modal__left, .booking-modal__right {
	padding: 1.5rem; overflow-y: auto;
	min-height: 0;
}
.booking-modal__left {
	background: rgba(14, 21, 37, .4);
	border-bottom: 1px solid var(--border);
}
@media (min-width: 768px) {
	.booking-modal__left { border-bottom: 0; border-right: 1px solid var(--border); }
}
.booking-modal__header { margin-bottom: 1.25rem; }
.booking-modal__header h2 { font-size: 1.5rem; margin-bottom: .25rem; }
.booking-modal__header p { color: var(--muted-foreground); font-size: .9rem; margin: 0; }
.booking-modal__form-title { font-size: 1.15rem; margin-bottom: 1rem; }

/* ---------- Calendar widget ---------- */
.booking-cal {
	background: rgba(3, 7, 18, .5); border: 1px solid var(--border);
	border-radius: var(--radius); padding: .75rem; margin-bottom: 1rem;
}
.booking-cal__loading { color: var(--muted-foreground); font-size: .9rem; text-align: center; padding: 1rem; }
.booking-cal__head {
	display: flex; align-items: center; justify-content: space-between;
	margin-bottom: .5rem;
}
.booking-cal__title { font-weight: 600; font-size: .95rem; color: var(--foreground); }
.booking-cal__nav {
	display: inline-flex; align-items: center; justify-content: center;
	width: 28px; height: 28px;
	background: transparent; border: 1px solid var(--border);
	color: var(--muted-foreground);
	border-radius: var(--radius);
	transition: border-color .15s ease, color .15s ease;
}
.booking-cal__nav:hover:not([disabled]) { color: var(--foreground); border-color: var(--primary); }
.booking-cal__nav[disabled] { opacity: .4; cursor: not-allowed; }
.booking-cal__weekdays, .booking-cal__grid {
	display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px;
}
.booking-cal__weekday {
	font-size: .7rem; text-transform: uppercase; letter-spacing: .05em;
	color: var(--muted-foreground); text-align: center;
	padding: .35rem 0;
}
.booking-cal__day {
	aspect-ratio: 1;
	display: inline-flex; align-items: center; justify-content: center;
	background: transparent; border: 1px solid transparent;
	color: var(--foreground); font-size: .85rem;
	border-radius: var(--radius);
	transition: background .15s ease, border-color .15s ease, color .15s ease;
	cursor: pointer;
}
.booking-cal__day:hover:not([disabled]):not([data-selected]) {
	background: rgba(36, 84, 230, .15);
	border-color: rgba(36, 84, 230, .3);
}
.booking-cal__day[disabled] { color: var(--muted-foreground); opacity: .35; cursor: not-allowed; }
.booking-cal__day--out-of-month { color: var(--muted-foreground); opacity: .4; }
.booking-cal__day[data-selected="true"] {
	background: var(--primary); color: var(--primary-foreground);
	border-color: var(--primary); font-weight: 600;
}
.booking-cal__day[data-today="true"]:not([data-selected="true"]) {
	border-color: var(--primary); color: var(--primary);
}

/* ---------- Slots grid ---------- */
.booking-slots:empty { display: none; }
.booking-slots__title { font-size: .8rem; font-weight: 600; color: var(--foreground); margin: 0 0 .5rem; }
.booking-slots__grid {
	display: grid; grid-template-columns: repeat(2, 1fr); gap: .5rem;
}
.booking-slots__slot {
	padding: .6rem; font-size: .9rem; font-weight: 500;
	background: transparent; border: 1px solid var(--border); color: var(--foreground);
	border-radius: var(--radius);
	transition: background .15s ease, border-color .15s ease, color .15s ease;
	cursor: pointer;
}
.booking-slots__slot:hover { border-color: var(--primary); color: var(--primary); }
.booking-slots__slot[data-selected="true"] {
	background: var(--primary); color: var(--primary-foreground); border-color: var(--primary);
}
.booking-slots__empty {
	color: var(--muted-foreground); font-size: .85rem; padding: .5rem 0;
}

/* ---------- Booking form ---------- */
.booking-form { display: flex; flex-direction: column; gap: 0; }
.booking-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.booking-form__consent { font-size: .75rem; color: var(--muted-foreground); margin: .5rem 0 1rem; }
.booking-form__submit { width: 100%; margin-top: auto; }
.booking-form input[disabled], .booking-form textarea[disabled] {
	opacity: .55; cursor: not-allowed;
}
.booking-form__success, .booking-form__error {
	margin-top: 1rem; padding: .65rem .85rem;
	border-radius: var(--radius); font-size: .85rem;
}
.booking-form__success { background: rgba(136, 211, 92, .12); color: var(--secondary); border: 1px solid rgba(136, 211, 92, .3); }
.booking-form__error   { background: rgba(176, 48, 48, .12); color: #ff8080;          border: 1px solid rgba(176, 48, 48, .3); }

/* Prevent body scroll when modal is open */
body[data-modal-open] { overflow: hidden; }

/* =========================================================================
   About page (page-about.php)
   ========================================================================= */

/* ---------- Shared page hero (About, Services, etc.) ---------- */
.about-hero, .page-hero {
	position: relative; padding: 5rem 0 4rem; overflow: hidden;
	background: linear-gradient(to bottom, var(--background), rgba(14, 21, 37, .3));
}
.about-hero__bg, .page-hero__bg { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.about-hero__glow, .page-hero__glow {
	position: absolute; border-radius: 50%; filter: blur(80px); opacity: .5;
}
.about-hero__glow--primary, .page-hero__glow--primary { top: -5rem; right: -5rem; width: 24rem; height: 24rem; background: rgba(36, 84, 230, .25); }
.about-hero__glow--accent, .page-hero__glow--accent    { bottom: -5rem; left: -5rem; width: 20rem; height: 20rem; background: rgba(237, 90, 38, .2); }
.about-hero__inner, .page-hero__inner { position: relative; z-index: 10; max-width: 56rem; text-align: center; margin: 0 auto; }

/* ---------- About intro: profile + copy ---------- */
.about-intro__grid {
	display: grid; gap: 3rem; align-items: start;
	grid-template-columns: 1fr;
	max-width: 1080px; margin: 0 auto;
}
@media (min-width: 900px) {
	.about-intro__grid { grid-template-columns: minmax(260px, 320px) 1fr; gap: 3.5rem; }
}

.about-intro__profile { display: flex; flex-direction: column; gap: 1.25rem; }
.about-intro__photo {
	margin: 0;
	background: var(--card); border: 1px solid var(--border);
	border-radius: var(--radius-xl); overflow: hidden;
	box-shadow: var(--shadow-md);
}
.about-intro__photo img { width: 100%; height: auto; display: block; }
.about-intro__photo figcaption {
	padding: 1rem; text-align: center;
}
.about-intro__photo figcaption strong {
	display: block; color: var(--foreground); font-size: 1.05rem; font-weight: 700;
}
.about-intro__photo figcaption span {
	display: block; color: var(--primary); font-size: .85rem; font-weight: 500; margin-top: .15rem;
}
.about-intro__quote {
	margin: 0;
	background: rgba(14, 21, 37, .4);
	border: 1px solid var(--border);
	border-radius: var(--radius-xl);
	padding: 1.25rem 1.4rem;
	font-style: italic; font-size: .9rem; line-height: 1.55;
	color: var(--muted-foreground);
}

.about-intro__copy { display: flex; flex-direction: column; gap: 1.25rem; font-size: 1.0625rem; line-height: 1.7; }
.about-intro__copy p { margin: 0; color: var(--muted-foreground); }
.about-intro__copy strong { color: var(--foreground); }

.about-intro__card {
	display: flex; flex-direction: column; sm-row: row;
	gap: 1.5rem; align-items: center;
	background: rgba(10, 16, 32, .5);
	border: 1px solid var(--border);
	border-radius: var(--radius-xl);
	padding: 1.5rem;
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	margin-top: .5rem;
}
@media (min-width: 600px) {
	.about-intro__card { flex-direction: row; }
}
.about-intro__lion {
	flex-shrink: 0;
	width: 160px; height: 160px;
	background: rgba(255, 255, 255, .04);
	border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	padding: 1rem;
}
.about-intro__lion img {
	width: 100%; height: 100%; object-fit: contain;
	filter: drop-shadow(0 0 10px rgba(255, 255, 255, .2));
}
.about-intro__card p { margin: 0; color: var(--muted-foreground); font-size: 1.0625rem; line-height: 1.6; }

/* ---------- About expertise list (3 stacked horizontal cards) ---------- */
.about-expertise__list { display: flex; flex-direction: column; gap: 1.5rem; max-width: 1080px; margin: 0 auto; }
.about-expertise__item {
	display: flex; flex-direction: column;
	gap: 1.5rem; align-items: flex-start;
	background: var(--background);
	border: 1px solid var(--border);
	border-radius: var(--radius-xl);
	padding: 2rem;
	box-shadow: var(--shadow-sm);
	transition: box-shadow .2s ease, border-color .2s ease;
}
.about-expertise__item:hover { box-shadow: var(--shadow-md); border-color: rgba(36, 84, 230, .3); }
@media (min-width: 700px) {
	.about-expertise__item { flex-direction: row; }
}
.about-expertise__icon {
	width: 64px; height: 64px; flex-shrink: 0; margin: 0;
	border-radius: var(--radius-lg);
}
.about-expertise__icon svg { width: 32px; height: 32px; }
.about-expertise__body h3 { margin-bottom: 1rem; font-size: 1.5rem; }
.about-expertise__body p { margin: 0; }

/* ---------- About testimonials placeholder ---------- */
.about-testimonials__widget { max-width: 1080px; margin: 0 auto; }
.about-testimonials__placeholder {
	min-height: 300px;
	display: flex; flex-direction: column; align-items: center; justify-content: center;
	border: 2px dashed var(--border);
	border-radius: var(--radius-xl);
	background: rgba(10, 16, 32, .3);
	padding: 2rem;
	text-align: center;
}
.about-testimonials__placeholder-title {
	font-size: 1.05rem; font-weight: 500; color: var(--foreground); margin: 0 0 .5rem;
}
.about-testimonials__placeholder-note {
	font-size: .85rem; color: var(--muted-foreground); margin: 0; max-width: 30rem;
}

/* ---------- What's in a Name? ---------- */
.about-name__grid {
	display: grid; gap: 3rem; align-items: center;
	grid-template-columns: 1fr;
	max-width: 1080px; margin: 0 auto;
}
@media (min-width: 800px) {
	.about-name__grid { grid-template-columns: 2fr 1fr; }
}
.about-name__copy p {
	font-size: 1.0625rem; line-height: 1.75; margin: 0 0 1.25rem;
	color: var(--muted-foreground);
}
.about-name__hashtag {
	font-weight: 700; font-size: 1.25rem; color: var(--primary); margin-top: 1.5rem !important;
}
.about-name__logo {
	display: flex; align-items: center; justify-content: center;
}
.about-name__logo img {
	max-width: 100%; width: auto; height: auto;
	filter: drop-shadow(0 0 15px rgba(255, 255, 255, .25));
}

/* =========================================================================
   Services page (page-services.php)
   ========================================================================= */

/* ---------- Three package cards ---------- */
.services-packages__grid {
	display: grid; gap: 2rem; grid-template-columns: 1fr;
	max-width: 1080px; margin: 0 auto;
}
@media (min-width: 700px)  { .services-packages__grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .services-packages__grid { grid-template-columns: repeat(3, 1fr); } }

.services-package {
	display: flex; flex-direction: column; height: 100%;
	background: rgba(10, 16, 32, .8); border: 1px solid var(--border);
	border-radius: var(--radius-xl); padding: 2rem;
	box-shadow: var(--shadow-md);
	backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
	transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.services-package:hover { transform: translateY(-6px); box-shadow: var(--shadow-xl); border-color: rgba(36, 84, 230, .35); }
.services-package__image {
	margin-bottom: 1.5rem;
	border-radius: var(--radius-lg); overflow: hidden;
	box-shadow: var(--shadow-sm);
}
.services-package__image img { width: 100%; height: auto; display: block; }
.services-package h3 { font-size: 1.5rem; margin-bottom: 1rem; }
.services-package p { color: var(--muted-foreground); margin-bottom: 2rem; flex: 1; }
.services-package__cta { width: 100%; }

/* ---------- Service details (alternating two-column) ---------- */
.services-details__row {
	display: grid; gap: 3rem; align-items: center;
	grid-template-columns: 1fr;
	max-width: 1080px; margin: 0 auto;
}
@media (min-width: 900px) {
	.services-details__row { grid-template-columns: 1fr 1fr; }
}
.services-details__row--reverse .services-details__copy { order: 2; }
.services-details__row--reverse .services-details__image { order: 1; }
@media (max-width: 899px) {
	.services-details__row--reverse .services-details__copy,
	.services-details__row--reverse .services-details__image { order: initial; }
}
.services-details__copy h3 { font-size: 1.875rem; margin-bottom: 1.25rem; }
.services-details__copy .lead { font-size: 1.15rem; margin-bottom: 1.25rem; }
.services-details__copy p { font-size: 1.0625rem; line-height: 1.7; margin-bottom: 1.25rem; }
.services-details__copy p:last-child { margin-bottom: 0; }
.services-details__image {
	border-radius: var(--radius-xl); overflow: hidden;
	border: 1px solid var(--border); box-shadow: var(--shadow-xl);
}
.services-details__image--light {
	background: #fff; padding: 1rem;
}
.services-details__image img { width: 100%; height: auto; display: block; object-fit: contain; }

/* ---------- Combo callout card ---------- */
.services-combo__card {
	position: relative; overflow: hidden;
	background: linear-gradient(135deg, rgba(36, 84, 230, .12), rgba(237, 90, 38, .12), rgba(136, 211, 92, .1));
	border: 1px solid var(--border);
	border-radius: var(--radius-xl);
	padding: 3rem 2rem;
	text-align: center;
	max-width: 1080px; margin: 0 auto;
}
.services-combo__bg-art {
	position: absolute; top: 0; right: 0;
	width: 16rem; height: 16rem;
	opacity: .1; object-fit: cover;
	pointer-events: none;
}
.services-combo__card h3 { font-size: 2rem; margin-bottom: 1.25rem; position: relative; }
.services-combo__card p {
	font-size: 1.125rem; line-height: 1.7;
	max-width: 56rem; margin: 0 auto 2rem;
	position: relative;
}
.services-combo__card strong { color: var(--foreground); font-weight: 700; }
.services-combo__card .btn { position: relative; }

/* ---------- More specialized services ---------- */
.services-more__grid {
	display: grid; gap: 1.5rem; grid-template-columns: 1fr;
	max-width: 1080px; margin: 0 auto;
}
@media (min-width: 700px)  { .services-more__grid { grid-template-columns: repeat(3, 1fr); } }

.services-more__card {
	display: flex; flex-direction: column; align-items: center;
	text-align: center;
	background: rgba(10, 16, 32, .5);
	border: 1px solid var(--border); border-radius: var(--radius-xl);
	padding: 1.75rem 1.5rem;
	color: var(--foreground); text-decoration: none;
	cursor: pointer;
	transition: background .2s ease, border-color .2s ease;
	font: inherit;
}
.services-more__card:hover { background: rgba(36, 84, 230, .05); border-color: rgba(36, 84, 230, .3); }
.services-more__icon {
	width: 48px; height: 48px; border-radius: 9999px;
	display: flex; align-items: center; justify-content: center;
	margin-bottom: 1rem;
}
.services-more__icon--primary   { background: rgba(36, 84, 230, .2); color: var(--primary); }
.services-more__icon--accent    { background: rgba(237, 90, 38, .2); color: var(--accent); }
.services-more__icon--secondary { background: rgba(136, 211, 92, .2); color: var(--secondary); }
.services-more__card h4 { font-size: 1rem; margin: 0 0 .5rem; color: var(--foreground); }
.services-more__card p  { font-size: .85rem; color: var(--muted-foreground); margin: 0; }

/* ---------- AI & Automations grid ---------- */
.services-ai__grid {
	display: grid; gap: 2rem; grid-template-columns: 1fr;
	max-width: 1080px; margin: 0 auto;
}
@media (min-width: 800px)  { .services-ai__grid { grid-template-columns: repeat(2, 1fr); } }
.services-ai__card { display: flex; flex-direction: column; height: 100%; }
.services-ai__card h3 { margin-bottom: 1rem; font-size: 1.5rem; }
.services-ai__card p { flex: 1; margin-bottom: 1.5rem; }
.services-ai__card--wide {
	display: flex; flex-direction: column; gap: 1.5rem;
}
@media (min-width: 800px) {
	.services-ai__card--wide { grid-column: span 2; flex-direction: row; align-items: center; }
}
.services-ai__voice-icon {
	flex-shrink: 0; width: 80px; height: 80px;
	display: flex; align-items: center; justify-content: center;
	background: rgba(237, 90, 38, .2); color: var(--accent);
	border-radius: 9999px;
}
.services-ai__card--wide h3 { margin-bottom: .75rem; }
.services-ai__card--wide p { margin-bottom: 1rem; }

/* =========================================================================
   Sub-service pages (GMB, Free SEO Audit)
   ========================================================================= */

.subpage-hero {
	padding: 4rem 0 1rem;
	background: linear-gradient(to bottom, rgba(14, 21, 37, .5), var(--background));
}
.subpage-back {
	display: inline-flex; align-items: center; gap: .25rem;
	color: var(--primary); font-weight: 500; font-size: .9rem;
	margin-bottom: 2rem;
}
.subpage-back:hover { text-decoration: underline; }
.subpage-hero__head { max-width: 50rem; }
.subpage-hero__head h1 { font-size: clamp(2.25rem, 5vw, 3.25rem); margin-bottom: 1rem; }
.subpage-hero__head .lead { font-size: 1.15rem; }

.subpage { padding-top: 3rem; }

.subpage-features {
	display: grid; gap: 1.5rem; grid-template-columns: 1fr;
	margin-bottom: 3rem;
}
@media (min-width: 700px) { .subpage-features { grid-template-columns: repeat(3, 1fr); } }
.subpage-feature {
	text-align: center;
	background: rgba(10, 16, 32, .5);
	border: 1px solid var(--border);
	border-radius: var(--radius-xl);
	padding: 1.5rem;
}
.subpage-feature .card__icon { margin: 0 auto 1rem; }
.subpage-feature h3 { font-size: 1.1rem; margin-bottom: .5rem; }
.subpage-feature p { font-size: .9rem; color: var(--muted-foreground); margin: 0; }

.subpage-body { margin-bottom: 3rem; }
.subpage-body p {
	font-size: 1.0625rem; line-height: 1.75;
	color: var(--muted-foreground); margin-bottom: 1.25rem;
}
.subpage-body p:last-child { margin-bottom: 0; }

.subpage-cta {
	background: rgba(36, 84, 230, .1);
	border: 1px solid rgba(36, 84, 230, .25);
	border-radius: var(--radius-xl);
	padding: 2rem;
	text-align: center;
}
.subpage-cta h3 { font-size: 1.5rem; margin-bottom: .75rem; }
.subpage-cta p { font-size: 1rem; color: var(--muted-foreground); margin-bottom: 1.5rem; }
.subpage-cta--secondary {
	background: rgba(237, 90, 38, .08);
	border-color: rgba(237, 90, 38, .25);
}

/* =========================================================================
   Blog archive (page-blog.php)
   ========================================================================= */

.blog__grid {
	display: grid; gap: 2rem; grid-template-columns: 1fr;
	margin-bottom: 3rem;
}
@media (min-width: 700px)  { .blog__grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .blog__grid { grid-template-columns: repeat(3, 1fr); } }

.blog__card {
	display: flex; flex-direction: column;
	background: rgba(10, 16, 32, .5);
	border: 1px solid var(--border);
	border-radius: var(--radius-xl);
	overflow: hidden;
	transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.blog__card:hover { border-color: rgba(36, 84, 230, .4); transform: translateY(-3px); box-shadow: var(--shadow-md); }

.blog__thumb {
	display: block; aspect-ratio: 16 / 9; overflow: hidden;
	background: var(--card-elevated);
}
.blog__thumb img {
	width: 100%; height: 100%; object-fit: cover;
	transition: transform .35s ease;
}
.blog__card:hover .blog__thumb img { transform: scale(1.04); }

.blog__body { padding: 1.5rem; display: flex; flex-direction: column; flex: 1; }
.blog__cat {
	display: inline-block;
	font-size: .7rem; font-weight: 600; text-transform: uppercase;
	letter-spacing: .08em;
	color: var(--primary);
	margin-bottom: .75rem;
	text-decoration: none;
}
.blog__cat:hover { text-decoration: underline; }

.blog__title { font-size: 1.25rem; margin-bottom: .75rem; line-height: 1.35; }
.blog__title a { color: var(--foreground); }
.blog__title a:hover { color: var(--primary); }

.blog__excerpt {
	color: var(--muted-foreground); font-size: .95rem; line-height: 1.6;
	margin-bottom: 1.25rem;
	flex: 1;
	display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical;
	overflow: hidden;
}
.blog__excerpt p { margin: 0; }

.blog__foot {
	display: flex; align-items: center; justify-content: space-between;
	padding-top: 1rem; border-top: 1px solid var(--border);
	font-size: .8rem;
}
.blog__date {
	display: inline-flex; align-items: center; gap: .35rem;
	color: var(--muted-foreground);
}
.blog__more {
	display: inline-flex; align-items: center; gap: .25rem;
	font-weight: 600; color: var(--primary);
}
.blog__more:hover { text-decoration: underline; }

/* Pagination */
.blog__pagination {
	display: flex; justify-content: center; gap: .35rem; flex-wrap: wrap;
	margin-top: 2rem;
}
.blog__pagination .page-numbers,
.blog__pagination a,
.blog__pagination span {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 2.5rem; height: 2.5rem; padding: 0 .75rem;
	border: 1px solid var(--border); border-radius: var(--radius);
	background: transparent;
	color: var(--foreground); text-decoration: none;
	font-size: .9rem; font-weight: 500;
	transition: border-color .15s ease, color .15s ease, background .15s ease;
}
.blog__pagination a:hover { border-color: var(--primary); color: var(--primary); }
.blog__pagination .current {
	background: var(--primary); color: var(--primary-foreground); border-color: var(--primary);
}
.blog__pagination .dots {
	border: 0; color: var(--muted-foreground);
}

/* Empty state */
.blog__empty {
	max-width: 40rem; margin: 0 auto; text-align: center;
	padding: 4rem 1rem;
	border: 2px dashed var(--border);
	border-radius: var(--radius-xl);
}
.blog__empty h2 { margin-bottom: 1rem; }
.blog__empty p { color: var(--muted-foreground); margin: 0; }

/* Section headings */
.blog__section-head { margin-bottom: 2rem; max-width: 64rem; }
.blog__section-head h2 { font-size: 1.875rem; margin-bottom: .35rem; }
.blog__section-head p {
	color: var(--muted-foreground); font-size: 1rem;
	margin: 0; line-height: 1.55;
}
.blog__section-head--archive {
	margin-top: 4rem; padding-top: 3rem;
	border-top: 1px solid var(--border);
}

/* Category teaser tiles */
.blog__categories {
	display: grid; gap: 1.5rem; grid-template-columns: 1fr;
}
@media (min-width: 700px)  { .blog__categories { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1200px) { .blog__categories { grid-template-columns: repeat(2, 1fr); } }

.blog__cat-tile {
	display: flex; gap: 1.25rem; align-items: stretch;
	background: rgba(10, 16, 32, .5);
	border: 1px solid var(--border);
	border-radius: var(--radius-xl);
	overflow: hidden;
	color: inherit; text-decoration: none;
	transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease;
	min-height: 160px;
}
.blog__cat-tile:hover {
	border-color: rgba(36, 84, 230, .5);
	transform: translateY(-3px);
	box-shadow: var(--shadow-md);
}
.blog__cat-tile__image {
	flex-shrink: 0; width: 140px;
	background: var(--card-elevated);
	display: flex; align-items: center; justify-content: center;
	overflow: hidden;
}
.blog__cat-tile__image img {
	width: 100%; height: 100%; object-fit: cover;
	transition: transform .3s ease;
}
.blog__cat-tile:hover .blog__cat-tile__image img { transform: scale(1.05); }
.blog__cat-tile__placeholder {
	color: var(--muted-foreground); opacity: .5;
}
.blog__cat-tile__body {
	flex: 1; min-width: 0;
	padding: 1.25rem 1.5rem 1.25rem 0;
	display: flex; flex-direction: column;
}
.blog__cat-tile__body h3 {
	font-size: 1.2rem; line-height: 1.25;
	margin-bottom: .25rem; color: var(--foreground);
}
.blog__cat-tile__count {
	font-size: .75rem; font-weight: 600;
	letter-spacing: .05em; text-transform: uppercase;
	color: var(--primary);
	margin: 0 0 .75rem;
}
.blog__cat-tile__desc {
	font-size: .9rem; color: var(--muted-foreground);
	margin: 0 0 .5rem; line-height: 1.5;
}
.blog__cat-tile__latest {
	font-size: .85rem; color: var(--muted-foreground);
	margin: 0 0 .75rem; line-height: 1.5;
}
.blog__cat-tile__latest span {
	color: var(--foreground); font-weight: 600;
}
.blog__cat-tile__cta {
	display: inline-flex; align-items: center; gap: .25rem;
	margin-top: auto;
	color: var(--primary); font-weight: 600; font-size: .9rem;
	transition: gap .2s ease;
}
.blog__cat-tile:hover .blog__cat-tile__cta { gap: .5rem; }

@media (max-width: 500px) {
	.blog__cat-tile { flex-direction: column; }
	.blog__cat-tile__image { width: 100%; height: 140px; }
	.blog__cat-tile__body { padding: 1.25rem; }
}

/* =========================================================================
   Single blog post (single.php)
   ========================================================================= */

.single-post__header {
	padding: 3rem 0 2rem;
	background: linear-gradient(to bottom, rgba(14, 21, 37, .4), var(--background));
}
.single-post__cat {
	display: inline-block; margin-bottom: 1.25rem;
}
.single-post__title {
	font-size: clamp(2rem, 4vw, 3rem);
	line-height: 1.15;
	margin-bottom: 1.5rem;
}
.single-post__meta {
	display: flex; gap: 1.5rem; flex-wrap: wrap;
	color: var(--muted-foreground); font-size: .9rem;
}
.single-post__meta time, .single-post__author {
	display: inline-flex; align-items: center; gap: .35rem;
}

.single-post__hero {
	padding: 0 0 2rem;
}
.single-post__featured, .single-post__hero img {
	width: 100%; max-width: 1080px; height: auto;
	border-radius: var(--radius-xl);
	border: 1px solid var(--border);
	box-shadow: var(--shadow-xl);
	margin: 0 auto;
	display: block;
}

.single-post__content { padding-top: 0; }

/* ---------- .prose typography for the_content() output ---------- */
.prose {
	font-size: 1.0625rem;
	line-height: 1.75;
	color: var(--foreground);
}
.prose > * + * { margin-top: 1.5rem; }
.prose p { color: var(--muted-foreground); margin: 0; }
.prose strong { color: var(--foreground); font-weight: 700; }
.prose em { font-style: italic; }
.prose a { color: var(--primary); text-decoration: underline; text-underline-offset: 3px; }
.prose a:hover { color: var(--primary-hover); }

.prose h2 {
	font-size: 1.875rem; margin-top: 2.5rem; margin-bottom: 1rem;
	color: var(--foreground); line-height: 1.25;
}
.prose h3 {
	font-size: 1.5rem; margin-top: 2rem; margin-bottom: .75rem;
	color: var(--foreground); line-height: 1.3;
}
.prose h4 {
	font-size: 1.25rem; margin-top: 1.75rem; margin-bottom: .5rem;
	color: var(--foreground); line-height: 1.35;
}

.prose ul, .prose ol { padding-left: 1.5rem; color: var(--muted-foreground); }
.prose ul { list-style: disc; }
.prose ol { list-style: decimal; }
.prose li { margin-top: .5rem; }
.prose li > ul, .prose li > ol { margin-top: .5rem; margin-bottom: .5rem; }

.prose blockquote {
	border-left: 3px solid var(--primary);
	padding: .5rem 0 .5rem 1.25rem;
	margin: 1.5rem 0;
	font-style: italic;
	color: var(--foreground);
	font-size: 1.125rem;
}
.prose blockquote p { color: var(--foreground); }

.prose code {
	background: var(--card-elevated);
	border: 1px solid var(--border);
	padding: .15rem .4rem; border-radius: 4px;
	font-size: .9em; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
	color: var(--accent);
}
.prose pre {
	background: var(--card-elevated);
	border: 1px solid var(--border);
	border-radius: var(--radius);
	padding: 1rem 1.25rem; overflow-x: auto;
	font-size: .9em; line-height: 1.6;
}
.prose pre code {
	background: transparent; border: 0; padding: 0;
	color: var(--foreground);
}

.prose img, .prose .wp-block-image img {
	max-width: 100%; height: auto;
	border-radius: var(--radius-lg);
	margin: 1.5rem auto;
}
.prose figure { margin: 1.5rem 0; }
.prose figcaption {
	text-align: center; font-size: .85rem; color: var(--muted-foreground);
	margin-top: .5rem;
}

.prose hr {
	border: 0; border-top: 1px solid var(--border);
	margin: 2.5rem 0;
}

.prose table {
	width: 100%; border-collapse: collapse; margin: 1.5rem 0;
}
.prose table th, .prose table td {
	padding: .65rem .85rem; text-align: left;
	border-bottom: 1px solid var(--border);
}
.prose table th { background: var(--card-elevated); font-weight: 600; }

/* Tags + wp_link_pages */
.single-post__tags {
	display: flex; flex-wrap: wrap; gap: .5rem;
	margin-top: 2.5rem; padding-top: 1.5rem; border-top: 1px solid var(--border);
}
.single-post__tag {
	display: inline-block;
	padding: .35rem .75rem; border-radius: 9999px;
	background: var(--card-elevated); border: 1px solid var(--border);
	color: var(--muted-foreground); font-size: .8rem; text-decoration: none;
	transition: border-color .15s ease, color .15s ease;
}
.single-post__tag:hover { border-color: var(--primary); color: var(--primary); }

.single-post__pages {
	margin-top: 2rem; padding-top: 1.5rem;
	border-top: 1px solid var(--border);
	display: flex; gap: .5rem; align-items: center;
	font-size: .9rem;
}
.single-post__pages span:first-child { color: var(--muted-foreground); margin-right: .5rem; }
.single-post__pages a, .single-post__pages > span:not(:first-child) {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 2rem; height: 2rem; padding: 0 .5rem;
	border: 1px solid var(--border); border-radius: var(--radius);
}

/* Prev / next post nav */
.single-post__nav { padding: 2rem 0; }
.single-post__nav-grid {
	display: grid; gap: 1rem;
	grid-template-columns: 1fr;
}
@media (min-width: 600px) {
	.single-post__nav-grid { grid-template-columns: 1fr 1fr; }
}
.single-post__nav-link {
	display: flex; flex-direction: column; gap: .35rem;
	background: var(--card); border: 1px solid var(--border);
	border-radius: var(--radius-lg);
	padding: 1rem 1.25rem;
	color: var(--foreground); text-decoration: none;
	transition: border-color .2s ease, background .2s ease;
}
.single-post__nav-link:hover { border-color: var(--primary); background: rgba(36, 84, 230, .05); }
.single-post__nav-link--next { text-align: right; }
.single-post__nav-dir { font-size: .8rem; color: var(--primary); font-weight: 600; }
.single-post__nav-title { font-size: .95rem; font-weight: 600; }

.single-post__cta { padding: 3rem 0; }

/* =========================================================================
   Legal pages (privacy policy, terms and conditions)
   ========================================================================= */

.legal { padding: 4rem 0 5rem; }
.legal__header {
	padding-bottom: 1.5rem; margin-bottom: 2rem;
	border-bottom: 1px solid var(--border);
}
.legal__header h1 {
	font-size: clamp(2.25rem, 4vw, 3rem);
	margin-bottom: .5rem;
}
.legal__updated {
	font-size: .9rem; color: var(--muted-foreground);
	margin: 0; font-weight: 500;
}
.legal .prose { font-size: 1rem; line-height: 1.75; }
.legal .prose h3 {
	font-size: 1.25rem; margin-top: 2rem; margin-bottom: .75rem;
	color: var(--foreground);
}

/* =========================================================================
   Yoast breadcrumbs
   ========================================================================= */

.breadcrumbs {
	padding: 1rem 0;
	font-size: .85rem;
	color: var(--muted-foreground);
	border-bottom: 1px solid var(--border);
	background: rgba(14, 21, 37, .25);
}
.breadcrumbs a { color: var(--muted-foreground); text-decoration: none; }
.breadcrumbs a:hover { color: var(--primary); text-decoration: underline; }
.breadcrumbs .breadcrumb_last,
.breadcrumbs > span > .breadcrumb_last { color: var(--foreground); font-weight: 500; }

/* =========================================================================
   Search form (search.php hero)
   ========================================================================= */

.search-form {
	display: flex; gap: .5rem; max-width: 32rem; margin: 0 auto;
}
.search-form input[type="search"] {
	flex: 1; min-width: 0;
	background: rgba(3, 7, 18, .6);
	border: 1px solid var(--border); border-radius: var(--radius);
	color: var(--foreground);
	padding: .65rem 1rem;
	font: inherit;
	transition: border-color .15s ease, box-shadow .15s ease;
}
.search-form input[type="search"]:focus {
	outline: none; border-color: var(--primary);
	box-shadow: 0 0 0 3px rgba(36, 84, 230, .15);
}

/* =========================================================================
   Home page (front-page.php)
   ========================================================================= */

/* ---------- Hero ---------- */
.hero { position: relative; padding: 4rem 0 5rem; overflow: hidden; }
.hero__bg { position: absolute; inset: 0; z-index: 0; }
.hero__bg-image {
	position: absolute; inset: 0; width: 100%; height: 100%;
	object-fit: cover; opacity: .55;
	filter: saturate(1.5) contrast(1.25);
	-webkit-mask-image: radial-gradient(ellipse at center, black 40%, transparent 80%);
	mask-image: radial-gradient(ellipse at center, black 40%, transparent 80%);
}
/* Vertical gradient overlay: fades hero image to dark at bottom for text contrast */
.hero__bg::after {
	content: '';
	position: absolute; inset: 0; z-index: 2; pointer-events: none;
	background: linear-gradient(to bottom,
		rgba(3, 7, 18, .1) 0%,
		rgba(3, 7, 18, .65) 55%,
		rgba(3, 7, 18, 1) 100%);
}
.hero__bg-glow {
	position: absolute; border-radius: 50%; filter: blur(100px); pointer-events: none;
	mix-blend-mode: screen; opacity: .6; z-index: 3;
}
.hero__bg-glow--primary { top: 0; right: 0; width: 500px; height: 500px; background: rgba(36, 84, 230, .3); }
.hero__bg-glow--accent { bottom: 0; left: 0; width: 400px; height: 400px; background: rgba(237, 90, 38, .3); }
.hero__inner { position: relative; z-index: 10; text-align: center; max-width: 56rem; }
.hero__eyebrow {
	display: inline-flex; align-items: center; gap: .5rem;
	padding: .25rem .85rem; margin-bottom: 2rem;
	border: 1px solid rgba(36, 84, 230, .3);
	border-radius: 9999px;
	background: rgba(36, 84, 230, .1);
	color: var(--primary);
	font-size: .85rem; font-weight: 600;
}
.hero__eyebrow-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--primary); }
.hero__title {
	font-size: clamp(2.75rem, 6vw, 4.5rem);
	font-weight: 800; letter-spacing: -.025em; line-height: 1.1;
	margin-bottom: 1.5rem;
}
.hero__title-accent {
	display: inline-block; margin-top: .25rem;
	padding-bottom: .18em; /* Stops descenders (g, y, p) being clipped by background-clip: text */
	background: linear-gradient(90deg, var(--primary), var(--accent));
	-webkit-background-clip: text; background-clip: text;
	color: transparent;
	line-height: 1.15;
}
/* Force a line break before the gradient tagline on desktop; flow naturally on mobile. */
.hero__title-br { display: none; }
@media (min-width: 768px) { .hero__title-br { display: inline; } }
.hero__lead { font-size: 1.15rem; max-width: 42rem; margin: 0 auto 2.5rem; }
.hero__ctas { display: flex; flex-wrap: wrap; gap: 1rem; justify-content: center; }

/* ---------- Section heads ---------- */
.section__head { max-width: 50rem; margin: 0 auto 3rem; text-align: center; }
.section__head h2 { margin-bottom: 1rem; }
.section__head .lead { font-size: 1.05rem; }

/* ---------- Services grid ---------- */
.services-grid__cards { display: grid; gap: 2rem; grid-template-columns: 1fr; }
@media (min-width: 768px)  { .services-grid__cards { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .services-grid__cards { grid-template-columns: repeat(3, 1fr); } }
.services-grid__card { display: flex; flex-direction: column; height: 100%; }
.services-grid__card h3 { margin-bottom: 1rem; }
.services-grid__card p { flex: 1; margin-bottom: 1.5rem; }
.card__icon-img { display: flex; align-items: center; height: 72px; margin-bottom: 1.5rem; }
.card__icon-img img { height: 100%; width: auto; object-fit: contain; }
.card__link {
	display: inline-flex; align-items: center; gap: .35rem;
	font-weight: 600; font-size: .95rem; color: var(--primary);
}
.card__link:hover { text-decoration: underline; }
.card__link--accent    { color: var(--accent); }
.card__link--secondary { color: var(--secondary); }

/* ---------- AI & Loyalty ---------- */
.ai-loyalty { position: relative; overflow: hidden; }
.ai-loyalty::before, .ai-loyalty::after {
	content: ''; position: absolute; border-radius: 50%;
	filter: blur(100px); z-index: -1; pointer-events: none;
}
.ai-loyalty::before { top: 0; left: 0; width: 500px; height: 500px; background: rgba(237, 90, 38, .1); }
.ai-loyalty::after  { bottom: 0; right: 0; width: 400px; height: 400px; background: rgba(36, 84, 230, .1); }
.ai-loyalty__grid { display: grid; gap: 4rem; align-items: center; grid-template-columns: 1fr; }
@media (min-width: 1024px) { .ai-loyalty__grid { grid-template-columns: 1fr 1fr; } }
.ai-loyalty__copy h2 { margin-bottom: 1.5rem; }
.ai-loyalty__copy .lead { margin-bottom: 2rem; }
.ai-loyalty__items { display: flex; flex-direction: column; gap: 2rem; margin-bottom: 2.5rem; }
.ai-loyalty__item { display: flex; gap: 1rem; align-items: flex-start; }
.ai-loyalty__logo {
	flex-shrink: 0; width: 96px; height: 96px; padding: .75rem;
	display: flex; align-items: center; justify-content: center;
	background: rgba(255,255,255,.05); border-radius: var(--radius);
	transition: background .2s ease;
}
.ai-loyalty__logo:hover { background: rgba(255,255,255,.1); }
.ai-loyalty__logo img {
	width: 100%; height: auto; object-fit: contain;
	filter: drop-shadow(0 0 6px rgba(255,255,255,.6));
}
.ai-loyalty__icon {
	flex-shrink: 0; width: 48px; height: 48px;
	display: flex; align-items: center; justify-content: center;
	background: rgba(237, 90, 38, .2); color: var(--accent);
	border-radius: 9999px; margin-top: .25rem;
}
.ai-loyalty__item h4 { font-size: 1.25rem; margin-bottom: .5rem; color: var(--foreground); }
.ai-loyalty__item h4 a { color: var(--foreground); }
.ai-loyalty__item h4 a:hover { color: var(--primary); }
.ai-loyalty__cta { background: linear-gradient(90deg, var(--primary), var(--accent)); border: 0; }
.ai-loyalty__cta:hover { opacity: .9; }
.ai-loyalty__image { position: relative; }
.ai-loyalty__image-glow {
	position: absolute; inset: -1rem; z-index: 0;
	background: linear-gradient(to top right, rgba(36, 84, 230, .2), rgba(237, 90, 38, .2));
	filter: blur(40px); border-radius: 50%;
}
.ai-loyalty__image img {
	position: relative; z-index: 1; width: 100%; height: auto;
	border-radius: var(--radius-xl); border: 1px solid var(--border);
	box-shadow: var(--shadow-xl);
}

/* ---------- Contact section ---------- */
.contact { position: relative; overflow: hidden; border-top: 1px solid var(--border); }
.contact__grid-bg {
	position: absolute; inset: 0; z-index: 0; opacity: .06; color: var(--foreground);
	background-image:
		linear-gradient(to right, currentColor 1px, transparent 1px),
		linear-gradient(to bottom, currentColor 1px, transparent 1px);
	background-size: 24px 24px;
}
.contact__halo {
	position: absolute; top: 0; left: 50%; transform: translateX(-50%);
	width: 310px; height: 310px; z-index: -1;
	background: rgba(36, 84, 230, .2);
	border-radius: 50%; filter: blur(100px);
}
.contact__grid { position: relative; z-index: 10; display: grid; gap: 4rem; grid-template-columns: 1fr; }
@media (min-width: 768px) { .contact__grid { grid-template-columns: 1fr 1fr; } }
.contact__intro h2 { margin-bottom: 1.5rem; }
.contact__intro .lead { margin-bottom: 2rem; }
.contact__methods { list-style: none; padding: 0; margin: 0 0 2rem; display: flex; flex-direction: column; gap: 1.5rem; }
.contact__methods > li { display: flex; gap: 1rem; align-items: center; }
.contact__method-button {
	display: flex; gap: 1rem; align-items: center;
	background: transparent; border: 0; padding: 0; cursor: pointer;
	color: inherit; text-align: left; width: 100%;
}
.contact__method-button:hover .contact__method-icon { border-color: var(--primary); color: var(--primary); }
.contact__method-button:hover strong { color: var(--primary); }
.contact__method-icon {
	position: relative;
	width: 48px; height: 48px; flex-shrink: 0;
	background: var(--card-elevated); border: 1px solid var(--border);
	border-radius: 9999px; color: var(--primary);
	transition: border-color .2s ease, color .2s ease;
}
/* Absolute centering — bypasses inline-flex baseline alignment quirks */
.contact__method-icon svg {
	position: absolute;
	top: 50%; left: 50%;
	transform: translate(-50%, -50%);
	display: block;
	width: 24px; height: 24px;
}
.contact__methods strong {
	display: block; color: var(--foreground); margin-bottom: .2rem;
	font-size: 1.0625rem; font-weight: 600;
}
.contact__methods span  {
	display: block; color: var(--muted-foreground);
	font-size: .95rem; font-weight: 500;
}

.contact__form { padding: 2rem; box-shadow: var(--shadow-md); }
.contact__form h3 { margin-bottom: 1.5rem; }
.form-field { display: flex; flex-direction: column; gap: .5rem; margin-bottom: 1rem; }
.form-field label { font-size: .85rem; font-weight: 600; color: var(--foreground); }
.form-field input, .form-field textarea, .form-field select {
	width: 100%;
	background: rgba(3, 7, 18, .5);
	border: 1px solid var(--border); border-radius: var(--radius);
	color: var(--foreground);
	padding: .65rem .85rem;
	font: inherit;
	transition: border-color .15s ease, box-shadow .15s ease;
}
.form-field input:focus, .form-field textarea:focus, .form-field select:focus {
	outline: none; border-color: var(--primary);
	box-shadow: 0 0 0 3px rgba(36, 84, 230, .15);
}
.form-field textarea { resize: vertical; min-height: 96px; }
.contact__consent { font-size: .8rem; color: var(--muted-foreground); margin: .5rem 0 1rem; }
.contact__form .btn { width: 100%; }
.contact__success, .contact__error {
	margin-top: 1rem; padding: .75rem 1rem;
	border-radius: var(--radius); font-size: .9rem;
}
.contact__success { background: rgba(136, 211, 92, .12); color: var(--secondary); border: 1px solid rgba(136, 211, 92, .3); }
.contact__error   { background: rgba(176, 48, 48, .12); color: #ff8080;          border: 1px solid rgba(176, 48, 48, .3); }

/* ---------- Scroll-triggered fade-in (replaces Framer Motion) ---------- */
[data-arneeon-fade] {
	opacity: 0; transform: translateY(20px);
	transition: opacity .6s ease, transform .6s ease;
}
[data-arneeon-fade].is-visible { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
	[data-arneeon-fade] { opacity: 1; transform: none; transition: none; }
}