.case-shell--ifood {
  --ifood-card: #151517;
  --ifood-card-soft: #19191c;
  --ifood-line: rgb(255 255 255 / 8%);
  --ifood-caption: #bdbdb8;
  --editorial-radius: clamp(20px, 1.55vw, 26px);
}

.case-shell--ifood .ifood-section {
  margin-top: clamp(86px, 10vw, 150px);
}

.case-shell--ifood .ifood-bento {
  gap: clamp(12px, 1.25vw, 20px);
  align-items: stretch;
}

.case-shell--ifood .ifood-bento > * {
  min-width: 0;
}

.case-shell--ifood .ifood-copy-card,
.case-shell--ifood .ifood-tile,
.case-shell--ifood .ifood-process-board,
.case-shell--ifood .ifood-authorial-photo {
  overflow: hidden;
  margin: 0;
  border: 1px solid var(--ifood-line);
  border-radius: var(--editorial-radius);
  background: var(--ifood-card);
  box-shadow: none;
}

.case-shell--ifood .ifood-copy-card {
  justify-content: flex-end;
  padding: clamp(32px, 4.15vw, 64px);
}

.case-shell--ifood .ifood-copy-card h2 {
  max-width: 15ch;
  margin: 0 0 clamp(28px, 2.45vw, 38px);
  font-size: clamp(32px, 3.3vw, 50px);
  line-height: 1.02;
}

.case-shell--ifood .ifood-copy-card > p:not(.ifood-chapter) {
  max-width: 50ch;
  color: #c5c5c0;
  font-size: clamp(16px, 1.18vw, 18px);
  line-height: 1.58;
}

.case-shell--ifood .ifood-copy-card > p + p:not(.ifood-chapter) {
  margin-top: 20px;
}

.case-shell--ifood .ifood-chapter {
  margin-bottom: clamp(22px, 2.25vw, 34px);
  color: #ff3341;
}

.case-shell--ifood .ifood-tile {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  clip-path: none;
  contain: none;
  isolation: isolate;
}

.case-shell--ifood .ifood-tile::after {
  display: none;
}

.case-shell--ifood .ifood-tile img,
.case-shell--ifood .ifood-tile video {
  min-width: 0;
  min-height: 0;
  border-radius: 0;
  object-fit: cover;
}

.case-shell--ifood .ifood-tile figcaption {
  position: static;
  z-index: auto;
  padding: 15px 19px 17px;
  border-top: 1px solid var(--ifood-line);
  background: var(--ifood-card);
  color: var(--ifood-caption);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .01em;
  line-height: 1.35;
}

.case-shell--ifood .ifood-bento--context {
  grid-template-areas:
    "copy facade"
    "copy tower";
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  grid-template-rows: 380px 380px;
}

.case-shell--ifood .ifood-bento--context .ifood-copy-card { grid-area: copy; }
.case-shell--ifood .ifood-tile--context-facade { grid-area: facade; }
.case-shell--ifood .ifood-tile--context-tower { grid-area: tower; }

.case-shell--ifood .ifood-bento--graphics {
  grid-template-areas:
    "render render render"
    "copy real detail";
  grid-template-columns: minmax(0, 6fr) minmax(0, 3.5fr) minmax(0, 2.5fr);
  grid-template-rows: auto clamp(520px, 42vw, 600px);
}

.case-shell--ifood .ifood-bento--graphics .ifood-copy-card { grid-area: copy; }
.case-shell--ifood .ifood-tile--graphics-render { grid-area: render; }
.case-shell--ifood .ifood-tile--graphics-real { grid-area: real; }
.case-shell--ifood .ifood-tile--graphics-detail { grid-area: detail; }

.case-shell--ifood .ifood-tile--graphics-render img,
.case-shell--ifood .ifood-tile--activation-render img {
  object-position: center;
}

.case-shell--ifood .ifood-tile--graphics-render {
  aspect-ratio: 16 / 9;
}

.case-shell--ifood .ifood-tile--graphics-real video {
  object-fit: cover;
  object-position: center;
  background: #0b0909;
}

.case-shell--ifood .ifood-tile--graphics-detail video {
  object-fit: cover;
}

.case-shell--ifood .ifood-object-editorial {
  overflow: visible;
}

