/* BAZIC's reading layout uses the current template fonts, palette and reveal
   hooks. Loaded only by this case; all rules stay within its content region. */
[data-rui-case-layout="bazic"] {
  --rui-case-muted: #496779;
  padding-top: clamp(3rem, 6vw, 6rem);
}

[data-rui-case-layout="bazic"] p { color: inherit; }

[data-rui-case-layout="bazic"] .rui-case-at-a-glance {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 2.5rem 4rem;
  padding: clamp(1.5rem, 4vw, 3.5rem);
  border: 0;
  margin-bottom: 4rem;
}

[data-rui-case-layout="bazic"] .rui-case-at-a-glance-copy h2 {
  margin: 0;
  font: 600 0.8rem/1.4 "Clashgrotesk Variable", Arial, sans-serif;
  letter-spacing: 0.1em;
}

[data-rui-case-layout="bazic"] .rui-case-impact {
  margin-top: 1.5rem;
  font: 600 clamp(2.75rem, 4.8vw, 4.6rem)/0.98 "Alumni Sans", sans-serif;
  letter-spacing: 0;
}

[data-rui-case-layout="bazic"] .rui-case-summary {
  margin: 0;
  max-width: 60ch;
  font-size: 1.1rem;
  line-height: 1.6;
  opacity: 1;
}

[data-rui-case-layout="bazic"] .rui-bazic-context {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
  margin: 1.75rem 0 0;
  padding-top: 1.25rem;
  border-top: 1px solid var(--rui-case-line);
}

[data-rui-case-layout="bazic"] dt {
  font-size: 0.8rem;
  font-weight: 600;
}

[data-rui-case-layout="bazic"] dd {
  margin: 0.5rem 0 0;
  font-size: 0.95rem;
  line-height: 1.5;
}

[data-rui-case-layout="bazic"] .rui-case-services {
  grid-column: 1 / -1;
  margin: 0;
  padding-top: 1.5rem;
  border-top: 1px solid var(--rui-case-line);
}

[data-rui-case-layout="bazic"] .rui-case-services-list { flex-direction: row; flex-wrap: wrap; gap: 0.5rem 1.5rem; }
[data-rui-case-layout="bazic"] .rui-case-services-list li { padding: 0; border: 0; font-weight: 400; line-height: 1.5; }
[data-rui-case-layout="bazic"] .rui-case-services > .rui-case-label { opacity: 1; }

[data-rui-case-layout="bazic"] .rui-case-numbered {
  width: 100%;
  margin: 0 0 clamp(4rem, 7vw, 7rem);
  padding: clamp(1.5rem, 4vw, 3.5rem);
}

[data-rui-case-layout="bazic"] .rui-bazic-index-heading h2 {
  margin: 0;
  font: 600 clamp(2.5rem, 4vw, 3.5rem)/1 "Alumni Sans", sans-serif;
}

[data-rui-case-layout="bazic"] .rui-bazic-index-heading > p { margin: 1rem 0 2.5rem; }
[data-rui-case-layout="bazic"] .project-details-right { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem 3rem; }
[data-rui-case-layout="bazic"] .project-details {
  display: flex;
  flex-direction: row;
  gap: 1.25rem;
  align-items: flex-start;
  margin: 0;
  padding: 1.5rem 0 0;
  color: inherit;
  text-decoration: none;
  border-top: 1px solid #7592a3;
}

