/*
Theme Name: Bo i Lund (bl-kvarter)
Theme URI: https://lund-bostad.se/
Description: Barntema till Twenty Twenty-Five för Bo i Lund. Formspråket är arkitektens ritning: kvartersplan, planritning, gatufasad, måttlinje och namnruta, i lundategel, varmgrått, lindgrönt och kritvitt.
Author: Bo i Lund
Template: twentytwentyfive
Version: 1.0.0
Requires at least: 6.4
Text Domain: bl-kvarter
*/

:root {
	--chalk: #F5F6F3;
	--chalk-deep: #E7EAE5;
	--line: #D2D7D0;
	--stone: #A7AEA8;
	--grey: #5D645F;
	--ink: #1C211E;
	--ink-soft: #3A413C;
	--brick: #A3432A;
	--brick-deep: #7E2F1C;
	--brick-light: #E7C3B6;
	--lind: #A9C46A;
	--lind-band: #C9D88F;
	--lind-light: #E4ECCF;
	--lind-deep: #3F5E20;
	--display: Manrope, 'Helvetica Neue', Arial, sans-serif;
	--text: Newsreader, Georgia, 'Times New Roman', serif;
	--ease: cubic-bezier(.2, .7, .2, 1);
	--head-h: 72px;
}

/* ---------- Grund ---------- */

html { scroll-behavior: smooth; scroll-padding-top: calc(var(--head-h) + 1.5rem); }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { background: var(--chalk); color: var(--ink); font-kerning: normal; font-feature-settings: "kern", "liga"; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
::selection { background: var(--lind-light); color: var(--ink); }
:where(a, button, input, summary, [tabindex]):focus-visible { outline: 2px solid var(--lind-deep); outline-offset: 3px; border-radius: 2px; }
img { max-width: 100%; height: auto; }
.wp-site-blocks { overflow-x: clip; }
.wp-site-blocks > * + * { margin-block-start: 0; }
main { padding-bottom: var(--wp--preset--spacing--60); }

.bl-light { font-family: var(--display); font-style: normal; font-weight: 250; letter-spacing: -0.045em; color: var(--lind-deep); }
.bl-label { font-family: var(--display); font-size: .86rem; font-weight: 700; letter-spacing: -.005em; color: var(--grey); margin: 0; display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.bl-sep { display: inline-block; width: 7px; height: 7px; background: var(--lind); border: 1px solid var(--lind-deep); flex: none; }
.bl-arrow { width: 20px; height: 12px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; flex: none; transition: transform .35s var(--ease); vertical-align: middle; }
a:hover > .bl-arrow, a:focus-visible > .bl-arrow, a:hover .bl-arrow { transform: translateX(5px); }
.bl-pin-ico { width: 12px; height: 16px; fill: var(--lind-deep); fill-rule: evenodd; flex: none; }
.bl-hide-sm { }
.screen-reader-text:focus { background: var(--ink); color: var(--chalk); }

.bl-more { font-family: var(--display); font-weight: 700; font-size: .92rem; text-decoration: none; display: inline-flex; align-items: center; gap: .6rem; color: var(--ink); border-bottom: 1.5px solid var(--lind-deep); padding-bottom: .2rem; }
.bl-more:hover { color: var(--lind-deep); }

.bl-btn { display: inline-flex; align-items: center; gap: .6rem; font-family: var(--display); font-weight: 700; font-size: .92rem; text-decoration: none; background: var(--ink); color: var(--chalk); padding: .85rem 1.4rem; border-radius: 999px; transition: background .25s, color .25s; }
.bl-btn:hover { background: var(--lind-deep); color: var(--chalk); }
.bl-btn.is-ghost { background: transparent; color: var(--ink); box-shadow: inset 0 0 0 1.5px var(--ink); }
.bl-btn.is-ghost:hover { background: var(--ink); color: var(--chalk); }

/* Rubriker i sektioner */
.bl-section { margin-top: var(--wp--preset--spacing--60); }
.bl-sec-head { margin: 0 0 clamp(1.8rem, 3.5vw, 3rem); }
.bl-sec-head.is-split { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 1.5rem 4rem; align-items: end; }
.bl-sec-title { font-family: var(--display); font-weight: 800; font-size: clamp(2rem, 4.2vw, 3.5rem); line-height: 1.02; letter-spacing: -.04em; margin: .9rem 0 0; text-wrap: balance; }
.bl-sec-title .bl-light { letter-spacing: -.045em; }
.bl-sec-lede { font-size: 1.12rem; line-height: 1.55; color: var(--ink-soft); max-width: 46ch; margin: 0; text-wrap: pretty; }
.bl-sec-head:not(.is-split) .bl-sec-lede { margin-top: 1.1rem; }

.bl-mark-g { fill: var(--ink); }
.bl-mark-p { fill: var(--lind); }

/* ---------- Sidhuvud ---------- */

.bl-header { position: sticky; top: 0; z-index: 60; background: rgba(245, 246, 243, .97); border-bottom: 1px solid transparent; transition: border-color .3s, box-shadow .3s; }
.admin-bar .bl-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .bl-header { top: 46px; } }
.bl-header.is-scrolled { border-bottom-color: var(--line); box-shadow: 0 6px 24px -18px rgba(33, 29, 26, .4); }
.bl-header-in { min-height: var(--head-h); gap: 1.5rem; }
.bl-brand { gap: .7rem; align-items: center; }
.bl-brand-mark { display: block; line-height: 0; transition: transform .45s var(--ease); }
.bl-brand-mark img { width: 34px; height: 34px; display: block; }
.bl-brand:hover .bl-brand-mark { transform: translateY(-3px); }
.bl-header .wp-block-site-title { margin: 0; line-height: 1; white-space: nowrap; }
.bl-header .wp-block-site-title a { text-decoration: none; color: var(--ink); }
.bl-wm-a { font-weight: 300; letter-spacing: -.02em; }
.bl-wm-b { font-weight: 800; }
.bl-nav .wp-block-navigation-item__content { text-decoration: none; color: var(--ink); padding: .35rem 0; background: linear-gradient(var(--lind-deep), var(--lind-deep)) left bottom / 0 1.5px no-repeat; transition: background-size .35s var(--ease), color .2s; }
.bl-nav .wp-block-navigation-item__content:hover, .bl-nav .current-menu-item > .wp-block-navigation-item__content { color: var(--lind-deep); background-size: 100% 1.5px; }
@media (min-width: 600px) {
	.bl-nav .bl-nav-guider > .wp-block-navigation-item__content { padding: .5rem 1rem; border-radius: 999px; box-shadow: inset 0 0 0 1.5px var(--lind-deep); color: var(--lind-deep); background: none; transition: background .25s, color .25s; }
	.bl-nav .bl-nav-guider > .wp-block-navigation-item__content:hover { background: var(--lind-deep); color: var(--chalk); }
}
.bl-nav .wp-block-navigation__responsive-container-open, .bl-nav .wp-block-navigation__responsive-container-close { color: var(--ink); }
.bl-nav .wp-block-navigation__responsive-container.is-menu-open { background: var(--chalk); padding: 1.4rem clamp(1rem, 5vw, 2rem); }
.bl-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { padding-top: 4rem; align-items: flex-start; }
.bl-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { gap: .2rem; align-items: flex-start; width: 100%; }
.bl-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item { width: 100%; border-bottom: 1px solid var(--line); }
.bl-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { font-size: 1.9rem; font-weight: 800; letter-spacing: -.03em; padding: .55rem 0; background: none; }

/* ---------- Startsidans hero ---------- */

.bl-hero { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 4.5vw, 4.5rem); padding-top: clamp(2.2rem, 5vw, 4.5rem); align-items: start; }
.bl-eyebrow { font-family: var(--display); font-size: .9rem; font-weight: 700; letter-spacing: -.005em; color: var(--grey); display: flex; align-items: center; gap: .55rem; flex-wrap: wrap; margin: 0; }
.bl-hero-title { font-family: var(--display); font-weight: 800; font-size: clamp(3.3rem, 7.2vw, 7.1rem); line-height: .9; letter-spacing: -.055em; margin: 1.4rem 0 1.6rem; }
.bl-hero-title .bl-light { display: block; font-size: 1em; letter-spacing: -.06em; line-height: .95; }
.bl-hero-lede { font-size: clamp(1.12rem, 1.5vw, 1.3rem); line-height: 1.55; color: var(--ink-soft); max-width: 36ch; margin: 0 0 2.2rem; text-wrap: pretty; }

