/* ═══════════════════════════════════════
   SELF-HOSTED FONTS — Open Sans (v44, latin)
═══════════════════════════════════════ */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  font-display: block;
  src: url('fonts/open-sans-v44-latin-300.woff2') format('woff2');
}
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 300;
  font-display: block;
  src: url('fonts/open-sans-v44-latin-300italic.woff2') format('woff2');
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url('fonts/open-sans-v44-latin-regular.woff2') format('woff2');
}
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 400;
  font-display: block;
  src: url('fonts/open-sans-v44-latin-italic.woff2') format('woff2');
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 500;
  font-display: block;
  src: url('fonts/open-sans-v44-latin-500.woff2') format('woff2');
}
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 500;
  font-display: block;
  src: url('fonts/open-sans-v44-latin-500italic.woff2') format('woff2');
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  font-display: block;
  src: url('fonts/open-sans-v44-latin-600.woff2') format('woff2');
}
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 600;
  font-display: block;
  src: url('fonts/open-sans-v44-latin-600italic.woff2') format('woff2');
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 700;
  font-display: block;
  src: url('fonts/open-sans-v44-latin-700.woff2') format('woff2');
}
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 700;
  font-display: block;
  src: url('fonts/open-sans-v44-latin-700italic.woff2') format('woff2');
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 800;
  font-display: block;
  src: url('fonts/open-sans-v44-latin-800.woff2') format('woff2');
}
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 800;
  font-display: block;
  src: url('fonts/open-sans-v44-latin-800italic.woff2') format('woff2');
}

/* ═══════════════════════════════════════
   TOKENS — Hunter Green + Light default, Dark switchable
═══════════════════════════════════════ */
:root {
  --bg:        #f5f7f5;
  --bg2:       #c5d6c5;
  --bg3:       #d8e2d8;
  --bg4:       #ccd8cc;
  --text:      #0e1a0e;
  --muted:     #3a5c3a;
  --faint:     #7a9e7a;
  --accent:    #355e35;
  --accent-tan:#bb9a73;
  --accent2:   #3f7a3f;
  --accent-dim:rgba(53,94,53,0.1);
  --border:    rgba(0,0,0,0.08);
  --border2:   rgba(53,94,53,0.25);
  --white:     #ffffff;
  --nav-bg:    rgba(245,247,245,0.96);
  --shadow:    rgba(0,0,0,0.08);
  --card-bg:   #ffffff;
  --link:      #2a6e2a;

  /* Type scale -- 11 steps, replaces ~50 one-off font-size values */
  --fs-2xs:  0.65rem;
  --fs-xs:   0.73rem;
  --fs-sm:   0.8rem;
  --fs-base: 0.86rem;
  --fs-md:   0.95rem;
  --fs-lg:   1.05rem;
  --fs-xl:   1.25rem;
  --fs-2xl:  1.5rem;
  --fs-3xl:  1.9rem;
  --fs-4xl:  2.4rem;
  --fs-5xl:  3.2rem;
}

[data-theme="dark"] {
  --bg:        #090f09;
  --bg2:       #0f180f;
  --bg3:       #152115;
  --bg4:       #1c2c1c;
  --text:      #ccdacc;
  --muted:     #7a9e7a;
  --faint:     #5a7e5a;
  --accent:    #4a8c4a;
  --accent2:   #5aaa5a;
  --accent-tan:#d9be97;
  --accent-dim:rgba(74,140,74,0.1);
  --border:    rgba(255,255,255,0.07);
  --border2:   rgba(74,140,74,0.25);
  --white:     #d0ead0;
  --nav-bg:    rgba(9,15,9,0.96);
  --shadow:    rgba(0,0,0,0.3);
  --card-bg:   #0f180f;
  --link:      #6abf6a;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
[id] { scroll-margin-top: 110px; }
html.theme-switching, html.theme-switching * {
  transition: none !important;
}
body {
  background: var(--bg);
  color: var(--text);
  font-family: 'Open Sans', sans-serif;
  font-weight: 400;
  line-height: 1.6;
  overflow-x: hidden;
}
a { color: var(--link); }
.ms {
  font-family: 'Material Symbols Rounded';
  font-style: normal; font-weight: normal; font-size: inherit;
  display: inline-block; line-height: 1;
  -webkit-font-feature-settings: 'liga'; font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
}

/* ═══════════════════════════════════════
   SHARED ROW-LIST COMPONENT
   (was duplicated as .svc-*-full in home.html and .biz-* in smallbusiness.html)
═══════════════════════════════════════ */
.row-list { display:flex; flex-direction:column; }
.row-list-item {
  display:flex; align-items:baseline; justify-content:space-between; gap:1rem;
  padding:0.85rem 0; border-bottom:1px solid var(--accent-tan);
}
.row-list-item:last-child { border-bottom:none; }
.row-item-body { flex:1; }
.row-item-name { font-size:var(--fs-md); font-weight:700; color:var(--text); margin-bottom:0.2rem; }
.row-item-desc { font-size:var(--fs-base); color:var(--text); font-weight:400; line-height:1.55; }
.row-item-desc ul { list-style:none; margin:0; padding:0; }
.row-item-desc li { position:relative; padding-left:0.85rem; }
.row-item-desc li::before { content:'\2022'; position:absolute; left:0; color:var(--accent); }
.row-item-desc li + li { margin-top:0.15rem; }
.row-item-desc .desc-note { display:block; margin-top:0.3rem; color:var(--muted); font-size:var(--fs-sm); }
.row-item-price { font-size:var(--fs-md); font-weight:700; color:var(--accent); white-space:nowrap; flex-shrink:0; text-align:right; }
.row-item-price small { display:block; font-size:var(--fs-sm); color:var(--text); font-weight:500; white-space:normal; }

/* Shared tab-strip component (was duplicated as .svc-tab*/.biz-tab*) */
.tab-strip { display:flex; gap:0.25rem; flex-wrap:wrap; border-bottom:1px solid var(--border); margin-bottom:1.75rem; }
.tab-btn {
  background:none; border:none; cursor:pointer;
  font-family:'Open Sans',sans-serif; font-size:var(--fs-base); font-weight:700;
  letter-spacing:0.04em; text-transform:uppercase; color:var(--muted);
  padding:0.6rem 1.1rem 0.75rem; border-bottom:2px solid transparent;
  margin-bottom:-1px; transition:color 0.15s, border-color 0.15s;
}
.tab-btn:hover { color:var(--text); }
.tab-btn.active { color:var(--accent); border-bottom-color:var(--accent); }
.tab-panel { display:none; padding-top:1.5rem; }
.tab-panel.active { display:block; }
.tab-strip-lg .tab-btn { font-size:var(--fs-lg); padding: 0.7rem 1.25rem 0.85rem; }


