/* SynergiBI Global Styles */
:root {
  --color-blue-900: #0a2c57;
  --color-blue-800: #0f3e76;
  --color-blue-700: #15508f;
  --color-blue-600: #1f63a8;
  --color-blue-500: #2c78c2;
  --color-blue-400: #4b94d6;
  --color-blue-200: #cfe3f7;
  --color-blue-100: #e6f2fb;
  --color-blue-050: #f4f9fd;
  --color-gray-900: #0f1419;
  --color-gray-700: #2f3944;
  --color-gray-500: #687480;
  --color-gray-300: #c4ced6;
  --color-gray-150: #e6ebef;
  --color-white: #ffffff;
  --color-bg: var(--color-white);
  --color-surface: #ffffff;
  --color-surface-alt: var(--color-blue-050);
  --color-border: var(--color-gray-150);
  --color-primary: var(--color-blue-500);
  --color-primary-hover: var(--color-blue-600);
  --color-text: var(--color-gray-900);
  --color-text-muted: var(--color-gray-500);
  --max-width: 1180px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 14px;
  --shadow-sm: 0 2px 4px rgba(0,0,0,.4);
  --shadow-md: 0 4px 16px rgba(0,0,0,.35);
  --font-display: 'Segoe UI', 'Inter', system-ui, Arial, sans-serif;
  --font-body: 'Inter', 'Segoe UI', system-ui, Arial, sans-serif;
}
* { box-sizing: border-box; }
html, body { margin:0; padding:0; font-family: var(--font-body); background: var(--color-bg); color: var(--color-text); -webkit-font-smoothing: antialiased; }
body { line-height:1.5; }
a { color: var(--color-primary); text-decoration:none; }
a:hover { color: var(--color-primary-hover); }
img { max-width:100%; display:block; }

/* Layout */
.wrapper { width:100%; margin:0 auto; max-width: var(--max-width); padding: 0 2rem; }
header.site-header {
  display:flex; align-items:center; justify-content:space-between; padding:1rem 2rem;
  background: #ffffff; /* solid white header */
  position:sticky; top:0; z-index:40;
  box-shadow: 0 4px 24px rgba(44,120,194,0.08), 0 2px 6px -2px rgba(0,0,0,.08);
  border-bottom: 1px solid var(--color-blue-100);
}
.brand { display:flex; align-items:center; gap:.75rem; }
.brand img {
  height:80px; width:auto;
  /* Make logo static: no hover animations */
  transition: none;
  filter: drop-shadow(0 2px 12px rgba(44,120,194,0.12));
}
/* Disable hover effects on the header logo */
.brand img:hover { transform: none; box-shadow: none; filter: drop-shadow(0 2px 12px rgba(44,120,194,0.12)); }
nav ul { list-style:none; margin:0; padding:0; display:flex; gap:1.25rem; }
nav a {
  padding:.55rem .9rem; border-radius: var(--radius-md); font-weight:500; font-size:.95rem; color: var(--color-gray-700);
  transition: none; /* no animated transitions */
  background: transparent; /* clean link background */
  border-bottom: 2px solid transparent; /* reserve space for underline */
}
nav a.active, nav a:hover {
  background: transparent; /* no background tint */
  color: var(--color-blue-900);
  border-bottom-color: var(--color-blue-600); /* underline highlight */
}
/* Contact as a primary CTA in the nav */
nav a.nav-cta {
  background: linear-gradient(90deg, var(--color-primary) 60%, var(--color-primary-hover) 100%);
  color:#fff;
  box-shadow: 0 2px 8px rgba(44,120,194,0.18);
  border-bottom: none; /* no underline on CTA */
}
nav a.nav-cta:hover, nav a.nav-cta.active {
  filter: brightness(1.10);
  color:#fff;
}

/* Hero */
.hero { padding: 4.5rem 0 3.5rem; position:relative; overflow:hidden; }
.hero-blue { background: linear-gradient(135deg, var(--color-blue-900), var(--color-blue-600)); color:#fff; }
.hero-blue h1, .hero-blue p, .hero-blue .lead { color:#fff; }
/* Generic background-image hero using a CSS variable for path */
.hero.hero-image {
  position:relative;
  /* Taller hero: more image visible across sizes */
  padding: clamp(7.25rem, 10vw, 9rem) 0 clamp(5.75rem, 8vw, 7.25rem);
  min-height: clamp(480px, 68vh, 800px);
}
.hero.hero-image:before {
  content:""; position:absolute; inset:0; z-index:0;
  background:
    linear-gradient(135deg, rgba(10, 44, 87, 0.65), rgba(31, 99, 168, 0.35)),
    var(--hero-bg-image, url("../../Smart Factory.png"));
  /* Use cover to avoid letterboxing/bands during resize */
  background-size: var(--hero-bg-size, cover);
  background-position: var(--hero-bg-position, right 30% top);
  background-repeat: no-repeat;
}
.hero.hero-image > * { position:relative; z-index:1; }
/* Solutions-specific background */
.hero.hero-image.hero-solutions {
  --hero-bg-image: url("../../Solutions.png");
  /* Match Home hero’s left/top bias and mobile zoom */
  --hero-bg-position: center 60%;
  --hero-bg-size: cover;
  --hero-bg-position-mobile: center 32%;
  --hero-bg-size-mobile: cover;
}
/* About-specific background */
.hero.hero-image.hero-about {
  --hero-bg-image: url("../../About Us.png");
  --hero-bg-position: center 40%;
  --hero-bg-size: cover;
  --hero-bg-position-mobile: center 40%;
  --hero-bg-size-mobile: cover;
}
@media (max-width: 768px){
  .hero.hero-image:before { background-position: var(--hero-bg-position-mobile, center 30%); background-size: var(--hero-bg-size-mobile, cover); }
}
@media (max-width: 768px){
  .hero.hero-image { background-position: center 30%; background-size: 100% auto; }
}
.hero.hero-image .hero-layout {
  grid-template-columns: 1fr;
}
.hero.hero-image .hero-visual { display:none; }
.hero.hero-image .hero-note { display:none; }
/* Home-specific background positioning (left/top bias) */
.hero.hero-image.hero-home {
  --hero-bg-position: left 18%;
  --hero-bg-size: cover;
  --hero-bg-position-mobile: center 32%;
  --hero-bg-size-mobile: cover;
}
.hero.hero-image.hero-contact {
  --hero-bg-image: url("../../Contact Us.png");
  --hero-bg-position: center 30%;
  --hero-bg-size: cover;
  --hero-bg-position-mobile: center 35%;
  --hero-bg-size-mobile: cover;
}
/* Ensure contact hero text reads clearly over the image */
.hero.hero-image.hero-contact h1 { color: #ffffff; }
.hero .hero-image-band {
  margin-top: clamp(1rem, 2.2vw, 1.8rem);
  border-radius: 18px;
  overflow:hidden;
  position:relative;
  background: transparent;
  box-shadow: 0 14px 40px -20px rgba(0,0,0,0.55);
}
.hero .hero-image-band img {
  display:block; width:100%; height:auto;
  /* Fade the top and bottom edges to blend with hero gradient */
  -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.75) 10%, rgba(0,0,0,1) 22%, rgba(0,0,0,1) 78%, rgba(0,0,0,0.75) 90%, rgba(0,0,0,0) 100%);
  mask-image: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.75) 10%, rgba(0,0,0,1) 22%, rgba(0,0,0,1) 78%, rgba(0,0,0,0.75) 90%, rgba(0,0,0,0) 100%);
}
.hero .hero-image-band:after {
  content:""; position:absolute; inset:0; pointer-events:none;
  /* gentle dark/brand tint so it sits well on a dark hero */
  background: radial-gradient(circle at 80% 20%, rgba(255,255,255,0.06), transparent 55%),
              linear-gradient(180deg, rgba(10,44,87,0.16), rgba(10,44,87,0.06) 24%, rgba(10,44,87,0.06) 76%, rgba(10,44,87,0.16));
}
@media (max-width:760px){
  .hero .hero-image-band { border-radius:14px; margin-top:1rem; }
}
.hero-grid { display:grid; grid-template-columns: repeat(auto-fit,minmax(320px,1fr)); gap:3rem; align-items:center; }
.hero h1 { font-family: var(--font-display); font-size:clamp(2.6rem,6.5vw,4.25rem); line-height:1.06; margin:0 0 1.25rem; font-weight:700; letter-spacing:.5px; }
.hero p.lead { font-size: clamp(1.1rem, 1.9vw, 1.35rem); color: rgba(255,255,255,.9); max-width:760px; }
.tagline-block { margin-bottom: .75rem; }
.mini-tag { background: rgba(255,255,255,.15); color:#fff; padding:.4rem .7rem; border-radius: 2rem; font-size:.6rem; letter-spacing:1.5px; font-weight:600; display:inline-block; }

/* Inline image band (used on Home and Solutions) */
/* Default: lighter border/shadow so it doesn't fight the layout */
.image-band {
  border:1px solid var(--color-blue-100);
  border-radius: 16px;
  overflow:hidden;
  box-shadow:0 4px 18px -12px rgba(10,44,87,0.18);
  background: var(--color-white);
  margin: clamp(1.2rem, 2.2vw, 1.8rem) 0; /* consistent breathing space */
}
.image-band img {
  display:block; width:100%; height:auto;
}

/* Variant: fade edges and add a subtle brand tint overlay for better integration */
.image-band.image-band--fade {
  position:relative;
  border-color: transparent; /* let it blend */
  box-shadow: none;
  background: transparent;
}
.image-band.image-band--fade img {
  /* Fade top/bottom edges to the page background using mask */
  -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.75) 10%, rgba(0,0,0,1) 18%, rgba(0,0,0,1) 82%, rgba(0,0,0,0.75) 90%, rgba(0,0,0,0) 100%);
  mask-image: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.75) 10%, rgba(0,0,0,1) 18%, rgba(0,0,0,1) 82%, rgba(0,0,0,0.75) 90%, rgba(0,0,0,0) 100%);
}
.image-band.image-band--fade:after {
  content:"";
  position:absolute; inset:0; pointer-events:none; border-radius:16px;
  background: linear-gradient(180deg, rgba(44,120,194,0.06), rgba(44,120,194,0.00) 35%, rgba(44,120,194,0.00) 65%, rgba(44,120,194,0.06));
}

