/* ==========================================================
   Phase 08-G.18.12.1 — Single Portfolio UI Refinement
   Scope: mkp_case_study only
   ========================================================== */

.mkp-case-single--v2{
  --mkp-case-radius-lg:30px;
  --mkp-case-radius-md:20px;
  --mkp-case-shadow:0 22px 60px rgba(8,31,38,.08);
  overflow:clip;
}

.mkp-case-single--v2 .mkp-case-section-title{
  margin-bottom:22px;
  text-align:center;
}
.mkp-case-single--v2 .mkp-case-section-title>span{
  display:block;
  font-size:.72rem;
  letter-spacing:.09em;
}
.mkp-case-single--v2 .mkp-case-section-title h2{
  margin-top:7px;
  font-size:clamp(1.65rem,2.7vw,2.35rem);
  line-height:1.45;
}

/* Hero */
.mkp-case-hero-v2{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:72px 0 76px;
  background:
    radial-gradient(circle at 16% 12%,rgba(16,149,79,.14),transparent 28rem),
    radial-gradient(circle at 88% 86%,rgba(28,67,79,.12),transparent 24rem),
    linear-gradient(180deg,var(--mkp-surface),var(--mkp-surface-soft));
}
.mkp-case-hero-v2::after{
  content:"";
  position:absolute;
  inset:auto 0 0;
  z-index:-1;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(16,149,79,.25),transparent);
}
.mkp-case-hero-v2__shape{
  position:absolute;
  z-index:-1;
  border:1px solid rgba(16,149,79,.14);
  pointer-events:none;
}
.mkp-case-hero-v2__shape--one{
  top:9%;left:5%;width:150px;height:150px;border-radius:42px;transform:rotate(18deg);
  animation:mkpCaseFloatOne 13s ease-in-out infinite alternate;
}
.mkp-case-hero-v2__shape--two{
  right:5%;bottom:10%;width:92px;height:92px;border-radius:50%;
  background:rgba(16,149,79,.045);
  animation:mkpCaseFloatTwo 11s ease-in-out infinite alternate;
}
.mkp-case-hero-v2__shape--three{
  top:24%;right:43%;width:52px;height:52px;border-radius:16px;transform:rotate(32deg);
  background:rgba(28,67,79,.04);
  animation:mkpCaseFloatThree 9s ease-in-out infinite alternate;
}
@keyframes mkpCaseFloatOne{to{transform:translate3d(18px,12px,0) rotate(31deg)}}
@keyframes mkpCaseFloatTwo{to{transform:translate3d(-14px,-18px,0) scale(1.08)}}
@keyframes mkpCaseFloatThree{to{transform:translate3d(9px,-12px,0) rotate(12deg)}}

.mkp-case-single--v2 .mkp-case-single__hero-grid{
  grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);
  gap:52px;
}
.mkp-case-single--v2 .mkp-case-single__intro h1{
  max-width:720px;
  margin:11px 0 12px;
  font-size:clamp(2.6rem,5.1vw,5rem);
  line-height:1.25;
  letter-spacing:-.035em;
}
.mkp-case-single--v2 .mkp-case-single__lead{
  max-width:680px;
  font-size:1rem;
  line-height:2.05;
}
.mkp-case-single--v2 .mkp-case-single__categories{
  gap:8px;
  margin:20px 0;
}
.mkp-case-single--v2 .mkp-case-single__categories a{
  min-height:34px;
  padding:0 11px;
  font-size:.75rem;
}
.mkp-case-hero-v2__actions{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  margin-top:24px;
}
.mkp-case-hero-v2__status{
  display:inline-flex;
  align-items:center;
  gap:7px;
  min-height:38px;
  padding:0 12px;
  border:1px solid var(--mkp-border);
  border-radius:999px;
  background:color-mix(in srgb,var(--mkp-surface) 82%,transparent);
  color:var(--mkp-muted);
  font-size:.8rem;
  font-weight:800;
}
.mkp-case-hero-v2__status i{
  width:8px;height:8px;border-radius:50%;background:var(--mkp-accent-600);
  box-shadow:0 0 0 5px rgba(16,149,79,.11);
}
.mkp-case-single--v2 .mkp-case-single__cover{
  position:relative;
  min-height:440px;
  border-radius:34px;
  box-shadow:0 30px 70px rgba(8,31,38,.13);
  transform:perspective(1200px) rotateY(-2deg);
}
.mkp-case-single--v2 .mkp-case-single__cover::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);
  pointer-events:none;
}
.mkp-case-single--v2 .mkp-case-single__cover img{
  min-height:440px;
}
.mkp-case-single__cover-badge{
  position:absolute;
  top:20px;
  right:-18px;
  z-index:2;
  display:inline-flex;
  align-items:center;
  gap:7px;
  min-height:34px;
  padding:0 11px;
  border:1px solid rgba(255,255,255,.22);
  border-radius:999px;
  background:rgba(7,29,36,.68);
  backdrop-filter:blur(12px);
  color:#fff;
  font-size:.75rem;
  font-weight:850;
}
.mkp-case-single__cover-badge svg{width:15px;height:15px}
.mkp-case-single__cover-placeholder{display:grid!important;place-items:center;min-height:440px!important}

/* Facts */
.mkp-case-single--v2 .mkp-case-facts{
  position:relative;
  padding:42px 0 44px;
  border:0;
  background:transparent;
}
.mkp-case-single--v2 .mkp-case-facts::before{
  content:"";
  position:absolute;
  top:24px;
  right:0;
  left:0;
  bottom:24px;
  border-top:1px solid rgba(255,255,255,.04);
  border-bottom:1px solid rgba(255,255,255,.04);
  background:linear-gradient(180deg,rgba(255,255,255,.015),rgba(255,255,255,.028));
}
.mkp-case-single--v2 .mkp-case-facts>.mkp-container{
  position:relative;
  z-index:4;
  margin-top:-36px;
}
.mkp-case-single--v2 .mkp-case-facts__grid{
  position:relative;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,280px));
  justify-content:center;
  gap:14px;
  padding:20px 20px 28px;
  border:1px solid var(--mkp-border);
  border-radius:24px;
  background:
    linear-gradient(180deg,color-mix(in srgb,var(--mkp-surface) 92%,transparent) 0%,color-mix(in srgb,var(--mkp-surface) 98%,transparent) 76%,rgba(16,149,79,.08) 100%);
  backdrop-filter:blur(16px);
  box-shadow:var(--mkp-case-shadow);
}
.mkp-case-single--v2 .mkp-case-facts__grid::after{
  content:"";
  position:absolute;
  right:18px;left:18px;bottom:14px;
  height:7px;
  border-radius:999px;
  background:linear-gradient(90deg,rgba(16,149,79,.06),rgba(16,149,79,.24),rgba(16,149,79,.06));
  pointer-events:none;
}
.mkp-case-single--v2 .mkp-case-fact{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  min-height:78px;
  padding:14px 16px;
  border:1px solid rgba(255,255,255,.05);
  border-radius:16px;
  background:rgba(255,255,255,.018);
}
.mkp-case-single--v2 .mkp-case-fact:hover{border-color:rgba(16,149,79,.2)}
.mkp-case-fact__label{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:var(--mkp-muted);
  font-size:.72rem;
  font-weight:800;
}
.mkp-case-fact__label em{font-style:normal}
.mkp-case-fact__label svg{width:16px;height:16px;color:var(--mkp-accent-600)}
.mkp-case-fact__value{margin-top:8px;max-width:100%}
.mkp-case-single--v2 .mkp-case-fact strong,
.mkp-case-single--v2 .mkp-case-fact a{
  display:block;
  font-size:.92rem;
  line-height:1.85;
  white-space:normal;
  word-break:break-word;
}