/* ═══ NAV ═══ */
#nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 220;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 2rem; height: 92px;
  background: var(--nav-bg);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--border);
  transition: background 0.3s, box-shadow 0.3s;
}
#nav.scrolled { box-shadow: 0 1px 20px var(--shadow); }
.nav-logo {
  display: flex; align-items: center;
  text-decoration: none; z-index: 210;
}
.nav-logo img {
  height: 62px; width: auto;
  display: block;
}

.nav-links { display: flex; gap: 0.15rem; list-style: none; align-items: center; }
.nav-links a {
  color: var(--muted); text-decoration: none; font-size:var(--fs-base);
  font-weight: 600; letter-spacing: 0.03em; padding: 0.4rem 0.75rem;
  border-radius: 5px; transition: color 0.15s, background 0.15s;
}
.nav-links a:hover { color: var(--text); background: var(--accent-dim); }
.nav-links a.active { color: var(--accent); }
.nav-cta {
  background: var(--accent) !important; color: #fff !important;
  font-weight: 700 !important; margin-left: 0.35rem;
  transition: background 0.15s, transform 0.1s !important;
}
.nav-cta:hover { background: var(--accent2) !important; transform: translateY(-1px); }
.nav-cta .ms {
  display: inline-block; min-width: 1em; text-align: center;
  vertical-align: -0.15em;
}

/* ═══ NAV CONTACT DROPDOWN ═══ */
.nav-contact {
  position: relative;
}
.nav-contact-btn {
  display: inline-flex; align-items: center; gap: 0.4rem;
  background: none; border: 1px solid var(--border); border-radius: 5px;
  color: var(--muted); font-family: 'Open Sans', sans-serif;
  font-size:var(--fs-base); font-weight: 600; letter-spacing: 0.03em;
  padding: 0.4rem 0.75rem; margin-left: 0.35rem; cursor: pointer;
  transition: border-color 0.15s, color 0.15s;
}
.nav-contact-btn:hover { border-color: var(--accent); color: var(--accent); }
.nav-contact-btn .ms { font-size:var(--fs-xl); }
.nav-contact-card {
  position: absolute; top: calc(100% + 0.6rem); right: 0;
  background: var(--card-bg); border: 1px solid var(--border);
  border-radius: 10px; box-shadow: 0 12px 32px var(--shadow);
  padding: 0.6rem; min-width: 220px; z-index: 220;
  opacity: 0; visibility: hidden; transform: translateY(-6px);
  transition: opacity 0.15s, transform 0.15s, visibility 0.15s;
}
.nav-contact.open .nav-contact-card {
  opacity: 1; visibility: visible; transform: translateY(0);
}
.nav-contact-card a {
  display: flex; align-items: center; gap: 0.6rem;
  padding: 0.6rem 0.7rem; border-radius: 6px;
  color: var(--text); text-decoration: none;
  font-size:var(--fs-md); font-weight: 600;
  transition: background 0.12s, color 0.12s;
}
.nav-contact-card a:hover { background: var(--accent-dim); color: var(--accent); }
.nav-contact-card a .ms { color: var(--accent); font-size:var(--fs-xl); flex-shrink: 0; }

.nav-theme-btn {
  background: none; border: 1px solid var(--border); border-radius: 5px;
  width: 34px; height: 34px; display: flex; align-items: center;
  justify-content: center; cursor: pointer; color: var(--muted);
  font-size:var(--fs-xl); margin-left: 0.5rem;
  transition: border-color 0.15s, color 0.15s;
}
.nav-theme-btn:hover { border-color: var(--accent); color: var(--accent); }

/* ═══ HAMBURGER NAV ═══ */
.nav-hamburger {
  display: none;
  background: none; border: none; cursor: pointer;
  color: var(--text); padding: 4px; z-index: 210;
  width: 34px; height: 34px; align-items: center; justify-content: center;
}
.nav-hamburger .ms { font-size:var(--fs-2xl); }

.mobile-menu {
  display: flex; position: fixed; inset: 0; z-index: 205;
  background: var(--bg); padding: 92px 2rem 2rem;
  flex-direction: column; gap: 0.25rem;
  opacity: 0; pointer-events: none;
  transition: opacity 0.25s;
}
.mobile-menu.open { opacity: 1; pointer-events: all; }
.mobile-menu a {
  display: flex; align-items: center; gap: 0.6rem;
  color: var(--text); text-decoration: none;
  font-size:var(--fs-xl); font-weight: 600;
  padding: 0.9rem 0.5rem; border-bottom: 1px solid var(--border);
  transition: color 0.15s;
}
.mobile-menu a:hover { color: var(--accent); }
.mobile-menu a.active { color: var(--accent); }
.mobile-menu a .ms { color: var(--accent); font-size:var(--fs-xl); width: 28px; }
.mobile-menu .mobile-menu-cta {
  margin-top: 0.75rem; background: var(--accent); color: #fff;
  border-radius: 6px; justify-content: center; font-weight: 700;
  padding: 0.8rem; border: none;
}
.mobile-menu .mobile-menu-cta:hover { background: var(--accent2); }
.mobile-menu .mobile-menu-bottom {
  margin-top: auto; display: flex; align-items: center;
  justify-content: space-between; padding-top: 1rem; border-top: 1px solid var(--border);
}
.mobile-menu .mobile-menu-bottom .nav-theme-btn { margin-left: 0; }

/* ═══ PAGE WRAPPER ═══ */
.page-content { padding-top: 92px; }

/* ═══ SHARED ═══ */
.wrap    { max-width: 1020px; margin: 0 auto; padding: 0 2rem; }
.wrap-sm { max-width: 720px;  margin: 0 auto; padding: 0 2rem; }
.sec     { padding: 3rem 0; }
.sec-alt { background: var(--bg2); }
.sec-alt2{ background: var(--bg3); }

