/* ============================================================
   CTN USA -- Master Stylesheet
   Rebuilt and optimized. All !important flags removed.
   CSS variables used throughout for consistency.
   ============================================================ */

:root {
  --blue: #2B7AB7;
  --blue-dark: #24689B;
  --blue-light: #7FB6E0;
  --ink: #1A1D21;
  --ink-soft: #22262b;
  --grey: #6B7280;
  --grey-light: #aeb7c0;
  --light: #F2F5F7;
  --line: #e6eaee;
  --white: #fff;
  --maxw: 1200px;
  --head: "Avenir Next", "Avenir", "Montserrat", "Segoe UI", sans-serif;
  --body: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/* -- Reset & base --------------------------------------------------------- */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { font-family: var(--body); color: var(--ink); background: var(--white); line-height: 1.6; -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4 { font-family: var(--head); font-weight: 800; line-height: 1.08; letter-spacing: -0.02em; }
p { margin-bottom: 16px; }
p:last-child { margin-bottom: 0; }
img { max-width: 100%; display: block; height: auto; }
a { color: inherit; text-decoration: none; }
ul, ol { list-style: none; }
address { font-style: normal; }

/* -- Global list styling (content lists) --------------------------------- */
.content-list, article ul, article ol, .legal-content ul, .legal-content ol {
  list-style: disc;
  padding-left: 28px;
  margin-bottom: 16px;
}
.content-list li, article ul li, article ol li, .legal-content ul li, .legal-content ol li {
  color: var(--ink);
  font-family: var(--body);
  font-size: 16px;
  line-height: 1.6;
  margin-bottom: 8px;
}
li::marker { color: var(--blue); }

/* -- Accessibility -------------------------------------------------------- */
.skip { position: absolute; left: -9999px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.skip:focus { position: fixed; left: 16px; top: 16px; width: auto; height: auto; background: var(--blue); color: #fff; padding: 12px 18px; border-radius: 4px; z-index: 200; font-weight: 700; }

/* -- Layout --------------------------------------------------------------- */
.wrap { max-width: var(--maxw); margin: 0 auto; padding: 0 24px; }
.eyebrow { font-family: var(--body); font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.6px; color: var(--blue); margin-bottom: 18px; display: block; }
.eyebrow.on-dark { color: var(--blue-light); }

/* -- Buttons -------------------------------------------------------------- */
.btn { display: inline-block; font-family: var(--body); font-weight: 700; text-transform: uppercase; letter-spacing: 1px; font-size: 13.5px; padding: 15px 30px; border-radius: 4px; cursor: pointer; border: 1px solid transparent; transition: background .2s, color .2s, border-color .2s; }
.btn-primary { background: var(--blue); color: #fff; }
.btn-primary:hover { background: var(--blue-dark); }
.btn-secondary { background: transparent; border-color: var(--blue); color: var(--blue); }
.btn-secondary:hover { background: var(--blue); color: #fff; }
.btn-ghost { background: transparent; border-color: rgba(255,255,255,.5); color: #fff; }
.btn-ghost:hover { background: #fff; color: var(--ink); }
.btn-white { background: #fff; color: var(--ink); }
.btn-white:hover { background: var(--light); }

/* -- Event banner --------------------------------------------------------- */
.event-banner { width: 100%; background: linear-gradient(90deg, #1A1D21 0%, #2B3540 50%, #1A1D21 100%); border-bottom: 2px solid var(--blue); padding: 11px 24px; text-align: center; font-family: var(--body); font-size: 14px; color: #fff; line-height: 1.5; }
.event-banner .eb-tag { display: inline-block; background: var(--blue); color: #fff; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.6px; padding: 3px 10px; border-radius: 3px; margin-right: 12px; vertical-align: middle; }
.event-banner a { color: var(--blue-light); font-weight: 700; font-size: 13px; border-bottom: 1px solid rgba(127,182,224,.5); padding-bottom: 1px; }
.event-banner a:hover { color: #fff; border-bottom-color: #fff; }

/* -- Navigation ----------------------------------------------------------- */
header.nav { position: sticky; top: 0; z-index: 50; background: rgba(18,20,23,.92); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-bottom: 1px solid rgba(255,255,255,.08); }
.nav-inner { display: flex; align-items: center; justify-content: space-between; height: 72px; }
.nav-logo img { width: 120px; }
.nav-links { display: flex; align-items: center; gap: 34px; }
.nav-links a { color: #e7eaee; font-size: 14.5px; font-weight: 500; letter-spacing: .2px; transition: color .15s; }
.nav-links a:hover { color: #fff; }
.nav-prod { position: relative; }
.nav-drop { position: absolute; top: 120%; left: -16px; background: #fff; border-radius: 8px; box-shadow: 0 18px 50px rgba(0,0,0,.22); padding: 10px; min-width: 240px; opacity: 0; visibility: hidden; transform: translateY(6px); transition: opacity .18s, visibility .18s, transform .18s; list-style: none; }
.nav-prod:hover .nav-drop, .nav-prod:focus-within .nav-drop { opacity: 1; visibility: visible; transform: translateY(0); }
.nav-drop li a { display: block; color: var(--ink); padding: 9px 14px; border-radius: 6px; font-size: 14px; }
.nav-drop li a:hover { background: var(--light); color: var(--blue); }
.nav-cta { padding: 11px 22px; }
.hamb { display: none; flex-direction: column; gap: 5px; cursor: pointer; background: transparent; border: none; padding: 8px; }
.hamb span { display: block; width: 24px; height: 2px; background: #fff; }

/* -- Hero (homepage) ------------------------------------------------------ */
.hero { position: relative; color: #fff; background: var(--ink); overflow: hidden; }
.hero-bg { position: absolute; inset: 0; background-size: cover; background-position: center; opacity: .42; }
.hero-bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(105deg, rgba(18,20,23,.92) 30%, rgba(18,20,23,.55)); }
.hero-inner { position: relative; padding: 100px 24px 130px; }
.hero h1 { font-size: clamp(40px,6vw,66px); max-width: 14ch; }
.hero .sub { font-size: clamp(17px,2vw,21px); color: #cbd3da; max-width: 54ch; margin: 26px 0 38px; font-weight: 300; }
.hero-actions { display: flex; gap: 16px; flex-wrap: wrap; }

/* -- Hero (product) ------------------------------------------------------- */
.phero { position: relative; background: var(--ink); color: #fff; overflow: hidden; }
.phero::before { content: ""; position: absolute; top: -30%; right: -10%; width: 60%; height: 160%; background: radial-gradient(circle, rgba(43,122,183,.30), transparent 65%); pointer-events: none; }
.phero-inner { position: relative; display: grid; grid-template-columns: 1.1fr .9fr; gap: 50px; align-items: center; padding: 96px 24px; }
.phero h1 { font-size: clamp(36px,4.6vw,54px); }
.phero .sub { color: #cbd3da; font-size: 19px; font-weight: 300; margin: 22px 0 34px; max-width: 46ch; }
.phero-img { display: flex; justify-content: center; align-items: center; min-height: 320px; }
.phero-img img { max-height: 420px; width: auto; filter: drop-shadow(0 30px 60px rgba(0,0,0,.5)); }

/* -- Breadcrumb ----------------------------------------------------------- */
.breadcrumb { background: var(--light); padding: 14px 0; font-size: 13.5px; color: var(--grey); }
.breadcrumb ol { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; list-style: none; }
.breadcrumb li:not(:last-child)::after { content: "\203A"; margin-left: 8px; color: var(--grey); }
.breadcrumb a { color: var(--blue); }
.breadcrumb a:hover { text-decoration: underline; }

/* -- Sections ------------------------------------------------------------- */
section.band { padding: 104px 0; }
section.band.light { background: var(--light); }
section.band.dark { background: var(--ink); color: #fff; }
.center-narrow { max-width: 900px; margin: 0 auto; text-align: center; }
.center-narrow h2 { font-size: clamp(30px,3.6vw,42px); margin-bottom: 24px; }
.center-narrow p { font-size: 18.5px; color: var(--grey); }
.dark .center-narrow p { color: #b9c2cb; }
.sec-head { text-align: center; max-width: 820px; margin: 0 auto 56px; }
.sec-head h2 { font-size: clamp(30px,3.6vw,40px); margin-bottom: 16px; }
.sec-head p { color: var(--grey); font-size: 18px; }
.dark .sec-head h2 { color: #fff; }
.dark .sec-head p { color: #b9c2cb; }

/* -- Video ---------------------------------------------------------------- */
.video-wrap { margin-top: 40px; }
.video-wrap iframe { max-width: 100%; height: auto; aspect-ratio: 16/9; width: 700px; }

/* -- Grids & Cards -------------------------------------------------------- */
.grid { display: grid; gap: 26px; }
.g2 { grid-template-columns: repeat(2,1fr); }
.g3 { grid-template-columns: repeat(3,1fr); }
.g4 { grid-template-columns: repeat(4,1fr); }
.card { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 34px 30px; transition: transform .2s, box-shadow .2s, border-color .2s; }
.dark .card { background: var(--ink-soft); border-color: #2f343a; }
.card:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(26,29,33,.10); border-color: var(--blue); }
.card .num { font-family: var(--head); font-weight: 800; color: var(--blue); font-size: 15px; margin-bottom: 14px; }
.card h3 { font-size: 20px; margin-bottom: 12px; }
.card p { color: var(--grey); font-size: 15.5px; }
.dark .card p { color: var(--grey-light); }

/* -- Product lineup ------------------------------------------------------- */
.plineup { display: grid; grid-template-columns: repeat(4,1fr); gap: 22px; }
.pcard { background: var(--ink); border-radius: 14px; padding: 28px 24px 26px; color: #fff; border: 1px solid #2a2f35; transition: transform .25s, border-color .25s, box-shadow .25s; display: flex; flex-direction: column; text-align: left; }
.pcard:hover { transform: translateY(-6px); border-color: var(--blue); box-shadow: 0 24px 50px rgba(0,0,0,.28); }
.pcard .imgbox { height: 150px; display: flex; align-items: center; justify-content: center; margin-bottom: 20px; }
.pcard .imgbox img { max-height: 140px; width: auto; }
.pcard h3 { font-size: 18px; margin-bottom: 8px; }
.pcard p { font-size: 14px; color: var(--grey-light); flex: 1; margin-bottom: 0; }
.pcard .more { color: var(--blue-light); font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .6px; margin-top: 16px; }

/* -- Stats ---------------------------------------------------------------- */
.stats { display: grid; grid-template-columns: repeat(3,1fr); gap: 30px; text-align: center; margin-top: 46px; }
.stat .n { font-family: var(--head); font-weight: 800; font-size: 46px; color: var(--blue); line-height: 1; }
.dark .stat .n { color: var(--blue-light); }
.stat .l { margin-top: 10px; color: var(--grey); font-size: 15px; }
.dark .stat .l { color: #b9c2cb; }

/* -- Built section -------------------------------------------------------- */
.built { display: grid; grid-template-columns: 1.2fr .8fr; gap: 50px; align-items: center; }
.built .badge { background: var(--blue); color: #fff; display: inline-flex; align-items: center; gap: 10px; padding: 10px 18px; border-radius: 30px; font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .8px; margin-bottom: 22px; }
.built h2 { font-size: clamp(28px,3.4vw,38px); margin-bottom: 18px; color: #fff; }
.built p { color: #b9c2cb; font-size: 17.5px; margin-bottom: 0; }
.flag { font-size: 74px; text-align: center; }

/* -- CTA band ------------------------------------------------------------- */
.cta-band { background: var(--ink); color: #fff; text-align: center; padding: 96px 0; }
.cta-band h2 { font-size: clamp(28px,3.4vw,40px); max-width: 18ch; margin: 0 auto 20px; }
.cta-band p { color: #b9c2cb; font-size: 18px; max-width: 52ch; margin: 0 auto 34px; }

/* -- Footer --------------------------------------------------------------- */
footer { background: #0f1114; color: #cfd5db; padding: 70px 0 34px; }
.foot-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.2fr; gap: 40px; margin-bottom: 40px; }
footer img.flogo { width: 120px; margin-bottom: 18px; }
footer .tag { font-size: 14.5px; color: #9aa3ac; max-width: 34ch; line-height: 1.6; margin-bottom: 0; }
footer h2.fcol-h { font-family: var(--head); color: #fff; font-size: 13px; text-transform: uppercase; letter-spacing: 1.2px; margin-bottom: 18px; font-weight: 700; }
footer ul { list-style: none; }
footer li { margin-bottom: 11px; }
footer li a { font-size: 14.5px; color: #9aa3ac; transition: color .15s; }
footer li a:hover { color: #fff; }
footer address { font-size: 14.5px; color: #9aa3ac; line-height: 1.8; }
footer address a { color: #9aa3ac; transition: color .15s; }
footer address a:hover { color: #fff; }
.foot-legal { display: flex; flex-wrap: wrap; gap: 8px 24px; padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid #21252a; }
.foot-legal a { font-size: 13px; color: #6b7480; transition: color .15s; }
.foot-legal a:hover { color: #9aa3ac; }
.foot-bottom { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px; font-size: 13px; color: #727b84; }

/* -- Specs ---------------------------------------------------------------- */
.specs-table { display: grid; grid-template-columns: 1fr 1.6fr; max-width: 820px; margin: 0 auto; column-gap: 32px; }
.specs-table dt { padding: 16px 0; font-family: var(--head); font-weight: 700; color: var(--ink); font-size: 15px; border-bottom: 1px solid var(--line); }
.specs-table dd { padding: 16px 0; margin: 0; color: var(--ink); font-size: 15.5px; border-bottom: 1px solid var(--line); line-height: 1.55; }
.specs-table dt:last-of-type, .specs-table dd:last-of-type { border-bottom: none; }
.specs-note { max-width: 820px; margin: 28px auto 0; padding: 16px 20px; background: #fff; border-left: 3px solid var(--blue); font-size: 14px; color: var(--grey); line-height: 1.55; }
.specs-models { max-width: 1000px; margin: 0 auto; overflow-x: auto; }
.specs-models table { width: 100%; border-collapse: collapse; font-size: 14.5px; }
.specs-models th { font-family: var(--head); font-weight: 700; color: var(--blue); text-align: left; padding: 14px; border-bottom: 2px solid var(--blue); font-size: 13px; text-transform: uppercase; letter-spacing: .5px; white-space: nowrap; }
.specs-models td { padding: 13px 14px; border-bottom: 1px solid var(--line); vertical-align: top; color: var(--ink); }
.specs-models td:first-child { font-family: var(--head); font-weight: 700; white-space: nowrap; }

/* -- LedPro --------------------------------------------------------------- */
.ledpro-hero .phero-inner { grid-template-columns: 1fr 1fr; }
.ledpro-dual { display: flex; flex-direction: column; gap: 24px; align-items: center; }
.ledpro-dual figure { text-align: center; margin: 0; }
.ledpro-dual img { max-height: 240px; width: auto; filter: drop-shadow(0 20px 40px rgba(0,0,0,.45)); }
.ledpro-dual figcaption { margin-top: 10px; font-family: var(--head); font-size: 13px; color: var(--blue-light); text-transform: uppercase; letter-spacing: 1.2px; font-weight: 700; }
.ledpro-compare { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; align-items: stretch; }
.ledpro-compare .col { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 38px 34px; display: flex; flex-direction: column; }
.ledpro-compare .col.vertical { border-color: var(--blue); box-shadow: 0 14px 36px rgba(43,122,183,.10); }
.ledpro-compare .col-eyebrow { font-family: var(--body); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.4px; color: var(--blue); margin-bottom: 10px; display: block; }
.ledpro-compare h3 { font-size: 24px; margin-bottom: 16px; color: var(--ink); }
.ledpro-compare p { color: var(--grey); font-size: 15.5px; }
.ledpro-compare li { color: var(--grey); font-size: 15.5px; margin: 0 14px; }
.ledpro-compare .meta { margin-top: auto; padding-top: 22px; border-top: 1px solid var(--line); font-size: 14px; color: var(--grey); }
.ledpro-compare .meta strong { color: var(--ink); display: block; margin-top: 8px; margin-bottom: 4px; font-family: var(--head); font-size: 12px; text-transform: uppercase; letter-spacing: 1px; }

/* -- Events page ---------------------------------------------------------- */
.events-hero { padding: 90px 0 80px; text-align: center; }
.events-hero h1 { font-size: clamp(36px,5vw,58px); margin-bottom: 18px; }
.events-hero p { color: #b9c2cb; font-size: 19px; max-width: 52ch; margin: 0 auto; }
.events-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 32px; padding: 80px 0; }
.event-card { border-radius: 16px; overflow: hidden; border: 1px solid var(--line); background: #fff; transition: transform .25s, box-shadow .25s, border-color .25s; display: flex; flex-direction: column; }
.event-card:hover { transform: translateY(-6px); box-shadow: 0 24px 52px rgba(26,29,33,.12); border-color: var(--blue); }
.event-card.coming-soon { cursor: default; }
.event-card.coming-soon:hover { transform: none; box-shadow: none; border-color: var(--line); }
.ec-img { position: relative; height: 260px; overflow: hidden; background: var(--ink); }
.ec-img img { width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; transition: transform .4s ease; }
.event-card:not(.coming-soon):hover .ec-img img { transform: scale(1.04); }
.cs-overlay { position: absolute; inset: 0; background: rgba(18,20,23,.72); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; }
.cs-badge { font-family: var(--head); font-weight: 800; font-size: clamp(20px,3vw,28px); color: #fff; text-transform: uppercase; letter-spacing: 3px; padding: 14px 28px; border: 2px solid rgba(255,255,255,.4); border-radius: 6px; backdrop-filter: blur(4px); }
.cs-sub { color: rgba(255,255,255,.65); font-size: 14px; text-transform: uppercase; letter-spacing: 1.4px; font-weight: 600; }
.active-badge { position: absolute; top: 16px; left: 16px; background: var(--blue); color: #fff; font-family: var(--head); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.6px; padding: 6px 14px; border-radius: 4px; z-index: 2; }
.ec-body { padding: 30px 28px; flex: 1; display: flex; flex-direction: column; }
.ec-eyebrow { font-family: var(--head); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.5px; color: var(--blue); margin-bottom: 10px; display: block; }
.ec-body h2 { font-size: clamp(20px,2.4vw,26px); margin-bottom: 18px; line-height: 1.15; }
.ec-meta { display: grid; grid-template-columns: auto 1fr; gap: 6px 16px; margin-bottom: 22px; align-items: start; }
.ec-meta .lbl { font-family: var(--head); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.2px; color: var(--blue); padding-top: 3px; white-space: nowrap; }
.ec-meta .val { font-size: 15px; color: var(--ink); line-height: 1.5; }
.ec-meta .val.booth { font-family: var(--head); font-size: 22px; font-weight: 800; color: var(--ink); }
.ec-body .btn { margin-top: auto; align-self: flex-start; }
.ec-coming-note { margin-top: auto; font-size: 14px; color: var(--grey); font-style: italic; }
.ec-coming-note a { color: var(--blue); }

/* -- AT Expo landing page ------------------------------------------------- */
.event-hero { position: relative; background: var(--ink); color: #fff; overflow: hidden; }
.event-hero-bg { position: absolute; inset: 0; background-size: cover; background-position: center; opacity: .35; }
.event-hero-bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(18,20,23,.7) 0%, rgba(18,20,23,.92) 100%); }
.event-hero-inner { position: relative; padding: 110px 0 100px; max-width: var(--maxw); margin: 0 auto; padding-left: 24px; padding-right: 24px; }
.event-hero-content { text-align: center; max-width: 880px; margin: 0 auto; }
.event-hero-content h1 { font-size: clamp(44px,7vw,80px); line-height: 1; margin-bottom: 24px; }
.event-hero-content .accent { color: var(--blue-light); display: block; font-size: clamp(20px,2.4vw,28px); font-weight: 600; text-transform: uppercase; letter-spacing: 3px; margin-bottom: 18px; font-family: var(--body); }
.event-hero-content .sub { font-size: clamp(17px,1.8vw,20px); color: #d0d6dc; max-width: 60ch; margin: 0 auto 40px; font-weight: 300; line-height: 1.6; }
.event-bar { display: flex; flex-wrap: wrap; justify-content: center; border-top: 1px solid rgba(255,255,255,.16); border-bottom: 1px solid rgba(255,255,255,.16); margin: 34px 0 38px; padding: 24px 0; background: rgba(43,122,183,.08); }
.event-bar .item { padding: 6px 28px; border-right: 1px solid rgba(255,255,255,.14); }
.event-bar .item:last-child { border-right: none; }
.event-bar .item .lbl { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: 2px; color: var(--blue-light); font-weight: 700; margin-bottom: 6px; font-family: var(--head); }
.event-bar .item .val { font-family: var(--head); font-size: 18px; font-weight: 700; color: #fff; }
.event-bar .item.booth .val { font-size: 28px; color: var(--blue-light); }
.demo-cta { display: inline-flex; align-items: center; gap: 12px; padding: 18px 36px; background: var(--blue); color: #fff; border-radius: 8px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.2px; font-size: 14.5px; transition: background .2s, transform .2s, box-shadow .2s; }
.demo-cta:hover { background: var(--blue-dark); transform: translateY(-2px); box-shadow: 0 14px 30px rgba(43,122,183,.4); }
.gcal-note { display: block; font-size: 12px; color: #9aa3ac; margin-top: 12px; }
.event-details-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; align-items: center; }
.event-details-text h2 { font-size: clamp(28px,3.4vw,38px); margin-bottom: 24px; }
.info-row { display: grid; grid-template-columns: 130px 1fr; gap: 14px; padding: 18px 0; border-bottom: 1px solid var(--line); font-size: 16px; }
.info-row:last-child { border-bottom: none; }
.info-row .lbl { font-family: var(--head); text-transform: uppercase; font-size: 12px; letter-spacing: 1.4px; color: var(--blue); font-weight: 700; padding-top: 3px; }
.info-row.booth .val { font-family: var(--head); font-size: 24px; font-weight: 800; color: var(--ink); }
.floor-plan { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 24px; box-shadow: 0 16px 40px rgba(26,29,33,.08); }
.fp-label { font-family: var(--head); font-size: 12px; text-transform: uppercase; letter-spacing: 1.5px; color: var(--blue); font-weight: 700; margin-bottom: 12px; text-align: center; }
.fp-placeholder { aspect-ratio: 4/3; background: linear-gradient(135deg, #F2F5F7 0%, #e6eaee 100%); border-radius: 8px; overflow: hidden; }
.fp-placeholder svg { width: 100%; height: 100%; }
.fp-caption { text-align: center; color: var(--grey); font-size: 13px; margin-top: 14px; font-style: italic; }
.booth-products { display: grid; grid-template-columns: repeat(2,1fr); gap: 24px; max-width: 980px; margin: 0 auto; }
.bp-card { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 32px 28px; display: flex; gap: 24px; align-items: flex-start; transition: transform .2s, box-shadow .2s, border-color .2s; }
.bp-card:hover { transform: translateY(-3px); box-shadow: 0 18px 40px rgba(26,29,33,.10); border-color: var(--blue); }
.bp-card .bp-img { flex-shrink: 0; width: 110px; height: 110px; background: var(--ink); border-radius: 10px; display: flex; align-items: center; justify-content: center; padding: 14px; }
.bp-card .bp-img img { max-height: 88px; max-width: 88px; width: auto; }
.bp-card .bp-content { flex: 1; }
.bp-debut { display: inline-block; background: var(--blue); color: #fff; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.4px; padding: 4px 10px; border-radius: 3px; margin-bottom: 10px; font-family: var(--head); }
.bp-card h3 { font-size: 20px; margin-bottom: 10px; }
.bp-card p { color: var(--grey); font-size: 14.5px; line-height: 1.6; margin-bottom: 0; }
.commitment-pillars { display: grid; grid-template-columns: repeat(3,1fr); gap: 32px; margin-top: 48px; }
.pillar { text-align: center; padding: 30px 20px; }
.pillar h3 { font-family: var(--head); color: var(--blue-light); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.6px; margin-bottom: 14px; }
.pillar p { color: #cbd3da; font-size: 15.5px; line-height: 1.6; max-width: 32ch; margin: 0 auto; }
.contact-row { display: flex; justify-content: center; gap: 36px; margin-top: 34px; flex-wrap: wrap; color: #cbd3da; font-size: 15px; }
.contact-row a { color: #fff; font-weight: 600; transition: color .15s; }
.contact-row a:hover { color: var(--blue-light); }

/* -- Contact page --------------------------------------------------------- */
.contact-hero { padding: 90px 0 80px; text-align: center; }
.contact-hero h1 { font-size: clamp(36px,5vw,54px); margin-bottom: 18px; }
.contact-hero p { color: #b9c2cb; font-size: 19px; max-width: 48ch; margin: 0 auto; }
.contact-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 26px; max-width: 900px; margin: 0 auto; padding: 80px 0; }
.contact-card { display: block; text-decoration: none; background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 40px 34px; text-align: center; transition: transform .2s, box-shadow .2s, border-color .2s; color: var(--ink); }
.contact-card:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(26,29,33,.10); border-color: var(--blue); }
.contact-card .icon { font-size: 32px; margin-bottom: 20px; }
.contact-card h2 { font-size: 18px; margin-bottom: 12px; }
.contact-card p { color: var(--grey); font-size: 15px; margin-bottom: 18px; }
.contact-card .contact-link { color: var(--blue); font-weight: 700; font-size: 16px; display: block; transition: color .15s; }
.contact-card:hover .contact-link { color: var(--blue-dark); }

/* -- Legal / compliance pages --------------------------------------------- */
.legal-hero { padding: 60px 0 40px; background: var(--light); }
.legal-hero h1 { font-size: clamp(28px,4vw,42px); color: var(--ink); }
.legal-body { background: #fff; }
.legal-content { max-width: 820px; padding: 60px 24px; }
.legal-content h2 { font-size: 22px; margin-top: 36px; margin-bottom: 12px; }
.legal-content h3 { font-size: 17px; margin-top: 24px; margin-bottom: 8px; }
.legal-content p { font-size: 16px; color: var(--ink); }
.legal-content a { color: var(--blue); text-decoration: underline; }
.legal-content ul, .legal-content ol { list-style: disc; padding-left: 28px; margin-bottom: 16px; }
.legal-content li { font-size: 16px; color: var(--ink); margin-bottom: 8px; line-height: 1.6; }

/* -- Disclaimer note ------------------------------------------------------ */
.disclaimer-note { text-align: center; font-size: 13px; color: var(--grey); padding: 20px 24px; background: var(--light); }

/* -- Mobile --------------------------------------------------------------- */
@media (max-width: 900px) {
  .nav-links { display: none; }
  .nav-links.open { display: flex; position: absolute; top: 72px; right: 0; left: 0; flex-direction: column; background: #16181c; padding: 20px 28px; gap: 18px; align-items: flex-start; z-index: 49; }
  .nav-links.open .nav-drop { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; background: transparent; padding: 0; margin-top: 8px; }
  .nav-links.open .nav-drop li a { color: #cfd5db; padding: 6px 0; }
  .hamb { display: flex; }
  .g3, .g4 { grid-template-columns: repeat(2,1fr); }
  .plineup { grid-template-columns: repeat(2,1fr); }
  .phero-inner { grid-template-columns: 1fr; gap: 30px; }
  .phero::before { top: -10%; right: auto; left: -20%; width: 140%; height: 70%; }
  .phero-img { order: -1; }
  .ledpro-hero .phero-inner { grid-template-columns: 1fr; }
  .built { grid-template-columns: 1fr; gap: 24px; }
  .ledpro-dual { flex-direction: row; justify-content: center; gap: 20px; }
  .ledpro-compare { grid-template-columns: 1fr; }
  .stats { grid-template-columns: 1fr; }
  .foot-grid { grid-template-columns: 1fr 1fr; }
  .event-details-grid { grid-template-columns: 1fr; gap: 30px; }
  .booth-products { grid-template-columns: 1fr; }
  .commitment-pillars { grid-template-columns: 1fr; gap: 14px; }
  .event-bar { flex-direction: column; align-items: stretch; }
  .event-bar .item { border-right: none; border-bottom: 1px solid rgba(255,255,255,.14); text-align: center; }
  .event-bar .item:last-child { border-bottom: none; }
  .contact-grid { grid-template-columns: 1fr; padding: 48px 0; }
}

@media (max-width: 760px) {
  .events-grid { grid-template-columns: 1fr; padding: 48px 0; }
  .ec-img { height: 220px; }
}

@media (max-width: 640px) {
  .specs-table { grid-template-columns: 1fr; gap: 0; }
  .specs-table dt { border-bottom: none; padding: 12px 0 2px; font-size: 12px; text-transform: uppercase; letter-spacing: .6px; color: var(--blue); }
  .specs-table dd { padding: 0 0 12px; border-bottom: 1px solid var(--line); }
}

@media (max-width: 560px) {
  .g2, .g3, .g4 { grid-template-columns: 1fr; }
  .plineup { grid-template-columns: 1fr; }
  .foot-grid { grid-template-columns: 1fr; }
  section.band { padding: 64px 0; }
  .hero-inner { padding: 80px 24px 90px; }
  .bp-card { flex-direction: column; gap: 18px; }
  .bp-card .bp-img { width: 100%; height: 140px; }
  .contact-row { flex-direction: column; gap: 12px; }
  .info-row { grid-template-columns: 1fr; gap: 4px; }
  .event-hero-inner { padding-top: 72px; padding-bottom: 70px; }
}

@media (min-width: 901px) {
  .ledpro-dual { flex-direction: row; justify-content: center; gap: 30px; }
  .ledpro-dual img { max-height: 300px; }
}


/* Industry benefits tabs */
.industries .ind-head { text-align: center; margin: 0 auto 36px; }
.ind-head h2 { font-size: clamp(30px,3.6vw,42px); }
.ind-tabs { display: flex; justify-content: center; gap: 8px; flex-wrap: wrap; margin-bottom: 40px; border-bottom: 1px solid var(--line); }
.ind-tab { font-family: var(--head); font-weight: 700; font-size: 15px; letter-spacing: .3px; color: var(--grey); background: transparent; border: none; border-bottom: 3px solid transparent; padding: 16px 26px; cursor: pointer; transition: color .18s, border-color .18s; margin-bottom: -1px; }
.ind-tab:hover { color: var(--ink); }
.ind-tab.is-active { color: var(--blue); border-bottom-color: var(--blue); }
.ind-tab:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; border-radius: 4px; }
.ind-panel { display: none; animation: indfade .35s ease; }
.ind-panel.is-active { display: block; }
@keyframes indfade { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
.ind-panel-lead { margin: 0 auto 32px; text-align: center; font-size: 16.5px; color: var(--grey); line-height: 1.6; }
.ind-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 20px; align-items: stretch; }
.ind-item { display: flex; align-items: center; gap: 16px; text-align: left; padding: 24px 22px; background: #fff; border: 1px solid var(--line); border-radius: 12px; height: 100%; }
.ind-icon { flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 12px; background: rgba(43,122,183,.08); }
.ind-icon svg { width: 24px; height: 24px; }
.ind-item-body { flex: 1; }
.ind-item h3 { font-size: 16px; margin-bottom: 7px; line-height: 1.25; }
.ind-item p { color: var(--grey); font-size: 14px; line-height: 1.5; }

/* Contact for pricing callout */
.price-callout { max-width: 820px; margin: 32px auto 0; display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; padding: 24px 30px; background: var(--ink); border-radius: 12px; }
.price-callout-label { display: block; font-family: var(--head); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.6px; color: var(--blue-light); margin-bottom: 4px; }
.price-callout-value { font-family: var(--head); font-size: 22px; font-weight: 800; color: #fff; }

/* Applicators */
.app-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; }
.app-card { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 28px; text-align: center; transition: transform .2s, box-shadow .2s, border-color .2s; }
.app-card:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(26,29,33,.10); border-color: var(--blue); }
.app-img { height: 150px; display: flex; align-items: center; justify-content: center; margin-bottom: 20px; background: var(--light); border-radius: 10px; }
.app-img img { max-height: 120px; max-width: 80%; width: auto; }
.app-card h3 { font-size: 18px; margin-bottom: 10px; }
.app-card p { color: var(--grey); font-size: 14.5px; line-height: 1.55; }
.boosters { display: grid; grid-template-columns: 1fr 1.4fr; gap: 40px; align-items: center; margin-top: 44px; padding: 36px; background: #fff; border: 1px solid var(--line); border-radius: 16px; }
.boosters-img { display: flex; align-items: center; justify-content: center; }
.boosters-img img { max-height: 220px; width: auto; border-radius: 10px; }
.boosters-text h3 { font-size: 24px; margin-bottom: 14px; }
.boosters-text p { color: var(--grey); font-size: 16px; line-height: 1.65; }

/* CTA light variant (for alternation) */
.cta-band.cta-light { background: var(--light); color: var(--ink); }
.cta-band.cta-light h2 { color: var(--ink); }
.cta-band.cta-light p { color: var(--grey); }
.cta-band.cta-light .btn-white { background: var(--blue); color: #fff; }
.cta-band.cta-light .btn-white:hover { background: var(--blue-dark); }

@media (max-width: 900px) {
  .ind-grid { grid-template-columns: repeat(2,1fr); gap: 16px; }
  .app-grid { grid-template-columns: repeat(2,1fr); }
  .boosters { grid-template-columns: 1fr; gap: 24px; text-align: center; }
  .boosters-img img { max-height: 180px; }
}
@media (max-width: 560px) {
  .ind-grid { grid-template-columns: 1fr; }
  .app-grid { grid-template-columns: 1fr; max-width: 360px; margin: 0 auto; }
  .ind-tabs { gap: 0; }
  .ind-tab { padding: 14px 16px; font-size: 13.5px; }
  .price-callout { flex-direction: column; text-align: center; align-items: stretch; }
  .price-callout .btn { width: 100%; }
}