/* ═══════════════════════════════════════════════
   TreadPlus CN — theme.css
   Complete design system — dark industrial theme
═══════════════════════════════════════════════ */

/* ── TOKENS ── */
:root {
  --black:   #0a0a0b;
  --dark:    #111214;
  --surface: #18191d;
  --border:  #2a2b30;
  --accent:  #e8350f;
  --white:   #f0f1f4;
  --text:    #d4d6de;
  --silver:  #b8bcc8;
}

*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }

body {
  background: var(--black);
  color: var(--text);
  font-family: 'Noto Sans SC', sans-serif;
  line-height: 1.6;
  overflow-x: hidden;
}

/* ── WORDPRESS ALIGNMENT RESETS ── */
.alignwide  { max-width: 100%; }
.alignfull  { width: 100vw; margin-left: calc(50% - 50vw); }
img         { max-width: 100%; height: auto; display: block; }

/* ══════════════════════════════════════
   NAV
══════════════════════════════════════ */
#site-nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 1000;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 48px; height: 80px;
  background: rgba(10,10,11,.95); backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--border); flex-wrap: wrap;
}
.nav-logo { display: flex; align-items: center; cursor: pointer; }
.nav-logo img { height: 48px; width: auto; display: block; }
.nav-links,
.primary-menu { display: flex; gap: 32px; align-items: center; list-style: none; }
.nav-item,
.menu-item { position: relative; }
.nav-item:hover .dropdown,
.menu-item-has-children:hover > .sub-menu {
  opacity: 1; visibility: visible; transform: translateY(0) translateX(-50%);
}
.dropdown,
.sub-menu {
  position: absolute; top: calc(100% + 16px); left: 50%;
  transform: translateX(-50%) translateY(8px);
  background: rgba(17,18,20,0.98); backdrop-filter: blur(16px);
  border: 1px solid var(--border); border-top: 2px solid var(--accent);
  min-width: 180px; padding: 8px 0; list-style: none;
  opacity: 0; visibility: hidden;
  transition: opacity 0.25s, transform 0.25s, visibility 0.25s;
}
.dropdown a,
.sub-menu a {
  display: block; padding: 12px 20px;
  color: var(--silver); font-size: 13px; font-weight: 500;
  text-decoration: none; white-space: nowrap;
  transition: color 0.2s, background 0.2s;
}
.dropdown a:hover,
.sub-menu a:hover { color: var(--accent); background: rgba(232,53,15,0.06); }
.nav-link,
.primary-menu > .menu-item > a {
  color: var(--silver); text-decoration: none; font-size: 14px; font-weight: 500;
  transition: color 0.3s; cursor: pointer;
}
.nav-link:hover, .nav-link.active,
.primary-menu > .menu-item > a:hover,
.primary-menu > .current-menu-item > a { color: var(--accent); }

.nav-toggle {
  display: none; flex-direction: column; justify-content: center;
  gap: 5px; width: 40px; height: 40px;
  background: none; border: none; cursor: pointer; padding: 4px;
}
.nav-toggle span {
  display: block; height: 2px; width: 100%;
  background: var(--silver); transition: transform 0.3s, opacity 0.3s; transform-origin: center;
}
.nav-toggle.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-toggle.open span:nth-child(2) { opacity: 0; }
.nav-toggle.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ══════════════════════════════════════
   HERO