.eyebrow {
  display: inline-flex; align-items: center; gap: 0.4rem;
  font-size:var(--fs-lg); font-weight: 700; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--accent); margin-bottom: 0.6rem;
}
.eyebrow-step { margin-bottom: 0.75rem; }
.eyebrow-step-spaced { margin-top: 1.75rem; margin-bottom: 0.75rem; }
.sec-title {
  font-size: clamp(1.65rem, 3.52vw, 2.31rem); font-weight: 700;
  color: var(--text); letter-spacing: -0.02em; line-height: 1.15;
  margin-bottom: 0.5rem;
}
.sec-sub {
  color: var(--text); font-size:var(--fs-lg); font-weight: 400;
  max-width: 480px; line-height: 1.75; margin-bottom: 2rem;
}
.sec-sub a { color: var(--link); font-weight: 600; text-decoration: none; }
.sec-sub a:hover { text-decoration: underline; }
.ruled { border: none; border-top: 1px solid var(--border); margin: 1.5rem 0; }

/* ═══ BUTTONS ═══ */
.btn {
  display: inline-flex; align-items: center; gap: 0.4rem;
  font-family: 'Open Sans', sans-serif; font-size:var(--fs-md); font-weight: 700;
  letter-spacing: 0.03em; padding: 0.7rem 1.5rem; border-radius: 6px;
  text-decoration: none; cursor: pointer; border: none;
  transition: background 0.15s, transform 0.12s, box-shadow 0.15s;
}
.btn-accent { background: var(--accent); color: #fff; }
.btn-accent:hover {
  background: var(--accent2); transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(53,94,53,0.3);
}
.btn-ghost { background: transparent; color: var(--text); border: 1px solid var(--border); }
.btn-ghost:hover { border-color: var(--accent); color: var(--accent); transform: translateY(-2px); }
.btn .ms { font-size:var(--fs-lg); }

/* ═══════════════════════════════════════
   HOME — HERO
═══════════════════════════════════════ */
.hero {
  padding: 2.75rem 0 2.25rem;
  background: var(--bg);
  border-bottom: 1px solid var(--border);
}
.hero-content { max-width: 1020px; margin: 0 auto; }

.hero-tag {
  display: inline-flex; align-items: center; gap: 0.5rem;
  background: var(--card-bg); border: 1px solid var(--border2);
  border-radius: 100px; padding: 0.3rem 0.85rem;
  font-size:var(--fs-sm); font-weight: 600; color: var(--accent);
  margin-bottom: 1rem; letter-spacing: 0.05em;
  box-shadow: 0 2px 8px var(--shadow);
}
.hero-dot {
  width: 6px; height: 6px; border-radius: 50%; background: var(--accent);
  animation: pulse 2s infinite;
}
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:0.3} }

.hero h1 {
  font-size: clamp(1.925rem, 4.84vw, 2.97rem); font-weight: 700;
  color: var(--text); margin-bottom: 0.9rem;
  line-height: 1.12; letter-spacing: -0.03em;
}
.hero-sub {
  font-size:var(--fs-xl); color: var(--text); font-weight: 400;
  max-width: none; line-height: 1.8; margin-bottom: 2rem;
}
.hero-actions { display: flex; gap: 0.75rem; flex-wrap: wrap; margin-bottom: 2.5rem; }

.hero-facts {
  display: flex; gap: 1.5rem; flex-wrap: wrap;
  padding-top: 1.75rem; border-top: 1px solid var(--border);
}
.hero-fact {
  display: flex; align-items: center; gap: 0.5rem;
  font-size:var(--fs-base); color: var(--text); font-weight: 400;
}
.hero-fact .ms { color: var(--accent); font-size:var(--fs-lg); }

/* ═══ VALUE STRIP (replaces pillar cards) ═══ */
.value-strip {
  background: var(--bg2); border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  padding: 2.5rem 0;
}
.value-strip-inner {
  display: flex; gap: 3rem; flex-wrap: wrap;
}
.value-item { flex: 1; min-width: 180px; }
.value-item h3 {
  font-size:var(--fs-md); font-weight: 700; color: var(--text);
  margin-bottom: 0.25rem; display: flex; align-items: center; gap: 0.4rem;
}
.value-item h3 .ms { color: var(--accent); font-size:var(--fs-lg); }
.value-item p { font-size:var(--fs-base); color: var(--text); font-weight: 400; line-height: 1.6; }

/* ═══ MEM TEASER ═══ */
.mem-teaser {
  background: var(--bg3); border: 1px solid var(--border2);
  border-radius: 12px; padding: 2.25rem 2rem;
  display: grid; grid-template-columns: 1fr auto; gap: 2rem; align-items: center;
}
.mem-teaser-badge {
  display: inline-flex; align-items: center; gap: 0.35rem;
  background: var(--accent); color: #fff;
  font-size:var(--fs-2xs); font-weight: 700; letter-spacing: 0.14em;
  text-transform: uppercase; padding: 0.2rem 0.55rem; border-radius: 3px;
  margin-bottom: 0.7rem;
}
.mem-teaser h3 { font-size:var(--fs-2xl); font-weight: 700; color: var(--text); margin-bottom: 0.45rem; letter-spacing: -0.02em; }
.mem-teaser p  { font-size:var(--fs-md); color: var(--text); font-weight: 400; line-height: 1.7; }
.mem-price-block { text-align: right; white-space: nowrap; }
.mem-price-from   { font-size:var(--fs-xs); color: var(--muted); letter-spacing: 0.08em; text-transform: uppercase; }
.mem-price-amount { font-size:var(--fs-5xl); font-weight: 700; color: var(--accent); letter-spacing: -0.04em; line-height: 1; }
.mem-price-per    { font-size:var(--fs-sm); color: var(--text); }

/* ═══════════════════════════════════════
   SERVICES PAGE
═══════════════════════════════════════ */
.svc-header { background: var(--bg); padding: 2.5rem 0 2rem; border-bottom: 1px solid var(--border); }

.cat-head { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 1.1rem; }
.cat-icon {
  width: 34px; height: 34px; border-radius: 7px;
  background: var(--accent-dim); border: 1px solid var(--border2);
  display: flex; align-items: center; justify-content: center;
  color: var(--accent); font-size:var(--fs-xl); flex-shrink: 0;
}
.cat-head h3 { font-size:var(--fs-lg); font-weight: 700; color: var(--text); }

