@import url("https://fonts.googleapis.com/css2?family=Saira+Extra+Condensed:wght@600;700&display=swap");

/* ==========================================================================
   AB Motor Webshop — brand layer (matches abmotor.quick3.no / Q3Standard01)
   Open Sans · slate #383B42 · near-black bars · ORANGE #FF9600 CTAs
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;700;800&family=Saira+Extra+Condensed:wght@500;600;700&display=swap');

:root{
	--abm-orange:#ff9600;
	--abm-orange-dk:#e88600;
	--abm-ink:#333;
	--abm-slate:#383b42;
	--abm-dark:#1a1a1a;
	--abm-border:#e5e5e5;
	--abm-muted:#6a6f77;
	--abm-maxw:1340px; /* = sidens innholdsbredde. Wrapperne er content-box, så max-width = innholdsbredde direkte → band-innhold flukter med sidens innhold (inline) */
}

body{ background:#fbfbf9; }

/* ---- Global -------------------------------------------------------------- */
a,.wp-element-button,button{ transition:color .15s,background-color .15s,border-color .15s,transform .15s,box-shadow .15s; }
.wp-element-button,button,[type=submit],summary{ cursor:pointer; }
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{
	outline:3px solid var(--abm-orange); outline-offset:2px; border-radius:2px;
}
@media (prefers-reduced-motion:reduce){ *,*::before,*::after{ transition-duration:.001ms!important; animation-duration:.001ms!important; } }
.abm-kicker{ color:var(--abm-orange); text-transform:uppercase; letter-spacing:.14em; font-weight:700; font-size:.8125rem; }

/* ---- Utility bar -------------------------------------------------------- */
/* bg now an editable block attribute (backgroundColor:"dark") */
.abm-utilitybar{ color:#dcdcdc; font-size:.8125rem; padding:0!important; }
.abm-utility-inner{ max-width:var(--abm-maxw); margin:0 auto; padding:.45rem clamp(.9rem,3vw,2rem); display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; }
.abm-utility-inner>*{ margin:0; }
.abm-utilitybar a{ color:#dcdcdc; } .abm-utilitybar a:hover{ color:var(--abm-orange); }
.abm-util-accent{ color:var(--abm-orange); font-weight:700; }

/* ---- Header main (logo + search + icon nav) ----------------------------- */
.abm-header-wrap{ position:sticky; top:0; z-index:200; background:#fff; }
/* bg now an editable block attribute (backgroundColor:"base") */
.abm-header-main{ padding:0!important; }
.abm-header-row{ width:76%; max-width:none; margin:0 auto; padding:.6rem 0; display:flex; align-items:center; gap:clamp(1rem,3vw,2.5rem); }
/* Site Logo block: width attribute drives size (size slider works); no fixed height */
.abm-logo img{ display:block; height:auto; }
.abm-logo.wp-block-site-logo{ flex:0 0 auto; margin:0; }

/* native core/search block (button-inside) styled as the rounded pill */
.abm-search.wp-block-search{ flex:1 1 auto; max-width:680px; margin:0; }
.abm-search .wp-block-search__inside-wrapper{ display:flex; align-items:center; border:1px solid #cfcfcf; border-radius:30px; background:#fff; overflow:hidden; padding:0; }
.abm-search:focus-within .wp-block-search__inside-wrapper{ border-color:var(--abm-orange); box-shadow:0 0 0 3px rgba(255,150,0,.15); }
.abm-search .wp-block-search__input{ flex:1; border:0; outline:0; padding:.7rem 1.2rem; font-size:1rem; background:transparent; color:var(--abm-ink); font-family:inherit; margin:0; }
.abm-search .wp-block-search__button{ background:transparent; border:0; color:var(--abm-slate); padding:0 1rem; margin:0; min-height:auto; display:flex; align-items:center; }
.abm-search .wp-block-search__button:hover{ color:var(--abm-orange); }
.abm-search .wp-block-search__button svg{ fill:currentColor; }

.abm-iconnav{ display:flex; gap:clamp(.6rem,1.6vw,1.5rem); flex:0 0 auto; align-items:flex-start; }
.abm-iconnav>*{ margin-block:0; }   /* kill block-gap so icons line up (no "ikon opp/ned") */
.abm-iconnav a{ display:flex; flex-direction:column; align-items:center; gap:3px; color:var(--abm-slate); font-size:.72rem; font-weight:600; text-align:center; min-width:54px; }
.abm-iconnav svg{ width:24px; height:24px; }
.abm-iconnav a:hover{ color:var(--abm-orange); }
/* auth-menu block (login modal) styled to sit in the icon nav like the other items */
.abm-iconnav .abm-authmenu{ display:flex; align-items:center; align-self:flex-start; flex:0 0 auto; margin:0; }
.abm-iconnav .qcom-auth-menu{ display:flex; align-items:center; }
.abm-iconnav .abm-authmenu :is(button,a){ display:flex; flex-direction:column; align-items:center; gap:3px; color:var(--abm-slate); font-size:.72rem; font-weight:600; min-width:54px; background:none; border:0; cursor:pointer; font-family:inherit; }
.abm-iconnav .abm-authmenu :is(button,a):hover{ color:var(--abm-orange); }
.abm-iconnav .abm-authmenu svg{ width:24px; height:24px; }

/* ---- Black nav bar + mega-menu ------------------------------------------ */
/* bg now an editable block attribute (backgroundColor:"dark") */
.abm-navbar{ border-bottom:3px solid var(--abm-orange); }
.abm-navbar-inner{ max-width:var(--abm-maxw); margin:0 auto; padding:0 clamp(.9rem,3vw,2rem); }

/* Main category row: 11 groups across the bar, each with subgroup dropdown */
.abm-mainnav-row{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; align-items:stretch; }
.abm-navitem{ position:relative; }
.abm-navitem > a{ display:flex; align-items:center; gap:.3rem; color:#ededed; font-weight:600; text-transform:uppercase; letter-spacing:.02em; font-size:.8rem; padding:.85rem .85rem; border-bottom:3px solid transparent; margin-bottom:-3px; white-space:nowrap; }
.abm-navitem:hover > a,.abm-navitem:focus-within > a{ color:#fff; border-bottom-color:var(--abm-orange); }
.abm-caret{ font-size:.7em; opacity:.75; }
.abm-navdrop{ position:absolute; left:0; top:100%; z-index:300; display:none; min-width:225px; background:#fff; border:1px solid var(--abm-border); border-top:3px solid var(--abm-orange); box-shadow:0 18px 40px rgba(0,0,0,.18); padding:.35rem 0; border-radius:0 0 6px 6px; list-style:none; margin:0; }
.abm-navitem:hover .abm-navdrop,.abm-navitem:focus-within .abm-navdrop{ display:block; }
.abm-navdrop li a{ display:block; padding:.5rem 1.1rem; color:var(--abm-ink); font-size:.875rem; white-space:nowrap; }
.abm-navdrop li a:hover{ background:var(--abm-surface); color:var(--abm-orange); }
@media (max-width:560px){ .abm-mainnav-row{ overflow-x:auto; flex-wrap:nowrap; } .abm-navdrop{ position:static; display:block; box-shadow:none; border:0; padding:0 0 .4rem 1rem; min-width:0; } }
.abm-megawrap{ position:relative; }
.abm-mega-trigger{ display:flex; align-items:center; gap:.5rem; background:transparent; border:0; color:#fff; font-weight:700; text-transform:uppercase; letter-spacing:.05em; font-size:.95rem; padding:.85rem 0; }
.abm-mega-trigger svg{ transition:transform .2s; }
.abm-megawrap:hover .abm-mega-trigger svg,.abm-megawrap:focus-within .abm-mega-trigger svg{ transform:rotate(180deg); }
.abm-nav-quick{ display:flex; align-items:center; color:#eee; font-weight:600; text-transform:uppercase; letter-spacing:.03em; font-size:.85rem; border-bottom:3px solid transparent; margin-bottom:-3px; }
.abm-nav-quick:hover{ color:#fff; border-bottom-color:var(--abm-orange); }

/* All-main-groups nav row (abmotor/mainnav) */
.abm-navbar-inner{ display:block; }
.abm-mainnav-row{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; align-items:stretch; }
.abm-navitem{ position:relative; }
.abm-navitem > a{ display:flex; align-items:center; gap:.35rem; color:#fff; font-weight:600; text-transform:uppercase; letter-spacing:.03em; font-size:.82rem; padding:.85rem .95rem; border-bottom:3px solid transparent; margin-bottom:-3px; line-height:1; }
.abm-navitem:hover > a,.abm-navitem:focus-within > a{ border-bottom-color:var(--abm-orange); background:rgba(255,255,255,.05); }
.abm-caret{ font-size:.62rem; opacity:.85; }
.abm-navdrop{ position:absolute; left:0; top:100%; z-index:300; display:none; min-width:232px; background:#fff; border:1px solid var(--abm-border); border-top:3px solid var(--abm-orange); box-shadow:0 18px 40px rgba(0,0,0,.18); padding:.4rem 0; list-style:none; margin:0; border-radius:0 0 6px 6px; }
.abm-navitem.has-children:hover .abm-navdrop,.abm-navitem.has-children:focus-within .abm-navdrop{ display:block; }
.abm-navdrop li a{ display:block; padding:.55rem 1.1rem; color:var(--abm-ink); font-size:.9rem; white-space:nowrap; }
.abm-navdrop li a:hover{ background:var(--abm-surface); color:var(--abm-orange); }
@media (max-width:900px){ .abm-navitem > a{ padding:.7rem .7rem; font-size:.78rem; } .abm-navdrop{ position:static; display:block; box-shadow:none; border:0; background:transparent; padding:0 0 .4rem 1rem; } .abm-navdrop li a{ color:#cfcfcf; } }

.abm-mega-panel{ position:absolute; left:0; top:100%; z-index:300; display:none; width:min(1100px,92vw); background:#fff; border:1px solid var(--abm-border); border-top:3px solid var(--abm-orange); box-shadow:0 22px 50px rgba(0,0,0,.22); padding:1.6rem 1.8rem; border-radius:0 0 8px 8px; }
.abm-megawrap:hover .abm-mega-panel,.abm-megawrap:focus-within .abm-mega-panel{ display:block; }
.abm-mega-inner{ column-count:4; column-gap:2rem; }
@media (max-width:1100px){ .abm-mega-inner{ column-count:3; } }
.abm-mega-col{ break-inside:avoid; margin-bottom:1.3rem; display:inline-block; width:100%; }
.abm-mega-head{ display:block; color:var(--abm-orange); font-weight:700; text-transform:uppercase; letter-spacing:.04em; font-size:.95rem; padding-bottom:.4rem; margin-bottom:.5rem; border-bottom:1px dotted #ddd; }
.abm-mega-col ul{ list-style:none; margin:0; padding:0; }
.abm-mega-col li{ margin:.18rem 0; }
.abm-mega-col li a{ color:var(--abm-ink); font-size:.9rem; display:block; padding:.12rem 0 .12rem .8rem; position:relative; }
.abm-mega-col li a::before{ content:"\203A"; position:absolute; left:0; color:var(--abm-orange); }
.abm-mega-col li a:hover{ color:var(--abm-orange); }

/* ---- Breadcrumbs (plugin block) — slim dark bar like quick3 -------------- */
.wp-block-quickcommerce-breadcrumbs{ background:var(--abm-dark); padding-top:.55rem!important; padding-bottom:.55rem!important; padding-left:clamp(.9rem,3vw,2rem)!important; padding-right:clamp(.9rem,3vw,2rem)!important; margin:0!important; }
.wp-block-quickcommerce-breadcrumbs .qcom-breadcrumbs{ max-width:var(--abm-maxw); margin:0 auto!important; }
.wp-block-quickcommerce-breadcrumbs .qcom-breadcrumbs__list{ flex-wrap:wrap; }
.wp-block-quickcommerce-breadcrumbs,
.wp-block-quickcommerce-breadcrumbs a,
.wp-block-quickcommerce-breadcrumbs .qcom-breadcrumbs__link{ color:#d6d6d6!important; }
.wp-block-quickcommerce-breadcrumbs [aria-current],
.wp-block-quickcommerce-breadcrumbs .qcom-breadcrumbs__item:last-child span{ color:#fff!important; }
.wp-block-quickcommerce-breadcrumbs a:hover{ color:var(--abm-orange)!important; }

/* ---- HERO --------------------------------------------------------------- */
.abm-hero-cover{ min-height:380px!important; background-color:#161616!important; }
.abm-hero-cover > .wp-block-cover__background{ background:linear-gradient(180deg,#2c2c2c 0%,#141414 100%)!important; opacity:1!important; }
.abm-hero-cover .wp-block-cover__inner-container{ position:relative; z-index:1; }
.abm-hero-kicker{ color:var(--abm-orange)!important; text-transform:uppercase; letter-spacing:.18em; font-weight:700; font-size:.85rem; }
.abm-hero-cover h1{ color:#fff!important; line-height:1.06; }
.abm-hero-cover p{ color:#ededed!important; }
.abm-hero-cover .is-style-outline .wp-block-button__link{ color:#fff!important; border-color:#fff!important; }

/* ---- Category grid (homepage shortcode) --------------------------------- */
.abm-catgrid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.25rem; }
.abm-catgrid .abm-cat-card{ display:flex; border:1px solid var(--abm-border); border-radius:10px; overflow:hidden; background:#fff; text-decoration:none; color:var(--abm-slate); min-height:128px; }
.abm-catgrid .abm-cat-media{ flex:0 0 42%; background:var(--abm-surface,#f6f6f4); overflow:hidden; }
.abm-catgrid .abm-cat-media img{ width:100%; height:100%; object-fit:cover; transition:transform .35s; }
.abm-catgrid .abm-cat-noimg{ display:flex; align-items:center; justify-content:center; height:100%; font-weight:800; color:#cfcfcf; font-size:1.6rem; }
.abm-catgrid .abm-cat-body{ flex:1; padding:1.1rem 1.2rem; display:flex; flex-direction:column; justify-content:center; gap:.25rem; }
.abm-catgrid .abm-cat-name{ font-weight:800; text-transform:uppercase; letter-spacing:.03em; font-size:1.12rem; }
.abm-catgrid .abm-cat-sub{ color:var(--abm-muted); font-size:.85rem; }
.abm-catgrid .abm-cat-go{ align-self:center; padding-right:1rem; color:var(--abm-orange); font-size:2rem; line-height:1; transition:transform .2s; }
.abm-catgrid .abm-cat-card:hover{ border-color:#d6d6d6; box-shadow:0 14px 30px rgba(0,0,0,.10); transform:translateY(-3px); }
.abm-catgrid .abm-cat-card:hover .abm-cat-media img{ transform:scale(1.05); }
.abm-catgrid .abm-cat-card:hover .abm-cat-go{ transform:translateX(5px); }

/* ---- Product card grid (homepage shortcode) ----------------------------- */
.abm-prodgrid{ display:grid; grid-template-columns:repeat(5,1fr); gap:1.1rem; }
.abm-prodcard{ display:flex; flex-direction:column; border:1px solid var(--abm-border); border-radius:10px; overflow:hidden; background:#fff; text-decoration:none; color:var(--abm-slate); }
.abm-prodcard-media{ aspect-ratio:1/1; background:#fff; display:flex; align-items:center; justify-content:center; overflow:hidden; padding:.5rem; }
.abm-prodcard-media img{ width:100%; height:100%; object-fit:contain; mix-blend-mode:multiply; transition:transform .3s; }
.abm-prodcard-body{ padding:.8rem .9rem 1rem; display:flex; flex-direction:column; gap:.4rem; flex:1; }
.abm-prodcard-title{ font-size:.88rem; font-weight:400; line-height:1.35; color:var(--abm-ink); }
.abm-prodcard-price{ margin-top:auto; font-weight:800; color:var(--abm-slate); font-size:1.05rem; }
.abm-prodcard:hover{ border-color:#d6d6d6; box-shadow:0 12px 28px rgba(0,0,0,.10); transform:translateY(-3px); }
.abm-prodcard:hover .abm-prodcard-media img{ transform:scale(1.04); }

/* ---- USP strip ---------------------------------------------------------- */
.abm-uspgrid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem; }
.abm-uspgrid .abm-usp-item{ display:flex; gap:.85rem; align-items:flex-start; }
.abm-uspgrid svg{ width:30px; height:30px; color:var(--abm-orange); flex:0 0 auto; }
.abm-uspgrid h3{ font-size:1rem; margin:.1rem 0 .15rem; }
.abm-uspgrid p{ color:var(--abm-muted); font-size:.875rem; margin:0; line-height:1.45; }

/* ---- CTA band ----------------------------------------------------------- */
.abm-cta-band{ background:var(--abm-dark); color:#fff; border-radius:12px; }
.abm-cta-band h2{ color:#fff; } .abm-cta-band .abm-muted{ color:#bdbdbd; }

/* ---- Category / archive page (plugin storefront) ------------------------ */
/* Page title centered uppercase like quick3 */
.qcom-archive-title,.wp-block-query-title,.page .wp-block-post-title,.tax-qcom_category .wp-block-query-title{
	text-align:center; text-transform:uppercase; letter-spacing:.02em;
}
/* Plugin product cards: clean white card, hover lift */
.wp-block-quickcommerce-product-template li,
.wp-block-quickcommerce-product-template .wp-block-post,
ul.wp-block-post-template>li{ border:1px solid var(--abm-border); border-radius:10px; background:#fff; transition:transform .2s,box-shadow .2s; overflow:hidden; }
.wp-block-quickcommerce-product-template li:hover,
.wp-block-quickcommerce-product-template .wp-block-post:hover{ box-shadow:0 12px 28px rgba(0,0,0,.10); transform:translateY(-2px); }
/* Price emphasis */
.wp-block-quickcommerce-product-price,.wp-block-quickcommerce-price-amount{ font-weight:800; color:var(--abm-slate); }
/* Item-code badge */
.wp-block-quickcommerce-product-code{ background:#efefef; color:#666; border-radius:20px; padding:.1rem .6rem; font-size:.72rem; display:inline-block; }
/* Orange pill CTA for add-to-cart (overrides token radius to pill) */
.wp-block-quickcommerce-add-to-cart-button button,
.wp-block-quickcommerce-add-to-cart-button .wp-element-button,
.abm-buy,button.qcom-add-to-cart{
	background:var(--abm-orange)!important; color:#fff!important; border:0!important; border-radius:26px!important;
	font-weight:700!important; text-transform:uppercase; letter-spacing:.02em; width:100%;
}
.wp-block-quickcommerce-add-to-cart-button button:hover{ background:var(--abm-orange-dk)!important; }
/* Favorite star = orange */
.wp-block-quickcommerce-wishlist-add-button svg,.qcom-wishlist svg{ color:var(--abm-orange); }
/* Quantity stepper pill */
.wp-block-quickcommerce-quantity-input,.qcom-quantity{ border:1px solid var(--abm-border); border-radius:24px; overflow:hidden; }
/* Load-more / sort / filter buttons → orange pills */
.wp-block-quickcommerce-load-more-button button{ background:var(--abm-orange)!important; color:#fff!important; border-radius:26px!important; border:0!important; font-weight:700!important; }
.wp-block-quickcommerce-load-more-button button:hover{ background:var(--abm-orange-dk)!important; }

/* ---- Product card (override product-card-basic) ------------------------- */
.qcom-product-card{ border:1px solid var(--abm-border); border-radius:10px; background:#fff; overflow:hidden; height:100%; transition:transform .2s,box-shadow .2s; }
.qcom-product-card:hover{ box-shadow:0 12px 28px rgba(0,0,0,.10); transform:translateY(-3px); }
.qcom-card2{ display:flex; flex-direction:column; height:100%; padding:.85rem; gap:.4rem; }
.qcom-card2-media{ position:relative; background:#fff; }
.qcom-card2-media img{ object-fit:contain; mix-blend-mode:multiply; }
.qcom-card2-fav{ position:absolute; top:.3rem; left:.3rem; z-index:4; }
.qcom-card2-fav svg{ color:var(--abm-orange); width:22px; height:22px; }
.qcom-card2-stock{ position:absolute; bottom:.3rem; right:.3rem; z-index:4; font-size:.7rem; background:rgba(255,255,255,.9); border-radius:6px; padding:.05rem .35rem; }
.qcom-card2-code{ align-self:flex-start; background:#eee; color:#777; border-radius:20px; padding:.08rem .55rem; font-size:.7rem; }
.qcom-card2-title{ color:var(--abm-slate); }
.qcom-card2-title a{ color:var(--abm-slate); }
.qcom-card2-price .wp-block-quickcommerce-price-amount{ font-weight:800; color:var(--abm-slate); font-size:1.05rem; }
.qcom-card2-actions{ margin-top:auto; position:relative; z-index:3; }
.qcom-card2-qty,.qcom-card2-fav,.qcom-card2-actions{ position:relative; z-index:3; }
.qcom-card2-buy button,.qcom-card2-buy .wp-element-button{ width:100%; background:var(--abm-orange)!important; color:#fff!important; border:0!important; border-radius:26px!important; font-weight:700!important; text-transform:uppercase; letter-spacing:.02em; padding:.7rem 1rem!important; }
.qcom-card2-buy button:hover,.qcom-card2-buy .wp-element-button:hover{ background:var(--abm-orange-dk)!important; }
.qcom-card2 .wp-block-quickcommerce-quantity-input{ border:1px solid var(--abm-border); border-radius:24px; overflow:hidden; align-self:stretch; }

/* ---- Footer (matches quick3) -------------------------------------------- */
/* bg is now an editable block attribute (backgroundColor:"dark") so the Site Editor
   colour picker works; brand.css only keeps the orange accent + text colour. */
.abm-footer{ color:#cfcfcf; border-top:3px solid var(--abm-orange); }
.abm-footer>*{ margin-block:0; }          /* neutralise flow block-gap between sections */
.abm-footer-inner{ width:76%; max-width:none; margin:0 auto; padding:2.6rem 0; display:grid; grid-template-columns:1.3fr 1fr 1fr 1.1fr .8fr; gap:2rem; align-items:start; }
.abm-footer-inner>*{ margin-block:0; }    /* grid items: drop flow margins, grid gap rules */
.abm-foot-col h3{ color:var(--abm-orange); text-transform:uppercase; letter-spacing:.04em; font-size:1.05rem; margin:0 0 .9rem; font-weight:700; }
.abm-foot-col ul{ list-style:none; margin:0; padding:0; line-height:2.05; }
.abm-foot-col a{ color:#cfcfcf; } .abm-foot-col a:hover{ color:var(--abm-orange); }
.abm-foot-col p{ color:#cfcfcf; line-height:1.95; margin:0; }
.abm-foot-logo{ display:flex; align-items:center; justify-content:center; }
.abm-foot-logo img{ max-width:180px; height:auto; }
/* native Social Icons block (is-style-logos-only) styled to match the old minimal look */
.abm-social.wp-block-social-links{ display:flex; gap:.85rem; margin:0; padding:0; }
.abm-social .wp-social-link{ background:transparent; padding:4px; margin:0; }
.abm-social .wp-social-link svg{ width:26px; height:26px; }
.abm-social .wp-social-link svg,.abm-social .wp-social-link svg path{ fill:#cfcfcf; }
.abm-social .wp-social-link:hover{ transform:none; }
.abm-social .wp-social-link:hover svg,.abm-social .wp-social-link:hover svg path{ fill:var(--abm-orange); }
.abm-footer-bottom{ width:76%; max-width:none; margin:0 auto; padding:1rem 0 1.6rem; border-top:1px solid #2a2a2a; display:flex; justify-content:space-between; flex-wrap:wrap; gap:.6rem; color:#8f8f8f; font-size:.8rem; }
.abm-footer-bottom>*{ margin:0; }
@media (max-width:980px){ .abm-footer-inner{ grid-template-columns:1fr 1fr 1fr; } .abm-foot-logo{ justify-content:flex-start; } }
@media (max-width:620px){ .abm-footer-inner{ grid-template-columns:1fr 1fr; } }
@media (max-width:420px){ .abm-footer-inner{ grid-template-columns:1fr; } }

/* ==========================================================================
   COMPACT / DENSITY PASS — match quick3 scale (was too large)
   ========================================================================== */
body{ font-size:15px; }
/* Header tighter */
/* logo size now via Site Logo block width attr (default 125px ≈ 50px tall) */
.abm-header-row{ padding-top:.5rem; padding-bottom:.5rem; gap:clamp(.8rem,2.5vw,1.8rem); }
.abm-search.wp-block-search{ max-width:600px; }
.abm-search .wp-block-search__inside-wrapper{ border-radius:26px; }
.abm-search .wp-block-search__input{ padding:.55rem 1.1rem; font-size:.95rem; }
.abm-search .wp-block-search__button svg{ width:20px; height:20px; }
.abm-iconnav{ gap:clamp(.5rem,1.4vw,1.2rem); }
.abm-iconnav a{ font-size:.68rem; min-width:46px; }
.abm-iconnav svg{ width:21px; height:21px; }
.abm-utility-inner{ font-size:.78rem; padding-top:.35rem; padding-bottom:.35rem; }
.abm-navitem > a{ padding:.62rem .8rem; font-size:.78rem; }
/* Category archive title — compact, centered, uppercase */
.abm-archive-title,.wp-block-query-title{ font-size:1.8rem!important; text-transform:uppercase; text-align:center; margin:1.1rem 0 .8rem!important; letter-spacing:.01em; }
/* Product cards (plugin + homepage) smaller */
.qcom-card2{ padding:.6rem; gap:.3rem; }
.qcom-card2-title{ font-size:.82rem; }
.qcom-card2-code{ font-size:.66rem; padding:.06rem .5rem; }
.qcom-card2-price .wp-block-quickcommerce-price-amount{ font-size:.98rem; }
.qcom-card2-buy button,.qcom-card2-buy .wp-element-button{ padding:.5rem .8rem!important; font-size:.78rem; }
.abm-prodgrid{ gap:.9rem; }
.abm-prodcard-body{ padding:.6rem .7rem .8rem; }
.abm-prodcard-title{ font-size:.8rem; }
.abm-prodcard-price{ font-size:.98rem; }
.abm-catgrid{ gap:1rem; }
.abm-catgrid .abm-cat-card{ min-height:112px; }
.abm-catgrid .abm-cat-name{ font-size:1rem; }
/* Hero a touch shorter */
.abm-hero-cover{ min-height:340px!important; }

/* ---- Subgroup nav: single-line button row ØVERST i inline, over hele filter+vare-blokka
   (2026-06-05). Egen inline-constrained rad (1340, sentrert, padding → innhold 539–1815, flukter
   med varer/header/footer) → ligger ALLTID på topp, aldri under filteret (verken bred eller stablet).
   Én linje; mange knapper krymper (flex:1 1 0 + nowrap). Brytes bare på mobil. */
.abm-subcats{ display:grid; grid-template-columns:repeat(var(--cols,5),1fr); gap:.5rem; margin:0 auto 1.1rem; max-width:var(--abm-maxw,1340px); padding-inline:clamp(.9rem,3vw,2rem); box-sizing:border-box; }
.abm-subcat-tile{ min-width:0; min-height:0; display:flex; align-items:center; justify-content:center; text-align:center; padding:.62rem .7rem; background:#ececec; color:var(--abm-slate); font-weight:700; text-transform:uppercase; letter-spacing:.02em; font-size:.82rem; line-height:1.15; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; border-radius:6px; text-decoration:none; transition:background .15s,color .15s; }
.abm-subcat-tile:hover{ background:var(--abm-slate); color:#fff; }
@media (max-width:600px){ .abm-subcats{ grid-template-columns:repeat(2,1fr); } }

/* ---- Category shop layout (2026-06-05 rev8): 3 RESPONSIVE PROSENT-kolonner. INGEN fast bredde — alt skalerer.
   kol1=FILTER | kol2=VARER+KNAPPER | kol3=MARG = var(--abm-c1) | var(--abm-c2) | var(--abm-c1) (sum 100%).
   Skjermbredden bestemmer pixel-utfallet. Brytepunkt: under --abm-bp stables alt (knapper → filter → varer).
   Prosentene + brytepunktet er CSS-variabler → trivielt å justere. */
:root{ --abm-c1:10%; --abm-c2:80%; }
.abm-shop-layout{
	display:grid!important; align-items:start!important; position:static!important; row-gap:0!important; column-gap:0!important;
	/* 5 kolonner: [marg 1%][FILTER 10%][gap 1%][KNAPPER+VARER 76%][høyre marg 12%] = 100% */
	grid-template-columns:1% 10% 1% 76% 12%!important;
	grid-template-areas:". filt . sub ." ". filt . prod ."!important;
	max-width:none!important; margin-inline:calc(-1 * clamp(.9rem,3vw,2rem))!important; padding-inline:0!important; padding-bottom:1.5rem!important; box-sizing:border-box;
}
.abm-shop-layout .abm-subcats{ grid-area:sub!important; max-width:none!important; margin:0 0 -0.5vw!important; padding-inline:0!important; box-sizing:border-box; }
.abm-shop-aside{ grid-area:filt!important; align-self:start!important; position:static!important; width:100%!important; padding-inline:0!important; box-sizing:border-box; flex:none!important; margin:0!important; }
.abm-shop-main{ grid-area:prod!important; width:100%!important; min-width:0!important; flex:none!important; padding-inline:0!important; box-sizing:border-box; }
/* Mobil-brytepunkt: under 820px → stable knapper → filter → varer (filter aldri over knappene). */
@media (max-width:820px){
	.abm-shop-layout{ display:block!important; grid-template-columns:1fr!important; grid-template-areas:"sub" "filt" "prod"!important; padding-inline:clamp(.9rem,3vw,2rem)!important; }
	.abm-shop-aside{ padding-inline:0!important; margin:0 0 1.4rem 0!important; }
	.abm-shop-main{ padding-inline:0!important; }
	.abm-shop-layout .abm-subcats{ padding-inline:0!important; }
}
.abm-filters{ border:1px solid var(--abm-border); border-radius:8px; padding:.8rem .5rem; background:#fff; font-size:.9rem; }
.abm-filters-head{ display:flex; align-items:baseline; justify-content:space-between; margin-bottom:.6rem; }
.abm-filters-head h3{ margin:0; font-size:1.2rem; }
.abm-clearfilter{ font-size:.76rem; color:var(--abm-orange); }
.abm-filtblock{ padding:.7rem 0; border-top:1px solid var(--abm-border); }
.abm-filtblock h4{ margin:0 0 .55rem; font-size:.78rem; text-transform:uppercase; letter-spacing:.04em; color:var(--abm-muted); }
.abm-pricerow{ display:flex; align-items:center; gap:.4rem; }
.abm-pricerow input{ width:100%; padding:.4rem .5rem; border:1px solid var(--abm-border); border-radius:5px; font-size:.85rem; }
.abm-checklist{ display:flex; flex-direction:column; gap:.32rem; max-height:260px; overflow:auto; }
.abm-check{ display:flex; align-items:center; gap:.5rem; font-size:.85rem; cursor:pointer; }
.abm-check input{ accent-color:var(--abm-orange); }
.abm-sizelist{ flex-direction:row; flex-wrap:wrap; gap:.45rem; max-height:none; }
.abm-sizelist .abm-check{ border:1px solid var(--abm-border); border-radius:6px; padding:.32rem .55rem; gap:.35rem; }
.abm-sizelist .abm-check:hover{ border-color:var(--abm-orange); }
.abm-filterbtn{ margin-top:.9rem; width:100%; background:var(--abm-orange); color:#fff; border:0; border-radius:24px; padding:.6rem 1rem; font-weight:700; text-transform:uppercase; font-size:.78rem; cursor:pointer; }
.abm-filterbtn:hover{ background:var(--abm-orange-dk); }
.abm-cattoolbar{ display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:.6rem; margin-bottom:1rem; padding-bottom:.7rem; border-bottom:1px solid var(--abm-border); }
.abm-sortwrap label{ font-size:.85rem; color:var(--abm-muted); }
.abm-sortwrap select{ border:1px solid var(--abm-border); border-radius:20px; padding:.4rem 1.4rem .4rem .8rem; font-size:.85rem; background:#fff; cursor:pointer; }
.abm-resultcount{ font-size:.85rem; color:var(--abm-muted); }
.abm-resultcount strong{ color:var(--abm-slate); }
.abm-shop-main .abm-product-grid{ grid-template-columns:repeat(5,1fr)!important; }
@media (max-width:1280px){ .abm-shop-main .abm-product-grid{ grid-template-columns:repeat(4,1fr)!important; } }
@media (max-width:1040px){ .abm-shop-main .abm-product-grid{ grid-template-columns:repeat(3,1fr)!important; } }
@media (max-width:680px){ .abm-shop-main .abm-product-grid{ grid-template-columns:repeat(2,1fr)!important; } }
.abm-pagination{ gap:.4rem; margin-top:1.5rem; margin-bottom:1.5rem; flex-wrap:wrap; }
.abm-pagination a,.abm-pagination .current,.abm-pagination .page-numbers{ display:inline-flex; align-items:center; justify-content:center; min-width:36px; height:36px; padding:0 .55rem; border:1px solid var(--abm-border); border-radius:6px; color:var(--abm-slate); text-decoration:none; font-size:.9rem; }
.abm-pagination .current{ background:var(--abm-orange); color:#fff; border-color:var(--abm-orange); font-weight:700; }
.abm-pagination a:hover{ border-color:var(--abm-orange); color:var(--abm-orange); }

/* ---- Responsive --------------------------------------------------------- */
@media (max-width:1200px){ .abm-prodgrid{ grid-template-columns:repeat(4,1fr); } }
@media (max-width:1024px){ .abm-prodgrid{ grid-template-columns:repeat(3,1fr); } .abm-uspgrid{ grid-template-columns:repeat(2,1fr); } .abm-iconnav a span{ display:none; } }
@media (max-width:820px){
	.abm-header-row{ flex-wrap:wrap; }
	.abm-search{ order:3; flex-basis:100%; max-width:none; }
	.abm-catgrid{ grid-template-columns:repeat(2,1fr); }
	.abm-prodgrid{ grid-template-columns:repeat(2,1fr); }
	.abm-mega-inner{ column-count:2; }
}
@media (max-width:480px){ .abm-catgrid{ grid-template-columns:1fr; } .abm-uspgrid{ grid-template-columns:1fr; } .abm-prodgrid{ grid-template-columns:repeat(2,1fr); } }

/* ===== P0: Mobile hamburger nav (collapse 11-group nav; was ~2365px wide on mobile) ===== */
.abm-navtoggle{ position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; }
.abm-hamburger{ display:none; align-items:center; justify-content:center; width:42px; height:42px; color:var(--abm-slate); cursor:pointer; flex:0 0 auto; border-radius:6px; }
.abm-hamburger:hover{ color:var(--abm-orange); background:var(--abm-surface); }
.abm-hamburger svg{ width:26px; height:26px; }
@media (max-width:900px){
	.abm-hamburger{ display:flex; }
	.abm-navbar{ display:none; border-bottom:0; }
	.abm-navtoggle:checked ~ .abm-navbar{ display:block; border-bottom:3px solid var(--abm-orange); max-height:72vh; overflow-y:auto; }
	.abm-navbar-inner{ padding:0; }
	.abm-mainnav-row{ flex-direction:column; flex-wrap:nowrap; align-items:stretch; }
	.abm-navitem{ border-top:1px solid rgba(255,255,255,.1); }
	.abm-navitem > a{ justify-content:flex-start; padding:.9rem 1.2rem; font-size:.95rem; margin-bottom:0; border-bottom:0; }
	.abm-navbar .abm-navdrop{ display:none; }
	.abm-navitem .abm-caret{ display:none; }
}
@media (max-width:480px){ .abm-logo img{ max-width:150px; height:auto; } }

/* ==========================================================================
   UI POLISH PASS — 2026-06-03 — match quick3 reference
   Fixes Kristian's notes: feil skalert (grid 4->5 above) · sideforskjøvet
   (header dead-space) · ikon opp/ned (icon-nav alignment) · breadcrumb-bar.
   CSS-only; reversible by deleting this block (+ revert grid step above).
   ========================================================================== */

/* Guard: keep the full-bleed breadcrumb's 100vw from adding a horizontal
   scrollbar. overflow-x:clip does NOT create a scroll container, so the
   sticky header keeps working. */
.wp-site-blocks{ overflow-x:clip; }

/* Header right cluster: pin the icon-nav flush to the right edge and keep the
   search a fixed wide block next to the logo (was ~180px dead space to the
   right of the icons → looked "sideforskjøvet"). Desktop only; the <=820px
   mobile reflow (search full-width) is intentionally left untouched. */
@media (min-width:821px){
	.abm-header-row .abm-search{ flex:0 1 600px; max-width:600px; }
	.abm-header-row .abm-iconnav{ margin-left:auto; }
}

/* Icon-nav: top-align every item so the login/account block lines up with
   Verksted/Handlekurv (it was 3px low + shorter → "ikon opp og ned"). */
.abm-iconnav{ align-items:flex-start; }
.abm-iconnav > *{ align-self:flex-start; }
.abm-iconnav .abm-authmenu{ align-self:flex-start; }

/* Breadcrumb (Kristian 2026-06-03 #2): venstrejustert inline med nav/innhold,
   tynnere, og UTEN bakgrunnsfarge (var mørk full-bredde-bar). Constrained til
   innholdsbredden (1340) som resten; transparent bg, mørk dempet tekst. */
.wp-block-quickcommerce-breadcrumbs{
	box-sizing:border-box!important;
	position:static!important; left:auto!important; right:auto!important;
	width:auto!important; max-width:1340px!important;
	margin-left:auto!important; margin-right:auto!important;
	background:transparent!important;
	justify-content:flex-start!important; text-align:left!important;
	padding:.3rem 0 .1rem!important;
}
/* Inner .qcom-breadcrumbs was centered by margin:0 auto (rule further up) —
   force left so the trail starts at the content edge, inline with the nav. */
.wp-block-quickcommerce-breadcrumbs .qcom-breadcrumbs{ margin:0!important; max-width:none!important; }
.wp-block-quickcommerce-breadcrumbs .qcom-breadcrumbs__list{ justify-content:flex-start!important; }
.wp-block-quickcommerce-breadcrumbs,
.wp-block-quickcommerce-breadcrumbs a,
.wp-block-quickcommerce-breadcrumbs .qcom-breadcrumbs__link{ color:var(--abm-muted)!important; }
.wp-block-quickcommerce-breadcrumbs [aria-current],
.wp-block-quickcommerce-breadcrumbs .qcom-breadcrumbs__item:last-child span{ color:var(--abm-slate)!important; }
.wp-block-quickcommerce-breadcrumbs a:hover{ color:var(--abm-orange)!important; }

/* Account / order / checkout QuickCommerce blocks are capped ~1200px by the
   plugin — widen to the site content width (--abm-maxw) so the header/nav/footer
   bands line up with them too (var "langt utenfor" innholdet). Kristian #3. */
.wp-block-quickcommerce-customer-account,
.wp-block-quickcommerce-order-details,
.wp-block-quickcommerce-invoice-details,
.wp-block-quickcommerce-checkout,
.wp-block-quickcommerce-order-confirmation,
.wp-block-quickcommerce-cart{
	max-width:var(--abm-maxw)!important;
	margin-left:auto!important; margin-right:auto!important;
}

/* ==========================================================================
   NATIVE NAVIGATION BLOCK in the black bar — "Hovedmeny" (replaces abmotor/mainnav)
   2026-06-03. Fully editable in Site Editor; styled to match the old quick3-style bar.
   ========================================================================== */
.abm-navbar .wp-block-navigation{ width:78%!important; max-width:none!important; margin:0 auto!important; padding:0!important; box-sizing:border-box; }
.abm-navbar .wp-block-navigation__container{ flex-wrap:wrap; gap:0; align-items:stretch; justify-content:flex-start; }
/* Glyph-align (2026-06-05): nav-lenkene har padding-left .95rem, så teksten ville starte 15px
   til høyre for inline-tekstlinja. Kanseller den lead-in-en på raden så første bokstav i
   "STARTPAKKER" flukter loddrett med "I" i footer-"Info" (= samme inline-tekststart). */
.abm-navbar .wp-block-navigation__container{ margin-left:-.95rem; }
/* Below the 1340 inline-bredde slår WPs root-padding-aware align om, og containeren får en
   ekstra 32px venstre-padding som footer ikke har → nulles under terskelen for å holde flukt. */
@media (max-width:1340px){ .abm-navbar .wp-block-navigation__container{ padding-inline:0!important; } }
.abm-navbar .wp-block-navigation-item{ position:relative; }
/* top-level items: white uppercase with orange underline on hover */
.abm-navbar .wp-block-navigation .wp-block-navigation-item__content{
	color:#fff; font-weight:700; text-transform:uppercase; letter-spacing:.04em; font-size:1.06rem;
	font-family:"Saira Extra Condensed","Open Sans",Arial,sans-serif;
	padding:.88rem 1rem; line-height:1; border-bottom:3px solid transparent;
}
.abm-navbar > .wp-block-navigation .wp-block-navigation__container > .wp-block-navigation-item:hover > .wp-block-navigation-item__content,
.abm-navbar > .wp-block-navigation .wp-block-navigation__container > .wp-block-navigation-item:focus-within > .wp-block-navigation-item__content{
	border-bottom-color:var(--abm-orange); background:rgba(255,255,255,.05);
}
.abm-navbar .wp-block-navigation__submenu-icon{ color:#fff; padding:0; margin-left:.1rem; }
.abm-navbar .wp-block-navigation__submenu-icon svg{ fill:currentColor; }
/* dropdown panel: white, orange top border, soft shadow */
.abm-navbar .wp-block-navigation__submenu-container{
	background:#fff; border:1px solid var(--abm-border); border-top:3px solid var(--abm-orange);
	box-shadow:0 18px 40px rgba(0,0,0,.18); border-radius:0 0 6px 6px; padding:.4rem 0; min-width:232px; left:0;
	visibility:hidden; opacity:0; transition:opacity .12s ease;
}
.abm-navbar .wp-block-navigation-submenu:hover > .wp-block-navigation__submenu-container,
.abm-navbar .wp-block-navigation-submenu:focus-within > .wp-block-navigation__submenu-container{
	visibility:visible; opacity:1;
}
.abm-navbar .wp-block-navigation__submenu-container .wp-block-navigation-item__content{
	color:var(--abm-ink); text-transform:none; font-weight:400; letter-spacing:0; font-size:.9rem;
	padding:.55rem 1.1rem; border-bottom:0; white-space:nowrap;
}
.abm-navbar .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover{
	background:var(--abm-surface); color:var(--abm-orange);
}
/* mobile (<900px): our hamburger toggles .abm-navbar; stack vertical, hide dropdowns */
@media (max-width:900px){
	.abm-navbar .wp-block-navigation{ padding:0; }
	.abm-navbar .wp-block-navigation__container{ flex-direction:column; align-items:stretch; margin-left:0; }
	.abm-navbar .wp-block-navigation-item{ border-top:1px solid rgba(255,255,255,.1); }
	.abm-navbar .wp-block-navigation .wp-block-navigation-item__content{ padding:.9rem 1.2rem; font-size:.95rem; border-bottom:0; justify-content:flex-start; }
	.abm-navbar .wp-block-navigation__submenu-container{ display:none; }
	.abm-navbar .wp-block-navigation__submenu-icon{ display:none; }
}

/* ==========================================================================
   FRONT PAGE — native category grid + featured Query Loops + USP strip
   2026-06-03. Keeps the old brand.css layout classes; only adds what the
   native block markup needs (stretched links, margin neutralisers, fit).
   ========================================================================== */
/* Category grid: cards are now Groups (were <a>); make the name a stretched link */
.abm-catgrid > *{ margin-block:0; }
.abm-cat-card{ position:relative; }
.abm-cat-card > *{ margin-block:0; }
.abm-cat-card a{ color:inherit; text-decoration:none; }
.abm-cat-name.abm-cat-stretch{ margin:0; }
.abm-cat-stretch a::after{ content:""; position:absolute; inset:0; z-index:3; }
.abm-cat-media.wp-block-image{ margin:0; align-self:stretch; }
.abm-cat-media.wp-block-image img{ width:100%; height:100%; object-fit:cover; display:block; }
.abm-cat-body > *{ margin-block:0; }
.abm-cat-card .abm-cat-go{ position:relative; z-index:4; }

/* USP strip: items are Groups now — drop block-gap so icon + text line up */
.abm-uspgrid > *{ margin-block:0; }
.abm-usp-item > *{ margin-block:0; }
.abm-usp-item > .wp-block-group{ flex:1; }

/* Featured grids: native Query Loop + product-card-basic; let the block grid
   handle columns, just match the old gap. */
.abm-featgrid.wp-block-post-template{ gap:1.1rem; margin:0; }
.abm-featgrid.wp-block-post-template > li{ margin:0; display:flex; }
.abm-featgrid.wp-block-post-template > li > .abm-prodcard{ flex:1; width:100%; }

/* Account icon (QuickCommerce auth-menu): logged OUT the block renders
   .auth-menu__button--signin, logged IN it renders .auth-menu__trigger — both are icon-only
   (the plugin hides the username span with display:none). Add a "Min konto" label under the
   icon in BOTH states so it matches Verksted / Handlekurv, and hide the dropdown chevron. */
.abm-iconnav .abm-authmenu .auth-menu__trigger,
.abm-iconnav .abm-authmenu .auth-menu__button--signin{
	flex-direction:column; align-items:center; gap:3px; padding:0; min-width:54px;
}
.abm-iconnav .abm-authmenu .auth-menu__icon--chevron{ display:none; }
.abm-iconnav .abm-authmenu .auth-menu__trigger::after,
.abm-iconnav .abm-authmenu .auth-menu__button--signin::after{
	content:"Min konto"; font-size:.72rem; font-weight:600; color:var(--abm-slate); line-height:1;
}

/* Sticky footer: on short pages (few products, e.g. /startpakker/) the content + footer don't
   fill the viewport, leaving a white gap below the footer. Make the site wrapper a full-height
   flex column so <main> grows and the footer is always pinned to the bottom. */
.wp-site-blocks{ display:flex; flex-direction:column; min-height:100vh; }
.wp-site-blocks > main{ flex:1 0 auto; }
.wp-site-blocks > footer{ margin-top:auto; }

/* ==========================================================================
   404 / Side ikke funnet — branded (replaces twentytwentyfive default body)
   ========================================================================== */
.abm-404{ text-align:center; }
.abm-404-num{
	font-family:"Saira Extra Condensed","Open Sans",Arial,sans-serif;
	font-weight:700; font-size:clamp(5.5rem,18vw,11rem); line-height:.82;
	color:var(--abm-orange); letter-spacing:.02em; margin:0 0 .2rem;
	text-shadow:0 6px 30px rgba(255,150,0,.18);
}
.abm-404-title{ font-size:clamp(1.6rem,4.5vw,2.4rem)!important; margin:.2rem 0 .6rem!important; color:var(--abm-slate); }
.abm-404-text{ color:var(--abm-muted); font-size:1.02rem; max-width:560px; margin:0 auto 1.6rem; line-height:1.6; }
.abm-404-search.wp-block-search{ max-width:480px; margin:0 auto 1.2rem; }
.abm-404 .wp-block-buttons{ margin-top:1.2rem; }
.abm-404 .is-style-outline .wp-block-button__link{ border-color:var(--abm-slate); }
.abm-404-chips-label{ color:var(--abm-muted); text-transform:uppercase; letter-spacing:.12em; font-size:.72rem; font-weight:700; margin:2.4rem 0 .9rem; }
.abm-404-chips{ display:flex; flex-wrap:wrap; justify-content:center; gap:.55rem; }
.abm-404-chips a{
	display:inline-block; padding:.5rem 1.05rem; border:1px solid var(--abm-border); border-radius:24px;
	background:#fff; color:var(--abm-slate); font-weight:600; font-size:.85rem; text-transform:uppercase; letter-spacing:.02em;
	transition:color .15s,border-color .15s,box-shadow .15s,transform .15s;
}
.abm-404-chips a:hover{ border-color:var(--abm-orange); color:var(--abm-orange); box-shadow:0 8px 20px rgba(0,0,0,.06); transform:translateY(-2px); }

/* ===== ABM UX-fix 2026-06-15: equal-height product cards (kill row-stretch) =====
   Cards in a grid row used align-items:stretch + unclamped titles (1-4 lines) -> a
   short card stretched to match its tallest row-mate ("flisene blir lengre" on mobile).
   Clamp the title to 2 lines on the inner <a> (NOT .qcom-card2-title): the plugin's
   .qcom-stretched-link a::after is positioned relative to the card, so overflow:hidden
   on the <a> does NOT clip it (verified live: full-card click survives, spread 57->0). */
.qcom-card2-title a{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.qcom-card2-title{ min-height:2.7em; }
.qcom-card2-stock{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; }
/* ===== end ABM UX-fix 2026-06-15 cards ===== */
/* reserve 2 price lines (struck was-price + sale price) so sale vs non-sale cards stay equal height */
.qcom-card2 .wp-block-quickcommerce-product-price{ min-height:2.2rem; }

/* ===== ABM UX-fix 2026-06-15: mobile filter as collapsible button =====
   The filter sidebar stacked ABOVE products on mobile (you scrolled past
   Storrelse/Produsent before seeing any varer). Collapse it into a "Filter"
   toggle; expanded by default only when a filter is active. Desktop unchanged
   (toggle is display:none, so it isn't even a box). */
.abm-filt-toggle, .abm-filt-toggle-cb{ display:none; }
@media (max-width:820px){
  .abm-shop-aside .abm-filt-toggle{ display:flex; align-items:center; gap:.5rem; width:100%; box-sizing:border-box;
    padding:.75rem 1rem; margin:0; background:#fff; border:1px solid var(--abm-border); border-radius:8px;
    font-weight:700; color:var(--abm-slate); cursor:pointer; font-size:.95rem; text-transform:uppercase; letter-spacing:.03em; }
  .abm-filt-toggle::after{ content:"\25BE"; margin-left:auto; font-size:.9rem; transition:transform .2s; }
  .abm-filt-toggle-cb:checked ~ .abm-filt-toggle::after{ transform:rotate(180deg); }
  .abm-filt-count{ background:var(--abm-orange); color:#fff; border-radius:20px; min-width:1.5em; padding:0 .45em;
    font-size:.78rem; line-height:1.55; text-align:center; }
  .abm-shop-aside .abm-filters{ display:none; margin-top:.7rem; }
  .abm-filt-toggle-cb:checked ~ .abm-filters{ display:block; }
}
/* ===== end ABM mobile filter toggle ===== */

/* ===== ABM mobile nav + header overhaul 2026-06-15 (rev2) =====
   Header uses a deterministic CSS grid (flex order/auto-margins were unreliable).
   Navbar = core wp:navigation; force its submenus fully inline+visible on mobile. */
@media (max-width:900px){
  /* Header: [burger] [logo centered] [icons right]  /  [search full width] */
  .abm-header-row{ display:grid !important; grid-template-columns:auto 1fr auto;
    grid-template-areas:"burger logo icons" "search search search"; align-items:center; column-gap:.6rem; row-gap:.55rem; }
  .abm-header-row > .abm-hamburger{ grid-area:burger; justify-self:start; }
  .abm-header-row > .abm-logo{ grid-area:logo; justify-self:center; margin:0; }
  .abm-header-row > .abm-iconnav{ grid-area:icons; justify-self:end; align-items:center; gap:1.1rem; }
  .abm-header-row > .abm-search{ grid-area:search; max-width:none; }
  /* consistent icons-only (hide all labels incl. auth "Min konto") */
  .abm-iconnav a span{ display:none !important; }
  .abm-iconnav .abm-authmenu{ align-self:center; }
  .abm-iconnav .auth-menu__button{ font-size:0 !important; gap:0 !important; min-width:0 !important; padding:0 !important; }
  .abm-iconnav .auth-menu__button svg{ width:24px !important; height:24px !important; }
  .abm-iconnav a{ min-width:0 !important; gap:0 !important; }

  /* Main nav: stack + show subcategories INLINE (kill the floating "pocket") */
  .abm-navbar .wp-block-navigation__container{ flex-direction:column !important; align-items:stretch !important; }
  .abm-navbar .wp-block-navigation-item{ display:block !important; }
  .abm-navbar > .wp-block-navigation > .wp-block-navigation__container > .wp-block-navigation-item{ border-top:1px solid rgba(255,255,255,.10); }
  .abm-navbar .wp-block-navigation-item__content{ padding:.78rem 1.2rem !important; font-weight:700 !important; text-transform:uppercase; letter-spacing:.02em; font-size:.9rem; }
  .abm-navbar .wp-block-navigation-submenu__toggle{ display:none !important; }
  .abm-navbar .wp-block-navigation__submenu-container{
    position:static !important; display:block !important; opacity:1 !important; visibility:visible !important;
    height:auto !important; max-height:none !important; min-height:0 !important; overflow:visible !important;
    width:100% !important; min-width:0 !important; inset:auto !important; transform:none !important;
    background:transparent !important; border:0 !important; box-shadow:none !important; padding:0 0 .45rem 0 !important; margin:0 !important; }
  .abm-navbar .wp-block-navigation__submenu-container > li,
  .abm-navbar .wp-block-navigation__submenu-container .wp-block-navigation-item{ display:block !important; border:0 !important; }
  .abm-navbar .wp-block-navigation__submenu-container a,
  .abm-navbar .wp-block-navigation__submenu-container .wp-block-navigation-item__content{
    display:block !important; padding:.42rem 1.2rem .42rem 2.2rem !important; font-weight:500 !important;
    text-transform:none !important; font-size:.85rem !important; letter-spacing:0 !important; color:#cfcfcf !important; }
  .abm-navbar .wp-block-navigation__submenu-container a:hover{ color:var(--abm-orange) !important; }
}
/* ===== end ABM mobile nav + header overhaul rev2 ===== */
/* auth-menu label is a ::after pseudo (content:"Min konto") — remove it on mobile for icons-only */
@media (max-width:900px){ .abm-iconnav .auth-menu__button::after{ content:none !important; } }

/* ===== ABM card media box — deterministic 2026-06-15 =====
   The media box had no explicit height; in Safari an <img> in a flex column can
   render at its natural size (giant cards on iPhone). Lock the image area to a
   square aspect-ratio so card height is identical in every browser. */
.qcom-card2-media{ aspect-ratio:1/1; width:100%; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.qcom-card2-media img{ width:100%; height:100%; object-fit:contain; }
/* ===== end card media box ===== */

/* ── Kontakt-pille (header iconnav) ── */
.abm-kontakt-btn{display:flex;flex-direction:column;align-items:center;gap:3px;background:none;border:none;cursor:pointer;font-family:inherit;font-size:.72rem;font-weight:600;color:var(--abm-orange,#FF9600);min-width:54px;padding:0;transition:color .15s,transform .1s;line-height:1}
.abm-kontakt-btn:hover{color:#e88600;transform:translateY(-1px)}
.abm-kontakt-btn:active{transform:translateY(0)}
.abm-kontakt-ico{width:40px!important;height:40px!important}
@media(max-width:1024px){.abm-kontakt-btn span{display:none}}

/* ── Kontakt popup ── */
.abm-cta-overlay{position:fixed;inset:0;z-index:9000;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(15,23,42,.62);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);opacity:0;pointer-events:none;transition:opacity .22s ease}
.abm-cta-overlay.open{opacity:1;pointer-events:auto}
body.abm-cta-open{overflow:hidden}
.abm-cta-modal{background:#fff;border-radius:20px;width:100%;max-width:500px;box-shadow:0 24px 64px rgba(0,0,0,.18);overflow:visible;transform:translateY(22px) scale(.97);opacity:0;transition:transform .3s cubic-bezier(.34,1.3,.64,1),opacity .25s ease}
.abm-cta-overlay.open .abm-cta-modal{transform:translateY(0) scale(1);opacity:1}
.abm-cta-mhdr{display:flex;align-items:center;justify-content:space-between;padding:20px 24px 16px;border-bottom:1px solid #e5e5e5}
.abm-cta-mtitle{font-size:26px;font-weight:800;color:#1a1a1a;letter-spacing:-.01em;margin:0}
.abm-cta-close{width:36px;height:36px;border:none;background:#f2f3f5;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s,color .15s;color:#383b42;flex-shrink:0}
.abm-cta-close:hover{background:#FF9600;color:#fff}
.abm-cta-navlist{display:flex;flex-direction:column;gap:8px;padding:16px 20px 12px}
.abm-cta-navcard{display:flex;align-items:center;gap:16px;padding:14px 16px;border-radius:12px;border:1.5px solid #e5e5e5;text-decoration:none;color:inherit;transition:border-color .15s,background .15s,transform .15s}
.abm-cta-navcard:hover{border-color:#FF9600;background:rgba(255,150,0,.04);transform:translateX(4px)}
.abm-cta-card-ico{width:44px;height:44px;border-radius:10px;background:rgba(255,150,0,.1);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .15s}
.abm-cta-navcard:hover .abm-cta-card-ico{background:rgba(255,150,0,.18)}
.abm-cta-card-ico svg{width:22px;height:22px;color:#FF9600}
.abm-cta-card-text{flex:1;min-width:0}
.abm-cta-card-title{font-size:15px;font-weight:700;color:#1a1a1a;margin-bottom:2px}
.abm-cta-card-desc{font-size:12.5px;color:#6a6f77}
.abm-cta-card-arr{width:18px;height:18px;color:#ccc;flex-shrink:0;transition:color .15s,transform .15s}
.abm-cta-navcard:hover .abm-cta-card-arr{color:#FF9600;transform:translateX(2px)}
.abm-cta-footer{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #e5e5e5;background:#f8f9fb;border-radius:0 0 20px 20px;overflow:visible}
.abm-cta-fi{position:relative;display:flex;flex-direction:column;align-items:center;gap:5px;padding:14px 8px 16px;cursor:default;text-decoration:none;color:inherit;transition:background .15s;border-right:1px solid #e5e5e5}
.abm-cta-fi:last-child{border-right:none}
.abm-cta-fi:hover,.abm-cta-fi:focus-within{background:rgba(255,150,0,.06);outline:none}
.abm-cta-fi svg{width:19px;height:19px;color:#FF9600}
.abm-cta-fi-lbl{font-size:12px;font-weight:600;color:#6a6f77;transition:color .15s;text-align:center}
.abm-cta-fi:hover .abm-cta-fi-lbl,.abm-cta-fi:focus-within .abm-cta-fi-lbl{color:#1a1a1a}
.abm-cta-fi-phone{font-size:13px;font-weight:700;color:#1a1a1a;text-decoration:none;transition:color .15s}
.abm-cta-fi:hover .abm-cta-fi-phone{color:#FF9600}
.abm-cta-tip{position:absolute;bottom:calc(100% + 10px);left:50%;transform:translateX(-50%) translateY(6px);min-width:195px;background:#1a1a1a;color:#fff;border-radius:12px;padding:13px 15px;box-shadow:0 8px 28px rgba(0,0,0,.22);opacity:0;pointer-events:none;transition:opacity .18s ease,transform .18s ease;z-index:30;text-align:left}
.abm-cta-tip::after{content:'';position:absolute;top:100%;left:50%;transform:translateX(-50%);border:7px solid transparent;border-top-color:#1a1a1a}
.abm-cta-tip-r{left:auto;right:-4px;transform:translateY(6px)}
.abm-cta-tip-r::after{left:auto;right:18px;transform:none}
.abm-cta-fi:hover .abm-cta-tip,.abm-cta-fi:focus-within .abm-cta-tip{opacity:1;pointer-events:auto;transform:translateX(-50%) translateY(0)}
.abm-cta-fi:hover .abm-cta-tip-r,.abm-cta-fi:focus-within .abm-cta-tip-r{transform:translateY(0)}
.abm-cta-tip-title{font-size:10.5px;text-transform:uppercase;letter-spacing:.1em;color:rgba(255,255,255,.5);font-weight:700;margin-bottom:7px}
.abm-cta-tip-row{font-size:12.5px;color:rgba(255,255,255,.85);line-height:1.5}
.abm-cta-tip-mail{display:block;font-size:12.5px;color:rgba(255,255,255,.8);text-decoration:none;padding:3px 0;transition:color .12s}
.abm-cta-tip-mail:hover{color:#FF9600}
.abm-cta-tip-hrs{display:flex;flex-direction:column;gap:5px}
.abm-cta-tip-hrs div{display:flex;justify-content:space-between;gap:16px;font-size:12.5px}
.abm-cta-tip-hrs div span:first-child{color:rgba(255,255,255,.65)}
.abm-cta-tip-hrs div span:last-child{font-weight:600;color:#fff}
.abm-cta-tip-sep{margin-top:5px;padding-top:5px;border-top:1px solid rgba(255,255,255,.12)}
@media(max-width:600px){
  .abm-cta-overlay{align-items:flex-end;padding:0}
  .abm-cta-modal{border-bottom-left-radius:0;border-bottom-right-radius:0;max-height:92dvh;overflow-y:auto}
  .abm-cta-footer{border-radius:0}
}

/* Startpakker: plain nav item like others */
.abm-navbar .wp-block-navigation-item:first-child > .wp-block-navigation-item__content,
.abm-navbar .wp-block-navigation-item:first-child > a {
    background:none !important;
    color:#fff !important;
}

.abm-navbar .wp-block-navigation-item:hover .wp-block-navigation-item__content,
.abm-navbar .wp-block-navigation-item:focus-within .wp-block-navigation-item__content {
    border-bottom-color: var(--abm-orange) !important;
    background: rgba(255,255,255,.05) !important;
}

/* ── Header: fixed height v3 ── */
.abm-header-main,
.abm-header-main.wp-block-group { padding: 0 !important; margin: 0 !important; }
.abm-header-row { height: 54px !important; min-height: 0 !important; padding: 0 !important; align-items: center !important; }
.abm-logo img { height: 46px !important; width: auto !important; max-width: none !important; }
.abm-logo.wp-block-site-logo { width: auto !important; }
.abm-search { align-self: center; }
.abm-search .wp-block-search__inside-wrapper { height: 36px !important; border-radius: 50px !important; }
.abm-search .wp-block-search__input { font-size: .83rem !important; padding: 0 .85rem !important; height: 36px !important; line-height: 36px !important; }
.abm-search .wp-block-search__button { height: 36px !important; padding: 0 .85rem !important; }
.abm-iconnav { align-items: center !important; align-self: center; }

/* ── Navbar font: nuclear override — same as coming-soon ── */
.abm-navbar,
.abm-navbar *,
.abm-navbar a,
.abm-navbar .wp-block-navigation-item__content,
.abm-navbar .wp-block-navigation-link__content,
.abm-navbar .wp-block-navigation-item__label {
    font-family: "Saira Extra Condensed", "Open Sans", Arial, sans-serif !important;
    font-size: 17px !important;
    font-weight: 600 !important;
    letter-spacing: .04em !important;
    text-transform: uppercase !important;
    line-height: 1 !important;
}
.abm-navbar .wp-block-navigation-item__content,
.abm-navbar .wp-block-navigation .wp-block-navigation-item__content {
    color: #fff !important;
    padding: 1.3rem 1.1rem !important;
    border-bottom: 3px solid transparent !important;
    text-decoration: none !important;
}
.abm-navbar .wp-block-navigation-item:hover .wp-block-navigation-item__content,
.abm-navbar .wp-block-navigation-item:focus-within .wp-block-navigation-item__content {
    border-bottom-color: var(--abm-orange) !important;
    background: rgba(255,255,255,.05) !important;
}
/* Sub-menu items: smaller, not condensed */
.abm-navbar .wp-block-navigation__submenu-container .wp-block-navigation-item__content,
.abm-navbar .wp-block-navigation__submenu-container * {
    font-family: "Open Sans", Arial, sans-serif !important;
    font-size: .9rem !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    font-weight: 400 !important;
    color: var(--abm-ink) !important;
    padding: .55rem 1.1rem !important;
    border-bottom: 0 !important;
}

/* === ABM hero/header flush-fix (2026-06-23) ===
   WordPress FSE injiserer blockGap (1.5rem/24px) som margin mellom blokker.
   Coming-soon (handkodet HTML) har ingen slik luft -> derfor ble webshop ulik.
   Nuller margene saa hvit logobar -> navbar -> hero star flush. */
.abm-navbar{ margin-top:0 !important; }                       /* hvit logobar -> navbar flush */
.home main.wp-block-group{ margin-top:0 !important; }         /* header -> main flush */
.home main.wp-block-group > .abmhero{ margin-top:0 !important; } /* navbar -> hero flush */

/* === ABM sticky + header-fit + match-coming-soon (2026-06-23) === */
/* STICKY (KUN .home): kategorisider er allerede perfekte med original .abm-header-wrap-sticky.
   Paa forsiden «reiser» ikke wrap-stickyen (front-page-malens template-part-wrapper bryter den).
   Loesning: template-part display:contents KUN paa .home -> .abm-header-wrap blir direkte
   .wp-site-blocks-barn -> dens egen originale sticky reiser hele siden OG fantom-lufta forsvinner.
   Kategori urort (ingen .home). Verifisert: front 0/0, kategori 0/0. */
.wp-site-blocks > .wp-block-template-part:first-child{ position:sticky; top:0; z-index:200; }
/* Lukk 24px fantom-luft over header. Base (alle sider, fikser kategori): */
.abm-header-wrap{ margin-top:-1.5rem !important; }
/* Forsiden har ETT EKSTRA 24px-fantom (front-page-malen rammer headeren annerledes) -> ekstra pull KUN .home: */
.home .wp-site-blocks > .wp-block-template-part:first-child{ margin-top:-1.5rem !important; }

/* HVIT BAR = 78px (matcher coming-soon .ubar), alt sentrert vertikalt */
.abm-header-row{ height:78px !important; align-items:center !important; }
.abm-iconnav{ align-items:center !important; margin:0 !important; }
.abm-iconnav > *{ align-self:center !important; margin:0 !important; }

/* NAVBAR-HOYDE = matcher coming-soon (~58px): reduser nav-lenke vertikal padding fra ~20.8px til 17px */
.abm-navbar .wp-block-navigation .wp-block-navigation-item__content{ padding-top:17px !important; padding-bottom:17px !important; }

/* IKONER skaleres ned (mer naturlig): Kontakt/Cart/Auth-ikon 40px -> 26px, mindre labels */
.abm-kontakt-ico{ width:26px !important; height:26px !important; }
.abm-cart__icon, .abm-cart__icon svg{ width:26px !important; height:26px !important; }
.abm-authmenu .auth-menu__button--signin::before,
.abm-authmenu .auth-menu__trigger::before{ width:26px !important; height:26px !important; }
.abm-kontakt-btn,
.abm-iconnav a,
.abm-iconnav .abm-authmenu :is(button,a){ font-size:.66rem !important; gap:3px !important; }
.abm-iconnav .abm-authmenu .auth-menu__trigger::after,
.abm-iconnav .abm-authmenu .auth-menu__button--signin::after{ font-size:.66rem !important; }

/* LAYOUT (desktop): 3-kolonne grid -> sok DEAD-CENTER (1fr|auto|1fr gir side-soner like brede),
   ikoner venstrejustert i hoyre sone (start, ikke pinnet helt til hoyre). TOLKNING - eksakt
   marg/%-fordeling avventer Kristians tall. */
@media (min-width:901px){
  .abm-header-row{ display:grid !important; grid-template-columns:1fr auto 1fr !important; align-items:center !important; gap:1rem !important; }
  .abm-header-row > .abm-logo{ justify-self:start; grid-column:1; }     /* flush container-venstre */
  .abm-header-row > .abm-search{ justify-self:center; grid-column:2; width:clamp(320px,42vw,820px); max-width:none; flex:none !important; margin:0 !important; }  /* dead-center + bredere */
  .abm-header-row > .abm-iconnav{ justify-self:end; grid-column:3; margin-left:0 !important; }  /* flush container-hoyre = lik luft som logo til venstre */
}

/* === abm-cta-tip-v2 (kart + 2-kol timer + single-tooltip) === */
.abm-cta-tip-map{min-width:210px;padding-top:11px}
.abm-cta-tip-map .abm-cta-map{display:block;margin:0 0 9px;border-radius:8px;overflow:hidden;line-height:0;box-shadow:0 2px 8px rgba(0,0,0,.25)}
.abm-cta-tip-map .abm-cta-map img{width:100%;height:auto;display:block;transition:transform .25s}
.abm-cta-tip-map .abm-cta-map:hover img{transform:scale(1.05)}
.abm-cta-tip-hours{min-width:250px}
.abm-cta-hrs-cols{display:flex;gap:18px}
.abm-cta-hrs-sec{flex:1;min-width:0}
.abm-cta-hrs-sec .abm-cta-tip-title{margin-bottom:6px}
.abm-cta-fi{cursor:pointer}
.abm-cta-fi:focus-within .abm-cta-tip{opacity:0;pointer-events:none;transform:translateX(-50%) translateY(6px)}
.abm-cta-fi:focus-within .abm-cta-tip-r{opacity:0;pointer-events:none;transform:translateY(6px)}
@media (hover:none),(pointer:coarse){.abm-cta-fi:hover .abm-cta-tip{opacity:0;pointer-events:none;transform:translateX(-50%) translateY(6px)}.abm-cta-fi:hover .abm-cta-tip-r{opacity:0;pointer-events:none;transform:translateY(6px)}}
.abm-cta-fi.tip-open .abm-cta-tip{opacity:1;pointer-events:auto;transform:translateX(-50%) translateY(0)}
.abm-cta-fi.tip-open .abm-cta-tip-r{opacity:1;pointer-events:auto;transform:translateY(0)}

@media(max-width:520px){.abm-cta-footer{position:relative}.abm-cta-fi{position:static}.abm-cta-tip,.abm-cta-tip-r,.abm-cta-tip-map,.abm-cta-tip-hours{left:12px;right:12px;width:auto;min-width:0;max-width:none;transform:translateY(8px)}.abm-cta-tip::after{display:none}.abm-cta-fi.tip-open .abm-cta-tip,.abm-cta-fi.tip-open .abm-cta-tip-r{transform:translateY(0)}}