/* Self-hosted Canela: converted from supplied original fonts, with native weight/style mapping. */
@font-face {
  font-family: "Canela";
  src: url("../assets/fonts/CanelaWeb-Black.woff2") format("woff2");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Canela";
  src: url("../assets/fonts/CanelaWeb-BlackItalic.woff2") format("woff2");
  font-weight: 900;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Canela";
  src: url("../assets/fonts/CanelaWeb-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Canela";
  src: url("../assets/fonts/CanelaWeb-Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Canela";
  src: url("../assets/fonts/CanelaWeb-MediumItalic.woff2") format("woff2");
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Canela";
  src: url("../assets/fonts/CanelaWeb-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Canela";
  src: url("../assets/fonts/CanelaWeb-RegularItalic.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Canela";
  src: url("../assets/fonts/CanelaWeb-Thin.woff2") format("woff2");
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Canela";
  src: url("../assets/fonts/CanelaWeb-ThinItalic.woff2") format("woff2");
  font-weight: 100;
  font-style: italic;
  font-display: swap;
}

/*
  DentalDoor — shared site system
  Shared across index.html, demo.html and contact.html.
  Contains first-paint safeguards and the cross-page route transition layer.
*/


/* Shared DentalDoor design tokens. Page styles consume these rather than redefining core typography/brand primitives. */
:root{
  --dd-menu-background:
    radial-gradient(circle at 78% 18%, rgba(66,180,211,.27), transparent 35%),
    radial-gradient(circle at 18% 82%, rgba(92,61,173,.20), transparent 42%),
    linear-gradient(135deg,#0b2d3c 0%,#0d4055 48%,#116d88 100%);
  --dd-preloader-light-background:#dbeaf4;
  --dd-preloader-background:var(--dd-menu-background);
  --dd-preloader-icon-filter:brightness(0) invert(1);
  /* Light preloader option: uncomment these two declarations to restore it.
  --dd-preloader-background:var(--dd-preloader-light-background);
  --dd-preloader-icon-filter:none;
  */
  --dd-serif:"Canela","Iowan Old Style","Palatino Linotype",Palatino,Georgia,"Times New Roman",serif;
  --dd-sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --dd-ink:#0a2c39;
  --dd-muted:#6d8993;
  --dd-line:rgba(19,70,87,.12);
  --dd-cyan:#78d6ee;
  --dd-navy:#123746;
  --dd-surface:#f3f8fa;
  --dd-white:#fff;
  --dd-ease:cubic-bezier(.76,0,.18,1);
  --dd-pill-radius:999px;
}
:where(.dd-site),:where(.dd-site) *,:where(.dd-site) *::before,:where(.dd-site) *::after{box-sizing:border-box;}
:where(.dd-site) a{color:inherit;}
:where(.dd-site) button,:where(.dd-site) input,:where(.dd-site) select,:where(.dd-site) textarea{font:inherit;}
html.dd-site-host{scroll-behavior:smooth;}
@media(prefers-reduced-motion:reduce){html.dd-site-host{scroll-behavior:auto!important;}}
/* ===== dd-critical-first-paint-stability-v2 ===== */
/* First-paint stability: these rules must exist before body markup is parsed.
   They prevent a restored mid-page scroll position from painting late-stage
   overrides one frame too late. */
.dd-title-line{display:block;}
@media (min-width:701px){
  html body .dd-site-logo{
    /* Geometry is JS-owned again: the brand flies from the hero anchor
       to this slot (positionLogo in js/home.js). These three were pinned
       !important when the flight was removed, which is why re-enabling it
       alone did nothing - the inline styles were being overridden. The
       opacity / visibility pins below stay: they are the guarantee the
       brand can never disappear, and they do not fight the movement. */
    opacity:1 !important;
    visibility:visible !important;
    transform:translateZ(0) !important;
  }
  html body .dd-site-logo img{opacity:1 !important;visibility:visible !important;}
}
/* DentalDoor owns the route animation; browser View Transition snapshots are disabled. */
.dd-site-logo,.dd-page-logo,.dd-site-nav,.dd-page-actions{view-transition-name:none !important;}
::view-transition-group(root),::view-transition-old(root),::view-transition-new(root),
::view-transition-group(dd-brand-logo),::view-transition-old(dd-brand-logo),::view-transition-new(dd-brand-logo),
::view-transition-group(dd-top-actions),::view-transition-old(dd-top-actions),::view-transition-new(dd-top-actions){
  animation:none !important;
}

/* ===== dd-route-transition-system-v1 ===== */
/* Cross-page transition: Vectr-reference mechanics,independently implemented for DentalDoor. */
.dd-route-transition{position:fixed;inset:0;z-index:99980;pointer-events:none;visibility:hidden;}
.dd-route-transition__shade{position:absolute;inset:0;background:rgba(2,18,26,.70);opacity:0;transition:opacity .32s ease;}
.dd-route-transition__sheet{position:absolute;left:-10vw;top:-4vh;width:120vw;height:108vh;background:#f6fbfc;clip-path:polygon(0 0,92% 0,100% 100%,8% 100%);transform:translate3d(112vw,0,0);transition:transform .66s cubic-bezier(.76,0,.18,1);will-change:transform;}
body.dd-route-out .dd-route-transition{visibility:visible;}
body.dd-route-out .dd-route-transition__shade{opacity:1;}
body.dd-route-out .dd-route-transition__sheet{transform:translate3d(0,0,0);}
body.dd-route-out .dd-site-logo,body.dd-route-out .dd-site-nav{z-index:99990!important;}
@media(prefers-reduced-motion:reduce){.dd-route-transition__shade,.dd-route-transition__sheet{transition-duration:.01ms!important;}}

/* ===== dd-vectr-route-transition-v2 ===== */
/*
  DentalDoor cross-page route transition,tuned from the supplied Vectr reference:
  current page darkens -> destination sweeps in on a diagonal edge -> destination content settles.
  Modern Chromium gets a true cross-document View Transition. The existing overlay remains as fallback.
*/
/* Automatic cross-document View Transitions disabled: DentalDoor uses a deterministic route overlay. */

.dd-site-logo,.dd-page-logo{view-transition-name:dd-brand-logo;}
.dd-site-nav,.dd-page-actions{view-transition-name:dd-top-actions;}

::view-transition-group(root){animation-duration:720ms;animation-timing-function:cubic-bezier(.76,0,.18,1);}
::view-transition-old(root){
  animation:dd-vt-old-page 720ms cubic-bezier(.76,0,.18,1) both;
  z-index:1;
}
::view-transition-new(root){
  animation:dd-vt-new-page 720ms cubic-bezier(.76,0,.18,1) both;
  z-index:2;
  filter:drop-shadow(-28px 18px 38px rgba(8,30,40,.14));
}
::view-transition-group(dd-brand-logo),
::view-transition-group(dd-top-actions){
  animation-duration:720ms;
  animation-timing-function:cubic-bezier(.76,0,.18,1);
  z-index:100;
}
::view-transition-old(dd-brand-logo),::view-transition-new(dd-brand-logo),
::view-transition-old(dd-top-actions),::view-transition-new(dd-top-actions){animation:dd-vt-header-hold 720ms ease both;}
@keyframes dd-vt-old-page{
  0%{opacity:1;filter:brightness(1) saturate(1);transform:none;}
  45%{opacity:.82;filter:brightness(.72) saturate(.82);}
  100%{opacity:.68;filter:brightness(.56) saturate(.74);transform:scale(.994);}
}
@keyframes dd-vt-new-page{
  0%{clip-path:polygon(100% 0,100% 0,100% 100%,82% 100%);transform:translate3d(1.2%,0,0);}
  12%{clip-path:polygon(91% 0,100% 0,100% 100%,69% 100%);}
  100%{clip-path:polygon(-2% 0,100% 0,100% 100%,-24% 100%);transform:none;}
}
@keyframes dd-vt-header-hold{from{opacity:1}to{opacity:1}}

/* Fallback overlay for browsers without cross-document View Transitions. */
.dd-route-transition__sheet,.dd-route-sheet{overflow:hidden;}
.dd-route-transition__preview,.dd-route-preview{
  position:absolute;inset:0;display:flex;align-items:flex-start;justify-content:flex-start;
  padding:clamp(78px,10vh,124px) clamp(28px,7vw,118px);
  opacity:0;transform:translate3d(16vw,-1.5vh,0) scale(1.20);transform-origin:left top;
  transition:opacity .30s ease .18s,transform .64s cubic-bezier(.76,0,.18,1) .10s;
  color:#0a2c39;
}
.dd-route-transition__preview h2,.dd-route-preview h2{
  margin:0;max-width:900px;font-family:var(--dd-serif,Georgia,serif);font-size:clamp(58px,7.2vw,116px);
  font-weight:400;line-height:.88;letter-spacing:-.055em;
}
body.dd-route-out .dd-route-transition__preview,body.dd-route-out .dd-route-preview{opacity:.92;transform:none;}

@media(prefers-reduced-motion:reduce){
  ::view-transition-old(root),::view-transition-new(root),::view-transition-group(root),
  ::view-transition-group(dd-brand-logo),::view-transition-group(dd-top-actions){animation-duration:.01ms!important;}
  .dd-route-transition__preview,.dd-route-preview{transition-duration:.01ms!important;transform:none!important;}
}

/* ===== dd-stable-load-route-fix-v1 ===== */
/* Normal loads/reloads render in their final state. Only a freshly consumed route intent may animate in. */
html:not(.dd-arriving) .dd-route-sheet{
  transform:translate3d(-112vw,0,0) !important;
  transition:none !important;
}
html:not(.dd-arriving) .dd-enter-content,
html:not(.dd-arriving) .dd-enter-secondary,
html:not(.dd-arriving) .dd-enter-tertiary,
html:not(.dd-arriving) .dd-field,
html:not(.dd-arriving) .dd-submit,
html:not(.dd-arriving) .dd-form-note{
  opacity:1 !important;
  filter:none !important;
  transform:none !important;
  transition:none !important;
}
html:not(.dd-arriving) .dd-page-logo{
  left:24px !important;
  top:20px !important;
  width:139px !important;
  transform:none !important;
  opacity:1 !important;
  filter:none !important;
  transition:none !important;
}
@media(max-width:900px){html:not(.dd-arriving) .dd-page-logo{width:128px !important;}}
@media(max-width:600px){html:not(.dd-arriving) .dd-page-logo{left:14px !important;top:16px !important;width:116px !important;}}