/* ACBOSS — Flat Vector Graphic Design System with Dynamic Micro-Animations */
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700;800&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap');

:root {
  /* Google Coral Flat Illustration Palette */
  --vector-teal: #00897b;
  --vector-teal-dark: #004d40;
  --vector-teal-light: #e0f2f1;
  --vector-teal-mint: #80cbc4;

  --vector-coral: #ff6e40;
  --vector-coral-dark: #d84315;
  --vector-coral-light: #fbe9e7;

  --vector-sand: #ffe0b2;
  --vector-sand-light: #fff8e1;

  --vector-yellow: #ffb74d;
  --vector-green: #2e7d32;

  /* Canvas & Cards */
  --bg-canvas: #ffffff;
  --bg-card: #f9fbfb;
  --bg-card-subtle: #f0f7f7;
  
  --card-border: #b2dfdb;
  --card-border-hover: #00897b;
  
  --text-heading: #004d40;
  --text-body: #263238;
  --text-muted: #546e7a;
  --text-dim: #78909c;
  --line-color: #e0f2f1;

  --font-main: 'Plus Jakarta Sans', -apple-system, sans-serif;
  --font-code: 'JetBrains Mono', monospace;

  --radius-card: 16px;
  --radius-badge: 8px;
  --radius-pill: 999px;

  --shadow-card: 0 4px 20px rgba(0, 77, 64, 0.05);
  --shadow-hover: 0 16px 36px rgba(0, 137, 123, 0.16);
  --shadow-coral: 0 12px 28px rgba(255, 110, 64, 0.35);
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  font-family: var(--font-main);
  background-color: var(--bg-canvas);
  color: var(--text-body);
  -webkit-font-smoothing: antialiased;
}

