/* Bee Proof Theatre 6.0: proof-led premium case system. */
:root {
  --proof-night: #130e16;
  --proof-plum: #211522;
  --proof-plum-raised: #2b1b2b;
  --proof-cream: #fff8ea;
  --proof-muted: #d6cad3;
  --proof-honey: #ffc928;
  --proof-amber: #f39a25;
  --proof-line: rgba(255,255,255,.14);
}

.atl-section--cases {
  position: relative;
  overflow: clip;
  background:
    radial-gradient(circle at 84% 8%, rgba(255,201,40,.09), transparent 25rem),
    radial-gradient(circle at 7% 45%, rgba(243,154,37,.055), transparent 26rem),
    var(--proof-night);
}
.atl-section--cases::before {
  position: absolute;
  inset: 0;
  opacity: .11;
  background-image: linear-gradient(rgba(255,255,255,.12) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.12) 1px, transparent 1px);
  background-size: 5rem 5rem;
  mask-image: linear-gradient(to bottom, #000, transparent 34rem);
  pointer-events: none;
  content: "";
}
.atl-section--cases > .atl-shell { position: relative; z-index: 1; }
.atl-section--cases .atl-section-head h2 { max-width: 13ch; }

.atl-case-assurance {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin: 0 0 2rem;
  border-top: 1px solid var(--proof-line);
  border-bottom: 1px solid var(--proof-line);
}
.atl-case-assurance > div { min-height: 7.5rem; padding: 1.5rem 1.75rem; border-right: 1px solid var(--proof-line); }
.atl-case-assurance > div:last-child { border-right: 0; }
.atl-case-assurance strong, .atl-case-assurance span { display: block; }
.atl-case-assurance strong { color: var(--proof-cream); font-size: 1.12rem; }
.atl-case-assurance span { margin-top: .4rem; color: var(--proof-muted); font-size: .86rem; }

.atl-case {
  position: relative;
  isolation: isolate;
  border-color: var(--proof-line);
  border-radius: clamp(1.25rem, 2.3vw, 2rem);
  background: linear-gradient(145deg, var(--proof-plum-raised), var(--proof-plum));
  box-shadow: inset 0 1px rgba(255,255,255,.06), 0 2.2rem 5rem rgba(0,0,0,.18);
  transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease;
}
.atl-case::before {
  position: absolute;
  z-index: 3;
  top: 0;
  right: 2rem;
  left: 2rem;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,201,40,.8), transparent);
  opacity: .55;
  pointer-events: none;
  content: "";
}
.atl-case:hover { border-color: rgba(255,201,40,.65); box-shadow: 0 3rem 7rem rgba(0,0,0,.34); transform: translateY(-4px); }
.atl-case__image { isolation: isolate; }
.atl-case__image::before {
  position: absolute;
  z-index: 1;
  inset: 0;
  background: linear-gradient(125deg, rgba(19,14,22,.08), transparent 45%), linear-gradient(to top, rgba(19,14,22,.68), transparent 52%);
  content: "";
}
.atl-case__image::after { z-index: 1; background: radial-gradient(circle at 75% 20%, transparent 28%, rgba(19,14,22,.24)); }
.atl-case__image img { filter: saturate(.92) contrast(1.03); transition: filter .6s ease, transform .8s cubic-bezier(.2,.7,.2,1); }
.atl-case:hover .atl-case__image img { filter: saturate(1.03) contrast(1.04); transform: scale(1.035); }
.atl-case__image > span { top: 1.25rem; right: auto; bottom: auto; left: 1.25rem; border-color: rgba(255,255,255,.24); background: rgba(19,14,22,.58); font-family: Inter, sans-serif; letter-spacing: .04em; backdrop-filter: blur(16px); }
.atl-case__number { position: absolute; z-index: 2; right: 1.4rem; bottom: -.08em; color: rgba(255,248,234,.7); font-family: Manrope, sans-serif; font-size: clamp(5rem, 10vw, 9rem); font-weight: 760; line-height: .8; letter-spacing: -.08em; text-shadow: 0 .6rem 2rem rgba(0,0,0,.45); }