/* Scope of work — compact stacked cards */
.mkp-case-single--v2 .mkp-case-services{
  padding:76px 0;
  border:0;
  background:var(--mkp-surface);
}
.mkp-case-services-board{
  overflow:hidden;
  border:1px solid var(--mkp-border);
  border-radius:var(--mkp-case-radius-lg);
  background:
    radial-gradient(circle at 100% 0%,rgba(16,149,79,.08),transparent 23rem),
    var(--mkp-surface-soft);
  box-shadow:0 18px 45px rgba(8,31,38,.055);
}
.mkp-case-services-board__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:22px 24px;
  border-bottom:1px solid var(--mkp-border);
}
.mkp-case-services-board__head>div{display:flex;align-items:baseline;gap:9px;flex:0 0 auto}
.mkp-case-services-board__head strong{font-size:1.9rem;line-height:1;color:var(--mkp-accent-600)}
.mkp-case-services-board__head span{font-size:.76rem;font-weight:850;color:var(--mkp-muted)}
.mkp-case-services-board__head p{max-width:570px;margin:0;color:var(--mkp-muted);font-size:.86rem;line-height:1.9}
.mkp-case-services-board__list{
  display:grid;
  grid-template-columns:1fr;
  gap:12px;
  padding:16px;
}
.mkp-case-service-row{
  display:grid;
  grid-template-columns:40px minmax(0,1fr);
  gap:12px;
  align-items:flex-start;
  min-height:auto;
  padding:14px 16px;
  border:1px solid var(--mkp-border);
  border-radius:16px;
  background:rgba(255,255,255,.018);
}
.mkp-case-service-row__check{
  display:grid;
  place-items:center;
  width:34px;height:34px;
  border:1px solid rgba(16,149,79,.24);
  border-radius:12px;
  background:var(--mkp-accent-soft);
  color:var(--mkp-accent-600);
  font-size:.96rem;
  font-weight:950;
}
.mkp-case-service-row h3{margin:1px 0 4px;font-size:.96rem;line-height:1.8}
.mkp-case-service-row p{margin:0;color:var(--mkp-muted);font-size:.82rem;line-height:1.85}

/* Roadmap */
.mkp-case-single--v2 .mkp-case-story-map{
  padding:76px 0;
  border:0;
  background:var(--mkp-surface-soft);
}
.mkp-case-roadmap{
  position:relative;
  overflow:hidden;
  padding:24px;
  border:1px solid var(--mkp-border);
  border-radius:var(--mkp-case-radius-lg);
  background:var(--mkp-surface);
  box-shadow:var(--mkp-case-shadow);
}
.mkp-case-roadmap__rail{
  position:absolute;
  top:28px;
  right:calc((100% - 32px) / 6);
  left:calc((100% - 32px) / 6);
  height:6px;
  border-radius:999px;
  background:rgba(255,255,255,.06);
  overflow:hidden;
}
.mkp-case-roadmap__rail span{
  display:block;
  width:100%;height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,var(--mkp-accent-600),#49d18a);
  transform-origin:right center;
  animation:mkpCaseRoadmapFill 1.1s ease both;
}
.mkp-case-roadmap__rail::before,
.mkp-case-roadmap__rail::after{
  content:"";
  position:absolute;
  top:50%;
  width:12px;height:12px;
  transform:translateY(-50%);
  border-radius:50%;
  background:#49d18a;
  box-shadow:0 0 0 5px rgba(16,149,79,.12);
}
.mkp-case-roadmap__rail::before{right:-6px}
.mkp-case-roadmap__rail::after{left:-6px}
@keyframes mkpCaseRoadmapFill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.mkp-case-roadmap__steps{
  position:relative;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
  padding-top:24px;
}
.mkp-case-roadmap__step{
  position:relative;
  padding:62px 18px 18px;
  border:1px solid var(--mkp-border);
  border-radius:18px;
  background:var(--mkp-surface-soft);
}
.mkp-case-roadmap__marker{
  position:absolute;
  top:-18px;right:50%;
  z-index:2;
  display:grid;
  place-items:center;
  width:44px;height:44px;
  transform:translateX(50%);
  border:4px solid var(--mkp-surface);
  border-radius:50%;
  background:linear-gradient(180deg,#43cf86,var(--mkp-accent-600));
  color:#fff;
  box-shadow:0 12px 28px rgba(16,149,79,.22);
}
.mkp-case-roadmap__marker svg{width:18px;height:18px}
.mkp-case-roadmap__step small{display:block;color:var(--mkp-accent-600);font-size:.66rem;font-weight:900;letter-spacing:.04em}
.mkp-case-roadmap__step h3{margin:8px 0 8px;font-size:1.04rem}
.mkp-case-roadmap__step p{margin:0;color:var(--mkp-muted);font-size:.82rem;line-height:1.9}
.mkp-case-roadmap__summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-top:16px;
  padding-top:16px;
  border-top:1px solid var(--mkp-border);
}
.mkp-case-roadmap__summary span{display:flex;align-items:center;gap:8px;color:var(--mkp-muted);font-size:.8rem;font-weight:800}
.mkp-case-roadmap__summary span i{width:9px;height:9px;border-radius:50%;background:var(--mkp-accent-600);box-shadow:0 0 0 6px rgba(16,149,79,.11)}
.mkp-case-roadmap__summary strong{font-size:1.28rem;color:var(--mkp-accent-600)}

/* KPI */
.mkp-case-single--v2 .mkp-case-kpis{
  padding:72px 0;
  background:var(--mkp-primary);
}
.mkp-case-results-panel{
  display:grid;
  grid-template-columns:minmax(280px,.84fr) minmax(0,1.16fr);
  gap:20px;
  align-items:stretch;
  padding:24px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:28px;
  background:
    radial-gradient(circle at 0 100%,rgba(16,149,79,.18),transparent 24rem),
    rgba(255,255,255,.035);
}
.mkp-case-results-panel__intro{
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:8px 4px;
}
.mkp-case-results-panel__intro h2{margin:8px 0 10px;font-size:clamp(1.5rem,2.5vw,2.1rem);line-height:1.45;color:#fff}
.mkp-case-results-panel__intro p{margin:0;color:rgba(255,255,255,.74);font-size:.86rem;line-height:1.95}
.mkp-case-single--v2 .mkp-case-kpis__grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin:0;
  align-content:stretch;
}
.mkp-case-results-panel.is-single{grid-template-columns:minmax(0,1fr) minmax(280px,360px)}
.mkp-case-single--v2 .mkp-case-kpis__grid.is-single{grid-template-columns:minmax(280px,360px);justify-content:center}
.mkp-case-single--v2 .mkp-case-kpi{
  position:relative;
  min-height:138px;
  padding:18px;
  border-radius:18px;
  overflow:hidden;
}
.mkp-case-single--v2 .mkp-case-kpi strong{font-size:clamp(2rem,4vw,3rem)}
.mkp-case-single--v2 .mkp-case-kpi small{font-size:.82rem}
.mkp-case-single--v2 .mkp-case-kpi::after{
  content:"";
  position:absolute;
  left:18px;bottom:16px;
  width:44px;height:18px;
  border-right:2px solid rgba(174,236,200,.28);
  border-top:2px solid rgba(174,236,200,.28);
  transform:skewY(-24deg);
}
.mkp-case-single--v2 .mkp-case-kpi span{font-size:.76rem}
.mkp-case-single--v2 .mkp-case-kpi strong{font-size:clamp(1.65rem,3vw,2.35rem)}
.mkp-case-single--v2 .mkp-case-kpi small{font-size:.7rem}

/* Content */
.mkp-case-single--v2 .mkp-case-single__content-wrap{padding:72px 0 100px}
.mkp-case-single--v2 .mkp-case-narrative{font-size:1rem;line-height:2.1}
.mkp-case-single--v2 .mkp-case-builder-section__body{font-size:.96rem;line-height:2.05}
.mkp-case-single--v2 .mkp-case-builder-section--image figcaption{font-size:.76rem}