.svc-list { display: flex; flex-direction: column; gap: 2px; margin-bottom: 2rem; }
.svc-row {
  display: grid; grid-template-columns: 1fr auto; gap: 1rem; align-items: start;
  background: var(--card-bg); padding: 0.9rem 1.1rem;
  border-radius: 6px;
  border: 1px solid var(--border); border-left: 3px solid transparent;
  transition: border-color 0.15s, background 0.15s;
}
.svc-row:hover { background: var(--bg2); border-left-color: var(--accent); }
.svc-name { font-size:var(--fs-md); font-weight: 600; color: var(--text); margin-bottom: 0.18rem; }
.svc-desc { font-size:var(--fs-base); color: var(--text); line-height: 1.5; font-weight: 400; }
.svc-desc a { color: var(--link); font-weight: 600; text-decoration: none; }
.svc-desc a:hover { text-decoration: underline; }
.svc-price { font-size:var(--fs-lg); font-weight: 700; color: var(--accent); white-space: nowrap; text-align: right; }
.svc-price small { display: block; font-size:var(--fs-2xs); font-weight: 400; color: var(--text); margin-top: 0.1rem; }

.svc-cats { display: grid; grid-template-columns: 1fr 1fr; gap: 2.5rem; }

.remote-callout {
  background: var(--bg2); border: 1px solid var(--border);
  border-radius: 10px; padding: 1.5rem 1.75rem; margin-bottom: 2rem;
}
.remote-callout-title {
  font-size:var(--fs-xs); font-weight: 700; letter-spacing: 0.15em;
  text-transform: uppercase; color: var(--accent); margin-bottom: 1rem;
  display: flex; align-items: center; gap: 0.4rem;
}
.support-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 1rem;
}
.support-grid-3 {
  grid-template-columns: 1.4fr 1fr 1fr;
}
.support-col-label {
  font-size:var(--fs-sm); font-weight: 700; letter-spacing: 0.06em;
  color: var(--text); margin-bottom: 0.5rem; display: flex; align-items: center; gap: 0.4rem;
}
.support-col-label .ms { color: var(--accent); font-size:var(--fs-lg); }
.support-row {
  display: flex; justify-content: space-between; align-items: baseline;
  padding: 0.35rem 0; border-bottom: 1px solid var(--border2); gap: 1rem;
}
.support-row:last-child { border-bottom: none; }
.support-row-label { font-size:var(--fs-base); color: var(--text); font-weight: 400; line-height: 1.45; }
.support-row-price { font-size:var(--fs-base); font-weight: 700; color: var(--accent); white-space: nowrap; }
.support-row-note { font-size:var(--fs-xs); color: var(--text); font-weight: 400; margin-top: 0.35rem; }
@media (max-width: 600px) {
  .support-grid, .support-grid-3 { grid-template-columns: 1fr; }
  .row-list-item {
    display: grid;
    grid-template-columns: 1.3fr 1fr;
    grid-template-areas: "name price" "desc desc";
    column-gap: 0.75rem; row-gap: 0.2rem;
    align-items: baseline;
  }
  .row-item-body { display: contents; }
  .row-item-name { grid-area: name; margin-bottom: 0; min-width: 0; }
  .row-item-desc { grid-area: desc; }
  .row-item-price { grid-area: price; text-align: right; white-space: nowrap; min-width: 0; }
}

.spec-divider {
  display: flex; align-items: center; gap: 1rem; margin: 0 0 2rem;
}
.spec-divider-line { flex: 1; height: 1px; background: var(--border); }
.spec-divider-label {
  font-size:var(--fs-xs); font-weight: 700; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--accent); white-space: nowrap;
}

/* Specialty services — row-based like main services */
.spec-list { display: flex; flex-direction: column; gap: 2px; margin-bottom: 2rem; }
.spec-row {
  display: grid; grid-template-columns: auto 1fr auto; gap: 1rem; align-items: start;
  background: var(--card-bg); padding: 1rem 1.2rem;
  border: 1px solid var(--border); border-radius: 6px;
  transition: border-color 0.15s, background 0.15s;
}
.spec-row:hover { background: var(--bg2); border-color: var(--border2); }
.spec-row-icon {
  width: 34px; height: 34px; border-radius: 7px;
  background: var(--accent-dim); border: 1px solid var(--border2);
  display: flex; align-items: center; justify-content: center;
  color: var(--accent); font-size:var(--fs-xl); flex-shrink: 0;
}
.spec-row h4 { font-size:var(--fs-md); font-weight: 600; color: var(--text); margin-bottom: 0.15rem; }
.spec-row p  { font-size:var(--fs-base); color: var(--text); font-weight: 400; line-height: 1.5; }
.spec-row p a { color: var(--link); font-weight: 600; text-decoration: none; }
.spec-row p a:hover { text-decoration: underline; }
.spec-row-price { font-size:var(--fs-md); font-weight: 700; color: var(--accent); white-space: nowrap; text-align: right; }
.spec-row-note  { font-size:var(--fs-xs); color: var(--text); margin-top: 0.15rem; }

.consulting-strip {
  background: var(--bg2); border: 1px solid var(--border);
  border-radius: 10px; padding: 1.75rem 2rem;
  display: grid; grid-template-columns: auto 1fr auto; gap: 1.5rem; align-items: center;
}
.consulting-strip-icon {
  width: 48px; height: 48px; border-radius: 9px;
  background: var(--accent-dim); border: 1px solid var(--border2);
  display: flex; align-items: center; justify-content: center;
  color: var(--accent); font-size:var(--fs-2xl);
}
.consulting-strip h3 { font-size:var(--fs-lg); font-weight: 700; color: var(--text); margin-bottom: 0.25rem; }
.consulting-strip p  { font-size:var(--fs-base); color: var(--text); font-weight: 400; line-height: 1.6; }
.consulting-rate { text-align: right; white-space: nowrap; }
.consulting-rate .rn { font-size:var(--fs-2xl); font-weight: 700; color: var(--accent); letter-spacing: -0.03em; }
.consulting-rate .rl { font-size:var(--fs-xs); color: var(--text); }

.svc-notes {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(175px,1fr));
  gap: 1px; background: var(--border);
  border: 1px solid var(--border); border-radius: 8px; overflow: hidden; margin-top: 2.5rem;
}
.svc-note { background: var(--card-bg); padding: 1rem 1.1rem; display: flex; gap: 0.7rem; align-items: flex-start; }
.svc-note .ms { color: var(--accent); font-size:var(--fs-lg); margin-top: 0.1rem; flex-shrink: 0; }
.svc-note-title { font-size:var(--fs-sm); font-weight: 700; color: var(--text); letter-spacing: 0.03em; margin-bottom: 0.18rem; }
.svc-note-text  { font-size:var(--fs-sm); color: var(--text); line-height: 1.5; font-weight: 400; }

