:root { --navy:#133b63; --navy-deep:#0d2946; --paper:#f7f5f0; --white:#fff; --ink:#18242f; --muted:#65717a; --line:#d9dee1; --pale-blue:#eef3f7; --missing:#f4f1e9; --focus:#b35c1e; --sans:Arial, Helvetica, sans-serif; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--sans); font-size:16px; line-height:1.5; } a { color:inherit; } button, input { font:inherit; } .page-shell { width:min(1120px, calc(100% - 48px)); margin-inline:auto; }.skip-link { position:absolute; z-index:20; top:-60px; left:16px; padding:10px 14px; background:var(--navy); color:var(--white); }.skip-link:focus { top:16px; }.site-header { display:flex; align-items:center; justify-content:space-between; min-height:76px; }.wordmark { color:var(--navy); font-size:1.05rem; font-weight:700; letter-spacing:-.035em; text-decoration:none; }.header-link { color:var(--navy); font-size:.9rem; font-weight:700; text-decoration-thickness:1px; text-underline-offset:4px; }.eyebrow, .section-label, .category-number { color:var(--navy); font-size:.72rem; font-weight:700; letter-spacing:.09em; margin:0; text-transform:uppercase; }.hero { display:flex; align-items:center; min-height:calc(100svh - 76px); padding:44px 0 70px; }.hero-content { width:min(100%, 730px); }.hero h1, h2 { letter-spacing:-.04em; line-height:1.04; }.hero h1 { max-width:680px; margin:10px 0 38px; font-size:clamp(3.1rem, 7vw, 6.2rem); }.address-search { width:min(100%, 680px); }.address-search label { display:block; margin:0 0 9px; font-size:.95rem; font-weight:700; }.search-row { display:flex; gap:9px; }.search-row input { min-width:0; flex:1; height:54px; border:1px solid #aeb8bd; border-radius:3px; background:var(--white); color:var(--ink); padding:0 15px; }.search-row input::placeholder { color:#78838a; }.search-row input:focus { border-color:var(--navy); outline:3px solid #b9cadd; outline-offset:1px; }.button, .search-row button { display:inline-flex; align-items:center; justify-content:center; min-height:48px; border:1px solid var(--navy); border-radius:3px; background:var(--navy); color:var(--white); cursor:pointer; font-weight:700; padding:0 21px; text-decoration:none; transition:background .15s ease, border-color .15s ease; }.search-row button { min-height:54px; }.button:hover, .search-row button:hover { background:var(--navy-deep); border-color:var(--navy-deep); }.button:focus-visible, button:focus-visible, a:focus-visible { outline:3px solid var(--focus); outline-offset:3px; }.section { display:grid; grid-template-columns:180px minmax(0, 1fr); gap:48px; border-top:1px solid var(--line); padding:90px 0; }.intro-copy { max-width:690px; }.intro-copy h2, .report-contents h2 { margin:0 0 20px; font-size:clamp(2.1rem, 4.2vw, 3.85rem); }.intro-copy p { margin:0; color:var(--muted); font-size:1.1rem; }.button-secondary { margin-top:31px; }.content-list { margin:42px 0 0; padding:0; list-style:none; border-top:1px solid var(--line); }.content-list li { display:grid; grid-template-columns:66px 1fr; gap:18px; padding:24px 0; border-bottom:1px solid var(--line); }.content-list li > span { color:var(--navy); font-size:.78rem; font-weight:700; }.content-list h3 { margin:0 0 3px; font-size:1.08rem; }.content-list p { margin:0; color:var(--muted); }.site-footer { display:flex; gap:18px; align-items:center; min-height:92px; border-top:1px solid var(--line); color:var(--muted); font-size:.85rem; }
/* Report */ .report { padding:42px 0 90px; }.report-header { padding:0 0 68px; }.report-header h1 { margin:8px 0 15px; color:var(--navy-deep); font-size:clamp(3rem, 7.2vw, 6.2rem); line-height:.94; letter-spacing:-.055em; }.report-date { margin:0; color:var(--muted); font-size:.9rem; }.map-card { position:relative; overflow:hidden; margin-top:42px; border:1px solid var(--line); border-radius:3px; background:#e9eef0; }.map-card svg { display:block; width:100%; height:260px; }.map-card span { position:absolute; bottom:17px; left:19px; border-radius:2px; background:var(--white); color:var(--navy-deep); font-size:.81rem; font-weight:700; padding:7px 9px; }.report-category { padding:68px 0; border-top:1px solid var(--line); }.category-heading { display:grid; grid-template-columns:58px 1fr; gap:18px; margin-bottom:30px; }.category-number { padding-top:3px; }.category-heading h2 { margin:4px 0 0; font-size:clamp(2rem, 4.2vw, 3.7rem); }.metric-card, .economy-card, .large-metric, .trend-card { display:flex; flex-direction:column; justify-content:space-between; min-height:170px; border:1px solid var(--line); border-radius:3px; background:var(--white); padding:22px; }.metric-card span, .economy-card span, .large-metric span { color:var(--muted); font-size:.82rem; }.metric-card strong, .economy-card strong { display:block; margin:15px 0 6px; color:var(--navy-deep); font-size:2.15rem; letter-spacing:-.045em; line-height:1; }.metric-card small, .economy-card small { color:var(--muted); font-size:.76rem; }.metric-card-primary { background:var(--navy); border-color:var(--navy); color:var(--white); }.metric-card-primary span, .metric-card-primary strong, .metric-card-primary small { color:inherit; }.service-layout { display:grid; grid-template-columns:1.35fr 1fr 1fr; gap:12px; }.service-layout .metric-card-primary { grid-row:span 2; min-height:352px; }.nature-layout { display:grid; grid-template-columns:1.05fr 1.95fr; gap:12px; }.large-metric { min-height:244px; background:var(--pale-blue); border-color:#c9d7e2; }.large-metric strong { margin:16px 0 8px; color:var(--navy); font-size:4.7rem; letter-spacing:-.08em; line-height:.8; }.large-metric strong span { font-size:2rem; }.large-metric p { margin:0; color:var(--muted); font-size:.82rem; }.nature-bars { display:grid; align-content:center; gap:21px; min-height:244px; padding:27px; border:1px solid var(--line); border-radius:3px; background:var(--white); }.nature-bars div { display:grid; grid-template-columns:minmax(76px, .7fr) 3fr 42px; gap:13px; align-items:center; font-size:.82rem; }.nature-bars i { display:block; position:relative; height:12px; background:#e4e9eb; }.nature-bars i::after { position:absolute; width:var(--bar); height:12px; background:var(--navy); content:""; inset:0 auto 0 0; }.nature-bars b { color:var(--navy-deep); font-size:.82rem; text-align:right; }.safety-layout { display:grid; grid-template-columns:1fr 2fr; gap:12px; }.trend-card { min-height:230px; }.trend-head { display:flex; justify-content:space-between; color:var(--muted); font-size:.83rem; }.trend-head strong { color:var(--navy); }.bar-chart { display:flex; align-items:end; gap:13px; height:135px; margin-top:12px; border-bottom:1px solid var(--line); }.bar-chart div { display:flex; flex:1; flex-direction:column; justify-content:end; gap:7px; height:100%; }.bar-chart i { display:block; height:var(--height); background:var(--navy); }.bar-chart span { color:var(--muted); font-size:.72rem; }.market-layout, .economy-layout { display:grid; grid-template-columns:repeat(3, 1fr); gap:12px; }.unavailable-card { display:flex; flex-direction:column; justify-content:space-between; min-height:170px; border:1px solid #d8cfbc; border-radius:3px; background:var(--missing); color:var(--ink); cursor:pointer; padding:22px; text-align:left; transition:border-color .15s ease, background .15s ease; }.unavailable-card:hover { border-color:#aa9068; background:#efe9dc; }.unavailable-card span { color:#786647; font-size:.82rem; }.unavailable-card strong { font-size:1.28rem; }.unavailable-card small { color:#786647; font-size:.76rem; text-decoration:underline; text-underline-offset:3px; }.economy-layout { grid-template-columns:1.2fr .9fr .9fr; }.economy-card { min-height:180px; }.report-end { margin-top:68px; padding:50px; background:var(--navy); color:var(--white); }.report-end .eyebrow { color:#c2d6e8; }.report-end h2 { max-width:630px; margin:8px 0 30px; font-size:clamp(2rem, 4vw, 3.55rem); }.report-end .button { border-color:var(--white); background:var(--white); color:var(--navy-deep); }.report-end .button:hover { background:#edf3f7; } dialog { width:min(530px, calc(100% - 34px)); border:0; border-radius:3px; box-shadow:0 18px 48px rgba(13, 41, 70, .24); padding:0; } dialog::backdrop { background:rgba(13, 41, 70, .48); }.dialog-content { position:relative; padding:36px; }.dialog-content h2 { margin:7px 40px 15px 0; color:var(--navy-deep); font-size:2rem; }.dialog-content p:last-child { margin:0; color:var(--muted); }.dialog-close { position:absolute; top:17px; right:17px; width:34px; height:34px; border:0; border-radius:2px; background:transparent; color:var(--navy); cursor:pointer; font-size:1.6rem; line-height:1; }.dialog-close:hover { background:var(--pale-blue); }.search-page { max-width:760px; min-height:calc(100vh - 76px); padding-top:84px; }.search-page h1 { margin:7px 0 36px; color:var(--navy-deep); font-size:clamp(2.7rem, 6vw, 5rem); letter-spacing:-.05em; line-height:1.02; }.search-message { color:var(--muted); font-size:.9rem; }.search-page .header-link { display:inline-block; margin-top:24px; }
@media (max-width:760px) { .page-shell { width:min(100% - 32px, 1120px); }.site-header { min-height:64px; }.hero { min-height:calc(100svh - 64px); padding:34px 0 48px; }.hero h1 { margin:8px 0 30px; font-size:clamp(2.85rem, 13vw, 4.15rem); }.search-row { flex-direction:column; }.search-row button { width:100%; }.section { grid-template-columns:1fr; gap:15px; padding:62px 0; }.intro-copy p { font-size:1rem; }.content-list { margin-top:28px; }.content-list li { grid-template-columns:43px 1fr; gap:12px; }.site-footer { align-items:flex-start; flex-direction:column; gap:4px; padding:24px 0; }.report { padding-top:27px; }.report-header { padding-bottom:54px; }.map-card { margin-top:30px; }.map-card svg { height:180px; }.report-category { padding:53px 0; }.category-heading { grid-template-columns:42px 1fr; gap:10px; margin-bottom:24px; }.service-layout, .nature-layout, .safety-layout, .market-layout, .economy-layout { grid-template-columns:1fr; }.service-layout .metric-card-primary { grid-row:auto; min-height:205px; }.metric-card, .economy-card, .unavailable-card { min-height:150px; }.large-metric, .nature-bars, .trend-card { min-height:unset; }.nature-bars { padding:22px 16px; }.nature-bars div { grid-template-columns:77px 1fr 39px; gap:7px; }.report-end { margin-top:50px; padding:33px 24px; }.dialog-content { padding:30px 25px; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *, *::before, *::after { transition-duration:.01ms !important; } }
.report-note { margin:7px 0 0; color:var(--muted); font-size:.82rem; }
.preview-header { padding-bottom:56px; }.preview-intro { max-width:580px; margin:22px 0 0; color:var(--muted); font-size:1.05rem; }.preview-map { margin-top:32px; }.preview-lock { position:relative; display:grid; width:100%; min-height:220px; overflow:hidden; border:1px solid var(--line); border-radius:3px; background:var(--white); color:var(--ink); cursor:pointer; padding:0; text-align:left; }.preview-lock:hover { border-color:#95a9b7; }.locked-content { display:grid; grid-template-columns:repeat(4, 1fr); gap:12px; align-items:end; height:100%; padding:32px; filter:blur(7px); opacity:.68; }.locked-content i { display:block; min-height:110px; background:linear-gradient(180deg, #dce5eb, #f5f7f8); }.preview-layout-split .locked-content { grid-template-columns:1.1fr 1.9fr; }.preview-layout-chart .locked-content { align-items:end; }.preview-layout-chart .locked-content i:nth-child(1) { min-height:58%; }.preview-layout-chart .locked-content i:nth-child(2) { min-height:76%; }.preview-layout-chart .locked-content i:nth-child(3) { min-height:48%; }.preview-layout-chart .locked-content i:nth-child(4) { min-height:89%; }.preview-layout-cards .locked-content { align-items:stretch; }.preview-layout-cards .locked-content i { min-height:120px; border:1px solid #cdd8df; background:#f9fbfc; }.chart-lines { grid-template-columns:1fr !important; gap:18px; }.chart-lines i { min-height:15px; width:var(--line-width, 100%); }.chart-lines i:nth-child(2) { width:62%; }.chart-lines i:nth-child(3) { width:83%; }.bar-lines { align-items:end; }.lock-badge { position:absolute; z-index:2; top:24px; left:24px; display:grid; width:38px; height:38px; place-items:center; border:1px solid #b7c5cf; border-radius:50%; background:var(--white); font-size:1rem; }.lock-copy { position:absolute; z-index:2; right:24px; bottom:23px; left:24px; color:var(--navy-deep); font-size:.9rem; font-weight:700; }.purchase-section { margin-top:68px; padding:50px; background:var(--navy); color:var(--white); }.purchase-section .eyebrow { color:#c2d6e8; }.purchase-section h2 { max-width:720px; margin:7px 0 23px; font-size:clamp(2rem, 4vw, 3.55rem); letter-spacing:-.04em; line-height:1.04; }.purchase-price { margin:0 0 21px; font-size:2.25rem; font-weight:700; letter-spacing:-.05em; }.purchase-price span { font-size:.95rem; font-weight:400; letter-spacing:0; }.purchase-section > p:not(.eyebrow):not(.purchase-price) { max-width:650px; margin:0 0 12px; color:#e0ebf1; }.purchase-section .coverage-copy { color:#c2d6e8 !important; font-size:.9rem; }.purchase-button { margin-top:22px; border-color:var(--white); background:var(--white); color:var(--navy-deep); }.purchase-button:hover { background:#edf3f7; }.delivery-copy { margin-top:14px !important; color:#c2d6e8 !important; font-size:.82rem; }
.test-mode { color:#c2d6e8 !important; font-size:.78rem; }
@media (max-width:760px) { .preview-header { padding-bottom:46px; }.preview-lock { min-height:180px; }.locked-content { gap:8px; padding:24px 16px; }.lock-badge { top:17px; left:17px; }.lock-copy { right:17px; bottom:16px; left:17px; }.purchase-section { margin-top:50px; padding:33px 24px; } }
.preview-service-skeleton { grid-template-columns:1.35fr 1fr 1fr; grid-template-rows:repeat(2, 1fr); }.preview-service-skeleton i:first-child { grid-row:span 2; }.preview-nature-skeleton { grid-template-columns:1.05fr 1.95fr; }.preview-safety-skeleton { grid-template-columns:1fr 2fr; }.preview-three-cards { grid-template-columns:repeat(3, 1fr); }.preview-lock .locked-content { filter:blur(8px); opacity:.76; }.lock-overlay { position:absolute; z-index:2; inset:0; display:grid; place-content:center; justify-items:center; gap:10px; padding:24px; color:var(--navy-deep); font-size:.9rem; font-weight:700; text-align:center; }.lock-icon { width:30px; height:30px; fill:var(--white); stroke:var(--navy); stroke-linecap:round; stroke-linejoin:round; stroke-width:1.7; }.lock-icon path:last-child { fill:var(--white); }.lock-overlay::before { position:absolute; z-index:-1; width:64px; height:64px; border:1px solid #b7c5cf; border-radius:50%; background:rgba(255,255,255,.92); content:""; top:calc(50% - 44px); }.lock-overlay span { max-width:320px; }.preview-lock:hover .lock-overlay::before { border-color:var(--navy); }
@media (max-width:760px) { .preview-service-skeleton { grid-template-columns:repeat(2, 1fr); grid-template-rows:repeat(2, 1fr); }.preview-service-skeleton i:first-child { grid-row:auto; }.preview-nature-skeleton, .preview-safety-skeleton, .preview-three-cards { grid-template-columns:repeat(2, 1fr); }.preview-three-cards i:last-child { grid-column:span 2; }.lock-overlay { font-size:.82rem; }.lock-overlay::before { top:calc(50% - 42px); } }
.lock-overlay { display:block; padding:0; }.lock-overlay::before { content:none; }.lock-icon { position:absolute; top:50%; left:50%; width:28px; height:28px; transform:translate(-50%, -50%); }.lock-overlay span { position:absolute; right:20px; bottom:18px; left:20px; max-width:none; }.preview-lock:hover .lock-overlay::before { border-color:transparent; }
@media (max-width:760px) { .lock-overlay span { right:16px; bottom:14px; left:16px; } }
.preview-status{margin:1rem 0 0;color:var(--muted);font-size:.9rem}
.site-footer nav{display:flex;gap:18px}.site-footer nav a{color:var(--muted);font-weight:700;text-underline-offset:4px}.bundle-picker{max-width:650px;margin:28px 0 0;padding:0;border:0}.bundle-picker legend{margin:0 0 11px;font-size:.9rem;font-weight:700}.bundle-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.bundle-option{position:relative;display:grid;min-height:0;gap:4px;padding:14px;border:1px solid rgba(255,255,255,.48);background:transparent;cursor:pointer}.bundle-option:focus-within{outline:3px solid var(--focus);outline-offset:2px}.bundle-option input{position:absolute;opacity:0}.bundle-quantity{color:var(--white);font-size:.9rem;font-weight:700}.bundle-price{color:#c2d6e8;font-size:.88rem;font-weight:400}.bundle-option:has(input:checked){border-color:var(--white);background:var(--white);box-shadow:none}.bundle-option:has(input:checked) .bundle-quantity{color:var(--navy-deep)}.bundle-option:has(input:checked) .bundle-price{color:#4f5963}.bundle-tax{margin:9px 0 0!important;color:#c2d6e8!important;font-size:.8rem}@media (max-width:760px){.site-footer nav{gap:14px}.bundle-options{grid-template-columns:repeat(2,1fr)}}
.header-nav { display:flex; align-items:center; gap:18px; }
.button:disabled { border-color:#9aa8b1; background:#9aa8b1; cursor:not-allowed; }

/* Befolkning & boende */
.population-layout { display:grid; grid-template-columns:.8fr 1.6fr 1.6fr; gap:12px; }
.household-metric, .distribution-card { min-height:244px; border:1px solid var(--line); border-radius:3px; background:var(--white); padding:22px; }
.household-metric { display:flex; flex-direction:column; justify-content:space-between; background:var(--pale-blue); border-color:#c9d7e2; }
.household-metric > span, .distribution-heading span { color:var(--muted); font-size:.82rem; }
.household-metric strong { color:var(--navy); font-size:3.65rem; letter-spacing:-.075em; line-height:.9; }
.household-metric strong small { font-size:1rem; letter-spacing:-.02em; }
.household-metric p, .distribution-heading small { margin:0; color:var(--muted); font-size:.76rem; }
.distribution-card { display:flex; flex-direction:column; justify-content:space-between; }
.distribution-heading { display:flex; justify-content:space-between; gap:12px; }
.distribution-list { display:grid; gap:15px; }
.distribution-list div { display:grid; grid-template-columns:minmax(80px, 1fr) 2fr 42px; gap:11px; align-items:center; color:var(--ink); font-size:.79rem; }
.distribution-list i { position:relative; display:block; height:10px; background:#e4e9eb; }
.distribution-list i::after { position:absolute; inset:0 auto 0 0; width:var(--bar); background:var(--navy); content:""; }
.distribution-list b { color:var(--navy-deep); font-size:.8rem; text-align:right; }
.preview-population-skeleton { grid-template-columns:.8fr 1.6fr 1.6fr; }

@media (max-width:760px) {
  .population-layout { grid-template-columns:1fr; }
  .household-metric { min-height:180px; }
  .household-metric, .distribution-card { min-height:unset; }
  .distribution-list div { grid-template-columns:77px 1fr 39px; gap:7px; }
  .preview-population-skeleton { grid-template-columns:repeat(2, 1fr); }
  .preview-population-skeleton i:last-child { grid-column:span 2; }
}

/* Account */
.account-page { min-height:calc(100svh - 168px); padding:76px 0 92px; }
.account-intro { max-width:650px; padding-bottom:52px; border-bottom:1px solid var(--line); }
.account-intro h1 { margin:7px 0 18px; color:var(--navy-deep); font-size:clamp(3rem,7vw,5.5rem); letter-spacing:-.055em; line-height:.95; }
.account-intro p:last-child { max-width:520px; margin:0; color:var(--muted); font-size:1.08rem; }
.account-sign-in { max-width:600px; padding:40px 0; }
.account-sign-in h2 { margin:0 0 14px; color:var(--navy-deep); font-size:clamp(1.8rem,4vw,2.6rem); }
.account-sign-in > p { max-width:550px; margin:0; color:var(--muted); }
.account-form { margin-top:28px; }
.account-form label { display:block; margin-bottom:9px; font-size:.9rem; font-weight:700; }
.account-form-row { display:flex; gap:9px; }
.account-form input { min-width:0; flex:1; height:50px; border:1px solid #aeb8bd; border-radius:3px; background:var(--white); padding:0 14px; }
.account-note { margin:10px 0 0; color:var(--muted); font-size:.82rem; }

/* Search and sign-in fields need the same comfortable tap target. */
.search-row input,
.search-row button { height:42px; min-height:42px; }
.account-form input,
.account-form-row .button { height:42px; min-height:42px; }

@media (max-width:760px) {
  .header-nav { gap:14px; }
  .account-page { min-height:calc(100svh - 156px); padding:48px 0 64px; }
  .account-intro { padding-bottom:38px; }
  .account-sign-in { padding:32px 0; }
  .account-form-row { flex-direction:column; }
  .account-form-row .button { width:100%; }
}