/* Unified project media player */
.mkp-case-media-suite,
.mkp-case-single--v2 .mkp-case-gallery,
.mkp-case-single--v2 .mkp-case-before-after,
.mkp-case-single--v2 .mkp-case-testimonial,
.mkp-case-single--v2 .mkp-case-outcome,
.mkp-case-single--v2 .mkp-case-client,
.mkp-case-single--v2 .mkp-related-cases,
.mkp-case-single--v2 .mkp-case-seo-results{
  max-width:1080px;
  margin:72px auto 0;
}
.mkp-case-media-player{
  display:grid;
  grid-template-columns:minmax(0,1.62fr) minmax(270px,.78fr);
  min-height:520px;
  overflow:hidden;
  border:1px solid var(--mkp-border);
  border-radius:26px;
  background:#07191f;
  box-shadow:0 24px 58px rgba(4,20,25,.18);
  direction:ltr;
}
.mkp-case-media-player__stage{
  position:relative;
  min-width:0;
  min-height:520px;
  background:#050e12;
  direction:rtl;
}
.mkp-case-media-player__video-stage,
.mkp-case-media-player__embed-stage,
.mkp-case-media-player__link-stage{
  position:absolute;
  inset:0;
}
.mkp-case-media-player__video-stage[hidden],
.mkp-case-media-player__embed-stage[hidden],
.mkp-case-media-player__link-stage[hidden]{display:none!important}
.mkp-case-media-player__video-stage video,
.mkp-case-media-player__embed-stage iframe{
  display:block;
  width:100%;height:100%;
  border:0;
  object-fit:contain;
  background:#000;
}
.mkp-case-media-player__link-stage{
  display:grid;
  place-items:center;
  padding:28px;
}
.mkp-case-media-player__link-stage a{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:44px;
  padding:0 16px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:12px;
  color:#fff;
  font-weight:850;
}
.mkp-case-media-player__link-stage svg{width:16px;height:16px}
.mkp-case-player__topline{
  position:absolute;
  top:0;right:0;left:0;
  z-index:4;
  padding:18px 20px 42px;
  background:linear-gradient(180deg,rgba(0,0,0,.54),transparent);
  color:#fff;
  pointer-events:none;
}
.mkp-case-player__topline span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.84rem;font-weight:850}
.mkp-case-player__center-play{
  position:absolute;
  top:50%;left:50%;
  z-index:5;
  display:grid;
  place-items:center;
  width:72px;height:72px;
  transform:translate(-50%,-50%);
  border:1px solid rgba(255,255,255,.34);
  border-radius:50%;
  background:rgba(5,23,29,.72);
  backdrop-filter:blur(12px);
  color:#fff;
  cursor:pointer;
  transition:transform .2s,opacity .2s,background .2s;
}
.mkp-case-player__center-play:hover{transform:translate(-50%,-50%) scale(1.06);background:rgba(16,149,79,.82)}
.mkp-case-player__center-play svg{width:28px;height:28px;margin-right:-2px}
.mkp-case-media-player.is-playing .mkp-case-player__center-play{opacity:0;pointer-events:none}
.mkp-case-player__controls{
  position:absolute;
  right:0;bottom:0;left:0;
  z-index:6;
  display:flex;
  align-items:center;
  gap:10px;
  min-height:66px;
  padding:22px 16px 12px;
  background:linear-gradient(0deg,rgba(0,0,0,.78),transparent);
  direction:ltr;
}
.mkp-case-player__control{
  display:grid;
  place-items:center;
  flex:0 0 auto;
  width:34px;height:34px;
  padding:0;
  border:0;
  border-radius:9px;
  background:transparent;
  color:#fff;
  cursor:pointer;
}
.mkp-case-player__control:hover{background:rgba(255,255,255,.12)}
.mkp-case-player__control svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8}
.mkp-case-player__control--play svg{fill:currentColor;stroke:none;width:18px;height:18px}
.mkp-case-media-player.is-playing .mkp-case-player__control--play svg{display:none}
.mkp-case-media-player.is-playing .mkp-case-player__control--play::before,
.mkp-case-media-player.is-playing .mkp-case-player__control--play::after{
  content:"";
  display:block;
  width:3px;height:15px;
  border-radius:2px;
  background:currentColor;
}
.mkp-case-media-player.is-playing .mkp-case-player__control--play{display:flex;gap:4px;justify-content:center}
.mkp-case-player__time{flex:0 0 auto;color:rgba(255,255,255,.86);font-size:.7rem;font-variant-numeric:tabular-nums;direction:ltr}
.mkp-case-player__progress{
  flex:1 1 auto;
  min-width:80px;
  accent-color:#16ad61;
  cursor:pointer;
}
.mkp-case-media-player__playlist{
  min-width:0;
  border-left:1px solid rgba(255,255,255,.11);
  background:#0a252d;
  color:#fff;
  direction:rtl;
}
.mkp-case-media-player__playlist-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  min-height:70px;
  padding:14px 16px;
  border-bottom:1px solid rgba(255,255,255,.11);
  background:#103a45;
}
.mkp-case-media-player__playlist-head>div{display:grid;gap:2px}
.mkp-case-media-player__playlist-head strong{font-size:.88rem}
.mkp-case-media-player__playlist-head span{color:rgba(255,255,255,.68);font-size:.67rem}
.mkp-case-media-player__playlist-count{font-weight:900;letter-spacing:.08em}
.mkp-case-media-player__playlist-list{
  max-height:450px;
  overflow:auto;
  scrollbar-width:thin;
  scrollbar-color:rgba(255,255,255,.26) transparent;
}
.mkp-case-media-player__playlist-item{
  display:grid;
  grid-template-columns:36px minmax(0,1fr) 30px;
  gap:9px;
  align-items:center;
  width:100%;
  min-height:72px;
  padding:10px 12px;
  border:0;
  border-bottom:1px solid rgba(255,255,255,.08);
  background:transparent;
  color:#fff;
  text-align:right;
  cursor:pointer;
  transition:background .2s,color .2s;
}
.mkp-case-media-player__playlist-item:hover{background:rgba(255,255,255,.05)}
.mkp-case-media-player__playlist-item.is-active{background:rgba(16,149,79,.16);box-shadow:inset -3px 0 0 #16ad61}
.mkp-case-media-player__playlist-play{
  display:grid;
  place-items:center;
  width:34px;height:34px;
  border-radius:50%;
  background:rgba(16,149,79,.24);
  color:#8ce5b2;
}
.mkp-case-media-player__playlist-play svg{width:16px;height:16px;fill:currentColor;stroke:none}
.mkp-case-media-player__playlist-copy{display:grid;gap:3px;min-width:0}
.mkp-case-media-player__playlist-copy strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.8rem}
.mkp-case-media-player__playlist-copy small{min-height:1em;color:rgba(255,255,255,.58);font-size:.66rem;direction:ltr;text-align:right}
.mkp-case-media-player__playlist-index{font-size:.69rem;color:rgba(255,255,255,.43);font-variant-numeric:tabular-nums}

/* Gallery slider */
.mkp-case-gallery-slider{
  overflow:hidden;
  border:1px solid var(--mkp-border);
  border-radius:26px;
  background:var(--mkp-surface-soft);
  box-shadow:0 20px 50px rgba(8,31,38,.07);
}
.mkp-case-gallery-slider__stage{
  position:relative;
  aspect-ratio:16/9;
  overflow:hidden;
  background:var(--mkp-surface-soft);
  touch-action:pan-y;
}
.mkp-case-gallery-slider__slide{
  position:absolute;
  inset:0;
  margin:0;
  opacity:0;
  transform:scale(.985);
  transition:opacity .28s ease,transform .35s ease;
}
.mkp-case-gallery-slider__slide.is-active{opacity:1;transform:scale(1)}
.mkp-case-gallery-slider__slide img{display:block;width:100%;height:100%;object-fit:contain}
.mkp-case-gallery-slider__nav{
  position:absolute;
  top:50%;
  z-index:4;
  display:grid;
  place-items:center;
  width:44px;height:44px;
  transform:translateY(-50%);
  border:1px solid rgba(255,255,255,.28);
  border-radius:14px;
  background:rgba(7,29,36,.66);
  backdrop-filter:blur(10px);
  color:#fff;
  cursor:pointer;
}
.mkp-case-gallery-slider__nav svg{width:18px;height:18px}
.mkp-case-gallery-slider__nav--prev{right:16px}
.mkp-case-gallery-slider__nav--prev svg{transform:rotate(180deg)}
.mkp-case-gallery-slider__nav--next{left:16px}
.mkp-case-gallery-slider__counter{
  position:absolute;
  left:16px;bottom:15px;
  z-index:4;
  display:inline-flex;
  gap:4px;
  min-height:31px;
  align-items:center;
  padding:0 10px;
  border-radius:999px;
  background:rgba(7,29,36,.68);
  color:#fff;
  font-size:.72rem;
  direction:ltr;
}
.mkp-case-gallery-slider__thumbs{
  display:flex;
  gap:8px;
  overflow:auto;
  padding:10px;
  border-top:1px solid var(--mkp-border);
  scrollbar-width:thin;
}
.mkp-case-gallery-slider__thumb{
  flex:0 0 88px;
  height:58px;
  overflow:hidden;
  padding:0;
  border:2px solid transparent;
  border-radius:11px;
  background:var(--mkp-surface);
  opacity:.62;
  cursor:pointer;
  transition:opacity .2s,border-color .2s,transform .2s;
}
.mkp-case-gallery-slider__thumb:hover{opacity:.9;transform:translateY(-2px)}
.mkp-case-gallery-slider__thumb.is-active{opacity:1;border-color:var(--mkp-accent-600)}
.mkp-case-gallery-slider__thumb img{display:block;width:100%;height:100%;object-fit:cover}

