/* ==========================================================================
   Elite Premium Starter System
   Editor-facing block styles, reusable section classes, and homepage recipes.
   ========================================================================== */

:root {
    --ekc-section-padding: var(--space-24);
    --ekc-section-padding-sm: var(--space-16);
    --ekc-content-narrow: 760px;
    --ekc-content-medium: 1040px;
    --ekc-border-soft: 1px solid var(--ekc-border, var(--color-light-gray));
}

/* --------------------------------------------------------------------------
   Registered Block Styles
   -------------------------------------------------------------------------- */

p.is-style-eyebrow,
.wp-block-paragraph.is-style-eyebrow,
.editor-styles-wrapper p.is-style-eyebrow,
.editor-styles-wrapper .wp-block-paragraph.is-style-eyebrow {
    margin-bottom: var(--space-4);
    color: var(--color-accent);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    letter-spacing: 0.14em;
    line-height: 1.4;
    text-transform: uppercase;
}

p.is-style-lead,
.wp-block-paragraph.is-style-lead {
    max-width: 64ch;
    color: var(--color-mid-gray);
    font-size: var(--font-size-md);
    line-height: var(--line-height-loose);
}

.wp-block-group.is-style-premium-surface,
.wp-block-group.is-style-premium-card,
.wp-block-group.is-style-proof-strip {
    border: var(--ekc-border-soft);
    border-radius: var(--radius-md);
    background: var(--ekc-surface, var(--color-white));
}

.wp-block-group.is-style-premium-surface {
    padding: var(--space-10);
    box-shadow: var(--shadow-sm);
}

.wp-block-group.is-style-premium-card {
    padding: var(--space-8);
    box-shadow: var(--shadow-md);
    transition: transform var(--transition-base), box-shadow var(--transition-base);
}

.wp-block-group.is-style-premium-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-lg);
}

.wp-block-group.is-style-premium-dark {
    padding: var(--space-12);
    border-radius: var(--radius-md);
    background: var(--ekc-brand-primary, var(--color-primary));
    color: var(--ekc-text-inverse, var(--color-white));
}

.wp-block-group.is-style-premium-dark h1,
.wp-block-group.is-style-premium-dark h2,
.wp-block-group.is-style-premium-dark h3,
.wp-block-group.is-style-premium-dark h4,
.wp-block-group.is-style-premium-dark p {
    color: inherit;
}

.wp-block-group.is-style-proof-strip {
    padding: var(--space-6) var(--space-8);
}

.wp-block-group.is-style-proof-strip p {
    margin: 0;
    color: var(--ekc-text-muted, var(--color-mid-gray));
    font-size: var(--font-size-sm);
}

.wp-block-group.is-style-proof-strip strong {
    color: var(--ekc-brand-primary, var(--color-primary));
}

.wp-block-group.is-style-editorial-band {
    position: relative;
    overflow: hidden;
    padding: var(--space-16);
    border-block: var(--ekc-border-soft);
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--ekc-brand-accent, var(--color-accent)) 12%, transparent), transparent 44%),
        linear-gradient(180deg, var(--ekc-surface-page, var(--color-off-white)), var(--ekc-surface-soft, var(--color-light-gray)));
}

.wp-block-group.is-style-editorial-band > * {
    position: relative;
    z-index: 1;
}

.wp-block-group.is-style-luxury-panel {
    padding: var(--space-10);
    border: var(--ekc-border-soft);
    border-radius: var(--radius-md);
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--ekc-surface, var(--color-white)) 88%, var(--ekc-brand-accent, var(--color-accent))), var(--ekc-surface, var(--color-white)));
    box-shadow: var(--shadow-lg);
}

.wp-block-group.is-style-luxury-panel > :first-child {
    margin-top: 0;
}

.wp-block-group.is-style-luxury-panel > :last-child {
    margin-bottom: 0;
}

.wp-block-columns.is-style-editorial-split,
.wp-block-media-text.is-style-editorial-feature {
    gap: var(--space-12);
    align-items: center;
}

.wp-block-columns.is-style-editorial-split {
    margin-block: var(--space-12);
}

.wp-block-columns.is-style-premium-grid {
    gap: var(--space-6);
    align-items: stretch;
}

.wp-block-columns.is-style-premium-grid > .wp-block-column,
.wp-block-column.is-style-premium-column {
    min-width: 0;
    padding: var(--space-8);
    border: var(--ekc-border-soft);
    border-radius: var(--radius-md);
    background: var(--ekc-surface, var(--color-white));
    box-shadow: var(--shadow-sm);
}

.wp-block-column.is-style-premium-column > :first-child,
.wp-block-columns.is-style-premium-grid > .wp-block-column > :first-child {
    margin-top: 0;
}

.wp-block-column.is-style-premium-column > :last-child,
.wp-block-columns.is-style-premium-grid > .wp-block-column > :last-child {
    margin-bottom: 0;
}

.wp-block-cover.is-style-premium-hero {
    min-height: 78vh;
    padding: var(--space-24) var(--space-6);
}

.wp-block-cover.is-style-premium-hero .wp-block-cover__inner-container {
    width: min(100%, var(--ekc-content-narrow));
}

.wp-block-cover.is-style-premium-hero .wp-block-heading {
    max-width: 13ch;
    margin-inline: auto;
    color: var(--ekc-text-inverse, var(--color-white));
    font-size: var(--font-size-4xl);
    letter-spacing: 0;
    line-height: 1.05;
    text-wrap: balance;
}

.wp-block-cover.is-style-premium-hero p {
    color: rgba(255, 255, 255, 0.84);
}

.wp-block-media-text.is-style-editorial-feature {
    overflow: hidden;
    border: var(--ekc-border-soft);
    border-radius: var(--radius-md);
    background: var(--ekc-surface, var(--color-white));
    box-shadow: var(--shadow-md);
}

.wp-block-media-text.is-style-editorial-feature .wp-block-media-text__media img {
    width: 100%;
    aspect-ratio: 4 / 5;
    object-fit: cover;
}

.wp-block-media-text.is-style-editorial-feature .wp-block-media-text__content {
    padding: var(--space-10);
}

.wp-block-image.is-style-editorial-frame img,
.wp-block-image.is-style-image-lift img {
    border-radius: var(--radius-md);
}

.wp-block-image.is-style-editorial-frame img {
    width: 100%;
    aspect-ratio: 4 / 5;
    object-fit: cover;
    border: var(--ekc-border-soft);
    box-shadow: var(--shadow-lg);
}

.wp-block-image.is-style-image-lift img {
    transition: transform var(--transition-base), box-shadow var(--transition-base);
}

.wp-block-image.is-style-image-lift:hover img {
    transform: translateY(-4px);
    box-shadow: var(--shadow-md);
}

ul.is-style-checkmark,
ol.is-style-checkmark,
ul.is-style-feature-list,
ol.is-style-feature-list,
.wp-block-list.is-style-checkmark,
.wp-block-list.is-style-feature-list {
    list-style: none;
    padding-left: 0;
}

ul.is-style-checkmark li,
ol.is-style-checkmark li,
ul.is-style-feature-list li,
ol.is-style-feature-list li,
.wp-block-list.is-style-checkmark li,
.wp-block-list.is-style-feature-list li {
    position: relative;
    margin-bottom: var(--space-3);
    padding-left: var(--space-8);
}

ul.is-style-checkmark li::before,
ol.is-style-checkmark li::before,
ul.is-style-feature-list li::before,
ol.is-style-feature-list li::before,
.wp-block-list.is-style-checkmark li::before,
.wp-block-list.is-style-feature-list li::before {
    position: absolute;
    left: 0;
    top: 0.05em;
    width: 1.35rem;
    height: 1.35rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-full);
    background: color-mix(in srgb, var(--color-accent) 14%, transparent);
    color: var(--ekc-brand-accent, var(--color-accent));
    content: "✓";
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-bold);
}

