/* CodeGenius Premium - theme-neutral components (v0.1.0) */
.cgpe-motion,.cgpe-hotspots,.cgpe-compare,.cgpe-compare-static,.cgpe-hotspots-static{
  position:relative;display:block;overflow:hidden;isolation:isolate;width:100%;margin:1.5rem 0;
  background:var(--cgpe-primary,#202625);color:#fff;
}
.cgpe-motion{aspect-ratio:16/9;min-height:240px}
.cgpe-motion-poster,.cgpe-hotspots-img,.cgpe-compare-img,
.cgpe-hotspots-static>img,.cgpe-compare-static>img{
  display:block;width:100%;height:100%;object-fit:cover;
}
.cgpe-motion-poster{position:absolute;inset:0}
.cgpe-motion-layers{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.cgpe-motion-layer{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;transition:opacity 1s ease-in-out;transform:scale(1);
  animation:cgpe-drift-a 10s ease-in-out 1 both;animation-play-state:paused;
}
.cgpe-motion-layer.is-reverse{animation-name:cgpe-drift-b}
.cgpe-motion-layer.is-active{opacity:1}
.cgpe-motion.cgpe-is-playing .cgpe-motion-layer.is-active{animation-play-state:running}
@keyframes cgpe-drift-a{
  0%{transform:scale(1.0) translate3d(0,0,0)}
  100%{transform:scale(1.13) translate3d(1.5%,-.4%,0)}
}
@keyframes cgpe-drift-b{
  0%{transform:scale(1.04) translate3d(1.2%,.3%,0)}
  100%{transform:scale(1.14) translate3d(-1.5%,-.3%,0)}
}
.cgpe-motion-toggle{position:absolute;right:clamp(14px,3vw,38px);bottom:clamp(14px,3vw,38px);
  z-index:3;display:inline-flex;align-items:center;gap:10px;padding:11px 16px;min-height:44px;
  border-radius:100px;border:1px solid rgba(255,255,255,.8);background:rgba(20,25,24,.55);
  color:#fff;font:600 11px/1.35 system-ui,sans-serif;letter-spacing:.03em;cursor:pointer;
}
.cgpe-motion-toggle:hover{background:rgba(20,25,24,.8)}
.cgpe-motion-toggle:focus-visible,.cgpe-hotspot-trigger:focus-visible,.cgpe-compare input:focus-visible{
  outline:3px solid var(--cgpe-accent,#a28e73);outline-offset:4px;
}
.cgpe-motion-toggle[hidden]{display:none!important}
/* Showcase grid */
.cgpe-showcase{display:grid;grid-template-columns:repeat(var(--cgpe-columns,3),minmax(0,1fr));gap:clamp(18px,3vw,45px);margin:2rem 0}
.cgpe-case-card{min-width:0}
.cgpe-case-card a{color:inherit;text-decoration:none;display:block}
.cgpe-case-image{overflow:hidden;aspect-ratio:4/5;background:#e0ddd7}
.cgpe-case-thumb{width:100%;height:100%;object-fit:cover;transition:transform .65s ease}
.cgpe-case-card:hover .cgpe-case-thumb{transform:scale(1.045)}
.cgpe-case-placeholder{display:block;width:100%;height:100%;background:#e6e3dc}
.cgpe-case-caption{display:flex;justify-content:space-between;gap:12px;align-items:baseline;margin-top:15px}
.cgpe-case-caption h3{font:500 clamp(23px,2.6vw,40px)/1.15 var(--cgpe-heading-font,Georgia,serif);letter-spacing:-.035em;margin:0}
.cgpe-case-caption span{font:18px system-ui,sans-serif;color:var(--cgpe-accent,#a28e73)}
.cgpe-case-card small{display:block;margin:10px 0;color:#7b807d;letter-spacing:.07em;text-transform:uppercase;font-size:11px}
.cgpe-case-card p{font-size:15px;line-height:1.7;margin:12px 0 0}
/* Before/after - all shapes remain keyboard accessible */
.cgpe-compare{aspect-ratio:16/9;min-height:220px;--cgpe-split:50%;}
.cgpe-compare-before,.cgpe-compare-after{position:absolute;inset:0}
.cgpe-compare-after{clip-path:inset(0 0 0 var(--cgpe-split));}
.cgpe-compare-before>span,.cgpe-compare-after>span{position:absolute;bottom:16px;padding:7px 12px;
  background:rgba(0,0,0,.65);border-radius:4px;font:600 12px system-ui,sans-serif}
.cgpe-compare-before>span{left:16px}.cgpe-compare-after>span{right:16px}
.cgpe-compare-line{position:absolute;z-index:2;left:var(--cgpe-split);top:0;bottom:0;width:2px;background:#fff;transform:translateX(-50%);pointer-events:none}
.cgpe-compare-line:after{content:'\2194';display:grid;place-items:center;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:46px;height:46px;background:var(--cgpe-primary,#202625);color:white;border:2px solid white;border-radius:50%;font-size:20px}
.cgpe-compare input[type=range]{position:absolute;z-index:3;inset:0;display:block;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize}
.cgpe-compare-static{aspect-ratio:16/9}.cgpe-compare-static figcaption{padding:8px;font-size:12px}
/* Focusable image hotspots */
.cgpe-hotspots{aspect-ratio:16/9;min-height:220px;overflow:visible}
.cgpe-hotspots-media{position:absolute;inset:0;overflow:hidden}
.cgpe-hotspot{position:absolute;z-index:5;transform:translate(-50%,-50%);color:#fff}
.cgpe-hotspot-trigger{display:block;border:0;padding:0;background:transparent;color:inherit;cursor:pointer}
.cgpe-hotspot-dot{display:grid;place-items:center;width:42px;height:42px;border:1px solid #fff;border-radius:50%;background:rgba(25,33,31,.72);box-shadow:0 2px 12px #0004;font-size:25px;transition:transform .2s}
.cgpe-hotspot-trigger[aria-expanded=true] .cgpe-hotspot-dot,.cgpe-hotspot-trigger:hover .cgpe-hotspot-dot{transform:scale(1.12)}
.cgpe-hotspot-detail{display:none;position:absolute;z-index:6;top:55px;left:50%;transform:translateX(-50%);padding:14px;
  background:#fff;color:var(--cgpe-text,#202625);border-radius:var(--cgpe-radius,8px);box-shadow:0 4px 28px #0003;
  width:min(240px,70vw);text-align:left;font:14px/1.5 system-ui,sans-serif}
.cgpe-hotspot-detail>*{display:block}
.cgpe-hotspot-detail strong{font-weight:700;margin-bottom:5px}
.cgpe-hotspot-link{margin-top:7px;font-size:11px;color:#666}
.cgpe-hotspot-trigger[aria-expanded=true]+.cgpe-hotspot-detail,.cgpe-hotspot:focus-within .cgpe-hotspot-detail{display:block}
.cgpe-hotspot-right .cgpe-hotspot-detail{left:auto;right:-15px;transform:none}
.cgpe-hotspot-left .cgpe-hotspot-detail{left:-15px;transform:none}
.cgpe-hotspot-bottom .cgpe-hotspot-detail{top:auto;bottom:55px}
.cgpe-hotspot-detail a{display:inline-block;margin-top:9px;color:var(--cgpe-primary,#202625);text-decoration:underline}
.cgpe-hotspots-static{aspect-ratio:16/9}
@media(max-width:900px){.cgpe-showcase{grid-template-columns:repeat(min(2,var(--cgpe-columns,3)),minmax(0,1fr))}}
@media(max-width:580px){
  .cgpe-showcase{grid-template-columns:1fr}
  .cgpe-motion,.cgpe-compare,.cgpe-hotspots{aspect-ratio:4/5;min-height:340px}
  .cgpe-motion-toggle{min-height:44px;font-size:10px}
  .cgpe-hotspot-dot{width:44px;height:44px}
}
@media(prefers-reduced-motion:reduce){
  .cgpe-motion-layer{display:none!important;animation:none!important}
  .cgpe-motion-toggle{display:none!important}
  .cgpe-case-thumb{transition:none!important}
}
/* Neutral fallback case layout when a theme has no custom single-cgpe_case.php */
.cgpe-single-page{max-width:min(1550px,100%);margin:0 auto;padding:clamp(160px,16vw,240px) clamp(20px,5vw,90px) 100px;color:var(--cgpe-text,#202625)}
.cgpe-single-heading{margin-bottom:65px}.cgpe-single-heading h1{font:400 clamp(58px,9vw,135px)/1 var(--cgpe-heading-font,Georgia,serif);letter-spacing:-.06em;margin:40px 0}
.cgpe-eyebrow{font:700 11px/1.4 system-ui,sans-serif;letter-spacing:.15em;text-transform:uppercase}
.cgpe-case-context{display:flex;gap:35px;font-size:13px;text-transform:uppercase;letter-spacing:.12em}
.cgpe-single-cover,.cgpe-single-cover img{width:100%;margin:0}.cgpe-single-cover img{max-height:85vh;object-fit:cover}
.cgpe-single-content{max-width:850px;margin:90px auto;font:18px/1.85 var(--cgpe-body-font,system-ui,sans-serif)}
.cgpe-single-content p{margin-bottom:1.6em}.cgpe-single-media{margin:100px 0}.cgpe-single-media h2{font:400 clamp(35px,5vw,70px)/1.2 var(--cgpe-heading-font,Georgia,serif)}
.cgpe-single-gallery{display:grid;grid-template-columns:1fr 1fr;gap:25px;margin:90px 0}.cgpe-single-gallery figure{margin:0}
.cgpe-single-gallery img{display:block;width:100%;height:100%;min-height:240px;max-height:650px;object-fit:cover}
.cgpe-single-end{padding-top:45px;border-top:1px solid #ddd;font-size:14px}.cgpe-single-end a{color:inherit;text-decoration:underline}
@media(max-width:650px){.cgpe-single-page{padding-top:150px}.cgpe-single-gallery{grid-template-columns:1fr}.cgpe-single-content{margin:55px auto}}