/* Örsan — full-screen corporate presentation, October 2026. */
:root{--ink:#162b3d;--navy:#082d4b;--orange:#e67429;--soft:#f5f7f8}
body{font-family:"Trebuchet MS",Arial,Helvetica,sans-serif;background:#fff;line-height:1.7}
h1,h2,h3,h4{font-family:Arial,Helvetica,sans-serif;letter-spacing:-.045em}
h2{font-weight:800;font-size:clamp(34px,4.1vw,58px);line-height:1.1}
.kicker{font-size:11px;letter-spacing:.2em;font-weight:700}
.top{position:fixed;inset:0 0 auto;background:transparent;box-shadow:none;border:0;backdrop-filter:none;transition:background .3s,box-shadow .3s;z-index:30}
.top .nav{width:calc(100% - 100px);max-width:1600px;min-height:116px;padding:16px 0;display:flex;flex-wrap:nowrap;gap:30px;border-bottom:1px solid #ffffff40}
.top .nav>a:first-child{margin:0 auto 0 0;flex-shrink:0;background:white;padding:7px 12px;border-radius:2px}
.top .nav .logo{width:185px;height:auto;max-height:69px;object-fit:contain;animation:none}
.top .header-contact{display:none}
.top .nav nav{display:flex;flex-basis:auto;width:auto;gap:25px;margin:0;padding:0;align-items:center;flex-wrap:nowrap}
.top .nav nav a,.top .nav nav a:nth-child(n){min-height:36px;background:transparent;color:#fff;border:0;border-bottom:2px solid transparent;padding:7px 0;border-radius:0;box-shadow:none;font-size:11px;font-weight:700;letter-spacing:.035em;white-space:nowrap;text-transform:uppercase;filter:none}
.top .nav nav a:hover,.top .nav nav a[aria-current]{border-bottom-color:#f69346;background:transparent;color:white;box-shadow:none}
.top .nav-cta{display:inline-flex;background:white;color:#12354d;border:0;border-radius:2px;min-height:37px;padding:10px 14px;font-size:11px;white-space:nowrap}
.top .menu{display:none}
.top.is-compact{background:#082d4bf5;box-shadow:0 4px 24px #00152420}
.top.is-compact .nav{min-height:74px;padding:8px 0;border-bottom-color:transparent}
.top.is-compact .nav .logo{width:130px;max-height:43px}
.top.is-compact .nav nav{margin:0}
html,html:has(.top.is-compact){scroll-padding-top:90px}
.hero{padding:0;background:#163c50;min-height:0}
.hero .hero-grid{width:100%;max-width:none;height:100svh;min-height:640px;margin:0;padding:140px max(100px,8.2vw) 100px;display:flex;align-items:center;isolation:isolate}
.hero-copy{width:100%;max-width:690px;z-index:2;animation:editorial-copy .9s .25s both}
.hero .hero-copy .kicker{color:#fff;margin:0 0 26px;font-size:11px;letter-spacing:.2em;display:flex;align-items:center;gap:15px}
.hero .kicker:before{content:"";display:block;width:38px;height:3px;background:#ef8b42;flex:none}
.hero .hero-copy h1{font-family:"Arial Black",Arial,Helvetica,sans-serif;font-weight:900;font-size:clamp(48px,5.7vw,88px);letter-spacing:-.055em;line-height:.98;color:#fff;margin:0 0 27px;text-shadow:none;max-width:750px}
.hero .hero-copy h1 span{color:#fff}
.hero .hero-copy .lead{color:#fff;font-size:clamp(16px,1.65vw,23px);line-height:1.42;font-weight:400;max-width:490px;margin:0}
.hero-copy .actions{margin-top:30px;gap:22px;align-items:center}
.hero-copy .btn{background:#e97930;color:#fff;border:0;border-radius:2px;box-shadow:none;min-height:45px;font-size:12px;padding:13px 20px}
.hero-copy .outline{color:white;border:0;border-bottom:1px solid #ffffff90;border-radius:0;padding:9px 0;background:transparent;min-height:36px;font-size:12px}
.hero-panel{position:absolute;inset:0!important;width:100%;height:100%;max-width:none;padding:0;background:none;z-index:0;pointer-events:none}
.hero .hero-slideshow{position:absolute;inset:0;border:0;border-radius:0;background:#163c50;overflow:hidden}
.hero .hero-slide-stack{position:absolute;inset:0;height:100%;width:100%}
.hero .hero-slide{inset:0}
.hero .hero-slide>img{position:absolute;inset:0;width:100%;height:100%;max-height:none;object-fit:cover;object-position:center;filter:saturate(.85);animation:none}
.hero .hero-slide.active>img{animation:editorial-pan 9s linear both}
.hero .hero-slideshow:after{background:linear-gradient(90deg,rgba(3,22,34,.77) 0%,rgba(3,25,40,.5) 42%,rgba(3,25,40,.09) 80%),linear-gradient(180deg,#03172490,transparent 30%,transparent 70%,#0317248c);z-index:1}
.hero-slide .image-watermark{display:none}
.hero-panel .small-label,.hero-panel .panel-bottom{display:none}
.hero .hero-caption{position:absolute;left:max(100px,8.2vw);right:auto;bottom:43px;max-width:58%;padding:0;border:0;background:none;z-index:3;gap:26px;display:flex;align-items:center;font-size:12px;letter-spacing:.025em;font-weight:400;color:#fff}
.hero-caption #hero-slide-count{order:-1;font-family:Arial,sans-serif;font-size:12px;color:#fff;border-right:1px solid #ffffff6b;padding-right:24px}
.hero .hero-slider-controls{position:static;display:block;max-width:none;padding:0}
.hero-slider-controls button,.hero-dots{pointer-events:auto}
.hero .hero-slider-controls #hero-prev,.hero .hero-slider-controls #hero-next{position:absolute;top:50%;transform:translateY(-50%);height:42px;width:42px;min-height:0;padding:0;background:transparent;border:1px solid #ffffff50;border-radius:50%;font-size:0;color:white;z-index:4}
.hero #hero-prev{left:24px}.hero #hero-next{right:24px}
.hero #hero-prev:before{content:"‹";font-size:29px;line-height:1}.hero #hero-next:before{content:"›";font-size:29px;line-height:1}
.hero #hero-prev:hover,.hero #hero-next:hover{background:#ffffff25}
.hero .hero-dots{position:absolute;bottom:44px;right:145px;max-width:260px;display:flex;gap:9px;overflow-x:auto;padding:5px 0;z-index:4}
.hero .hero-dots button{width:6px;height:6px;min-width:6px;background:#ffffff66;border:0;border-radius:50%;flex:none}
.hero .hero-dots button[aria-pressed=true]{background:#fff;width:22px;border-radius:4px}
.hero .hero-slider-controls #hero-pause{position:absolute;bottom:35px;right:50px;min-height:32px;padding:7px 10px;border:1px solid #ffffff55;border-radius:2px;background:none;color:#fff;font-size:10px;z-index:4}
.features{background:#fff;color:#233e51;border-bottom:1px solid #e2e7ea}
.feature-grid div{padding-block:25px;font-size:13px;font-weight:600;color:#233e51}
.feature-grid b{color:#cb6526;font-size:11px;font-weight:400;margin-right:16px}
.service-box,.project-card,.articles article,.steps article{border-radius:2px;box-shadow:none}
.service-box summary{min-height:175px}.service-box h3{font-weight:700;letter-spacing:-.025em}
.project-info{border-top:2px solid #e27b37}.project-info h3{font-weight:700;font-family:Arial,Helvetica,sans-serif}
.dark{background:#0c314b}.references-v2{background:#f7f8f8}
.brand-intro{animation-duration:1s}
@keyframes editorial-copy{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
@keyframes editorial-pan{from{transform:scale(1.025)}to{transform:scale(1.075)}}
@media(min-width:1600px){.hero .hero-copy h1{font-size:96px}}
@media(max-width:1200px){.top .nav{width:calc(100% - 56px);gap:20px}.top .nav .logo{width:155px}.top .nav nav{gap:17px}.top .nav nav a,.top .nav nav a:nth-child(n){font-size:10px}.top .nav-cta{font-size:10px;padding:10px}.hero .hero-grid{padding-inline:8vw}.hero .hero-copy h1{font-size:7vw}.hero .hero-caption{left:8vw}}
@media(max-width:960px){.top .nav,.top.is-compact .nav{width:calc(100% - 40px);min-height:84px;padding:10px 0;gap:15px;position:relative}.top .nav .logo{width:150px;max-height:56px}.top .menu{display:block;color:#fff;background:transparent;border:1px solid #ffffff60;border-radius:2px;padding:8px 12px;min-height:38px;font-size:12px;margin:0}.top .nav-cta{display:none}.top .nav nav{display:none;position:absolute;top:100%;left:-20px;right:-20px;width:auto;flex-basis:auto;flex-direction:column;align-items:stretch;gap:0;padding:15px 28px 24px;background:#082d4b}.top .nav nav.open{display:flex}.top .nav nav a,.top .nav nav a:nth-child(n){font-size:12px;justify-content:flex-start;padding:14px 0;border-bottom:1px solid #ffffff25}.top.is-compact .nav .logo{width:125px}.hero .hero-grid{padding:180px 8vw 150px;min-height:100svh}.hero .hero-copy h1{font-size:clamp(48px,8vw,76px)}.hero .hero-caption{bottom:40px;max-width:48%;font-size:10px;gap:12px}.hero .hero-dots{right:105px;max-width:220px;gap:7px}.hero .hero-slider-controls #hero-pause{right:24px}.hero #hero-prev{left:10px}.hero #hero-next{right:10px}.hero .hero-slider-controls #hero-prev,.hero .hero-slider-controls #hero-next{width:28px;height:38px;border:0}}
@media(max-width:600px){.top .nav{min-height:82px}.hero .hero-grid{padding:160px 28px 160px;min-height:100svh}.hero-copy{max-width:100%}.hero .hero-copy h1{font-size:clamp(40px,10.5vw,62px);line-height:1.02;letter-spacing:-.05em}.hero .hero-copy .kicker{font-size:9px;letter-spacing:.13em;gap:10px;margin-bottom:22px}.hero .hero-copy .lead{font-size:17px;max-width:320px;line-height:1.5}.hero-copy .actions{flex-direction:row;gap:18px;margin-top:28px}.hero-copy .actions .btn,.hero-copy .actions .outline{width:auto;font-size:11px;padding-inline:13px}.hero-copy .actions .outline{padding-inline:0}.hero .hero-slideshow:after{background:linear-gradient(90deg,#031a2bcc,#031a2b55),linear-gradient(180deg,#03172477,transparent 30%,#03172466)}.hero .hero-caption{left:28px;bottom:73px;max-width:calc(100% - 56px);font-size:10px}.hero-caption #hero-slide-count{font-size:10px;padding-right:12px}.hero .hero-dots{left:28px;right:115px;bottom:31px;max-width:none}.hero .hero-slider-controls #hero-pause{bottom:23px;right:28px}.hero .hero-slider-controls #hero-prev,.hero .hero-slider-controls #hero-next{top:auto;bottom:100px;transform:none}.hero #hero-prev{left:18px}.hero #hero-next{right:18px}.feature-grid div{font-size:11px;padding:19px 10px}.feature-grid b{margin-right:6px}}
@media(prefers-reduced-motion:reduce){.hero-copy,.hero .hero-slide.active>img{animation:none}.top{transition:none}}