/* Base (CSS variables + resets) */
/* Fonts: Inter fro  --gradient-hero: linear-gradient(120deg,rgba(13,30,62,.85),rgba(24,41,79,.65) 55%,rgba(46,69,118,.55));
  --hero-img:url('/img/header_one.jpg');
  --focus-ring: 0 0 0 2px #fff,0 0 0 4px rgba(var(--color-brand-rgb),.75);
  --ease-fast: cubic-bezier(.4,0,.3,1);
}gle Fonts CDN */

/* Fallback font metric overrides for CLS prevention */
@font-face {
  font-family: 'Inter Fallback';
  src: local('system-ui'), local('-apple-system'), local('BlinkMacSystemFont');
  size-adjust: 107%;
  ascent-override: 90%;
  descent-override: 22%;
  line-gap-override: 0%;
}

/* Optional metrics override for better fallback alignment */
@supports (font-size-adjust: 0.5) {
  body { font-size-adjust: 0.5; }
}

:root {
  --color-brand: #4968ba; /* primary blue (from logo) */
  --color-brand-rgb: 73 104 186;
  --color-brand-alt: #3d57a8;
  --color-accent: #f5c133; /* yellow */
  --color-accent-alt: #e9b01b;
  --color-bg: #ffffff;
  --color-bg-alt: #f5f7fb;
  --color-bg-soft: #eef2f9;
  --color-text: #3d4044; /* neutral grey from logo text */
  --color-text-muted: #6a737d;
  --color-border: #d7dee6;
  --color-border-strong: #b9c4d1;
  --color-success: #0f8d51;
  --color-danger: #c3323a;
  --color-warning: #b46b07;
  --radius-xs: 3px;
  --radius-sm: 5px;
  --radius-md: 10px;
  --radius-lg: 18px;
  --shadow-sm: 0 1px 2px rgba(0,0,0,.05), 0 1px 3px rgba(0,0,0,.08);
  --shadow-md: 0 4px 10px -2px rgba(0,0,0,.12), 0 6px 16px -4px rgba(0,0,0,.10);
  --shadow-lg: 0 18px 45px -10px rgba(0,0,0,.20), 0 8px 22px -8px rgba(0,0,0,.12);
  --font-sans: 'Inter', 'Inter Fallback', system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;
  --max-w: 1240px;
  --ease: cubic-bezier(.4,0,.2,1);
  --transition: 160ms var(--ease);
  --header-h: 62px; /* header height for mobile panel calculations */
  --carousel-arrow-space: 2.3rem; /* keep text clear of overlay arrows on small screens */
}

