/* Recipient sites and their thumbnails use the same design tokens. */
.folio {
  --sheet: #fff5df;
  --fg: #352822;
  --accent: #a63321;
  --tile: #f3d778;
  --hair: color-mix(in srgb, var(--fg) 30%, var(--sheet));
  --display: Arial, Helvetica, sans-serif;
  color: var(--fg);
  background: var(--sheet);
  font-family: Arial, Helvetica, sans-serif;
  overflow-wrap: anywhere;
  isolation: isolate;
}
.palette-midnight {
  --sheet: #141619;
  --fg: #f7f1dc;
  --accent: #ece993;
  --tile: #323c41;
}
.palette-paper {
  --sheet: #f5f1e8;
  --fg: #302c28;
  --accent: #83503c;
  --tile: #e0d4bd;
}
.palette-moss {
  --sheet: #e9eddf;
  --fg: #21372c;
  --accent: #355d36;
  --tile: #c6d49e;
}
.palette-cobalt {
  --sheet: #e6ecff;
  --fg: #162852;
  --accent: #1f46bc;
  --tile: #bccaf2;
}
.palette-plum {
  --sheet: #292034;
  --fg: #fbecff;
  --accent: #edb4ff;
  --tile: #544062;
}
.palette-rose {
  --sheet: #ffefed;
  --fg: #4c242b;
  --accent: #942a50;
  --tile: #fac6c8;
}
.palette-ochre {
  --sheet: #f8ead1;
  --fg: #382c1b;
  --accent: #78501d;
  --tile: #e2bd70;
}
.face-serif {
  --display: Georgia, "Times New Roman", serif;
}
.face-mono {
  --display: ui-monospace, SFMono-Regular, monospace;
}
body.site-recipient > header {
  display: none;
}
body.site-recipient main {
  max-width: none;
  padding: 0;
}
body.site-recipient footer {
  margin-top: 0;
}
.full-site {
  container-type: inline-size;
  padding: 0 clamp(18px, 5vw, 88px);
}
.folio :is(h1, h2, h3, p, figure) {
  margin: 0;
  color: var(--fg);
}
.folio :is(h1, h2, h3) {
  font-family: var(--display);
  line-height: 1.01;
}
.folio h1 {
  font-size: clamp(45px, 7.8cqw, 124px);
  letter-spacing: -0.078em;
  font-weight: 800;
}
.folio h2 {
  font-size: clamp(34px, 5cqw, 78px);
  letter-spacing: -0.06em;
  font-weight: 650;
}
.folio h3 {
  font-size: clamp(28px, 3.8cqw, 56px);
  letter-spacing: -0.045em;
  font-weight: 620;
}
.folio h1 em {
  font-style: normal;
  color: var(--accent);
}
.folio p {
  font-size: clamp(15px, 1.55cqw, 21px);
  line-height: 1.52;
}
.folio :is(a, button) {
  color: inherit;
}
.folio a:focus-visible {
  outline-color: var(--accent);
}
.folio-mast,
.folio-end,
.folio-issue,
.folio-register,
.folio-meta,
.folio-mini-nav,
.folio-mini-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.folio-mast {
  padding: 21px 0;
  border-bottom: 1px solid var(--hair);
}
.folio-name,
.folio-end strong {
  font: bold clamp(18px, 2.1cqw, 34px) / 1 var(--display);
  letter-spacing: -0.055em;
  text-decoration: none;
}
.folio-name i {
  font-style: normal;
  color: var(--accent);
  padding-left: 0.15em;
}
.folio-mast nav {
  font: 600 14px Arial;
  text-transform: none;
  letter-spacing: 0;
}
.folio-mast nav a {
  text-decoration: none;
}
.folio-contact,
.folio-cta {
  display: inline-flex;
  padding: 10px 16px;
  background: var(--fg);
  color: var(--sheet) !important;
  border-radius: 40px;
  text-decoration: none;
  font-weight: 700;
  font-size: 14px;
}
.folio-kicker,
.folio-meta,
.folio-issue,
.folio-marquee,
.folio-filetab,
.folio-register,
.folio-mini-nav,
.folio-pull span {
  font:
    600 11px/1.4 ui-monospace,
    monospace;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.folio-opening {
  min-width: 0;
}
.folio-opening .folio-kicker {
  color: var(--accent);
  margin-bottom: 16px;
}
.folio-opening p {
  max-width: 48ch;
  margin: 18px 0;
}
.folio-hero {
  padding: clamp(30px, 5cqw, 75px) 0;
}
.profile-hero,
.index-board {
  display: grid;
  grid-template-columns: minmax(0, 1.17fr) minmax(0, 0.83fr);
  align-items: center;
  gap: 7%;
}
.folio-figure {
  min-width: 0;
  background: var(--tile);
  padding: 12px;
  border: 1px solid var(--hair);
}
.folio-figure .folio-meta {
  margin-bottom: 10px;
}
.folio-figure figcaption {
  font: 700 clamp(11px, 1.05cqw, 16px) var(--display);
  margin: 9px 0 0;
}
.folio-art,
.folio-glyph {
  width: 100%;
  height: clamp(210px, 32cqw, 460px);
  display: block;
  object-fit: contain;
  background: color-mix(in srgb, var(--tile) 75%, var(--sheet));
  border-radius: 0;
}
.folio-glyph {
  position: relative;
  overflow: hidden;
  display: grid;
  place-content: center;
  background: repeating-linear-gradient(
    135deg,
    transparent 0 9px,
    var(--hair) 9px 10px
  );
}
.folio-glyph b {
  font: 800 clamp(60px, 12cqw, 160px) / 0.9 var(--display);
  letter-spacing: -0.08em;
  background: var(--tile);
  padding: 0.12em;
}
.profile-hero .folio-figure {
  transform: rotate(2deg);
  box-shadow: 5px 6px 0 var(--accent);
  border-color: var(--accent);
}
.layout-profile h1 em {
  background: var(--accent);
  color: var(--sheet);
  padding: 0 0.05em;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}
.layout-profile .folio-name {
  color: var(--accent);
  text-transform: uppercase;
}
.folio-facts {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  border-block: 1px solid var(--hair);
  gap: 12px 3%;
  padding: 14px 0;
}
.folio-facts span {
  font:
    500 13px ui-monospace,
    monospace;
}
.folio-facts span:last-child {
  margin-left: auto;
}
.folio-facts b {
  font-size: 1.4em;
}
.screen-hero .folio-marquee {
  padding: 0 0 14px;
  border-bottom: 1px dashed var(--hair);
  color: var(--accent);
}
.folio-marquee b {
  padding: 0 9px;
}
.screen-stage {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  align-items: end;
  gap: 4%;
  padding-top: 22px;
}
.screen-stage .folio-figure {
  border: 0;
  border-block: 8px solid var(--fg);
  background: var(--tile);
  padding: 10px;
}
.screen-stage .folio-art,
.screen-stage .folio-glyph {
  height: clamp(220px, 29cqw, 410px);
}
.layout-screen h1 {
  font-size: clamp(45px, 7cqw, 107px);
}
.layout-screen .folio-case-title .folio-seq {
  background: var(--accent);
  color: var(--sheet);
  padding: 8px;
}
.layout-screen .folio-contact,
.layout-screen .folio-cta {
  border-radius: 2px;
}
.folio-issue {
  border-block: 2px solid var(--fg);
  padding: 6px 0;
  color: var(--accent);
}
.editorial-hero {
  padding-top: 23px;
}
.editorial-hero .folio-opening {
  position: relative;
  text-align: center;
  padding: 20px 2%;
}
.editorial-hero .folio-opening p {
  margin: 12px auto;
}
.folio-spread {
  display: grid;
  grid-template-columns: 1.55fr 1fr;
  align-items: end;
  gap: 4%;
  margin-top: 16px;
}
.folio-spread .folio-art,
.folio-spread .folio-glyph {
  height: clamp(175px, 23cqw, 330px);
}
.folio-pull {
  border-top: 2px solid var(--fg);
  padding: 16px 0;
}
.folio-pull strong {
  font: normal clamp(21px, 3.5cqw, 54px) / 1.05 var(--display);
  display: block;
  margin-top: 12px;
}
.layout-editorial .folio-toc {
  display: flex;
  flex-wrap: wrap;
}
.layout-editorial .folio-toc a {
  flex: 1 1 235px;
}
.index-board {
  border: 1px solid var(--fg);
  gap: 0;
  align-items: stretch;
}
.index-board .folio-opening {
  padding: clamp(18px, 3cqw, 46px);
  align-self: center;
}
.index-board .folio-figure {
  border: 0;
  border-left: 1px solid var(--fg);
}
.folio-filetab {
  display: table;
  background: var(--fg);
  color: var(--sheet);
  padding: 7px 14px;
}
.folio-register {
  padding: 8px 12px;
  border: 1px solid var(--fg);
  border-top: 0;
}
.layout-index h1 {
  font-size: clamp(39px, 5.9cqw, 91px);
  letter-spacing: -0.065em;
}
.layout-index .folio-contact,
.layout-index .folio-cta {
  border-radius: 0;
}
.hero-type .profile-hero,
.hero-type .screen-stage,
.hero-type .index-board {
  display: block;
}
.hero-type .folio-spread {
  display: none;
}
.hero-type .folio-opening {
  max-width: 960px;
}
.folio-section {
  padding: clamp(30px, 4cqw, 65px) 0 18px;
}
.folio-section h2 {
  margin-top: 7px;
}
.folio-toc {
  border-top: 2px solid var(--fg);
}
.folio-toc a {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 13px 5px;
  border-bottom: 1px solid var(--hair);
  text-decoration: none;
}
.folio-toc a:hover {
  background: var(--tile);
}
.folio-toc span:first-child,
.folio-seq {
  font:
    600 13px ui-monospace,
    monospace;
  color: var(--accent);
}
.folio-toc span:last-child {
  margin-left: auto;
}
.folio-case {
  margin: clamp(34px, 5cqw, 80px) 0;
  scroll-margin-top: 20px;
}
.folio-case-title {
  display: flex;
  align-items: baseline;
  gap: 15px;
  border-top: 2px solid var(--fg);
  padding: 14px 0 17px;
}
.folio-case-title h3 {
  margin-top: 6px;
}
.folio-case-title p {
  margin-top: 8px;
  max-width: 56ch;
}
.folio-evidence {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 235px), 1fr));
  gap: 12px;
}
.folio-lane {
  min-width: 0;
  padding: 16px;
  background: color-mix(in srgb, var(--tile) 40%, var(--sheet));
  border-top: 3px solid var(--hair);
}
.folio-lane.ad {
  border-color: var(--accent);
}
.folio-lane h4 {
  font:
    700 11px/1.3 ui-monospace,
    monospace;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin: 0 0 12px;
}
.folio-lane p {
  white-space: pre-wrap;
  font-size: 15px;
}
.folio-lane figure {
  margin: 10px 0;
}
.folio-lane :is(img, video, iframe) {
  display: block;
  width: 100%;
  max-height: 460px;
  object-fit: contain;
  border: 0;
}
.folio-lane iframe {
  height: 290px;
  background: white;
}
.folio-lane figcaption,
.folio-lane figure > a {
  font-size: 13px;
}
.folio-about {
  padding: 30px 0 35px;
  border-top: 1px solid var(--hair);
}
.folio-about h2 {
  margin: 10px 0;
}
.folio-about p {
  max-width: 55ch;
}
.folio-end {
  border-top: 1px solid var(--fg);
  padding: 22px 0 29px;
}
.density-compact .folio-case {
  margin: 22px 0;
}
.density-compact .folio-lane {
  padding: 12px;
}
.density-compact .folio-hero {
  padding-block: 25px;
}
.design-wizard {
  margin: 30px auto 0;
}
.design-wizard .folio {
  border: 1px solid var(--hair);
}
.design-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  padding: 16px 0;
}
.design-top h1 {
  font: normal clamp(36px, 5vw, 68px) / 1.03 Georgia;
  letter-spacing: -0.06em;
  margin: 0.18em 0;
}
.design-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}
.design-card {
  border: 1px solid var(--line);
  border-radius: 7px;
  overflow: hidden;
  background: #fffef8;
}
.design-body {
  padding: 15px;
}
.design-body h2 {
  font-size: 26px;
  margin: 0.12em 0;
}
.design-body p {
  color: var(--mut);
  margin: 3px 0 12px;
}
.design-body .actions {
  gap: 6px;
}
.design-controls {
  padding: 18px;
  border: 1px solid var(--line);
  background: #eef0e7;
  margin: 12px 0 20px;
  border-radius: 7px;
}
.design-controls textarea {
  width: 100%;
  padding: 10px;
  border: 1px solid var(--line);
  background: var(--paper);
  border-radius: 4px;
  resize: vertical;
  min-height: 68px;
}
.design-controls .actions {
  margin: 10px 0;
}
.design-controls label {
  display: block;
  font-weight: 650;
  margin: 8px 0;
}
.design-msg {
  padding: 12px;
  background: #e5eece;
  border-left: 3px solid #657d49;
}
.design-demo {
  padding: 12px max(18px, 5vw);
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  background: var(--paper);
  border-bottom: 1px solid var(--line);
}
.design-demo a {
  font-size: 13px;
}
.design-demo a[aria-current="true"] {
  background: var(--dark);
  color: white;
}
.design-toolbar {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}
.design-list {
  border-top: 1px solid var(--line);
}
.example-prompts button {
  font-size: 12px;
}
.folio-mini {
  container-type: inline-size;
  padding: 12px 5%;
  pointer-events: none;
}
.folio-mini-nav,
.folio-mini-foot {
  font-size: 8px;
  border-bottom: 1px solid var(--hair);
  padding-bottom: 5px;
}
.folio-mini-nav strong {
  font: 800 12px var(--display);
  text-transform: uppercase;
}
.folio-mini h1,
.folio-mini.layout-screen h1 {
  font-size: clamp(21px, 8.1cqw, 52px);
}
.folio-mini .folio-hero {
  padding: 12px 0;
}
.folio-mini .folio-art,
.folio-mini .folio-glyph {
  height: clamp(73px, 22cqw, 125px);
}
.folio-mini .folio-glyph b {
  font-size: clamp(22px, 7cqw, 44px);
}
.folio-mini .folio-figure {
  padding: 5px;
}
.folio-mini .folio-meta,
.folio-mini .folio-issue,
.folio-mini .folio-marquee,
.folio-mini .folio-filetab,
.folio-mini .folio-register,
.folio-mini .folio-pull span,
.folio-mini .folio-kicker {
  font-size: 7px;
  line-height: 1.2;
  letter-spacing: 0.05em;
  margin-bottom: 3px;
}
.folio-mini .folio-opening p {
  font-size: 10px;
  line-height: 1.25;
  margin: 6px 0;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.folio-mini .folio-figure figcaption {
  font-size: 8px;
  margin-top: 3px;
}
.folio-mini .editorial-hero .folio-opening {
  padding: 5px;
}
.folio-mini .folio-spread {
  margin: 2px 0;
}
.folio-mini .folio-spread .folio-art,
.folio-mini .folio-spread .folio-glyph {
  height: 45px;
}
.folio-mini .folio-pull {
  padding: 4px 0;
}
.folio-mini .folio-pull strong {
  font-size: 15px;
  margin: 2px 0;
}
.folio-mini .screen-stage {
  padding-top: 4px;
}
.folio-mini .screen-stage .folio-figure {
  border-width: 3px;
}
.folio-mini .index-board .folio-opening {
  padding: 6px;
}
.folio-mini .folio-mini-foot {
  border-bottom: 0;
  border-top: 1px solid var(--hair);
  padding: 5px 0;
}
@container (max-width:600px) {
  .full-site .profile-hero,
  .full-site .index-board,
  .full-site .screen-stage {
    grid-template-columns: 1fr;
    gap: 15px;
  }
  .full-site .screen-stage .folio-opening {
    grid-row: 1;
  }
  .full-site .folio-figure {
    max-width: 95%;
  }
  .full-site .folio-mast nav {
    gap: 10px;
    font-size: 12px;
  }
  .full-site .folio-facts span:last-child {
    margin-left: 0;
  }
  .full-site .folio-evidence {
    grid-template-columns: 1fr;
  }
  .full-site .folio-spread {
    grid-template-columns: 1fr;
  }
  .folio-mast {
    flex-wrap: wrap;
  }
}
@media (max-width: 700px) {
  .design-grid {
    grid-template-columns: 1fr;
  }
  .full-site {
    padding: 0 18px;
  }
  .design-controls {
    padding: 12px;
  }
  .folio-end {
    flex-wrap: wrap;
  }
}

button.design-thumb {
  display: block;
  width: 100%;
  border: 0;
  border-radius: 0;
  padding: 0;
  overflow: hidden;
  text-align: left;
  color: inherit;
  background: none;
  font: inherit;
}
button.design-thumb:hover {
  box-shadow: inset 0 0 0 2px var(--ink);
}

.sample-gallery {
  max-width: 1350px;
  margin: auto;
  padding: 16px clamp(18px, 5vw, 75px) 40px;
}
.sample-thumb {
  display: block;
  text-decoration: none;
}
.folio-wall {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
  gap: 16px;
}
.folio-poster {
  text-decoration: none;
  border: 1px solid var(--hair);
  display: block;
  min-width: 0;
}
.poster-image {
  display: grid;
  place-items: center;
  background: var(--tile);
  overflow: hidden;
}
.poster-image img,
.poster-symbol {
  height: clamp(130px, 17cqw, 235px);
  width: 100%;
  object-fit: contain;
}
.poster-symbol {
  display: grid;
  place-content: center;
  font: 800 clamp(40px, 7cqw, 98px) / 1 var(--display);
  color: var(--accent);
  background: repeating-linear-gradient(
    135deg,
    transparent 0 11px,
    var(--hair) 11px 12px
  );
}
.poster-title {
  padding: 12px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 6px;
  align-items: center;
}
.poster-title small {
  grid-column: 1/-1;
  font:
    600 10px ui-monospace,
    monospace;
  text-transform: uppercase;
}
.poster-title strong {
  font: 700 clamp(18px, 2cqw, 27px) / 1.1 var(--display);
}
.folio-poster:hover .poster-title {
  background: var(--tile);
}
.layout-screen .folio-wall {
  gap: 8px;
}
.layout-screen .folio-poster {
  border-block: 5px solid var(--hair);
}

/* The default page is the work itself: no teaser wall or case-study clicks. */
.folio-feed .folio-hero {
  padding-block: 34px;
}
.folio-feed h1 {
  font-size: clamp(40px, 6.4cqw, 91px);
}
.folio-feed .folio-art,
.folio-feed .folio-glyph {
  height: clamp(180px, 23cqw, 320px);
}
.folio-feed .folio-cta {
  display: none;
}
.folio-feed .folio-opening p {
  font-size: clamp(16px, 1.6cqw, 22px);
}
.folio-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 20px;
  padding: 12px 0 23px;
  font-size: 14px;
}
.folio-links a {
  max-width: 100%;
  overflow-wrap: anywhere;
}
.folio-stream {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 28px;
}
.folio-stream .folio-case {
  grid-column: 1/-1;
  margin: 0 0 14px;
}
.folio-stream .folio-piece {
  grid-column: auto;
}
.folio-stream .folio-case-title h3 {
  font-size: clamp(25px, 3cqw, 42px);
}
.folio-stream .folio-case-title {
  padding-top: 14px;
}
.folio-feed .folio-section {
  padding: 28px 0 22px;
}
.folio-stream .folio-lane.ad {
  background: transparent;
  padding: 0;
  border: 0;
}
.folio-stream .folio-lane.ad h4 {
  margin: 0 0 12px;
}
.folio-stream .folio-piece .folio-lane.ad h4 {
  display: none;
}
.folio-stream .folio-evidence {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 225px), 1fr));
  align-items: start;
}
.folio-stream .folio-lane img,
.folio-stream .folio-lane video {
  max-height: 540px;
  min-height: 130px;
  background: color-mix(in srgb, var(--tile) 25%, var(--sheet));
}
.folio-stream .folio-lane iframe {
  min-height: 290px;
}
.folio-stream .folio-lane p {
  white-space: pre-line;
  line-height: 1.6;
}
.folio-feed .folio-end {
  margin-top: 30px;
}
@container (max-width:720px) {
  .folio-stream {
    grid-template-columns: 1fr;
  }
  .folio-stream .folio-piece {
    grid-column: 1/-1;
  }
  .folio-stream .folio-evidence {
    grid-template-columns: 1fr;
  }
  .folio-feed .folio-hero {
    padding-block: 23px;
  }
  .folio-feed .folio-figure {
    max-width: 100%;
  }
}

