#ztv1-visual-hero {

  --ztv1-black:#030303;
  --ztv1-black-2:#090907;

  --ztv1-gold:#d8a328;
  --ztv1-gold-2:#f6d476;
  --ztv1-gold-3:#fff1bf;

  --ztv1-white:#fffaf0;
  --ztv1-muted:rgba(255,250,240,.67);

  --ztv1-border:rgba(246,212,118,.16);

  position:relative;

  width:100%;
  max-width:100%;

  margin-left:0;
  margin-right:0;

  min-height:min(1050px,100svh);

  overflow:hidden;

  isolation:isolate;

  color:var(--ztv1-white);

  background:#030303;

  direction:ltr;
  text-align:left;

  font-family:inherit !important;

  -webkit-font-smoothing:antialiased;

}


#ztv1-visual-hero *,
#ztv1-visual-hero *::before,
#ztv1-visual-hero *::after {

  box-sizing:border-box;

  direction:ltr;

}


#ztv1-visual-hero button,
#ztv1-visual-hero a {

  font:inherit;

}


#ztv1-visual-hero a {

  color:inherit;
  text-decoration:none;

}



/* ==============================
   BACKGROUND
============================== */

#ztv1-visual-hero .ztv1-video-layer {

  position:absolute;

  inset:0;

  z-index:-6;

}


#ztv1-visual-hero .ztv1-bg-video {

  position:absolute;

  inset:0;

  width:100%;
  height:100%;

  object-fit:cover;

  filter:
  saturate(.82)
  contrast(1.08)
  brightness(.63);

}


#ztv1-visual-hero .ztv1-video-shade {

  position:absolute;

  inset:0;

  background:

  linear-gradient(
    90deg,
    rgba(0,0,0,.93) 0%,
    rgba(0,0,0,.74) 35%,
    rgba(0,0,0,.30) 72%,
    rgba(0,0,0,.58) 100%
  ),

  linear-gradient(
    180deg,
    rgba(0,0,0,.14),
    rgba(0,0,0,.10) 55%,
    rgba(0,0,0,.86)
  );

}


#ztv1-visual-hero .ztv1-video-grid {

  position:absolute;

  inset:0;

  opacity:.11;

  background-image:

  linear-gradient(
    rgba(246,212,118,.10) 1px,
    transparent 1px
  ),

  linear-gradient(
    90deg,
    rgba(246,212,118,.10) 1px,
    transparent 1px
  );

  background-size:76px 76px;

  -webkit-mask-image:
  linear-gradient(to bottom,#000,transparent 88%);

  mask-image:
  linear-gradient(to bottom,#000,transparent 88%);

}


#ztv1-visual-hero .ztv1-vignette {

  position:absolute;

  inset:0;

  box-shadow:

  inset 0 0 200px rgba(0,0,0,.72),

  inset 0 -150px 180px rgba(0,0,0,.65);

}



/* ==============================
   ORBITS
============================== */

#ztv1-visual-hero .ztv1-orbit {

  position:absolute;

  z-index:-2;

  border:

  1px solid
  rgba(246,212,118,.13);

  border-radius:50%;

  pointer-events:none;

}


#ztv1-visual-hero .ztv1-orbit-a {

  width:680px;
  height:680px;

  right:-260px;
  top:-270px;

  box-shadow:

  0 0 0 35px rgba(216,163,40,.018),

  0 0 0 74px rgba(216,163,40,.012);

}


#ztv1-visual-hero .ztv1-orbit-b {

  width:500px;
  height:500px;

  left:32%;
  bottom:-390px;

}



/* ==============================
   CONTAINER
============================== */

#ztv1-visual-hero .ztv1-container {

  width:min(
    1700px,
    calc(100% - clamp(36px,7vw,130px))
  );

  min-height:min(1050px,100svh);

  margin:auto;

  padding:

  clamp(30px,4vw,64px)
  0
  clamp(36px,5vw,78px);

  display:flex;

  flex-direction:column;

  justify-content:space-between;

}



/* ==============================
   TOP
============================== */

#ztv1-visual-hero .ztv1-topbar {

  display:flex;

  justify-content:space-between;

  align-items:center;

  gap:30px;

}


#ztv1-visual-hero .ztv1-brand {

  display:flex;

  align-items:center;

  gap:13px;

}


#ztv1-visual-hero .ztv1-logo-wrap {

  width:48px;
  height:48px;

  padding:5px;

  display:grid;

  place-items:center;

  background:

  rgba(0,0,0,.38);

  border:

  1px solid
  rgba(246,212,118,.28);

  backdrop-filter:blur(14px);

  -webkit-backdrop-filter:blur(14px);

  clip-path:
  polygon(
    0 0,
    calc(100% - 9px) 0,
    100% 9px,
    100% 100%,
    9px 100%,
    0 calc(100% - 9px)
  );

}


#ztv1-visual-hero .ztv1-logo-wrap img {

  display:block;

  width:100%;
  height:100%;

  object-fit:contain;

}


#ztv1-visual-hero .ztv1-brand strong {

  display:block;

  color:var(--ztv1-gold-3);

  font-size:12px;

  font-weight:900;

  letter-spacing:.15em;

}


#ztv1-visual-hero .ztv1-brand span {

  display:block;

  margin-top:4px;

  color:rgba(255,250,240,.46);

  font-size:9px;

  letter-spacing:.07em;

}


#ztv1-visual-hero .ztv1-status {

  display:flex;

  align-items:center;

  gap:9px;

  min-height:38px;

  padding:0 15px;

  color:rgba(255,250,240,.63);

  border:

  1px solid
  rgba(246,212,118,.16);

  background:

  rgba(0,0,0,.28);

  backdrop-filter:blur(14px);

  -webkit-backdrop-filter:blur(14px);

  font-size:9px;

  font-weight:800;

  letter-spacing:.14em;

}


#ztv1-visual-hero .ztv1-status span {

  width:6px;
  height:6px;

  border-radius:50%;

  background:var(--ztv1-gold-2);

  box-shadow:

  0 0 9px var(--ztv1-gold-2),

  0 0 22px var(--ztv1-gold);

  animation:

  ztv1-status-pulse
  2.2s ease-in-out infinite;

}



/* ==============================
   MAIN GRID
============================== */

#ztv1-visual-hero .ztv1-main {

  display:grid;

  grid-template-columns:

  minmax(0,1.05fr)

  minmax(430px,.75fr);

  align-items:center;

  gap:

  clamp(55px,7vw,130px);

  padding:

  clamp(80px,10vh,150px)
  0
  clamp(60px,8vh,110px);

}



/* ==============================
   COPY
============================== */

#ztv1-visual-hero .ztv1-copy {

  max-width:940px;

}


#ztv1-visual-hero .ztv1-kicker {

  display:inline-flex;

  align-items:center;

  max-width:100%;

  margin-bottom:

  clamp(20px,2vw,30px);

  padding:9px 13px;

  border:

  1px solid
  rgba(246,212,118,.25);

  color:var(--ztv1-gold-2);

  background:

  rgba(0,0,0,.28);

  font-size:

  clamp(8px,.7vw,11px);

  font-weight:900;

  letter-spacing:.14em;

  line-height:1.4;

  backdrop-filter:blur(15px);

  -webkit-backdrop-filter:blur(15px);

}


#ztv1-visual-hero .ztv1-title {

  margin:0;

  max-width:980px;

  color:white;

  font-size:

  clamp(
    62px,
    7.6vw,
    148px
  );

  line-height:.84;

  letter-spacing:-.065em;

  font-weight:900;

}


#ztv1-visual-hero .ztv1-title span {

  display:block;

  color:transparent;

  background:

  linear-gradient(
    105deg,
    #fff6cd,
    #f6d476 27%,
    #d8a328 58%,
    #fff1bf
  );

  background-clip:text;

  -webkit-background-clip:text;

  filter:

  drop-shadow(
    0 16px 36px
    rgba(216,163,40,.14)
  );

}


#ztv1-visual-hero .ztv1-lead {

  max-width:710px;

  margin:

  clamp(28px,3vw,45px)
  0
  0;

  color:

  rgba(255,250,240,.74);

  font-size:

  clamp(15px,1.15vw,20px);

  line-height:1.85;

}


#ztv1-visual-hero .ztv1-tags {

  display:flex;

  flex-wrap:wrap;

  gap:8px;

  margin-top:26px;

}


#ztv1-visual-hero .ztv1-tags span {

  padding:

  8px 11px;

  color:

  rgba(255,250,240,.56);

  border:

  1px solid
  rgba(255,255,255,.10);

  background:

  rgba(0,0,0,.20);

  font-size:9px;

  font-weight:750;

  letter-spacing:.09em;

  text-transform:uppercase;

}



/* ==============================
   BUTTONS
============================== */

#ztv1-visual-hero .ztv1-actions {

  display:flex;

  flex-wrap:wrap;

  gap:13px;

  margin-top:

  clamp(32px,4vw,50px);

}


#ztv1-visual-hero .ztv1-btn {

  min-height:58px;

  padding:0 25px;

  display:inline-flex;

  align-items:center;

  justify-content:center;

  gap:11px;

  border-radius:0;

  cursor:pointer;

  text-decoration:none;

  font-size:10px;

  font-weight:900;

  letter-spacing:.10em;

  transition:

  transform .25s ease,
  border-color .25s ease,
  box-shadow .25s ease,
  background .25s ease;

  clip-path:

  polygon(
    0 0,
    calc(100% - 10px) 0,
    100% 10px,
    100% 100%,
    10px 100%,
    0 calc(100% - 10px)
  );

}


#ztv1-visual-hero .ztv1-btn-primary {

  color:#181006;

  border:

  1px solid #ffe6a3;

  background:

  linear-gradient(
    135deg,
    #fff1bf,
    #f6d476 30%,
    #d8a328 70%,
    #8f641c
  );

  box-shadow:

  0 7px 0 #654613,

  0 20px 42px
  rgba(216,163,40,.28);

}


#ztv1-visual-hero .ztv1-play {

  width:25px;
  height:25px;

  display:grid;

  place-items:center;

  border:

  1px solid
  rgba(0,0,0,.22);

  border-radius:50%;

}





#ztv1-visual-hero .ztv1-btn-ghost {

  color:white;

  border:

  1px solid
  rgba(246,212,118,.27);

  background:

  rgba(0,0,0,.32);

  backdrop-filter:blur(14px);

  -webkit-backdrop-filter:blur(14px);

}





@media (hover:hover) and (pointer:fine) {

  #ztv1-visual-hero .ztv1-btn:hover {

    transform:translateY(-4px);

  }


  #ztv1-visual-hero .ztv1-btn-primary:hover {

    box-shadow:

    0 9px 0 #654613,

    0 28px 56px
    rgba(216,163,40,.40);

  }


  #ztv1-visual-hero .ztv1-btn-ghost:hover {

    color:var(--ztv1-gold-2);

    border-color:

    rgba(246,212,118,.55);

    background:

    rgba(216,163,40,.09);

  }

}



/* ==============================
   EDITOR MOCKUP
============================== */

#ztv1-visual-hero .ztv1-editor {

  position:relative;

  width:100%;

  overflow:hidden;

  background:

  linear-gradient(
    145deg,
    rgba(15,15,13,.88),
    rgba(3,3,3,.84)
  );

  border:

  1px solid
  rgba(246,212,118,.20);

  box-shadow:

  0 45px 110px
  rgba(0,0,0,.65),

  0 0 65px
  rgba(216,163,40,.06);

  backdrop-filter:blur(18px);

  -webkit-backdrop-filter:blur(18px);

  transform:

  perspective(1400px)
  rotateY(-5deg)
  rotateX(2deg);

  transition:

  transform .45s ease,

  border-color .45s ease;

}


@media (hover:hover) and (pointer:fine) {

  #ztv1-visual-hero .ztv1-editor:hover {

    transform:

    perspective(1400px)
    rotateY(-1deg)
    rotateX(0deg)
    translateY(-6px);

    border-color:

    rgba(246,212,118,.40);

  }

}


#ztv1-visual-hero .ztv1-editor-head {

  min-height:46px;

  padding:0 15px;

  display:grid;

  grid-template-columns:auto 1fr auto;

  align-items:center;

  gap:14px;

  color:

  rgba(255,250,240,.42);

  border-bottom:

  1px solid
  rgba(255,255,255,.07);

  font-size:8px;

  font-weight:800;

  letter-spacing:.10em;

}


#ztv1-visual-hero .ztv1-dots {

  display:flex;

  gap:5px;

}


#ztv1-visual-hero .ztv1-dots i {

  width:5px;
  height:5px;

  display:block;

  border-radius:50%;

  background:

  rgba(246,212,118,.45);

}


#ztv1-visual-hero .ztv1-editor-head small {

  color:

  var(--ztv1-gold-2);

  font-family:inherit;

  font-size:8px;

}


#ztv1-visual-hero .ztv1-preview {

  position:relative;

  aspect-ratio:16 / 9;

  display:grid;

  place-items:center;

  overflow:hidden;

  background:

  radial-gradient(
    circle at 68% 35%,
    rgba(216,163,40,.28),
    transparent 25%
  ),

  linear-gradient(
    135deg,
    #020202,
    #161006 55%,
    #030303
  );

}