.case-shell--ifood .ifood-object-copy {
  max-width: 830px;
}

.case-shell--ifood .ifood-object-copy h2 {
  max-width: 14ch;
  margin: 0 0 clamp(28px, 2.45vw, 38px);
  font-size: clamp(38px, 4.65vw, 70px);
  line-height: .98;
}

.case-shell--ifood .ifood-object-copy > p:not(.ifood-chapter) {
  max-width: 60ch;
  color: #c5c5c0;
  font-size: clamp(16px, 1.18vw, 18px);
  line-height: 1.58;
}

.case-shell--ifood .ifood-object-copy > p + p:not(.ifood-chapter) {
  margin-top: 20px;
}

.case-shell--ifood .ifood-character-parade {
  position: relative;
  width: min(100%, 1440px);
  margin: clamp(30px, 3vw, 48px) auto clamp(124px, 10vw, 160px);
  overflow: visible;
  aspect-ratio: 2 / 1;
  background: transparent;
  isolation: isolate;
}

.case-shell--ifood .ifood-character-parade::before {
  content: "";
  position: absolute;
  inset: 8% 4% 2%;
  z-index: 1;
  border-radius: 50%;
  background:
    radial-gradient(circle at 35% 52%, rgb(153 12 24 / 25%), transparent 38%),
    radial-gradient(circle at 76% 38%, rgb(103 8 17 / 16%), transparent 30%);
  filter: blur(28px);
  pointer-events: none;
}

.case-shell--ifood .ifood-float-item {
  --magnet-x: 0px;
  --magnet-y: 0px;
  position: absolute;
  z-index: 2;
  display: block;
  transform-origin: 50% 55%;
}

.case-shell--ifood .ifood-float-item img {
  display: block;
  width: 100%;
  height: auto;
  user-select: none;
  transform: translate3d(var(--magnet-x), var(--magnet-y), 0);
  transition: transform 220ms cubic-bezier(.22, 1, .36, 1);
}

.case-shell--ifood .ifood-canary--94 {
  top: 8%;
  left: 1%;
  width: 20%;
}

.case-shell--ifood .ifood-canary--70 {
  bottom: -8%;
  left: 22%;
  width: 32%;
}

.case-shell--ifood .ifood-canary--58 {
  top: 2%;
  left: 51%;
  width: 17%;
}

.case-shell--ifood .ifood-canary--02 {
  top: 5%;
  right: 0;
  width: 23%;
}

.case-shell--ifood .ifood-canary--62 {
  right: 18%;
  bottom: -6%;
  width: 22%;
}

.case-shell--ifood .ifood-product-float {
  z-index: 3;
}

.case-shell--ifood .ifood-product-float--headphones {
  bottom: -12%;
  left: 0;
  width: 22%;
}

.case-shell--ifood .ifood-product-float--glasses {
  top: -10%;
  left: 38%;
  width: 18%;
}

.case-shell--ifood .ifood-product-float--charms {
  right: 0;
  bottom: -12%;
  width: 21%;
}

.case-shell--ifood .ifood-blueprint-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(12px, 1.25vw, 20px);
  margin-top: clamp(26px, 3vw, 48px);
}

.case-shell--ifood .ifood-process-board {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  align-self: stretch;
}

.case-shell--ifood .ifood-process-board img {
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: 1.5 / 1;
  object-fit: contain;
  background: #f7f7f5;
}

.case-shell--ifood .ifood-process-board figcaption {
  padding: 16px 20px 18px;
  border-top: 1px solid var(--ifood-line);
  color: var(--ifood-caption);
  font-size: 12px;
  line-height: 1.45;
}

.case-shell--ifood .ifood-bento--activation {
  grid-template-areas:
    "copy copy copy copy copy render render render render render render render"
    "live live live station station station booth booth booth family family family"
    "circulation circulation circulation circulation circulation circulation circulation circulation circulation claw claw claw";
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-template-rows: 610px 540px 470px;
}