.data-disclaimer {
  font-size:var(--fs-xs); color: var(--text); font-weight: 400; font-style: italic;
  margin-top: 0.75rem; padding-left: 0.15rem;
}

/* ═══════════════════════════════════════
   PRODUCTS PAGE
═══════════════════════════════════════ */
.prod-header { background: var(--bg); padding: 2.5rem 0 2rem; border-bottom: 1px solid var(--border); }

.prod-cats { display: grid; grid-template-columns: repeat(2, minmax(0, 340px)); gap: 1rem; margin-bottom: 3rem; justify-content: center; }
.prod-cat {
  background: var(--card-bg); border: 1px solid var(--border);
  border-radius: 10px; padding: 1.4rem; text-decoration: none;
  transition: border-color 0.2s, transform 0.2s, box-shadow 0.2s;
  display: block;
}
.prod-cat:hover {
  border-color: var(--border2); transform: translateY(-3px);
  box-shadow: 0 8px 24px var(--shadow);
}
.prod-cat-icon {
  width: 42px; height: 42px; border-radius: 8px;
  background: var(--accent-dim); border: 1px solid var(--border2);
  display: flex; align-items: center; justify-content: center;
  color: var(--accent); font-size:var(--fs-2xl); margin-bottom: 0.9rem;
}
.prod-cat h3 { font-size:var(--fs-lg); font-weight: 700; color: var(--text); margin-bottom: 0.3rem; }
.prod-cat p  { font-size:var(--fs-base); color: var(--text); line-height: 1.55; font-weight: 400; margin-bottom: 0.75rem; }
.prod-cat-from { font-size:var(--fs-sm); font-weight: 700; color: var(--accent); }

/* PC tiers */
.pc-tiers { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px,1fr)); gap: 1rem; margin-bottom: 1.5rem; }
.pc-tier {
  background: var(--card-bg); border: 1px solid var(--border);
  border-radius: 10px; padding: 1.5rem; position: relative; overflow: hidden;
  transition: border-color 0.2s, transform 0.2s;
}
.pc-tier:hover { transform: translateY(-3px); box-shadow: 0 8px 24px var(--shadow); }
.pc-tier.featured { border-color: var(--border2); }
.pc-tier-badge {
  position: absolute; top: 0; right: 0;
  background: var(--accent); color: #fff;
  font-size:var(--fs-2xs); font-weight: 700; letter-spacing: 0.12em;
  padding: 0.25rem 0.65rem; border-bottom-left-radius: 6px;
}
.pc-tier-name { font-size:var(--fs-xs); font-weight: 700; letter-spacing: 0.15em; text-transform: uppercase; color: var(--muted); margin-bottom: 0.6rem; }
.pc-tier-price { font-size:var(--fs-4xl); font-weight: 700; color: var(--text); letter-spacing: -0.04em; line-height: 1; margin-bottom: 0.2rem; }
.pc-tier-price span { color: var(--accent); }
.pc-tier-price .pc-tier-from { font-size:var(--fs-lg); font-weight: 600; color: var(--muted); letter-spacing: normal; margin-right: 0.2rem; }
.pc-tier-sub { font-size:var(--fs-sm); color: var(--text); margin-bottom: 1.1rem; }
.pc-tier-specs { list-style: none; display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1.25rem; }
.pc-tier-specs li { display: flex; align-items: flex-start; gap: 0.45rem; font-size:var(--fs-base); color: var(--text); font-weight: 400; line-height: 1.4; }
.pc-tier-specs .ms { color: var(--text); font-size:var(--fs-md); margin-top: 0.05rem; flex-shrink: 0; }

/* OS note */
.os-note {
  background: var(--bg2); border: 1px solid var(--border);
  border-radius: 9px; padding: 1.25rem 1.5rem;
  display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem;
  margin-bottom: 3rem;
}
.os-note-opt { display: flex; gap: 0.75rem; align-items: flex-start; }
.os-note-icon {
  width: 36px; height: 36px; border-radius: 7px; flex-shrink: 0;
  background: var(--accent-dim); border: 1px solid var(--border2);
  display: flex; align-items: center; justify-content: center;
  color: var(--accent); font-size:var(--fs-xl);
}
.os-note-opt h4 { font-size:var(--fs-base); font-weight: 700; color: var(--text); margin-bottom: 0.15rem; }
.os-note-opt p { font-size:var(--fs-sm); color: var(--text); font-weight: 400; line-height: 1.55; }

.info-callout {
  background: var(--bg2); border: 1px solid var(--border);
  border-left: 3px solid var(--accent); border-radius: 0 9px 9px 0;
  padding: 1.25rem 1.5rem; display: flex; gap: 0.9rem; align-items: flex-start;
  margin-bottom: 3rem;
}
.info-callout .ms { color: var(--accent); font-size:var(--fs-2xl); flex-shrink: 0; margin-top: 0.05rem; }
.info-callout h4 { font-size:var(--fs-md); font-weight: 700; color: var(--text); margin-bottom: 0.3rem; }
.info-callout p  { font-size:var(--fs-base); color: var(--text); font-weight: 400; line-height: 1.6; }

/* Stock apps block */
.stock-apps {
  background: var(--bg2); border: 1px solid var(--border);
  border-radius: 10px; padding: 1.5rem 1.75rem; margin-bottom: 2rem;
}
.stock-apps-title {
  display: flex; align-items: center; gap: 0.5rem;
  font-size:var(--fs-base); font-weight: 700; color: var(--text); margin-bottom: 0.85rem;
}
.stock-apps-title .ms { color: var(--accent); font-size:var(--fs-xl); }
.stock-apps-grid { display: flex; flex-wrap: wrap; gap: 0.45rem; }
.stock-app-chip {
  display: inline-flex; align-items: center; gap: 0.35rem;
  background: var(--card-bg); border: 1px solid var(--border);
  border-radius: 5px; padding: 0.35rem 0.65rem;
  font-size:var(--fs-sm); font-weight: 600; color: var(--text);
}
.stock-app-chip .ms { color: var(--accent); font-size:var(--fs-md); }
.stock-app-chip img { width: 18px; height: 18px; border-radius: 3px; object-fit: contain; }