#ztv1-visual-hero .ztv1-preview::before {

  position:absolute;

  inset:0;

  content:"";

  opacity:.25;

  background-image:

  linear-gradient(
    rgba(246,212,118,.10) 1px,
    transparent 1px
  ),

  linear-gradient(
    90deg,
    rgba(246,212,118,.10) 1px,
    transparent 1px
  );

  background-size:36px 36px;

}


#ztv1-visual-hero .ztv1-preview-mark {

  position:absolute;

  right:-25px;
  bottom:-40px;

  color:transparent;

  -webkit-text-stroke:

  1px
  rgba(246,212,118,.15);

  font-size:

  clamp(100px,12vw,210px);

  font-weight:950;

  line-height:.8;

  letter-spacing:-.12em;

  transform:rotate(-9deg);

}


#ztv1-visual-hero .ztv1-preview-center {

  position:relative;

  z-index:2;

  text-align:center;

}


#ztv1-visual-hero .ztv1-preview-center span {

  display:block;

  margin-bottom:8px;

  color:

  var(--ztv1-gold-2);

  font-size:8px;

  font-weight:900;

  letter-spacing:.35em;

}


#ztv1-visual-hero .ztv1-preview-center strong {

  display:block;

  color:white;

  font-size:

  clamp(22px,2.7vw,44px);

  line-height:1;

  letter-spacing:-.04em;

}


#ztv1-visual-hero .ztv1-preview-frame {

  position:absolute;

  inset:18px;

  border:

  1px solid
  rgba(246,212,118,.11);

}


#ztv1-visual-hero .ztv1-preview-frame::before,
#ztv1-visual-hero .ztv1-preview-frame::after {

  position:absolute;

  width:18px;
  height:18px;

  content:"";

}


#ztv1-visual-hero .ztv1-preview-frame::before {

  top:-1px;
  left:-1px;

  border-top:1px solid var(--ztv1-gold-2);
  border-left:1px solid var(--ztv1-gold-2);

}


#ztv1-visual-hero .ztv1-preview-frame::after {

  right:-1px;
  bottom:-1px;

  border-right:1px solid var(--ztv1-gold-2);
  border-bottom:1px solid var(--ztv1-gold-2);

}



/* RULER */

#ztv1-visual-hero .ztv1-ruler {

  height:29px;

  padding:0 15px 0 42px;

  display:flex;

  align-items:center;

  gap:9px;

  color:

  rgba(255,250,240,.27);

  border-top:

  1px solid
  rgba(255,255,255,.05);

  border-bottom:

  1px solid
  rgba(255,255,255,.05);

  font-family:inherit;

  font-size:6px;

}


#ztv1-visual-hero .ztv1-ruler i {

  height:1px;

  flex:1;

  background:

  rgba(255,255,255,.07);

}



/* TIMELINE */

#ztv1-visual-hero .ztv1-timeline {

  position:relative;

  padding:10px 12px 14px;

}


#ztv1-visual-hero .ztv1-track {

  display:grid;

  grid-template-columns:

  26px repeat(12,1fr);

  gap:4px;

  min-height:26px;

  margin-top:5px;

}


#ztv1-visual-hero .ztv1-track b {

  display:flex;

  align-items:center;

  color:

  rgba(255,250,240,.28);

  font-size:6px;

}


#ztv1-visual-hero .ztv1-clip {

  min-width:0;

  display:flex;

  align-items:center;

  padding:0 7px;

  overflow:hidden;

  color:#161006;

  border:

  1px solid
  rgba(255,240,180,.28);

  background:

  linear-gradient(
    135deg,
    #f6d476,
    #b47f20
  );

  font-size:6px;

  font-weight:900;

  letter-spacing:.06em;

  white-space:nowrap;

}


#ztv1-visual-hero .clip-a {

  grid-column:2 / 6;

}


#ztv1-visual-hero .clip-b {

  grid-column:6 / 9;

  opacity:.65;

}


#ztv1-visual-hero .clip-c {

  grid-column:9 / 14;

}


#ztv1-visual-hero .clip-d {

  grid-column:3 / 8;

  background:

  linear-gradient(
    135deg,
    #413314,
    #d8a328
  );

  color:#fff3c7;

}


#ztv1-visual-hero .clip-e {

  grid-column:9 / 12;

  background:

  rgba(216,163,40,.27);

  color:var(--ztv1-gold-2);

}


#ztv1-visual-hero .clip-f {

  grid-column:5 / 12;

  background:

  rgba(246,212,118,.10);

  color:

  rgba(255,241,191,.62);

}


#ztv1-visual-hero .ztv1-playhead {

  position:absolute;

  top:0;
  bottom:0;

  left:30%;

  width:46%;

  transform:translateX(50%);

  background:none;

  border-left:1px solid var(--ztv1-gold-3);

  pointer-events:none;

  filter:drop-shadow(0 0 7px rgba(246,212,118,.8));

  animation:

  ztv1-playhead
  7s ease-in-out infinite;

}


#ztv1-visual-hero .ztv1-playhead::before {

  position:absolute;

  top:0;
  left:0;

  width:7px;
  height:7px;

  content:"";

  background:

  var(--ztv1-gold-3);

  transform:

  translate(-50%,-20%)
  rotate(45deg);

}



/* ==============================
   BOTTOM
============================== */

#ztv1-visual-hero .ztv1-bottom {

  display:grid;

  grid-template-columns:

  repeat(4,minmax(0,1fr));

  border-top:

  1px solid
  rgba(246,212,118,.14);

}


#ztv1-visual-hero .ztv1-bottom div {

  padding:

  19px
  clamp(10px,2vw,26px);

  display:flex;

  align-items:center;

  gap:12px;

  border-right:

  1px solid
  rgba(246,212,118,.09);

}


#ztv1-visual-hero .ztv1-bottom div:last-child {

  border-right:0;

}


#ztv1-visual-hero .ztv1-bottom small {

  color:

  var(--ztv1-gold);

  font-size:8px;

  letter-spacing:.10em;

}


#ztv1-visual-hero .ztv1-bottom span {

  color:

  rgba(255,250,240,.55);

  font-size:9px;

  font-weight:750;

  letter-spacing:.09em;

  text-transform:uppercase;

}



/* ==============================
   MODAL
============================== */

#ztv1-visual-hero .ztv1-modal {

  position:fixed;

  z-index:2147480000;

  inset:0;

  padding:

  clamp(15px,4vw,65px);

  display:flex;

  align-items:center;

  justify-content:center;

  background:

  rgba(0,0,0,.94);

  backdrop-filter:blur(22px);

  -webkit-backdrop-filter:blur(22px);

  opacity:0;

  visibility:hidden;

  pointer-events:none;

  transition:

  opacity .3s ease,
  visibility .3s ease;

}


#ztv1-visual-hero .ztv1-modal.is-open {

  opacity:1;

  visibility:visible;

  pointer-events:auto;

}


#ztv1-visual-hero .ztv1-modal-inner {

  width:min(1450px,100%);

}


#ztv1-visual-hero .ztv1-modal-label {

  margin-bottom:13px;

  color:

  var(--ztv1-gold-2);

  font-size:9px;

  font-weight:900;

  letter-spacing:.14em;

}


#ztv1-visual-hero .ztv1-modal video {

  display:block;

  width:100%;

  max-height:80vh;

  background:#000;

  border:

  1px solid
  rgba(246,212,118,.27);

  box-shadow:

  0 45px 120px
  rgba(0,0,0,.85);

}


#ztv1-visual-hero .ztv1-modal-close {

  position:absolute;

  top:

  max(
    18px,
    env(safe-area-inset-top)
  );

  right:

  max(
    20px,
    env(safe-area-inset-right)
  );

  width:48px;
  height:48px;

  display:grid;

  place-items:center;

  padding:0;

  border:

  1px solid
  rgba(246,212,118,.25);

  color:white;

  background:

  rgba(255,255,255,.04);

  font-size:26px;

  cursor:pointer;

}



/* ==============================
   ANIMATIONS
============================== */

@keyframes ztv1-status-pulse {

  0%,100% {

    opacity:.55;

    transform:scale(.8);

  }

  50% {

    opacity:1;

    transform:scale(1.2);

  }

}


@keyframes ztv1-playhead {

  0%,100% {

    transform:translateX(0);

  }

  50% {

    transform:translateX(100%);

  }

}



/* ==============================
   RESPONSIVE
============================== */

@media(max-width:1100px) {

  #ztv1-visual-hero {

    min-height:auto;

  }


  #ztv1-visual-hero .ztv1-container {

    min-height:auto;

  }


  #ztv1-visual-hero .ztv1-main {

    grid-template-columns:1fr;

    padding-top:100px;

  }


  #ztv1-visual-hero .ztv1-copy {

    max-width:850px;

  }


  #ztv1-visual-hero .ztv1-editor {

    width:min(760px,100%);

    transform:none;

  }

}


@media(max-width:700px) {

  #ztv1-visual-hero .ztv1-container {

    width:

    calc(100% - 34px);

    padding-top:20px;

  }


  #ztv1-visual-hero .ztv1-status {

    display:none;

  }


  #ztv1-visual-hero .ztv1-main {

    gap:48px;

    padding:

    80px 0 60px;

  }


  #ztv1-visual-hero .ztv1-title {

    font-size:

    clamp(55px,18vw,84px);

  }


  #ztv1-visual-hero .ztv1-lead {

    font-size:15px;

  }


  #ztv1-visual-hero .ztv1-actions {

    display:grid;

  }


  #ztv1-visual-hero .ztv1-btn {

    width:100%;

  }


  #ztv1-visual-hero .ztv1-bottom {

    grid-template-columns:

    repeat(2,1fr);

  }


  #ztv1-visual-hero .ztv1-bottom div:nth-child(2) {

    border-right:0;

  }


  #ztv1-visual-hero .ztv1-bottom div {

    border-bottom:

    1px solid
    rgba(246,212,118,.09);

  }

}


@media(prefers-reduced-motion:reduce) {

  #ztv1-visual-hero .ztv1-playhead,
  #ztv1-visual-hero .ztv1-status span {

    animation:none !important;

  }

}





#ztv2-capabilities{

  --c-black:#050505;
  --c-gold:#d8a328;
  --c-gold-light:#f6d476;
  --c-pale:#fff1bf;
  --c-white:#fffaf0;
  --c-muted:rgba(255,250,240,.64);
  --c-border:rgba(246,212,118,.14);

  width:100%;
  max-width:100%;

  margin-left:0;
  margin-right:0;

  position:relative;

  overflow:hidden;

  padding:
  clamp(90px,9vw,170px)
  clamp(18px,4vw,70px);

  color:var(--c-white);

  background:

  radial-gradient(
    circle at 80% 10%,
    rgba(216,163,40,.09),
    transparent 27%
  ),

  linear-gradient(
    180deg,
    #030303,
    #080807
  );

  direction:ltr;
  text-align:left;

  font-family:inherit!important;

}


#ztv2-capabilities *,
#ztv2-capabilities *::before,
#ztv2-capabilities *::after{

  box-sizing:border-box;

  direction:ltr;

}


#ztv2-capabilities::before{

  content:"VISUAL";

  position:absolute;

  right:-5vw;
  top:10%;

  color:transparent;

  -webkit-text-stroke:

  1px
  rgba(246,212,118,.035);

  font-size:

  clamp(
    180px,
    26vw,
    500px
  );

  line-height:.8;

  font-weight:950;

  letter-spacing:-.1em;

  pointer-events:none;

}


#ztv2-capabilities .ztv2-container{

  width:min(1640px,100%);

  margin:auto;

  position:relative;

  z-index:2;

}


#ztv2-capabilities .ztv2-head{

  display:grid;

  grid-template-columns:

  minmax(0,1fr)

  minmax(300px,520px);

  gap:

  clamp(40px,7vw,120px);

  align-items:end;

  margin-bottom:

  clamp(55px,6vw,90px);

}


#ztv2-capabilities .ztv2-kicker{

  display:flex;

  align-items:center;

  gap:11px;

  margin-bottom:17px;

  color:var(--c-gold-light);

  font-size:10px;

  font-weight:900;

  letter-spacing:.16em;

  text-transform:uppercase;

}


#ztv2-capabilities .ztv2-kicker::before{

  content:"";

  width:30px;
  height:1px;

  background:var(--c-gold);

}


#ztv2-capabilities h2{

  margin:0;

  max-width:900px;

  color:white;

  font-size:

  clamp(
    46px,
    5.4vw,
    100px
  );

  line-height:.95;

  letter-spacing:-.055em;

}


#ztv2-capabilities h2 span{

  display:block;

  color:var(--c-gold-light);

}


#ztv2-capabilities .ztv2-head p{

  margin:0;

  color:var(--c-muted);

  font-size:

  clamp(
    14px,
    1vw,
    17px
  );

  line-height:1.9;

}


#ztv2-capabilities .ztv2-grid{

  display:grid;

  grid-template-columns:

  repeat(3,minmax(0,1fr));

  border-top:

  1px solid
  var(--c-border);

  border-left:

  1px solid
  var(--c-border);

}


#ztv2-capabilities .ztv2-card{

  min-width:0;

  min-height:330px;

  position:relative;

  padding:

  clamp(30px,3vw,48px);

  overflow:hidden;

  background:

  rgba(255,255,255,.018);

  border-right:

  1px solid
  var(--c-border);

  border-bottom:

  1px solid
  var(--c-border);

  transition:

  background .35s ease,
  transform .35s ease;

}


