@font-face{font-family:'Metropolis';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/metropolis-400.e920e6b0.woff2) format('woff2')}
@font-face{font-family:'Metropolis';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/metropolis-500.f3a73873.woff2) format('woff2')}
@font-face{font-family:'Metropolis';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/metropolis-700.9a712a2c.woff2) format('woff2')}
.homito-hoppa{position:absolute;left:-9999px;top:0;z-index:500;padding:14px 22px;background:#1F1F1F;color:#FFFFFF;font-size:12px;letter-spacing:.16em;text-transform:uppercase}
.homito-hoppa:focus{left:12px;top:12px;opacity:1}
:focus-visible{outline:2px solid #1F1F1F;outline-offset:3px}
img{max-width:100%}

html{scrollbar-gutter:stable;scroll-behavior:smooth}
body{margin:0;background:#FFFFFF;font-family:'Metropolis',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:#1F1F1F;text-decoration:none;transition:opacity .25s ease}
a:hover{opacity:.55}
@keyframes menyIn{from{opacity:0;transform:translate(-50%,-18px)}to{opacity:1;transform:translate(-50%,0)}}
@keyframes rulla{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
[data-screen-label="Utforska"] a img{transform-origin:50% 50%!important;transition:transform .9s cubic-bezier(.22,.8,.26,1)}
[data-screen-label="Utforska"] a:hover img{transform:scale(1.035)!important}
[data-screen-label="Meny"] nav a svg{transition:transform .3s ease}
[data-screen-label="Meny"] nav a:hover svg{transform:translate(3px,-3px)}
[data-screen-label="Meny"] nav a > span:first-child{transition:color .25s ease}
[data-screen-label="Meny"] nav a:hover > span:first-child{color:#1F1F1F!important}
[data-screen-label="Meny"] nav a span > span + span{transition:color .25s ease}
[data-screen-label="Meny"] nav a:hover span > span + span{color:#3F3F3F!important}
a[href] svg{transition:transform .3s ease}
a[href]:hover svg{transform:scale(1.25)}
a[data-cta]:hover{opacity:1}
a[data-cta] > span:first-child{position:relative}
a[data-cta] > span:first-child::after{content:'';position:absolute;left:0;bottom:-7px;width:100%;height:1px;background:currentColor;transform:scaleX(0);transform-origin:100% 50%;transition:transform .55s cubic-bezier(.22,.8,.26,1)}
a[data-cta]:hover > span:first-child::after{transform:scaleX(1);transform-origin:0 50%}
a[data-cta]:hover svg{transform:translateX(6px) scale(1.15)}
button[type="submit"] svg{transition:transform .3s ease}
button[type="submit"]:hover svg{transform:translateX(6px) scale(1.15)}
@media (prefers-reduced-motion: reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
@keyframes ledtrad{0%{transform:scaleY(0);transform-origin:0 0}42%{transform:scaleY(1);transform-origin:0 0}58%{transform:scaleY(1);transform-origin:0 100%}100%{transform:scaleY(0);transform-origin:0 100%}}
@keyframes cueLinje{0%{transform:scaleY(0);transform-origin:50% 0}44%{transform:scaleY(1);transform-origin:50% 0}56%{transform:scaleY(1);transform-origin:50% 100%}100%{transform:scaleY(0);transform-origin:50% 100%}}
@keyframes cuePil{0%,100%{transform:translateY(0)}50%{transform:translateY(3px)}}
[data-rullacue]{opacity:.82;transition:opacity .5s ease,transform .5s ease}
[data-rullacue]:hover{opacity:1}
html[data-cuenara="1"] [data-rullacue]{opacity:1}
html[data-rullad="1"] [data-rullacue]{opacity:0;transform:translate(-50%,12px);pointer-events:none}
[data-hemmark]{opacity:.7;transition:opacity .3s ease,transform .45s cubic-bezier(.22,.8,.26,1)}
[data-hemmark]:hover{opacity:1;transform:translate(-50%,-50%) scale(1.1)}

/* ===== ADAPTIV – gäller endast under 900px. Desktop är oförändrad. ===== */
@media (max-width:900px){
[data-m~="gutter"]{padding-left:40px!important;padding-right:40px!important}
[data-m~="steg"]{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:34px 30px!important}
[data-m~="resangrid"]{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;gap:40px!important}
[data-m~="resangrid"]>span:first-child{display:none!important}
[data-m~="kortgrid"]{grid-template-columns:minmax(0,1fr)!important;margin-left:40px!important;margin-right:40px!important}
[data-m~="kort"]>span:first-child{min-height:320px!important}
[data-m~="kontaktgrid"]{gap:48px!important}
[data-m~="formgrid"]{gap:30px!important}
[data-m~="split-text"]{padding:72px 44px!important;gap:56px!important}
[data-m~="fotgrid"]{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr)!important;gap:40px 36px!important;padding-left:40px!important;padding-right:40px!important}
[data-m~="fotgrid"]>a:last-child{grid-column:2/4!important}
[data-m~="fotbotten"]{padding-left:40px!important;padding-right:40px!important}
}
@media (max-width:760px){
[data-m~="gutter"]{padding-left:22px!important;padding-right:22px!important}
[data-m~="topbar"]{top:12px!important;width:calc(100% - 24px)!important;padding:6px 6px 6px 12px!important;border-radius:12px!important}
[data-m~="topbar"] [data-hemmark]{width:30px!important;height:30px!important}
[data-m~="topbar-sprak"],[data-m~="topbar-login"]{display:none!important}
[data-m~="topbar-kontakt"]{padding:11px 12px!important;font-size:9px!important;letter-spacing:.1em!important}
[data-m~="hamburgare"]{padding:17px 10px!important}
[data-m~="hamburgare"] svg{width:26px!important}
[data-m~="menypanel"]{top:86px!important;width:calc(100% - 24px)!important;max-height:calc(100vh - 102px)!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch!important}
[data-m~="menygrid"]{grid-template-columns:minmax(0,1fr)!important}
[data-m~="menybild"]{display:none!important}
[data-m~="menyvanster"]{padding:22px 20px 24px!important}
[data-m~="menymobil"]{display:flex!important;border-top:0!important;margin-top:14px!important;padding-top:0!important}
[data-screen-label="Kontakt"]{scroll-margin-top:76px!important;padding-top:64px!important}
[data-rullacue]{bottom:30px!important}
[data-rullacue] span:nth-of-type(2){height:34px!important}
[data-m~="heroinnehall"]{gap:20px!important;padding:0 24px 62px!important}
[data-m~="heroinnehall"]>span{font-size:10.5px!important;letter-spacing:.34em!important}
[data-m~="heroinnehall"]>svg{width:min(260px,60vw)!important}
[data-m~="etikettgrid"]{grid-template-columns:minmax(0,1fr)!important;gap:16px!important}
[data-m~="etikettgrid"]>span:first-child{padding-top:0!important}
[data-m~="resangrid"]{grid-template-columns:minmax(0,1fr)!important;gap:38px!important}
/* Hyresgästresan: horisontell snap-karusell */
[data-m~="steg"]{display:flex!important;grid-template-columns:none!important;gap:0!important;align-items:stretch!important;margin:clamp(52px,8vh,80px) -22px 0!important;padding:0 22px 2px!important;overflow-x:auto!important;scroll-snap-type:x mandatory!important;scroll-padding-left:22px!important;-webkit-overflow-scrolling:touch!important;scrollbar-width:none!important}
[data-m~="steg"]::-webkit-scrollbar{display:none}
[data-m~="steg"]>div{flex:0 0 62%!important;box-sizing:border-box!important;scroll-snap-align:start!important;margin-right:10px!important;border-top:0!important;border-radius:12px!important;background:rgba(203,203,204,.22)!important;padding:16px 16px 18px!important;gap:8px!important;min-height:132px!important}
[data-m~="steg"]>div:last-child{margin-right:22px!important}
[data-m~="platt-botten"]{justify-content:flex-start!important}
[data-m~="split"]{grid-template-columns:minmax(0,1fr)!important}
[data-m~="split"]>div:first-child{min-height:300px!important}
[data-m~="split-text"]{padding:52px 22px 58px!important;gap:40px!important}
/* Utforska: alla fyra ingångarna synliga i ett 2x2-rutnät */
[data-m~="kortgrid"]{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important;margin-left:22px!important;margin-right:22px!important}
[data-m~="kort"]{grid-template-columns:minmax(0,1fr)!important;border-radius:10px!important}
[data-m~="kort"]>span:first-child{min-height:0!important;aspect-ratio:7/5!important}
[data-m~="kort"]>span:last-child{padding:14px 14px 16px!important;gap:9px!important}
[data-m~="kort"]>span:last-child>span:nth-child(1){font-size:9px!important;letter-spacing:.22em!important}
[data-m~="kort"]>span:last-child>span:nth-child(2){font-size:15px!important;letter-spacing:.07em!important;line-height:1.15!important}
[data-m~="kort"]>span:last-child>span:nth-child(3){display:none!important}
[data-m~="kort"]>span:last-child>span:nth-child(4){margin-top:4px!important;font-size:9.5px!important;letter-spacing:.14em!important;gap:8px!important}
[data-m~="kort"]>span:last-child>span:nth-child(4) svg{width:11px!important;height:11px!important}
[data-m~="kontaktgrid"]{grid-template-columns:minmax(0,1fr)!important;gap:42px!important;margin-top:40px!important;padding-top:34px!important}
[data-m~="formgrid"]{grid-template-columns:minmax(0,1fr)!important;gap:28px!important}
/* Sidfot – mobil: grupperade block med diskreta etiketter, luft i stället för linjer */
[data-m~="fotgrid"]{grid-template-columns:minmax(0,1fr)!important;gap:0!important;padding:58px 22px 0!important}
[data-m~="fotgrid"]>div:first-child{gap:34px!important;margin:0 -22px!important;padding:0 22px 34px!important;border-bottom:1px solid rgba(255,255,255,.16)!important}
[data-m~="fotgrid"]>div:first-child svg{width:104px!important}
[data-m~="fotgrid"]>div:first-child p{font-size:24px!important;line-height:1.26!important;letter-spacing:-.012em!important;color:#FFFFFF!important;max-width:18ch!important}
[data-m~="fotgrid"]>nav{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:15px 16px!important;padding:44px 0 0!important}
[data-m~="fotgrid"]>nav::before{content:attr(data-etikett);grid-column:1/3;margin-bottom:12px;font-size:9.5px;font-weight:500;letter-spacing:.28em;text-transform:uppercase;color:rgba(255,255,255,.42)}
[data-m~="fotgrid"]>nav>a{font-size:16px!important;letter-spacing:.09em!important;line-height:1.15!important}
[data-m~="fotgrid"]>div:nth-child(3){gap:10px!important;margin:0!important;padding:44px 0 0!important;border:0!important;background:none!important;border-radius:0!important}
[data-m~="fotgrid"]>div:nth-child(3)::before{content:attr(data-etikett);margin-bottom:12px;font-size:9.5px;font-weight:500;letter-spacing:.28em;text-transform:uppercase;color:rgba(255,255,255,.42)}
[data-m~="fotgrid"]>div:nth-child(3)>a{font-size:17px!important;letter-spacing:-.005em!important;text-decoration:none!important}
[data-m~="fotgrid"]>div:nth-child(3)>span{font-size:9.5px!important;letter-spacing:.24em!important;text-transform:uppercase!important;color:rgba(255,255,255,.45)!important}
[data-m~="fotgrid"]>a:last-child{grid-column:auto!important;justify-self:start!important;margin:26px 0 46px!important;padding:6px 0!important;border:0!important;border-radius:0!important;gap:9px!important;font-size:11px!important;letter-spacing:.2em!important;color:#FFFFFF!important}
[data-m~="fotbotten"]{flex-direction:row!important;flex-wrap:wrap!important;align-items:center!important;justify-content:flex-start!important;gap:10px 18px!important;padding:20px 22px 30px!important}
[data-m~="fotbotten"]>div{flex-direction:row!important;flex-wrap:wrap!important;align-items:center!important;gap:10px 18px!important}
[data-m~="fotbotten"] span,[data-m~="fotbotten"] a{font-size:9px!important;letter-spacing:.18em!important;color:rgba(255,255,255,.4)!important}
}

.scp0:hover{text-decoration:none!important;opacity:1!important}
.scp1:hover{background:var(--hbg)!important;color:var(--hfg)!important;border-color:transparent!important;text-decoration:none!important;opacity:1!important}
.scp2:hover{color:#fff!important;text-decoration:none!important}
.scp3:hover{color:#1F1F1F!important;opacity:1!important;text-decoration:none!important}
.scp4:hover{color:rgba(255,255,255,.65)!important}
.scp5:hover{color:#fff!important;opacity:1!important;text-decoration:none!important}
.scp6:hover{background:#1F1F1F!important;color:#fff!important;border-color:#1F1F1F!important;text-decoration:none!important;opacity:1!important}