.atl-case__body { min-height: 31rem; padding: clamp(1.75rem, 3.4vw, 3.25rem); }
.atl-case__meta { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.atl-case__meta .atl-case__tag { max-width: 29rem; margin: 0; color: #f8d977; font-family: Inter, sans-serif; letter-spacing: .065em; }
.atl-case__verified { display: inline-flex; min-height: 1.8rem; align-items: center; gap: .45rem; padding: 0 .7rem; border: 1px solid rgba(255,201,40,.34); border-radius: 99rem; color: #ffe598; font-size: .68rem; font-weight: 780; white-space: nowrap; }
.atl-case__verified::before { width: .42rem; height: .42rem; border-radius: 50%; background: var(--proof-honey); box-shadow: 0 0 1rem rgba(255,201,40,.8); content: ""; }
.atl-case__body h3 { max-width: 19ch; margin: clamp(1.25rem, 2.4vw, 2.2rem) 0 1rem; color: var(--proof-cream); font-size: clamp(1.85rem, 3.1vw, 3rem); line-height: 1.02; letter-spacing: -.045em; text-wrap: balance; }
.atl-case:first-child h3 { max-width: 13ch; font-size: clamp(2.5rem, 4vw, 4.1rem); }
.atl-case__body > .atl-case__summary { max-width: 58ch; margin-bottom: 1.4rem; color: var(--proof-muted); font-size: clamp(.98rem, 1.35vw, 1.08rem); line-height: 1.65; }

.atl-case__facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; margin: 1rem 0 1.3rem; border-top: 1px solid var(--proof-line); border-bottom: 1px solid var(--proof-line); }
.atl-case__facts span, .atl-case:first-child .atl-case__facts span { display: flex; min-height: 4.25rem; align-items: center; padding: .8rem 1rem; border-right: 1px solid var(--proof-line); border-radius: 0; background: transparent; color: var(--proof-cream); font-size: .77rem; font-weight: 700; line-height: 1.35; }
.atl-case__facts span:first-child { padding-left: 0; }
.atl-case__facts span:last-child { padding-right: 0; border-right: 0; }

.atl-case__proof { display: grid; grid-template-columns: 3rem 1fr; gap: 1rem; align-items: start; padding: 1.1rem; margin-top: auto; border: 1px solid rgba(255,255,255,.1); border-radius: 1rem; background: rgba(255,248,234,.055); box-shadow: inset 0 1px rgba(255,255,255,.05); }
.atl-case__proof-mark { display: grid; width: 3rem; height: 3rem; place-items: center; border: 1px solid rgba(255,201,40,.38); border-radius: 50%; background: rgba(255,201,40,.11); }
.atl-case__proof-mark img { width: 1.75rem; height: 1.75rem; object-fit: contain; filter: drop-shadow(0 .35rem .7rem rgba(0,0,0,.35)); }
.atl-case__proof p { margin: 0 0 .35rem; color: #f1c85c; font-size: .65rem; font-weight: 760; letter-spacing: .075em; text-transform: uppercase; }
.atl-case__proof strong, .atl-case__proof small { display: block; }
.atl-case__proof strong { color: var(--proof-cream); font-size: .82rem; line-height: 1.45; }
.atl-case__proof small { margin-top: .4rem; color: var(--proof-muted); font-size: .75rem; line-height: 1.6; }

.atl-case__link { align-items: center; padding-top: 1.15rem; margin-top: 1.15rem; border-top: 0; color: var(--proof-cream); font-size: .92rem; }
.atl-case__link i { display: grid; width: 2.75rem; height: 2.75rem; place-items: center; border: 1px solid rgba(255,201,40,.42); border-radius: 50%; color: var(--proof-honey); font-style: normal; transition: background .25s ease, color .25s ease, transform .25s ease; }
.atl-case__link:hover i, .atl-case__link:focus-visible i { background: var(--proof-honey); color: var(--proof-night); transform: rotate(45deg); }
.atl-case__link:focus-visible { outline: 2px solid var(--proof-honey); outline-offset: .35rem; }

.atl-case-library-link { margin-top: 1.5rem; border-radius: clamp(1.25rem, 2.3vw, 2rem); background: linear-gradient(110deg, #ffd85c, var(--proof-honey)); box-shadow: 0 2.5rem 6rem rgba(0,0,0,.24); }

/* Shared case library */
.case-library__grid { grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 1.25rem; }
.case-tile { position: relative; grid-column: span 6; border-color: rgba(34,23,35,.18); border-radius: 1.6rem; background: linear-gradient(145deg, var(--proof-plum-raised), var(--proof-plum)); color: var(--proof-cream); box-shadow: 0 1.8rem 4.5rem rgba(30,18,29,.12); }
.case-tile:nth-child(4n+1), .case-tile:nth-child(4n) { grid-column: span 7; }
.case-tile:nth-child(4n+2), .case-tile:nth-child(4n+3) { grid-column: span 5; }
.case-tile:hover, .case-tile:focus-visible { border-color: rgba(255,201,40,.72); box-shadow: 0 2.8rem 6rem rgba(30,18,29,.24); transform: translateY(-4px); }
.case-tile:focus-visible { outline: 3px solid var(--proof-honey); outline-offset: .25rem; }
.case-tile figure { isolation: isolate; }
.case-tile figure::after { z-index: 1; background: linear-gradient(to top, rgba(19,14,22,.72), transparent 55%), radial-gradient(circle at 80% 15%, transparent 25%, rgba(19,14,22,.25)); }
.case-tile figure img { filter: saturate(.92) contrast(1.03); }
.case-tile:hover figure img { filter: saturate(1.04); transform: scale(1.035); }
.case-tile__number { position: absolute; z-index: 2; right: 1.2rem; bottom: -.08em; color: rgba(255,248,234,.72); font: 760 clamp(5rem, 9vw, 8rem)/.8 Manrope, sans-serif; letter-spacing: -.08em; }
.case-tile__body { min-height: 31rem; }
.case-tile__body > p:first-child { justify-content: space-between; color: #f7d472; font-family: Inter, sans-serif; }
.case-tile__body > p:first-child > span { color: #f7d472; }
.case-tile__body > p:first-child i { display: inline-flex; align-items: center; gap: .4rem; color: #ffe598; font-style: normal; }
.case-tile__body > p:first-child i::before { width: .4rem; height: .4rem; border-radius: 50%; background: var(--proof-honey); content: ""; }
.case-tile h3 { max-width: 17ch; margin-bottom: 1.2rem; color: var(--proof-cream); }
.case-tile__body > p.case-tile__summary { display: block; max-width: 54ch; margin-bottom: 1.4rem; color: var(--proof-muted); font: 400 1rem/1.65 Inter, sans-serif; letter-spacing: normal; text-transform: none; }
.case-tile__facts { gap: 0; border-top: 1px solid var(--proof-line); border-bottom: 1px solid var(--proof-line); }
.case-tile__facts span { flex: 1 1 50%; min-height: 3.7rem; padding: .75rem; border-right: 1px solid var(--proof-line); border-radius: 0; background: transparent; color: var(--proof-cream); line-height: 1.35; }
.case-tile__facts span:first-child { padding-left: 0; }
.case-tile__facts span:last-child { padding-right: 0; border-right: 0; }
.case-tile__source { display: grid; gap: .35rem; padding: 1rem; margin: 1rem 0 0; border: 1px solid rgba(255,255,255,.1); border-radius: .9rem; background: rgba(255,248,234,.055); }
.case-tile__source span { color: #f1c85c; font-size: .62rem; font-weight: 780; letter-spacing: .07em; text-transform: uppercase; }
.case-tile__source strong { color: var(--proof-cream); font-size: .77rem; line-height: 1.45; }
.case-tile strong.case-tile__action { align-items: center; border-top-color: var(--proof-line); color: var(--proof-cream); font-size: .92rem; }
.case-tile__action i { display: grid; width: 2.7rem; height: 2.7rem; place-items: center; border: 1px solid rgba(255,201,40,.4); border-radius: 50%; color: var(--proof-honey); font-style: normal; }

.case-study__proof { padding: 1.6rem; border-color: var(--proof-line); border-radius: 1.25rem; background: linear-gradient(145deg, rgba(255,248,234,.08), rgba(255,248,234,.035)); }
.case-study__proof-head { display: flex !important; align-items: center; gap: .8rem !important; margin-bottom: 1rem; }
.case-study__proof-head > span { display: grid; width: 2.4rem; height: 2.4rem; place-items: center; border: 1px solid rgba(255,201,40,.38); border-radius: 50%; background: rgba(255,201,40,.11); }
.case-study__proof-head img { width: 1.35rem; height: 1.35rem; }
.case-study__proof-head p { margin: 0; color: #f1c85c; font-size: .67rem; font-weight: 780; letter-spacing: .07em; text-transform: uppercase; }

@media (max-width: 900px) {
  .atl-case-assurance { grid-template-columns: 1fr; }
  .atl-case-assurance > div { min-height: auto; border-right: 0; border-bottom: 1px solid var(--proof-line); }
  .atl-case-assurance > div:last-child { border-bottom: 0; }
  .case-library__grid { grid-template-columns: 1fr; }
  .case-tile, .case-tile:nth-child(n) { grid-column: 1; }
}
@media (max-width: 650px) {
  .atl-case__body { min-height: auto; padding: 1.5rem; }
  .atl-case__meta { align-items: flex-start; }
  .atl-case__verified { min-height: 1.65rem; padding-inline: .55rem; font-size: .62rem; }
  .atl-case__facts { grid-template-columns: 1fr; }
  .atl-case__facts span, .atl-case:first-child .atl-case__facts span { min-height: auto; padding: .75rem 0; border-right: 0; border-bottom: 1px solid var(--proof-line); font-size: .8rem; }
  .atl-case__facts span:last-child { border-bottom: 0; }
  .atl-case__proof { grid-template-columns: 2.6rem 1fr; padding: .9rem; }
  .atl-case__proof-mark { width: 2.6rem; height: 2.6rem; }
  .atl-case__proof-mark img { width: 1.45rem; height: 1.45rem; }
  .atl-case__number { font-size: 5.4rem; }
  .case-tile__body { min-height: auto; padding: 1.4rem; }
  .case-tile__summary { font-size: .94rem; }
}
@media (prefers-reduced-motion: reduce) {
  .atl-case, .atl-case__image img, .atl-case__link i, .case-tile, .case-tile figure img { transition: none; }
  .atl-case:hover, .case-tile:hover { transform: none; }
}