
:root {
  --blue:#179AEB; --dark:#1E3F82; --lime:#8CC64B; --black:#050816; --white:#fff;
  --ink:#0f172a; --muted:#64748b; --line:#e2e8f0; --soft:#f8fafc; --sky:#EAF7FF; --radius:22px;
  --shadow:0 24px 70px rgba(15,23,42,.14);
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; font-family:Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; color:var(--ink); background:#fff; line-height:1.6; }
a { color:inherit; text-decoration:none; }
img { max-width:100%; display:block; }
.wrap { width:min(1280px, calc(100% - 40px)); margin-inline:auto; }
.topbar { background:linear-gradient(90deg,var(--dark),#0d255a); color:#dbeafe; font-size:14px; }
.topbar-inner { display:flex; justify-content:space-between; gap:16px; padding:8px 0; }
.topbar a { color:#fff; }
.site-header { position:sticky; top:0; z-index:50; background:rgba(255,255,255,.94); backdrop-filter:blur(14px); border-bottom:1px solid rgba(226,232,240,.8); }
.navbar { display:flex; align-items:center; justify-content:space-between; min-height:78px; gap:24px; }
.brand { display:flex; align-items:center; gap:12px; font-weight:800; letter-spacing:-.02em; white-space:nowrap; }
.brand-mark { width:48px; height:48px; display:grid; place-items:center; border-radius:15px; background:linear-gradient(135deg,var(--dark),var(--blue)); color:#fff; font-weight:900; box-shadow:0 12px 30px rgba(23,154,235,.25); position:relative; }
.brand-mark:after { content:""; position:absolute; right:-5px; top:-5px; width:16px; height:16px; border-radius:50%; background:var(--lime); border:3px solid #fff; }
.brand-text { font-size:22px; color:var(--dark); }
.brand-text strong { color:var(--blue); }
.nav { display:flex; align-items:center; gap:6px; }
.nav > a, .nav-link { border:0; background:transparent; padding:14px 10px; font:600 15px/1 Inter,Arial,sans-serif; color:#1f2937; cursor:pointer; display:flex; align-items:center; gap:5px; }
.nav > a:hover, .nav-link:hover { color:var(--blue); }
.nav-cta { margin-left:8px; padding:13px 18px; border-radius:999px; background:linear-gradient(135deg,var(--blue),var(--dark)); color:#fff; font-weight:800; box-shadow:0 12px 28px rgba(30,63,130,.22); }
.nav-item { position:relative; }
.mega { position:absolute; top:100%; left:50%; transform:translateX(-50%) translateY(14px); width:min(1080px,90vw); background:#fff; border:1px solid var(--line); box-shadow:var(--shadow); border-radius:24px; opacity:0; visibility:hidden; pointer-events:none; transition:.18s ease; overflow:hidden; }
.nav-item:hover .mega, .nav-item:focus-within .mega { opacity:1; visibility:visible; pointer-events:auto; transform:translateX(-50%) translateY(0); }
.mega-head { padding:20px 24px; background:linear-gradient(135deg,var(--dark),var(--blue)); color:#fff; display:flex; justify-content:space-between; gap:24px; }
.mega-head p { margin:0; color:#e0f2fe; max-width:580px; }
.mega-grid { display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:0; padding:14px; }
.mega ul { list-style:none; padding:0; margin:0; }
.mega li a { display:block; padding:10px 12px; border-radius:14px; }
.mega li a:hover { background:var(--sky); }
.mega span { display:block; font-weight:800; font-size:14px; color:#0f172a; }
.mega small { display:block; color:var(--muted); font-size:12px; line-height:1.35; margin-top:4px; }
.nav-toggle { display:none; border:1px solid var(--line); background:#fff; border-radius:12px; font-size:24px; padding:8px 12px; }
.hero { position:relative; overflow:hidden; background:linear-gradient(135deg,#f8fbff 0%, #eef8ff 55%, #f7fff0 100%); border-bottom:1px solid var(--line); }
.hero:before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 20% 18%, rgba(23,154,235,.18), transparent 30%), radial-gradient(circle at 84% 20%, rgba(140,198,75,.24), transparent 28%); }
.hero-inner { position:relative; display:grid; grid-template-columns:1.04fr .96fr; align-items:center; gap:52px; padding:76px 0; }
.eyebrow { display:inline-flex; align-items:center; gap:8px; padding:8px 12px; border-radius:999px; background:#fff; color:var(--dark); border:1px solid #dbeafe; font-weight:800; font-size:13px; box-shadow:0 8px 20px rgba(30,63,130,.08); }
.eyebrow:before { content:""; width:9px; height:9px; border-radius:50%; background:var(--lime); box-shadow:0 0 0 5px rgba(140,198,75,.14); }
h1 { font-size:clamp(42px,6vw,72px); line-height:.96; margin:20px 0 18px; letter-spacing:-.055em; color:#071222; }
h2 { font-size:clamp(30px,4vw,48px); line-height:1.05; letter-spacing:-.04em; margin:0 0 16px; color:#071222; }
h3 { line-height:1.15; margin:0 0 10px; color:#071222; }
p { color:#475569; margin:0 0 18px; }
.hero p.lead, .lead { font-size:20px; color:#334155; max-width:760px; }
.actions { display:flex; flex-wrap:wrap; gap:14px; margin-top:28px; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:14px 20px; border-radius:999px; font-weight:850; border:1px solid transparent; transition:.18s ease; }
.btn-primary { background:linear-gradient(135deg,var(--blue),var(--dark)); color:#fff; box-shadow:0 16px 36px rgba(23,154,235,.26); }
.btn-secondary { background:#fff; color:var(--dark); border-color:#bfdbfe; }
.btn-light { background:#fff; color:var(--dark); }
.btn:hover { transform:translateY(-2px); }
.hero-card { position:relative; }
.hero-card img { border-radius:32px; box-shadow:var(--shadow); border:1px solid rgba(255,255,255,.8); }
.stat-strip { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-top:-36px; position:relative; z-index:3; }
.stat-card { background:#fff; padding:20px; border-radius:20px; box-shadow:0 16px 40px rgba(15,23,42,.08); border:1px solid var(--line); }
.stat-card b { display:block; font-size:28px; color:var(--dark); }
.stat-card span { color:var(--muted); font-size:13px; font-weight:700; }
.section { padding:78px 0; }
.section.alt { background:var(--soft); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.section-head { display:flex; justify-content:space-between; gap:24px; align-items:end; margin-bottom:32px; }
.section-head p { max-width:680px; }
.grid { display:grid; gap:20px; }
.grid-2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
.grid-3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
.grid-4 { grid-template-columns:repeat(4,minmax(0,1fr)); }
.card { background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:24px; box-shadow:0 12px 34px rgba(15,23,42,.06); }
.card:hover { border-color:#bfdbfe; transform:translateY(-3px); transition:.18s ease; }
.icon { width:46px; height:46px; border-radius:16px; display:grid; place-items:center; background:linear-gradient(135deg,var(--sky),#f1ffe9); color:var(--dark); font-weight:900; margin-bottom:16px; }
.kicker { color:var(--blue); font-weight:900; text-transform:uppercase; letter-spacing:.09em; font-size:12px; }
.split { display:grid; grid-template-columns:.9fr 1.1fr; gap:44px; align-items:center; }
.feature-list { list-style:none; padding:0; margin:20px 0 0; display:grid; gap:12px; }
.feature-list li { display:flex; gap:12px; align-items:flex-start; padding:13px 14px; background:#fff; border:1px solid var(--line); border-radius:16px; }
.feature-list li:before { content:"✓"; flex:0 0 24px; height:24px; border-radius:50%; background:var(--lime); color:#fff; display:grid; place-items:center; font-weight:900; font-size:13px; }
.band { padding:62px 0; background:linear-gradient(135deg,var(--dark),#071222 64%,#0b3d6d); color:#fff; }
.band h2, .band h3 { color:#fff; } .band p { color:#cbd5e1; }
.logo-cloud { display:grid; grid-template-columns:repeat(6,1fr); gap:14px; }
.logo-pill { background:#fff; border:1px solid var(--line); padding:18px 14px; border-radius:18px; text-align:center; font-weight:900; color:var(--dark); box-shadow:0 12px 30px rgba(15,23,42,.05); }
.page-hero { background:linear-gradient(135deg,var(--dark),#0b2a68 52%,var(--blue)); color:#fff; padding:78px 0 48px; overflow:hidden; position:relative; }
.page-hero:after { content:""; position:absolute; width:420px; height:420px; border-radius:50%; background:rgba(140,198,75,.24); right:-120px; top:-140px; }
.page-hero .wrap { position:relative; z-index:1; display:grid; grid-template-columns:1.06fr .94fr; gap:42px; align-items:center; }
.page-hero h1 { color:#fff; max-width:860px; }
.page-hero p { color:#dbeafe; }
.page-hero img { border-radius:28px; box-shadow:0 24px 70px rgba(0,0,0,.24); }
.breadcrumb { font-size:14px; color:#c7e8ff; margin-bottom:14px; }
.breadcrumb a { color:#fff; font-weight:700; }
.check-grid { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:14px; margin-top:24px; }
.check { display:flex; gap:12px; background:#fff; border:1px solid var(--line); border-radius:16px; padding:16px; }
.check b { display:block; margin-bottom:2px; }
.check:before { content:""; margin-top:4px; width:12px; height:12px; flex:0 0 12px; border-radius:50%; background:var(--lime); box-shadow:0 0 0 5px rgba(140,198,75,.18); }
.process { counter-reset:step; }
.process .card { position:relative; padding-top:56px; }
.process .card:before { counter-increment:step; content:"0" counter(step); position:absolute; top:18px; left:22px; font-weight:950; color:var(--blue); font-size:22px; }
.faq details { background:#fff; border:1px solid var(--line); border-radius:18px; padding:18px 20px; margin-bottom:12px; }
.faq summary { cursor:pointer; font-weight:900; color:#0f172a; }
.contact-panel { display:grid; grid-template-columns:.85fr 1.15fr; gap:30px; }
.form { display:grid; gap:14px; }
.form input,.form textarea,.form select { width:100%; padding:14px 16px; border:1px solid #cbd5e1; border-radius:14px; font:inherit; }
.form textarea { min-height:140px; resize:vertical; }
.form button { border:0; cursor:pointer; }
.footer { background:#071222; color:#dbeafe; }
.footer-cta { display:flex; justify-content:space-between; gap:24px; align-items:center; padding:48px 0; border-bottom:1px solid rgba(255,255,255,.1); }
.footer-cta h2 { color:#fff; font-size:34px; }
.footer-cta p,.footer p { color:#a8b9d3; }
.footer-grid { display:grid; grid-template-columns:1.6fr repeat(4,1fr); gap:30px; padding:46px 0; }
.footer .brand-text { color:#fff; }
.footer h4 { color:#fff; margin:0 0 12px; }
.footer ul { list-style:none; padding:0; margin:0; display:grid; gap:8px; }
.footer li a { color:#cbd5e1; font-size:14px; }
.footer li a:hover { color:#fff; }
.footer-bottom { display:flex; justify-content:space-between; gap:18px; border-top:1px solid rgba(255,255,255,.1); padding:20px 0; color:#94a3b8; font-size:14px; }
.notice { background:#fff7ed; border:1px solid #fed7aa; color:#9a3412; padding:14px 18px; border-radius:16px; }
@media (max-width: 1040px) {
  .nav-toggle { display:block; }
  .nav { display:none; position:absolute; left:20px; right:20px; top:90px; background:#fff; border:1px solid var(--line); border-radius:22px; padding:16px; box-shadow:var(--shadow); align-items:stretch; flex-direction:column; max-height:calc(100vh - 120px); overflow:auto; }
  .nav.is-open { display:flex; }
  .nav-item { position:static; } .nav-link { width:100%; justify-content:space-between; }
  .mega { position:static; opacity:1; visibility:visible; pointer-events:auto; transform:none; width:auto; box-shadow:none; border-radius:16px; display:none; margin:4px 0 10px; }
  .nav-item.is-open .mega { display:block; }
  .mega-grid { grid-template-columns:repeat(2,1fr); }
  .hero-inner,.page-hero .wrap,.split,.contact-panel { grid-template-columns:1fr; }
  .stat-strip,.grid-4,.logo-cloud { grid-template-columns:repeat(2,1fr); }
  .grid-3 { grid-template-columns:repeat(2,1fr); }
  .footer-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width: 680px) {
  .wrap { width:min(100% - 28px, 1280px); }
  .topbar-inner,.footer-cta,.footer-bottom,.section-head { flex-direction:column; align-items:flex-start; }
  .hero-inner { padding:48px 0; }
  .stat-strip,.grid-2,.grid-3,.grid-4,.mega-grid,.logo-cloud,.check-grid,.footer-grid { grid-template-columns:1fr; }
  .page-hero { padding:52px 0 32px; }
}


/* VER01-REV02 service page expansion */
.service-expanded .lead { max-width: 780px; }
.takeaway-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.takeaway { background:#fff; border:1px solid var(--line); border-radius:22px; padding:22px; box-shadow:0 12px 30px rgba(15,23,42,.05); }
.takeaway span { width:38px; height:38px; display:grid; place-items:center; border-radius:50%; background:linear-gradient(135deg,var(--blue),var(--dark)); color:#fff; font-weight:950; margin-bottom:14px; }
.takeaway h3 { margin-bottom:8px; }
.service-feature .icon { background:linear-gradient(135deg,var(--blue),var(--lime)); color:#071222; }
.compact-list { margin-top:18px; padding:0; }
.compact-list li { margin-bottom:10px; }
.blueprint-visual svg { width:100%; height:auto; display:block; border-radius:28px; box-shadow:0 24px 70px rgba(15,23,42,.16); }
.details-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.solution-detail { background:#fff; border:1px solid var(--line); border-radius:18px; padding:18px 20px; box-shadow:0 10px 28px rgba(15,23,42,.04); }
.solution-detail summary { cursor:pointer; color:#0f172a; font-weight:950; }
.solution-detail ul { margin:14px 0 0; padding-left:20px; color:var(--muted); }
.solution-detail li { margin-bottom:8px; }
@media (max-width: 1040px) { .takeaway-grid { grid-template-columns:1fr; } .details-grid { grid-template-columns:1fr; } }


/* ver01-rev03: unique service-page content helpers */
.service-unique .highlight-card { align-self: start; }
.service-unique .mini-list { margin: 14px 0 0; padding-left: 20px; }
.service-unique .mini-list li { margin: 8px 0; color: var(--muted); }
.service-unique .feature-row { margin-top: 28px; }

/* ver01-rev05: restored unique Service Takeaways and See It In Action sections */
.service-takeaways .section-head h2 { max-width: 720px; }
.service-action .highlight-card { align-self: stretch; }
.service-action .check-grid { grid-template-columns:1fr; margin-top:18px; }
.service-action .feature-list li { background:#fff; }
.service-action .lead { max-width:760px; }

/* ver01-rev06: restored service blueprint visuals in See It In Action */
.visual-stack { display:grid; gap:18px; align-self:start; }
.visual-stack .highlight-card { margin:0; }
.visual-stack .blueprint-visual { margin:0; }

/* ver01-rev07: moved See It In Action highlight card into a horizontal section */
.service-action .blueprint-visual { align-self: stretch; }
.action-highlight-row { padding-top: 0; }
.horizontal-highlight { display: grid; grid-template-columns: 1fr; gap: 18px; }
.horizontal-highlight .highlight-card { width: 100%; }
.horizontal-highlight .check-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-top: 18px;
}
.horizontal-highlight .check {
  align-items: flex-start;
  min-height: 100%;
}
@media (max-width: 980px) {
  .horizontal-highlight .check-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
  .horizontal-highlight .check-grid { grid-template-columns: 1fr; }
}

/* ver01-rev10: Media Decoding uploaded logo in header and footer */
.brand {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
}
.brand-logo {
  display: block;
  width: 250px;
  max-width: 100%;
  height: auto;
}
.footer-logo {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
  margin-bottom: 18px;
}
.footer-brand-logo {
  display: block;
  width: 250px;
  max-width: 100%;
  height: auto;
}
@media (max-width: 720px) {
  .brand-logo,
  .footer-brand-logo {
    width: 200px;
  }
}

/* ver01-rev11: logo fixed inside header/footer brand locations */
.site-header .brand {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
}
.site-header .brand-logo {
  display: block;
  width: 250px;
  max-width: 100%;
  height: auto;
}
.footer-brand .brand.footer-brand-link,
.footer-brand .footer-brand-link {
  display: inline-flex;
  align-items: center;
  margin-bottom: 18px;
}
.footer-brand .footer-brand-logo {
  display: block;
  width: 250px;
  max-width: 100%;
  height: auto;
}
@media (max-width: 720px) {
  .site-header .brand-logo,
  .footer-brand .footer-brand-logo {
    width: 200px;
  }
}

/* ver01-rev12: old text brand removed from header */
.site-header .brand-mark,
.site-header .brand-text {
  display: none !important;
}
.site-header .brand {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
}
.site-header .brand-logo {
  display: block;
  width: 250px;
  max-width: 100%;
  height: auto;
}
.footer-brand .footer-brand-logo {
  display: block;
  width: 250px;
  max-width: 100%;
  height: auto;
}
@media (max-width: 720px) {
  .site-header .brand-logo,
  .footer-brand .footer-brand-logo {
    width: 200px;
  }
}

/* ver01-rev15: responsive mobile nav fix */
@media (max-width: 1040px) {
  .site-header {
    overflow: visible;
  }

  .navbar {
    position: relative;
  }

  .nav {
    position: fixed !important;
    left: 14px !important;
    right: 14px !important;
    top: 92px !important;
    width: auto !important;
    max-width: calc(100vw - 28px) !important;
    box-sizing: border-box;
    transform: none !important;
    overflow-x: hidden;
    overflow-y: auto;
    z-index: 9999;
  }

  .nav.is-open {
    display: flex;
  }

  .nav > a,
  .nav-link,
  .nav-cta {
    width: 100%;
    box-sizing: border-box;
    justify-content: space-between;
    text-align: left;
    margin-left: 0;
  }

  .nav-item {
    width: 100%;
    min-width: 0;
    position: static;
  }

  .nav-item .mega {
    position: static !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    transform: none !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box;
    overflow: hidden;
    margin: 6px 0 12px;
    border-radius: 16px;
  }

  .nav-item.is-open .mega {
    display: block;
  }

  .mega-head {
    display: block;
    padding: 16px;
  }

  .mega-head p {
    max-width: 100%;
    margin-top: 6px;
  }

  .mega-grid {
    grid-template-columns: 1fr !important;
    width: 100%;
    box-sizing: border-box;
    padding: 10px;
  }

  .mega ul,
  .mega li,
  .mega li a {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }

  .mega small {
    white-space: normal;
    overflow-wrap: anywhere;
  }
}

@media (max-width: 680px) {
  .nav {
    left: 10px !important;
    right: 10px !important;
    top: 86px !important;
    max-width: calc(100vw - 20px) !important;
    padding: 12px;
    border-radius: 18px;
  }

  .mega-head {
    padding: 14px;
  }

  .mega-grid {
    padding: 8px;
  }
}

/* ver01-rev16: hard mobile menu containment fix */
html,
body {
  max-width: 100%;
  overflow-x: hidden;
}

@media (max-width: 1040px) {
  .site-header,
  .site-header * {
    box-sizing: border-box;
  }

  .site-header {
    overflow: visible !important;
  }

  .site-header .navbar {
    position: relative !important;
  }

  .site-header .nav[data-nav] {
    display: none;
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    top: 86px !important;
    width: 100vw !important;
    max-width: 100vw !important;
    min-width: 0 !important;
    height: calc(100vh - 86px) !important;
    max-height: calc(100vh - 86px) !important;
    margin: 0 !important;
    padding: 14px !important;
    transform: none !important;
    border-radius: 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    background: #fff !important;
    z-index: 99999 !important;
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .site-header .nav[data-nav].is-open {
    display: flex !important;
  }

  .site-header .nav[data-nav] > a,
  .site-header .nav[data-nav] .nav-link,
  .site-header .nav[data-nav] .nav-cta {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 16px 18px !important;
    justify-content: space-between !important;
    text-align: left !important;
    white-space: normal !important;
  }

  .site-header .nav[data-nav] .nav-item {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    position: static !important;
    display: block !important;
    overflow: visible !important;
  }

  .site-header .nav[data-nav] .mega {
    position: static !important;
    inset: auto !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    transform: none !important;
    translate: none !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 0 14px 0 !important;
    padding: 0 !important;
    border-radius: 18px !important;
    box-shadow: none !important;
    overflow: hidden !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    background: #fff !important;
  }

  .site-header .nav[data-nav] .nav-item:not(.is-open) > .mega {
    display: none !important;
  }

  .site-header .nav[data-nav] .nav-item.is-open > .mega {
    display: block !important;
  }

  .site-header .nav[data-nav] .mega-head {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    padding: 16px !important;
    margin: 0 !important;
    border-radius: 18px 18px 0 0 !important;
  }

  .site-header .nav[data-nav] .mega-head b,
  .site-header .nav[data-nav] .mega-head p {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }

  .site-header .nav[data-nav] .mega-grid {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    padding: 10px !important;
    margin: 0 !important;
    overflow: visible !important;
  }

  .site-header .nav[data-nav] .mega-grid ul {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  .site-header .nav[data-nav] .mega-grid li,
  .site-header .nav[data-nav] .mega-grid li a {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .site-header .nav[data-nav] .mega-grid span,
  .site-header .nav[data-nav] .mega-grid small {
    width: 100% !important;
    max-width: 100% !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: normal !important;
  }

  body.mobile-nav-open {
    overflow: hidden !important;
  }
}

@media (max-width: 680px) {
  .site-header .nav[data-nav] {
    top: 74px !important;
    height: calc(100vh - 74px) !important;
    max-height: calc(100vh - 74px) !important;
    padding: 12px !important;
  }

  .site-header .nav[data-nav] .mega-head {
    padding: 14px !important;
  }

  .site-header .nav[data-nav] .mega-grid {
    padding: 8px !important;
  }
}

/* ver01-rev17: mobile menu opens below topbar + logo row */
:root {
  --md-mobile-nav-top: 150px;
}

@media (max-width: 1040px) {
  .site-header .nav[data-nav] {
    top: var(--md-mobile-nav-top) !important;
    height: calc(100vh - var(--md-mobile-nav-top)) !important;
    max-height: calc(100vh - var(--md-mobile-nav-top)) !important;
  }
}

@media (max-width: 680px) {
  .site-header .nav[data-nav] {
    top: var(--md-mobile-nav-top) !important;
    height: calc(100vh - var(--md-mobile-nav-top)) !important;
    max-height: calc(100vh - var(--md-mobile-nav-top)) !important;
  }
}

/* ver01-rev18: shared service-style structure for industries, solutions, and developers */
.service-unique .feature-row .card h3 {
  margin-top: 0;
}
.solution-detail h3 {
  margin: 0 0 8px;
  color: #0f172a;
}
.solution-detail p {
  margin: 0;
  color: var(--muted);
}

/* ver01-rev19: MediaDecoding.com brand color alignment
   Dark blue navigation bar + green primary buttons */
:root {
  --blue: #179AEB;
  --dark: #1E3F82;
  --lime: #8CC64B;
  --md-green: #8CC64B;
  --md-dark-blue: #1E3F82;
}

/* Header / navigation */
.site-header {
  background: var(--md-dark-blue) !important;
  border-bottom: 1px solid rgba(255,255,255,.14) !important;
  backdrop-filter: none !important;
}

.topbar {
  background: #17336d !important;
  color: #eaf4ff !important;
}

.topbar a {
  color: #ffffff !important;
}

.navbar {
  background: var(--md-dark-blue) !important;
}

.site-header .nav > a,
.site-header .nav-link {
  color: #ffffff !important;
}

.site-header .nav > a:hover,
.site-header .nav-link:hover,
.site-header .nav-item:hover .nav-link,
.site-header .nav-item:focus-within .nav-link {
  color: var(--md-green) !important;
}

.site-header .nav-link span {
  color: inherit !important;
}

.nav-toggle {
  background: var(--md-green) !important;
  border-color: var(--md-green) !important;
  color: #071222 !important;
}

/* Keep dropdown panels readable */
.site-header .mega {
  background: #ffffff !important;
  color: #0f172a !important;
}

.site-header .mega-head {
  background: linear-gradient(135deg, var(--md-dark-blue), #12285f) !important;
  color: #ffffff !important;
}

.site-header .mega-head p {
  color: #dbeafe !important;
}

.site-header .mega span {
  color: #0f172a !important;
}

.site-header .mega small {
  color: #64748b !important;
}

/* Green buttons / CTAs */
.btn,
.btn-primary,
.btn-light,
.nav-cta,
button[type="submit"],
input[type="submit"] {
  background: var(--md-green) !important;
  border-color: var(--md-green) !important;
  color: #071222 !important;
  box-shadow: 0 12px 28px rgba(140,198,75,.25) !important;
}

.btn:hover,
.btn-primary:hover,
.btn-light:hover,
.nav-cta:hover,
button[type="submit"]:hover,
input[type="submit"]:hover {
  background: #7fb63f !important;
  border-color: #7fb63f !important;
  color: #071222 !important;
  transform: translateY(-1px);
}

.btn-secondary {
  background: transparent !important;
  border: 1px solid var(--md-dark-blue) !important;
  color: var(--md-dark-blue) !important;
  box-shadow: none !important;
}

.btn-secondary:hover {
  background: var(--md-dark-blue) !important;
  color: #ffffff !important;
}

/* Mobile menu keeps dark-blue header but white dropdown panel */
@media (max-width: 1040px) {
  .site-header .nav[data-nav] {
    background: #ffffff !important;
  }

  .site-header .nav[data-nav] > a,
  .site-header .nav[data-nav] .nav-link {
    color: #071222 !important;
  }

  .site-header .nav[data-nav] .nav-link:hover {
    color: var(--md-dark-blue) !important;
  }

  .site-header .nav[data-nav] .nav-cta {
    background: var(--md-green) !important;
    color: #071222 !important;
  }
}

/* ver01-rev20: header/nav background matches exact footer background */
:root {
  --md-footer-bg: #071222;
}

.site-header {
  background: var(--md-footer-bg) !important;
  border-bottom: 1px solid rgba(255,255,255,.12) !important;
  backdrop-filter: none !important;
}

.topbar {
  background: var(--md-footer-bg) !important;
  color: #eaf4ff !important;
  border-bottom: 1px solid rgba(255,255,255,.10) !important;
}

.navbar {
  background: var(--md-footer-bg) !important;
}

.site-header .nav > a,
.site-header .nav-link {
  color: #ffffff !important;
}

.site-header .nav > a:hover,
.site-header .nav-link:hover,
.site-header .nav-item:hover .nav-link,
.site-header .nav-item:focus-within .nav-link {
  color: var(--md-green, #8CC64B) !important;
}

.nav-cta,
.btn,
.btn-primary,
.btn-light,
button[type="submit"],
input[type="submit"] {
  background: var(--md-green, #8CC64B) !important;
  border-color: var(--md-green, #8CC64B) !important;
  color: #071222 !important;
}

@media (max-width: 1040px) {
  .site-header {
    background: var(--md-footer-bg) !important;
  }

  .site-header .nav[data-nav] {
    background: #ffffff !important;
  }

  .site-header .nav[data-nav] > a,
  .site-header .nav[data-nav] .nav-link {
    color: #071222 !important;
  }
}

/* ver01-rev21: topbar restored to previous blue */
.topbar {
  background: #17336d !important;
  color: #eaf4ff !important;
  border-bottom: 1px solid rgba(255,255,255,.10) !important;
}

.topbar a {
  color: #ffffff !important;
}

@media (max-width: 1040px) {
  .topbar {
    background: #17336d !important;
  }
}

/* ver01-rev22: sticky header on desktop and mobile */
.site-header {
  position: sticky !important;
  position: -webkit-sticky !important;
  top: 0 !important;
  z-index: 100000 !important;
  width: 100% !important;
}

@media (max-width: 1040px) {
  .site-header {
    position: sticky !important;
    position: -webkit-sticky !important;
    top: 0 !important;
    z-index: 100000 !important;
  }

  .site-header .nav[data-nav] {
    z-index: 99999 !important;
  }
}

@media (max-width: 680px) {
  .site-header {
    position: sticky !important;
    position: -webkit-sticky !important;
    top: 0 !important;
  }
}

/* ver01-rev23: make only the logo/navigation bar sticky */
:root {
  --md-navbar-height: 78px;
}

body {
  padding-top: var(--md-navbar-height);
}

.site-header {
  position: relative !important;
  top: auto !important;
  z-index: 100000 !important;
}

.site-header .topbar {
  position: relative !important;
  z-index: 1 !important;
}

.site-header .navbar {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  min-height: var(--md-navbar-height) !important;
  z-index: 100001 !important;
  background: var(--md-footer-bg, #071222) !important;
  border-bottom: 1px solid rgba(255,255,255,.12) !important;
  box-shadow: 0 12px 32px rgba(0,0,0,.18) !important;
}

/* keep the fixed nav content centered like the rest of the site */
.site-header .navbar.wrap {
  width: 100% !important;
  max-width: none !important;
  padding-left: max(24px, calc((100vw - 1280px) / 2)) !important;
  padding-right: max(24px, calc((100vw - 1280px) / 2)) !important;
  box-sizing: border-box !important;
}

.site-header .brand-logo {
  display: block !important;
}

@media (max-width: 1040px) {
  :root {
    --md-navbar-height: 74px;
  }

  body {
    padding-top: var(--md-navbar-height);
  }

  .site-header .navbar {
    min-height: var(--md-navbar-height) !important;
  }

  .site-header .navbar.wrap {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }

  .site-header .nav[data-nav] {
    top: var(--md-navbar-height) !important;
    height: calc(100vh - var(--md-navbar-height)) !important;
    max-height: calc(100vh - var(--md-navbar-height)) !important;
  }
}

@media (max-width: 680px) {
  :root {
    --md-navbar-height: 70px;
  }

  .site-header .navbar.wrap {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  .site-header .brand-logo {
    width: 190px !important;
  }

  .site-header .nav[data-nav] {
    top: var(--md-navbar-height) !important;
    height: calc(100vh - var(--md-navbar-height)) !important;
    max-height: calc(100vh - var(--md-navbar-height)) !important;
  }
}

/* ver01-rev24: topbar remains first, only logo/navigation bar is sticky */
body {
  padding-top: 0 !important;
}

.site-header {
  position: relative !important;
  top: auto !important;
  z-index: 100000 !important;
}

.site-header .topbar {
  position: relative !important;
  top: auto !important;
  z-index: 1 !important;
}

.site-header .navbar {
  position: sticky !important;
  position: -webkit-sticky !important;
  top: 0 !important;
  left: auto !important;
  right: auto !important;
  width: auto !important;
  max-width: 1280px !important;
  min-height: 78px !important;
  z-index: 100001 !important;
  background: var(--md-footer-bg, #071222) !important;
  border-bottom: 1px solid rgba(255,255,255,.12) !important;
  box-shadow: 0 12px 32px rgba(0,0,0,.18) !important;
}

/* undo rev23 full-width fixed navbar padding override */
.site-header .navbar.wrap {
  width: min(100% - 48px, 1280px) !important;
  max-width: 1280px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
}

@media (max-width: 1040px) {
  body {
    padding-top: 0 !important;
  }

  .site-header .navbar {
    position: sticky !important;
    position: -webkit-sticky !important;
    top: 0 !important;
    min-height: 74px !important;
  }

  .site-header .navbar.wrap {
    width: min(100% - 28px, 1280px) !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* Mobile menu opens below the logo/navigation row, not from the topbar */
  .site-header .nav[data-nav] {
    position: absolute !important;
    top: calc(100% + 0px) !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: calc(100vh - var(--md-navbar-height, 74px)) !important;
    max-height: calc(100vh - var(--md-navbar-height, 74px)) !important;
    border-radius: 0 0 18px 18px !important;
  }
}

@media (max-width: 680px) {
  .site-header .navbar {
    min-height: 70px !important;
  }

  .site-header .navbar.wrap {
    width: min(100% - 20px, 1280px) !important;
  }

  .site-header .nav[data-nav] {
    top: 100% !important;
    height: calc(100vh - var(--md-navbar-height, 70px)) !important;
    max-height: calc(100vh - var(--md-navbar-height, 70px)) !important;
  }
}

/* ver01-rev25: reliable sticky navbar using scroll class */
body {
  padding-top: 0 !important;
}

.site-header {
  position: relative !important;
  z-index: 100000 !important;
  overflow: visible !important;
}

.site-header .topbar {
  position: relative !important;
  z-index: 1 !important;
}

.site-header .navbar {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  width: min(100% - 48px, 1280px) !important;
  max-width: 1280px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  min-height: var(--md-navbar-height, 78px) !important;
  z-index: 100001 !important;
  background: var(--md-footer-bg, #071222) !important;
  border-bottom: 1px solid rgba(255,255,255,.12) !important;
}

.md-navbar-placeholder {
  display: none;
  height: 0;
}

body.md-nav-is-stuck .site-header .navbar {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: max(24px, calc((100vw - 1280px) / 2)) !important;
  padding-right: max(24px, calc((100vw - 1280px) / 2)) !important;
  box-sizing: border-box !important;
  box-shadow: 0 12px 32px rgba(0,0,0,.18) !important;
}

body.md-nav-is-stuck .md-navbar-placeholder {
  display: block;
  height: var(--md-navbar-height, 78px);
}

@media (max-width: 1040px) {
  .site-header .navbar {
    width: min(100% - 28px, 1280px) !important;
    min-height: var(--md-navbar-height, 74px) !important;
  }

  body.md-nav-is-stuck .site-header .navbar {
    width: 100% !important;
    max-width: none !important;
    padding-left: 18px !important;
    padding-right: 18px !important;
  }

  .site-header .nav[data-nav] {
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: calc(100vh - var(--md-navbar-height, 74px)) !important;
    max-height: calc(100vh - var(--md-navbar-height, 74px)) !important;
    border-radius: 0 0 18px 18px !important;
  }
}

@media (max-width: 680px) {
  .site-header .navbar {
    width: min(100% - 20px, 1280px) !important;
    min-height: var(--md-navbar-height, 70px) !important;
  }

  body.md-nav-is-stuck .site-header .navbar {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  .site-header .brand-logo {
    width: 190px !important;
  }
}

/* ver01-rev26: mobile menu height ends at last menu item */
@media (max-width: 1040px) {
  .site-header .nav[data-nav] {
    height: auto !important;
    min-height: 0 !important;
    max-height: calc(100vh - var(--md-navbar-height, 74px) - 12px) !important;
    bottom: auto !important;
    align-self: stretch !important;
  }

  .site-header .nav[data-nav].is-open {
    display: flex !important;
    height: auto !important;
    min-height: 0 !important;
  }

  .site-header .nav[data-nav] .nav-cta {
    margin-top: 6px !important;
    margin-bottom: 0 !important;
  }
}

@media (max-width: 680px) {
  .site-header .nav[data-nav] {
    height: auto !important;
    min-height: 0 !important;
    max-height: calc(100vh - var(--md-navbar-height, 70px) - 10px) !important;
  }
}

/* ver01-rev27: unique hero designs for services, industries, solutions, and developers */
.page-hero--custom { padding: 28px 0 12px; }
.page-hero--custom .wrap { display: grid; grid-template-columns: minmax(0,1.02fr) minmax(320px,.98fr); gap: 34px; align-items: center; }
.page-hero--custom .hero-copy { min-width: 0; }
.hero-breadcrumbs { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-bottom:14px; font-size:13px; color:#64748b; }
.hero-breadcrumbs a { color:#1E3F82; text-decoration:none; }
.hero-breadcrumbs strong { color:#0f172a; font-weight:700; }
.hero-kicker { display:inline-flex; align-items:center; justify-content:center; padding:7px 12px; border-radius:999px; background:rgba(23,154,235,.08); color:#1E3F82; font-size:12px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; margin-bottom:14px; }
.page-hero--custom h1 { margin:0 0 16px; }
.page-hero--custom .lead { margin:0; max-width:64ch; }
.hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:22px; }
.hero-tag-list { list-style:none; display:flex; flex-wrap:wrap; gap:12px; padding:0; margin:22px 0 0; }
.hero-tag-list li { padding:10px 14px; border-radius:999px; background:#fff; border:1px solid rgba(15,23,42,.10); box-shadow:0 10px 24px rgba(2,12,27,.08); font-size:13px; font-weight:700; color:#0f172a; }
.hero-visual { min-width:0; }
.hero-visual-frame { position:relative; border-radius:34px; overflow:hidden; box-shadow:0 22px 50px rgba(2,12,27,.18); }
.hero-visual-frame::after { content:""; position:absolute; inset:0; border-radius:34px; box-shadow:inset 0 0 0 1px rgba(255,255,255,.14); pointer-events:none; }
.hero-illustration { display:block; width:100%; height:auto; }

@media (max-width: 1040px) {
  .page-hero--custom .wrap { grid-template-columns:1fr; gap:24px; }
  .hero-tag-list { gap:10px; }
}
@media (max-width: 680px) {
  .page-hero--custom { padding:18px 0 6px; }
  .hero-breadcrumbs { font-size:12px; gap:6px; }
  .hero-tag-list li { width:100%; text-align:center; }
  .hero-actions { flex-direction:column; align-items:stretch; }
  .hero-actions .btn, .hero-actions .btn-secondary { width:100%; text-align:center; }
}

/* ver01-rev28: developer hero platform/logo badges */
.page-hero--developers .hero-visual-frame {
  background: linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.02));
}

/* ver01-rev29: developers hero uses clean logo panels instead of abstract graph art */
.page-hero--developers .hero-visual-frame {
  background: linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.02));
}

/* ver01-rev30: cleaner developer hero logo panels */
.page-hero--developers .hero-visual-frame { background: linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.02)); }

/* ver01-rev31: developers heroes use cleaned transparent PNG logo assets */
.page-hero--developers .hero-visual-frame {
  background: linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.02));
}

/* ver01-rev32: Media Decoding glass theme refresh */
:root{--md-blue:#179AEB;--md-dark-blue:#1E3F82;--md-green:#8CC64B;--md-navy:#071222;--md-ink:#0f172a;--md-glass:rgba(255,255,255,.72);--md-glass-strong:rgba(255,255,255,.86);--md-glass-dark:rgba(7,18,34,.74);--md-glass-border:rgba(255,255,255,.24);--md-soft-line:rgba(30,63,130,.14);--md-glass-shadow:0 24px 70px rgba(2,12,27,.14)}
html{scroll-behavior:smooth}body{background:radial-gradient(circle at 8% 8%,rgba(23,154,235,.16),transparent 28%),radial-gradient(circle at 90% 10%,rgba(140,198,75,.16),transparent 24%),linear-gradient(180deg,#f8fbff 0%,#eef6ff 42%,#f7fbf3 100%)!important;color:var(--md-ink)}
.site-header .navbar,body.md-nav-is-stuck .site-header .navbar{background:linear-gradient(135deg,rgba(7,18,34,.86),rgba(30,63,130,.84))!important;border:1px solid rgba(255,255,255,.13)!important;backdrop-filter:blur(20px) saturate(140%)!important;-webkit-backdrop-filter:blur(20px) saturate(140%)!important;box-shadow:0 18px 44px rgba(2,12,27,.24)!important}
.topbar{background:linear-gradient(90deg,rgba(30,63,130,.96),rgba(23,154,235,.88))!important;color:#eaf4ff!important;border-bottom:1px solid rgba(255,255,255,.16)!important}.topbar a{color:#fff!important}.site-header .nav>a,.site-header .nav-link{color:#fff!important}.site-header .nav>a:hover,.site-header .nav-link:hover,.site-header .nav-item:hover .nav-link,.site-header .nav-item:focus-within .nav-link{color:var(--md-green)!important}
.site-header .mega{background:rgba(255,255,255,.90)!important;border:1px solid rgba(255,255,255,.54)!important;backdrop-filter:blur(22px) saturate(150%)!important;-webkit-backdrop-filter:blur(22px) saturate(150%)!important;box-shadow:0 24px 70px rgba(2,12,27,.16)!important}.site-header .mega-head{background:linear-gradient(135deg,rgba(30,63,130,.94),rgba(23,154,235,.78))!important;border-bottom:1px solid rgba(255,255,255,.18)!important}.site-header .mega li a{background:rgba(255,255,255,.50);border:1px solid rgba(30,63,130,.08);border-radius:14px;transition:transform .2s ease,background .2s ease,border-color .2s ease}.site-header .mega li a:hover{background:rgba(140,198,75,.12);border-color:rgba(140,198,75,.38);transform:translateY(-1px)}
.card,.highlight-card,.stat,.solution-detail,.feature-card,.case-card,.blog-card,.contact-card,.form-card,.service-card,.industry-card,.resource-card,.platform-card{background:var(--md-glass-strong)!important;border:1px solid rgba(255,255,255,.70)!important;box-shadow:var(--md-glass-shadow)!important;backdrop-filter:blur(18px) saturate(145%)!important;-webkit-backdrop-filter:blur(18px) saturate(145%)!important}.card:hover,.highlight-card:hover,.service-card:hover,.industry-card:hover,.solution-detail:hover,.platform-card:hover{border-color:rgba(140,198,75,.42)!important;box-shadow:0 28px 78px rgba(2,12,27,.18)!important}
.section.alt{background:radial-gradient(circle at 0% 0%,rgba(23,154,235,.12),transparent 34%),radial-gradient(circle at 100% 0%,rgba(140,198,75,.10),transparent 28%),rgba(255,255,255,.34)!important;border-top:1px solid rgba(255,255,255,.54);border-bottom:1px solid rgba(30,63,130,.08)}.section.alt,.service-action,.service-expanded,.service-unique{position:relative}
.page-hero,.page-hero--custom{background:radial-gradient(circle at 8% 10%,rgba(23,154,235,.18),transparent 30%),radial-gradient(circle at 92% 12%,rgba(140,198,75,.18),transparent 28%),linear-gradient(180deg,rgba(255,255,255,.76),rgba(255,255,255,.38))!important;border-bottom:1px solid rgba(30,63,130,.10)}.page-hero--custom .hero-copy{padding:26px;border-radius:30px;background:rgba(255,255,255,.56);border:1px solid rgba(255,255,255,.72);box-shadow:0 22px 60px rgba(2,12,27,.08);backdrop-filter:blur(20px) saturate(145%);-webkit-backdrop-filter:blur(20px) saturate(145%)}.hero-visual-frame,.blueprint-visual,.visual-stack .blueprint-visual{background:linear-gradient(145deg,rgba(255,255,255,.22),rgba(255,255,255,.06))!important;border:1px solid rgba(255,255,255,.35)!important;box-shadow:0 28px 80px rgba(2,12,27,.20)!important;backdrop-filter:blur(18px) saturate(150%);-webkit-backdrop-filter:blur(18px) saturate(150%)}
.hero-tag-list li,.hero-kicker,.kicker,.eyebrow{border:1px solid rgba(23,154,235,.14)}.hero-tag-list li{background:rgba(255,255,255,.70)!important;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.hero-kicker,.eyebrow{background:rgba(23,154,235,.10)!important;color:var(--md-dark-blue)!important}
.btn,.btn-primary,.btn-light,.nav-cta,button[type="submit"],input[type="submit"]{background:linear-gradient(135deg,var(--md-green),#a8df65)!important;border-color:rgba(140,198,75,.90)!important;color:#071222!important;box-shadow:0 18px 38px rgba(140,198,75,.30)!important}.btn:hover,.btn-primary:hover,.btn-light:hover,.nav-cta:hover,button[type="submit"]:hover,input[type="submit"]:hover{background:linear-gradient(135deg,#7fb63f,var(--md-green))!important;color:#071222!important;box-shadow:0 20px 44px rgba(140,198,75,.38)!important}.btn-secondary{background:rgba(255,255,255,.52)!important;border:1px solid rgba(30,63,130,.24)!important;color:var(--md-dark-blue)!important;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.btn-secondary:hover{background:rgba(30,63,130,.92)!important;border-color:rgba(30,63,130,.92)!important;color:#fff!important}
input,select,textarea{background:rgba(255,255,255,.78)!important;border-color:rgba(30,63,130,.18)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.65)}input:focus,select:focus,textarea:focus{border-color:rgba(23,154,235,.72)!important;box-shadow:0 0 0 4px rgba(23,154,235,.14)!important;outline:none!important}.footer,.site-footer{background:radial-gradient(circle at 12% 0%,rgba(23,154,235,.18),transparent 34%),radial-gradient(circle at 84% 12%,rgba(140,198,75,.16),transparent 30%),#071222!important}
@media(max-width:1040px){.site-header .nav[data-nav]{background:rgba(255,255,255,.94)!important;border:1px solid rgba(255,255,255,.70)!important;backdrop-filter:blur(22px) saturate(150%)!important;-webkit-backdrop-filter:blur(22px) saturate(150%)!important;box-shadow:0 28px 70px rgba(2,12,27,.18)!important}.site-header .nav[data-nav]>a,.site-header .nav[data-nav] .nav-link{color:#071222!important}.site-header .nav[data-nav] .nav-link:hover{color:var(--md-dark-blue)!important}.site-header .nav[data-nav] .mega{background:rgba(255,255,255,.86)!important}.page-hero--custom .hero-copy{padding:22px}}@media(max-width:680px){.page-hero--custom .hero-copy{padding:18px;border-radius:24px}.hero-visual-frame{border-radius:24px}.card,.highlight-card,.solution-detail{border-radius:22px}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.card,.highlight-card,.site-header .mega,.page-hero--custom .hero-copy{background:rgba(255,255,255,.94)!important}.site-header .navbar,body.md-nav-is-stuck .site-header .navbar{background:#071222!important}}

/* ver01-rev33: align closer to current MediaDecoding.com theme
   Clean corporate brand style: blue topbar, dark nav/footer, green CTAs, white cards */
:root {
  --md-blue: #179AEB;
  --md-dark-blue: #1E3F82;
  --md-green: #8CC64B;
  --md-navy: #071222;
  --md-text: #0f172a;
  --md-muted: #64748b;
  --md-line: rgba(30,63,130,.14);
  --md-card: #ffffff;
  --md-page: #f8fbff;
  --md-soft-blue: #eaf6ff;
  --md-soft-green: #f3faec;
  --md-shadow: 0 16px 42px rgba(2, 12, 27, .10);
  --md-radius: 22px;
}

/* reset rev32 heavy glass styling into the cleaner MediaDecoding.com style */
html {
  scroll-behavior: smooth;
}

body {
  background:
    linear-gradient(180deg, #ffffff 0%, #f8fbff 38%, #ffffff 100%) !important;
  color: var(--md-text) !important;
}

/* Topbar stays blue like Media Decoding */
.topbar {
  background: linear-gradient(90deg, var(--md-dark-blue), var(--md-blue)) !important;
  color: #ffffff !important;
  border-bottom: 0 !important;
}

.topbar a {
  color: #ffffff !important;
}

/* Main logo/nav row stays dark like footer */
.site-header .navbar,
body.md-nav-is-stuck .site-header .navbar {
  background: var(--md-navy) !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(255,255,255,.10) !important;
  box-shadow: 0 12px 30px rgba(2,12,27,.18) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.site-header .nav > a,
.site-header .nav-link {
  color: #ffffff !important;
  font-weight: 700;
}

.site-header .nav > a:hover,
.site-header .nav-link:hover,
.site-header .nav-item:hover .nav-link,
.site-header .nav-item:focus-within .nav-link {
  color: var(--md-green) !important;
}

.nav-toggle {
  background: var(--md-green) !important;
  color: #071222 !important;
  border-color: var(--md-green) !important;
}

/* Mega menu: clean white panels with blue header, not frosted glass */
.site-header .mega {
  background: #ffffff !important;
  border: 1px solid var(--md-line) !important;
  border-radius: 22px !important;
  box-shadow: 0 24px 70px rgba(2,12,27,.14) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.site-header .mega-head {
  background: linear-gradient(135deg, var(--md-dark-blue), var(--md-blue)) !important;
  color: #ffffff !important;
  border-bottom: 0 !important;
}

.site-header .mega-head p {
  color: rgba(255,255,255,.82) !important;
}

.site-header .mega li a {
  background: transparent !important;
  border: 1px solid transparent !important;
  border-radius: 14px;
  box-shadow: none !important;
}

.site-header .mega li a:hover {
  background: rgba(23,154,235,.08) !important;
  border-color: rgba(23,154,235,.18) !important;
  transform: translateY(-1px);
}

.site-header .mega span {
  color: var(--md-text) !important;
}

.site-header .mega small {
  color: var(--md-muted) !important;
}

/* Hero sections closer to MediaDecoding.com: clean blue/green brand backgrounds */
.page-hero,
.page-hero--custom {
  background:
    radial-gradient(circle at 14% 12%, rgba(23,154,235,.16), transparent 30%),
    radial-gradient(circle at 86% 8%, rgba(140,198,75,.16), transparent 28%),
    linear-gradient(180deg, #ffffff 0%, #f3f9ff 100%) !important;
  border-bottom: 1px solid var(--md-line) !important;
}

.page-hero--custom .hero-copy {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.page-hero--custom h1,
.page-hero h1 {
  color: var(--md-text) !important;
}

.page-hero--custom .lead,
.page-hero .lead {
  color: var(--md-muted) !important;
}

.hero-breadcrumbs {
  color: var(--md-muted) !important;
}

.hero-breadcrumbs a {
  color: var(--md-dark-blue) !important;
}

.hero-kicker,
.eyebrow,
.kicker {
  background: rgba(23,154,235,.10) !important;
  color: var(--md-dark-blue) !important;
  border: 1px solid rgba(23,154,235,.14) !important;
}

.hero-tag-list li {
  background: #ffffff !important;
  border: 1px solid var(--md-line) !important;
  color: var(--md-text) !important;
  box-shadow: 0 10px 24px rgba(2,12,27,.07) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Hero images keep a clean card frame */
.hero-visual-frame,
.blueprint-visual {
  background: #ffffff !important;
  border: 1px solid var(--md-line) !important;
  box-shadow: var(--md-shadow) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Cards: white corporate surfaces */
.card,
.highlight-card,
.stat,
.solution-detail,
.feature-card,
.case-card,
.blog-card,
.contact-card,
.form-card,
.service-card,
.industry-card,
.resource-card,
.platform-card,
.check,
.value-card,
.step-card {
  background: #ffffff !important;
  border: 1px solid var(--md-line) !important;
  box-shadow: 0 14px 34px rgba(2,12,27,.08) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.card:hover,
.highlight-card:hover,
.service-card:hover,
.industry-card:hover,
.solution-detail:hover,
.platform-card:hover {
  border-color: rgba(140,198,75,.45) !important;
  box-shadow: 0 18px 44px rgba(2,12,27,.12) !important;
}

/* Alternate sections use subtle brand blocks like the existing site */
.section.alt {
  background:
    linear-gradient(180deg, var(--md-soft-blue), #ffffff) !important;
  border-top: 1px solid rgba(23,154,235,.10) !important;
  border-bottom: 1px solid rgba(30,63,130,.08) !important;
}

.service-action,
.service-expanded,
.service-unique {
  background-color: transparent;
}

/* Blue/green accent strips */
.section-head::before,
.page-hero--custom .hero-copy::before {
  content: none !important;
}

.highlight-card::before,
.card::before {
  box-shadow: none !important;
}

/* Buttons: green primary, dark-blue secondary */
.btn,
.btn-primary,
.btn-light,
.nav-cta,
button[type="submit"],
input[type="submit"] {
  background: var(--md-green) !important;
  border-color: var(--md-green) !important;
  color: #071222 !important;
  box-shadow: 0 12px 26px rgba(140,198,75,.28) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.btn:hover,
.btn-primary:hover,
.btn-light:hover,
.nav-cta:hover,
button[type="submit"]:hover,
input[type="submit"]:hover {
  background: #7fb63f !important;
  border-color: #7fb63f !important;
  color: #071222 !important;
  box-shadow: 0 14px 32px rgba(140,198,75,.34) !important;
}

.btn-secondary {
  background: transparent !important;
  border: 1px solid var(--md-dark-blue) !important;
  color: var(--md-dark-blue) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.btn-secondary:hover {
  background: var(--md-dark-blue) !important;
  color: #ffffff !important;
}

/* Forms */
input,
select,
textarea {
  background: #ffffff !important;
  border-color: rgba(30,63,130,.18) !important;
  box-shadow: none !important;
}

input:focus,
select:focus,
textarea:focus {
  border-color: var(--md-blue) !important;
  box-shadow: 0 0 0 4px rgba(23,154,235,.14) !important;
  outline: none !important;
}

/* Footer remains Media Decoding dark */
.footer,
.site-footer {
  background:
    radial-gradient(circle at 10% 0%, rgba(23,154,235,.16), transparent 34%),
    radial-gradient(circle at 90% 10%, rgba(140,198,75,.12), transparent 28%),
    var(--md-navy) !important;
}

/* Mobile menu: white panel, no long glass overlay */
@media (max-width: 1040px) {
  .site-header .nav[data-nav] {
    background: #ffffff !important;
    border: 1px solid var(--md-line) !important;
    box-shadow: 0 22px 54px rgba(2,12,27,.16) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  .site-header .nav[data-nav] > a,
  .site-header .nav[data-nav] .nav-link {
    color: #071222 !important;
  }

  .site-header .nav[data-nav] .nav-link:hover {
    color: var(--md-dark-blue) !important;
  }

  .site-header .nav[data-nav] .mega {
    background: #ffffff !important;
    border: 1px solid var(--md-line) !important;
  }

  .site-header .nav[data-nav] .mega-head {
    background: linear-gradient(135deg, var(--md-dark-blue), var(--md-blue)) !important;
  }
}

/* More consistent media/logo panels */
.logo-png-panel rect:first-child {
  fill: #ffffff !important;
}

@media (max-width: 680px) {
  .page-hero--custom {
    padding-top: 20px !important;
  }

  .hero-visual-frame {
    border-radius: 22px !important;
  }

  .card,
  .highlight-card,
  .solution-detail {
    border-radius: 20px !important;
  }
}

/* ver01-rev34: contact form reCAPTCHA styling */
.recaptcha-wrap {
  margin: 18px 0 20px;
  padding: 14px;
  border: 1px solid rgba(30,63,130,.14);
  border-radius: 16px;
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(2,12,27,.06);
  overflow: hidden;
}

.recaptcha-wrap .g-recaptcha {
  transform-origin: left top;
}

@media (max-width: 420px) {
  .recaptcha-wrap {
    padding: 10px;
  }

  .recaptcha-wrap .g-recaptcha {
    transform: scale(.86);
  }
}