#ztv2-capabilities .ztv2-card::before{

  content:"";

  position:absolute;

  width:280px;
  height:280px;

  left:50%;
  top:50%;

  transform:
  translate(var(--mx,0px),var(--my,0px)) translate(-50%,-50%);

  opacity:0;

  pointer-events:none;

  background:

  radial-gradient(
    circle,
    rgba(216,163,40,.14),
    transparent 67%
  );

  transition:opacity .3s ease;

}


@media(hover:hover) and (pointer:fine){

  #ztv2-capabilities .ztv2-card:hover{

    background:

    rgba(216,163,40,.045);

  }


  #ztv2-capabilities .ztv2-card:hover::before{

    opacity:1;

  }

}


#ztv2-capabilities .ztv2-index{

  display:flex;

  justify-content:space-between;

  align-items:center;

  margin-bottom:

  clamp(65px,8vw,110px);

}


#ztv2-capabilities .ztv2-index > span{

  color:var(--c-gold);

  font-size:9px;

  font-weight:900;

  letter-spacing:.14em;

}


#ztv2-capabilities .ztv2-icon{

  width:51px;
  height:51px;

  display:grid;

  place-items:center;

  color:var(--c-gold-light);

  border:

  1px solid
  rgba(246,212,118,.22);

  background:

  rgba(216,163,40,.045);

}





#ztv2-capabilities .ztv2-card small{

  display:block;

  margin-bottom:11px;

  color:

  rgba(255,250,240,.38);

  font-size:8px;

  font-weight:800;

  letter-spacing:.15em;

  text-transform:uppercase;

}


#ztv2-capabilities .ztv2-card h3{

  margin:0;

  color:white;

  font-size:

  clamp(
    23px,
    2vw,
    33px
  );

  line-height:1.15;

  letter-spacing:-.035em;

}


#ztv2-capabilities .ztv2-card p{

  margin:16px 0 0;

  max-width:35ch;

  color:var(--c-muted);

  font-size:13px;

  line-height:1.8;

}


#ztv2-capabilities .ztv2-footer{

  display:flex;

  align-items:center;

  justify-content:space-between;

  gap:25px;

  margin-top:

  clamp(45px,5vw,75px);

  padding-top:25px;

  border-top:

  1px solid
  var(--c-border);

}


#ztv2-capabilities .ztv2-footer strong{

  color:var(--c-pale);

  font-size:

  clamp(
    16px,
    1.5vw,
    22px
  );

}


#ztv2-capabilities .ztv2-footer span{

  color:

  rgba(255,250,240,.40);

  font-size:9px;

  font-weight:800;

  letter-spacing:.14em;

  text-transform:uppercase;

}


@media(max-width:1050px){

  #ztv2-capabilities .ztv2-grid{

    grid-template-columns:

    repeat(2,1fr);

  }

}


@media(max-width:750px){

  #ztv2-capabilities{

    padding:

    85px 18px;

  }


  #ztv2-capabilities .ztv2-head{

    grid-template-columns:1fr;

  }


  #ztv2-capabilities .ztv2-grid{

    grid-template-columns:1fr;

  }


  #ztv2-capabilities .ztv2-card{

    min-height:280px;

  }


  #ztv2-capabilities .ztv2-index{

    margin-bottom:55px;

  }


  #ztv2-capabilities .ztv2-footer{

    flex-direction:column;

    align-items:flex-start;

  }

}





#ztv3-selected-work{

  --w-black:#030303;
  --w-black2:#080807;

  --w-gold:#d8a328;
  --w-gold2:#f6d476;
  --w-pale:#fff1bf;

  --w-white:#fffaf0;

  --w-muted:
  rgba(255,250,240,.60);

  --w-border:
  rgba(246,212,118,.15);

  position:relative;

  width:100%;
  max-width:100%;

  margin-left:
  0;

  margin-right:
  0;

  padding:

  clamp(
    90px,
    9vw,
    170px
  )

  clamp(
    18px,
    4vw,
    75px
  );

  overflow:hidden;

  color:var(--w-white);

  background:

  radial-gradient(
    circle at 50% 20%,
    rgba(216,163,40,.08),
    transparent 35%
  ),

  linear-gradient(
    180deg,
    #080807,
    #020202
  );

  direction:ltr;
  text-align:left;

  font-family:inherit!important;

}


#ztv3-selected-work *,
#ztv3-selected-work *::before,
#ztv3-selected-work *::after{

  box-sizing:border-box;

  direction:ltr;

}


#ztv3-selected-work button{

  font:inherit;

}


#ztv3-selected-work .ztv3-container{

  width:min(1720px,100%);

  margin:auto;

}



/* ===============================
   HEADER
=============================== */

#ztv3-selected-work .ztv3-head{

  display:flex;

  align-items:flex-end;

  justify-content:space-between;

  gap:40px;

  margin-bottom:

  clamp(
    45px,
    5vw,
    80px
  );

}


#ztv3-selected-work .ztv3-kicker{

  display:flex;

  align-items:center;

  gap:10px;

  margin-bottom:15px;

  color:var(--w-gold2);

  font-size:10px;

  font-weight:900;

  letter-spacing:.15em;

  text-transform:uppercase;

}


#ztv3-selected-work .ztv3-kicker::before{

  content:"";

  width:26px;
  height:1px;

  background:var(--w-gold);

}


#ztv3-selected-work h2{

  margin:0;

  max-width:930px;

  color:white;

  font-size:

  clamp(
    48px,
    6vw,
    108px
  );

  line-height:.92;

  font-weight:850;

  letter-spacing:-.055em;

}


#ztv3-selected-work h2 span{

  color:var(--w-gold2);

}


#ztv3-selected-work .ztv3-intro{

  max-width:580px;

  margin:21px 0 0;

  color:var(--w-muted);

  font-size:15px;

  line-height:1.85;

}



/* ===============================
   FILTER
=============================== */

#ztv3-selected-work .ztv3-filter{

  display:flex;

  flex-wrap:wrap;

  gap:7px;

  justify-content:flex-end;

}


#ztv3-selected-work .ztv3-filter button{

  min-height:39px;

  padding:0 14px;

  color:

  rgba(255,250,240,.50);

  background:

  rgba(255,255,255,.02);

  border:

  1px solid
  rgba(246,212,118,.13);

  cursor:pointer;

  font-size:8px;

  font-weight:850;

  letter-spacing:.12em;

  text-transform:uppercase;

  transition:background-color .25s ease,border-color .25s ease,color .25s ease;

}


#ztv3-selected-work .ztv3-filter button.is-active{

  color:#171006;

  background:

  linear-gradient(
    135deg,
    var(--w-pale),
    var(--w-gold)
  );

  border-color:
  var(--w-gold2);

}



/* ===============================
   PROJECT GRID
=============================== */

#ztv3-selected-work .ztv3-grid{

  display:grid;

  grid-template-columns:

  repeat(12,minmax(0,1fr));

  gap:

  clamp(
    12px,
    1.4vw,
    24px
  );

}


#ztv3-selected-work .ztv3-project{

  min-width:0;

  position:relative;

  padding:0;

  overflow:hidden;

  color:white;

  text-align:left;

  background:#080808;

  border:

  1px solid
  var(--w-border);

  cursor:pointer;

  transition:

  transform .4s ease,
  border-color .4s ease,
  box-shadow .4s ease,
  opacity .3s ease;

}


#ztv3-selected-work .ztv3-project[data-size="hero"]{

  grid-column:span 8;

}


#ztv3-selected-work .ztv3-project[data-size="portrait"]{

  grid-column:span 4;

}


#ztv3-selected-work .ztv3-project[data-size="normal"]{

  grid-column:span 4;

}


#ztv3-selected-work .ztv3-project[data-size="wide"]{

  grid-column:span 8;

}


#ztv3-selected-work .ztv3-project.is-hidden{

  display:none;

}



/* ===============================
   MEDIA
=============================== */

#ztv3-selected-work .ztv3-media{

  position:relative;

  width:100%;

  height:

  clamp(
    390px,
    34vw,
    640px
  );

  overflow:hidden;

  background:

  radial-gradient(
    circle at 70% 25%,
    rgba(216,163,40,.22),
    transparent 28%
  ),

  linear-gradient(
    135deg,
    #030303,
    #171006
  );

}


#ztv3-selected-work
.ztv3-project[data-size="portrait"]
.ztv3-media{

  height:

  clamp(
    470px,
    45vw,
    760px
  );

}


#ztv3-selected-work .ztv3-poster{

  position:absolute;

  inset:0;

  width:100%;
  height:100%;

  display:block;

  object-fit:cover;

  opacity:.82;

  filter:

  saturate(.8)
  contrast(1.08);

  transform:scale(1.01);

  transition:

  transform .8s
  cubic-bezier(.2,.7,.2,1),

  filter .5s ease;

}


#ztv3-selected-work .ztv3-project.no-poster .ztv3-poster{

  display:none;

}



/* EMPTY PLACEHOLDER */

#ztv3-selected-work .ztv3-placeholder{

  position:absolute;

  inset:0;

  display:grid;

  place-items:center;

  pointer-events:none;

}


#ztv3-selected-work .ztv3-placeholder-inner{

  position:relative;

  width:

  min(
    78%,
    440px
  );

  aspect-ratio:16 / 9;

  display:grid;

  place-items:center;

  border:

  1px solid
  rgba(246,212,118,.20);

  background:

  rgba(0,0,0,.24);

}


#ztv3-selected-work .ztv3-placeholder-inner::before,
#ztv3-selected-work .ztv3-placeholder-inner::after{

  position:absolute;

  width:25px;
  height:25px;

  content:"";

}


#ztv3-selected-work .ztv3-placeholder-inner::before{

  top:-1px;
  left:-1px;

  border-top:

  1px solid
  var(--w-gold2);

  border-left:

  1px solid
  var(--w-gold2);

}


#ztv3-selected-work .ztv3-placeholder-inner::after{

  right:-1px;
  bottom:-1px;

  border-right:

  1px solid
  var(--w-gold2);

  border-bottom:

  1px solid
  var(--w-gold2);

}


#ztv3-selected-work .ztv3-slot-copy{

  text-align:center;

}


#ztv3-selected-work .ztv3-slot-copy strong{

  display:block;

  color:

  var(--w-gold2);

  font-size:10px;

  letter-spacing:.16em;

}


#ztv3-selected-work .ztv3-slot-copy span{

  display:block;

  margin-top:8px;

  color:

  rgba(255,250,240,.35);

  font-size:8px;

  letter-spacing:.12em;

}



/* SHADE */

#ztv3-selected-work .ztv3-shade{

  position:absolute;

  z-index:2;

  inset:0;

  pointer-events:none;

  background:

  linear-gradient(
    180deg,
    rgba(0,0,0,.04),
    rgba(0,0,0,.08) 40%,
    rgba(0,0,0,.91)
  );

}



/* TOP META */

#ztv3-selected-work .ztv3-meta{

  position:absolute;

  z-index:3;

  top:

  clamp(
    17px,
    1.5vw,
    28px
  );

  left:

  clamp(
    17px,
    1.5vw,
    28px
  );

  right:

  clamp(
    17px,
    1.5vw,
    28px
  );

  display:flex;

  justify-content:space-between;

  align-items:center;

  gap:10px;

}


#ztv3-selected-work .ztv3-number,
#ztv3-selected-work .ztv3-type{

  display:inline-flex;

  align-items:center;

  min-height:28px;

  padding:0 10px;

  color:

  rgba(255,250,240,.65);

  background:

  rgba(0,0,0,.46);

  border:

  1px solid
  rgba(246,212,118,.17);

  backdrop-filter:blur(12px);

  -webkit-backdrop-filter:blur(12px);

  font-size:7px;

  font-weight:850;

  letter-spacing:.14em;

}


#ztv3-selected-work .ztv3-number{

  color:var(--w-gold2);

}



/* CONTENT */

#ztv3-selected-work .ztv3-content{

  position:absolute;

  z-index:4;

  left:

  clamp(
    20px,
    2vw,
    38px
  );

  right:

  clamp(
    20px,
    2vw,
    38px
  );

  bottom:

  clamp(
    20px,
    2vw,
    38px
  );

}


#ztv3-selected-work .ztv3-content small{

  display:block;

  margin-bottom:9px;

  color:var(--w-gold2);

  font-size:8px;

  font-weight:850;

  letter-spacing:.14em;

  text-transform:uppercase;

}


#ztv3-selected-work .ztv3-content h3{

  margin:0;

  color:#fff;

  font-size:

  clamp(
    25px,
    2.5vw,
    48px
  );

  line-height:1.05;

  letter-spacing:-.04em;

}


#ztv3-selected-work .ztv3-content p{

  max-width:45ch;

  margin:11px 0 0;

  color:

  rgba(255,250,240,.59);

  font-size:

  clamp(
    11px,
    .8vw,
    14px
  );

  line-height:1.65;

}



/* PLAY BUTTON */

