/*
Theme Name: Confidion
Theme URI: https://confidion.com
Author: Confidion
Author URI: https://confidion.com
Description: Marketing theme for Confidion and its Sentry (open-source intelligence) and Indicia (people screening) platforms. Classic PHP theme with dedicated product page templates, a Customizer-driven front page, and a dark-intelligence visual system layered over a clean, readable body. Built for government, defence, corporate security, and financial-services buyers.
Version: 1.0.22
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: confidion
Tags: business, custom-logo, custom-menu, featured-images, threaded-comments, full-width-template, translation-ready
*/

/* =========================================================================
   Confidion theme — design tokens
   Palette lifted from the Sentry app (assets/css/shared/variables.css) so the
   marketing site and the product UI read as one brand.
   ========================================================================= */
:root {
    /* Brand navy (dark sections / hero) */
    --c-navy-950: #070b16;
    --c-navy-900: #0a0f1c;
    --c-navy-800: #0f172a;
    --c-navy-700: #1e293b;
    --c-navy-600: #273449;

    /* Sentry = blue (external / watch) */
    --c-blue-700: #1d4ed8;
    --c-blue-600: #2563eb;
    --c-blue-500: #3b82f6;
    --c-blue-400: #60a5fa;
    --c-blue-300: #93c5fd;

    /* Indicia = emerald (internal / trust / verified) */
    --c-emerald-600: #059669;
    --c-emerald-500: #10b981;
    --c-emerald-400: #34d399;
    --c-emerald-300: #6ee7b7;

    /* Supporting accents */
    --c-purple-500: #8b5cf6;
    --c-amber-500: #f59e0b;
    --c-red-500: #ef4444;
    --c-cyan-500: #06b6d4;

    /* Slate scale — light body */
    --c-slate-50: #f8fafc;
    --c-slate-100: #f1f5f9;
    --c-slate-200: #e2e8f0;
    --c-slate-300: #cbd5e1;
    --c-slate-400: #94a3b8;
    --c-slate-500: #64748b;
    --c-slate-600: #475569;
    --c-slate-700: #334155;
    --c-slate-800: #1e293b;
    --c-slate-900: #0f172a;

    /* Semantic */
    --c-ink: #0f172a;
    --c-body: #334155;
    --c-muted: #64748b;
    --c-line: #e2e8f0;
    --c-bg: #ffffff;
    --c-bg-alt: #f8fafc;

    /* Effects */
    --c-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.06), 0 1px 3px rgba(15, 23, 42, 0.08);
    --c-shadow-md: 0 8px 24px rgba(15, 23, 42, 0.08), 0 2px 6px rgba(15, 23, 42, 0.05);
    --c-shadow-lg: 0 24px 60px rgba(15, 23, 42, 0.14);
    --c-shadow-blue: 0 12px 30px rgba(59, 130, 246, 0.28);
    --c-shadow-emerald: 0 12px 30px rgba(16, 185, 129, 0.24);

    --c-radius-sm: 8px;
    --c-radius: 14px;
    --c-radius-lg: 22px;
    --c-radius-pill: 999px;

    /* Type */
    --c-font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --c-font-mono: "SFMono-Regular", ui-monospace, "JetBrains Mono", "Menlo", monospace;

    /* Rhythm */
    --c-container: 1200px;
    --c-container-narrow: 820px;
    --c-gutter: clamp(20px, 5vw, 40px);
    --c-section-y: clamp(64px, 9vw, 120px);
}

/* =========================================================================
   Reset / base
   ========================================================================= */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { animation-duration: 0.001ms !important; transition-duration: 0.001ms !important; }
}

