/* Full-screen forest opening and accessible native-dialog navigation. */
html{scroll-padding-top:24px}
.site-header{position:relative;top:auto;backdrop-filter:none;background:#0b0d0c;color:#eeeae2;border:0}
.header-inner{min-height:88px}
.main-nav>a,.language-nav>a{color:#eeeae2}
.main-nav>a:hover,.main-nav>a[aria-current],.language-nav>a:hover{color:#c4d1b5}
.main-nav>a[aria-current]{box-shadow:none}
.main-nav>a::after{content:'';position:absolute;left:0;bottom:5px;width:0;height:1px;background:#c4d1b5;transition:width .35s}
.main-nav>a:hover::after,.main-nav>a:focus-visible::after,.main-nav>a[aria-current]::after{width:100%}
.header-inner{flex-wrap:nowrap;gap:22px}
/* Restore the original 64-unit GP symbol and original lettering scale. */
.site-header .brand-logo,.site-footer .brand-logo{width:calc(204px * 216 / 265)}
.header-actions{gap:18px;margin-left:8px}
.main-nav{gap:25px}
.menu-toggle,.menu-close{align-items:center;justify-content:center;gap:14px;width:auto;height:auto;min-height:44px;padding:10px 14px;border:1px solid #ffffff55;background:transparent;color:#fff;font:inherit;font-size:12px;white-space:nowrap;cursor:pointer}
.js .menu-toggle{display:none}
.has-overlay .menu-toggle{display:none}
.menu-toggle .menu-icon{position:relative;width:24px;height:9px;margin:0;background:none;border-block:1px solid currentColor}
.page-home .site-header{position:absolute;inset:0 0 auto;background:linear-gradient(180deg,#0b0d0cdd,#0b0d0c00)}
.page-home .home-hero{background:#0b1b27;padding:0;isolation:isolate}
.home-hero:before{display:none}
.hero-forest,.hero-forest:after{position:absolute;inset:0;z-index:-1;pointer-events:none}
.hero-forest{display:block;overflow:hidden}
.motion-boot .hero-forest,.motion-boot .site-header :is(.brand,.main-nav>a,.language-nav>a,.header-cta,.menu-toggle){opacity:0}
.hero-forest img{width:100%;height:100%;object-fit:cover;object-position:center}
.hero-forest:after{content:'';z-index:0;background:linear-gradient(90deg,rgba(8,24,35,.83),rgba(8,24,35,.51) 49%,rgba(8,24,35,.16)),linear-gradient(180deg,rgba(8,24,35,.5),transparent 30%,transparent 65%,rgba(8,24,35,.65))}
/* The reference groups the complete introduction on the left of the image. */
.hero-grid{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;min-height:100vh;min-height:100svh;padding-block:144px 64px;gap:0}
/* Keep the opening's original alignment after removing its final sentence. */
.hero-copy{display:block;width:100%;padding:0 0 44.2px}
.hero-copy h1{max-width:850px;margin:0;overflow-wrap:anywhere;font-size:clamp(64px,6vw,104px);font-weight:400;line-height:1;letter-spacing:-.06em}
.hero-title-main{display:block}
.hero-copy h1 em{display:block;color:#67baff;font-size:.63em;font-weight:400;line-height:1.09;letter-spacing:-.055em;margin-top:16px}
.hero-lead{max-width:510px;font-size:14px;line-height:1.85;color:#e0e7ec;margin:28px 0 0;text-wrap:pretty}
.personal-contact{background:var(--navy)}
.personal-contact .cta-inner{display:grid;grid-template-columns:minmax(0,1fr) 320px;grid-template-rows:auto auto;gap:32px 80px;align-items:start}
.personal-contact .cta-copy{grid-column:1;grid-row:1}
.personal-contact .cta-actions{grid-column:1;grid-row:2;align-self:start;display:flex;align-items:center;gap:28px;flex-wrap:wrap}
.personal-contact h2{font-size:clamp(42px,5.4vw,78px)}
.personal-contact .cta-phone{margin:0}
.contact-portrait{grid-column:2;grid-row:1 / 3;width:100%;max-width:320px;margin:0}
.contact-portrait .portrait-frame{aspect-ratio:720 / 847;background:transparent;border:0;border-radius:0;box-shadow:none;overflow:visible}
.contact-portrait .portrait-frame img{filter:none;object-position:center}
.contact-portrait .portrait-frame picture,.about-photo picture{-webkit-mask-image:linear-gradient(#000 72%,transparent 100%);mask-image:linear-gradient(#000 72%,transparent 100%)}
.about-photo{background:transparent;border:0;border-radius:0;box-shadow:none}
/* One continuous dark surface lets the portrait's transparent edge blend in. */
.page-about .page-intro,.about-profile{background:var(--navy);color:#f4f7fa}
.page-about .page-intro{margin-bottom:0;border-bottom:0}
.page-about .breadcrumbs{color:#b8c8d0}
.page-about .page-intro .eyebrow,.page-about .page-intro h1 em,.about-profile .eyebrow{color:var(--ice)}
.page-about .intro-lead,.about-profile p:not(.eyebrow){color:#cad6dc}
.about-profile .credential{border-color:#ffffff26}
.about-profile .credential strong{color:#f4f7fa}
.about-profile .credential>span{color:var(--ice)}
.about-profile .credential div>span{color:#b8c8d0}
.contact-portrait .portrait-caption{padding-top:18px}
.contact-portrait .portrait-caption div>span{font-size:11px}
.contact-portrait .portrait-link{width:44px;height:44px}
/* The dialog is absent without JavaScript; ordinary header links remain usable. */
.menu-overlay{position:fixed;inset:0;width:100%;max-width:none;height:100%;height:100dvh;max-height:none;margin:0;padding:0;border:0;background:#0b0d0c;color:#eeeae2;overflow:auto;overscroll-behavior:contain;color-scheme:dark}
.menu-overlay:not([open]){display:none}
.menu-overlay::backdrop{background:transparent}
.menu-open,.menu-open body{overflow:hidden}
.menu-open .site-header{visibility:hidden}
.menu-toggle,.menu-close{width:44px;height:44px;min-height:44px;padding:10px;border:0}
.menu-close{display:flex;position:fixed;top:max(30px,env(safe-area-inset-top));right:max(var(--gutter),env(safe-area-inset-right));z-index:1;color:#b0b2a9}
.menu-close span{font-size:28px;line-height:1}
.menu-layout{display:block;min-height:100%;padding-block:max(140px,calc(env(safe-area-inset-top) + 110px)) max(40px,env(safe-area-inset-bottom))}
.overlay-nav{max-width:900px;margin:0 auto 40px}
.overlay-nav ol{list-style:none;margin:0;padding:0}
.overlay-nav a{display:grid;grid-template-columns:35px minmax(0,1fr) 30px;align-items:center;gap:15px;padding-block:20px;border-bottom:1px solid #d5dfcd1f;text-decoration:none;font-size:clamp(22px,4vw,50px);font-weight:400;letter-spacing:-.04em;line-height:1.6;overflow-wrap:anywhere;transition:color .3s,border-color .3s}
.overlay-nav a:hover,.overlay-nav a:focus-visible{color:#c4d1b5;border-color:#c4d1b566}
.menu-number{font-family:monospace;font-size:9px;color:#98a38f;letter-spacing:.065em}
.menu-arrow{font-size:24px;color:#a6b39b}
.menu-contact{display:flex;flex-direction:column;align-items:center;text-align:center}
.menu-contact .eyebrow{position:absolute;top:max(46px,calc(env(safe-area-inset-top) + 32px));left:var(--gutter);font-family:monospace;color:#98a38f;font-size:9px;font-weight:400;letter-spacing:.065em;margin:0}
.menu-contact .menu-person{color:#eeeae2;font-size:16px;letter-spacing:-.03em;margin-bottom:8px}
.menu-contact>a{color:#b0b2a9;font-size:14px;text-decoration:none;line-height:2.5;overflow-wrap:anywhere;max-width:100%}
.menu-contact>a:hover,.menu-close:hover{color:#c4d1b5}
.overlay-languages{display:flex;gap:16px;margin-top:16px}
.overlay-languages a{color:#b0b2a9;font-size:12px;min-width:44px;min-height:44px;display:grid;place-items:center;text-decoration:none;border-bottom:1px solid transparent}
.overlay-languages a[aria-current]{border-color:#c4d1b5;color:#eeeae2}
.menu-overlay :focus-visible{outline-color:#c4d1b5}
@media(max-width:1200px){
 .header-actions{margin-left:auto}
 .hero-copy h1{font-size:clamp(60px,6vw,80px)}
 .personal-contact .cta-inner{gap:30px 50px;grid-template-columns:minmax(0,1fr) 280px}
}
@media(max-width:1150px){
 .site-header .brand-logo,.site-footer .brand-logo{width:calc(190px * 216 / 265)}
}
@media(max-width:960px){
 .has-overlay .menu-toggle{display:flex}
 .has-overlay .main-nav{display:none}
 .header-inner{min-height:78px}
 .header-inner{gap:10px}
 .site-header .brand-logo,.site-footer .brand-logo{width:calc(clamp(140px,44vw,172px) * 216 / 265)}
 .header-actions{gap:9px}
 .language-nav{gap:0}
 .language-nav>a{min-width:24px;font-size:9px}
 .header-cta{display:none}
 .hero-forest img{object-position:60% center}
 .hero-forest:after{background:linear-gradient(90deg,#081823d9,#08182375),linear-gradient(180deg,#08182355,transparent 50%,#08182399)}
 .personal-contact .cta-inner{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto;gap:32px}
 .personal-contact .cta-copy{grid-column:1;grid-row:1}
 .contact-portrait{grid-column:1;grid-row:2;max-width:300px}
 .personal-contact .cta-actions{grid-column:1;grid-row:3;gap:22px}
 .personal-contact h2{font-size:clamp(40px,9vw,58px)}
 html:not(.has-overlay) .header-inner{flex-wrap:wrap}
 html:not(.has-overlay) .main-nav{display:flex}
 html:not(.has-overlay) .page-home .hero-grid{padding-top:210px}
}
@media(max-width:760px){
 .hero-grid{padding-block:clamp(245px,32svh,320px) 40px;justify-content:flex-end}
 .hero-copy{padding-bottom:43.6px}
 .hero-copy h1{font-size:clamp(42px,12vw,76px);line-height:1}
 /* The Estonian compound stays one readable word at ordinary phone sizes. */
 html[lang=et] .hero-copy h1{font-size:clamp(29px,10vw,60px)}
 html[lang=et] .hero-copy h1 em{font-size:.76em}
 .hero-copy h1 em{font-size:.64em;margin-top:12px}
 .hero-lead{font-size:13px;line-height:1.8;margin-top:26px;max-width:520px;width:100%}
}
/* The removed English and Finnish sentences occupied two lines on phones. */
@media(max-width:481px){html[lang=fi] .hero-copy{padding-bottom:65.2px}}
@media(max-width:444px){html[lang=en] .hero-copy{padding-bottom:65.2px}}
/* Retain the opening's position when the shorter Estonian service list wraps. */
@media(max-width:465px){html[lang=et] .hero-lead{min-height:3lh}}
@media(min-width:761px) and (max-height:740px){
 .hero-grid{padding-block:120px 48px}
 .hero-copy h1{font-size:clamp(60px,5.6vw,82px)}
}
@media(max-width:960px) and (orientation:landscape) and (max-height:600px){
 .hero-grid{min-height:600px;padding-block:118px 42px;justify-content:center}
 .hero-copy h1{font-size:58px}
 html[lang=et] .hero-copy h1{font-size:clamp(36px,6.6vw,58px)}
}
@media(max-width:370px){
 .header-actions{gap:7px}
 .language-nav>a{min-width:22px}
}
@media(prefers-reduced-motion:reduce){.site-header,.main-nav>a::after{transition:none}.motion-boot .hero-forest,.motion-boot .site-header :is(.brand,.main-nav>a,.language-nav>a,.header-cta,.menu-toggle){opacity:1!important}}
@media print{.menu-overlay,.hero-forest{display:none!important}.hero-grid{min-height:0;padding-block:20px}.home-hero{background:white;color:black}.hero-copy h1 em,.hero-lead{color:black}.menu-open,.menu-open body{overflow:visible}}
@media print{.page-about .page-intro,.about-profile{background:white!important;color:black!important}.page-about .page-intro :is(p,h1 em,.breadcrumbs),.about-profile :is(p,.credential span,.credential strong){color:black!important}}