#ztv3-selected-work .ztv3-play{

  position:absolute;

  z-index:5;

  right:

  clamp(
    18px,
    1.7vw,
    30px
  );

  top:50%;

  width:

  clamp(
    52px,
    4vw,
    68px
  );

  height:

  clamp(
    52px,
    4vw,
    68px
  );

  display:grid;

  place-items:center;

  color:#111;

  background:

  linear-gradient(
    135deg,
    var(--w-pale),
    var(--w-gold)
  );

  border-radius:50%;

  transform:

  translateY(-50%);

  box-shadow:

  0 16px 40px
  rgba(216,163,40,.28);

  transition:

  transform .35s ease;

}





@media(hover:hover) and (pointer:fine){

  #ztv3-selected-work .ztv3-project:hover{

    transform:

    translateY(-7px);

    border-color:

    rgba(246,212,118,.40);

    box-shadow:

    0 38px 90px
    rgba(0,0,0,.55);

  }


  #ztv3-selected-work
  .ztv3-project:hover
  .ztv3-poster{

    transform:scale(1.065);

    filter:

    saturate(1)
    contrast(1.08);

  }


  #ztv3-selected-work
  .ztv3-project:hover
  .ztv3-play{

    transform:

    translateY(-50%)
    scale(1.09);

  }

}



/* ===============================
   MODAL
=============================== */

#ztv3-selected-work .ztv3-modal{

  position:fixed;

  z-index:2147481000;

  inset:0;

  display:flex;

  align-items:center;

  justify-content:center;

  padding:

  clamp(
    16px,
    4vw,
    70px
  );

  background:

  rgba(0,0,0,.94);

  backdrop-filter:blur(22px);

  -webkit-backdrop-filter:blur(22px);

  opacity:0;

  visibility:hidden;

  pointer-events:none;

  transition:opacity .3s ease,visibility .3s ease; 

}


#ztv3-selected-work .ztv3-modal.is-open{

  opacity:1;

  visibility:visible;

  pointer-events:auto;

}


#ztv3-selected-work .ztv3-modal-box{

  width:min(1450px,100%);

}


#ztv3-selected-work .ztv3-modal-head{

  display:flex;

  align-items:end;

  justify-content:space-between;

  gap:30px;

  margin-bottom:14px;

}


#ztv3-selected-work .ztv3-modal-head small{

  color:var(--w-gold2);

  font-size:8px;

  font-weight:850;

  letter-spacing:.14em;

}


#ztv3-selected-work .ztv3-modal-head strong{

  display:block;

  margin-top:6px;

  color:white;

  font-size:

  clamp(
    18px,
    2vw,
    28px
  );

}


#ztv3-selected-work .ztv3-close{

  width:43px;
  height:43px;

  padding:0;

  display:grid;

  place-items:center;

  color:#fff;

  background:

  rgba(255,255,255,.04);

  border:

  1px solid
  rgba(246,212,118,.20);

  cursor:pointer;

  font-size:25px;

}


#ztv3-selected-work .ztv3-video{

  width:100%;

  max-height:78vh;

  display:block;

  background:#000;

  border:

  1px solid
  rgba(246,212,118,.20);

}


#ztv3-selected-work .ztv3-no-video{

  min-height:

  min(
    640px,
    70vh
  );

  display:none;

  place-items:center;

  padding:30px;

  text-align:center;

  background:

  radial-gradient(
    circle,
    rgba(216,163,40,.10),
    transparent 32%
  ),

  #050505;

  border:

  1px solid
  rgba(246,212,118,.20);

}


#ztv3-selected-work .ztv3-no-video strong{

  display:block;

  color:var(--w-gold2);

  font-size:

  clamp(
    22px,
    3vw,
    42px
  );

}


#ztv3-selected-work .ztv3-no-video span{

  display:block;

  max-width:500px;

  margin:12px auto 0;

  color:

  rgba(255,250,240,.48);

  font-size:13px;

  line-height:1.8;

}



/* RESPONSIVE */

@media(max-width:1050px){

  #ztv3-selected-work .ztv3-head{

    display:block;

  }


  #ztv3-selected-work .ztv3-filter{

    justify-content:flex-start;

    margin-top:30px;

  }


  #ztv3-selected-work
  .ztv3-project[data-size]{

    grid-column:span 6;

  }

}


@media(max-width:650px){

  #ztv3-selected-work{

    padding:

    85px 17px;

  }


  #ztv3-selected-work
  .ztv3-project[data-size]{

    grid-column:1 / -1;

  }


  #ztv3-selected-work .ztv3-media,
  #ztv3-selected-work
  .ztv3-project[data-size="portrait"]
  .ztv3-media{

    height:

    clamp(
      390px,
      120vw,
      580px
    );

  }


  #ztv3-selected-work .ztv3-filter{

    display:grid;

    grid-template-columns:

    repeat(2,1fr);

  }


  #ztv3-selected-work .ztv3-filter button{

    width:100%;

  }

}





#ztv5-process{

  --p-gold:#d8a328;
  --p-light:#f6d476;
  --p-pale:#fff1bf;

  --p-white:#fffaf0;

  --p-muted:
  rgba(255,250,240,.60);

  --p-border:
  rgba(246,212,118,.14);

  width:100%;
  max-width:100%;

  margin-left:
  0;

  margin-right:
  0;

  padding:

  clamp(
    90px,
    9vw,
    170px
  )

  clamp(
    18px,
    4vw,
    72px
  );

  overflow:hidden;

  position:relative;

  color:var(--p-white);

  background:

  radial-gradient(
    circle at 85% 70%,
    rgba(216,163,40,.10),
    transparent 32%
  ),

  linear-gradient(
    180deg,
    #030303,
    #090907
  );

  direction:ltr;

  font-family:inherit!important;

}


#ztv5-process *,
#ztv5-process *::before,
#ztv5-process *::after{

  box-sizing:border-box;

  direction:ltr;

}


#ztv5-process a{

  color:inherit;

  text-decoration:none;

}


#ztv5-process .ztv5-container{

  width:min(1640px,100%);

  margin:auto;

}



/* ============================
   HEADER
============================ */

#ztv5-process .ztv5-head{

  max-width:950px;

  margin-bottom:

  clamp(
    60px,
    7vw,
    105px
  );

}


#ztv5-process .ztv5-kicker{

  display:flex;

  align-items:center;

  gap:10px;

  margin-bottom:17px;

  color:var(--p-light);

  font-size:9px;

  font-weight:900;

  letter-spacing:.16em;

}


#ztv5-process .ztv5-kicker::before{

  content:"";

  width:27px;
  height:1px;

  background:var(--p-gold);

}


#ztv5-process h2{

  margin:0;

  color:white;

  font-size:

  clamp(
    48px,
    6vw,
    105px
  );

  line-height:.94;

  letter-spacing:-.055em;

}


#ztv5-process h2 span{

  display:block;

  color:var(--p-light);

}


#ztv5-process .ztv5-head p{

  max-width:720px;

  margin:25px 0 0;

  color:var(--p-muted);

  font-size:15px;

  line-height:1.9;

}



/* ============================
   PROCESS
============================ */

#ztv5-process .ztv5-process-grid{

  display:grid;

  grid-template-columns:

  repeat(6,minmax(0,1fr));

  border-top:

  1px solid
  var(--p-border);

  border-left:

  1px solid
  var(--p-border);

}


#ztv5-process .ztv5-step{

  position:relative;

  min-height:280px;

  padding:

  clamp(
    22px,
    2.3vw,
    36px
  );

  border-right:

  1px solid
  var(--p-border);

  border-bottom:

  1px solid
  var(--p-border);

  background:

  rgba(255,255,255,.016);

  transition:background-color .3s ease; 

}


@media(hover:hover) and (pointer:fine){

  #ztv5-process .ztv5-step:hover{

    background:

    rgba(216,163,40,.055);

  }

}


#ztv5-process .ztv5-step > span{

  display:block;

  color:var(--p-gold);

  font-size:8px;

  font-weight:900;

  letter-spacing:.14em;

}


#ztv5-process .ztv5-step-icon{

  width:44px;
  height:44px;

  margin:

  clamp(
    50px,
    6vw,
    85px
  )
  0
  24px;

  display:grid;

  place-items:center;

  color:var(--p-light);

  border:

  1px solid
  rgba(246,212,118,.20);

}





#ztv5-process .ztv5-step strong{

  display:block;

  color:var(--p-pale);

  font-size:

  clamp(
    16px,
    1.35vw,
    22px
  );

}


#ztv5-process .ztv5-step p{

  margin:9px 0 0;

  color:

  rgba(255,250,240,.43);

  font-size:11px;

  line-height:1.7;

}



/* ============================
   TOOLS
============================ */

#ztv5-process .ztv5-tools{

  display:grid;

  grid-template-columns:

  minmax(280px,.7fr)

  minmax(0,1.3fr);

  gap:

  clamp(
    45px,
    7vw,
    110px
  );

  align-items:center;

  margin-top:

  clamp(
    90px,
    10vw,
    160px
  );

}


#ztv5-process .ztv5-tools-copy small{

  display:block;

  color:var(--p-gold);

  font-size:9px;

  font-weight:900;

  letter-spacing:.16em;

}


#ztv5-process .ztv5-tools-copy h3{

  margin:

  14px 0 0;

  color:white;

  font-size:

  clamp(
    34px,
    4vw,
    68px
  );

  line-height:1;

  letter-spacing:-.05em;

}


#ztv5-process .ztv5-tools-copy p{

  max-width:500px;

  margin:20px 0 0;

  color:var(--p-muted);

  font-size:14px;

  line-height:1.85;

}


#ztv5-process .ztv5-tools-grid{

  display:grid;

  grid-template-columns:

  repeat(4,1fr);

  gap:12px;

}


#ztv5-process .ztv5-tool{

  min-height:190px;

  padding:25px;

  display:flex;

  flex-direction:column;

  justify-content:space-between;

  border:

  1px solid
  var(--p-border);

  background:

  linear-gradient(
    145deg,
    rgba(255,255,255,.035),
    rgba(255,255,255,.012)
  );

  transition:

  transform .3s ease,
  border-color .3s ease;

}


@media(hover:hover) and (pointer:fine){

  #ztv5-process .ztv5-tool:hover{

    transform:

    translateY(-7px);

    border-color:

    rgba(246,212,118,.40);

  }

}


#ztv5-process .ztv5-tool-logo{

  width:50px;
  height:50px;

  display:grid;

  place-items:center;

  color:var(--p-light);

  border:

  1px solid
  rgba(246,212,118,.20);

  background:

  rgba(216,163,40,.05);

  font-size:15px;

  font-weight:950;

  letter-spacing:-.06em;

}


#ztv5-process .ztv5-tool strong{

  color:var(--p-pale);

  font-size:14px;

}


#ztv5-process .ztv5-tool span{

  display:block;

  margin-top:4px;

  color:

  rgba(255,250,240,.37);

  font-size:8px;

  letter-spacing:.08em;

}



/* ============================
   CTA
============================ */

#ztv5-process .ztv5-cta{

  position:relative;

  display:grid;

  grid-template-columns:

  auto minmax(0,1fr) auto;

  gap:

  clamp(
    20px,
    3vw,
    45px
  );

  align-items:center;

  margin-top:

  clamp(
    90px,
    10vw,
    160px
  );

  padding:

  clamp(
    28px,
    4vw,
    58px
  );

  overflow:hidden;

  border:

  1px solid
  rgba(246,212,118,.27);

  background:

  linear-gradient(
    135deg,
    rgba(216,163,40,.13),
    rgba(255,255,255,.018)
  );

}


#ztv5-process .ztv5-cta::after{

  content:"";

  position:absolute;

  right:-110px;
  bottom:-170px;

  width:320px;
  height:320px;

  border-radius:50%;

  border:

  1px solid
  rgba(246,212,118,.10);

  box-shadow:

  0 0 0 30px
  rgba(216,163,40,.018),

  0 0 0 64px
  rgba(216,163,40,.012);

}


#ztv5-process .ztv5-cta-logo{

  position:relative;

  z-index:2;

  width:

  clamp(
    68px,
    6vw,
    94px
  );

  height:

  clamp(
    68px,
    6vw,
    94px
  );

  padding:9px;

  border:

  1px solid
  rgba(246,212,118,.25);

  background:

  rgba(0,0,0,.30);

}


#ztv5-process .ztv5-cta-logo img{

  width:100%;
  height:100%;

  display:block;

  object-fit:contain;

}


#ztv5-process .ztv5-cta-copy{

  position:relative;

  z-index:2;

}


#ztv5-process .ztv5-cta-copy small{

  color:var(--p-light);

  font-size:8px;

  font-weight:900;

  letter-spacing:.15em;

}


#ztv5-process .ztv5-cta-copy h3{

  margin:8px 0 0;

  color:white;

  font-size:

  clamp(
    27px,
    3vw,
    48px
  );

  line-height:1.1;

  letter-spacing:-.04em;

}


#ztv5-process .ztv5-cta-copy p{

  max-width:650px;

  margin:10px 0 0;

  color:

  rgba(255,250,240,.53);

  font-size:13px;

  line-height:1.7;

}


#ztv5-process .ztv5-cta-btn{

  position:relative;

  z-index:2;

  min-height:58px;

  padding:0 27px;

  display:inline-flex;

  align-items:center;

  justify-content:center;

  gap:10px;

  color:#171006;

  background:

  linear-gradient(
    135deg,
    var(--p-pale),
    var(--p-light),
    var(--p-gold)
  );

  border:

  1px solid
  #ffe3a0;

  font-size:9px;

  font-weight:900;

  letter-spacing:.10em;

  white-space:nowrap;

  transition:

  transform .25s ease,
  box-shadow .25s ease;

}