ul.is-style-feature-list li,
ol.is-style-feature-list li,
.wp-block-list.is-style-feature-list li {
    padding-bottom: var(--space-3);
    border-bottom: var(--ekc-border-soft);
}

ul.is-style-feature-list li:last-child,
ol.is-style-feature-list li:last-child,
.wp-block-list.is-style-feature-list li:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.wp-block-button.is-style-pill .wp-block-button__link {
    border-radius: var(--radius-full) !important;
    padding: var(--space-3) var(--space-8) !important;
}

.wp-block-button.is-style-arrow-link .wp-block-button__link {
    padding: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: var(--color-accent) !important;
    box-shadow: none !important;
    font-weight: var(--font-weight-bold);
}

.wp-block-button.is-style-arrow-link .wp-block-button__link::after {
    content: " →";
}

.wp-block-button.is-style-arrow-link .wp-block-button__link:hover {
    transform: none;
    color: var(--color-accent-hover) !important;
}

.wp-block-buttons.is-style-premium-actions {
    gap: var(--space-3);
    align-items: center;
}

.wp-block-buttons.is-style-premium-actions .wp-block-button__link {
    min-height: 48px;
    border-radius: var(--radius-full);
    font-weight: var(--font-weight-bold);
}

.wp-block-quote.is-style-editorial-quote {
    padding: var(--space-8) 0 var(--space-8) var(--space-8);
    border-left: 2px solid var(--color-accent);
    border-radius: 0;
    background: transparent;
}

.wp-block-quote.is-style-editorial-quote p {
    color: var(--color-primary);
    font-size: var(--font-size-xl);
    font-style: normal;
    line-height: 1.45;
}

.wp-block-separator.is-style-hairline {
    max-width: 100%;
    margin-block: var(--space-10);
    border-top: 1px solid var(--ekc-border, var(--color-light-gray));
}

.wp-block-details.is-style-premium-faq {
    margin: 0;
    padding: var(--space-5) 0;
    border-bottom: var(--ekc-border-soft);
}

.wp-block-details.is-style-premium-faq summary {
    display: flex;
    gap: var(--space-4);
    align-items: center;
    justify-content: space-between;
    color: var(--ekc-text-primary, var(--color-primary));
    cursor: pointer;
    font-weight: var(--font-weight-bold);
    list-style: none;
}

.wp-block-details.is-style-premium-faq summary::-webkit-details-marker {
    display: none;
}

.wp-block-details.is-style-premium-faq summary::after {
    content: "+";
    display: inline-grid;
    flex: 0 0 auto;
    place-items: center;
    width: 2rem;
    height: 2rem;
    border-radius: var(--radius-full);
    background: color-mix(in srgb, var(--ekc-brand-accent, var(--color-accent)) 14%, transparent);
    color: var(--ekc-brand-primary, var(--color-primary));
    transition: transform var(--transition-base), background-color var(--transition-base);
}

.wp-block-details.is-style-premium-faq[open] summary::after {
    transform: rotate(45deg);
}

.wp-block-details.is-style-premium-faq > :not(summary) {
    max-width: 70ch;
    color: var(--ekc-text-muted, var(--color-mid-gray));
}

/* --------------------------------------------------------------------------
   Premium Pattern Helpers
   -------------------------------------------------------------------------- */

.ekc-premium-section {
    padding-block: var(--ekc-section-padding);
}

.ekc-premium-section-sm {
    padding-block: var(--ekc-section-padding-sm);
}

.ekc-premium-section-alt {
    background: var(--ekc-surface-page, var(--color-off-white));
}

.ekc-premium-hero {
    min-height: 82vh;
    border-radius: 0;
}

.ekc-premium-hero .wp-block-cover__inner-container {
    width: min(100%, var(--ekc-content-narrow));
}

.ekc-premium-hero .wp-block-heading {
    margin-bottom: var(--space-6);
    color: var(--color-white);
    font-size: var(--font-size-4xl);
    font-weight: var(--font-weight-bold);
    letter-spacing: 0;
    line-height: 1.08;
    text-wrap: balance;
}

.ekc-premium-hero p {
    color: rgba(255, 255, 255, 0.86);
}

.ekc-premium-kicker {
    margin-bottom: var(--space-4);
    color: var(--ekc-brand-accent, var(--color-accent));
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-bold);
    letter-spacing: 0.14em;
    line-height: 1.4;
    text-transform: uppercase;
}

/* Recruitment starter visual profiles.
   These classes are applied by the starter generator to give each recruitment
   pack its own art direction while keeping the block markup reusable. */

.ekc-vertical-recruitment-clarity,
.ekc-vertical-recruitment-clarity ~ .ekc-premium-section,
.ekc-vertical-recruitment-clarity ~ .ekc-premium-section-sm {
    --ekc-brand-primary: #173f46;
    --ekc-brand-accent: #4fb59e;
    --ekc-surface-page: #eef5f1;
    --ekc-surface: #fffefa;
    --ekc-surface-soft: #dfece6;
    --ekc-border: rgba(23, 63, 70, 0.16);
    --ekc-text-muted: #52686a;
}

.wp-block-cover.ekc-vertical-recruitment-clarity .wp-block-cover__background {
    opacity: 1;
    background:
        linear-gradient(110deg, rgba(13, 44, 49, 0.92), rgba(25, 75, 80, 0.64) 54%, rgba(79, 181, 158, 0.36));
}

.wp-block-cover.ekc-vertical-recruitment-clarity .wp-block-cover__image-background {
    filter: saturate(0.82) contrast(0.96);
}

.ekc-vertical-recruitment-clarity ~ .ekc-premium-section .ekc-pricing-card,
.ekc-vertical-recruitment-clarity ~ .ekc-premium-section .ekc-testimonial-card,
.ekc-vertical-recruitment-clarity ~ .ekc-premium-section .ekc-before-after-card {
    border-radius: 10px;
}

.ekc-vertical-recruitment-boardroom,
.ekc-vertical-recruitment-boardroom ~ .ekc-premium-section,
.ekc-vertical-recruitment-boardroom ~ .ekc-premium-section-sm {
    --ekc-brand-primary: #111827;
    --ekc-brand-accent: #b99054;
    --ekc-surface-page: #f4efe6;
    --ekc-surface: #fffaf1;
    --ekc-surface-soft: #eadfce;
    --ekc-border: rgba(17, 24, 39, 0.14);
    --ekc-text-muted: #5e5960;
}

.wp-block-cover.ekc-vertical-recruitment-boardroom .wp-block-cover__background {
    opacity: 1;
    background:
        linear-gradient(90deg, rgba(11, 15, 24, 0.94), rgba(17, 24, 39, 0.72) 52%, rgba(185, 144, 84, 0.38)),
        linear-gradient(180deg, rgba(0, 0, 0, 0.34), transparent);
}

.wp-block-cover.ekc-vertical-recruitment-boardroom .wp-block-cover__inner-container {
    width: min(100%, 880px);
}

.wp-block-cover.ekc-vertical-recruitment-boardroom .wp-block-heading {
    max-width: 14ch;
    font-family: Georgia, "Times New Roman", serif;
    font-weight: 700;
}

.ekc-vertical-recruitment-boardroom ~ .ekc-premium-section .ekc-pricing-card--featured,
.ekc-vertical-recruitment-boardroom ~ .ekc-premium-section .ekc-testimonial-card--featured {
    background:
        linear-gradient(145deg, rgba(185, 144, 84, 0.13), transparent 52%),
        #fffaf1;
}

