.t5-service-overlay { position:fixed; inset:0; z-index:1300; display:grid; place-items:center; padding:18px; background:#122d24db; backdrop-filter:blur(8px); color:#203a32; }
.t5-service-card { width:min(940px,calc((100dvh - 200px)*1.5),100%); max-height:calc(100dvh - 36px); overflow:auto; border-radius:26px; background:#fbfaf6; box-shadow:0 30px 100px #0004; }
.t5-service-scene { position:relative; margin:0; width:100%; aspect-ratio:3/2; overflow:hidden; isolation:isolate; background:#e8e4d8; }
.t5-service-guest { display:block; width:100%; height:100%; object-fit:cover; }
.t5-service-caption { position:absolute; inset:0 0 auto; padding:20px 24px 44px; background:linear-gradient(#12271fbd,transparent); color:#fffdf5; text-align:left; }
.t5-service-eyebrow { margin:0 0 5px; font:700 10px/1.4 Arial,sans-serif; letter-spacing:1.6px; text-transform:uppercase; color:#e6eddf; }
.t5-service-caption h2 { margin:0; font:500 clamp(20px,2.6vw,30px)/1.15 Georgia,serif; max-width:55%; text-shadow:0 2px 12px #14221f80; }
.t5-service-plate { position:absolute; left:50%; top:71%; width:32%; aspect-ratio:1; transform:translate(-50%,-50%) scaleY(.62); filter:drop-shadow(0 8px 6px #38261940); }
.t5-service-plate img { display:block; width:100%; height:100%; object-fit:contain; clip-path:ellipse(47% 47% at 50% 50%); }
.t5-service-scene[data-kind="greek"] .t5-service-plate { width:26%; }
.t5-service-scene[data-kind="roll"] .t5-service-plate { left:47%; width:32%; transform:translate(-50%,-50%) scaleY(.84); }
.t5-service-scene[data-kind="roll"] .t5-service-plate img { clip-path:url(#t5-service-roll-mask); }
.t5-service-scene .t5-service-plate.is-tray { width:30%; transform:translate(-50%,-50%) scaleY(.55); display:grid; grid-template-columns:1fr 1fr; gap:5px; padding:9px; border-radius:48%; background:#eee8da; box-shadow:inset 0 0 0 4px #e1d8c6; }
.t5-service-scene .t5-service-plate.is-tray img { border-radius:50%; clip-path:circle(47%); }
.t5-service-scene .t5-service-plate.is-native { left:50%; width:36%; aspect-ratio:3/2; transform:translate(-50%,-50%); filter:none; }
.t5-service-scene[data-kind="greek"] .t5-service-plate.is-native { width:29%; }
.t5-service-scene[data-kind="roll"] .t5-service-plate.is-native { width:37%; }
.t5-service-scene .t5-service-plate.is-native img { clip-path:none; }
.t5-service-accompaniments { position:absolute; left:64%; top:73%; width:15%; height:auto; transform:translate(-50%,-50%); }
.t5-service-plate.is-sliced { background:radial-gradient(circle,#83583c 0%,#b39c80 58%,transparent 61%); }
.t5-service-plate.is-sliced img { position:absolute; inset:0; }
.t5-service-plate.is-sliced .t5-service-pizza-rim { clip-path:url(#t5-service-pizza-rim); }
.t5-service-copy { display:grid; grid-template-columns:1fr auto; align-items:center; gap:4px 20px; padding:18px 24px; }
.t5-service-dish { font:600 20px/1.3 Georgia,serif; margin:0; }
.t5-service-composition { font-size:12px; line-height:1.5; color:#647667; margin:0; }
.t5-service-saved { margin:5px 0 0; font-size:11px; font-weight:600; color:#2c704e; }
.t5-service-clock { margin:0; font-size:11px; color:#687667; }
.t5-service-copy .t5-photo-primary { grid-column:2; grid-row:1/5; min-width:190px; }
.t5-service-copy .t5-photo-primary:focus-visible { outline:3px solid #8cbfa4; outline-offset:4px; }
.t5-service-missing { position:absolute; left:15%; right:15%; top:50%; text-align:center; color:#203a32; }
.t5-service-scene.is-missing .t5-service-plate,.t5-service-scene.is-missing .t5-service-accompaniments { visibility:hidden; }
.t5-service-overlay [hidden] { display:none; }
.t5-service-open .exam-transition-toast { display:none; }
@media(max-width:650px) { .t5-service-overlay { padding:10px; }.t5-service-card { width:100%; max-height:calc(100dvh - 20px); border-radius:20px; }.t5-service-caption { padding:14px 16px 28px; }.t5-service-caption h2 { max-width:60%; font-size:19px; }.t5-service-eyebrow { font-size:8px; }.t5-service-copy { display:block; padding:16px; }.t5-service-dish { font-size:19px; }.t5-service-composition { margin:5px 0; }.t5-service-copy .t5-photo-primary { width:100%; margin-top:12px; } }
@media(prefers-reduced-motion:no-preference) { .t5-service-plate { animation:t5-service-place 500ms ease-out both; } @keyframes t5-service-place { from { opacity:0; translate:0 -12px; } to { opacity:1; translate:0 0; } } }
.t5-service-scene.is-loading .t5-service-plate,.t5-service-scene.is-loading .t5-service-accompaniments { opacity:0; animation:none; }
.t5-service-scene.is-loading::after { content:"Подаём блюдо…"; position:absolute; left:0; right:0; top:75%; text-align:center; font:500 15px Georgia,serif; color:#3e5447; }
.t5-service-scene > svg { position:absolute; pointer-events:none; }
