:root{
  --ip-header-height:86px;
  --ip-screen-ratio:1.7777778;
  --ip-section-gutter:clamp(20px,3.2vw,56px);
}

.ip-artwork-page{overflow-x:hidden;background:#fff}
.ip-artwork-page main{display:block}
.ip-artwork-page .site-header{isolation:isolate}

.ip-hero{position:relative;width:100%;overflow:hidden;background:#000}
.ip-hero img{width:100%;height:auto;max-width:none}
.ip-hero-mobile{display:none}

.ip-strength{
  min-height:calc(100svh - var(--ip-header-height));
  display:grid;
  place-items:center;
  padding:clamp(28px,4vw,64px) var(--ip-section-gutter);
  overflow:hidden;
  background:linear-gradient(180deg,#f8fbff 0%,#fff 72%);
  scroll-margin-top:var(--ip-header-height);
}

.ip-strength-stage{
  --strength-x:0px;
  position:relative;
  width:min(100%,1760px);
  aspect-ratio:1920/770;
  min-height:560px;
  overflow:hidden;
  border-radius:clamp(24px,2.4vw,46px);
  background:#0755c8;
  box-shadow:0 34px 90px rgba(3,65,164,.18);
  isolation:isolate;
}

.ip-strength-stage::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  background:linear-gradient(90deg,rgba(3,49,148,.54) 0%,rgba(4,72,178,.17) 48%,transparent 72%);
  pointer-events:none;
}

.ip-strength-stage::after{
  content:"";
  position:absolute;
  z-index:2;
  top:-30%;
  bottom:-30%;
  left:-28%;
  width:18%;
  opacity:0;
  transform:skewX(-18deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.24),transparent);
  pointer-events:none;
}

.ip-strength-bg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  transform:scale(1.06) translate3d(var(--strength-x),0,0);
  transition:transform 1.8s cubic-bezier(.2,.75,.2,1);
  will-change:transform;
}

.ip-strength-copy{
  position:relative;
  z-index:3;
  width:min(58%,880px);
  min-height:560px;
  padding:clamp(54px,6vh,88px) clamp(42px,5.6vw,100px);
  display:flex;
  flex-direction:column;
  justify-content:center;
  color:#fff;
  text-shadow:0 3px 22px rgba(0,44,130,.26);
}

.ip-strength-kicker,.ip-strength-lead,.ip-strength-copy h2,.ip-strength-detail,.ip-strength-result,.ip-strength-cta{
  opacity:0;
  transform:translate3d(0,26px,0);
  transition:opacity .72s ease,transform .72s cubic-bezier(.2,.78,.2,1);
}