@media(hover:hover) and (pointer:fine){

  #ztv5-process .ztv5-cta-btn:hover{

    transform:

    translateY(-4px);

    box-shadow:

    0 20px 42px
    rgba(216,163,40,.30);

  }

}



/* ============================
   RESPONSIVE
============================ */

@media(max-width:1250px){

  #ztv5-process .ztv5-process-grid{

    grid-template-columns:

    repeat(3,1fr);

  }


  #ztv5-process .ztv5-tools{

    grid-template-columns:1fr;

  }

}


@media(max-width:800px){

  #ztv5-process .ztv5-tools-grid{

    grid-template-columns:

    repeat(2,1fr);

  }


  #ztv5-process .ztv5-cta{

    grid-template-columns:

    auto 1fr;

  }


  #ztv5-process .ztv5-cta-btn{

    grid-column:1 / -1;

    width:100%;

  }

}


@media(max-width:650px){

  #ztv5-process{

    padding:

    85px 17px;

  }


  #ztv5-process .ztv5-process-grid{

    grid-template-columns:1fr;

  }


  #ztv5-process .ztv5-step{

    min-height:240px;

  }


  #ztv5-process .ztv5-tools-grid{

    grid-template-columns:1fr;

  }


  #ztv5-process .ztv5-tool{

    min-height:150px;

  }


  #ztv5-process .ztv5-cta{

    grid-template-columns:1fr;

  }

}
/* ==========================================================
   ZT VISUAL — STUDIO FINISH
   Keeps the existing five modules and follows the Home palette.
   All rules stay inside the Visual page IDs.
========================================================== */

#ztv1-visual-hero,
#ztv2-capabilities,
#ztv3-selected-work,
#ztv4-before-after,
#ztv5-process {
  --ztv-ink: #000;
  --ztv-panel: #0b0b0a;
  --ztv-line: rgba(237,177,38,.21);
  --ztv-gold: #edb126;
  --ztv-cream: #f8f3e8;
  --ztv1-gold: #edb126;
  --ztv1-gold-2: #f6d57d;
  --ztv2-gold: #edb126;
  --ztv3-gold: #edb126;
  --ztv4-gold: #edb126;
  --ztv5-gold: #edb126;
  background-color: #000;
  color: var(--ztv-cream);
}

#ztv1-visual-hero { min-height: min(920px, 100svh); background: #000; }
#ztv1-visual-hero .ztv1-container {
  width: min(1560px, calc(100% - clamp(36px, 8vw, 144px)));
  min-height: min(920px, 100svh);
  padding-top: clamp(28px, 4vw, 62px);
  padding-bottom: clamp(28px, 4vw, 62px);
}
#ztv1-visual-hero .ztv1-video-layer { background: #000; }
#ztv1-visual-hero .ztv1-bg-video {
  object-fit: cover;
  opacity: .76;
  filter: saturate(.88) contrast(1.04) brightness(.8);
}
#ztv1-visual-hero .ztv1-video-shade {
  background: linear-gradient(90deg,rgba(0,0,0,.94) 0%,rgba(0,0,0,.75) 45%,rgba(0,0,0,.38) 100%),
    linear-gradient(0deg,rgba(0,0,0,.9),transparent 34%,rgba(0,0,0,.3));
}
#ztv1-visual-hero .ztv1-video-grid { opacity: .12; }
#ztv1-visual-hero .ztv1-orbit { opacity: .26; }
#ztv1-visual-hero .ztv1-topbar {
  border-bottom: 1px solid rgba(255,255,255,.16);
  padding-bottom: clamp(18px,2vw,32px);
}
#ztv1-visual-hero .ztv1-main {
  grid-template-columns: minmax(0,1.25fr) minmax(310px,.72fr);
  gap: clamp(32px,5vw,95px);
  padding: clamp(60px,8vh,115px) 0 clamp(30px,6vh,90px);
}
#ztv1-visual-hero .ztv1-title {
  max-width: 13ch;
  font-size: clamp(3.8rem, 7vw, 8.6rem);
  line-height: .95;
  letter-spacing: -.07em;
  text-wrap: balance;
}
#ztv1-visual-hero .ztv1-title span { color: #edb126; }
#ztv1-visual-hero .ztv1-lead {
  max-width: 52ch;
  color: rgba(248,243,232,.78);
  line-height: 1.7;
  font-size: clamp(1rem,1.25vw,1.2rem);
}
#ztv1-visual-hero .ztv1-kicker,
#ztv1-visual-hero .ztv1-status { letter-spacing: .14em; }
#ztv1-visual-hero .ztv1-editor {
  border: 1px solid rgba(237,177,38,.28);
  background-color: rgba(8,8,7,.94);
  box-shadow: 0 38px 90px rgba(0,0,0,.54), 0 0 0 1px rgba(255,255,255,.035) inset;
  transform: rotate(1.4deg);
}
#ztv1-visual-hero .ztv1-btn-primary,
#ztv5-process .ztv5-cta-btn { background-color: #edb126; color: #080806; }
#ztv1-visual-hero :is(a,button):focus-visible,
#ztv2-capabilities :is(a,button):focus-visible,
#ztv3-selected-work :is(a,button):focus-visible,
#ztv4-before-after :is(a,button):focus-visible,
#ztv5-process :is(a,button):focus-visible {
  outline: 2px solid #f6d57d;
  outline-offset: 4px;
}

/* A quiet, consistent rhythm between the service, portfolio, process and CTA. */
#ztv2-capabilities, #ztv3-selected-work, #ztv4-before-after, #ztv5-process {
  background-image: none;
}
#ztv2-capabilities { border-top: 1px solid var(--ztv-line); }
#ztv3-selected-work { border-top: 1px solid var(--ztv-line); background-color: #080807; }
#ztv4-before-after { border-top: 1px solid var(--ztv-line); }
#ztv5-process { border-top: 1px solid var(--ztv-line); }
#ztv2-capabilities h2 span,
#ztv3-selected-work h2 span,
#ztv4-before-after h2 span,
#ztv5-process h2 span { color: #edb126; }
#ztv3-selected-work .ztv3-project[data-size="hero"] { grid-column: 1 / -1; }
#ztv3-selected-work .ztv3-project[data-video=""],
#ztv3-selected-work .ztv3-project[hidden],
#ztv3-selected-work [data-filter][hidden] { display: none !important; }
#ztv3-selected-work .ztv3-project[data-size="hero"] .ztv3-media { min-height: clamp(420px,55vw,670px); }
#ztv3-selected-work .ztv3-project[data-size="hero"] .ztv3-poster {
  object-fit: contain;
  width: min(48%,450px);
  height: min(72%,450px);
  left: auto;
  right: 6%;
  top: 12%;
  opacity: .78;
  filter: none;
}
#ztv3-selected-work .ztv3-project[data-size="hero"] .ztv3-media {
  background: radial-gradient(circle at 77% 40%,rgba(237,177,38,.1),transparent 35%), #10100d;
}
#ztv3-selected-work .ztv3-project[data-size="hero"] .ztv3-shade {
  background: linear-gradient(90deg,rgba(0,0,0,.93),rgba(0,0,0,.76) 45%,rgba(0,0,0,.18));
}
#ztv3-selected-work .ztv3-project[data-size="hero"] .ztv3-content {
  max-width: 60%;
  z-index: 2;
}
#ztv4-before-after .ztv4-stage { border: 1px solid rgba(237,177,38,.22); }
#ztv5-process .ztv5-cta { background-color: #14120b; border: 1px solid rgba(237,177,38,.3); }
#ztv5-process .ztv5-cta-logo img { object-fit: contain; }

@media (max-width: 1100px) {
  #ztv1-visual-hero .ztv1-main { grid-template-columns: 1fr; }
  #ztv1-visual-hero .ztv1-editor { width: min(100%,630px); transform: none; }
  #ztv1-visual-hero .ztv1-container { min-height: auto; }
  #ztv1-visual-hero { min-height: auto; }
}
@media (max-width: 700px) {
  #ztv1-visual-hero .ztv1-container { width: calc(100% - 36px); }
  #ztv1-visual-hero .ztv1-main { gap: 30px; padding: 68px 0 45px; }
  #ztv1-visual-hero .ztv1-title { font-size: clamp(3.6rem,13vw,5.6rem); max-width: 10ch; }
  #ztv1-visual-hero .ztv1-editor { display: none; }
  #ztv1-visual-hero .ztv1-video-shade { background: linear-gradient(90deg,rgba(0,0,0,.9),rgba(0,0,0,.7)),linear-gradient(0deg,#000,transparent 60%); }
  #ztv3-selected-work .ztv3-project[data-size="hero"] .ztv3-media { min-height: 480px; }
  #ztv3-selected-work .ztv3-project[data-size="hero"] .ztv3-poster { width: 68%; right: -7%; top: 8%; opacity: .45; }
  #ztv3-selected-work .ztv3-project[data-size="hero"] .ztv3-content { max-width: 90%; }
}
@media (prefers-reduced-motion: reduce) {
  #ztv1-visual-hero *, #ztv2-capabilities *, #ztv3-selected-work *,
  #ztv4-before-after *, #ztv5-process * { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}


/* ========================================================
   V2 / ART DIRECTION — September 2026
   The clipped gold button follows the supplied reference.
   Scoped to this page and independent of the site header.
======================================================== */

#ztv1-visual-hero,
#ztv2-capabilities,
#ztv3-selected-work,
#ztv-brief,
#ztv5-process { direction: ltr !important; text-align: left; }

#ztv1-visual-hero *,
#ztv2-capabilities *,
#ztv3-selected-work *,
#ztv-brief *,
#ztv5-process * { direction: ltr; }

/* Brand button: 20px top-right chamfer, 9px bottom-left chamfer,
   bright inset frame and an amber lower edge. */
#ztv1-visual-hero .ztv-cut-btn,
#ztv5-process .ztv-cut-btn,
#ztv-brief .ztv-cut-btn {
  --cut: 18px;
  position: relative;
  isolation: isolate;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: clamp(20px,3vw,56px);
  min-height: 62px;
  padding: 0 22px 6px 26px;
  border: 0;
  border-radius: 0;
  clip-path: polygon(0 0,calc(100% - var(--cut)) 0,100% var(--cut),100% 100%,9px 100%,0 calc(100% - 9px));
  color: #10100d;
  background: linear-gradient(to bottom,#f7c845 0%,#edb126 78%,#b17b0c 78%,#b17b0c 100%);
  box-shadow: none;
  font: inherit;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .105em;
  line-height: 1.1;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: filter .22s ease,transform .22s ease;
}
#ztv1-visual-hero .ztv-cut-btn::before,
#ztv5-process .ztv-cut-btn::before,
#ztv-brief .ztv-cut-btn::before {
  content: "";
  position: absolute;
  inset: 6px 7px 12px 8px;
  clip-path: polygon(0 0,calc(100% - 15px) 0,100% 15px,100% 100%,0 100%);
  border-top: 1px solid rgba(255,255,226,.85);
  border-left: 1px solid rgba(255,255,226,.7);
  pointer-events: none;
}
#ztv1-visual-hero .ztv-cut-btn::after,
#ztv5-process .ztv-cut-btn::after,
#ztv-brief .ztv-cut-btn::after {
  content: "";
  position: absolute;
  top: 20px;
  bottom: 14px;
  right: 39px;
  border-right: 1px solid rgba(104,70,4,.14);
  pointer-events: none;
}
#ztv1-visual-hero .ztv-cut-btn > span,
#ztv5-process .ztv-cut-btn > span,
#ztv-brief .ztv-cut-btn > span { position: relative; z-index: 1; }
#ztv1-visual-hero .ztv-btn-arrow,
#ztv5-process .ztv-btn-arrow,
#ztv-brief .ztv-btn-arrow { font-size: 19px; font-weight: 700; line-height: 1; }

/* The secondary action keeps the same geometry with an outlined finish. */
#ztv1-visual-hero .ztv1-btn-ghost.ztv-cut-btn {
  color: #f9e4ae;
  background: linear-gradient(to bottom,#252015 0%,#1e1a12 78%,#100f0c 78%,#100f0c 100%);
  border: 1px solid rgba(237,177,38,.52);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
#ztv1-visual-hero .ztv1-btn-ghost.ztv-cut-btn::before {
  border-color: rgba(237,177,38,.4);
}
#ztv1-visual-hero .ztv-cut-btn:hover,
#ztv5-process .ztv-cut-btn:hover,
#ztv-brief .ztv-cut-btn:hover {
  transform: translateY(-3px);
  filter: brightness(1.1);
  box-shadow: none;
}
#ztv1-visual-hero .ztv-cut-btn:active,
#ztv5-process .ztv-cut-btn:active,
#ztv-brief .ztv-cut-btn:active { transform: translateY(1px); }

#ztv1-visual-hero .ztv-cut-icon,
#ztv3-selected-work .ztv-cut-icon {
  clip-path: polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,8px 100%,0 calc(100% - 8px));
  background: #edb126;
  border: 1px solid #ffdb73;
  color: #0c0b08;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
