:root{--bg:#faf9f6;--surface:#fff;--soft:#ece8df;--text:#20262b;--muted:#68727a;--brand:#315b52;--brand-dark:#24443e;--border:#dcd6cc;--max:1160px;--radius:18px;--shadow:0 14px 36px rgba(25,35,32,.08)}
*{box-sizing:border-box}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-size-adjust:100%}body{margin:0;background:var(--bg);color:var(--text);font:300 16px/1.7 "Helvetica Neue",Helvetica,Arial,sans-serif}
img{max-width:100%;height:auto;display:block}a{color:var(--brand);text-underline-offset:.15em}a:hover{color:var(--brand-dark)}
.container{width:min(calc(100% - 2rem),var(--max));margin-inline:auto}
.header-inner{min-height:76px;display:flex;align-items:center;gap:1.4rem}.brand{display:flex;align-items:center;gap:.7rem;color:var(--text);text-decoration:none;white-space:nowrap}.brand-mark{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:var(--brand);color:#fff;font-weight:800}.brand strong,.brand small{display:block}.brand strong{font-weight:700}.brand small{font-size:.72rem;color:var(--muted);font-weight:300}
.nav-bar{background:#000;display:flex}
.site-nav{margin-left:0;display:flex;flex-wrap:wrap;justify-content:flex-start;align-items:center;gap:.1rem}.site-nav>a,.nav-group>summary{color:#fff;text-decoration:none;font-weight:300;font-size:.94rem;padding:.7rem .58rem;border-radius:6px;cursor:pointer;list-style:none;white-space:nowrap}.site-nav>a:first-child{font-weight:700}.site-nav>a:hover,.nav-group>summary:hover{background:rgba(255,255,255,.14)}.nav-group{position:relative}.nav-group>summary::-webkit-details-marker{display:none}.nav-group>summary:after{content:"⌄";font-size:.75em;margin-left:.3rem;color:rgba(255,255,255,.7)}
.dropdown{position:absolute;top:calc(100% + .25rem);left:0;min-width:260px;padding:.5rem;background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow);z-index:10}.dropdown .group-link{font-weight:300;margin-bottom:.25rem}.dropdown a{display:block;padding:.62rem .72rem;border-radius:9px;color:var(--text);text-decoration:none;font-weight:300}.dropdown a:hover{background:var(--soft);color:var(--brand-dark)}
.dropdown a.current{background:var(--soft);color:var(--brand-dark)}
.nav-group[open]>summary:after{content:"⌃"}
.site-nav>a.current{background:rgba(255,255,255,.18);color:#fff}
.menu-toggle{display:none;margin-left:auto;border:0;background:transparent;padding:.5rem;cursor:pointer}.menu-toggle i{display:block;width:25px;height:2px;background:var(--text);margin:5px}
main{padding:2rem 0 4rem}.page-shell{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}.page-header{background:#fff;border-bottom:1px solid var(--border)}.page-header .header-inner{padding:0 clamp(1rem,3vw,2rem)}.page-content{padding:clamp(1.2rem,4vw,3rem)}
.content-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem}.content-row{display:contents}.content-cell{min-width:0}.content-cell img{border-radius:12px}
.page-content .content-cell img:not([src$="enpixel.gif"]):not(.hero-img):not(.map-img){width:254px !important;height:181px !important;max-width:254px !important;max-height:181px !important;object-fit:cover}
body.karta-page .page-content .content-cell img:not(.hero-img){width:auto !important;height:auto !important;object-fit:unset}
.content-cell img.map-img{width:100% !important;height:auto !important;max-width:280px !important;max-height:none !important;object-fit:contain;display:block;margin-top:.5rem}
.content-cell.hero-cell{grid-column:1/-1;margin:-1.25rem -1.5rem 0}
@media(min-width:1200px){.content-cell.hero-cell{margin:-1.5rem -2rem 0}}
@media(max-width:900px){.content-cell.hero-cell{margin:-1rem -1rem 0}}
.content-cell.hero-cell img.hero-img{width:100% !important;height:auto !important;max-width:none !important;max-height:30vh !important;aspect-ratio:1000/195;object-fit:cover;border-radius:0;display:block}
@media(min-width:1200px){.content-cell.hero-cell img.hero-img{aspect-ratio:auto !important;height:min(30vh,400px) !important;max-height:min(30vh,400px) !important}}
.site-footer{background:var(--brand-dark);color:#fff}.footer-inner{padding:2rem 0;display:flex;justify-content:space-between;gap:2rem}.footer-inner p{margin:.2rem 0;opacity:.75}.footer-links{display:flex;gap:1rem;flex-wrap:wrap}.footer-links a{color:#fff}
.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}
@media(max-width:840px){.menu-toggle{display:block}.nav-bar{display:none}.nav-bar.open{display:block}.site-nav{flex-direction:column;align-items:stretch;padding:.5rem 0 .75rem}.site-nav>a,.nav-group>summary{padding:.8rem 1rem;border-radius:0}.nav-group{position:static}.dropdown{position:static;box-shadow:none;border:0;background:transparent;border-left:2px solid rgba(255,255,255,.25);border-radius:0;margin:0 0 .3rem 1rem;padding:.2rem 0 .2rem .5rem}.dropdown a{color:#fff}.dropdown a:hover{background:rgba(255,255,255,.14);color:#fff}.dropdown a.current{background:rgba(255,255,255,.18);color:#fff}.content-grid{grid-template-columns:1fr}}
@media(max-width:600px){.header-inner{min-height:68px}.page-content{padding:1rem}.footer-inner{display:block}.footer-links{margin-top:1rem}}

.content-area{min-width:0}

/* V9: utnyttja skärmytan bättre */
:root{--max:1440px}
.container{width:min(calc(100% - 2.5rem),var(--max))}
.page-shell{width:100%}
.page-content{padding:clamp(1.5rem,3vw,3.25rem)}
.page-content>p,.page-content>h2,.page-content>h3,.page-content>h4,.page-content>ul,.page-content>ol,.page-content>blockquote{max-width:1000px}
.page-content .content-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));gap:2rem;margin:0}
.page-content .content-grid.media-grid{grid-template-columns:minmax(0,7fr) minmax(0,3fr);align-items:start}
@media(max-width:700px){.page-content .content-grid.media-grid{grid-template-columns:1fr}}
.page-content .content-cell{font-size:1rem}

/* Typography: nicer line-wrapping so lines don't break awkwardly */
.page-content .content-cell p,.page-content .content-cell li{
  max-width:70ch;
  text-wrap:pretty;
  overflow-wrap:break-word;
  word-break:normal;
  hyphens:auto;
  -webkit-hyphens:auto;
  hyphenate-limit-chars:6 3 3;
}
.page-content .content-cell a{overflow-wrap:break-word;word-break:break-word}
/* Inside the 70/30 text+image layout, let text use the full 70% column instead of capping at 70ch */
.page-content .content-grid.media-grid .content-cell p,
.page-content .content-grid.media-grid .content-cell li{
  max-width:none;
}
.page-content .content-cell h2,.page-content .content-cell h3{
  text-wrap:balance;
  max-width:70ch;
  overflow-wrap:break-word;
}

/* Section headings restored from the old inline title markup */
.page-content .content-cell h1{
  font-size:1.75rem;
  font-weight:700;
  line-height:1.25;
  color:var(--brand-dark);
  margin:0 0 1rem;
  letter-spacing:.01em;
}
.page-content .content-cell h2{
  font-size:1.35rem;
  font-weight:700;
  line-height:1.25;
  color:var(--brand-dark);
  margin:0 0 1rem;
  letter-spacing:.01em;
}
.page-content .content-cell h2:first-child{margin-top:0}
.page-content .content-cell p+h2,.page-content .content-cell ul+h2,.page-content .content-cell ol+h2{margin-top:1.75rem}
.page-content img{max-width:100%;height:auto}
.page-content .content-cell>img:only-child{width:100%;max-height:520px;object-fit:cover}
.page-content table{width:100%}
@media(min-width:1200px){
  .page-content{padding:3rem 4rem}
  .page-content .content-grid{gap:2.5rem}
}
@media(max-width:900px){
 .container{width:min(calc(100% - 1.5rem),var(--max))}
 .page-content{padding:1.25rem}
}

/* V10: kompaktare sidlayout och mindre galleri */
main{padding:1rem 0 2rem}
.page-shell{border-radius:14px}
.page-content{padding:1.25rem 1.5rem}
.page-content p:first-child{margin-top:0}
.page-content h2:first-child,.page-content h3:first-child,.page-content h4:first-child{margin-top:0}
.page-content .content-grid{gap:1.25rem}
.page-content .content-cell{padding:0}
.page-content .content-cell>p:first-child{margin-top:0}
.page-content .content-cell>h2:first-child,.page-content .content-cell>h3:first-child,.page-content .content-cell>h4:first-child{margin-top:0}
.gallery-grid{grid-template-columns:repeat(auto-fill,minmax(135px,1fr))!important;gap:.65rem!important}
.gallery-item{aspect-ratio:4/3;border-radius:9px}
.gallery-item img{object-fit:cover}
@media(min-width:1200px){
 .page-content{padding:1.5rem 2rem}
}
@media(max-width:900px){
 main{padding:.5rem 0 1.25rem}
 .page-content{padding:1rem}
 .gallery-grid{grid-template-columns:repeat(auto-fill,minmax(110px,1fr))!important}
}

/* V11: kompakt logotyprad och mindre sidrubriker */
.page-header{background:#fff;border-bottom:1px solid var(--border);padding:0}
.header-inner{min-height:58px}
.brand-mark{width:34px;height:34px;border-radius:9px;font-size:.9rem}
.brand strong{font-size:.95rem}
.brand small{font-size:.65rem}
@media(max-width:900px){.header-inner{min-height:54px}}

/* FINAL FIX: remove the gap between navigation and the page/hero */
main {
    padding-top: 0 !important;
}

.page-shell {
    margin-top: 0 !important;
}

.page-content {
    padding-top: 0 !important;
}

.content-cell.hero-cell {
    margin-top: 0 !important;
}

.content-cell.hero-cell img.hero-img {
    display: block !important;
}

/* FINAL GAP FIX */
header, nav, .site-header, .main-nav {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
    border-bottom: 0 !important;
}

main, .page-shell, .page-content {
    margin-top: 0 !important;
    padding-top: 0 !important;
    border-top: 0 !important;
}

.content-cell.hero-cell {
    margin-top: 0 !important;
    padding-top: 0 !important;
    border-top: 0 !important;
}

.content-cell.hero-cell::before {
    display: none !important;
}

.content-cell.hero-cell img.hero-img {
    display: block !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
    border-top: 0 !important;
    vertical-align: top !important;
}

/* Slightly lighter grey navigation bar */
nav,
.site-header,
.main-nav {
    background-color: #2b2b2b !important;
}

/* Only the full navigation bar is dark grey */
nav {
    background-color: #252525 !important;
}

/* NAV: same grey as page-shell, across the complete width */
nav {
    background: #252525 !important;
    background-color: #252525 !important;
    width: 100% !important;
}

nav > *,
nav .nav-inner,
nav .nav-container,
nav .container {
    background: #252525 !important;
    background-color: #252525 !important;
}

/* Brand mark and typography */
.brand strong {
    font-family: "Helvetica Neue Mager", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
    font-weight: 300 !important;
}

.brand-mark {
    padding: 0 !important;
    overflow: hidden !important;
    background: transparent !important;
    border-radius: 50% !important;
}

.brand-mark img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

/* Keep the entire nav-bar one consistent grey */
.nav-bar {
    background: #252525 !important;
}

/* Brand mark */
.brand-mark,
.brand-mark .brand-text,
.brand-mark a,
.brand-text {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
    font-weight: 700 !important;
}

/* Brand mark typography */
.brand-mark .brand-text,
.brand-mark .brand-title,
.brand-mark .brand-name {
    font-size: 28px !important;
    font-weight: 700 !important;
}

.brand-mark .brand-subtitle,
.brand-mark .brand-location,
.brand-mark small {
    font-size: 14px !important;
}

/* Exact Brand-mark font sizes */
.brand strong {
    font-size: 28px !important;
    font-weight: 700 !important;
}

.brand small {
    font-size: 14px !important;
}

/* Tighten the gap between "Brf Pluto" and "Majorna · Göteborg" */
.brand strong {
    line-height: 1.15 !important;
}
.brand small {
    line-height: 1.3 !important;
}

/* Indent the menu so it lines up under the "Brf Pluto" text */
@media(min-width:841px){
    .nav-bar {
        padding-left: clamp(1rem, 3vw, 2rem);
    }
}

/* Page-shell keeps a sensible max width instead of stretching edge-to-edge on big screens */
.container {
    width: min(calc(100% - 2.5rem), var(--max)) !important;
    max-width: var(--max) !important;
    margin-inline: auto !important;
}

/* Home nav item: same typography as the other menu items */
nav a.home,
nav a.home-link,
nav .home,
nav .nav-home {
    font-family: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
}

/* Hem uses exactly the same typography as Bildgalleri and the other nav links */
.site-nav > a:first-child {
    font-family: inherit !important;
    font-size: .94rem !important;
    font-weight: 300 !important;
}

/* Small gap above page-shell, a little less than the nav row's own height */
main {
    padding-top: 1.75rem !important;
}

/* Page-shell: square corners instead of rounded */
.page-shell {
    border-radius: 0 !important;
}

/* Desktop dropdown submenu ("menyraden som öppnas"): square corners */
.dropdown {
    border-radius: 0 !important;
}

/* Align "Hem" so its text lines up under the "M" in "Majorna · Göteborg"
   (nav links have their own .58rem left padding baked in, so we subtract it) */
@media(min-width:841px){
    .nav-bar {
        padding-left: calc(clamp(1rem, 3vw, 2rem) - .58rem) !important;
    }
}

/* Equal breathing room above and below the "Brf Pluto" brand block */
.brand {
    padding: .75rem 0 !important;
}