.ip-strength-kicker{margin:0 0 22px;font-size:12px;font-weight:800;letter-spacing:.24em;color:#bde8ff}
.ip-strength-lead{margin:0 0 10px;font-size:clamp(18px,1.45vw,26px);font-weight:500;color:#e5f5ff}
.ip-strength-copy h2{display:flex;align-items:baseline;gap:.28em;margin:0;font-size:clamp(31px,3vw,58px);line-height:1.08;letter-spacing:-.045em}
.ip-strength-copy h2 span{font-weight:500}.ip-strength-copy h2 strong{font-weight:850}
.ip-strength-detail{margin:14px 0 34px;font-size:clamp(18px,1.45vw,28px);color:#e5f5ff}
.ip-strength-result{margin:0;font-size:clamp(19px,1.65vw,32px);line-height:1.65;color:#f5fbff}
.ip-strength-result strong{margin-left:.2em;font-size:1.25em;color:#fff;text-shadow:0 0 25px rgba(178,239,255,.8)}

.ip-strength-cta{
  width:min(100%,720px);
  margin-top:clamp(34px,5vh,58px);
  min-height:74px;
  padding:14px 20px 14px 28px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:18px;
  border:1px solid rgba(255,255,255,.62);
  border-radius:999px;
  color:#083d98;
  background:rgba(255,255,255,.94);
  box-shadow:0 18px 46px rgba(0,41,121,.22),inset 0 1px rgba(255,255,255,.9);
  text-shadow:none;
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  transition:transform .3s ease,box-shadow .3s ease,background .3s ease;
}

.ip-strength-cta span{font-size:clamp(17px,1.25vw,23px);font-weight:850;white-space:nowrap}
.ip-strength-cta small{font-size:clamp(12px,.85vw,15px);color:#5473a9}
.ip-strength-cta i{width:42px;height:42px;display:grid;place-items:center;border-radius:50%;color:#fff;background:#0759db;font-style:normal;font-size:20px;transition:transform .3s ease}
.ip-strength-cta:hover,.ip-strength-cta:focus-visible{transform:translateY(-4px);background:#fff;box-shadow:0 24px 58px rgba(0,41,121,.31),0 0 0 5px rgba(181,232,255,.22);outline:none}
.ip-strength-cta:hover i,.ip-strength-cta:focus-visible i{transform:translateX(3px)}

.ip-strength.is-visible .ip-strength-bg{transform:scale(1) translate3d(var(--strength-x),0,0)}
.ip-strength.is-visible .ip-strength-stage::after{animation:ipStrengthSweep 1.15s .45s ease-out both}
.ip-strength.is-visible .ip-strength-kicker,.ip-strength.is-visible .ip-strength-lead,.ip-strength.is-visible .ip-strength-copy h2,.ip-strength.is-visible .ip-strength-detail,.ip-strength.is-visible .ip-strength-result,.ip-strength.is-visible .ip-strength-cta{opacity:1;transform:none}
.ip-strength.is-visible .ip-strength-lead{transition-delay:.08s}.ip-strength.is-visible .ip-strength-copy h2{transition-delay:.16s}.ip-strength.is-visible .ip-strength-detail{transition-delay:.24s}.ip-strength.is-visible .ip-strength-result{transition-delay:.32s}.ip-strength.is-visible .ip-strength-cta{transition-delay:.42s}
@keyframes ipStrengthSweep{0%{left:-28%;opacity:0}18%{opacity:1}100%{left:115%;opacity:0}}

.ip-screen{
  width:100%;
  min-height:calc(100vh - var(--ip-header-height));
  min-height:calc(100svh - var(--ip-header-height));
  display:grid;
  place-items:center;
  overflow:hidden;
  background:#fff;
  scroll-margin-top:var(--ip-header-height);
  padding-inline:var(--ip-section-gutter);
}

.ip-screen-scroll{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:calc(100svh - var(--ip-header-height));
  overflow-x:auto;
  overflow-y:hidden;
  overscroll-behavior-inline:contain;
  scrollbar-width:none;
  touch-action:pan-x pan-y;
  text-decoration:none;
}

.ip-screen-scroll::-webkit-scrollbar,.ip-horizontal::-webkit-scrollbar{display:none}

.ip-screen-canvas{
  display:block;
  width:min(100%,calc((100svh - var(--ip-header-height)) * var(--ip-screen-ratio)));
  min-width:0;
  height:auto;
  max-width:none;
  margin-inline:auto;
  user-select:none;
  -webkit-user-drag:none;
}

.ip-audience{
  position:relative;
  min-height:calc(100vh - var(--ip-header-height));
  min-height:calc(100svh - var(--ip-header-height));
  overflow:hidden;
  background:#fff;
  scroll-margin-top:var(--ip-header-height);
}

.ip-audience-bg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  object-position:center top;
  user-select:none;
  -webkit-user-drag:none;
}

.ip-audience-viewport{
  position:absolute;
  left:50%;
  right:auto;
  top:23%;
  bottom:6%;
  width:min(1280px,calc(100% - 120px));
  overflow:visible;
  transform:translateX(-50%);
  touch-action:auto;
}

.ip-audience-track{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  align-items:flex-end;
  gap:clamp(20px,2vw,30px);
  width:100%;
  height:100%;
  padding:0;
}

.ip-audience-card{
  position:relative;
  width:100%;
  height:auto;
  max-height:94%;
  aspect-ratio:755/833;
  box-sizing:border-box;
  margin:0;
  padding-bottom:clamp(14px,1.35vw,22px);
  overflow:hidden;
  border-radius:clamp(24px,2vw,32px);
  background:#1d55d6;
  transform-origin:center bottom;
  transition:transform .42s cubic-bezier(.2,.8,.2,1),opacity .28s ease,filter .28s ease;
  will-change:transform;
}

.ip-audience-card img{
  display:block;
  width:100%;
  height:auto;
  max-width:none;
  user-select:none;
  -webkit-user-drag:none;
}

.ip-audience-card-summary{
  position:absolute;
  z-index:1;
  top:13.1%;
  left:8.4%;
  right:8.4%;
  margin:0;
  color:rgba(255,255,255,.82);
  font-size:clamp(10px,1vw,15px);
  font-weight:500;
  line-height:1.55;
  letter-spacing:.01em;
  pointer-events:none;
}

@media (hover:hover) and (pointer:fine) and (min-width:721px){
  .ip-audience-card:hover{z-index:1;transform:scale(1.075);filter:drop-shadow(0 24px 38px rgba(6,27,68,.3))}
  .ip-audience-track:has(.ip-audience-card:hover) .ip-audience-card:not(:hover){transform:scale(.965);opacity:.76;filter:saturate(.82)}
}

.ip-case-canvas{position:relative;aspect-ratio:16/9}

.ip-case-canvas::after{
  content:"";
  position:absolute;
  z-index:1;
  left:0;
  right:0;
  bottom:0;
  height:14.2%;
  background:#dedede;
  pointer-events:none;
}

.ip-case-base{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  pointer-events:none;
}

.ip-case-slot{
  position:absolute;
  top:29.8%;
  width:12.55%;
  height:48.6%;
  overflow:hidden;
  border-radius:7.5%/3.8%;
  background:linear-gradient(150deg,#f9fbff,#edf3fc);
}

.ip-case-slot:nth-of-type(1){left:17.25%}
.ip-case-slot:nth-of-type(2){left:34.7%}
.ip-case-slot:nth-of-type(3){left:52.15%}
.ip-case-slot:nth-of-type(4){left:69.6%}

.ip-case-slot img,.ip-case-slot video,.ip-case-slot picture{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.ip-case-slot video{background:#0b1424}
.ip-closing .ip-screen-scroll{cursor:pointer}
.ip-closing .ip-screen-canvas{transition:filter .25s ease}
.ip-closing a:hover .ip-screen-canvas,.ip-closing a:focus-visible .ip-screen-canvas{filter:saturate(1.05) brightness(1.02)}

@media (max-width:1100px){
  :root{
    --ip-header-height:74px;
    --ip-section-gutter:24px;
  }
}

@media (max-width:720px){
  :root{
    --ip-section-gutter:18px;
  }
  .ip-strength{padding:18px;min-height:calc(100svh - var(--ip-header-height))}
  .ip-strength-stage{aspect-ratio:auto;min-height:650px;border-radius:24px}
  .ip-strength-stage::before{background:linear-gradient(90deg,rgba(3,42,129,.76),rgba(3,60,156,.42) 68%,rgba(3,72,172,.12))}
  .ip-strength-bg{object-position:64% center}
  .ip-strength-copy{width:100%;min-height:650px;padding:48px 26px;justify-content:flex-end}
  .ip-strength-copy h2{display:block;font-size:38px}.ip-strength-copy h2 span{display:block;margin-bottom:5px;font-size:25px}
  .ip-strength-detail{font-size:18px;margin:10px 0 24px}.ip-strength-result{font-size:17px;line-height:1.7}
  .ip-strength-cta{grid-template-columns:1fr auto;min-height:68px;padding:12px 12px 12px 20px}.ip-strength-cta small{display:none}.ip-strength-cta i{width:40px;height:40px}
  .ip-hero{height:calc(100svh - var(--ip-header-height));min-height:640px;isolation:isolate}
  .ip-hero::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(2,8,20,.88) 0%,rgba(2,9,24,.68) 48%,rgba(2,8,20,.05) 82%);pointer-events:none}
  .ip-hero img{
    position:absolute;
    inset:0;
    width:100%;
    min-width:0;
    height:100%;
    object-fit:cover;
    object-position:69% center;
    margin:0;
  }
  .ip-hero-mobile{position:relative;z-index:2;display:flex;height:100%;padding:88px 24px 58px;flex-direction:column;justify-content:flex-end;color:#fff;text-shadow:0 3px 24px rgba(0,0,0,.45)}
  .ip-hero-mobile p{margin:0 0 12px;color:#8fc8ff;font-size:13px;font-weight:800;letter-spacing:.16em}
  .ip-hero-mobile h1{margin:0 0 14px;font-size:58px;line-height:.95;letter-spacing:-.06em}
  .ip-hero-mobile strong{font-size:20px;line-height:1.55}
  .ip-hero-mobile blockquote{margin:28px 0 0;padding-left:15px;border-left:2px solid #57a5ff;font-size:15px;line-height:1.7;color:rgba(255,255,255,.84)}
  .ip-screen{min-height:0;padding:24px 18px;place-items:stretch}
  .ip-screen-scroll{height:auto;display:flex;align-items:center;justify-content:center;overflow:hidden}
  .ip-screen-canvas{
    flex:0 0 auto;
    width:100%;
    min-width:0;
    margin-inline:auto;
  }
  .ip-audience-bg{
    width:100%;
    max-width:none;
    object-fit:cover;
    object-position:center top;
  }
  .ip-audience-viewport{
    position:relative;
    left:auto;
    right:auto;
    top:auto;
    bottom:auto;
    width:100%;
    transform:none;
  }
  .ip-audience{min-height:0;padding:170px var(--ip-section-gutter) 38px}
  .ip-audience-track{grid-template-columns:1fr;gap:18px;height:auto;padding:0}
  .ip-audience-card{width:min(100%,420px);height:auto;max-height:none;justify-self:center;padding-bottom:16px;border-radius:24px}
  .ip-audience-card img{width:100%;height:auto}
  .ip-audience-card-summary{font-size:clamp(10px,3.2vw,14px)}
  .ip-case-slot{border-radius:18px}
}

@media (prefers-reduced-motion:reduce){.ip-closing .ip-screen-canvas,.ip-audience-card,.ip-strength-bg,.ip-strength-kicker,.ip-strength-lead,.ip-strength-copy h2,.ip-strength-detail,.ip-strength-result,.ip-strength-cta{transition:none}.ip-strength-stage::after{display:none}.ip-strength-kicker,.ip-strength-lead,.ip-strength-copy h2,.ip-strength-detail,.ip-strength-result,.ip-strength-cta{opacity:1;transform:none}}

/* Audience cards: content and imagery are separated so the supplied poster copy never overlaps live text. */
.ip-audience{
  min-height:auto;
  padding:clamp(22px,2vw,36px) max(28px,calc((100vw - 1480px)/2));
  background:#f4f6fa;
  overflow:hidden;
}
.ip-audience-bg{display:none}
.ip-audience-heading{
  display:grid;
  grid-template-columns:minmax(340px,.95fr) minmax(280px,.7fr);
  grid-template-areas:"kicker copy" "title copy";
  align-items:end;
  gap:6px clamp(48px,8vw,150px);
  margin-bottom:clamp(18px,1.5vw,24px);
}
.ip-audience-heading>p{
  grid-area:kicker;
  margin:0;
  color:#135be1;
  font-size:12px;
  font-weight:800;
  letter-spacing:.22em;
}
.ip-audience-heading h2{
  grid-area:title;
  margin:0;
  color:#10141b;
  font-size:clamp(38px,3.6vw,58px);
  line-height:1.04;
  letter-spacing:-.055em;
}
.ip-audience-heading>span{
  grid-area:copy;
  max-width:520px;
  padding-bottom:8px;
  color:#667085;
  font-size:clamp(15px,1.15vw,18px);
  line-height:1.8;
}
.ip-audience .ip-audience-viewport{
  position:relative;
  inset:auto;
  width:100%;
  overflow:visible;
  transform:none;
}
.ip-audience .ip-audience-track{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  align-items:stretch;
  gap:clamp(22px,2.2vw,36px);
  width:100%;
  height:auto;
}
.ip-audience .ip-audience-card{
  display:flex;
  flex-direction:column;
  width:auto;
  min-height:clamp(520px,38vw,620px);
  max-height:none;
  aspect-ratio:auto;
  padding:clamp(24px,1.8vw,30px) clamp(22px,1.8vw,30px) clamp(20px,1.5vw,24px);
  border:0;
  border-radius:clamp(26px,2.2vw,34px);
  background:#1557d8;
  box-shadow:0 18px 50px rgba(20,72,170,.14);
  overflow:hidden;
  filter:none;
}
.ip-audience-card-head{
  display:flex;
  align-items:flex-start;
  gap:14px;
  padding:0;
  border:0;
}
.ip-audience-card-head span{
  display:grid;
  place-items:center;
  width:30px;
  height:30px;
  flex:0 0 30px;
  padding:0;
  border:1px solid rgba(255,255,255,.34);
  border-radius:50%;
  color:rgba(255,255,255,.78);
  font-size:11px;
  font-weight:800;
  letter-spacing:.04em;
}
.ip-audience-card h3{
  margin:0;
  color:#fff;
  font-size:clamp(26px,2vw,34px);
  line-height:1.12;
  letter-spacing:-.03em;
}
.ip-audience-card h3 br{display:none}
.ip-audience-card h3 em{color:#fff;font-style:normal}
.ip-audience-card>.ip-audience-pain{
  margin:14px 0 18px;
  color:rgba(255,255,255,.76);
  font-size:clamp(14px,1vw,16px);
  line-height:1.7;
}
.ip-audience-benefit{
  display:grid;
  grid-template-columns:minmax(0,1fr) 52px;
  align-items:center;
  gap:16px;
  min-height:100px;
  margin-bottom:clamp(18px,1.5vw,22px);
  padding:17px 16px 17px 21px;
  border-radius:20px;
  background:#fff;
  box-shadow:0 10px 24px rgba(8,40,110,.12);
}
.ip-audience-benefit p{
  margin:0;
  color:#1557d8;
  font-size:clamp(14px,1.08vw,17px);
  font-weight:700;
  line-height:1.58;
}
.ip-audience-benefit span{
  display:grid;
  place-items:center;
  width:52px;
  height:52px;
  border-radius:50%;
  color:#1557d8;
  background:#edf3ff;
  font-size:30px;
  font-weight:900;
}
.ip-audience-media{
  position:relative;
  flex:1 1 auto;
  min-height:220px;
  margin-top:auto;
  border-radius:22px;
  overflow:hidden;
  background:#dfe7f4;
}
.ip-audience .ip-audience-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center bottom;
  transform:scale(1.015);
  transition:transform .55s cubic-bezier(.2,.75,.25,1),filter .35s ease;
}
@media (hover:hover) and (pointer:fine) and (min-width:721px){
  .ip-audience .ip-audience-card:hover{transform:translateY(-6px);opacity:1;filter:none;box-shadow:0 28px 62px rgba(20,72,170,.2)}
  .ip-audience .ip-audience-track:has(.ip-audience-card:hover) .ip-audience-card:not(:hover){transform:none;opacity:1;filter:none}
  .ip-audience-card:hover .ip-audience-media img{transform:scale(1.055);filter:saturate(1.04)}
}
@media(max-width:900px){
  .ip-audience .ip-audience-track{
    grid-template-columns:1fr;
    gap:24px;
    max-width:640px;
    margin-inline:auto;
  }
  .ip-audience .ip-audience-card{min-height:650px}
  .ip-audience-media{min-height:300px}
}
@media(max-width:720px){
  .ip-audience{padding:48px 18px 52px}
  .ip-audience-heading{display:block;margin-bottom:28px}
  .ip-audience-heading h2{margin-top:8px;font-size:38px}
  .ip-audience-heading>span{display:block;margin-top:14px;padding:0;font-size:14px}
  .ip-audience .ip-audience-track{gap:22px}
  .ip-audience .ip-audience-card{width:100%;min-height:650px;justify-self:stretch;padding:26px 22px 22px;border-radius:26px}
  .ip-audience-card h3{font-size:28px}
  .ip-audience-card>.ip-audience-pain{margin:16px 0 20px;font-size:14px}
  .ip-audience-benefit{grid-template-columns:minmax(0,1fr) 46px;min-height:104px;padding:18px 16px 18px 20px;border-radius:18px}
  .ip-audience-benefit span{width:46px;height:46px;font-size:27px}
  .ip-audience-media{min-height:300px;border-radius:18px}
}