:root {
	--abik-obsidian: #07090d;
	--abik-midnight: #0d141d;
	--abik-charcoal: #1a212c;
	--abik-gold: #b6955c;
	--abik-gold-soft: #dbc48d;
	--abik-silver: #8d98a7;
	--abik-platinum: #cfd5de;
	--abik-paper: #f5f1e8;
	--abik-line: rgba(207, 213, 222, 0.14);
	--abik-panel: rgba(13, 20, 29, 0.84);
	--abik-panel-strong: rgba(7, 9, 13, 0.9);
	--abik-glass: rgba(255, 255, 255, 0.04);
	--abik-shadow: 0 28px 64px rgba(0, 0, 0, 0.35);
	--abik-shadow-gold: 0 0 0 1px rgba(182, 149, 92, 0.2), 0 24px 56px rgba(182, 149, 92, 0.16);
}

html {
	scroll-behavior: smooth;
}

body {
	background:
		radial-gradient(circle at top right, rgba(182, 149, 92, 0.18), transparent 26%),
		radial-gradient(circle at 14% 18%, rgba(207, 213, 222, 0.1), transparent 20%),
		linear-gradient(180deg, #06070a 0%, #0a1018 54%, #07090d 100%);
	color: var(--abik-platinum);
	min-height: 100vh;
}

body::before {
	background-image: linear-gradient(rgba(255, 255, 255, 0.03) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
	background-position: center center;
	background-size: 80px 80px;
	content: "";
	inset: 0;
	opacity: 0.2;
	pointer-events: none;
	position: fixed;
	z-index: 0;
}

.wp-site-blocks {
	isolation: isolate;
	position: relative;
	z-index: 1;
}

.wp-site-blocks > * {
	position: relative;
	z-index: 1;
}

a {
	transition: color 180ms ease, opacity 180ms ease;
}

a:hover,
a:focus-visible {
	color: var(--abik-paper);
}

.wp-block-button__link,
.wp-element-button {
	transition: transform 180ms ease, box-shadow 180ms ease, background-color 180ms ease, color 180ms ease;
}

.wp-block-button__link:hover,
.wp-block-button__link:focus-visible,
.wp-element-button:hover,
.wp-element-button:focus-visible {
	box-shadow: var(--abik-shadow-gold);
	transform: translateY(-2px);
}

.abik-shell {
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.01));
	border: 1px solid var(--abik-line);
	box-shadow: var(--abik-shadow);
	backdrop-filter: blur(18px);
	-webkit-backdrop-filter: blur(18px);
}

.abik-panel-accent {
	box-shadow: var(--abik-shadow-gold);
	border-color: rgba(182, 149, 92, 0.28);
}

.abik-kicker {
	color: var(--abik-gold-soft);
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.24em;
	text-transform: uppercase;
}

.abik-subtle {
	color: var(--abik-silver);
}

.abik-divider {
	background: linear-gradient(90deg, transparent 0%, rgba(182, 149, 92, 0.75) 50%, transparent 100%);
	height: 1px;
	margin: 0;
	width: 100%;
}

.abik-stat-card {
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.03), rgba(255, 255, 255, 0.015));
	border: 1px solid var(--abik-line);
	border-radius: 1.25rem;
	padding: 1.25rem;
	position: relative;
	overflow: hidden;
}

.abik-stat-card::after {
	background: linear-gradient(135deg, transparent, rgba(182, 149, 92, 0.18));
	content: "";
	inset: 0;
	opacity: 0;
	position: absolute;
	transition: opacity 220ms ease;
	pointer-events: none;
}

.abik-stat-card:hover::after,
.abik-stat-card:focus-within::after {
	opacity: 1;
}

.abik-service-card,
.wp-block-post-template > li {
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.018));
	border: 1px solid var(--abik-line);
	border-radius: 1.5rem;
	box-shadow: var(--abik-shadow);
	padding: clamp(1.4rem, 2vw, 1.8rem);
	transition: border-color 200ms ease, transform 200ms ease, box-shadow 200ms ease;
}

.abik-service-card:hover,
.abik-service-card:focus-within,
.wp-block-post-template > li:hover,
.wp-block-post-template > li:focus-within {
	border-color: rgba(182, 149, 92, 0.36);
	box-shadow: var(--abik-shadow-gold);
	transform: translateY(-4px);
}

