/* Campus case uses the PDRM case shell; these are its visual accents plus the
   full-bleed comparison and responsive delivery layouts. */
.web-case .web-case-hero{background:linear-gradient(135deg,#f8fbff 0%,#eef5ff 52%,#f5f1ff 100%)}
.web-case .pdrm-case-intro h2{font-size:clamp(44px,4vw,60px);letter-spacing:-1.8px}
.web-case .pdrm-case-intro h2 em{white-space:normal}
.web-case .pdrm-case-intro h2 em{color:#6e63e8}
.web-case .pdrm-case-hero-grid{width:100%}
.web-case .pdrm-case-kicker,.web-case .pdrm-case-index{color:#6f78a0}
.web-case .pdrm-case-meta span{border-color:#c9c8ee;color:#5f609c}
.web-card-art{position:relative;background:#e8f1ff!important;overflow:hidden;isolation:isolate}
.web-card-art .web-card-image{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover;object-position:center;transition:opacity .42s ease,transform .6s ease}
.web-card-art .web-card-image-default{opacity:1;transform:scale(1)}
.web-card-art .web-card-image-hover{opacity:0;transform:scale(1.02)}
.project:hover .web-card-art .web-card-image-default,.project:focus-visible .web-card-art .web-card-image-default{opacity:0;transform:scale(1.02)}
.project:hover .web-card-art .web-card-image-hover,.project:focus-visible .web-card-art .web-card-image-hover{opacity:1;transform:scale(1)}
@media(prefers-reduced-motion:reduce){.web-card-art .web-card-image{transition:none}}
.web-case .pdrm-hero-visual.web-hero-visual{width:100%;display:flex;align-items:center;justify-content:center;margin:0!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;transform:none!important;overflow:visible}
.web-hero-visual img{display:block;width:100%!important;height:auto!important;max-height:none!important;object-fit:contain;object-position:center;border-radius:18px;box-shadow:0 18px 38px #4b4d8c22}
.web-approach-section{background:#fff}
.web-decision-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:22px}
.web-decision-grid .pdrm-rule-card{min-height:0;padding:18px}
.web-compare-grid figure{padding:0 0 20px;background:#eef3fb;border-color:#dce5f3;overflow:hidden}
.web-compare-grid .pdrm-mode-image{height:430px;margin:0;background:#e7edf7;border-radius:20px 20px 0 0;overflow:hidden}
.web-compare-grid .pdrm-mode-image img{width:100%;height:100%;object-fit:cover;object-position:top center;border-radius:0;box-shadow:none}
.web-compare-card.is-original{background:#f2eee9!important;border-color:#e4d9cf!important}
.web-compare-card.is-final{background:#eeefff!important;border-color:#d9d8f4!important}
.web-compare-card.is-original .pdrm-mode-image{background:#eee8e3}
.web-compare-card.is-final .pdrm-mode-image{background:#e5e7f6}
.web-compare-grid figcaption{min-height:88px;margin-top:15px;padding:0 18px}
.web-compare-grid figcaption::before{display:none}
.web-case .web-compare-grid figure:first-child figcaption strong{color:#263f5c!important}
.web-case .web-compare-grid figure:first-child figcaption span{color:#607792!important}
.web-compare-card.is-final figcaption strong{color:#4f50a5!important}
.web-compare-card.is-final figcaption span{color:#6876a4!important}
.web-delivery-section{background:#f2f7fd}
.web-rwd-strip{display:grid;grid-template-columns:1.35fr 1fr .72fr;gap:14px;align-items:end;margin:26px 0 24px}
.web-rwd-strip figure{margin:0;min-width:0}
.web-rwd-frame{height:300px;padding:12px;border:1px solid #d7e4f2;border-radius:18px;background:#eaf1fa;overflow:hidden;box-shadow:0 10px 24px #274f7620}
.web-rwd-frame img{display:block;width:100%;height:100%;object-fit:cover;object-position:top center;border-radius:10px}
.web-rwd-frame.is-desktop{outline:none}
.web-rwd-frame.is-desktop:focus-visible{outline:2px solid #5b8fe6;outline-offset:4px}
.web-rwd-frame.is-desktop .web-rwd-page{height:auto;min-height:100%;overflow:visible;will-change:transform}
.web-rwd-frame.is-desktop .web-rwd-page img{width:100%;height:auto;object-fit:initial;object-position:top center}
.web-rwd-frame.is-tablet{height:260px}
.web-rwd-frame.is-mobile{height:230px}
.web-rwd-strip figcaption{display:flex;flex-direction:column;gap:3px;margin:10px 2px 0}
.web-rwd-strip figcaption strong{font-size:14px;line-height:1.2;color:#23415f}
.web-rwd-strip figcaption span{font-size:11px;line-height:1.35;color:#6b8098}
.web-delivery-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.web-delivery-grid .pdrm-rule-card{min-height:0;padding:18px}
.web-case-close{background:#fbfdff}
@media(max-width:760px){
  .web-hero-visual img{width:100%!important;height:auto!important}
  .web-compare-grid .pdrm-mode-image{height:390px}
  .web-rwd-strip{grid-template-columns:1fr 1fr;gap:12px}
  .web-rwd-strip figure:first-child{grid-column:1/-1}
  .web-rwd-frame.is-desktop{height:260px}
  .web-rwd-frame.is-tablet,.web-rwd-frame.is-mobile{height:210px}
  .web-decision-grid{grid-template-columns:1fr 1fr}
  .web-delivery-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:430px){
  .web-compare-grid .pdrm-mode-image{height:360px}
  .web-rwd-strip{grid-template-columns:1fr}
  .web-rwd-frame.is-desktop,.web-rwd-frame.is-tablet,.web-rwd-frame.is-mobile{height:230px}
  .web-decision-grid{grid-template-columns:1fr}
  .web-delivery-grid{grid-template-columns:1fr}
}

/* Timed desktop → tablet → mobile walkthrough. */
.web-rwd-screen{height:100%;overflow:hidden;border-radius:10px}
.web-rwd-strip .web-rwd-frame .web-rwd-page{height:auto;min-height:100%;will-change:transform}
.web-rwd-strip .web-rwd-frame .web-rwd-page img{display:block;width:100%;height:auto;border-radius:0;object-fit:contain}
.web-rwd-strip figure:is(:hover,:focus-within) .web-rwd-frame .web-rwd-page{animation:none}
.web-rwd-strip .web-rwd-frame{transition:border-color .3s,box-shadow .3s}
.web-rwd-strip .is-preview-active .web-rwd-frame{border-color:#729acb;box-shadow:0 8px 22px #456d9b20}
.web-rwd-strip figcaption{position:relative;padding-bottom:9px}
.web-rwd-strip figcaption::after{content:'';position:absolute;left:0;bottom:0;width:var(--preview-progress,0%);height:2px;background:#557eb3}
.web-preview-controls{display:flex;justify-content:flex-end;margin:-6px 0 28px}
.web-preview-toggle{font:inherit;font-size:12px;letter-spacing:.025em;line-height:1.5;color:#405f82;background:transparent;border:1px solid #c6d7e9;border-radius:24px;padding:9px 16px;min-height:40px}
.web-preview-toggle:is(:hover,:focus-visible){background:#e7effa}