/* ============================================================
   DIGITAL DENTAL GUIDES — shared design system
   Palette taken directly from the Clinical Platinum logo package.
   ============================================================ */
:root{
  --ink:#0B0F14;
  --ink-1:#0E141B;
  --ink-2:#131B24;
  --ink-3:#1B2530;
  --line:#E8EDF2;
  --accent:#7FA6C4;
  --accent-hi:#A6CCE4;
  --muted:#8A99A8;
  --slate:#6E7E8D;
  --paper:#F2F5F8;
  --f-display:'Jost','Manrope',"Century Gothic",system-ui,sans-serif;
  --f-body:'Inter',system-ui,sans-serif;
  --f-sig:'Allura',cursive;
  --max:1240px;
  --nav-h:94px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:clip;max-width:100%}
body{
  background:var(--ink);color:var(--paper);
  font-family:var(--f-body);font-weight:300;line-height:1.68;
  overflow-x:clip;-webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{font-family:var(--f-display);font-weight:400;line-height:1.12;letter-spacing:-.01em}
a{color:inherit;text-decoration:none}
img,svg{display:block;max-width:100%}
::selection{background:var(--accent);color:var(--ink)}
.wrap{max-width:var(--max);margin:0 auto;padding:0 30px}
.sec{padding:132px 0;position:relative;z-index:2}
.sec.tight{padding:92px 0}
.alt{background:linear-gradient(180deg,transparent,rgba(19,27,36,.55),transparent)}

/* ---------- ambient ---------- */
.bg-grid{
  position:fixed;inset:0;z-index:0;pointer-events:none;
  background-image:linear-gradient(rgba(127,166,196,.05) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(127,166,196,.05) 1px,transparent 1px);
  background-size:66px 66px;
  mask-image:radial-gradient(ellipse 92% 66% at 50% 20%,#000 18%,transparent 78%);
  -webkit-mask-image:radial-gradient(ellipse 92% 66% at 50% 20%,#000 18%,transparent 78%);
}
.bg-glow{
  position:fixed;z-index:0;pointer-events:none;
  width:78vw;height:78vw;max-width:1050px;max-height:1050px;
  top:-28%;left:50%;transform:translateX(-50%);
  background:radial-gradient(circle,rgba(127,166,196,.20) 0%,rgba(127,166,196,.04) 46%,transparent 70%);
  filter:blur(28px);
}

/* ---------- nav ---------- */
header{position:fixed;top:0;left:0;right:0;z-index:120;border-bottom:1px solid transparent;
  transition:background .4s,backdrop-filter .4s,border-color .4s}
header.solid{background:rgba(11,15,20,.94);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  border-bottom-color:rgba(127,166,196,.16)}

/* The header is position:fixed, so WordPress's own html{margin-top:32px} for
   the admin bar does not move it -- logged-in editors get the bar sitting on
   top of the logo. Push the header (and the mobile menu that hangs off it)
   down by the bar's height. Visitors never see either rule. */
body.admin-bar header{top:32px}
body.admin-bar .mobmenu{top:calc(var(--nav-h) + 32px)}
@media screen and (max-width:782px){
  body.admin-bar header{top:46px}
  body.admin-bar .mobmenu{top:calc(var(--nav-h) + 46px)}
}
.nav{display:flex;align-items:center;justify-content:space-between;height:var(--nav-h);gap:20px;
  /* the logo sat 18px under the browser chrome and read as cramped; the extra
     top padding gives it air without moving the row off centre horizontally.
     --nav-h grew by the same amount so the hero and the sticky legal TOC,
     which both measure themselves against it, stay clear of the bar. */
  padding-top:12px}
@media (max-width:820px){ .nav{padding-top:8px} }
/* The brand never shrinks. In Greek the header row needed 1201px inside a
   1180px container, and because .brand was allowed to shrink it was the
   logo that lost -- its box went 21px narrower than its own text, so the
   first nav link was painted straight over the wordmark. */
.brand{display:flex;align-items:center;gap:13px;flex:0 0 auto}
.brand img{height:46px;width:auto}
.brand .wm{display:flex;flex-direction:column;gap:3px;line-height:1}
.brand .wm .w1{font-family:var(--f-display);font-size:19px;font-weight:400;letter-spacing:.20em;color:var(--paper);white-space:nowrap}
.brand .wm .w1 b{font-weight:400;color:var(--accent)}
.brand .wm .w2{display:flex;align-items:baseline;gap:9px;border-top:1px solid rgba(138,153,168,.45);padding-top:3px}
.brand .wm .w2 .t{font-family:var(--f-display);font-size:7.5px;letter-spacing:.30em;color:var(--muted);white-space:nowrap}
.brand .wm .w2 .s{font-family:var(--f-sig);font-size:14px;color:var(--accent);white-space:nowrap}
.nav-links{display:flex;gap:16px;align-items:center;flex:0 1 auto;min-width:0}
.nav-links a{font-size:11px;letter-spacing:.10em;text-transform:uppercase;color:var(--muted);
  position:relative;padding:7px 0;transition:color .3s;white-space:nowrap}
.nav-links a::after{content:'';position:absolute;left:0;bottom:0;height:1px;width:0;background:var(--accent-hi);transition:width .35s}
.nav-links a:hover,.nav-links a[aria-current]{color:var(--paper)}
.nav-links a:hover::after,.nav-links a[aria-current]::after{width:100%}
.nav-right{display:flex;align-items:center;gap:18px}
/* ---------- language dropdown ---------- */
.langs{position:relative}
.lang-btn{display:flex;align-items:center;gap:7px;background:none;cursor:pointer;
  border:1px solid rgba(127,166,196,.26);border-radius:3px;padding:7px 10px;
  font-family:var(--f-display);font-size:10.5px;letter-spacing:.12em;color:var(--muted);
  transition:border-color .3s,color .3s,background .3s}
.lang-btn:hover,.lang-btn[aria-expanded="true"]{border-color:rgba(166,204,228,.5);
  color:var(--paper);background:rgba(127,166,196,.1)}
.lang-btn svg{width:13px;height:13px;flex:none;opacity:.8}
.lang-btn .cv{width:11px;height:11px;transition:transform .3s}
.lang-btn[aria-expanded="true"] .cv{transform:rotate(180deg)}
.lang-btn .cur{line-height:1}
.lang-menu{position:absolute;top:calc(100% + 9px);right:0;z-index:130;min-width:186px;
  background:rgba(11,15,20,.97);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  border:1px solid rgba(127,166,196,.24);border-radius:3px;padding:6px;
  box-shadow:0 22px 48px -18px rgba(0,0,0,.9);
  opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity .25s,transform .25s,visibility .25s}
.langs.open .lang-menu{opacity:1;visibility:visible;transform:none}
.lang-menu a{display:flex;align-items:center;gap:11px;padding:9px 11px;border-radius:2px;
  font-size:.86rem;color:var(--muted);transition:background .22s,color .22s}
.lang-menu a:hover{background:rgba(127,166,196,.13);color:var(--paper)}
.lang-menu a.on{color:var(--paper)}
.lang-menu .lc{font-family:var(--f-display);font-size:9.5px;letter-spacing:.14em;
  color:var(--accent);width:20px;flex:none}
.lang-menu .ln{flex:1}
.lang-menu .tick{color:var(--accent);font-size:.8rem}
.burger{display:none;background:none;border:none;cursor:pointer;padding:8px}
.burger span{display:block;width:22px;height:1.5px;background:var(--line);margin:5px 0;transition:.3s}
.burger.x span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.burger.x span:nth-child(2){opacity:0}
.burger.x span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
.mobmenu{position:fixed;inset:var(--nav-h) 0 auto 0;z-index:110;background:rgba(11,15,20,.985);
  backdrop-filter:blur(20px);border-bottom:1px solid rgba(127,166,196,.16);
  padding:18px 30px 30px;display:none}
.mobmenu.open{display:block}
.mobmenu a{display:block;padding:15px 0;border-bottom:1px solid rgba(127,166,196,.1);
  font-family:var(--f-display);font-size:15px;letter-spacing:.1em;text-transform:uppercase}
.mobmenu .mlangs{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:22px}
.mobmenu .mlangs a{display:flex;align-items:center;gap:9px;border:1px solid rgba(127,166,196,.28);
  padding:11px 13px;font-size:12px;border-radius:3px;text-transform:none;letter-spacing:0;
  font-family:var(--f-body);color:var(--muted)}
.mobmenu .mlangs a.on{border-color:rgba(166,204,228,.5);background:rgba(127,166,196,.12);color:var(--paper)}
.mobmenu .mlangs .lc{font-family:var(--f-display);font-size:9.5px;letter-spacing:.14em;color:var(--accent)}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:10px;font-family:var(--f-display);font-size:11.5px;
  font-weight:400;letter-spacing:.15em;text-transform:uppercase;padding:14px 26px;border-radius:2px;
  cursor:pointer;transition:all .35s cubic-bezier(.2,.7,.3,1);white-space:nowrap}
.btn-primary{background:linear-gradient(120deg,#33556F,var(--accent));color:#08131B;font-weight:500;
  border:1px solid rgba(166,204,228,.4);box-shadow:0 6px 26px -10px rgba(127,166,196,.9)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 12px 38px -10px rgba(127,166,196,1)}
.btn-ghost{border:1px solid rgba(138,153,168,.35);color:var(--paper)}
.btn-ghost:hover{border-color:var(--accent-hi);background:rgba(127,166,196,.1)}
.btn-link{display:inline-flex;align-items:center;gap:9px;font-family:var(--f-display);font-size:11.5px;
  letter-spacing:.15em;text-transform:uppercase;color:var(--accent);transition:gap .3s,color .3s}
.btn-link:hover{gap:15px;color:var(--accent-hi)}

/* ---------- type ---------- */
.kicker{display:block;font-size:10.5px;letter-spacing:.26em;text-transform:uppercase;color:var(--accent);margin-bottom:18px}
.sec-head{max-width:800px;margin-bottom:64px}
.sec-head h2{font-size:clamp(1.95rem,3.7vw,3.1rem);color:#fff;margin-bottom:20px}
.sec-head p{color:var(--muted);font-size:1.03rem}
.lede{font-size:clamp(1rem,1.3vw,1.12rem);color:var(--muted);max-width:38em}

/* ---------- page hero ---------- */
.phero{position:relative;min-height:66vh;display:flex;align-items:flex-end;padding:calc(var(--nav-h) + 90px) 0 76px;z-index:2}
.phero canvas{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;display:block}
.phero .wrap{position:relative;z-index:3}
.phero h1{font-size:clamp(2.3rem,5vw,4.1rem);color:#fff;margin-bottom:22px;max-width:16em}
.phero .lede{margin-bottom:0}
.crumb{font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--slate);margin-bottom:26px}
.crumb a:hover{color:var(--accent)}

/* ---------- home hero ---------- */
.hero{position:relative;min-height:100vh;display:flex;align-items:center;z-index:2}
.hero canvas{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;display:block}
.hero-in{position:relative;z-index:3;width:100%;padding-top:var(--nav-h)}
.hero-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:40px;align-items:center}
.hero h1{font-size:clamp(2.5rem,5.4vw,4.5rem);color:#fff;margin-bottom:26px}
.hero h1 .ac{color:var(--accent)}
.eyebrow{display:inline-flex;align-items:center;gap:11px;font-size:10.5px;letter-spacing:.24em;
  text-transform:uppercase;color:var(--accent);margin-bottom:26px}
.eyebrow::before{content:'';width:34px;height:1px;background:linear-gradient(90deg,transparent,var(--accent))}
.pulse{width:6px;height:6px;border-radius:50%;background:var(--accent-hi);animation:pulse 2.4s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(166,204,228,.6)}70%{box-shadow:0 0 0 11px rgba(166,204,228,0)}100%{box-shadow:0 0 0 0 rgba(166,204,228,0)}}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap;margin:38px 0 50px}
.hero-stats{display:flex;gap:30px;flex-wrap:wrap;padding-top:30px;border-top:1px solid rgba(127,166,196,.18)}
.stat .n{font-family:var(--f-display);font-size:2rem;color:#fff}
.stat .l{font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--accent);margin-top:5px}
.hero-spacer{min-height:520px}

/* ---------- marquee ---------- */
.marquee{position:relative;z-index:5;border-top:1px solid rgba(127,166,196,.14);
  border-bottom:1px solid rgba(127,166,196,.14);background:rgba(14,20,27,.6);
  backdrop-filter:blur(8px);padding:19px 0;overflow:hidden}
.marquee-track{display:flex;gap:58px;width:max-content;animation:slide 34s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
@keyframes slide{to{transform:translateX(-50%)}}
.mq-i{display:flex;align-items:center;gap:12px;white-space:nowrap;font-family:var(--f-display);
  font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:rgba(138,153,168,.7)}
.mq-i .d{width:4px;height:4px;background:var(--accent);border-radius:50%}

/* ---------- cards ---------- */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(127,166,196,.14)}
.cards.two{grid-template-columns:repeat(2,1fr)}
.card{background:linear-gradient(165deg,var(--ink-1),var(--ink));padding:44px 34px 38px;
  position:relative;overflow:hidden;min-height:290px;display:flex;flex-direction:column;transition:background .5s}
.card::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--accent-hi),transparent);opacity:0;transition:opacity .5s}
.card:hover::before{opacity:1}
.card:hover{background:linear-gradient(165deg,var(--ink-2),var(--ink-1))}
.card-num{position:absolute;top:26px;right:30px;font-family:var(--f-display);font-size:12px;color:rgba(127,166,196,.45)}
.card-ic{width:46px;height:46px;margin-bottom:24px;color:var(--accent);transition:color .4s,transform .5s}
.card:hover .card-ic{color:var(--accent-hi);transform:translateY(-3px)}
.card h3{font-size:1.24rem;color:#fff;margin-bottom:13px}
.card p{font-size:.9rem;color:var(--muted);flex:1}
.card .meta{margin-top:20px;font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--accent)}
.card .go{margin-top:20px}

