:root{--ink:#292b26;--paper:#f9f7f1;--accent:#333a2f;--muted:#5f6256;--line:#d8d8ce;--serif:'DM Serif Display',Georgia,serif;--sans:Manrope,Arial,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:65px}body{margin:0;color:var(--ink);background:var(--paper);font:14px/1.8 var(--sans);-webkit-font-smoothing:antialiased}a{text-decoration:none;color:inherit}img{display:block;width:100%;height:auto}button,input{font:inherit}button{cursor:pointer;color:inherit}p,h1,h2,h3{margin:0}h1,h2,h3{line-height:1.08}h1{font:clamp(65px,8vw,115px)/1 var(--serif);letter-spacing:-4px}h2{font:clamp(37px,4.5vw,65px)/1.1 var(--serif);letter-spacing:-1.9px}h3{font:24px/1.2 var(--serif)}em{font:inherit;font-style:italic;color:#7c8469}p{color:var(--muted)}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #8a9c72;outline-offset:5px}[hidden]{display:none!important}.demo-wrap{width:min(1250px,calc(100% - 100px));margin-inline:auto}.demo-section{padding-block:100px}.demo-skip{position:absolute;left:10px;top:-100px;z-index:100;background:#173c32;color:#fff;padding:10px}.demo-skip:focus{top:45px}.demo-ribbon{display:flex;justify-content:space-between;gap:15px;align-items:center;padding:11px 30px;position:sticky;top:0;z-index:50;background:#173c32;color:#f4f6ef;font-size:9px;line-height:1.5}.demo-ribbon>span{letter-spacing:1px;font-size:8px;color:#d1dfc6}.demo-ribbon>a:last-child{font-weight:650}.demo-header{display:flex;justify-content:space-between;gap:30px;align-items:center;height:100px}.demo-logo{font:44px/1 var(--serif);letter-spacing:-2px}.demo-header nav{display:flex;align-items:center;gap:30px;font-size:11px}.demo-button{display:inline-flex;gap:28px;align-items:center;justify-content:space-between;background:var(--accent);border:1px solid var(--accent);color:#fff;padding:14px 21px;font-size:10px;font-weight:600;line-height:1.6;transition:.2s}.demo-button span{font-size:17px;line-height:1}.demo-button:hover{opacity:.86;transform:translateY(-2px)}.demo-menu{display:none}.demo-eyebrow{font:650 9px/1.5 var(--sans);letter-spacing:2.4px;color:var(--ink);margin-bottom:25px}.demo-hero{position:relative}.hair-hero{height:670px;min-height:65vh;color:#fff}.hair-hero>img{height:100%;object-fit:cover;object-position:center 47%}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,#10140d9c,transparent 92%)}.demo-hero-copy{position:relative;z-index:1}.hair-hero .demo-hero-copy{position:absolute;left:8%;top:50%;transform:translateY(-50%);max-width:520px}.hair-hero .demo-eyebrow{color:#eee}.hair-hero h1{font-size:105px}.demo-hero-copy>p:not(.demo-eyebrow){max-width:330px;font-size:12px;line-height:1.95;margin-top:28px}.hair-hero .demo-hero-copy>p{color:#f5f5ec}.demo-hero-copy>.demo-button{margin-top:28px}.hair-hero .demo-button{background:var(--paper);color:var(--ink);border-color:var(--paper)}.photo-note{position:absolute;bottom:22px;left:30px;font-size:8px;color:#ffffffb8;letter-spacing:.3px}.hero-down{position:absolute;bottom:26px;right:45px;border:1px solid #ffffff88;border-radius:50%;width:40px;height:40px;display:grid;place-content:center;font-size:22px}.statement-strip{padding:32px 6%;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:30px}.statement-strip>span:first-child{font-size:10px;letter-spacing:3px;font-weight:650}.statement-strip>span:nth-child(2){font-size:28px}.statement-strip p{font:italic 21px var(--serif)}.treatment-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:30px}.treatment-heading>p{font-size:11px;line-height:1.9}.treatment-filters{display:flex;gap:10px;flex-wrap:wrap;margin-top:40px;margin-bottom:25px}.treatment-filters button{padding:9px 16px;border:1px solid var(--line);background:transparent;border-radius:100px;font-size:10px}.treatment-filters button[aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:white}.treatment-list{border-top:1px solid var(--line)}.treatment{display:grid;grid-template-columns:45px 1fr 180px;gap:25px;padding:30px 0;border-bottom:1px solid var(--line)}.treatment-index{font:22px var(--serif);color:#9a9e8a}.treatment p{font-size:11px;line-height:1.9;max-width:450px;margin-top:10px}.duration{display:inline-block;font-size:9px;color:#7a816c;margin-top:10px}.treatment-action{text-align:right}.treatment-action strong{font-size:16px;font-weight:550;display:block;margin-bottom:12px}.treatment-action .demo-button{background:transparent;color:var(--ink);border-color:var(--line);font-size:8px;padding:8px 12px;gap:15px}.demo-fine{font-size:9px;line-height:1.8;margin-top:23px}.story{display:grid;grid-template-columns:1fr 1fr;gap:105px;align-items:center;padding-bottom:100px}.story-image{position:relative;height:590px;overflow:hidden}.story-image img{height:100%;object-fit:cover;object-position:60%}.image-caption{position:absolute;bottom:22px;left:22px;color:white;font-size:8px;letter-spacing:1.5px;background:#0003;padding:5px 10px}.story-copy>p:not(.demo-eyebrow){font-size:12px;line-height:2;margin-top:30px;max-width:350px}.story-copy .demo-button{margin-top:28px}.quote-section{text-align:center;background:#eaece1;padding:95px 25px}.quote-section h2{font-size:75px}.quote-section>a{display:inline-block;border-bottom:1px solid #a0aa91;font-size:10px;margin-top:28px;padding-bottom:7px}.visit{display:grid;grid-template-columns:1fr 1fr;gap:105px}.visit-intro{font-size:12px;line-height:1.9;margin-top:28px;max-width:330px}.visit .demo-button{margin-top:25px}.visit-details>div+div{margin-top:32px}.visit-details h3{font-size:22px;margin-bottom:18px}.visit-details p{font-size:12px;line-height:1.9}.visit-details details{border-top:1px solid var(--line);padding:15px 0}.visit-details summary{display:flex;justify-content:space-between;gap:20px;font-size:11px;font-weight:600;cursor:pointer;list-style:none}.visit-details details p{margin-top:14px;font-size:11px}.visit-details details[open] summary span{transform:rotate(45deg)}.sidvaro-bridge{background:var(--accent);color:white;text-align:center;padding:75px 25px}.sidvaro-bridge>span{font-size:9px;letter-spacing:2px}.sidvaro-bridge h2{font-size:45px;margin:25px 0 30px}.sidvaro-bridge em{color:#cfddbf}.sidvaro-bridge .demo-button{border-color:#e7eddf;background:#e7eddf;color:var(--ink)}.demo-footer{padding-block:45px;display:flex;justify-content:space-between;gap:35px;align-items:center}.demo-footer p{font-size:9px;line-height:1.9}.demo-footer>a:last-child{font-size:10px}.demo-footer p a{font-weight:650;color:var(--ink)}dialog{border:1px solid var(--line);border-radius:5px;background:var(--paper);color:var(--ink);padding:45px;width:min(530px,calc(100% - 30px));max-height:90vh;overflow:auto}dialog::backdrop{background:#10281dcc;backdrop-filter:blur(5px)}dialog h2{font-size:43px;letter-spacing:-1px}dialog>p:not(.demo-eyebrow){font-size:12px;line-height:1.9;margin-top:22px}.close-booking{position:absolute;right:12px;top:9px;border:0;background:transparent;font-size:28px;padding:3px 9px}dialog .demo-notice{font-size:10px!important;padding:15px;background:#e3e9d8;color:#4f5c45}dialog .demo-button{margin-top:25px}.dismiss-booking{display:block;border:0;border-bottom:1px solid var(--line);padding:10px 0;background:transparent;font-size:10px;margin-top:14px}body:has(dialog[open]){overflow:hidden}
/* Still: muted olive, soft shapes and a slower editorial rhythm. */
.demo-spa{--ink:#4b513a;--paper:#f5f3e9;--accent:#616c4c;--muted:#5f6450;--line:#d8d8c8}.demo-spa .demo-logo{font-style:italic;font-size:50px}.spa-hero{display:grid;grid-template-columns:1fr 1.12fr;gap:70px;align-items:center;padding-top:30px;padding-bottom:65px;min-height:670px}.spa-hero h1{font-size:96px;line-height:1.04}.spa-hero .hero-image{height:570px;border-radius:48% 48% 3px 3px;overflow:hidden;position:relative}.hero-image img{height:100%;object-fit:cover}.spa-hero .hero-image img{object-position:58%}.spa-hero .photo-note{bottom:20px;left:24px;font-size:7px}.hero-fine{display:block;font-size:8px;letter-spacing:1.6px;color:var(--muted);margin-top:35px}.spa-sun{position:absolute;left:42%;top:45px;font-size:74px;color:#b1b890;z-index:2}.demo-spa .statement-strip{padding-block:35px;background:#e7e9da}.demo-spa .statement-strip>span:first-child{font:italic 28px var(--serif);letter-spacing:0;font-weight:400}.demo-spa .statement-strip p{font-size:17px}.demo-spa .treatment-list{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;border:0}.demo-spa .treatment{grid-template-columns:1fr;border:1px solid var(--line);padding:28px;gap:17px}.demo-spa .treatment-index{font-size:27px;color:#a7b08c}.demo-spa .treatment p{max-width:none}.demo-spa .treatment-action{text-align:left;display:flex;gap:15px;align-items:center;justify-content:space-between}.demo-spa .treatment-action strong{margin:0}.demo-spa .story-image{height:490px;border-radius:3px 45% 3px 3px}.demo-spa .story-image img{object-position:30%}.demo-spa .quote-section{background:#e5e8d9}.demo-spa .quote-section h2{font-size:82px}.demo-spa .sidvaro-bridge{background:#616c4c}
/* Forma: graphic type, burgundy, rose and editorial close-ups. */
.demo-naglar{--ink:#572438;--paper:#f9eeeb;--accent:#682c43;--muted:#7c4b5a;--line:#dac4ca}.demo-naglar .demo-logo{font-family:var(--sans);font-size:27px;letter-spacing:6px;font-weight:650}.nails-hero{display:grid;grid-template-columns:1.05fr .95fr;gap:65px;align-items:center;padding-block:25px 65px}.nails-hero h1{font:500 84px/.98 var(--sans);letter-spacing:-5px;text-transform:uppercase}.nails-hero h1 em{font-family:var(--serif);text-transform:none;color:var(--ink);font-size:108px;line-height:1.1;letter-spacing:-3px}.nails-hero .hero-image{height:610px;overflow:hidden;position:relative;border-radius:3px}.nails-hero .hero-image img{object-position:center 60%}.nails-hero .hero-fine{margin-top:30px;font-size:8px}.demo-naglar .statement-strip{background:var(--accent);color:#f6e4e6;border:0}.demo-naglar .statement-strip p{color:#e6c4ca;font-size:19px}.demo-naglar .statement-strip>span:first-child{letter-spacing:2px}.demo-naglar .treatment h3{font-family:var(--sans);font-size:23px;font-weight:500;letter-spacing:-.7px}.demo-naglar .story{grid-template-columns:.9fr 1.1fr;gap:110px}.demo-naglar .story-image{height:600px;border-radius:45% 45% 0 0}.demo-naglar .story-copy h2{font:500 70px/1 var(--sans);letter-spacing:-3px}.demo-naglar .story-copy h2 em{font-family:var(--serif);font-size:80px;color:var(--ink)}.demo-naglar .quote-section{background:#eddade}.demo-naglar .quote-section h2{font-family:var(--sans);letter-spacing:-3px;font-size:66px}.demo-naglar .quote-section em{font-family:var(--serif);color:var(--ink)}.color-section{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;padding-bottom:100px}.color-section>div>p:not(.demo-eyebrow){font-size:12px;margin-top:22px}.palette{max-width:430px;width:100%;justify-self:end}.color-sample{background:var(--sample);border-radius:160px 160px 8px 8px;height:350px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;transition:background .3s;box-shadow:inset 0 0 80px #0001}.color-sample>span{font-size:14px;letter-spacing:8px}.color-sample>strong{font:italic 42px var(--serif);margin-top:20px;text-shadow:0 1px 4px #0003}.swatches{display:flex;gap:20px;justify-content:center;margin-top:25px}.swatches button{width:33px;height:33px;flex-shrink:0;border:5px solid var(--paper);outline:1px solid transparent;border-radius:50%;background:var(--swatch);padding:0}.swatches button[aria-pressed=true]{outline-color:var(--ink)}.swatches button:focus-visible{outline:3px solid var(--ink);outline-offset:4px}
@media(max-width:1050px){.demo-wrap{width:calc(100% - 64px)}.demo-header nav{gap:20px}.hair-hero{height:610px}.hair-hero h1{font-size:90px}.spa-hero{gap:40px;min-height:580px}.spa-hero h1{font-size:80px}.spa-hero .hero-image{height:500px}.nails-hero{gap:30px}.nails-hero h1{font-size:68px;letter-spacing:-4px}.nails-hero h1 em{font-size:85px}.nails-hero .hero-image{height:540px}.story{gap:60px}.story-image{height:500px}.demo-naglar .story{gap:60px}.demo-naglar .story-copy h2{font-size:58px}.demo-naglar .story-copy h2 em{font-size:69px}.visit{gap:60px}.treatment{gap:20px;grid-template-columns:30px 1fr 155px}.treatment-action .demo-button{font-size:7px;padding:8px}.statement-strip{gap:15px}.statement-strip>span:first-child{font-size:8px;letter-spacing:1.8px}.statement-strip p{font-size:18px}.demo-section{padding-block:80px}.color-section{gap:50px}.spa-sun{font-size:60px}}
@media(max-width:700px){html{scroll-padding-top:65px}.demo-ribbon{padding:10px 16px;font-size:8px;gap:10px}.demo-ribbon>span{font-size:6px;letter-spacing:.5px;max-width:150px;text-align:center}.demo-ribbon>a:last-child{font-size:7px;max-width:90px;text-align:right}.demo-wrap{width:calc(100% - 40px)}.demo-header{height:80px;position:relative;z-index:10;gap:15px}.demo-logo{font-size:36px}.demo-menu{display:block;border:1px solid var(--line);background:transparent;font-size:10px;padding:8px 12px}.demo-header nav{display:none;position:absolute;left:-20px;right:-20px;top:79px;padding:15px 20px;background:var(--paper);border-bottom:1px solid var(--line);box-shadow:0 10px 15px #0001;flex-direction:column;align-items:stretch;gap:0}.demo-header nav.open{display:flex}.demo-header nav>a{padding:12px 0}.demo-header nav .demo-button{margin-top:10px;align-self:flex-start}.hair-hero{height:650px;min-height:0}.hair-hero>img{object-position:64%}.hero-shade{background:linear-gradient(90deg,#10140da8,#10140d11)}.hair-hero .demo-hero-copy{left:25px;right:25px;top:45%;max-width:340px}.hair-hero h1{font-size:77px;letter-spacing:-2.6px}.demo-hero-copy>p:not(.demo-eyebrow){font-size:12px;max-width:280px}.demo-eyebrow{font-size:8px;letter-spacing:1.8px;margin-bottom:22px}.photo-note{left:25px;font-size:7px}.hero-down{right:25px;bottom:25px}.statement-strip{padding:25px 20px;display:grid;grid-template-columns:1fr auto;gap:15px}.statement-strip>p{grid-column:1/-1;font-size:20px}.statement-strip>span:first-child{font-size:8px;letter-spacing:1.5px}.statement-strip>span:nth-child(2){font-size:23px}.demo-section{padding-block:60px}h2{font-size:43px;letter-spacing:-1.5px}.treatment-heading{display:block}.treatment-heading>p{font-size:10px;margin-top:22px}.treatment-filters{gap:7px;margin-top:25px}.treatment-filters button{font-size:9px;padding:8px 12px}.treatment{grid-template-columns:20px 1fr;gap:15px;padding-block:25px}.treatment-index{font-size:19px}.treatment h3{font-size:24px}.treatment p{font-size:11px}.treatment-action{grid-column:2;text-align:left;display:flex;align-items:center;justify-content:space-between;gap:15px}.treatment-action strong{font-size:14px;margin:0}.treatment-action .demo-button{font-size:8px;padding:8px 10px}.story{grid-template-columns:1fr;gap:35px;padding-bottom:60px}.story-image{height:430px}.story-copy h2{font-size:47px}.story-copy>p:not(.demo-eyebrow){font-size:12px;max-width:none;margin-top:24px}.quote-section{padding:65px 20px}.quote-section h2{font-size:58px}.visit{grid-template-columns:1fr;gap:40px}.visit h2{font-size:48px}.visit-details{display:grid;grid-template-columns:1fr;gap:30px}.visit-details>div+div{margin:0}.sidvaro-bridge{padding:60px 20px}.sidvaro-bridge h2{font-size:36px}.sidvaro-bridge .demo-button{font-size:9px;padding:13px 16px;gap:15px}.demo-footer{flex-direction:column;align-items:flex-start;gap:23px;padding-block:35px}.demo-footer p{font-size:9px}dialog{padding:35px 25px}dialog h2{font-size:37px}.spa-hero{grid-template-columns:1fr;padding-top:25px;padding-bottom:45px;gap:35px;min-height:0}.spa-hero h1{font-size:79px;letter-spacing:-2.5px}.spa-hero .hero-image{height:430px;width:100%;max-width:470px;justify-self:center}.spa-hero .demo-hero-copy{padding-right:20px}.hero-fine{margin-top:24px}.spa-sun{top:335px;right:0;left:auto;font-size:58px}.demo-spa .demo-logo{font-size:43px}.demo-spa .statement-strip>span:first-child{font-size:26px}.demo-spa .statement-strip>p{font-size:17px}.demo-spa .treatment-list{grid-template-columns:1fr}.demo-spa .treatment{padding:25px;gap:16px}.demo-spa .treatment-action{grid-column:auto}.demo-spa .story-image{height:380px}.demo-spa .quote-section h2{font-size:63px}.nails-hero{grid-template-columns:1fr;padding-top:25px;padding-bottom:45px;gap:35px}.nails-hero h1{font-size:68px;letter-spacing:-3.8px}.nails-hero h1 em{font-size:86px}.nails-hero .hero-image{height:500px}.demo-naglar .demo-logo{font-size:24px;letter-spacing:5px}.demo-naglar .story{grid-template-columns:1fr;gap:35px}.demo-naglar .story-image{height:480px}.demo-naglar .story-copy h2{font-size:60px}.demo-naglar .story-copy h2 em{font-size:72px}.demo-naglar .quote-section h2{font-size:48px;letter-spacing:-2px}.color-section{grid-template-columns:1fr;gap:30px;padding-bottom:60px}.palette{justify-self:center;max-width:370px}.color-sample{height:320px}.color-sample>strong{font-size:36px}.swatches{gap:15px}.demo-naglar .treatment h3{font-size:21px}.demo-naglar .statement-strip>span:first-child{font-size:8px}}
/* Ateljé: varm espresso, konjak och sand – skiljer frisören från spats oliv och Formas vinrött. */
.demo-frisor{--ink:#2e231d;--paper:#f7f1ea;--accent:#6e3b26;--muted:#6a5a50;--line:#e2d6ca}.demo-frisor em{color:#9a5a3a}.demo-frisor .hair-hero em{color:#f1c9a8}.demo-frisor .quote-section{background:#eee3d6}.demo-frisor .statement-strip{background:#efe6db}.demo-frisor .treatment-index{color:#a07a62}.demo-frisor .sidvaro-bridge em{color:#f1c9a8}.demo-frisor .treatment-filters button[aria-pressed=true]{background:var(--accent)}
/* Läsbarhet (Claude-granskning 2026-11-07): ingen viktig text under 12px, brödtext 15–16px. */
.demo-menu{font-size:13px!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.demo-ribbon{font-size:13px}.demo-ribbon>span{font-size:12px;letter-spacing:.8px}.demo-header nav{font-size:14px}.demo-button{font-size:14px}.demo-eyebrow{font-size:12px;letter-spacing:2px}
.demo-hero-copy>p:not(.demo-eyebrow){font-size:16px;max-width:380px;line-height:1.75}.photo-note,.spa-hero .photo-note{font-size:12px}.hero-fine,.nails-hero .hero-fine{font-size:12px}.color-sample{color:var(--sample-ink,#fff)}.hero-fine{font-size:12px}.statement-strip>span:first-child{font-size:12px}
.treatment-heading>p{font-size:15px;line-height:1.7}.treatment-filters button{font-size:14px;padding:9px 16px}.treatment p{font-size:15px;line-height:1.7}.duration{font-size:13px;color:var(--muted)}.treatment-index{color:var(--muted)}.treatment-action .demo-button{font-size:13px;padding:9px 13px}.demo-fine{font-size:13px}
.image-caption{font-size:11px;background:#0006}.story-copy>p:not(.demo-eyebrow){font-size:16px;max-width:420px;line-height:1.8}.quote-section>a{font-size:14px}.visit-intro,.visit-details p{font-size:15px}.visit-details summary{font-size:15px}.visit-details details p{font-size:15px}
.sidvaro-bridge>span{font-size:12px}.demo-footer p{font-size:13px}.demo-footer>a:last-child{font-size:14px}.color-section>div>p:not(.demo-eyebrow){font-size:16px}
dialog>p:not(.demo-eyebrow){font-size:15px}dialog .demo-notice{font-size:14px!important;color:#3f4a37}.dismiss-booking{font-size:14px}
@media(max-width:1050px){.treatment-action .demo-button{font-size:13px;padding:9px 12px}.statement-strip>span:first-child{font-size:12px}}
@media(max-width:700px){.demo-ribbon{flex-wrap:wrap;justify-content:space-between;padding:8px 16px;font-size:13px;row-gap:4px}.demo-ribbon>span{order:-1;flex-basis:100%;max-width:none;text-align:center;font-size:11px}.demo-ribbon>a:last-child{max-width:none;font-size:13px}.demo-hero-copy>p:not(.demo-eyebrow){font-size:15px;max-width:330px}.treatment-heading>p{font-size:14px}.treatment-filters button{font-size:13px;padding:8px 13px}.treatment p{font-size:15px}.treatment-action .demo-button{font-size:13px;padding:9px 12px}.demo-eyebrow{font-size:11px;letter-spacing:1.6px}.photo-note{font-size:11px}.statement-strip>span:first-child{font-size:11px}.sidvaro-bridge .demo-button{font-size:14px}.demo-footer p{font-size:13px}html{scroll-padding-top:90px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}.flow-browser{transform:none}}