.abik-step-card {
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0.015));
	border: 1px solid var(--abik-line);
	border-radius: 1.5rem;
	padding: 1.5rem;
	position: relative;
	overflow: hidden;
}

.abik-step-index {
	color: var(--abik-gold-soft);
	font-family: 'IBM Plex Mono', 'SFMono-Regular', Consolas, monospace;
	font-size: 0.82rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.abik-metric-value {
	color: var(--abik-paper);
	font-family: 'Iowan Old Style', 'Palatino Linotype', 'Book Antiqua', Georgia, serif;
	font-size: clamp(2rem, 5vw, 3.4rem);
	font-weight: 700;
	letter-spacing: -0.05em;
	line-height: 0.95;
}

.abik-metric-copy {
	color: var(--abik-silver);
	font-size: 0.95rem;
	line-height: 1.55;
}

.abik-cta-panel {
	background:
		linear-gradient(135deg, rgba(182, 149, 92, 0.2), rgba(13, 20, 29, 0.85) 48%, rgba(207, 213, 222, 0.08) 100%),
		linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.015));
	border: 1px solid rgba(182, 149, 92, 0.28);
	box-shadow: var(--abik-shadow-gold);
}

.wp-block-post-template {
	gap: 1.5rem;
	list-style: none;
	padding-left: 0;
}

.wp-block-post-template > li h2,
.wp-block-post-template > li h3 {
	margin-top: 0;
}

.wp-block-post-featured-image img,
.wp-block-image img {
	border-radius: 1.5rem;
	box-shadow: var(--abik-shadow);
}

.abik-dot-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.abik-dot-list li {
	align-items: center;
	display: flex;
	gap: 0.8rem;
	padding: 0.4rem 0;
}

.abik-dot-list li::before {
	background: linear-gradient(135deg, var(--abik-gold), var(--abik-gold-soft));
	border-radius: 999px;
	content: "";
	flex: 0 0 0.55rem;
	height: 0.55rem;
	width: 0.55rem;
}

.abik-footer-note {
	border-top: 1px solid var(--abik-line);
	color: var(--abik-silver);
	font-size: 0.92rem;
	padding-top: 1.25rem;
}

.abik-inline-chip {
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid rgba(182, 149, 92, 0.24);
	border-radius: 999px;
	color: var(--abik-paper);
	display: inline-flex;
	font-family: inherit;
	font-size: 0.82rem;
	font-weight: 600;
	gap: 0.5rem;
	letter-spacing: 0.08em;
	padding: 0.6rem 0.9rem;
	text-transform: uppercase;
}

.abik-post-intro {
	max-width: 44rem;
}

:where(.wp-site-blocks *:focus-visible) {
	outline: 2px solid var(--abik-gold-soft);
	outline-offset: 3px;
}

@media (max-width: 781px) {
	body::before {
		background-size: 44px 44px;
		opacity: 0.14;
	}

	.wp-block-post-template,
	.wp-block-columns {
		gap: 1.25rem;
	}
}

/* =========================================================================
   v1.1 Premium Refinement Layer
   Goals: strict 8px-grid rhythm, clearer type hierarchy, stronger CTAs,
   accessible tap targets, and tighter mobile spacing.
   ========================================================================= */

:root {
	/* 8px spacing scale, exposed for consistent rhythm across components. */
	--abik-space-1: 0.5rem;   /* 8px  */
	--abik-space-2: 1rem;     /* 16px */
	--abik-space-3: 1.5rem;   /* 24px */
	--abik-space-4: 2rem;     /* 32px */
	--abik-space-5: 3rem;     /* 48px */
	--abik-space-6: 4rem;     /* 64px */
}

/* --- Typography hierarchy -------------------------------------------------
   The global heading line-height (1.04) is ideal for large display type but
   collapses smaller headings. Restore a readable rhythm per level. */
h1.wp-block-heading,
.wp-block-post-title {
	line-height: 1.04;
}

h2.wp-block-heading {
	line-height: 1.1;
}

h3.wp-block-heading {
	letter-spacing: -0.02em;
	line-height: 1.18;
}

h4.wp-block-heading,
h5.wp-block-heading,
h6.wp-block-heading {
	letter-spacing: 0.02em;
	line-height: 1.3;
}