══════════════════════════════════════ */
.hero {
  margin-top: 80px;
  height: 70vh; min-height: 420px;
  display: flex; align-items: center; padding: 0 48px;
  background: radial-gradient(circle at 80% 50%, rgba(232,53,15,0.12), transparent 50%), var(--black);
  position: relative; border-bottom: 1px solid var(--border); overflow: hidden;
}
.hero--short   { height: 50vh; min-height: 300px; }
.hero--about   { height: 72vh; min-height: 480px; align-items: flex-end; padding-bottom: 80px; }
.hero-bg-text  {
  position: absolute; right: -20px; top: 50%; transform: translateY(-50%);
  font-family: 'Barlow Condensed', sans-serif; font-size: clamp(100px,18vw,220px);
  font-weight: 900; color: rgba(255,255,255,0.025); pointer-events: none; user-select: none; white-space: nowrap;
}
.hero-content  { max-width: 900px; z-index: 2; }
.eyebrow       { color: var(--accent); font-size: 13px; font-weight: 700; letter-spacing: 4px; text-transform: uppercase; display: block; margin-bottom: 20px; }
.hero-title    { font-size: clamp(36px,6vw,72px); font-weight: 900; color: var(--white); line-height: 1.05; margin-bottom: 24px; }
.hero-title em, .hero em { font-style: normal; color: var(--accent); }
.hero-desc, .hero-lead  { font-size: 17px; color: #888; max-width: 640px; line-height: 1.8; }
.hero-stats    { display: flex; gap: 48px; flex-wrap: wrap; margin-top: 48px; }
.hero-stat-value { font-family: 'Barlow Condensed', sans-serif; font-size: 44px; font-weight: 900; color: var(--white); line-height: 1; }
.hero-stat-label { font-size: 12px; color: #555; margin-top: 4px; letter-spacing: 1px; }

/* ══════════════════════════════════════
   SECTIONS
══════════════════════════════════════ */
section, .pd-section { padding: 100px 48px; }
section.alt, .pd-section:nth-child(even) { background: var(--surface); }
.section-header { margin-bottom: 60px; border-left: 4px solid var(--accent); padding-left: 24px; }
.section-title  { font-size: 36px; font-weight: 700; color: var(--white); text-transform: uppercase; }
.section-eyebrow { font-family: 'Barlow Condensed', sans-serif; font-size: 11px; font-weight: 800; color: var(--accent); letter-spacing: 3px; text-transform: uppercase; display: block; margin-bottom: 14px; }
.accent-rule    { width: 48px; height: 3px; background: var(--accent); margin-bottom: 40px; }
.pd-section-header { margin-bottom: 48px; }
.pd-section-label  { font-family: 'Barlow Condensed', sans-serif; font-size: 11px; font-weight: 800; color: var(--accent); letter-spacing: 3px; text-transform: uppercase; display: block; margin-bottom: 10px; }
.pd-section-title  { font-size: 28px; font-weight: 700; color: var(--white); }

/* ══════════════════════════════════════
   HOMEPAGE PRODUCT GRID
══════════════════════════════════════ */
.product-grid   { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px,1fr)); gap: 30px; }
.category-box   { background: var(--surface); border: 1px solid var(--border); padding: 40px; position: relative; }
.category-box::after { content:''; position:absolute; top:0; left:0; width:0; height:2px; background:var(--accent); transition:width 0.4s; }
.category-box:hover::after { width:100%; }
.category-name  { font-size: 20px; font-weight: 700; color: var(--white); margin-bottom: 24px; display: flex; align-items: center; justify-content: space-between; }
.item-list      { list-style: none; }
.item-list li   { padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,0.05); display: flex; justify-content: space-between; align-items: flex-start; }
.item-list li .name     { color: var(--white); font-weight: 500; font-size: 15px; display: block; }
.item-list li .sub-name { font-size: 12px; color: #777; display: block; margin-top: 2px; }
.item-list li .brand-tag {
  font-size: 10px; color: var(--accent); font-family: 'Barlow Condensed', sans-serif;
  font-weight: 800; border: 1px solid var(--accent); padding: 2px 6px;
  letter-spacing: 1px; flex-shrink: 0; margin-left: 10px;
}
.pdf-link {
  font-size: 10px; color: #666; text-decoration: none; margin-left: 8px;
  border: 1px solid #444; padding: 1px 5px; letter-spacing: 0.5px;
  font-family: 'Barlow Condensed', sans-serif; font-weight: 700;
  transition: color 0.2s, border-color 0.2s; vertical-align: middle;
}
.pdf-link:hover { color: var(--accent); border-color: var(--accent); }

/* ══════════════════════════════════════
   BREADCRUMB
══════════════════════════════════════ */
.breadcrumb {
  padding: 96px 48px 0;
  display: flex; align-items: center; gap: 8px;
  font-size: 12px; color: #555;
  font-family: 'Barlow Condensed', sans-serif; letter-spacing: 1px; text-transform: uppercase;
}
.breadcrumb a     { color: #555; text-decoration: none; transition: color 0.2s; }
.breadcrumb a:hover { color: var(--accent); }
.breadcrumb span.current { color: var(--silver); }

/* ══════════════════════════════════════
   PRODUCT DETAIL HERO
══════════════════════════════════════ */
.product-hero { display: grid; grid-template-columns: 1fr 1fr; min-height: 600px; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.gallery-pane { background: var(--surface); position: relative; overflow: hidden; }
.gallery-main { width:100%; height:480px; object-fit:contain; display:block; padding:40px; background:var(--surface); cursor:zoom-in; transition:transform 0.3s; }
.gallery-main:hover { transform: scale(1.02); }
.gallery-thumbs { display:flex; gap:8px; padding:0 20px 20px; overflow-x:auto; scrollbar-width:thin; }
.gallery-thumbs::-webkit-scrollbar { height:4px; }
.gallery-thumbs::-webkit-scrollbar-thumb { background:var(--accent); }
.thumb { width:72px; height:56px; object-fit:contain; border:1px solid var(--border); background:var(--dark); cursor:pointer; flex-shrink:0; padding:6px; transition:border-color 0.2s; }
.thumb:hover, .thumb.active { border-color:var(--accent); }
.hires-btn {
  position:absolute; top:16px; right:16px;
  font-family:'Barlow Condensed',sans-serif; font-size:11px; font-weight:800; letter-spacing:1.5px;
  color:var(--silver); background:rgba(10,10,11,0.85); border:1px solid var(--border);
  padding:7px 14px; cursor:pointer; text-decoration:none; transition:color 0.2s,border-color 0.2s;
  display:flex; align-items:center; gap:6px;
}
.hires-btn:hover { color:var(--accent); border-color:var(--accent); }
.info-pane { padding:52px 56px; display:flex; flex-direction:column; border-left:1px solid var(--border); }
.product-brand-row  { display:flex; align-items:center; gap:12px; margin-bottom:20px; }
.product-brand-tag  { font-family:'Barlow Condensed',sans-serif; font-size:11px; font-weight:800; color:var(--accent); border:1px solid var(--accent); padding:3px 10px; letter-spacing:2px; }
.product-category-tag { font-family:'Barlow Condensed',sans-serif; font-size:11px; font-weight:700; color:#555; border:1px solid #333; padding:3px 10px; letter-spacing:1px; }
.product-name { font-family:'Barlow Condensed',sans-serif; font-size:clamp(40px,5vw,64px); font-weight:900; color:var(--white); line-height:1; margin-bottom:8px; letter-spacing:-1px; }
.product-fullname { font-size:15px; color:var(--silver); margin-bottom:20px; font-weight:500; }
.product-tagline  { font-size:16px; color:#666; margin-bottom:36px; line-height:1.7; max-width:440px; }
.stats-strip { display:grid; grid-template-columns:repeat(3,1fr); border:1px solid var(--border); margin-bottom:36px; }
.stat-item  { padding:20px 18px; border-right:1px solid var(--border); }
.stat-item:last-child { border-right:none; }
.stat-value { font-family:'Barlow Condensed',sans-serif; font-size:28px; font-weight:900; color:var(--white); line-height:1; }
.stat-label { font-size:11px; color:#555; margin-top:4px; letter-spacing:0.5px; }
.cta-row    { display:flex; gap:12px; flex-wrap:wrap; margin-bottom:32px; }
.quick-downloads { display:flex; gap:16px; flex-wrap:wrap; padding-top:28px; border-top:1px solid var(--border); }
.dl-chip { display:inline-flex; align-items:center; gap:6px; font-size:12px; font-family:'Barlow Condensed',sans-serif; font-weight:700; color:#666; text-decoration:none; letter-spacing:0.5px; transition:color 0.2s; }
.dl-chip:hover { color:var(--accent); }

/* ══════════════════════════════════════
   STICKY TABS
══════════════════════════════════════ */
.tab-nav {
  position:sticky; top:80px; z-index:100;
  background:rgba(10,10,11,0.97); backdrop-filter:blur(12px); border-bottom:1px solid var(--border);
  display:flex; gap:0; overflow-x:auto; padding:0 48px; scrollbar-width:none;
}
.tab-nav::-webkit-scrollbar { display:none; }
.tab-btn {
  font-family:'Barlow Condensed',sans-serif; font-size:13px; font-weight:800;
  letter-spacing:1.5px; text-transform:uppercase; color:#555;
  background:none; border:none; cursor:pointer;
  padding:18px 24px; border-bottom:2px solid transparent;
  transition:color 0.2s,border-color 0.2s; white-space:nowrap;
}
.tab-btn:hover  { color:var(--silver); }
.tab-btn.active { color:var(--white); border-bottom-color:var(--accent); }

/* ══════════════════════════════════════
   FEATURES
══════════════════════════════════════ */
.features-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:2px; }
.feature-card  {
  background:var(--dark); padding:36px 32px; border:1px solid var(--border);
  position:relative; overflow:hidden; transition:border-color 0.3s;
}
.feature-card:hover { border-color:rgba(232,53,15,0.4); }
.feature-card::before { content:''; position:absolute; top:0; left:0; width:0; height:2px; background:var(--accent); transition:width 0.4s; }
.feature-card:hover::before { width:100%; }
.feature-num   { font-family:'Barlow Condensed',sans-serif; font-size:48px; font-weight:900; color:rgba(232,53,15,0.12); line-height:1; position:absolute; top:20px; right:24px; }
.feature-title { font-size:16px; font-weight:700; color:var(--white); margin-bottom:10px; margin-top:52px; }
.feature-desc  { font-size:13px; color:#666; line-height:1.7; }

/* ══════════════════════════════════════
   TECH SPECS
══════════════════════════════════════ */
.specs-layout     { display:grid; grid-template-columns:1fr 1fr; gap:48px; }
.spec-group-title { font-family:'Barlow Condensed',sans-serif; font-size:12px; font-weight:800; color:var(--accent); letter-spacing:2px; text-transform:uppercase; padding-bottom:12px; border-bottom:1px solid var(--border); }
.spec-table       { width:100%; border-collapse:collapse; }
.spec-table tr    { border-bottom:1px solid rgba(255,255,255,0.04); }
.spec-table tr:last-child { border-bottom:none; }
.spec-table td    { padding:13px 0; font-size:13px; vertical-align:top; }
.spec-table td:first-child { color:#555; width:45%; padding-right:16px; }
.spec-table td:last-child  { color:var(--white); font-weight:500; }

/* ══════════════════════════════════════
   DOWNLOADS
══════════════════════════════════════ */
.downloads-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:16px; }
.dl-card        { background:var(--dark); border:1px solid var(--border); padding:28px; display:flex; align-items:flex-start; gap:20px; transition:border-color 0.3s; text-decoration:none; }
.dl-card:hover  { border-color:var(--accent); }
.dl-type-badge  { font-family:'Barlow Condensed',sans-serif; font-size:13px; font-weight:900; color:var(--accent); border:1px solid rgba(232,53,15,0.3); background:rgba(232,53,15,0.06); padding:6px 10px; letter-spacing:1px; flex-shrink:0; min-width:52px; text-align:center; line-height:1.2; }
.dl-info .dl-title { font-size:14px; font-weight:700; color:var(--white); margin-bottom:4px; }
.dl-info .dl-meta  { font-size:11px; color:#444; font-family:'Barlow Condensed',sans-serif; letter-spacing:0.5px; }
.dl-arrow       { color:#333; font-size:18px; align-self:center; transition:color 0.2s; flex-shrink:0; }
.dl-card:hover .dl-arrow { color:var(--accent); }

/* ══════════════════════════════════════
   RELATED PRODUCTS
══════════════════════════════════════ */
.related-grid    { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:20px; }
.related-card    { background:var(--surface); border:1px solid var(--border); text-decoration:none; display:block; position:relative; overflow:hidden; transition:border-color 0.3s; }
.related-card:hover { border-color:rgba(232,53,15,0.5); }
.related-card::after { content:''; position:absolute; bottom:0; left:0; width:0; height:2px; background:var(--accent); transition:width 0.4s; }
.related-card:hover::after { width:100%; }
.related-img     { width:100%; height:160px; object-fit:contain; background:var(--dark); padding:20px; display:block; }
.related-img-placeholder { height:160px; background:var(--dark); }
.related-body    { padding:20px 24px; }
.related-brand   { font-family:'Barlow Condensed',sans-serif; font-size:10px; font-weight:800; color:var(--accent); letter-spacing:2px; margin-bottom:6px; }
.related-name    { font-size:16px; font-weight:700; color:var(--white); margin-bottom:4px; }
.related-desc    { font-size:12px; color:#555; }

/* ══════════════════════════════════════
   LIGHTBOX
══════════════════════════════════════ */
.lightbox         { display:none; position:fixed; inset:0; z-index:9999; background:rgba(0,0,0,0.92); align-items:center; justify-content:center; }
.lightbox.open    { display:flex; }
.lightbox-img     { max-width:88vw; max-height:88vh; object-fit:contain; }
.lightbox-close   { position:absolute; top:24px; right:32px; font-size:32px; color:#555; cursor:pointer; background:none; border:none; transition:color 0.2s; line-height:1; }
.lightbox-close:hover { color:var(--white); }
.lightbox-prev, .lightbox-next { position:absolute; top:50%; transform:translateY(-50%); font-size:28px; color:#444; cursor:pointer; background:none; border:none; padding:20px; transition:color 0.2s; }
.lightbox-prev    { left:20px; }
.lightbox-next    { right:20px; }
.lightbox-prev:hover, .lightbox-next:hover { color:var(--white); }
.lightbox-counter { position:absolute; bottom:24px; left:50%; transform:translateX(-50%); font-family:'Barlow Condensed',sans-serif; font-size:13px; color:#555; letter-spacing:2px; }

/* ══════════════════════════════════════
   BUTTONS
══════════════════════════════════════ */
.btn-primary {
  display:inline-flex; align-items:center; gap:8px;
  background:var(--accent); color:var(--white);
  font-family:'Barlow Condensed',sans-serif; font-size:13px; font-weight:800; letter-spacing:1.5px;
  padding:14px 28px; text-decoration:none; border:1px solid var(--accent); transition:background 0.2s,color 0.2s; cursor:pointer;
}
.btn-primary:hover { background:transparent; color:var(--accent); }
.btn-secondary {
  display:inline-flex; align-items:center; gap:8px;
  background:transparent; color:var(--silver);
  font-family:'Barlow Condensed',sans-serif; font-size:13px; font-weight:800; letter-spacing:1.5px;
  padding:14px 28px; text-decoration:none; border:1px solid var(--border); transition:border-color 0.2s,color 0.2s; cursor:pointer;
}
.btn-secondary:hover { border-color:var(--accent); color:var(--accent); }

/* ══════════════════════════════════════
   ABOUT PAGE
══════════════════════════════════════ */
.mission-layout   { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }
.mission-quote    { font-family:'Barlow Condensed',sans-serif; font-size:clamp(28px,4vw,48px); font-weight:700; color:var(--white); line-height:1.2; border-left:4px solid var(--accent); padding-left:32px; }
.mission-quote em { font-style:normal; color:var(--accent); }
.values-grid      { display:grid; grid-template-columns:repeat(3,1fr); gap:2px; margin-top:60px; }
.value-card       { background:var(--dark); border:1px solid var(--border); padding:44px 36px; position:relative; overflow:hidden; transition:border-color 0.3s; }
.value-card:hover { border-color:rgba(232,53,15,0.4); }
.value-card::before { content:''; position:absolute; top:0; left:0; width:0; height:2px; background:var(--accent); transition:width 0.4s; }
.value-card:hover::before { width:100%; }
.value-num        { font-family:'Barlow Condensed',sans-serif; font-size:64px; font-weight:900; color:rgba(232,53,15,0.08); position:absolute; top:16px; right:20px; line-height:1; }
.value-title      { font-size:20px; font-weight:700; color:var(--white); margin-bottom:16px; }
.value-desc       { font-size:14px; color:#666; line-height:1.8; }
.partner-list     { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:2px; }
.partner-card     { background:var(--dark); border:1px solid var(--border); padding:40px 36px; display:flex; gap:24px; align-items:flex-start; position:relative; overflow:hidden; transition:border-color 0.3s; }
.partner-card:hover { border-color:rgba(232,53,15,0.35); }
.partner-card::after { content:''; position:absolute; bottom:0; left:0; width:0; height:2px; background:var(--accent); transition:width 0.4s; }
.partner-card:hover::after { width:100%; }
.partner-flag     { font-size:32px; flex-shrink:0; margin-top:2px; }
.partner-name     { font-family:'Barlow Condensed',sans-serif; font-size:22px; font-weight:900; color:var(--white); letter-spacing:1px; margin-bottom:6px; }
.partner-origin   { font-size:11px; font-family:'Barlow Condensed',sans-serif; font-weight:800; color:var(--accent); letter-spacing:2px; text-transform:uppercase; margin-bottom:12px; display:block; }
.partner-desc     { font-size:13px; color:#666; line-height:1.7; }
.partner-products { display:flex; flex-wrap:wrap; gap:6px; margin-top:14px; }
.partner-tag      { font-size:10px; font-family:'Barlow Condensed',sans-serif; font-weight:800; color:#555; border:1px solid #2a2b30; padding:2px 8px; letter-spacing:1px; }
.cta-strip        { padding:80px 48px; display:flex; align-items:center; justify-content:space-between; gap:40px; flex-wrap:wrap; border-top:1px solid var(--border); }
.cta-strip h2     { font-size:clamp(24px,3vw,36px); font-weight:700; color:var(--white); max-width:480px; line-height:1.2; }
.cta-strip h2 em  { font-style:normal; color:var(--accent); }
.cta-btns         { display:flex; gap:12px; flex-wrap:wrap; }

/* ══════════════════════════════════════
   SUPPORT PAGE
══════════════════════════════════════ */
.quick-nav       { display:flex; gap:12px; flex-wrap:wrap; padding:28px 48px; background:var(--surface); border-bottom:1px solid var(--border); }
.quick-nav a     { color:var(--silver); text-decoration:none; font-size:13px; font-weight:600; padding:8px 18px; border:1px solid var(--border); letter-spacing:0.5px; transition:color 0.2s,border-color 0.2s,background 0.2s; }
.quick-nav a:hover { color:var(--accent); border-color:var(--accent); background:rgba(232,53,15,0.05); }
.selector-box    { background:var(--dark); border:1px solid var(--border); padding:40px; max-width:820px; }
.selector-row    { display:flex; gap:16px; flex-wrap:wrap; align-items:flex-end; margin-bottom:32px; }
.selector-group  { display:flex; flex-direction:column; gap:8px; flex:1; min-width:220px; }
.selector-group label { font-size:11px; font-family:'Barlow Condensed',sans-serif; font-weight:800; color:var(--accent); letter-spacing:2px; text-transform:uppercase; }
.selector-group select {
  background:var(--surface); border:1px solid var(--border); color:var(--white);
  padding:12px 38px 12px 16px; font-size:14px; font-family:'Noto Sans SC',sans-serif;
  appearance:none; -webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23b8bcc8' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 14px center; cursor:pointer; transition:border-color 0.2s;
}
.selector-group select:focus { outline:none; border-color:var(--accent); }
.selector-group select:disabled { color:#444; cursor:not-allowed; }
.result-panel    { border-top:1px solid var(--border); padding-top:28px; display:none; }
.result-panel.visible { display:block; }
.result-label    { font-size:11px; font-family:'Barlow Condensed',sans-serif; font-weight:800; color:var(--accent); letter-spacing:2px; margin-bottom:12px; }
.result-name     { font-size:20px; font-weight:700; color:var(--white); margin-bottom:4px; }
.result-desc     { font-size:13px; color:#555; margin-bottom:20px; }
.result-links    { display:flex; flex-wrap:wrap; gap:12px; }
.result-btn      { display:inline-flex; align-items:center; gap:8px; font-size:12px; font-family:'Barlow Condensed',sans-serif; font-weight:800; letter-spacing:1.5px; padding:10px 20px; text-decoration:none; border:1px solid var(--accent); color:var(--accent); transition:background 0.2s,color 0.2s; }
.result-btn:hover { background:var(--accent); color:var(--white); }
.result-btn.coming { border-color:#2a2b30; color:#3a3b40; pointer-events:none; }
.notice-box      { padding:32px 36px; border:1px solid var(--border); border-left:4px solid var(--accent); background:rgba(232,53,15,0.04); max-width:820px; }
.notice-box h4   { font-size:15px; font-weight:700; color:var(--white); margin-bottom:10px; }
.notice-box p    { font-size:14px; color:#666; line-height:1.8; }
.remote-grid     { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:24px; }
.remote-card     { background:var(--dark); border:1px solid var(--border); padding:36px 32px; text-align:center; transition:border-color 0.3s; position:relative; }
.remote-card::before { content:''; position:absolute; top:0; left:0; width:0; height:2px; background:var(--accent); transition:width 0.4s; }
.remote-card:hover::before { width:100%; }
.remote-card:hover { border-color:var(--accent); }
.remote-icon     { font-size:38px; margin-bottom:18px; display:block; }
.remote-card h3  { font-size:17px; font-weight:700; color:var(--white); margin-bottom:10px; }
.remote-card p   { font-size:13px; color:#666; margin-bottom:22px; line-height:1.7; }
.tv-card         { background:var(--dark); border:1px solid var(--accent); border-top:3px solid var(--accent); padding:36px 32px; text-align:center; }
.tv-logo-text    { font-family:'Barlow Condensed',sans-serif; font-size:24px; font-weight:900; color:var(--white); letter-spacing:1px; margin-bottom:4px; }
.tv-logo-text span { color:var(--accent); }
.action-btn      { display:inline-block; font-size:12px; font-family:'Barlow Condensed',sans-serif; font-weight:800; letter-spacing:1.5px; padding:10px 22px; text-decoration:none; border:1px solid var(--accent); color:var(--accent); transition:background 0.2s,color 0.2s; }
.action-btn:hover { background:var(--accent); color:var(--white); }
.action-btn.secondary { border-color:var(--border); color:var(--silver); }
.action-btn.secondary:hover { border-color:var(--accent); color:var(--accent); background:transparent; }

/* ══════════════════════════════════════
   CONTACT PAGE
══════════════════════════════════════ */
.channels        { padding:80px 48px; display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:2px; }
.channel-card    { background:var(--surface); border:1px solid var(--border); padding:40px 36px; position:relative; overflow:hidden; transition:border-color 0.3s; }
.channel-card::before { content:''; position:absolute; top:0; left:0; width:0; height:2px; background:var(--accent); transition:width 0.4s; }
.channel-card:hover { border-color:rgba(232,53,15,0.35); }
.channel-card:hover::before { width:100%; }
.channel-icon    { font-size:32px; margin-bottom:20px; display:block; }
.channel-label   { font-family:'Barlow Condensed',sans-serif; font-size:11px; font-weight:800; color:var(--accent); letter-spacing:2px; text-transform:uppercase; margin-bottom:8px; display:block; }
.channel-value   { font-size:17px; font-weight:700; color:var(--white); margin-bottom:6px; }
.channel-value a { color:var(--white); text-decoration:none; transition:color 0.2s; }
.channel-value a:hover { color:var(--accent); }
.channel-note    { font-size:13px; color:#555; }
.main-grid       { display:grid; grid-template-columns:1fr 1fr; gap:0; border-top:1px solid var(--border); }
.form-pane, .map-pane { padding:80px 56px; }
.map-pane        { background:var(--surface); }
.pane-label      { font-family:'Barlow Condensed',sans-serif; font-size:11px; font-weight:800; color:var(--accent); letter-spacing:3px; text-transform:uppercase; margin-bottom:10px; display:block; }
.pane-title      { font-size:28px; font-weight:700; color:var(--white); margin-bottom:8px; }
.pane-desc       { font-size:14px; color:#555; margin-bottom:40px; }
.form-row        { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.form-group      { display:flex; flex-direction:column; gap:8px; margin-bottom:20px; }
.form-group label { font-size:11px; font-family:'Barlow Condensed',sans-serif; font-weight:800; color:#555; letter-spacing:1.5px; text-transform:uppercase; }
.form-group input,
.form-group select,
.form-group textarea {
  background:var(--surface); border:1px solid var(--border); color:var(--white);
  padding:13px 16px; font-size:14px; font-family:'Noto Sans SC',sans-serif;
  transition:border-color 0.2s; resize:none; appearance:none; -webkit-appearance:none;
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus { outline:none; border-color:var(--accent); }
.form-group input::placeholder,
.form-group textarea::placeholder { color:#3a3b40; }
.form-group select {
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23555' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 14px center; padding-right:38px; cursor:pointer;
}
.form-group select option { background:var(--dark); }
.form-check      { display:flex; align-items:flex-start; gap:12px; margin-bottom:28px; }
.form-check input[type="checkbox"] { width:16px; height:16px; margin-top:2px; accent-color:var(--accent); flex-shrink:0; cursor:pointer; }
.form-check label { font-size:13px; color:#555; cursor:pointer; }
.btn-submit      { background:var(--accent); color:var(--white); border:1px solid var(--accent); font-family:'Barlow Condensed',sans-serif; font-size:14px; font-weight:800; letter-spacing:2px; padding:16px 36px; cursor:pointer; width:100%; transition:background 0.2s,color 0.2s; display:flex; align-items:center; justify-content:center; gap:10px; }
.btn-submit:hover { background:transparent; color:var(--accent); }
.map-placeholder { width:100%; height:280px; background:var(--dark); border:1px solid var(--border); margin-bottom:40px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; position:relative; overflow:hidden; }
.map-pin         { font-size:36px; }
.map-open-btn    { display:inline-flex; align-items:center; gap:6px; font-family:'Barlow Condensed',sans-serif; font-size:12px; font-weight:800; letter-spacing:1.5px; color:var(--accent); border:1px solid rgba(232,53,15,0.3); background:rgba(232,53,15,0.06); padding:8px 18px; text-decoration:none; position:relative; z-index:1; transition:background 0.2s,border-color 0.2s; }
.map-open-btn:hover { background:rgba(232,53,15,0.12); border-color:var(--accent); }
.address-block   { margin-bottom:36px; }
.address-row     { display:flex; gap:16px; padding:16px 0; border-bottom:1px solid rgba(255,255,255,0.05); }
.address-row:last-child { border-bottom:none; }
.address-icon    { font-size:18px; flex-shrink:0; margin-top:2px; }
.address-title   { font-size:12px; font-family:'Barlow Condensed',sans-serif; font-weight:800; color:var(--accent); letter-spacing:1.5px; text-transform:uppercase; margin-bottom:4px; }
.address-text    { font-size:14px; color:var(--silver); line-height:1.6; }
.address-text a  { color:var(--silver); text-decoration:none; transition:color 0.2s; }
.address-text a:hover { color:var(--accent); }
.hours-table     { width:100%; border-collapse:collapse; }
.hours-table td  { font-size:13px; padding:4px 0; color:var(--silver); }
.hours-table td:first-child { color:#555; width:44%; }

/* ══════════════════════════════════════
   FOOTER
══════════════════════════════════════ */
#site-footer     { background:var(--dark); padding:80px 48px 40px; border-top:1px solid var(--border); }
.footer-grid     { display:grid; grid-template-columns:2fr repeat(3,1fr); gap:60px; margin-bottom:60px; }
.footer-company  { color:var(--white); font-weight:700; margin-bottom:8px; }
.footer-contact-item { font-size:14px; color:#888; margin-bottom:8px; }
.footer-contact-item a { color:#888; text-decoration:none; transition:color 0.3s; }
.footer-contact-item a:hover { color:var(--accent); }
.footer-link-group h4 { color:var(--white); font-size:16px; margin-bottom:24px; font-weight:700; }
.footer-link-group ul { list-style:none; }
.footer-link-group p,
.footer-link-group a,
.footer-link-group li a { display:block; font-size:14px; color:#888; text-decoration:none; margin-bottom:12px; transition:color 0.3s; }
.footer-link-group a:hover,
.footer-link-group li a:hover { color:var(--accent); }
.footer-bottom   { border-top:1px solid var(--border); padding-top:30px; text-align:center; font-size:12px; color:#555; }
.footer-logo img { height:48px; width:auto; display:block; margin-bottom:16px; }

/* ══════════════════════════════════════
   RESPONSIVE
══════════════════════════════════════ */
@media (max-width: 1024px) {
  .specs-layout { grid-template-columns:1fr; gap:36px; }
}
@media (max-width: 900px) {
  #site-nav   { padding:0 20px; min-height:64px; height:auto; flex-wrap:wrap; }
  .nav-logo img { height:38px; }
  .nav-toggle { display:flex; }
  .nav-links,
  .primary-menu { display:none; flex-direction:column; align-items:flex-start; gap:0; width:100%; padding:12px 0 20px; border-top:1px solid var(--border); }
  .nav-links.open,
  .primary-menu.open { display:flex; }
  .primary-menu > .menu-item,
  .nav-links > .nav-item,
  .nav-links > a.nav-link { width:100%; }
  .primary-menu > .menu-item > a,
  .nav-link { display:block; padding:14px 4px; font-size:15px; border-bottom:1px solid rgba(255,255,255,0.05); }
  .dropdown, .sub-menu { position:static; transform:none !important; opacity:1 !important; visibility:visible !important; background:rgba(255,255,255,0.03); border:none; border-left:2px solid var(--accent); margin-left:12px; padding:4px 0; display:none; }
  .dropdown.open, .sub-menu.open { display:block; }
  .hero, .hero--short, .hero--about { padding:60px 24px; min-height:auto; height:auto; align-items:flex-start; }
  .hero-bg-text { display:none; }
  section, .pd-section { padding:64px 24px; }
  .product-hero { grid-template-columns:1fr; }
  .info-pane    { padding:36px 24px; border-left:none; border-top:1px solid var(--border); }
  .gallery-main { height:320px; }
  .tab-nav      { padding:0 24px; }
  .mission-layout { grid-template-columns:1fr; gap:48px; }
  .values-grid  { grid-template-columns:1fr; }
  .partner-list { grid-template-columns:1fr; }
  .main-grid    { grid-template-columns:1fr; }
  .form-pane, .map-pane { padding:60px 24px; }
  .form-row     { grid-template-columns:1fr; }
  .channels     { padding:60px 24px; grid-template-columns:1fr 1fr; }
  .quick-nav    { padding:20px 24px; }
  .cta-strip    { padding:60px 24px; flex-direction:column; align-items:flex-start; }
  #site-footer  { padding:60px 24px 40px; }
  .footer-grid  { grid-template-columns:1fr; gap:36px; }
}
@media (max-width: 600px) {
  .stats-strip    { grid-template-columns:1fr 1fr; }
  .stat-item:nth-child(3) { border-top:1px solid var(--border); grid-column:1/-1; border-right:none; }
  .features-grid  { grid-template-columns:1fr; }
  .channels       { grid-template-columns:1fr; }
  .cta-btns       { flex-direction:column; width:100%; }
  .btn-primary, .btn-secondary { justify-content:center; }
  .product-name   { font-size:36px; }
  .cta-row        { flex-direction:column; }
}