.case-shell--ifood .ifood-bento--activation .ifood-copy-card { grid-area: copy; }
.case-shell--ifood .ifood-tile--activation-render { grid-area: render; }
.case-shell--ifood .ifood-tile--activation-live { grid-area: live; }
.case-shell--ifood .ifood-tile--activation-station { grid-area: station; }
.case-shell--ifood .ifood-tile--activation-booth { grid-area: booth; }
.case-shell--ifood .ifood-tile--activation-family { grid-area: family; }
.case-shell--ifood .ifood-tile--activation-circulation { grid-area: circulation; }
.case-shell--ifood .ifood-tile--activation-claw { grid-area: claw; }

.case-shell--ifood .ifood-tile--activation-family img {
  object-position: center 34%;
}

.case-shell--ifood .ifood-tile--activation-circulation img {
  object-position: center 48%;
}

.case-shell--ifood .ifood-authorial-bento {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(12px, 1.25vw, 20px);
  align-items: stretch;
}

.case-shell--ifood .ifood-authorial-copy {
  min-height: 100%;
}

.case-shell--ifood .ifood-authorial-copy p:last-child {
  margin-bottom: 0;
}

.case-shell--ifood .ifood-authorial-photo {
  position: relative;
  aspect-ratio: 3 / 4;
}

.case-shell--ifood .ifood-authorial-photo--wide {
  grid-column: span 2;
  aspect-ratio: 4 / 3;
}

.case-shell--ifood .ifood-authorial-photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media (prefers-reduced-motion: no-preference) {
  .case-shell--ifood .ifood-canary--94,
  .case-shell--ifood .ifood-canary--58,
  .case-shell--ifood .ifood-product-float--headphones {
    animation: ifood-float-a 7.8s ease-in-out infinite;
  }

  .case-shell--ifood .ifood-canary--70,
  .case-shell--ifood .ifood-canary--02,
  .case-shell--ifood .ifood-product-float--glasses {
    animation: ifood-float-b 8.6s ease-in-out -2.2s infinite;
  }

  .case-shell--ifood .ifood-canary--62,
  .case-shell--ifood .ifood-product-float--charms {
    animation: ifood-float-c 7.2s ease-in-out -1.1s infinite;
  }
}

@keyframes ifood-float-a {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(-1.4deg); }
  50% { transform: translate3d(4px, -8px, 0) rotate(1deg); }
}

@keyframes ifood-float-b {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(1.1deg); }
  50% { transform: translate3d(-4px, 7px, 0) rotate(-1.2deg); }
}

@keyframes ifood-float-c {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(.8deg); }
  50% { transform: translate3d(5px, -6px, 0) rotate(-1.1deg); }
}

@media (max-width: 1099px) {
  .case-shell--ifood .ifood-bento--context,
  .case-shell--ifood .ifood-bento--graphics,
  .case-shell--ifood .ifood-bento--activation {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: none;
  }

  .case-shell--ifood .ifood-bento--context {
    grid-template-areas:
      "copy copy"
      "facade tower";
  }

  .case-shell--ifood .ifood-bento--graphics {
    grid-template-areas:
      "copy copy"
      "render render"
      "real detail";
  }

  .case-shell--ifood .ifood-bento--activation {
    grid-template-areas:
      "copy copy"
      "render render"
      "live station"
      "booth family"
      "circulation claw";
  }

  .case-shell--ifood .ifood-copy-card {
    min-height: 480px;
  }

  .case-shell--ifood .ifood-tile {
    min-height: 420px;
  }

  .case-shell--ifood .ifood-tile--graphics-render,
  .case-shell--ifood .ifood-tile--activation-render {
    aspect-ratio: 16 / 9;
  }

  .case-shell--ifood .ifood-tile--graphics-real video,
  .case-shell--ifood .ifood-tile--graphics-detail video {
    object-fit: contain;
  }

}