/* ---------- flow ---------- */
.flow{position:relative}
.flow-line{position:absolute;left:27px;top:0;bottom:0;width:1px;background:rgba(127,166,196,.2)}
.flow-fill{position:absolute;left:0;top:0;width:1px;height:0;background:linear-gradient(180deg,var(--accent-hi),var(--accent));box-shadow:0 0 12px rgba(166,204,228,.6)}
.step{display:grid;grid-template-columns:56px 1fr;gap:36px;padding-bottom:56px;position:relative}
.step:last-child{padding-bottom:0}
.step-dot{width:56px;height:56px;border-radius:50%;background:var(--ink);border:1px solid rgba(127,166,196,.35);
  display:flex;align-items:center;justify-content:center;font-family:var(--f-display);font-size:14px;
  color:var(--accent);position:relative;z-index:2;transition:all .5s}
.step.on .step-dot{border-color:var(--accent-hi);color:var(--accent-hi);
  box-shadow:0 0 0 6px rgba(166,204,228,.06),0 0 22px rgba(166,204,228,.28)}
.step-body h3{font-size:1.34rem;color:#fff;margin-bottom:11px}
.step-body p{color:var(--muted);font-size:.96rem;max-width:52em}
.tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.tag{font-size:9.5px;letter-spacing:.15em;text-transform:uppercase;padding:5px 11px;
  border:1px solid rgba(127,166,196,.28);border-radius:2px;color:var(--accent)}

/* ---------- panels ---------- */
.panels{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.panels.five{grid-template-columns:repeat(auto-fit,minmax(255px,1fr))}
.panel{border:1px solid rgba(127,166,196,.18);padding:38px 32px;
  background:linear-gradient(160deg,rgba(19,27,36,.55),rgba(11,15,20,.2));transition:all .45s}
.panel:hover{border-color:rgba(166,204,228,.4);transform:translateY(-4px)}
.panel h3{font-size:1.3rem;color:#fff;margin-bottom:8px;display:inline-block;margin-right:10px}
.pbadge{display:inline-block;vertical-align:2px;font-size:9px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--accent);border:1px solid rgba(127,166,196,.42);padding:3px 8px;border-radius:2px;white-space:nowrap}
.panel .by{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);margin-bottom:18px}
.panel p{font-size:.9rem;color:var(--muted)}

/* ---------- split ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:74px;align-items:center}
.bullets{list-style:none;display:flex;flex-direction:column;gap:26px;margin-top:32px}
.bullets li{display:grid;grid-template-columns:26px 1fr;gap:16px;align-items:start}
.chk{width:26px;height:26px;border:1px solid rgba(166,204,228,.4);border-radius:2px;
  display:flex;align-items:center;justify-content:center;color:var(--accent-hi);font-size:12px}
.bullets strong{display:block;color:#fff;font-family:var(--f-display);font-weight:400;font-size:1.02rem;margin-bottom:4px}
.bullets span{color:var(--muted);font-size:.92rem}

/* ---------- europe rings ---------- */
.euro{position:relative;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center}
.ring{position:absolute;border:1px solid rgba(127,166,196,.16);border-radius:50%}
.ring.r1{inset:8%}.ring.r2{inset:23%}.ring.r3{inset:38%}
.ring.spin{animation:spin 34s linear infinite;border-style:dashed;border-color:rgba(127,166,196,.2)}
@keyframes spin{to{transform:rotate(360deg)}}
.node{position:absolute;display:flex;flex-direction:column;align-items:center;gap:7px}
.node .d{width:9px;height:9px;border-radius:50%;background:var(--accent);animation:pulse 3s infinite}
.node .n{font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.node.hub .d{width:14px;height:14px;background:var(--accent-hi);box-shadow:0 0 20px rgba(166,204,228,.8)}
.node.hub .n{color:#fff}

/* ---------- brand grid (implant systems) ---------- */
.brand-tools{display:flex;gap:14px;flex-wrap:wrap;align-items:center;margin-bottom:34px}
.search{flex:1;min-width:240px;position:relative}
.search input{width:100%;background:rgba(19,27,36,.7);border:1px solid rgba(127,166,196,.24);
  color:var(--paper);font-family:var(--f-body);font-size:.95rem;padding:15px 18px 15px 46px;border-radius:2px;outline:none;transition:border-color .3s}
.search input:focus{border-color:var(--accent-hi)}
.search svg{position:absolute;left:16px;top:50%;transform:translateY(-50%);width:18px;height:18px;color:var(--slate)}
.count{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent)}
.brands{display:grid;grid-template-columns:repeat(auto-fill,minmax(196px,1fr));gap:1px;background:rgba(127,166,196,.13)}
.brands a{background:var(--ink-1);padding:20px 18px;font-family:var(--f-display);font-size:.88rem;
  letter-spacing:.08em;color:var(--muted);transition:all .3s;display:flex;align-items:center;justify-content:space-between;gap:10px}
.brands a:hover{background:var(--ink-2);color:#fff}
.brands a .fg{font-size:8.5px;letter-spacing:.14em;color:var(--accent);opacity:0;transition:opacity .3s}
.brands a:hover .fg{opacity:1}
.brands a.hide{display:none}
.empty{padding:40px 0;color:var(--muted);font-size:.95rem;display:none}
.empty.show{display:block}

/* ---------- case grid ---------- */
.cases{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.case{border:1px solid rgba(127,166,196,.16);background:var(--ink-1);overflow:hidden;transition:all .45s;display:flex;flex-direction:column}
.case:hover{border-color:rgba(166,204,228,.4);transform:translateY(-4px)}
.case .thumb{aspect-ratio:4/3;background:
  radial-gradient(circle at 50% 45%,rgba(127,166,196,.22),transparent 62%),
  linear-gradient(150deg,var(--ink-2),var(--ink));
  display:flex;align-items:center;justify-content:center;position:relative;border-bottom:1px solid rgba(127,166,196,.14)}
.case .thumb span{font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--slate)}
.case .body{padding:24px 24px 26px}
.case h3{font-size:1.02rem;color:#fff;margin-bottom:9px;line-height:1.35}
.case .k{font-size:9.5px;letter-spacing:.17em;text-transform:uppercase;color:var(--accent)}

/* ---------- people (about) ---------- */
.people{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.person{border:1px solid rgba(127,166,196,.18);background:linear-gradient(170deg,rgba(19,27,36,.55),rgba(11,15,20,.25));
  padding:0 0 34px;overflow:hidden;transition:all .45s}
.person:hover{border-color:rgba(166,204,228,.38);transform:translateY(-4px)}
.person .ph{aspect-ratio:1/1;background:radial-gradient(circle at 50% 38%,rgba(127,166,196,.2),transparent 60%),var(--ink-2);
  display:flex;align-items:center;justify-content:center;border-bottom:1px solid rgba(127,166,196,.14);
  overflow:hidden;position:relative}
.person .ph span{position:absolute}
/* portraits: monochrome, duotoned into the brand steel */
.person .ph img{position:relative;z-index:1;font-size:0;color:transparent;
  width:100%;height:100%;object-fit:cover;
  filter:grayscale(1) contrast(1.12) brightness(.76);
  transition:filter .6s cubic-bezier(.2,.7,.3,1),transform .9s cubic-bezier(.2,.7,.3,1)}
.person:hover .ph img{filter:grayscale(1) contrast(1.05) brightness(.92);transform:scale(1.035)}
.person .ph::before{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(175deg,rgba(127,166,196,.42),rgba(19,27,36,.62));
  mix-blend-mode:color}
.person .ph::after{content:'';position:absolute;inset:0;z-index:3;pointer-events:none;
  background:linear-gradient(180deg,rgba(11,15,20,.10) 0%,rgba(11,15,20,0) 30%,rgba(11,15,20,.80) 100%)}

/* any photograph anywhere on the site gets the same treatment */
.mono,.case .thumb img{filter:grayscale(1) contrast(1.12) brightness(.76);
  transition:filter .6s,transform .9s}
.case:hover .thumb img{filter:grayscale(1) contrast(1.02) brightness(1);transform:scale(1.03)}
.case .thumb{overflow:hidden;position:relative}
.case .thumb img{width:100%;height:100%;object-fit:cover;position:relative;z-index:1;font-size:0;color:transparent}
.case .thumb::before{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(175deg,rgba(127,166,196,.42),rgba(19,27,36,.62));mix-blend-mode:color}
.person .ph span{font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--slate)}
.person .pb{padding:28px 28px 0}
.person h3{font-size:1.28rem;color:#fff;margin-bottom:5px}
.person .role{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);margin-bottom:18px}
.person p{font-size:.9rem;color:var(--muted)}
.person ul{list-style:none;margin-top:16px;display:flex;flex-direction:column;gap:8px}
.person li{font-size:.86rem;color:var(--muted);padding-left:16px;position:relative}
.person li::before{content:'';position:absolute;left:0;top:.62em;width:5px;height:5px;background:var(--accent);border-radius:50%}
.todo{border:1px dashed rgba(127,166,196,.4);padding:16px 18px;margin-top:18px;border-radius:2px;
  font-size:.82rem;color:var(--accent);background:rgba(127,166,196,.05)}

/* ---------- form ---------- */
.form{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.field{display:flex;flex-direction:column;gap:9px}
.field.full{grid-column:1/-1}
.field label{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--accent)}
.field input,.field select,.field textarea{
  background:rgba(19,27,36,.7);border:1px solid rgba(127,166,196,.22);color:var(--paper);
  font-family:var(--f-body);font-size:.95rem;padding:14px 16px;border-radius:2px;outline:none;transition:border-color .3s}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--accent-hi)}
.field textarea{min-height:148px;resize:vertical}
.drop{border:1px dashed rgba(127,166,196,.35);padding:34px;text-align:center;border-radius:2px;
  color:var(--muted);font-size:.9rem;transition:all .3s;cursor:pointer}
.drop:hover{border-color:var(--accent-hi);background:rgba(127,166,196,.05);color:var(--paper)}

/* ---------- cta ---------- */
.cta{padding:112px 0;text-align:center;position:relative;border-top:1px solid rgba(127,166,196,.16);z-index:2}
.cta h2{font-size:clamp(2rem,4.2vw,3.3rem);color:#fff;margin-bottom:20px}
.cta p{color:var(--muted);max-width:44em;margin:0 auto 38px}
.contact-row{display:flex;gap:52px;justify-content:center;flex-wrap:wrap;margin-top:54px;padding-top:42px;border-top:1px solid rgba(127,166,196,.16)}
.ci .k{font-size:9.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--accent);margin-bottom:7px}
.ci .v{font-family:var(--f-display);color:#fff;font-size:1.02rem}

/* ---------- footer ---------- */
footer{padding:60px 0 46px;border-top:1px solid rgba(127,166,196,.14);position:relative;z-index:2}
.foot{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:44px}
.foot h4{font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--accent);margin-bottom:18px}
.foot ul{list-style:none;display:flex;flex-direction:column;gap:11px}
.foot a{font-size:.88rem;color:var(--muted);transition:color .3s}
.foot a:hover{color:var(--paper)}
.foot-b{display:flex;justify-content:space-between;align-items:center;gap:22px;flex-wrap:wrap;
  margin-top:46px;padding-top:26px;border-top:1px solid rgba(127,166,196,.12)}
.sig{font-family:var(--f-sig);font-size:1.5rem;color:var(--accent)}
.small{font-size:11px;color:rgba(138,153,168,.55);letter-spacing:.06em}
.foot-legal{display:flex;gap:26px;flex-wrap:wrap;margin-top:44px;padding-top:24px;
  border-top:1px solid rgba(127,166,196,.12)}
.foot-legal a{font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:var(--slate);transition:color .3s}
.foot-legal a:hover{color:var(--accent)}
.foot-legal + .foot-b{margin-top:22px;padding-top:22px}

/* ---------- SMOP ---------- */
.smop-sec{background:
  radial-gradient(ellipse 70% 50% at 50% 0%,rgba(127,166,196,.13),transparent 70%),
  linear-gradient(180deg,rgba(19,27,36,.6),transparent)}
.panels.four{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.smop-flow{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;
  background:rgba(127,166,196,.16);border:1px solid rgba(127,166,196,.16)}
.sf{background:var(--ink-1);padding:30px 24px 26px;display:flex;flex-direction:column;gap:14px;
  transition:background .4s}
.sf:hover{background:var(--ink-2)}
.sf-n{font-family:var(--f-display);font-size:11px;letter-spacing:.2em;color:var(--accent)}
.sf-b h3{font-size:1.05rem;color:#fff;margin-bottom:10px;line-height:1.25}
.sf-b p{font-size:.85rem;color:var(--muted);line-height:1.68}
.sf-t{display:inline-block;margin-top:14px;font-size:9.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--accent);border:1px solid rgba(127,166,196,.35);
  padding:4px 9px;border-radius:2px}
.smop-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
  background:rgba(127,166,196,.16);border:1px solid rgba(127,166,196,.16)}
.ss{background:var(--ink-1);padding:28px 24px;text-align:center}
.ss .n{font-family:var(--f-display);font-size:2.1rem;color:#fff;line-height:1.1}
.ss .l{font-size:9.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--accent);
  margin-top:9px;line-height:1.7}
@media(max-width:820px){.smop-stats{grid-template-columns:repeat(2,1fr)}}
.smop-vs{display:grid;grid-template-columns:1fr 1fr;gap:1px;margin-top:44px;
  background:rgba(127,166,196,.16);border:1px solid rgba(127,166,196,.16)}
.vs-col{padding:30px 30px 34px}
.vs-col.old{background:var(--ink);opacity:.72}
.vs-col.new{background:radial-gradient(circle at 50% 0%,rgba(127,166,196,.13),transparent 70%),var(--ink-2)}
.vs-h{font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--slate);
  margin-bottom:20px;padding-bottom:14px;border-bottom:1px solid rgba(127,166,196,.16)}
.vs-col.new .vs-h{color:var(--accent)}
.vs-col ul{list-style:none;display:flex;flex-direction:column;gap:13px}
.vs-col li{font-size:.89rem;color:var(--muted);line-height:1.6;padding-left:24px;position:relative}
.vs-col.old li::before{content:'\00d7';position:absolute;left:0;top:-1px;color:var(--slate);font-size:1.1rem}
.vs-col.new li::before{content:'\2713';position:absolute;left:0;top:0;color:var(--accent);font-size:.86rem}
.vs-col.new li{color:var(--paper)}
@media(max-width:1080px){.smop-flow{grid-template-columns:repeat(2,1fr)}}
@media(max-width:720px){
  .smop-flow{grid-template-columns:1fr}
  .smop-vs{grid-template-columns:1fr}
}

/* ---------- sterilisation protocol ---------- */
.steri{margin-top:46px;border:1px solid rgba(127,166,196,.22);background:var(--ink-1)}
.steri-head{padding:34px 36px 0}
.steri-head h3{font-size:1.45rem;color:#fff;margin-bottom:10px}
.steri-head p{color:var(--muted);font-size:.9rem}
.steri-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin-top:30px;
  background:rgba(127,166,196,.14);border-top:1px solid rgba(127,166,196,.14)}
.steri-step{background:var(--ink-1);padding:26px 24px}
.steri-step .sn{font-family:var(--f-display);font-size:10px;letter-spacing:.18em;color:var(--accent)}
.steri-step h4{font-size:1.02rem;color:#fff;margin:9px 0 9px}
.steri-step p{font-size:.85rem;color:var(--muted);line-height:1.65}
.steri-cycle{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(127,166,196,.14)}
.cyc{background:var(--ink-1);padding:30px 24px;text-align:center}
.cyc.main{background:radial-gradient(circle at 50% 30%,rgba(127,166,196,.16),transparent 70%),var(--ink-2)}
.cyc .lab{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--slate);margin-bottom:12px}
.cyc.main .lab{color:var(--accent)}
.cyc .big{font-family:var(--f-display);font-size:2.1rem;color:#fff;line-height:1.1}
.cyc.main .big{font-size:2.7rem}
.cyc .big span{font-size:.5em;color:var(--accent)}
.cyc .sub{font-size:11px;letter-spacing:.06em;color:var(--muted);margin-top:12px}
.steri-warn{padding:28px 36px 34px;border-top:1px solid rgba(127,166,196,.14);
  display:flex;flex-direction:column;gap:12px}
.steri-warn p{font-size:.88rem;color:var(--muted);line-height:1.7}
.steri-warn strong{color:var(--paper);font-weight:400}
@media(max-width:900px){
  .steri-grid{grid-template-columns:repeat(2,1fr)}
  .steri-cycle{grid-template-columns:1fr}
}
@media(max-width:560px){.steri-grid{grid-template-columns:1fr}}
@media print{
  .steri{border-color:#999;background:#fff;color:#000}
  .steri-step,.cyc,.cyc.main{background:#fff}
  .steri-head h3,.steri-step h4,.cyc .big,.steri-warn strong{color:#000}
  .steri-step p,.steri-warn p,.cyc .sub,.steri-head p{color:#333}
}

/* ---------- legal documents ---------- */
.lg-wrap{display:grid;grid-template-columns:250px 1fr;gap:70px;align-items:start}
.lg-toc{position:sticky;top:calc(var(--nav-h) + 28px)}
.lg-upd{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--slate);
  line-height:2;padding-bottom:18px;margin-bottom:18px;border-bottom:1px solid rgba(127,166,196,.16)}
.lg-upd strong{color:var(--accent);font-weight:400}
.lg-toc ol{list-style:none;counter-reset:t;display:flex;flex-direction:column;gap:10px}
.lg-toc li{counter-increment:t;font-size:.82rem;line-height:1.45}
.lg-toc li::before{content:counter(t,decimal-leading-zero);margin-right:10px;color:var(--slate);
  font-family:var(--f-display);font-size:10px;letter-spacing:.1em}
.lg-toc a{color:var(--muted);transition:color .3s}
.lg-toc a:hover{color:var(--accent-hi)}
.lg-doc{max-width:52em}
.lg-sec{padding-bottom:44px;margin-bottom:44px;border-bottom:1px solid rgba(127,166,196,.1);scroll-margin-top:calc(var(--nav-h) + 24px)}
.lg-sec:last-of-type{border-bottom:none}
.lg-sec h2{font-size:1.42rem;color:#fff;margin-bottom:20px;display:flex;gap:16px;align-items:baseline;
  scroll-margin-top:calc(var(--nav-h) + 24px)}
.lg-n{font-family:var(--f-display);font-size:11px;letter-spacing:.16em;color:var(--accent);flex:none}
.lg-doc p{color:var(--muted);font-size:.94rem;margin-bottom:16px}
.lg-doc p:last-child{margin-bottom:0}
.lg-doc a{color:var(--accent);text-decoration:underline;text-underline-offset:3px;
  text-decoration-color:rgba(127,166,196,.4);transition:color .3s}
.lg-doc a:hover{color:var(--accent-hi)}
.lg-doc strong{color:var(--paper);font-weight:400}
.lg-doc em{color:var(--paper);font-style:italic}
.lg-list{list-style:none;display:flex;flex-direction:column;gap:12px;margin:4px 0 18px}
.lg-list li{font-size:.92rem;color:var(--muted);padding-left:20px;position:relative;line-height:1.7}
.lg-list li::before{content:'';position:absolute;left:0;top:.68em;width:6px;height:1px;background:var(--accent)}
.lg-table{width:100%;border-collapse:collapse;margin:6px 0 18px;font-size:.86rem}
.lg-table th{text-align:left;font-family:var(--f-display);font-weight:400;font-size:10px;
  letter-spacing:.18em;text-transform:uppercase;color:var(--accent);padding:0 16px 12px 0;
  border-bottom:1px solid rgba(127,166,196,.24)}
.lg-table td{color:var(--muted);padding:13px 16px 13px 0;vertical-align:top;
  border-bottom:1px solid rgba(127,166,196,.1);line-height:1.6}
.lg-box{border:1px solid rgba(127,166,196,.22);background:rgba(19,27,36,.42);padding:24px 26px;margin:6px 0 18px}
.lg-box p{margin-bottom:0;line-height:1.9}
.lg-note{border-left:2px solid var(--accent);background:rgba(127,166,196,.07);padding:18px 22px;
  margin:6px 0 18px;font-size:.87rem;color:var(--muted);line-height:1.7}
.lg-foot{margin-top:8px;border-top:1px solid rgba(127,166,196,.16);padding-top:28px}
@media(max-width:900px){
  .lg-wrap{grid-template-columns:1fr;gap:38px}
  .lg-toc{position:static}
}

/* ---------- reveal ---------- */
.rv{opacity:0;transform:translateY(26px);transition:opacity .9s cubic-bezier(.2,.7,.3,1),transform .9s cubic-bezier(.2,.7,.3,1)}
.rv.in{opacity:1;transform:none}

/* ---------- responsive ---------- */
@media(max-width:1400px){
  .nav-links{gap:15px}
  .nav-links a{font-size:10px;letter-spacing:.1em}
  .nav-right{gap:12px}
  .brand .wm .w1{font-size:17px;letter-spacing:.17em}
  .brand img{height:40px}
}
@media(max-width:1220px){
  .nav-links{gap:11px}
  .nav-links a{font-size:9.5px;letter-spacing:.07em}
  .nav .btn-primary{padding:12px 18px;font-size:10.5px}
}
@media(max-width:1180px){
  .langs{display:none}          /* the mobile menu carries the languages */
}
@media(max-width:1180px){
  .nav-links{display:none}
  .burger{display:block}
}
@media(max-width:1024px){
  .hero-grid{grid-template-columns:1fr}
  .hero-spacer{display:none}
  .hero canvas{opacity:.34}
  .cards,.panels,.cases,.people{grid-template-columns:repeat(2,1fr)}
  .split{grid-template-columns:1fr;gap:50px}
  .foot{grid-template-columns:1fr 1fr}
}
@media(max-width:680px){
  :root{--nav-h:74px}
  .sec{padding:86px 0}
  .wrap{padding:0 20px}
  .cards,.panels,.cases,.people,.form,.foot{grid-template-columns:1fr}
  .brand img{height:38px}
  .brand .wm .w1{font-size:15px;letter-spacing:.16em}
  .brand .wm .w2 .t{font-size:6.5px;letter-spacing:.22em}
  .brand .wm .w2 .s{font-size:12px}
  .langs{display:none}
  .nav-right .btn{display:none}
  .hero-stats{gap:26px}
  .hero-cta .btn{width:100%;justify-content:center}
  .step{grid-template-columns:44px 1fr;gap:22px}
  .step-dot{width:44px;height:44px;font-size:12px}
  .flow-line{left:21px}
  .contact-row{gap:28px}
  .phero{min-height:52vh;padding:calc(var(--nav-h) + 60px) 0 54px}
}
@media(prefers-reduced-motion:reduce){
  *{animation-duration:.01ms!important;transition-duration:.01ms!important}
  .rv{opacity:1;transform:none}
}

/* ============================================================
   CASE UPLOADER
   ============================================================ */
.uploader{border:1px dashed rgba(127,166,196,.38);border-radius:3px;background:rgba(19,27,36,.35);
  padding:44px 30px;text-align:center;transition:all .3s;cursor:pointer;position:relative}
.uploader:hover,.uploader.over{border-color:var(--accent-hi);background:rgba(127,166,196,.07)}
.uploader.over{transform:scale(1.005)}
.uploader.reading{border-color:var(--accent-hi);background:rgba(127,166,196,.07)}
.uploader.reading::after{content:'Reading the folder…';position:absolute;inset:0;
  display:flex;align-items:center;justify-content:center;background:rgba(11,15,20,.86);
  font-family:var(--f-display);font-size:12px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--accent);z-index:4}
.uploader input[type=file]{display:none}
.up-ic{width:42px;height:42px;margin:0 auto 16px;color:var(--accent)}
.uploader h4{font-size:1.05rem;color:#fff;margin-bottom:8px;letter-spacing:0}
.uploader p{font-size:.86rem;color:var(--muted);max-width:40em;margin:0 auto}
.up-or{display:flex;gap:10px;justify-content:center;margin-top:18px;flex-wrap:wrap}
.up-or button{font-family:var(--f-display);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
  background:transparent;border:1px solid rgba(127,166,196,.3);color:var(--paper);
  padding:10px 18px;border-radius:2px;cursor:pointer;transition:all .3s}
.up-or button:hover{border-color:var(--accent-hi);background:rgba(127,166,196,.12)}
.up-hint{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--slate);margin-top:16px}

.up-list{margin-top:20px;display:none;flex-direction:column;gap:1px;background:rgba(127,166,196,.14);
  border:1px solid rgba(127,166,196,.14)}
.up-list.on{display:flex}
.up-row{background:var(--ink-1);padding:13px 16px;display:grid;grid-template-columns:26px 1fr auto 26px;
  gap:14px;align-items:center;position:relative;overflow:hidden}
.up-row .ft{width:26px;height:26px;color:var(--accent);opacity:.8}
.up-row .nm{min-width:0}
.up-row .nm b{display:block;font-weight:400;font-size:.86rem;color:var(--paper);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.up-row .nm small{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--slate)}
.up-row .sz{font-family:var(--f-display);font-size:.82rem;color:var(--muted);white-space:nowrap}
.up-row .rm{background:none;border:none;color:var(--slate);cursor:pointer;font-size:17px;line-height:1;
  padding:4px;transition:color .25s}
.up-row .rm:hover{color:#E06B6B}
.up-row .bar{position:absolute;left:0;bottom:0;height:2px;width:0;background:var(--accent-hi);
  box-shadow:0 0 8px rgba(166,204,228,.7);transition:width .25s linear}
.up-row.bad{background:rgba(70,26,26,.35)}
.up-row.bad .nm small{color:#E06B6B}
.up-row.done .bar{width:100%!important;background:#6FBF8A;box-shadow:none}

.up-sum{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;
  margin-top:16px;padding-top:16px;border-top:1px solid rgba(127,166,196,.14);display:none}
.up-sum.on{display:flex}
.up-sum .t{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
.up-warn{margin-top:14px;padding:13px 16px;border:1px solid rgba(224,107,107,.35);
  background:rgba(224,107,107,.07);color:#F0B4B4;font-size:.84rem;border-radius:2px;display:none}
.up-warn.on{display:block}

/* ---------- case cards: linked, with sub-line ---------- */
.case.has-link{padding:0}
.case-a{display:flex;flex-direction:column;height:100%;text-decoration:none;color:inherit}
.case .csub{font-size:.84rem;color:var(--muted);margin-top:11px;line-height:1.55}
.case.has-link .body{padding-bottom:26px}
.case.has-link::after{content:'Read the case \2192';display:block;
  font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);
  padding:0 24px 24px;opacity:0;transform:translateY(4px);transition:all .4s}
.case.has-link:hover::after{opacity:1;transform:none}

/* Radiographs, CBCT sections and planning screenshots keep their own tone.
   The duotone is for clinical and product photography — on diagnostic images
   the colour is information, not decoration. */
.case .thumb img.asis,img.asis{filter:none !important}
.case .thumb:has(img.asis)::before{display:none}
.case:hover .thumb img.asis{transform:scale(1.03)}

/* ---------- case detail page ---------- */
.cspec{display:grid;grid-template-columns:repeat(6,1fr);gap:1px;background:rgba(127,166,196,.18);
  border:1px solid rgba(127,166,196,.18)}
.cspec>div{background:var(--ink-1);padding:22px 20px}
.cspec .k{font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--slate);margin-bottom:9px}
.cspec .v{font-size:.94rem;color:#fff;line-height:1.4}

.cfig{margin:56px 0}
.cfig img{width:100%;height:auto;border:1px solid rgba(127,166,196,.18);
  filter:grayscale(1) contrast(1.12) brightness(.82);transition:filter .6s}
.cfig:hover img{filter:grayscale(1) contrast(1.02) brightness(1)}
.cfig img.asis{filter:none}
.cfig figcaption{margin-top:16px;font-size:.85rem;color:var(--muted);max-width:52em;line-height:1.6;
  padding-left:16px;border-left:2px solid rgba(127,166,196,.3)}
.cfig.wide{max-width:none}
.cgrid{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin:56px 0}
.cgrid .cfig{margin:0}

.ctab{width:100%;border-collapse:collapse;margin:26px 0 30px;font-size:.9rem}
.ctab th{text-align:left;font-size:9px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--slate);font-weight:500;padding:0 18px 12px 0;border-bottom:1px solid rgba(127,166,196,.24)}
.ctab td{padding:13px 18px 13px 0;color:var(--muted);border-bottom:1px solid rgba(127,166,196,.1)}
.ctab td:first-child{color:#fff;font-variant-numeric:tabular-nums}
.ctab tbody tr:hover td{color:#fff}

@media(max-width:1024px){.cspec{grid-template-columns:repeat(3,1fr)}}
@media(max-width:680px){
  .cspec{grid-template-columns:repeat(2,1fr)}
  .cgrid{grid-template-columns:1fr}
  .cfig{margin:38px 0}
}

/* planned-vs-placed comparison: equalise two radiographs of different aspect */
.cgrid.compare .cfig img{aspect-ratio:4/3;object-fit:cover;object-position:center}
.cgrid.compare figcaption strong{color:#fff;font-weight:500}

/* case pages — spacing between consecutive prose blocks, and reference lists */
.lg-doc h2{font-size:1.42rem;color:#fff;margin-bottom:18px}
.lg-doc h2:not(:first-child){margin-top:38px}
.lg-doc + .lg-doc{margin-top:48px}
.lg-doc p.refs{font-size:.8rem;line-height:1.95;color:var(--slate)}

/* ---------------------------------------------------------------------------
   Added for the WordPress theme, 30 August 2026.
   Two patterns the static build never needed a class for.
   --------------------------------------------------------------------------- */

/* A skip link. Off-screen until it takes focus, then it lands top-left.
   The static build had no keyboard bypass for the eight-item nav. */
.skip{
  position:absolute; left:-9999px; top:0; z-index:200;
  padding:12px 18px; background:var(--accent,#7FA6C4); color:#0B0F14;
  font:600 14px/1 'Jost','Manrope',system-ui,sans-serif; letter-spacing:.04em;
  text-transform:uppercase; text-decoration:none; border-radius:0 0 4px 0;
}
.skip:focus{ left:0; }

/* Two figures side by side — "planned, then placed". Falls back to a single
   column on narrow screens, where a side-by-side radiograph pair is unreadable
   anyway. */
.cpair{
  display:grid; grid-template-columns:1fr 1fr; gap:22px;
  margin:44px 0;
}
.cpair .cfig{ margin:0; }
@media (max-width:760px){
  .cpair{ grid-template-columns:1fr; gap:16px; }
}