.layout-switch { position: fixed; z-index: 90; left: 12px; bottom: 12px; display: flex; flex-direction: column; gap: 2px; padding: 3px; border-radius: 12px; background: rgb(20 16 28 / .9); backdrop-filter: blur(8px); font: 600 11.5px/1 system-ui, sans-serif; box-shadow: 0 8px 30px rgb(0 0 0 / .25); }
.layout-switch button { padding: 7px 10px; border: 0; border-radius: 9px; background: none; color: #eee; text-align: left; cursor: pointer; }
.layout-switch button[aria-pressed="true"] { background: #fff; color: #140f1c; }
#case-content#case-content:is(.layout-lead,.layout-read,.layout-gallery,.layout-rail) .builder-device-visual {
  background: color-mix(in srgb, var(--ink) 4%, transparent);
  border-radius: 14px;
}
@media (min-width:901px) {
  #case-content#case-content:is(.layout-lead,.layout-read,.layout-gallery) .builder-device-visual > * { zoom: .82; }
}
#case-content#case-content[class*="layout-"] .case-image > img { max-height: none; }
#case-content#case-content[class*="layout-"] :is(.case-facts b,.tag-copy>span) { color: var(--ink); }
@media (min-width:901px) {
  #case-content#case-content:is(.layout-lead,.layout-gallery) .case-specs { align-items: stretch; }
  #case-content#case-content:is(.layout-lead,.layout-gallery) .case-specs > * > * { padding-left: 22px; border-top: 0; border-left: 1px solid var(--line); }
  #case-content#case-content:is(.layout-lead,.layout-gallery) .case-specs > .case-tags > :first-child { padding-left: 0; border-left: 0; }
}
@media (min-width:901px) {
  #case-content#case-content.layout-clean {
    grid-template-columns: minmax(0,3fr) minmax(0,2fr);
    column-gap: 56px;
    row-gap: 0;
  }
  #case-content#case-content.layout-clean .case-outcome { max-width: 52ch; }
  #case-content#case-content.layout-clean .case-image { margin-top: 60px; gap: 10px; grid-template-columns: minmax(0,1fr); }
  #case-content#case-content.layout-clean .case-image > img { height: auto; aspect-ratio: 16/10; border-radius: 10px; }
  #case-content#case-content.layout-clean .case-mosaic { gap: 10px; width: 100%; min-width: 0; }
  #case-content#case-content.layout-clean .case-mosaic img { border-radius: 10px; }
  #case-content#case-content.layout-clean .case-specs { margin-top: 40px; }
  #case-content#case-content.layout-clean > :is(.case-body,.form-factors,.builder-gallery) { margin-top: 88px; }
  #case-content#case-content.layout-clean > .project-pagination { margin-top: 88px; }
  #case-content#case-content.layout-clean .case-narrative { gap: 0 48px; }
  #case-content#case-content.layout-clean .case-narrative section { padding-top: 24px; }
  #case-content#case-content.layout-clean .case-narrative section::before {
    content: ""; grid-row: 1; width: 24px; height: 2px; margin-bottom: 6px; background: var(--accent);
  }
  #case-content#case-content.layout-clean .case-narrative .section-number { grid-row: 2; }
  #case-content#case-content.layout-clean .case-narrative section > div { grid-row: 3; }
}
@media (max-width:900px) {
  #case-content#case-content.layout-clean .case-image > img { height: auto; aspect-ratio: 16/10; border-radius: 10px; }
  #case-content#case-content.layout-clean .case-mosaic img { border-radius: 10px; }
}
@media (min-width:901px) {
  #case-content#case-content.layout-lead {
    grid-template-columns: minmax(0,7fr) minmax(0,5fr);
    column-gap: 64px;
    row-gap: 0;
  }
  #case-content#case-content.layout-lead .case-hero { display: contents; }
  #case-content#case-content.layout-lead .case-hero > .back { grid-column: 1 / -1; grid-row: 1; justify-self: start; margin-bottom: 24px; }
  #case-content#case-content.layout-lead .case-image { grid-column: 1 / -1; grid-row: 2; margin: 0; }
  #case-content#case-content.layout-lead .case-hero > .eyebrow { grid-column: 1; grid-row: 3; margin: 48px 0 14px; }
  #case-content#case-content.layout-lead .case-hero > h1 { grid-column: 1; grid-row: 4; margin: 0; }
  #case-content#case-content.layout-lead .case-hero > .case-outcome { grid-column: 2; grid-row: 3 / 5; align-self: end; margin: 0; }
  #case-content#case-content.layout-lead .case-specs { grid-column: 1 / -1; grid-row: 5; margin-top: 48px; grid-template-columns: repeat(4,minmax(0,1fr)); }
  #case-content#case-content.layout-lead > :is(.case-body,.form-factors,.builder-gallery,.project-pagination) { margin-top: 72px; }
  #case-content#case-content.layout-lead .case-image:not(.builder-device-visual) {
    display: grid;
    grid-template-columns: minmax(0,3fr) minmax(0,1fr);
    grid-template-rows: minmax(0,1fr);
    gap: 12px;
    height: clamp(320px,33vw,470px);
  }
  #case-content#case-content.layout-lead .case-image:not(:has(.case-mosaic)) { grid-template-columns: minmax(0,1fr); }
  #case-content#case-content.layout-lead .case-image > img { height: 100%; border-radius: 12px; }
  #case-content#case-content.layout-lead .case-image .case-mosaic {
    contain: size; min-height: 0; height: 100%;
    grid-template-columns: minmax(0,1fr);
    grid-template-rows: none;
    grid-auto-rows: minmax(0,1fr);
    gap: 12px;
  }
  #case-content#case-content.layout-lead .case-image .case-mosaic img { grid-row: auto; height: 100%; border-radius: 12px; }
  #case-content#case-content.layout-lead .builder-device-visual { padding: 40px 20px; }
}
@media (min-width:901px) {
  #case-content#case-content.layout-rail {
    grid-template-columns: minmax(220px,260px) minmax(0,1fr);
    column-gap: clamp(48px,6vw,88px);
    row-gap: 0;
  }
  #case-content#case-content.layout-rail > * { grid-column: 2; grid-row: auto; }
  #case-content#case-content.layout-rail #surf-kit-model { grid-column: 2 !important; }
  #case-content#case-content.layout-rail > .project-pagination { grid-column: 1 / -1; margin-top: 88px; }
  #case-content#case-content.layout-rail > :not(.case-hero):not(.case-specs):not(.project-pagination) { margin-top: 56px; }
  #case-content#case-content.layout-rail .case-hero h1 { font-size: clamp(38px,4vw,54px); }
  #case-content#case-content.layout-rail .case-specs {
    grid-column: 1;
    grid-row: 1 / span 30;
    align-self: start;
    position: sticky;
    top: 112px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    margin: 60px 0 0;
    padding: 0;
    border-top: 2px solid var(--ink);
    border-bottom: 0;
  }
  #case-content#case-content.layout-rail .case-specs > .case-tags,
  #case-content#case-content.layout-rail .case-specs > .case-facts { display: flex; flex-direction: column; gap: 0; margin: 0; padding: 0; border: 0; }
  #case-content#case-content.layout-rail .case-specs > * > * {
    width: 100%;
    margin: 0;
    padding: 16px 0;
    border: 0;
    border-bottom: 1px solid var(--line);
  }
  #case-content#case-content.layout-rail .case-image:not(.builder-device-visual) { display: grid; grid-template-rows: none; gap: 12px; }
  #case-content#case-content.layout-rail .case-image > img { height: auto; aspect-ratio: 16/9; border-radius: 12px; }
  #case-content#case-content.layout-rail .case-image .case-mosaic {
    contain: none; min-height: 0;
    grid-template-columns: repeat(var(--tiles,3),minmax(0,1fr));
    grid-template-rows: none;
    gap: 12px;
  }
  #case-content#case-content.layout-rail .case-image .case-mosaic img { grid-row: auto; height: auto; aspect-ratio: 4/3; border-radius: 10px; }
  #case-content#case-content.layout-rail .builder-device-visual { padding: 40px 20px; }
  #case-content#case-content.layout-rail .case-narrative { grid-template-columns: minmax(0,1fr); }
  #case-content#case-content.layout-rail .case-narrative section {
    grid-template-columns: 64px minmax(0,1fr);
    padding: 28px 0;
    border-top: 0;
  }
  #case-content#case-content.layout-rail .case-narrative section + section { border-top: 1px solid var(--line); }
  #case-content#case-content.layout-rail .case-narrative .section-number { padding-top: 6px; }
  #case-content#case-content.layout-rail .case-narrative .narrative-brief { max-width: 60ch; }
}
@media (min-width:901px) {
  #case-content#case-content.layout-read {
    grid-template-columns: minmax(0,1fr) minmax(0,700px) minmax(0,1fr);
    column-gap: 0;
    row-gap: 0;
  }
  #case-content#case-content.layout-read > * { grid-column: 1 / -1; grid-row: auto; order: 3; margin-top: 72px; }
  #case-content#case-content.layout-read > .case-hero { grid-column: 2; order: 0; margin-top: 0; }
  #case-content#case-content.layout-read > .case-specs { grid-column: 2; order: 1; margin-top: 40px; }
  #case-content#case-content.layout-read > .case-image { order: 2; margin-top: 56px; }
  #case-content#case-content.layout-read > #surf-kit-model { order: 2; }
  #case-content#case-content.layout-read .case-hero h1 { font-size: clamp(40px,4.6vw,60px); }
  #case-content#case-content.layout-read .case-hero .case-outcome { font-size: 20px; max-width: none; }
  #case-content#case-content.layout-read .case-image:not(.builder-device-visual) { display: grid; grid-template-rows: none; gap: 12px; }
  #case-content#case-content.layout-read .case-image > img { height: auto; aspect-ratio: 21/9; border-radius: 12px; }
  #case-content#case-content.layout-read .case-image .case-mosaic {
    contain: none; min-height: 0;
    grid-template-columns: repeat(var(--tiles,3),minmax(0,1fr));
    grid-template-rows: none;
    gap: 12px;
  }
  #case-content#case-content.layout-read .case-image .case-mosaic img { grid-row: auto; height: auto; aspect-ratio: 3/2; border-radius: 10px; }
  #case-content#case-content.layout-read .builder-device-visual { padding: 40px 20px; }
  #case-content#case-content.layout-read .case-narrative {
    grid-template-columns: minmax(0,1fr);
    width: min(700px,100%);
    margin-inline: auto;
  }
  #case-content#case-content.layout-read .case-narrative section { padding: 28px 0; gap: 4px; }
  #case-content#case-content.layout-read .case-narrative section + section { border-top: 1px solid var(--line); }
  #case-content#case-content.layout-read .case-narrative .narrative-brief { font-size: 20px; }
  #case-content#case-content.layout-read .case-summary { margin-top: 40px; }
}
@media (min-width:901px) {
  #case-content#case-content.layout-gallery {
    grid-template-columns: minmax(0,1fr);
    row-gap: 0;
  }
  #case-content#case-content.layout-gallery > * { grid-column: 1; grid-row: auto; }
  #case-content#case-content.layout-gallery > :not(.case-hero) { margin-top: 56px; }
  #case-content#case-content.layout-gallery .case-hero {
    display: grid;
    grid-template-columns: minmax(0,7fr) minmax(0,5fr);
    column-gap: 64px;
    align-items: end;
  }
  #case-content#case-content.layout-gallery .case-hero > :not(.case-outcome) { grid-column: 1; }
  #case-content#case-content.layout-gallery .case-hero > .back { justify-self: start; }
  #case-content#case-content.layout-gallery .case-hero > h1 { margin: 0; }
  #case-content#case-content.layout-gallery .case-hero > .case-outcome { grid-column: 2; grid-row: 2 / 4; margin: 0; font-size: 17px; }
  #case-content#case-content.layout-gallery .case-image:not(.builder-device-visual) {
    display: grid;
    grid-template-columns: minmax(0,2fr) minmax(0,1fr) minmax(0,1fr);
    grid-template-rows: repeat(2,clamp(200px,19vw,290px)) auto;
    gap: 12px;
  }
  #case-content#case-content.layout-gallery .case-image > img { grid-column: 1; grid-row: 1 / 3; height: 100%; border-radius: 12px; }
  #case-content#case-content.layout-gallery .case-image:not(:has(.case-mosaic)) > img { grid-column: 1 / -1; }
  #case-content#case-content.layout-gallery .case-image .case-mosaic { display: contents; }
  #case-content#case-content.layout-gallery .case-image .case-mosaic img { height: 100%; aspect-ratio: auto; border-radius: 12px; }
  #case-content#case-content.layout-gallery .case-mosaic img:nth-child(1) { grid-column: 2 / 4; grid-row: 1; }
  #case-content#case-content.layout-gallery .case-mosaic img:nth-child(2) { grid-column: 2; grid-row: 2; }
  #case-content#case-content.layout-gallery .case-mosaic img:nth-child(3) { grid-column: 3; grid-row: 2; }
  #case-content#case-content.layout-gallery .case-mosaic[data-count="2"] img:nth-child(2) { grid-column: 2 / 4; }
  #case-content#case-content.layout-gallery .builder-device-visual { padding: 40px 20px; }
  #case-content#case-content.layout-gallery .case-specs { grid-template-columns: repeat(4,minmax(0,1fr)); margin-top: 32px; }
  #case-content#case-content.layout-gallery .case-body { margin-top: 64px; }
  #case-content#case-content.layout-gallery .case-narrative .narrative-brief { font-size: 17px; }
}
#case-content#case-content:is(.layout-gallery,.layout-read) .case-image:not(.builder-device-visual) .image-note {
  position: static;
  grid-column: 1 / -1;
  grid-row: auto;
  order: 9;
  display: block;
}
#case-content#case-content:is(.layout-gallery,.layout-read) .case-image .image-note-btn { display: none; }
#case-content#case-content:is(.layout-gallery,.layout-read) .case-image .image-note [role=tooltip] {
  display: block;
  max-width: none;
  padding: 0;
  background: none;
  color: var(--muted);
  font-size: 13px;
  opacity: 1;
  transform: none;
}
@media (max-width:900px) {
  #case-content#case-content:is(.layout-gallery,.layout-read) .case-image:not(.builder-device-visual) { display: grid; gap: 8px; }
  #case-content#case-content:is(.layout-gallery,.layout-read) .case-image > img { height: auto; aspect-ratio: 4/3; border-radius: 10px; }
  #case-content#case-content.layout-gallery .case-mosaic { grid-template-columns: repeat(2,minmax(0,1fr)); }
  #case-content#case-content.layout-gallery .case-mosaic img:first-child { grid-column: 1 / -1; aspect-ratio: 16/9; }
}
@media (min-width:901px) {
  #case-content#case-content.single-image .case-image:not(:has(.ff-tiles)) { grid-template-rows: auto; align-self: start; }
  #case-content#case-content.single-image .case-image:not(:has(.ff-tiles)) > img { height: auto; aspect-ratio: 9/10; border-radius: 12px; }
}
@media (max-width:900px) {
  #case-content#case-content.single-image .case-image > img { aspect-ratio: 4/3; border-radius: 12px; }
}
#case-content .screen-grid.sg-two { position: relative; display: grid; gap: 10px; }
@media (min-width:901px) {
  #case-content#case-content .case-image.screen-grid.sg-two { grid-template-rows: minmax(0,1fr) minmax(0,1fr); align-self: stretch; contain: size; min-height: 420px; }
  #case-content .screen-grid.sg-two .sg-screen { aspect-ratio: auto; }
}
#case-content#case-content .case-image.real-product-image { display: grid; grid-template-rows: auto auto; gap: 10px; align-self: start; contain: none; }
#case-content#case-content .case-image.real-product-image > img { width: 100%; height: auto; max-height: none; aspect-ratio: 4/3; object-fit: cover; border: 0; border-radius: 12px; }
#case-content#case-content .real-product-image .case-mosaic { contain: none; aspect-ratio: auto; display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); grid-template-rows: auto; gap: 10px; width: 100%; min-height: 0; margin: 0; }
#case-content#case-content .real-product-image .case-mosaic img { grid-row: auto; width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; border-radius: 10px; }
#case-content#case-content .case-image:has(.ff-tiles) { grid-template-rows: auto auto; gap: 10px; align-self: start; }
#case-content#case-content .case-image:has(.ff-tiles) > img { width: 100%; height: auto; aspect-ratio: 4/3; border-radius: 12px; }
#case-content#case-content .case-image .ff-tiles { gap: 10px; }
#case-content#case-content .ff-tile .ff-face { display: block; width: 100%; height: auto; max-height: none; aspect-ratio: 480 / 300; object-fit: cover; border-radius: 10px; }
#case-content .ff-tile { cursor: zoom-in; }
#case-content .mosaic-preview > * { display: block; width: 100%; height: 100%; object-fit: cover; }
#case-content .case-image .ff-tiles:has(.is-previewing) .ff-tile:not(.is-previewing) { opacity: .55; }
#case-content .case-image .ff-tile { transition: opacity .25s ease; }
#case-content#case-content.layout-poster.layout-poster.layout-poster { grid-template-columns: minmax(0,1fr); row-gap: 0; }
#case-content#case-content.layout-poster.layout-poster.layout-poster > * { grid-column: 1 !important; grid-row: auto !important; }
#case-content#case-content.layout-poster.layout-poster.layout-poster .case-hero h1 { font-size: clamp(46px,7.6vw,118px) !important; line-height: .94 !important; letter-spacing: -.035em !important; max-width: 13ch; margin: 10px 0 0; }
#case-content#case-content.layout-poster.layout-poster.layout-poster .case-hero .case-outcome { font-size: clamp(18px,1.7vw,24px) !important; line-height: 1.4; max-width: 42ch; margin-top: 22px; }
#case-content#case-content.layout-poster.layout-poster.layout-poster .case-image { margin-top: 44px; }
#case-content#case-content.layout-poster.layout-poster.layout-poster .case-image:not(.builder-device-visual) > img { width: 100%; height: auto; aspect-ratio: 21/9; border-radius: 22px; }
#case-content#case-content.layout-poster.layout-poster.layout-poster .builder-device-visual { padding: 48px 20px; border-radius: 22px; background: color-mix(in srgb, var(--ink) 5%, transparent); }
#case-content#case-content.layout-poster.layout-poster.layout-poster .case-specs { margin-top: 36px; padding-top: 18px; border-top: 2px solid var(--ink); }
#case-content#case-content.layout-poster.layout-poster.layout-poster > :is(.case-body,.builder-gallery,.portfolio-gallery,.form-factors,.project-pagination) { margin-top: 88px; }
#case-content#case-content.layout-poster.layout-poster.layout-poster .case-narrative .section-number { font-size: clamp(40px,4.4vw,64px); line-height: 1; font-weight: 800; color: var(--accent); letter-spacing: -.03em; }
@media (min-width:901px) { #case-content#case-content.layout-poster.layout-poster.layout-poster .case-specs { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); } }
@media (max-width:900px) { #case-content#case-content.layout-poster.layout-poster.layout-poster .case-image:not(.builder-device-visual) > img { aspect-ratio: 4/3; border-radius: 16px; } #case-content#case-content.layout-poster.layout-poster.layout-poster > :is(.case-body,.builder-gallery,.portfolio-gallery,.form-factors,.project-pagination) { margin-top: 56px; } }
@media (min-width:901px) {
  #case-content#case-content.layout-split.layout-split.layout-split { grid-template-columns: minmax(0,1fr) minmax(0,1fr); column-gap: clamp(40px,5vw,72px); row-gap: 56px; }
  #case-content#case-content.layout-split.layout-split.layout-split > * { grid-column: 2 !important; grid-row: auto !important; }
  #case-content#case-content.layout-split.layout-split.layout-split > .case-image { grid-column: 1 !important; grid-row: 1 / 4 !important; position: sticky; top: 100px; align-self: start; margin: 0; }
  #case-content#case-content.layout-split.layout-split.layout-split > :is(.builder-gallery,.portfolio-gallery,.form-factors) { grid-column: 1 / -1 !important; order: 5; }
  #case-content#case-content.layout-split.layout-split.layout-split > .project-pagination { grid-column: 1 / -1 !important; order: 6; }
  #case-content#case-content.layout-split.layout-split.layout-split .case-image:not(.builder-device-visual) > img { width: 100%; height: calc(100vh - 140px); max-height: 820px; aspect-ratio: auto; border-radius: 20px; }
  #case-content#case-content.layout-split.layout-split.layout-split .builder-device-visual { min-height: calc(100vh - 140px); display: grid; place-content: center; border-radius: 20px; background: color-mix(in srgb, var(--ink) 5%, transparent); }
  #case-content#case-content.layout-split.layout-split.layout-split .case-hero h1 { font-size: clamp(38px,3.6vw,56px) !important; }
  #case-content#case-content.layout-split.layout-split.layout-split .case-narrative { grid-template-columns: minmax(0,1fr); }
  #case-content#case-content.layout-split.layout-split.layout-split .case-narrative section { padding: 22px 0; border-top: 1px solid var(--line); }
  #case-content#case-content.layout-split.layout-split.layout-split .case-summary { grid-template-columns: minmax(0,1fr); }
}
@media (max-width:900px) { #case-content#case-content.layout-split.layout-split.layout-split .case-image:not(.builder-device-visual) > img { aspect-ratio: 4/5; border-radius: 18px; } }
#case-content#case-content.layout-band.layout-band.layout-band { --band: #19131f; }
#case-content#case-content.layout-band.layout-band.layout-band::before { content: ""; grid-column: 1 / -1; grid-row: 1 / 3; margin: -64px calc(50% - 50vw) -56px; background: radial-gradient(70% 90% at 85% 0%, color-mix(in srgb, var(--accent) 26%, transparent), transparent 60%), var(--band); z-index: -1; }
#case-content#case-content.layout-band.layout-band.layout-band :is(.case-hero,.case-specs) { --ink: #f6f1f8; --muted: #b8abc4; --line: rgb(255 255 255 / .16); color: var(--ink); }
#case-content#case-content.layout-band.layout-band.layout-band :is(.case-hero,.case-specs) :is(h1,b,.tag-copy>span,.case-outcome,.back) { color: var(--ink) !important; }
#case-content#case-content.layout-band.layout-band.layout-band .case-hero .eyebrow { color: color-mix(in srgb, var(--accent) 55%, white) !important; }
#case-content#case-content.layout-band.layout-band.layout-band .case-hero .back { color: var(--muted) !important; }
#case-content#case-content.layout-band.layout-band.layout-band .case-hero .back-arrow { border-color: var(--line) !important; color: var(--ink) !important; }
#case-content#case-content.layout-band.layout-band.layout-band .case-specs :is(.fact-icon, .tag-material) { filter: invert(1) hue-rotate(180deg) brightness(1.2); }
#case-content#case-content.layout-band.layout-band.layout-band .case-image:not(.builder-device-visual) > img { border-radius: 16px; box-shadow: 0 40px 80px -30px rgb(0 0 0 / .7); }
#case-content#case-content.layout-band.layout-band.layout-band .builder-device-visual { background: rgb(255 255 255 / .04); border-radius: 18px; }
#case-content#case-content.layout-band.layout-band.layout-band > :is(.case-body,.builder-gallery,.portfolio-gallery,.form-factors) { margin-top: 112px; }
@media (max-width:900px) {
  #case-content#case-content.layout-band.layout-band.layout-band::before { display: none; }
  #case-content#case-content.layout-band.layout-band.layout-band > :is(.case-hero,.case-image,.case-specs) { background: var(--band); box-shadow: 0 0 0 100vmax var(--band); clip-path: inset(-27px -100vmax); }
  #case-content#case-content.layout-band.layout-band.layout-band > .case-hero { clip-path: inset(-100px -100vmax -27px); }
  #case-content#case-content.layout-band.layout-band.layout-band > .case-specs { clip-path: inset(-27px -100vmax -40px); padding-bottom: 8px; }
  #case-content#case-content.layout-band.layout-band.layout-band > :is(.case-body,.builder-gallery,.portfolio-gallery,.form-factors) { margin-top: 72px; }
}
#case-content#case-content.layout-cards.layout-cards.layout-cards { --card: color-mix(in srgb, var(--ink) 4.5%, var(--bg)); }
#case-content#case-content.layout-cards.layout-cards.layout-cards :is(.case-hero, .case-image, .case-specs > * > *, .case-narrative section, .case-result, .contribution-radar, .builder-gallery, .portfolio-gallery) { background: var(--card); border-radius: 24px; }
#case-content#case-content.layout-cards.layout-cards.layout-cards .case-hero { padding: clamp(24px,3vw,44px); display: flex; flex-direction: column; justify-content: flex-end; }
#case-content#case-content.layout-cards.layout-cards.layout-cards .case-hero h1 { font-size: clamp(34px,3.8vw,58px) !important; }
#case-content#case-content.layout-cards.layout-cards.layout-cards .case-image { padding: 14px; margin: 0; }
#case-content#case-content.layout-cards.layout-cards.layout-cards .case-image:not(.builder-device-visual) > img { border-radius: 14px; }
#case-content#case-content.layout-cards.layout-cards.layout-cards .case-specs { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; border: 0; padding: 0; }
#case-content#case-content.layout-cards.layout-cards.layout-cards .case-specs > * > * { padding: 20px !important; border: 0 !important; margin: 0 !important; }
#case-content#case-content.layout-cards.layout-cards.layout-cards :is(.builder-gallery, .portfolio-gallery) { padding: clamp(16px,2vw,28px); }
#case-content#case-content.layout-cards.layout-cards.layout-cards .case-narrative { gap: 12px; border: 0; }
#case-content#case-content.layout-cards.layout-cards.layout-cards .case-narrative .narrative-bar { background: none; }
#case-content#case-content.layout-cards.layout-cards.layout-cards .case-narrative section { padding: 26px !important; border: 0 !important; }
#case-content#case-content.layout-cards.layout-cards.layout-cards .case-summary { gap: 12px; margin-top: 12px; border: 0; }
#case-content#case-content.layout-cards.layout-cards.layout-cards :is(.case-result, .contribution-radar) { padding: 26px; border: 0 !important; }
@media (min-width:901px) {
  #case-content#case-content.layout-cards.layout-cards.layout-cards { grid-template-columns: repeat(12,minmax(0,1fr)); gap: 12px; }
  #case-content#case-content.layout-cards.layout-cards.layout-cards > * { grid-column: 1 / -1 !important; grid-row: auto !important; }
  #case-content#case-content.layout-cards.layout-cards.layout-cards > .case-hero { grid-column: 1 / 8 !important; grid-row: 1 !important; }
  #case-content#case-content.layout-cards.layout-cards.layout-cards > .case-image { grid-column: 8 / -1 !important; grid-row: 1 !important; align-self: stretch; }
  #case-content#case-content.layout-cards.layout-cards.layout-cards .case-image:not(.builder-device-visual) > img { height: 100%; min-height: 380px; aspect-ratio: auto; }
  #case-content#case-content.layout-cards.layout-cards.layout-cards .case-specs { grid-template-columns: repeat(4,minmax(0,1fr)); }
  #case-content#case-content.layout-cards.layout-cards.layout-cards > :is(.case-body,.builder-gallery,.portfolio-gallery,.form-factors,.project-pagination) { margin-top: 12px; }
}
#case-content#case-content.layout-index.layout-index.layout-index > * { position: relative; }
#case-content#case-content.layout-index.layout-index.layout-index > :is(.case-hero,.case-image,.case-specs,.case-body,.builder-gallery,.portfolio-gallery,.form-factors)::before {
  display: block; font: 700 11px/1.2 var(--f-body, inherit); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
#case-content#case-content.layout-index.layout-index.layout-index > .case-hero::before { content: "Project"; }
#case-content#case-content.layout-index.layout-index.layout-index > .case-image::before { content: "Image"; }
#case-content#case-content.layout-index.layout-index.layout-index > .case-specs::before { content: "Facts"; }
#case-content#case-content.layout-index.layout-index.layout-index > :is(.builder-gallery,.portfolio-gallery)::before { content: "Interface"; }
#case-content#case-content.layout-index.layout-index.layout-index > .form-factors::before { content: "Formats"; }
#case-content#case-content.layout-index.layout-index.layout-index > .case-body::before { content: "Story"; }
#case-content#case-content.layout-index.layout-index.layout-index > :is(.case-hero,.case-image,.case-specs,.case-body,.builder-gallery,.portfolio-gallery,.form-factors) { border-top: 1px solid var(--ink); padding-top: 20px; }
#case-content#case-content.layout-index.layout-index.layout-index .case-hero h1 { font-size: clamp(34px,3.4vw,52px) !important; letter-spacing: -.02em; }
#case-content#case-content.layout-index.layout-index.layout-index .case-image:not(.builder-device-visual) > img { border-radius: 4px; height: auto; aspect-ratio: 16/9; }
#case-content#case-content.layout-index.layout-index.layout-index .builder-device-visual { border-radius: 4px; background: color-mix(in srgb, var(--ink) 4%, transparent); }
#case-content#case-content.layout-index.layout-index.layout-index :is(.interface-study, .pg-b, .project-pagination-link img) { border-radius: 4px !important; }
#case-content#case-content.layout-index.layout-index.layout-index .case-narrative section { border-top: 1px solid var(--line); }
@media (min-width:901px) {
  #case-content#case-content.layout-index.layout-index.layout-index { grid-template-columns: minmax(0,1fr); row-gap: 56px; padding-left: 200px; }
  #case-content#case-content.layout-index.layout-index.layout-index > * { grid-column: 1 !important; grid-row: auto !important; margin-top: 0 !important; }
  #case-content#case-content.layout-index.layout-index.layout-index > :is(.case-hero,.case-image,.case-specs,.case-body,.builder-gallery,.portfolio-gallery,.form-factors)::before { position: absolute; left: -200px; top: 22px; width: 160px; }
  #case-content#case-content.layout-index.layout-index.layout-index .case-hero > .back { position: absolute; left: -200px; top: 56px; margin: 0; }
  #case-content#case-content.layout-index.layout-index.layout-index .case-specs { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); }
  #case-content#case-content.layout-index.layout-index.layout-index .case-narrative { grid-template-columns: minmax(0,1fr); }
  #case-content#case-content.layout-index.layout-index.layout-index .case-narrative section { display: grid; grid-template-columns: 80px minmax(0,1fr); padding: 20px 0; }
}
@media (max-width:900px) { #case-content#case-content.layout-index.layout-index.layout-index > :is(.case-hero,.case-image,.case-specs,.case-body,.builder-gallery,.portfolio-gallery,.form-factors)::before { margin-bottom: 14px; } }
#case-content#case-content.layout-clean:is(.layout-refined,.layout-calm):is(.layout-refined,.layout-calm) .case-specs > * > *, #case-content#case-content.layout-clean:is(.layout-refined,.layout-calm):is(.layout-refined,.layout-calm) .case-specs .case-facts > div { border-left: 0 !important; padding: 16px 16px 16px 0 !important; border-top: 1px solid var(--line); gap: 14px !important; }
#case-content#case-content.layout-clean:is(.layout-refined,.layout-calm):is(.layout-refined,.layout-calm) .case-specs { border-top: 0; border-bottom: 1px solid var(--line); }
#case-content#case-content.layout-clean:is(.layout-refined,.layout-calm):is(.layout-refined,.layout-calm) .case-specs :is(.fact-icon .pill-icon, .tag-material) { width: 32px !important; height: 32px !important; flex-basis: 32px !important; }
#case-content#case-content.layout-clean:is(.layout-refined,.layout-calm):is(.layout-refined,.layout-calm) .case-narrative section::before { content: none !important; }
#case-content#case-content.layout-clean:is(.layout-refined,.layout-calm):is(.layout-refined,.layout-calm) .case-narrative section { border-top: 1px solid var(--line) !important; padding-top: 20px !important; }
#case-content#case-content.layout-clean:is(.layout-refined,.layout-calm):is(.layout-refined,.layout-calm) .case-narrative .section-number { color: var(--accent); font-weight: 700; letter-spacing: .06em; }
#case-content#case-content.layout-clean:is(.layout-refined,.layout-calm):is(.layout-refined,.layout-calm) .case-summary { gap: 16px; border: 0 !important; margin-top: 40px; }
#case-content#case-content.layout-clean:is(.layout-refined,.layout-calm):is(.layout-refined,.layout-calm) .case-summary > :is(.case-result, .contribution-radar) { padding: 28px !important; border: 0 !important; border-radius: 18px; background: color-mix(in srgb, var(--ink) 4%, var(--bg)); }
#case-content#case-content.layout-clean:is(.layout-refined,.layout-calm):is(.layout-refined,.layout-calm) .case-result > * { border-color: color-mix(in srgb, var(--ink) 9%, transparent) !important; }
#case-content#case-content.layout-clean:is(.layout-refined,.layout-calm):is(.layout-refined,.layout-calm) .case-result > :first-child { padding-top: 0 !important; border-top: 0 !important; }
#case-content#case-content.layout-clean:is(.layout-refined,.layout-calm):is(.layout-refined,.layout-calm) .case-result > :last-child { padding-bottom: 0 !important; border-bottom: 0 !important; }
@media (min-width:901px) {
  #case-content#case-content.layout-clean:is(.layout-refined,.layout-calm):is(.layout-refined,.layout-calm) { grid-template-columns: minmax(0,7fr) minmax(0,5fr); column-gap: 64px; }
  #case-content#case-content.layout-clean:is(.layout-refined,.layout-calm):is(.layout-refined,.layout-calm) .case-summary { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
  #case-content#case-content.layout-clean:is(.layout-refined,.layout-calm):is(.layout-refined,.layout-calm) .case-narrative { gap: 0 40px; }
}
@media (max-width:900px) {
  #case-content#case-content.layout-clean:is(.layout-refined,.layout-calm):is(.layout-refined,.layout-calm) .case-specs { grid-template-columns: minmax(0,1fr); }
  #case-content#case-content.layout-clean:is(.layout-refined,.layout-calm):is(.layout-refined,.layout-calm) .case-specs > * > *, #case-content#case-content.layout-clean:is(.layout-refined,.layout-calm):is(.layout-refined,.layout-calm) .case-specs .case-facts > div { padding: 13px 0 !important; align-items: center !important; }
  #case-content#case-content.layout-clean:is(.layout-refined,.layout-calm):is(.layout-refined,.layout-calm) .case-specs .case-facts > div > div, #case-content#case-content.layout-clean:is(.layout-refined,.layout-calm):is(.layout-refined,.layout-calm) .case-specs .tag-copy { flex-direction: row !important; justify-content: space-between; align-items: baseline; flex: 1; gap: 12px !important; }
  #case-content#case-content.layout-clean:is(.layout-refined,.layout-calm):is(.layout-refined,.layout-calm) .case-narrative section { padding: 18px 0 !important; }
  #case-content#case-content.layout-clean:is(.layout-refined,.layout-calm):is(.layout-refined,.layout-calm) .case-summary > :is(.case-result, .contribution-radar) { padding: 22px !important; }
}
#case-content#case-content.layout-clean.layout-calm.layout-calm .case-narrative { gap: 12px !important; }
#case-content#case-content.layout-clean.layout-calm.layout-calm .case-narrative section { padding: 24px !important; border: 0 !important; border-radius: 18px; background: color-mix(in srgb, var(--ink) 4%, var(--bg)); }
#case-content#case-content.layout-clean.layout-calm.layout-calm .case-narrative .narrative-bar { margin-bottom: 4px; }
#case-content#case-content.layout-clean.layout-calm.layout-calm .case-image:not(.builder-device-visual) > img { border-radius: 18px !important; }
@media (min-width:901px) {
  #case-content#case-content.layout-clean.layout-calm.layout-calm .case-specs { grid-column: 1 / -1 !important; grid-row: 2 !important; grid-template-columns: repeat(4,minmax(0,1fr)); margin-top: 8px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
  #case-content#case-content.layout-clean.layout-calm.layout-calm .case-specs > * > *, #case-content#case-content.layout-clean.layout-calm.layout-calm .case-specs .case-facts > div { border-top: 0 !important; }
  #case-content#case-content.layout-clean.layout-calm.layout-calm .case-specs .domain-pill, #case-content#case-content.layout-clean.layout-calm.layout-calm .case-specs .case-facts > div { padding-left: 20px !important; border-left: 1px solid var(--line) !important; }
  #case-content#case-content.layout-clean.layout-calm.layout-calm > :is(.case-body,.builder-gallery,.portfolio-gallery,.form-factors) { margin-top: 72px !important; }
}
#case-content#case-content.layout-clean:is(.layout-refined,.layout-calm):is(.layout-refined,.layout-calm) .case-narrative .narrative-bar + section { border-top: 0 !important; }
@media (max-width:900px) { #case-content#case-content.layout-clean:is(.layout-refined,.layout-calm):is(.layout-refined,.layout-calm) .case-summary { display: grid; grid-template-columns: minmax(0,1fr); gap: 12px; } }
@media (min-width:901px) { #case-content#case-content.layout-clean:is(.layout-refined,.layout-calm):is(.layout-refined,.layout-calm) .case-narrative section { border-top: 0 !important; } }
#case-content#case-content .case-narrative .section-number { font-size: clamp(34px,3.2vw,48px); font-weight: 800; line-height: 1; letter-spacing: -.03em; color: var(--accent); margin-bottom: 10px; }
#case-content#case-content.layout-clean .case-narrative section::before { content: none; }