/* AVENLO case repair — product colours, readable proof and deliberate depth. */
body.case-page.solo-concept-case--avenlo {
  --avenlo-ink: #062520;
  --avenlo-ink-2: #0c2220;
  --avenlo-panel: #0d302a;
  --avenlo-paper: #f8f5ef;
  --avenlo-mint: #56e3bd;
  --avenlo-coral: #ff704d;
  --solo-bg: #061a17;
  --solo-panel: #0a2723;
  --solo-panel-2: #0d302a;
  --solo-ink: #f8f5ef;
  --solo-muted: #aebdb8;
  --solo-accent: #56e3bd;
  --solo-signal: #ffb08f;
  --case-reading-surface: rgba(6, 26, 23, .98);
  --case-reading-card: rgba(248, 245, 239, .045);
  --case-reading-line: rgba(86, 227, 189, .28);
  --case-reading-accent: #56e3bd;
  --case-reading-ink: #f8f5ef;
  --case-reading-muted: #b8c5c1;
  background:
    radial-gradient(circle at 82% 7%, rgba(86, 227, 189, .07), transparent 28rem),
    radial-gradient(circle at 8% 38%, rgba(255, 112, 77, .035), transparent 30rem),
    #061a17;
  color: var(--avenlo-paper);
  font-family: "Avenir Next", "Segoe UI Variable Display", "Segoe UI", sans-serif;
}

