/* Koshery case study page + the featured Koshery tile on the home page */
:root{--kc-g:max(24px,calc((100vw - 1216px) / 2));--kc-ink:#1f3845;--kc-mid:#488194;--kc-ice:#e6f1f5;--kc-plum:#443658;--kc-coral:#ef756a}

/* ---------- home page: featured case-study tile inside the #ads grid ---------- */
#ads .um-case{position:relative;display:block;grid-column:1/-1;aspect-ratio:1.15;border-radius:1rem;overflow:hidden;background:var(--kc-plum);color:#fff;text-decoration:none;outline:none;isolation:isolate;cursor:pointer}
#ads .um-case img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover!important;transition:transform .9s cubic-bezier(.16,1,.3,1),transform-origin .9s cubic-bezier(.16,1,.3,1);will-change:transform}
#ads .um-case::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(28,22,40,.35) 0%,rgba(28,22,40,0) 40%)}
#ads .um-case-txt{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;padding:clamp(14px,2.2vw,30px)}
#ads .um-case-cta{align-self:flex-end}
#ads .um-case-eyebrow{display:block;font-size:.72rem;letter-spacing:.32em;text-transform:uppercase;color:rgba(255,255,255,.78);margin-bottom:.4rem}
#ads .um-case-name{display:block;font-family:'Chopin-Trial',sans-serif;font-weight:600;font-size:clamp(1.9rem,5vw,4.6rem);line-height:.98;letter-spacing:-.015em}
#ads .um-case-name em{font-family:'Very Vogue Display',serif;font-style:italic;font-weight:401;color:#ffb3a9;letter-spacing:0}
#ads .um-case-cta{flex:none;display:inline-flex;align-items:center;gap:.5rem;height:2.6rem;padding:0 1.25rem;border-radius:9999px;background:#fff;color:var(--kc-ink);font-family:'Chopin-Trial',sans-serif;font-weight:600;font-size:1rem;transition:background .25s ease,color .25s ease}
#ads .um-case-cta svg{width:16px;height:16px;transition:transform .35s cubic-bezier(.2,.7,.2,1)}
#ads .um-case:focus-visible{outline:2px solid #4b9cb5;outline-offset:2px}
@media (hover:hover) and (pointer:fine){
  #ads .um-case:hover img{transform:scale(1.14)}
  #ads .um-case:hover .um-case-cta{background:var(--kc-coral);color:#fff}
  #ads .um-case:hover .um-case-cta svg{transform:translateX(3px)}
}
@media (max-width:639px){
  #ads .um-case-cta{height:2.1rem;padding:0 .9rem;font-size:.85rem}
  #ads .um-case-eyebrow{font-size:.62rem;letter-spacing:.26em;margin-bottom:.25rem}
}
/* feature banners: full gallery width x 2 ad rows (4-col grid = the space of 8 ads) */
@media (min-width:640px){#ads .um-case{aspect-ratio:1.2}}
@media (min-width:1024px){#ads .um-case{aspect-ratio:1.57}#ads .um-case-cta{height:3rem;padding:0 1.6rem;font-size:1.1rem}#ads .um-case-txt{padding:clamp(24px,3vw,44px)}}
#ads .um-case.lp-case{background:#123B52}
#ads .um-case.lp-case img{object-position:left center}
@media (min-width:1024px){#ads .um-case.lp-case .um-case-name{font-size:clamp(2.4rem,4.2vw,4rem)}}
@media (prefers-reduced-motion:reduce){#ads .um-case img{transition:none}}

/* ---------- case study page ---------- */
html.kc-page{scroll-behavior:smooth}
.kc-page body{background:#fcfcfc;color:var(--kc-ink)}
.kc-page #root>div{background:#fcfcfc!important}
.kc-page .kc-sec{background-color:#fcfcfc}
.kc-page .kc-sec.kc-camp{background:#1f3845}
.kc-wrap{padding-left:var(--kc-g);padding-right:var(--kc-g)}
.kc-page #site-header nav{max-width:none;padding-left:var(--kc-g);padding-right:var(--kc-g)}
.kc-serif{font-family:'Very Vogue Display',serif;font-style:italic;font-weight:401}
.kc-eyebrow{font-size:.75rem;letter-spacing:.38em;text-transform:uppercase}

/* hero */
.kc-hero{background:var(--kc-mid);color:#fff;padding-top:clamp(120px,14vw,190px);padding-bottom:clamp(40px,6vw,80px);position:relative}
.kc-back{display:inline-flex;align-items:center;gap:.5rem;color:rgba(255,255,255,.82);font-family:'Chopin-Trial',sans-serif;font-weight:600;font-size:1rem;letter-spacing:.02em;transition:color .2s ease}
.kc-back:hover{color:#fff}
.kc-back svg{width:16px;height:16px;transition:transform .3s ease}
.kc-back:hover svg{transform:translateX(-3px)}
.kc-hero .kc-eyebrow{margin-top:clamp(28px,4vw,56px);color:var(--kc-ice)}
.kc-h1{font-family:'Chopin-Trial',sans-serif;font-weight:600;font-size:clamp(3.4rem,11vw,10rem);line-height:.92;letter-spacing:-.02em;margin-top:.9rem;color:#fcfcfc}
.kc-h1 .kc-serif{display:block;color:var(--kc-ink);font-size:.62em;line-height:1.05;letter-spacing:0;margin-top:.12em}
.kc-hero-row{display:grid;grid-template-columns:1.25fr 1fr;gap:clamp(24px,5vw,80px);align-items:end;margin-top:clamp(28px,4vw,56px)}
.kc-lede{font-family:'Chopin-Trial',sans-serif;font-weight:600;font-size:clamp(1.25rem,2.1vw,1.9rem);line-height:1.3;color:#fcfcfc;max-width:34ch}
.kc-meta{display:grid;grid-template-columns:auto 1fr;gap:.7rem 1.5rem;font-size:.95rem;line-height:1.45;border-top:1px solid rgba(255,255,255,.25);padding-top:1.1rem}
.kc-meta dt{color:var(--kc-ice);opacity:.8;letter-spacing:.2em;text-transform:uppercase;font-size:.7rem;padding-top:.22rem}
.kc-meta dd{margin:0;color:#fff}
.kc-meta a{color:#fff;text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(255,255,255,.45)}
.kc-meta a:hover{text-decoration-color:#fff}
.kc-hero-img{margin-top:clamp(36px,5vw,72px)}

/* image cards (showcase + hero) */
.kc-shot{position:relative;display:block;width:100%;margin:0;border-radius:1rem;overflow:hidden;background:#e2eaed;cursor:zoom-in;outline:none;padding:0;border:0}
.kc-shot img{display:block;width:100%;height:auto;transition:transform .9s cubic-bezier(.16,1,.3,1),transform-origin .9s cubic-bezier(.16,1,.3,1)}
.kc-shot:focus-visible{outline:2px solid #4b9cb5;outline-offset:3px}
@media (hover:hover) and (pointer:fine){.kc-shot:hover img{transform:scale(1.06)}}
.kc-cap{display:flex;gap:.9rem;align-items:baseline;margin-top:.9rem;font-size:.95rem;color:#5b7480}
.kc-cap b{font-family:'Chopin-Trial',sans-serif;font-weight:600;color:var(--kc-ink);font-size:1.05rem;white-space:nowrap}
.kc-cap i{font-style:normal;color:var(--kc-mid);letter-spacing:.2em;font-size:.72rem}

/* sections */
.kc-sec{padding-top:clamp(72px,10vw,150px);padding-bottom:clamp(72px,10vw,150px)}
.kc-h2{font-family:'Chopin-Trial',sans-serif;font-weight:600;font-size:clamp(2.4rem,5.8vw,5.4rem);line-height:1.02;letter-spacing:-.015em;color:var(--kc-ink)}
.kc-h2 .kc-serif{color:var(--kc-mid)}
.kc-about{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(28px,6vw,110px);align-items:start}
.kc-body p{font-size:clamp(1.05rem,1.35vw,1.25rem);line-height:1.65;color:#3b5562}
.kc-body p+p{margin-top:1.1em}
.kc-body p.kc-big{font-family:'Chopin-Trial',sans-serif;font-weight:600;font-size:clamp(1.35rem,2.1vw,1.9rem);line-height:1.35;color:var(--kc-ink)}

.kc-did{background:linear-gradient(135deg,#fcfcfc 0%,#eef4f6 50%,#e2eaed 100%)}
.kc-did-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:20px 40px}
.kc-did-head p{max-width:30rem;color:#3b5562;font-size:1.1rem;line-height:1.6}
.kc-list{list-style:none;margin:clamp(40px,5vw,72px) 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:0 clamp(24px,3vw,48px)}
.kc-list li{border-top:1px solid rgba(31,56,69,.16);padding:1.6rem 0 2.2rem}
.kc-list .kc-n{display:block;font-size:.72rem;letter-spacing:.3em;color:var(--kc-mid)}
.kc-list h3{font-family:'Chopin-Trial',sans-serif;font-weight:600;font-size:clamp(1.35rem,1.9vw,1.75rem);line-height:1.15;color:var(--kc-ink);margin:.7rem 0 .55rem}
.kc-list p{color:#4d6773;line-height:1.6;font-size:1rem}

.kc-show-head{margin-bottom:clamp(36px,5vw,72px)}
.kc-show{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,5vw,72px) clamp(16px,2vw,28px)}
.kc-show .kc-full{grid-column:1/-1}

.kc-camp{background:#1f3845;color:#fff}
.kc-camp .kc-h2{color:#fcfcfc}
.kc-camp .kc-h2 .kc-serif{color:#7fb6c8}
.kc-camp-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:20px 40px;margin-bottom:clamp(36px,5vw,72px)}
.kc-camp-head p{max-width:30rem;color:rgba(255,255,255,.72);font-size:1.1rem;line-height:1.6}
.kc-ads{display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:clamp(14px,2vw,28px)}
.kc-ads .kc-shot{width:calc((100% - 2 * clamp(14px,2vw,28px)) / 3);background:#2a4856;border-radius:1rem}
.kc-ads .kc-shot img{height:auto}

.kc-quote{text-align:center;max-width:56rem;margin:0 auto}
.kc-quote blockquote{margin:0;font-family:'Chopin-Trial',sans-serif;font-weight:600;font-size:clamp(1.5rem,3vw,2.6rem);line-height:1.3;color:var(--kc-ink)}
.kc-quote .kc-qmark{font-family:'Very Vogue Display',serif;font-style:italic;font-weight:401;font-size:5rem;line-height:.6;color:var(--kc-mid);display:block;height:2.4rem}
.kc-quote figcaption{margin-top:1.6rem}
.kc-quote figcaption b{display:block;font-size:.95rem;color:var(--kc-ink);font-weight:600}
.kc-quote figcaption span{display:block;margin-top:.3rem;font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;color:var(--kc-mid)}

.kc-cta{background:#1e353f;color:#fff;text-align:center;padding-top:clamp(90px,11vw,160px);padding-bottom:clamp(90px,11vw,160px)}
.kc-cta h2{font-family:'Chopin-Trial',sans-serif;font-weight:600;font-size:clamp(2.8rem,7vw,4.5rem);line-height:1.05;letter-spacing:-.015em}
.kc-cta h2 .kc-serif{color:#488194;font-size:1.12em;margin-left:.2em}
.kc-cta p{margin:1.2rem auto 0;max-width:34rem;color:rgba(255,255,255,.72);font-size:1.1rem;line-height:1.6}
.kc-cta-btns{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;margin-top:2.4rem}
.kc-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;height:3.25rem;padding:0 2rem;border-radius:9999px;font-family:'Chopin-Trial',sans-serif;font-weight:600;font-size:1.05rem;transition:background .25s ease,color .25s ease,border-color .25s ease}
.kc-btn-solid{background:#4b9cb5;color:#fff}
.kc-btn-solid:hover{background:#5aadc6}
.kc-btn-line{border:1px solid rgba(255,255,255,.35);color:#fff}
.kc-btn-line:hover{border-color:#fff}
.kc-cta .kc-back{margin-top:2.6rem}

.kc-page .um-reveal{transition-duration:.8s}

@media (max-width:900px){
  .kc-hero-row{grid-template-columns:1fr}
  .kc-about{grid-template-columns:1fr}
  .kc-list{grid-template-columns:1fr 1fr}
}
@media (max-width:639px){
  .kc-list{grid-template-columns:1fr}
  .kc-list li{padding:1.2rem 0 1.5rem}
  .kc-show{grid-template-columns:1fr}
  .kc-ads .kc-shot{width:calc((100% - clamp(14px,2vw,28px)) / 2)}
  .kc-shot{border-radius:.75rem}
  .kc-meta{font-size:.9rem}
  .kc-cap{font-size:.85rem}
  .kc-hero .kc-eyebrow{letter-spacing:.24em;font-size:.68rem}
}
@media (prefers-reduced-motion:reduce){.kc-shot img{transition:none}}