/* Supporting sections typography */
.mkp-case-single--v2 .mkp-case-outcome{padding:32px}
.mkp-case-single--v2 .mkp-case-outcome h2{font-size:1.75rem}
.mkp-case-single--v2 .mkp-case-outcome p{font-size:.96rem;line-height:2}
.mkp-case-single--v2 .mkp-case-client{padding:28px}
.mkp-case-single--v2 .mkp-case-client>div:last-child>span{font-size:.74rem}
.mkp-case-single--v2 .mkp-case-client h2{font-size:1.35rem}
.mkp-case-single--v2 .mkp-case-client p{font-size:.88rem;line-height:1.95}
.mkp-case-single--v2 .mkp-case-testimonial p{font-size:1rem}
.mkp-case-single--v2 .mkp-case-testimonial cite{font-size:.78rem}
.mkp-case-single--v2 .mkp-related-cases .mkp-case-card h3{font-size:1.06rem}
.mkp-case-single--v2 .mkp-related-cases .mkp-case-card__body>p{font-size:.8rem}
.mkp-case-single--v2 .mkp-related-cases .mkp-case-card__client,
.mkp-case-single--v2 .mkp-related-cases .mkp-case-card__cta{font-size:.72rem}

/* Final SEO growth story */
.mkp-case-seo-results--final{
  padding-top:72px;
  border-top:1px solid var(--mkp-border);
}
.mkp-case-seo-results__intro{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin:-4px 0 22px;
}
.mkp-case-seo-results__intro p{max-width:680px;margin:0;color:var(--mkp-muted);font-size:.9rem;line-height:1.9}
.mkp-case-seo-results__intro>span{
  flex:0 0 auto;
  display:inline-flex;
  min-height:34px;
  align-items:center;
  padding:0 11px;
  border:1px solid var(--mkp-border);
  border-radius:999px;
  background:var(--mkp-surface-soft);
  color:var(--mkp-muted);
  font-size:.74rem;
  font-weight:850;
}
.mkp-case-seo-results__visual-list{display:grid;gap:12px;max-width:860px}
.mkp-case-seo-result{
  display:grid;
  grid-template-columns:96px minmax(0,1fr);
  grid-template-areas:
    "delta metric"
    "journey journey";
  gap:12px 14px;
  align-items:start;
  padding:14px 16px;
  border:1px solid var(--mkp-border);
  border-radius:16px;
  background:rgba(255,255,255,.018);
  box-shadow:0 10px 26px rgba(8,31,38,.04);
}
.mkp-case-seo-result__metric{grid-area:metric;display:flex;align-items:center;gap:12px;min-width:0}
.mkp-case-seo-result__metric>a{flex:0 0 54px;width:54px;height:54px;overflow:hidden;border-radius:12px;background:var(--mkp-surface-soft)}
.mkp-case-seo-result__metric img{width:100%;height:100%;object-fit:cover}
.mkp-case-seo-result__metric>div{min-width:0}
.mkp-case-seo-result__metric small{display:block;color:var(--mkp-accent-600);font-size:.63rem;font-weight:900;letter-spacing:.05em}
.mkp-case-seo-result__metric strong{display:block;margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.9rem}
.mkp-case-seo-result__metric p{margin:4px 0 0;color:var(--mkp-muted);font-size:.73rem;line-height:1.65}
.mkp-case-seo-result__journey{
  grid-area:journey;
  display:grid;
  grid-template-columns:52px minmax(120px,1fr) 52px;
  gap:10px;
  align-items:center;
  direction:ltr;
}
.mkp-case-seo-result__point{display:grid;gap:2px;text-align:center}
.mkp-case-seo-result__point small{color:var(--mkp-muted);font-size:.63rem}
.mkp-case-seo-result__point b{font-size:.94rem;font-variant-numeric:tabular-nums}
.mkp-case-seo-result__point--after b{color:var(--mkp-accent-600)}
.mkp-case-seo-result__track{
  position:relative;
  height:7px;
  border-radius:999px;
  background:var(--mkp-border);
  overflow:visible;
}
.mkp-case-seo-result__track::before,
.mkp-case-seo-result__track::after{
  content:"";
  position:absolute;
  top:50%;
  z-index:2;
  width:12px;height:12px;
  transform:translateY(-50%);
  border:3px solid var(--mkp-surface);
  border-radius:50%;
  background:var(--mkp-muted);
}
.mkp-case-seo-result__track::before{left:-2px}
.mkp-case-seo-result__track::after{right:-2px;background:var(--mkp-accent-600)}
.mkp-case-seo-result__track span{
  display:block;
  width:var(--mkp-rank-progress);
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,var(--mkp-primary),var(--mkp-accent-600));
  transition:width .5s ease;
}
.mkp-case-seo-result__track i{
  position:absolute;
  top:50%;
  left:var(--mkp-rank-progress);
  width:9px;height:9px;
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:var(--mkp-accent-600);
  box-shadow:0 0 0 5px rgba(16,149,79,.12);
}
.mkp-case-seo-result__delta{
  grid-area:delta;
  display:grid;
  place-items:center;
  gap:3px;
  min-height:72px;
  padding:10px 8px;
  border:1px solid rgba(16,149,79,.16);
  border-radius:14px;
  background:var(--mkp-accent-soft);
  text-align:center;
}
.mkp-case-seo-result__delta strong{font-size:1.1rem;color:var(--mkp-accent-600)}
.mkp-case-seo-result__delta strong svg{width:20px;height:20px}
.mkp-case-seo-result__delta span{color:var(--mkp-muted);font-size:.66rem;font-weight:800}
.mkp-case-seo-result.is-declined .mkp-case-seo-result__delta{background:var(--mkp-surface-soft);border-color:var(--mkp-border)}
.mkp-case-seo-result.is-declined .mkp-case-seo-result__delta strong{color:var(--mkp-muted)}

@media(max-width:1050px){
  .mkp-case-media-player{grid-template-columns:minmax(0,1.45fr) minmax(250px,.8fr);min-height:470px}
  .mkp-case-media-player__stage{min-height:470px}
  .mkp-case-media-player__playlist-list{max-height:400px}
  .mkp-case-seo-result{grid-template-columns:88px minmax(0,1fr);grid-template-areas:"delta metric" "journey journey";gap:12px}
}

@media(max-width:900px){
  .mkp-case-single--v2 .mkp-case-single__hero-grid{grid-template-columns:1fr;gap:34px}
  .mkp-case-single--v2 .mkp-case-single__cover{transform:none}
  .mkp-case-results-panel{grid-template-columns:1fr}
  .mkp-case-media-player{grid-template-columns:1fr;direction:rtl}
  .mkp-case-media-player__stage{min-height:auto;aspect-ratio:16/9}
  .mkp-case-media-player__playlist{border-left:0;border-top:1px solid rgba(255,255,255,.11)}
  .mkp-case-media-player__playlist-list{max-height:310px}
  .mkp-case-seo-result{grid-template-columns:1fr;grid-template-areas:"metric" "journey" "delta"}
  .mkp-case-seo-result__journey{grid-template-columns:60px minmax(120px,1fr) 60px}
  .mkp-case-seo-result__delta{grid-template-columns:auto auto;justify-content:center;min-height:auto}
}

@media(max-width:720px){
  .mkp-case-hero-v2{padding:52px 0 62px}
  .mkp-case-single--v2 .mkp-case-single__intro{text-align:right}
  .mkp-case-single--v2 .mkp-case-single__categories,
  .mkp-case-single--v2 .mkp-case-single__intro .mkp-button{justify-content:flex-start;margin-inline:0}
  .mkp-case-single--v2 .mkp-case-single__intro h1{font-size:clamp(2.2rem,12vw,3.25rem)}
  .mkp-case-single--v2 .mkp-case-single__lead{font-size:.94rem}
  .mkp-case-hero-v2__actions{align-items:flex-start;flex-direction:column}
  .mkp-case-single--v2 .mkp-case-single__cover,
  .mkp-case-single--v2 .mkp-case-single__cover img,
  .mkp-case-single__cover-placeholder{min-height:280px!important}
  .mkp-case-single--v2 .mkp-case-facts>.mkp-container{margin-top:-18px}
  .mkp-case-single--v2 .mkp-case-facts__grid{grid-template-columns:1fr 1fr;justify-content:stretch}
  .mkp-case-services-board__head{align-items:flex-start;flex-direction:column;padding:18px}
  .mkp-case-services-board__list{grid-template-columns:1fr;padding:14px}
  .mkp-case-service-row{border-left:0!important;border-bottom:0!important;padding:14px}
  .mkp-case-service-row:last-child{border-bottom:0!important}
  .mkp-case-roadmap{padding:20px}
  .mkp-case-roadmap__rail{top:24px;right:24px;bottom:68px;left:auto;width:6px;height:auto}
  .mkp-case-roadmap__rail span{width:100%;height:100%;transform-origin:center top;animation-name:mkpCaseRoadmapFillMobile}
  @keyframes mkpCaseRoadmapFillMobile{from{transform:scaleY(0)}to{transform:scaleY(1)}}
  .mkp-case-roadmap__steps{grid-template-columns:1fr;gap:12px}
  .mkp-case-roadmap__step{padding:18px 60px 18px 16px}
  .mkp-case-roadmap__marker{top:18px;right:14px;transform:none}
  .mkp-case-results-panel{padding:18px}
  .mkp-case-single--v2 .mkp-case-kpis__grid{grid-template-columns:1fr 1fr}
  .mkp-case-single--v2 .mkp-case-kpi{min-height:128px;padding:16px}
  .mkp-case-media-player{border-radius:20px}
  .mkp-case-media-player__playlist-head{min-height:62px}
  .mkp-case-media-player__playlist-list{max-height:270px}
  .mkp-case-player__controls{gap:6px;padding-inline:9px}
  .mkp-case-player__time{font-size:.62rem}
  .mkp-case-gallery-slider__stage{aspect-ratio:4/3}
  .mkp-case-gallery-slider__nav{width:40px;height:40px}
  .mkp-case-gallery-slider__thumb{flex-basis:72px;height:50px}
  .mkp-case-seo-results__intro{align-items:flex-start;flex-direction:column}
  .mkp-case-seo-result{padding:14px 15px}
}