/* Body copy gets a comfortable measure so long paragraphs stay readable. */
.abik-subtle,
.wp-block-post-excerpt__excerpt {
	max-width: 60ch;
}

.has-lead-font-size {
	line-height: 1.55;
}

/* --- Call-to-action buttons ----------------------------------------------
   Larger, finger-friendly hit areas (>=44px) and a clear hover commitment. */
.wp-block-button__link,
.wp-element-button {
	min-height: 2.75rem;          /* 44px accessible target */
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 1.1;
}

.wp-block-buttons {
	gap: var(--abik-space-2);
}

/* Secondary (outline) buttons fill with gold on hover for a confident pull. */
.wp-block-button.is-style-outline .wp-block-button__link:hover,
.wp-block-button .has-charcoal-background-color:hover {
	background-color: var(--abik-gold) !important;
	color: var(--abik-obsidian) !important;
	border-color: var(--abik-gold) !important;
}

/* --- Card rhythm ----------------------------------------------------------
   Consistent internal vertical gap so cards never look cramped or floating. */
.abik-service-card,
.abik-step-card,
.abik-stat-card,
.abik-shell {
	display: flow-root;
}

.abik-service-card > * + *,
.abik-step-card > * + *,
.abik-stat-card > * + * {
	margin-block-start: var(--abik-space-2);
}

/* Inline chips and step indices sit tighter to the heading they introduce. */
.abik-inline-chip + .wp-block-heading,
.abik-step-index + .wp-block-heading,
.abik-kicker + .wp-block-heading {
	margin-block-start: var(--abik-space-1);
}

/* Metric value pairs tightly with its label for a strong visual anchor. */
.abik-metric-value + .abik-kicker {
	margin-block-start: var(--abik-space-1);
}

/* --- Equal-height grids ---------------------------------------------------
   Keep service/step columns aligned so the grid reads as a clean system. */
.wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column > .abik-service-card,
.wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column > .abik-step-card,
.wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column > .abik-stat-card {
	height: 100%;
}

/* --- Mobile spacing -------------------------------------------------------
   Tighten the grid and keep CTAs full-width and easy to tap on small screens. */
@media (max-width: 781px) {
	.abik-service-card,
	.abik-step-card,
	.abik-stat-card {
		padding: var(--abik-space-3);
	}

	.wp-block-buttons {
		width: 100%;
	}

	.wp-block-buttons .wp-block-button {
		width: 100%;
	}

	.wp-block-buttons .wp-block-button__link {
		width: 100%;
	}

	.abik-metric-value {
		font-size: clamp(1.8rem, 9vw, 2.6rem);
	}
}

/* Honour reduced-motion preferences for hover transforms. */
@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	.wp-block-button__link,
	.wp-element-button,
	.abik-service-card,
	.abik-step-card {
		transition: none;
	}

	.wp-block-button__link:hover,
	.wp-element-button:hover,
	.abik-service-card:hover,
	.abik-step-card:hover {
		transform: none;
	}
}

/* =========================================================================
   v1.2 Layout & Responsive Fixes
   Goals: stop content hugging the page edge, give cards more breathing room,
   and reflow 3-up grids so large titles never get squeezed on laptops.
   ========================================================================= */

/* --- Page gutters ---------------------------------------------------------
   Guarantee a comfortable minimum gutter so titles and copy never sit flush
   against the viewport edge on laptops and tablets. Uses !important only to
   override the inline padding baked into the block templates. */
@media (max-width: 1200px) {
	.wp-site-blocks main.wp-block-group.alignfull {
		padding-left: clamp(1.25rem, 5vw, 2.5rem) !important;
		padding-right: clamp(1.25rem, 5vw, 2.5rem) !important;
	}
}

/* --- Card breathing room --------------------------------------------------
   Slightly larger, consistent internal padding so the title and description
   are never cramped against the card wall. */
.abik-service-card,
.abik-step-card,
.abik-stat-card {
	padding: clamp(1.5rem, 2vw, 2rem);
}

/* --- Reflow 3-up grids on laptops/tablets --------------------------------
   Equal-width columns (no explicit width set) wrap to two-up between 782px
   and 1100px so large display headings keep enough room. Columns that carry
   an explicit width (e.g. 62% / 38% hero split) are left untouched. */