body.case-page.solo-concept-case--avenlo .case-hero {
  background:
    linear-gradient(rgba(86, 227, 189, .025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(86, 227, 189, .025) 1px, transparent 1px),
    radial-gradient(circle at 26% 52%, rgba(86, 227, 189, .09), transparent 34%),
    #061a17;
  background-size: 84px 84px, 84px 84px, auto, auto;
}

/* The shared coherence layer previously painted the entire product capture
   mint at 78% opacity. Keep its geometry, replace only the colour wash. */
body.case-page.solo-concept-case--avenlo .case-hero-image::after {
  background:
    linear-gradient(90deg, rgba(6, 37, 32, .02), transparent 48%),
    linear-gradient(0deg, rgba(6, 26, 23, .2), transparent 46%) !important;
  border: 0 !important;
  content: "" !important;
  inset: 0 !important;
  height: auto !important;
  opacity: 1 !important;
  pointer-events: none;
  position: absolute;
  width: auto !important;
  z-index: 1;
}

/* Restore the portfolio's recognisable six-layer corner signature on both
   hero panels while keeping AVENLO's mint/coral product palette. */
body.case-page.solo-concept-case--avenlo .case-hero-image::before,
body.case-page.solo-concept-case--avenlo .case-hero-content::after {
  background:
    linear-gradient(135deg, transparent calc(50% - 2px), rgba(86,227,189,.96) calc(50% - 2px) calc(50% + 2px), transparent calc(50% + 2px)) top right / 38px 38px no-repeat,
    linear-gradient(135deg, transparent calc(50% - 2px), rgba(255,112,77,.96) calc(50% - 2px) calc(50% + 2px), transparent calc(50% + 2px)) bottom left / 38px 38px no-repeat,
    linear-gradient(90deg, rgba(86,227,189,.92), rgba(86,227,189,.18)) top right / 110px 3px no-repeat,
    linear-gradient(180deg, rgba(86,227,189,.92), rgba(86,227,189,.18)) top right / 3px 110px no-repeat,
    linear-gradient(270deg, rgba(255,112,77,.92), rgba(255,112,77,.18)) bottom left / 110px 3px no-repeat,
    linear-gradient(0deg, rgba(255,112,77,.92), rgba(255,112,77,.18)) bottom left / 3px 110px no-repeat !important;
  border: 0 !important;
  content: "" !important;
  height: auto !important;
  inset: 0 !important;
  pointer-events: none;
  position: absolute;
  width: auto !important;
  z-index: 4;
}

body.case-page.solo-concept-case--avenlo .case-hero-image > img {
  filter: brightness(1.08) saturate(1.06) contrast(1.04) !important;
}

body.case-page.solo-concept-case--avenlo .case-hero-content {
  background:
    radial-gradient(circle at 92% 8%, rgba(86, 227, 189, .08), transparent 34%),
    linear-gradient(145deg, rgba(13, 48, 42, .99), rgba(5, 20, 18, .995)) !important;
  overflow: hidden !important;
}

body.case-page.solo-concept-case--avenlo .case-hero-content::before {
  background: linear-gradient(180deg, #56e3bd, #56e3bd 58%, #ff704d) !important;
  box-shadow: 0 0 24px rgba(86, 227, 189, .18);
  opacity: 1 !important;
}

body.case-page.solo-concept-case--avenlo .case-hero-content h1,
body.case-page.solo-concept-case--avenlo .solo-section h2,
body.case-page.solo-concept-case--avenlo .solo-section h3,
body.case-page.solo-concept-case--avenlo .solo-strip strong {
  font-family: "Avenir Next", "Segoe UI Variable Display", "Segoe UI", sans-serif;
}

body.case-page.solo-concept-case--avenlo .case-hero-content h1 {
  color: #f8f5ef !important;
  -webkit-text-stroke: .014em rgba(248, 245, 239, .72) !important;
  text-shadow: 2px 3px 0 rgba(0, 0, 0, .46), 0 16px 30px rgba(0, 0, 0, .22) !important;
}

body.case-page.solo-concept-case--avenlo .solo-mark img {
  filter: drop-shadow(0 8px 20px rgba(0, 0, 0, .22));
}

body.case-page.solo-concept-case--avenlo .live-lab-launchpad {
  background:
    radial-gradient(circle at 13% 10%, rgba(86, 227, 189, .17), transparent 30rem),
    linear-gradient(145deg, #0b2924, #050a09 72%) !important;
  border-color: rgba(86, 227, 189, .54) !important;
  box-shadow: 0 30px 90px rgba(0, 0, 0, .28), inset 0 1px 0 rgba(248, 245, 239, .06);
}

body.case-page.solo-concept-case--avenlo .live-lab-signals article {
  background: rgba(5, 14, 12, .9) !important;
  border-color: rgba(86, 227, 189, .15) !important;
}

body.case-page.solo-concept-case--avenlo .live-lab-signals article:nth-child(2) {
  background: rgba(13, 48, 42, .82) !important;
}

body.case-page.solo-concept-case--avenlo .live-lab-button--primary {
  background: #56e3bd !important;
  border-color: #56e3bd !important;
  color: #062520 !important;
}

body.case-page.solo-concept-case--avenlo .solo-strip {
  background: rgba(12, 34, 32, .84);
  border-block-color: rgba(86, 227, 189, .18);
}

body.case-page.solo-concept-case--avenlo .solo-kpis,
body.case-page.solo-concept-case--avenlo .solo-flow {
  border-color: rgba(86, 227, 189, .2);
  background: rgba(86, 227, 189, .14);
}

body.case-page.solo-concept-case--avenlo .solo-kpis article,
body.case-page.solo-concept-case--avenlo .solo-flow article {
  background:
    linear-gradient(150deg, rgba(86, 227, 189, .045), transparent 45%),
    #0a2723;
}

body.case-page.solo-concept-case--avenlo .solo-kpis article:nth-child(4),
body.case-page.solo-concept-case--avenlo .solo-flow article:nth-child(4) {
  background:
    linear-gradient(150deg, rgba(255, 112, 77, .075), transparent 48%),
    #0a2723;
}

body.case-page.solo-concept-case--avenlo .solo-media-story {
  border-color: rgba(86, 227, 189, .22);
  background: rgba(86, 227, 189, .16);
}

body.case-page.solo-concept-case--avenlo .solo-media-story__visual {
  aspect-ratio: 41 / 52;
  background:
    radial-gradient(circle at 50% 28%, rgba(86, 227, 189, .08), transparent 48%),
    #061a17;
  min-height: 0;
}

body.case-page.solo-concept-case--avenlo .solo-media-story__visual img {
  object-fit: contain;
}

body.case-page.solo-concept-case--avenlo .avenlo-brand-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(14px, 1.7vw, 26px);
}

body.case-page.solo-concept-case--avenlo .avenlo-brand-grid figure {
  aspect-ratio: 16 / 9;
  border: 1px solid rgba(86, 227, 189, .2);
  min-height: 0;
}

body.case-page.solo-concept-case--avenlo .avenlo-brand-grid figure:nth-child(2),
body.case-page.solo-concept-case--avenlo .avenlo-brand-grid figure:nth-child(4) {
  border-color: rgba(255, 112, 77, .24);
}

body.case-page.solo-concept-case--avenlo .avenlo-brand-grid figcaption {
  background: linear-gradient(transparent, rgba(2, 18, 15, .96));
  color: #f8f5ef;
}

body.case-page.solo-concept-case--avenlo .solo-launch {
  background:
    radial-gradient(circle at 88% 10%, rgba(255, 112, 77, .09), transparent 30%),
    linear-gradient(125deg, #0d302a, #081f1c);
  border-color: rgba(86, 227, 189, .28);
}

body.case-page.solo-concept-case--avenlo .solo-launch__actions a:first-child:hover,
body.case-page.solo-concept-case--avenlo .solo-launch__actions a:first-child:focus-visible,
body.case-page.solo-concept-case--avenlo .live-lab-button--primary:hover,
body.case-page.solo-concept-case--avenlo .live-lab-button--primary:focus-visible {
  background: #ff704d !important;
  border-color: #ff704d !important;
  color: #062520 !important;
}

@media (max-width: 980px) {
  body.case-page.solo-concept-case--avenlo .avenlo-brand-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 680px) {
  body.case-page.solo-concept-case--avenlo .solo-media-story__visual {
    aspect-ratio: 41 / 52;
    min-height: 0 !important;
  }

  body.case-page.solo-concept-case--avenlo .avenlo-brand-grid figure {
    aspect-ratio: 16 / 9;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.case-page.solo-concept-case--avenlo .avenlo-brand-grid img {
    transition: none;
  }
}