/* HTPC tiers */
.htpc-tiers { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px,1fr)); gap: 1rem; margin-bottom: 2rem; }
.htpc-tier {
  background: var(--card-bg); border: 1px solid var(--border);
  border-radius: 10px; padding: 1.5rem; position: relative; overflow: hidden;
  transition: border-color 0.2s, transform 0.2s;
}
.htpc-tier:hover { transform: translateY(-3px); box-shadow: 0 8px 24px var(--shadow); }
.htpc-plays {
  font-size:var(--fs-sm); color: var(--text); font-weight: 400;
  line-height: 1.55; margin-bottom: 0.85rem; padding-left: 0.15rem;
}
.htpc-plays strong { color: var(--text); font-weight: 600; }

/* Streaming devices */
.atv-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 380px)); gap: 1rem; margin-bottom: 2rem; justify-content: center; }
.prod-full-card {
  background: var(--card-bg); border: 1px solid var(--border);
  border-radius: 10px; padding: 1.5rem 1.75rem;
}
.prod-full-card-header {
  display: grid; grid-template-columns: auto 1fr auto;
  align-items: center; gap: 1rem; margin-bottom: 1rem;
}
.prod-full-card-icon {
  width: 40px; height: 40px; border-radius: 8px;
  background: var(--accent-dim); display: flex;
  align-items: center; justify-content: center; flex-shrink: 0;
}
.prod-full-card-icon .ms { color: var(--accent); font-size:var(--fs-xl); }
.prod-full-card-price {
  font-size:var(--fs-2xl); font-weight: 700; color: var(--accent);
  letter-spacing: -0.03em; text-align: right; white-space: nowrap;
}
.prod-full-card-price small {
  display: block; font-size:var(--fs-xs); font-weight: 400;
  color: var(--faint); letter-spacing: 0; margin-top: 0.1rem;
}
@media (max-width: 500px) {
  .prod-full-card-header { grid-template-columns: auto 1fr; }
  .prod-full-card-price { grid-column: 1 / -1; text-align: left; }
}

.atv-card {
  background: var(--card-bg); border: 1px solid var(--border);
  border-radius: 9px; padding: 1.4rem;
  transition: border-color 0.2s, transform 0.2s;
}
.atv-card:hover { border-color: var(--border2); transform: translateY(-2px); }
.atv-card-icon { width: 38px; height: 38px; border-radius: 7px; background: var(--accent-dim); border: 1px solid var(--border2); display: flex; align-items: center; justify-content: center; color: var(--accent); font-size:var(--fs-xl); margin-bottom: 0.85rem; }
.atv-card h4 { font-size:var(--fs-md); font-weight: 700; color: var(--text); margin-bottom: 0.3rem; }
.atv-card p  { font-size:var(--fs-base); color: var(--text); font-weight: 400; line-height: 1.6; margin-bottom: 0.65rem; }
.atv-price   { font-size:var(--fs-base); font-weight: 700; color: var(--accent); }

/* Config form */
.config-form-wrap {
  background: var(--card-bg); border: 1px solid var(--border);
  border-radius: 12px; padding: 2rem; margin-bottom: 3rem;
}
.config-form-title { font-size:var(--fs-xl); font-weight: 700; color: var(--text); margin-bottom: 0.35rem; }
.config-form-sub   { font-size:var(--fs-base); color: var(--text); font-weight: 400; margin-bottom: 1.5rem; line-height: 1.6; }

.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1rem; }
.form-group { display: flex; flex-direction: column; gap: 0.3rem; }
.form-group.full { grid-column: 1 / -1; }
.form-label { font-size:var(--fs-sm); font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); }
.form-input, .form-select, .form-textarea {
  background: var(--bg); border: 1px solid var(--border);
  border-radius: 6px; color: var(--text);
  font-family: 'Open Sans', sans-serif; font-size:var(--fs-md);
  padding: 0.65rem 0.9rem; outline: none;
  transition: border-color 0.2s; width: 100%;
}
.form-input:focus, .form-select:focus, .form-textarea:focus { border-color: var(--accent); }
.form-select option { background: var(--bg); color: var(--text); }
.form-textarea { resize: vertical; min-height: 90px; }

.form-section-label {
  font-size:var(--fs-xs); font-weight: 700; letter-spacing: 0.15em;
  text-transform: uppercase; color: var(--accent);
  padding: 0.6rem 0 0.3rem; border-top: 1px solid var(--border);
  margin-top: 0.5rem; grid-column: 1 / -1;
}

.app-checks { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px,1fr)); gap: 0.4rem; }
.app-check {
  display: flex; align-items: center; gap: 0.5rem;
  background: var(--bg); border: 1px solid var(--border);
  border-radius: 5px; padding: 0.45rem 0.65rem; cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
}
.app-check:hover { border-color: var(--border2); }
.app-check input[type="checkbox"] { accent-color: var(--accent); width: 14px; height: 14px; flex-shrink: 0; }
.app-check span { font-size:var(--fs-base); color: var(--text); display: flex; align-items: center; gap: 0.4rem; }
.app-check-icon { width: 18px; height: 18px; flex-shrink: 0; border-radius: 3px; object-fit: contain; }
.app-check .ms.app-check-icon { width: 18px; height: 18px; font-size:var(--fs-lg); color: var(--accent); border-radius: 0; }

.form-submit-row { display: flex; align-items: center; gap: 1rem; margin-top: 1.25rem; flex-wrap: wrap; }
.form-note { font-size:var(--fs-sm); color: var(--text); font-weight: 400; }

/* ═══ REQUEST FORM (new design) ═══ */
.req-form-wrap {
  background: var(--card-bg); border: 1px solid var(--border);
  border-radius: 16px; padding: 2.5rem;
  max-width: 720px; margin: 0 auto;
}
.req-form-header { margin-bottom: 2rem; }
.req-form-eyebrow {
  display: inline-flex; align-items: center; gap: 0.4rem;
  font-size:var(--fs-xs); font-weight: 700; letter-spacing: 0.15em;
  text-transform: uppercase; color: var(--accent); margin-bottom: 0.6rem;
}
.req-form-title { font-size:var(--fs-2xl); font-weight: 700; color: var(--text); letter-spacing: -0.02em; margin-bottom: 0.35rem; }
.req-form-sub { font-size:var(--fs-base); color: var(--text); font-weight: 400; line-height: 1.65; }

