.placeholder-project-page .placeholder-media { background: #c9c9c9; }
.placeholder-project-page .hero-small .placeholder-media { width: 100%; height: 335px; border: 1px solid #000; border-radius: 48px; }
.placeholder-project-page .hero-animation-frame { border-color: #000; }
.fragrantica-page .hero-animation-frame { background: #b8c9e5; }
.placeholder-project-page .showcase-grid .placeholder-media { width: 448px; height: 528px; }
.placeholder-project-page .screens-carousel { top: 152px; }
.placeholder-project-page .screens-track .placeholder-media { width: 320px; height: 1133px; flex: 0 0 320px; }
.fragrantica-page .case-shell { height: 3984px; }
.fragrantica-page .screens-section { height: 895px; }
.fragrantica-page .screens-scroll-hint { top: 872px; }
.fragrantica-page .screens-track { display: block; width: 1016px; overflow: hidden; }
.fragrantica-page .screens-page { display: none; align-items: flex-start; gap: 28px; }
.fragrantica-page .screens-page.active { display: flex; }
.fragrantica-page .screen-frame { box-sizing: border-box; width: 320px; height: 680px; flex: 0 0 320px; overflow: hidden; border: 1px solid #000; padding: 7px; background: transparent; }
.fragrantica-page .screen-frame--scanner { height: 660px; }
.fragrantica-page .screen-bezel { height: 100%; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; border: 6px solid #000; border-radius: 40px; background: #000; }
.fragrantica-page .screen-bezel img { display: block; width: 100%; height: auto; object-fit: initial; }
.fragrantica-page .process-image img.is-contain { background: #f4eded; }
.dark-theme .placeholder-project-page .placeholder-media { background: #505050; }
.dark-theme .placeholder-project-page .hero-small .placeholder-media,
.dark-theme .placeholder-project-page .hero-animation-frame { border-color: #fff; }
.dark-theme .fragrantica-page .process-image img.is-contain { background: #2a2a2a; }

@media (max-width:760px) {
  .placeholder-project-page .hero-small .placeholder-media { height: min(84vw, 335px); }
  .fragrantica-page .hero-large { display: block; height: auto; margin: -1px 0 0; }
  .fragrantica-page .hero-animation-frame { height: auto; aspect-ratio: 1920 / 696; border-radius: 28px; }
  .fragrantica-page .hero-animation-frame video { height: 100%; }
  .placeholder-project-page .showcase-grid .placeholder-media { width: 100%; height: 110vw; max-height: 528px; }
  .placeholder-project-page .screens-track .placeholder-media { width: 78vw; height: 150vw; flex-basis: 78vw; }
  .fragrantica-page .case-shell, .fragrantica-page .screens-section { height: auto; }
  .fragrantica-page .screens-track { width: calc(100% - 76px); }
  .fragrantica-page .screens-page { gap: 12px; }
  .fragrantica-page .screen-frame { width: 78vw; height: min(113.33vw, 393px); flex-basis: 78vw; }
}