@media(max-width:470px){
  .mkp-case-single--v2 .mkp-case-facts__grid,
  .mkp-case-single--v2 .mkp-case-kpis__grid{grid-template-columns:1fr}
  .mkp-case-single--v2 .mkp-case-fact{min-height:70px}
  .mkp-case-player__center-play{width:58px;height:58px}
  .mkp-case-player__center-play svg{width:23px;height:23px}
  .mkp-case-player__controls{min-height:58px}
  .mkp-case-player__time{display:none}
  .mkp-case-media-player__playlist-item{grid-template-columns:34px minmax(0,1fr) 26px;min-height:64px;padding:8px 10px}
  .mkp-case-seo-result__journey{grid-template-columns:48px minmax(90px,1fr) 48px;gap:7px}
  .mkp-case-seo-result__point b{font-size:.9rem}
}


.mkp-case-single--v2 .mkp-case-facts__grid--count-3{grid-template-columns:repeat(3,minmax(220px,260px))}
.mkp-case-single--v2 .mkp-case-facts__grid--count-2{grid-template-columns:repeat(2,minmax(220px,280px))}

@media(max-width:900px){
  .mkp-case-results-panel{grid-template-columns:1fr}
  .mkp-case-single--v2 .mkp-case-kpis__grid.is-single{grid-template-columns:1fr}
}
@media(max-width:720px){
  .mkp-case-single--v2 .mkp-case-facts__grid{grid-template-columns:1fr}
  .mkp-case-results-panel__intro h2{font-size:1.7rem}
  .mkp-case-single--v2 .mkp-case-kpis__grid{grid-template-columns:1fr}
}


@media(max-width:720px){
  .mkp-case-single__cover-badge{top:12px;right:12px}
}


/* 08-G.18.12.4 fine polish overrides */
.mkp-case-single--v2 .mkp-case-single__cover-shell{
  position:relative;
  padding-inline-end:78px;
}
.mkp-case-single--v2 .mkp-case-single__cover{
  overflow:hidden;
}
.mkp-case-single--v2 .mkp-case-single__cover img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
.mkp-case-single__cover-badge{
  top:26px;
  right:0;
  transform:translateX(22%);
  white-space:nowrap;
}

.mkp-case-single--v2 .mkp-case-facts{
  padding:54px 0 54px;
}
.mkp-case-single--v2 .mkp-case-facts::before{
  top:20px;
  bottom:20px;
}
.mkp-case-single--v2 .mkp-case-facts>.mkp-container{
  margin-top:0;
}
.mkp-case-single--v2 .mkp-case-facts__grid{
  max-width:1120px;
  margin:0 auto;
  align-items:stretch;
  padding:22px 22px 30px;
}
.mkp-case-single--v2 .mkp-case-facts__grid--count-3{
  grid-template-columns:1.25fr .85fr .85fr;
}
.mkp-case-single--v2 .mkp-case-fact{
  min-height:158px;
}
.mkp-case-fact__value.is-chips{
  width:100%;
}
.mkp-case-fact__chips{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:8px;
}
.mkp-case-fact__chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:31px;
  padding:0 10px;
  border:1px solid rgba(16,149,79,.16);
  border-radius:999px;
  background:var(--mkp-accent-soft);
  color:var(--mkp-text);
  font-size:.78rem;
  font-weight:700;
  line-height:1.5;
}

.mkp-case-services-board__head{
  padding:20px 22px;
}
.mkp-case-services-board__list{
  gap:10px;
  padding:14px;
}
.mkp-case-service-row{
  min-height:72px;
  align-items:center;
  padding:12px 16px;
}
.mkp-case-service-row h3{
  margin:0;
  font-size:.92rem;
  line-height:1.9;
}
.mkp-case-service-row p{
  margin-top:4px;
  font-size:.8rem;
}

.mkp-case-roadmap{
  overflow:visible;
  padding-top:38px;
}
.mkp-case-roadmap__rail{
  top:24px;
  right:calc((100% - 68px) / 6);
  left:calc((100% - 68px) / 6);
}
.mkp-case-roadmap__step{
  overflow:visible;
  padding-top:56px;
}
.mkp-case-roadmap__marker{
  top:-24px;
  width:48px;
  height:48px;
}
.mkp-case-roadmap__marker svg{
  width:20px;
  height:20px;
  stroke-width:2.1;
}

.mkp-case-seo-results__board{
  padding:18px;
  border:1px solid var(--mkp-border);
  border-radius:26px;
  background:linear-gradient(180deg,rgba(255,255,255,.018),rgba(255,255,255,.028));
  box-shadow:0 18px 45px rgba(8,31,38,.055);
}
.mkp-case-seo-results__visual-list{
  max-width:none;
}

@media(max-width:900px){
  .mkp-case-single--v2 .mkp-case-single__cover-shell{padding-inline-end:56px}
  .mkp-case-single--v2 .mkp-case-facts__grid--count-3{grid-template-columns:1fr}
  .mkp-case-single--v2 .mkp-case-fact{min-height:unset}
}
@media(max-width:720px){
  .mkp-case-single--v2 .mkp-case-single__cover-shell{padding-inline-end:0}
  .mkp-case-single__cover-badge{top:12px;right:12px;transform:none}
  .mkp-case-single--v2 .mkp-case-facts{padding:34px 0}
  .mkp-case-single--v2 .mkp-case-facts__grid{padding:16px}
  .mkp-case-roadmap{padding-top:20px}
  .mkp-case-roadmap__marker{top:14px}
  .mkp-case-seo-results__board{padding:12px}
}


/* 08-G.18.12.5 — quick navigation + roadmap/SEO compact polish */
.mkp-case-single--v2 [id^="mkp-project-"]{
  scroll-margin-top:110px;
}

.mkp-case-quick-nav{
  position:relative;
  z-index:5;
  padding:18px 0 8px;
  border-top:1px solid var(--mkp-border);
  background:var(--mkp-surface);
}
.mkp-case-quick-nav__track{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  overflow-x:auto;
  padding:4px 2px 8px;
  scrollbar-width:none;
}
.mkp-case-quick-nav__track::-webkit-scrollbar{display:none}
.mkp-case-quick-nav__track>a{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-height:40px;
  padding:0 13px;
  border:1px solid var(--mkp-border);
  border-radius:999px;
  background:var(--mkp-surface-soft);
  color:var(--mkp-text);
  font-size:.78rem;
  font-weight:800;
  text-decoration:none;
  transition:border-color .2s ease,background .2s ease,color .2s ease,transform .2s ease;
}
.mkp-case-quick-nav__track>a:hover,
.mkp-case-quick-nav__track>a:focus-visible{
  border-color:rgba(16,149,79,.34);
  background:var(--mkp-accent-soft);
  color:var(--mkp-accent-600);
  transform:translateY(-1px);
  outline:0;
}
.mkp-case-quick-nav__track>a svg{
  width:16px;
  height:16px;
  flex:0 0 auto;
}

/* Roadmap: cards + icon markers only; no connecting rail. */
.mkp-case-roadmap__rail{display:none!important}
.mkp-case-roadmap{
  padding-top:46px;
}
.mkp-case-roadmap__steps{
  padding-top:0;
}
.mkp-case-roadmap__step{
  padding-top:56px;
}
.mkp-case-roadmap__marker{
  top:-25px;
  width:50px;
  height:50px;
  color:#06382f!important;
  border-color:var(--mkp-surface)!important;
  background:#48d18c!important;
  box-shadow:0 12px 30px rgba(16,149,79,.22)!important;
}
.mkp-case-roadmap__marker svg{
  display:block!important;
  width:21px!important;
  height:21px!important;
  color:#06382f!important;
  stroke:#06382f!important;
  fill:none!important;
  opacity:1!important;
  visibility:visible!important;
  filter:none!important;
}

