@charset "utf-8";
:root{--brand:#8a5a34;--brand-dark:#3d2b1f;--ink:#1c1a17;--muted:#6f6a63;--bg:#ffffff;--bg-alt:#f6f4f1;--line:#e5e1db;--brand-tint:#efe8e3;--radius:10px;--container:1200px;--header-h:72px;--font-sans:-apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-serif:Georgia, "Times New Roman", serif;--space-1:8px;--space-2:16px;--space-3:24px;--space-4:48px;--space-5:80px;--shadow-sm:0 1px 2px rgba(28, 26, 23, .05);--shadow-md:0 12px 28px rgba(28, 26, 23, .10);}/* custom: intop-redesign */
:root {
  --navy: #0d2c4b;
  --blue: #14568f;
  --blue-light: #e8f0f8;
  --accent: #e8641e;
  --accent-dark: #c94f10;
  --text: #22303e;
  --muted: #5b6b7a;
  --bg: #ffffff;
  --bg-alt: #f5f8fb;
  --border: #dde5ec;
  --radius: 10px;
  --max: 1180px;
}
.intop-redesign * { margin: 0; padding: 0; box-sizing: border-box; }
.intop-redesign {
  font-family: "Helvetica Neue", "Segoe UI", Arial, "PingFang SC", sans-serif;
  color: var(--text);
  background: var(--bg);
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
.intop-redesign img { max-width: 100%; display: block; }
.intop-redesign a { color: var(--blue); text-decoration: none; }
.intop-redesign a:hover { color: var(--accent); }
.intop-redesign .container { max-width: var(--max); margin: 0 auto; padding: 0 24px; }
.intop-redesign .topbar {
  background: var(--navy);
  color: #cfe0f0;
  font-size: 13px;
}
.intop-redesign .topbar .container {
  display: flex; justify-content: space-between; align-items: center;
  padding-top: 7px; padding-bottom: 7px;
}
.intop-redesign .topbar a { color: #cfe0f0; margin-left: 18px; }
.intop-redesign .topbar a:hover { color: #fff; }
.intop-redesign header.site {
  position: sticky; top: 0; z-index: 100;
  background: #fff;
  border-bottom: 1px solid var(--border);
  box-shadow: 0 1px 6px rgba(13,44,75,.06);
}
.intop-redesign header.site .container {
  display: flex; align-items: center; justify-content: space-between;
  height: 72px;
}
.intop-redesign .logo { display: flex; align-items: baseline; gap: 10px; }
.intop-redesign .logo .mark {
  font-size: 26px; font-weight: 800; letter-spacing: 1px; color: var(--navy);
}
.intop-redesign .logo .mark span { color: var(--accent); }
.intop-redesign .logo .tag { font-size: 12px; color: var(--muted); letter-spacing: .5px; }
.intop-redesign nav.main { display: flex; gap: 6px; }
.intop-redesign nav.main a {
  padding: 9px 14px; border-radius: 6px;
  font-size: 15px; font-weight: 600; color: var(--text);
}
.intop-redesign nav.main a:hover { background: var(--blue-light); color: var(--blue); }
.intop-redesign nav.main a.cta {
  background: var(--accent); color: #fff; margin-left: 8px;
}
.intop-redesign nav.main a.cta:hover { background: var(--accent-dark); color: #fff; }
.intop-redesign .nav-item { position: relative; }
.intop-redesign .nav-item > a { display: inline-block; }
.intop-redesign .nav-item > a::after {
  content: " ▾"; font-size: 11px; opacity: .6;
}
.intop-redesign .nav-item.has-cta > a::after { content: ""; }
.intop-redesign .dropdown {
  position: absolute; top: 100%; left: 0; z-index: 60;
  min-width: 280px; padding: 8px;
  background: #fff; border: 1px solid var(--border);
  border-radius: 10px; box-shadow: 0 12px 32px rgba(13,44,75,.14);
  opacity: 0; visibility: hidden; transform: translateY(6px);
  transition: opacity .15s ease, transform .15s ease, visibility .15s;
  display: grid; gap: 2px;
}
.intop-redesign .nav-item:hover .dropdown, .intop-redesign .nav-item:focus-within .dropdown {
  opacity: 1; visibility: visible; transform: translateY(0);
}
.intop-redesign .dropdown a {
  display: block; padding: 8px 12px; border-radius: 6px;
  font-size: 14px; font-weight: 600; color: var(--text);
  white-space: nowrap;
}
.intop-redesign .dropdown a:hover { background: var(--blue-light); color: var(--blue); }
.intop-redesign .dropdown a span {
  display: block; font-size: 12px; font-weight: 500;
  color: var(--muted); margin-top: 1px;
}
.intop-redesign .dropdown .dd-head {
  padding: 6px 12px 4px; font-size: 11px; font-weight: 800;
  letter-spacing: .08em; text-transform: uppercase; color: var(--muted);
}
@media (max-width: 900px) {
.intop-redesign .dropdown { display: none; }
}
.intop-redesign .hero {
  background:
    linear-gradient(90deg, rgba(240,244,248,.97) 0%, rgba(240,244,248,.88) 38%, rgba(240,244,248,.35) 58%, rgba(240,244,248,0) 76%),
    #eef2f6 url('https://www.intopindustrial.com/wp-content/uploads/sites/18/2026/10/banner-hero.jpg?v=99') right center / cover no-repeat;
  color: var(--navy);
  overflow: hidden;
}
.intop-redesign .hero .container {
  padding-top: 96px; padding-bottom: 96px;
}
.intop-redesign .hero-copy { max-width: 580px; }
.intop-redesign .hero .container { margin-left: 0; }
.intop-redesign .hero h1 {
  font-size: 46px; line-height: 1.14; font-weight: 800; letter-spacing: -.5px;
  color: #0d2c4b;
}
.intop-redesign .hero h1 em { color: #d9731d; font-style: normal; }
.intop-redesign .hero p.lead {
  margin-top: 22px; font-size: 18px; color: #3d5a75; max-width: 560px;
}
.intop-redesign .hero .actions { margin-top: 34px; display: flex; gap: 14px; flex-wrap: wrap; }
.intop-redesign .hero .actions .btn { margin: 0; }
.intop-redesign .hero .btn.ghost { color: #0d2c4b; border-color: rgba(13,44,75,.45); }
.intop-redesign .hero .btn.ghost:hover { border-color: #0d2c4b; color: #0d2c4b; }
@media (max-width: 900px) {
.intop-redesign .hero {
    background:
      linear-gradient(rgba(240,244,248,.93), rgba(240,244,248,.93)),
      #eef2f6 url('https://www.intopindustrial.com/wp-content/uploads/sites/18/2026/10/banner-hero.jpg?v=99') center / cover no-repeat;
  }
.intop-redesign .hero .container { padding-top: 56px; padding-bottom: 56px; }
.intop-redesign .hero h1 { font-size: 34px; }
}
.intop-redesign .btn {
  display: inline-block; padding: 13px 28px; border-radius: 8px;
  font-weight: 700; font-size: 15px; cursor: pointer; border: none;
}
.intop-redesign .btn.primary { background: var(--accent); color: #fff; }
.intop-redesign .btn.primary:hover { background: var(--accent-dark); color: #fff; }
.intop-redesign .btn.ghost { background: transparent; color: #fff; border: 1.5px solid rgba(255,255,255,.55); }
.intop-redesign .btn.ghost:hover { border-color: #fff; color: #fff; }
.intop-redesign .btn.outline { background: transparent; color: var(--blue); border: 1.5px solid var(--blue); }
.intop-redesign .btn.outline:hover { background: var(--blue); color: #fff; }
.intop-redesign section { padding: 76px 0; }
.intop-redesign section.alt { background: var(--bg-alt); }
.intop-redesign .kicker {
  display: inline-block; font-size: 13px; font-weight: 700;
  letter-spacing: 2px; text-transform: uppercase; color: var(--accent);
  margin-bottom: 12px;
}
.intop-redesign h2.title { font-size: 34px; font-weight: 800; color: var(--navy); line-height: 1.2; }
.intop-redesign p.sub { margin-top: 14px; color: var(--muted); font-size: 17px; max-width: 760px; }
.intop-redesign .center { text-align: center; }
.intop-redesign .center p.sub { margin-left: auto; margin-right: auto; }
.intop-redesign .grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; margin-top: 44px; }
.intop-redesign .grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 26px; margin-top: 44px; }
.intop-redesign .grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; margin-top: 44px; }
.intop-redesign .cat-card {
  background: #fff; border: 1px solid var(--border); border-radius: var(--radius);
  overflow: hidden; display: flex; flex-direction: column;
  transition: transform .18s ease, box-shadow .18s ease;
}
.intop-redesign .cat-card:hover { transform: translateY(-4px); box-shadow: 0 14px 34px rgba(13,44,75,.13); }
.intop-redesign .cat-card .thumb { aspect-ratio: 4/3; overflow: hidden; background: #f2f5f8; }
.intop-redesign .cat-card .thumb { background: #fff; }
.intop-redesign .cat-card .thumb img { width: 100%; height: 100%; object-fit: contain; padding: 8px; box-sizing: border-box; }
.intop-redesign .cat-card .body { padding: 20px 22px 24px; flex: 1; display: flex; flex-direction: column; }
.intop-redesign .cat-card h3 { font-size: 19px; color: var(--navy); }
.intop-redesign .cat-card p { margin-top: 10px; font-size: 14.5px; color: var(--muted); flex: 1; }
.intop-redesign .cat-card .more { margin-top: 16px; font-weight: 700; font-size: 14px; color: var(--accent); }
.intop-redesign .prod-cards .cat-card .thumb { aspect-ratio: 1/1; background: #f4f5f6; }
.intop-redesign .prod-cards .cat-card .thumb img { padding: 0; }
.intop-redesign .prod-cards .cat-card .body { text-align: center; align-items: center; }
.intop-redesign .prod-cards .cat-card h3 { font-size: 18px; }
.intop-redesign .card {
  background: #fff; border: 1px solid var(--border); border-radius: var(--radius);
  padding: 26px;
}
.intop-redesign .card h3 { color: var(--navy); font-size: 18px; margin-bottom: 10px; }
.intop-redesign .card p, .intop-redesign .card li { font-size: 15px; color: var(--muted); }
.intop-redesign .card ul { padding-left: 18px; }
.intop-redesign .card li { margin: 6px 0; }
.intop-redesign .icon-item { display: flex; gap: 16px; }
.intop-redesign .icon-item .ico {
  flex: 0 0 46px; height: 46px; border-radius: 10px;
  background: var(--blue-light); color: var(--blue);
  display: flex; align-items: center; justify-content: center;
  font-size: 20px; font-weight: 800;
}
.intop-redesign .icon-item h4 { font-size: 16.5px; color: var(--navy); }
.intop-redesign .icon-item p { font-size: 14.5px; color: var(--muted); margin-top: 4px; }
.intop-redesign .compare { width: 100%; border-collapse: collapse; margin-top: 40px; background: #fff; border-radius: var(--radius); overflow: hidden; box-shadow: 0 4px 18px rgba(13,44,75,.07); }
.intop-redesign .compare th, .intop-redesign .compare td { padding: 15px 20px; text-align: left; font-size: 15px; border-bottom: 1px solid var(--border); }
.intop-redesign .compare thead th { background: var(--navy); color: #fff; font-size: 15px; }
.intop-redesign .compare td:first-child { font-weight: 700; color: var(--navy); width: 22%; }
.intop-redesign .compare td.win { color: #1b7a3d; }
.intop-redesign .compare td.lose { color: #98a6b3; }
.intop-redesign .ind-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; margin-top: 44px; }
.intop-redesign .ind {
  background: #fff; border: 1px solid var(--border); border-radius: var(--radius);
  padding: 20px;
}
.intop-redesign .ind h4 { font-size: 15.5px; color: var(--navy); }
.intop-redesign .ind p { font-size: 13.5px; color: var(--muted); margin-top: 6px; }
.intop-redesign .steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-top: 44px; counter-reset: step; }
.intop-redesign .step { position: relative; background: #fff; border: 1px solid var(--border); border-radius: var(--radius); padding: 24px 22px 22px; }
.intop-redesign .step .num {
  width: 34px; height: 34px; border-radius: 50%; background: var(--accent); color: #fff;
  display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 15px;
  margin-bottom: 14px;
}
.intop-redesign .step h4 { font-size: 16px; color: var(--navy); }
.intop-redesign .step p { font-size: 14px; color: var(--muted); margin-top: 6px; }
.intop-redesign .stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-top: 44px; }
.intop-redesign .stat { text-align: center; background: #fff; border: 1px solid var(--border); border-radius: var(--radius); padding: 30px 16px; }
.intop-redesign .stat .v { font-size: 40px; font-weight: 800; color: var(--accent); }
.intop-redesign .stat .l { font-size: 14px; color: var(--muted); margin-top: 6px; }
.intop-redesign .quote { background: #fff; border: 1px solid var(--border); border-left: 4px solid var(--accent); border-radius: var(--radius); padding: 24px 26px; }
.intop-redesign .quote p { font-size: 15px; color: var(--text); font-style: italic; }
.intop-redesign .quote .who { margin-top: 14px; font-size: 13.5px; color: var(--muted); font-style: normal; }
.intop-redesign .faq details { background: #fff; border: 1px solid var(--border); border-radius: 8px; padding: 18px 22px; margin-top: 14px; }
.intop-redesign .faq summary { font-weight: 700; color: var(--navy); cursor: pointer; font-size: 15.5px; }
.intop-redesign .faq details p { margin-top: 10px; color: var(--muted); font-size: 14.5px; }
.intop-redesign .cta-band { background: linear-gradient(120deg, var(--navy), #164a7c); color: #fff; text-align: center; padding: 64px 0; }
.intop-redesign .cta-band h2 { font-size: 30px; }
.intop-redesign .cta-band p { color: #cfe0f0; margin-top: 12px; max-width: 640px; margin-left: auto; margin-right: auto; }
.intop-redesign .cta-band .btn { margin-top: 26px; }
.intop-redesign .cat-section { margin-top: 60px; }
.intop-redesign .cat-section:first-of-type { margin-top: 44px; }
.intop-redesign .sec-head { display: flex; align-items: center; gap: 16px; border-bottom: 2px solid var(--navy); padding-bottom: 14px; margin-bottom: 26px; }
.intop-redesign .sec-head .kicker { display: block; margin-bottom: 4px; }
.intop-redesign .sec-head .title { font-size: 26px; color: var(--navy); margin: 0; }
.intop-redesign .sec-num { font-size: 30px; font-weight: 800; color: var(--accent); font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace; line-height: 1; }
.intop-redesign .sec-all { margin-left: auto; font-weight: 600; color: var(--navy); text-decoration: none; white-space: nowrap; }
.intop-redesign .sec-all:hover { color: var(--accent); }
.intop-redesign .cat-head { display: flex; align-items: baseline; gap: 14px; border-bottom: 2px solid var(--navy); padding-bottom: 12px; }
.intop-redesign .cat-head h2 { font-size: 26px; color: var(--navy); }
.intop-redesign .cat-head .zh { color: var(--muted); font-size: 15px; }
.intop-redesign .cat-body { display: grid; grid-template-columns: 300px 1fr; gap: 30px; margin-top: 26px; }
.intop-redesign .cat-photo img { border-radius: var(--radius); border: 1px solid var(--border); }
.intop-redesign .cat-desc h3 { color: var(--navy); font-size: 17px; margin-bottom: 10px; }
.intop-redesign .cat-desc ul { padding-left: 18px; color: var(--muted); font-size: 15px; }
.intop-redesign .cat-desc li { margin: 5px 0; }
.intop-redesign .prod-links { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; margin-top: 22px; }
.intop-redesign .prod-link {
  display: flex; gap: 14px; align-items: center;
  background: #fff; border: 1px solid var(--border); border-radius: 8px; padding: 12px;
  transition: box-shadow .15s ease;
}
.intop-redesign .prod-link:hover { box-shadow: 0 8px 22px rgba(13,44,75,.1); color: inherit; }
.intop-redesign .prod-link img { width: 84px; height: 64px; object-fit: contain; background:#fff; border-radius: 6px; flex: 0 0 84px; }
.intop-redesign .prod-link .t { font-weight: 700; color: var(--navy); font-size: 15px; }
.intop-redesign .prod-link .d { font-size: 13px; color: var(--muted); margin-top: 3px; }
.intop-redesign .pd-hero { background: var(--bg-alt); border-bottom: 1px solid var(--border); }
.intop-redesign .pd-hero .container { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; align-items: center; padding-top: 60px; padding-bottom: 60px; }
.intop-redesign .pd-hero h1 { font-size: 36px; color: var(--navy); line-height: 1.2; }
.intop-redesign .pd-hero p.lead { margin-top: 16px; color: var(--muted); font-size: 17px; }
.intop-redesign .pd-hero .imgwrap { background: #fff; border: 1px solid var(--border); border-radius: 12px; padding: 16px; }
.intop-redesign .pd-hero .imgwrap img { border-radius: 8px; }
.intop-redesign .breadcrumb { font-size: 13.5px; color: var(--muted); padding-top: 18px; }
.intop-redesign .breadcrumb a { color: var(--muted); }
.intop-redesign .spec { width: 100%; border-collapse: collapse; margin-top: 30px; }
.intop-redesign .spec th, .intop-redesign .spec td { border: 1px solid var(--border); padding: 11px 16px; font-size: 14.5px; text-align: left; }
.intop-redesign .spec th { width: 34%; background: var(--bg-alt); color: var(--navy); }
.intop-redesign .benefit { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); padding: 24px; }
.intop-redesign .benefit .tag { color: var(--accent); font-weight: 800; font-size: 13px; letter-spacing: 1px; }
.intop-redesign .benefit h3 { color: var(--navy); font-size: 17px; margin-top: 8px; }
.intop-redesign .benefit p { color: var(--muted); font-size: 14.5px; margin-top: 8px; }
.intop-redesign .related { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 36px; }
.intop-redesign .related a { display: block; background: #fff; border: 1px solid var(--border); border-radius: 8px; padding: 16px 18px; color: var(--navy); font-weight: 700; font-size: 15px; }
.intop-redesign .related a:hover { box-shadow: 0 8px 22px rgba(13,44,75,.1); color: var(--accent); }
.intop-redesign .related a span { display: block; font-weight: 400; color: var(--muted); font-size: 13px; margin-top: 5px; }
.intop-redesign .article { max-width: 800px; margin: 0 auto; }
.intop-redesign .article h1 { font-size: 34px; color: var(--navy); line-height: 1.25; }
.intop-redesign .article .meta { color: var(--muted); font-size: 14px; margin: 14px 0 30px; }
.intop-redesign .article h2 { font-size: 24px; color: var(--navy); margin: 36px 0 14px; }
.intop-redesign .article h3 { font-size: 18px; color: var(--navy); margin: 26px 0 10px; }
.intop-redesign .article p { margin: 12px 0; color: var(--text); }
.intop-redesign .article ul { margin: 12px 0 12px 22px; color: var(--text); }
.intop-redesign .article li { margin: 6px 0; }
.intop-redesign .article blockquote { border-left: 4px solid var(--accent); background: var(--bg-alt); padding: 16px 20px; margin: 20px 0; color: var(--muted); border-radius: 0 8px 8px 0; }
.intop-redesign .article h4 { font-size: 16px; color: var(--navy); margin: 22px 0 8px; }
.intop-redesign .article img { max-width: 100%; height: auto; border-radius: 8px; margin: 18px 0; border: 1px solid var(--border); }
.intop-redesign .article table { width: 100%; border-collapse: collapse; margin: 18px 0; font-size: 14.5px; }
.intop-redesign .article th, .intop-redesign .article td { border: 1px solid var(--border); padding: 10px 12px; text-align: left; vertical-align: top; }
.intop-redesign .article th { background: var(--blue-light); color: var(--navy); }
.intop-redesign .article figure { margin: 18px 0; }
.intop-redesign .article figure img { margin: 0; }
.intop-redesign .article .gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.intop-redesign .contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; margin-top: 44px; }
.intop-redesign .contact-item { display: flex; gap: 16px; margin-bottom: 26px; }
.intop-redesign .contact-item .ico { flex: 0 0 48px; height: 48px; border-radius: 10px; background: var(--blue-light); color: var(--blue); display: flex; align-items: center; justify-content: center; font-size: 22px; }
.intop-redesign .contact-item h4 { color: var(--navy); font-size: 16px; }
.intop-redesign .contact-item p { color: var(--muted); font-size: 14.5px; margin-top: 3px; }
.intop-redesign form.inq { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); padding: 30px; }
.intop-redesign form.inq label { display: block; font-weight: 700; font-size: 14px; color: var(--navy); margin: 16px 0 6px; }
.intop-redesign form.inq label:first-child { margin-top: 0; }
.intop-redesign form.inq input, .intop-redesign form.inq textarea, .intop-redesign form.inq select {
  width: 100%; padding: 11px 14px; border: 1px solid var(--border); border-radius: 7px;
  font-size: 14.5px; font-family: inherit; color: var(--text); background: #fff;
}
.intop-redesign form.inq input:focus, .intop-redesign form.inq textarea:focus { outline: 2px solid var(--blue-light); border-color: var(--blue); }
.intop-redesign form.inq .btn { margin-top: 22px; width: 100%; }
.intop-redesign .form-note { font-size: 12.5px; color: var(--muted); margin-top: 12px; }
.intop-redesign footer.site { background: var(--navy); color: #9fb6cc; margin-top: 0; padding: 56px 0 30px; font-size: 14px; }
.intop-redesign footer.site .cols { display: grid; grid-template-columns: 2fr 1fr 1fr 1.4fr; gap: 40px; }
.intop-redesign footer.site h5 { color: #fff; font-size: 15px; margin-bottom: 14px; }
.intop-redesign footer.site a { color: #9fb6cc; display: block; margin: 7px 0; }
.intop-redesign footer.site a:hover { color: #fff; }
.intop-redesign footer.site .about { color: #9fb6cc; line-height: 1.7; }
.intop-redesign footer.site .bottom { border-top: 1px solid rgba(255,255,255,.12); margin-top: 40px; padding-top: 22px; display: flex; justify-content: space-between; font-size: 13px; }
.intop-redesign .badge-note { display: inline-block; background: rgba(232,100,30,.15); color: #ffb37e; border: 1px dashed rgba(232,100,30,.5); border-radius: 6px; padding: 4px 12px; font-size: 12.5px; margin-top: 10px; }
@media (max-width: 960px) {
.intop-redesign .hero .container, .intop-redesign .pd-hero .container, .intop-redesign .contact-grid { grid-template-columns: 1fr; }
.intop-redesign .grid-3, .intop-redesign .grid-4, .intop-redesign .ind-grid, .intop-redesign .steps, .intop-redesign .stats, .intop-redesign .related { grid-template-columns: repeat(2, 1fr); }
.intop-redesign .cat-body { grid-template-columns: 1fr; }
.intop-redesign nav.main { display: none; }
.intop-redesign footer.site .cols { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 620px) {
.intop-redesign .grid-3, .intop-redesign .grid-4, .intop-redesign .ind-grid, .intop-redesign .steps, .intop-redesign .stats, .intop-redesign .related, .intop-redesign .grid-2, .intop-redesign .prod-links { grid-template-columns: 1fr; }
.intop-redesign .hero h1 { font-size: 32px; }
.intop-redesign footer.site .cols { grid-template-columns: 1fr; }
}
.intop-redesign .logo { text-decoration: none; }
.intop-redesign .cat-hero { background: var(--bg-alt); border-bottom: 1px solid var(--border); padding: 44px 0 36px; }
.intop-redesign .cat-hero h1 { font-size: 34px; color: var(--navy); }
.intop-redesign .cat-hero p.lead { margin-top: 14px; color: var(--muted); font-size: 17px; }
.intop-redesign .cat-hero-img { background:#fff; }
.intop-redesign .cat-hero-img img { width: 100%; max-height: 380px; object-fit: contain; border-radius: var(--radius); border: 1px solid var(--border); }
.intop-redesign .chips { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.intop-redesign .chips .chip { background: var(--blue-light); color: var(--blue); font-weight: 600; font-size: 14px; padding: 8px 16px; border-radius: 20px; }
.intop-redesign .chips .chip:hover { background: var(--blue); color: #fff; }
.intop-redesign nav.main a.active { background: var(--blue-light); color: var(--blue); }
.intop-redesign .nav-toggle { display: none; }
.intop-redesign .burger { display: none; width: 42px; height: 42px; border: 1px solid var(--border); border-radius: 8px; cursor: pointer; position: relative; }
.intop-redesign .burger span, .intop-redesign .burger span::before, .intop-redesign .burger span::after {
  content: ""; position: absolute; left: 10px; right: 10px; height: 2px; background: var(--navy); border-radius: 2px;
}
.intop-redesign .burger span { top: 50%; margin-top: -1px; }
.intop-redesign .burger span::before { top: -7px; }
.intop-redesign .burger span::after { top: 7px; }
@media (max-width: 960px) {
.intop-redesign .burger { display: block; }
.intop-redesign nav.main {
    display: none; position: absolute; top: 100%; left: 0; right: 0;
    background: #fff; flex-direction: column; gap: 2px;
    padding: 14px 20px 22px; border-bottom: 1px solid var(--border);
    box-shadow: 0 16px 32px rgba(13,44,75,.12);
  }
.intop-redesign .nav-toggle:checked ~ nav.main { display: flex; }
.intop-redesign .dropdown {
    display: grid; position: static; opacity: 1; visibility: visible; transform: none;
    box-shadow: none; border: none; min-width: 0; padding: 0 0 6px 16px;
  }
}
.intop-redesign .effect-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:24px;margin-top:36px;}
.intop-redesign .effect-card {background:#fff;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;margin:0;}
.intop-redesign .effect-card img {width:100%;height:215px;object-fit:contain;background:#fff;display:block;padding:6px;box-sizing:border-box;}
.intop-redesign .effect-card figcaption {padding:16px 18px 20px;}
.intop-redesign .effect-card figcaption strong {display:block;color:var(--navy);margin-bottom:6px;font-size:16px;}
.intop-redesign .effect-card figcaption p {font-size:13.5px;color:var(--muted);line-height:1.55;}
@media (max-width:700px) {
.intop-redesign .effect-grid {grid-template-columns:1fr;}
}
.intop-redesign .banner3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; padding: 16px; }
.intop-redesign .banner3 figure { margin: 0; }
.intop-redesign .banner3 img { width: 100%; height: 150px; object-fit: contain; border-radius: 8px; }
.intop-redesign .banner3 figcaption { text-align: center; font-size: 12.5px; font-weight: 700; color: #123a63; padding-top: 8px; letter-spacing: .3px; }
@media (max-width: 720px) {
.intop-redesign .banner3 img { height: 92px; }
.intop-redesign .banner3 figcaption { font-size: 11px; }
}
.intop-redesign .app-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 40px; }
.intop-redesign .app-card { display: block; background: #fff; border: 1px solid var(--border); border-radius: 12px; overflow: hidden; color: inherit; transition: box-shadow .15s ease; }
.intop-redesign .app-card:hover { box-shadow: 0 10px 26px rgba(13,44,75,.12); }
.intop-redesign .app-card .thumb { height: 200px; background: #fff; border-bottom: 1px solid var(--border); display: flex; align-items: center; justify-content: center; padding: 12px; }
.intop-redesign .app-card .thumb img { max-width: 100%; max-height: 100%; object-fit: contain; }
.intop-redesign .app-card .body { padding: 18px 20px 22px; }
.intop-redesign .app-card h3 { font-size: 17px; color: var(--navy); }
.intop-redesign .app-card p { font-size: 13.5px; color: var(--muted); margin-top: 8px; line-height: 1.55; }
.intop-redesign .app-card .more { margin-top: 12px; font-size: 13.5px; font-weight: 700; color: var(--accent); }
.intop-redesign .cta-lite { background: #fff; border: 1px solid var(--border); border-radius: 12px; text-align: center; padding: 44px 24px; }
.intop-redesign .cta-lite h2 { font-size: 24px; color: var(--navy); }
.intop-redesign .cta-lite p { color: var(--muted); margin-top: 10px; max-width: 620px; margin-left: auto; margin-right: auto; }
.intop-redesign .cta-lite .btn { margin-top: 22px; }
@media (max-width: 900px) {
.intop-redesign .app-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
.intop-redesign .app-grid { grid-template-columns: 1fr; }
}
.intop-redesign .chip { display:inline-block; background:#fff; border:1px solid var(--border); border-radius:20px; padding:6px 16px; margin:4px 6px 4px 0; font-size:14px; color:var(--navy); font-weight:600; }
.intop-redesign .res-quiet { background: var(--bg-alt); padding: 56px 0 60px; }
.intop-redesign .res-list { max-width: 860px; margin: 30px auto 0; display: grid; }
.intop-redesign .res-list a {
  display: grid; grid-template-columns: 44px 1fr auto; align-items: baseline;
  gap: 18px; padding: 15px 10px;
  border-top: 1px solid var(--border);
  font-size: 15.5px; color: var(--text);
  transition: background .15s ease;
}
.intop-redesign .res-list a:last-child { border-bottom: 1px solid var(--border); }
.intop-redesign .res-list a:hover { background: #fff; }
.intop-redesign .res-list a span {
  font-size: 12px; font-weight: 800; letter-spacing: .08em; color: #b8c4d0;
}
.intop-redesign .res-list a strong { color: var(--navy); font-weight: 700; }
.intop-redesign .res-list a em {
  font-style: normal; font-size: 13px; color: var(--muted); white-space: nowrap;
}
@media (max-width: 720px) {
.intop-redesign .res-list a { grid-template-columns: 34px 1fr; }
.intop-redesign .res-list a em { display: none; }
}
.intop-redesign .pd-media img { width:100%; border-radius:var(--radius); border:1px solid var(--border); background:#fff; }
.intop-redesign .pd-gal-main img { width:100%; aspect-ratio:1/1; object-fit:cover; opacity:1; transition:opacity .25s ease; }
.intop-redesign .pd-thumbs { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-top:16px; }
.intop-redesign .pd-thumbs figure { margin:0; background:#fff; border:1px solid var(--border); border-radius:8px; padding:8px; text-align:center; cursor:pointer; transition:border-color .15s ease, box-shadow .15s ease; }
.intop-redesign .pd-thumbs figure:hover { box-shadow:0 6px 16px rgba(13,44,75,.1); }
.intop-redesign .pd-thumbs figure.active { border-color:var(--accent); box-shadow:0 0 0 1px var(--accent); }
.intop-redesign .pd-thumbs img { width:100%; aspect-ratio:1/1; object-fit:cover; border-radius:4px; }
.intop-redesign .pd-thumbs figcaption { font-size:12px; color:var(--muted); margin-top:6px; }
.intop-redesign .pd-thumbs figure.active figcaption { color:var(--accent); font-weight:700; }
.intop-redesign .check-list { list-style:none; padding:0; margin-top:20px; }
.intop-redesign .check-list li { position:relative; padding-left:30px; margin:10px 0; color:var(--text); font-size:15.5px; }
.intop-redesign .check-list li::before {
  content:"✓"; position:absolute; left:0; top:1px; width:21px; height:21px;
  border-radius:50%; background:var(--blue-light); color:var(--blue);
  font-size:13px; font-weight:800; text-align:center; line-height:21px;
}
.intop-redesign .spec-wrap { display:grid; grid-template-columns:340px 1fr; gap:56px; align-items:start; margin-top:48px; }
.intop-redesign .spec-aside h3 { font-size:16.5px; color:var(--navy); margin-top:28px; }
.intop-redesign .match-step { display:flex; gap:14px; margin-top:14px; align-items:flex-start; }
.intop-redesign .match-step .n { flex:0 0 30px; height:30px; border-radius:50%; background:var(--accent); color:#fff; font-weight:800; font-size:14px; display:flex; align-items:center; justify-content:center; }
.intop-redesign .match-step p { font-size:14px; color:var(--muted); line-height:1.55; }
.intop-redesign .match-step p strong { color:var(--navy); }
.intop-redesign .app-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:26px; margin-top:44px; }
.intop-redesign .app-tile { background:#fff; border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; display:flex; flex-direction:column; transition:box-shadow .18s ease; }
.intop-redesign .app-tile:hover { box-shadow:0 10px 26px rgba(13,44,75,.12); }
.intop-redesign .app-tile .ph { height:210px; overflow:hidden; background:#fff; }
.intop-redesign .app-tile .ph img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .25s ease; }
.intop-redesign .app-tile .ph.fit-contain img { object-fit:contain; padding:10px; box-sizing:border-box; }
.intop-redesign .app-tile:hover .ph img { transform:scale(1.04); }
.intop-redesign .app-tile .body { padding:20px 22px 24px; flex:1; }
.intop-redesign .app-tile h3 { font-size:17px; color:var(--navy); }
.intop-redesign .app-tile p { font-size:14px; color:var(--muted); margin-top:8px; line-height:1.6; }
@media (max-width:960px) {
.intop-redesign .spec-wrap { grid-template-columns:1fr; gap:32px; }
.intop-redesign .app-cards { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:620px) {
.intop-redesign .app-cards { grid-template-columns:1fr; }
}
.intop-redesign .about-band { padding: 72px 0; border-top: 1px solid var(--border); }
.intop-redesign .about-wrap {
  display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center;
}
.intop-redesign .about-chips { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.intop-redesign .about-chips span {
  font-size: 12.5px; font-weight: 700; letter-spacing: .02em;
  color: var(--navy); background: #fff; border: 1px solid var(--border);
  border-radius: 999px; padding: 7px 14px;
}
.intop-redesign .about-more {
  display: inline-flex; align-items: center; gap: 8px;
  margin-top: 26px; font-weight: 800; font-size: 15px; color: var(--navy);
  border-bottom: 2px solid var(--accent); padding-bottom: 4px;
  transition: gap .15s ease, color .15s ease;
}
.intop-redesign .about-more:hover { color: var(--accent); gap: 12px; }
.intop-redesign .about-more .arrow { font-size: 17px; line-height: 1; }
.intop-redesign .about-media { position: relative; padding: 0; }
.intop-redesign .about-media img {
  border-radius: 14px; display: block;
  box-shadow: 0 14px 34px rgba(15, 34, 58, .16);
}
.intop-redesign .about-media .bldg { width: 100%; }
@media (max-width: 880px) {
.intop-redesign .about-wrap { grid-template-columns: 1fr; gap: 40px; }
.intop-redesign .about-media { padding: 0 0 40px 28px; max-width: 560px; }
}
.intop-redesign .stack-flow {display:grid;grid-template-columns:1fr 34px 1fr 34px 1fr 34px 1fr;align-items:stretch;margin-top:40px;}
.intop-redesign .stack-step {background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:20px 16px 22px;text-align:center;display:flex;flex-direction:column;align-items:center;}
.intop-redesign .stack-step .ph {width:100%;height:140px;display:flex;align-items:center;justify-content:center;margin-bottom:14px;}
.intop-redesign .stack-step .ph img {max-width:100%;max-height:100%;object-fit:contain;}
.intop-redesign .stack-step .num {font-size:11px;font-weight:800;letter-spacing:1.6px;color:var(--accent);}
.intop-redesign .stack-step h3 {font-size:16px;color:var(--navy);margin-top:5px;}
.intop-redesign .stack-step p {font-size:13px;color:var(--muted);margin-top:7px;line-height:1.55;}
.intop-redesign .stack-arrow {display:flex;align-items:center;justify-content:center;color:#b9c6d4;font-size:24px;font-weight:800;}
@media (max-width:900px) {
.intop-redesign .stack-flow {grid-template-columns:1fr;gap:10px;}
.intop-redesign .stack-arrow {height:26px;transform:rotate(90deg);}
}
.intop-redesign .app-cards.visual {grid-template-columns:repeat(2,1fr);gap:28px;margin-top:36px;}
.intop-redesign .app-cards.visual .app-tile {position:relative;}
.intop-redesign .app-cards.visual .ph {height:330px;position:relative;}
.intop-redesign .app-cards.visual .ph::after {content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(13,44,75,0) 42%,rgba(13,44,75,.78) 100%);pointer-events:none;}
.intop-redesign .app-cards.visual .cap {position:absolute;left:0;right:0;bottom:0;z-index:2;padding:20px 24px 22px;}
.intop-redesign .app-cards.visual .cap h3 {color:#fff;font-size:19px;margin:0;letter-spacing:.2px;}
.intop-redesign .app-cards.visual .cap p {color:rgba(255,255,255,.88);font-size:13.5px;margin-top:6px;line-height:1.5;}
.intop-redesign .app-cards.visual .cap .no {display:inline-block;font-size:11px;font-weight:800;letter-spacing:1.8px;color:#fff;background:var(--accent);border-radius:3px;padding:2px 8px;margin-bottom:9px;}
@media (max-width:760px) {
.intop-redesign .app-cards.visual {grid-template-columns:1fr;}
.intop-redesign .app-cards.visual .ph {height:260px;}
}
.intop-redesign .mtx-wrap {overflow-x:auto;margin-top:36px;border:1px solid var(--border);border-radius:var(--radius);background:#fff;box-shadow:0 4px 18px rgba(13,44,75,.07);}
.intop-redesign .mtx {width:100%;border-collapse:collapse;min-width:680px;}
.intop-redesign .mtx th {background:var(--navy);color:#fff;font-size:13.5px;font-weight:700;padding:13px 16px;text-align:left;white-space:nowrap;}
.intop-redesign .mtx td {padding:13px 16px;font-size:14px;color:var(--muted);border-bottom:1px solid var(--border);vertical-align:top;line-height:1.5;}
.intop-redesign .mtx tr:last-child td {border-bottom:none;}
.intop-redesign .mtx td:first-child {font-weight:700;color:var(--navy);}
.intop-redesign .mtx tbody tr:hover {background:#fafbfc;}
.intop-redesign .stack-flow.three {grid-template-columns:1fr 34px 1fr 34px 1fr;}
.intop-redesign .stack-flow.two {grid-template-columns:1fr 34px 1fr;}
.intop-redesign .stack-flow .stack-step .ph.wide {height:150px;}
.intop-redesign .app-cards.visual.three {grid-template-columns:repeat(3,1fr);}
.intop-redesign .app-cards.visual.three .ph {height:270px;}
.intop-redesign .app-cards.visual.three .cap {padding:16px 18px 18px;}
.intop-redesign .app-cards.visual.three .cap h3 {font-size:16.5px;}
.intop-redesign .app-cards.visual.three .cap p {font-size:13px;}
.intop-redesign .note {margin-top:16px;font-size:13px;color:var(--muted);line-height:1.6;}
.intop-redesign .lead-note {max-width:760px;margin:22px auto 0;font-size:13.5px;color:var(--muted);text-align:center;line-height:1.65;}
@media (max-width:900px) {
.intop-redesign .stack-flow.three, .intop-redesign .stack-flow.two {grid-template-columns:1fr;gap:10px;}
.intop-redesign .app-cards.visual.three {grid-template-columns:1fr;}
.intop-redesign .app-cards.visual.three .ph {height:240px;}
}
.intop-redesign .figcard {background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:20px 22px 16px;}
.intop-redesign .figcard svg {display:block;width:100%;height:auto;}
.intop-redesign .figcard .figcap {margin-top:12px;font-size:12.5px;color:var(--muted);text-align:center;line-height:1.6;}
.intop-redesign .fig-row {display:grid;grid-template-columns:1fr;gap:30px;margin-top:36px;}
@media (min-width:900px) {
.intop-redesign .fig-row {grid-template-columns:1.02fr 1fr;align-items:center;}
}
.intop-redesign .cmp-fig {display:grid;grid-template-columns:1fr;gap:22px;align-items:center;}
@media (min-width:880px) {
.intop-redesign .cmp-fig {grid-template-columns:0.82fr 1.18fr;gap:30px;}
}
.intop-redesign .app-link {display:block;cursor:pointer;}
.intop-redesign .app-link:focus {outline:2px solid #e8551d;outline-offset:-2px;}
.intop-redesign .mfg-grid {display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:36px;}
.intop-redesign .mfg-cell {background:#fff;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;transition:box-shadow .2s ease,transform .2s ease;}
.intop-redesign .mfg-cell:hover {box-shadow:0 10px 26px rgba(15,33,64,.10);transform:translateY(-2px);}
.intop-redesign .mfg-cell .mfg-img {width:100%;height:150px;overflow:hidden;background:var(--bg-alt);}
.intop-redesign .mfg-cell .mfg-img img {width:100%;height:100%;object-fit:cover;display:block;}
.intop-redesign .mfg-cell .mfg-body {padding:15px 16px 18px;}
.intop-redesign .mfg-cell .mfg-num {display:inline-block;font-size:11px;font-weight:800;letter-spacing:1.4px;color:#fff;background:var(--accent);border-radius:20px;padding:3px 11px;margin-bottom:9px;}
.intop-redesign .mfg-cell h4 {font-size:15.5px;color:var(--navy);margin:0 0 6px;}
.intop-redesign .mfg-cell p {font-size:13px;color:var(--muted);line-height:1.55;margin:0;}
@media (max-width:900px) {
.intop-redesign .mfg-grid {grid-template-columns:repeat(2,1fr);gap:14px;}
.intop-redesign .mfg-cell .mfg-img {height:140px;}
}
@media (max-width:520px) {
.intop-redesign .mfg-grid {gap:12px;}
.intop-redesign .mfg-cell .mfg-img {height:120px;}
.intop-redesign .mfg-cell .mfg-body {padding:13px 13px 15px;}
.intop-redesign .mfg-cell h4 {font-size:14.5px;}
.intop-redesign .mfg-cell p {font-size:12.5px;}
}


.intop-redesign .gnav { background:#fff; border-bottom:1px solid #dde5ec; box-shadow:0 1px 6px rgba(13,44,75,.06); }
.intop-redesign .gnav-in { display:flex; align-items:center; justify-content:space-between; height:64px; position:relative; }
.intop-redesign .gnav-logo { display:flex; align-items:baseline; gap:8px; text-decoration:none; }
.intop-redesign .gnav-logo .mark { font-size:22px; font-weight:800; letter-spacing:1px; color:#0d2c4b; }
.intop-redesign .gnav-logo .mark span { color:#e8641e; }
.intop-redesign .gnav-logo .tag { font-size:11px; color:#5b6b7a; letter-spacing:.5px; }
.intop-redesign .gnav-links { display:flex; gap:4px; }
.intop-redesign .gnav-links a { padding:8px 14px; border-radius:6px; font-size:15px; font-weight:600; color:#22303e; text-decoration:none; }
.intop-redesign .gnav-links a:hover { background:#e8f0f8; color:#14568f; }
.intop-redesign .gnav-links a.active { color:#14568f; background:#e8f0f8; }
.intop-redesign .gnav-burger { display:none; flex-direction:column; gap:4px; cursor:pointer; padding:10px; margin-right:-6px; }
.intop-redesign .gnav-burger span { width:22px; height:2px; background:#22303e; display:block; }
@media (max-width:820px){
  .intop-redesign .gnav-burger { display:flex; }
  .intop-redesign .gnav-links { display:none; position:absolute; top:64px; left:0; right:0; background:#fff; flex-direction:column; padding:10px 16px; border-bottom:1px solid #dde5ec; box-shadow:0 10px 20px rgba(13,44,75,.12); z-index:50; }
  .intop-redesign #gnavtoggle:checked ~ .gnav-links { display:flex; }
  .intop-redesign .gnav-links a { padding:12px 8px; }
}
.intop-redesign .gfoot { background:#0d2c4b; color:#cfe0f0; margin-top:56px; }
.intop-redesign .gfoot-in { display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:28px; padding:48px 24px; }
.intop-redesign .gfoot-brand .mark { font-size:22px; font-weight:800; color:#fff; }
.intop-redesign .gfoot-brand .mark span { color:#e8641e; }
.intop-redesign .gfoot-brand p { margin-top:12px; font-size:14px; line-height:1.6; max-width:320px; }
.intop-redesign .gfoot-col h5 { color:#fff; font-size:14px; margin-bottom:12px; letter-spacing:.5px; }
.intop-redesign .gfoot-col a { display:block; color:#cfe0f0; font-size:14px; padding:4px 0; text-decoration:none; }
.intop-redesign .gfoot-col a:hover { color:#fff; }
.intop-redesign .gfoot-col p { font-size:13px; color:#9fb4c8; margin-top:6px; }
.intop-redesign .gfoot-bottom { border-top:1px solid rgba(255,255,255,.12); padding:14px 24px; font-size:13px; color:#9fb4c8; }
@media (max-width:820px){
  .intop-redesign .gfoot-in { grid-template-columns:1fr 1fr; }
}


:root {
    --p-navy:#0c2a52; --p-blue:#1f6fe0; --p-accent:#00b3d6;
    --p-bg-alt:#f5f7fa; --p-border:#e6ebf2; --p-muted:#5b6b7f; --p-ink:#1d2733;
  }
.intop-redesign .wt-hero {background:linear-gradient(120deg,var(--p-navy),#143a6e);color:#fff;padding:64px 0 56px;}
.intop-redesign .wt-hero .container {display:grid;grid-template-columns:1.05fr 1fr;gap:56px;align-items:center;}
.intop-redesign .wt-hero .breadcrumb a, .intop-redesign .wt-hero .breadcrumb {color:rgba(255,255,255,.72);}
.intop-redesign .wt-hero h1 {font-size:34px;line-height:1.2;margin:14px 0 0;font-weight:800;letter-spacing:-.4px;}
.intop-redesign .wt-hero .lead {margin-top:18px;color:rgba(255,255,255,.86);font-size:17px;line-height:1.7;max-width:560px;}
.intop-redesign .wt-hero .hero-cta {margin-top:26px;display:flex;gap:12px;flex-wrap:wrap;}
.intop-redesign .wt-hero .btn {display:inline-block;padding:12px 22px;border-radius:8px;font-weight:600;font-size:15px;text-decoration:none;}
.intop-redesign .wt-hero .btn.primary {background:var(--p-accent);color:#06314a;}
.intop-redesign .wt-hero .btn.outline {border:1px solid rgba(255,255,255,.5);color:#fff;}
.intop-redesign .wt-hero .imgwrap img {width:100%;border-radius:14px;box-shadow:0 20px 50px rgba(0,0,0,.35);background:#fff;}
.intop-redesign .wt-hero .imgcap {margin-top:10px;font-size:13px;color:rgba(255,255,255,.6);text-align:center;}
.intop-redesign .sec {padding:64px 0;}
.intop-redesign .sec.alt {background:var(--p-bg-alt);}
.intop-redesign .kicker {display:inline-block;font-size:13px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--p-blue);margin-bottom:8px;}
.intop-redesign .sec h2.title {font-size:28px;margin:0 0 8px;color:var(--p-navy);}
.intop-redesign .sec .sub {color:var(--p-muted);max-width:820px;line-height:1.7;}
.intop-redesign .two {display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;margin-top:34px;}
.intop-redesign .two.rev .col-img {order:2;}
.intop-redesign .two p {line-height:1.8;color:var(--p-ink);margin:0 0 16px;}
.intop-redesign .two ul {margin:0 0 16px;padding-left:20px;}
.intop-redesign .two li {line-height:1.7;color:var(--p-ink);margin-bottom:6px;}
.intop-redesign .imgcard {border:1px solid var(--p-border);border-radius:12px;overflow:hidden;background:#fff;box-shadow:0 10px 30px rgba(12,42,82,.07);}
.intop-redesign .imgcard img {width:100%;display:block;}
.intop-redesign .imgcard figcaption {padding:12px 16px;font-size:13.5px;color:var(--p-muted);border-top:1px solid var(--p-border);background:#fbfcfe;}
.intop-redesign .facts {border:1px solid var(--p-border);border-radius:12px;overflow:hidden;background:#fff;}
.intop-redesign .facts h3 {margin:0;background:var(--p-navy);color:#fff;font-size:15px;padding:14px 18px;letter-spacing:.3px;}
.intop-redesign .facts ul {list-style:none;margin:0;padding:0;}
.intop-redesign .facts li {display:flex;justify-content:space-between;gap:16px;padding:12px 18px;border-bottom:1px solid var(--p-border);font-size:14.5px;}
.intop-redesign .facts li:last-child {border-bottom:none;}
.intop-redesign .facts li b {color:var(--p-navy);font-weight:600;}
.intop-redesign .facts li span {color:var(--p-muted);text-align:right;}
.intop-redesign .feature {display:grid;grid-template-columns:1.05fr 1fr;gap:44px;align-items:center;margin-top:34px;background:#fff;border:1px solid var(--p-border);border-radius:16px;padding:28px;box-shadow:0 14px 40px rgba(12,42,82,.08);}
.intop-redesign .feature.rev .f-img {order:2;}
.intop-redesign .feature h3 {margin:0 0 10px;font-size:23px;color:var(--p-navy);line-height:1.25;}
.intop-redesign .feature p {line-height:1.8;color:var(--p-ink);margin:0 0 14px;}
.intop-redesign .feature .tagline {display:inline-flex;align-items:center;gap:8px;background:#e7f6fa;color:#06637a;border:1px solid #bfe8f2;border-radius:999px;padding:5px 13px;font-size:13px;font-weight:700;margin-bottom:12px;}
.intop-redesign .feature img {width:100%;border-radius:10px;display:block;}
.intop-redesign .spec-duo {display:grid;grid-template-columns:1fr 1.25fr;gap:28px;margin-top:34px;}
.intop-redesign .spec-duo.even {grid-template-columns:1fr 1fr;}
.intop-redesign .spec-card {border:1px solid var(--p-border);border-radius:12px;overflow:hidden;background:#fff;}
.intop-redesign .spec-card h3 {margin:0;background:var(--p-navy);color:#fff;font-size:16px;padding:14px 18px;}
.intop-redesign table.spec {width:100%;border-collapse:collapse;font-size:14.5px;}
.intop-redesign table.spec th, .intop-redesign table.spec td {padding:11px 16px;border-bottom:1px solid var(--p-border);text-align:left;vertical-align:top;}
.intop-redesign table.spec thead th {background:#eef3fb;color:var(--p-navy);font-weight:700;}
.intop-redesign table.spec td:first-child {color:var(--p-muted);width:44%;}
.intop-redesign table.spec tr:last-child td {border-bottom:none;}
.intop-redesign .adv-grid {display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:34px;}
.intop-redesign .adv {background:#fff;border:1px solid var(--p-border);border-left:4px solid var(--p-accent);border-radius:10px;padding:18px 20px;}
.intop-redesign .adv h4 {margin:0 0 6px;color:var(--p-navy);font-size:16.5px;}
.intop-redesign .adv p {margin:0;color:var(--p-muted);font-size:14.5px;line-height:1.65;}
.intop-redesign .app-list {list-style:none;margin:0;padding:0;display:grid;gap:14px;}
.intop-redesign .app-list li {background:#fff;border:1px solid var(--p-border);border-radius:10px;padding:14px 18px;border-left:4px solid var(--p-blue);}
.intop-redesign .app-list h4 {margin:0 0 4px;color:var(--p-navy);font-size:16px;}
.intop-redesign .app-list p {margin:0;color:var(--p-muted);font-size:14px;line-height:1.6;}
.intop-redesign .chips {display:flex;flex-wrap:wrap;gap:10px;margin-top:16px;}
.intop-redesign .chip {background:#eef3fb;color:var(--p-navy);border:1px solid #d6e2f5;padding:7px 14px;border-radius:999px;font-size:14px;}
.intop-redesign .rel-grid {display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:30px;}
.intop-redesign .rel {display:block;text-decoration:none;color:inherit;border:1px solid var(--p-border);border-radius:12px;overflow:hidden;background:#fff;transition:.2s;}
.intop-redesign .rel:hover {box-shadow:0 10px 26px rgba(12,42,82,.12);transform:translateY(-3px);}
.intop-redesign .rel img {width:100%;height:150px;object-fit:contain;padding:10px;background:#fff;}
.intop-redesign .rel span {padding:12px 14px;display:block;font-weight:600;color:var(--p-navy);font-size:14.5px;}
.intop-redesign .app-cards {display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px;margin-top:30px;}
.intop-redesign .app-card {display:block;text-decoration:none;color:inherit;border:1px solid var(--p-border);border-radius:12px;overflow:hidden;background:#fff;transition:.2s;}
.intop-redesign .app-card:hover {box-shadow:0 12px 30px rgba(12,42,82,.14);transform:translateY(-3px);}
.intop-redesign .app-card img {width:100%;height:172px;object-fit:cover;display:block;background:var(--p-bg-alt);}
.intop-redesign .app-card .ac-body {padding:14px 16px;}
.intop-redesign .app-card h4 {margin:0 0 6px;color:var(--p-navy);font-size:16px;}
.intop-redesign .app-card p {margin:0 0 8px;color:var(--p-muted);font-size:13.5px;line-height:1.6;}
.intop-redesign .app-card .ac-link {color:var(--p-blue);font-weight:600;font-size:13.5px;}
.intop-redesign .shop-strip {display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:30px;}
.intop-redesign .flow {display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:30px;}
.intop-redesign .step {background:#fff;border:1px solid var(--p-border);border-radius:12px;padding:18px;}
.intop-redesign .step .n {display:inline-flex;width:30px;height:30px;align-items:center;justify-content:center;border-radius:50%;background:var(--p-navy);color:#fff;font-weight:700;font-size:14px;margin-bottom:10px;}
.intop-redesign .step h4 {margin:0 0 6px;color:var(--p-navy);font-size:16px;}
.intop-redesign .step p {margin:0;color:var(--p-muted);font-size:14px;line-height:1.6;}
.intop-redesign .mode-cards {display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:30px;}
.intop-redesign .mode {background:#fff;border:1px solid var(--p-border);border-radius:12px;padding:22px;text-align:left;}
.intop-redesign .mode .mh {display:flex;align-items:center;gap:10px;margin-bottom:8px;}
.intop-redesign .mode .mh b {color:var(--p-navy);font-size:17px;}
.intop-redesign .mode .badge {width:26px;height:26px;border-radius:7px;background:var(--p-accent);color:#06314a;display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;}
.intop-redesign .mode p {margin:0;color:var(--p-muted);font-size:14.5px;line-height:1.65;}
.intop-redesign .cta-band {background:linear-gradient(120deg,var(--p-navy),#143a6e);color:#fff;text-align:center;padding:56px 0;}
.intop-redesign .cta-band h2 {margin:0 0 10px;font-size:26px;color:#fff;}
.intop-redesign .cta-band p {margin:0 auto 24px;color:rgba(255,255,255,.82);max-width:620px;line-height:1.7;}
.intop-redesign .cta-band .btn {display:inline-block;padding:13px 26px;border-radius:8px;background:var(--p-accent);color:#06314a;font-weight:700;text-decoration:none;}
@media(max-width:860px) {
.intop-redesign .wt-hero .container, .intop-redesign .two, .intop-redesign .spec-duo, .intop-redesign .spec-duo.even, .intop-redesign .adv-grid, .intop-redesign .rel-grid, .intop-redesign .feature, .intop-redesign .app-cards, .intop-redesign .shop-strip, .intop-redesign .flow, .intop-redesign .mode-cards {grid-template-columns:1fr;}
.intop-redesign .two.rev .col-img, .intop-redesign .feature.rev .f-img {order:0;}
.intop-redesign .wt-hero h1 {font-size:27px;}
.intop-redesign .feature {padding:18px;}
}
.intop-redesign .cat-card .thumb { aspect-ratio: 1/1; background: #f2f5f8; }
.intop-redesign .cat-card .thumb img { padding: 0; }
.intop-redesign .wt-hero .lead {margin-top:18px;color:rgba(255,255,255,.86);font-size:17px;line-height:1.7;max-width:580px;}
.intop-redesign .sec .sub {color:var(--p-muted);max-width:840px;line-height:1.7;}
.intop-redesign .facts li b {color:var(--p-navy);font-weight:600;flex:0 0 30%;}
.intop-redesign .spec-duo {display:grid;grid-template-columns:1.35fr 1fr;gap:28px;margin-top:34px;align-items:start;}
.intop-redesign .glance {border:1px solid var(--p-border);border-radius:12px;background:#fff;padding:24px 26px;box-shadow:0 10px 30px rgba(12,42,82,.06);}
.intop-redesign .glance h3 {margin:0;color:var(--p-navy);font-size:18px;}
.intop-redesign .glance p {margin:8px 0 0;color:var(--p-muted);font-size:14px;line-height:1.65;}
.intop-redesign .glance .grid {display:grid;grid-template-columns:1fr 1fr;gap:18px 16px;margin-top:20px;}
.intop-redesign .glance .kv {border-left:3px solid var(--p-accent);padding-left:12px;}
.intop-redesign .glance .kv b {display:block;color:var(--p-navy);font-size:19px;line-height:1.25;}
.intop-redesign .glance .kv span {font-size:12.5px;color:var(--p-muted);display:block;margin-top:3px;}
.intop-redesign .joint-strip {display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:32px;}
.intop-redesign .joint {background:#fff;border:1px solid var(--p-border);border-radius:12px;overflow:hidden;margin:0;}
.intop-redesign .joint img {width:100%;height:250px;object-fit:cover;display:block;background:#fff;}
.intop-redesign .joint figcaption {padding:13px 15px 15px;font-size:13.5px;color:var(--p-muted);line-height:1.6;border-top:1px solid var(--p-border);background:#fbfcfe;}
.intop-redesign .joint figcaption b {display:block;color:var(--p-navy);font-size:14.5px;margin-bottom:3px;}
.intop-redesign .cmp-wrap {border:1px solid var(--p-border);border-radius:12px;overflow:hidden;background:#fff;margin-top:34px;overflow-x:auto;}
.intop-redesign table.cmp {width:100%;border-collapse:collapse;font-size:14.5px;min-width:760px;}
.intop-redesign table.cmp th, .intop-redesign table.cmp td {padding:13px 18px;border-bottom:1px solid var(--p-border);text-align:left;vertical-align:top;line-height:1.6;}
.intop-redesign table.cmp thead th {background:var(--p-navy);color:#fff;font-size:14.5px;font-weight:700;}
.intop-redesign table.cmp tbody td:first-child {color:var(--p-navy);font-weight:600;width:19%;}
.intop-redesign table.cmp tbody tr:nth-child(even) td {background:#f8fbfe;}
.intop-redesign table.cmp td.them {color:var(--p-muted);}
.intop-redesign table.cmp td.us {color:#0b6b8a;font-weight:600;}
.intop-redesign table.cmp tr:last-child td {border-bottom:none;}
.intop-redesign .flow {display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:32px;}
.intop-redesign .chips {display:flex;flex-wrap:wrap;gap:10px;margin-top:22px;}
.intop-redesign .chip {background:#fff;color:var(--p-navy);border:1px solid #d6e2f5;padding:7px 14px;border-radius:999px;font-size:14px;}
.intop-redesign .note {margin-top:22px;color:var(--p-muted);font-size:14.5px;line-height:1.7;}
.intop-redesign .note a {font-weight:600;}
.intop-redesign .cta-band p {margin:0 auto 24px;color:rgba(255,255,255,.82);max-width:660px;line-height:1.7;}
@media(max-width:960px) {
.intop-redesign .wt-hero .container, .intop-redesign .two, .intop-redesign .spec-duo, .intop-redesign .adv-grid, .intop-redesign .rel-grid, .intop-redesign .flow, .intop-redesign .joint-strip {grid-template-columns:1fr;}
.intop-redesign .two.rev .col-img {order:0;}
.intop-redesign .joint img {height:220px;}
@media(max-width:640px) {
.intop-redesign .glance .grid {grid-template-columns:1fr;}
.intop-redesign .joint img {height:auto;max-height:280px;object-fit:contain;}
.intop-redesign .facts li {flex-direction:column;gap:2px;}
.intop-redesign .facts li b {flex:none;}
.intop-redesign .facts li span {text-align:left;}
.intop-redesign .roller-strip {display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:32px;}
.intop-redesign .roller {background:#fff;border:1px solid var(--p-border);border-radius:12px;overflow:hidden;margin:0;}
.intop-redesign .roller img {width:100%;height:240px;object-fit:cover;display:block;background:#fff;}
.intop-redesign .roller figcaption {padding:13px 15px 15px;font-size:13.5px;color:var(--p-muted);line-height:1.6;border-top:1px solid var(--p-border);background:#fbfcfe;}
.intop-redesign .roller figcaption b {display:block;color:var(--p-navy);font-size:14.5px;margin-bottom:3px;}
.intop-redesign table.cmp {width:100%;border-collapse:collapse;font-size:14.5px;min-width:680px;}
.intop-redesign table.cmp tbody td:first-child {color:var(--p-navy);font-weight:600;width:20%;}
.intop-redesign .cta-band p {margin:0 auto 24px;color:rgba(255,255,255,.82);max-width:640px;line-height:1.7;}
.intop-redesign .wt-hero .container, .intop-redesign .two, .intop-redesign .spec-duo, .intop-redesign .adv-grid, .intop-redesign .rel-grid, .intop-redesign .flow, .intop-redesign .roller-strip {grid-template-columns:1fr;}
.intop-redesign .roller img {height:210px;}
.intop-redesign .roller img {height:auto;max-height:260px;object-fit:contain;}
.intop-redesign .sec .sub {color:var(--p-muted);max-width:760px;line-height:1.7;}
.intop-redesign .parts {list-style:none;margin:0;padding:0;display:grid;gap:12px;}
.intop-redesign .parts li {background:#fff;border:1px solid var(--p-border);border-left:4px solid var(--p-accent);border-radius:10px;padding:14px 18px;}
.intop-redesign .parts h4 {margin:0 0 4px;color:var(--p-navy);font-size:16px;}
.intop-redesign .parts p {margin:0;color:var(--p-muted);font-size:14px;line-height:1.6;}
.intop-redesign .secu {border:1px solid var(--p-border);border-radius:12px;overflow:hidden;background:#fff;margin-top:34px;}
.intop-redesign .secu h3 {margin:0;background:var(--p-navy);color:#fff;font-size:16px;padding:14px 18px;}
.intop-redesign .secu .row {display:grid;grid-template-columns:240px 1fr;gap:18px;padding:14px 18px;border-bottom:1px solid var(--p-border);}
.intop-redesign .secu .row:last-child {border-bottom:none;}
.intop-redesign .secu .row h4 {margin:0;color:var(--p-navy);font-size:15.5px;}
.intop-redesign .secu .row p {margin:0;color:var(--p-muted);font-size:14.5px;line-height:1.7;}
.intop-redesign .spec-card {border:1px solid var(--p-border);border-radius:12px;overflow:hidden;background:#fff;margin-top:34px;}
.intop-redesign .table-scroll {width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;}
.intop-redesign table.spec {width:100%;min-width:680px;border-collapse:collapse;font-size:14px;table-layout:fixed;}
.intop-redesign table.spec th, .intop-redesign table.spec td {padding:10px 12px;border-bottom:1px solid var(--p-border);text-align:center;vertical-align:top;word-break:break-word;}
.intop-redesign table.spec td:first-child, .intop-redesign table.spec th:first-child {text-align:left;color:var(--p-muted);width:22%;}
.intop-redesign table.spec th:not(:first-child), .intop-redesign table.spec td:not(:first-child) {width:15.6%;}
.intop-redesign .spec-note {font-size:13px;color:var(--p-muted);margin:12px 2px 0;}
.intop-redesign .app-list {list-style:none;margin:34px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:14px;}
.intop-redesign .app-list h4 {margin:0 0 4px;color:var(--p-navy);font-size:15.5px;}
.intop-redesign .usecase {background:#fff;border:1px solid var(--p-border);border-left:4px solid var(--p-accent);border-radius:12px;padding:22px 26px;margin-top:26px;}
.intop-redesign .usecase h3 {color:var(--p-navy);margin:0 0 12px;font-size:21px;}
.intop-redesign .usecase p {line-height:1.8;color:var(--p-ink);margin:0 0 14px;}
.intop-redesign .usecase p:last-child {margin-bottom:0;}
.intop-redesign .manu-grid {display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:22px;}
.intop-redesign .rel img {width:100%;height:150px;object-fit:cover;background:var(--p-bg-alt);}
.intop-redesign .wt-hero .container, .intop-redesign .two, .intop-redesign .adv-grid, .intop-redesign .rel-grid, .intop-redesign .secu .row, .intop-redesign .app-list, .intop-redesign .manu-grid {grid-template-columns:1fr;}
.intop-redesign .spec-card table.spec.wide {font-size:13.5px;}
.intop-redesign .spec-card table.spec.wide td:first-child, .intop-redesign .spec-card table.spec.wide th:first-child {width:20%;}
.intop-redesign .spec-card table.spec.wide th, .intop-redesign .spec-card table.spec.wide td {padding:10px 12px;}
.intop-redesign .imgcard.on-dark {box-shadow:0 20px 50px rgba(0,0,0,.35);}
.intop-redesign table.spec td:first-child {color:var(--p-muted);width:46%;}
.intop-redesign .wt-hero .container, .intop-redesign .two, .intop-redesign .spec-duo, .intop-redesign .adv-grid, .intop-redesign .rel-grid, .intop-redesign .feature {grid-template-columns:1fr;}
.intop-redesign .wt-hero h1, .intop-redesign .wt-hero h1 *{color:#fff !important; -webkit-text-fill-color:#fff !important;}

.intop-redesign .shop-strip{display:flex !important;flex-wrap:nowrap;gap:14px;margin-top:30px;}
.intop-redesign .shop-strip .imgcard{flex:1 1 0;min-width:0;margin:0;}
@media(max-width:600px){
  .intop-redesign .shop-strip{flex-wrap:wrap;gap:12px;}
  .intop-redesign .shop-strip .imgcard{flex:1 1 46%;}
}



.site-header, .site-footer { display:none !important; }


.intop-redesign .gnav-logo {
  background:url('https://www.intopindustrial.com/wp-content/uploads/sites/18/2026/10/intop-logo.png') left center/contain no-repeat;
  width:176px; height:46px; display:block; gap:0;
}
.intop-redesign .gnav-logo .mark,
.intop-redesign .gnav-logo .tag { display:none !important; }


.intop-redesign .gfoot-brand .mark {
  background:url('https://www.intopindustrial.com/wp-content/uploads/sites/18/2026/10/intop-logo-light.png') left center/contain no-repeat;
  width:176px; height:48px; font-size:0 !important; line-height:0 !important; color:transparent !important;
}
.intop-redesign .gfoot-brand .mark span { display:none !important; }


.intop-redesign .wt-hero h1,
.intop-redesign .wt-hero h1 * { color:#fff !important; -webkit-text-fill-color:#fff !important; }


.intop-redesign .hero { display:block !important; text-align:left !important; }
.intop-redesign .hero .hero-copy { max-width:560px; margin-left:0 !important; margin-right:auto; text-align:left !important; }
.intop-redesign .hero h1 { margin:0 0 18px !important; max-width:none !important; text-align:left !important; }
.intop-redesign .hero .lead,
.intop-redesign .hero p { margin-left:0 !important; margin-right:auto !important; text-align:left !important; max-width:540px; }
.intop-redesign .hero .actions { justify-content:flex-start !important; margin-left:0 !important; }


.intop-redesign .gfoot { border-top:3px solid #e8641e; }

.intop-redesign .cache-bust-v1792109900{display:block;}
}}

/* custom: intop-page-banners */
/* Per-page hero banner — Contact only (page-id-2326). Home and all other pages keep banner-hero.jpg.
   About Us now shows NO banner (plain text heading, like /applications/ & /resources/).
   Gradient + breakpoint mirror the global .intop-redesign .hero rule. */

body.page-id-2326 .intop-redesign .hero {
  background:
    linear-gradient(90deg, rgba(240,244,248,.97) 0%, rgba(240,244,248,.88) 38%, rgba(240,244,248,.35) 58%, rgba(240,244,248,0) 76%),
    #eef2f6 url('/wp-content/uploads/sites/18/2026/10/contact-banner.jpg') right center / cover no-repeat;
}

@media (max-width: 900px) {
  body.page-id-2326 .intop-redesign .hero {
    background:
      linear-gradient(rgba(240,244,248,.93), rgba(240,244,248,.93)),
      #eef2f6 url('/wp-content/uploads/sites/18/2026/10/contact-banner.jpg') center / cover no-repeat;
  }
}