@media (min-width: 782px) and (max-width: 1100px) {
	.wp-block-columns.is-layout-flex {
		flex-wrap: wrap;
	}

	.wp-block-columns.is-layout-flex > .wp-block-column:not([style*="flex-basis"]) {
		flex-basis: calc(50% - 0.75rem) !important;
		flex-grow: 1;
	}

	/* Keep big card titles readable while the grid is denser. */
	.abik-service-card .wp-block-heading,
	.abik-step-card .wp-block-heading,
	.abik-stat-card .wp-block-heading {
		font-size: clamp(1.35rem, 2.6vw, 1.8rem);
		line-height: 1.2;
	}
}

/* Below the core stacking breakpoint, ensure every column is truly full width
   and vertical rhythm stays on the 8px grid. */
@media (max-width: 781px) {
	.wp-block-columns.is-layout-flex > .wp-block-column {
		flex-basis: 100% !important;
	}

	.wp-block-columns {
		gap: 1rem;
	}
}

/* =========================================================================
   v1.3 Panel Padding Safety Net
   Root cause fixed in theme.json (useRootPaddingAwareAlignments:false) so the
   authored inline padding on panels is restored. These rules guarantee that
   any .abik-shell / CTA panel WITHOUT inline padding still has breathing room,
   so content never sits flush against the panel wall again.
   ========================================================================= */

.abik-shell:not([style*="padding"]) {
	padding: clamp(1.5rem, 3vw, 2.5rem);
}

.abik-cta-panel:not([style*="padding"]) {
	padding: clamp(1.75rem, 4vw, 3rem);
}

/* Footer columns have no explicit block gap; keep a clear, consistent gutter
   between the brand blurb and link columns. */
.abik-footer-note {
	margin-top: 1.5rem;
}

/* =========================================================================
   v1.4 Crushed-Grid Fix + Robust Responsive Typography
   Problem: card-grid <columns> blocks are not alignwide, so the constrained
   layout caps them at content-size (46rem) and crushes the cards, forcing
   large headings to break mid-word. Fix: let these grids fill the wide width,
   stop mid-word breaking, and cap display headings on small screens.
   ========================================================================= */

/* 1) Let non-aligned column grids expand to the full wide width so cards are
      never squeezed into a narrow centred band. Higher specificity than the
      core constrained-layout content-size rule, so no !important needed. */
.is-layout-constrained > .wp-block-columns:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright) {
	max-width: var(--wp--style--global--wide-size);
}

/* 2) Headings and metrics must wrap between words, never inside them. */
.wp-block-heading,
.abik-metric-value,
.wp-block-post-title {
	word-break: normal;
	overflow-wrap: break-word;
	hyphens: none;
}

/* 3) Keep card titles in proportion to their column on laptops/desktops. */
@media (min-width: 1101px) {
	.abik-service-card .wp-block-heading,
	.abik-step-card .wp-block-heading,
	.abik-stat-card .wp-block-heading {
		font-size: clamp(1.4rem, 1.6vw, 1.9rem) !important;
		line-height: 1.2;
	}
}

/* =========================================================================
   Mobile-first hardening (all phone sizes, down to 320px)
   ========================================================================= */
@media (max-width: 781px) {
	/* Cap oversized display headings so they fit small viewports cleanly. */
	.has-display-lg-font-size {
		font-size: clamp(2rem, 8.5vw, 2.9rem) !important;
	}

	.has-display-md-font-size {
		font-size: clamp(1.7rem, 7vw, 2.3rem) !important;
	}

	.has-display-sm-font-size {
		font-size: clamp(1.35rem, 6vw, 1.8rem) !important;
	}

	.abik-metric-value {
		font-size: clamp(1.8rem, 9vw, 2.6rem) !important;
	}

	/* Comfortable measure and no edge-hugging on phones. */
	.abik-subtle,
	.wp-block-post-excerpt__excerpt,
	.has-lead-font-size {
		max-width: 100%;
	}

	/* Tighten heading rhythm so stacked cards stay compact. */
	h1.wp-block-heading,
	h2.wp-block-heading,
	h3.wp-block-heading {
		line-height: 1.15;
	}
}

