/* ==========================================================================
   AI Orchestration - Product Catalog & Gallery Stylesheet
   Applies strictly to:
   - #selected-works .aio-work-domain
   - .aio-product-gallery
   - .aio-product-catalog
   - .aio-product-detail
   ========================================================================== */

/* --------------------------------------------------------------------------
   0. Home Selected Works Domain Labels
   -------------------------------------------------------------------------- */
#selected-works .aio-work-domain {
  display: inline-block;
  font-family: var(--font-mono, monospace);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--accent, #0969da);
  background: var(--accent-light, #e6f0fc);
  padding: 0.15rem 0.5rem;
  border-radius: var(--radius-sm, 4px);
  border: 1px solid var(--border-blueprint, #bfdbfe);
  margin-right: 0.4rem;
  vertical-align: middle;
}

#selected-works .work-header-subtitle {
  font-size: 0.95rem;
  color: var(--text-secondary, #334155);
  margin-top: 0.5rem;
  margin-bottom: 0;
  line-height: 1.6;
}

/* --------------------------------------------------------------------------
   1. Shared Product Card (.aio-product-card)
   -------------------------------------------------------------------------- */
:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-product-card {
  display: flex;
  flex-direction: column;
  background: var(--bg-surface, #ffffff);
  border: 1px solid var(--border-subtle, #e2e8f0);
  border-radius: var(--radius-md, 8px);
  overflow: hidden;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
  height: 100%;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-product-card:hover {
  border-color: var(--border-blueprint, #bfdbfe);
  box-shadow: 0 4px 16px -2px rgba(15, 23, 42, 0.06);
  transform: translateY(-2px);
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-card-visual-link {
  display: block;
  position: relative;
  aspect-ratio: 16 / 10;
  background: var(--bg-subtle, #f8fafc);
  overflow: hidden;
  border-bottom: 1px solid var(--border-light, #edf2f7);
  text-decoration: none;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-card-visual-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.3s ease;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-product-card:hover .aio-card-visual-img {
  transform: scale(1.02);
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-card-body {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  padding: 1.25rem 1.25rem 1.5rem;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-card-meta {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
  margin-bottom: 0.65rem;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-card-cat {
  font-family: var(--font-mono, monospace);
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--accent, #0969da);
  letter-spacing: 0.05em;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-card-sep {
  color: var(--border-medium, #cbd5e1);
  font-size: 0.75rem;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-card-stage {
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--text-muted, #62748d);
  background: var(--bg-subtle, #f8fafc);
  padding: 0.1rem 0.45rem;
  border-radius: var(--radius-sm, 4px);
  border: 1px solid var(--border-light, #edf2f7);
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-card-title {
  font-size: 1.15rem;
  font-weight: 700;
  line-height: 1.35;
  color: var(--text-main, #0c1523);
  margin: 0 0 0.5rem;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-card-title a {
  color: inherit;
  text-decoration: none;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-card-title a:hover {
  color: var(--accent, #0969da);
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-card-tagline {
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--text-secondary, #334155);
  margin: 0 0 0.5rem;
  line-height: 1.5;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-card-summary {
  font-size: 0.85rem;
  color: var(--text-muted, #62748d);
  line-height: 1.6;
  margin: 0 0 1rem;
  flex-grow: 1;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-card-details {
  border-top: 1px solid var(--border-light, #edf2f7);
  padding-top: 0.85rem;
  margin-bottom: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  font-size: 0.8rem;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-card-meta-row {
  display: flex;
  gap: 0.4rem;
  line-height: 1.45;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-card-meta-key {
  color: var(--text-muted, #62748d);
  font-weight: 600;
  flex-shrink: 0;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-card-meta-val {
  color: var(--text-secondary, #334155);
  word-break: break-word;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-card-meta-val a {
  color: var(--text-secondary, #334155);
  text-decoration: underline;
  text-underline-offset: 2px;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-card-meta-val a:hover {
  color: var(--accent, #0969da);
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-card-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-top: auto;
  padding-top: 0.75rem;
  border-top: 1px dashed var(--border-light, #edf2f7);
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-card-primary-link {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--accent, #0969da);
  text-decoration: none;
  transition: color 0.15s ease, transform 0.15s ease;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-card-primary-link:hover {
  color: var(--accent-deep, #054da3);
  transform: translateX(2px);
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-card-ext-link {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.78rem;
  color: var(--text-muted, #62748d);
  text-decoration: none;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-card-ext-link:hover {
  color: var(--accent, #0969da);
  text-decoration: underline;
}

/* --------------------------------------------------------------------------
   2. Home Gallery (.aio-product-gallery)
   -------------------------------------------------------------------------- */
.aio-product-gallery {
  margin-top: 3.5rem;
  padding-top: 2.5rem;
  border-top: 1px solid var(--border-subtle, #e2e8f0);
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-gallery-header-bar {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1.5rem;
  margin-bottom: 0.75rem;
  flex-wrap: wrap;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-gallery-heading-group {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-gallery-label {
  font-family: var(--font-mono, monospace);
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--accent, #0969da);
  letter-spacing: 0.08em;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-gallery-title {
  font-size: 1.45rem;
  font-weight: 700;
  color: var(--text-main, #0c1523);
  margin: 0;
  line-height: 1.3;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-gallery-lead {
  font-size: 0.92rem;
  color: var(--text-secondary, #334155);
  margin: 0 0 1.5rem;
  line-height: 1.6;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-gallery-controls {
  display: flex;
  align-items: center;
  gap: 1rem;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-gallery-all-link {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--text-secondary, #334155);
  text-decoration: none;
  transition: color 0.15s ease;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-gallery-all-link:hover {
  color: var(--accent, #0969da);
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-gallery-nav-btns {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-gallery-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid var(--border-medium, #cbd5e1);
  background: var(--bg-surface, #ffffff);
  color: var(--text-main, #0c1523);
  cursor: pointer;
  transition: background-color 0.15s ease, border-color 0.15s ease, opacity 0.15s ease;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-gallery-btn:hover:not(:disabled) {
  border-color: var(--accent, #0969da);
  background: var(--bg-subtle, #f8fafc);
  color: var(--accent, #0969da);
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-gallery-btn:disabled {
  opacity: 0.35;
  cursor: not-allowed;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-gallery-track-container {
  position: relative;
  width: 100%;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-gallery-track {
  display: flex;
  gap: 1.5rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  padding: 0.5rem 0.25rem 1.5rem;
  scrollbar-width: thin;
  scrollbar-color: var(--border-medium, #cbd5e1) transparent;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-gallery-track::-webkit-scrollbar {
  height: 6px;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-gallery-track::-webkit-scrollbar-track {
  background: transparent;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-gallery-track::-webkit-scrollbar-thumb {
  background: var(--border-medium, #cbd5e1);
  border-radius: 3px;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-gallery-track .aio-product-card {
  scroll-snap-align: start;
  flex: 0 0 calc((100% - 3rem) / 3);
  min-width: 280px;
}

@media (max-width: 1024px) {
  :is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-gallery-track .aio-product-card {
    flex: 0 0 calc((100% - 1.5rem) / 2);
  }
}

@media (max-width: 640px) {
  :is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-gallery-track .aio-product-card {
    flex: 0 0 84%;
    min-width: 0;
  }
  :is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-gallery-title {
    font-size: 1.25rem;
  }
  :is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-gallery-controls {
    width: 100%;
    justify-content: space-between;
  }
}

/* --------------------------------------------------------------------------
   3. Products Page Catalog Grid (.aio-product-catalog)
   -------------------------------------------------------------------------- */
.aio-product-catalog {
  margin-bottom: 4rem;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-catalog-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.75rem;
  align-items: stretch;
}

@media (max-width: 1024px) {
  :is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-catalog-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 640px) {
  :is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-catalog-grid {
    grid-template-columns: 1fr;
    gap: 1.25rem;
  }
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-infra-callout {
  margin-top: 2.5rem;
  background: var(--bg-subtle, #f8fafc);
  border: 1px dashed var(--border-blueprint, #bfdbfe);
  border-radius: var(--radius-md, 8px);
  padding: 1.75rem 2rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  flex-wrap: wrap;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-infra-callout-text h2 {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--text-main, #0c1523);
  margin: 0 0 0.35rem;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-infra-callout-text p {
  font-size: 0.88rem;
  color: var(--text-secondary, #334155);
  margin: 0;
  line-height: 1.6;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-infra-callout-link {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.65rem 1.25rem;
  background: var(--bg-surface, #ffffff);
  border: 1px solid var(--border-medium, #cbd5e1);
  border-radius: var(--radius-sm, 4px);
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--accent, #0969da);
  text-decoration: none;
  white-space: nowrap;
  transition: all 0.15s ease;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-infra-callout-link:hover {
  background: var(--accent, #0969da);
  color: #ffffff;
  border-color: var(--accent, #0969da);
}

/* --------------------------------------------------------------------------
   4. Product Detail Simple Template (.aio-product-detail)
   -------------------------------------------------------------------------- */
.aio-product-detail {
  padding-top: 4.5rem;
  padding-bottom: 5rem;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-detail-hero {
  margin-bottom: 3rem;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-detail-header {
  margin-bottom: 2rem;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-detail-meta {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  margin-bottom: 1rem;
  flex-wrap: wrap;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-detail-title {
  font-size: clamp(2rem, 3.5vw, 2.75rem);
  font-weight: 800;
  color: var(--text-main, #0c1523);
  line-height: 1.25;
  margin: 0 0 1rem;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-detail-tagline {
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--accent-deep, #054da3);
  margin: 0 0 1rem;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-detail-visual-box {
  border: 1px solid var(--border-subtle, #e2e8f0);
  border-radius: var(--radius-md, 8px);
  overflow: hidden;
  background: var(--bg-subtle, #f8fafc);
  aspect-ratio: 16 / 10;
  max-width: 960px;
  margin: 0 auto 3rem;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-detail-visual-box img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-detail-content-grid {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 3.5rem;
  align-items: start;
}

@media (max-width: 900px) {
  :is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-detail-content-grid {
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-detail-main-col h3 {
  font-size: 1.35rem;
  font-weight: 700;
  color: var(--text-main, #0c1523);
  margin: 2rem 0 1rem;
  border-bottom: 2px solid var(--border-subtle, #e2e8f0);
  padding-bottom: 0.5rem;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-detail-main-col h3:first-of-type {
  margin-top: 0;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-detail-desc {
  font-size: 1rem;
  line-height: 1.8;
  color: var(--text-secondary, #334155);
  margin-bottom: 1.5rem;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-detail-usecase-list {
  padding-left: 1.25rem;
  margin: 0 0 2rem;
  line-height: 1.75;
  color: var(--text-secondary, #334155);
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-detail-usecase-list li {
  margin-bottom: 0.6rem;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-detail-side-col {
  background: var(--bg-subtle, #f8fafc);
  border: 1px solid var(--border-subtle, #e2e8f0);
  border-radius: var(--radius-md, 8px);
  padding: 1.75rem;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-detail-side-box h4 {
  font-size: 1rem;
  font-weight: 700;
  color: var(--text-main, #0c1523);
  margin: 0 0 1rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid var(--border-medium, #cbd5e1);
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-detail-spec-list {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  font-size: 0.88rem;
  margin-bottom: 1.5rem;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-detail-spec-item dt {
  font-weight: 700;
  color: var(--text-muted, #62748d);
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 0.25rem;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-detail-spec-item dd {
  margin: 0;
  color: var(--text-main, #0c1523);
  line-height: 1.5;
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-detail-actions {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  margin-top: 1.5rem;
}

/* Feature Grid & Process Flow in Product Detail */
.aio-product-detail .aio-detail-workflow {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  margin: 1.75rem 0 2.5rem;
}

@media (max-width: 900px) {
  .aio-product-detail .aio-detail-workflow {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 520px) {
  .aio-product-detail .aio-detail-workflow {
    grid-template-columns: 1fr;
  }
}

.aio-product-detail .aio-workflow-step {
  background: var(--bg-surface, #ffffff);
  border: 1px solid var(--border-subtle, #e2e8f0);
  border-top: 3px solid var(--accent, #0969da);
  border-radius: var(--radius-sm, 4px);
  padding: 1.15rem 1rem;
}

.aio-product-detail .aio-step-num {
  font-family: var(--font-mono, monospace);
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--accent, #0969da);
  letter-spacing: 0.06em;
  margin-bottom: 0.25rem;
}

.aio-product-detail .aio-step-title {
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--text-main, #0c1523);
  margin: 0 0 0.4rem;
}

.aio-product-detail .aio-step-desc {
  font-size: 0.82rem;
  color: var(--text-secondary, #334155);
  line-height: 1.55;
  margin: 0;
}

.aio-product-detail .aio-pillar-card {
  background: var(--bg-surface, #ffffff);
  border: 1px solid var(--border-subtle, #e2e8f0);
  border-radius: var(--radius-md, 8px);
  padding: 1.75rem;
  margin-bottom: 2rem;
}

.aio-product-detail .aio-pillar-header {
  margin-bottom: 1.25rem;
  border-bottom: 1px solid var(--border-light, #edf2f7);
  padding-bottom: 0.85rem;
}

.aio-product-detail .aio-pillar-num {
  font-family: var(--font-mono, monospace);
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--accent, #0969da);
  letter-spacing: 0.08em;
  margin-bottom: 0.25rem;
}

.aio-product-detail .aio-pillar-title {
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--text-main, #0c1523);
  margin: 0 0 0.35rem;
}

.aio-product-detail .aio-pillar-lead {
  font-size: 0.9rem;
  color: var(--text-secondary, #334155);
  margin: 0;
  line-height: 1.6;
}

.aio-product-detail .aio-feature-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem;
}

@media (max-width: 680px) {
  .aio-product-detail .aio-feature-grid {
    grid-template-columns: 1fr;
  }
}

.aio-product-detail .aio-feature-item {
  background: var(--bg-subtle, #f8fafc);
  border: 1px solid var(--border-light, #edf2f7);
  border-radius: var(--radius-sm, 4px);
  padding: 1.1rem;
}

.aio-product-detail .aio-feature-item-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.4rem;
}

.aio-product-detail .aio-feature-item-title {
  font-size: 0.92rem;
  font-weight: 700;
  color: var(--text-main, #0c1523);
  margin: 0;
}

.aio-product-detail .aio-feature-item-badge {
  font-family: var(--font-mono, monospace);
  font-size: 0.68rem;
  font-weight: 600;
  color: var(--accent, #0969da);
  background: var(--accent-light, #e6f0fc);
  padding: 0.1rem 0.4rem;
  border-radius: 3px;
  white-space: nowrap;
}

.aio-product-detail .aio-feature-item-desc {
  font-size: 0.82rem;
  color: var(--text-muted, #62748d);
  line-height: 1.55;
  margin: 0;
}

/* --------------------------------------------------------------------------
   5. Accessibility & Reduced Motion
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  :is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-product-card,
  :is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-card-visual-img,
  :is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-card-primary-link,
  :is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-infra-callout-link,
  :is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-gallery-track {
    transition: none !important;
    scroll-behavior: auto !important;
    transform: none !important;
  }
}

:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-gallery-btn:focus-visible,
:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-card-primary-link:focus-visible,
:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-card-ext-link:focus-visible,
:is(.aio-product-gallery, .aio-product-catalog, .aio-product-detail) .aio-infra-callout-link:focus-visible {
  outline: 2px solid var(--accent, #0969da);
  outline-offset: 2px;
}

/* Editorial cards retain the open, image-led layout of selected works. */
:is(.aio-product-gallery, .aio-product-catalog) .aio-product-card { border: 0; border-radius: 0; box-shadow: none; transform: none; }
:is(.aio-product-gallery, .aio-product-catalog) .aio-product-card:hover { box-shadow: none; transform: none; }
:is(.aio-product-gallery, .aio-product-catalog) .aio-card-body { padding: 1.25rem 0 0; }
:is(.aio-product-gallery, .aio-product-catalog) a:focus-visible, .aio-product-gallery .aio-gallery-track:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }

/* November 3 reference: three equal selected works and a compact portfolio. */
#selected-works .works-featured-layout { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:2rem 1.75rem; }
#selected-works .works-two-col { display:contents; }
#selected-works .work-card-large,
#selected-works .work-card-half { display:flex; flex-direction:column; align-items:stretch; gap:0; min-width:0; }
#selected-works .work-visual-col { width:100%; box-shadow:none; border:0; }
#selected-works .work-visual-frame,
#selected-works .work-card-half-visual { aspect-ratio:16/9; width:100%; height:auto; }
#selected-works .work-info-col,
#selected-works .work-card-half-body { padding:1rem .25rem 0; display:flex; flex-direction:column; flex:1; width:100%; }
#selected-works .work-title,
#selected-works .work-title-sub { font-size:1.1rem; line-height:1.5; margin:0 0 .4rem; }
#selected-works .work-lead,
#selected-works .work-brief-desc { font-size:.84rem; line-height:1.7; margin:0 0 .85rem; }
#selected-works .work-details { margin:0; padding:0; border:0; font-size:.76rem; }
#selected-works .work-meta-row { font-size:.76rem; gap:.35rem; }
#selected-works .work-meta-key { min-width:2.7em; }
#selected-works .work-action-row { margin-top:auto; padding-top:1rem; }
#selected-works .work-badge-meta { gap:.35rem; margin-bottom:.4rem; flex-wrap:wrap; }
#selected-works .work-cat,
#selected-works .work-status { font-size:.65rem; }
#selected-works .aio-work-domain,
#selected-works .work-header-subtitle { display:none; }
#selected-works .aio-product-gallery { grid-column:1/-1; margin-top:.75rem; padding-top:2rem; min-width:0; }
#selected-works .aio-gallery-header-bar { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:2.5rem; margin-bottom:1.5rem; }
#selected-works .aio-gallery-title { font-size:1.65rem; }
#selected-works .aio-gallery-label { font-size:.68rem; }
#selected-works .aio-gallery-lead { margin:0; font-size:.78rem; line-height:1.8; }
#selected-works .aio-gallery-all-link { color:var(--accent); font-size:.75rem; white-space:nowrap; }
#selected-works .aio-gallery-track { gap:1rem; padding:.25rem .15rem .75rem; align-items:stretch; scrollbar-width:none; }
#selected-works .aio-gallery-track::-webkit-scrollbar { display:none; }
#selected-works .aio-gallery-track .aio-product-card { flex:0 0 calc((100% - 4rem) / 5); min-width:0; height:auto; border:1px solid var(--border-subtle,#e2e8f0); border-radius:8px; overflow:hidden; background:#fff; transition:border-color .2s ease, box-shadow .2s ease, transform .2s ease; }
#selected-works .aio-gallery-track .aio-product-card:hover { border-color:#cbd5e1; box-shadow:0 4px 12px rgba(11,46,89,0.08); transform:translateY(-2px); }
#selected-works .aio-compact-card-link { color:inherit; text-decoration:none; display:flex; flex-direction:column; height:100%; }
#selected-works .aio-card-visual-img { aspect-ratio:16/10; height:auto; width:100%; object-fit:cover; }
#selected-works .aio-card-body { padding:.85rem .85rem 1rem; gap:.4rem; display:flex; flex-direction:column; flex:1; }
#selected-works .aio-card-title { font-size:.95rem; line-height:1.35; margin:0; font-weight:700; color:var(--navy,#0b2e59); }
#selected-works .aio-card-summary { font-size:.78rem; line-height:1.55; margin:0 0 .25rem; color:#555; }
#selected-works .aio-compact-badge { font-size:.62rem; font-weight:700; color:var(--accent,#0070f3); background:#eaf2ff; padding:.2rem .45rem; border-radius:4px; align-self:flex-start; margin-top:auto; overflow-wrap:anywhere; letter-spacing:.02em; }
#selected-works .aio-gallery-nav-btns { position:absolute; inset:0 -22px; pointer-events:none; z-index:2; justify-content:space-between; }
#selected-works .aio-gallery-btn { pointer-events:auto; align-self:center; width:36px; height:36px; box-shadow:0 2px 6px #0b2e5910; }
#selected-works .aio-gallery-dots { display:flex; justify-content:center; gap:2px; margin-top:.5rem; }
#selected-works .aio-gallery-dots[hidden] { display:none; }
#selected-works .aio-gallery-dot { border:0; background:none; width:24px; height:24px; padding:8px; cursor:pointer; }
#selected-works .aio-gallery-dot::after { content:''; display:block; width:8px; height:8px; border-radius:50%; background:#d1dceb; }
#selected-works .aio-gallery-dot[aria-current="true"]::after { background:var(--accent); }
#selected-works .aio-gallery-dot:focus-visible { outline:2px solid var(--accent); outline-offset:1px; border-radius:50%; }
#selected-works { padding-bottom:2.5rem; }
@media(max-width:1100px) {
  #selected-works .aio-gallery-header-bar { gap:1.5rem; }
  #selected-works .aio-gallery-track { gap:.9rem; }
  #selected-works .aio-gallery-track .aio-product-card { flex-basis:calc((100% - 2.7rem) / 3.8); }
}
@media(max-width:760px) {
  #selected-works .works-featured-layout { grid-template-columns:1fr; gap:2rem; }
  #selected-works .aio-gallery-header-bar { grid-template-columns:1fr auto; gap:.75rem; }
  #selected-works .aio-gallery-lead { grid-column:1/-1; grid-row:2; }
  #selected-works .aio-gallery-controls { width:auto; }
  #selected-works .aio-gallery-title { font-size:1.35rem; }
  #selected-works .aio-gallery-all-link { white-space:normal; max-width:9em; font-size:.7rem; }
  #selected-works .aio-gallery-track { gap:.75rem; }
  #selected-works .aio-gallery-track .aio-product-card { flex-basis:calc((100% - 1.5rem) / 2.3); }
  #selected-works .aio-card-body { padding:.75rem .75rem .9rem; }
  #selected-works .aio-card-title { font-size:.9rem; }
  #selected-works .aio-card-summary { font-size:.75rem; }
  #selected-works .aio-gallery-nav-btns { inset:0 -12px; }
  #selected-works .aio-gallery-btn { width:30px; height:30px; }
}
@media(max-width:480px) {
  #selected-works .aio-gallery-track .aio-product-card { flex-basis:calc((100% - .75rem) / 1.35); }
}