.ekc-vertical-recruitment-electric,
.ekc-vertical-recruitment-electric ~ .ekc-premium-section,
.ekc-vertical-recruitment-electric ~ .ekc-premium-section-sm {
    --ekc-brand-primary: #131821;
    --ekc-brand-accent: #21d4a7;
    --ekc-surface-page: #eef7ff;
    --ekc-surface: #ffffff;
    --ekc-surface-soft: #dfeeff;
    --ekc-border: rgba(19, 24, 33, 0.14);
    --ekc-text-muted: #4b5b69;
}

.wp-block-cover.ekc-vertical-recruitment-electric {
    overflow: hidden;
    background: #111827;
}

.wp-block-cover.ekc-vertical-recruitment-electric::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
        linear-gradient(115deg, rgba(33, 212, 167, 0.22), transparent 36%, rgba(95, 84, 255, 0.22) 72%, transparent),
        repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.12) 0 1px, transparent 1px 78px),
        repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.08) 0 1px, transparent 1px 78px);
    opacity: 0.42;
    pointer-events: none;
    animation: ekc-recruitment-grid-drift 14s linear infinite;
}

.wp-block-cover.ekc-vertical-recruitment-electric .wp-block-cover__background {
    opacity: 1;
    background:
        linear-gradient(105deg, rgba(10, 14, 23, 0.95), rgba(19, 24, 33, 0.74) 48%, rgba(33, 212, 167, 0.38)),
        radial-gradient(circle at 72% 30%, rgba(95, 84, 255, 0.34), transparent 26rem);
}

.wp-block-cover.ekc-vertical-recruitment-electric .wp-block-cover__inner-container {
    position: relative;
    z-index: 2;
    width: min(100%, 940px);
}

.wp-block-cover.ekc-vertical-recruitment-electric .wp-block-heading {
    max-width: 15ch;
}

.ekc-vertical-recruitment-electric ~ .ekc-premium-section .ekc-pricing-card,
.ekc-vertical-recruitment-electric ~ .ekc-premium-section .ekc-testimonial-card,
.ekc-vertical-recruitment-electric ~ .ekc-premium-section .ekc-before-after-card {
    box-shadow: 0 18px 46px rgba(19, 24, 33, 0.12);
}

.ekc-vertical-recruitment-electric ~ .ekc-premium-section .ekc-pricing-card--featured {
    transform: translateY(-3px);
}

@keyframes ekc-recruitment-grid-drift {
    from {
        background-position: 0 0, 0 0, 0 0;
    }

    to {
        background-position: 240px 0, 156px 0, 0 156px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .wp-block-cover.ekc-vertical-recruitment-electric::before {
        animation: none;
    }
}

.ekc-recruitment-route-grid,
.ekc-recruitment-launch-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-6);
}

.ekc-recruitment-route-card,
.ekc-recruitment-launch-card,
.ekc-recruitment-brief__panel {
    position: relative;
    height: 100%;
    overflow: hidden;
    padding: var(--space-8);
    border: var(--ekc-border-soft);
    border-radius: var(--radius-md);
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--ekc-brand-accent, var(--color-accent)) 8%, transparent), transparent 58%),
        var(--ekc-surface, var(--color-white));
    box-shadow: var(--shadow-sm);
}

.ekc-recruitment-route-card::after,
.ekc-recruitment-launch-card::after {
    content: "";
    position: absolute;
    right: -34px;
    bottom: -34px;
    width: 108px;
    height: 108px;
    border: 1px solid color-mix(in srgb, var(--ekc-brand-accent, var(--color-accent)) 38%, transparent);
    border-radius: 50%;
    pointer-events: none;
}

.ekc-recruitment-route-card > :first-child,
.ekc-recruitment-launch-card > :first-child,
.ekc-recruitment-brief__panel > :first-child {
    margin-top: 0;
}

.ekc-recruitment-route-card > :last-child,
.ekc-recruitment-launch-card > :last-child,
.ekc-recruitment-brief__panel > :last-child {
    margin-bottom: 0;
}

.ekc-recruitment-route-card h3,
.ekc-recruitment-launch-card h3,
.ekc-recruitment-brief__panel h3 {
    margin-bottom: var(--space-3);
}

.ekc-recruitment-route-card p:not(.is-style-eyebrow),
.ekc-recruitment-launch-card p:not(.is-style-eyebrow),
.ekc-recruitment-brief__panel li {
    color: var(--ekc-text-muted, var(--color-mid-gray));
    line-height: var(--line-height-loose);
}

.ekc-recruitment-brief__panel .wp-block-list {
    display: grid;
    gap: var(--space-3);
    margin-top: var(--space-5);
}

.ekc-vertical-recruitment-boardroom ~ .ekc-premium-section .ekc-recruitment-route-card,
.ekc-vertical-recruitment-boardroom ~ .ekc-premium-section .ekc-recruitment-launch-card,
.ekc-vertical-recruitment-boardroom ~ .ekc-premium-section .ekc-recruitment-brief__panel {
    background:
        linear-gradient(145deg, rgba(185, 144, 84, 0.12), transparent 54%),
        #fffaf1;
}

.ekc-vertical-recruitment-electric ~ .ekc-premium-section .ekc-recruitment-route-card,
.ekc-vertical-recruitment-electric ~ .ekc-premium-section .ekc-recruitment-launch-card,
.ekc-vertical-recruitment-electric ~ .ekc-premium-section .ekc-recruitment-brief__panel {
    border-color: color-mix(in srgb, var(--ekc-brand-accent, var(--color-accent)) 28%, var(--ekc-border, var(--color-light-gray)));
    box-shadow: 0 18px 46px rgba(19, 24, 33, 0.12);
}

/* --------------------------------------------------------------------------
   Animated Hero Headers
   Gutenberg-safe core groups with decorative wp:html layers.
   -------------------------------------------------------------------------- */

.ekc-animated-hero {
    --ekc-animated-hero-bg: #08111f;
    --ekc-animated-hero-text: #ffffff;
    --ekc-animated-hero-muted: rgba(255, 255, 255, 0.78);
    --ekc-animated-hero-accent: #37f3bd;
    --ekc-animated-hero-accent-2: #7c5cff;
    position: relative;
    display: grid;
    min-height: clamp(640px, 86vh, 920px);
    align-items: center;
    overflow: hidden;
    isolation: isolate;
    padding: clamp(5rem, 10vw, 8.5rem) var(--space-6);
    background: var(--ekc-animated-hero-bg);
    color: var(--ekc-animated-hero-text);
}

.ekc-animated-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
        linear-gradient(180deg, rgba(8, 17, 31, 0.18), rgba(8, 17, 31, 0.72)),
        radial-gradient(circle at 50% 90%, rgba(255, 255, 255, 0.08), transparent 26rem);
    pointer-events: none;
}

.ekc-animated-hero__stage {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
}

.ekc-animated-hero__content {
    position: relative;
    z-index: 2;
    width: min(100%, 780px);
    margin-inline: auto;
    text-align: center;
}

.ekc-animated-hero__content > :first-child {
    margin-top: 0;
}

.ekc-animated-hero__content > :last-child {
    margin-bottom: 0;
}

.ekc-animated-hero__kicker,
.ekc-animated-hero .is-style-eyebrow {
    color: var(--ekc-animated-hero-accent);
}

.ekc-animated-hero__heading {
    max-width: 13ch;
    margin-inline: auto;
    color: var(--ekc-animated-hero-text);
    font-size: clamp(3.4rem, 9vw, 8rem);
    line-height: 0.94;
    text-wrap: balance;
}

.ekc-animated-hero__lede {
    max-width: 68ch;
    margin-inline: auto;
    color: var(--ekc-animated-hero-muted);
}

.ekc-animated-hero .wp-block-buttons {
    justify-content: center;
}