#ztv1-visual-hero .ztv-cut-icon:hover,
#ztv3-selected-work .ztv-cut-icon:hover { background: #f8c74e; color: #000; }

#ztv1-visual-hero :is(a,button):focus-visible,
#ztv3-selected-work :is(a,button):focus-visible,
#ztv-brief a:focus-visible,
#ztv5-process a:focus-visible { outline: 2px solid #ffdb73; outline-offset: 5px; }

/* Alternate warm charcoal surfaces are more legible than continuous black. */
#ztv1-visual-hero { background: #0b0c0a; }
#ztv1-visual-hero .ztv1-video-shade {
  background: linear-gradient(90deg,rgba(8,9,8,.93),rgba(8,9,8,.76) 43%,rgba(9,10,9,.45)),
    linear-gradient(0deg,#0b0c0a,transparent 34%);
}
#ztv1-visual-hero .ztv1-editor { background: #1d1c18; }
#ztv2-capabilities { background: #151613; }
#ztv2-capabilities .ztv2-card { background: #20211d; border-color: rgba(237,177,38,.18); }
#ztv3-selected-work { background: #111310; }
#ztv3-selected-work .ztv3-project[data-size="hero"] .ztv3-media {
  background: radial-gradient(circle at 78% 40%,rgba(237,177,38,.15),transparent 37%),#24231d;
  border: 1px solid rgba(237,177,38,.23);
}
#ztv3-selected-work .ztv3-project {
  clip-path: polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,11px 100%,0 calc(100% - 11px));
}
#ztv3-selected-work .ztv3-play {
  border-radius: 0;
  clip-path: polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,8px 100%,0 calc(100% - 8px));
  background: #edb126;
  color: #0c0b08;
}
#ztv3-selected-work .ztv3-project:hover .ztv3-play { background: #f8c74e; }
#ztv5-process { background: #161713; }
#ztv5-process .ztv5-step { background: #20211d; border-color: rgba(237,177,38,.15); }
#ztv5-process .ztv5-cta { background: #292419; }
#ztv1-visual-hero *,#ztv2-capabilities *,#ztv3-selected-work *,#ztv-brief *,#ztv5-process * {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Scope section: restrained editorial typography, three concrete criteria. */
#ztv-brief {
  position: relative;
  width: 100%;
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;
  padding: clamp(82px,9vw,146px) clamp(18px,4vw,72px);
  overflow: hidden;
  background: #25251f;
  color: #f5f0e3;
  font-family: inherit;
}
#ztv-brief *, #ztv-brief *::before, #ztv-brief *::after { box-sizing: border-box; }
#ztv-brief .ztv-brief-inner { width: min(1420px,100%); margin-inline: auto; }
#ztv-brief .ztv-brief-topline {
  display: flex; justify-content: space-between; gap: 16px;
  border-top: 1px solid rgba(237,177,38,.45); padding-top: 16px;
  font-size: 10px; font-weight: 800; letter-spacing: .16em;
}
#ztv-brief .ztv-brief-lead {
  display: grid; grid-template-columns: minmax(0,1.6fr) minmax(250px,.6fr);
  align-items: end; gap: clamp(24px,5vw,90px);
  padding: clamp(60px,7vw,110px) 0 clamp(50px,6vw,90px);
}
#ztv-brief .ztv-brief-eyebrow { color: #edb126; font-size: 11px; font-weight: 900; letter-spacing: .15em; }
#ztv-brief h2 {
  margin: 20px 0 0; max-width: 11ch;
  font-size: clamp(3.1rem,7vw,7.4rem); font-weight: 850; letter-spacing: -.07em; line-height: .96;
}
#ztv-brief h2 em { font-style: normal; color: #edb126; }
#ztv-brief .ztv-brief-lead > p { max-width: 36ch; margin: 0; font-size: clamp(1rem,1.3vw,1.22rem); line-height: 1.65; }
#ztv-brief .ztv-brief-grid { display: grid; grid-template-columns: repeat(3,1fr); border-top: 1px solid rgba(237,177,38,.3); }
#ztv-brief .ztv-brief-grid article { padding: 32px clamp(12px,3vw,42px) 40px 0; }
#ztv-brief .ztv-brief-grid article + article { border-left: 1px solid rgba(237,177,38,.2); padding-left: clamp(18px,3vw,42px); }
#ztv-brief .ztv-brief-grid article span { font-size: 10px; font-weight: 850; letter-spacing: .15em; color: #edb126; }
#ztv-brief .ztv-brief-grid h3 { margin: 37px 0 10px; font-size: clamp(1.28rem,2vw,2rem); letter-spacing: -.04em; }
#ztv-brief .ztv-brief-grid p { max-width: 31ch; margin: 0; line-height: 1.55; color: #c8c3b6; }
#ztv-brief .ztv-brief-bottom {
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
  border-top: 1px solid rgba(237,177,38,.3); padding-top: 28px;
}
#ztv-brief .ztv-brief-bottom p { max-width: 32ch; margin: 0; font-size: clamp(1rem,1.5vw,1.35rem); font-weight: 700; }
#ztv-brief .ztv-cut-btn { flex: 0 0 auto; }

@media (max-width: 860px) {
  #ztv-brief .ztv-brief-lead { grid-template-columns: 1fr; }
  #ztv-brief h2 { max-width: 13ch; }
}
@media (max-width: 680px) {
  #ztv1-visual-hero .ztv1-actions { align-items: stretch; }
  #ztv1-visual-hero .ztv-cut-btn { width: 100%; }
  #ztv-brief .ztv-brief-topline span:last-child { display: none; }
  #ztv-brief .ztv-brief-grid { grid-template-columns: 1fr; }
  #ztv-brief .ztv-brief-grid article,
  #ztv-brief .ztv-brief-grid article + article { border-left: 0; border-bottom: 1px solid rgba(237,177,38,.2); padding: 26px 0 30px; }
  #ztv-brief .ztv-brief-grid h3 { margin-top: 18px; }
  #ztv-brief .ztv-brief-bottom { flex-direction: column; align-items: stretch; }
  #ztv-brief .ztv-cut-btn { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  #ztv1-visual-hero .ztv-cut-btn,
  #ztv5-process .ztv-cut-btn,
  #ztv-brief .ztv-cut-btn { transition: none; transform: none; }
}
/* V3 — the PDF's fine gold grid, black/ivory rhythm and flat bitmap icon set */

body[class*="template-zt-visual"] :is(
  .wp-block-search, .search-form, .widget_search, .search-widget,
  .elementor-widget-search-form, .ast-search-menu-icon, .search-toggle,
  [role="search"]
) { display: none !important; }

#ztv1-visual-hero,
#ztv2-capabilities,
#ztv3-selected-work,
#ztv5-process {
  --ztv-pdf-line: rgba(237,177,38,.075);
  background-image:
    linear-gradient(90deg,var(--ztv-pdf-line) 1px,transparent 1px),
    linear-gradient(0deg,var(--ztv-pdf-line) 1px,transparent 1px);
  background-size: 74px 74px;
  background-position: center top;
}
#ztv1-visual-hero { background-color: #080908; }
#ztv1-visual-hero .ztv1-video-layer { background: #080908; }
#ztv2-capabilities { background-color: #10110f; }
#ztv2-capabilities .ztv2-card { background: rgba(24,25,21,.95); }
#ztv3-selected-work { background-color: #0b0c0a; }
#ztv5-process { background-color: #11120f; }
#ztv5-process .ztv5-step { background: rgba(28,29,25,.95); }

/* Flat PNGs rasterized from a consistent icon family, never inline SVG. */
#ztv2-capabilities .ztv2-icon,
#ztv5-process .ztv5-step-icon,
#ztv5-process .ztv5-tool-logo {
  border: 1px solid rgba(237,177,38,.27);
  background: #151610;
  border-radius: 0;
}
#ztv2-capabilities .ztv2-icon .ztv-flat-image,
#ztv5-process .ztv5-step-icon .ztv-flat-image,
#ztv5-process .ztv5-tool-logo .ztv-tool-image {
  display: block;
  width: 28px;
  height: 28px;
  max-width: none;
  object-fit: contain;
  image-rendering: auto;
}
#ztv5-process .ztv5-step-icon .ztv-flat-image { width: 25px; height: 25px; }
#ztv5-process .ztv5-tool-logo .ztv-tool-image { width: 29px; height: 29px; }
#ztv3-selected-work .ztv3-play .ztv-play-image { width: 24px; height: 24px; object-fit: contain; filter: brightness(.13); }
#ztv1-visual-hero .ztv-close-image,
#ztv3-selected-work .ztv-close-image { width: 22px; height: 22px; object-fit: contain; filter: brightness(.13); }
#ztv1-visual-hero .ztv-btn-arrow,
#ztv5-process .ztv-btn-arrow,
#ztv-brief .ztv-btn-arrow { display: grid; place-items: center; width: 21px; height: 21px; }
#ztv1-visual-hero .ztv-btn-arrow .ztv-arrow-image,
#ztv5-process .ztv-btn-arrow .ztv-arrow-image,
#ztv-brief .ztv-btn-arrow .ztv-arrow-image { width: 18px; height: 18px; object-fit: contain; filter: brightness(.13); }
#ztv1-visual-hero .ztv1-btn-ghost .ztv-arrow-image { filter: none; }

/* A warm paper interlude follows the inside pages of the supplied guide. */
#ztv-brief { background: #f4f0e6; color: #242017; }
#ztv-brief .ztv-brief-topline,
#ztv-brief .ztv-brief-grid,
#ztv-brief .ztv-brief-bottom { border-color: rgba(139,99,23,.36); }
#ztv-brief h2 {
  max-width: 12ch;
  font-family: inherit;
  font-weight: 700;
  letter-spacing: -.055em;
}
#ztv-brief h2 em,
#ztv-brief .ztv-brief-eyebrow,
#ztv-brief .ztv-brief-grid article span { color: #926609; }
#ztv-brief .ztv-brief-grid article + article { border-color: rgba(139,99,23,.25); }
#ztv-brief .ztv-brief-grid article { min-height: 230px; }
#ztv-brief .ztv-brief-grid h3 { font-family: inherit; font-weight: 700; }
#ztv-brief .ztv-brief-grid p { color: #514b40; }
#ztv-brief .ztv-brief-bottom p { color: #242017; }

@media (max-width: 700px) {
  #ztv1-visual-hero,#ztv2-capabilities,#ztv3-selected-work,#ztv5-process { background-size: 52px 52px; }
  #ztv-brief .ztv-brief-grid article { min-height: auto; }
}

/* V4: PDF-inspired charcoal, real supplied logos and a moving-image gallery. */
#ztv3-selected-work {
  background-color: #171813;
  background-image:
    linear-gradient(rgba(237,177,38,.038) 1px, transparent 1px),
    linear-gradient(90deg,rgba(237,177,38,.038) 1px, transparent 1px),
    radial-gradient(circle at 15% 10%,rgba(237,177,38,.075),transparent 42%);
  background-size: 72px 72px,72px 72px,auto;
}
#ztv3-selected-work .ztv3-filter { margin: 30px 0 25px; justify-content: flex-start; }
#ztv3-selected-work .ztv3-filter button {
  min-height: 44px; padding-inline: 20px; border-color: rgba(237,177,38,.27);
  background: #262720; color: #eae4d6; font-size: 11px; border-radius: 0;
  clip-path: polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px));
}
#ztv3-selected-work .ztv3-filter button.is-active { background: #edb126; color: #11110e; }
#ztv3-selected-work .ztv4-video-card[data-size="wide"] { grid-column: span 6; }
#ztv3-selected-work .ztv4-video-card[data-size="normal"] { grid-column: span 4; }
#ztv3-selected-work .ztv4-video-card .ztv3-media {
  height: clamp(280px,28vw,400px);
  background: linear-gradient(135deg,#31302a,#181a16 52%,#45351b);
}
#ztv3-selected-work .ztv4-video-card[data-size="wide"] .ztv3-media { height: clamp(330px,36vw,510px); }
#ztv3-selected-work .ztv4-video-card .ztv3-media::before {
  content: ''; position: absolute; z-index: 1; inset: 0; pointer-events: none;
  background: repeating-linear-gradient(90deg,transparent 0,transparent 79px,rgba(242,190,69,.09) 80px),
    linear-gradient(135deg,rgba(239,187,59,.14),transparent 45%);
}
#ztv3-selected-work .ztv4-video-preview {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
  opacity: 0; transition: opacity .55s ease,transform .7s ease; pointer-events: none;
}
#ztv3-selected-work .ztv4-video-preview.is-ready { opacity: .91; }
#ztv3-selected-work .ztv4-video-card:hover .ztv4-video-preview.is-ready { transform: scale(1.045); }
#ztv3-selected-work .ztv4-video-card .ztv3-shade {
  background: linear-gradient(180deg,rgba(0,0,0,.22),transparent 34%,rgba(0,0,0,.88));
}
#ztv3-selected-work .ztv4-video-card .ztv3-content h3 { font-size: clamp(25px,2.3vw,39px); }
#ztv3-selected-work .ztv4-video-card .ztv3-type,
#ztv3-selected-work .ztv4-video-card .ztv3-number { font-size: 9px; backdrop-filter: none !important; }
#ztv5-process .ztv5-tools-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
#ztv5-process .ztv5-tool { min-height: 155px; padding: 23px; background: #24251f; }
#ztv5-process .ztv5-tool-logo { width: 66px; height: 66px; background: #f2eee5; border: 1px solid rgba(237,177,38,.55); }
#ztv5-process .ztv5-tool-logo .ztv-tool-image { width: 46px; height: 46px; object-fit: contain; }
#ztv2-capabilities .ztv2-icon,
#ztv5-process .ztv5-step-icon { width: 66px; height: 66px; background: #333025; border-color: rgba(237,177,38,.55); }
#ztv2-capabilities .ztv2-icon .ztv-flat-image,
#ztv5-process .ztv5-step-icon .ztv-flat-image { width: 42px; height: 42px; object-fit: contain; }
@media (max-width: 900px) {
  #ztv3-selected-work .ztv4-video-card[data-size] { grid-column: span 6; }
  #ztv5-process .ztv5-tools-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 650px) {
  #ztv3-selected-work .ztv4-video-card[data-size] { grid-column: 1 / -1; }
  #ztv3-selected-work .ztv4-video-card .ztv3-media,
  #ztv3-selected-work .ztv4-video-card[data-size="wide"] .ztv3-media { height: clamp(290px,95vw,450px); }
  #ztv5-process .ztv5-tools-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  #ztv5-process .ztv5-tool { min-height: 145px; padding: 15px; }
  #ztv3-selected-work .ztv3-filter { gap: 7px; }
  #ztv3-selected-work .ztv3-filter button { min-height: 39px; padding-inline: 12px; font-size: 9px; }
}

