/* Einstein overrides on top of the shared case-study styles.
   Bigger headings and less text per block than the other case studies, plus
   the blocks that only exist here: stacked site captures, the Instagram grid
   and the anniversary pieces. */

:root{
  --accent:#1E8FD1;
  --accent-text:#116A9E;
  --accent-soft:#E8F4FC;
}

.cs-title{ font-size:clamp(34px, 5vw, 56px); line-height:1.1; }

.ei-note{
  text-align:center; max-width:520px; margin:10px auto 0; font-size:13.5px; color:var(--gray);
}
.ei-link-sep{ color:var(--line); margin:0 10px; }

/* A second statement further inside a section, so it does not compete with
   the one that opens it */
.cs-lead.ei-lead-sub{ font-size:clamp(21px,2.4vw,28px); margin-top:52px; }

/* The "before": a tall capture of the old site, capped so it stays a
   reference and does not take over the section */
.ei-old-site{ margin:36px auto 0; max-width:560px; }
.ei-old-site img{
  width:100%; display:block; border-radius:14px; border:1px solid var(--line); background:#fff;
  max-height:520px; object-fit:cover; object-position:top;
}
.ei-old-site figcaption{
  text-align:center; font-size:12px; font-weight:600; text-transform:uppercase;
  letter-spacing:.08em; color:var(--gray); margin-top:12px;
}

.ei-site-video{ margin:36px auto 0; max-width:var(--measure-wide); }
.ei-site-video video{
  width:100%; display:block; border-radius:14px; border:1px solid var(--line); background:#000;
}
.ei-site-video figcaption{ text-align:center; color:var(--gray); font-size:13.5px; margin-top:12px; }

/* Site captures, stacked full width so the pages stay readable */
.ei-site-shots{ display:flex; flex-direction:column; gap:28px; margin-top:44px; }
.ei-site-shots figure{ margin:0; }
.ei-site-shots img{
  width:100%; display:block; border-radius:14px; border:1px solid var(--line); background:#fff;
}
.ei-site-shots figcaption{ text-align:center; font-size:13px; color:var(--gray); margin-top:10px; }

/* Applications */
.ei-extras{ display:flex; flex-direction:column; gap:64px; margin-top:44px; }
.ei-extra h3{ margin:0 0 8px; font-size:24px; font-weight:600; color:var(--ink); text-align:center; }
.ei-extra > p{
  margin:0 auto; max-width:560px; font-size:16px; line-height:1.6; color:var(--ink-soft); text-align:center;
}
.ei-extra-note{
  margin:22px auto 0 !important; max-width:560px; font-size:15px; line-height:1.6;
  color:var(--ink-soft); text-align:center;
}

.ei-posts{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:26px; }
.ei-posts figure{ margin:0; }
.ei-posts img{
  width:100%; aspect-ratio:4/5; object-fit:cover; display:block;
  border-radius:12px; border:1px solid var(--line); background:#fff;
}
.ei-posts figcaption{ text-align:center; font-size:12.5px; color:var(--gray); margin-top:8px; }
@media (max-width:700px){ .ei-posts{ grid-template-columns:repeat(2,1fr); } }

.ei-pieces{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:26px; }
.ei-pieces figure{ margin:0; }
.ei-pieces figure.size-wide{ grid-column:span 3; }
.ei-pieces img{
  width:100%; display:block; border-radius:12px; border:1px solid var(--line); background:#fff;
}
.ei-pieces figure.size-sm img{ aspect-ratio:1; object-fit:cover; }
.ei-pieces figcaption{ text-align:center; font-size:12.5px; color:var(--gray); margin-top:8px; }
@media (max-width:700px){
  .ei-pieces{ grid-template-columns:1fr; }
  .ei-pieces figure.size-wide{ grid-column:span 1; }
}

/* A link with no URL yet: present, but clearly not clickable */
.cs-textlink.is-soon{ color:var(--gray); cursor:default; display:inline-flex; align-items:center; gap:8px; }
.cs-textlink-soon{
  font-size:10.5px; font-weight:600; text-transform:uppercase; letter-spacing:.08em;
  color:var(--accent-text); background:var(--accent-soft); border-radius:999px; padding:3px 8px;
}