.req-step { margin-bottom: 1.75rem; }
.req-step-label {
  font-size:var(--fs-xs); font-weight: 700; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--muted); margin-bottom: 0.75rem;
}

/* Type toggle buttons */
.req-type-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
.req-type-btn {
  display: flex; flex-direction: column; align-items: flex-start; gap: 0.2rem;
  background: var(--bg); border: 1px solid var(--border); border-radius: 10px;
  padding: 1rem 1.1rem; cursor: pointer; text-align: left;
  transition: border-color 0.15s, background 0.15s;
}
.req-type-btn .ms { color: var(--muted); font-size:var(--fs-xl); margin-bottom: 0.25rem; }
.req-type-btn .req-type-name { font-size:var(--fs-md); font-weight: 700; color: var(--text); }
.req-type-btn .req-type-sub  { font-size:var(--fs-sm); color: var(--text); font-weight: 400; }
.req-type-btn:hover { border-color: var(--border2); background: var(--bg2); }
.req-type-btn.active { border-color: var(--accent); border-width: 2px; background: var(--accent-dim); }
.req-type-btn.active .ms { color: var(--accent); }

/* Radio option cards */
.req-option-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px,1fr)); gap: 0.6rem; }
.req-option { cursor: pointer; }
.req-option input[type="radio"] { display: none; }
.req-option-card {
  border: 1px solid var(--border); border-radius: 9px;
  padding: 0.85rem 1rem; transition: border-color 0.15s, background 0.15s;
}
.req-option:hover .req-option-card { border-color: var(--border2); background: var(--bg2); }
.req-option input:checked + .req-option-card { border-color: var(--accent); border-width: 2px; background: var(--accent-dim); }
.req-option-name  { font-size:var(--fs-base); font-weight: 700; color: var(--text); margin-bottom: 0.2rem; }
.req-option-price { font-size:var(--fs-md); font-weight: 700; color: var(--accent); margin-bottom: 0.15rem; }
.req-option-note  { font-size:var(--fs-xs); color: var(--text); font-weight: 400; line-height: 1.4; }

/* Add-on checkboxes */
.req-addon-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.6rem; }
.req-addon { cursor: pointer; }
.req-addon input[type="checkbox"] { display: none; }
.req-addon-card {
  border: 1px solid var(--border); border-radius: 9px;
  padding: 0.85rem 1rem; transition: border-color 0.15s, background 0.15s;
}
.req-addon:hover .req-addon-card { border-color: var(--border2); background: var(--bg2); }
.req-addon input:checked + .req-addon-card { border-color: var(--accent); border-width: 2px; background: var(--accent-dim); }
.req-addon-name  { font-size:var(--fs-base); font-weight: 700; color: var(--text); margin-bottom: 0.15rem; }
.req-addon-price { font-size:var(--fs-base); font-weight: 700; color: var(--accent); margin-bottom: 0.15rem; }
.req-addon-note  { font-size:var(--fs-xs); color: var(--text); font-weight: 400; line-height: 1.4; }

/* App pill checkboxes */
.req-app-grid { display: flex; flex-wrap: wrap; gap: 0.45rem; }
.req-app { cursor: pointer; display: flex; align-items: center; gap: 0; }
.req-app input[type="checkbox"] { display: none; }
.req-app span {
  border: 1px solid var(--border); border-radius: 100px;
  padding: 0.3rem 0.85rem; font-size:var(--fs-base); color: var(--text); font-weight: 400;
  background: var(--bg); transition: all 0.12s;
}
.req-app:hover span { border-color: var(--border2); color: var(--text); }
.req-app input:checked + span { border-color: var(--accent); background: var(--accent-dim); color: var(--accent); font-weight: 600; }

/* Contact inputs */
.req-contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
.req-input {
  background: var(--bg); border: 1px solid var(--border); border-radius: 8px;
  color: var(--text); font-family: 'Open Sans', sans-serif; font-size:var(--fs-md);
  font-weight: 400; padding: 0.7rem 0.9rem; outline: none;
  transition: border-color 0.15s; width: 100%; box-sizing: border-box;
}
.req-input:focus { border-color: var(--accent); }
.req-input::placeholder { color: var(--faint); }
.req-input-full { grid-column: 1 / -1; }
.req-textarea { resize: vertical; min-height: 80px; }

.req-submit-row { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; margin-top: 0.5rem; }
.req-submit-note { font-size:var(--fs-sm); color: var(--text); font-weight: 400; }

.form-conditional { display: none; }
.form-conditional.visible { display: block; }

/* ═══════════════════════════════════════
   MEMBERSHIP PAGE
═══════════════════════════════════════ */
.mem-hero { background: var(--bg); padding: 2.5rem 0 2rem; border-bottom: 1px solid var(--border); }

.mem-card {
  background: var(--card-bg); border: 2px solid var(--border2);
  border-radius: 14px; padding: 2.5rem; max-width: 520px;
  box-shadow: 0 8px 40px var(--shadow);
}
.mem-card-eyebrow { font-size:var(--fs-xs); font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: var(--accent); margin-bottom: 0.6rem; display: flex; align-items: center; gap: 0.4rem; }
.mem-card-price { margin: 1.25rem 0; }
.mem-card-price .big { font-size:var(--fs-5xl); font-weight: 700; color: var(--text); letter-spacing: -0.05em; line-height: 1; }
.mem-card-price .big span { color: var(--accent); }
.mem-card-price .small { font-size:var(--fs-base); color: var(--text); margin-top: 0.25rem; }
.mem-card-desc { font-size:var(--fs-md); color: var(--text); font-weight: 400; line-height: 1.7; margin-bottom: 1.5rem; }
.mem-features { list-style: none; display: flex; flex-direction: column; gap: 0.65rem; margin-bottom: 2rem; }
.mem-features li { display: flex; align-items: flex-start; gap: 0.55rem; font-size:var(--fs-md); color: var(--text); line-height: 1.45; }
.mem-features .ms { color: var(--accent); font-size:var(--fs-lg); flex-shrink: 0; margin-top: 0.05rem; }
.mem-fine { font-size:var(--fs-sm); color: var(--text); margin-top: 1rem; font-weight: 400; }

.mem-layout { display: grid; grid-template-columns: auto 1fr; gap: 4rem; align-items: start; }