/* === Enhanced Design System: color tokens & dark mode === */
:root {
  --color-surface-1:#ffffff; /* base */
  --color-surface-2:#f5f7fb;
  --color-surface-3:#eef2f9;
  --color-border-soft:#e2e8f0;
  --color-border-strong:#b8c3d2;
  --gradient-hero: linear-gradient(120deg,rgba(13,30,62,.85),rgba(24,41,79,.65) 55%,rgba(46,69,118,.55));
  --hero-img:url('/img/header_one.jpg');
  --focus-ring: 0 0 0 2px #fff,0 0 0 4px rgba(var(--color-brand-rgb)/.75);
  --ease-fast: cubic-bezier(.4,0,.3,1);
}
:root[data-theme="dark"], body[data-theme="dark"] {
  color-scheme: dark;
  --color-bg:#0d121a;
  --color-bg-alt:#141c26;
  --color-bg-soft:#1d2733;
  --color-text:#d5dde7;
  --color-text-muted:#8b99aa;
  --color-surface-1:#141c26;
  --color-surface-2:#1d2733;
  --color-surface-3:#233041;
  --color-border:#293646;
  --color-border-soft:#24313f;
  --color-border-strong:#37495d;
  /* Fallback then modern color-mix for smoother stops */
  --grad-brand: linear-gradient(95deg,#556fbd 0%, #4968ba 50%, #556fbd 100%);
  --grad-brand: linear-gradient(95deg, color-mix(in lab, var(--color-brand), white 12%) 0%, var(--color-brand) 50%, color-mix(in lab, var(--color-brand), white 12%) 100%);
  --grad-accent: linear-gradient(130deg,#ffc94d 0%, #ffd66a 60%, #ffbe2d 100%);
  --gradient-hero: linear-gradient(90deg,rgba(8,14,23,.85),rgba(20,30,48,.8) 55%,rgba(30,44,66,.7));
  --focus-ring: 0 0 0 2px #0d121a,0 0 0 4px rgba(var(--color-brand-rgb)/.8);
  --gradient-soft: radial-gradient(circle at 22% 18%,rgba(90,139,255,.18),transparent 60%), radial-gradient(circle at 82% 72%,rgba(255,200,70,.18),transparent 55%);
}

/* Brand utility tokens */
:root {
  /* Fallback then modern color-mix for smoother, brand-consistent gradient */
  --grad-brand: linear-gradient(95deg,#556fbd 0%, #4968ba 50%, #556fbd 100%);
  --grad-brand: linear-gradient(95deg, color-mix(in lab, var(--color-brand), white 12%) 0%, var(--color-brand) 50%, color-mix(in lab, var(--color-brand), white 12%) 100%);
  /* Deeper variant used for hero emphasis without washing out */
  --grad-brand-deep: linear-gradient(100deg,#3a4f98 0%, #415ca6 50%, #3a4f98 100%);
  --grad-brand-deep: linear-gradient(100deg,
    color-mix(in lab, var(--color-brand), black 22%) 0%,
    color-mix(in lab, var(--color-brand), black 8%) 50%,
    color-mix(in lab, var(--color-brand), black 22%) 100%
  );
  --grad-accent: linear-gradient(130deg,var(--color-accent) 0%, #ffd66a 60%, var(--color-accent-alt) 100%);
  --ring-brand: 0 0 0 2px rgba(var(--color-brand-rgb)/.25),0 0 0 4px rgba(var(--color-brand-rgb)/.15);
}

/* Reset & base remain ... */
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin:0; font-family: var(--font-sans, 'Inter', system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif); font-weight: 500; line-height:1.55; background: var(--color-bg); color: var(--color-text); -webkit-font-smoothing: antialiased; }
/* Prevent page scroll when mobile nav is open */
body.nav-open { overflow: hidden; touch-action: none; }
img { max-width:100%; height:auto; display:block; }
svg { display:block; }
a { color: var(--color-brand); text-decoration:none; transition: color var(--transition); }
a:hover,a:focus { color: #3d57a8; color: color-mix(in lab, var(--color-brand), black 18%); }
button { font-family: inherit; cursor: pointer; }
:focus-visible { outline:2px solid var(--color-brand); outline-offset:2px; }

/* Layout Utilities */
.wrapper { width:100%; margin-inline:auto; max-width: var(--max-w); padding-inline: clamp(1rem,3vw,2rem); }
.grid { display:grid; gap: clamp(1rem,2.2vw,2rem); }
.flex { display:flex; }
.center { align-items:center; justify-content:center; }
.stack > * + * { margin-top: var(--stack-gap,1rem); }

/* Typography scale (fluid) */
:root { --fs-xs:.75rem; --fs-sm:.875rem; --fs-base:clamp(.95rem,1.6vw,1.05rem); --fs-md:clamp(1.05rem,1.8vw,1.15rem); --fs-lg:clamp(1.3rem,2.2vw,1.55rem); --fs-xl:clamp(1.7rem,3vw,2.2rem); --fs-2xl:clamp(2.1rem,4.2vw,2.85rem); --font-serif:'Montserrat', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; }
/* Headings use serif across the site */
h1, h2, h3, h4, h5, h6 { font-family: var(--font-serif); font-weight: 600; }
.h1 { font-family: var(--font-serif); font-size: var(--fs-2xl); line-height:1.07; letter-spacing:-.015em; font-weight:600; }
.h2 { font-family: var(--font-serif); font-size: var(--fs-xl); line-height:1.16; font-weight:600; }
.h3 { font-size: var(--fs-lg); font-weight:600; }
.lead { font-size: var(--fs-md); color: var(--color-text-muted); max-width: 58ch; }
.text-muted { color: var(--color-text-muted); }

/* Typography refinements */
:root { --tracking-tight:-.02em; }
.h1,.h2,.h3 { letter-spacing:var(--tracking-tight); }
body { font-feature-settings: "liga" 1,"kern" 1; }

/* Components */
.header { position: sticky; top:0; z-index:50; background:rgba(255,255,255,.92); backdrop-filter:saturate(180%) blur(20px); border-bottom:1px solid var(--color-border); transition: all 280ms var(--ease); }
.header.scrolled { 
  background: linear-gradient(135deg, rgba(255,255,255,.95) 0%, rgba(245,247,251,.92) 50%, rgba(238,242,249,.88) 100%); 
  backdrop-filter: saturate(180%) blur(24px); 
  border-bottom:1px solid rgba(var(--color-brand-rgb),.12); 
  box-shadow: 0 8px 32px -8px rgba(73,104,186,.08); 
}
.navbar { display:flex; align-items:center; justify-content:space-between; min-height:62px; }
.navbar a.logo { font-weight:600; font-size:1.05rem; gap:.75rem; letter-spacing:.5px; }
.navbar a.logo img { height:40px; width:auto; display:block; }
.nav-links { display:flex; gap:1.2rem; align-items:center; }
.nav-links a, .nav-links .menu-trigger { font-family: var(--font-serif); font-size:.8rem; font-weight:600; text-transform:uppercase; letter-spacing:.6px; padding:.65rem .7rem; position:relative; background:none; border:0; color: inherit; }
.nav-links a:after { content:""; position:absolute; left:0; bottom:.35rem; height:2px; width:0; background:var(--color-brand); transition:width var(--transition); border-radius:2px; }
.nav-links a:hover:after, .nav-links a:focus-visible:after { width:100%; }
.mobile-toggle { display:none; }
/* Mobile hamburger icon with good contrast */
.mobile-toggle {
  position: relative;
  width: 40px; height: 40px;
  border-radius: 10px;
  border: 1px solid var(--color-border);
  background: #fff;
  color: var(--color-text);
  align-items: center; justify-content: center;
  box-shadow: var(--shadow-sm);
  z-index: 80;
}
.mobile-toggle span,
.mobile-toggle::before,
.mobile-toggle::after {
  content: "";
  position: absolute;
  left: 50%; top: 50%;
  width: 20px; height: 2px;
  background: currentColor;
  border-radius: 2px;
  transition: transform 220ms var(--ease-fast), opacity 180ms var(--ease-fast);
}
.mobile-toggle span { transform: translate(-50%, -50%); }
.mobile-toggle::before { transform: translate(-50%, -50%) translateY(-6px); }
.mobile-toggle::after { transform: translate(-50%, -50%) translateY(6px); }
.mobile-toggle[aria-expanded="true"] span { opacity: 0; }
.mobile-toggle[aria-expanded="true"]::before { transform: translate(-50%, -50%) rotate(45deg); }
.mobile-toggle[aria-expanded="true"]::after { transform: translate(-50%, -50%) rotate(-45deg); }

/* Dropdown menu */
.nav-links .menu-item { position:relative; }
.nav-links .menu-trigger { border-radius:8px; }
.nav-links .menu-trigger:before { content:""; position:absolute; inset:0; background: linear-gradient(120deg,rgba(var(--color-brand-rgb)/.12),rgba(245,193,51,.15)); opacity:0; transform: scale(.92); border-radius:8px; transition: var(--transition); z-index:-1; }
.nav-links .menu-trigger:hover:before, .nav-links .menu-trigger:focus-visible:before { opacity:1; transform:scale(1); }
.submenu { position:absolute; top:100%; left:0; min-width: 220px; background: #fff; border:1px solid var(--color-border); border-radius:12px; box-shadow: 0 10px 30px -12px rgba(0,0,0,.18); padding:.8rem 0 .3rem; display:none; z-index:60; }
.submenu:before { content:""; position:absolute; left:0; right:0; top:-8px; height:8px; }
.menu-item.open > .submenu { display:block; }
.submenu li { list-style:none; }
.submenu a[role="menuitem"] { display:block; padding:.55rem .85rem; font-size:.78rem; text-transform:none; letter-spacing:.2px; color: var(--color-text); }
.submenu a[role="menuitem"]:hover { background: var(--color-bg-alt); }

/* Hover/focus open on desktop */
@media (hover:hover) and (pointer:fine){
  .nav-links .menu-item:hover > .submenu,
  .nav-links .menu-item:focus-within > .submenu { display:block; }
}

/* Dark mode submenu */
body[data-theme="dark"] .submenu { background:#151e2b; border-color:#2a3847; box-shadow:0 14px 34px -14px rgba(0,0,0,.7); }
body[data-theme="dark"] .submenu a[role="menuitem"] { color:#d5dde7; }
body[data-theme="dark"] .submenu a[role="menuitem"]:hover { background:#1b2633; }

.cta-btn { --btn-bg: var(--color-brand); --btn-color:#fff; font-weight:600; font-size:.8rem; letter-spacing:.5px; padding:.8rem 1.2rem; border-radius: var(--radius-md); background:var(--btn-bg); color:var(--btn-color); box-shadow: var(--shadow-sm); border:1px solid var(--color-brand); text-transform:uppercase; }
.cta-btn:hover { background:#fff; color: var(--color-brand); box-shadow: var(--shadow-md); }
.btn-outline { --btn-bg: #fff; --btn-color: var(--color-brand); border:1px solid var(--color-brand); }
.btn-outline:hover { background: white; color:var(--color-brand); }
.btn-accent { background: var(--grad-accent); border:1px solid var(--color-accent-alt); color:#3f3200; }
.btn-accent:hover { filter:brightness(1.05); }
.btn-invert { background:#fff; color: var(--color-brand); border-color: var(--color-brand); }
.btn-invert:hover { background:var(--color-brand); color: white; }

/* Hero redesign */
.hero { padding: clamp(3.5rem,7vw,7rem) 0 clamp(3rem,6vw,4.5rem); position:relative; overflow:hidden; }
.hero:before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 75% 25%, rgba(var(--color-brand-rgb)/.18), transparent 60%); pointer-events:none; }
.hero:after { content:""; position:absolute; top:-140px; left:-140px; width:420px; height:420px; background:var(--grad-accent); filter:blur(110px) saturate(140%); opacity:.35; border-radius:50%; pointer-events:none; }
.hero-inner { display:grid; gap: clamp(2rem,4vw,3.2rem); grid-template-columns:repeat(auto-fit,minmax(min(100%,500px),1fr)); align-items:center; }
.hero-tag { background: var(--color-bg-soft); color: var(--color-brand); border:1px solid var(--color-border); font-weight:600; letter-spacing:1px; }
.h1 { font-size:clamp(2.2rem,4.6vw,3.1rem); font-weight:700; background:var(--grad-brand); -webkit-background-clip:text; background-clip:text; color:transparent; }
.lead { font-size: var(--fs-md); color: var(--color-text-muted); max-width:60ch; }
.hero-copy .actions { margin-top:2rem; }
.hero-copy .actions .cta-btn:first-child { background: var(--grad-brand); border:1px solid var(--color-brand-alt); }
.hero-copy small { display:block; margin-top:1.2rem; font-size:.68rem; letter-spacing:.4px; color: var(--color-text-muted); }

/* Hero with photographic backdrop + overlay */
.hero { background: var(--gradient-hero), var(--hero-img) center/cover no-repeat; }
.hero:before { background: linear-gradient(180deg,rgba(0,0,0,.25),rgba(0,0,0,0) 60%); filter:none; }
.hero:after { display:none; }
.hero .h1 { background:none; -webkit-text-fill-color:#fff; color:#fff; text-shadow:0 4px 18px rgba(0,0,0,.35); }
.hero .lead { color: #edf2fa; }
.hero-tag { background:rgba(255,255,255,.15); color:#fff; border:1px solid rgba(255,255,255,.28); backdrop-filter:blur(6px); }
body[data-theme="dark"] .hero-tag { background:rgba(255,255,255,.08); }

/* Surface panel (visual) */
.surface { background:linear-gradient(170deg,#ffffff 0%, #f1f5fb 100%); border:1px solid var(--color-border); padding:1.5rem 1.25rem 1.75rem; border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); position:relative; overflow:hidden; }
.surface:before { background: radial-gradient(circle at 70% 20%, rgba(var(--color-brand-rgb)/.14), transparent 65%); }
/* Hero visual placeholder (no telemetry) */
.hero-visual .surface { aspect-ratio:16/10; min-height:320px; padding:0; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,rgba(var(--color-brand-rgb)/.08),rgba(255,215,120,.12)),radial-gradient(circle at 25% 30%,#ffffff 0%,#f5f8fd 70%); }
.hero-visual .surface:before, .hero-visual .surface:after { content:""; position:absolute; inset:0; pointer-events:none; }
.hero-visual .surface:before { background:radial-gradient(circle at 18% 22%,rgba(var(--color-brand-rgb)/.25),transparent 60%),radial-gradient(circle at 82% 78%,rgba(255,215,120,.35),transparent 55%); mix-blend-mode:overlay; }
.hero-visual .surface:after { background:repeating-linear-gradient(55deg,rgba(var(--color-brand-rgb)/.08) 0 2px,transparent 2px 10px); opacity:.22; }
@media (max-width:720px){ .hero-visual .surface { aspect-ratio:16/12; min-height:240px; } }
body[data-theme="dark"] .hero-visual .surface { background:linear-gradient(135deg,#1d2733,#202e3d); }
body[data-theme="dark"] .hero-visual .surface:before { background:radial-gradient(circle at 18% 22%,rgba(90,139,255,.35),transparent 60%),radial-gradient(circle at 82% 78%,rgba(255,205,90,.4),transparent 55%); }
body[data-theme="dark"] .hero-visual .surface:after { background:repeating-linear-gradient(55deg,rgba(90,139,255,.16) 0 2px,transparent 2px 10px); opacity:.28; }

/* Sections */
.section { padding: clamp(3.2rem,6vw,5.2rem) 0; }
.section.alt { background: var(--color-bg-alt); }
:root {
  --section-bg-a: radial-gradient(circle at 20% 10%, rgba(var(--color-brand-rgb)/.08), transparent 40%), radial-gradient(circle at 80% 70%, rgba(245,193,51,.10), transparent 45%);
  --section-bg-b: radial-gradient(circle at 15% 20%, rgba(34,211,238,.08), transparent 40%), radial-gradient(circle at 85% 80%, rgba(139,92,246,.10), transparent 45%);
}
#ai.section.alt { background: linear-gradient(#ffffff,#f7faff), var(--section-bg-a); background-blend-mode: normal; }
#why.section.alt { background: linear-gradient(#ffffff,#f8fbff), var(--section-bg-b); background-blend-mode: normal; }
#features.section { background: linear-gradient(#ffffff,#f9fbff), var(--section-bg-a); }
#security.section.alt { background: linear-gradient(#ffffff,#f7fbff), var(--section-bg-b); }
body[data-theme="dark"] #ai.section.alt,
body[data-theme="dark"] #why.section.alt,
body[data-theme="dark"] #features.section,
body[data-theme="dark"] #security.section.alt { background: none; }
.section-heading h2 { background:linear-gradient(90deg,var(--color-brand) 0%, var(--color-brand-alt) 60%); -webkit-background-clip:text; background-clip:text; color:transparent; }
.section-heading p.lead { margin-top:.9rem; }

/* === Enterprise Feature Card Redesign === */
.features-grid { --feature-min:260px; grid-template-columns:repeat(auto-fit,minmax(var(--feature-min),1fr)); }
.feature-card {
  position:relative;
  background:linear-gradient(180deg,var(--color-surface-1) 0%,var(--color-surface-1) 60%,var(--color-surface-2) 100%) padding-box;
  border:1px solid var(--color-border-soft);
  border-radius:18px;
  padding:1.55rem 1.45rem 1.6rem 1.45rem;
  box-shadow:0 1px 2px rgba(0,0,0,.04),0 2px 6px -2px rgba(0,0,0,.06);
  display:flex; flex-direction:column; justify-content:flex-start;
  transition: box-shadow .5s var(--ease), transform .55s var(--ease), border-color .4s var(--ease);
  overflow:hidden;
}
.feature-card:before { /* subtle corner light */
  content:""; position:absolute; top:0; left:0; width:100%; height:100%; pointer-events:none;
  background:radial-gradient(circle at 14% 12%,rgba(var(--color-brand-rgb)/.18),transparent 55%);
  opacity:.55; transition:opacity .6s var(--ease);
}
.feature-card:after { /* gradient focus/hover ring */
  content:""; position:absolute; inset:0; border-radius:inherit; padding:1px; background:linear-gradient(130deg,rgba(var(--color-brand-rgb)/.5),rgba(245,193,51,.45),rgba(var(--color-brand-rgb)/.4)); -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); opacity:0; transition:opacity .6s var(--ease); }
.feature-card:hover { transform:translateY(-6px); box-shadow:0 6px 18px -6px rgba(0,0,0,.15),0 14px 38px -14px rgba(0,0,0,.22); border-color:rgba(var(--color-brand-rgb)/.35); }
.feature-card:hover:after { opacity:1; }
.feature-card:focus-within { border-color:rgba(var(--color-brand-rgb)/.55); }
.feature-card:focus-within:after { opacity:1; }

/* Icon refinement */
.feature-icon { width:52px; height:52px; border-radius:16px; margin:0 0 1.05rem; display:flex; align-items:center; justify-content:center; font-size:22px; position:relative; color:#fff; font-weight:400; background:var(--grad-brand); box-shadow:0 6px 12px -4px rgba(var(--color-brand-rgb)/.55),0 1px 2px rgba(var(--color-brand-rgb)/.35); }
.feature-icon:before { content:""; position:absolute; inset:0; border-radius:inherit; background:linear-gradient(160deg,rgba(255,255,255,.45),rgba(255,255,255,0) 60%); mix-blend-mode:overlay; }
.feature-card h3 { font-size:.95rem; letter-spacing:.2px; line-height:1.25; font-weight:600; color: var(--color-text); }
.feature-card p { font-size:.75rem; line-height:1.5; color: var(--color-text-muted); }

/* Compact text adjustments for very narrow screens */
@media (max-width:560px){
  .feature-card { padding:1.25rem 1.05rem 1.3rem; }
  .feature-icon { width:48px; height:48px; margin-bottom:.85rem; }
  .feature-card h3 { font-size:.9rem; }
  .feature-card p { font-size:.72rem; }
}

/* Dark mode variants */
body[data-theme="dark"] .feature-card { background:linear-gradient(180deg,var(--color-surface-2) 0%,var(--color-surface-2) 55%,var(--color-surface-3) 100%) padding-box; border-color:#2c3a49; box-shadow:0 1px 2px rgba(0,0,0,.6),0 2px 6px -2px rgba(0,0,0,.7); }
body[data-theme="dark"] .feature-card:before { background:radial-gradient(circle at 18% 16%,rgba(90,139,255,.22),transparent 58%); opacity:.5; }
body[data-theme="dark"] .feature-card:hover { border-color:rgba(90,139,255,.55); }
body[data-theme="dark"] .feature-card p { color: var(--color-text-muted); }

/* Keyboard accessibility for card (icon focus) */
.feature-card a, .feature-card button { position:relative; z-index:2; }

/* Provide utility class to equalize heights if future multi-line variations arise */
.features-grid.equal-heights .feature-card { display:flex; }

/* CTA Band */
/* CTA band refinement: neutral surface (remove strong accent glow near footer) */
.cta-band { position:relative; overflow:hidden; box-shadow:0 4px 18px -6px rgba(0,0,0,.12),0 10px 34px -12px rgba(0,0,0,.10); background:linear-gradient(145deg,#f4f7fb,#ffffff 55%); }
.cta-band:after { display:none; }

/* CTA band elevate */
/* (duplicate earlier) override second declaration */
.cta-band { position:relative; overflow:hidden; box-shadow:0 4px 18px -6px rgba(0,0,0,.12),0 10px 34px -12px rgba(0,0,0,.10); background:linear-gradient(145deg,#f4f7fb,#ffffff 55%); }
.cta-band:after { display:none; }

/* Footer */
.footer { background: linear-gradient(200deg,#0d121a,#121a25); border-top:1px solid #1d2733; }
.footer-top { position:relative; }
.footer a { position:relative; }
.footer a:after { content:""; position:absolute; left:0; bottom:-2px; height:2px; width:0; background:linear-gradient(90deg,var(--color-accent),var(--color-brand)); transition: width var(--transition); border-radius:2px; }
.footer a:hover:after { width:100%; }

/* Mobile nav adjustments */
@media (max-width: 840px) {
  /* Full-height, readable mobile menu with elegant background */
  .nav-links {
  position: fixed;
  inset: var(--header-h) 0 0 0; /* cover the viewport below header */
    background:
      linear-gradient(180deg, #ffffff 0%, #f6f9ff 100%),
      radial-gradient(50% 40% at 12% 8%, rgba(var(--color-brand-rgb)/.09) 0%, transparent 65%),
      radial-gradient(50% 40% at 88% 92%, rgba(245,193,51,.10) 0%, transparent 60%);
    background-blend-mode: normal;
    -webkit-backdrop-filter: blur(18px) saturate(150%);
    backdrop-filter: blur(18px) saturate(150%);
  flex-direction: column;
  align-items: stretch; /* allow children to span full panel width */
  padding: 1rem 1.25rem 2rem;
  padding-left: 1.5rem; /* ensure comfortable left gutter */
    gap: .2rem;
    border-bottom: 1px solid var(--color-border);
    transform: translateY(-120%);
    z-index: 70;
  height: calc(100svh - var(--header-h));
  overflow-y: auto;
    overscroll-behavior: contain;
  scrollbar-gutter: stable both-edges;
  padding-bottom: max(2rem, env(safe-area-inset-bottom));
  }
  .nav-links.open { transform: translateY(0); box-shadow: 0 18px 44px -16px rgba(0,0,0,.25); }
  /* Ensure every direct child (links and menu-item wrappers) fills width */
  .nav-links > * { width: 100%; }
  /* Larger, comfortable tap targets on mobile */
  .nav-links a, .nav-links .menu-trigger { font-size: 1rem; padding: .9rem .75rem .9rem 1rem; width: 100%; border-radius: 12px; }
  .nav-links .menu-trigger { display:flex; align-items:center; justify-content:space-between; gap:.75rem; }
  /* Clear submenu indicator caret */
  .nav-links .menu-trigger::after { content: '▸'; font-size: 1rem; line-height: 1; color: currentColor; }
  /* Stronger specificity ensures caret flips when open */
  .nav-links .menu-trigger[aria-expanded="true"]::after,
  .nav-links .menu-item.open > .menu-trigger::after { content: '▾'; }
  /* Remove hover overlays on touch, show explicit active/expanded visuals */
  .nav-links a:before, .nav-links .menu-trigger:before { display:none; }
  .nav-links a:active, .nav-links a:focus-visible, .nav-links .menu-trigger:focus-visible { background: linear-gradient(#fff,#f8fbff); border:1px solid var(--color-border); }
  /* Expanded trigger gets a filled surface for clear grouping */
  .nav-links .menu-item.open > .menu-trigger,
  .nav-links .menu-trigger[aria-expanded="true"] {
    background: linear-gradient(#ffffff,#f7faff);
    border: 1px solid var(--color-border);
  }
  .mobile-toggle { display:inline-flex; }
  .hero-inner { grid-template-columns:1fr; }
  /* Mobile submenu becomes stacked */
  .submenu { position:static; width:100%; display:none; box-shadow:none; border-radius:10px; margin:.25rem 0 .8rem; padding:.35rem 1rem; background: linear-gradient(#fff,#f8fbff); border:1px solid var(--color-border); }
  .submenu a[role="menuitem"] { padding:.6rem .65rem .6rem 1.25rem; border-radius:10px; font-size:.92rem; }
  .submenu a[role="menuitem"]:active, .submenu a[role="menuitem"]:focus-visible { background:#f2f6ff; }
  .menu-item.open > .submenu { display:block; }
  .nav-links .menu-item { display:block; width:100%; }
}

/* Additional responsive tweaks */
@media (max-width: 640px) {
  .h1 { font-size: clamp(1.9rem,8vw,2.4rem); }
  .hero-copy .actions { flex-direction:column; align-items:stretch; }
  /* Make hero CTAs smaller and not full-width on mobile */
  .hero-copy .actions .cta-btn, .hero-copy .actions .btn-outline {
    width:auto; align-self:flex-start; justify-content:center;
    font-size:.78rem; padding:.65rem 1rem; border-radius:12px;
  }
}

/* Premium enhancements */
:root {
  --elev-glass-bg: rgba(255,255,255,0.75);
  --elev-glass-border: rgba(255,255,255,0.55);
  --gradient-border: linear-gradient(140deg,rgba(var(--color-brand-rgb)/.35),rgba(245,193,51,.35),rgba(var(--color-brand-rgb)/.15));
  --gradient-soft: radial-gradient(circle at 20% 15%,rgba(var(--color-brand-rgb)/.12),transparent 60%), radial-gradient(circle at 85% 70%,rgba(245,193,51,.22),transparent 55%);
  --noise-filter: contrast(110%) brightness(102%);
}

body { background: var(--color-bg); background-image: var(--gradient-soft); background-attachment: fixed; }

/* Refined wrapper with larger max width */
.wrapper { max-width: var(--max-w); }

/* Glass utility */
.glass { backdrop-filter: blur(22px) saturate(160%); background: linear-gradient(145deg,var(--elev-glass-bg),rgba(255,255,255,0.55)); border:1px solid var(--elev-glass-border); box-shadow: var(--shadow-md); }

/* Navigation premium styling */
.header { border-bottom: 1px solid rgba(255,255,255,0.6); box-shadow: 0 2px 6px -2px rgba(0,0,0,.08); }
.navbar a.logo { font-size:1.1rem; letter-spacing:.8px; }
.nav-links a { position:relative; }
.nav-links a:before { content:""; position:absolute; inset:0; background: linear-gradient(120deg,rgba(var(--color-brand-rgb)/.12),rgba(245,193,51,.15)); opacity:0; transform: scale(.92); border-radius:8px; transition: var(--transition); z-index:-1; }
.nav-links a:hover:before, .nav-links a:focus-visible:before { opacity:1; transform:scale(1); }

/* Button refinements */
.cta-btn { position:relative; overflow:hidden; }
.cta-btn:after { content:""; position:absolute; left:-20%; top:-120%; width:140%; height:320%; background: linear-gradient(115deg,rgba(255,255,255,.35) 0%,rgba(255,255,255,0) 55%); transform: translateY(0) rotate(20deg); transition: 900ms var(--ease); opacity:.0; }
.cta-btn:hover:after { opacity:1; transform: translateY(15%) rotate(25deg); }
.btn-outline { background:linear-gradient(#fff,#fff) padding-box, var(--gradient-border) border-box; border:1px solid transparent; }
.btn-outline:hover { box-shadow: var(--shadow-md); }
.btn-accent { background: linear-gradient(92deg,var(--color-accent) 0%, #ffdc7c 60%, var(--color-accent-alt) 100%); }

/* Hero adjustments */
.hero { position:relative; }
.hero:after { mix-blend-mode: multiply; }
.hero .surface { border:1px solid transparent; background:linear-gradient(#ffffff,#f5f8fd) padding-box, var(--gradient-border) border-box; box-shadow: var(--shadow-lg); }
.hero .surface:after { content:""; position:absolute; inset:0; background: linear-gradient(180deg,rgba(var(--color-brand-rgb)/.08),transparent 60%); mix-blend-mode: overlay; pointer-events:none; }

/* Add subtle floating animation for code lines */
@keyframes floaty { 0% { transform:translateY(0);} 50% { transform:translateY(-6px);} 100% { transform:translateY(0);} }

/* Section heading underline accent */
.section-heading h2 { position:relative; display:inline-block; padding-bottom:.4rem; }
.section-heading h2:after { content:""; position:absolute; left:0; bottom:0; width:52%; height:3px; background: linear-gradient(90deg,var(--color-accent),var(--color-brand)); border-radius:3px; }

/* Feature cards premium gradient border */
.feature-card { background: linear-gradient(#ffffff,#ffffff) padding-box, var(--gradient-border) border-box; border: 1px solid transparent; box-shadow: var(--shadow-sm); transition: transform var(--transition), box-shadow var(--transition); }
.feature-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); }
.feature-card:after { content:""; position:absolute; inset:0; background:linear-gradient(150deg,rgba(var(--color-brand-rgb)/.08),rgba(245,193,51,.08)); opacity:0; transition:opacity var(--transition); pointer-events:none; }
.feature-card:hover:after { opacity:1; }

/* Focus ring override */
:focus-visible { outline:none; box-shadow: var(--ring-brand); }

/* Focus ring unify */
:focus-visible { box-shadow: var(--focus-ring); }

/* Mobile nav refined overlay */
@media (max-width: 840px) {
  /* Keep background strong enough for readability over hero image */
  .nav-links { background: linear-gradient(180deg, #ffffff 0%, #f6f9ff 100%); }
}

/* Minor spacing fix for hero actions on wide view */
.hero-copy .actions { display:flex; gap:.75rem; flex-wrap:wrap; }

/* Ensure hero overlay readability in dark mode (already white text) */
body[data-theme="dark"] .hero .lead { color:#d9e4f1; }

/* Dark mode heading adjustments for serif contrast */
body[data-theme="dark"] .h1, body[data-theme="dark"] .h2 { 
  color: #f1f5f9; 
  text-shadow: 0 1px 3px rgba(0,0,0,.4); 
}
body[data-theme="dark"] .section-heading h2 { 
  background: linear-gradient(90deg,#e2e8f0 0%, #cbd5e1 60%); 
  -webkit-background-clip: text; 
  background-clip: text; 
  color: transparent; 
}

/* Prose typography for blog/article content */
.prose { 
  max-width: 68ch; 
  line-height: 1.7; 
  font-size: var(--fs-md); 
}
.prose h1, .prose h2, .prose h3 { 
  font-family: var(--font-serif); 
  margin-top: 2.5em; 
  margin-bottom: 0.8em; 
  line-height: 1.2; 
}
.prose h1 { font-size: var(--fs-xl); font-weight: 600; }
.prose h2 { font-size: var(--fs-lg); font-weight: 600; }
.prose h3 { font-size: var(--fs-md); font-weight: 600; }
.prose p { margin-bottom: 1.5em; }
.prose blockquote { 
  border-left: 4px solid var(--color-brand); 
  padding-left: 1.5rem; 
  margin: 2rem 0; 
  font-style: italic; 
  color: var(--color-text-muted); 
}
.prose code { 
  background: var(--color-bg-soft); 
  padding: 0.2em 0.4em; 
  border-radius: var(--radius-xs); 
  font-size: 0.9em; 
}

/* Ensure text not touching edges on mobile menu */
@media (max-width:840px){ .nav-links { padding:1rem 1.5rem 2rem; } }

/* Improve gradient brand button readability */
.hero-copy .actions .cta-btn:first-child { color:#fff; text-shadow:0 1px 2px rgba(0,0,0,.25); }
.btn-accent { color:#473600; text-shadow:0 1px 1px rgba(255,255,255,.4); }
.btn-accent:hover { filter:brightness(1.08); }

/* Fix any potential icon alignment */
.feature-icon i { line-height:1; }

/* Footer spacing improvement */
.footer-top { display:grid; gap:1.8rem clamp(1rem,3vw,2rem); grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); padding:3rem 0 2.4rem; justify-items:start; }
.footer-top h4 { margin:0 0 .8rem; font-size:.75rem; letter-spacing:1.1px; text-transform:uppercase; color:#d9e2ef; }
.footer-top a { display:block; font-size:.75rem; padding:.35rem 0; color:#aeb9c7; line-height:1.6; }
.footer-top a:hover { color:#fff; }
.footer small { display:block; padding:1.2rem 0 2.6rem; font-size:.6rem; letter-spacing:.4px; color:#7d8997; }
@media (max-width: 640px){
  .footer-top { align-items:start; grid-template-columns: repeat(2, 1fr); gap:1.4rem 1.5rem; padding:2.5rem 0 2rem; padding-left:1.5rem; }
  .footer small { text-align:center; padding:1rem 0 2.2rem; }
}
@media (max-width: 480px){
  .footer-top { grid-template-columns: 1fr; gap: 1.8rem; padding:2rem 0 1.5rem; padding-left:1.5rem; }
  .footer-top h4 { margin-top:.25rem; }
  .footer small { padding:1rem 0; padding-bottom: max(2.2rem, env(safe-area-inset-bottom)); }
}

/* Mobile icon centering */
@media (max-width: 640px) {
  .value-featured-icon,
  .value-compact-icon,
  .cap-icon,
  .trust-icon,
  .value-hero-icon {
    margin-left: auto !important;
    margin-right: auto !important;
  }
  
  /* Alternative centering approach for value cards */
  .value-card {
    text-align: center;
  }
  .value-card p {
    text-align: left;
  }
  
  /* Center headings on mobile for all card types */
  .cap-card h4,
  .cap-card h3,
  .trust-card h4,
  .trust-card h3,
  .value-card h4,
  .value-card h3 {
    text-align: center;
  }
  
  /* Show mobile line break for CTA heading */
  .mobile-break {
    display: inline;
  }
}

/* Hide mobile break on larger screens */
.mobile-break {
  display: none;
}

/* Explicit centering for copyright row */
.footer > .wrapper:last-child { display:flex; justify-content:center; }

/* Remove earlier outline override duplication: keep final version consistent */
:focus-visible { outline:none; box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(var(--color-brand-rgb)/.8); border-radius:6px; }

/* === Spacing Refinement Pass === */
:root { --space-1:.25rem; --space-2:.5rem; --space-3:.75rem; --space-4:1rem; --space-5:1.5rem; --space-6:2rem; --space-7:2.5rem; --space-8:3rem; }

/* Global typography spacing */
body p { margin:0 0 var(--space-4); }
.section-heading { margin-bottom: var(--space-5); }
.section-heading h2 { margin:0 0 var(--space-2); }
.section-heading .lead { margin:0; }

/* Section vertical rhythm */
.section { padding: clamp(3.8rem,6.5vw,6rem) 0 clamp(3.8rem,6.5vw,6rem); }
.section.alt { padding: clamp(3.5rem,6vw,5.5rem) 0; }

/* Features grid spacing */
.features-grid { gap: 2rem 1.8rem; }
@media (min-width:960px){ .features-grid { gap:2.4rem 2rem; } }

/* Feature card internal spacing */
.feature-card { padding:1.25rem 1.25rem 1.35rem; display:flex; flex-direction:column; justify-content:flex-start; min-height:170px; }
.feature-icon { margin:0 0 .85rem; }
.feature-card h3 { margin:0 0 .4rem; }
.feature-card p { margin:0; }

/* CTA band increased internal padding */
.cta-band { padding:2.9rem clamp(1rem,3vw,3rem); }
.cta-band h2 { margin:0 0 .9rem; }
.cta-band p { margin:0 0 1.4rem; }

/* CTA actions layout */
.cta-actions {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
}

@media (max-width: 640px) {
  .cta-actions {
    flex-direction: column;
    align-items: stretch;
  }
  .cta-actions .cta-btn {
    width: 100%;
    text-align: center;
  }
}

/* Hero spacing adjustments */
.hero-inner { row-gap: clamp(2.2rem,4vw,3.5rem); }
.hero-copy .actions { gap:.9rem; margin-top:1.9rem; }
.hero-copy p.lead { margin-top: var(--space-3); }

/* Navigation link padding slightly increased for touch */
.nav-links a { padding:.7rem .85rem; }

/* Footer spacing refinement */
.footer-top { gap:2.2rem 2.4rem; }
.footer small { margin:0; }

/* Reduce card density on very small screens */
@media (max-width:520px){
  .feature-card { padding:1rem 1rem 1.1rem; }
}

/* Ensure underline accent does not crowd text */
.section-heading h2:after { bottom: -4px; }

/* Small spacing utility for inline-style cleanup */
.mt-1 { margin-top: 1rem; }

/* === Refined Values Grid (Why section) === */
.section#why, #why.section, #why { 
  /* Subtle neutral gradient with a whisper of brand tint, avoids banding */
  background:
    radial-gradient(50% 40% at 50% 0%, rgba(var(--color-brand-rgb)/.04) 0%, rgba(var(--color-brand-rgb)/0) 70%),
    linear-gradient(180deg, #ffffff 0%, #f6f9ff 48%, #f6f9ff 52%, #ffffff 100%);
}
body[data-theme="dark"] #why { 
  background:
    radial-gradient(50% 40% at 50% 0%, rgba(var(--color-brand-rgb)/.08) 0%, rgba(var(--color-brand-rgb)/0) 70%),
    linear-gradient(180deg,#0f1621 0%, #121b29 100%);
}

/* Stronger brand-tinted override for the specific alt variant used in markup */
#why.section.alt {
  background:
    /* Primary glow behind the hero card area (left-center) */
    radial-gradient(45% 38% at 35% 28%, rgba(var(--color-brand-rgb)/.12) 0%, rgba(var(--color-brand-rgb)/0) 70%),
    /* Subtle top wash to connect heading and cards */
    radial-gradient(50% 42% at 60% 5%, rgba(var(--color-brand-rgb)/.06) 0%, rgba(var(--color-brand-rgb)/0) 70%),
    /* Neutral midtone band to reduce stark white */
    linear-gradient(180deg, #ffffff 0%, #edf3ff 46%, #edf3ff 54%, #ffffff 100%);
  background-blend-mode: normal;
}
body[data-theme="dark"] #why.section.alt {
  background:
    radial-gradient(45% 38% at 35% 28%, rgba(var(--color-brand-rgb)/.22) 0%, rgba(var(--color-brand-rgb)/0) 70%),
    radial-gradient(50% 42% at 60% 5%, rgba(var(--color-brand-rgb)/.12) 0%, rgba(var(--color-brand-rgb)/0) 70%),
    linear-gradient(180deg,#0f1621 0%, #121b29 100%);
}

/* AI section backdrop — harmonize rhythm with Why (slightly lighter) */
#ai.section {
  background:
    radial-gradient(44% 36% at 30% 18%, rgba(var(--color-brand-rgb)/.10) 0%, rgba(var(--color-brand-rgb)/0) 68%),
    radial-gradient(42% 34% at 80% 82%, rgba(245,193,51,.10) 0%, rgba(245,193,51,0) 60%),
    linear-gradient(180deg, #ffffff 0%, #eef3ff 46%, #eef3ff 54%, #ffffff 100%);
  background-blend-mode: normal;
}
body[data-theme="dark"] #ai.section {
  background:
    radial-gradient(44% 36% at 30% 18%, rgba(var(--color-brand-rgb)/.18) 0%, rgba(var(--color-brand-rgb)/0) 68%),
    radial-gradient(42% 34% at 80% 82%, rgba(245,193,51,.12) 0%, rgba(245,193,51,0) 60%),
    linear-gradient(180deg,#0f1621 0%, #121b29 100%);
}
.values-grid { display:grid; gap:1.6rem; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); align-items:stretch; }
@media (min-width:960px){ .values-grid { grid-template-columns:repeat(12,1fr); }
  .value-hero { grid-column: span 6; }
  .value-featured { grid-column: span 4; }
  .value-compact { grid-column: span 3; }
}
@media (min-width:1280px){
  .value-hero { grid-column: span 7; }
  .value-featured { grid-column: span 4; }
}

.value-card { position:relative; background:#fff; border:1px solid #e2e8f0; border-radius:22px; padding:1.6rem 1.5rem 1.7rem; display:flex; flex-direction:column; justify-content:flex-start; overflow:hidden; box-shadow:0 4px 14px -6px rgba(0,0,0,.08),0 10px 32px -12px rgba(0,0,0,.06); transition: box-shadow .5s var(--ease), transform .55s var(--ease), border-color .5s var(--ease); }
.value-card:before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 18% 18%,rgba(var(--color-brand-rgb)/.08),transparent 60%), radial-gradient(circle at 82% 78%,rgba(245,193,51,.12),transparent 55%); opacity:.55; pointer-events:none; }
.value-card:hover { transform:translateY(-6px); box-shadow:0 14px 38px -12px rgba(0,0,0,.20),0 22px 54px -20px rgba(0,0,0,.25); border-color:#c3d0e0; }
.value-card h3,.value-card h4 { margin:0 0 .65rem; font-weight:600; letter-spacing:.2px; }
.value-card p { margin:0; font-size:.78rem; line-height:1.5; color: var(--color-text-muted); }

/* Hero card variant */
.value-hero { background: linear-gradient(135deg, #4968ba 0%, #5a7bc4 30%, #f5c133 100%); color:#fff; border:none; box-shadow:0 30px 70px -25px rgba(73,104,186,.6),0 18px 36px -18px rgba(0,0,0,.45); }
.value-hero:before { background:radial-gradient(circle at 22% 28%,rgba(255,255,255,.18),transparent 60%), radial-gradient(circle at 80% 72%,rgba(245,193,51,.28),transparent 55%); opacity:.65; }
.value-hero-icon { width:68px; height:68px; border-radius:22px; background:rgba(255,255,255,.18); display:flex; align-items:center; justify-content:center; margin:0 0 1.4rem; backdrop-filter:blur(12px); }

/* Colorful value card icons */
.value-compact-icon { width:48px; height:48px; border-radius:15px; margin:0 0 .8rem; display:flex; align-items:center; justify-content:center; color:#fff; }
.value-featured-icon { width:56px; height:56px; border-radius:18px; margin:0 0 1rem; display:flex; align-items:center; justify-content:center; color:#fff; }

/* Specific colors for each value proposition */
.value-card:nth-child(2) .value-compact-icon { background:var(--icon-grad-security); box-shadow:0 4px 10px -4px rgba(34,197,94,.35); } /* Security & Compliance - green */
.value-card:nth-child(3) .value-compact-icon { background:var(--icon-grad-performance); box-shadow:0 4px 10px -4px rgba(245,158,11,.35); } /* Event-Driven Sync - amber */
.value-card:nth-child(4) .value-compact-icon { background:var(--icon-grad-analytics); box-shadow:0 4px 10px -4px rgba(139,92,246,.35); } /* Collection Intelligence - purple */
.value-card:nth-child(5) .value-featured-icon { background:var(--icon-grad-collection); box-shadow:0 4px 10px -4px rgba(236,72,153,.35); } /* Inclusive Experience - pink */
.value-hero h3 { font-size:1.5rem; line-height:1.15; }
.value-hero p { font-size:.92rem; line-height:1.55; opacity:.95; margin:0 0 1.6rem; }
.value-hero-metrics { display:flex; flex-wrap:wrap; gap:.6rem; }
.value-hero-metrics span { background:rgba(255,255,255,.22); padding:.45rem .7rem .4rem; font-size:.65rem; letter-spacing:.8px; font-weight:600; border-radius:16px; text-transform:uppercase; }
.value-hero-badge { position:absolute; top:1rem; right:1rem; background:rgba(255,255,255,.22); backdrop-filter:blur(8px); font-size:.6rem; letter-spacing:1.1px; padding:.4rem .65rem .35rem; border-radius:16px; font-weight:600; text-transform:uppercase; }

/* Contrast tweak for value-hero text */
.value-hero h3, .value-hero p, .value-hero-metrics span { text-shadow:0 1px 2px rgba(0,0,0,.35); }
.value-hero p { color:rgba(255,255,255,.92); }

/* === Capabilities Grid === */
.cap-grid { display:grid; gap:1.6rem; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); align-items:stretch; }
@media (min-width:1000px){ .cap-grid { grid-template-columns:repeat(12,1fr); } .cap-accent { grid-column: span 5; } .cap-card { grid-column: span 3; } }
@media (min-width:1320px){ .cap-accent { grid-column: span 4; } }
.cap-card { position:relative; background:#fff; border:1px solid #e2e8f0; border-radius:20px; padding:1.4rem 1.25rem 1.5rem; display:flex; flex-direction:column; gap:.65rem; box-shadow:0 4px 14px -6px rgba(0,0,0,.07),0 10px 28px -14px rgba(0,0,0,.06); transition:transform .5s var(--ease), box-shadow .5s var(--ease), border-color .5s var(--ease); overflow:hidden; }
.cap-card:before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 18% 18%,rgba(var(--color-brand-rgb)/.08),transparent 60%); opacity:.6; pointer-events:none; }
.cap-card:hover { transform:translateY(-6px); box-shadow:0 16px 40px -18px rgba(0,0,0,.2); border-color:#c8d4e4; }
.cap-card h3, .cap-card h4 { margin:0; font-size:.95rem; font-weight:600; letter-spacing:.25px; }
.cap-card p { margin:0; font-size:.78rem; line-height:1.5; color:var(--color-text-muted); }
/* Enhanced icon color variants for visual appeal */
:root {
  --icon-grad-security: linear-gradient(135deg, #22c55e 0%, #16a34a 100%); /* green for security */
  --icon-grad-performance: linear-gradient(135deg, #f59e0b 0%, #d97706 100%); /* amber for performance */
  --icon-grad-analytics: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%); /* purple for analytics */
  --icon-grad-automation: linear-gradient(135deg, #06b6d4 0%, #0891b2 100%); /* cyan for automation */
  --icon-grad-trust: linear-gradient(135deg, #ef4444 0%, #dc2626 100%); /* red for trust/security */
  --icon-grad-collection: linear-gradient(135deg, #ec4899 0%, #db2777 100%); /* pink for collection */
}

.cap-icon { width:46px; height:46px; border-radius:14px; background:var(--icon-grad-performance); display:flex; align-items:center; justify-content:center; color:#fff; box-shadow:0 4px 10px -4px rgba(245,158,11,.35); }
/* Specific colorful icons for each capability */
.cap-card:nth-child(1) .cap-icon { background: linear-gradient(135deg, #4968ba 0%, #f5c133 100%); box-shadow:0 4px 10px -4px rgba(73,104,186,.35); } /* Catalog - brand gradient to match */
.cap-card:nth-child(2) .cap-icon { background:var(--icon-grad-performance); box-shadow:0 4px 10px -4px rgba(245,158,11,.35); } /* Circulation - amber */
.cap-card:nth-child(3) .cap-icon { background:var(--icon-grad-collection); box-shadow:0 4px 10px -4px rgba(236,72,153,.35); } /* Members - pink */
.cap-card:nth-child(4) .cap-icon { background:var(--icon-grad-analytics); box-shadow:0 4px 10px -4px rgba(139,92,246,.35); } /* Analytics - purple */
.cap-card:nth-child(5) .cap-icon { background:var(--icon-grad-security); box-shadow:0 4px 10px -4px rgba(34,197,94,.35); } /* Security - green */
.cap-card:nth-child(6) .cap-icon { background:var(--icon-grad-automation); box-shadow:0 4px 10px -4px rgba(6,182,212,.35); } /* Automation - cyan */
.cap-accent { background: var(--grad-brand); color:#fff; border:none; box-shadow:0 24px 60px -28px rgba(var(--color-brand-rgb)/.6); }
.cap-accent:before { background:radial-gradient(circle at 22% 20%,rgba(255,255,255,.28),transparent 60%), radial-gradient(circle at 80% 78%,rgba(255,215,120,.35),transparent 55%); }
.cap-accent h3, .cap-accent p { color:#fff; text-shadow:0 1px 2px rgba(0,0,0,.4); }
.cap-accent .cap-icon { background:rgba(255,255,255,.18); color:#fff; box-shadow:none; backdrop-filter:blur(10px); }
.cap-meta { display:flex; gap:.45rem; flex-wrap:wrap; margin-top:.4rem; }
.cap-meta span { background:rgba(255,255,255,.18); color:#fff; font-size:.55rem; letter-spacing:.8px; padding:.35rem .55rem .3rem; font-weight:600; border-radius:12px; text-transform:uppercase; }

/* Dark mode */
body[data-theme="dark"] .cap-card { background:linear-gradient(180deg,#1d2733,#202e3d); border:1px solid #2f3b4a; box-shadow:0 4px 16px -8px rgba(0,0,0,.7); }
body[data-theme="dark"] .cap-card p { color:#9db0c3; }
body[data-theme="dark"] .cap-icon { background:linear-gradient(135deg,#253444,#222f3a); color:#89aefc; box-shadow:0 4px 12px -4px rgba(0,0,0,.8); }
/* Keep colorful icons in dark mode but with adjusted shadows */
body[data-theme="dark"] .cap-card:nth-child(1) .cap-icon { background:var(--grad-brand); }
body[data-theme="dark"] .cap-card:nth-child(2) .cap-icon { background:var(--icon-grad-performance); box-shadow:0 4px 12px -4px rgba(0,0,0,.8); }
body[data-theme="dark"] .cap-card:nth-child(3) .cap-icon { background:var(--icon-grad-collection); box-shadow:0 4px 12px -4px rgba(0,0,0,.8); }
body[data-theme="dark"] .cap-card:nth-child(4) .cap-icon { background:var(--icon-grad-analytics); box-shadow:0 4px 12px -4px rgba(0,0,0,.8); }
body[data-theme="dark"] .cap-card:nth-child(5) .cap-icon { background:var(--icon-grad-security); box-shadow:0 4px 12px -4px rgba(0,0,0,.8); }
body[data-theme="dark"] .cap-card:nth-child(6) .cap-icon { background:var(--icon-grad-automation); box-shadow:0 4px 12px -4px rgba(0,0,0,.8); }
body[data-theme="dark"] .cap-accent { box-shadow:0 28px 70px -30px rgba(0,0,0,.85); }
body[data-theme="dark"] .cap-accent .cap-meta span { background:rgba(255,255,255,.22); }

/* === Trust Grid === */
.trust-grid { display:grid; gap:1.6rem; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); }
@media (min-width:900px){ .trust-grid { grid-template-columns:repeat(8,1fr);} .trust-card { grid-column:span 2; } }
@media (min-width:1200px){ .trust-card { grid-column:span 2; } }
.trust-card { position:relative; background:#fff; border:1px solid #e2e8f0; border-radius:18px; padding:1.35rem 1.2rem 1.45rem; display:flex; flex-direction:column; gap:.55rem; transition:transform .5s var(--ease), box-shadow .5s var(--ease), border-color .5s var(--ease); box-shadow:0 4px 12px -6px rgba(0,0,0,.07); overflow:hidden; }
.trust-card:before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 20% 18%,rgba(var(--color-brand-rgb)/.08),transparent 60%), radial-gradient(circle at 85% 80%,rgba(245,193,51,.12),transparent 55%); opacity:.55; pointer-events:none; }
.trust-card:hover { transform:translateY(-5px); box-shadow:0 14px 34px -14px rgba(0,0,0,.22); border-color:#c7d4e4; }
.trust-icon { width:42px; height:42px; border-radius:13px; background:var(--icon-grad-security); display:flex; align-items:center; justify-content:center; color:#fff; box-shadow:0 4px 10px -4px rgba(34,197,94,.35); }
/* Specific colorful icons for each trust/security feature */
.trust-card:nth-child(1) .trust-icon { background:var(--icon-grad-security); box-shadow:0 4px 10px -4px rgba(34,197,94,.35); } /* Access Control - green */
.trust-card:nth-child(2) .trust-icon { background:var(--icon-grad-analytics); box-shadow:0 4px 10px -4px rgba(139,92,246,.35); } /* Auditability - purple */
.trust-card:nth-child(3) .trust-icon { background:var(--icon-grad-trust); box-shadow:0 4px 10px -4px rgba(239,68,68,.35); } /* Data Integrity - red */
.trust-card:nth-child(4) .trust-icon { background:var(--icon-grad-automation); box-shadow:0 4px 10px -4px rgba(6,182,212,.35); } /* Privacy - cyan */
.trust-card h4 { margin:0; font-size:.88rem; font-weight:600; letter-spacing:.25px; }
.trust-card p { margin:0; font-size:.7rem; line-height:1.4; color:var(--color-text-muted); }
body[data-theme="dark"] .trust-card { background:linear-gradient(180deg,#1d2733,#202e3d); border:1px solid #2f3b4a; box-shadow:0 4px 16px -8px rgba(0,0,0,.7); }
body[data-theme="dark"] .trust-card p { color:#9db0c3; }
body[data-theme="dark"] .trust-icon { background:linear-gradient(135deg,#253444,#222f3a); color:#89aefc; }
/* Keep colorful trust icons in dark mode */
body[data-theme="dark"] .trust-card:nth-child(1) .trust-icon { background:var(--icon-grad-security); }
body[data-theme="dark"] .trust-card:nth-child(2) .trust-icon { background:var(--icon-grad-analytics); }
body[data-theme="dark"] .trust-card:nth-child(3) .trust-icon { background:var(--icon-grad-trust); }
body[data-theme="dark"] .trust-card:nth-child(4) .trust-icon { background:var(--icon-grad-automation); }

/* Focus states */
.cap-card:focus-within, .trust-card:focus-within { outline:2px solid var(--color-brand); outline-offset:2px; }

/* === Text-only Carousel (lightweight) === */
.carousel { position:relative; width:100%; }
.carousel-viewport { overflow:hidden; border-radius: 18px; width:100%; display:block; }
.carousel-track { display:flex; flex-direction: row; flex-wrap: nowrap; gap:0; transition: transform 380ms var(--ease); will-change: transform; white-space: nowrap; }
.carousel-track > .carousel-slide { flex: 0 0 100%; width:100%; box-sizing: border-box; padding: .25rem; display:inline-block; vertical-align: top; white-space: normal; }
.carousel-card { background:#fff; border:1px solid var(--color-border); border-radius: 18px; padding: clamp(1rem,2.2vw,1.4rem); box-shadow: var(--shadow-sm); min-height: 160px; display:flex; flex-direction:column; gap:.5rem; }
.carousel-card h3,.carousel-card h4 { margin:0; font-weight:600; letter-spacing:.2px; }
.carousel-card p { margin:0; color: var(--color-text-muted); font-size:.9rem; }
/* Slightly larger text for AI card */
#ai .carousel-card h3, #ai .carousel-card h4 { font-size: clamp(1rem,2.1vw,1.15rem); }
#ai .carousel-card p { line-height: 1.55; }
.carousel-controls { position:absolute; left:0; right:0; top:50%; transform: translateY(-50%); display:flex; align-items:center; justify-content:space-between; pointer-events:none; }
.carousel button[data-action] { pointer-events:auto; appearance:none; border:1px solid var(--color-border); background:#fff; color: var(--color-text); width:40px; height:40px; border-radius:999px; display:grid; place-items:center; margin:0 .25rem; box-shadow: var(--shadow-sm); transition: transform var(--transition), background var(--transition); }
.carousel button[data-action]:hover { transform: translateY(-1px); background: var(--color-bg-alt); }
.carousel button[data-action]:focus-visible { outline:none; box-shadow: var(--ring-brand); }
.carousel button[disabled] { opacity:.55; cursor:not-allowed; }
.carousel-dots { display:flex; gap:.4rem; justify-content:center; margin-top:.8rem; }
.carousel-dots button { width:8px; height:8px; border-radius:999px; border:0; background:#c7cfdb; opacity:.95; }
.carousel-dots button[aria-selected="true"] { background: var(--color-brand); }
@media (prefers-reduced-motion: reduce){ .carousel-track { transition:none; } }
body[data-theme="dark"] .carousel-card { background: linear-gradient(180deg,#1d2733,#202e3d); border:1px solid #2f3b4a; box-shadow:0 4px 16px -8px rgba(0,0,0,.7); }
body[data-theme="dark"] .carousel button[data-action] { background:#1b2633; color:#d5dde7; border-color:#2f3b4a; }

/* Advisory + AI carousel: bigger, with visual side image or gradient backdrop */
#advisory, #ai { 
  /* Section-scoped palette (cool violet → aqua) */
  --adv-start: #6a5cf6; /* violet */
  --adv-end: #22d3ee;   /* aqua */
  --adv-accent: #a78bfa; /* soft purple */
  --advisory-border: linear-gradient(140deg,var(--adv-start),var(--adv-end));
}
#advisory .carousel-viewport, #ai .carousel-viewport { border-radius: 24px; }
#advisory .carousel-slide, #ai .carousel-slide { padding: .5rem; }
#advisory .carousel-card, #ai .carousel-card { 
  min-height: clamp(220px, 32vw, 320px);
  padding: clamp(1.2rem,2.6vw,1.8rem);
  background: linear-gradient(#ffffff,#f7faff) padding-box, var(--advisory-border) border-box;
  border:1px solid transparent;
  box-shadow: var(--shadow-md);
  position: relative;
  overflow: hidden;
  /* Center content */
  justify-content: center;
  align-items: center;
  text-align: center;
}
#advisory .carousel-card:before,
#advisory .carousel-card:after,
#ai .carousel-card:before,
#ai .carousel-card:after{ content:""; position:absolute; inset:0; pointer-events:none; }
#advisory .carousel-card:before,
#ai .carousel-card:before{ background: radial-gradient(circle at 18% 18%,rgba(106,92,246,.16),transparent 60%), radial-gradient(circle at 82% 78%,rgba(34,211,238,.16),transparent 55%); opacity:.95; }
#advisory .carousel-card:after,
#ai .carousel-card:after{ background: repeating-linear-gradient(55deg,rgba(var(--color-brand-rgb)/.06) 0 2px,transparent 2px 12px); opacity:.18; }
#advisory .carousel-card--visual, #ai .carousel-card--visual { display:flex; align-items:center; justify-content:center; }
#advisory .carousel-card--visual .card-copy, #ai .carousel-card--visual .card-copy { position:relative; z-index:1; max-width: 60ch; margin-inline:auto; }
/* Bigger title + description for Advisory */
#advisory .carousel-card h3,
#advisory .carousel-card h4,
#ai .carousel-card h3,
#ai .carousel-card h4 { 
  font-family: var(--font-serif);
  font-size: clamp(1.35rem,3.6vw,2rem);
  line-height: 1.12;
}
#advisory .carousel-card p,
#ai .carousel-card p { 
  font-size: clamp(1rem,2.2vw,1.2rem);
  line-height: 1.65;
}
#advisory .carousel-card .card-copy > * + *,
#ai .carousel-card .card-copy > * + * { margin-top: .75rem; }
#advisory .carousel-controls .carousel-prev, #ai .carousel-controls .carousel-prev { left:-16px; }
#advisory .carousel-controls .carousel-next, #ai .carousel-controls .carousel-next { right:-16px; }
/* Position arrows slightly outside the card on desktop */
@media (min-width: 720px){
  #advisory .carousel-controls, #ai .carousel-controls { pointer-events: none; }
  #advisory .carousel-controls .carousel-prev,
  #advisory .carousel-controls .carousel-next,
  #ai .carousel-controls .carousel-prev,
  #ai .carousel-controls .carousel-next { position:absolute; top:50%; transform: translateY(-50%); pointer-events:auto; }
}
@media (max-width: 820px){
  #advisory .carousel-card, #ai .carousel-card { min-height: unset; }
  #advisory .carousel-controls .carousel-prev, #ai .carousel-controls .carousel-prev { left: 6px; }
  #advisory .carousel-controls .carousel-next, #ai .carousel-controls .carousel-next { right: 6px; }
  /* Prevent arrows from overlapping text on smaller screens */
  #advisory .carousel-card .card-copy,
  #ai .carousel-card .card-copy { padding-inline: var(--carousel-arrow-space); }
}
body[data-theme="dark"] #advisory .carousel-card, 
body[data-theme="dark"] #ai .carousel-card { 
  /* Tinted border using section palette; keep dark surface */
  background: linear-gradient(#1d2733,#202e3d) padding-box, var(--advisory-border) border-box; border:1px solid transparent; 
}
body[data-theme="dark"] #advisory, 
body[data-theme="dark"] #ai { 
  --adv-start: #8b5cf6; /* brighter violet */
  --adv-end: #06b6d4;   /* cyan */
  --adv-accent: #c4b5fd; 
}

/* Removed AI-specific smaller panel styles to unify with Advisory */

/* Form Messages */
.form-message {
  margin-top: 1rem;
  padding: 0.75rem 1rem;
  border-radius: var(--radius-sm);
  font-size: 0.9rem;
  line-height: 1.4;
  font-weight: 500;
  border: 1px solid;
  transition: opacity 0.3s var(--ease);
}

.form-message--success {
  background-color: #f0f9f0;
  color: var(--color-success);
  border-color: #c3e6c3;
}

.form-message--error {
  background-color: #fef2f2;
  color: var(--color-danger);
  border-color: #fca5a5;
}

.form-message--info {
  background-color: #eff6ff;
  color: var(--color-brand);
  border-color: #93c5fd;
}

/* Form error state styling */
.form-input.error,
.form-input.error:focus {
  border-color: var(--color-danger);
  box-shadow: 0 0 0 3px rgba(195, 50, 58, 0.1);
}

/* Dark mode adjustments */
body[data-theme="dark"] .form-message--success {
  background-color: rgba(15, 141, 81, 0.1);
  border-color: rgba(15, 141, 81, 0.3);
}

body[data-theme="dark"] .form-message--error {
  background-color: rgba(195, 50, 58, 0.1);
  border-color: rgba(195, 50, 58, 0.3);
}

body[data-theme="dark"] .form-message--info {
  background-color: rgba(73, 104, 186, 0.1);
  border-color: rgba(73, 104, 186, 0.3);
}
