body[data-zyel-garden-refined] {
  --accent: #92c73e;
  --accent-dark: #4d741c;
  isolation: isolate;
}

body[data-zyel-garden-refined] > .zyel-dot-field {
  z-index: 0;
  opacity: .4;
  mask-image: linear-gradient(to right, #000, transparent max(1rem, calc((100vw - 1280px) / 2)), transparent calc(100% - max(1rem, calc((100vw - 1280px) / 2))), #000);
}

body[data-zyel-garden-refined] main {
  position: relative;
  z-index: 1;
}

body[data-zyel-garden-refined] .hero-garden {
  background-image: linear-gradient(90deg, rgba(9,10,13,.97), rgba(9,10,13,.87) 58%, rgba(9,10,13,.78)), url('/assets/img/case-studies/togoeo/togogarden-storefront-archive.jpg');
}

body[data-zyel-garden-refined] .hero-inner {
  min-height: 620px;
  grid-template-columns: minmax(0, 1.6fr) minmax(240px, .6fr);
  gap: 3.5rem;
  padding: 150px 0 64px;
}

body[data-zyel-garden-refined] .hero h1 {
  max-width: 20ch;
  font-size: clamp(3rem, 5.2vw, 5.4rem);
  line-height: 1.04;
  letter-spacing: -.04em;
}

body[data-zyel-garden-refined] .hero-lede {
  max-width: 64ch;
  margin-top: 1.5rem;
  color: #e2e4e8;
  font-size: 1.125rem;
  line-height: 1.65;
}

body[data-zyel-garden-refined] .facts { padding-top: 1.5rem; padding-bottom: 1.5rem; }
body[data-zyel-garden-refined] .fact strong { font-size: 1rem; line-height: 1.5; }
body[data-zyel-garden-refined] .facts .fact { min-width: 0; padding-right: 1.5rem; }
body[data-zyel-garden-refined] .case-overview { padding-top: 4.5rem; padding-bottom: 4rem; }
body[data-zyel-garden-refined] .case-overview-inner { gap: 3.5rem; align-items: center; }

body[data-zyel-garden-refined] .case-overview h2,
body[data-zyel-garden-refined] .case-copy h2,
body[data-zyel-garden-refined] .case-related-heading h2 {
  max-width: 25ch;
  font-size: clamp(2rem, 3.2vw, 3rem);
  line-height: 1.13;
  letter-spacing: -.03em !important;
  text-wrap: pretty;
}

body[data-zyel-garden-refined] .case-overview-lede { font-size: 1.0625rem; line-height: 1.7; }
body[data-zyel-garden-refined] .case-overview-meta { margin-top: 1.5rem; }
body[data-zyel-garden-refined] .case-overview-meta dt { color: #656970; }
body[data-zyel-garden-refined] .case-overview-visual { width: 100%; max-width: 34rem; justify-self: end; }
body[data-zyel-garden-refined] .case-overview-frame { box-shadow: 0 16px 36px rgba(9,10,13,.12); background: #15171b; }
body[data-zyel-garden-refined] .case-overview-frame img { max-height: 520px; }

body[data-zyel-garden-refined] .case-overview-frame figcaption {
  display: block;
  padding: .8rem 1rem;
  color: #4c5058;
  background: #fbfaf6;
  font-size: .8125rem;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0;
  text-transform: none;
}

body[data-zyel-garden-refined] .case-tech-stack { margin-top: 2.5rem; }
body[data-zyel-garden-refined] .case-layout { padding-top: 4rem; padding-bottom: 4rem; gap: 3.5rem !important; }
body[data-zyel-garden-refined] .case-copy h2 { margin-bottom: 1.5rem; }
body[data-zyel-garden-refined] .case-copy p { max-width: 68ch; font-size: 1.0625rem; line-height: 1.75; }
body[data-zyel-garden-refined] .case-copy .lead { font-size: 1.1875rem; line-height: 1.65; }
body[data-zyel-garden-refined] .case-rail-frame { box-shadow: none; }
body[data-zyel-garden-refined] .case-rail-frame img { max-height: 360px; object-fit: contain; }
body[data-zyel-garden-refined] .case-rail-frame figcaption strong { font-size: .8125rem; line-height: 1.45; }
body[data-zyel-garden-refined] .case-rail-frame figcaption span { color: #b9bdc5; font-size: .6875rem; }

body[data-zyel-garden-refined] .case-copy .work-grid { margin-top: 2rem; }
body[data-zyel-garden-refined] .case-copy .work-item {
  min-height: 0;
  grid-template-columns: 2rem minmax(150px, .65fr) minmax(0, 1.35fr);
  gap: 1.25rem;
  padding: 1.5rem 0;
}
body[data-zyel-garden-refined] .case-copy .work-item span { margin: .2rem 0 0; }
body[data-zyel-garden-refined] .case-copy .work-item h3 { font-size: 1.25rem; line-height: 1.35; }
body[data-zyel-garden-refined] .case-copy .work-item p { margin: 0; font-size: 1rem; line-height: 1.65; }

body[data-zyel-garden-refined] .result-list { margin-top: 1.75rem; }
body[data-zyel-garden-refined] .result-list li { display: flex; align-items: flex-start; gap: .75rem; padding: 1rem 0; font-size: 1.0625rem; line-height: 1.6; }
body[data-zyel-garden-refined] .result-list li::before { content: none; }
body[data-zyel-garden-refined] .zyel-garden-symbol { width: 1.25rem; height: 1.25rem; flex: 0 0 auto; margin-top: .2rem; vertical-align: middle; }
body[data-zyel-garden-refined] .result-list .zyel-garden-symbol { color: #4d741c; }
body[data-zyel-garden-refined] .evidence-note { margin-top: 1.75rem; }
body[data-zyel-garden-refined] .evidence-note p { margin-bottom: 0; font-size: .9375rem; line-height: 1.7; }
body[data-zyel-garden-refined] .case-related { padding-top: 4rem; padding-bottom: 4rem; }
body[data-zyel-garden-refined] .case-related-copy { min-height: 165px; }
body[data-zyel-garden-refined] .case-related-copy b { display: inline-flex; align-items: center; gap: .5rem; }
body[data-zyel-garden-refined] .case-related-copy b i { display: inline-flex; }
body[data-zyel-garden-refined] .case-related-copy b .zyel-garden-symbol { width: 1rem; height: 1rem; margin-top: 0; }
body[data-zyel-garden-refined] main > .cta { padding-top: 4rem; padding-bottom: 4rem; }
body[data-zyel-garden-refined] main > .cta h2 { max-width: 24ch; font-size: clamp(2.25rem, 4vw, 3.5rem); line-height: 1.12; letter-spacing: -.03em; }
body[data-zyel-garden-refined] main a:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
body[data-zyel-garden-refined] main h1,
body[data-zyel-garden-refined] main h2 { scroll-margin-top: 6rem; }

@media (max-width: 1080px) {
  body[data-zyel-garden-refined] > .zyel-dot-field { display: none; }
  body[data-zyel-garden-refined] .hero-inner { grid-template-columns: 1fr; gap: 2rem; min-height: 0; }
  body[data-zyel-garden-refined] .hero h1 { max-width: 22ch; }
  body[data-zyel-garden-refined] .hero-aside { max-width: 38rem; }
  body[data-zyel-garden-refined] .case-overview-visual { justify-self: start; max-width: 38rem; }
}

@media (max-width: 900px) {
  body[data-zyel-garden-refined] .case-layout { gap: 2rem !important; }
  body[data-zyel-garden-refined] .case-visual-rail { max-width: 34rem; }
  body[data-zyel-garden-refined] .case-copy .work-item { grid-template-columns: 2rem minmax(0, 1fr); gap: .5rem 1rem; }
  body[data-zyel-garden-refined] .case-copy .work-item p { grid-column: 2; }
}

@media (max-width: 560px) {
  body[data-zyel-garden-refined] .hero-garden { background-image: linear-gradient(rgba(9,10,13,.94), rgba(9,10,13,.88)), url('/assets/img/case-studies/togoeo/togogarden-storefront-archive.jpg'); }
  body[data-zyel-garden-refined] .hero-inner { padding: 116px 0 44px; }
  body[data-zyel-garden-refined] .hero h1 { font-size: clamp(2.25rem, 9.5vw, 3.1rem); line-height: 1.1; }
  body[data-zyel-garden-refined] .hero-lede { font-size: 1rem; margin-top: 1.25rem; }
  body[data-zyel-garden-refined] .hero-aside strong { font-size: 1rem; }
  body[data-zyel-garden-refined] .case-overview { padding-top: 2.5rem; padding-bottom: 2.5rem; }
  body[data-zyel-garden-refined] .case-overview-inner { gap: 2rem; }
  body[data-zyel-garden-refined] .case-overview h2,
  body[data-zyel-garden-refined] .case-copy h2,
  body[data-zyel-garden-refined] .case-related-heading h2 { font-size: 1.875rem; line-height: 1.18; }
  body[data-zyel-garden-refined] .case-layout { padding-top: 2.75rem; padding-bottom: 2.75rem; }
  body[data-zyel-garden-refined] .case-copy p { font-size: 1rem; line-height: 1.7; }
  body[data-zyel-garden-refined] .case-copy .lead { font-size: 1.0625rem; }
  body[data-zyel-garden-refined] .case-overview-frame figcaption { padding: .7rem .8rem; }
  body[data-zyel-garden-refined] .case-rail-frame img { max-height: 320px; }
  body[data-zyel-garden-refined] .case-related,
  body[data-zyel-garden-refined] main > .cta { padding-top: 2.75rem; padding-bottom: 2.75rem; }
  body[data-zyel-garden-refined] main > .cta h2 { font-size: 2rem; }
}

@media (prefers-reduced-motion: reduce) {
  body[data-zyel-garden-refined] .case-related-story,
  body[data-zyel-garden-refined] .case-related-copy b i { transition: none; transform: none; }
}