.ekc-animated-hero .wp-block-button__link {
    box-shadow: 0 18px 42px rgba(0, 0, 0, 0.2);
}

.ekc-animated-hero .is-style-arrow-link .wp-block-button__link {
    color: var(--ekc-animated-hero-text);
    box-shadow: none;
}

.ekc-animated-hero__chips {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.65rem;
    margin-top: var(--space-8);
}

.ekc-animated-hero__chips span,
.ekc-animated-hero__chips p,
.ekc-animated-hero__chip {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    margin: 0;
    padding: 0.45rem 0.8rem;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: var(--radius-full);
    background: rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.84);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    backdrop-filter: blur(14px);
}

.ekc-animated-hero__stage--signal::before {
    content: "";
    position: absolute;
    left: -25%;
    bottom: -32%;
    width: 150%;
    height: 78%;
    background-image:
        linear-gradient(rgba(57, 255, 202, 0.28) 1px, transparent 1px),
        linear-gradient(90deg, rgba(97, 167, 255, 0.24) 1px, transparent 1px);
    background-size: 76px 76px;
    transform: perspective(720px) rotateX(64deg);
    transform-origin: center bottom;
    animation: ekc-signal-grid-flight 2.8s linear infinite;
    opacity: 0.62;
}

.ekc-animated-hero__stage--signal::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(18deg, transparent 22%, rgba(57, 255, 202, 0.68) 22.15%, transparent 23%),
        linear-gradient(-14deg, transparent 62%, rgba(97, 167, 255, 0.5) 62.15%, transparent 63%),
        radial-gradient(circle at 82% 22%, transparent 0 8rem, rgba(57, 255, 202, 0.34) 8.05rem 8.12rem, transparent 8.18rem),
        radial-gradient(circle at 16% 78%, transparent 0 5rem, rgba(57, 255, 202, 0.28) 5.05rem 5.12rem, transparent 5.18rem),
        linear-gradient(180deg, transparent, rgba(255, 255, 255, 0.14), transparent);
    background-size: auto, auto, auto, auto, 100% 46%;
    background-position: center, center, center, center, 0 -40%;
    background-repeat: no-repeat;
    animation: ekc-signal-scan 6.4s ease-in-out infinite;
    opacity: 0.5;
}

.ekc-animated-hero--signal {
    --ekc-animated-hero-bg: #071322;
    --ekc-animated-hero-accent: #39ffca;
    --ekc-animated-hero-accent-2: #61a7ff;
    background:
        radial-gradient(circle at 50% 95%, rgba(57, 255, 202, 0.22), transparent 24rem),
        linear-gradient(135deg, #071322, #10172f 54%, #071322);
}

.ekc-hero-signal__grid {
    position: absolute;
    left: -25%;
    bottom: -32%;
    width: 150%;
    height: 78%;
    background-image:
        linear-gradient(rgba(57, 255, 202, 0.28) 1px, transparent 1px),
        linear-gradient(90deg, rgba(97, 167, 255, 0.24) 1px, transparent 1px);
    background-size: 76px 76px;
    transform: perspective(720px) rotateX(64deg);
    transform-origin: center bottom;
    animation: ekc-signal-grid-flight 2.8s linear infinite;
    opacity: 0.62;
}

.ekc-hero-signal__beam {
    position: absolute;
    width: min(48vw, 640px);
    height: 2px;
    background: linear-gradient(90deg, transparent, rgba(57, 255, 202, 0.95), transparent);
    filter: drop-shadow(0 0 16px rgba(57, 255, 202, 0.75));
    animation: ekc-signal-beam-sweep 5.4s ease-in-out infinite;
}

.ekc-hero-signal__beam--one {
    left: -8%;
    top: 28%;
    transform: rotate(18deg);
}

.ekc-hero-signal__beam--two {
    right: -6%;
    top: 62%;
    animation-delay: -2.1s;
    transform: rotate(-14deg);
}

.ekc-hero-signal__ring {
    position: absolute;
    border: 1px solid rgba(57, 255, 202, 0.34);
    border-radius: 50%;
    filter: drop-shadow(0 0 20px rgba(57, 255, 202, 0.2));
    animation: ekc-signal-ring-pulse 5.6s ease-in-out infinite;
}

.ekc-hero-signal__ring--one {
    right: 9%;
    top: 14%;
    width: clamp(12rem, 26vw, 28rem);
    height: clamp(12rem, 26vw, 28rem);
}

.ekc-hero-signal__ring--two {
    left: 6%;
    bottom: 12%;
    width: clamp(9rem, 18vw, 18rem);
    height: clamp(9rem, 18vw, 18rem);
    animation-delay: -1.7s;
}

.ekc-hero-signal__scan {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent, rgba(255, 255, 255, 0.16), transparent);
    transform: translateY(-100%);
    animation: ekc-signal-scan 6.4s ease-in-out infinite;
    opacity: 0.32;
}

.ekc-animated-hero--kinetic {
    --ekc-animated-hero-bg: #111111;
    --ekc-animated-hero-accent: #ffdf64;
    --ekc-animated-hero-accent-2: #ff5d8f;
    background:
        linear-gradient(135deg, rgba(255, 223, 100, 0.18), transparent 38%),
        linear-gradient(225deg, rgba(255, 93, 143, 0.16), transparent 42%),
        #111111;
}

.ekc-animated-hero__stage--kinetic::before,
.ekc-animated-hero__stage--kinetic::after {
    position: absolute;
    left: -12vw;
    width: 124vw;
    color: transparent;
    font-size: clamp(4rem, 12vw, 11rem);
    font-weight: 900;
    line-height: 0.85;
    letter-spacing: 0;
    white-space: nowrap;
    text-transform: uppercase;
    -webkit-text-stroke: 1px rgba(255, 255, 255, 0.24);
    animation: ekc-kinetic-type-run 18s linear infinite;
}

.ekc-animated-hero__stage--kinetic::before {
    content: "BUILD HIRE LAUNCH GROW BUILD HIRE LAUNCH GROW";
    top: 12%;
    transform: rotate(-8deg);
}

.ekc-animated-hero__stage--kinetic::after {
    content: "STRATEGY DESIGN MOTION CONVERT STRATEGY DESIGN MOTION CONVERT";
    bottom: 12%;
    transform: rotate(7deg);
    animation-direction: reverse;
    animation-duration: 22s;
    -webkit-text-stroke-color: rgba(255, 223, 100, 0.28);
}

.ekc-hero-kinetic__track {
    position: absolute;
    left: -12vw;
    width: 124vw;
    white-space: nowrap;
    transform: rotate(-8deg);
}

.ekc-hero-kinetic__track span {
    display: inline-block;
    color: transparent;
    font-size: clamp(4rem, 12vw, 11rem);
    font-weight: 900;
    line-height: 0.85;
    letter-spacing: 0;
    text-transform: uppercase;
    -webkit-text-stroke: 1px rgba(255, 255, 255, 0.24);
    animation: ekc-kinetic-type-run 18s linear infinite;
}

.ekc-hero-kinetic__track--one {
    top: 8%;
}

.ekc-hero-kinetic__track--two {
    top: 42%;
    transform: rotate(7deg);
}

.ekc-hero-kinetic__track--two span {
    animation-direction: reverse;
    animation-duration: 22s;
    -webkit-text-stroke-color: rgba(255, 223, 100, 0.28);
}

.ekc-hero-kinetic__track--three {
    bottom: 4%;
}

.ekc-hero-kinetic__track--three span {
    animation-duration: 26s;
    -webkit-text-stroke-color: rgba(255, 93, 143, 0.24);
}