body {
    margin: 0;
    font-family: var(--c-font-sans);
    font-size: 17px;
    line-height: 1.65;
    color: var(--c-body);
    background: var(--c-bg);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6 {
    margin: 0 0 0.5em;
    color: var(--c-ink);
    line-height: 1.15;
    font-weight: 700;
    letter-spacing: -0.02em;
}
h1 { font-size: clamp(2.25rem, 5vw, 3.6rem); }
h2 { font-size: clamp(1.85rem, 3.6vw, 2.75rem); }
h3 { font-size: clamp(1.3rem, 2vw, 1.65rem); }
h4 { font-size: 1.15rem; }

p { margin: 0 0 1.1em; }
a { color: var(--c-blue-600); text-decoration: none; transition: color 0.15s ease; }
a:hover { color: var(--c-blue-700); }
img { max-width: 100%; height: auto; display: block; }
ul, ol { margin: 0 0 1.1em; padding-left: 1.25em; }
strong { color: var(--c-ink); font-weight: 700; }
/* On dark backgrounds, bold text must not fall back to dark ink. */
.hero strong, .product--dark strong, .together strong, .page-hero strong,
.cta strong, .console strong, .trustbar strong, .flow-card strong { color: inherit; }
hr { border: 0; border-top: 1px solid var(--c-line); margin: 2rem 0; }

:focus-visible {
    outline: 3px solid var(--c-blue-400);
    outline-offset: 2px;
    border-radius: 4px;
}

.screen-reader-text {
    position: absolute !important;
    width: 1px; height: 1px;
    padding: 0; margin: -1px; overflow: hidden;
    clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
.skip-link {
    position: absolute; left: -9999px; top: 0; z-index: 9999;
    background: var(--c-blue-600); color: #fff; padding: 12px 20px;
    border-radius: 0 0 var(--c-radius-sm) 0; font-weight: 600;
}
.skip-link:focus { left: 0; color: #fff; }

/* =========================================================================
   Layout helpers
   ========================================================================= */
.c-container { width: 100%; max-width: var(--c-container); margin-inline: auto; padding-inline: var(--c-gutter); }
.c-narrow { max-width: var(--c-container-narrow); }
.c-section { padding-block: var(--c-section-y); }
.c-section--tight { padding-block: clamp(44px, 6vw, 72px); }

.c-eyebrow {
    display: inline-flex; align-items: center; gap: 8px;
    font-size: 0.78rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase;
    color: var(--c-blue-600); margin-bottom: 14px;
}
.c-eyebrow::before { content: ""; width: 22px; height: 2px; background: currentColor; border-radius: 2px; }
.c-eyebrow--emerald { color: var(--c-emerald-600); }
.c-eyebrow--light { color: var(--c-blue-300); }

.c-section-head { max-width: 760px; margin: 0 auto clamp(40px, 5vw, 64px); text-align: center; }
.c-section-head .c-eyebrow { justify-content: center; }
.c-section-head p { font-size: 1.15rem; color: var(--c-muted); margin-bottom: 0; }

.c-lead { font-size: 1.2rem; color: var(--c-slate-600); }

/* =========================================================================
   Buttons
   ========================================================================= */
.c-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 9px;
    padding: 14px 26px; border-radius: var(--c-radius-pill);
    font-weight: 650; font-size: 1rem; line-height: 1; letter-spacing: -0.01em;
    cursor: pointer; border: 1px solid transparent; text-align: center;
    transition: transform 0.15s ease, box-shadow 0.2s ease, background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
    white-space: nowrap;
}
.c-btn svg { width: 18px; height: 18px; }
.c-btn--primary { background: var(--c-blue-600); color: #fff; box-shadow: var(--c-shadow-blue); }
.c-btn--primary:hover { background: var(--c-blue-700); color: #fff; transform: translateY(-2px); box-shadow: 0 16px 36px rgba(37, 99, 235, 0.38); }
.c-btn--emerald { background: var(--c-emerald-500); color: #04140e; box-shadow: var(--c-shadow-emerald); }
.c-btn--emerald:hover { background: var(--c-emerald-400); color: #04140e; transform: translateY(-2px); }
.c-btn--ghost { background: transparent; color: var(--c-ink); border-color: var(--c-slate-300); }
.c-btn--ghost:hover { border-color: var(--c-slate-400); color: var(--c-ink); background: var(--c-slate-50); transform: translateY(-2px); }
.c-btn--on-dark { background: rgba(255,255,255,0.08); color: #fff; border-color: rgba(255,255,255,0.22); backdrop-filter: blur(6px); }
.c-btn--on-dark:hover { background: rgba(255,255,255,0.16); color: #fff; border-color: rgba(255,255,255,0.4); transform: translateY(-2px); }
.c-btn--lg { padding: 17px 34px; font-size: 1.06rem; }
.c-btn-row { display: flex; flex-wrap: wrap; gap: 14px; }

/* =========================================================================
   Header / navigation
   ========================================================================= */
.site-header {
    position: sticky; top: 0; z-index: 500;
    background: rgba(10, 15, 28, 0.82);
    backdrop-filter: saturate(140%) blur(14px);
    border-bottom: 1px solid rgba(148, 163, 184, 0.14);
    transition: background 0.25s ease, box-shadow 0.25s ease;
}
.site-header.is-solid {
    background: rgba(10, 15, 28, 0.96);
    box-shadow: 0 8px 30px rgba(2, 6, 16, 0.5);
}
/* Header (Maltego-style): logo + nav grouped on the left, login + demo on the
   far right, all on one compact row. Small padding-block so the box hugs the
   logo height instead of ballooning when the logo is enlarged. */
.site-header__inner {
    padding-block: 5px;
    display: flex; align-items: center; justify-content: space-between; gap: 28px;
}
/* Left cluster: logo, then the nav links right beside it. */
.header-left { display: flex; align-items: center; gap: clamp(22px, 3vw, 40px); }
.site-brand { display: inline-flex; align-items: center; gap: 12px; color: #fff; }
.site-brand:hover { color: #fff; }
.site-brand__mark { width: 34px; height: 40px; flex: none; }
.site-brand__word {
    font-size: 1.32rem; font-weight: 750; letter-spacing: 0.18em;
    color: #fff; text-transform: uppercase;
}
.site-brand .custom-logo-link { display: inline-flex; align-items: center; }
/* Force an explicit height (not max-height) so the logo is actually rendered
   at the requested size — max-height only ever shrinks an image, it never
   scales one up, so the logo kept rendering small. High specificity +
   !important so a site-wide .custom-logo rule can't override it. */
.site-header .site-brand img.custom-logo,
.site-header a.custom-logo-link img.custom-logo {
    height: var(--confidion-logo-h, 160px) !important;
    width: auto !important;
    max-height: none !important;
    max-width: 100% !important;
}

.primary-nav { display: flex; align-items: center; gap: 4px; }
.primary-nav ul { list-style: none; display: flex; align-items: center; gap: clamp(6px, 1.4vw, 20px); margin: 0; padding: 0; }
/* Maltego-style: bold, uppercase, letter-spaced text links — no pill, just a
   colour shift on hover/active. */
.primary-nav a {
    display: block; padding: 8px 2px;
    color: var(--c-slate-300); font-weight: 700; font-size: 0.82rem;
    text-transform: uppercase; letter-spacing: 0.06em;
    white-space: nowrap; /* never let a menu label break onto two lines */
    transition: color 0.15s ease;
}
.primary-nav a:hover, .primary-nav .current-menu-item > a { color: #fff; }
/* Lock nav link colour so leftover plugin / old-theme CSS can't recolour it
   (kept the links inconsistent — grey on some pages, cyan on others). */
.site-header .primary-nav a { color: var(--c-slate-300) !important; }
.site-header .primary-nav a:hover,
.site-header .primary-nav .current-menu-item > a,
.site-header .primary-nav .current_page_item > a,
.site-header .primary-nav .current-menu-ancestor > a { color: #fff !important; }
.header-actions { display: flex; align-items: center; gap: 10px; }
/* Header buttons share one size so login + demo read as a matched pair.
   Scoped to .site-header + !important on the box model so a leftover global
   button/.btn rule (old Fortified theme, Elementor kit) can't resize them on
   interior pages — the login pill was rendering a different size once you left
   the Elementor-built home page. */
.site-header .header-actions .c-btn,
.site-header .header-login {
    height: 42px !important; padding: 0 20px !important;
    font-size: 0.92rem !important; line-height: 1 !important;
    font-family: inherit !important; letter-spacing: 0 !important;
    border-radius: var(--c-radius-pill) !important; display: inline-flex !important;
    box-sizing: border-box !important; width: auto !important; min-height: 0 !important;
    align-items: center; justify-content: center; gap: 7px; white-space: nowrap;
    text-transform: none !important;
}

/* Login dropdown (Sentry + Indicia) — outline pill, secondary to the demo CTA.
   Scoped to .site-header + !important on colour so a site-wide button style
   (Elementor kit, etc.) can't repaint it purple. */
.login-dropdown { position: relative; }
.site-header .header-login {
    color: var(--c-slate-200) !important; font-weight: 600; font-family: inherit;
    background: rgba(255,255,255,0.05) !important;
    border: 1px solid rgba(148,163,184,0.35) !important;
    box-shadow: none !important; cursor: pointer; text-transform: none;
}
.site-header .header-login:hover,
.login-dropdown.is-open .header-login {
    color: #fff !important; border-color: rgba(255,255,255,0.5) !important;
    background: rgba(255,255,255,0.1) !important;
}
.login-caret { transition: transform 0.2s ease; }
.login-dropdown.is-open .login-caret { transform: rotate(180deg); }
.login-dropdown.is-open .header-login { color: #fff; }

.login-menu {
    position: absolute; top: calc(100% + 10px); right: 0; z-index: 600;
    min-width: 250px; padding: 8px; border-radius: var(--c-radius);
    background: var(--c-navy-800); border: 1px solid rgba(148,163,184,0.2);
    box-shadow: var(--c-shadow-lg);
    opacity: 0; visibility: hidden; transform: translateY(-8px);
    transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s;
}
.login-dropdown.is-open .login-menu,
.login-dropdown:hover .login-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.login-menu__item {
    display: flex; align-items: center; gap: 12px; padding: 11px 12px;
    border-radius: 10px; color: var(--c-slate-200);
}
.login-menu__item:hover { background: rgba(255,255,255,0.06); color: #fff; }
.login-menu__glyph { width: 34px; height: 34px; flex: none; border-radius: 9px; display: grid; place-items: center; color: #fff; }
.login-menu__glyph--sentry { background: var(--c-blue-600); }
.login-menu__glyph--indicia { background: var(--c-emerald-500); color: #04140e; }
.login-menu__item strong { display: block; color: inherit; font-size: 0.95rem; font-weight: 650; line-height: 1.2; }
.login-menu__item small { color: var(--c-slate-400); font-size: 0.78rem; }
.login-menu__item:hover small { color: var(--c-slate-300); }

.nav-toggle {
    display: none; width: 44px; height: 44px; border: 1px solid rgba(148,163,184,0.28);
    background: rgba(255,255,255,0.04); border-radius: 12px; cursor: pointer;
    align-items: center; justify-content: center; color: #fff;
}
.nav-toggle svg { width: 22px; height: 22px; }
.nav-toggle .icon-close { display: none; }
body.nav-open .nav-toggle .icon-open { display: none; }
body.nav-open .nav-toggle .icon-close { display: block; }

@media (max-width: 960px) {
    .nav-toggle { display: inline-flex; }
    /* Cap the (large) logo on small screens so the mobile header isn't huge. */
    .site-header .site-brand img.custom-logo,
    .site-header a.custom-logo-link img.custom-logo { max-height: 72px !important; }
    .site-header .primary-nav {
        position: absolute; top: 100%; left: 0; right: 0; margin-top: 0;
        background: var(--c-navy-900); border-bottom: 1px solid rgba(148,163,184,0.14);
        flex-direction: column; align-items: stretch; padding: 16px var(--c-gutter) 28px;
        gap: 4px; transform: translateY(-12px); opacity: 0; pointer-events: none;
        transition: opacity 0.2s ease, transform 0.2s ease; max-height: 80vh; overflow-y: auto;
    }
    body.nav-open .primary-nav { transform: translateY(0); opacity: 1; pointer-events: auto; }
    .primary-nav ul { flex-direction: column; align-items: stretch; gap: 2px; width: 100%; }
    .primary-nav a { padding: 14px 16px; font-size: 1.05rem; }
    .header-actions .login-dropdown { display: none; }
}
@media (max-width: 520px) {
    .header-actions .c-btn span.btn-full { display: none; }
}

/* =========================================================================
   Hero (dark)
   ========================================================================= */
.hero {
    position: relative; isolation: isolate; overflow: hidden;
    background: radial-gradient(120% 90% at 78% -10%, #16233f 0%, var(--c-navy-900) 46%, var(--c-navy-950) 100%);
    color: #e8eefb;
    padding-block: clamp(72px, 11vw, 148px) clamp(72px, 10vw, 132px);
}
.hero::before {
    content: ""; position: absolute; inset: 0; z-index: -1; opacity: 0.5;
    background-image:
        linear-gradient(rgba(96, 165, 250, 0.06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(96, 165, 250, 0.06) 1px, transparent 1px);
    background-size: 48px 48px;
    mask-image: radial-gradient(120% 80% at 50% 0%, #000 30%, transparent 78%);
    -webkit-mask-image: radial-gradient(120% 80% at 50% 0%, #000 30%, transparent 78%);
}
.hero::after {
    content: ""; position: absolute; z-index: -1; width: 620px; height: 620px; border-radius: 50%;
    top: -240px; right: -160px; pointer-events: none;
    background: radial-gradient(circle, rgba(59,130,246,0.28), transparent 62%);
    filter: blur(20px);
}
.hero__grid { display: grid; grid-template-columns: 1.05fr 0.95fr; gap: clamp(32px, 5vw, 72px); align-items: center; }
.hero__pill {
    display: inline-flex; align-items: center; gap: 10px; padding: 7px 15px 7px 12px;
    border-radius: var(--c-radius-pill); background: rgba(59,130,246,0.12);
    border: 1px solid rgba(96,165,250,0.3); color: var(--c-blue-300);
    font-size: 0.85rem; font-weight: 600; margin-bottom: 26px;
}
.hero__pill .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--c-emerald-400); box-shadow: 0 0 0 4px rgba(52,211,153,0.2); }
.hero h1 { color: #fff; margin-bottom: 22px; }
.hero h1 .accent { background: linear-gradient(90deg, var(--c-blue-400), var(--c-emerald-400)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hero__sub { font-size: 1.24rem; color: #b9c6de; max-width: 560px; margin-bottom: 32px; }
.hero .c-btn-row { margin-bottom: 34px; }
.hero__trust { display: flex; flex-wrap: wrap; gap: 10px 22px; align-items: center; color: #8ea1c2; font-size: 0.9rem; }
.hero__trust span { display: inline-flex; align-items: center; gap: 8px; }
.hero__trust svg { width: 16px; height: 16px; color: var(--c-emerald-400); }

/* Hero visual: dual-platform console card */
.hero__visual { position: relative; }
.console {
    background: linear-gradient(180deg, rgba(30,41,59,0.9), rgba(15,23,42,0.92));
    border: 1px solid rgba(148,163,184,0.18); border-radius: var(--c-radius-lg);
    box-shadow: var(--c-shadow-lg); overflow: hidden; backdrop-filter: blur(8px);
}
.console__bar { display: flex; align-items: center; gap: 8px; padding: 13px 16px; border-bottom: 1px solid rgba(148,163,184,0.14); background: rgba(15,23,42,0.6); }
.console__bar i { width: 11px; height: 11px; border-radius: 50%; background: #334155; display: block; }
.console__bar i:nth-child(1) { background: #ef4444; }
.console__bar i:nth-child(2) { background: #f59e0b; }
.console__bar i:nth-child(3) { background: #10b981; }
.console__bar span { margin-left: 8px; font-size: 0.78rem; color: #64748b; font-family: var(--c-font-mono); }
.console__body { padding: 18px; display: grid; gap: 12px; }
.console__row { display: flex; align-items: center; gap: 12px; padding: 13px 15px; border-radius: 12px; background: rgba(51,65,85,0.35); border: 1px solid rgba(148,163,184,0.1); }
.console__row .tag { font-size: 0.66rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; padding: 4px 8px; border-radius: 6px; flex: none; }
.tag--sentry { background: rgba(59,130,246,0.18); color: var(--c-blue-300); }
.tag--indicia { background: rgba(16,185,129,0.18); color: var(--c-emerald-300); }
.console__row .meta { min-width: 0; }
.console__row .meta strong { display: block; color: #e8eefb; font-size: 0.9rem; font-weight: 600; }
.console__row .meta small { color: #7c8bab; font-size: 0.78rem; }
.console__row .sev { margin-left: auto; font-size: 0.68rem; font-weight: 700; padding: 4px 9px; border-radius: var(--c-radius-pill); flex: none; }
.sev--high { background: rgba(239,68,68,0.16); color: #fca5a5; }
.sev--med { background: rgba(245,158,11,0.16); color: #fcd34d; }
.sev--ok { background: rgba(16,185,129,0.16); color: var(--c-emerald-300); }
.console__pulse { position: absolute; top: -14px; left: -14px; background: var(--c-navy-800); border: 1px solid rgba(148,163,184,0.2); border-radius: 14px; padding: 12px 16px; box-shadow: var(--c-shadow-md); display: flex; align-items: center; gap: 11px; }
.console__pulse .ring { width: 30px; height: 30px; border-radius: 50%; border: 2px solid var(--c-emerald-400); display: grid; place-items: center; color: var(--c-emerald-400); }
.console__pulse .ring svg { width: 16px; height: 16px; }
.console__pulse b { color: #fff; font-size: 0.92rem; display: block; line-height: 1.2; }
.console__pulse small { color: #7c8bab; font-size: 0.72rem; }

@media (max-width: 900px) {
    .hero__grid { grid-template-columns: 1fr; }
    .hero__visual { max-width: 520px; }
    .hero__sub { max-width: none; }
}

/* =========================================================================
   Logo / trust strip
   ========================================================================= */
.trustbar { background: var(--c-navy-900); border-bottom: 1px solid rgba(148,163,184,0.1); padding-block: 26px; }
.trustbar__inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 14px 40px; }
.trustbar p { margin: 0; color: #7c8bab; font-size: 0.82rem; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; }
.trustbar ul { list-style: none; display: flex; flex-wrap: wrap; gap: 12px 34px; margin: 0; padding: 0; }
.trustbar li { color: #cbd5e1; font-weight: 650; font-size: 0.98rem; opacity: 0.82; }

/* =========================================================================
   Stat band
   ========================================================================= */
.stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(18px, 3vw, 40px); }
.stat { text-align: center; }
.stat__num { font-size: clamp(2.2rem, 4vw, 3rem); font-weight: 800; letter-spacing: -0.03em; background: linear-gradient(90deg, var(--c-blue-600), var(--c-emerald-500)); -webkit-background-clip: text; background-clip: text; color: transparent; line-height: 1; }
.stat__label { color: var(--c-muted); font-weight: 550; margin-top: 8px; font-size: 0.98rem; }
@media (max-width: 680px) { .stats { grid-template-columns: repeat(2, 1fr); gap: 30px 20px; } }

/* =========================================================================
   Cards / features
   ========================================================================= */
.card-grid { display: grid; gap: 22px; }
.card-grid--3 { grid-template-columns: repeat(3, 1fr); }
.card-grid--2 { grid-template-columns: repeat(2, 1fr); }
.card-grid--4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 960px) { .card-grid--3, .card-grid--4 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 620px) { .card-grid--2, .card-grid--3, .card-grid--4 { grid-template-columns: 1fr; } }

.feature {
    background: #fff; border: 1px solid var(--c-line); border-radius: var(--c-radius);
    padding: 28px; transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}
.feature:hover { transform: translateY(-4px); box-shadow: var(--c-shadow-md); border-color: var(--c-slate-300); }
.feature__icon {
    width: 48px; height: 48px; border-radius: 12px; display: grid; place-items: center; margin-bottom: 18px;
    background: linear-gradient(135deg, rgba(59,130,246,0.14), rgba(59,130,246,0.06)); color: var(--c-blue-600);
}
.feature__icon svg { width: 24px; height: 24px; }
.feature--emerald .feature__icon { background: linear-gradient(135deg, rgba(16,185,129,0.16), rgba(16,185,129,0.06)); color: var(--c-emerald-600); }
.feature--purple .feature__icon { background: linear-gradient(135deg, rgba(139,92,246,0.16), rgba(139,92,246,0.06)); color: var(--c-purple-500); }
.feature--amber .feature__icon { background: linear-gradient(135deg, rgba(245,158,11,0.16), rgba(245,158,11,0.06)); color: var(--c-amber-500); }
.feature h3 { font-size: 1.24rem; margin-bottom: 8px; }
.feature p { margin: 0; color: var(--c-muted); font-size: 0.98rem; }

/* =========================================================================
   Product split sections
   ========================================================================= */
.product { position: relative; overflow: hidden; }
.product--dark { background: var(--c-navy-900); color: #d7e0f2; }
.product--dark h2, .product--dark h3, .product--dark h4 { color: #fff; }
.product__grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(36px, 5vw, 72px); align-items: center; }
.product__grid.is-reverse .product__media { order: -1; }
@media (max-width: 900px) { .product__grid { grid-template-columns: 1fr; } .product__grid.is-reverse .product__media { order: 0; } }

.product__badge {
    display: inline-flex; align-items: center; gap: 10px; padding: 8px 16px 8px 10px;
    border-radius: var(--c-radius-pill); font-weight: 700; font-size: 0.95rem; margin-bottom: 20px;
}
.product__badge .glyph { width: 26px; height: 26px; border-radius: 8px; display: grid; place-items: center; color: #fff; }
.badge--sentry { background: rgba(59,130,246,0.14); color: var(--c-blue-300); border: 1px solid rgba(96,165,250,0.3); }
.badge--sentry .glyph { background: var(--c-blue-600); }
.badge--indicia { background: rgba(16,185,129,0.12); color: var(--c-emerald-600); border: 1px solid rgba(16,185,129,0.3); }
.badge--indicia .glyph { background: var(--c-emerald-500); }
.product--dark .badge--indicia { color: var(--c-emerald-300); }

.checklist { list-style: none; margin: 24px 0 30px; padding: 0; display: grid; gap: 14px; }
.checklist li { display: flex; gap: 13px; align-items: flex-start; }
.checklist .tick { flex: none; width: 24px; height: 24px; border-radius: 7px; display: grid; place-items: center; margin-top: 1px; background: rgba(59,130,246,0.12); color: var(--c-blue-600); }
.checklist .tick svg { width: 15px; height: 15px; }
.checklist--emerald .tick { background: rgba(16,185,129,0.14); color: var(--c-emerald-600); }
.product--dark .checklist .tick { background: rgba(96,165,250,0.16); color: var(--c-blue-300); }
.checklist li strong { display: block; margin-bottom: 1px; }
.checklist li span { color: inherit; opacity: 0.82; font-size: 0.96rem; }

.product__media { position: relative; }
.panel {
    background: #fff; border: 1px solid var(--c-line); border-radius: var(--c-radius-lg);
    box-shadow: var(--c-shadow-lg); overflow: hidden;
}
.product--dark .panel { background: rgba(15,23,42,0.7); border-color: rgba(148,163,184,0.18); backdrop-filter: blur(6px); }
.panel__head { padding: 16px 20px; border-bottom: 1px solid var(--c-line); display: flex; align-items: center; justify-content: space-between; }
.product--dark .panel__head { border-color: rgba(148,163,184,0.14); }
.panel__head h4 { margin: 0; font-size: 0.98rem; }
.panel__head .live { display: inline-flex; align-items: center; gap: 7px; font-size: 0.76rem; font-weight: 700; color: var(--c-emerald-600); }
.panel__head .live .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--c-emerald-500); animation: pulse 2s ease-in-out infinite; }
@keyframes pulse { 0%,100% { opacity: 1; } 50% { opacity: 0.35; } }
.panel__body { padding: 18px 20px; display: grid; gap: 12px; }

.feed-item { display: flex; gap: 13px; align-items: flex-start; padding-bottom: 12px; border-bottom: 1px dashed var(--c-line); }
.product--dark .feed-item { border-color: rgba(148,163,184,0.14); }
.feed-item:last-child { border-bottom: 0; padding-bottom: 0; }
.feed-item__dot { width: 10px; height: 10px; border-radius: 50%; margin-top: 6px; flex: none; }
.dot-blue { background: var(--c-blue-500); } .dot-red { background: var(--c-red-500); } .dot-amber { background: var(--c-amber-500); } .dot-emerald { background: var(--c-emerald-500); }
.feed-item__body { min-width: 0; flex: 1; }
.feed-item__body strong { display: block; font-size: 0.92rem; }
.feed-item__body small { color: var(--c-muted); font-size: 0.8rem; }
.product--dark .feed-item__body small { color: #7c8bab; }
.chip { margin-left: auto; font-size: 0.66rem; font-weight: 700; padding: 4px 9px; border-radius: var(--c-radius-pill); flex: none; text-transform: uppercase; letter-spacing: 0.04em; }
.chip-red { background: rgba(239,68,68,0.14); color: #dc2626; }
.chip-amber { background: rgba(245,158,11,0.16); color: #b45309; }
.chip-emerald { background: rgba(16,185,129,0.14); color: var(--c-emerald-600); }
.chip-blue { background: rgba(59,130,246,0.14); color: var(--c-blue-700); }
.product--dark .chip-red { color: #fca5a5; } .product--dark .chip-amber { color: #fcd34d; } .product--dark .chip-emerald { color: var(--c-emerald-300); } .product--dark .chip-blue { color: var(--c-blue-300); }

/* Screening result card (Indicia) */
.screen-card { display: grid; gap: 14px; }
.screen-row { display: flex; align-items: center; gap: 12px; }
.screen-row .label { flex: 1; font-size: 0.92rem; font-weight: 550; }
.screen-row .bar { flex: 1.4; height: 8px; border-radius: 999px; background: rgba(148,163,184,0.2); overflow: hidden; }
.screen-row .bar i { display: block; height: 100%; border-radius: 999px; background: var(--c-emerald-500); }
.screen-row .status { font-size: 0.72rem; font-weight: 700; padding: 4px 10px; border-radius: 999px; }
.status-pass { background: rgba(16,185,129,0.14); color: var(--c-emerald-600); }
.status-review { background: rgba(245,158,11,0.16); color: #b45309; }

/* =========================================================================
   Comparison table
   ========================================================================= */
.compare { overflow-x: auto; border-radius: var(--c-radius-lg); border: 1px solid var(--c-line); box-shadow: var(--c-shadow-md); }
.compare table { width: 100%; border-collapse: collapse; min-width: 640px; background: #fff; }
.compare th, .compare td { padding: 18px 22px; text-align: left; border-bottom: 1px solid var(--c-line); vertical-align: top; }
.compare thead th { font-size: 0.95rem; }
.compare thead th:first-child { color: var(--c-muted); font-weight: 600; }
.compare thead .col-sentry { color: var(--c-blue-700); }
.compare thead .col-indicia { color: var(--c-emerald-600); }
.compare thead .col-sentry, .compare thead .col-indicia { border-top: 3px solid currentColor; }
.compare tbody th { font-weight: 700; color: var(--c-ink); width: 22%; }
.compare tbody td { color: var(--c-body); font-size: 0.98rem; }
.compare tr:last-child th, .compare tr:last-child td { border-bottom: 0; }
.compare tbody tr:hover td, .compare tbody tr:hover th { background: var(--c-slate-50); }

/* =========================================================================
   "Better together" band (dark)
   ========================================================================= */
.together { background: linear-gradient(140deg, var(--c-navy-800), var(--c-navy-950)); color: #d7e0f2; position: relative; overflow: hidden; }
.together::before { content:""; position:absolute; inset:0; background: radial-gradient(80% 60% at 20% 0%, rgba(59,130,246,0.16), transparent 60%), radial-gradient(70% 60% at 90% 100%, rgba(16,185,129,0.14), transparent 60%); z-index:0; }
.together > * { position: relative; z-index: 1; }
.together h2, .together h3, .together h4 { color: #fff; }
.together__flow { display: grid; grid-template-columns: 1fr auto 1fr; gap: 20px; align-items: center; margin-top: 46px; }
.flow-card { background: rgba(15,23,42,0.6); border: 1px solid rgba(148,163,184,0.18); border-radius: var(--c-radius); padding: 26px; backdrop-filter: blur(6px); }
.flow-card h3 { display: flex; align-items: center; gap: 10px; font-size: 1.2rem; }
.flow-card .glyph { width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; color:#fff; flex:none; }
.flow-card--sentry .glyph { background: var(--c-blue-600); } .flow-card--indicia .glyph { background: var(--c-emerald-500); }
.flow-card p { color: #9fb0cd; font-size: 0.96rem; margin: 0; }
.flow-merge { width: 58px; height: 58px; border-radius: 50%; display: grid; place-items: center; background: linear-gradient(135deg, var(--c-blue-600), var(--c-emerald-500)); color:#fff; box-shadow: 0 10px 30px rgba(59,130,246,0.4); flex:none; }
.flow-merge svg { width: 26px; height: 26px; }
@media (max-width: 820px) { .together__flow { grid-template-columns: 1fr; } .flow-merge { transform: rotate(90deg); margin: 0 auto; } }

/* =========================================================================
   Sectors / who we serve
   ========================================================================= */
.sector { display: block; background: #fff; border: 1px solid var(--c-line); border-radius: var(--c-radius); padding: 26px; transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease; }
.sector:hover { transform: translateY(-4px); box-shadow: var(--c-shadow-md); border-color: var(--c-slate-300); color: inherit; }
.sector__icon { width: 44px; height: 44px; border-radius: 11px; display: grid; place-items: center; margin-bottom: 16px; background: var(--c-navy-800); color: var(--c-blue-300); }
.sector__icon svg { width: 22px; height: 22px; }
.sector h3 { font-size: 1.16rem; margin-bottom: 6px; }
.sector p { margin: 0; color: var(--c-muted); font-size: 0.95rem; }

/* =========================================================================
   Value props / why
   ========================================================================= */
.why-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
@media (max-width: 900px) { .why-grid { grid-template-columns: 1fr; } }
.why { display: flex; gap: 16px; align-items: flex-start; padding: 22px; border-radius: var(--c-radius); background: var(--c-slate-50); border: 1px solid var(--c-line); }
.why .num { flex: none; width: 40px; height: 40px; border-radius: 11px; display: grid; place-items: center; background: #fff; border: 1px solid var(--c-line); font-weight: 800; color: var(--c-blue-600); box-shadow: var(--c-shadow-sm); }
.why h3 { font-size: 1.1rem; margin-bottom: 5px; }
.why p { margin: 0; color: var(--c-muted); font-size: 0.94rem; }

/* Steps */
.steps { counter-reset: step; display: grid; grid-template-columns: repeat(5, 1fr); gap: 18px; }
@media (max-width: 940px) { .steps { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .steps { grid-template-columns: 1fr; } }
.step { position: relative; padding: 24px 20px; border-radius: var(--c-radius); background: #fff; border: 1px solid var(--c-line); }
.step__n { width: 34px; height: 34px; border-radius: 50%; background: var(--c-blue-600); color: #fff; font-weight: 700; display: grid; place-items: center; margin-bottom: 14px; }
.step h3 { font-size: 1.06rem; margin-bottom: 5px; }
.step p { margin: 0; color: var(--c-muted); font-size: 0.92rem; }

/* =========================================================================
   CTA band
   ========================================================================= */
.cta {
    background: radial-gradient(120% 120% at 50% -20%, #16233f, var(--c-navy-900) 55%, var(--c-navy-950));
    color: #fff; text-align: center; border-radius: var(--c-radius-lg); padding: clamp(44px, 7vw, 84px) var(--c-gutter);
    position: relative; overflow: hidden;
}
.cta::before { content:""; position:absolute; inset:0; background-image: linear-gradient(rgba(96,165,250,0.06) 1px, transparent 1px), linear-gradient(90deg, rgba(96,165,250,0.06) 1px, transparent 1px); background-size: 40px 40px; mask-image: radial-gradient(70% 70% at 50% 0%, #000, transparent 75%); -webkit-mask-image: radial-gradient(70% 70% at 50% 0%, #000, transparent 75%); }
.cta > * { position: relative; }
.cta h2 { color: #fff; }
.cta p { color: #b9c6de; font-size: 1.16rem; max-width: 620px; margin: 0 auto 30px; }
.cta .c-btn-row { justify-content: center; }
.cta-wrap { padding-block: var(--c-section-y); }

/* =========================================================================
   Page hero (interior pages)
   ========================================================================= */
.page-hero { background: radial-gradient(120% 100% at 80% -30%, #16233f, var(--c-navy-900) 55%, var(--c-navy-950)); color:#e8eefb; padding-block: clamp(72px, 10vw, 120px) clamp(56px, 7vw, 88px); position: relative; overflow: hidden; }
.page-hero::before { content:""; position:absolute; inset:0; opacity:0.4; background-image: linear-gradient(rgba(96,165,250,0.06) 1px, transparent 1px), linear-gradient(90deg, rgba(96,165,250,0.06) 1px, transparent 1px); background-size: 46px 46px; mask-image: radial-gradient(100% 70% at 50% 0%, #000, transparent 78%); -webkit-mask-image: radial-gradient(100% 70% at 50% 0%, #000, transparent 78%); }
.page-hero > * { position: relative; }
.page-hero h1 { color: #fff !important; font-size: clamp(1.5rem, 2.4vw, 2.1rem) !important; line-height: 1.15 !important; }
.page-hero p { color: #b9c6de; font-size: 1.12rem; max-width: 640px; margin: 0; }
.page-hero .c-eyebrow { color: var(--c-blue-300); }

/* Breadcrumb */
.crumb { display: flex; gap: 8px; align-items: center; color: #7c8bab; font-size: 0.85rem; margin-bottom: 18px; }
.crumb a { color: #9fb0cd; } .crumb a:hover { color: #fff; }

/* =========================================================================
   Generic content (pages & posts)
   ========================================================================= */
.entry-content { font-size: 1.06rem; }
.entry-content > * { margin-bottom: 1.15em; }
.entry-content h2 { margin-top: 1.6em; }
.entry-content h3 { margin-top: 1.4em; }
.entry-content img, .entry-content .wp-block-image { border-radius: var(--c-radius); }
.entry-content blockquote { margin: 1.6em 0; padding: 6px 0 6px 24px; border-left: 4px solid var(--c-blue-500); color: var(--c-slate-600); font-size: 1.15rem; font-style: italic; }
.entry-content table { width: 100%; border-collapse: collapse; }
.entry-content th, .entry-content td { padding: 12px 14px; border: 1px solid var(--c-line); text-align: left; }
.entry-content code { background: var(--c-slate-100); padding: 2px 6px; border-radius: 6px; font-size: 0.9em; font-family: var(--c-font-mono); }
.entry-content pre { background: var(--c-navy-900); color: #e2e8f0; padding: 18px; border-radius: var(--c-radius); overflow-x: auto; }
.alignwide { width: min(100%, 1080px); margin-inline: auto; }
.alignfull { width: 100%; }
.aligncenter { margin-inline: auto; }

/* Posts list */
.post-card { background: #fff; border: 1px solid var(--c-line); border-radius: var(--c-radius); overflow: hidden; transition: transform 0.2s ease, box-shadow 0.2s ease; display: flex; flex-direction: column; }
.post-card:hover { transform: translateY(-4px); box-shadow: var(--c-shadow-md); }
.post-card__thumb { aspect-ratio: 16/9; overflow: hidden; background: var(--c-slate-100); }
.post-card__thumb img { width: 100%; height: 100%; object-fit: cover; }
.post-card__body { padding: 22px; flex: 1; display: flex; flex-direction: column; }
.post-card__meta { font-size: 0.8rem; color: var(--c-muted); margin-bottom: 8px; text-transform: uppercase; letter-spacing: 0.06em; font-weight: 600; }
.post-card h3 { font-size: 1.2rem; margin-bottom: 8px; }
.post-card h3 a { color: var(--c-ink); } .post-card h3 a:hover { color: var(--c-blue-600); }
.post-card p { color: var(--c-muted); font-size: 0.96rem; margin: 0 0 16px; }
.post-card .readmore { margin-top: auto; font-weight: 650; color: var(--c-blue-600); display: inline-flex; align-items: center; gap: 6px; }

.pagination { display: flex; gap: 8px; justify-content: center; margin-top: 48px; flex-wrap: wrap; }
.pagination .page-numbers { display: grid; place-items: center; min-width: 44px; height: 44px; padding: 0 12px; border-radius: 12px; border: 1px solid var(--c-line); color: var(--c-slate-600); font-weight: 600; background: #fff; }
.pagination .page-numbers.current { background: var(--c-blue-600); color: #fff; border-color: var(--c-blue-600); }
.pagination a.page-numbers:hover { border-color: var(--c-blue-400); color: var(--c-blue-600); }

/* Contact form */
.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 5vw, 60px); align-items: start; }
@media (max-width: 860px) { .contact-grid { grid-template-columns: 1fr; } }
.contact-info .contact-point { display: flex; gap: 14px; align-items: flex-start; margin-bottom: 22px; }
.contact-info .contact-point .ic { width: 42px; height: 42px; border-radius: 11px; background: var(--c-slate-50); border: 1px solid var(--c-line); display: grid; place-items: center; color: var(--c-blue-600); flex: none; }
.contact-info .contact-point h4 { margin: 0 0 2px; font-size: 1.02rem; }
.contact-info .contact-point p { margin: 0; color: var(--c-muted); font-size: 0.96rem; }
.contact-form { background: #fff; border: 1px solid var(--c-line); border-radius: var(--c-radius-lg); padding: clamp(24px, 4vw, 40px); box-shadow: var(--c-shadow-md); }
.form-field { margin-bottom: 18px; }
.form-field label { display: block; font-weight: 600; font-size: 0.92rem; margin-bottom: 7px; color: var(--c-ink); }
.form-field input, .form-field select, .form-field textarea {
    width: 100%; padding: 13px 15px; border: 1px solid var(--c-slate-300); border-radius: 11px;
    font-family: inherit; font-size: 1rem; color: var(--c-ink); background: #fff; transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.form-field input:focus, .form-field select:focus, .form-field textarea:focus { outline: none; border-color: var(--c-blue-500); box-shadow: 0 0 0 3px rgba(59,130,246,0.16); }
.form-field textarea { min-height: 130px; resize: vertical; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 520px) { .form-row { grid-template-columns: 1fr; } }
.form-note { font-size: 0.82rem; color: var(--c-muted); margin-top: 4px; }

/* FAQ */
.faq { max-width: 820px; margin-inline: auto; display: grid; gap: 12px; }
.faq details { background: #fff; border: 1px solid var(--c-line); border-radius: var(--c-radius); padding: 4px 22px; transition: box-shadow 0.2s ease; }
.faq details[open] { box-shadow: var(--c-shadow-sm); }
.faq summary { cursor: pointer; padding: 18px 0; font-weight: 650; font-size: 1.08rem; color: var(--c-ink); list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; font-size: 1.5rem; color: var(--c-blue-500); font-weight: 400; line-height: 1; transition: transform 0.2s ease; }
.faq details[open] summary::after { transform: rotate(45deg); }
.faq details p { margin: 0 0 18px; color: var(--c-muted); }

/* =========================================================================
   Footer
   ========================================================================= */
.site-footer { background: var(--c-navy-950); color: #9fb0cd; padding-block: clamp(56px, 7vw, 84px) 0; }
.footer-top { display: grid; grid-template-columns: 1.4fr repeat(3, 1fr); gap: 40px; padding-bottom: 48px; border-bottom: 1px solid rgba(148,163,184,0.12); }
@media (max-width: 900px) { .footer-top { grid-template-columns: 1fr 1fr; gap: 32px; } }
@media (max-width: 560px) { .footer-top { grid-template-columns: 1fr; } }
.footer-brand .site-brand { margin-bottom: 16px; }
.footer-brand p { color: #7c8bab; font-size: 0.95rem; max-width: 320px; }
.footer-col h4 { color: #fff; font-size: 0.82rem; text-transform: uppercase; letter-spacing: 0.12em; margin-bottom: 16px; }
.footer-col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 11px; }
.footer-col a { color: #9fb0cd; font-size: 0.96rem; } .footer-col a:hover { color: #fff; }
.footer-bottom { display: flex; flex-wrap: wrap; gap: 14px; justify-content: space-between; align-items: center; padding-block: 26px; font-size: 0.9rem; color: #7c8bab; }
.footer-bottom .socials { display: flex; gap: 10px; }
.footer-bottom .socials a { width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center; background: rgba(255,255,255,0.05); color: #cbd5e1; }
.footer-bottom .socials a:hover { background: rgba(255,255,255,0.12); color: #fff; }
.footer-bottom .socials svg { width: 18px; height: 18px; }

/* =========================================================================
   WP admin bar offset + misc
   ========================================================================= */
.admin-bar .site-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .site-header { top: 46px; } }
.wp-block-button__link { border-radius: var(--c-radius-pill); }
.is-style-outline .wp-block-button__link { border-radius: var(--c-radius-pill); }

/* Reveal-on-scroll (progressive enhancement; visible by default without JS) */
.reveal { opacity: 1; }
.js .reveal { opacity: 0; transform: translateY(18px); transition: opacity 0.6s ease, transform 0.6s ease; }
.js .reveal.is-visible { opacity: 1; transform: none; }

/* =========================================================================
   Page-builder compatibility
   The theme owns its header/footer and its own template markup — but it must
   NOT restyle content built with Elementor (the rest of this site). Neutralise
   the base typography colour overrides inside .elementor so every section keeps
   the colours it was designed with. Without this, the theme's dark heading
   colour lands on Elementor's dark sections and the text disappears.
   `:where()` keeps specificity at zero-ish so Elementor's own colours still win.
   ========================================================================= */
.elementor :where(h1, h2, h3, h4, h5, h6) { color: inherit; }
.elementor :where(a) { color: inherit; }
.elementor :where(a):hover { color: inherit; }
.elementor :where(strong, b) { color: inherit; }
.elementor :where(ul, ol) { padding-left: revert; margin: revert; list-style: revert; }
.elementor :where(p) { margin: revert; }

/* Contact Form 7 (and other bare plugin forms) — the previous theme styled
   these; give them a clean look so existing pages don't fall back to tiny
   browser-default inputs. Scoped to .wpcf7 / .elementor so it never touches the
   theme's own .form-field styling. */
.wpcf7 input:not([type="submit"]):not([type="button"]):not([type="checkbox"]):not([type="radio"]),
.wpcf7 select,
.wpcf7 textarea,
.elementor .wpcf7 input:not([type="submit"]),
.elementor .wpcf7 select,
.elementor .wpcf7 textarea {
	width: 100%;
	max-width: 560px;
	padding: 12px 15px;
	margin-bottom: 10px;
	border: 1px solid var(--c-slate-300);
	border-radius: 10px;
	font-size: 1rem;
	font-family: inherit;
	background: #fff;
	color: var(--c-ink);
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.wpcf7 input:focus, .wpcf7 select:focus, .wpcf7 textarea:focus {
	outline: none;
	border-color: var(--c-blue-500);
	box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.16);
}
.wpcf7 textarea { min-height: 140px; resize: vertical; }
.wpcf7 input[type="submit"],
.wpcf7 button[type="submit"],
.wpcf7 .default-btn {
	display: inline-flex; align-items: center; justify-content: center;
	background: var(--c-blue-600); color: #fff; border: 0;
	padding: 14px 30px; border-radius: var(--c-radius-pill);
	font-weight: 650; font-size: 1rem; cursor: pointer;
	box-shadow: var(--c-shadow-blue);
	transition: background 0.2s ease, transform 0.15s ease;
}
.wpcf7 input[type="submit"]:hover,
.wpcf7 button[type="submit"]:hover,
.wpcf7 .default-btn:hover { background: var(--c-blue-700); transform: translateY(-2px); }