body {
  line-height: 1.6;
  background-image: 
    radial-gradient(#b2dfdb 1.2px, transparent 1.2px),
    linear-gradient(to bottom, #ffffff 0%, #f4fbfb 100%);
  background-size: 24px 24px, 100% 100%;
  background-position: 0 0, 0 0;
  min-height: 100vh;
  overflow-x: hidden;
}

:focus-visible {
  outline: 3px solid var(--vector-teal);
  outline-offset: 4px;
}

/* Header & Nav */
.header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(16px);
  border-bottom: 2px solid var(--card-border);
  transition: box-shadow 0.3s ease;
}

.header:hover {
  box-shadow: 0 4px 20px rgba(0, 137, 123, 0.08);
}

.nav-container {
  max-width: 1280px;
  margin: 0 auto;
  padding: 16px 28px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.brand-logo {
  font-size: 1.5rem;
  font-weight: 800;
  color: var(--vector-teal-dark);
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 12px;
  letter-spacing: -0.02em;
  transition: transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.brand-logo:hover {
  transform: scale(1.03) rotate(-1deg);
}

.brand-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: var(--vector-coral-light);
  border: 1.5px solid var(--vector-coral);
  padding: 3px 10px;
  border-radius: var(--radius-badge);
  font-family: var(--font-code);
  font-size: 0.75rem;
  color: var(--vector-coral-dark);
  font-weight: 700;
  transition: all 0.3s ease;
}

.brand-logo:hover .brand-chip {
  background: var(--vector-coral);
  color: #ffffff;
  transform: translateY(-1px);
}

.status-indicator {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #e8f5e9;
  border: 1.5px solid #a5d6a7;
  padding: 4px 14px;
  border-radius: var(--radius-pill);
  font-family: var(--font-code);
  font-size: 0.75rem;
  color: var(--vector-green);
  font-weight: 700;
  transition: transform 0.2s ease;
}

.status-indicator:hover {
  transform: scale(1.05);
}

.status-dot {
  width: 8px;
  height: 8px;
  background: #2e7d32;
  border-radius: 50%;
  box-shadow: 0 0 8px #2e7d32;
  animation: pulse-green 1.8s infinite cubic-bezier(0.4, 0, 0.6, 1);
}

@keyframes pulse-green {
  0%, 100% { transform: scale(1); opacity: 1; box-shadow: 0 0 4px #2e7d32; }
  50% { transform: scale(1.4); opacity: 0.5; box-shadow: 0 0 12px #2e7d32; }
}

.nav-links {
  display: flex;
  align-items: center;
  gap: 28px;
  list-style: none;
}

.nav-links a {
  color: var(--text-muted);
  text-decoration: none;
  font-weight: 700;
  font-size: 0.92rem;
  transition: all 0.25s ease;
  position: relative;
}

.nav-links a::after {
  content: '';
  position: absolute;
  bottom: -4px;
  left: 50%;
  width: 0;
  height: 2px;
  background: var(--vector-teal);
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  transform: translateX(-50%);
}

.nav-links a:hover {
  color: var(--vector-teal);
}

.nav-links a:hover::after {
  width: 100%;
}

/* Buttons */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 12px 26px;
  border-radius: var(--radius-pill);
  font-weight: 800;
  font-size: 0.95rem;
  text-decoration: none;
  cursor: pointer;
  border: none;
  position: relative;
  overflow: hidden;
  transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.btn-coral {
  background: linear-gradient(135deg, #ff6e40 0%, #ff5722 100%);
  color: #fff;
  box-shadow: 0 4px 16px rgba(255, 110, 64, 0.3);
}

.btn-coral::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.35), transparent);
  transition: left 0.6s ease;
}

.btn-coral:hover {
  transform: translateY(-3px) scale(1.02);
  box-shadow: var(--shadow-coral);
}

.btn-coral:hover::before {
  left: 100%;
}

.btn-teal {
  background: var(--vector-teal-light);
  color: var(--vector-teal-dark);
  border: 2px solid var(--vector-teal);
}

.btn-teal:hover {
  background: var(--vector-teal);
  color: #fff;
  transform: translateY(-3px) scale(1.02);
  box-shadow: var(--shadow-hover);
}

/* Hero Section */
.hero-section {
  max-width: 1280px;
  margin: 0 auto;
  padding: 60px 28px 80px;
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 48px;
  align-items: center;
}

.hero-tag {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--vector-teal-light);
  border: 1.5px solid var(--vector-teal-mint);
  padding: 6px 16px;
  border-radius: var(--radius-pill);
  font-family: var(--font-code);
  font-size: 0.82rem;
  color: var(--vector-teal-dark);
  font-weight: 700;
  margin-bottom: 20px;
}

.hero-content h1 {
  font-size: 3.6rem;
  line-height: 1.08;
  letter-spacing: -0.03em;
  margin-bottom: 20px;
  font-weight: 800;
  color: var(--text-heading);
}

.hero-content h1 span.coral-highlight {
  color: var(--vector-coral);
}

.hero-subtitle {
  font-size: 1.25rem;
  color: var(--text-muted);
  margin-bottom: 32px;
  max-width: 520px;
}

.hero-actions {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 36px;
}

.hero-specs-row {
  display: flex;
  gap: 28px;
  border-top: 2px dashed var(--card-border);
  padding-top: 24px;
}

.hero-spec-item {
  display: flex;
  flex-direction: column;
}

.hero-spec-num {
  font-family: var(--font-code);
  font-size: 1.4rem;
  font-weight: 800;
  color: var(--vector-teal);
}

.hero-spec-label {
  font-size: 0.78rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 700;
}

/* Vector Stage Container */
.vector-stage-card {
  background: #ffffff;
  border: 2.5px solid var(--vector-teal);
  border-radius: var(--radius-card);
  padding: 24px;
  position: relative;
  overflow: hidden;
  box-shadow: var(--shadow-card);
  transition: all 0.4s ease;
}

.vector-stage-card:hover {
  border-color: var(--vector-coral);
  box-shadow: var(--shadow-hover);
}

.hero-illustration-svg {
  width: 100%;
  height: auto;
  display: block;
}

/* SVG Vector Micro-Animations */
.ir-beam {
  stroke-dasharray: 8 6;
  animation: ir-dash-pulse 1.6s linear infinite;
}

@keyframes ir-dash-pulse {
  0% { stroke-dashoffset: 28; opacity: 0.4; }
  50% { opacity: 1; }
  100% { stroke-dashoffset: 0; opacity: 0.4; }
}

.vector-stage-card svg circle[fill="#ffffff"] {
  animation: led-breath 2s infinite ease-in-out;
}

@keyframes led-breath {
  0%, 100% { opacity: 0.8; transform: scale(1); }
  50% { opacity: 1; filter: drop-shadow(0 0 6px #ffffff); }
}

.vector-stage-card svg g[transform*="translate(40, 45)"] {
  animation: float-bob 4s ease-in-out infinite;
}

.vector-stage-card svg g[transform*="translate(200, 320)"] {
  animation: float-bob 4s ease-in-out 2s infinite;
}

@keyframes float-bob {
  0%, 100% { transform: translate(40px, 45px); }
  50% { transform: translate(40px, 39px); }
}

/* Why This? Engineering Thesis Section Styling */
.why-this-container {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 28px;
}

.why-this-card {
  background: #ffffff;
  border: 2.5px solid var(--vector-teal);
  border-radius: var(--radius-card);
  padding: 32px;
  box-shadow: var(--shadow-card);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition: all 0.35s ease;
}

.why-this-card:hover {
  border-color: var(--vector-coral);
  box-shadow: var(--shadow-hover);
  transform: translateY(-3px);
}

.why-card-badge {
  font-family: var(--font-code);
  font-size: 0.75rem;
  font-weight: 800;
  color: var(--vector-coral-dark);
  background: var(--vector-coral-light);
  border: 1.5px solid var(--vector-coral);
  padding: 4px 10px;
  border-radius: var(--radius-badge);
  display: inline-block;
  margin-bottom: 16px;
  align-self: flex-start;
}

.why-this-card h3 {
  font-size: 1.5rem;
  font-weight: 800;
  color: var(--text-heading);
  margin-bottom: 12px;
}

.why-this-card p {
  color: var(--text-muted);
  font-size: 0.98rem;
  line-height: 1.65;
  margin-bottom: 14px;
}

.why-card-pill-row {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1.5px dashed var(--card-border);
}

.why-pill-highlight {
  font-family: var(--font-code);
  font-size: 0.78rem;
  font-weight: 800;
  background: var(--vector-teal-light);
  color: var(--vector-teal-dark);
  border: 1.5px solid var(--vector-teal);
  padding: 4px 10px;
  border-radius: var(--radius-pill);
}

.why-pill-alert {
  font-family: var(--font-code);
  font-size: 0.78rem;
  font-weight: 800;
  background: var(--vector-coral-light);
  color: var(--vector-coral-dark);
  border: 1.5px solid var(--vector-coral);
  padding: 4px 10px;
  border-radius: var(--radius-pill);
}

/* Why This Solution Banner */
.why-solution-banner {
  grid-column: span 2;
  background: linear-gradient(135deg, #004d40 0%, #00695c 100%);
  border: 2.5px solid var(--vector-teal);
  border-radius: var(--radius-card);
  padding: 36px 44px;
  color: #ffffff;
  box-shadow: var(--shadow-hover);
  position: relative;
  overflow: hidden;
}

.why-solution-banner::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -20%;
  width: 320px;
  height: 320px;
  background: radial-gradient(circle, rgba(255, 110, 64, 0.25) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.why-solution-header {
  margin-bottom: 12px;
}

.why-solution-tag {
  font-family: var(--font-code);
  font-size: 0.75rem;
  font-weight: 800;
  background: var(--vector-coral);
  color: #ffffff;
  padding: 3px 12px;
  border-radius: var(--radius-badge);
  display: inline-block;
  margin-bottom: 8px;
}

.why-solution-banner h3 {
  font-size: 1.8rem;
  font-weight: 800;
  color: #ffffff;
}

.why-solution-banner p {
  color: #e0f2f1;
  font-size: 1.08rem;
  line-height: 1.7;
  max-width: 900px;
  margin-bottom: 24px;
}

.why-solution-features {
  display: flex;
  gap: 28px;
  flex-wrap: wrap;
  border-top: 1.5px solid rgba(255, 255, 255, 0.2);
  padding-top: 20px;
}

.why-feature-item {
  display: flex;
  align-items: center;
  gap: 10px;
  font-family: var(--font-code);
  font-size: 0.88rem;
  font-weight: 700;
  color: #80cbc4;
}

/* Full-Scale Auto-Playing Horizontal Sliding Carousel Section Layout */
.carousel-wrapper {
  background: #ffffff;
  border: 2.5px solid var(--vector-teal);
  border-radius: var(--radius-card);
  padding: 36px 40px;
  box-shadow: var(--shadow-card);
  position: relative;
  overflow: hidden;
  max-width: 1280px;
  margin: 0 auto;
  transition: all 0.4s ease;
}

.carousel-wrapper:hover {
  border-color: var(--vector-coral);
  box-shadow: var(--shadow-hover);
}

.carousel-container {
  overflow: hidden;
  border-radius: 12px;
  width: 100%;
}

.carousel-track {
  display: flex;
  transition: transform 0.5s cubic-bezier(0.25, 1, 0.5, 1);
  width: 100%;
  will-change: transform;
}

.carousel-slide {
  min-width: 100%;
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 36px;
  align-items: center;
  padding: 4px;
  box-sizing: border-box;
}

.carousel-img-container {
  border-radius: 14px;
  overflow: hidden;
  border: 2px solid var(--card-border);
  box-shadow: var(--shadow-card);
  max-height: 360px;
  height: 360px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fafbfc;
}

.carousel-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.4s ease;
}

.carousel-slide:hover .carousel-img {
  transform: scale(1.03);
}

.carousel-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.carousel-content h3 {
  font-size: 1.75rem;
  font-weight: 800;
  color: var(--text-heading);
  margin-bottom: 12px;
  line-height: 1.25;
}

.carousel-content p {
  color: var(--text-muted);
  font-size: 1.05rem;
  line-height: 1.6;
  margin-bottom: 20px;
}

.carousel-controls {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1.5px solid var(--line-color);
}

.carousel-dots {
  display: flex;
  gap: 8px;
  align-items: center;
}

.carousel-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--card-border);
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.carousel-dot.active {
  background: var(--vector-coral);
  width: 24px;
  border-radius: var(--radius-pill);
  box-shadow: 0 0 8px var(--vector-coral);
}

.carousel-nav-btns {
  display: flex;
  gap: 10px;
}

.carousel-btn {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--vector-teal-light);
  border: 1.5px solid var(--vector-teal);
  color: var(--vector-teal-dark);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.carousel-btn:hover {
  background: var(--vector-teal);
  color: #ffffff;
  transform: scale(1.08);
  box-shadow: 0 4px 12px rgba(0, 137, 123, 0.3);
}

/* Real Comfort Story Section Frame */
.story-card-grid {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 36px;
  align-items: center;
  background: #ffffff;
  border: 2.5px solid var(--vector-teal);
  border-radius: var(--radius-card);
  padding: 36px;
  box-shadow: var(--shadow-card);
  transition: all 0.4s ease;
}

.story-card-grid:hover {
  border-color: var(--vector-coral);
  box-shadow: var(--shadow-hover);
}

.vector-story-img {
  width: 100%;
  height: auto;
  border-radius: 12px;
  border: 2px solid var(--card-border);
  box-shadow: var(--shadow-card);
  display: block;
}

.story-content h3 {
  font-size: 1.8rem;
  font-weight: 800;
  color: var(--text-heading);
  margin-bottom: 14px;
}

.story-content p {
  color: var(--text-muted);
  font-size: 1.05rem;
  line-height: 1.7;
  margin-bottom: 24px;
}

.story-badges {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.story-badge-pill {
  font-family: var(--font-code);
  font-size: 0.78rem;
  font-weight: 700;
  background: var(--vector-sand-light);
  color: #b45309;
  border: 1.5px solid var(--vector-yellow);
  padding: 3px 10px;
  border-radius: var(--radius-pill);
  transition: all 0.25s ease;
}

.story-badge-pill:hover {
  background: var(--vector-coral-light);
  color: var(--vector-coral-dark);
  border-color: var(--vector-coral);
  transform: translateY(-2px) scale(1.04);
}

/* Shared Section Layout */
.section {
  padding: 80px 28px;
  max-width: 1280px;
  margin: 0 auto;
}

.section-header {
  text-align: center;
  max-width: 720px;
  margin: 0 auto 48px;
}

.section-tag {
  display: inline-block;
  font-family: var(--font-code);
  font-size: 0.8rem;
  color: var(--vector-coral-dark);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin-bottom: 12px;
  font-weight: 800;
  background: var(--vector-coral-light);
  padding: 4px 14px;
  border-radius: var(--radius-badge);
  border: 1.5px solid var(--vector-coral);
}

.section-title {
  font-size: 2.3rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  margin-bottom: 14px;
  color: var(--text-heading);
}

.section-desc {
  font-size: 1.15rem;
  color: var(--text-muted);
}

/* Architecture Modular Block Container */
.architecture-container {
  background: #ffffff;
  border: 2.5px solid var(--vector-teal);
  border-radius: var(--radius-card);
  padding: 36px;
  box-shadow: var(--shadow-card);
}

.arch-layout {
  display: grid;
  grid-template-columns: 1.3fr 1.2fr;
  gap: 32px;
  align-items: start;
}

.arch-nodes-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}

.arch-node {
  background: var(--bg-card-subtle);
  border: 2px solid var(--card-border);
  border-radius: 12px;
  padding: 20px;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
  position: relative;
  overflow: hidden;
}

.arch-node:hover, .arch-node.active {
  border-color: var(--vector-teal);
  background: #ffffff;
  box-shadow: var(--shadow-hover);
  transform: translateY(-2px);
}

.arch-node.active::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 5px;
  background: var(--vector-teal);
}

.node-chip-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}

.node-pin {
  font-family: var(--font-code);
  font-size: 0.72rem;
  color: #b45309;
  background: var(--vector-sand);
  padding: 2px 8px;
  border-radius: 4px;
  border: 1px solid var(--vector-yellow);
  font-weight: 800;
}

.node-icon {
  width: 36px;
  height: 36px;
  border-radius: 8px;
  background: #ffffff;
  border: 1.5px solid var(--vector-teal);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--vector-teal);
}