.ekc-hero-kinetic__slice {
    position: absolute;
    inset: auto;
    width: 46vw;
    height: 20vh;
    border: 1px solid rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.08);
    transform: skewX(-18deg);
    backdrop-filter: blur(18px);
    animation: ekc-kinetic-slice-float 8s ease-in-out infinite;
}

.ekc-hero-kinetic__slice--one {
    right: -12vw;
    top: 18%;
}

.ekc-hero-kinetic__slice--two {
    left: -18vw;
    bottom: 14%;
    animation-delay: -3s;
}

.ekc-animated-hero--prism {
    --ekc-animated-hero-bg: #110a24;
    --ekc-animated-hero-accent: #9ffcff;
    --ekc-animated-hero-accent-2: #ff7ad9;
    background:
        radial-gradient(circle at 72% 18%, rgba(255, 122, 217, 0.22), transparent 22rem),
        radial-gradient(circle at 18% 72%, rgba(159, 252, 255, 0.18), transparent 24rem),
        linear-gradient(135deg, #110a24, #24163f 52%, #0d1028);
}

.ekc-animated-hero__stage--prism::before,
.ekc-animated-hero__stage--prism::after {
    content: "";
    position: absolute;
    display: block;
    border: 1px solid rgba(255, 255, 255, 0.16);
    background: linear-gradient(135deg, rgba(159, 252, 255, 0.18), rgba(255, 122, 217, 0.18));
    box-shadow: 0 24px 80px rgba(0, 0, 0, 0.26);
    backdrop-filter: blur(18px);
}

.ekc-animated-hero__stage--prism::before {
    right: 8%;
    top: 12%;
    width: clamp(10rem, 24vw, 26rem);
    height: clamp(15rem, 30vw, 34rem);
    clip-path: polygon(18% 0, 100% 24%, 72% 100%, 0 68%);
    animation: ekc-prism-shard-drift 11s ease-in-out infinite;
}

.ekc-animated-hero__stage--prism::after {
    left: -16%;
    bottom: 20%;
    width: min(54vw, 640px);
    height: min(18vw, 220px);
    transform: rotate(-12deg);
    animation: ekc-prism-glass-glide 9s ease-in-out infinite;
}

.ekc-hero-prism__shard,
.ekc-hero-prism__glass {
    position: absolute;
    display: block;
    border: 1px solid rgba(255, 255, 255, 0.16);
    background: linear-gradient(135deg, rgba(159, 252, 255, 0.18), rgba(255, 122, 217, 0.18));
    box-shadow: 0 24px 80px rgba(0, 0, 0, 0.26);
    backdrop-filter: blur(18px);
}

.ekc-hero-prism__shard {
    clip-path: polygon(18% 0, 100% 24%, 72% 100%, 0 68%);
    animation: ekc-prism-shard-drift 11s ease-in-out infinite;
}

.ekc-hero-prism__shard--one {
    right: 8%;
    top: 12%;
    width: clamp(10rem, 24vw, 26rem);
    height: clamp(15rem, 30vw, 34rem);
}

.ekc-hero-prism__shard--two {
    left: 7%;
    top: 20%;
    width: clamp(7rem, 16vw, 17rem);
    height: clamp(12rem, 22vw, 24rem);
    animation-delay: -2s;
}

.ekc-hero-prism__shard--three {
    right: 22%;
    bottom: 6%;
    width: clamp(7rem, 15vw, 16rem);
    height: clamp(8rem, 16vw, 18rem);
    animation-delay: -4.5s;
}

.ekc-hero-prism__shard--four {
    left: 18%;
    bottom: 7%;
    width: clamp(5rem, 12vw, 12rem);
    height: clamp(7rem, 14vw, 15rem);
    animation-delay: -6s;
}

.ekc-hero-prism__glass {
    width: min(54vw, 640px);
    height: min(18vw, 220px);
    transform: rotate(-12deg);
    animation: ekc-prism-glass-glide 9s ease-in-out infinite;
}

.ekc-hero-prism__glass--one {
    right: -12%;
    top: 38%;
}

.ekc-hero-prism__glass--two {
    left: -16%;
    bottom: 20%;
    animation-delay: -3.2s;
}

@keyframes ekc-signal-grid-flight {
    from {
        background-position: 0 0, 0 0;
    }

    to {
        background-position: 0 76px, 76px 0;
    }
}

@keyframes ekc-signal-beam-sweep {
    0%,
    100% {
        opacity: 0;
        translate: -8vw 0;
    }

    45%,
    62% {
        opacity: 1;
    }

    80% {
        opacity: 0;
        translate: 18vw 0;
    }
}

@keyframes ekc-signal-ring-pulse {
    0%,
    100% {
        opacity: 0.28;
        scale: 0.92;
    }

    50% {
        opacity: 0.68;
        scale: 1.08;
    }
}

@keyframes ekc-signal-scan {
    0%,
    36% {
        transform: translateY(-100%);
    }

    72%,
    100% {
        transform: translateY(100%);
    }
}

@keyframes ekc-kinetic-type-run {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(-50%);
    }
}

@keyframes ekc-kinetic-slice-float {
    0%,
    100% {
        translate: 0 0;
        rotate: 0deg;
    }

    50% {
        translate: 4vw -2vh;
        rotate: 4deg;
    }
}

@keyframes ekc-prism-shard-drift {
    0%,
    100% {
        translate: 0 0;
        rotate: -2deg;
        scale: 1;
    }

    50% {
        translate: 2vw -2vh;
        rotate: 5deg;
        scale: 1.04;
    }
}

@keyframes ekc-prism-glass-glide {
    0%,
    100% {
        translate: 0 0;
        opacity: 0.42;
    }

    50% {
        translate: 6vw -2vh;
        opacity: 0.72;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ekc-animated-hero *,
    .ekc-animated-hero *::before,
    .ekc-animated-hero *::after {
        animation: none !important;
        transition: none !important;
    }
}

.editor-styles-wrapper .ekc-animated-hero,
.block-editor-block-list__layout .ekc-animated-hero {
    min-height: 560px;
}

.editor-styles-wrapper .ekc-animated-hero *,
.block-editor-block-list__layout .ekc-animated-hero * {
    animation-play-state: paused;
}

@media (max-width: 767px) {
    .ekc-animated-hero {
        min-height: 620px;
        padding-inline: var(--space-4);
    }

    .ekc-animated-hero__heading {
        max-width: 10ch;
        font-size: clamp(2.7rem, 16vw, 4.8rem);
    }

    .ekc-animated-hero__chips span,
    .ekc-animated-hero__chips p,
    .ekc-animated-hero__chip {
        flex: 1 1 140px;
        justify-content: center;
    }

    .ekc-hero-kinetic__track span {
        font-size: clamp(3rem, 22vw, 7rem);
    }

    .ekc-hero-prism__glass,
    .ekc-animated-hero__stage--prism::after {
        width: 78vw;
    }
}

.ekc-section-heading {
    max-width: var(--ekc-content-narrow);
    margin-inline: auto;
    margin-bottom: var(--space-16);
    text-align: center;
}

.ekc-section-heading h1,
.ekc-section-heading h2 {
    margin-bottom: var(--space-4);
    font-size: var(--font-size-3xl);
    letter-spacing: 0;
    line-height: 1.12;
    overflow-wrap: break-word;
    text-wrap: balance;
}

.ekc-section-heading p {
    margin-inline: auto;
    color: var(--ekc-text-muted, var(--color-mid-gray));
    font-size: var(--font-size-md);
}

.ekc-logo-row {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--space-4);
    align-items: stretch;
}

.ekc-logo-row p {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 72px;
    margin: 0;
    border: var(--ekc-border-soft);
    border-radius: var(--radius-md);
    color: var(--color-mid-gray);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-bold);
    letter-spacing: 0.12em;
    text-align: center;
    text-transform: uppercase;
}

