:root{--paper:#eeeee7;--ink:#242622;--yellow:#eaff00;--line:#c8cbc0;--gutter:clamp(24px,5vw,90px)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:88px}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:var(--paper);overflow-x:clip}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}[hidden]{display:none!important}button:focus-visible,a:focus-visible{outline:3px solid #9a8c00;outline-offset:6px}.skip{position:fixed;top:12px;left:12px;z-index:200;background:var(--yellow);padding:14px;transform:translateY(-180%)}.skip:focus{transform:none}
#scene{position:fixed;inset:0;pointer-events:none;z-index:0;opacity:1;transition:opacity .4s}#scene canvas{display:block;width:100%;height:100%}.scene-fallback{position:absolute;width:37vw;max-width:600px;left:54%;top:50%;transform:translateY(-47%) rotate(-8deg)}.scene-fallback svg{width:100%;height:auto}.scene-ready .scene-fallback{display:none}.scene-shadow{position:fixed;width:35vw;height:5vw;left:56%;top:82%;background:radial-gradient(ellipse,#24262229,transparent 68%);filter:blur(12px);z-index:0;pointer-events:none}.header{height:88px;padding:0 var(--gutter);display:flex;align-items:center;gap:35px;position:fixed;top:0;left:0;right:0;z-index:50;color:var(--ink);transition:color .3s,background .3s;background:#eeeeE70a;backdrop-filter:blur(12px)}.logo{font-size:38px;letter-spacing:-3px;font-weight:700;line-height:1;white-space:nowrap}.logo span{font-size:12px;vertical-align:top;letter-spacing:0;margin-left:4px;position:relative;top:5px}.nav{margin-left:auto;display:flex;gap:33px}.nav a{font-size:13px;padding:12px 0}.nav a:hover{border-bottom:1px solid currentColor}.header-contact{display:flex;align-items:center;gap:30px;font-size:13px;border:1px solid currentColor;border-radius:30px;padding:13px 18px;margin-left:20px}.header-contact span{font-size:20px;line-height:1}.header-contact:hover{background:var(--yellow);color:var(--ink);border-color:var(--yellow)}.menu{display:none;background:none;border:0;color:inherit;font-size:14px}.hero,.system{position:relative;z-index:2}.hero{min-height:max(760px,100svh);padding:120px var(--gutter) 34px;display:flex;flex-direction:column}.hero-top{display:flex;justify-content:space-between;gap:24px}.eyebrow{font-size:11px;letter-spacing:1.1px;text-transform:uppercase;display:flex;align-items:center;gap:8px;line-height:1.5}.eyebrow i{width:6px;height:6px;background:currentColor;border-radius:50%;flex-shrink:0}.edition{font-family:monospace;font-size:11px;color:#6e7365}.hero-copy{margin:auto 0;max-width:650px;padding:60px 0}.hero h1{font-size:clamp(64px,7.5vw,119px);font-weight:500;line-height:1.01;letter-spacing:-6px;margin:0 0 30px}.hero h1 em{font-style:normal;white-space:nowrap;position:relative}.hero h1 em::after{content:"";position:absolute;left:0;right:0;bottom:4px;height:4px;background:var(--yellow);z-index:-1}.hero-copy p{font-size:16px;line-height:1.6;color:#666b5f;margin:0 0 32px}.round-link{display:inline-flex;align-items:center;gap:13px;font-size:13px}.round-arrow{width:42px;height:42px;border:1px solid #9da391;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:23px;transition:background .2s,transform .2s}.round-link:hover .round-arrow{background:var(--yellow);border-color:var(--yellow);transform:rotate(45deg)}.hero-object-label{position:absolute;right:var(--gutter);top:29%;display:flex;gap:12px;align-items:center;font-size:11px;line-height:1.6;color:#6c7164}.little-cross{font-size:24px}.scene-controls{position:absolute;right:calc(var(--gutter) + 8%);bottom:15%;display:flex;gap:8px}.scene-controls button{display:flex;align-items:center;gap:11px;padding:12px 17px;border:1px solid #b0b5a3;background:#eeeee7a6;backdrop-filter:blur(12px);border-radius:30px;font-size:11px;color:var(--ink);min-height:42px}.scene-controls button:hover{background:var(--yellow);border-color:var(--yellow)}.scene-controls #motion{padding:12px 16px;font-size:16px}.hero-bottom{display:flex;align-items:end;justify-content:space-between;gap:25px;padding-top:24px;border-top:1px solid var(--line)}.scroll-link{font-size:11px;display:flex;align-items:center;gap:25px}.scroll-link span{font-size:24px}.hero-facts{display:flex;align-items:center;gap:36px;font-size:11px;color:#6c7164}.hero-facts b{font-size:23px;font-weight:500;color:var(--ink);margin-right:8px}
.system{height:235svh;color:#f4f5ed}.system-stage{height:100svh;min-height:650px;position:sticky;top:0;padding:119px var(--gutter) 36px;display:flex;flex-direction:column}.stage-top{display:flex;justify-content:space-between;align-items:center}.stage-counter{font-family:monospace;font-size:12px;color:#919783}.stage-counter #stage-number{color:var(--yellow)}.system-intro{margin-top:55px}.system-intro h2{font-size:clamp(30px,3vw,45px);font-weight:400;letter-spacing:-1.5px;margin:0 0 12px}.system-intro p{font-size:13px;line-height:1.5;color:#9bA48e;margin:0}.stage-stories{margin:auto 0;width:43%;position:relative;padding:38px 0}.stage-kicker{font-family:monospace;font-size:11px;color:var(--yellow);display:block;margin-bottom:22px}.stage-story h3{font-size:clamp(35px,4.4vw,66px);font-weight:400;line-height:1.06;letter-spacing:-2.8px;margin:0 0 22px}.stage-story p{font-size:14px;color:#abb3a1;line-height:1.7;max-width:400px;margin:0 0 22px}.stage-note{font-size:10px;color:#788470}.stage-story.is-active{animation:story-enter .5s both}@keyframes story-enter{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}.stage-orbit-label{position:absolute;top:47%;right:var(--gutter);text-align:right}.stage-orbit-label span{font-size:11px;letter-spacing:3px;display:block;color:var(--yellow)}.stage-orbit-label small{font-size:9px;color:#849174;display:block;margin-top:8px}.stage-bottom{display:flex;justify-content:space-between;gap:30px;align-items:end}.stage-tabs{display:flex;gap:30px}.stage-tabs button{color:#89957e;background:none;border:0;border-top:1px solid #3c4635;padding:17px 25px 0 0;display:flex;gap:14px;font-size:12px;min-width:105px;text-align:left}.stage-tabs button[aria-pressed="true"]{color:#f4f5ed;border-top-color:var(--yellow)}.stage-tabs button span{color:var(--yellow);font-family:monospace;font-size:10px}.stage-bottom-note{font-size:11px;color:#87947a;line-height:1.5}.stage-progress{position:absolute;bottom:0;left:0;width:100%;height:2px;background:#31382b}.stage-progress span{display:block;background:var(--yellow);height:100%;width:0}
body.in-system .header{color:#f4f5ed;background:#111b100a}body.in-system .scene-shadow{opacity:0}
.portfolio{position:relative;z-index:3;background:var(--paper);padding:120px var(--gutter) 80px;border-radius:28px 28px 0 0}.portfolio-head{display:flex;justify-content:space-between;gap:40px;align-items:end;margin-bottom:55px}.portfolio-head .eyebrow{display:block;color:#6d7463;margin-bottom:29px}.portfolio h2{font-size:clamp(35px,4.8vw,72px);font-weight:400;line-height:1.06;letter-spacing:-3px;margin:0}.portfolio h2 em{font-style:normal;color:#7f8874}.portfolio-head>p{font-size:13px;line-height:1.6;color:#6d7463;margin:0 0 5px}.project-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:60px 28px}.project{border:0;background:none;padding:0;text-align:left;color:var(--ink);min-width:0;width:100%}.project-wide{grid-column:1/-1}.project-image{position:relative;aspect-ratio:1.25;overflow:hidden;border-radius:18px;background:#d8d8d0;transform:translateZ(0)}.project-wide .project-image{aspect-ratio:2.1}.project-image img{width:100%;height:100%;object-fit:cover;transform:scale(1.09) translateY(var(--image-y,0px));transition:filter .4s}.project:hover .project-image img{filter:saturate(1.12)}.project-tag{position:absolute;left:25px;top:25px;padding:9px 12px;border-radius:4px;background:#ffffffe3;backdrop-filter:blur(8px);color:var(--ink);font-size:10px}.project-open{position:absolute;right:24px;top:23px;border-radius:50%;background:#fff;width:47px;height:47px;display:flex;align-items:center;justify-content:center;font-size:27px;transition:transform .3s,background .3s}.project:hover .project-open{transform:rotate(45deg);background:var(--yellow)}.project-metric{position:absolute;bottom:29px;left:29px;display:flex;flex-direction:column;gap:5px;background:#f5f5edeb;backdrop-filter:blur(12px);border-radius:9px;padding:18px 22px;min-width:170px}.project-metric strong{font-size:clamp(29px,3vw,46px);font-weight:500;letter-spacing:-1.5px;line-height:1}.project-metric span{font-size:10px;color:#616957}.project-small-metric{position:absolute;bottom:35px;right:29px;text-align:right;background:#f5f5edeb;padding:15px 18px;border-radius:8px;font-size:13px;line-height:1.6}.metric-light{background:#eaff00;color:var(--ink)}.metric-light span{color:var(--ink)}.project-caption{padding-top:19px;display:grid;grid-template-columns:1fr auto;gap:8px 20px}.project-caption h3{font-size:24px;font-weight:500;letter-spacing:-.5px;margin:0}.project-caption p{grid-row:2;font-size:12px;color:#707864;margin:0}.project-caption>span{grid-column:2;grid-row:1/3;align-self:center;color:#747d69;font-family:monospace;font-size:10px}.portfolio-bottom{margin-top:70px;padding-top:26px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:25px}.portfolio-bottom p{font-size:13px;color:#707864;line-height:1.6;margin:0}.contact{position:relative;z-index:3;background:var(--yellow);color:var(--ink);padding:80px var(--gutter) 32px}.contact>.eyebrow{margin-bottom:35px}.contact h2{font-size:clamp(50px,8.1vw,123px);font-weight:400;line-height:1;letter-spacing:-5px;margin:0}.contact h2 em{font-style:normal;color:#656f00}.contact-row{margin:42px 0 80px;display:flex;align-items:center;flex-wrap:wrap;gap:25px 45px}.contact-row p{font-size:14px;line-height:1.6;margin:0 auto 0 0}.contact-button{background:var(--ink);color:#fff;border-radius:8px;padding:22px 25px;display:flex;align-items:center;gap:45px;font-size:13px}.contact-button span{font-size:24px;line-height:1}.contact-button:hover{background:#3d4238}.phone{font-size:15px;border-bottom:1px solid #6b7300;padding:10px 0}footer{border-top:1px solid #6a730055;padding-top:28px;display:flex;align-items:end;justify-content:space-between;gap:25px}footer p{font-size:10px;line-height:1.6;color:#5a6300;margin:0}footer>a:last-child{font-size:11px}
dialog{border:0;padding:0;border-radius:18px;background:var(--paper);color:var(--ink);width:min(900px,calc(100% - 34px));max-height:calc(100dvh - 40px);overflow:auto;box-shadow:0 30px 100px #0005}dialog::backdrop{background:#0c150ed4;backdrop-filter:blur(8px)}body.modal-open{overflow:hidden}.dialog-art{position:relative;height:230px;overflow:hidden}.dialog-art img{width:100%;height:100%;object-fit:cover}.dialog-close{position:absolute;right:16px;top:16px;width:42px;height:42px;border:0;border-radius:50%;background:#fff;font-size:29px;color:var(--ink)}.dialog-body{padding:35px 40px 40px}.dialog-body .eyebrow{color:#748065;font-size:10px;margin-bottom:18px}.dialog-body h2{font-size:37px;line-height:1.13;letter-spacing:-1.4px;font-weight:400;margin:0 0 25px}.dialog-stats{display:flex;flex-wrap:wrap;gap:25px 40px;border-block:1px solid var(--line);padding:23px 0;margin-bottom:25px}.dialog-stats strong{display:block;font-size:30px;font-weight:500;line-height:1.1}.dialog-stats span{display:block;font-size:10px;color:#71805f;margin-top:7px}.dialog-story{display:grid;grid-template-columns:1fr 1fr;gap:30px}.dialog-story h3{font-size:13px;font-weight:600;margin:0 0 10px}.dialog-story p{font-size:13px;line-height:1.7;color:#68765a;margin:0}.dialog-bottom{margin-top:30px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:20px;font-size:12px}.dialog-bottom button{background:var(--ink);color:#fff;border:0;border-radius:7px;padding:18px 20px}.dialog-bottom a{border-bottom:1px solid var(--ink);padding:10px 0}
@media(min-width:1600px){.hero-copy{max-width:800px}.hero h1{font-size:130px}.stage-stories{max-width:700px}}
@media(max-width:1100px){.hero h1{font-size:clamp(64px,8vw,92px);letter-spacing:-4.5px}.hero-copy{max-width:57%}.header{gap:20px}.nav{gap:20px}.header-contact{gap:15px;margin-left:10px}.hero-object-label{top:24%}.hero-facts{gap:20px}.stage-stories{width:48%}.stage-story h3{font-size:45px}.system-intro{margin-top:40px}.scene-controls{right:var(--gutter)}.portfolio{padding-top:85px}.contact-row{gap:22px}.contact-row p{width:100%;margin:0}.project-metric{padding:15px 18px}}
@media(max-width:760px){.header{height:76px}.nav{gap:15px}.nav a{font-size:11px}.header-contact{display:none}.hero{min-height:max(920px,120svh);padding-top:105px}.hero-copy{max-width:100%;margin:40px 0 0;padding:0}.hero h1{font-size:clamp(60px,10.2vw,90px);letter-spacing:-4px;line-height:1}.hero-copy p{font-size:14px;line-height:1.5;margin-bottom:22px}.hero-copy p br:last-child{display:none}.hero-object-label{right:var(--gutter);top:auto;bottom:23%;font-size:10px}.hero-bottom{margin-top:auto;align-items:start}.hero-facts{font-size:10px;flex-wrap:wrap;gap:12px 20px;max-width:250px;justify-content:end}.hero-facts b{font-size:20px}.scroll-link{max-width:165px;line-height:1.5;gap:18px}.scene-controls{bottom:12.5%;right:var(--gutter)}.scene-shadow{left:15%;width:70%;top:74%;height:8vw}.scene-fallback{width:60vw;left:20%;top:66%;max-width:440px}.system{height:245svh}.system-stage{min-height:760px;padding-top:110px}.system-intro{margin-top:30px}.system-intro h2{font-size:34px}.system-intro p{font-size:12px}.stage-stories{width:100%;padding:28px 0 0;margin:0}.stage-story h3{font-size:clamp(34px,5.8vw,45px);letter-spacing:-1.6px}.stage-story p{max-width:380px;font-size:13px;line-height:1.5}.stage-note{display:none}.stage-orbit-label{top:65%;font-size:9px}.stage-bottom{margin-top:auto}.stage-tabs{gap:16px;width:100%}.stage-tabs button{min-width:0;flex:1;font-size:11px;padding:15px 0 0;gap:8px}.stage-bottom-note{display:none}.portfolio-head{align-items:start;flex-direction:column;gap:24px}.portfolio-head>p br{display:none}.portfolio-head>p{max-width:300px}.portfolio h2{font-size:clamp(35px,6vw,49px);letter-spacing:-1.8px}.project-list{gap:40px 20px}.project-image{aspect-ratio:.9}.project-wide .project-image{aspect-ratio:1.5}.project-tag{left:15px;top:17px;font-size:9px;max-width:calc(100% - 78px)}.project-open{width:36px;height:36px;font-size:23px;right:15px;top:15px}.project-metric{left:16px;bottom:16px;min-width:0;padding:13px 15px}.project-metric strong{font-size:29px}.project-metric span{font-size:9px}.project-small-metric{right:16px;bottom:16px;padding:13px 15px;font-size:11px}.project-caption h3{font-size:21px}.project-caption p{font-size:11px}.project-caption>span{display:none}.contact{padding-top:65px}.contact h2{font-size:clamp(49px,8vw,72px);letter-spacing:-3px}.contact-row{margin-bottom:50px}.contact-row p{font-size:13px}footer{flex-wrap:wrap;align-items:center}footer p{max-width:280px}footer>a:last-child{width:100%}}
@media(max-width:520px){:root{--gutter:24px}.header{justify-content:space-between}.logo{font-size:33px}.menu{display:flex;align-items:center;gap:13px;padding:12px 0}.menu span{font-size:22px;line-height:1}.nav{display:none;position:absolute;left:0;right:0;top:76px;background:var(--paper);color:var(--ink);padding:18px 24px 25px;flex-direction:column;gap:5px;border-bottom:1px solid var(--line)}.nav.is-open{display:flex}.nav a{font-size:15px;padding:12px 0}.edition{display:none}.hero{min-height:max(820px,115svh);padding-top:110px;padding-bottom:25px}.hero h1{font-size:clamp(54px,11.9vw,65px);letter-spacing:-3.2px}.hero h1 em::after{height:3px;bottom:1px}.hero-copy{margin-top:34px}.hero-copy p{font-size:13px;margin-top:23px}.hero-object-label{bottom:24%;font-size:9px;max-width:120px}.hero-object-label .little-cross{display:none}.scene-controls{bottom:17%;right:var(--gutter)}.scene-controls button{font-size:10px;padding:11px 14px}.hero-facts{max-width:165px;gap:10px 15px}.hero-facts span:last-child{font-size:9px;text-align:right}.hero-bottom{padding-top:19px;gap:15px}.scroll-link{font-size:10px;max-width:130px}.hero-top .eyebrow{font-size:9px;letter-spacing:.8px}.round-link{font-size:11px}.round-arrow{width:36px;height:36px;font-size:22px}.system-stage{min-height:720px;padding-top:102px;padding-bottom:25px}.system-intro{margin-top:32px}.system-intro h2{font-size:29px}.system-intro p{font-size:11px}.stage-stories{padding-top:30px}.stage-kicker{font-size:10px;margin-bottom:17px}.stage-story h3{font-size:35px;margin-bottom:17px}.stage-story p{font-size:12px;max-width:300px}.stage-top .eyebrow{font-size:9px;letter-spacing:.7px}.stage-counter{font-size:10px}.stage-tabs{gap:12px}.stage-tabs button{font-size:10px;gap:5px}.stage-tabs button span{font-size:9px}.stage-orbit-label{display:none}.portfolio{padding-top:64px;padding-bottom:55px;border-radius:20px 20px 0 0}.portfolio-head{margin-bottom:32px;gap:20px}.portfolio-head .eyebrow{font-size:9px;margin-bottom:23px}.portfolio h2{font-size:35px;letter-spacing:-1.8px}.portfolio-head>p{font-size:12px}.project-list{grid-template-columns:1fr;gap:33px}.project-wide .project-image,.project-image{aspect-ratio:1.1;border-radius:13px}.project-small-metric{display:none}.project-metric strong{font-size:34px}.project-metric{padding:15px 17px;bottom:16px}.project-caption{padding-top:15px}.project-caption h3{font-size:22px}.project-caption p{font-size:11px}.portfolio-bottom{margin-top:42px;padding-top:23px;flex-direction:column;align-items:start;gap:22px}.portfolio-bottom p{font-size:12px}.contact{padding-top:50px}.contact>.eyebrow{font-size:9px;margin-bottom:28px}.contact h2{font-size:49px;letter-spacing:-2.7px}.contact-row{margin-top:29px;gap:20px}.contact-button{width:100%;justify-content:space-between;padding:20px;font-size:12px}.phone{font-size:14px}footer{align-items:start;gap:20px}footer p{font-size:9px;max-width:210px}.dialog-art{height:190px}.dialog-body{padding:25px}.dialog-body h2{font-size:29px}.dialog-story{grid-template-columns:1fr;gap:22px}.dialog-stats{gap:20px 25px}.dialog-stats strong{font-size:26px}.dialog-bottom button{width:100%;font-size:11px}}
@media(max-width:360px){.hero h1{font-size:50px;letter-spacing:-3px}.portfolio h2{font-size:30px}.contact h2{font-size:43px}.stage-story h3{font-size:31px}.stage-tabs button{font-size:9px}.hero-facts{max-width:145px}.hero-facts b{font-size:18px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
.system{background:#131d12}.scene-ready .system{background:transparent}
/* Four connected stages and clinic identities. */
.system{height:295svh}
.stage-story[data-story="2"] h3{font-size:clamp(32px,3.1vw,47px);letter-spacing:-1.8px}
.brand-all-smiles{background:radial-gradient(ellipse at 45% 10%,#fff8fc,#eee4f0 75%)}
.brand-espadent{background:radial-gradient(ellipse at 50% 10%,#f5faf1,#dce6d6 75%)}
.brand-dental-plus{background:radial-gradient(ellipse at 50% 10%,#f4fcff,#d7e6ed 75%)}
.brand-logo{position:absolute;inset:19% 12% 28%;display:flex;align-items:center;justify-content:center;gap:24px;transform:translate3d(0,var(--logo-y,0px),0);transition:filter .3s;will-change:transform}
.project-image .brand-logo .clinic-logo{width:auto;height:auto;max-width:min(100%,410px);max-height:180px;object-fit:contain;transform:none!important}
.project:hover .brand-logo{filter:drop-shadow(0 10px 15px #24262212)}
.brand-dental-plus .brand-logo{gap:22px}
.project-image.brand-dental-plus .clinic-logo{width:86px;height:86px;flex-shrink:0}
.clinic-name{font-size:clamp(24px,2.5vw,37px);font-weight:500;letter-spacing:-1px;color:#222f4c;white-space:nowrap;line-height:1.1}
.clinic-name small{display:block;font-size:10px;font-weight:400;letter-spacing:.3px;margin-top:11px;color:#526078}
.dialog-art.logo-art{display:flex;align-items:center;justify-content:center;gap:22px;padding:50px 45px;background:#eee4f0}
.dialog-art.logo-art img{width:min(58%,330px);height:auto;max-height:130px;object-fit:contain}
.dialog-art[data-brand="espadent"]{background:#e2eadc}
.dialog-art[data-brand="dental-plus"]{background:#dfeaf1}
.dialog-art[data-brand="dental-plus"] img{width:78px;height:78px;flex-shrink:0}
@media(max-width:1100px){.stage-tabs{gap:20px}.stage-tabs button{min-width:0;padding-right:12px}.brand-logo{inset:19% 10% 29%}.project-image .brand-logo .clinic-logo{max-width:min(100%,330px);max-height:140px}.project-image.brand-dental-plus .clinic-logo{width:64px;height:64px}.brand-dental-plus .brand-logo{gap:14px}.clinic-name{font-size:28px}.clinic-name small{font-size:9px}}
@media(max-width:760px){.system{height:310svh}.stage-tabs{gap:14px}.stage-tabs button{padding-right:0;font-size:10px;gap:7px}.stage-story[data-story="2"] h3{font-size:32px}.brand-logo{inset:21% 10% 32%}.project-image .brand-logo .clinic-logo{max-height:130px}.brand-dental-plus .brand-logo{flex-direction:column;gap:13px;text-align:center}.project-image.brand-dental-plus .clinic-logo{width:58px;height:58px}.clinic-name{font-size:24px}.clinic-name small{font-size:8px;margin-top:7px}.dialog-art.logo-art{gap:15px;padding:45px 30px}.dialog-art .clinic-name{font-size:25px}}
@media(max-width:520px){.stage-tabs{gap:8px}.stage-tabs button{flex-direction:column;gap:7px;font-size:10px}.stage-story[data-story="2"] h3{font-size:30px}.project-image .brand-logo .clinic-logo{max-width:min(100%,280px);max-height:115px}.brand-dental-plus .brand-logo{flex-direction:row;gap:14px;text-align:left}.project-image.brand-dental-plus .clinic-logo{width:59px;height:59px}.clinic-name{font-size:26px}.dialog-art.logo-art{padding:40px 25px}.dialog-art.logo-art img{width:min(75%,270px)}.dialog-art[data-brand="dental-plus"] img{width:58px;height:58px}.dialog-art .clinic-name{font-size:23px}}
@media(max-width:360px){.stage-tabs button{font-size:9px}.stage-story[data-story="2"] h3{font-size:28px}.clinic-name{font-size:22px}.project-image.brand-dental-plus .clinic-logo{width:49px;height:49px}.dialog-art .clinic-name{font-size:19px}}
@media(prefers-reduced-motion:reduce){.brand-logo{transform:none!important;will-change:auto}}
.edition{white-space:nowrap}
@media(max-width:520px){.edition{display:inline;font-size:9px}.hero-top{gap:14px}}
/* Services: eight concise capabilities in one desktop viewport. */
#system,#work,#services,#clients,#contact{scroll-margin-top:82px}
.services,.clients{position:relative;z-index:3;color:var(--ink)}
.services{background:#fff;padding:65px var(--gutter) 64px}
.section-heading{display:flex;justify-content:space-between;align-items:end;gap:32px;margin-bottom:35px}
.section-heading .eyebrow{display:block;font-size:10px;color:#77806e;margin-bottom:22px}
.section-heading h2{font-size:clamp(36px,4.2vw,60px);font-weight:400;line-height:1.06;letter-spacing:-2.6px;margin:0}
.section-heading h2 em{font-style:normal;color:#7f8874}
.section-heading>p{font-size:13px;line-height:1.65;color:#77806e;margin:0 0 4px}
.service-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:26px 30px}
.service-card{border-top:1px solid #dce0d6;padding-top:14px;position:relative;transition:border-color .25s}
.service-number{font-family:monospace;font-size:10px;color:#8a937e;display:block;margin-bottom:18px;transition:color .25s}
.service-card h3{font-size:clamp(16px,1.4vw,20px);font-weight:500;line-height:1.2;letter-spacing:-.4px;margin:0 0 11px}
.service-card p{font-size:12px;line-height:1.6;color:#78816f;margin:0;max-width:260px}
.service-card:hover{border-color:#44532c}.service-card:hover .service-number{color:#44532c}
/* An accessible constellation: real clinic identities, no duplicated logos. */
.clients{background:#eeeee7;padding:90px var(--gutter) 45px;overflow:hidden}
.clients .section-heading{margin-bottom:18px}
.client-cloud-wrap{position:relative;height:570px;isolation:isolate;--pointer-x:0px;--pointer-y:0px}
.client-cloud{padding:0;margin:0;list-style:none;position:absolute;inset:30px 30px 0;z-index:2}
.client-node{position:absolute;left:var(--x);top:var(--y);width:clamp(150px,17vw,238px);height:105px;transform:translate(-50%,-50%);perspective:800px}
.client-card{height:100%;display:flex;align-items:center;justify-content:center;border:1px solid #fff9;border-radius:18px;background:#f9f9f4;box-shadow:0 14px 28px #25302109;position:relative;transform:translate3d(var(--pointer-x),var(--pointer-y),0) rotate(var(--rotation));transition:transform .5s,box-shadow .4s,border-color .4s}
.client-mark{width:100%;height:100%;display:flex;align-items:center;justify-content:center;padding:22px;gap:9px;animation:client-drift var(--duration) ease-in-out var(--delay) infinite alternate;will-change:transform}
.client-mark img{display:block;width:auto;height:auto;max-width:100%;max-height:62px;object-fit:contain}
.tone-pink .client-card{background:#f9eef7}.tone-sage .client-card{background:#edf3e5}.tone-blue .client-card{background:#eaf4fa}.tone-sand .client-card{background:#faf2e4}.tone-peach .client-card{background:#ffeada}.tone-dark .client-card{background:#344a46;border-color:#536962}
.client-dental-name{font-size:17px;color:#223953;font-weight:500;white-space:nowrap}.client-mark:has(.client-dental-name) img{width:37px;height:37px;flex-shrink:0}
.client-text-name{font-size:30px;font-weight:600;letter-spacing:-1px;color:#273c47}
.client-node:has(.client-text-name) .client-card{border-style:dashed}
.client-tooltip{position:absolute;top:calc(100% + 9px);left:50%;transform:translate(-50%,-4px);max-width:260px;width:max-content;white-space:normal;text-align:center;padding:8px 12px;border-radius:8px;background:var(--ink);color:#fff;font-size:10px;line-height:1.4;opacity:0;transition:opacity .2s,transform .2s;pointer-events:none}
.client-tooltip span{color:var(--yellow);margin-left:6px}
.client-node:hover,.client-node:focus-within{z-index:5}
.client-node:hover .client-card,.client-node:focus-within .client-card{transform:translate3d(0,-7px,0) rotate(0);box-shadow:0 22px 42px #25302122;border-color:#b1baa2}
.client-node:hover .client-mark,.client-node:focus-within .client-mark{animation-play-state:paused}
.client-node:hover .client-tooltip,.client-node:focus-within .client-tooltip{opacity:1;transform:translate(-50%,0)}
@keyframes client-drift{0%{transform:translate3d(0,-4px,0) rotate(-1deg)}100%{transform:translate3d(0,5px,0) rotate(1deg)}}
.cloud-core{position:absolute;left:50%;top:53%;transform:translate(-50%,-50%);width:190px;height:190px;display:flex;align-items:center;justify-content:center;border:1px solid #d4d9ca;border-radius:50%;color:#bdc5af}
.cloud-core>span{font-size:50px;letter-spacing:-4px;font-weight:600;opacity:.55}.cloud-core>i{position:absolute;right:-5px;top:42%;font-size:19px;font-style:normal;background:#eeeee7;line-height:1}
.cloud-orbit{position:absolute;inset:19% 7%;border:1px solid #d4d9ca;border-radius:50%;transform:rotate(-12deg);pointer-events:none}
.orbit-two{inset:8% 19%;transform:rotate(26deg);border-style:dashed;opacity:.6}
.clients-bottom{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:22px;gap:20px}
.clients-bottom p{font-size:11px;line-height:1.6;color:#7c8570;margin:0}
.cloud-toggle{background:none;border:1px solid #b7bfa9;border-radius:30px;min-height:42px;padding:10px 16px;font-size:10px;display:inline-flex;align-items:center;gap:10px;color:#647053}
.cloud-toggle:hover{background:var(--yellow);border-color:var(--yellow)}
.cloud-toggle[hidden]{display:none}
.is-paused .client-mark,.is-sleeping .client-mark{animation-play-state:paused}
/* A real enquiry form replaces direct contacts. */
.contact{display:grid;grid-template-columns:1fr 1.1fr;gap:45px 60px;padding-top:85px}
.contact-intro>.eyebrow{font-size:10px;margin-bottom:30px;display:block}
.contact h2{font-size:clamp(46px,5.2vw,78px);letter-spacing:-3.5px}
.contact-intro>p{font-size:13px;line-height:1.7;margin-top:30px;color:#546100}
.project-form{padding-top:8px;min-width:0}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px 18px}
.form-field{display:flex;flex-direction:column;gap:10px;font-size:11px;color:#374200;min-width:0}
.form-field>span{display:flex;gap:6px}.form-field>span>small{font-size:9px;margin-left:auto;color:#6e780c}
.form-field input,.form-field textarea{border:1px solid #a4b50033;background:#ffffffe3;padding:18px 17px;border-radius:9px;width:100%;font:inherit;font-size:14px;line-height:1.5;color:var(--ink);box-shadow:0 6px 15px #59700006;transition:background .2s,border-color .2s}
.form-field input::placeholder,.form-field textarea::placeholder{color:#90947d;opacity:1}
.form-field input:focus,.form-field textarea:focus{background:#fff;border-color:#5a6700;outline:2px solid #5a670022;outline-offset:2px}
.form-field input:focus:user-invalid{border-color:#963522}
.form-field>small{font-size:9px;color:#667308;margin-top:-3px}
.form-wide{grid-column:1/-1}
.form-field textarea{min-height:130px;resize:vertical}
.form-honey{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.form-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:23px}
.form-note{font-size:9px;line-height:1.7;color:#697305;margin:0;max-width:260px}
.form-submit{border:0;border-radius:9px;background:var(--ink);color:#fff;min-height:58px;padding:16px 23px;display:inline-flex;justify-content:space-between;align-items:center;gap:30px;font-size:12px;white-space:nowrap;transition:background .2s,transform .2s}
.form-submit>span:last-child{font-size:24px}.form-submit:hover{background:#3d4b31;transform:translateY(-2px)}.form-submit:disabled{opacity:.65;cursor:wait;transform:none}
.form-status{font-size:12px;line-height:1.6;min-height:38px;margin:16px 0 0;color:#405000}.form-status[data-state="error"]{color:#80320f}.form-status[data-state="success"]{font-weight:500}
.contact footer{grid-column:1/-1;margin-top:8px}.contact footer>a:last-child{width:auto}
@media(min-width:1200px) and (max-height:760px){.services{padding-block:45px}.section-heading{margin-bottom:28px}.services .section-heading h2{font-size:46px}.service-grid{gap:22px 28px}.service-number{margin-bottom:13px}}
@media(max-width:1100px){.service-grid{gap:25px 23px}.service-card h3{font-size:17px}.service-card p{font-size:11px}.contact{grid-template-columns:1fr 1.2fr;gap:35px}.contact h2{font-size:49px;letter-spacing:-2.6px}.form-bottom{flex-wrap:wrap}.form-submit{width:100%}.client-mark{padding:18px}.client-dental-name{font-size:14px}.client-mark:has(.client-dental-name) img{width:31px;height:31px}.client-cloud-wrap{height:540px}.client-node{width:18vw;height:96px}}
@media(max-width:760px){.section-heading{align-items:start;flex-direction:column;gap:20px}.section-heading h2{font-size:42px;letter-spacing:-1.8px}.section-heading>p{font-size:12px}.section-heading>p br{display:none}.services{padding-block:60px}.service-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px}.service-card h3{font-size:20px}.service-card p{font-size:12px;max-width:100%}.clients{padding-top:65px}.client-cloud-wrap{height:auto;padding-block:25px 35px}.client-cloud{position:relative;inset:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px 14px}.client-node{position:relative;inset:auto;transform:none;width:100%;height:97px}.client-card{border-radius:13px}.client-mark{padding:16px}.client-dental-name{font-size:11px}.client-text-name{font-size:24px}.client-mark:has(.client-dental-name){flex-direction:column;gap:5px}.client-mark:has(.client-dental-name) img{width:30px;height:30px}.client-tooltip{max-width:170px}.cloud-core,.cloud-orbit{display:none}.client-node:last-child{grid-column:2}.contact{grid-template-columns:1fr;gap:25px;padding-top:60px}.contact h2{font-size:64px;letter-spacing:-3px}.contact-intro>p{margin-bottom:0}.project-form{padding-top:0}.form-bottom{flex-wrap:nowrap}.form-submit{width:auto}.contact footer{margin-top:15px}}
@media(max-width:520px){.services{padding-block:50px}.section-heading h2{font-size:35px;letter-spacing:-1.6px}.section-heading .eyebrow{font-size:9px;margin-bottom:22px}.service-grid{gap:26px 20px}.service-card h3{font-size:17px;line-height:1.25;letter-spacing:-.4px}.service-card p{font-size:11px}.service-number{margin-bottom:16px}.clients{padding-top:50px;padding-bottom:32px}.client-cloud{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 15px}.client-node{height:97px}.client-node:last-child{grid-column:1/-1;width:calc((100% - 15px)/2);justify-self:center}.client-mark{padding:17px}.client-dental-name{font-size:13px}.client-tooltip{display:none}.client-card:active{transform:scale(.98) rotate(0)}.client-mark img{max-height:54px}.clients-bottom{align-items:start;flex-direction:column;gap:15px}.clients-bottom p{font-size:10px}.cloud-toggle{min-height:44px}.contact{gap:27px;padding-top:50px}.contact h2{font-size:49px;letter-spacing:-2.7px}.contact-intro>.eyebrow{font-size:9px;margin-bottom:25px}.contact-intro>p{font-size:12px;margin-top:23px}.form-grid{grid-template-columns:1fr;gap:20px}.form-wide{grid-column:auto}.form-field input,.form-field textarea{font-size:16px;padding:16px}.form-field textarea{min-height:140px}.form-bottom{flex-direction:column;align-items:stretch;gap:17px}.form-note{max-width:100%;font-size:10px}.form-submit{width:100%;min-height:60px;padding:18px 20px}.contact footer{margin-top:0}.contact footer>a:last-child{width:100%}}
@media(max-width:360px){.section-heading h2{font-size:31px}.service-grid{gap:25px 16px}.service-card h3{font-size:16px}.service-card p{font-size:10px}.client-mark{padding:13px}.contact h2{font-size:43px}.client-dental-name{font-size:11px}}
@media(prefers-reduced-motion:reduce){.client-card{transform:none!important}.client-mark{animation:none!important;will-change:auto}.client-node:hover .client-card,.client-node:focus-within .client-card{transform:none!important}}
/* Compact cases: each clinic has one equally sized, content-led card. */
.portfolio{padding:62px var(--gutter) 48px}
.portfolio-head{margin-bottom:28px;gap:30px}
.portfolio-head .eyebrow{margin-bottom:18px;font-size:10px}
.portfolio h2{font-size:clamp(34px,3.6vw,50px);letter-spacing:-2px}
.portfolio-head>p{font-size:12px}
.project-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.portfolio .project{display:flex;flex-direction:column;background:#fafaf5;border:1px solid #d8ddce;border-radius:14px;overflow:hidden;transition:transform .25s,box-shadow .25s}
.portfolio .project:hover{transform:translateY(-4px);box-shadow:0 12px 26px #28361b0c}
.portfolio .project-image{height:154px;aspect-ratio:auto;border-radius:0;width:100%;flex-shrink:0}
.portfolio .project-tag{top:13px;left:14px;padding:6px 8px;font-size:9px;max-width:calc(100% - 68px)}
.portfolio .project-open{top:12px;right:13px;width:32px;height:32px;font-size:21px}
.portfolio .brand-logo{inset:48px 24px 20px;gap:12px}
.portfolio .project-image .brand-logo .clinic-logo{max-width:min(100%,225px);max-height:67px}
.portfolio .brand-dental-plus .brand-logo{flex-direction:row;text-align:left;gap:12px}
.portfolio .project-image.brand-dental-plus .clinic-logo{width:44px;height:44px}
.portfolio .clinic-name{font-size:22px;letter-spacing:-.7px}
.portfolio .clinic-name small{font-size:8px;letter-spacing:0;margin-top:6px}
.project-result{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px;min-height:90px}
.project-result .project-metric{position:static;padding:0;background:none;backdrop-filter:none;border-radius:0;min-width:0;gap:6px}
.project-result strong{font-size:30px;letter-spacing:-1.1px;line-height:1.05}
.project-result .project-metric>span{font-size:10px;line-height:1.4;color:#6c775e}
.project-result .project-small-metric{display:block;position:static;text-align:right;padding:0;background:none;border-radius:0;font-size:10px;line-height:1.7;color:#6c775e;flex-shrink:0}
.project-result .metric-light strong{background:var(--yellow);padding:3px 7px;border-radius:5px;align-self:flex-start}
.portfolio .project-caption{padding:14px 18px 17px;border-top:1px solid #e0e4d7;gap:6px 10px;margin-top:auto;min-height:73px}
.portfolio .project-caption h3{font-size:20px;letter-spacing:-.4px}
.portfolio .project-caption p{font-size:11px;line-height:1.45}
.portfolio .project-caption>span{display:block;font-size:9px}
.portfolio-bottom{margin-top:28px;padding-top:20px;gap:20px}
.portfolio-bottom p{font-size:12px}
/* Case details keep the same facts in a smaller dialog. */
.dialog-art.logo-art{height:145px;padding:28px 35px}
.dialog-art.logo-art img{max-height:90px;width:min(58%,250px)}
.dialog-art[data-brand="dental-plus"] img{width:58px;height:58px}
.dialog-body{padding:28px 32px 30px}
.dialog-body h2{font-size:32px}
@media(max-width:960px) and (min-width:601px){
 .project-list{grid-template-columns:1fr;gap:14px}
 .portfolio .project{display:grid;grid-template-columns:32% 1fr;grid-template-rows:auto auto}
 .portfolio .project-image{grid-row:1/3;height:173px;align-self:stretch}
 .portfolio .brand-logo{inset:53px 20px 36px}
 .portfolio .project-image .brand-logo .clinic-logo{max-width:100%;max-height:65px}
 .portfolio .brand-dental-plus .brand-logo{flex-direction:column;gap:7px;text-align:center}
 .portfolio .brand-dental-plus .clinic-name{font-size:18px}
 .portfolio .brand-dental-plus .clinic-name small{display:none}
 .project-result{padding:17px 22px;min-height:91px}
 .portfolio .project-caption{padding:15px 22px;min-height:82px}
 .portfolio .project-tag{font-size:8px;max-width:calc(100% - 58px);left:10px;padding:6px}
 .portfolio .project-open{right:10px;width:28px;height:28px}
}
@media(max-width:760px){
 .portfolio{padding-top:48px;padding-bottom:38px}
 .portfolio-head{gap:18px;margin-bottom:24px}
 .portfolio-head .eyebrow{margin-bottom:16px}
 .portfolio-head>p br{display:none}
 .portfolio-head>p{max-width:none;font-size:11px}
 .portfolio h2{font-size:36px;letter-spacing:-1.7px}
 .portfolio-bottom{margin-top:24px;padding-top:18px}
 .dialog-body{padding:24px}.dialog-body h2{font-size:29px}
}
@media(max-width:600px){
 .project-list{grid-template-columns:1fr;gap:16px}
 .portfolio .project-image{height:132px}
 .portfolio .brand-logo{inset:43px 25px 16px}
 .portfolio .project-image .brand-logo .clinic-logo{max-width:min(100%,220px);max-height:62px}
 .portfolio .project-image.brand-dental-plus .clinic-logo{width:42px;height:42px}
 .portfolio .clinic-name{font-size:23px}
 .project-result{min-height:81px;padding:13px 16px}
 .project-result strong{font-size:29px}
 .portfolio .project-caption{min-height:66px;padding:12px 16px 14px}
 .portfolio .project-caption h3{font-size:19px}
 .portfolio-bottom p{font-size:11px}
 .dialog-art.logo-art{height:122px;padding:26px}
 .dialog-art.logo-art img{max-height:72px}
}
@media(max-width:360px){.portfolio h2{font-size:31px}.portfolio .clinic-name{font-size:21px}.project-result .project-small-metric{font-size:9px}}