.node-title {
  font-size: 1.1rem;
  font-weight: 800;
  margin-bottom: 6px;
  color: var(--text-heading);
}

.node-subtitle {
  font-size: 0.85rem;
  color: var(--text-muted);
}

.arch-inspector {
  background: var(--bg-card-subtle);
  border: 2px solid var(--card-border);
  border-radius: 12px;
  padding: 24px;
  position: sticky;
  top: 100px;
}

.inspector-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
  padding-bottom: 14px;
  border-bottom: 2px solid var(--card-border);
}

.inspector-title {
  font-size: 1.2rem;
  font-weight: 800;
  color: var(--vector-teal-dark);
}

.pinout-table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--font-code);
  font-size: 0.82rem;
  margin-top: 16px;
}

.pinout-table th, .pinout-table td {
  padding: 8px 10px;
  text-align: left;
  border-bottom: 1.5px solid var(--line-color);
}

.pinout-table th {
  color: var(--text-muted);
  text-transform: uppercase;
  font-weight: 700;
}

.pinout-table td {
  color: var(--text-heading);
}

/* Comfort Simulator Section */
.simulator-card {
  background: #ffffff;
  border: 2.5px solid var(--vector-teal);
  border-radius: var(--radius-card);
  padding: 32px;
  box-shadow: var(--shadow-card);
}

.sim-controls {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 20px;
  background: var(--bg-card-subtle);
  border: 2px solid var(--card-border);
  padding: 20px;
  border-radius: 10px;
  margin-bottom: 28px;
}

.sim-control-group label {
  display: flex;
  justify-content: space-between;
  font-size: 0.88rem;
  font-weight: 800;
  margin-bottom: 8px;
  color: var(--text-heading);
}

.sim-control-group label span {
  font-family: var(--font-code);
  color: var(--vector-teal);
}

.sim-control-group input[type="range"] {
  width: 100%;
  accent-color: var(--vector-teal);
  cursor: pointer;
}

.sim-chart-container {
  background: #ffffff;
  border: 2px solid var(--card-border);
  border-radius: 10px;
  padding: 20px;
  position: relative;
}

.sim-chart-legend {
  display: flex;
  gap: 24px;
  justify-content: center;
  margin-bottom: 16px;
  font-size: 0.88rem;
  font-weight: 800;
  color: var(--text-heading);
}

.legend-item {
  display: flex;
  align-items: center;
  gap: 8px;
}

.legend-color {
  width: 14px;
  height: 14px;
  border-radius: 4px;
}

canvas#simCanvas {
  width: 100%;
  height: 280px;
  display: block;
}

/* Comparison Table */
.comparison-wrapper {
  background: #ffffff;
  border: 2.5px solid var(--vector-teal);
  border-radius: var(--radius-card);
  overflow: hidden;
  box-shadow: var(--shadow-card);
}

table.tech-table {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
}

table.tech-table th, table.tech-table td {
  padding: 18px 24px;
  border-bottom: 1.5px solid var(--card-border);
}

table.tech-table th {
  background: var(--bg-card-subtle);
  font-family: var(--font-code);
  font-size: 0.85rem;
  text-transform: uppercase;
  color: var(--text-muted);
  letter-spacing: 0.05em;
  font-weight: 800;
}

table.tech-table th.acboss-header {
  background: var(--vector-teal-light);
  color: var(--vector-teal-dark);
  border-bottom: 3px solid var(--vector-teal);
}

table.tech-table td.acboss-cell {
  background: rgba(0, 137, 123, 0.06);
  font-weight: 800;
  color: var(--vector-teal-dark);
}

/* Hardware Breakdown Cards */
.hardware-cards-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 24px;
}

.hw-card {
  background: #ffffff;
  border: 2px solid var(--card-border);
  border-radius: var(--radius-card);
  padding: 28px;
  position: relative;
  transition: all 0.35s ease;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  box-shadow: var(--shadow-card);
  overflow: hidden;
}

.hw-card::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 5px;
  height: 100%;
  border-radius: var(--radius-card) 0 0 var(--radius-card);
  background: var(--vector-teal);
}