.mem-perks { display: flex; flex-direction: column; gap: 1.5rem; padding-top: 0.5rem; }
.mem-perk { display: flex; gap: 0.9rem; align-items: flex-start; }
.mem-perk-icon { width: 36px; height: 36px; border-radius: 7px; flex-shrink: 0; background: var(--accent-dim); border: 1px solid var(--border2); display: flex; align-items: center; justify-content: center; color: var(--accent); font-size:var(--fs-xl); }
.mem-perk h4 { font-size:var(--fs-md); font-weight: 700; color: var(--text); margin-bottom: 0.2rem; }
.mem-perk p  { font-size:var(--fs-base); color: var(--text); line-height: 1.55; font-weight: 400; }

.remote-note { background: var(--bg2); border: 1px solid var(--border); border-radius: 8px; padding: 1.1rem 1.4rem; display: flex; align-items: flex-start; gap: 0.75rem; margin-bottom: 2.5rem; }
.remote-note .ms { color: var(--accent); font-size:var(--fs-xl); flex-shrink: 0; margin-top: 0.1rem; }
.remote-note p { font-size:var(--fs-base); color: var(--text); font-weight: 400; line-height: 1.6; }
.remote-note strong { color: var(--text); font-weight: 600; }

/* ═══════════════════════════════════════
   CONTACTS FOOTER BAR
═══════════════════════════════════════ */
.contacts-bar { background: var(--bg3); border-top: 1px solid var(--border); }
.contacts-bar-inner { max-width: 1020px; margin: 0 auto; padding: 2rem 2rem 1.5rem; }
.contacts-bar-top {
  display: grid; grid-template-columns: 1fr auto; gap: 2rem;
  align-items: start; margin-bottom: 1.5rem;
}
.contacts-bar-brand .cb-logo { margin-bottom: 0.5rem; }
.contacts-bar-brand .cb-logo img { height: 32px; width: auto; display: block; }
.contacts-bar-brand p { font-size:var(--fs-base); color: var(--text); font-weight: 400; max-width: 280px; line-height: 1.6; }
.contacts-bar-hours { text-align: right; }
.contacts-bar-hours .ch-label { font-size:var(--fs-xs); font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--accent); margin-bottom: 0.3rem; }
.contacts-bar-hours p { font-size:var(--fs-base); color: var(--text); font-weight: 400; line-height: 1.6; }

.contacts-channels { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 1.25rem; justify-content: center; }
.contact-chip {
  display: inline-flex; align-items: center; gap: 0.4rem;
  background: var(--card-bg); border: 1px solid var(--border);
  border-radius: 6px; padding: 0.45rem 0.85rem;
  font-size:var(--fs-base); font-weight: 600; color: var(--text);
  text-decoration: none; transition: border-color 0.15s, background 0.15s;
}
.contact-chip:hover { border-color: var(--border2); background: var(--accent-dim); color: var(--accent); }
.contact-chip .ms { color: var(--accent); font-size:var(--fs-lg); }
.cc-short { display: none; }

.contacts-bar-bottom {
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 0.75rem;
  padding-top: 1.25rem; border-top: 1px solid var(--border);
}
.contacts-bar-bottom p { font-size:var(--fs-xs); color: var(--text); }
.area-chips { display: flex; gap: 0.4rem; flex-wrap: wrap; }
.area-chip {
  display: inline-flex; align-items: center; gap: 0.3rem;
  background: var(--bg2); border: 1px solid var(--border);
  border-radius: 4px; padding: 0.18rem 0.5rem;
  font-size:var(--fs-xs); color: var(--text); font-weight: 600;
}
.area-chip .ms { font-size:var(--fs-sm); color: var(--accent); }

/* ═══ RESPONSIVE ═══ */
@media (max-width: 820px) {
  .svc-cats { grid-template-columns: 1fr; }
  .mem-layout { grid-template-columns: 1fr; }
  .mem-teaser { grid-template-columns: 1fr; }
  .consulting-strip { grid-template-columns: auto 1fr; }
  .contacts-bar-top { grid-template-columns: 1fr; }
  .contacts-bar-hours { text-align: left; }
  .prod-cats { grid-template-columns: 1fr; }
  .os-note { grid-template-columns: 1fr; }
  .value-strip-inner { gap: 2rem; }
}
@media (max-width: 600px) {
  #nav { padding: 0 1.25rem; }
  .nav-links { display: none; }
  .nav-hamburger { display: flex; width: 51px; height: 51px; font-size: 2.88rem; }
  .wrap, .wrap-sm { padding: 0 1rem; }
  .sec { padding: 2rem 0; }
  .hero h1 { font-size:var(--fs-4xl); }
  .form-grid { grid-template-columns: 1fr; }
  .form-group.full { grid-column: 1; }
  .req-type-grid { grid-template-columns: 1fr; }
  .req-addon-grid { grid-template-columns: 1fr; }
  .req-contact-grid { grid-template-columns: 1fr; }
  .req-input-full { grid-column: 1; }
  .req-form-wrap { padding: 1.5rem; }
  .atv-grid { grid-template-columns: 1fr; }
  .form-section-label { grid-column: 1; }
  .value-strip-inner { flex-direction: column; gap: 1.25rem; }
  .cc-full { display: none; }
  .cc-short { display: inline; }
}
@media (min-width: 601px) {
  .mobile-menu { display: none !important; }
}
/* Shared utility classes -- placed last so they reliably win the cascade
   against any earlier component rule sharing a property (e.g. .sec-sub's
   own max-width vs. .sec-sub-flush cancelling it). */
.tab-icon { font-size:var(--fs-md); vertical-align:middle; margin-right:0.3rem; }
.tab-icon-lg { font-size:var(--fs-lg); vertical-align:middle; margin-right:0.3rem; }
.tab-strip-tight { margin-bottom:1.25rem; }
.link-accent { color:var(--accent); text-decoration:underline; }
.link-accent-bold { color:var(--accent); font-weight:600; text-decoration:none; }
.theme-logo { height:36px; width:auto; }
.sec-sub-flush { margin-bottom:0; max-width:none; }

/* Inline SVG icons (replaces Material Symbols Rounded font glyphs site-wide,
   except .theme-icon which still needs textContent swapping for the dark/light toggle) */
.ms-icon { width:1em; height:1em; display:inline-block; vertical-align:-0.15em; fill:currentColor; flex-shrink:0; }