.bl-routes .bl-label { margin-bottom: .8rem; }
.bl-routes ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.bl-routes li { border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.bl-routes a { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: .7rem; padding: 1rem 1.1rem 1.05rem; text-decoration: none; color: var(--ink); position: relative; height: 100%; box-sizing: border-box; transition: background .3s; }
.bl-routes a:hover { background: var(--lind-light); }
.bl-routes-n { font-family: var(--display); font-size: .68rem; font-weight: 700; color: var(--lind-deep); letter-spacing: .08em; padding-top: .3rem; grid-row: span 2; }
.bl-routes-t { font-family: var(--display); font-weight: 800; font-size: 1.08rem; letter-spacing: -.02em; }
.bl-routes-d { font-size: .92rem; color: var(--grey); line-height: 1.35; padding-right: 1.4rem; }
.bl-routes .bl-arrow { position: absolute; right: 1rem; top: 1.25rem; color: var(--lind-deep); }

/* Ritningsbladet med kartan */
.bl-hero-map { margin: 0; border: 1px solid var(--ink); background: var(--chalk); position: relative; }
.bl-hero-map::before, .bl-hero-map::after { content: ""; position: absolute; width: 14px; height: 14px; border: 1px solid var(--ink); pointer-events: none; }
.bl-hero-map::before { top: -8px; left: -8px; border-right: 0; border-bottom: 0; }
.bl-hero-map::after { bottom: -8px; right: -8px; border-left: 0; border-top: 0; }
.bl-sheet-head { display: flex; border-bottom: 1px solid var(--ink); font-family: var(--display); font-size: .66rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.bl-sheet-head span { padding: .6rem .85rem; border-right: 1px solid var(--ink); white-space: nowrap; }
.bl-sheet-head span:nth-child(2) { color: var(--lind-deep); }
.bl-sheet-head span:last-child { margin-left: auto; border-right: 0; border-left: 1px solid var(--ink); }
.bl-sheet-head span:nth-last-child(2) { border-right: 0; }
.bl-map-wrap { position: relative; line-height: 0; }
.bl-map { width: 100%; height: auto; display: block; font-family: var(--display); }
.bl-map-paper { fill: var(--chalk); }
.bl-map-gl { fill: none; stroke: #E3E7E1; stroke-width: .7; }
.bl-map-hl { stroke: var(--lind); stroke-width: 1.2; }
.bl-map-park { fill: var(--lind-light); stroke: var(--lind-deep); stroke-width: .8; stroke-opacity: .55; }
.bl-map-park:first-of-type { fill: url(#bl-hatch); }
.bl-map-river { fill: none; stroke: var(--stone); stroke-width: 6; stroke-linecap: round; opacity: .55; }
.bl-d { cursor: pointer; outline: none; }
.bl-d-area { fill: transparent; stroke: var(--stone); stroke-width: 1.2; stroke-dasharray: 4 5; transition: fill .4s, stroke .4s; }
.bl-d-blocks, .bl-d-plan { fill-rule: evenodd; }
.bl-d-blocks { fill: var(--chalk-deep); stroke: var(--ink); stroke-width: .85; stroke-linejoin: round; transition: fill .45s var(--ease), stroke .45s; }
.bl-d-plan { fill: none; stroke: var(--grey); stroke-width: .9; stroke-dasharray: 2.5 2.5; transition: stroke .4s; }
.bl-d.is-on .bl-d-area, .bl-d:focus-visible .bl-d-area { fill: rgba(201, 216, 143, .35); stroke: var(--lind-deep); stroke-dasharray: none; stroke-width: 1.6; }
.bl-d.is-on .bl-d-blocks, .bl-d:focus-visible .bl-d-blocks { fill: var(--lind); stroke: var(--lind-deep); }
.bl-d.is-on .bl-d-plan { stroke: var(--lind-deep); }
.bl-map-rail { fill: none; stroke: var(--ink); stroke-width: 5; }
.bl-map-rail2 { fill: none; stroke: var(--chalk); stroke-width: 2.6; stroke-dasharray: 9 9; }
.bl-map-tram { fill: none; stroke: var(--lind-deep); stroke-width: 3; stroke-linecap: round; }
.bl-map-stop { fill: var(--chalk); stroke: var(--lind-deep); stroke-width: 2; }
.bl-map-cath { fill: var(--brick); }
.bl-map-ring { fill: none; stroke: var(--ink); stroke-width: 2.6; }
.bl-map-ring.is-inner { stroke-width: 1; stroke-dasharray: 2 2; }
.bl-map-station { fill: var(--ink); }
.bl-map-labels text { paint-order: stroke; stroke: var(--chalk); stroke-linejoin: round; pointer-events: none; }
.bl-map-name { font-size: 15px; font-weight: 800; letter-spacing: .2em; fill: var(--ink); stroke-width: 6px; transition: fill .3s; }
.bl-map-name.is-on { fill: var(--lind-deep); }
.bl-map-sub { font-family: var(--text); font-style: italic; font-size: 13.5px; fill: var(--ink-soft); stroke-width: 4px; }
.bl-map-sub.is-green { fill: var(--lind-deep); }
.bl-map-sub.is-tram { fill: var(--lind-deep); font-weight: 600; }
.bl-map-north circle { fill: var(--chalk); stroke: var(--ink); stroke-width: 1; }
.bl-map-north path { fill: var(--ink); }
.bl-map-north text { font-size: 12px; font-weight: 800; fill: var(--ink); }
.bl-map-scale rect { fill: var(--ink); stroke: var(--ink); stroke-width: 1; }
.bl-map-scale rect.is-w { fill: var(--chalk); }
.bl-map-scale text { font-size: 10px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; fill: var(--grey); }
.bl-pin { transform: translate(var(--px), var(--py)); transition: transform .7s cubic-bezier(.34, 1.36, .5, 1); pointer-events: none; }
.bl-pin-sh { fill: var(--ink); opacity: .2; }
.bl-pin-body { fill: var(--brick); stroke: var(--chalk); stroke-width: 2.4; }
.bl-pin-dot { fill: var(--chalk); }
.bl-pin.is-drop .bl-pin-in { animation: bl-drop .55s var(--ease); }
@keyframes bl-drop { 0% { transform: translateY(-16px); } 60% { transform: translateY(2px); } 100% { transform: none; } }

.bl-map-cap { border-top: 1px solid var(--ink); padding: 1rem 1rem 1.1rem; }
.bl-map-cap .bl-label { margin-bottom: .7rem; }
.bl-legend { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.bl-legend li { border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.bl-legend a { display: grid; grid-template-columns: auto 1fr; column-gap: .55rem; padding: .6rem .7rem .7rem; text-decoration: none; color: var(--ink); height: 100%; box-sizing: border-box; transition: background .3s; }
.bl-legend-n { font-family: var(--display); font-size: .66rem; font-weight: 700; color: var(--lind-deep); padding-top: .2rem; grid-row: span 2; }
.bl-legend-t { font-family: var(--display); font-weight: 800; font-size: .95rem; letter-spacing: -.01em; }
.bl-legend-d { font-size: .86rem; line-height: 1.3; color: var(--grey); }
.bl-legend li.is-on a, .bl-legend a:hover, .bl-legend a:focus-visible { background: var(--lind-light); }
.bl-legend li.is-on .bl-legend-t { color: var(--lind-deep); }

/* ---------- Gatufasaden ---------- */

.bl-street { height: clamp(84px, 10.5vw, 152px); background: url(assets/img/fasad-linje.svg) left bottom / auto 100% repeat-x; margin-top: var(--wp--preset--spacing--60); }
.bl-street.is-thin { height: clamp(60px, 7vw, 96px); margin-top: var(--wp--preset--spacing--40); opacity: .9; }
.bl-404 .bl-street { margin-top: var(--wp--preset--spacing--50); }

/* ---------- Guiderna ---------- */

.bl-guides-band { background: var(--lind-band); color: var(--ink); padding-top: var(--wp--preset--spacing--50); padding-bottom: var(--wp--preset--spacing--60); }
.bl-guides-band .bl-label { color: var(--ink-soft); }
.bl-guides-band .bl-sep { background: var(--chalk); border-color: var(--ink); }
.bl-guides-band .bl-sec-title { color: var(--ink); }
.bl-guides-band .bl-sec-title .bl-light { color: var(--lind-deep); }
.bl-guides-band .bl-sec-lede { color: var(--ink-soft); }
.bl-guides-band.is-compact { margin-top: var(--wp--preset--spacing--60); padding-top: var(--wp--preset--spacing--40); padding-bottom: var(--wp--preset--spacing--50); }

.bl-guides { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(.9rem, 1.6vw, 1.4rem); }
.bl-guides.is-compact { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.bl-guide { display: flex; flex-direction: column; background: var(--chalk); color: var(--ink); text-decoration: none; padding: 0 0 1.3rem; border-radius: 2px; box-shadow: 0 1px 0 rgba(33, 29, 26, .18), 0 14px 30px -24px rgba(33, 29, 26, .6); transition: transform .45s var(--ease), box-shadow .45s var(--ease); position: relative; }
.bl-guide:hover, .bl-guide:focus-visible { transform: translateY(-6px); box-shadow: 0 1px 0 rgba(33, 29, 26, .18), 0 26px 40px -24px rgba(33, 29, 26, .7); }
.bl-guide-head { display: flex; justify-content: space-between; font-family: var(--display); font-size: .64rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; padding: .65rem 1.1rem; border-bottom: 1px solid var(--ink); }
.bl-guide-head span:last-child { color: var(--lind-deep); }
.bl-guide-art { display: block; padding: 1rem 1.1rem .4rem; background-image: linear-gradient(#E2E6E0 1px, transparent 1px), linear-gradient(90deg, #E2E6E0 1px, transparent 1px); background-size: 16px 16px; background-position: -1px -1px; border-bottom: 1px solid var(--line); color: var(--ink); transition: color .4s; }
.bl-guide:hover .bl-guide-art { color: var(--lind-deep); }
.bl-guide-k { font-family: var(--display); font-size: .84rem; font-weight: 800; letter-spacing: -.005em; color: var(--lind-deep); padding: 1.1rem 1.1rem 0; }
.bl-guide-t { font-family: var(--display); font-weight: 800; font-size: 1.28rem; line-height: 1.12; letter-spacing: -.025em; padding: .45rem 1.1rem 0; text-wrap: balance; }
.bl-guide-e { font-size: .98rem; line-height: 1.45; color: var(--ink-soft); padding: .6rem 1.1rem 0; }
.bl-guide-more { margin-top: auto; padding: 1rem 1.1rem 0; font-family: var(--display); font-weight: 700; font-size: .86rem; display: flex; align-items: center; gap: .6rem; color: var(--lind-deep); }
.bl-guide:hover .bl-arrow { transform: translateX(5px); }

/* Planritningarna */
.bl-plan { width: 100%; height: auto; display: block; overflow: visible; }
.bl-plan .pl-wall { fill: none; stroke: currentColor; stroke-width: 6; stroke-linejoin: miter; }
.bl-plan .pl-in { fill: none; stroke: currentColor; stroke-width: 2.6; }
.bl-plan .pl-door { fill: none; stroke: currentColor; stroke-width: 1; }
.bl-plan .pl-win { fill: none; stroke: var(--chalk); stroke-width: 3.4; }
.bl-plan .pl-room { fill: transparent; transition: fill .5s var(--ease); }
.bl-guide:hover .pl-room, .bl-guide-sheet .pl-room { fill: var(--lind-light); }
.bl-plan .pl-fix { fill: none; stroke: currentColor; stroke-width: 1; }
.bl-plan .pl-t { font-family: var(--display); font-size: 8.5px; font-weight: 800; letter-spacing: .14em; fill: currentColor; text-anchor: middle; }
.bl-plan .pl-s { font-family: var(--text); font-style: italic; font-size: 8.5px; fill: var(--grey); text-anchor: middle; }
.bl-plan .pl-blk { fill: var(--chalk-deep); stroke: currentColor; stroke-width: 1.2; }
.bl-plan .pl-street { fill: none; stroke: var(--lind-deep); stroke-width: 1; stroke-dasharray: 3 3; }
.bl-plan .pl-pin { fill: var(--brick); fill-rule: evenodd; transition: transform .5s var(--ease); }
.bl-guide:hover .pl-pin { transform: translateY(-4px); }
.bl-plan .pl-north { fill: none; stroke: currentColor; stroke-width: 1.4; }
.bl-plan .pl-dim { fill: none; stroke: var(--grey); stroke-width: 1; }

/* ---------- Artiklar på startsidan ---------- */

.bl-lead { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(1.5rem, 4vw, 4rem); align-items: center; margin-bottom: clamp(2.5rem, 5vw, 4.5rem); }
.bl-lead-img { display: block; overflow: hidden; aspect-ratio: 4 / 3; background: var(--chalk-deep); position: relative; }
.bl-lead-img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 1.1s var(--ease); }
.bl-lead:hover .bl-lead-img img { transform: scale(1.035); }
.bl-lead-title { font-family: var(--display); font-weight: 800; font-size: clamp(1.9rem, 3.4vw, 2.9rem); line-height: 1.04; letter-spacing: -.04em; margin: .9rem 0 .9rem; text-wrap: balance; }
.bl-lead-title a, .bl-card-title a { text-decoration: none; color: var(--ink); background: linear-gradient(var(--lind-deep), var(--lind-deep)) left 100% / 0 2px no-repeat; transition: background-size .5s var(--ease), color .3s; }
.bl-lead-title a:hover, .bl-card-title a:hover, .bl-card:hover .bl-card-title a { background-size: 100% 2px; }
.bl-lead-ex { font-size: 1.15rem; line-height: 1.55; color: var(--ink-soft); margin: 0 0 1.4rem; }
.bl-lead .bl-namnruta { margin-bottom: 1.6rem; }

.bl-cards { display: grid; gap: clamp(2rem, 3.5vw, 3rem) clamp(1.2rem, 2.4vw, 2.2rem); list-style: none; margin: 0; padding: 0; }
.bl-cards.is-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.bl-card { display: flex; flex-direction: column; margin: 0; }
.bl-card-img { display: block; overflow: hidden; aspect-ratio: 3 / 2; background: var(--chalk-deep); position: relative; margin: 0 0 1rem; }
.bl-card-img img { width: 100%; height: 100% !important; object-fit: cover; display: block; transition: transform .9s var(--ease); }
.bl-card:hover .bl-card-img img { transform: scale(1.045); }
.bl-card-noimg { display: block; width: 100%; height: 100%; background: url(assets/img/mark.svg) center / 64px no-repeat, var(--chalk-deep); }
.bl-card-blad { position: absolute; left: .7rem; top: .7rem; background: var(--chalk); font-family: var(--display); font-size: .6rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; padding: .32rem .5rem; line-height: 1; }
.bl-card-kick { font-family: var(--display); font-size: .84rem; font-weight: 800; letter-spacing: -.005em; margin: 0 0 .5rem; }
.bl-card-kick a { color: var(--lind-deep); text-decoration: none; }
.bl-card-kick a:hover { text-decoration: underline; }
.bl-card-title { font-family: var(--display); font-weight: 800; font-size: clamp(1.15rem, 1.6vw, 1.36rem); line-height: 1.16; letter-spacing: -.025em; margin: 0; text-wrap: balance; }
.bl-card-ex, .bl-card-ex p { font-size: 1rem; line-height: 1.5; color: var(--ink-soft); margin: .6rem 0 0; }
.bl-card-meta { font-family: var(--display); font-size: .74rem; color: var(--grey); margin: .8rem 0 0; display: flex; gap: .45rem; letter-spacing: .02em; }

/* Kort från frågeblocket (arkiv och sök) */
.bl-qcard .wp-block-post-featured-image { margin: 0 0 1rem; }
.bl-qcard .wp-block-post-featured-image a { display: block; height: 100%; }
.bl-qcard .wp-block-post-title { font-size: clamp(1.15rem, 1.6vw, 1.36rem); }
.bl-qcard .wp-block-post-excerpt__more-text { display: none; }
.bl-qcard .wp-block-post-terms { margin: 0 0 .5rem; }
.bl-qcard .bl-card-body > * + * { margin-block-start: 0; }
.bl-qcard .wp-block-post-date { margin-top: .8rem; }

/* ---------- Ämnena som planritning ---------- */

.bl-plan-band { background-color: var(--chalk-deep); background-image: linear-gradient(#DCE1DA 1px, transparent 1px), linear-gradient(90deg, #DCE1DA 1px, transparent 1px); background-size: 24px 24px; margin-top: var(--wp--preset--spacing--60); padding-top: var(--wp--preset--spacing--60); padding-bottom: var(--wp--preset--spacing--60); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.bl-plan-grid { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.bl-plan-grid .bl-sec-head { margin: 0; }
.bl-flat { position: relative; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); grid-template-rows: minmax(190px, auto) minmax(170px, auto); gap: 3px; background: var(--ink); padding: 7px; margin-bottom: 2.4rem; }
.bl-room { position: relative; background: var(--chalk); padding: 1.2rem 1.25rem 1.3rem; text-decoration: none; color: var(--ink); display: flex; flex-direction: column; gap: .35rem; transition: background-color .4s var(--ease); }
.bl-room.is-hyra { grid-column: 1 / 4; grid-row: 1; }
.bl-room.is-student { grid-column: 4 / 6; grid-row: 1; }
.bl-room.is-kopa { grid-column: 6 / 7; grid-row: 1 / 3; }
.bl-room.is-stadsdelar { grid-column: 1 / 3; grid-row: 2; }
.bl-room.is-flytta { grid-column: 3 / 6; grid-row: 2; }
.bl-room:hover, .bl-room:focus-visible { background-color: var(--lind-light); background-image: repeating-linear-gradient(45deg, transparent 0 9px, rgba(63, 94, 32, .1) 9px 10px); }
.bl-room-no { font-family: var(--display); font-size: .66rem; font-weight: 800; letter-spacing: .14em; color: var(--lind-deep); }
.bl-room-name { font-family: var(--display); font-weight: 800; font-size: clamp(1.25rem, 2vw, 1.7rem); letter-spacing: -.03em; line-height: 1.05; transition: color .3s; }
.bl-room:hover .bl-room-name { color: var(--lind-deep); }
.bl-room-desc { font-size: .95rem; line-height: 1.4; color: var(--ink-soft); max-width: 30ch; }
.bl-room-n { margin-top: auto; padding-top: .7rem; font-family: var(--display); font-size: .72rem; font-weight: 700; letter-spacing: .06em; color: var(--grey); display: flex; align-items: center; gap: .45rem; }
.bl-room-n::before { content: ""; width: 9px; height: 9px; border: 1.2px solid currentColor; }
/* Dörröppningar med svängbåge */
.bl-door { position: absolute; width: 38px; height: 38px; pointer-events: none; }
.bl-door::before { content: ""; position: absolute; background: var(--chalk); }
.bl-door::after { content: ""; position: absolute; inset: 0; border: 1px solid var(--ink); border-radius: 0 100% 0 0; border-left-width: 1.6px; border-bottom: 0; transform-origin: 0 100%; transition: transform .6s var(--ease); }
.bl-room:hover .bl-door::after { transform: rotate(-12deg); }
.bl-room.is-hyra .bl-door { right: 18%; bottom: -3px; }
.bl-room.is-hyra .bl-door::before { left: 0; right: 0; bottom: 0; height: 3px; }
.bl-room.is-student .bl-door { left: 26%; bottom: -3px; transform: scaleX(-1); }
.bl-room.is-student .bl-door::before { left: 0; right: 0; bottom: 0; height: 3px; }
.bl-room.is-kopa .bl-door { left: -3px; bottom: 22%; transform: rotate(90deg); }
.bl-room.is-kopa .bl-door::before { left: 0; right: 0; bottom: 0; height: 3px; }
.bl-room.is-stadsdelar .bl-door { right: -3px; top: 40%; transform: rotate(-90deg); }
.bl-room.is-stadsdelar .bl-door::before { left: 0; right: 0; bottom: 0; height: 3px; }
.bl-room.is-flytta .bl-door { display: none; }
.bl-room:hover .bl-door::before, .bl-room:focus-visible .bl-door::before { background: var(--lind-light); }
/* Fönster i ytterväggarna och entrén */
.bl-flat::before, .bl-flat::after { content: ""; position: absolute; background: var(--chalk); background-image: linear-gradient(var(--ink), var(--ink)); background-size: 100% 1px; background-position: center; background-repeat: no-repeat; }
.bl-flat::before { top: 0; left: 8%; width: 18%; height: 7px; box-shadow: inset 0 1px 0 var(--ink), inset 0 -1px 0 var(--ink); }
.bl-flat::after { top: 0; left: 52%; width: 14%; height: 7px; box-shadow: inset 0 1px 0 var(--ink), inset 0 -1px 0 var(--ink); }
.bl-flat-entry { position: absolute; bottom: -7px; left: 64%; width: 64px; height: 7px; background: var(--chalk-deep); }
.bl-flat-entry { font-size: 0; }
.bl-flat-entry::after { content: "Entré"; position: absolute; left: 50%; top: 16px; transform: translateX(-50%); font-family: var(--display); font-size: .6rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: var(--grey); }
.bl-flat-entry::before { content: ""; position: absolute; left: 0; bottom: 0; width: 1px; height: 7px; background: var(--ink); box-shadow: 63px 0 0 var(--ink); }

/* ---------- Avsändaren ---------- */

.bl-about { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.bl-about-art { position: relative; aspect-ratio: 1; max-width: 340px; width: 100%; justify-self: center; display: grid; place-items: center; }
.bl-about-art .bl-mark { width: 44%; height: auto; position: relative; z-index: 1; }
.bl-about-ring { position: absolute; inset: 0; border-radius: 50%; border: 1px dashed var(--ink); }
.bl-about-ring::before { content: ""; position: absolute; inset: 12%; border-radius: 50%; background: var(--lind-light); }
.bl-about-ring::after { content: ""; position: absolute; left: 50%; top: -6px; width: 11px; height: 11px; margin-left: -5px; background: var(--lind-deep); border-radius: 50%; }
/* Ringen snurrar bara när man pekar på bilden (2.2.2: ingen automatisk rörelse längre än 5 s). */
@media (prefers-reduced-motion: no-preference) { .bl-about:hover .bl-about-ring { animation: bl-spin 60s linear infinite; } }
@keyframes bl-spin { to { transform: rotate(360deg); } }
.bl-about-text p { font-size: 1.15rem; line-height: 1.6; color: var(--ink-soft); max-width: 60ch; }
.bl-about-text .bl-sec-title { max-width: 20ch; margin-bottom: 1.4rem; }

/* ---------- Sidfot ---------- */

.bl-footer { background: var(--ink); color: #DDE2DC; margin-top: 0; padding-bottom: 2.5rem; }
.bl-skyline { height: clamp(70px, 9vw, 128px); background: url(assets/img/fasad-siluett.svg) left bottom / auto 100% repeat-x, linear-gradient(var(--chalk), var(--chalk)); margin: 0 calc(-1 * var(--wp--style--root--padding-right, 2rem)) 0 calc(-1 * var(--wp--style--root--padding-left, 2rem)); border-bottom: 6px solid var(--lind); }
.bl-footer > .bl-skyline { max-width: none !important; width: auto; }
.bl-footer-in { padding-top: clamp(2.5rem, 5vw, 4.5rem); }
.bl-footer-grid { display: grid; grid-template-columns: minmax(0, 2.1fr) repeat(3, minmax(0, 1fr)); gap: 2.5rem; }
.bl-footer-name { display: flex; align-items: center; gap: .75rem; font-family: var(--display); font-size: 1.7rem; letter-spacing: -.03em; color: var(--chalk); margin: 0 0 1rem; }
.bl-footer-name img { width: 40px; height: 40px; }
.bl-footer-brand p { font-size: 1.02rem; line-height: 1.55; max-width: 40ch; }
.bl-footer-note { font-size: .88rem !important; color: #A9B1AB; }
.bl-footer-h { font-family: var(--display); font-size: .95rem; font-weight: 800; letter-spacing: -.01em; color: var(--lind); margin: .5rem 0 1rem; }
.bl-footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.bl-footer a { color: #EEF1EC; text-decoration: none; font-family: var(--display); font-size: .95rem; font-weight: 500; background: linear-gradient(var(--lind), var(--lind)) left bottom / 0 1px no-repeat; transition: background-size .35s var(--ease), color .25s; }
.bl-footer a:hover { color: var(--lind); background-size: 100% 1px; }
.bl-namnruta.is-foot { margin-top: clamp(2.5rem, 5vw, 4rem); border-color: #47504A; }
.bl-namnruta.is-foot > div { border-color: #47504A; }
.bl-namnruta.is-foot dt { color: #A1AAA3; }
.bl-namnruta.is-foot dd { color: var(--chalk); }

/* ---------- Namnrutan ---------- */

.bl-namnruta { display: grid; grid-template-columns: repeat(auto-fit, minmax(128px, 1fr)); margin: 0; border: 1px solid var(--ink); border-right: 0; }
.bl-namnruta > div { padding: .55rem .8rem .6rem; border-right: 1px solid var(--ink); min-width: 0; }
.bl-namnruta dt { font-family: var(--display); font-size: .6rem; font-weight: 800; letter-spacing: .17em; text-transform: uppercase; color: var(--grey); margin: 0 0 .2rem; }
.bl-namnruta dd { margin: 0; font-family: var(--display); font-weight: 600; font-size: .9rem; letter-spacing: -.005em; overflow-wrap: anywhere; }
.bl-namnruta dd a { color: var(--lind-deep); text-decoration: none; }
.bl-namnruta dd a:hover { text-decoration: underline; }
.bl-nr-dim { color: var(--grey); font-weight: 700; font-size: .72rem; letter-spacing: .08em; }
.bl-namnruta.is-compact { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.bl-namnruta.is-compact > div:nth-child(-n+2) { border-bottom: 1px solid var(--ink); }

/* Måttlinjen */
.bl-matt { position: relative; height: 16px; margin: 0 0 2.4rem; background: linear-gradient(var(--ink), var(--ink)) center / 100% 1px no-repeat; display: flex; justify-content: center; align-items: center; }
.bl-matt::before, .bl-matt::after { content: ""; position: absolute; top: 0; width: 1px; height: 16px; background: var(--ink); }
.bl-matt::before { left: 0; box-shadow: 4px 0 0 transparent; }
.bl-matt::after { right: 0; }
.bl-matt span { background: var(--chalk); padding: 0 .8rem; font-family: var(--display); font-size: .64rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: var(--grey); position: relative; }
.bl-matt > span { line-height: 16px; }
.bl-matt.alignwide { margin-top: 2rem; }

/* ---------- Artikeln ---------- */

.bl-progress { position: fixed; top: 0; left: 0; right: 0; height: 3px; background: var(--lind-deep); transform-origin: 0 50%; transform: scaleX(var(--p, 0)); z-index: 80; pointer-events: none; }
.bl-kicker { font-family: var(--display); font-size: .92rem; font-weight: 800; letter-spacing: -.01em; display: flex; align-items: center; gap: .6rem; margin: 0; color: var(--ink); }
.bl-kicker a { color: var(--lind-deep); text-decoration: none; }
.bl-kicker a:hover { text-decoration: underline; }
.bl-kicker-no { font-weight: 700; color: var(--grey); padding-left: .6rem; border-left: 1px solid var(--line); }

.bl-article-head { max-width: 1040px; padding-top: clamp(2.2rem, 5vw, 4.5rem); }
.bl-article-title { font-family: var(--display); font-weight: 800; font-size: clamp(2.3rem, 5.4vw, 4.6rem) !important; line-height: 1 !important; letter-spacing: -.045em !important; margin: 1.1rem 0 1.2rem !important; max-width: 19ch; text-wrap: balance; }
.bl-dek, .bl-dek p { font-size: clamp(1.2rem, 1.8vw, 1.5rem); line-height: 1.45; color: var(--ink-soft); max-width: 44ch; margin: 0 0 2rem; text-wrap: pretty; }
.bl-article-head .bl-namnruta { max-width: 860px; }

.bl-hero-img { margin: clamp(2rem, 4vw, 3.2rem) 0 0 !important; position: relative; }
.bl-hero-img img { width: 100%; aspect-ratio: 2 / 1; object-fit: cover; display: block; }
.bl-figcap { display: flex; gap: .7rem; justify-content: flex-end; align-items: baseline; font-family: var(--text); font-style: italic; font-size: .92rem; color: var(--grey); margin-top: .7rem; text-align: right; }
.bl-figcap span { font-family: var(--display); font-style: normal; font-size: .6rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: var(--ink); }

.bl-read { display: grid; grid-template-columns: minmax(180px, 250px) minmax(0, 660px); gap: clamp(2rem, 5vw, 5.5rem); justify-content: center; margin-top: clamp(2.5rem, 5vw, 4rem); align-items: start; }
.bl-read > * { margin-block-start: 0 !important; }
.bl-read-aside { position: sticky; top: calc(var(--head-h) + 2rem); }
.bl-read-main { min-width: 0; }
.bl-toc .bl-label { margin-bottom: .9rem; color: var(--ink); }
.bl-toc ol { list-style: none; margin: 0; padding: 0; border-left: 1px solid var(--line); }
.bl-toc a { display: grid; grid-template-columns: 2rem 1fr; padding: .38rem 0 .38rem .9rem; font-family: var(--display); font-size: .85rem; font-weight: 600; line-height: 1.3; text-decoration: none; color: var(--grey); margin-left: -1px; border-left: 2px solid transparent; transition: color .25s, border-color .25s; }
.bl-toc a:hover { color: var(--ink); }
.bl-toc a.is-current { color: var(--ink); border-left-color: var(--lind-deep); }
.bl-toc-n { font-size: .66rem; font-weight: 800; color: var(--lind-deep); letter-spacing: .08em; padding-top: .14rem; }

.bl-body { font-size: clamp(1.1rem, 1.25vw, 1.22rem); line-height: 1.68; font-weight: 420; counter-reset: bl-h2; }
.bl-body > * { margin-block-start: 0; margin-block-end: 0; }
.bl-body > * + * { margin-top: 1.25em; }
.bl-body > p:first-child, .bl-body > .bl-ingress { font-size: 1.18em; line-height: 1.55; color: var(--ink); }
.bl-body h2 { counter-increment: bl-h2; font-family: var(--display); font-weight: 800; font-size: clamp(1.5rem, 2.2vw, 1.9rem); line-height: 1.12; letter-spacing: -.03em; margin-top: 2.1em !important; margin-bottom: -.35em; text-wrap: balance; }
.bl-body h2::before { content: counter(bl-h2, decimal-leading-zero); display: flex; align-items: center; gap: .7rem; font-size: .62rem; font-weight: 800; letter-spacing: .18em; color: var(--lind-deep); margin-bottom: .75rem; }
.bl-body h2::after { content: ""; display: block; width: 44px; height: 1px; background: var(--ink); margin-top: .9rem; }
.bl-body h3 { font-family: var(--display); font-weight: 800; font-size: 1.2rem; letter-spacing: -.02em; line-height: 1.2; margin-top: 1.9em !important; margin-bottom: -.6em; }
.bl-body a { color: var(--ink); text-decoration-color: var(--lind-deep); text-decoration-thickness: 1.5px; text-underline-offset: .2em; transition: color .2s; }
.bl-body a:hover { color: var(--lind-deep); }
.bl-body strong { font-weight: 650; }
.bl-body ul { list-style: none; padding-left: 0; }
.bl-body ul li { position: relative; padding-left: 1.5rem; }
.bl-body ul li::before { content: ""; position: absolute; left: .15rem; top: .62em; width: 7px; height: 7px; background: var(--lind-deep); }
.bl-body ol { list-style: none; padding-left: 0; counter-reset: bl-ol; }
.bl-body ol li { counter-increment: bl-ol; position: relative; padding-left: 2.4rem; }
.bl-body ol li::before { content: counter(bl-ol); position: absolute; left: 0; top: .18em; width: 1.6rem; height: 1.6rem; border: 1px solid var(--ink); border-radius: 50%; font-family: var(--display); font-size: .72rem; font-weight: 800; display: grid; place-items: center; line-height: 1; }
.bl-body li + li { margin-top: .55em; }
.bl-body blockquote { margin-left: 0; margin-right: 0; padding: .2rem 0 .2rem 1.5rem; border-left: 3px solid var(--lind-deep); font-style: italic; font-size: 1.22em; line-height: 1.45; }
.bl-body blockquote p { margin: 0; }
.bl-body hr { border: 0; height: 16px; background: linear-gradient(var(--ink), var(--ink)) center / 100% 1px no-repeat; }
.bl-fakta { position: relative; background: var(--chalk-deep); border: 1px solid var(--ink); padding: 1.3rem 1.4rem 1.35rem; font-size: .94em; line-height: 1.55; }
.bl-fakta::before { content: attr(data-rubrik); position: absolute; top: -.62rem; left: 1rem; background: var(--chalk); padding: 0 .5rem; font-family: var(--display); font-size: .62rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: var(--lind-deep); }
.bl-fakta > * { margin: 0; }
.bl-fakta > * + * { margin-top: .7em; }
.bl-fakta p.bl-fakta-h { font-family: var(--display); font-weight: 800; font-size: 1.05rem; letter-spacing: -.01em; }
.bl-fakta ul li + li { margin-top: .35em; }
.bl-tips { border-left: 3px solid var(--lind-deep); background: var(--lind-light); padding: 1.1rem 1.3rem; font-size: .95em; }
.bl-tips > * { margin: 0; }
.bl-tips > * + * { margin-top: .6em; }
.bl-tips strong:first-child { font-family: var(--display); font-weight: 800; color: var(--lind-deep); font-size: .7rem; letter-spacing: .18em; text-transform: uppercase; display: block; margin-bottom: .2rem; }

.bl-author { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 1.4rem; margin-top: clamp(3rem, 6vw, 4.5rem) !important; padding-top: 1.7rem; border-top: 1px solid var(--ink); }
.bl-author-mark .bl-mark { width: 64px; height: 64px; display: block; }
.bl-author-text > * { margin: 0; }
.bl-author-name { font-family: var(--display); font-weight: 800; font-size: 1.35rem; letter-spacing: -.02em; margin: .3rem 0 .4rem !important; }
.bl-author-bio { font-size: 1.02rem; line-height: 1.55; color: var(--ink-soft); }
.bl-author-note { font-size: .9rem; line-height: 1.5; color: var(--grey); margin-top: .9rem !important; }
.bl-guide-note { font-size: .95rem; line-height: 1.5; color: var(--grey); border-top: 1px solid var(--line); padding-top: 1.2rem; margin-top: 3rem; font-style: italic; }

/* ---------- Pelarsidans huvud ---------- */

.bl-gpage-head { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(2rem, 5vw, 5rem); padding-top: clamp(2.2rem, 5vw, 4.5rem); align-items: end; }
.bl-gpage-head .bl-namnruta { max-width: 640px; }
.bl-guide-sheet { margin: 0; border: 1px solid var(--ink); background-color: var(--chalk); background-image: linear-gradient(#E2E6E0 1px, transparent 1px), linear-gradient(90deg, #E2E6E0 1px, transparent 1px); background-size: 18px 18px; color: var(--ink); }
.bl-guide-sheet .bl-plan { padding: 1.4rem 1.6rem 1.2rem; box-sizing: border-box; }
.bl-guide-sheet .bl-sheet-head { background: var(--chalk); }

.bl-guides.is-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.6rem; }
.bl-guides.is-list .bl-guide { box-shadow: inset 0 0 0 1px var(--ink); }
.bl-guides.is-list .bl-guide-t { font-size: 1.6rem; }
.bl-guides-list { margin-top: clamp(2rem, 4vw, 3rem); }

/* ---------- Sidor, arkiv och Om ---------- */

.bl-page-head { padding-top: clamp(2.2rem, 5vw, 4.5rem); max-width: 1040px; }
.bl-page-head.is-simple { padding-bottom: .5rem; }
.bl-arch-title { font-family: var(--display); font-weight: 800; font-size: clamp(3rem, 8vw, 7rem) !important; line-height: .94 !important; letter-spacing: -.055em !important; margin: 1.1rem 0 1.3rem !important; }
.bl-arch-title.is-search { font-size: clamp(2.2rem, 5vw, 4rem) !important; }
.bl-arch-desc { font-size: clamp(1.15rem, 1.6vw, 1.4rem); line-height: 1.5; color: var(--ink-soft); max-width: 48ch; margin: 0 0 1rem; }
.bl-arch-count { font-family: var(--display); font-size: .9rem; font-weight: 700; color: var(--grey); margin: 0; }
.bl-page-intro { font-size: 1.2rem; line-height: 1.6; color: var(--ink-soft); max-width: 62ch; }
.bl-page-intro > * { max-width: 62ch; }
.bl-roomnav { margin-top: 2rem !important; margin-bottom: clamp(2rem, 4vw, 3.2rem) !important; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.bl-roomlist { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; }
.bl-roomlist li { border-right: 1px solid var(--line); }
.bl-roomlist a { display: flex; gap: .55rem; align-items: baseline; padding: .8rem 1.1rem; font-family: var(--display); font-weight: 700; font-size: .92rem; text-decoration: none; color: var(--ink); transition: background .25s; }
.bl-roomlist a span { font-size: .62rem; letter-spacing: .12em; color: var(--lind-deep); }
.bl-roomlist a:hover { background: var(--lind-light); }
.bl-roomlist li.is-current a { background: var(--ink); color: var(--chalk); }
.bl-roomlist li.is-current a span { color: var(--lind-light); }
.bl-pager { margin-top: 3rem; font-family: var(--display); font-weight: 700; }
.bl-pager a { text-decoration: none; }
.bl-only-nocat:empty { display: none; }
.category .bl-only-nocat { display: none; }

.bl-om-head { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: clamp(2rem, 5vw, 5rem); padding-top: clamp(2.2rem, 5vw, 4.5rem); align-items: end; }
.bl-om-card { border: 1px solid var(--ink); background: var(--chalk); }
.bl-om-mark { display: grid; place-items: center; padding: 2rem; background: var(--lind-light); border-bottom: 1px solid var(--ink); }
.bl-om-mark .bl-mark { width: 92px; height: 92px; }
.bl-namnruta.is-om { grid-template-columns: repeat(2, minmax(0, 1fr)); border: 0; }
.bl-namnruta.is-om > div:nth-child(-n+2) { border-bottom: 1px solid var(--ink); }
.bl-namnruta.is-om > div:nth-child(2n) { border-right: 0; }

.bl-search { max-width: 640px; margin-top: 1rem; }
.bl-search .wp-block-search__input { border: 1px solid var(--ink); border-radius: 999px; padding: .8rem 1.2rem; font-family: var(--display); background: var(--chalk); }
.bl-search .wp-block-search__button { border-radius: 999px; margin-left: .5rem; }
.bl-404-links { display: flex; gap: .8rem; flex-wrap: wrap; margin-top: 2rem; }

/* ---------- Rörelse (bara förstärkning, allt syns utan) ---------- */

.bl-anim .bl-reveal { opacity: 0; transform: translateY(22px); transition: opacity .8s var(--ease), transform .8s var(--ease); transition-delay: calc(var(--i, 0) * 70ms); }
.bl-anim .bl-reveal.is-in { opacity: 1; transform: none; }
.bl-anim .bl-pin-in { animation: bl-drop .9s .25s var(--ease) both; }
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
	.bl-anim .bl-reveal { opacity: 1; transform: none; }
}

/* ---------- Mindre skärmar ---------- */

@media (max-width: 1100px) {
	.bl-guides { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.bl-hero { grid-template-columns: minmax(0, 1fr); }
	.bl-hero-text { max-width: 760px; }
	.bl-hero-lede { max-width: 48ch; }
	.bl-routes ul { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 640px; }
	.bl-footer-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.bl-footer-brand { grid-column: 1 / -1; }
}
@media (max-width: 900px) {
	.bl-sec-head.is-split, .bl-lead, .bl-plan-grid, .bl-about, .bl-gpage-head, .bl-om-head { grid-template-columns: minmax(0, 1fr); }
	.bl-cards.is-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.bl-guides.is-compact { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.bl-read { grid-template-columns: minmax(0, 1fr); gap: 0; }
	.bl-read-aside { position: static; margin-bottom: 2.4rem !important; }
	.bl-toc { border: 1px solid var(--ink); padding: 1rem 1.1rem .7rem; }
	.bl-toc ol { border-left: 0; }
	.bl-toc a { padding-left: 0; border-left: 0; }
	.bl-about-art { max-width: 220px; justify-self: start; }
	.bl-guide-sheet { max-width: 520px; }
	.bl-routes ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
	:root { --head-h: 60px; }
	.bl-legend { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.bl-hide-sm { display: none; }
	.bl-sheet-head span { padding: .5rem .6rem; letter-spacing: .12em; }
	.bl-guides, .bl-guides.is-compact, .bl-guides.is-list { grid-template-columns: minmax(0, 1fr); }
	.bl-cards.is-3 { grid-template-columns: minmax(0, 1fr); }
	.bl-flat { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: none; }
	.bl-room.is-hyra { grid-column: 1 / 3; grid-row: auto; min-height: 150px; }
	.bl-room.is-student, .bl-room.is-kopa, .bl-room.is-stadsdelar { grid-column: auto; grid-row: auto; min-height: 170px; }
	.bl-room.is-flytta { grid-column: 1 / 3; grid-row: auto; }
	.bl-room.is-kopa .bl-door, .bl-room.is-stadsdelar .bl-door { display: none; }
	.bl-footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem 1.5rem; }
	.bl-namnruta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.bl-namnruta > div { border-bottom: 1px solid var(--ink); }
	.bl-namnruta > div:last-child:nth-child(odd) { grid-column: 1 / -1; }
	.bl-namnruta { border-bottom: 0; }
	.bl-namnruta.is-foot > div { border-bottom-color: #47504A; }
	.bl-namnruta.is-compact > div { border-bottom: 1px solid var(--ink); }
	.bl-hero-img img { aspect-ratio: 3 / 2; }
	.bl-figcap { justify-content: flex-start; text-align: left; }
	.bl-routes-d { font-size: .86rem; }
	.bl-header .wp-block-site-title { font-size: 1.2rem !important; }
	.bl-brand-mark img { width: 30px; height: 30px; }
}
@media (max-width: 420px) {
	.bl-routes ul { grid-template-columns: minmax(0, 1fr); }
	.bl-legend { grid-template-columns: minmax(0, 1fr); }
	.bl-room { padding: .9rem .85rem 1rem; min-height: 0 !important; }
	.bl-room-desc { font-size: .86rem; }
	.bl-door { display: none; }
	.bl-flat::after { display: none; }
}

/* ---------- Justeringar ---------- */
.bl-home > .bl-street + .bl-guides-band, .bl-street + .bl-guides-band { margin-block-start: 0 !important; }
.bl-room.is-student .bl-door { left: auto; right: 22%; }
.bl-room.is-stadsdelar .bl-door { right: auto; left: 64%; top: -3px; bottom: auto; transform: scaleY(-1); }
.bl-body .bl-mitt { border-left: 3px solid var(--lind); padding: .2rem 0 .2rem 1.2rem; font-style: italic; color: var(--ink-soft); }

/* Artikelhuvud med planritningen: "du är här" */
.bl-article-head.has-plan, .bl-article-headgrid { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 3rem; align-items: end; max-width: none; }
.bl-youarehere { margin: 0; }
.bl-youarehere .bl-label { margin-bottom: .6rem; }
.bl-mini { display: grid; grid-template-columns: repeat(6, 1fr); grid-template-rows: 64px 56px; gap: 2px; background: var(--ink); padding: 4px; }
.bl-mini a { background: var(--chalk); font-family: var(--display); font-size: .62rem; font-weight: 800; letter-spacing: .04em; color: var(--grey); text-decoration: none; padding: .4rem .45rem; display: flex; flex-direction: column; justify-content: space-between; transition: background .3s, color .3s; }
.bl-mini a span { font-size: .72rem; color: var(--ink); letter-spacing: -.01em; }
.bl-mini a:hover { background: var(--lind-light); }
.bl-mini a.is-here { background: var(--lind); color: var(--ink); }
.bl-mini a.is-here span::after { content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--brick); margin-left: .35rem; vertical-align: middle; }
.bl-mini .is-hyra { grid-column: 1 / 4; grid-row: 1; } .bl-mini .is-student { grid-column: 4 / 6; grid-row: 1; } .bl-mini .is-kopa { grid-column: 6; grid-row: 1 / 3; }
.bl-mini .is-stadsdelar { grid-column: 1 / 3; grid-row: 2; } .bl-mini .is-flytta { grid-column: 3 / 6; grid-row: 2; }
@media (max-width: 900px) { .bl-article-headgrid { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; } .bl-youarehere { max-width: 340px; } }
.bl-guide-sheet.is-map { background-image: none; }
.bl-map-note { border-top: 1px solid var(--ink); padding: .6rem .85rem; font-family: var(--display); font-size: .82rem; color: var(--grey); }
.bl-footer > .bl-skyline { margin-left: calc(50% - 50vw) !important; margin-right: calc(50% - 50vw) !important; width: 100vw; max-width: 100vw !important; }
@media (max-width: 700px) {
	.bl-sheet-head { flex-wrap: wrap; }
	.bl-sheet-head span:nth-child(3) { display: none; }
	.bl-hero > *, .bl-gpage-head > *, .bl-article-headgrid > * { min-width: 0; }
}
@media (max-width: 900px) {
	.bl-footer ul { gap: 0; }
	.bl-footer li a { display: inline-block; padding: .62rem 0; }
	.bl-toc a { padding-top: .62rem; padding-bottom: .62rem; }
	.bl-roomlist a { padding: .9rem 1rem; }
}
.bl-cards > li { margin: 0 !important; }
.bl-qcard .wp-block-post-terms a { color: var(--lind-deep); text-decoration: none; }

/* Sök i sidhuvudet (fungerar utan JavaScript) */
.bl-header-in { position: relative; }
.bl-sok { position: static; flex: none; }
.bl-sok summary { list-style: none; width: 44px; height: 44px; display: grid; place-items: center; cursor: pointer; border-radius: 50%; transition: background .25s; }
.bl-sok summary::-webkit-details-marker { display: none; }
.bl-sok summary:hover, .bl-sok[open] summary { background: var(--lind-light); }
.bl-sok svg { width: 20px; height: 20px; fill: none; stroke: var(--ink); stroke-width: 1.8; stroke-linecap: round; }
.bl-sok-form { position: absolute; right: 0; top: calc(100% + 1px); width: min(420px, calc(100vw - 2rem)); background: var(--chalk); border: 1px solid var(--ink); padding: 1rem; box-shadow: 0 18px 40px -24px rgba(28, 33, 30, .5); z-index: 70; }
.bl-sok-form label { display: block; font-family: var(--display); font-weight: 800; font-size: .9rem; margin-bottom: .6rem; }
.bl-sok-form div { display: flex; gap: .5rem; }
.bl-sok-form input { flex: 1; min-width: 0; font: 500 1rem var(--display); padding: .75rem .9rem; border: 1px solid var(--ink); border-radius: 999px; background: #fff; color: var(--ink); }
.bl-sok-form button { font: 700 .92rem var(--display); padding: .75rem 1.1rem; border: 0; border-radius: 999px; background: var(--ink); color: var(--chalk); cursor: pointer; }
.bl-sok-form button:hover { background: var(--lind-deep); }
@media (max-width: 600px) { .bl-header-in { gap: .3rem; } .bl-sok { order: 2; } .bl-nav { order: 3; } }
.bl-header-in > .bl-nav { margin-left: auto !important; }
.bl-guides.is-list { grid-template-columns: minmax(0, 1fr); gap: 1.8rem; }
.bl-guides.is-list .bl-guide { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); grid-template-rows: auto auto auto auto 1fr; column-gap: 0; padding-bottom: 0; }
.bl-guides.is-list .bl-guide-head { grid-column: 1 / -1; }
.bl-guides.is-list .bl-guide-art { grid-column: 1; grid-row: 2 / 6; border-bottom: 0; border-right: 1px solid var(--line); padding: 1.6rem; display: grid; place-items: center; }
.bl-guides.is-list .bl-plan { max-width: 340px; }
.bl-guides.is-list .bl-guide-k, .bl-guides.is-list .bl-guide-t, .bl-guides.is-list .bl-guide-e, .bl-guides.is-list .bl-guide-more { grid-column: 2; padding-left: clamp(1.2rem, 3vw, 2.6rem); padding-right: clamp(1.2rem, 3vw, 2.6rem); }
.bl-guides.is-list .bl-guide-k { padding-top: 2rem; }
.bl-guides.is-list .bl-guide-t { font-size: clamp(1.5rem, 2.6vw, 2.2rem); }
.bl-guides.is-list .bl-guide-e { font-size: 1.08rem; max-width: 52ch; }
.bl-guides.is-list .bl-guide-more { align-self: end; padding-bottom: 2rem; }
@media (max-width: 700px) {
	.bl-guides.is-list .bl-guide { display: flex; padding-bottom: 1.3rem; }
	.bl-guides.is-list .bl-guide-art { border-right: 0; border-bottom: 1px solid var(--line); }
	.bl-guides.is-list .bl-guide-k, .bl-guides.is-list .bl-guide-t, .bl-guides.is-list .bl-guide-e, .bl-guides.is-list .bl-guide-more { padding-left: 1.1rem; padding-right: 1.1rem; }
	.bl-guides.is-list .bl-guide-k { padding-top: 1.1rem; } .bl-guides.is-list .bl-guide-more { padding-bottom: 0; }
}
@media (max-width: 600px) { .bl-header-in > .bl-sok { margin-left: auto !important; } .bl-header-in > .bl-nav { margin-left: 0 !important; } }
.bl-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content,
.bl-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { align-items: flex-start !important; justify-content: flex-start !important; text-align: left; }
.bl-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item { justify-content: flex-start; }
.bl-nav .wp-block-navigation__responsive-container.is-menu-open::after { content: ""; position: fixed; left: 0; right: 0; bottom: 0; height: 110px; background: url(assets/img/fasad-linje.svg) left bottom / auto 100% repeat-x; pointer-events: none; }
.bl-nav .wp-block-navigation__responsive-container.is-menu-open { --navigation-layout-justification-setting: flex-start; --navigation-layout-justify: flex-start; --navigation-layout-align: flex-start; }
.bl-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item { align-items: flex-start !important; }


/* ---------- Tillgänglighet (WCAG 2.2 AA), 2026-10-19 ---------- */
/* Ljus fokusring på den mörka sidfoten */
.bl-footer :where(a, button, input, summary, [tabindex]):focus-visible { outline-color: var(--lind-band); }
/* Bildlänkar i arkiv och sök klipps av figuren: tvåfärgad ring innanför kanten */
.wp-block-post-featured-image a { position: relative; display: block; }
.wp-block-post-featured-image a:focus-visible { outline: none; }
.wp-block-post-featured-image a:focus-visible::after { content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none; box-shadow: inset 0 0 0 3px var(--chalk), inset 0 0 0 6px var(--ink); }
/* Sökpanelen får plats i 320 px bredd (padding räknas in i bredden) */
.bl-sok-form { box-sizing: border-box; width: min(454px, calc(100vw - 2rem)); }
/* Ämneslänken i artikelhuvudet: tryckyta minst 24 px hög */
.bl-kicker a { display: inline-block; padding-block: .2rem; }
/* Externa länkar som öppnas i nytt fönster */
.a11y-sr { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
a.a11y-ext::after { content: "\2197" / ""; display: inline-block; margin-left: .15em; font-size: .8em; line-height: 1; text-decoration: none; }