/* Extra-small phones (<=380px): pull display sizes in a little further. */
@media (max-width: 380px) {
	.has-display-lg-font-size {
		font-size: clamp(1.8rem, 9vw, 2.3rem) !important;
	}

	.has-display-md-font-size {
		font-size: clamp(1.55rem, 8vw, 2rem) !important;
	}

	.abik-service-card,
	.abik-step-card,
	.abik-stat-card,
	.abik-shell {
		padding: 1.25rem;
	}
}

/* Guard against accidental horizontal scroll from wide children on mobile. */
@media (max-width: 781px) {
	html,
	body {
		overflow-x: hidden;
	}
}

/* =========================================================================
   v1.6 Multilingual Switcher (URL-based, no JS)
   Replaces the old .abik-lang-toggle JS button with proper
   <a> links that navigate to /ms/ subdirectory pages.
   ========================================================================= */
.abik-lang-switcher {
	align-items: center;
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid rgba(182, 149, 92, 0.4);
	border-radius: 999px;
	color: var(--abik-platinum);
	cursor: pointer;
	display: inline-flex;
	font-family: 'Avenir Next', 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
	font-size: 0.78rem;
	font-weight: 700;
	gap: 0.1rem;
	letter-spacing: 0.08em;
	line-height: 1;
	margin-right: 0.75rem;
	min-height: 2.5rem;
	padding: 0.5rem 0.8rem;
	transition: border-color 180ms ease, color 180ms ease, background-color 180ms ease;
}

.abik-lang-switcher:hover,
.abik-lang-switcher:focus-within {
	border-color: var(--abik-gold);
	color: var(--abik-paper);
}

.abik-lang-switcher a {
	color: inherit;
	text-decoration: none;
	opacity: 0.45;
	transition: opacity 180ms ease, color 180ms ease;
	padding: 0 0.15rem;
}

.abik-lang-switcher a.active,
.abik-lang-switcher[data-active="en"] .abik-lang-en,
.abik-lang-switcher[data-active="ms"] .abik-lang-ms {
	color: var(--abik-gold-soft);
	opacity: 1;
}

.abik-lang-switcher a:hover {
	color: var(--abik-paper);
	opacity: 1;
}

.abik-lang-switcher .abik-lang-sep {
	margin: 0 0.15rem;
	opacity: 0.4;
}

/* Keep backward compatibility with old .abik-lang-toggle */
.abik-lang-toggle {
	align-items: center;
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid rgba(182, 149, 92, 0.4);
	border-radius: 999px;
	color: var(--abik-platinum);
	cursor: pointer;
	display: inline-flex;
	font-family: 'Avenir Next', 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
	font-size: 0.78rem;
	font-weight: 700;
	gap: 0.1rem;
	letter-spacing: 0.08em;
	line-height: 1;
	margin-right: 0.75rem;
	min-height: 2.5rem;
	padding: 0.5rem 0.8rem;
	transition: border-color 180ms ease, color 180ms ease, background-color 180ms ease;
}

.abik-lang-toggle:hover,
.abik-lang-toggle:focus-visible {
	border-color: var(--abik-gold);
	color: var(--abik-paper);
}

.abik-lang-toggle .abik-lang-en,
.abik-lang-toggle .abik-lang-ms {
	opacity: 0.45;
	transition: opacity 180ms ease, color 180ms ease;
}

.abik-lang-toggle .abik-lang-sep {
	margin: 0 0.15rem;
	opacity: 0.4;
}

.abik-lang-toggle[data-active="en"] .abik-lang-en,
.abik-lang-toggle[data-active="ms"] .abik-lang-ms {
	color: var(--abik-gold-soft);
	opacity: 1;
}

@media (max-width: 781px) {
	.abik-lang-switcher,
	.abik-lang-toggle {
		margin-right: 0.5rem;
	}
}

/* =========================================================================
   v1.7 Book a Free Call — Enquiry Form
   Matches the existing premium dark/gold glass aesthetic. Inputs sit on
   translucent panels with gold focus rings; the submit button reuses the
   global button styles. The honeypot field is visually hidden from humans.
   ========================================================================= */

.abik-booking-form {
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.015));
	border: 1px solid var(--abik-line);
	border-radius: 1.5rem;
	box-shadow: var(--abik-shadow);
	display: flow-root;
	gap: var(--abik-space-2);
	padding: clamp(1.5rem, 3vw, 2.5rem);
}

.abik-booking-form .abik-field {
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
	margin-block-start: var(--abik-space-2);
}

