/* DT Nova shared shell (header + footer), v2 25.10.2026: light, editorial, one signal accent.
   Loaded by every page: English (with site.css) and the imported Finnish tree (after /fi/_style.css).
   Scoped to dn-* classes and --dn-* tokens so it never fights the Finnish stylesheet. Light in both colour schemes on purpose. */
@font-face{font-family:"Funnel Display";font-style:normal;font-weight:300 800;font-display:swap;src:url("/assets/fonts/funnel-display.woff2") format("woff2")}
@font-face{font-family:"Funnel Sans";font-style:normal;font-weight:300 800;font-display:swap;src:url("/assets/fonts/funnel-sans.woff2") format("woff2")}
:root{--hh:68px}
.dn-top,.dn-foot,.dn-skip{
  --dn-bg:#F5F5F1;--dn-ink:#161616;--dn-ink-2:#3A3A37;--dn-muted:#66665F;--dn-line:rgba(22,22,22,.12);--dn-accent:#FF4F1A;
  --dn-ease:cubic-bezier(.16,1,.3,1);
  font-family:"Funnel Sans",system-ui,-apple-system,sans-serif;
}
.dn-top *,.dn-foot *{box-sizing:border-box}
.dn-skip{position:absolute;left:-9999px;top:8px;z-index:100;background:var(--dn-ink);color:#fff;padding:10px 14px;border-radius:4px}
.dn-skip:focus{left:12px}
.dn-brand .star{width:18px;height:18px;color:var(--dn-accent);flex:none;display:block;transition:transform .6s var(--dn-ease)}

/* ---------- header ---------- */
.dn-top{position:sticky;top:0;z-index:60;background:var(--dn-bg);color:var(--dn-ink);border-bottom:1px solid transparent;
  transition:border-color .3s var(--dn-ease)}
.dn-top.is-stuck{border-bottom-color:var(--dn-line)}
.dn-bar{max-width:1440px;margin:0 auto;height:var(--hh);padding:0 clamp(18px,3vw,40px);display:flex;align-items:center;gap:20px}
.dn-brand{display:inline-flex;align-items:center;gap:9px;color:var(--dn-ink);text-decoration:none;white-space:nowrap;flex:none;margin:0}
.dn-brand span{font:750 21px/1 "Funnel Display",system-ui,sans-serif;letter-spacing:-.03em}
.dn-brand:hover .star{transform:rotate(45deg)}
.dn-nav{display:flex;align-items:center;gap:2px;margin:0 0 0 auto}
.dn-nav a{color:var(--dn-ink);text-decoration:none;font-size:15.5px;font-weight:500;padding:8px 12px;position:relative}
.dn-nav a::after{content:"";position:absolute;left:12px;right:12px;bottom:4px;height:1.5px;background:currentColor;transform:scaleX(0);transform-origin:left;
  transition:transform .4s var(--dn-ease)}
.dn-nav a:hover::after,.dn-nav a[aria-current]::after{transform:scaleX(1)}
.dn-act{display:flex;align-items:center;gap:8px;flex:none}
.dn-lang{color:var(--dn-muted);text-decoration:none;font-size:14px;font-weight:600;padding:8px 10px}
.dn-lang:hover{color:var(--dn-ink)}
.dn-quote{display:inline-flex;align-items:center;background:var(--dn-accent);color:var(--dn-ink);text-decoration:none;font-size:15px;font-weight:650;
  padding:10px 16px;border-radius:4px;white-space:nowrap;transition:background-color .3s var(--dn-ease),color .3s var(--dn-ease),transform .3s var(--dn-ease)}
.dn-quote:hover{background:var(--dn-ink);color:#fff}
.dn-quote:active{transform:scale(.97)}
.dn-top a:focus-visible,.dn-foot a:focus-visible,.dn-menu summary:focus-visible{outline:2px solid var(--dn-accent);outline-offset:3px}
/* mobile menu: details/summary, no framework */
.dn-menu{position:relative;display:none;background:none;padding:0;margin:0;box-shadow:none;border-radius:0}
.dn-menu summary{list-style:none;cursor:pointer;width:44px;height:44px;display:grid;place-items:center}
.dn-menu summary::-webkit-details-marker{display:none}
.dn-burger,.dn-burger::before{display:block;width:20px;height:2px;background:var(--dn-ink);position:relative;transition:transform .4s var(--dn-ease)}
.dn-burger{transform:translateY(-4px)}
.dn-burger::before{content:"";position:absolute;left:0;top:8px}
.dn-menu[open] .dn-burger{transform:translateY(0) rotate(45deg)}
.dn-menu[open] .dn-burger::before{transform:translateY(-8px) rotate(-90deg)}
.dn-panel{position:fixed;left:0;right:0;top:var(--hh);bottom:0;background:var(--dn-bg);padding:12px clamp(18px,3vw,40px) 32px;display:flex;flex-direction:column;
  overflow-y:auto;animation:dn-drop .45s var(--dn-ease)}
.dn-panel a{color:var(--dn-ink);text-decoration:none;font:700 clamp(34px,10vw,44px)/1.1 "Funnel Display",system-ui,sans-serif;letter-spacing:-.035em;padding:8px 0}
.dn-panel .dn-panel-sub{font:500 17px/1.3 "Funnel Sans",system-ui,sans-serif;letter-spacing:0;color:var(--dn-muted);padding:10px 0}
.dn-panel .dn-panel-sub[hreflang]{margin-top:18px;border-top:1px solid var(--dn-line);padding-top:22px}
.dn-panel .dn-panel-cta{margin-top:auto;background:var(--dn-accent);color:var(--dn-ink);text-align:center;font:650 18px/1 "Funnel Sans",system-ui,sans-serif;
  letter-spacing:0;padding:18px;border-radius:4px}
@keyframes dn-drop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@media (max-width:900px){
  .dn-nav{display:none}
  .dn-act{margin-left:auto}
  .dn-menu{display:block}
}
@media (max-width:420px){
  .dn-bar{gap:8px;padding:0 10px 0 18px}
  .dn-act{gap:0}
  .dn-quote{padding:10px 12px;font-size:14px}
  .dn-lang{padding:8px 8px}
}

/* ---------- footer ---------- */
footer.dn-foot{position:relative;padding:clamp(56px,7vw,96px) 0 calc(32px + env(safe-area-inset-bottom));background:var(--dn-bg);color:var(--dn-ink-2);
  font-size:15px;line-height:1.55;border-top:1px solid var(--dn-line)}
footer.dn-foot::before{display:none}
.dn-fwrap{max-width:1440px;margin:0 auto;padding:0 clamp(18px,3vw,40px)}
.dn-ftop{display:grid;grid-template-columns:minmax(240px,1fr) 2.4fr;gap:clamp(32px,5vw,80px)}
.dn-fbrand p{margin:16px 0 0;max-width:32ch;color:var(--dn-ink-2)}
.dn-fbrand .dn-fcontact{margin-top:22px;display:grid;gap:2px;font-size:17px}
.dn-fbrand .dn-fcontact a{color:var(--dn-ink)}
.dn-fcols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px}
.dn-fh{margin:0 0 12px;color:var(--dn-muted);font:500 14px/1.2 "Funnel Sans",system-ui,sans-serif}
footer.dn-foot ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
footer.dn-foot li{margin:0;padding:0;max-width:none}
footer.dn-foot a{color:var(--dn-ink-2);text-decoration:none;transition:color .25s var(--dn-ease)}
footer.dn-foot a:hover{color:var(--dn-ink);text-decoration:underline;text-decoration-color:var(--dn-accent);text-underline-offset:4px;text-decoration-thickness:1.5px}
.dn-fbase{margin-top:clamp(40px,5vw,72px);padding-top:20px;border-top:1px solid var(--dn-line);display:flex;flex-wrap:wrap;gap:6px 24px;
  justify-content:space-between;font-size:13.5px;color:var(--dn-muted)}
.dn-fbase p{margin:0;max-width:80ch}
@media (max-width:980px){.dn-ftop{grid-template-columns:1fr}}
@media (max-width:640px){.dn-fcols{grid-template-columns:1fr 1fr;row-gap:32px}}
@media (prefers-reduced-motion:reduce){.dn-top *,.dn-foot *{transition:none!important;animation:none!important}}