/* Buttons */
.btn {
  --btn-bg: var(--color-primary); --btn-bg-hover: var(--color-primary-hover); --btn-color: #fff;
  cursor:pointer; display:inline-flex; align-items:center; gap:.55rem; border:none;
  border-radius: var(--radius-md); font-weight:600; font-size:.95rem;
  padding:.85rem 1.35rem;
  background: linear-gradient(90deg, var(--btn-bg) 60%, var(--btn-bg-hover) 100%);
  color: var(--btn-color);
  box-shadow: 0 2px 8px rgba(44,120,194,0.10);
  position:relative; text-decoration:none;
  transition: box-shadow 0.3s, filter 0.3s, background 0.3s;
}
/* Ensure button icons follow the button text color for consistent contrast */
.btn .fas,
.btn .far,
.btn .fab { color: currentColor; }
/* Override Font Awesome's fa-inverse (white) within buttons to follow text color */
.btn .fa-inverse { color: currentColor !important; }
.btn:hover {
  filter:brightness(1.10);
  box-shadow: 0 8px 32px rgba(44,120,194,0.18);
  background: linear-gradient(90deg, var(--color-blue-400) 60%, var(--color-blue-600) 100%);
} 
.btn.outline { background: transparent; border:1px solid var(--color-primary); color: var(--color-primary); }
.btn.outline:hover { background: var(--color-primary); color:#fff; }
.btn.primary { background: linear-gradient(var(--color-primary), var(--color-primary-hover)); }

/* Sections */
section { padding: 3.5rem 0; }
section.alt { background: var(--color-surface-alt); }
.content-block { background: var(--color-surface); border-top:1px solid var(--color-border); border-bottom:1px solid var(--color-border); }
.content-block.alt { background: var(--color-surface-alt); }
.wrapper.narrow { max-width:800px; }
.content-block h2 { font-size:2rem; margin:0 0 1rem; font-weight:650; }
.content-block p { font-size:1.02rem; line-height:1.55; }
.bullets { list-style:disc; padding-left:1.3rem; margin:1rem 0 0; }
.bullets li { margin:.5rem 0; font-size:.95rem; }
/* Staged steps */
.steps { counter-reset: step; list-style:none; margin:1.2rem 0 0; padding:0; display:grid; gap:1rem; position:relative; isolation:isolate; }
.steps li { position:relative; padding-left:3.2rem; background:rgba(255,255,255,0.6); border:1px solid var(--color-border); border-radius:12px; padding:.9rem .9rem .9rem 3.2rem; overflow:visible; min-height:64px; }
.steps li:before { counter-increment: step; content: counter(step); position:absolute; left:.9rem; top:.9rem; width:1.8rem; height:1.8rem; border-radius:50%; display:flex; align-items:center; justify-content:center; font:700 0.95rem 'Inter', system-ui; color:#0a2c57; background:#fff; border:2px solid var(--color-blue-300); box-shadow:0 2px 8px rgba(10,44,87,0.12); z-index:2; }
.steps li:after { content:""; position:absolute; left:1.8rem; top:2.9rem; bottom:-1rem; width:3px; background: linear-gradient(180deg, var(--color-blue-400), rgba(44,120,194,0.35)); z-index:1; }
.steps li:last-child:after { display:none; }
.steps:before { content:""; position:absolute; left:1.8rem; top:1.2rem; bottom:1.2rem; width:3px; background: var(--color-blue-300); opacity:.85; z-index:0; }
.steps h4 { margin:.1rem 0 .2rem; font-size:1.05rem; color:#0a2c57; }
.steps h4 .fas { color: var(--color-blue-600); font-size:1.05em; margin-right:.45rem; vertical-align:-2px; }

/* Icon-mode steps: replace numeric badges with icons (homepage teaser only) */
.steps.icons-mode { counter-reset: none; }
.steps.icons-mode li { padding-left:3.1rem; }
.steps.icons-mode li:before { 
  counter-increment: none; content: ""; font-size:0; color:transparent;
  display:flex; align-items:center; justify-content:center;
}
/* Provide icon via a nested element for accessibility */
.steps.icons-mode li .step-icon { 
  position:absolute; left:.9rem; top:.9rem; width:1.8rem; height:1.8rem; border-radius:50%; 
  display:flex; align-items:center; justify-content:center; z-index:3; 
  color: var(--color-blue-700);
}
.steps.icons-mode li .step-icon .fas { font-size:.95rem; line-height:1; }

/* Optional: different colors per step */
.steps.icons-mode li:nth-child(1) .step-icon { color: var(--color-blue-700); }
.steps.icons-mode li:nth-child(2) .step-icon { color: var(--color-blue-600); }
.steps.icons-mode li:nth-child(3) .step-icon { color: var(--color-blue-500); }
.steps p { margin:0; font-size:.95rem; color:var(--color-gray-700); }
.content-block.alt .steps li { background:rgba(255,255,255,0.92); }
.actions { margin-top:1.8rem; display:flex; gap:1rem; flex-wrap:wrap; }
.center-cta { text-align:center; margin-top:2.2rem; }

/* Cards */
.cards { display:grid; gap:1.75rem; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); }
.cards.one-col { grid-template-columns:1fr; }
.mt-lg { margin-top:1.75rem; }
.card {
  background: rgba(255,255,255,0.92);
  padding:1.35rem 1.25rem 1.4rem; border-radius: var(--radius-lg);
  position:relative; overflow:hidden;
  box-shadow: 0 4px 24px rgba(44,120,194,0.10), 0 2px 6px -2px rgba(0,0,0,.08);
  border:1px solid var(--color-blue-100);
  transition: box-shadow 0.3s, transform 0.3s;
}
.card.alt { background: var(--color-surface-alt); }
.card:hover {
  box-shadow: 0 8px 32px rgba(44,120,194,0.18);
  transform: translateY(-6px) scale(1.04);
  border-color: var(--color-blue-400);
}
.card h3 {
  margin:.2rem 0 .55rem;
  font-size:1.45rem;
  font-weight:700;
  color: var(--color-gray-900);
  letter-spacing: .5px;
}
.card p { margin:0 0 .65rem; font-size:.88rem; color: var(--color-gray-700); }
.card ul { margin:.4rem 0 0; padding-left:1.1rem; }
.card ul li { font-size:.85rem; margin:.3rem 0; color: var(--color-text-muted); }

/* Solutions page cards emphasis */
.solutions-cards .card h3 {
  font-size:1.15rem;
  color: var(--color-blue-900);
  font-weight:700;
  letter-spacing:.4px;
  padding-bottom:.35rem;
  position:relative;
}
.solutions-cards .card h3:after {
  content:"";
  position:absolute;
  left:0; bottom:0;
  width:42px; height:3px;
  background: linear-gradient(90deg, var(--color-blue-500), var(--color-blue-700));
  border-radius:2px;
  opacity:.95;
}
.solutions-cards .card h3 .fas { color: var(--color-blue-600); margin-right:.45rem; font-size:1.1em; vertical-align:-2px; }
.solutions-cards .card p strong { color: var(--color-blue-700); }

/* Solutions: compact feature lists */
.solutions-cards .feature-list { list-style:none; margin:.5rem 0 0; padding:0; }
.solutions-cards .feature-list li { display:flex; align-items:flex-start; gap:.5rem; font-size:.9rem; color:var(--color-gray-700); margin:.3rem 0; }
.solutions-cards .feature-list li .fas { color:var(--color-blue-500); margin-top:.15rem; }

/* Solutions: outcome line with subtle icon */
.solutions-cards .outcome { margin:.7rem 0 0; font-size:.9rem; color:var(--color-gray-700); }
.solutions-cards .outcome .fas { color:var(--color-blue-600); margin-right:.4rem; }
.solutions-cards .outcome strong { color:var(--color-blue-800); }

/* Founder’s Story highlight */
.card.founder {
  background:#ffffff;
  border:1px solid var(--color-blue-100);
  box-shadow:0 10px 36px -10px rgba(10,44,87,0.22), 0 2px 10px -4px rgba(10,44,87,0.12);
}
.card.founder h2 {
  font-size:1.75rem;
  letter-spacing:.6px;
  margin-top:0;
  position:relative;
  padding-top:.4rem;
}
.card.founder h2:before {
  content:"";
  position:absolute;
  left:0; top:0;
  width:56px; height:4px;
  background:linear-gradient(90deg,var(--color-blue-500),var(--color-blue-700));
  border-radius:2px;
}
.card.founder p { font-size:1rem; line-height:1.65; color: var(--color-gray-700); }
.card.founder p .signature { display:inline-block; margin-top:.6rem; font-weight:700; color: var(--color-blue-800); }
.card.founder h2 .fas { font-size:1.25em; margin-right:.45rem; vertical-align:-2px; }

/* Founder row band separation */
.founder-row {
  background: radial-gradient(circle at 85% 15%, rgba(44,120,194,0.10), transparent 60%), var(--color-blue-050);
  border:1px solid var(--color-blue-100);
  padding:1.2rem;
  border-radius:18px;
  box-shadow:0 6px 24px -12px rgba(10,44,87,0.18);
}
@media (max-width:760px){
  .founder-row { padding:.9rem; border-radius:14px; }
}

/* Founder card layout with image placeholder */
.card.founder .founder-inner { display:grid; grid-template-columns: 1.4fr .9fr; gap:1.2rem; align-items:start; }
.card.founder .founder-content { min-width:0; }
.card.founder .founder-photo {
  align-self:stretch; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(145deg, var(--color-blue-050), #ffffff);
  border:1px solid var(--color-blue-100);
  border-radius:14px;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.65), 0 4px 16px -6px rgba(10,44,87,0.18);
  position:relative; overflow:hidden;
}
.card.founder .founder-photo:before {
  content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(circle at 70% 20%, rgba(44,120,194,0.14), transparent 60%);
}
.card.founder .founder-photo .ph-inner { text-align:center; color:var(--color-blue-700); }
.card.founder .founder-photo .ph-inner .fas { font-size:2.4rem; color:var(--color-blue-600); filter:drop-shadow(0 4px 10px rgba(10,44,87,0.25)); }
.card.founder .founder-photo .ph-inner p { margin:.5rem 0 0; font-size:.8rem; color:var(--color-gray-500); }
@media (max-width: 960px){
  .card.founder .founder-inner { grid-template-columns:1fr; }
  .card.founder .founder-photo { order:2; }
}

/* Value list */
.values { display:grid; gap:1.5rem; grid-template-columns: repeat(auto-fit,minmax(220px,1fr)); margin-top:1.5rem; }
.value { background: var(--color-panel); padding:1.25rem 1.1rem 1.35rem; border-radius: var(--radius-md); box-shadow: var(--shadow-sm); }
.value h4 { margin:.1rem 0 .5rem; font-size:1.05rem; }
.value p { margin:0; font-size:.85rem; color: var(--color-text-muted); }

/* Contact form */
form.contact { max-width:600px; display:grid; gap:1.1rem; }
form.contact label { font-size:.8rem; text-transform:uppercase; letter-spacing:1px; font-weight:600; color: var(--color-text-muted); }
form.contact input, form.contact textarea { width:100%; padding:.85rem 1rem; background: var(--color-white); border:1px solid var(--color-border); border-radius: var(--radius-sm); color: var(--color-text); font:inherit; }
form.contact textarea { resize:vertical; min-height:140px; }
form.contact input:focus, form.contact textarea:focus { outline:2px solid var(--color-primary); outline-offset:2px; }
/* Visual marker for required fields */
form.contact label .req { color:#c03737; margin-left:.25rem; font-weight:700; }

/* Contact Grid Layout */
.contact-grid { display:grid; grid-template-columns: 380px 1fr; gap:2.2rem; align-items:start; }
@media (max-width: 980px){ .contact-grid { grid-template-columns:1fr; } }
.contact-info-panel .contact-points { list-style:none; padding:0; margin:1.1rem 0 0; display:flex; flex-direction:column; gap:1rem; }
.contact-points li { display:flex; align-items:center; gap:.75rem; font-size:.95rem; }
.contact-points li .icon { width:34px; height:34px; display:inline-flex; align-items:center; justify-content:center; background:linear-gradient(145deg,var(--color-blue-500),var(--color-blue-700)); color:#fff; border-radius:10px; font-size:.95rem; box-shadow:0 4px 12px -2px rgba(10,44,87,0.45); }
.contact-points a { font-weight:600; color:var(--color-blue-900); }
.contact-points a:hover { color:var(--color-blue-600); }
.vcard-block { margin-top:auto; }
.vcard-block .btn.outline { background:rgba(255,255,255,0.6); backdrop-filter:blur(4px); }
.vcard-block .btn.outline:hover { background:linear-gradient(90deg,var(--color-blue-100),var(--color-blue-400)); color:var(--color-blue-900); }

/* Footer */
footer.site-footer {
  margin-top:4rem; padding:2.5rem 0 3rem;
  background: linear-gradient(180deg, #ffffff 0%, var(--color-blue-050) 100%);
  font-size:.8rem; color: var(--color-gray-700);
  box-shadow: 0 -4px 24px rgba(44,120,194,0.08);
  border-top:1px solid var(--color-border);
}
footer h4 { margin:0 0 .85rem; font-size:1.15rem; line-height:1.2; text-transform:uppercase; letter-spacing:1.5px; font-weight:700; color: var(--color-blue-900); }
footer a { color: var(--color-blue-700); text-decoration: none; }
footer a:not(.btn):hover { color: var(--color-blue-900); text-decoration: underline; text-underline-offset: 0.15em; text-decoration-thickness: 2px; }
.copyright { margin-top:2rem; text-align:center; opacity:.6; color: var(--color-gray-500); }

/* Make footer content span full width */
.site-footer .wrapper { max-width: min(1280px, 100%); width:100%; padding-left: clamp(1rem, 4vw, 3rem); padding-right: clamp(1rem, 4vw, 3rem); margin:0 auto; }

/* Footer grid */
.footer-grid { display:grid; width:100%; grid-template-columns: repeat(auto-fit,minmax(220px,1fr)); gap:1.5rem; align-items:start; justify-items:start; margin-left:0; margin-right:0; }
.footer-logo { display:block; max-width: clamp(240px, 28vw, 380px); height:auto; margin-bottom:1rem; }
@media (min-width: 1280px){
  .footer-logo { max-width: 420px; }
}
.footer-col { min-width:0; }
.footer-col, .footer-col * { text-align:left; }
.footer-links, .footer-contact { list-style:none; margin:.25rem 0 0; padding:0; display:flex; flex-direction:column; gap:.5rem; }
.footer-col .btn { margin-top:.6rem; }
.footer-col > *:first-child { margin-top:0; }
.footer-col > * + * { margin-top:.6rem; }
.footer-links li a { display:inline-flex; align-items:center; gap:.5rem; font-weight:600; }
.footer-links li a .fas { font-size:.9rem; }
.footer-contact li { display:flex; align-items:center; gap:.6rem; }
.footer-contact .fas { width:18px; text-align:center; color: var(--color-blue-600); }
.footer-col small { opacity:.75; }

/* Footer buttons on dark background */
.site-footer .btn.outline {
  border-color: var(--color-primary);
  color: var(--color-primary);
  background: transparent;
  box-shadow: none;
  transition: box-shadow .3s, filter .3s, background .3s, border-color .3s, color .3s;
}
.site-footer .btn.outline:hover {
  background: var(--color-primary);
  color: #ffffff;
  border-color: var(--color-primary-hover);
}
.site-footer .btn.outline .fas { color: currentColor; }
.site-footer .btn.outline:hover .fas { color: currentColor; }
.site-footer .btn.outline:focus-visible { outline:2px solid var(--color-blue-600); outline-offset:2px; }
/* Footer: force three columns to spread across on desktop */
@media (min-width: 1024px){
  .footer-grid {
    grid-template-columns: 1fr 1fr 1fr;
    justify-content: center;
    justify-items: start;
    column-gap: 3rem;
    row-gap: 2rem;
  }
}

/* Animations */
@keyframes icon-bounce {
  0% { transform: translateY(0); }
  100% { transform: translateY(-8px); }
}
@keyframes icon-glow {
  0% { filter: drop-shadow(0 0 0px #f7ca18); }
  100% { filter: drop-shadow(0 0 12px #f7ca18); }
}

/* Demo Dashboard */
.demo-dashboard { 
  width:100%; max-width:520px; margin:0 auto; display:flex; flex-direction:column; gap:0.9rem;
  background: linear-gradient(145deg, rgba(255,255,255,0.18), rgba(255,255,255,0.05));
  padding:1rem 1rem 1.2rem; border:1px solid rgba(255,255,255,0.35); border-radius:20px;
  backdrop-filter: blur(10px); position:relative; box-shadow:0 4px 28px -4px rgba(10,44,87,0.45),0 2px 8px rgba(10,44,87,0.25);
}
.demo-dashboard:before {content:""; position:absolute; inset:0; border-radius:20px; pointer-events:none; background:radial-gradient(circle at 85% 15%, rgba(255,255,255,0.35), transparent 60%);} 
.db-row { display:flex; gap:.9rem; width:100%; }
.db-row.top .db-card { flex:1; }
.db-card { background:rgba(255,255,255,0.82); border:1px solid rgba(255,255,255,0.55); border-radius:14px; padding:.75rem .9rem .85rem; position:relative; overflow:hidden; box-shadow:0 2px 8px rgba(10,44,87,0.20); }
.db-card:after { content:""; position:absolute; inset:0; background:linear-gradient(140deg,rgba(44,120,194,0.12),transparent 60%); opacity:.7; pointer-events:none; }
.db-card.kpi { text-align:left; }
.kpi-label { font:600 11px 'Inter', system-ui; letter-spacing:1px; text-transform:uppercase; color:#2f3944; opacity:.75; }
.kpi-value { font:700 28px 'Inter', system-ui; color:#0a2c57; margin:.15rem 0 .15rem; }
.kpi-trend { font:600 12px 'Inter', system-ui; }
.kpi-trend.up { color:#0d8f4b; }
.kpi-trend.down { color:#c03737; }
.db-row.mid .large { flex:1; min-height:150px; }
.card-title { font:600 12px 'Inter', system-ui; letter-spacing:.5px; color:#2f3944; text-transform:uppercase; margin-bottom:.4rem; }
.chart-lines { position:relative; width:100%; height:100px; overflow:hidden; }
.chart-lines .line { position:absolute; left:0; width:100%; height:100%; background: repeating-linear-gradient(90deg, rgba(44,120,194,0), rgba(44,120,194,0) 12%, rgba(44,120,194,.15) 13%, rgba(44,120,194,.15) 14%); mask:linear-gradient(to right, transparent, #000 8%, #000 92%, transparent); }
.chart-lines .line.l2 { filter:brightness(1.3) saturate(1.2); mix-blend-mode:multiply; animation: slideLines 9s linear infinite; }
.chart-lines .line.l3 { filter:opacity(.3); animation: slideLines 14s linear infinite reverse; }
@keyframes slideLines { 0% { transform:translateX(0); } 100% { transform:translateX(-50%); } }
.db-row.bottom { display:flex; }
.db-row.bottom .db-card { flex:1; display:flex; flex-direction:column; }
.bars-list { list-style:none; margin:.2rem 0 0; padding:0; display:flex; flex-direction:column; gap:.55rem; }
.bars-list li { position:relative; font:500 11px 'Inter', system-ui; letter-spacing:.4px; color:#2f3944; }
.bars-list li span { display:block; background:linear-gradient(90deg,#2c78c2,#0a2c57); height:16px; border-radius:8px; position:relative; width:var(--w); box-shadow:0 2px 6px -1px rgba(10,44,87,0.45); }
.mini-bar-group { display:flex; align-items:flex-end; gap:.4rem; height:100%; padding-top:.4rem; }
.mini-bar-group span { width:14px; background:linear-gradient(180deg,#4b94d6,#15508f); border-radius:6px; height:var(--h); min-height:18px; box-shadow:0 2px 6px -1px rgba(10,44,87,0.45); animation: grow 3s ease-in-out infinite alternate; }
.mini-bar-group span:nth-child(odd){ animation-duration:4s; }
@keyframes grow { 0% { transform:scaleY(.7); } 100% { transform:scaleY(1); } }
.radial-wrap { display:flex; justify-content:center; align-items:center; flex:1; }
.radial-chart { width:100px; height:100px; }
.radial-chart .bg { fill:none; stroke:#e6f2fb; stroke-width:10; }
.radial-chart .fg { fill:none; stroke:#2c78c2; stroke-width:10; stroke-linecap:round; transform:rotate(-90deg); transform-origin:50% 50%; filter:drop-shadow(0 4px 8px rgba(44,120,194,0.45)); }
.radial-chart .val { font:600 18px 'Inter', system-ui; fill:#0a2c57; }
@media (max-width: 960px){
  .hero .wrapper[style] { grid-template-columns:1fr; }
  .demo-dashboard { max-width:100%; }
  .laptop-shell { max-width:100%; }
  .laptop-lid { padding:14px 14px 18px; }
}
@media (max-width: 720px) {
  nav ul { gap:.5rem; }
  .hero { padding:4rem 0 3rem; }
  .hero-grid { gap:2.2rem; }
  header.site-header { flex-wrap:wrap; gap:1rem; }
  .monitor-bezel { padding:14px 14px 22px; }
  .monitor-stand .stem { height:50px; }
  .monitor-stand .base { width:180px; }
}

/* Mobile-specific hero typography adjustments (keep desktop unchanged) */
@media (max-width: 640px) {
  .hero h1 { font-size: clamp(1.9rem, 7.8vw, 2.4rem); line-height: 1.12; }
  .hero p.lead { font-size: clamp(1rem, 3.8vw, 1.12rem); max-width: 92%; }
}

/* Mobile navigation: hamburger toggle and dropdown menu */
.nav-toggle { display:none; }
@media (max-width: 820px) {
  header.site-header { position: sticky; top: 0; z-index: 60; }
  .nav-toggle {
    display: inline-flex; align-items: center; justify-content: center;
    width: 42px; height: 42px; border-radius: 10px; border: 1px solid var(--color-blue-100);
    background: #fff; color: var(--color-blue-900);
    box-shadow: 0 2px 10px rgba(10,44,87,0.08);
    cursor: pointer; margin-left: auto;
  }
  .nav-toggle:focus-visible { outline: 2px solid var(--color-blue-600); outline-offset: 3px; }
  .nav-toggle .fas { font-size: 1.1rem; }

  /* Position nav as a dropdown under header */
  header.site-header { display: flex; align-items: center; }
  header.site-header nav { position: absolute; left: 0; right: 0; top: 100%; background: #fff; border-bottom: 1px solid var(--color-blue-100); box-shadow: 0 10px 28px -8px rgba(10,44,87,0.15); }
  header.site-header nav ul { flex-direction: column; gap: 0; padding: .4rem; }
  header.site-header nav li { width: 100%; }
  header.site-header nav a { display: block; width: 100%; padding: .9rem 1rem; border-radius: 10px; }
  header.site-header nav a.active, header.site-header nav a:hover { border-bottom-color: transparent; background: var(--color-blue-050); }

  /* Hidden by default on mobile */
  header.site-header nav { display: none; }
  header.site-header.is-nav-open nav { display: block; }

  /* Header layout: brand + toggle row; nav dropdown beneath */
  header.site-header .brand { flex: 1 1 auto; }
}

/* Laptop Frame */
.laptop-shell { position:relative; width:100%; max-width:780px; margin:0 auto; }
.laptop-lid { position:relative; background:linear-gradient(135deg,#0d1f33,#1e426a); padding:18px 18px 22px; border-radius:26px 26px 18px 18px; box-shadow:0 22px 48px -12px rgba(10,44,87,0.55),0 8px 28px -6px rgba(10,44,87,0.35); border:2px solid #153450; }
.laptop-bezel { position:relative; aspect-ratio:16/9; background:#0a1c2d; border-radius:16px; overflow:hidden; box-shadow:inset 0 0 0 1px #1c3b5d, inset 0 0 22px -6px rgba(0,0,0,0.75); }
.laptop-camera { width:12px; height:12px; background:#253f5f; border-radius:50%; position:absolute; top:10px; left:50%; transform:translateX(-50%); box-shadow:0 0 0 4px #102a44, 0 0 5px 2px rgba(44,120,194,0.35); }
.screen-glare { position:absolute; inset:0; background:linear-gradient(25deg, rgba(255,255,255,0.18), rgba(255,255,255,0) 40%); mix-blend-mode:overlay; pointer-events:none; }
.laptop-hinge { width:60%; height:10px; margin:0 auto; background:linear-gradient(90deg,#102a44,#204e7d,#102a44); border-radius:0 0 10px 10px; box-shadow:0 4px 10px -2px rgba(10,44,87,0.5); position:relative; top:-4px; }
.laptop-base { position:relative; height:46px; background:linear-gradient(180deg,#183854,#091724); margin:0 4% 0; border-radius:0 0 24px 24px; box-shadow:0 18px 36px -10px rgba(10,44,87,0.55), inset 0 0 0 1px #12324d; display:flex; justify-content:center; }
.laptop-base:before { content:""; position:absolute; top:6px; width:82%; height:10px; left:50%; transform:translateX(-50%); background:linear-gradient(90deg,#204e7d,#0d1f33); border-radius:6px; filter:blur(.5px); opacity:.65; }
.base-shadow { position:absolute; bottom:-24px; width:70%; height:32px; left:50%; transform:translateX(-50%); background:radial-gradient(circle at 50% 0%, rgba(10,44,87,0.55), transparent 70%); filter:blur(6px); }
.laptop-bezel .demo-dashboard { height:100%; display:flex; flex-direction:column; }
/* Remove old monitor classes if present (kept inert) */
.monitor-frame, .monitor-bezel, .monitor-stand { display:none; }
/* Dashboard adjustments (no large trend) */
.db-row.mid.alt-mini { display:flex; gap:.9rem; }
.db-row.mid.alt-mini .db-card { flex:1; }
.bars-list.mini li span { height:14px; }
.mini-bar-group.compact span { width:12px; }
.db-card.note { display:flex; flex-direction:column; justify-content:flex-start; }
.db-row.bottom .db-card.note { flex:1; }
/* Laptop keyboard / realism enhancements */
.laptop-base { position:relative; }
.laptop-base:after { content:""; position:absolute; top:8px; left:50%; transform:translateX(-50%); width:78%; height:54%; background:repeating-linear-gradient(90deg, #142e49, #142e49 34px, #123248 34px, #123248 36px), repeating-linear-gradient(180deg, rgba(255,255,255,0.04), rgba(255,255,255,0.04) 18px, rgba(255,255,255,0) 18px, rgba(255,255,255,0) 20px); background-blend-mode:overlay; border-radius:8px; box-shadow:inset 0 0 4px rgba(0,0,0,0.55); opacity:.55; }
.laptop-base .trackpad { position:absolute; bottom:6px; left:50%; transform:translateX(-50%); width:160px; height:70px; background:linear-gradient(145deg,#153450,#1e4c74); border-radius:10px; box-shadow:inset 0 0 0 1px #1c3b5d, 0 2px 6px -2px rgba(10,44,87,0.6); }
.laptop-shell .laptop-base { display:flex; align-items:flex-end; justify-content:center; }
/* Insert trackpad element dynamically via pseudo if needed */
.laptop-base { --has-trackpad:1; }
.laptop-base[--has-trackpad]::before { content:""; }

/* Enhanced Laptop Realism */
.laptop-shell.realistic { perspective:1800px; perspective-origin:50% 120%; }
.laptop-shell.realistic .laptop-lid { transform-style:preserve-3d; position:relative; }
.laptop-shell.realistic .laptop-lid:after { content:""; position:absolute; inset:0; border-radius:inherit; background:radial-gradient(circle at 30% 15%, rgba(255,255,255,0.18), transparent 60%), linear-gradient(140deg, rgba(255,255,255,0.08), rgba(255,255,255,0)); mix-blend-mode:overlay; pointer-events:none; }
.laptop-bezel { background:linear-gradient(#050b11,#0b1a29); }
.laptop-bezel:after { content:""; position:absolute; inset:0; border-radius:inherit; box-shadow:inset 0 0 14px -2px rgba(0,0,0,0.9), inset 0 0 0 1px #1a3a5b; pointer-events:none; }
.laptop-camera { background:#1b3856; box-shadow:0 0 0 4px #102a44, 0 0 5px 2px rgba(44,120,194,0.25), inset 0 0 4px rgba(0,0,0,0.8); display:flex; align-items:center; justify-content:center; }
.laptop-camera .camera-led { width:4px; height:4px; border-radius:50%; background:#1e2f3d; position:relative; box-shadow:0 0 0 2px #0e2235; }
.laptop-camera.active .camera-led { background:#3cff7a; box-shadow:0 0 6px 2px rgba(60,255,122,0.75); }
.screen-glare { background:linear-gradient(25deg, rgba(255,255,255,0.15), rgba(255,255,255,0) 40%), radial-gradient(circle at 80% 90%, rgba(255,255,255,0.07), transparent 60%); mix-blend-mode:screen; }
.laptop-hinge { background:linear-gradient(90deg,#06131f,#1d466e,#06131f); box-shadow:0 4px 16px -4px rgba(0,0,0,0.7); }
.laptop-base { background:linear-gradient(180deg,#12324d,#0a1e31); position:relative; overflow:hidden; }
.laptop-base:after { backdrop-filter:blur(1px); }
.laptop-base:before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 50% 0%, rgba(255,255,255,0.05), transparent 70%); pointer-events:none; }
.laptop-base .keyboard { position:absolute; top:6px; left:50%; transform:translateX(-50%); width:86%; height:58%; display:grid; grid-template-columns:repeat(30,1fr); grid-auto-rows:14px; gap:3px 2px; padding:6px 12px 10px; border-radius:10px; background:linear-gradient(145deg,#0d2233,#12354f); box-shadow:inset 0 0 0 1px #162f46, 0 2px 6px -2px rgba(0,0,0,0.7); }
.laptop-base .keyboard:before { content:""; position:absolute; inset:3px 4px 4px; background:repeating-linear-gradient(90deg, rgba(255,255,255,0.04) 0 6px, transparent 6px 12px); opacity:.35; border-radius:6px; pointer-events:none; }
.laptop-base .keyboard:after { content:""; position:absolute; inset:0; border-radius:inherit; box-shadow:inset 0 0 8px -2px rgba(255,255,255,0.25); pointer-events:none; }
/* Generate key caps via shadows */
.laptop-base .keyboard { --key-color:#1d3a52; --key-shadow:0 2px 3px -1px rgba(0,0,0,0.8), inset 0 0 0 1px #254760, inset 0 2px 4px rgba(255,255,255,0.05); }
.laptop-base .keyboard div { display:none; }
.laptop-base .keyboard { position:relative; }
.laptop-base .keyboard:before, .laptop-base .keyboard:after { z-index:2; }
/* Pseudo keys */
.laptop-base .keyboard { --rows:5; --cols:30; }
.laptop-base .keyboard { background-image:linear-gradient(145deg,#0d2233,#12354f); }
.laptop-base .keyboard:after { background:linear-gradient(180deg,rgba(255,255,255,0.05),rgba(255,255,255,0)); }
/* Trackpad refinement */
.laptop-base .trackpad { position:absolute; bottom:6px; left:50%; transform:translateX(-50%); width:160px; height:70px; background:linear-gradient(145deg,#153450,#1e4c74); border-radius:10px; box-shadow:inset 0 0 0 1px #1c3b5d, 0 2px 10px -3px rgba(0,0,0,0.8); }
.laptop-shell.realistic:hover .laptop-lid { transform:translateY(-2px); }
.laptop-shell.realistic:hover .screen-glare { opacity:.95; }
.laptop-shell.realistic { transition:transform .6s cubic-bezier(.22,.68,.26,1); }
.laptop-shell.realistic:active { transform:scale(.985); }
/* Subtle parallax tilt on mouse move */
.laptop-shell.realistic { --rx:0deg; --ry:0deg; }
.laptop-shell.realistic .laptop-lid { transform:rotateX(var(--rx)) rotateY(var(--ry)); transition:transform .4s ease; }
@media (hover:hover) { .laptop-shell.realistic[data-tilt="on"] .laptop-lid { will-change:transform; } }

/* Board image fallback */
.board-image-wrapper { position:relative; }
.board-image-wrapper img.board-loaded { animation: boardFadeIn .9s ease forwards; }
@keyframes boardFadeIn { from { filter:blur(8px) brightness(.6); transform:scale(1.02); opacity:0; } to { filter:blur(0) brightness(1); transform:scale(1); opacity:1; } }
.board-fallback { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; background:repeating-linear-gradient(45deg,#16293a,#16293a 12px,#132230 12px,#132230 24px); color:#fff; padding:1rem; text-align:center; font:500 12px 'Inter',system-ui; border-radius:18px; opacity:0; pointer-events:none; transition:opacity .4s; }
.board-fallback.visible { opacity:1; pointer-events:auto; }
.board-fallback .fallback-inner { max-width:260px; }
.board-fallback code { background:rgba(255,255,255,0.08); padding:.15rem .4rem; border-radius:4px; font-size:.6rem; }

/* Factory Board (dark tile layout) */
.factory-board { 
  display:grid; 
  grid-template-columns: repeat(3, 1fr); 
  grid-auto-rows: 110px; 
  gap:14px; 
  background:#111519; 
  border:1px solid rgba(255,255,255,0.08); 
  padding:18px 20px 22px; 
  border-radius:18px; 
  box-shadow:0 4px 28px -4px rgba(0,0,0,0.6), 0 2px 10px rgba(0,0,0,0.35); 
  position:relative; 
  font-family: 'Inter', system-ui; 
}
.factory-board:before { content:""; position:absolute; inset:0; border-radius:18px; pointer-events:none; background:linear-gradient(145deg, rgba(255,255,255,0.08), rgba(255,255,255,0) 60%); }
.factory-board .board-tile { 
  background:#1c2024; 
  border:1px solid #2a2f33; 
  border-radius:10px; 
  padding:10px 12px 12px; 
  display:flex; 
  flex-direction:column; 
  justify-content:space-between; 
  position:relative; 
  box-shadow:0 2px 6px rgba(0,0,0,0.45), inset 0 0 0 1px rgba(255,255,255,0.02); 
}
.factory-board .board-tile.logo { 
  align-items:center; 
  justify-content:center; 
  background:#111519; 
  border:1px solid #1e2428; 
  box-shadow:none; 
}
.factory-board .board-tile.logo .board-logo { max-width:120px; width:100%; filter:drop-shadow(0 4px 12px rgba(0,0,0,0.6)); }
.factory-board .board-tile.logo .tagline { font-size:.55rem; letter-spacing:1.4px; font-weight:600; color:#d0d7dd; margin-top:.4rem; }
.factory-board .board-tile.date { background:#111519; border:1px solid #1e2428; }
.factory-board .board-tile.date .value { font-size:1.65rem; font-weight:600; letter-spacing:.5px; color:#e6e9ec; }
.factory-board .board-tile.date .value:after { content:"Date"; display:block; font-size:.7rem; margin-top:.25rem; font-weight:500; color:#f18417; letter-spacing:.5px; }
.factory-board .board-tile .value { font-size:2.15rem; font-weight:600; color:#e6e9ec; line-height:1; }
.factory-board .board-tile .value.big { font-size:2.35rem; }
.factory-board .board-tile .label { font-size:.75rem; font-weight:600; letter-spacing:.4px; color:#f18417; }
.factory-board .board-tile.kpi { text-align:center; }
.factory-board .board-tile.kpi .value { margin-top:.15rem; }
.factory-board .board-tile.kpi .label { margin-top:auto; }
@media (max-width:960px){
  .factory-board { grid-template-columns: repeat(auto-fit, minmax(120px,1fr)); grid-auto-rows:100px; padding:14px 14px 18px; }
  .factory-board .board-tile .value { font-size:1.7rem; }
  .factory-board .board-tile .value.big { font-size:1.9rem; }
}
@media (max-width:640px){
  .factory-board { grid-template-columns: repeat(auto-fit, minmax(110px,1fr)); gap:10px; }
  .factory-board .board-tile { padding:8px 9px 10px; }
  .factory-board .board-tile .value { font-size:1.55rem; }
  .factory-board .board-tile .value.big { font-size:1.7rem; }
  .factory-board .board-tile.date .value { font-size:1.3rem; }
}

/* === Minimalist Homepage Redesign === */
.hero-minimal { padding:5rem 0 3.8rem; background:linear-gradient(130deg,var(--color-blue-900),var(--color-blue-600)); }
.hero-layout { display:grid; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); gap:3.5rem; align-items:center; }
.hero-minimal h1 { margin:0 0 1.2rem; font-size:clamp(2.6rem,6.8vw,4rem); line-height:1.06; font-weight:700; letter-spacing:.5px; text-shadow:0 2px 10px rgba(0,0,0,0.25); }
.hero-minimal .lead { font-size: clamp(1.05rem, 1.9vw, 1.35rem); max-width:760px; }
.hero-cta { margin-top:1.9rem; display:flex; gap:1rem; flex-wrap:wrap; }
.hero-note { margin-top:.9rem; font-size:.78rem; color:#e6f2fb; opacity:.72; }
.hero-visual { text-align:center; }

.home-min { background:var(--color-white); padding:3.8rem 0 4.6rem; }
.value-grid { display:grid; gap:2.2rem; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); align-items:start; }
.value-card { background:var(--color-white); border:1px solid var(--color-blue-100); border-radius:18px; padding:1.55rem 1.5rem 1.7rem; box-shadow:0 6px 28px -10px rgba(10,44,87,0.18),0 2px 10px -4px rgba(10,44,87,0.12); display:flex; flex-direction:column; gap:.85rem; position:relative; transition:box-shadow .35s, transform .35s, border-color .35s; }
.value-card:before { content:""; position:absolute; inset:0; border-radius:inherit; background:radial-gradient(circle at 85% 18%,rgba(44,120,194,0.12),transparent 60%); pointer-events:none; }
.value-card:hover { box-shadow:0 14px 38px -10px rgba(10,44,87,0.28); transform:translateY(-6px); border-color:var(--color-blue-400); }
.value-card h2 { margin:0; font-size:1.28rem; letter-spacing:.4px; font-weight:650; }
.value-card h2 .fas { color: var(--color-blue-700); margin-right:.5rem; font-size:1.15em; vertical-align:-2px; }
.value-card h3 { margin:.15rem 0 .25rem; font-size:.9rem; text-transform:uppercase; letter-spacing:1px; font-weight:600; color:var(--color-blue-700); }
.value-card p { margin:0; font-size:.9rem; line-height:1.55; color:var(--color-gray-700); }
.value-card ul { margin:.2rem 0 0; padding-left:1.05rem; }
.value-card ul li { font-size:.78rem; margin:.35rem 0; color:var(--color-gray-700); line-height:1.35; }
.value-card .mini-cta { margin-top:.9rem; }
.btn.small { padding:.55rem 1rem; font-size:.72rem; }

/* Balanced grid: equal heights and aligned footers */
.value-grid.balanced { align-items:stretch; }
.value-grid.balanced .value-card { height:100%; }
.value-grid.balanced .value-card .mini-cta { margin-top:auto; }

/* Reusable icon list for value cards */
.icon-list { list-style:none; margin:.4rem 0 0; padding:0; display:flex; flex-direction:column; gap:.35rem; }
.icon-list li { display:flex; align-items:flex-start; gap:.55rem; font-size:.9rem; color:var(--color-gray-700); }
.icon-list li .fas { color: var(--color-blue-600); margin-top:.15rem; }

/* Normalize promise accent inside balanced grid */
.value-card.promise {
  background: linear-gradient(145deg, #ffffff, var(--color-blue-050));
  border:1px solid var(--color-blue-100);
  box-shadow: 0 10px 36px -12px rgba(10,44,87,0.25), 0 2px 8px -2px rgba(10,44,87,0.15);
}
.value-card.promise h2 { display:flex; align-items:center; gap:.5rem; }
.value-card.promise h2 .fas { color: var(--color-blue-700); font-size:1.1em; }

/* Our Promise accent card */
.value-card.promise {
  background: linear-gradient(145deg, #ffffff, var(--color-blue-050));
  border:1px solid var(--color-blue-100);
  box-shadow: 0 10px 36px -12px rgba(10,44,87,0.25), 0 2px 8px -2px rgba(10,44,87,0.15);
}
.value-card.promise h2 { display:flex; align-items:center; gap:.5rem; }
.value-card.promise h2 .fas { color: var(--color-blue-700); font-size:1.1em; }
.promise-list { list-style:none; margin:.6rem 0 0; padding:0; display:flex; flex-direction:column; gap:.35rem; }
.promise-list li { display:flex; align-items:flex-start; gap:.5rem; font-size:.9rem; color:var(--color-gray-700); }
.promise-list li .fas { color: var(--color-blue-600); margin-top:.15rem; }
.value-card.promise .mini-cta { margin-top:1rem; }

/* Emphasize core value headings within Our Foundation */
.card.content-block.alt .value-grid .value-card h3 {
  font-size:1.05rem;
  color: var(--color-blue-900);
  font-weight:700;
  letter-spacing:.6px;
  position:relative;
  padding-bottom:.35rem;
}
.card.content-block.alt .value-grid .value-card h3:after {
  content:"";
  position:absolute;
  left:0; bottom:0;
  width:36px; height:3px;
  background: linear-gradient(90deg, var(--color-blue-500), var(--color-blue-700));
  border-radius:2px;
  opacity:.9;
}

.check-list, .bullet-tight { list-style:disc; }
.check-list li::marker { color:var(--color-blue-500); }

/* Deprecated chip list replaced by single feature-line */
/* .feature-chips { display:flex; flex-wrap:wrap; gap:.6rem; margin:3.1rem 0 0; } */
/* .chip { background:var(--color-blue-050); color:var(--color-blue-700); padding:.55rem .85rem; border-radius:2rem; font-size:.62rem; font-weight:600; letter-spacing:.5px; border:1px solid var(--color-blue-100); transition:background .3s, color .3s, box-shadow .3s; box-shadow:0 2px 6px -2px rgba(10,44,87,0.2); } */
/* .chip:hover { background:var(--color-blue-100); color:var(--color-blue-900); box-shadow:0 4px 14px -4px rgba(10,44,87,0.3); } */
.feature-line { margin:3.1rem 0 0; font-size:.7rem; letter-spacing:.5px; text-transform:uppercase; background:var(--color-blue-050); border:1px solid var(--color-blue-100); padding:.85rem 1.1rem; border-radius:14px; text-align:center; color:var(--color-blue-700); box-shadow:0 4px 18px -8px rgba(10,44,87,0.18); }
.feature-line p { margin:0; font-weight:600; }

.cta-band { margin:4.2rem 0 0; text-align:center; background:linear-gradient(145deg,var(--color-blue-900),var(--color-blue-600)); color:#fff; padding:3.1rem 2rem 3.4rem; border-radius:26px; position:relative; overflow:hidden; box-shadow:0 12px 42px -14px rgba(10,44,87,0.5); }
.cta-band:before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 75% 25%, rgba(255,255,255,0.18), transparent 60%); pointer-events:none; }
.cta-band h2 { margin:0 0 1rem; font-size:clamp(1.85rem,4.2vw,2.35rem); letter-spacing:.5px; }
.cta-band p { margin:0 0 1.85rem; font-size:.92rem; max-width:640px; margin-left:auto; margin-right:auto; line-height:1.5; color:rgba(255,255,255,0.9); }
.band-actions { display:flex; justify-content:center; gap:1rem; flex-wrap:wrap; }

/* Section header (used above Solutions overview) */
.section-header { margin:2.2rem 0 0.6rem; }
.section-header h2 { margin:0; font-size:1.45rem; font-weight:700; color: var(--color-blue-900); letter-spacing:.5px; display:flex; align-items:center; gap:.55rem; }
.section-header h2 .fas { color: var(--color-blue-700); font-size:1.15em; }
.section-header .sub { margin:.45rem 0 0; font-size:.92rem; color: var(--color-gray-700); }

/* Outline buttons on dark backgrounds: stronger contrast */
.hero-blue .btn.outline,
.cta-band .btn.outline {
  border-color: rgba(255,255,255,0.55);
  color: rgba(255,255,255,0.95);
  background: transparent;
  box-shadow: none; /* reduce visual noise */
}
.hero-blue .btn.outline:hover,
.cta-band .btn.outline:hover {
  background: rgba(255,255,255,0.14);
  color: #ffffff;
  border-color: rgba(255,255,255,0.85);
}
/* Accessible focus ring on dark backgrounds */
.hero-blue .btn.outline:focus-visible,
.cta-band .btn.outline:focus-visible {
  outline: 2px solid rgba(255,255,255,0.85);
  outline-offset: 2px;
}

/* Ensure primary buttons on dark sections keep original look */
.hero-blue .btn.primary,
.cta-band .btn.primary {
  background: linear-gradient(var(--color-primary), var(--color-primary-hover));
  color: #ffffff;
  border: none;
  box-shadow: 0 2px 8px rgba(44,120,194,0.10);
}
.hero-blue .btn.primary:hover,
.cta-band .btn.primary:hover {
  filter: brightness(1.10);
  box-shadow: 0 8px 32px rgba(44,120,194,0.18);
  background: linear-gradient(90deg, var(--color-blue-400) 60%, var(--color-blue-600) 100%);
}

/* Unify Home Get Started buttons (hero + teaser) */
.content-block .actions .btn.primary {
  background: linear-gradient(var(--color-primary), var(--color-primary-hover));
  color: #ffffff;
  border: none;
  box-shadow: 0 2px 8px rgba(44,120,194,0.10);
}
.content-block .actions .btn.primary:hover {
  filter: brightness(1.10);
  box-shadow: 0 8px 32px rgba(44,120,194,0.18);
  background: linear-gradient(90deg, var(--color-blue-400) 60%, var(--color-blue-600) 100%);
}

@media (max-width:900px){ .hero-layout { gap:2.4rem; } }
@media (max-width:760px){
  .value-grid { gap:1.6rem; }
  .hero-cta { flex-direction:column; align-items:flex-start; }
  .cta-band { padding:2.6rem 1.5rem 2.9rem; }
}