.abik-booking-form .abik-field:first-of-type {
	margin-block-start: 0;
}

.abik-booking-form .abik-field-row {
	display: flex;
	flex-wrap: wrap;
	gap: var(--abik-space-2);
	margin-block-start: var(--abik-space-2);
}

.abik-booking-form .abik-field-row > .abik-field {
	flex: 1 1 14rem;
	margin-block-start: 0;
}

.abik-booking-form label {
	color: var(--abik-paper);
	font-size: 0.86rem;
	font-weight: 600;
	letter-spacing: 0.02em;
}

.abik-booking-form .abik-req {
	color: var(--abik-gold-soft);
}

.abik-booking-form input[type="text"],
.abik-booking-form input[type="email"],
.abik-booking-form input[type="tel"],
.abik-booking-form select,
.abik-booking-form textarea {
	background: rgba(7, 9, 13, 0.55);
	border: 1px solid var(--abik-line);
	border-radius: 0.75rem;
	color: var(--abik-paper);
	font-family: inherit;
	font-size: 1rem;
	min-height: 2.75rem;
	padding: 0.75rem 0.9rem;
	transition: border-color 180ms ease, box-shadow 180ms ease, background-color 180ms ease;
	width: 100%;
}

.abik-booking-form textarea {
	min-height: 8rem;
	resize: vertical;
}

.abik-booking-form input::placeholder,
.abik-booking-form textarea::placeholder {
	color: rgba(141, 152, 167, 0.7);
}

.abik-booking-form input:focus,
.abik-booking-form select:focus,
.abik-booking-form textarea:focus {
	background: rgba(7, 9, 13, 0.75);
	border-color: rgba(182, 149, 92, 0.6);
	box-shadow: 0 0 0 1px rgba(182, 149, 92, 0.4);
	outline: none;
}

/* Selects: make the caret visible on dark background. */
.abik-booking-form select {
	appearance: none;
	-webkit-appearance: none;
	background-image: linear-gradient(45deg, transparent 50%, var(--abik-gold-soft) 50%), linear-gradient(135deg, var(--abik-gold-soft) 50%, transparent 50%);
	background-position: calc(100% - 1.2rem) center, calc(100% - 0.85rem) center;
	background-size: 0.35rem 0.35rem, 0.35rem 0.35rem;
	background-repeat: no-repeat;
	padding-right: 2.5rem;
}

.abik-booking-form select option {
	background: var(--abik-midnight);
	color: var(--abik-paper);
}

.abik-field-error {
	color: #ff9b8a;
	font-size: 0.82rem;
	font-weight: 600;
}

.abik-booking-error-general {
	background: rgba(255, 100, 80, 0.12);
	border: 1px solid rgba(255, 100, 80, 0.4);
	border-radius: 0.75rem;
	color: #ffcabd;
	padding: 0.75rem 1rem;
}

.abik-field-consent {
	flex-direction: row;
	align-items: flex-start;
}

.abik-consent {
	align-items: center;
	color: var(--abik-silver);
	display: flex;
	font-size: 0.88rem;
	font-weight: 400;
	gap: 0.6rem;
}

.abik-consent input[type="checkbox"] {
	accent-color: var(--abik-gold);
	flex: 0 0 auto;
	height: 1.15rem;
	margin-top: 0;
	width: 1.15rem;
}

.abik-field-submit {
	align-items: flex-start;
}

.abik-booking-submit {
	cursor: pointer;
	font-size: 1rem;
	font-weight: 700;
	min-width: 14rem;
	padding: 0.85rem 1.6rem;
}

.abik-booking-footnote {
	font-size: 0.85rem;
	margin-top: 0.6rem !important;
}

/* Honeypot: hidden from real users, still in the DOM for bots. */
.abik-booking-form .abik-hp {
	height: 0;
	left: -9999px;
	opacity: 0;
	overflow: hidden;
	position: absolute;
	width: 1px;
}

.abik-booking-success {
	border-radius: 1.5rem;
	display: flow-root;
	padding: clamp(1.75rem, 4vw, 2.75rem);
}

.abik-booking-success .wp-block-button__link {
	margin-top: 1rem;
}

@media (max-width: 781px) {
	.abik-booking-form .abik-field-row {
		flex-direction: column;
	}

	.abik-booking-submit {
		width: 100%;
	}
}
