:root { --navy:#06244c; --deep:#031832; --teal:#05acbc; --cream:#f5f3ec; }
    .modeling-photo { position:relative; }
    .modeling-caption { position:absolute; bottom:12px; left:12px; padding:7px 11px; background:rgba(3,24,50,.86); color:#fff; font-size:12px; letter-spacing:.05em; pointer-events:none; }
    html { scroll-behavior:smooth; scroll-padding-top:110px; }
    body { width:100%; margin:0; font-family:"DM Sans",sans-serif; background:var(--navy); color:var(--cream); }
    .display { font-family:"Fraunces",serif; }
    .hero-glow { background:radial-gradient(circle at 72% 32%,rgba(5,172,188,.18),transparent 43%); }
    .photo-frame { box-shadow:24px 24px 0 rgba(5,172,188,.18); }
    .viz-card { box-shadow:0 16px 42px rgba(3,24,50,.09); transition:transform .25s,box-shadow .25s; }
    .viz-card:hover { transform:translateY(-4px); box-shadow:0 22px 48px rgba(3,24,50,.14); }
    body { line-height:1.55; }
    .scroll-reveal { opacity:0; transform:translateY(24px); transition:opacity .7s ease,transform .7s ease; }
    .scroll-reveal.is-visible { opacity:1; transform:translateY(0); }
    .scroll-reveal:nth-child(2) { transition-delay:.08s; }
    .scroll-reveal:nth-child(3) { transition-delay:.16s; }
    @media(prefers-reduced-motion:reduce) { .scroll-reveal { opacity:1; transform:none; transition:none; } }
    .retouch-card { box-shadow:0 18px 45px rgba(3,24,50,.09); }
    .comparison-media { display:block; position:relative; overflow:hidden; background:#dce5e5; }
    .comparison-media img { display:block; width:100%; aspect-ratio:549/306; object-fit:cover; }
    .product-comparison .comparison-media img { aspect-ratio:1/1; }
    .retouch-card .comparison-media img { aspect-ratio:549/382; }
    
    .comparison-media .before-image { display:none; }
    .comparison-hint { position:absolute; bottom:12px; left:12px; padding:7px 11px; background:rgba(3,24,50,.86); color:#fff; font-size:12px; letter-spacing:.05em; pointer-events:none; }
    #comparison-dialog[hidden] { display:none; }
    #comparison-dialog, #video-dialog { position:fixed; inset:0; z-index:60; display:grid; place-items:center; padding:18px; background:rgba(3,24,50,.88); }
    #video-dialog[hidden] { display:none; }
    .dialog-panel { width:min(1100px,100%); max-height:calc(90 * min(var(--vh, 1vh), 1vh)); overflow:auto; }
    .dialog-images .comparison-media { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; background:transparent; overflow:visible; }
    .dialog-images .comparison-media img, .dialog-images .comparison-media .before-image { display:block; width:100%; height:auto; aspect-ratio:549/306; object-fit:cover; border-radius:3px; }
    .dialog-images .comparison-media.vertical img, .dialog-images .comparison-media.vertical .before-image { aspect-ratio:3/4; }
    .dialog-images .comparison-media .before-image { position:static; order:-1; }
    .dialog-images .comparison-hint { display:none; }
    :is(a,button):focus-visible { outline:3px solid var(--teal); outline-offset:4px; }
    @media(max-width:640px) {
      .dialog-images .comparison-media { grid-template-columns:1fr; }
      .dialog-images .comparison-media img, .dialog-images .comparison-media .before-image { aspect-ratio:549/306; }
      .dialog-images .comparison-media.vertical img, .dialog-images .comparison-media.vertical .before-image { aspect-ratio:3/4; }
      html { scroll-padding-top:86px; }
    }
    @media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .viz-card { transition:none; } }