.ekc-service-card {
    height: 100%;
    padding: var(--space-8);
    border: var(--ekc-border-soft);
    border-radius: var(--radius-md);
    background: var(--ekc-surface, var(--color-white));
    box-shadow: var(--shadow-sm);
}

.ekc-service-card h3 {
    margin-bottom: var(--space-3);
    font-size: var(--font-size-xl);
    letter-spacing: 0;
}

.ekc-service-card p {
    color: var(--ekc-text-muted, var(--color-mid-gray));
    font-size: var(--font-size-sm);
}

.ekc-service-card .wp-block-image img {
    width: 100%;
    aspect-ratio: 16 / 10;
    object-fit: cover;
    border-radius: var(--radius-md);
}

.ekc-process-list {
    counter-reset: ekc-process;
}

.ekc-process-step {
    position: relative;
    padding: var(--space-8);
    border-top: var(--ekc-border-soft);
}

.ekc-process-step::before {
    counter-increment: ekc-process;
    content: counter(ekc-process, decimal-leading-zero);
    display: block;
    margin-bottom: var(--space-4);
    color: var(--ekc-brand-accent, var(--color-accent));
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-bold);
}

.ekc-process-step h3 {
    margin-bottom: var(--space-3);
    font-size: var(--font-size-lg);
}

.ekc-feature-panel {
    padding: var(--space-10);
    border-radius: var(--radius-md);
    background: var(--ekc-brand-primary, var(--color-primary));
    color: var(--ekc-text-inverse, var(--color-white));
}

.ekc-feature-panel h2,
.ekc-feature-panel h3,
.ekc-feature-panel p {
    color: inherit;
}

.ekc-metric-row {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-4);
}

.ekc-metric {
    padding: var(--space-6);
    border: var(--ekc-border-soft);
    border-radius: var(--radius-md);
    background: var(--ekc-surface, var(--color-white));
}

.ekc-metric strong {
    display: block;
    margin-bottom: var(--space-2);
    color: var(--ekc-brand-primary, var(--color-primary));
    font-size: var(--font-size-2xl);
    line-height: 1;
}

.ekc-metric span {
    color: var(--ekc-text-muted, var(--color-mid-gray));
    font-size: var(--font-size-sm);
}

.ekc-metric p {
    margin: 0;
}

.ekc-cta-band {
    overflow: hidden;
    padding: var(--space-16);
    border-radius: var(--radius-md);
    background: var(--ekc-brand-primary, var(--color-primary));
    color: var(--ekc-text-inverse, var(--color-white));
}

.ekc-cta-band h2,
.ekc-cta-band p {
    color: inherit;
}

.ekc-cta-band p {
    color: rgba(255, 255, 255, 0.78);
}

.ekc-local-business-hero {
    overflow: hidden;
    background:
        radial-gradient(circle at 88% 12%, color-mix(in srgb, var(--ekc-brand-accent, var(--color-accent)) 18%, transparent), transparent 30rem),
        linear-gradient(180deg, var(--ekc-surface-page, var(--color-off-white)), var(--ekc-surface, var(--color-white)));
}

.ekc-expansion-split {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(280px, 0.72fr);
    gap: var(--space-10);
    align-items: center;
}

.ekc-local-hero__copy h1 {
    max-width: 12ch;
    margin-bottom: var(--space-6);
    font-size: var(--font-size-4xl);
    line-height: 1.04;
    text-wrap: balance;
}

.ekc-local-hero__panel,
.ekc-map-placeholder,
.ekc-compliance-panel,
.ekc-operation-card {
    border: var(--ekc-border-soft);
    border-radius: var(--radius-md);
    background: var(--ekc-surface, var(--color-white));
    box-shadow: var(--shadow-sm);
}

.ekc-local-hero__panel,
.ekc-map-placeholder {
    padding: var(--space-10);
}

.ekc-local-trust-strip {
    margin-top: var(--space-10);
}

.ekc-operation-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--space-6);
}

.ekc-operation-grid--2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ekc-operation-grid--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.ekc-operation-grid--timeline {
    align-items: stretch;
    counter-reset: ekc-operation-step;
}

.ekc-operation-card {
    position: relative;
    min-width: 0;
    padding: var(--space-8);
}

.ekc-operation-card h3 {
    margin-bottom: var(--space-3);
    font-size: var(--font-size-xl);
    letter-spacing: 0;
}

.ekc-operation-card p:not(.is-style-eyebrow) {
    color: var(--ekc-text-muted, var(--color-mid-gray));
    font-size: var(--font-size-sm);
}

.ekc-operation-grid--timeline .ekc-operation-card {
    padding-top: var(--space-12);
}

.ekc-operation-grid--timeline .ekc-operation-card::before {
    counter-increment: ekc-operation-step;
    content: counter(ekc-operation-step);
    position: absolute;
    right: var(--space-6);
    top: var(--space-6);
    display: inline-grid;
    width: 2.2rem;
    height: 2.2rem;
    place-items: center;
    border-radius: var(--radius-full);
    background: color-mix(in srgb, var(--ekc-brand-accent, var(--color-accent)) 14%, transparent);
    color: var(--ekc-brand-primary, var(--color-primary));
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-bold);
}

.ekc-compliance-panel {
    display: grid;
    grid-template-columns: minmax(0, 0.92fr) minmax(280px, 1fr);
    gap: var(--space-8);
    padding: var(--space-10);
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--ekc-brand-accent, var(--color-accent)) 9%, transparent), transparent 58%),
        var(--ekc-surface, var(--color-white));
}

.ekc-compliance-panel__summary {
    align-self: center;
}

.ekc-contact-map-panel {
    background: var(--ekc-surface-page, var(--color-off-white));
}

.ekc-map-placeholder {
    display: grid;
    min-height: 340px;
    align-content: center;
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--ekc-brand-primary, var(--color-primary)) 8%, transparent), transparent),
        var(--ekc-surface, var(--color-white));
}

.ekc-launch-checklist .ekc-operation-card {
    border-left: 4px solid var(--ekc-brand-accent, var(--color-accent));
}

.ekc-notice-banner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--space-6);
    align-items: center;
    padding: var(--space-8);
    border: var(--ekc-border-soft);
    border-left: 4px solid var(--ekc-brand-accent, var(--color-accent));
    border-radius: var(--radius-md);
    background: var(--ekc-surface, var(--color-white));
    box-shadow: var(--shadow-sm);
}

.ekc-notice-banner .wp-block-buttons {
    margin-top: 0;
}

.ekc-area-grid .ekc-operation-card,
.ekc-consent-gallery .ekc-operation-card {
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--ekc-brand-accent, var(--color-accent)) 6%, transparent), transparent 58%),
        var(--ekc-surface, var(--color-white));
}

.ekc-team-role-grid .ekc-operation-card::before {
    content: "";
    display: block;
    width: 3rem;
    height: 3rem;
    margin-bottom: var(--space-4);
    border-radius: var(--radius-full);
    background:
        radial-gradient(circle at 34% 28%, rgba(255, 255, 255, 0.72), transparent 18%),
        color-mix(in srgb, var(--ekc-brand-primary, var(--color-primary)) 16%, transparent);
}