/* Keyword rows: delta + keyword/month + before/track/after in one line. */
.mkp-case-seo-result{
  grid-template-columns:92px minmax(210px,.85fr) minmax(300px,1.45fr)!important;
  grid-template-areas:"delta metric journey"!important;
  align-items:center!important;
  gap:14px!important;
  min-height:106px;
  padding:14px 16px!important;
}
.mkp-case-seo-result__metric{grid-area:metric!important}
.mkp-case-seo-result__journey{
  grid-area:journey!important;
  grid-template-columns:48px minmax(160px,1fr) 48px!important;
  gap:9px!important;
  align-self:center;
}
.mkp-case-seo-result__delta{
  grid-area:delta!important;
  min-height:72px!important;
}
.mkp-case-seo-result__metric strong{white-space:normal!important;line-height:1.6}
.mkp-case-seo-result__metric p{margin-top:3px!important}

@media(max-width:900px){
  .mkp-case-quick-nav__track{justify-content:flex-start}
  .mkp-case-seo-result{
    grid-template-columns:82px minmax(0,1fr)!important;
    grid-template-areas:"delta metric" "journey journey"!important;
    min-height:auto;
  }
  .mkp-case-seo-result__journey{
    grid-template-columns:48px minmax(110px,1fr) 48px!important;
  }
}
@media(max-width:720px){
  .mkp-case-quick-nav{padding-top:12px}
  .mkp-case-quick-nav__track>a{min-height:38px;padding:0 11px;font-size:.74rem}
  .mkp-case-roadmap{padding-top:22px}
  .mkp-case-roadmap__step{padding-top:58px}
  .mkp-case-roadmap__marker{top:14px;right:14px;transform:none}
  .mkp-case-seo-result{
    grid-template-columns:1fr!important;
    grid-template-areas:"metric" "journey" "delta"!important;
  }
  .mkp-case-seo-result__delta{
    grid-template-columns:auto auto;
    justify-content:center;
    min-height:auto!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .mkp-case-hero-v2__shape,
  .mkp-case-roadmap__rail span{animation:none!important}
  .mkp-case-gallery-slider__slide,
  .mkp-case-gallery-slider__thumb,
  .mkp-case-player__center-play{transition:none!important}
}

/* 08-G.18.12.6 — final portfolio polish + vertical media */
.mkp-case-quick-nav__hint{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  margin:0 0 12px;
  color:var(--mkp-muted);
  font-size:.82rem;
  font-weight:750;
  text-align:center;
}
.mkp-case-quick-nav__hint svg{width:16px;height:16px;color:var(--mkp-accent-600);flex:0 0 auto}

/* Facts: label becomes the compact badge; value stays plain and readable. */
.mkp-case-single--v2 .mkp-case-fact{
  justify-content:center;
  padding:20px 18px;
}
.mkp-case-fact__label{
  min-height:32px;
  padding:0 11px;
  border:1px solid rgba(16,149,79,.18);
  border-radius:999px;
  background:var(--mkp-accent-soft);
  color:var(--mkp-accent-600);
  font-size:.8rem;
  font-weight:900;
}
.mkp-case-fact__label svg{width:17px;height:17px}
.mkp-case-fact__value{
  margin-top:14px;
  color:var(--mkp-text);
  font-size:1rem;
  line-height:1.95;
}
.mkp-case-single--v2 .mkp-case-fact strong,
.mkp-case-single--v2 .mkp-case-fact a{
  font-size:1.05rem;
  line-height:1.9;
}
.mkp-case-fact__plain-list{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:6px 10px;
  max-width:100%;
  color:var(--mkp-text);
  font-size:.92rem;
  font-weight:700;
  line-height:1.9;
}
.mkp-case-fact__plain-list>span:not(:last-child)::after{
  content:"•";
  margin-inline-start:10px;
  color:var(--mkp-accent-600);
}

/* Consistent section rhythm. */
.mkp-case-single--v2 .mkp-case-services,
.mkp-case-single--v2 .mkp-case-story-map,
.mkp-case-single--v2 .mkp-case-kpis{padding:64px 0}
.mkp-case-single--v2 .mkp-case-single__content-wrap{padding:64px 0 156px}
.mkp-case-media-suite,
.mkp-case-single--v2 .mkp-case-gallery,
.mkp-case-single--v2 .mkp-case-before-after,
.mkp-case-single--v2 .mkp-case-testimonial,
.mkp-case-single--v2 .mkp-case-outcome,
.mkp-case-single--v2 .mkp-case-client,
.mkp-case-single--v2 .mkp-related-cases,
.mkp-case-single--v2 .mkp-case-seo-results{margin-top:64px}
.mkp-case-single--v2 .mkp-case-seo-results--final{margin-bottom:32px}

/* Vertical video player uses the same logic, but a 9:16 stage. */
.mkp-case-media-suite--vertical{max-width:900px}
.mkp-case-media-player--vertical{
  grid-template-columns:minmax(300px,390px) minmax(280px,1fr);
  min-height:620px;
}
.mkp-case-media-player--vertical .mkp-case-media-player__stage{
  min-height:620px;
  aspect-ratio:9/16;
}
.mkp-case-media-player--vertical .mkp-case-media-player__video-stage,
.mkp-case-media-player--vertical .mkp-case-media-player__embed-stage,
.mkp-case-media-player--vertical .mkp-case-media-player__link-stage{height:100%}
.mkp-case-media-player--vertical video,
.mkp-case-media-player--vertical iframe{width:100%;height:100%;object-fit:contain;background:#050f13}
.mkp-case-media-player--vertical .mkp-case-media-player__playlist-list{max-height:540px}

/* Gallery: fixed outer shell, adaptive inner image frame, dot navigation. */
.mkp-case-gallery-slider__stage{
  min-height:560px;
  aspect-ratio:auto;
  display:grid;
  place-items:center;
  padding:28px 70px 54px;
}
.mkp-case-gallery-slider__slide{
  display:grid;
  place-items:center;
  padding:0;
}
.mkp-case-gallery-slider__media-frame{
  display:flex;
  align-items:center;
  justify-content:center;
  max-width:92%;
  max-height:92%;
  padding:8px;
  border:1px solid var(--mkp-border);
  border-radius:20px;
  background:var(--mkp-surface);
  box-shadow:0 18px 44px rgba(5,22,28,.12);
}
.mkp-case-gallery-slider__media-frame img{
  display:block!important;
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  max-height:500px!important;
  object-fit:contain!important;
  border-radius:14px;
}
.mkp-case-gallery-slider__dots{
  display:flex;
  justify-content:center;
  gap:8px;
  padding:14px 16px 18px;
  overflow-x:auto;
}
.mkp-case-gallery-slider__dot{
  flex:0 0 9px!important;
  width:9px!important;
  height:9px!important;
  padding:0!important;
  border:0!important;
  border-radius:50%!important;
  background:var(--mkp-border)!important;
  opacity:1!important;
}
.mkp-case-gallery-slider__dot.is-active{
  width:24px!important;
  border-radius:999px!important;
  background:var(--mkp-accent-600)!important;
}

/* Keyword table-like header shown once, rows stay compact. */
.mkp-case-seo-results__columns{
  display:grid;
  grid-template-columns:92px minmax(210px,.85fr) minmax(300px,1.45fr);
  gap:14px;
  padding:0 16px 10px;
  direction:ltr;
  color:var(--mkp-muted);
  font-size:.72rem;
  font-weight:900;
}
.mkp-case-seo-results__columns span:nth-child(2){direction:rtl;text-align:right}
.mkp-case-seo-results__columns span:nth-child(3){text-align:center;direction:rtl}
.mkp-case-seo-result{
  direction:ltr!important;
  grid-template-columns:92px minmax(210px,.85fr) minmax(300px,1.45fr)!important;
  grid-template-areas:"delta metric journey"!important;
}
.mkp-case-seo-result__metric{direction:rtl;text-align:right}
.mkp-case-seo-result__journey{
  direction:rtl!important;
  grid-template-columns:48px minmax(160px,1fr) 48px!important;
}
.mkp-case-seo-result__delta{direction:rtl}

@media(max-width:900px){
  .mkp-case-media-player--vertical{grid-template-columns:1fr;max-width:500px;margin-inline:auto}
  .mkp-case-media-player--vertical .mkp-case-media-player__stage{min-height:auto;aspect-ratio:9/16}
  .mkp-case-seo-results__columns{display:none}
  .mkp-case-seo-result{
    direction:rtl!important;
    grid-template-columns:1fr!important;
    grid-template-areas:"metric" "journey" "delta"!important;
  }
}
@media(max-width:720px){
  .mkp-case-quick-nav__hint{justify-content:flex-start;text-align:right;font-size:.76rem}
  .mkp-case-single--v2 .mkp-case-fact{padding:18px 14px}
  .mkp-case-fact__value{font-size:.94rem}
  .mkp-case-gallery-slider__stage{min-height:420px;padding:20px 52px 42px}
  .mkp-case-gallery-slider__media-frame img{max-height:360px!important}
  .mkp-case-single--v2 .mkp-case-single__content-wrap{padding-bottom:120px}
}

/* 08-G.18.12.7 — keyword column order + gallery zoom */
.mkp-case-seo-results__columns{
  grid-template-columns:92px minmax(300px,1.45fr) minmax(210px,.85fr)!important;
  grid-template-areas:"delta journey metric";
  direction:ltr!important;
}
.mkp-case-seo-results__column--metric{grid-area:metric;text-align:right!important;direction:rtl!important}
.mkp-case-seo-results__column--journey{grid-area:journey;text-align:center!important;direction:rtl!important}
.mkp-case-seo-results__column--delta{grid-area:delta;text-align:center!important;direction:rtl!important}
.mkp-case-seo-result{
  grid-template-columns:92px minmax(300px,1.45fr) minmax(210px,.85fr)!important;
  grid-template-areas:"delta journey metric"!important;
  direction:ltr!important;
}
.mkp-case-seo-result__delta{grid-area:delta!important}
.mkp-case-seo-result__journey{grid-area:journey!important}
.mkp-case-seo-result__metric{grid-area:metric!important}

.mkp-case-gallery-slider__zoom-trigger{
  position:relative;
  display:grid;
  place-items:center;
  width:100%;
  height:100%;
  padding:0;
  border:0;
  background:transparent;
  color:inherit;
  cursor:zoom-in;
}
.mkp-case-gallery-slider__zoom-trigger:focus-visible{
  outline:2px solid var(--mkp-accent-600);
  outline-offset:-4px;
  border-radius:18px;
}
.mkp-case-gallery-slider__zoom-hint{
  position:absolute;
  left:18px;
  top:18px;
  z-index:3;
  display:grid;
  place-items:center;
  width:40px;
  height:40px;
  border:1px solid rgba(255,255,255,.2);
  border-radius:13px;
  background:rgba(7,29,36,.72);
  color:#fff;
  backdrop-filter:blur(10px);
  pointer-events:none;
  opacity:.86;
  transition:opacity .2s ease,transform .2s ease;
}
.mkp-case-gallery-slider__zoom-hint svg{width:19px;height:19px}
.mkp-case-gallery-slider__zoom-trigger:hover .mkp-case-gallery-slider__zoom-hint{opacity:1;transform:scale(1.06)}

.mkp-case-lightbox{
  position:fixed;
  inset:0;
  z-index:999999;
  display:none;
  align-items:center;
  justify-content:center;
  padding:28px;
  background:rgba(3,13,17,.92);
  backdrop-filter:blur(10px);
}
.mkp-case-lightbox.is-open{display:flex}
.mkp-case-lightbox__viewport{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  width:min(94vw,1500px);
  height:min(88vh,1000px);
  overflow:hidden;
  border:1px solid rgba(255,255,255,.13);
  border-radius:22px;
  background:rgba(8,31,38,.86);
  cursor:grab;
}
.mkp-case-lightbox__viewport.is-dragging{cursor:grabbing}
.mkp-case-lightbox__image{
  display:block;
  max-width:92%;
  max-height:92%;
  width:auto;
  height:auto;
  object-fit:contain;
  user-select:none;
  -webkit-user-drag:none;
  transform:translate3d(0,0,0) scale(1);
  transform-origin:center;
  transition:transform .16s ease;
}
.mkp-case-lightbox__viewport.is-dragging .mkp-case-lightbox__image{transition:none}
.mkp-case-lightbox__controls{
  position:absolute;
  top:18px;
  left:50%;
  z-index:4;
  display:flex;
  align-items:center;
  gap:8px;
  transform:translateX(-50%);
  padding:7px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:999px;
  background:rgba(7,29,36,.82);
  backdrop-filter:blur(10px);
}
.mkp-case-lightbox__button{
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  padding:0;
  border:1px solid rgba(255,255,255,.13);
  border-radius:50%;
  background:rgba(255,255,255,.05);
  color:#fff;
  font:inherit;
  font-size:1.15rem;
  cursor:pointer;
}
.mkp-case-lightbox__button:hover,.mkp-case-lightbox__button:focus-visible{background:rgba(16,149,79,.24);border-color:rgba(73,209,138,.5)}
.mkp-case-lightbox__close{position:absolute;top:18px;right:18px;z-index:5}
body.mkp-lightbox-open{overflow:hidden}

@media(max-width:900px){
  .mkp-case-seo-results__columns{display:none!important}
  .mkp-case-seo-result{
    direction:rtl!important;
    grid-template-columns:1fr!important;
    grid-template-areas:"metric" "journey" "delta"!important;
  }
}
@media(max-width:720px){
  .mkp-case-lightbox{padding:12px}
  .mkp-case-lightbox__viewport{width:100%;height:86vh;border-radius:18px}
  .mkp-case-lightbox__controls{top:auto;bottom:16px}
  .mkp-case-lightbox__close{top:12px;right:12px}
  .mkp-case-gallery-slider__zoom-hint{left:12px;top:12px;width:36px;height:36px}
}

/* 08-G.18.12.8 — status, Dashicons, Persian numerals, compact vertical media, spacing polish */
.mkp-case-single--v2 .dashicons,
.mkp-case-quick-nav .dashicons{
  font-family:dashicons!important;
  font-style:normal!important;
  font-weight:400!important;
  line-height:1!important;
  speak:never;
}
.mkp-case-single__cover-badge .dashicons{width:17px;height:17px;font-size:17px}
.mkp-case-quick-nav__hint .dashicons{width:17px;height:17px;font-size:17px;color:var(--mkp-accent-600);flex:0 0 auto}
.mkp-case-quick-nav__track>a .dashicons{width:17px;height:17px;font-size:17px;flex:0 0 auto}
.mkp-case-fact__label .dashicons{width:17px;height:17px;font-size:17px;color:var(--mkp-accent-600)}
.mkp-case-roadmap__marker .dashicons{
  width:22px!important;
  height:22px!important;
  font-size:22px!important;
  color:#fff!important;
  line-height:1!important;
}
.mkp-case-gallery-slider__zoom-hint.dashicons{
  display:grid;
  place-items:center;
  font-family:dashicons!important;
  font-size:20px!important;
  line-height:1!important;
}

.mkp-case-hero-v2__status.is-ongoing{
  border-color:rgba(222,170,45,.32);
  background:rgba(222,170,45,.09);
  color:#d9ad42;
}
.mkp-case-hero-v2__status.is-ongoing i{
  background:#e0ad34;
  box-shadow:0 0 0 5px rgba(224,173,52,.13);
}

/* Project story summary becomes a compact centered completion badge. */
.mkp-case-roadmap__summary{
  justify-content:center!important;
  gap:16px!important;
  max-width:380px;
  margin:16px auto 0!important;
  padding-top:14px!important;
}
.mkp-case-roadmap__summary span{font-size:.82rem}
.mkp-case-roadmap__summary strong{font-size:1.22rem}

/* Vertical media: reduce the unused playlist width and bring title/list closer to the reel. */
.mkp-case-media-suite--vertical{
  width:100%;
  max-width:760px!important;
  margin-inline:auto;
}
.mkp-case-media-player--vertical{
  grid-template-columns:minmax(300px,350px) minmax(260px,1fr)!important;
  min-height:560px!important;
}
.mkp-case-media-player--vertical .mkp-case-media-player__stage{
  min-height:560px!important;
}
.mkp-case-media-player--vertical .mkp-case-media-player__playlist-list{max-height:470px!important}
.mkp-case-media-player--vertical .mkp-case-media-player__playlist-head{padding-inline:16px}
.mkp-case-media-player--vertical .mkp-case-media-player__playlist-item{padding-inline:14px}

/* Keyword board: exact shared grid, tighter vertical rhythm, balanced gutters. */
.mkp-case-seo-results__board{
  padding:14px 16px 16px!important;
}
.mkp-case-seo-results__columns{
  grid-template-columns:92px minmax(300px,1.45fr) minmax(210px,.85fr)!important;
  gap:18px!important;
  padding:0 14px 9px!important;
}
.mkp-case-seo-results__visual-list{gap:10px!important}
.mkp-case-seo-result{
  grid-template-columns:92px minmax(300px,1.45fr) minmax(210px,.85fr)!important;
  gap:18px!important;
  min-height:94px!important;
  padding:12px 14px!important;
}
.mkp-case-seo-result__delta{min-height:64px!important}
.mkp-case-seo-result__metric{align-items:center!important}
.mkp-case-seo-result__journey{align-self:center!important}

@media(max-width:900px){
  .mkp-case-media-suite--vertical{max-width:500px!important}
  .mkp-case-media-player--vertical{grid-template-columns:1fr!important;min-height:auto!important}
  .mkp-case-media-player--vertical .mkp-case-media-player__stage{min-height:auto!important}
  .mkp-case-seo-result{grid-template-columns:1fr!important;gap:12px!important}
}
@media(max-width:720px){
  .mkp-case-roadmap__summary{max-width:100%;gap:10px!important}
}

/* ==========================================================
   Phase 08-G.18.13.0 — Mobile Portfolio Alignment & Navigation
   Scope: mkp_case_study only
   ========================================================== */

/* Summary now has a real section heading on desktop and mobile. */
.mkp-case-section-title--summary{
  margin-bottom:22px!important;
}

/* Keep delta math visually stable in RTL: +۶۱, never ۶۱+. */
.mkp-case-seo-result__delta strong[dir="ltr"]{
  direction:ltr!important;
  unicode-bidi:isolate!important;
  display:inline-block;
}

@media(max-width:720px){
  /* Hero: image first, then centered case title / kicker / status. */
  .mkp-case-hero-v2{
    padding-top:34px;
  }
  .mkp-case-single--v2 .mkp-case-single__hero-grid{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:28px!important;
  }
  .mkp-case-single--v2 .mkp-case-single__cover-shell{
    order:1!important;
    width:100%;
    max-width:560px;
    margin:0 auto;
  }
  .mkp-case-single--v2 .mkp-case-single__intro{
    order:2!important;
    display:flex;
    flex-direction:column;
    align-items:center!important;
    text-align:center!important;
  }
  .mkp-case-single--v2 .mkp-case-single__intro .mkp-v2-kicker,
  .mkp-case-single--v2 .mkp-case-single__intro h1,
  .mkp-case-single--v2 .mkp-case-single__lead{
    width:100%;
    text-align:center!important;
  }
  .mkp-case-single--v2 .mkp-case-single__categories{
    justify-content:center!important;
    margin-inline:auto!important;
  }
  .mkp-case-hero-v2__actions{
    width:100%;
    align-items:center!important;
    justify-content:center!important;
    flex-direction:column!important;
  }
  .mkp-case-hero-v2__status{
    margin-inline:auto!important;
    text-align:center!important;
  }

  /* Every portfolio section title remains centered on phones. */
  .mkp-case-single--v2 .mkp-case-section-title,
  .mkp-case-single--v2 .mkp-case-section-title>span,
  .mkp-case-single--v2 .mkp-case-section-title h2{
    width:100%;
    text-align:center!important;
  }

  /* Quick navigation: all links visible at once in exactly two rows when 8 links exist. */
  .mkp-case-quick-nav{
    padding:16px 0 14px!important;
  }
  .mkp-case-quick-nav__hint{
    justify-content:center!important;
    text-align:center!important;
    margin-inline:auto!important;
    max-width:330px;
    font-size:.76rem!important;
    line-height:1.8;
  }
  .mkp-case-quick-nav__track{
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    align-items:stretch!important;
    justify-content:stretch!important;
    gap:7px!important;
    overflow:visible!important;
    padding:4px 0 8px!important;
  }
  .mkp-case-quick-nav__track>a{
    width:100%;
    min-width:0!important;
    min-height:54px!important;
    padding:7px 5px!important;
    flex-direction:column;
    gap:4px!important;
    border-radius:14px!important;
    font-size:.66rem!important;
    line-height:1.45;
    white-space:normal;
    text-align:center;
  }
  .mkp-case-quick-nav__track>a .dashicons{
    margin:0!important;
  }

  /* Project summary cards start after a centered title. */
  .mkp-case-section-title--summary{
    margin-bottom:18px!important;
  }

  /* Roadmap mobile: one centered card per step, marker centered above each card. */
  .mkp-case-story-map .mkp-case-roadmap{
    overflow:visible!important;
    padding:28px 14px 18px!important;
  }
  .mkp-case-story-map .mkp-case-roadmap__steps{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:46px!important;
    padding-top:12px!important;
  }
  .mkp-case-story-map .mkp-case-roadmap__step{
    position:relative;
    min-height:0!important;
    padding:48px 18px 20px!important;
    text-align:center!important;
  }
  .mkp-case-story-map .mkp-case-roadmap__marker{
    top:-25px!important;
    right:50%!important;
    left:auto!important;
    transform:translateX(50%)!important;
    width:50px!important;
    height:50px!important;
  }
  .mkp-case-story-map .mkp-case-roadmap__step small,
  .mkp-case-story-map .mkp-case-roadmap__step h3,
  .mkp-case-story-map .mkp-case-roadmap__step p{
    text-align:center!important;
  }
  .mkp-case-story-map .mkp-case-roadmap__summary{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    flex-wrap:wrap;
    gap:8px 12px!important;
    max-width:280px!important;
    margin:18px auto 0!important;
    text-align:center!important;
  }
  .mkp-case-story-map .mkp-case-roadmap__summary span{
    justify-content:center!important;
    text-align:center!important;
  }

  /* Vertical videos: names / playlist first, the selected reel directly underneath. */
  .mkp-case-media-suite--vertical .mkp-case-media-player--vertical{
    display:flex!important;
    flex-direction:column!important;
    max-width:500px!important;
    margin-inline:auto!important;
  }
  .mkp-case-media-suite--vertical .mkp-case-media-player__playlist{
    order:1!important;
    width:100%!important;
    border-top:0!important;
    border-bottom:1px solid rgba(255,255,255,.11)!important;
  }
  .mkp-case-media-suite--vertical .mkp-case-media-player__stage{
    order:2!important;
    width:100%!important;
    min-height:auto!important;
    aspect-ratio:9/16!important;
  }

  /* Keyword section: centered intro + visible legend + centered stacked rows. */
  .mkp-case-seo-results__intro{
    align-items:center!important;
    justify-content:center!important;
    text-align:center!important;
  }
  .mkp-case-seo-results__intro p{
    margin-inline:auto!important;
    text-align:center!important;
  }
  .mkp-case-seo-results__intro>span{
    margin-inline:auto!important;
  }
  .mkp-case-seo-results__columns{
    display:grid!important;
    grid-template-columns:1fr!important;
    grid-template-areas:"metric" "journey" "delta"!important;
    gap:6px!important;
    padding:0 0 12px!important;
    direction:rtl!important;
  }
  .mkp-case-seo-results__columns>span{
    width:100%;
    min-height:32px;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:6px 10px;
    border:1px solid var(--mkp-border);
    border-radius:10px;
    background:var(--mkp-surface-soft);
    text-align:center!important;
    line-height:1.55;
  }
  .mkp-case-seo-results__column--metric{grid-area:metric!important}
  .mkp-case-seo-results__column--journey{grid-area:journey!important}
  .mkp-case-seo-results__column--delta{grid-area:delta!important}
  .mkp-case-seo-result{
    direction:rtl!important;
    grid-template-columns:1fr!important;
    grid-template-areas:"metric" "journey" "delta"!important;
    justify-items:center!important;
    text-align:center!important;
    gap:12px!important;
  }
  .mkp-case-seo-result__metric{
    width:100%;
    justify-content:center!important;
    text-align:center!important;
  }
  .mkp-case-seo-result__metric>div{
    text-align:center!important;
  }
  .mkp-case-seo-result__journey{
    width:min(100%,340px)!important;
    margin-inline:auto!important;
    grid-template-columns:48px minmax(110px,1fr) 48px!important;
  }
  .mkp-case-seo-result__delta{
    width:auto!important;
    min-width:110px;
    margin-inline:auto!important;
    justify-content:center!important;
    text-align:center!important;
  }
  .mkp-case-seo-result__delta strong,
  .mkp-case-seo-result__delta span{
    text-align:center!important;
  }
}

@media(max-width:390px){
  .mkp-case-quick-nav__track>a{
    font-size:.62rem!important;
    padding-inline:3px!important;
  }
}