/* Dedicated presentation layer for the React Three Fiber dental scenes. */
.dental-scene-host{position:relative;isolation:isolate;outline:none;min-width:0}
.dental-scene-host:focus-visible{outline:1px solid #77a9cd;outline-offset:5px;border-radius:4px}
.dental-scene-host canvas{display:block!important;width:100%!important;height:100%!important;touch-action:pan-y;outline:none}
.dental-webgl-tooth canvas{touch-action:none}
.dental-scene-host[data-dragging=true]{cursor:grabbing}
.dental-webgl{width:100%;height:100%;cursor:grab}
.dental-webgl>div{width:100%!important;height:100%!important}
#hero-3d{position:absolute;inset:0 0 0 auto;width:61%;height:100%;z-index:1;min-height:400px;pointer-events:auto}
#hero-3d:before{content:"";position:absolute;inset:4% -2% 7% 0;background:radial-gradient(ellipse at 52% 47%,#c8e9ff80,transparent 62%);pointer-events:none}
.dental-story-canvas,#dental-story-canvas{position:sticky;top:0;width:100%;height:100svh;min-height:560px;max-height:1100px;z-index:1}
#dental-story{--story-progress:0;position:relative;min-height:220svh;background:radial-gradient(ellipse at 74% 35%,#e0f2ff 0,#eef8ff 40%,#f6fbff 80%)}
.dental-story-sticky{position:sticky;top:0;height:100svh;min-height:660px;overflow:hidden}
.dental-story-sticky #dental-story-canvas{position:absolute;inset:0;min-height:0;max-height:none;height:100%;width:100%}
.story-heading{position:absolute;inset-inline-start:var(--gutter,5vw);top:100px;z-index:2;max-width:49%;pointer-events:none}
.story-heading .eyebrow{font-size:8px;letter-spacing:2.1px;margin-bottom:24px}
.story-heading h2{font-size:clamp(45px,4.4vw,68px);line-height:1.03;letter-spacing:-1.5px}
.story-stages{position:absolute;inset-inline-start:var(--gutter,5vw);top:53%;width:31%;z-index:2;pointer-events:none}
.story-stages article{position:absolute;inset:0 auto auto 0;width:100%;text-align:start}
.story-stages article>span{font:500 8px var(--sans,Arial,sans-serif);letter-spacing:1.6px;color:#5995ba}
.story-stages h3{font-size:clamp(34px,3.4vw,52px);line-height:1.05;letter-spacing:-1px;margin:18px 0}
.story-stages p{font:400 11px/1.9 var(--sans,Arial,sans-serif);color:#67889f;max-width:300px}
.story-disclaimer{position:absolute;inset-inline-start:var(--gutter,5vw);bottom:34px;max-width:340px;z-index:2;font:400 8px/1.8 var(--sans,Arial,sans-serif);color:#7595aa;pointer-events:none}
.story-scroll-hint{position:absolute;inset-inline-end:var(--gutter,5vw);bottom:43px;z-index:2;font:500 7px var(--sans,Arial,sans-serif);letter-spacing:2px;color:#75a1bd;pointer-events:none}
.story-scroll-hint:before{content:"";display:inline-block;vertical-align:middle;width:37px;height:1px;background:#9bcce9;margin-inline-end:14px}
.dental-diagram-labels{position:absolute;inset:0;z-index:2;pointer-events:none;opacity:0;transition:opacity .6s}
#dental-story[data-stage="0"] .anatomy-labels,#dental-story[data-stage="1"] .implant-labels{opacity:1}
.diagram-label{position:absolute;left:81%;font:500 8px var(--sans,Arial,sans-serif);letter-spacing:.9px;color:#668ca5;white-space:nowrap}
.diagram-label:before{content:"";width:43px;height:1px;background:#8bb8d377;display:inline-block;vertical-align:middle;margin-right:10px}
.enamel-label{top:31%}.dentin-label{top:42%}.pulp-label{top:50%;color:#b47a75}.roots-label{top:68%}.crown-label{top:34%}.abutment-label{top:48%}.implant-label{top:65%}
[dir=rtl] .diagram-label{left:auto;right:81%;direction:ltr}
#dental-story [data-story-stage]{transition:opacity .7s ease,transform .9s cubic-bezier(.2,.7,.25,1);opacity:0;transform:translateY(22px);pointer-events:none}
#dental-story [data-story-stage].is-active{opacity:1;transform:translateY(0);pointer-events:auto}
.service-visual{position:relative;width:100%;height:240px;min-height:180px;overflow:hidden;background:radial-gradient(ellipse at 50% 35%,#e4f3ff 0,#f0f8fe 62%,#f5faff 100%);border-radius:inherit}
.service-visual .dental-webgl{transition:transform .8s cubic-bezier(.2,.7,.25,1)}
.service-card:hover .service-visual .dental-webgl{transform:scale(1.035)}
.dental-render-placeholder,.dental-visual-fallback{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none}
.dental-render-placeholder span{width:31%;height:48%;border-radius:45% 45% 35% 35%;background:radial-gradient(ellipse at 35% 25%,#fff,#dbeaf3);filter:blur(14px);opacity:.55}
.dental-visual-fallback svg{width:80%;height:87%;max-width:400px;filter:drop-shadow(4px 15px 13px #527f9b15)}
.service-visual .dental-visual-fallback svg{width:70%;height:95%}
@media(max-width:1000px){#hero-3d{width:59%;inset:7% -4% 0 auto;height:89%}.service-visual{height:220px}}
@media(max-width:760px){#hero-3d{width:100%;inset:auto 0 55px;height:46%;min-height:280px;z-index:0}#hero-3d:before{inset:0}.dental-story-canvas,#dental-story-canvas{min-height:500px;height:100svh;max-height:none}#dental-story{min-height:250svh}.dental-story-sticky{min-height:740px}.story-heading{top:86px;max-width:90%;inset-inline-start:24px}.story-heading .eyebrow{font-size:6px;letter-spacing:1.6px;margin-bottom:19px}.story-heading h2{font-size:40px;letter-spacing:-.7px}.story-stages{top:auto;bottom:153px;width:calc(100% - 48px);inset-inline-start:24px}.story-stages h3{font-size:30px;margin:11px 0}.story-stages h3 br{display:none}.story-stages p{font-size:10px;line-height:1.7;max-width:310px}.story-stages article>span{font-size:7px}.story-disclaimer{font-size:7px;bottom:23px;inset-inline-start:24px;max-width:250px}.story-scroll-hint{display:none}.service-visual{height:230px}}
@media(prefers-reduced-motion:reduce){#dental-story [data-story-stage],.service-visual .dental-webgl{transition:none}}
@media(max-width:760px){.diagram-label{left:auto;right:5%;font-size:6px;letter-spacing:.4px}.diagram-label:before{width:22px;margin-right:6px}.enamel-label,.crown-label{top:33%}.dentin-label{top:41%}.pulp-label,.abutment-label{top:48%}.roots-label,.implant-label{top:61%}[dir=rtl] .diagram-label{right:5%;left:auto}}