/* V5: clearer raster icon tiles and a calmer editorial surface. */
#ztv2-capabilities {
  background: radial-gradient(circle at 82% 8%,rgba(237,177,38,.075),transparent 32%),#171813;
}
#ztv2-capabilities .ztv2-card,
#ztv5-process .ztv5-step {
  background: #23241f;
  border-color: rgba(237,177,38,.23);
}
#ztv2-capabilities .ztv2-icon,
#ztv5-process .ztv5-step-icon {
  width: 76px; height: 76px;
  background: #302c21;
  border: 1px solid rgba(237,177,38,.58);
  box-shadow: inset 0 0 0 5px rgba(237,177,38,.045);
}
#ztv2-capabilities .ztv2-icon .ztv-flat-image,
#ztv5-process .ztv5-step-icon .ztv-flat-image {
  width: 48px; height: 48px;
  opacity: 1; filter: none;
}
#ztv2-capabilities .ztv2-card:hover,
#ztv5-process .ztv5-step:hover { border-color: rgba(237,177,38,.58); }
#ztv5-process .ztv5-tools {
  border-top: 1px solid rgba(237,177,38,.34);
}
#ztv3-selected-work .ztv3-project {
  border-color: rgba(237,177,38,.26);
  box-shadow: 0 18px 36px rgba(0,0,0,.16);
}
#ztv3-selected-work .ztv3-project:hover {
  border-color: rgba(237,177,38,.7);
  box-shadow: 0 26px 60px rgba(0,0,0,.38);
}
@media (prefers-reduced-motion: reduce) {
  #ztv3-selected-work .ztv4-video-preview,
  #ztv3-selected-work .ztv3-project { transition-duration: .01ms; }
}


/* One actual PNG file supplies every flat visual icon. */
.ztv-icon-sprite {
  display: block; flex: none; width: 48px; height: 48px;
  background-image: var(--ztv-visual-sprite, url("../fonts/zt-flat-icons.webp"));
  background-repeat: no-repeat;
  background-size: 1600% 700%;
  background-position: var(--ztv-sprite-x,0%) var(--ztv-sprite-y,0%);
  filter: none !important;
}
.ztv-icon--aftereffects { --ztv-sprite-x: 0.00000000%; --ztv-sprite-y: 0.00000000%; }
.ztv-icon--arrow { --ztv-sprite-x: 6.66666667%; --ztv-sprite-y: 0.00000000%; }
.ztv-icon--close { --ztv-sprite-x: 13.33333333%; --ztv-sprite-y: 0.00000000%; }
.ztv-icon--commercial { --ztv-sprite-x: 20.00000000%; --ztv-sprite-y: 0.00000000%; }
.ztv-icon--corporate { --ztv-sprite-x: 26.66666667%; --ztv-sprite-y: 0.00000000%; }
.ztv-icon--creative { --ztv-sprite-x: 33.33333333%; --ztv-sprite-y: 0.00000000%; }
.ztv-icon--delivery { --ztv-sprite-x: 40.00000000%; --ztv-sprite-y: 0.00000000%; }
.ztv-icon--direction { --ztv-sprite-x: 46.66666667%; --ztv-sprite-y: 0.00000000%; }
.ztv-icon--discovery { --ztv-sprite-x: 53.33333333%; --ztv-sprite-y: 0.00000000%; }
.ztv-icon--editing { --ztv-sprite-x: 60.00000000%; --ztv-sprite-y: 0.00000000%; }
.ztv-icon--filming { --ztv-sprite-x: 66.66666667%; --ztv-sprite-y: 0.00000000%; }
.ztv-icon--illustrator { --ztv-sprite-x: 73.33333333%; --ztv-sprite-y: 0.00000000%; }
.ztv-icon--motion { --ztv-sprite-x: 80.00000000%; --ztv-sprite-y: 0.00000000%; }
.ztv-icon--photoshop { --ztv-sprite-x: 86.66666667%; --ztv-sprite-y: 0.00000000%; }
.ztv-icon--play { --ztv-sprite-x: 93.33333333%; --ztv-sprite-y: 0.00000000%; }
.ztv-icon--post { --ztv-sprite-x: 100.00000000%; --ztv-sprite-y: 0.00000000%; }
.ztv-icon--premiere { --ztv-sprite-x: 0.00000000%; --ztv-sprite-y: 16.66666667%; }
.ztv-icon--production { --ztv-sprite-x: 6.66666667%; --ztv-sprite-y: 16.66666667%; }
.ztv-icon--review { --ztv-sprite-x: 13.33333333%; --ztv-sprite-y: 16.66666667%; }
.ztv-icon--nav { --ztv-sprite-x: 20.00000000%; --ztv-sprite-y: 16.66666667%; }

#ztv1-visual-hero .ztv-arrow-image,
#ztv3-selected-work .ztv-play-image,
#ztv1-visual-hero .ztv-close-image,
#ztv3-selected-work .ztv-close-image,
#ztv5-process .ztv-arrow-image,
#ztv-brief .ztv-arrow-image { width: 20px; height: 20px; }
#ztv2-capabilities .ztv2-icon .ztv-icon-sprite,
#ztv5-process .ztv5-step-icon .ztv-icon-sprite { width: 48px; height: 48px; }
#ztv5-process .ztv5-tool-logo { position: relative; }
#ztv5-process .ztv5-tool-logo .ztv-tool-fallback { width: 46px; height: 46px; }
#ztv5-process .ztv5-tool-logo .ztv-tool-image {
  position: absolute; z-index: 1; inset: 0; margin: auto;
  width: 46px; height: 46px; object-fit: contain;
}
#ztv5-process .ztv5-tool-logo .ztv-tool-image[hidden] { display: none; }


/* V8 — quiet diamond section rail, matching the supplied reference. */
#zt-main .ztv-scroll-rail {
  position:fixed; z-index:900; right:20px; left:auto; top:50%; transform:translateY(-50%);
  width:46px; padding:13px 0; display:flex; flex-direction:column; align-items:center; gap:8px;
  color:#edb126; background:rgba(9,9,7,.96); border:1px solid rgba(237,177,38,.22);
  box-shadow:0 18px 55px rgba(0,0,0,.38); direction:ltr; font-family:inherit;
}
#zt-main .ztv-scroll-rail-track {
  position:absolute; top:25px; bottom:25px; left:22px; width:1px;
  background:rgba(237,177,38,.15); pointer-events:none;
}
#zt-main .ztv-scroll-rail-track > span {
  display:block; width:1px; height:100%; transform-origin:center top;
  transform:scaleY(var(--ztv-rail-scale,0));
  background:#edb126; box-shadow:0 0 12px rgba(237,177,38,.65);
}
#zt-main .ztv-scroll-rail a {
  position:relative; z-index:1; width:32px; height:31px; display:grid; place-items:center;
  background:#090907; text-decoration:none; outline-offset:3px;
}
#zt-main .ztv-scroll-rail a .ztv-icon-sprite {
  width:12px !important; height:12px !important; opacity:.36;
  filter:grayscale(1) brightness(.7) !important;
  transition:opacity .25s ease,transform .25s ease;
}
#zt-main .ztv-scroll-rail a:is(.is-active,:hover,:focus-visible) .ztv-icon-sprite {
  opacity:1; filter:drop-shadow(0 0 7px rgba(237,177,38,.95)) !important;
  transform:scale(1.25);
}
#zt-main .ztv-scroll-rail a.is-active::before {
  content:''; position:absolute; inset:0; border:1px solid rgba(237,177,38,.42);
  background:rgba(237,177,38,.08); pointer-events:none;
}
#zt-main .ztv-scroll-rail-label {
  position:absolute; right:46px; left:auto; top:50%; transform:translate(7px,-50%);
  padding:9px 13px; white-space:nowrap; pointer-events:none;
  background:#191914; border:1px solid rgba(237,177,38,.4); color:#f4f0e6;
  font-family:inherit; font-size:11px; font-weight:700; letter-spacing:.03em;
  opacity:0; visibility:hidden; transition:opacity .2s ease,transform .2s ease;
}
#zt-main .ztv-scroll-rail a:is(:hover,:focus-visible) .ztv-scroll-rail-label {
  opacity:1; visibility:visible; transform:translate(0,-50%);
}
#zt-main .ztv-scroll-rail a:focus-visible { outline:2px solid #edb126; }
#ztv3-selected-work .ztv3-gallery-meta {
  display:flex; justify-content:space-between; gap:16px; align-items:center;
  margin:0 0 14px; padding-top:14px; border-top:1px solid rgba(237,177,38,.28);
  color:#bfb8a8; font-size:10px; font-weight:750; letter-spacing:.14em;
}
#ztv3-selected-work .ztv3-gallery-meta strong { color:#edb126; font-size:inherit; }
#zt-main :is(#ztv1-visual-hero,#ztv2-capabilities,#ztv3-selected-work,#ztv-brief,#ztv5-process),
#zt-main :is(#ztv1-visual-hero,#ztv2-capabilities,#ztv3-selected-work,#ztv-brief,#ztv5-process) * {
  font-family:inherit !important;
}
#ztv1-visual-hero,#ztv2-capabilities,#ztv3-selected-work,#ztv-brief,#ztv5-process,
#ztv5-tools,#ztv5-cta { scroll-margin-top:90px; }
@media (max-width:1050px) { #zt-main .ztv-scroll-rail { display:none; } }
@media (prefers-reduced-motion:reduce) {
  #zt-main .ztv-scroll-rail *,#zt-main .ztv-scroll-rail *::before { transition:none !important; }
}


/* Scoped mobile and keyboard corrections; existing page modules remain intact. */
#ztv1-visual-hero:has(.ztv1-modal.is-open) { z-index:2147481000; }
#ztv3-selected-work:has(.ztv3-modal.is-open) { z-index:2147481001; }
#ztv1-visual-hero .ztv1-modal,
#ztv3-selected-work .ztv3-modal {
  overflow-y:auto;
  overscroll-behavior:contain;
  padding-top:max(70px,env(safe-area-inset-top));
  padding-bottom:max(24px,env(safe-area-inset-bottom));
}
#ztv1-visual-hero .ztv1-modal-inner,
#ztv3-selected-work .ztv3-modal-box { margin-block:auto; min-width:0; }
#ztv1-visual-hero .ztv1-modal video { max-height:min(80vh,calc(100dvh - 140px)); }
#ztv3-selected-work .ztv3-video { max-height:min(78vh,calc(100dvh - 170px)); }
#ztv3-selected-work .ztv3-modal-head > div { min-width:0; overflow-wrap:anywhere; }
#ztv3-selected-work .ztv3-close { flex:none; min-width:44px; min-height:44px; }
#ztv3-selected-work .ztv3-filter button { min-height:44px; }
#ztv2-capabilities :is(a,button):focus-visible {
  outline:2px solid #edb126; outline-offset:4px;
}
#ztv5-process .ztv5-tool > div { min-width:0; }
#ztv5-process .ztv5-tool strong { overflow-wrap:anywhere; }
#ztv5-process .ztv5-tool-logo { flex:none; }
@media (max-width:700px) {
  #ztv1-visual-hero .ztv-cut-btn,
  #ztv5-process .ztv-cut-btn,
  #ztv-brief .ztv-cut-btn {
    max-width:100%; min-width:0; white-space:normal;
    gap:12px; padding-inline:20px; padding-block:14px 20px;
  }
  #ztv1-visual-hero .ztv-cut-btn > span:first-child,
  #ztv5-process .ztv-cut-btn > span:first-child,
  #ztv-brief .ztv-cut-btn > span:first-child { min-width:0; overflow-wrap:anywhere; }
  #ztv1-visual-hero .ztv-btn-arrow,
  #ztv5-process .ztv-btn-arrow,
  #ztv-brief .ztv-btn-arrow { flex:none; }
  #ztv3-selected-work .ztv3-filter button { white-space:normal; overflow-wrap:anywhere; }
}
@media (max-width:980px), (hover:none), (pointer:coarse) {
  #ztv1-visual-hero :is(.ztv1-kicker,.ztv1-status,.ztv1-logo-wrap,.ztv1-editor,.ztv1-btn-ghost),
  #ztv1-visual-hero .ztv1-modal,
  #ztv3-selected-work :is(.ztv3-modal,.ztv3-number,.ztv3-type) {
    backdrop-filter:none; -webkit-backdrop-filter:none;
  }
  #ztv1-visual-hero .ztv1-playhead,
  #ztv1-visual-hero .ztv1-status span { animation:none; }
  #ztv2-capabilities .ztv2-card::before { display:none; }
}
@media (hover:none), (pointer:coarse) {
  #ztv1-visual-hero .ztv-cut-btn:hover,
  #ztv5-process .ztv-cut-btn:hover,
  #ztv-brief .ztv-cut-btn:hover { transform:none; filter:none; }
  #ztv3-selected-work .ztv4-video-card:hover .ztv4-video-preview.is-ready { transform:none; }
}
@media (prefers-reduced-motion:reduce) {
  #ztv1-visual-hero *,#ztv1-visual-hero *::before,#ztv1-visual-hero *::after,
  #ztv2-capabilities *,#ztv2-capabilities *::before,#ztv2-capabilities *::after,
  #ztv3-selected-work *,#ztv3-selected-work *::before,#ztv3-selected-work *::after,
  #ztv-brief *,#ztv-brief *::before,#ztv-brief *::after,
  #ztv5-process *,#ztv5-process *::before,#ztv5-process *::after {
    animation:none !important; transition:none !important; scroll-behavior:auto !important;
  }
  #ztv2-capabilities .ztv2-card::before { display:none; }
  #ztv3-selected-work .ztv4-video-card:hover .ztv4-video-preview.is-ready { transform:none; }
}

