/* =====================================================================
   Noventis Ventilation – gemensam navigation och tillgänglighet
   Helhetsleverans 2026-10-24. Laddas SIST på alla sidor, efter
   style.css, sidans egna <style>, city-page.css och fixes.css.
   ===================================================================== */

/* ---------------------------------------------------------------
   1. DATORMENYN – sju huvudval med rullgardiner
      Visas från 1240 px. Smalare skärmar får hamburgermenyn.
   --------------------------------------------------------------- */
.header .main-nav{display:flex;align-items:center;gap:6px;flex-wrap:nowrap}
.header .main-nav > a,
.header .main-nav .nav-dropdown-toggle{
  display:inline-flex;align-items:center;gap:5px;min-height:44px;padding:0 10px;
  font-size:15px;font-weight:700;color:#08162f;white-space:nowrap;border-radius:10px
}
.header .main-nav > a:hover,.header .main-nav .nav-dropdown-toggle:hover{background:#f1f5fb}
.header .main-nav > a.active,.header .main-nav .nav-dropdown.active > .nav-dropdown-toggle{color:#1E7BEF}
.header .main-nav .nav-dropdown-toggle:focus-visible,
.header .main-nav > a:focus-visible,
.nav-dropdown-menu a:focus-visible{outline:2px solid #1E7BEF;outline-offset:2px}

.header .nav-dropdown-menu{
  display:flex;flex-direction:column;gap:2px;min-width:260px;
  left:0;right:auto;margin-top:8px;padding:10px;
  max-height:74vh;overflow-y:auto;
  transform:translateY(8px)
}
.header .nav-dropdown-menu:before{top:-10px;height:10px}
.header .nav-dropdown.open .nav-dropdown-menu,
.header .nav-dropdown:hover .nav-dropdown-menu,
.header .nav-dropdown:focus-within .nav-dropdown-menu{opacity:1;visibility:visible;transform:translateY(0)}
.header .nav-dropdown-menu a{
  display:flex;align-items:center;min-height:44px;padding:0 12px;
  font-size:15px;white-space:nowrap
}
.header .nav-dropdown-menu a.active{color:#1E7BEF;background:#eef6ff}
/* Områden: två spalter, högerjusterad så att den inte hamnar utanför skärmen */
.header .nav-dd-omraden .nav-dropdown-menu{
  display:grid;grid-template-columns:1fr 1fr;gap:2px 10px;left:auto;right:0;min-width:340px
}
.header .nav-dd-bostad .nav-dropdown-menu{left:auto;right:0}

@media(max-width:1239px){
  .header .main-nav{display:none}
  .header-icons{display:flex}
}

/* ---------------------------------------------------------------
   2. SIDHUVUDET PÅ SMÅ SKÄRMAR
      Menyknappen klipptes vid 320–360 px eftersom logga + tre
      knappar var bredare än skärmen.
   --------------------------------------------------------------- */
.header-inner{min-width:0}
.header .logo-wrap{min-width:0;flex:0 1 auto}
.header-icons{flex:none}
.icon-btn{width:48px;height:48px}
@media(max-width:420px){
  .header-inner{padding:12px 14px;gap:8px}
  .header-icons{gap:8px}
  .icon-btn{width:44px;height:44px}
  .header .logo{height:38px !important;max-width:calc(100vw - 186px) !important;object-fit:contain;object-position:left center}
}

/* ---------------------------------------------------------------
   3. MOBILMENYN – grupper som fälls ut, minst 44 px klickyta
   --------------------------------------------------------------- */
.mobile-menu{max-width:380px}
.mobile-menu-close{width:44px;height:44px;font-size:18px}
.mobile-menu > a,
.mobile-menu .mm-group a{display:flex;align-items:center;min-height:46px;padding:8px 0;line-height:1.35}
.mobile-menu .mm-group{border-bottom:1px solid #eef2f8}
.mobile-menu .mm-group summary{
  display:flex;align-items:center;justify-content:space-between;min-height:48px;
  font-weight:800;color:#08162f;cursor:pointer;list-style:none
}
.mobile-menu .mm-group summary::-webkit-details-marker{display:none}
.mobile-menu .mm-group summary::after{
  content:"";width:9px;height:9px;border-right:2px solid #1E7BEF;border-bottom:2px solid #1E7BEF;
  transform:rotate(45deg);margin:0 6px 4px 0;transition:transform .2s
}
.mobile-menu .mm-group[open] summary::after{transform:rotate(225deg);margin-bottom:-4px}
.mobile-menu .mm-group a{padding-left:14px;font-weight:600;border-bottom:1px solid #f3f6fa}
.mobile-menu .mm-group a:last-child{border-bottom:none}
.mobile-menu a.active{color:#1E7BEF}
.mobile-menu a.cta{justify-content:center;min-height:50px}
.mobile-menu summary:focus-visible,.mobile-menu a:focus-visible{outline:2px solid #1E7BEF;outline-offset:2px}

/* ---------------------------------------------------------------
   4. SIDFOTEN – rubrikerna är h2 (korrekt rubrikordning) men ser
      ut som tidigare h3. Länkarna får 44 px klickyta.
   --------------------------------------------------------------- */
.footer-col .footer-title{color:#fff;font-size:16px;line-height:1.3;margin:0 0 14px;font-weight:800}
.footer-col p{margin:0}
.footer-col p + p{margin-top:0}
.footer-col p:not(:has(a)){margin:0 0 9px}
.footer-col a{display:inline-flex;align-items:center;min-height:44px;line-height:1.4}
.footer-col a.active{color:#fff}

/* ---------------------------------------------------------------
   5. KLICKYTOR MINST 44 PX
      Gäller fristående länkar och knappar. Länkar mitt i löptext
      följer textens radhöjd (WCAG undantar inline-länkar).
   --------------------------------------------------------------- */
.topbar .top-right a{display:inline-flex;align-items:center;min-height:44px}
.breadcrumb a{display:inline-flex;align-items:center;min-height:44px}
.sidebar-card a{display:flex;align-items:center;min-height:44px;margin-top:6px}
.related-links a{min-height:44px;padding:12px 15px}
.service-link{display:flex;align-items:center;min-height:44px}
.review-button{display:inline-flex;align-items:center;min-height:44px}
.page-btn-primary,.page-btn-secondary,.btn-primary,.btn-secondary,.hero-primary,.hero-secondary{min-height:44px}
.form-alt a{display:inline-flex;align-items:center;min-height:44px}
.offert-form .btn{min-height:50px}
a.problem-card,a.card,a.omrade-link,a.area-link{min-height:44px}
.city-areas a,.omraden-grid a,.area-grid a,.area-list a{display:inline-flex;align-items:center;min-height:44px}
details > summary{min-height:44px}

/* ---------------------------------------------------------------
   6. Inget får ge sidledsscroll
   --------------------------------------------------------------- */
html,body{max-width:100%}
.mobile-menu{overflow-x:hidden}

/* ---------------------------------------------------------------
   7. Kompletterande klickytor (hela sajten, uppmätt 2026-10-24)
   --------------------------------------------------------------- */
.header .logo-text{display:flex;align-items:center;min-height:44px}
.site-footer .footer-col a,.site-footer .footer-col p a{display:inline-flex;align-items:center;min-height:44px;padding:0}
.pris-tabell td a,.ort-pris td a,.comparison td a,.comparison-table td a{display:inline-flex;align-items:center;min-height:44px}
.problem-card a,.problem-box li a,.services-list li a,.ort-fokus a,.home-wrap a.btn-back,.home-wrap > p > a:only-child{display:inline-flex;align-items:center;min-height:44px}
.problem-box li,.services-list li{padding-top:0;padding-bottom:0}

/* ---------------------------------------------------------------
   8. Kontaktsidan: korten sprängde kolumnen vid 320 px
   --------------------------------------------------------------- */
.contact-grid > *{min-width:0}
@media(max-width:420px){.contact-card{padding:26px 20px}}

/* ---------------------------------------------------------------
   9. Ortssidornas knappar och checklista
   --------------------------------------------------------------- */
.card-button{display:inline-flex;align-items:center;min-height:44px}
.checklist-grid label{display:flex;align-items:center;gap:10px;min-height:44px;cursor:pointer}
.checklist-grid input[type=checkbox]{width:22px;height:22px;flex:none}
.las-mer a{display:inline-flex;align-items:center;min-height:44px}

/* ---------------------------------------------------------------
   10. Rena länklistor i innehåll (våg 1) – 44 px klickyta
   --------------------------------------------------------------- */
.article ul.lanklista{padding-left:22px}
.article ul.lanklista li{margin-bottom:0}
.article ul.lanklista li a{display:inline-flex;align-items:center;min-height:44px}