@media (max-width: 899px) {
  .case-shell--ifood .ifood-authorial-bento {
    grid-template-columns: minmax(0, 1fr);
  }

  .case-shell--ifood .ifood-authorial-copy {
    min-height: auto;
    padding: clamp(30px, 8vw, 48px);
  }

  .case-shell--ifood .ifood-authorial-photo--wide {
    grid-column: auto;
  }

  .case-shell--ifood .ifood-blueprint-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 767px) {
  .case-shell--ifood .case-title {
    max-width: 100%;
    font-size: clamp(40px, 12vw, 48px);
    line-height: .96;
    overflow-wrap: normal;
    text-wrap: wrap;
  }

  .case-shell--ifood .case-deck {
    max-width: 100%;
    margin-top: 24px;
    font-size: 18px;
    line-height: 1.35;
    overflow-wrap: anywhere;
    text-wrap: pretty;
  }

  .case-shell--ifood .ifood-section {
    margin-top: clamp(68px, 20vw, 96px);
  }

  .case-shell--ifood .ifood-bento--context,
  .case-shell--ifood .ifood-bento--graphics,
  .case-shell--ifood .ifood-bento--activation {
    grid-template-columns: minmax(0, 1fr);
  }

  .case-shell--ifood .ifood-bento--context {
    grid-template-areas: "copy" "facade" "tower";
  }

  .case-shell--ifood .ifood-bento--graphics {
    grid-template-areas: "copy" "render" "real" "detail";
  }

  .case-shell--ifood .ifood-bento--activation {
    grid-template-areas: "copy" "render" "live" "station" "booth" "family" "circulation" "claw";
  }

  .case-shell--ifood .ifood-copy-card {
    min-height: 0;
    padding: clamp(30px, 9vw, 42px);
  }

  .case-shell--ifood .ifood-copy-card h2 {
    margin-bottom: 28px;
    font-size: clamp(32px, 10vw, 44px);
  }

  .case-shell--ifood .ifood-tile {
    min-height: 0;
    aspect-ratio: auto;
  }

  .case-shell--ifood .ifood-tile > img,
  .case-shell--ifood .ifood-tile > video {
    height: auto;
    aspect-ratio: 4 / 5;
  }

  .case-shell--ifood .ifood-tile--context-facade > video,
  .case-shell--ifood .ifood-tile--context-tower > video,
  .case-shell--ifood .ifood-tile--graphics-render > img,
  .case-shell--ifood .ifood-tile--activation-render > img,
  .case-shell--ifood .ifood-tile--activation-circulation > img {
    aspect-ratio: 16 / 10;
  }

  .case-shell--ifood .ifood-tile--graphics-real > video {
    aspect-ratio: 4 / 5;
    object-fit: cover;
  }

  .case-shell--ifood .ifood-tile--graphics-detail > video {
    aspect-ratio: 9 / 16;
    object-fit: cover;
  }

  .case-shell--ifood .ifood-object-copy h2 {
    font-size: clamp(38px, 12vw, 52px);
  }

  .case-shell--ifood .ifood-character-parade {
    margin-top: 42px;
    margin-bottom: 72px;
    aspect-ratio: 4 / 5;
  }

  .case-shell--ifood .ifood-canary--94 {
    top: 5%;
    left: 0;
    width: 33%;
  }

  .case-shell--ifood .ifood-canary--70 {
    bottom: 1%;
    left: 1%;
    width: 48%;
  }

  .case-shell--ifood .ifood-canary--58 {
    top: 2%;
    left: 35%;
    width: 30%;
  }

  .case-shell--ifood .ifood-canary--02 {
    top: 18%;
    right: 0;
    width: 37%;
  }

  .case-shell--ifood .ifood-canary--62 {
    right: 0;
    bottom: 2%;
    width: 36%;
  }

  .case-shell--ifood .ifood-product-float--headphones {
    bottom: 29%;
    left: 0;
    width: 28%;
  }

  .case-shell--ifood .ifood-product-float--glasses {
    top: 1%;
    left: 68%;
    width: 29%;
  }

  .case-shell--ifood .ifood-product-float--charms {
    right: 0;
    bottom: 31%;
    width: 29%;
  }

  .case-shell--ifood .ifood-process-board img {
    height: auto;
  }

  .case-shell--ifood .ifood-authorial-photo,
  .case-shell--ifood .ifood-authorial-photo--wide {
    aspect-ratio: auto;
  }

  .case-shell--ifood .ifood-authorial-photo img {
    height: auto;
    aspect-ratio: auto;
    object-fit: contain;
  }
}

@media (prefers-reduced-motion: reduce) {
  .case-shell--ifood .ifood-float-item {
    animation: none !important;
  }

  .case-shell--ifood .ifood-float-item img {
    transform: none !important;
    transition: none !important;
  }
}