/* One hierarchy for the complete case study, including all gallery captions. */
html:has(.yedoo-story) { --case-nav-offset: 88px; scroll-padding-top: var(--case-nav-offset); }
.yedoo-story {
  --brand-display: 56px;
  --brand-title: 36px;
  --brand-heading: 22px;
  --brand-body: 18px;
  --brand-small: 15px;
  --brand-chapter-note: 30px;
  --case-caption: 16px;
  --case-caption-title: 18px;
  --case-width: 1080px;
  --case-reading: 720px;
  --case-gutter: 32px;
  --case-radius: 8px;
  --case-gap: 24px;
  --story-copy-gap: 8px;
  --story-section-space: 64px;
  --story-heading-space: 24px;
  --story-media-surface: color-mix(in srgb, var(--ink) 7%, var(--page));
  --case-tab-height: 48px;
  --case-tab-gap: 4px;
  --case-tab-padding: 6px;
  --case-focus-offset: 3px;
  --case-ios-height: 620px;
  font-size: var(--brand-body);
  letter-spacing: 0;
}
.yedoo-story .wrap { width: min(var(--case-width), calc(100% - var(--case-gutter) * 2)); }
.yedoo-story h1, .yedoo-story h2, .yedoo-story h3, .yedoo-story p,
.yedoo-story dd, .yedoo-story dt, .yedoo-story button { letter-spacing: 0; }
.yedoo-story .case-hero { padding: 128px 0 48px; background: var(--page); }
.yedoo-story .case-hero::after { display: none; }
.yedoo-story .hero-grid { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: var(--case-gap); }
.yedoo-story .case-hero h1 { font-size: var(--brand-display); line-height: 1.05; }
.yedoo-story .kicker { font-size: var(--brand-small); margin-bottom: var(--case-gap); }
.yedoo-story .case-hero .lede { font-size: var(--brand-body); line-height: 1.65; margin-top: var(--case-gap); }
.yedoo-story .marketing-visual.is-rendered .hero-cover { opacity: 1; }
.yedoo-story .marketing-visual canvas { display: none; }
.yedoo-story .snapshot { padding-bottom: 48px; }
.yedoo-story .snapshot-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--case-gap); }
.yedoo-story .snapshot-item { padding: 0; border: 0; }
.yedoo-story .snapshot dt { font-size: var(--brand-small); text-transform: none; font-weight: 500; }
.yedoo-story .snapshot dd { font-size: var(--case-caption); line-height: 1.5; font-weight: 500; margin-top: var(--story-copy-gap); }
.yedoo-story .contribution-summary { margin-top: var(--case-gap); padding-top: var(--case-gap); }
.yedoo-story .contribution-summary .hand-note,
.yedoo-story .story-heading .hand-note { font-size: var(--brand-chapter-note); line-height: 1.15; transform: none; margin: 0 0 var(--story-copy-gap); }
.yedoo-story .contribution-summary p { font-size: var(--brand-body); line-height: 1.65; max-width: var(--case-reading); margin: 0; }
.yedoo-story .story-section { padding-block: var(--story-section-space); }
.yedoo-story .story-heading { margin-bottom: var(--story-heading-space); }
.yedoo-story .story-heading h2, .yedoo-story .closing h2 { font-size: var(--brand-title); line-height: 1.2; max-width: 28ch; }
.yedoo-story .story-lead { font-size: var(--brand-body); line-height: 1.65; max-width: var(--case-reading); margin: 0 0 var(--story-heading-space); }
.yedoo-story .problem-summary { gap: var(--case-gap); }
.yedoo-story .problem-summary h3, .yedoo-story .platform-decisions h3 { font-size: var(--case-caption-title); font-weight: 600; }
.yedoo-story .problem-summary p { font-size: var(--brand-body); line-height: 1.65; margin-top: var(--story-copy-gap); }
.yedoo-story .decision-stack { gap: 0; }
.yedoo-story .decision { grid-template-columns: 40px minmax(0, .8fr) minmax(0, 1.2fr); gap: var(--case-gap); padding: var(--case-gap) 0; }
.yedoo-story .decision h3 { font-size: var(--brand-heading); line-height: 1.35; font-weight: 600; }
.yedoo-story .decision-copy p { font-size: var(--brand-body); line-height: 1.65; }
.yedoo-story .process-media { margin-top: var(--story-heading-space); }
.yedoo-story .story-section .shot { background: var(--story-media-surface); border-radius: var(--case-radius); }
.yedoo-story .story-section .shot img { box-shadow: none; }
.yedoo-story .story-section .screen-shot figcaption { padding: 16px 0 0; margin: 0; color: var(--muted); font-size: var(--case-caption); line-height: 1.6; }
.yedoo-story .story-section .screen-shot figcaption h3,
.yedoo-story .story-section .screen-shot figcaption b { display: block; margin: 0 0 var(--story-copy-gap); color: var(--ink); font-size: var(--case-caption-title); line-height: 1.4; font-weight: 600; }
.yedoo-story .story-section .screen-shot figcaption p { max-width: var(--case-reading); margin: 0; color: var(--muted); font-size: var(--case-caption); line-height: 1.6; }
.yedoo-story .opportunity-flow { margin-bottom: 0; }
.yedoo-story .opportunity-flow, .yedoo-story .screen-tabs-gallery { scroll-margin-top: 0; }
.yedoo-story .opportunity-tabs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--case-tab-gap); padding: var(--case-tab-padding); margin: 0 0 var(--case-gap); background: var(--page); border-radius: var(--case-radius); overflow: visible; }
.yedoo-story .opportunity-tabs .product-tab { min-width: 0; min-height: var(--case-tab-height); padding: var(--case-tab-padding); border: 0; border-radius: var(--case-radius); font-size: var(--brand-small); line-height: 1.3; font-weight: 500; color: var(--ink); background: transparent; transition: background-color .15s, color .15s; white-space: normal; }
.yedoo-story .opportunity-tabs .product-tab:hover { background: var(--story-neutral); }
.yedoo-story .opportunity-tabs .product-tab[aria-selected="true"] { color: var(--page); background: var(--scribble); font-weight: 600; }
.yedoo-story .opportunity-tabs .product-tab:focus-visible { outline: 2px solid var(--scribble); outline-offset: var(--case-focus-offset); }
.yedoo-story .gallery-intro { margin: 40px 0 var(--case-gap); padding-top: 32px; border-top: 1px solid var(--line); }
.yedoo-story .gallery-intro .gallery-heading { font-size: var(--brand-heading); line-height: 1.35; margin: 0 0 var(--story-copy-gap); }
.yedoo-story .gallery-intro p { color: var(--muted); font-size: var(--brand-body); line-height: 1.65; max-width: var(--case-reading); margin: 0; }
.yedoo-story .opportunity-flow .shot, .yedoo-story .screen-tabs-gallery .shot { aspect-ratio: 8 / 5; max-height: none; }
.yedoo-story .ios-tabs-gallery .shot { height: var(--case-ios-height); aspect-ratio: auto; }
.yedoo-story .ios-tabs-gallery { max-width: var(--case-reading); margin-inline: auto; }
.yedoo-story .ios-tabs-gallery .shot img { position: absolute; inset: 16px; width: calc(100% - 32px); height: calc(100% - 32px); object-fit: contain; }
.yedoo-story .platform-decisions { gap: var(--case-gap); margin-block: 32px; }
.yedoo-story .platform-adaptation { scroll-margin-top: var(--case-nav-offset); }
.yedoo-story .platform-decisions p { font-size: var(--case-caption); line-height: 1.6; }
.yedoo-story .outcome-grid { gap: var(--case-gap); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.yedoo-story .outcome { padding: var(--case-gap) 0; background: transparent; border: 0; border-radius: 0; }
.yedoo-story .outcome dt { font-size: var(--brand-small); text-transform: none; font-weight: 500; letter-spacing: 0; }
.yedoo-story .outcome dd { color: var(--ink); font-size: var(--brand-heading); font-weight: 600; line-height: 1.4; margin-top: var(--story-copy-gap); letter-spacing: 0; }
.yedoo-story .launch-evidence figcaption { font-size: var(--case-caption); line-height: 1.6; }
.yedoo-story .launch-identity strong, .yedoo-story .launch-identity p { font-size: var(--case-caption); }
.yedoo-story .next-validation h3 { font-size: var(--brand-heading); line-height: 1.35; }
.yedoo-story .next-validation p, .yedoo-story .next-validation li { font-size: var(--brand-body); line-height: 1.65; }
.yedoo-story .closing { padding-block: 48px; }
.yedoo-story .case-nav { backdrop-filter: none; -webkit-backdrop-filter: none; background: var(--page); box-shadow: none; }
@media (max-width: 800px) {
  .yedoo-story { --brand-display: 48px; --brand-title: 30px; --brand-heading: 21px; --brand-body: 17px; --brand-chapter-note: 28px; --case-gutter: 24px; --story-section-space: 48px; }
  .yedoo-story .hero-grid { grid-template-columns: minmax(0, 1fr); }
  .yedoo-story .case-hero { padding-top: 112px; }
  .yedoo-story .case-hero .lede { max-width: var(--case-reading); }
  .yedoo-story .snapshot-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .yedoo-story .decision { grid-template-columns: 32px minmax(0, 1fr); gap: 16px; }
  .yedoo-story .decision-copy { grid-column: 2; }
}
@media (max-width: 600px) {
  html:has(.yedoo-story) { --case-nav-offset: 120px; }
  .yedoo-story { --brand-display: 44px; --brand-title: 28px; --brand-heading: 20px; --case-gutter: 20px; --case-gap: 20px; --case-ios-height: 500px; }
  .yedoo-story .case-nav { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; border-radius: var(--case-radius); overflow: visible; padding: var(--case-tab-padding); }
  .yedoo-story .case-nav a { justify-content: center; padding: 0; min-height: 40px; font-size: 12px; }
  .yedoo-story .case-nav a:first-child { justify-content: center; }
  .yedoo-story .case-nav a:last-child { grid-column: auto; }
  .yedoo-story .case-hero { padding-top: 144px; padding-bottom: 32px; }
  .yedoo-story .snapshot { padding-bottom: 40px; }
  .yedoo-story .screen-tabs-gallery .opportunity-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .yedoo-story .opportunity-tabs .product-tab { font-size: 14px; }
  .yedoo-story .process-media { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .yedoo-story .process-media .shot { height: auto; aspect-ratio: 1; }
  .yedoo-story .process-media figcaption, .yedoo-story .process-media figcaption b { font-size: var(--brand-small); }
  .yedoo-story .outcome-grid { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .yedoo-story .outcome + .outcome { border-top: 1px solid var(--line); }
  .yedoo-story .gallery-intro { margin-top: 32px; padding-top: var(--case-gap); }
}
@media (prefers-reduced-motion: reduce) {
  .yedoo-story .opportunity-tabs .product-tab { transition: none; }
}