/* V4: content-led portfolios. Ads keep their intrinsic proportions. */
.folio-v4 {--sheet:#faf8f4;--fg:#232321;--accent:#b33926;--tile:#eeece7;--hair:color-mix(in srgb,var(--fg) 16%,var(--sheet));overflow-wrap:break-word}
.folio-v4.palette-midnight {--sheet:#171918;--fg:#eeefe8;--accent:#d6e995;--tile:#292e2a}
.folio-v4.palette-paper {--sheet:#f3f0e8;--fg:#312e29;--accent:#76624c;--tile:#e8e4db}
.folio-v4.palette-moss {--sheet:#f2f4ee;--fg:#253e31;--accent:#42634b;--tile:#e3e9dd}
.folio-v4.palette-cobalt {--sheet:#f4f6ff;--fg:#172745;--accent:#214cd5;--tile:#e7ebf7}
.folio-v4.palette-plum {--sheet:#292034;--fg:#fbecff;--accent:#edb4ff;--tile:#44314e}
.folio-v4.palette-rose {--sheet:#fff6f4;--fg:#4c242b;--accent:#942a50;--tile:#f3dedc}
.folio-v4.palette-ochre {--sheet:#faf5e9;--fg:#382c1b;--accent:#78501d;--tile:#ece1ca}
.folio-v4.full-site {padding-inline:clamp(22px,5vw,90px)}
.folio-v4 .folio-mast {padding-block:27px}
.folio-v4 .folio-name {font-size:22px;letter-spacing:-.04em}
.folio-v4 .folio-name i {font-size:9px;vertical-align:middle;padding-left:9px}
.folio-v4 .folio-mast nav {display:flex;align-items:center;gap:25px;font-weight:400;font-size:13px}
.folio-v4 .folio-contact {border-radius:3px;padding:10px 15px}
.folio-v4 .hero-v4 {display:grid;grid-template-columns:1.05fr 1fr;align-items:center;gap:5%;padding:70px 0 60px;min-height:0}
.folio-v4 h1 {font-size:clamp(42px,5.8cqw,86px);line-height:1.01;letter-spacing:-.065em;max-width:15ch;text-wrap:balance}
.folio-v4 .folio-kicker {letter-spacing:.12em;font-size:10px}
.folio-v4 .folio-opening p {font-size:clamp(16px,1.45cqw,20px);line-height:1.6;max-width:42ch;margin:24px 0}
.folio-v4 .folio-hero-actions {display:flex;align-items:center;gap:22px;margin-top:27px}
.folio-v4 .folio-cta {display:inline-flex;border-radius:3px;padding:13px 20px;font-weight:500;font-size:13px}
.folio-v4 .folio-text-link {font-size:13px;text-underline-offset:5px}
.folio-v4 .folio-reel {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:center;gap:12px;min-width:0}
.folio-v4 .folio-reel-card {min-width:0;margin:0;transform:none;border:0;background:none;padding:0}
.folio-v4 .folio-reel-card:nth-child(2) {margin-top:42px}
.folio-v4 .folio-reel-card:nth-child(3) {margin-top:-24px}
.folio-v4 .folio-reel-card .folio-art {display:block;width:100%;height:auto;max-height:none;object-fit:contain;background:var(--tile);border-radius:5px;box-shadow:0 8px 24px #0000000d}
.folio-v4 .folio-reel-card figcaption {display:flex;gap:7px;align-items:baseline;font:10px/1.4 Arial,sans-serif;padding:10px 0;overflow-wrap:anywhere}
.folio-v4 .folio-reel-card figcaption span {opacity:.5;font-size:9px}
.folio-v4 .folio-reel:has(.folio-reel-card:only-child) {grid-template-columns:1fr;justify-items:center}
.folio-v4 .folio-reel-card:only-child {max-width:340px;width:100%}
.folio-v4 .folio-reel-card:only-child .folio-art {max-height:450px;width:auto;max-width:100%;margin:auto}
.folio-v4.layout-screen .hero-v4 {grid-template-columns:1fr;gap:40px}
.folio-v4.layout-screen .folio-opening {display:grid;grid-template-columns:1.3fr 1fr;gap:0 9%;align-items:start}
.folio-v4.layout-screen .folio-opening .folio-kicker {grid-column:1/-1}
.folio-v4.layout-screen .folio-opening h1 {grid-row:2/4}
.folio-v4.layout-screen .folio-opening p {margin-top:0}
.folio-v4.layout-screen .folio-reel {max-width:820px;margin:0 auto;width:100%;align-items:start;gap:20px}
.folio-v4.layout-screen .folio-reel-card {margin:0}
.folio-v4.layout-screen .folio-reel-card .folio-art {max-height:360px;width:auto;max-width:100%;margin:auto}
.folio-v4.layout-editorial .hero-v4 {grid-template-columns:1fr;text-align:center;gap:35px}
.folio-v4.layout-editorial h1 {max-width:19ch;margin:auto;font-weight:400;letter-spacing:-.06em;font-size:clamp(46px,7.2cqw,100px)}
.folio-v4.layout-editorial .folio-opening p {max-width:54ch;margin:22px auto}
.folio-v4.layout-editorial .folio-hero-actions {justify-content:center}
.folio-v4.layout-editorial .folio-reel {max-width:650px;width:100%;margin:auto}
.folio-v4.layout-index .hero-v4 {grid-template-columns:1.4fr 1fr;align-items:start}
.folio-v4.layout-index h1 {font-size:clamp(35px,4.8cqw,67px);letter-spacing:-.06em;line-height:1.1}
.folio-v4.layout-index .folio-reel-card {margin:0}
.folio-v4 .folio-facts {margin:0;border-block:1px solid var(--hair);padding:16px 0;display:flex;justify-content:space-between;font:12px/1.4 Arial,sans-serif;text-transform:none;letter-spacing:0}
.folio-v4 .folio-links {padding:0 0 22px;gap:20px;font-size:12px}
.folio-v4 .folio-services {padding:28px 0;border-bottom:1px solid var(--hair);display:grid;grid-template-columns:1fr 3fr;gap:25px}
.folio-v4 .folio-services>div {display:flex;flex-wrap:wrap;gap:10px}
.folio-v4 .folio-services>div>span {border:1px solid var(--hair);border-radius:30px;padding:8px 14px;font-size:13px}
.folio-v4 .folio-section {padding:44px 0 28px}
.folio-v4 h2 {font-size:clamp(30px,3.5cqw,52px);letter-spacing:-.045em}
.folio-v4 .folio-section .folio-kicker {margin-bottom:10px}
.folio-v4 .folio-stream {display:block;columns:3;column-gap:26px}
.folio-v4.layout-screen .folio-stream {columns:2}
.folio-v4.layout-index .folio-stream {columns:3;column-gap:18px}
.folio-v4 .folio-case {break-inside:avoid;page-break-inside:avoid;display:block;margin:0 0 35px;border:0}
.folio-v4 .folio-piece .folio-case-title {border:0;padding:0 0 12px;gap:10px}
.folio-v4 .folio-case-title h3 {font:500 16px/1.3 Arial,sans-serif;letter-spacing:-.02em}
.folio-v4 .folio-piece .folio-case-title .folio-kicker {display:none}
.folio-v4 .folio-seq {font-size:10px;opacity:.55}
.folio-v4 .folio-evidence {display:grid;grid-template-columns:1fr;gap:20px}
.folio-v4 .folio-lane {min-width:0}
.folio-v4 .folio-lane :is(img,video) {display:block;width:100%;height:auto;min-height:0;max-height:none;object-fit:contain;border-radius:5px;background:var(--tile)}
.folio-v4 .folio-lane figure {margin:0 0 14px}
.folio-v4 .folio-lane figcaption {font-size:11px;line-height:1.4;padding:8px 0;overflow-wrap:anywhere;opacity:.65}
.folio-v4 .folio-piece .folio-lane figcaption {display:none}
.folio-v4 .folio-study {column-span:all;border-block:1px solid var(--hair);padding:28px 0;margin:15px 0 35px}
.folio-v4 .folio-study .folio-case-title {border:0;padding:0 0 25px}
.folio-v4 .folio-study .folio-case-title h3 {font:600 clamp(25px,3cqw,42px)/1.1 var(--display)}
.folio-v4 .folio-study .folio-evidence {grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));align-items:start}
.folio-v4 .folio-study .folio-lane {border:0;padding:0;background:none}
.folio-v4 .folio-study .folio-lane.ad :is(img,video) {max-height:640px;width:auto;max-width:100%;margin:auto}
.folio-v4 .folio-lane h4 {font:600 11px/1.4 Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase;margin:0 0 15px}
.folio-v4 .folio-about {padding:45px 0;display:grid;grid-template-columns:1fr 2fr;gap:15px 40px}
.folio-v4 .folio-about .folio-kicker {grid-column:1/-1}
.folio-v4 .folio-about p {white-space:pre-line;line-height:1.7;font-size:17px}
.folio-v4 .folio-end {padding:40px 0 50px;margin-top:25px;border-color:var(--hair)}
.folio-v4 .folio-end>div {display:grid;gap:14px}
.folio-v4 .folio-end strong {font:500 clamp(26px,3cqw,46px)/1.1 var(--display)}
.folio-v4.folio-mini {min-height:300px;padding:17px 5%}
.folio-v4.folio-mini .hero-v4 {padding:28px 0 22px;gap:6%}
.folio-v4.folio-mini h1 {font-size:clamp(23px,6.4cqw,44px)}
.folio-v4.folio-mini .folio-opening p {font-size:10px;line-height:1.4;margin:10px 0;-webkit-line-clamp:4}
.folio-v4.folio-mini .folio-reel {gap:6px}
.folio-v4.folio-mini .folio-reel-card:nth-child(2){margin-top:18px}
.folio-v4.folio-mini .folio-reel-card:nth-child(3){margin-top:-12px}
.folio-v4.folio-mini .folio-reel-card .folio-art {height:auto;max-height:160px}
.folio-v4.folio-mini .folio-reel-card figcaption {font-size:7px;padding:6px 0}
.folio-v4.folio-mini .folio-reel-card figcaption span {display:none}
.folio-v4.folio-mini.layout-screen .folio-reel {max-width:65%;margin-top:15px}
.folio-v4.folio-mini.layout-editorial .folio-reel {max-width:60%;margin-top:15px}
.folio-v4.folio-mini .folio-kicker {font-size:7px}
@container(max-width:850px){.folio-v4.full-site .folio-stream{columns:2}.folio-v4.full-site .hero-v4{padding-block:40px}.folio-v4.full-site .folio-reel{gap:8px}}
@container(max-width:600px){.folio-v4.full-site .hero-v4{grid-template-columns:1fr;gap:30px}.folio-v4.full-site h1{font-size:clamp(38px,10cqw,58px)}.folio-v4.full-site .folio-opening{display:block}.folio-v4.full-site .folio-reel{max-width:440px;margin:auto}.folio-v4.full-site .folio-stream{columns:1}.folio-v4.full-site .folio-study .folio-evidence{grid-template-columns:1fr}.folio-v4.full-site .folio-about{grid-template-columns:1fr}.folio-v4.full-site .folio-services{grid-template-columns:1fr;gap:12px}.folio-v4.full-site .folio-mast{gap:17px;align-items:center}.folio-v4.full-site .folio-mast nav{gap:14px;font-size:12px}.folio-v4.full-site .folio-name{font-size:19px}.folio-v4.full-site .folio-contact{padding:8px 10px}.folio-v4.full-site .folio-facts{gap:15px}.folio-v4.full-site .folio-end{gap:24px}}

/* Work sections own their media; columns apply equally to every group. */
.folio-v4 .folio-work-group {margin-bottom:38px}
.folio-v4 .folio-group-heading {display:flex;flex-wrap:wrap;align-items:baseline;gap:12px 24px;padding:22px 0;margin-bottom:24px;border-top:1px solid var(--hair)}
.folio-v4 .folio-group-heading h3 {font:inherit;font-size:clamp(26px,3cqw,42px);letter-spacing:-.035em;margin:0}
.folio-v4 .folio-group-heading>span {font:12px/1.4 Arial,sans-serif;opacity:.65}
.folio-v4 .folio-group-heading p {flex-basis:100%;margin:0;max-width:65ch}
.folio-v4 .folio-context-link {display:inline-block;margin-top:8px;font-size:12px}
@container(min-width:851px){.folio-v4.columns-1 .folio-stream{columns:1}.folio-v4.columns-2 .folio-stream{columns:2}.folio-v4.columns-3 .folio-stream{columns:3}.folio-v4.columns-4 .folio-stream{columns:4}}
@container(min-width:601px) and (max-width:850px){.folio-v4.full-site.columns-1 .folio-stream{columns:1}}
.edit-reports {max-width:1100px;margin:12px auto 24px}
.edit-report {background:#fffdf7;border:1px solid #d5d8cf;border-radius:8px;padding:14px 18px;margin:8px 0;font-size:14px}
.edit-report summary {cursor:pointer;font-weight:650}
.edit-report p {margin:12px 0;max-width:90ch}
.edit-report ul {padding-left:20px}
.edit-report li {margin:8px 0}
.edit-report .edit-request {white-space:pre-wrap;color:#596157}
.edit-report .edit-unfulfilled {color:#913710}
.edit-report small {color:#596157}
.edit-log-json {white-space:pre-wrap;overflow-wrap:anywhere;font-size:11px;max-height:350px;overflow:auto}