/* Gemensamma mått för Syvo och Syvo Labs: 4 px-rytm, 44 px minsta kontroll. */
html{overflow-y:scroll;scrollbar-gutter:stable}
:root{--control-height:52px;--control-compact-height:44px;--control-font-size:15px;--control-radius:6px}
body .button{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;min-height:var(--control-height);padding:12px 20px;border-width:1px;border-style:solid;border-radius:var(--control-radius);font-size:var(--control-font-size);font-weight:700;line-height:22.5px;text-align:center;text-decoration:none}
body .text-link,body .back-link{display:inline-flex;align-items:center;gap:6px;min-height:var(--control-compact-height);padding-block:10px;border-bottom:0;font-size:var(--control-font-size);font-weight:600;line-height:24px;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.site-header{--header-background:var(--lab,var(--ink));position:relative;z-index:10;border-bottom:1px solid var(--line)}
.site-header .shared-header{width:min(1200px,calc(100% - 80px));min-height:110px;margin-inline:auto;padding:0;border:0;display:flex;flex-wrap:nowrap;align-items:center;justify-content:space-between;gap:24px}
.site-header .brand-lockup{display:block;flex-shrink:0}
.site-header .header-logo{display:block;width:256px;line-height:0}
.site-header .header-logo img{display:block;width:auto;height:48px;max-width:none}
.site-header nav{gap:36px;font-size:15px;font-weight:600}
.site-header nav>a{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 0;font-size:15px;font-weight:600;line-height:24px;text-decoration:none}
.site-header nav>a:hover{text-decoration:underline;text-underline-offset:4px}
.site-header nav .nav-contact{box-sizing:border-box;width:104px;min-height:48px;margin:0;padding:10px 16px;border:1px solid var(--olive,var(--ink));border-radius:6px;background:var(--lime);color:var(--olive,var(--ink));line-height:24px;text-decoration:none}
.site-header nav .nav-contact:hover,.site-header nav .nav-contact[aria-current]{background:var(--paper);color:var(--olive,var(--ink));text-decoration:none}
.brand-switch{box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;width:119px;height:44px;padding:3px;gap:3px;border:1px solid var(--line);border-radius:5px;line-height:1}
.brand-switch a{box-sizing:border-box;display:flex;align-items:center;justify-content:center;width:54px;min-width:0;height:36px;padding:0;border-radius:2px;font:12px/18px ui-monospace,SFMono-Regular,Consolas,monospace;text-decoration:none}
.shared-footer{border-top:1px solid var(--line);padding:48px 0;background:var(--lab,var(--ink));color:var(--paper)}
.shared-footer .shared-footer-row{width:min(1200px,calc(100% - 80px));margin-inline:auto;display:grid;grid-template-columns:128px minmax(0,1fr);gap:32px;align-items:center;min-height:64px}
.shared-footer .footer-symbol{display:block;width:128px;margin:0;line-height:0}
.shared-footer .footer-symbol img{display:block;width:auto;height:52px;max-width:none}
.shared-footer .footer-copy{display:flex;flex-direction:column;justify-content:center;min-height:64px;min-width:0}
.shared-footer .footer-tagline{margin:0;color:var(--paper);font-size:14px;font-weight:400;line-height:20px;letter-spacing:0;white-space:nowrap}
.shared-footer .footer-links{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:24px;min-height:44px;margin:0}
.shared-footer .footer-links a{display:inline-flex;align-items:center;min-height:44px;font-size:14px;line-height:20px}
.shared-footer a:focus-visible{outline-color:var(--lime)}
@media(max-width:1000px){.site-header .shared-header,.shared-footer .shared-footer-row{width:calc(100% - 48px)}}
@media(min-width:761px){.site-header .menu-toggle{display:none}.site-header nav{display:flex;position:static;padding:0;border:0;flex-direction:row;flex-wrap:nowrap;align-items:center}}
@media(max-width:760px){
 .site-header .shared-header{width:calc(100% - 40px);min-height:90px;padding:18px 0;gap:16px}
 .site-header .header-logo{width:202px}
 .site-header .header-logo img{height:38px}
 .site-header .menu-toggle:not([hidden]){box-sizing:border-box;display:inline-flex;align-items:center;justify-content:space-between;gap:12px;width:84px;flex-shrink:0;min-height:44px;padding:8px 10px;border-radius:6px;font:12px/18px ui-monospace,SFMono-Regular,Consolas,monospace}
 .site-header .menu-toggle span{margin:0;font-size:21px;line-height:1}
 .site-header nav,.has-menu .site-header nav{display:none;position:absolute;inset:100% 0 auto;flex-basis:auto;flex-direction:column;align-items:stretch;gap:8px;width:100%;padding:12px 20px 24px;border-top:0;border-bottom:1px solid var(--line);background:var(--header-background)}
 .site-header nav.is-open,.has-menu .site-header nav.is-open{display:flex}
 .site-header nav>a{justify-content:flex-start;padding:12px 16px}
 .site-header nav .nav-contact{width:104px;margin:0;padding:10px 16px;justify-content:center}
 html:not(.js) .site-header .nav .menu-toggle{display:none}
 html:not(.js) .site-header .nav{flex-wrap:wrap}
 html:not(.js) .site-header .nav nav,body:not(.has-menu) .site-header .site-nav{display:flex;position:static;padding:4px 0 0;border:0;flex-direction:row;flex-wrap:wrap;gap:8px 20px}
 html:not(.js) .site-header .nav nav>a{padding:10px 0}
 .shared-footer{padding:40px 0}
 .shared-footer .shared-footer-row{width:calc(100% - 40px);grid-template-columns:128px minmax(0,1fr);justify-content:space-between;grid-template-rows:64px 64px;gap:16px 24px}
 .shared-footer .footer-copy{grid-column:1/-1;grid-row:2;min-height:64px}
}

@media(max-width:360px){.site-header .header-logo{width:160px}.site-header .header-logo img{height:30px}}

/* Fast ordning och identiska kolumner ger växlingen samma position på båda sajterna. */
@media(min-width:761px){
 .site-header .shared-header nav{display:grid;grid-template-columns:119px 72px 96px 104px;gap:24px;align-items:center}
 .site-header .shared-header nav>a{width:100%}
}
@media(min-width:761px) and (max-width:1000px){.site-header .shared-header nav{gap:12px}}
@media(max-width:760px){
 .site-header .shared-header nav{grid-template-columns:119px minmax(0,1fr);gap:12px 24px;align-items:center}
 .site-header .shared-header nav.is-open{display:grid}
 .site-header .shared-header nav>a{justify-content:center;padding:12px 0}
 .site-header .shared-header nav .nav-contact{padding:10px 16px}
 html:not(.js) .site-header .nav nav,body:not(.has-menu) .site-header .shared-header .site-nav{display:grid}
}

@media(min-width:761px) and (max-width:900px){.site-header .header-logo{width:236px}.site-header .header-logo img{height:44px}}