.ekc-pub-section {
    background:
        linear-gradient(180deg, #161e22, #10161a);
    color: #fff8ed;
}

.ekc-pub-section .ekc-section-heading h2,
.ekc-pub-section .ekc-section-heading p,
.ekc-pub-section .wp-block-buttons {
    color: inherit;
}

.ekc-pub-section .ekc-operation-card,
.ekc-pub-board .ekc-operation-card {
    border-color: rgba(199, 154, 60, 0.24);
    background: rgba(255, 248, 237, 0.08);
    color: #fff8ed;
    box-shadow: none;
}

.ekc-pub-section .ekc-operation-card p,
.ekc-pub-board .ekc-operation-card p {
    color: rgba(255, 248, 237, 0.78);
}

.ekc-pub-board-wrap {
    background: #0f171b;
}

.ekc-pub-board {
    padding: var(--space-10);
    border: 1px solid rgba(199, 154, 60, 0.28);
    border-radius: var(--radius-md);
    background:
        radial-gradient(circle at 80% 20%, rgba(199, 154, 60, 0.14), transparent 22rem),
        #121d21;
    color: #fff8ed;
}

.ekc-pub-board .ekc-section-heading h2,
.ekc-pub-board .ekc-section-heading p {
    color: inherit;
}

.ekc-care-section {
    background:
        linear-gradient(180deg, #fbf7ef, #eef3ea);
}

.ekc-care-reassurance .ekc-operation-card {
    border-color: #d9cdbc;
    background: #fffdf8;
}

.ekc-treatment-menu .ekc-operation-card {
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--ekc-brand-accent, var(--color-accent)) 10%, transparent), transparent 58%),
        var(--ekc-surface, var(--color-white));
}

.ekc-premium-card-grid,
.ekc-testimonial-grid,
.ekc-before-after-grid,
.ekc-team-grid {
    display: grid;
    gap: var(--space-6);
}

.ekc-premium-card-grid--3,
.ekc-team-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.ekc-testimonial-grid,
.ekc-before-after-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ekc-pricing-card,
.ekc-testimonial-card,
.ekc-before-after-card,
.ekc-team-card {
    height: 100%;
    padding: var(--space-8);
    border: var(--ekc-border-soft);
    border-radius: var(--radius-md);
    background: var(--ekc-surface, var(--color-white));
    box-shadow: var(--shadow-sm);
}

.ekc-pricing-card > :first-child,
.ekc-testimonial-card > :first-child,
.ekc-before-after-card > :first-child,
.ekc-team-card > :first-child {
    margin-top: 0;
}

.ekc-pricing-card > :last-child,
.ekc-testimonial-card > :last-child,
.ekc-before-after-card > :last-child,
.ekc-team-card > :last-child {
    margin-bottom: 0;
}

.ekc-pricing-card--featured {
    border-color: color-mix(in srgb, var(--ekc-brand-accent, var(--color-accent)) 54%, var(--ekc-border, var(--color-light-gray)));
    box-shadow: var(--shadow-lg);
}

.ekc-pricing-card__price {
    margin-block: var(--space-4) var(--space-8);
    color: var(--ekc-brand-primary, var(--color-primary));
    font-size: var(--font-size-3xl);
    font-weight: var(--font-weight-bold);
    line-height: 1;
}

.ekc-testimonial-grid .ekc-testimonial-card--featured {
    grid-row: span 2;
    padding: var(--space-10);
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--ekc-brand-accent, var(--color-accent)) 10%, transparent), transparent 55%),
        var(--ekc-surface, var(--color-white));
}

.ekc-testimonial-stars,
.ekc-testimonial-author {
    color: var(--ekc-brand-accent, var(--color-accent));
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-bold);
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.ekc-testimonial-card p:not(.ekc-testimonial-stars):not(.ekc-testimonial-author) {
    color: var(--ekc-text-soft, var(--color-dark-gray));
    font-size: var(--font-size-md);
    line-height: var(--line-height-loose);
}

.ekc-before-after-pair {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-3);
    margin-bottom: var(--space-6);
}

.ekc-before-after-pair figure {
    position: relative;
    overflow: hidden;
    margin: 0;
    border-radius: var(--radius-md);
    background: var(--ekc-surface-soft, var(--color-light-gray));
}

.ekc-before-after-pair img {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 5;
    object-fit: cover;
}

.ekc-before-after-pair figcaption {
    position: absolute;
    left: var(--space-3);
    top: var(--space-3);
    margin: 0;
    padding: var(--space-1) var(--space-3);
    border-radius: var(--radius-full);
    background: rgba(13, 13, 13, 0.72);
    color: var(--ekc-text-inverse, var(--color-white));
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-bold);
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.ekc-team-card .wp-block-image {
    margin-bottom: var(--space-6);
}

.ekc-team-card img {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 5;
    object-fit: cover;
    border-radius: var(--radius-md);
}

.ekc-team-card h3 {
    margin-bottom: var(--space-2);
}

.ekc-process-flow {
    display: grid;
    gap: 0;
    border-bottom: var(--ekc-border-soft);
}

.ekc-process-flow .ekc-process-step {
    margin: 0;
}

/* --------------------------------------------------------------------------
   21st-style hero pattern: centered copy with feature cards
   -------------------------------------------------------------------------- */

.ekc-ethical-hero {
    position: relative;
    overflow: hidden;
    padding: var(--space-24) var(--space-6);
    background:
        radial-gradient(circle at 50% 0%, color-mix(in srgb, var(--ekc-brand-accent, var(--color-accent)) 12%, transparent), transparent 30rem),
        linear-gradient(180deg, var(--ekc-surface-page, var(--color-off-white)), var(--ekc-surface, var(--color-white)));
}

.ekc-ethical-hero__intro {
    text-align: center;
}

.ekc-ethical-hero__eyebrow {
    margin: 0 auto var(--space-4);
    color: var(--ekc-brand-accent, var(--color-accent));
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    letter-spacing: 0.14em;
    line-height: 1.4;
    text-align: center;
    text-transform: uppercase;
}

.ekc-ethical-hero__title {
    max-width: 12ch;
    margin-inline: auto;
    color: var(--ekc-text, var(--color-black));
    font-size: var(--font-size-4xl);
    letter-spacing: 0;
    line-height: 1.06;
}

.ekc-ethical-hero__subtitle {
    max-width: 66ch;
    margin: var(--space-6) auto 0;
    color: var(--ekc-text-muted, var(--color-mid-gray));
    font-size: var(--font-size-md);
    line-height: 1.8;
}

.ekc-ethical-hero__actions {
    justify-content: center;
    margin-top: var(--space-10);
}

.ekc-ethical-hero__button .wp-block-button__link {
    min-height: 52px;
    padding: 0 var(--space-8);
    border: 0;
    border-radius: var(--radius-full);
    background: var(--ekc-brand-primary, var(--color-primary));
    color: var(--ekc-text-inverse, var(--color-white));
    font-weight: var(--font-weight-semibold);
    box-shadow: var(--shadow-md);
    transition: transform var(--transition-base), background-color var(--transition-base), box-shadow var(--transition-base);
}

.ekc-ethical-hero__button .wp-block-button__link:hover,
.ekc-ethical-hero__button .wp-block-button__link:focus-visible {
    background: var(--ekc-brand-accent, var(--color-accent));
    box-shadow: var(--shadow-lg);
    transform: translateY(-2px);
}

.ekc-ethical-hero__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-6);
    margin-top: var(--space-24);
}

.ekc-ethical-hero__card {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-width: 0;
    border: var(--ekc-border-soft);
    border-radius: var(--radius-lg);
    background: var(--ekc-surface, var(--color-white));
    box-shadow: var(--shadow-sm);
    transition: transform 260ms ease, box-shadow 260ms ease, border-color 260ms ease;
}

.ekc-ethical-hero__card:hover,
.ekc-ethical-hero__card:focus-within {
    border-color: color-mix(in srgb, var(--ekc-brand-accent, var(--color-accent)) 34%, var(--ekc-border, var(--color-light-gray)));
    box-shadow: var(--shadow-lg);
    transform: translateY(-5px) scale(1.01);
}

.ekc-ethical-hero__image {
    overflow: hidden;
    margin: 0;
    background: var(--ekc-surface-soft, var(--color-light-gray));
}