[data-rui-case-layout="bazic"] .rui-case-numbered-item:first-of-type { border-top: 1px solid #7592a3; padding-top: 1.5rem; }
[data-rui-case-layout="bazic"] .project-left { width: 2.5rem; }
[data-rui-case-layout="bazic"] .project-left .number { width: 2.5rem; height: 2.5rem; font-size: 1.25rem; }
[data-rui-case-layout="bazic"] .project-right { display: block; width: auto; }
[data-rui-case-layout="bazic"] .project-subtitle { margin: 0; font: 600 clamp(1.8rem, 2.6vw, 2.5rem)/1.05 "Alumni Sans", sans-serif; }
[data-rui-case-layout="bazic"] .project-p { margin-top: 0.8rem; font-size: 0.95rem; line-height: 1.55; }
[data-rui-case-layout="bazic"] .rui-bazic-read { display: inline-block; margin-top: 1.25rem; font-size: 0.85rem; text-decoration: underline; text-underline-offset: 5px; }
[data-rui-case-layout="bazic"] .project-details:hover .project-subtitle { text-decoration: underline; text-underline-offset: 5px; }
[data-rui-case-layout="bazic"] a:focus-visible { outline: 3px solid currentColor; outline-offset: 6px; }

[data-rui-case-layout="bazic"] .rui-case-blocks { gap: clamp(3rem, 6vw, 5.5rem); }
[data-rui-case-layout="bazic"] .rui-case-section { grid-template-columns: minmax(8rem, 0.4fr) minmax(0, 1.6fr); gap: 2rem; }
[data-rui-case-layout="bazic"] .rui-case-label { color: inherit; opacity: 1; }
[data-rui-case-layout="bazic"] .rui-case-blocks h2,
[data-rui-case-layout="bazic"] .rui-case-blocks h3 {
  max-width: 36ch;
  margin-top: 0;
  font: 600 clamp(2.3rem, 4vw, 3.75rem)/1.03 "Alumni Sans", sans-serif;
  text-transform: none;
  letter-spacing: 0;
}

[data-rui-case-layout="bazic"] .rui-case-blocks p { max-width: 70ch; font-size: 1.08rem; line-height: 1.65; }
[data-rui-case-layout="bazic"] .rui-case-card { padding: clamp(1.5rem, 4vw, 3.5rem); }
[data-rui-case-layout="bazic"] [id^="bazic-"] { scroll-margin-top: 2rem; }
[data-rui-case-layout="bazic"] .rui-bazic-chapter { padding-top: 2rem; }
[data-rui-case-layout="bazic"] .rui-bazic-chapter:focus { outline: none; }
[data-rui-case-layout="bazic"] .rui-case-card--decision { background: var(--rui-palette-deep-blue); color: var(--rui-palette-light-pink); }
[data-rui-case-layout="bazic"] .rui-case-card--decision h2 { margin: 1rem 0 1.75rem; }
[data-rui-case-layout="bazic"] .rui-case-card--decision .rui-case-label { color: var(--rui-palette-light-pink); }
[data-rui-case-layout="bazic"] .rui-case-card--artifact { padding: 1.5rem 0; border-block: 1px solid var(--rui-case-line); background: white; color: var(--rui-palette-deep-blue); }
[data-rui-case-layout="bazic"] .rui-case-card--artifact h3 { margin: 1rem 0; font-size: 2.5rem; }
[data-rui-case-layout="bazic"] .rui-case-card--artifact .rui-case-link { margin-top: 0.5rem; }
[data-rui-case-layout="bazic"] .rui-case-card--metric h3 { font-size: clamp(4.5rem, 10vw, 8rem); }
[data-rui-case-layout="bazic"] .rui-case-gallery,
[data-rui-case-layout="bazic"] .rui-case-comparison { padding: 0; background: transparent; }
[data-rui-case-layout="bazic"] .rui-case-gallery-header,
[data-rui-case-layout="bazic"] .rui-case-comparison-header { display: block; }
[data-rui-case-layout="bazic"] .rui-case-gallery-header h2,
[data-rui-case-layout="bazic"] .rui-case-comparison-header h2 { margin-top: 1rem; }
[data-rui-case-layout="bazic"] .rui-case-comparison-grid { grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); align-items: start; gap: 2rem; }
[data-rui-case-layout="bazic"] .rui-comparison-card { padding: 0; background: transparent; }
[data-rui-case-layout="bazic"] .rui-comparison-card h3 { margin-top: 0.75rem; font-size: 2rem; }
[data-rui-case-layout="bazic"] .rui-comparison-card .rui-case-label { display: block; margin-top: 2rem; }
[data-rui-case-layout="bazic"] figcaption { color: var(--rui-case-muted); opacity: 1; font-size: 0.9rem; line-height: 1.5; }
[data-rui-case-layout="bazic"] .rui-bazic-image-link { display: block; color: var(--rui-palette-deep-blue); text-decoration: none; }
[data-rui-case-layout="bazic"] .rui-bazic-image-link > span { display: block; padding: 0.65rem 0; text-align: right; font-size: 0.8rem; text-decoration: underline; text-underline-offset: 4px; }
[data-rui-case-layout="bazic"] .rui-bazic-image-link:hover > span { text-decoration-thickness: 2px; }
[data-rui-case-layout="bazic"] .rui-case-gallery-grid:has(img[width="390"]) { grid-template-columns: minmax(0, 1fr) minmax(0, 0.32fr); align-items: start; gap: 2rem; }
[data-rui-case-layout="bazic"] .rui-flow-step > span { color: var(--rui-palette-deep-blue); margin-bottom: 1.5rem; }
[data-rui-case-layout="bazic"] .rui-flow-step h3 { font-size: 2rem; }
[data-rui-case-layout="bazic"] .rui-case-blocks .rui-bazic-measurement-note { margin-top: 1.5rem; padding-top: 1rem; border-top: 1px solid currentColor; font-size: 0.9rem; line-height: 1.6; }

@media (max-width: 991px) {
  [data-rui-case-layout="bazic"] .rui-case-at-a-glance { grid-template-columns: 1fr; gap: 2rem; }
  [data-rui-case-layout="bazic"] .rui-case-impact { max-width: none; }
  [data-rui-case-layout="bazic"] .rui-case-summary { max-width: none; }
  [data-rui-case-layout="bazic"] .rui-case-section { grid-template-columns: 1fr; gap: 1rem; }
}

@media (max-width: 767px) {
  [data-rui-case-layout="bazic"] .project-details-right,
  [data-rui-case-layout="bazic"] .rui-case-comparison-grid { grid-template-columns: 1fr; }
  [data-rui-case-layout="bazic"] .rui-bazic-context { grid-template-columns: 1fr; }
  [data-rui-case-layout="bazic"] .rui-case-gallery-grid:has(img[width="390"]) { grid-template-columns: 1fr; }
  [data-rui-case-layout="bazic"] .rui-case-gallery-grid:has(img[width="390"]) figure:last-child { max-width: 18rem; margin-inline: auto; }
  [data-rui-case-layout="bazic"] .project-left { width: 2.5rem; }
  [data-rui-case-layout="bazic"] .project-right { width: auto; }
  [data-rui-case-layout="bazic"] .rui-case-blocks p { font-size: 1rem; }
}