.hw-card:nth-child(2)::after { background: var(--vector-coral); }
.hw-card:nth-child(3)::after { background: var(--vector-yellow); }
.hw-card:nth-child(4)::after { background: var(--vector-green); }
.hw-card:nth-child(5)::after { background: #8b5cf6; }

.hw-card:hover {
  transform: translateY(-4px);
  border-color: var(--vector-teal);
  box-shadow: var(--shadow-hover);
}

.hw-card-badge {
  font-family: var(--font-code);
  font-size: 0.72rem;
  color: var(--text-muted);
  background: var(--bg-card-subtle);
  padding: 3px 8px;
  border-radius: 4px;
  display: inline-block;
  margin-bottom: 16px;
  border: 1px solid var(--card-border);
  font-weight: 800;
}

.hw-card h3 {
  font-size: 1.3rem;
  margin-bottom: 10px;
  color: var(--text-heading);
  font-weight: 800;
}

.hw-card p {
  color: var(--text-muted);
  font-size: 0.95rem;
  line-height: 1.6;
}

/* Pre-Order Section */
.preorder-card {
  background: #ffffff;
  border: 3px solid var(--vector-coral);
  border-radius: var(--radius-card);
  padding: 48px;
  max-width: 640px;
  margin: 0 auto;
  box-shadow: var(--shadow-hover);
  position: relative;
}

.preorder-card::before {
  content: 'EARLY_ACCESS_COHORT_01';
  position: absolute;
  top: -14px;
  left: 24px;
  background: var(--vector-coral);
  color: #ffffff;
  font-family: var(--font-code);
  font-weight: 800;
  font-size: 0.72rem;
  padding: 3px 12px;
  border-radius: 4px;
}

.notice-banner-tech {
  background: var(--vector-sand-light);
  border: 1.5px solid var(--vector-yellow);
  color: #b45309;
  padding: 14px 18px;
  border-radius: 8px;
  font-size: 0.9rem;
  margin-bottom: 28px;
  font-family: var(--font-code);
  font-weight: 700;
}

.form-group {
  margin-bottom: 20px;
}

.form-group label {
  display: block;
  font-family: var(--font-code);
  font-size: 0.82rem;
  text-transform: uppercase;
  color: var(--text-muted);
  margin-bottom: 8px;
  font-weight: 800;
}

.form-control {
  width: 100%;
  padding: 14px 18px;
  background: var(--bg-card-subtle);
  border: 2px solid var(--card-border);
  border-radius: 8px;
  font-family: var(--font-main);
  color: var(--text-heading);
  font-size: 1rem;
  transition: all 0.2s ease;
}

.form-control:focus {
  background: #ffffff;
  border-color: var(--vector-teal);
  box-shadow: 0 0 12px rgba(0, 137, 123, 0.2);
  outline: none;
}

.field-error {
  color: var(--vector-coral-dark);
  font-size: 0.85rem;
  margin-top: 4px;
  font-family: var(--font-code);
  font-weight: 700;
}

/* FAQ Accordion */
.faq-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

details.faq-item {
  background: #ffffff;
  border: 2.5px solid var(--card-border);
  border-radius: var(--radius-card);
  padding: 22px 28px;
  transition: all 0.2s ease;
  box-shadow: var(--shadow-card);
}

details.faq-item[open] {
  border-color: var(--vector-teal);
  background: #ffffff;
}

details.faq-item summary {
  font-weight: 800;
  font-size: 1.1rem;
  cursor: pointer;
  color: var(--text-heading);
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

details.faq-item summary::after {
  content: '+';
  font-family: var(--font-code);
  font-size: 1.3rem;
  color: var(--vector-teal);
}

details.faq-item[open] summary::after {
  content: '−';
  color: var(--vector-coral);
}

details.faq-item p {
  margin-top: 14px;
  color: var(--text-muted);
  line-height: 1.7;
}

/* Footer */
footer {
  border-top: 2px solid var(--card-border);
  padding: 48px 28px;
  text-align: center;
  color: var(--text-muted);
  font-size: 0.9rem;
  font-family: var(--font-code);
  background: #ffffff;
}

/* Responsive Rules */
@media (max-width: 960px) {
  .hero-section {
    grid-template-columns: 1fr;
    padding-top: 40px;
  }
  
  .hero-content h1 {
    font-size: 2.6rem;
  }

  .why-this-container {
    grid-template-columns: 1fr;
  }

  .why-solution-banner {
    grid-column: span 1;
    padding: 28px;
  }

  .carousel-wrapper {
    max-width: 100%;
  }

  .carousel-slide {
    grid-template-columns: 1fr;
  }

  .story-card-grid {
    grid-template-columns: 1fr;
  }

  .arch-layout {
    grid-template-columns: 1fr;
  }

  .arch-nodes-grid {
    grid-template-columns: 1fr;
  }
  
  .arch-inspector {
    position: static;
  }
}

/* 3-Step Setup Walkthrough Grid */
.setup-steps-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.setup-step-card {
  background: #ffffff;
  border: 2.5px solid var(--card-border);
  border-radius: var(--radius-card);
  padding: 32px 24px;
  position: relative;
  transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
  box-shadow: var(--shadow-card);
}

.setup-step-card:hover {
  transform: translateY(-6px);
  border-color: var(--vector-teal);
  box-shadow: var(--shadow-hover);
}

.setup-num-badge {
  display: inline-block;
  background: var(--vector-sand);
  border: 1.5px solid var(--vector-coral);
  color: var(--vector-coral-dark);
  font-family: var(--font-code);
  font-weight: 800;
  font-size: 0.8rem;
  padding: 4px 12px;
  border-radius: var(--radius-badge);
  margin-bottom: 16px;
}

.setup-step-card h3 {
  font-size: 1.25rem;
  font-weight: 800;
  color: var(--text-heading);
  margin-bottom: 10px;
}

.setup-step-card p {
  color: var(--text-muted);
  font-size: 0.95rem;
  line-height: 1.6;
}

@media (max-width: 960px) {
  .setup-steps-grid {
    grid-template-columns: 1fr;
  }
}


/* ACBOSS product story page */
.ac-product-page { --ac-ink:#20201f; --ac-muted:#676761; --ac-paper:#f7f6f2; --ac-surface:#e8e5de; --ac-line:#d7d4cd; --ac-coral:#d85f48; background:var(--ac-paper); color:var(--ac-ink); font-family:'DM Sans',sans-serif; line-height:1.5; }
.ac-product-page * { box-sizing:border-box; }
.ac-product-page h1,.ac-product-page h2,.ac-product-page h3,.ac-wordmark { font-family:'Manrope',sans-serif; }
.ac-product-page .header { display:none; }
.ac-nav { min-height:76px; padding:0 5vw; display:flex; align-items:center; justify-content:space-between; gap:28px; background:rgba(247,246,242,.94); border-bottom:1px solid var(--ac-line); position:sticky; top:0; z-index:10; backdrop-filter:blur(12px); }
.ac-wordmark { color:var(--ac-ink); font-weight:800; letter-spacing:-.075em; font-size:1.25rem; text-decoration:none; }
.ac-nav nav { display:flex; gap:24px; }
.ac-nav nav a,.ac-footer a { color:var(--ac-ink); font-size:.9rem; text-decoration:none; }
.ac-nav__cta,.ac-text-link { color:var(--ac-ink); border-bottom:1px solid currentColor; padding-bottom:2px; font-size:.88rem; font-weight:700; text-decoration:none; }
.ac-discord-link { display:inline-flex; align-items:center; justify-content:center; gap:.48rem; }
.ac-discord-link svg { width:1.05rem; height:1.05rem; flex:none; }
.ac-product-hero { min-height:min(760px,calc(100vh - 76px)); max-width:1440px; margin:auto; padding:clamp(64px,10vw,144px) 8vw; display:grid; grid-template-columns:.8fr 1.2fr; align-items:center; gap:clamp(36px,8vw,120px); }
.ac-eyebrow { color:var(--ac-coral); font-size:.72rem; letter-spacing:.14em; font-weight:700; margin:0 0 18px; }
.ac-product-hero h1 { max-width:620px; font-size:clamp(3rem,6vw,6.4rem); line-height:.98; letter-spacing:-.075em; margin:0; }
.ac-lede { max-width:450px; color:var(--ac-muted); font-size:1.15rem; margin:28px 0 34px; }
.ac-actions { display:flex; align-items:center; flex-wrap:wrap; gap:22px; }
.ac-button { display:inline-flex; align-items:center; justify-content:center; min-height:52px; padding:0 24px; border-radius:999px; font-weight:700; text-decoration:none; transition:transform .25s ease; }
.ac-button:hover { transform:translateY(-2px); }
.ac-button--dark { background:var(--ac-ink); color:var(--ac-paper); }
.ac-button--light { background:var(--ac-paper); color:var(--ac-ink); }
.ac-product-hero__visual { margin:0; overflow:hidden; background:#d6d2ca; }
.ac-product-hero__visual img { display:block; width:100%; min-height:470px; object-fit:cover; }
.ac-benefits,.ac-faq { padding:clamp(72px,9vw,132px) 8vw; border-top:1px solid var(--ac-line); }
.ac-benefits { background:#fbfaf7; }
.ac-section-intro { max-width:680px; margin-bottom:50px; }
.ac-section-intro h2,.ac-story h2,.ac-compatibility h2,.ac-interest h2 { font-size:clamp(2.25rem,4vw,4.4rem); line-height:1.02; letter-spacing:-.065em; margin:0; }
.ac-benefit-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--ac-line); }
.ac-benefit-grid article { min-height:250px; padding:28px 28px 10px 0; margin-right:28px; border-right:1px solid var(--ac-line); }
.ac-benefit-grid article:last-child { margin-right:0; border-right:0; }
.ac-benefit-grid span { color:var(--ac-coral); font-size:.78rem; font-weight:700; }
.ac-benefit-grid h3 { font-size:1.55rem; letter-spacing:-.05em; margin:58px 0 12px; }
.ac-benefit-grid p,.ac-story__copy p,.ac-compatibility p { color:var(--ac-muted); max-width:390px; }
.ac-story { min-height:660px; display:grid; grid-template-columns:1fr 1fr; align-items:center; }
.ac-story__copy { padding:clamp(64px,10vw,150px); }
.ac-story__copy h2 { margin-bottom:26px; }
.ac-story__copy .ac-caption { font-size:.82rem; margin-top:40px; }
.ac-story__image { margin:0; align-self:stretch; min-height:660px; background:#ddd9d0; overflow:hidden; }
.ac-story__image img { width:100%; height:100%; min-height:660px; object-fit:cover; display:block; }
.ac-story__image--product { padding:72px; display:grid; place-items:center; background:#e9e6df; }
.ac-story__image--product img { width:min(100%,430px); min-height:0; height:auto; object-fit:contain; }
.ac-story__image figcaption { align-self:end; color:var(--ac-muted); font-size:.78rem; }
.ac-story--mount { background:#fbfaf7; }
.ac-story--technology { color:#f5f2eb; background:#191919; }
.ac-story--technology .ac-story__copy p { color:#c5c0b7; }
.ac-story--technology .ac-eyebrow { color:#ef9d8c; }
.ac-story--technology .ac-story__image { background:#111; }
.ac-gallery { display:flex; flex-wrap:wrap; gap:10px; margin-top:34px; }
.ac-gallery button { width:86px; border:0; padding:0; background:none; cursor:pointer; color:var(--ac-muted); font:inherit; font-size:.74rem; text-align:left; }
.ac-gallery img { width:86px; height:68px; object-fit:cover; display:block; margin-bottom:6px; border:1px solid transparent; }
.ac-gallery button.active img,.ac-gallery button:focus-visible img { border-color:var(--ac-ink); }
.ac-compatibility { background:var(--ac-coral); color:#201e1c; padding:clamp(72px,9vw,130px) 8vw; display:flex; gap:48px; align-items:end; justify-content:space-between; }
.ac-compatibility p { color:rgba(32,30,28,.78); font-size:1.1rem; margin-bottom:0; }
.ac-compatibility .ac-eyebrow { color:#201e1c; }
.ac-details { max-width:1060px; padding:76px 6vw; margin:auto; }
.ac-details details,.ac-faq details { border-top:1px solid var(--ac-line); padding:22px 0; }
.ac-details details { border-bottom:1px solid var(--ac-line); }
.ac-details summary,.ac-faq summary { display:flex; justify-content:space-between; cursor:pointer; font-family:'Manrope',sans-serif; font-weight:700; list-style:none; }
.ac-details summary::-webkit-details-marker,.ac-faq summary::-webkit-details-marker { display:none; }
.ac-details details div { max-width:630px; color:var(--ac-muted); padding-top:18px; }
.ac-faq { background:var(--ac-surface); }
.ac-faq__list { border-top:1px solid var(--ac-line); max-width:920px; }
.ac-faq details { border-bottom:1px solid var(--ac-line); }
.ac-faq details p { max-width:620px; margin:18px 0 0; color:var(--ac-muted); }
.ac-interest { min-height:480px; padding:80px 8vw; display:grid; grid-template-columns:220px minmax(0,700px); gap:70px; align-items:center; background:#fbfaf7; }
.ac-interest img { width:180px; }
.ac-interest h2 { margin-bottom:28px; }
.ac-footer { border-top:1px solid var(--ac-line); padding:28px 5vw; display:flex; align-items:center; justify-content:space-between; gap:18px; color:var(--ac-muted); font-size:.82rem; }
.ac-footer p { margin:0; }
.ac-product-page :focus-visible { outline:3px solid var(--ac-coral); outline-offset:4px; }
@media (max-width:760px) {
  .ac-nav { min-height:64px; padding:0 24px; }.ac-nav nav { display:none; }.ac-nav__cta { font-size:.77rem; }
  .ac-product-hero,.ac-story { grid-template-columns:1fr; }.ac-product-hero { padding:72px 7vw 0; min-height:0; }.ac-product-hero__visual { margin-top:48px; }
  .ac-product-hero__visual img,.ac-story__image,.ac-story__image img { min-height:420px; }.ac-story--mount .ac-story__copy { order:1; }.ac-story--mount .ac-story__image { order:2; }
  .ac-story__copy { padding:78px 8vw; }.ac-benefit-grid { grid-template-columns:1fr; }.ac-benefit-grid article { min-height:auto; padding:28px 0; margin:0; border-right:0; border-bottom:1px solid var(--ac-line); }.ac-benefit-grid h3 { margin:28px 0 10px; }
  .ac-compatibility { display:block; }.ac-compatibility .ac-button { margin-top:32px; }.ac-interest { grid-template-columns:1fr; gap:34px; }.ac-interest img { width:140px; }.ac-footer { align-items:flex-start; flex-direction:column; }
}
@media (prefers-reduced-motion:reduce) { .ac-product-page *,.ac-product-page *::before,.ac-product-page *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; scroll-behavior:auto !important; transition-duration:.01ms !important; } }

/* Product evaluation path — detailed content in the calm product-page system */
.ac-product-page .evaluation-section {
  padding:clamp(76px,9vw,132px) 8vw;
  border-top:1px solid var(--ac-line);
  background:var(--ac-paper);
}
.ac-product-page #setup,.ac-product-page #architecture,.ac-product-page .evaluation-section--faq { background:#fbfaf7; }
.ac-product-page .evaluation-section .section-header { max-width:760px; margin:0 0 52px; text-align:left; }
.ac-product-page .evaluation-section .section-tag,.ac-product-page .why-card-badge,.ac-product-page .setup-num-badge {
  display:inline-block;
  margin:0 0 16px;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  color:var(--ac-coral);
  font-family:'DM Sans',sans-serif;
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.14em;
}
.ac-product-page .evaluation-section .section-title {
  margin:0 0 22px;
  color:var(--ac-ink);
  font-family:'Manrope',sans-serif;
  font-size:clamp(2.25rem,4vw,4.4rem);
  line-height:1.02;
  letter-spacing:-.065em;
}
.ac-product-page .evaluation-section .section-desc { max-width:650px; color:var(--ac-muted); font-size:1.08rem; line-height:1.65; }
.ac-product-page .why-this-container { gap:1px; background:var(--ac-line); }
.ac-product-page .why-this-card,.ac-product-page .setup-step-card,.ac-product-page .story-card-grid,.ac-product-page .architecture-container,.ac-product-page .arch-inspector,.ac-product-page .simulator-card,.ac-product-page .comparison-wrapper,.ac-product-page .faq-item {
  border:0;
  border-radius:0;
  background:#fbfaf7;
  box-shadow:none;
}
.ac-product-page .why-this-card { padding:clamp(28px,4vw,48px); }
.ac-product-page .why-this-card:hover,.ac-product-page .setup-step-card:hover,.ac-product-page .story-card-grid:hover { border-color:transparent; box-shadow:none; transform:none; }
.ac-product-page .why-this-card h3,.ac-product-page .setup-step-card h3,.ac-product-page .story-content h3,.ac-product-page .inspector-title {
  color:var(--ac-ink);
  font-family:'Manrope',sans-serif;
  letter-spacing:-.04em;
}
.ac-product-page .why-this-card p,.ac-product-page .setup-step-card p,.ac-product-page .story-content p,.ac-product-page .arch-inspector p { color:var(--ac-muted); font-family:'DM Sans',sans-serif; }
.ac-product-page .why-card-pill-row { border-color:var(--ac-line); }
.ac-product-page .why-pill-highlight,.ac-product-page .why-pill-alert,.ac-product-page .story-badge-pill {
  border:1px solid var(--ac-line);
  border-radius:999px;
  background:var(--ac-surface);
  color:var(--ac-ink);
  font-family:'DM Sans',sans-serif;
  font-size:.72rem;
  font-weight:700;
}
.ac-product-page .why-solution-banner {
  border:0;
  border-radius:0;
  background:var(--ac-ink);
  box-shadow:none;
}
.ac-product-page .why-solution-banner::before { display:none; }
.ac-product-page .why-solution-tag { padding:0; background:transparent; color:#ef9d8c; font-family:'DM Sans',sans-serif; letter-spacing:.12em; }
.ac-product-page .why-solution-banner h3 { font-family:'Manrope',sans-serif; letter-spacing:-.04em; }
.ac-product-page .why-solution-banner p,.ac-product-page .why-feature-item { color:#f7f6f2; font-family:'DM Sans',sans-serif; }
.ac-product-page .why-feature-item { border-color:rgba(247,246,242,.22); }
.ac-product-page .setup-steps-grid { gap:1px; background:var(--ac-line); }
.ac-product-page .setup-step-card { min-width:0; padding:clamp(28px,4vw,42px); }
.ac-product-page .evaluation-pills { display:flex; flex-wrap:wrap; gap:8px; margin-top:20px; }
.ac-product-page .evaluation-device-form { grid-template-columns:1fr 1.1fr; gap:clamp(30px,5vw,64px); margin-bottom:40px; padding:clamp(28px,5vw,56px); border:1px solid var(--ac-line); }
.ac-product-page .evaluation-device-form .vector-story-img { border:0; border-radius:0; box-shadow:none; }
.ac-product-page .evaluation-specs { padding-top:12px; border:0; }
.ac-product-page .architecture-container { padding:clamp(20px,4vw,42px); border:1px solid var(--ac-line); background:var(--ac-surface); }
.ac-product-page .arch-layout { min-width:0; gap:clamp(24px,4vw,48px); }
.ac-product-page .arch-nodes-grid { gap:1px; background:var(--ac-line); }
.ac-product-page .arch-node {
  width:100%;
  min-width:0;
  padding:22px;
  border:0;
  border-radius:0;
  background:#fbfaf7;
  box-shadow:none;
  color:var(--ac-ink);
  font:inherit;
  text-align:left;
}
.ac-product-page .arch-node:hover,.ac-product-page .arch-node.active { border-color:transparent; background:#f5d2c9; box-shadow:none; transform:none; }
.ac-product-page .arch-node.active::before { width:3px; background:var(--ac-coral); }
.ac-product-page .node-chip-header { display:block; }
.ac-product-page .node-pin { padding:0; border:0; background:transparent; color:var(--ac-coral); font-family:'DM Sans',sans-serif; letter-spacing:.08em; }
.ac-product-page .node-title,.ac-product-page .node-subtitle { display:block; }
.ac-product-page .node-title { font-family:'Manrope',sans-serif; letter-spacing:-.03em; }
.ac-product-page .node-subtitle { color:var(--ac-muted); font-family:'DM Sans',sans-serif; line-height:1.45; }
.ac-product-page .arch-inspector { min-width:0; top:96px; padding:clamp(22px,3vw,34px); border:1px solid var(--ac-line); }
.ac-product-page .arch-inspector > svg { display:block; width:100%; height:auto; margin-bottom:16px; }
.ac-product-page .inspector-header { border-color:var(--ac-line); }
.ac-product-page .inspector-subtitle { color:var(--ac-coral); font-size:.88rem; font-weight:700; }
.ac-product-page .inspector-label { margin:24px 0 10px; color:var(--ac-muted); font-family:'DM Sans',sans-serif; font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; }
.ac-product-page .ac-table-scroll { width:100%; min-width:0; max-width:100%; overflow-x:auto; }
.ac-product-page .ac-table-scroll,.ac-product-page .comparison-wrapper { scrollbar-color:var(--ac-coral) var(--ac-surface); }
.ac-product-page .pinout-table,.ac-product-page .tech-table { margin:0; background:#fbfaf7; font-family:'DM Sans',sans-serif; }
.ac-product-page .pinout-table th,.ac-product-page .pinout-table td,.ac-product-page .tech-table th,.ac-product-page .tech-table td { border-color:var(--ac-line); }
.ac-product-page .pinout-table th,.ac-product-page .tech-table th { color:var(--ac-muted); background:var(--ac-surface); }
.ac-product-page .pinout-table td { color:var(--ac-ink); }
.ac-product-page .simulator-card { padding:clamp(22px,4vw,40px); border:1px solid var(--ac-line); }
.ac-product-page .sim-controls,.ac-product-page .sim-chart-container { border:1px solid var(--ac-line); border-radius:0; background:var(--ac-surface); }
.ac-product-page .sim-control-group label,.ac-product-page .sim-chart-legend { color:var(--ac-ink); font-family:'DM Sans',sans-serif; }
.ac-product-page .sim-control-group label span { color:var(--ac-coral); font-family:'DM Sans',sans-serif; }
.ac-product-page .sim-control-group input[type="range"] { accent-color:var(--ac-coral); }
.ac-product-page .legend-color--traditional { background:#d85f48; }
.ac-product-page .legend-color--acboss { background:#4f7770; }
.ac-product-page .comparison-wrapper { overflow-x:auto; border:1px solid var(--ac-line); }
.ac-product-page .tech-table th.acboss-header,.ac-product-page .tech-table td.acboss-cell { background:#f5d2c9; color:#742c21; border-color:var(--ac-coral); }
.ac-product-page .faq-list { max-width:920px; gap:0; border-top:1px solid var(--ac-line); }
.ac-product-page details.faq-item { padding:24px 0; border-bottom:1px solid var(--ac-line); }
.ac-product-page details.faq-item[open] { background:transparent; border-color:var(--ac-line); }
.ac-product-page details.faq-item summary { color:var(--ac-ink); font-family:'Manrope',sans-serif; }
.ac-product-page details.faq-item summary::after { color:var(--ac-coral); }
.ac-product-page details.faq-item p { max-width:680px; color:var(--ac-muted); }
.ac-product-page .ac-enquiry p:not(.ac-eyebrow) { max-width:620px; margin:0 0 30px; color:var(--ac-muted); font-size:1.05rem; }

@media (max-width:960px) {
  .ac-product-page .arch-layout,.ac-product-page .evaluation-device-form { grid-template-columns:1fr; }
  .ac-product-page .arch-inspector { position:static; }
}
@media (max-width:760px) {
  .ac-product-page .evaluation-section { padding:72px 7vw; }
  .ac-product-page .why-this-container,.ac-product-page .arch-nodes-grid { grid-template-columns:1fr; }
  .ac-product-page .why-solution-banner { grid-column:span 1; padding:32px 26px; }
  .ac-product-page .why-solution-features,.ac-product-page .sim-chart-legend { align-items:flex-start; flex-direction:column; gap:12px; }
  .ac-product-page .architecture-container { padding:14px; }
  .ac-product-page .simulator-card,.ac-product-page .sim-chart-container { padding:16px; }
  .ac-product-page .ac-table-scroll,.ac-product-page .comparison-wrapper { overflow-x:auto; overscroll-behavior-inline:contain; }
  .ac-product-page .pinout-table { min-width:600px; }
  .ac-product-page .comparison-wrapper table { min-width:720px; }
}

/* ACBOSS homepage — warm editorial companion to the product story */
body:has(.ac-home-hero) {
  --ac-home-ink:#20201f;
  --ac-home-muted:#676761;
  --ac-home-paper:#f7f6f2;
  --ac-home-surface:#e8e5de;
  --ac-home-line:#d7d4cd;
  --ac-home-coral:#d85f48;
  --ac-home-coral-ink:#9b3829;
  background:var(--ac-home-paper);
  background-image:none;
  color:var(--ac-home-ink);
}
.header:has(+ main .ac-home-hero) { background:rgba(247,246,242,.94); border-bottom:1px solid var(--ac-home-line); box-shadow:none; }
.header:has(+ main .ac-home-hero):hover { box-shadow:none; }
.header:has(+ main .ac-home-hero) .nav-container { max-width:1440px; padding:22px 5vw; }
.header:has(+ main .ac-home-hero) .brand-logo { color:var(--ac-home-ink); font-size:1.2rem; letter-spacing:-.075em; }
.header:has(+ main .ac-home-hero) .brand-logo:hover { transform:none; }
.header:has(+ main .ac-home-hero) .nav-links { gap:24px; }
.header:has(+ main .ac-home-hero) .nav-links a { color:var(--ac-home-ink); font-size:.86rem; font-weight:600; }
.header:has(+ main .ac-home-hero) .nav-links a::after { display:none; }
.header:has(+ main .ac-home-hero) .nav-links a:hover { color:var(--ac-home-coral); }
body:has(.ac-home-hero) :focus-visible { outline:3px solid var(--ac-home-coral-ink); outline-offset:4px; }

.ac-home-hero,.ac-home-benefits,.ac-home-story,.ac-home-details,.ac-home-faq,.ac-home-interest { font-family:var(--font-main); }
.ac-home-hero h1,.ac-home-benefits h2,.ac-home-story h2,.ac-home-details h2,.ac-home-faq h2,.ac-home-interest h2 { color:var(--ac-home-ink); font-size:clamp(2.5rem,5vw,5.6rem); font-weight:800; letter-spacing:-.075em; line-height:.98; }
.ac-home-hero { max-width:1440px; min-height:min(760px,calc(100vh - 76px)); margin:auto; padding:clamp(64px,10vw,144px) 8vw; display:grid; grid-template-columns:.8fr 1.2fr; align-items:center; gap:clamp(36px,8vw,120px); }
.ac-home-hero > div > p:first-child { color:var(--ac-home-coral-ink); font-size:.72rem; font-weight:800; letter-spacing:.14em; margin:0 0 18px; }
.ac-home-hero h1 { max-width:620px; margin:0; }
.ac-home-hero h1 + p { max-width:430px; margin:28px 0 34px; color:var(--ac-home-muted); font-size:1.1rem; }
.ac-home-hero a,.ac-home-interest a { display:inline-flex; min-height:50px; align-items:center; justify-content:center; padding:0 24px; border-radius:999px; background:var(--ac-home-ink); color:var(--ac-home-paper); font-size:.88rem; font-weight:700; text-decoration:none; transition:transform .25s ease,background-color .25s ease; }
.ac-home-hero a:hover,.ac-home-interest a:hover { background:var(--ac-home-coral); transform:translateY(-2px); }
.ac-home-hero figure { margin:0; overflow:hidden; background:#d6d2ca; }
.ac-home-hero figure img { display:block; width:100%; min-height:470px; object-fit:cover; }
.ac-home-hero figcaption,.ac-home-story figcaption { color:var(--ac-home-muted); font-size:.78rem; padding:12px 16px; }

.ac-home-benefits,.ac-home-faq { padding:clamp(72px,9vw,132px) 8vw; border-top:1px solid var(--ac-home-line); }
.ac-home-benefits { background:#fbfaf7; }
.ac-home-benefits h2 { max-width:650px; margin:0 0 50px; }
.ac-home-benefits ul { display:grid; grid-template-columns:repeat(3,1fr); list-style:none; border-top:1px solid var(--ac-home-line); }
.ac-home-benefits li { min-height:190px; margin-right:28px; padding:28px 28px 20px 0; border-right:1px solid var(--ac-home-line); color:var(--ac-home-muted); font-size:1.05rem; line-height:1.45; }
.ac-home-benefits li:last-child { margin-right:0; border-right:0; }
.ac-home-benefits li::before { content:'0' counter(ac-home-benefit); counter-increment:ac-home-benefit; display:block; margin-bottom:54px; color:var(--ac-home-coral-ink); font-size:.78rem; font-weight:800; }
.ac-home-benefits ul { counter-reset:ac-home-benefit; }

.ac-home-story { display:grid; grid-template-columns:1fr 1fr; min-height:660px; align-items:center; background:var(--ac-home-paper); }
.ac-home-story > div { padding:clamp(64px,10vw,150px); }
.ac-home-story h2 { margin:0 0 26px; }
.ac-home-story p { max-width:400px; color:var(--ac-home-muted); }
.ac-home-story figure { min-height:660px; height:100%; margin:0; overflow:hidden; background:#ddd9d0; }
.ac-home-story figure img { display:block; width:100%; height:100%; min-height:660px; object-fit:cover; }
.ac-home-story:nth-of-type(4) { background:#fbfaf7; }
.ac-home-story:nth-of-type(4) > div { order:2; }
.ac-home-story:nth-of-type(4) figure { order:1; }
.ac-home-story--dark { background:#191919; color:#f5f2eb; }
.ac-home-story--dark h2 { color:#f5f2eb; }
.ac-home-story--dark p,.ac-home-story--dark figcaption { color:#c5c0b7; }
.ac-home-story--dark figure { background:#111; }

.ac-home-details { padding:clamp(72px,9vw,132px) 8vw; border-top:1px solid var(--ac-home-line); background:var(--ac-home-surface); }
.ac-home-details h2 { max-width:660px; margin:0 0 48px; }
.ac-home-details > div { display:grid; grid-template-columns:minmax(240px,.8fr) minmax(0,1.2fr); gap:clamp(36px,8vw,120px); align-items:center; border-top:1px solid var(--ac-home-line); padding-top:40px; }
.ac-home-details img { display:block; width:min(100%,380px); margin:auto; }
.ac-home-details details,.ac-home-faq details { border-bottom:1px solid var(--ac-home-line); padding:22px 0; }
.ac-home-details summary,.ac-home-faq summary { cursor:pointer; font-weight:700; list-style:none; }
.ac-home-details summary::-webkit-details-marker,.ac-home-faq summary::-webkit-details-marker { display:none; }
.ac-home-details details p,.ac-home-faq details p { max-width:620px; margin:18px 0 0; color:var(--ac-home-muted); }

.ac-home-faq { background:#fbfaf7; }
.ac-home-faq h2 { max-width:680px; margin:0 0 50px; }
.ac-home-faq details { max-width:920px; border-top:1px solid var(--ac-home-line); }
.ac-home-faq details + details { border-top:0; }
.ac-home-interest { min-height:440px; padding:clamp(72px,9vw,132px) 8vw; background:var(--ac-home-coral); }
.ac-home-interest h2 { max-width:680px; margin:0 0 24px; color:#201e1c; }
.ac-home-interest p { max-width:480px; margin:0 0 32px; color:#1b1917; font-size:1.08rem; }
.ac-home-interest a { background:#201e1c; }
.ac-home-interest a:hover { background:#f7f6f2; color:#201e1c; }
body:has(.ac-home-hero) footer { padding:28px 5vw; border-top:1px solid var(--ac-home-line); background:var(--ac-home-paper); color:var(--ac-home-muted); font-size:.82rem; }

@media (max-width:760px) {
  .header:has(+ main .ac-home-hero) .nav-container { min-height:64px; padding:0 24px; }.header:has(+ main .ac-home-hero) .nav-links { display:none; }
  .ac-home-hero,.ac-home-story,.ac-home-details > div { grid-template-columns:1fr; }.ac-home-hero { min-height:0; padding:72px 7vw 0; }.ac-home-hero figure { margin-top:48px; }
  .ac-home-hero figure img,.ac-home-story figure,.ac-home-story figure img { min-height:420px; }.ac-home-story > div { padding:78px 8vw; }.ac-home-story:nth-of-type(4) > div { order:1; }.ac-home-story:nth-of-type(4) figure { order:2; }
  .ac-home-benefits ul { grid-template-columns:1fr; }.ac-home-benefits li { min-height:auto; margin:0; padding:28px 0; border-right:0; border-bottom:1px solid var(--ac-home-line); }.ac-home-benefits li::before { margin-bottom:24px; }
  .ac-home-details > div { gap:36px; }.ac-home-details img { width:min(100%,300px); }
}
@media (prefers-reduced-motion:reduce) { body:has(.ac-home-hero) *,body:has(.ac-home-hero) *::before,body:has(.ac-home-hero) *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; scroll-behavior:auto !important; transition-duration:.01ms !important; } }

/* Restored homepage content — retain the original product research in the editorial theme. */
.ac-home-page .section { padding:clamp(72px,9vw,132px) 8vw; background:var(--ac-home-paper); border-top:1px solid var(--ac-home-line); }
.ac-home-page .section:nth-of-type(even) { background:#fbfaf7; }
.ac-home-page .section-header { max-width:700px; margin:0 0 52px; }
.ac-home-page .section-tag,.ac-home-page .why-card-badge,.ac-home-page .setup-num-badge,.ac-home-page .node-chip-header { color:var(--ac-home-coral-ink); background:transparent; border-color:var(--ac-home-coral-ink); font-family:var(--font-main); letter-spacing:.1em; }
.ac-home-page .section-title { color:var(--ac-home-ink); font-family:var(--font-main); font-size:clamp(2.35rem,4.8vw,5rem); letter-spacing:-.07em; line-height:1; }
.ac-home-page .section-desc,.ac-home-page .why-this-card p,.ac-home-page .setup-step-card p,.ac-home-page .carousel-content p,.ac-home-page .arch-inspector p { color:var(--ac-home-muted); font-family:var(--font-main); }
.ac-home-page .why-this-card,.ac-home-page .setup-step-card,.ac-home-page .hw-card,.ac-home-page .arch-inspector,.ac-home-page .simulator-card,.ac-home-page .preorder-card,.ac-home-page .faq-item { background:#fbfaf7; border:1px solid var(--ac-home-line); border-radius:0; box-shadow:none; }
.ac-home-page .why-this-card:hover,.ac-home-page .setup-step-card:hover,.ac-home-page .hw-card:hover { border-color:var(--ac-home-ink); box-shadow:none; transform:none; }
.ac-home-page .why-this-card h3,.ac-home-page .setup-step-card h3,.ac-home-page .carousel-content h3,.ac-home-page .arch-inspector h3,.ac-home-page .preorder-card h3 { color:var(--ac-home-ink); font-family:var(--font-main); letter-spacing:-.04em; }
.ac-home-page .why-solution-banner { background:var(--ac-home-ink); border:0; border-radius:0; box-shadow:none; }
.ac-home-page .why-solution-banner h3,.ac-home-page .why-solution-banner p,.ac-home-page .why-solution-banner span { color:#f7f6f2; }
.ac-home-page .why-solution-tag { color:#ef9d8c; }
.ac-home-page .why-feature-item { border-color:rgba(247,246,242,.22); }
.ac-home-page .why-pill-highlight,.ac-home-page .why-pill-alert,.ac-home-page .story-badge-pill { border-radius:999px; font-family:var(--font-main); font-weight:700; }
.ac-home-page .why-pill-highlight { color:var(--ac-home-ink); background:#e8e5de; border-color:#d7d4cd; }
.ac-home-page .why-pill-alert { color:#742c21; background:#f5d2c9; border-color:#d85f48; }
.ac-home-page .carousel-wrapper,.ac-home-page .comparison-wrapper { border:1px solid var(--ac-home-line); border-radius:0; box-shadow:none; background:#fbfaf7; }
.ac-home-page .carousel-content { background:#fbfaf7; }
.ac-home-page .carousel-btn,.ac-home-page .carousel-dot { border-color:var(--ac-home-line); }
.ac-home-page .carousel-btn:hover,.ac-home-page .carousel-dot.active { background:var(--ac-home-ink); border-color:var(--ac-home-ink); }
.ac-home-page .architecture-container,.ac-home-page .simulator-card { background:#e8e5de; border-color:var(--ac-home-line); }
.ac-home-page .arch-node { background:#fbfaf7; border-color:var(--ac-home-line); box-shadow:none; }
.ac-home-page .arch-node.active,.ac-home-page .arch-node:hover { border-color:var(--ac-home-coral); background:#f5d2c9; transform:none; }
.ac-home-page .node-title,.ac-home-page .inspector-title,.ac-home-page .comparison-wrapper th,.ac-home-page .comparison-wrapper td { color:var(--ac-home-ink); font-family:var(--font-main); }
.ac-home-page .node-subtitle,.ac-home-page .comparison-wrapper td { color:var(--ac-home-muted); }
.ac-home-page .comparison-wrapper table,.ac-home-page .pinout-table,.ac-home-page .tech-table { background:#fbfaf7; }
.ac-home-page .comparison-wrapper th,.ac-home-page .comparison-wrapper td,.ac-home-page .pinout-table td,.ac-home-page .pinout-table th,.ac-home-page .tech-table td,.ac-home-page .tech-table th { border-color:var(--ac-home-line); }
.ac-home-page .sim-chart-container { background:#fbfaf7; border-color:var(--ac-home-line); }
.ac-home-page input[type="range"] { accent-color:var(--ac-home-coral); }
.ac-home-page .preorder-card { max-width:760px; padding:clamp(34px,6vw,64px); }
.ac-home-page .form-control { border-color:var(--ac-home-line); border-radius:0; background:#fff; color:var(--ac-home-ink); font-family:var(--font-main); }
.ac-home-page .form-control:focus { border-color:var(--ac-home-coral-ink); box-shadow:0 0 0 3px rgba(155,56,41,.14); }
.ac-home-page .btn.btn-coral,.ac-home-page .btn.btn-teal { background:var(--ac-home-ink); border-color:var(--ac-home-ink); color:var(--ac-home-paper); border-radius:999px; box-shadow:none; font-family:var(--font-main); }
.ac-home-page .btn.btn-coral:hover,.ac-home-page .btn.btn-teal:hover { background:var(--ac-home-coral); border-color:var(--ac-home-coral); transform:translateY(-2px); }
.ac-home-page .faq-item { padding:0; overflow:hidden; }
.ac-home-page .faq-question { color:var(--ac-home-ink); font-family:var(--font-main); }
.ac-home-page .faq-answer { color:var(--ac-home-muted); }
@media (max-width:760px) { .ac-home-page .section { padding-left:7vw; padding-right:7vw; }.ac-home-page .comparison-wrapper { overflow-x:auto; }.ac-home-page .comparison-wrapper table { min-width:720px; } }