.ekc-ethical-hero__image img {
    display: block;
    width: 100%;
    aspect-ratio: 1;
    object-fit: cover;
    transition: transform 360ms ease, filter 360ms ease;
}

.ekc-ethical-hero__card:hover .ekc-ethical-hero__image img,
.ekc-ethical-hero__card:focus-within .ekc-ethical-hero__image img {
    filter: saturate(1.04) contrast(1.02);
    transform: scale(1.045);
}

.ekc-ethical-hero__card-body {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4);
    padding: var(--space-6);
}

.ekc-ethical-hero__card-title {
    margin: 0;
    color: var(--ekc-text, var(--color-black));
    font-size: var(--font-size-lg);
    line-height: 1.25;
}

.ekc-ethical-hero__card-link {
    flex: 0 0 auto;
    margin: 0;
}

.ekc-ethical-hero__card-link a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    overflow: hidden;
    border-radius: var(--radius-full);
    background: color-mix(in srgb, var(--ekc-brand-primary, var(--color-primary)) 8%, transparent);
    color: var(--ekc-brand-primary, var(--color-primary));
    font-weight: var(--font-weight-semibold);
    text-decoration: none;
    white-space: nowrap;
    transition: background-color 260ms ease, color 260ms ease, transform 260ms ease;
}

.ekc-ethical-hero__card-link a span {
    font-size: var(--font-size-lg);
    line-height: 1;
    transition: transform 260ms ease;
}

.ekc-ethical-hero__card:hover .ekc-ethical-hero__card-link a,
.ekc-ethical-hero__card:focus-within .ekc-ethical-hero__card-link a {
    background: var(--ekc-brand-primary, var(--color-primary));
    color: var(--ekc-text-inverse, var(--color-white));
}

.ekc-ethical-hero__card:hover .ekc-ethical-hero__card-link span,
.ekc-ethical-hero__card:focus-within .ekc-ethical-hero__card-link span {
    transform: translateX(2px);
}

@keyframes ekc-ethical-hero-rise {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

body:not(.block-editor-page) .ekc-ethical-hero__intro,
body:not(.block-editor-page) .ekc-ethical-hero__card {
    animation: ekc-ethical-hero-rise 800ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

body:not(.block-editor-page) .ekc-ethical-hero__card:nth-child(2) {
    animation-delay: 100ms;
}

body:not(.block-editor-page) .ekc-ethical-hero__card:nth-child(3) {
    animation-delay: 200ms;
}

.editor-styles-wrapper .ekc-ethical-hero__intro,
.editor-styles-wrapper .ekc-ethical-hero__card {
    animation: none;
}

@supports not (color: color-mix(in srgb, white, black)) {
    .wp-block-group.is-style-editorial-band,
    .wp-block-group.is-style-luxury-panel,
    .ekc-ethical-hero {
        background: var(--ekc-surface, var(--color-white));
    }

    ul.is-style-checkmark li::before,
    ol.is-style-checkmark li::before,
    ul.is-style-feature-list li::before,
    ol.is-style-feature-list li::before,
    .wp-block-list.is-style-checkmark li::before,
    .wp-block-list.is-style-feature-list li::before {
        background: var(--color-light-gray);
    }

    .ekc-pricing-card--featured {
        border-color: var(--ekc-brand-accent, var(--color-accent));
    }

    .ekc-ethical-hero__card-link a {
        background: var(--color-light-gray);
    }
}

@media (max-width: 1024px) {
    .ekc-logo-row,
    .ekc-metric-row,
    .ekc-operation-grid,
    .ekc-premium-card-grid--3,
    .ekc-recruitment-route-grid,
    .ekc-recruitment-launch-grid,
    .ekc-team-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .ekc-expansion-split,
    .ekc-compliance-panel,
    .ekc-notice-banner {
        grid-template-columns: 1fr;
    }

    .wp-block-columns.is-style-editorial-split,
    .wp-block-media-text.is-style-editorial-feature {
        gap: var(--space-8);
    }

    .ekc-ethical-hero__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        margin-top: var(--space-16);
    }
}

@media (max-width: 767px) {
    :root {
        --ekc-section-padding: var(--space-16);
        --ekc-section-padding-sm: var(--space-12);
    }

    .wp-block-group.is-style-premium-surface,
    .wp-block-group.is-style-premium-card,
    .wp-block-group.is-style-premium-dark,
    .wp-block-group.is-style-editorial-band,
    .wp-block-group.is-style-luxury-panel,
    .wp-block-columns.is-style-premium-grid > .wp-block-column,
    .wp-block-column.is-style-premium-column,
    .wp-block-media-text.is-style-editorial-feature .wp-block-media-text__content,
    .ekc-pricing-card,
    .ekc-testimonial-card,
    .ekc-before-after-card,
    .ekc-team-card,
    .ekc-recruitment-route-card,
    .ekc-recruitment-launch-card,
    .ekc-recruitment-brief__panel,
    .ekc-feature-panel,
    .ekc-cta-band,
    .ekc-local-hero__panel,
    .ekc-map-placeholder,
    .ekc-compliance-panel,
    .ekc-operation-card,
    .ekc-pub-board,
    .ekc-notice-banner {
        padding: var(--space-6);
    }

    .ekc-premium-hero {
        min-height: 74vh;
    }

    .wp-block-cover.is-style-premium-hero {
        min-height: 68vh;
        padding-block: var(--space-16);
    }

    .ekc-premium-hero .wp-block-heading,
    .wp-block-cover.is-style-premium-hero .wp-block-heading,
    .ekc-section-heading h1,
    .ekc-section-heading h2 {
        font-size: var(--font-size-2xl);
    }

    .ekc-logo-row,
    .ekc-metric-row,
    .ekc-operation-grid,
    .ekc-operation-grid--2,
    .ekc-premium-card-grid--3,
    .ekc-testimonial-grid,
    .ekc-before-after-grid,
    .ekc-recruitment-route-grid,
    .ekc-recruitment-launch-grid,
    .ekc-team-grid {
        grid-template-columns: 1fr;
    }

    .wp-block-media-text.is-style-editorial-feature {
        width: 100%;
        display: block;
    }

    .wp-block-media-text.is-style-editorial-feature h1 {
        font-size: var(--font-size-2xl);
        line-height: 1.12;
        overflow-wrap: break-word;
    }

    .ekc-testimonial-grid .ekc-testimonial-card--featured {
        grid-row: auto;
    }

    .ekc-ethical-hero {
        padding: var(--space-16) var(--space-4);
    }

    .ekc-ethical-hero__title {
        max-width: 13ch;
        font-size: var(--font-size-3xl);
    }

    .ekc-ethical-hero__subtitle {
        font-size: var(--font-size-base);
        line-height: 1.7;
    }

    .ekc-ethical-hero__grid {
        grid-template-columns: 1fr;
        gap: var(--space-5);
    }

    .ekc-ethical-hero__card-body {
        padding: var(--space-5);
    }
}

@media (prefers-reduced-motion: reduce) {
    .ekc-ethical-hero__intro,
    .ekc-ethical-hero__card,
    .ekc-ethical-hero__button .wp-block-button__link,
    .ekc-ethical-hero__image img,
    .ekc-ethical-hero__card-link a,
    .ekc-ethical-hero__card-link a span {
        animation: none;
        transition: none;
    }

    .ekc-ethical-hero__card:hover,
    .ekc-ethical-hero__card:focus-within,
    .ekc-ethical-hero__button .wp-block-button__link:hover,
    .ekc-ethical-hero__button .wp-block-button__link:focus-visible,
    .ekc-ethical-hero__card:hover .ekc-ethical-hero__image img,
    .ekc-ethical-hero__card:focus-within .ekc-ethical-hero__image img {
        transform: none;
    }
}