/* Show one software mark at a time, including transparent logo files. */
#ztv5-process .ztv5-tool-logo .ztv-tool-fallback{visibility:hidden;}
#ztv5-process .ztv5-tool-logo:has(.ztv-tool-image[hidden]) .ztv-tool-fallback{visibility:visible;}

/* Contain page content at desktop and mobile widths. */
/* Page-local layout safeguards: do not depend on audit-layout.css. */
:is(#ztv1-visual-hero,#ztv2-capabilities,#ztv3-selected-work,#ztv-brief,#ztv5-process,#zt-visual-services), :is(#ztv1-visual-hero,#ztv2-capabilities,#ztv3-selected-work,#ztv-brief,#ztv5-process,#zt-visual-services) *, :is(#ztv1-visual-hero,#ztv2-capabilities,#ztv3-selected-work,#ztv-brief,#ztv5-process,#zt-visual-services) *::before, :is(#ztv1-visual-hero,#ztv2-capabilities,#ztv3-selected-work,#ztv-brief,#ztv5-process,#zt-visual-services) *::after {box-sizing:border-box;}
:is(#ztv1-visual-hero,#ztv2-capabilities,#ztv3-selected-work,#ztv-brief,#ztv5-process,#zt-visual-services) {max-width:100%;min-width:0;}
:is(#ztv1-visual-hero,#ztv2-capabilities,#ztv3-selected-work,#ztv-brief,#ztv5-process,#zt-visual-services) :where(div,section,article,header,footer,nav,ul,li) {min-width:0;}
:is(#ztv1-visual-hero,#ztv2-capabilities,#ztv3-selected-work,#ztv-brief,#ztv5-process,#zt-visual-services) :where(h1,h2,h3,h4,p,a,span,strong,small,li) {overflow-wrap:anywhere;}
:is(#ztv1-visual-hero,#ztv2-capabilities,#ztv3-selected-work,#ztv-brief,#ztv5-process,#zt-visual-services) :where(img,video,iframe) {max-width:100%;}
:is(#ztv1-visual-hero,#ztv2-capabilities,#ztv3-selected-work,#ztv-brief,#ztv5-process,#zt-visual-services) :where(button,a) {max-width:100%;}

html:has(#ztv1-visual-hero),body:has(#ztv1-visual-hero) {max-width:100%;overflow-x:clip;}
body:has(#ztv1-visual-hero) #zt-main {width:100%;max-width:100%;min-width:0;}
#ztv1-visual-hero :is(.ztv1-topbar,.ztv1-tags,.ztv1-actions),
#ztv3-selected-work :is(.ztv3-filter,.ztv3-gallery-meta),
#ztv-brief .ztv-brief-bottom {flex-wrap:wrap;}
#ztv1-visual-hero :is(.ztv1-tags span,.ztv1-kicker,.ztv1-status),
#ztv3-selected-work .ztv3-filter button {white-space:normal;}
#ztv1-visual-hero .ztv1-main {grid-template-columns:minmax(0,1.25fr) minmax(0,.72fr);}
#ztv-brief .ztv-brief-lead {grid-template-columns:minmax(0,1.6fr) minmax(0,.6fr);}
#ztv-brief .ztv-brief-grid {grid-template-columns:repeat(3,minmax(0,1fr));}
#ztv5-process .ztv5-tools {grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);}
#ztv5-process .ztv5-tools-grid {grid-template-columns:repeat(3,minmax(0,1fr));}
#ztv1-visual-hero .ztv-cut-btn,#ztv5-process .ztv-cut-btn,#ztv-brief .ztv-cut-btn,
#ztv5-process .ztv5-cta-btn {min-width:0;white-space:normal;height:auto;}
#ztv1-visual-hero .ztv-cut-btn > span:first-child,
#ztv5-process .ztv-cut-btn > span:first-child,#ztv-brief .ztv-cut-btn > span:first-child {min-width:0;}
#ztv1-visual-hero .ztv-btn-arrow,#ztv5-process .ztv-btn-arrow,#ztv-brief .ztv-btn-arrow {flex:none;}
#ztv1-visual-hero .ztv1-modal,#ztv3-selected-work .ztv3-modal {width:auto;max-width:100%;inset-inline:0;box-sizing:border-box;}
#ztv1-visual-hero .ztv1-modal-inner,#ztv3-selected-work .ztv3-modal-box {max-width:100%;min-width:0;}
@media(max-width:1250px){#ztv5-process .ztv5-tools {grid-template-columns:minmax(0,1fr);}}
@media(max-width:1050px){
 #ztv1-visual-hero .ztv1-main,#ztv-brief .ztv-brief-lead {grid-template-columns:minmax(0,1fr);}
 #ztv1-visual-hero .ztv1-topbar {gap:18px;}
}
@media(max-width:700px){
 #ztv-brief .ztv-brief-grid,#ztv5-process .ztv5-tools-grid {grid-template-columns:minmax(0,1fr);}
 #ztv5-process .ztv5-cta {grid-template-columns:minmax(0,1fr);}
 #ztv1-visual-hero .ztv1-title {font-size:clamp(32px,9vw,60px);max-width:100%;}
 #ztv1-visual-hero .ztv1-tags span {max-width:100%;}
 #ztv1-visual-hero .ztv1-editor {width:100%;max-width:100%;}
}

body:has(#ztv1-visual-hero) .zt-content-services{position:relative;background:#000;color:#fff;padding:80px 24px;border-top:1px solid rgba(237,177,38,.22);}
body:has(#ztv1-visual-hero) .zt-content-services-inner{max-width:1200px;margin-inline:auto;}
body:has(#ztv1-visual-hero) .zt-content-services .zt-content-kicker{color:#EDB126;font-size:12px;letter-spacing:.12em;text-transform:uppercase;margin:0 0 16px;}
body:has(#ztv1-visual-hero) .zt-content-services h2{font:inherit;font-size:clamp(28px,4vw,48px);line-height:1.16;font-weight:700;max-width:850px;margin:0 0 20px;color:#fff;}
body:has(#ztv1-visual-hero) .zt-content-services .zt-content-lead{max-width:790px;color:#ddd;font-size:17px;line-height:1.75;margin:0 0 32px;}
body:has(#ztv1-visual-hero) .zt-content-services-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;}
body:has(#ztv1-visual-hero) .zt-content-service-card{padding:28px;border:1px solid rgba(237,177,38,.28);border-radius:14px;background:linear-gradient(145deg,rgba(237,177,38,.06),transparent);}
body:has(#ztv1-visual-hero) .zt-content-service-card h3{font:inherit;font-size:20px;line-height:1.4;font-weight:700;color:#EDB126;margin:0 0 14px;}
body:has(#ztv1-visual-hero) .zt-content-service-card p{font-size:15px;line-height:1.85;color:#ddd;margin:0;}
body:has(#ztv1-visual-hero) .zt-content-services .zt-content-services-link{display:inline-flex;align-items:center;justify-content:center;margin-top:30px;max-width:100%;min-height:48px;padding:14px 24px;border:1px solid #EDB126;border-radius:10px;background:#EDB126;color:#000;font-weight:700;text-decoration:none;line-height:1.4;text-align:center;}
body:has(#ztv1-visual-hero) .zt-content-services-link:hover{filter:brightness(1.12);}
body:has(#ztv1-visual-hero) .zt-content-services-link:focus-visible{outline:2px solid #EDB126;outline-offset:4px;}
@media(max-width:1024px){body:has(#ztv1-visual-hero) .zt-content-services-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:768px){
  body:has(#ztv1-visual-hero) .zt-content-services{padding:52px 20px;}
  body:has(#ztv1-visual-hero) .zt-content-services-grid{grid-template-columns:minmax(0,1fr);}
  body:has(#ztv1-visual-hero) .zt-content-service-card{padding:24px;}
}

/* Flexible tracks and bounded labels inside the preview/editor modules. */
#ztv1-visual-hero .ztv1-track {grid-template-columns:26px repeat(12,minmax(0,1fr));}
#ztv1-visual-hero .ztv1-editor-top {grid-template-columns:minmax(0,auto) minmax(0,1fr) minmax(0,auto);}
#ztv2-capabilities .ztv2-head {grid-template-columns:minmax(0,1fr) minmax(0,.7fr);}
#ztv1-visual-hero .ztv1-track b {min-width:0;}
@media(max-width:1050px){#ztv2-capabilities .ztv2-head {grid-template-columns:minmax(0,1fr);}}
@media(max-width:480px){#ztv1-visual-hero .ztv1-topbar {align-items:flex-start;}}

/* Existing service overview: page-local display and responsive styles. */

#zt-main #zt-visual-services.zt-content-services{position:relative;background:#000;color:#fff;padding:80px 24px;border-top:1px solid rgba(237,177,38,.22);}
#zt-main #zt-visual-services .zt-content-services-inner{max-width:1200px;margin-inline:auto;}
#zt-main #zt-visual-services .zt-content-kicker{color:#EDB126;font-size:12px;letter-spacing:.12em;text-transform:uppercase;margin:0 0 16px;}
#zt-main #zt-visual-services.zt-content-services h2{font:inherit;font-size:clamp(28px,4vw,48px);line-height:1.16;font-weight:700;max-width:850px;margin:0 0 20px;color:#fff;}
#zt-main #zt-visual-services .zt-content-lead{max-width:790px;color:#ddd;font-size:17px;line-height:1.75;margin:0 0 32px;}
#zt-main #zt-visual-services .zt-content-services-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;}
#zt-main #zt-visual-services .zt-content-service-card{padding:28px;border:1px solid rgba(237,177,38,.28);border-radius:14px;background:linear-gradient(145deg,rgba(237,177,38,.06),transparent);}
#zt-main #zt-visual-services .zt-content-service-card h3{font:inherit;font-size:20px;line-height:1.4;font-weight:700;color:#EDB126;margin:0 0 14px;}
#zt-main #zt-visual-services .zt-content-service-card p{font-size:15px;line-height:1.85;color:#ddd;margin:0;}
#zt-main #zt-visual-services .zt-content-services-link{display:inline-flex;align-items:center;justify-content:center;margin-top:30px;max-width:100%;min-height:48px;padding:14px 24px;border:1px solid #EDB126;border-radius:10px;background:#EDB126;color:#000;font-weight:700;text-decoration:none;line-height:1.4;text-align:center;}
#zt-main #zt-visual-services .zt-content-services-link:hover{filter:brightness(1.12);}
#zt-main #zt-visual-services .zt-content-services-link:focus-visible{outline:2px solid #EDB126;outline-offset:4px;}
@media(max-width:1024px){#zt-main #zt-visual-services .zt-content-services-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:768px){
  #zt-main #zt-visual-services.zt-content-services{padding:52px 20px;}
  #zt-main #zt-visual-services .zt-content-services-grid{grid-template-columns:minmax(0,1fr);}
  #zt-main #zt-visual-services .zt-content-service-card{padding:24px;}
}
#zt-main #zt-visual-services {font-family:inherit;direction:ltr;text-align:left;height:auto;min-height:0;overflow:visible;}
#zt-main #zt-visual-services *,#zt-main #zt-visual-services *::before,#zt-main #zt-visual-services *::after {box-sizing:border-box;}
#zt-main #zt-visual-services .zt-content-services-inner {width:100%;min-width:0;}
#zt-main #zt-visual-services .zt-content-service-card {min-width:0;}
#zt-main #zt-visual-services :is(h2,h3,p,a) {overflow-wrap:anywhere;}
