:root { --ink:#101010; --forest:#151515; --cream:#f4f1ea; --sand:#ded8c9; --rust:#f3c500; --line:rgba(16,16,16,.18); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; font-family:"DM Sans",sans-serif; color:var(--ink); background:#000; line-height:1.55; }
a { color:inherit; text-decoration:none; }
.site-header { min-height:104px; display:flex; align-items:center; justify-content:space-between; padding:16px clamp(24px,5vw,84px); border-bottom:1px solid rgba(247,242,233,.22); background:#000; color:#f7f2e9; }
.logo { display:flex; align-items:center; }.logo img { display:block; width:88px; height:88px; object-fit:contain; }
.main-nav { display:flex; align-items:center; gap:31px; font-size:14px; font-weight:600; }.main-nav a:not(.nav-cta):hover { color:var(--rust); }.nav-cta { padding:11px 17px; background:var(--rust); color:var(--ink); }
.menu-button { display:none; border:0; background:none; color:var(--ink); font:600 14px "DM Sans"; }
.hero { position:relative; min-height:640px; display:grid; grid-template-columns:1fr 1.05fr; overflow:hidden; background:var(--forest); color:#f8f4ee; }.hero-content { display:flex; flex-direction:column; justify-content:center; padding:80px clamp(24px,8vw,145px); }.eyebrow { margin:0 0 16px; color:var(--rust); font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; }.hero .eyebrow { color:var(--rust); }.hero h1,h2 { font-family:"Playfair Display",serif; font-weight:600; letter-spacing:-.04em; line-height:.98; margin:0; }.hero h1 { font-size:clamp(50px,6.6vw,102px); }.hero-text { max-width:430px; margin:29px 0; font-size:17px; color:#d9e0d7; }.hero-actions { display:flex; gap:26px; align-items:center; }.button { display:inline-flex; align-items:center; justify-content:center; gap:27px; padding:14px 19px; font-size:14px; font-weight:700; }.button span,.text-link span { font-size:20px; line-height:0; }.button-primary { background:var(--rust); color:var(--ink); }.text-link { font-weight:700; font-size:14px; }.text-link span { margin-left:8px; }.hero-image,.project-image { background-size:cover; background-position:center; }.hero-image { background-image:linear-gradient(90deg,rgba(0,0,0,.18),rgba(0,0,0,.02)),url('assets/flytspacklat-golv-kallare-1.jpg'); }.hero-note { position:absolute; right:4.8vw; bottom:34px; padding-left:17px; border-left:2px solid var(--rust); font-size:13px; }.intro { padding:121px clamp(24px,8vw,145px); }.intro-grid { display:grid; grid-template-columns:1.1fr .75fr; gap:8vw; align-items:end; }.intro h2,.section-heading h2,.project h2,.contact h2 { font-size:clamp(41px,5vw,75px); }.intro-grid div p { margin:0 0 25px; max-width:430px; font-size:17px; }.services { padding:90px clamp(24px,8vw,145px) 106px; background:#e9e1d4; }.section-heading { display:flex; justify-content:space-between; gap:40px; align-items:end; }.section-heading > p { max-width:350px; margin:0 0 8px; }.service-grid { display:grid; grid-template-columns:repeat(4,1fr); margin-top:70px; border-top:1px solid var(--line); }.service-grid article { min-height:230px; padding:22px 26px 10px 0; border-right:1px solid var(--line); }.service-grid article:not(:first-child) { padding-left:25px; }.service-grid article:last-child { border-right:0; }.service-grid span { color:#a48600; font-size:12px; font-weight:700; }.service-grid h3 { margin:55px 0 10px; font:600 24px "Playfair Display"; }.service-grid p { margin:0; max-width:210px; font-size:14px; }.project { display:grid; grid-template-columns:1fr 1fr; min-height:630px; }.project-image { background-image:url('assets/flytspacklat-golv-kallare-2.jpg'); }.project-content { display:flex; flex-direction:column; justify-content:center; padding:70px clamp(32px,8vw,130px); background:var(--rust); color:var(--ink); }.project-content .eyebrow { color:#5d4b00; }.project-content p:not(.eyebrow) { max-width:405px; margin:29px 0; }.button-outline { align-self:flex-start; border:1px solid var(--ink); }.contact { padding:118px 24px; text-align:center; background:var(--ink); color:#f8f2e8; }.contact .eyebrow { color:var(--rust); }.contact p:not(.eyebrow) { max-width:430px; margin:27px auto 31px; color:#c8d2cd; }.contact-actions { display:flex; gap:24px; align-items:center; justify-content:center; flex-wrap:wrap; }.button-light { background:var(--rust); color:var(--ink); }.contact-link { font-size:14px; font-weight:700; border-bottom:1px solid #c8d2cd; }footer { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:22px clamp(24px,5vw,84px); font-size:12px; background:var(--ink); color:#f8f2e8; }footer p { margin:0; }.footer-logo { transform:scale(.78); transform-origin:left; }
@media (max-width:760px) { .site-header { min-height:82px; }.logo img { width:68px; height:68px; }.main-nav { position:absolute; top:72px; left:0; right:0; z-index:5; display:none; flex-direction:column; align-items:stretch; gap:0; padding:12px 24px 24px; background:var(--cream); border-bottom:1px solid var(--line); }.main-nav.open { display:flex; }.main-nav a { padding:12px 0; }.nav-cta { text-align:center; margin-top:8px; }.menu-button { display:block; }.hero { grid-template-columns:1fr; min-height:auto; }.hero-content { min-height:535px; padding:74px 24px; }.hero-image { height:310px; }.hero-note { display:none; }.intro { padding:76px 24px; }.intro-grid,.project { grid-template-columns:1fr; gap:30px; }.section-heading { display:block; }.section-heading > p { margin-top:25px; }.services { padding:72px 24px; }.service-grid { grid-template-columns:1fr 1fr; margin-top:45px; }.service-grid article,.service-grid article:not(:first-child) { min-height:205px; padding:20px 18px 10px 0; border-right:0; border-bottom:1px solid var(--line); }.service-grid article:nth-child(even) { padding-left:18px; border-left:1px solid var(--line); }.service-grid h3 { margin-top:38px; font-size:21px; }.project-image { min-height:330px; }.project-content { min-height:490px; padding:64px 24px; } footer { align-items:flex-start; flex-direction:column; gap:12px; } }

.floor-picker { display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(42px,8vw,130px); padding:118px clamp(24px,8vw,145px); background:#111; color:#f7f2e9; }
.picker-intro > p:not(.eyebrow) { max-width:360px; color:#bdbdb8; margin:28px 0 0; }.picker-form { display:grid; grid-template-columns:1fr 1fr; gap:18px; align-content:start; }.picker-form label { display:grid; gap:9px; font-size:13px; font-weight:700; }.picker-form label span { color:var(--rust); text-transform:uppercase; letter-spacing:.08em; font-size:11px; }.picker-form select,.picker-form input { appearance:none; width:100%; border:1px solid #4b4b48; border-radius:0; background:#1d1d1b; color:#f7f2e9; padding:15px 14px; font:500 16px "DM Sans",sans-serif; }.picker-form input { appearance:auto; }.picker-result { grid-column:1 / -1; display:grid; gap:5px; margin-top:12px; padding:24px; background:var(--rust); color:var(--ink); }.picker-result p { margin:0; font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }.picker-result strong { font:600 26px/1.12 "Playfair Display",serif; }.picker-result span { font-size:13px; }.picker-button { justify-self:start; margin-top:5px; }
.picker-form label[hidden] { display:none; }
.range-field { grid-column:1 / -1; }.picker-form .range-field span { display:flex; justify-content:space-between; align-items:center; }.picker-form .range-field strong { color:#f7f2e9; font-size:15px; letter-spacing:0; }.picker-form input[type="range"] { appearance:none; height:7px; padding:0; border:0; background:linear-gradient(90deg,var(--rust),var(--rust)) left/9% 100% no-repeat,#4b4b48; cursor:pointer; }.picker-form input[type="range"]::-webkit-slider-thumb { appearance:none; width:21px; height:21px; border:2px solid var(--rust); border-radius:50%; background:#111; }.picker-form input[type="range"]::-moz-range-thumb { width:17px; height:17px; border:2px solid var(--rust); border-radius:50%; background:#111; }
.picker-form .thickness-note { color:#dedbd2; font-size:12px; font-weight:500; letter-spacing:0; line-height:1.4; text-transform:none; }
@media (max-width:760px) { .floor-picker { grid-template-columns:1fr; padding:75px 24px; }.picker-form { grid-template-columns:1fr; }.picker-result { grid-column:auto; }.picker-button { width:100%; }.floor-picker h2 { font-size:clamp(41px,12vw,62px); } }
.picker-result .price-indication { margin-top:8px; font-size:18px; }
.intro { background:#000; color:#f7f2e9; }
.intro-grid div p { color:#d6d2ca; }
@media (max-width:760px) { .main-nav { background:#000; color:#f7f2e9; } }
.hero h1 { font-size:clamp(25px,3.3vw,51px); }
.intro h2,.section-heading h2,.project h2,.contact h2 { font-size:clamp(20px,2.5vw,37.5px); }
.service-grid h3 { font-size:12px; }
.picker-result strong { font-size:13px; }
@media (max-width:760px) { .floor-picker h2 { font-size:clamp(20px,6vw,31px); } }
.home-links { display:grid; grid-template-columns:repeat(3,1fr); background:#000; color:#f7f2e9; }.home-links a { position:relative; display:grid; gap:10px; min-height:220px; padding:34px clamp(24px,5vw,70px); border-right:1px solid #3d3d3a; }.home-links a:last-child { border:0; }.home-links span { color:var(--rust); font-size:12px; font-weight:700; }.home-links strong { font:600 25px "Playfair Display",serif; }.home-links small { max-width:220px; color:#c9c5bd; font-size:14px; }.home-links b { position:absolute; right:28px; bottom:28px; color:var(--rust); font-size:24px; }.home-links a:hover { background:#181817; }
.content-page { min-height:calc(100vh - 180px); padding:95px clamp(24px,8vw,145px); background:#000; color:#f7f2e9; }.content-page h1 { max-width:680px; font:600 clamp(30px,4vw,52px)/1 "Playfair Display",serif; letter-spacing:-.04em; margin:0; }.page-lead { max-width:620px; margin:28px 0 48px; color:#d6d2ca; font-size:18px; }.page-services { margin:20px 0 50px; max-width:1100px; border-color:#4a4a47; }.page-services article { border-color:#4a4a47; }.project-gallery { display:grid; grid-template-columns:1fr 1fr; gap:18px; max-width:1100px; }.project-gallery img { width:100%; aspect-ratio:4/3; object-fit:cover; }.standalone-picker { min-height:calc(100vh - 180px); }.standalone-picker h1 { font:600 clamp(30px,4vw,52px)/1 "Playfair Display",serif; letter-spacing:-.04em; margin:0; }.standalone-picker .picker-intro > p:not(.eyebrow) { font-size:17px; }.contact.content-page { text-align:left; }.contact.content-page > p:not(.eyebrow) { max-width:500px; color:#c8d2cd; margin:27px 0 31px; }
@media (max-width:760px) { .home-links { grid-template-columns:1fr; }.home-links a { min-height:155px; border-right:0; border-bottom:1px solid #3d3d3a; }.content-page { padding:72px 24px; }.project-gallery { grid-template-columns:1fr; }.page-services { grid-template-columns:1fr 1fr; } }
.page-services { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; max-width:900px; border:0; }.page-services article,.page-services article:not(:first-child) { position:relative; min-height:190px; padding:20px; overflow:hidden; border:1px solid #484844; background:#171716; transition:transform .2s ease, background .2s ease; }.page-services article::after { content:""; position:absolute; left:20px; bottom:19px; width:30px; height:3px; background:var(--rust); }.page-services article:hover { transform:translateY(-5px); background:#20201e; }.page-services span { display:grid; place-items:center; width:33px; height:33px; border:1px solid var(--rust); border-radius:50%; color:var(--rust); font-size:11px; }.page-services h3 { margin:24px 0 8px; color:#f7f2e9; font-size:18px; }.page-services p { color:#cdc9c0; font-size:13px; line-height:1.45; }.page-services article:nth-child(2)::before,.page-services article:nth-child(4)::before { content:"MGA"; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); color:rgba(243,197,0,.06); font:700 72px/1 "DM Sans",sans-serif; letter-spacing:-.1em; }
@media (max-width:900px) and (min-width:761px) { .page-services { grid-template-columns:repeat(2,minmax(0,1fr)); } }
.footer-logo { display:none; }
.main-nav { gap:4px; padding:6px; border:1px solid #41413d; border-radius:999px; background:#1b1b19; }.main-nav a:not(.nav-cta) { padding:9px 14px; color:#f7f2e9; border-radius:999px; }.main-nav a:not(.nav-cta):hover { background:rgba(243,197,0,.14); color:var(--rust); }.nav-cta { border-radius:999px; box-shadow:0 3px 0 rgba(0,0,0,.28); }.nav-cta:hover { background:#ffe04e; }
.main-nav a { position:relative; }.main-nav a:not(:last-child)::after { content:""; position:absolute; right:-3px; top:50%; width:1px; height:18px; transform:translateY(-50%); background:#4a4a45; }
.header-meta { display:flex; align-items:center; gap:18px; margin-left:22px; margin-right:auto; color:#bebbb3; font-size:12px; font-weight:600; letter-spacing:.03em; }.header-meta a { color:var(--rust); font-size:14px; font-weight:700; white-space:nowrap; }
.contact-details { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; max-width:760px; margin-top:42px; }.contact-details section { display:grid; gap:8px; min-height:125px; padding:24px; border:1px solid #484844; background:#171716; }.contact-details span { color:var(--rust); font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }.contact-details a,.contact-details address,.contact-details p { color:#f7f2e9; font-size:16px; font-style:normal; line-height:1.55; }.contact-details a:hover { color:var(--rust); }.contact-details p { margin:0; }
.contact-details { grid-template-columns:repeat(4,minmax(0,1fr)); gap:0; max-width:1000px; border-top:1px solid #484844; border-bottom:1px solid #484844; }.contact-details section { min-height:112px; padding:22px 24px 22px 0; border:0; background:transparent; }.contact-details section:not(:last-child) { padding-right:24px; border-right:1px solid #484844; }.contact-details section + section { padding-left:24px; }
.contact-details { grid-template-columns:1fr; gap:24px; max-width:540px; border:0; }.contact-details section,.contact-details section:not(:last-child),.contact-details section + section { min-height:auto; padding:0; border:0; background:transparent; }
.contact-details section:last-child { gap:2px; }
.contact-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(330px,.8fr); gap:clamp(30px,4vw,60px); align-items:start; }.contact-info .contact-intro { max-width:500px; }.inquiry-form { display:grid; gap:16px; padding-left:34px; border-left:2px solid var(--rust); }.inquiry-form h2 { margin:0; font:600 28px/1.1 "Playfair Display",serif; }.inquiry-form > p { margin:0 0 6px; color:#c8c4bc; font-size:14px; }.inquiry-form label { display:grid; gap:7px; color:var(--rust); font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }.inquiry-form input,.inquiry-form textarea { width:100%; border:1px solid #464641; border-radius:0; background:#171716; color:#f7f2e9; padding:12px; font:400 15px "DM Sans",sans-serif; letter-spacing:0; text-transform:none; }.inquiry-form textarea { resize:vertical; }.inquiry-form input:focus,.inquiry-form textarea:focus { outline:1px solid var(--rust); border-color:var(--rust); }.inquiry-form .button { justify-self:start; margin-top:4px; border:0; cursor:pointer; }
.content-page { max-width:1280px; margin-left:auto; margin-right:auto; }.page-services,.contact-layout { margin-left:auto; margin-right:auto; }
@media (max-width:760px) { .contact-layout { grid-template-columns:1fr; gap:55px; }.inquiry-form { padding-left:20px; }.inquiry-form .button { width:100%; } }
.standalone-picker { min-height:0; max-width:1180px; margin:0 auto; padding:78px clamp(24px,6vw,90px); }
@media (max-width:760px) { .header-meta { display:none; }.contact-details { grid-template-columns:1fr; margin-top:30px; }.contact-details section,.contact-details section + section { min-height:auto; padding:19px 0; border-right:0; border-bottom:1px solid #484844; }.contact-details section:last-child { border-bottom:0; }.main-nav { gap:0; padding:12px 24px 24px; border:0; border-radius:0; }.main-nav a:not(.nav-cta) { padding:12px 0; border-radius:0; }.main-nav a::after { display:none; }.nav-cta { border-radius:0; } }
@media (max-width:760px) { .contact-details section,.contact-details section + section { padding:0; border-bottom:0; } }
@media (max-width:760px) { .page-services { grid-template-columns:1fr; }.page-services article,.page-services article:not(:first-child) { min-height:210px; padding:24px; }.page-services h3 { margin-top:30px; } }

/* Större logotyp i sidhuvudet */
.site-header .logo img { width:110px; height:110px; }
@media (max-width:760px) { .site-header .logo img { width:78px; height:78px; } }
@media (max-width:760px) { .menu-button { display:inline-flex; align-items:center; justify-content:center; min-height:42px; padding:0 15px; border:1px solid #f7f2e9; border-radius:999px; background:#1b1b19; color:#f7f2e9; font:700 13px "DM Sans",sans-serif; letter-spacing:.08em; text-transform:uppercase; cursor:pointer; } .menu-button:focus-visible { outline:2px solid #f7f2e9; outline-offset:3px; } }

.thickness-unknown { margin-top:5px; }
.website-field { display:none !important; }
.form-status { margin:0 !important; padding:10px 12px; border-left:2px solid var(--rust); color:#f7f2e9 !important; background:#20201e; font-size:13px !important; }
.thickness-unknown label { display:inline-flex; align-items:center; gap:8px; color:#f7f2e9; font-size:14px; font-weight:500; letter-spacing:0; text-transform:none; cursor:pointer; }
.thickness-unknown input { width:16px; height:16px; accent-color:var(--rust); }

.about-actions { display:flex; flex-wrap:wrap; gap:14px; margin-top:32px; }
.about-actions .button { margin-top:0; }
.button-secondary { border:0; color:var(--ink); background:var(--rust); }
.button-secondary:hover { background:#ffe04e; color:var(--ink); }
.hero { grid-template-columns:1fr; }
.hero-image { display:none; }
@media (max-width:760px) { .about-actions { display:grid; grid-template-columns:1fr; }.about-actions .button { width:100%; } }