/*
Theme Name: Safety Shop
Theme URI: https://safety-shop.dk
Author: safety-shop
Description: Custom forside-tema til safety-shop.dk (videoovervågning webshop).
Version: 1.1
Text Domain: safety-shop
*/

@font-face{
  font-family:'Open Sans';
  font-style:normal;
  font-weight:300 800;
  font-display:swap;
  src:url('assets/fonts/open-sans-var.woff2') format('woff2-variations');
}

:root{
  --bg:#fbfaf8;
  --surface:#ffffff;
  --ink:#111214;
  --line:#e9e6e1;
  --line-strong:#d8d3cb;
  --text:#17181a;
  --text-muted:#65635f;
  --red:#c8102e;
  --red-hover:#a50d26;
  --red-soft:#fbe9ea;
  --shadow-sm: 0 1px 2px rgba(17,18,20,.04), 0 1px 1px rgba(17,18,20,.03);
  --shadow-md: 0 10px 30px -12px rgba(17,18,20,.14), 0 2px 8px rgba(17,18,20,.05);
  --shadow-lg: 0 24px 48px -20px rgba(17,18,20,.20);
  --radius-lg:16px;
  --radius-md:10px;
  --radius-sm:999px;
  --font-sans:"Open Sans", -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-mono: ui-monospace, "SF Mono", "Cascadia Code", Consolas, monospace;
}

*{ box-sizing:border-box; }
body{
  background:var(--bg); color:var(--text); font-family:var(--font-sans);
  margin:0; -webkit-font-smoothing:antialiased; font-size:16px;
}
h1,h2,h3{ text-wrap:balance; font-weight:700; margin:0; letter-spacing:-.01em; }
p{ margin:0; line-height:1.6; }
a{ color:inherit; text-decoration:none; }
button, input{ font-family:inherit; }
:focus-visible{ outline:2px solid var(--red); outline-offset:2px; }
@media (prefers-reduced-motion: reduce){ *{ transition:none !important; animation:none !important; } }

.wrap{ max-width:1240px; margin-inline:auto; padding-inline:1.5rem; }

.accent-bar{ height:4px; background:var(--red); }

.site-section{ padding-block:2.4rem; }
.section-head{ margin-bottom:1.2rem; max-width:60ch; }
.section-head h2{ font-size:1.6rem; margin-bottom:.3rem; }
.section-head p{ color:var(--text-muted); font-size:.95rem; }

.btn{
  font-size:.88rem; font-weight:600; padding:.8rem 1.5rem; border-radius:var(--radius-sm);
  border:2px solid var(--ink); color:var(--ink); background:var(--surface);
  cursor:pointer; white-space:nowrap; transition:background .15s ease, color .15s ease; display:inline-block;
}
.btn:hover{ background:var(--ink); color:var(--surface); }
.btn.solid{ background:var(--surface); color:var(--ink); border-color:var(--ink); box-shadow:none; }
.btn.solid:hover{ background:var(--ink); color:var(--surface); border-color:var(--ink); transform:none; box-shadow:none; }
.btn.small{ padding:.5rem .95rem; font-size:.8rem; }

.img-ph{
  background:radial-gradient(120% 120% at 50% 32%, var(--red-soft) 0%, transparent 65%), var(--bg);
  border:1px solid var(--line); border-radius:var(--radius-md);
  display:flex; align-items:center; justify-content:center;
  color:var(--ink); padding:1rem; overflow:hidden;
}
.img-ph svg{ color:var(--red); }
.img-ph img{ width:100%; height:100%; object-fit:cover; display:block; }

/* hero mock */
.hero-mock{
  position:relative; height:280px; background:var(--surface); border:1px solid var(--line);
  border-radius:var(--radius-lg); box-shadow:var(--shadow-lg); padding:1rem;
  display:flex; flex-direction:column; gap:.7rem; overflow:hidden;
}
.hero-mock::before{
  content:""; position:absolute; top:-35%; right:-15%; width:75%; height:75%;
  background:radial-gradient(circle, var(--red-soft) 0%, transparent 72%); pointer-events:none;
}
.hero-mock::after{
  content:""; position:absolute; bottom:-35%; left:-15%; width:60%; height:60%;
  background:radial-gradient(circle, var(--red-soft) 0%, transparent 72%); pointer-events:none;
}
.hero-mock-bar{ position:relative; z-index:1; display:flex; align-items:center; gap:.6rem; font-size:.85rem; font-weight:700; color:var(--ink); }
.hero-mock-bar .dot{ width:8px; height:8px; border-radius:50%; background:var(--red); box-shadow:0 0 0 4px var(--red-soft); flex:none; }
.hero-mock-grid{ position:relative; z-index:1; flex:1; display:grid; grid-template-columns:1fr 1fr; grid-template-rows:1fr 1fr; gap:.8rem; }
.feed{
  background:var(--bg); border:1px solid var(--line); border-radius:var(--radius-md);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.4rem;
  color:var(--text-muted); font-size:.72rem; font-weight:600;
}
.feed svg{ color:var(--red); }
.hero-image{ height:380px; border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-lg); }
.hero-image img{ width:100%; height:100%; object-fit:cover; display:block; }
.hero-badge-float{
  position:absolute; top:1.2rem; right:1.2rem; z-index:2; background:var(--red); color:#fff;
  font-weight:800; font-size:.78rem; letter-spacing:.02em; padding:.4rem .75rem; border-radius:var(--radius-sm);
  box-shadow:var(--shadow-sm);
}

/* header */
.topbar{ background:var(--ink); font-size:.72rem; color:#e7e5e2; }
.topbar .wrap{ display:flex; justify-content:space-between; gap:1rem; padding-block:.35rem; flex-wrap:wrap; }

@media (max-width:760px){
  .topbar .wrap{
    position:relative; display:block; height:1.7rem; padding-block:.4rem; overflow:hidden; text-align:center;
  }
  .topbar .wrap span{
    position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
    opacity:0; transition:opacity .6s ease; white-space:nowrap; padding-inline:1rem;
  }
  .topbar .wrap span.is-active{ opacity:1; }
}
header.site{ background:var(--surface); border-bottom:1px solid var(--line); position:sticky; top:0; z-index:100; }
@media (max-width:900px){
  header.site{ max-height:100vh; overflow-y:auto; }
}
.site-inner{ display:flex; align-items:center; gap:1.1rem; padding-block:.7rem; flex-wrap:nowrap; }
.logo{ font-weight:800; font-size:1.3rem; letter-spacing:-.01em; flex:none; }
.logo a{ color:var(--ink); display:flex; align-items:center; }
.logo .logo-img{ height:38px !important; width:auto; display:block; }
nav.main{ display:flex; align-items:center; gap:1.1rem; font-size:.86rem; font-weight:600; flex:none; flex-wrap:nowrap; white-space:nowrap; }
nav.main > a{ transition:color .12s ease; }
nav.main > a:hover{ color:var(--red); }
.nav-item{ position:relative; padding-block:.4rem; }
.nav-item .nav-label{ cursor:default; transition:color .12s ease; }
.nav-item.has-dropdown .nav-label{ cursor:pointer; }
.nav-item.has-dropdown:hover .nav-label{ color:var(--red); }
.nav-dropdown{
  display:none; flex-direction:column; position:absolute; top:100%; left:0; margin-top:0;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-md);
  box-shadow:var(--shadow-md); padding:.5rem; min-width:220px; z-index:60;
}
.nav-item.has-dropdown:hover .nav-dropdown,
.nav-item.has-dropdown:focus-within .nav-dropdown{ display:flex; }
.nav-dropdown a{ padding:.55rem .7rem; border-radius:6px; font-weight:600; white-space:nowrap; color:var(--text); }
.nav-dropdown a:hover{ background:var(--bg); color:var(--red); }
.search-box{
  position:relative;
  flex:1 1 auto; min-width:0; max-width:260px; display:flex; align-items:center; gap:.5rem;
  border:1px solid var(--line-strong); border-radius:var(--radius-sm); padding:.5rem .9rem; font-size:.8rem; color:var(--text-muted);
}
.search-box svg{ flex:none; }
.search-box input[type="text"]{
  border:none; outline:none; background:transparent; flex:1; min-width:0;
  font-size:.8rem; color:var(--text);
}
.search-box input[type="text"]::placeholder{ color:var(--text-muted); }

.search-suggestions{
  display:none; position:absolute; top:calc(100% + 8px); left:0; min-width:300px;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-md);
  box-shadow:var(--shadow-md); max-height:340px; overflow-y:auto; z-index:80;
}
.search-suggestions.is-open{ display:block; }
.search-suggestion-item{ display:flex; align-items:center; gap:.7rem; padding:.6rem .7rem; }
.search-suggestion-item:hover{ background:var(--bg); }
.search-suggestion-item img, .search-suggestion-noimg{
  width:36px; height:36px; object-fit:cover; border-radius:6px; flex:none; background:var(--bg);
}
.search-suggestion-text{ display:flex; flex-direction:column; gap:.15rem; min-width:0; }
.search-suggestion-title{
  font-size:.82rem; font-weight:600; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.search-suggestion-price{ font-size:.75rem; color:var(--text-muted); }
.search-suggestion-empty{ padding:.8rem; font-size:.82rem; color:var(--text-muted); }
.head-icons{ display:flex; gap:1rem; align-items:center; font-size:.78rem; font-weight:600; flex:none; }
.cart-link{ display:flex; align-items:center; gap:.5rem; color:var(--ink); white-space:nowrap; }
.cart-link:hover{ color:var(--red); }
.cart-link svg{ flex:none; }

@media (max-width:1180px) and (min-width:901px){
  .site-inner{ flex-wrap:wrap; }
  nav.main{ order:3; flex:1 1 100%; flex-wrap:wrap; white-space:normal; }
  .search-box{ order:2; }
}

.nav-toggle{
  display:none; align-items:center; justify-content:center;
  width:42px; height:42px; border:1px solid var(--line-strong); border-radius:var(--radius-sm);
  background:var(--surface); cursor:pointer; flex:none; margin-left:auto; color:var(--ink);
}
.nav-toggle .icon-close{ display:none; }
.nav-toggle.is-active .icon-menu{ display:none; }
.nav-toggle.is-active .icon-close{ display:block; }

@media (max-width:900px){
  .site-inner{ flex-wrap:wrap; row-gap:.7rem; }
  .logo{ order:1; }
  .head-icons{ order:2; margin-left:auto; }
  .nav-toggle{ display:flex; order:3; margin-left:.9rem; margin-right:0; }
  .search-box{ order:4; flex:1 1 100%; max-width:none; }
  nav.main{
    order:5; flex:1 1 100%; display:none; flex-direction:column; align-items:stretch;
    gap:0; white-space:normal; margin-top:.3rem; border-top:1px solid var(--line);
  }
  nav.main.is-open{ display:flex; }
  nav.main > a{ display:block; padding:.9rem .2rem; border-bottom:1px solid var(--line); }
  .nav-item{ padding-block:0; border-bottom:1px solid var(--line); }
  .nav-item .nav-label{ display:block; padding:.9rem .2rem; }
  .nav-item.has-dropdown:hover .nav-label{ color:inherit; }
  .nav-dropdown{
    position:static; display:flex; flex-direction:column; border:none; box-shadow:none;
    background:transparent; padding:0 0 .7rem 1rem; min-width:0; margin-top:0;
  }
  .nav-dropdown a{ padding:.5rem; font-weight:500; }
}

/* hero carousel */
.hero-carousel{ position:relative; padding-block:1.8rem; }
.slide{ display:none; grid-template-columns:1.1fr 1fr; gap:2rem; align-items:center; }
.slide.is-active{ display:grid; animation:slide-in .4s ease; }
@media (max-width:900px){ .slide{ grid-template-columns:1fr; } }
@keyframes slide-in{ from{ opacity:0; transform:translateY(8px);} to{ opacity:1; transform:none; } }
.slide-tag{
  font-family:var(--font-mono); font-size:.68rem; letter-spacing:.08em; text-transform:uppercase;
  color:var(--red); background:var(--red-soft); border-radius:var(--radius-sm);
  padding:.25rem .7rem; display:inline-block; margin-bottom:.9rem;
}
h1.hero-h{ font-size:clamp(2.1rem,4vw,3.1rem); line-height:1.06; margin-block:.4rem .6rem; color:var(--ink); }
.hero-sub{ font-size:1.05rem; color:var(--text-muted); max-width:46ch; }
.hero-ctas{ display:flex; gap:.8rem; margin-top:1rem; flex-wrap:wrap; }
.hero-trust{ margin-top:.8rem; font-size:.78rem; color:var(--text-muted); }
.carousel-controls{ display:flex; align-items:center; gap:1rem; margin-top:1rem; }
.car-arrow{
  width:36px; height:36px; border-radius:50%; border:1.5px solid var(--line-strong);
  background:var(--surface); color:var(--text); display:flex; align-items:center; justify-content:center;
  cursor:pointer; flex:none; font-size:1.1rem; transition:border-color .15s ease, color .15s ease;
}
.car-arrow:hover{ border-color:var(--red); color:var(--red); }
.car-dots{ display:flex; gap:.5rem; }
.car-dot{ width:9px; height:9px; border-radius:50%; border:1.5px solid var(--line-strong); background:transparent; padding:0; cursor:pointer; }
.car-dot.is-active{ background:var(--red); border-color:var(--red); }

/* trust bar */
.trust-row{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.2rem; }
@media (max-width:760px){ .trust-row{ grid-template-columns:repeat(2,1fr); } }
.trust-item{ display:flex; gap:.9rem; align-items:flex-start; font-size:.82rem; }
.trust-icon{
  width:40px; height:40px; border-radius:50%; background:var(--red-soft); flex:none;
  display:flex; align-items:center; justify-content:center;
}
.trust-item svg{ flex:none; color:var(--red); }
.trust-item b{ display:block; font-size:.85rem; color:var(--ink); }
.trust-item span{ color:var(--text-muted); }

/* categories */
.cat-grid{ display:grid; grid-template-columns:repeat(6,1fr); gap:1rem; }
@media (max-width:1300px){ .cat-grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:640px){ .cat-grid{ grid-template-columns:repeat(2,1fr); } }
.cat-card{
  display:flex; flex-direction:column; gap:.5rem; background:var(--surface);
  border:1px solid var(--line); border-radius:var(--radius-lg); padding:.9rem;
  box-shadow:var(--shadow-sm); transition:box-shadow .2s ease, transform .2s ease;
}
.cat-card:hover{ box-shadow:var(--shadow-md); transform:translateY(-3px); }
.cat-card .img-ph{ height:105px; border:none; }
.cat-card h3{ font-size:1.02rem; color:var(--ink); }
.cat-card p{ font-size:.82rem; color:var(--text-muted); }
.cat-link{ font-size:.82rem; font-weight:700; color:var(--red); }

/* products */
.prod-scroller{ display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; overflow-x:auto; }
@media (max-width:1000px){ .prod-scroller{ grid-auto-flow:column; grid-auto-columns:min(78%,280px); grid-template-columns:none; } }
.prod-card{
  border:1px solid var(--line); border-radius:var(--radius-lg); padding:.9rem;
  display:flex; flex-direction:column; gap:.5rem; background:var(--surface); position:relative;
  box-shadow:var(--shadow-sm); transition:box-shadow .2s ease, transform .2s ease;
  min-width:0;
}
.prod-card:hover{ box-shadow:var(--shadow-md); transform:translateY(-3px); }
.prod-card .img-ph{ aspect-ratio:1 / 1; height:auto; width:100%; border:none; }
.badge{ position:absolute; top:1rem; left:1rem; background:var(--red); color:#fff; font-size:.65rem; font-weight:700; padding:.25rem .6rem; border-radius:var(--radius-sm); z-index:1; }
.prod-card h3{
  font-size:.86rem; color:var(--ink); min-width:0; width:100%;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.prod-spec{ font-size:.78rem; color:var(--text-muted); }
.prod-bottom{ display:flex; align-items:center; justify-content:space-between; margin-top:auto; gap:.6rem; }
.price{ font-weight:800; font-size:1.05rem; font-variant-numeric:tabular-nums; color:var(--ink); }

/* solutions */
.sol-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; }
@media (max-width:900px){ .sol-grid{ grid-template-columns:repeat(2,1fr); } }
.sol-card{
  border:1px solid var(--line); border-radius:var(--radius-lg); padding:1rem;
  display:flex; flex-direction:column; gap:.5rem; background:var(--surface); box-shadow:var(--shadow-sm);
  transition:box-shadow .2s ease, transform .2s ease;
}
.sol-card:hover{ box-shadow:var(--shadow-md); transform:translateY(-3px); }
.sol-card h3{ font-size:.98rem; color:var(--ink); }
.sol-card p{ font-size:.82rem; color:var(--text-muted); }

/* why us */
.why-row{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.2rem; }
@media (max-width:760px){ .why-row{ grid-template-columns:repeat(2,1fr); } }
.why-icon{
  width:44px; height:44px; border-radius:50%; background:var(--red-soft);
  display:flex; align-items:center; justify-content:center; margin-bottom:.6rem;
}
.why-item svg{ color:var(--red); }
.why-item h3{ font-size:.95rem; margin-bottom:.35rem; color:var(--ink); }
.why-item p{ font-size:.82rem; color:var(--text-muted); }

/* reviews */
.rev-top{ display:flex; align-items:baseline; gap:1rem; margin-bottom:1rem; flex-wrap:wrap; }
.rev-score{ font-size:1.7rem; font-weight:800; font-variant-numeric:tabular-nums; color:var(--ink); }
.rev-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
@media (max-width:900px){ .rev-grid{ grid-template-columns:1fr; } }
.rev-card{ border:1px solid var(--line); border-radius:var(--radius-lg); padding:1rem; font-size:.86rem; background:var(--surface); box-shadow:var(--shadow-sm); }
.stars{ color:var(--red); font-size:.85rem; letter-spacing:.15em; margin-bottom:.4rem; }
.rev-name{ margin-top:.5rem; font-weight:700; font-size:.78rem; color:var(--text-muted); }

/* newsletter */
.news-band{
  background:var(--ink); color:#fff; border-radius:var(--radius-lg); padding:1.6rem 1.8rem;
  display:flex; flex-wrap:wrap; gap:1.2rem; align-items:center; justify-content:space-between;
  box-shadow:var(--shadow-lg);
}
.news-copy h3{ font-size:1.35rem; margin-bottom:.5rem; color:#fff; }
.news-copy p{ font-size:.88rem; color:#c7c5c1; max-width:40ch; }
.news-copy-personal{ display:flex; align-items:center; gap:1.1rem; }
.news-avatar{ width:92px; height:92px; border-radius:50%; object-fit:cover; flex:none; border:2px solid #3a3a3c; background:var(--red); }
.news-copy-personal h3{ margin-bottom:.25rem; }
.news-form{ display:flex; flex-direction:column; gap:.6rem; max-width:360px; }
.news-form-row{ display:flex; gap:.6rem; flex-wrap:wrap; }
.news-form-row input[type="email"]{ border:1px solid #3a3a3c; border-radius:var(--radius-sm); padding:.7rem .95rem; font-size:.85rem; min-width:220px; background:#232325; color:#fff; flex:1; }
.news-form-row input[type="email"]::placeholder{ color:#8a8886; }
.news-consent{ display:flex; align-items:flex-start; gap:.55rem; font-size:.75rem; color:#a7a5a1; line-height:1.4; cursor:pointer; }
.news-consent input[type="checkbox"]{ margin-top:.2rem; flex:none; accent-color:var(--red); width:15px; height:15px; }
.news-message{ font-size:.8rem; margin:0; min-height:1.2em; }
.news-message.is-success{ color:#8fe0a3; }
.news-message.is-error{ color:#ff8f97; }

/* category archive with filter sidebar */
.shop-layout{ display:grid; grid-template-columns:340px 1fr; gap:2rem; align-items:start; }
@media (max-width:960px){ .shop-layout{ grid-template-columns:1fr; } }
.filter-box{
  border:1px solid var(--line); border-radius:var(--radius-lg); background:var(--surface);
  padding:1.4rem; position:sticky; top:1.2rem;
}
.filter-box > h3{ font-size:1.05rem; color:var(--ink); padding-bottom:1rem; margin-bottom:1rem; border-bottom:1px solid var(--line); }
.filter-box .widget{ padding-block:1rem; border-top:1px solid var(--line); }
.filter-box .widget:first-of-type{ padding-top:0; border-top:none; }
.filter-box .widget:last-child{ padding-bottom:0; }
.filter-box .widgettitle{
  font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.06em;
  color:var(--text-muted); margin:0 0 .8rem; display:block;
}
.filter-box .price_slider{ margin-bottom:1rem; }
.filter-box .price_slider_amount{ font-size:.85rem; display:flex; align-items:center; gap:.7rem; flex-wrap:wrap; }
.filter-box .price_slider_amount .button{
  background:var(--surface); color:var(--ink); border:2px solid var(--ink); border-radius:var(--radius-sm);
  font-weight:600; font-size:.78rem; padding:.4rem .9rem; order:-1;
}
.filter-box .price_slider_amount .button:hover{ background:var(--ink); color:var(--surface); }
.filter-box .ui-slider{ background:var(--line) !important; height:4px !important; border-radius:2px !important; position:relative; border:none !important; margin-bottom:1.1rem; }
.filter-box .ui-slider-range{ background:var(--red) !important; height:4px !important; border-radius:2px !important; position:absolute; }
.filter-box .ui-slider-handle{
  width:14px !important; height:14px !important; border-radius:50% !important; background:var(--red) !important;
  border:2px solid var(--surface) !important; box-shadow:0 0 0 1px var(--red); position:absolute; top:-5px !important;
  margin-left:-7px !important; cursor:pointer;
}
.filter-box .woocommerce-widget-layered-nav-list{ list-style:none; margin:0 -.5rem; padding:0; font-size:.85rem; }
.filter-box .woocommerce-widget-layered-nav-list li{
  display:flex; align-items:center; justify-content:space-between; gap:.6rem;
  padding:.5rem; border-radius:8px; transition:background .12s ease;
}
.filter-box .woocommerce-widget-layered-nav-list li:hover{ background:var(--bg); }
.filter-box .woocommerce-widget-layered-nav-list a{ color:var(--text); flex:1; }
.filter-box .woocommerce-widget-layered-nav-list a:hover{ color:var(--red); }
.filter-box .woocommerce-widget-layered-nav-list .count{
  font-size:.7rem; font-weight:600; color:var(--text-muted); background:var(--bg);
  border-radius:var(--radius-sm); padding:.1rem .5rem; flex:none;
}
.filter-box .woocommerce-widget-layered-nav-list li:hover .count{ background:var(--surface); }
.filter-box .woocommerce-widget-layered-nav-list li.chosen a{ color:var(--red); font-weight:700; }

/* WooCommerce pages (shop, product, cart, checkout) */
.woocommerce-page-wrap{ min-height:50vh; }

/* .wrap sets margin-inline:auto, which disables flex "stretch" sizing on any .wrap
   that is a direct child of the flex body (e.g. cart/checkout's plain page wrapper) —
   it collapses to fit-content width instead of filling the page. Force full width. */
body > .wrap{ width:100%; }

/* "Min konto" (My Account) — this page renders through page.php (a Page with the
   [woocommerce_my_account] shortcode), so the nav/content live inside .page-content,
   not directly inside .woocommerce-page-wrap. */
body.woocommerce-account .page-content{ max-width:none; }
body.woocommerce-account .page-content > .woocommerce{
  display:grid; grid-template-columns:260px 1fr; gap:2rem; align-items:start;
}
@media (max-width:760px){ body.woocommerce-account .page-content > .woocommerce{ grid-template-columns:1fr; } }
body.woocommerce-account .page-content .woocommerce-notices-wrapper{ grid-column:1 / -1; }

.woocommerce-MyAccount-navigation{
  border:1px solid var(--line); border-radius:var(--radius-lg); background:var(--surface);
  padding:.6rem; box-shadow:var(--shadow-sm);
}
.woocommerce-MyAccount-navigation ul{ list-style:none; margin:0; padding:0; }
.woocommerce-MyAccount-navigation li{ border-bottom:1px solid var(--line); }
.woocommerce-MyAccount-navigation li:last-child{ border-bottom:none; }
.woocommerce-MyAccount-navigation li a{
  display:block; padding:.75rem .9rem; border-radius:var(--radius-md); font-weight:600; font-size:.9rem;
  color:var(--text); text-decoration:none; transition:background .12s ease, color .12s ease;
}
.woocommerce-MyAccount-navigation li a:hover{ background:var(--bg); color:var(--red); }
.woocommerce-MyAccount-navigation li.is-active a{ background:var(--ink); color:#fff; }

.woocommerce-MyAccount-content{
  border:1px solid var(--line); border-radius:var(--radius-lg); background:var(--surface);
  padding:1.6rem 1.8rem; box-shadow:var(--shadow-sm); font-size:.92rem; color:var(--text); line-height:1.65;
}

/* B2B / erhvervsrabat */
.b2b-discount-note{ font-size:.78rem; font-weight:600; color:var(--red); }
.b2b-discount-banner{
  border-top:1px solid var(--line); padding-top:1rem; margin-bottom:1.2rem;
  font-size:.88rem; color:var(--text); font-weight:600;
}
.woocommerce-MyAccount-content a{ color:var(--red); text-decoration:underline; text-underline-offset:2px; }
.woocommerce-MyAccount-content a:hover{ color:var(--red-hover); }
.woocommerce-MyAccount-content mark{ background:none; color:var(--ink); font-weight:700; }
.woocommerce-MyAccount-content .woocommerce-Address{ margin-top:1rem; }
.woocommerce-MyAccount-content address{ font-style:normal; }
.woocommerce-MyAccount-content .col-1, .woocommerce-MyAccount-content .col-2{ margin-bottom:1.2rem; }
.woocommerce-MyAccount-content h3{ font-size:1.05rem; color:var(--ink); margin-bottom:.6rem; }
.woocommerce-MyAccount-content .woocommerce-Button,
.woocommerce-MyAccount-content a.button{
  display:inline-flex; margin-top:.8rem;
}
.woocommerce-MyAccount-content form .form-row{ margin-bottom:1rem; }
.woocommerce-MyAccount-content form label{ font-size:.85rem; font-weight:600; color:var(--ink); margin-bottom:.3rem; display:block; }
.woocommerce-MyAccount-content fieldset{ border:1px solid var(--line); border-radius:var(--radius-md); padding:1rem 1.2rem; margin-top:1rem; }
.woocommerce-MyAccount-content fieldset legend{ font-size:.85rem; font-weight:700; color:var(--ink); padding:0 .4rem; }
/* Neutralize WooCommerce's own float:left/right + fixed % widths on these two, which fight our grid. */
body.woocommerce-account .woocommerce-MyAccount-navigation,
body.woocommerce-account .woocommerce-MyAccount-content{
  float:none !important; width:auto !important; margin:0 !important;
}
/* WooCommerce's clearfix ::before/::after on .woocommerce get counted as real grid items once
   display:grid is forced on it, shoving nav/content into separate rows (same bug as the product grid). */
body.woocommerce-account .page-content > .woocommerce::before,
body.woocommerce-account .page-content > .woocommerce::after{
  content:none !important; display:none !important;
}

/* "Forhandler login" / logged-out My Account: no nav to show, so drop the two-column
   grid and present a single centered card with the shop logo above it. */
body.woocommerce-account:not(.logged-in) .page-content{ text-align:center; }
body.woocommerce-account:not(.logged-in) .page-content > h1.section-head{ margin-bottom:2rem; }
body.woocommerce-account:not(.logged-in) .page-content > .woocommerce{
  display:block; text-align:left; max-width:420px; margin:0 auto;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-lg);
  box-shadow:var(--shadow-md); padding:2.6rem 2.4rem;
}
body.woocommerce-account:not(.logged-in) .page-content > .woocommerce::before{
  content:"" !important; display:block !important;
  width:96px; height:96px; margin:0 auto 1.2rem;
  background:url('assets/images/logo.png') center/contain no-repeat;
}
body.woocommerce-account:not(.logged-in) .woocommerce-form-login h2,
body.woocommerce-account:not(.logged-in) .page-content > .woocommerce h2{
  text-align:center; font-size:1.2rem; margin-bottom:1.8rem; padding-bottom:1.4rem;
  border-bottom:1px solid var(--line);
}
.woocommerce-form-login label{
  font-size:.85rem; font-weight:600; color:var(--ink); margin-bottom:.3rem; display:block;
}
.woocommerce-form-login{ border:none !important; }
.woocommerce-form-login .form-row{ margin-bottom:1.1rem; }
.woocommerce-form-login input.input-text{ width:100%; padding:.7rem .9rem; font-size:.92rem; box-sizing:border-box; }
.woocommerce-form-login .password-input{ display:block; position:relative; width:100%; }
.woocommerce-form-login .woocommerce-form-login__rememberme{
  display:flex; align-items:center; gap:.5rem; font-weight:500; font-size:.88rem; color:var(--text); margin:0;
}
.woocommerce-form-login p.form-row:has(.woocommerce-form-login__submit){
  display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap;
}
.woocommerce-form-login__submit{
  font-family:inherit; font-size:.88rem; font-weight:700; padding:.75rem 1.6rem;
  border-radius:var(--radius-sm); border:2px solid var(--ink); background:var(--ink); color:var(--surface);
  cursor:pointer; transition:background .15s ease, color .15s ease;
}
.woocommerce-form-login__submit:hover{ background:var(--surface); color:var(--ink); }
.woocommerce-form-login .woocommerce-LostPassword{
  text-align:center; margin:1.4rem 0 0; font-size:.85rem;
}
.woocommerce-form-login .woocommerce-LostPassword a{ color:var(--red); text-decoration:underline; text-underline-offset:2px; }
.woocommerce-form-login .woocommerce-LostPassword a:hover{ color:var(--red-hover); }
.woocommerce ul.products{
  display:grid !important; gap:1.2rem !important; grid-template-columns:repeat(3, 1fr) !important;
}
.woocommerce ul.products::before, .woocommerce ul.products::after{ display:none !important; content:none !important; }
.woocommerce ul.products li.product{
  width:auto !important; float:none !important; margin:0 !important;
  grid-column:auto !important; order:0 !important; min-width:0 !important;
}
@media (max-width:760px){
  .woocommerce ul.products{ grid-template-columns:repeat(2, 1fr) !important; }
}
/* related/upsell products on the single product page: 4 across */
.woocommerce .related.products ul.products,
.woocommerce .upsells.products ul.products{
  grid-template-columns:repeat(4, 1fr) !important;
}
@media (max-width:900px){
  .woocommerce .related.products ul.products,
  .woocommerce .upsells.products ul.products{ grid-template-columns:repeat(2, 1fr) !important; }
}
.woocommerce ul.products li.product img{ aspect-ratio:1 / 1; object-fit:cover; width:100%; height:auto; }
.woocommerce ul.products li.product{
  border:1px solid var(--line); border-radius:var(--radius-lg); padding:1.1rem;
  box-shadow:var(--shadow-sm); background:var(--surface); transition:box-shadow .2s ease, transform .2s ease;
  display:flex !important; flex-direction:column; height:100%; margin:0 !important;
}
.woocommerce ul.products li.product:hover{ box-shadow:var(--shadow-md); transform:translateY(-3px); }
.woocommerce ul.products li.product > a:first-child{ display:flex; flex-direction:column; flex:1; }
.woocommerce ul.products li.product > a:first-child img{ margin-bottom:.7rem; }
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product .price{ margin-bottom:.4rem; }
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-size:.92rem; min-width:0; width:100%;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.woocommerce ul.products li.product .button{ margin-top:auto; align-self:flex-start; }
.woocommerce span.price, .woocommerce p.price, .woocommerce .woocommerce-Price-amount{ color:var(--ink) !important; font-weight:800; }
.woocommerce div.product .summary p.price{ font-size:2rem !important; margin-bottom:1.1rem; }
.woocommerce div.product .product_meta{ display:none !important; }
.woocommerce div.product .summary .woocommerce-variation-price p.price{ font-size:1.7rem !important; }

/* description/tabs beside the image on desktop, instead of full-width below */
@media (min-width:900px){
  .woocommerce div.product{
    display:grid !important;
    grid-template-columns:1fr 1fr;
    grid-template-areas:
      "images summary"
      "images tabs";
    column-gap:3rem;
    align-items:start;
  }
  .woocommerce div.product > div.images{
    grid-area:images; float:none !important; width:auto !important; margin-bottom:0 !important;
  }
  .woocommerce div.product > div.summary{
    grid-area:summary; float:none !important; width:auto !important; clear:none !important; margin-bottom:0 !important;
  }
  .woocommerce div.product > .woocommerce-tabs{
    grid-area:tabs; clear:none !important; margin-top:0 !important;
  }
  .woocommerce div.product > .related.products{
    grid-column:1 / -1;
  }
}
.woocommerce a.button, .woocommerce button.button, .woocommerce #respond input#submit,
.woocommerce input.button, .woocommerce #place_order{
  background:var(--surface) !important; color:var(--ink) !important; border-radius:var(--radius-sm) !important;
  border:2px solid var(--ink) !important; font-weight:600 !important; box-shadow:none !important;
}
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce #respond input#submit:hover,
.woocommerce input.button:hover, .woocommerce #place_order:hover{
  background:var(--ink) !important; color:var(--surface) !important; border-color:var(--ink) !important;
}
.woocommerce a.added_to_cart{ color:var(--red); font-weight:600; }
.woocommerce nav.woocommerce-breadcrumb a:hover{ color:var(--red); }
.woocommerce-message, .woocommerce-noreviews, p.no-comments{
  border:1px solid var(--red) !important; border-top:1px solid var(--red) !important;
  border-radius:var(--radius-md) !important; background:var(--red-soft) !important; color:var(--text) !important;
  list-style:none !important; padding:1rem 1.2rem !important; margin:0 0 1.5rem !important;
  display:flex !important; align-items:center; gap:.7rem; box-shadow:none !important;
}
.woocommerce-message::before{ display:none !important; }
.woocommerce-message li{ margin:0 !important; padding:0 !important; }
/* Plain, no card/border — just the text and its button. */
.woocommerce-info{
  border:none !important; background:none !important; box-shadow:none !important;
  color:var(--text) !important; list-style:none !important; padding:0 !important; margin:0 0 1.5rem !important;
  display:flex !important; align-items:center; gap:1rem; flex-wrap:wrap;
}
.woocommerce-info::before{ display:none !important; }
.woocommerce-info li{ margin:0 !important; padding:0 !important; }
/* All WooCommerce error notices hidden site-wide (checkout/cart/form errors included) — explicit choice, accepted trade-off. */
.woocommerce-error{ display:none !important; }
.woocommerce-message a.button,
.woocommerce-info a.button{
  float:none !important; margin-left:auto !important; flex:none;
  background:var(--surface) !important; color:var(--ink) !important; border:2px solid var(--ink) !important;
  border-radius:var(--radius-sm) !important; padding:.5rem 1rem !important; font-weight:600 !important;
}
.woocommerce table.shop_table{ border:1px solid var(--line); border-radius:var(--radius-md); }
.woocommerce table.shop_table th{ color:var(--text-muted); }
.woocommerce #payment .payment_methods li{ border-color:var(--line); }
.woocommerce form .form-row input.input-text, .woocommerce form .form-row select, .woocommerce form .form-row textarea{
  border:1px solid var(--line-strong); border-radius:var(--radius-md);
}

/* variation picker on single product */
.woocommerce div.product table.variations{ border:none; margin-bottom:1rem; }
.woocommerce div.product table.variations td{ border:none; padding:0; vertical-align:middle; }
.woocommerce div.product table.variations tr{ display:flex; align-items:center; gap:1rem; margin-bottom:.8rem; }
.woocommerce div.product table.variations td.label{ font-weight:600; color:var(--ink); min-width:100px; }
.woocommerce div.product table.variations td.value select{
  border:1px solid var(--line-strong) !important; border-radius:var(--radius-md) !important;
  padding:.6rem .9rem !important; font-size:.9rem; font-family:inherit; color:var(--text);
  background:var(--surface); min-width:220px;
}
.woocommerce div.product .reset_variations{ font-size:.78rem; color:var(--text-muted); margin-left:.6rem; }
.woocommerce div.product .reset_variations:hover{ color:var(--red); }
.woocommerce div.product .woocommerce-variation-price{ font-weight:800; color:var(--ink); }
.woocommerce div.product .woocommerce-variation-availability{ font-size:.85rem; }
/* WooCommerce Blocks (Cart/Checkout blocks) */
.wc-block-cart__submit-button, .wc-block-components-checkout-place-order-button,
.wc-block-cart .wp-block-button__link, .wc-block-checkout .wp-block-button__link{
  background:var(--surface) !important; color:var(--ink) !important; border-radius:var(--radius-sm) !important;
  border:2px solid var(--ink) !important;
}
.wc-block-cart__submit-button:hover, .wc-block-components-checkout-place-order-button:hover,
.wc-block-cart .wp-block-button__link:hover, .wc-block-checkout .wp-block-button__link:hover{
  background:var(--ink) !important; color:var(--surface) !important;
}
.wc-block-components-formatted-money-amount{ color:var(--ink); font-weight:800; }

/* promo banner (homepage, under Bestsellere) */
.promo-banner{
  position:relative; height:280px; border-radius:var(--radius-lg); overflow:hidden;
  display:flex; align-items:center; box-shadow:var(--shadow-lg); background:var(--ink);
}
@media (min-width:900px){ .promo-banner{ height:500px; } }
.promo-banner-img{ position:absolute; inset:0; z-index:0; }
.promo-banner-img img{ width:100%; height:100%; object-fit:cover; display:block; }
.promo-banner::after{
  content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(90deg, rgba(17,18,20,.85) 0%, rgba(17,18,20,.55) 45%, rgba(17,18,20,.1) 80%);
}
.promo-banner-content{ position:relative; z-index:2; padding:2rem 2.5rem; max-width:44ch; color:#fff; }
.promo-banner-content h2{ font-size:clamp(1.5rem,3vw,2.3rem); color:#fff; margin-bottom:.7rem; }
.promo-banner-content p{ color:#e7e5e2; margin-bottom:1.3rem; }
.promo-banner-content .btn.solid{ background:var(--red); color:#fff; border-color:var(--red); }
.promo-banner-content .btn.solid:hover{ background:var(--red-hover); border-color:var(--red-hover); }

/* sub-category filter pills on /emne/ topic pages */
.topic-subcats{ display:flex; flex-wrap:wrap; gap:.6rem; margin-top:1rem; }
.topic-subcat-pill{
  font-size:.82rem; font-weight:600; padding:.5rem 1.1rem; border-radius:var(--radius-sm);
  border:1.5px solid var(--line-strong); color:var(--text); background:var(--surface); transition:all .15s ease;
}
.topic-subcat-pill:hover{ border-color:var(--red); color:var(--red); }
.topic-subcat-pill.is-active{ background:var(--ink); border-color:var(--ink); color:#fff; }

/* pagination (topic pages, WooCommerce archives, default WP pagination) */
.topic-pagination, nav.woocommerce-pagination, .woocommerce-pagination,
.pagination, .nav-links, .page-numbers.wrap{
  display:flex !important; gap:.5rem; justify-content:center; margin-top:2rem; list-style:none; padding:0;
}
.topic-pagination .page-numbers, nav.woocommerce-pagination .page-numbers, .woocommerce-pagination .page-numbers,
.pagination .page-numbers, .nav-links .page-numbers,
ul.page-numbers li, ul.page-numbers a.page-numbers, ul.page-numbers span.page-numbers, a.page-numbers, span.page-numbers{
  display:flex !important; align-items:center; justify-content:center; min-width:38px; height:38px;
  border:1.5px solid var(--line-strong) !important; border-radius:50% !important; background:var(--surface) !important;
  color:var(--ink) !important; font-weight:600; font-size:.85rem; padding-inline:.4rem;
  box-shadow:none !important; -webkit-appearance:none; appearance:none; text-decoration:none !important;
}
.topic-pagination a.page-numbers:hover, nav.woocommerce-pagination a.page-numbers:hover,
.woocommerce-pagination a.page-numbers:hover, a.page-numbers:hover{
  border-color:var(--red) !important; color:var(--red) !important;
}
.topic-pagination .page-numbers.current, nav.woocommerce-pagination .page-numbers.current,
.woocommerce-pagination .page-numbers.current, span.page-numbers.current{
  background:var(--ink) !important; border-color:var(--ink) !important; color:var(--surface) !important;
}
.topic-pagination .page-numbers.dots, nav.woocommerce-pagination .page-numbers.dots,
.woocommerce-pagination .page-numbers.dots, .page-numbers.dots{
  border:none !important; background:transparent !important; color:var(--text-muted) !important;
}

/* plain content pages (Support, Kontakt os, FAQ, etc.) */
.page-hero-img{ width:100%; height:340px; border-radius:var(--radius-lg); overflow:hidden; margin-bottom:1.6rem; }
.page-hero-img img{ width:100%; height:100%; object-fit:cover; display:block; }
@media (max-width:640px){ .page-hero-img{ height:200px; } }
.page-content{ max-width:70ch; }
.page-content img{ max-width:100%; height:auto; border-radius:var(--radius-md); }
.page-content figure{ margin:1.5rem 0; }
.page-content .wp-block-media-text{ display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; align-items:center; margin-bottom:1.5rem; }
.page-content .wp-block-media-text img{ border-radius:var(--radius-lg); }
.page-content .wp-block-columns{ display:flex; gap:1.5rem; margin-bottom:1.5rem; }
@media (max-width:640px){ .page-content .wp-block-media-text{ grid-template-columns:1fr; } .page-content .wp-block-columns{ flex-direction:column; } }
.page-content p{ margin-bottom:1.1rem; color:var(--text); }
.page-content h2{ font-size:1.3rem; margin-top:2rem; margin-bottom:.6rem; color:var(--ink); }
.page-content h2:first-child{ margin-top:0; }
.page-content a{ color:var(--red); text-decoration:underline; text-underline-offset:2px; }
.page-content a:hover{ color:var(--red-hover); }
.page-content ul, .page-content ol{ margin:0 0 1.1rem; padding-left:1.3rem; }
.page-content li{ margin-bottom:.4rem; }

/* Løsningsside: fixed layout, content comes from locked metabox fields, not a freeform editor. */
.losning-hero-row{ display:grid; grid-template-columns:1fr 1fr; gap:2.5rem; align-items:center; margin-top:1rem; }
.losning-lead{ font-size:1.05rem; color:var(--text-muted); max-width:none; margin:0; }
.losning-contact-card{
  display:flex; flex-direction:column; align-items:center; text-align:center; justify-content:center;
  gap:.5rem; background:var(--surface); border:1px solid var(--line);
  border-radius:var(--radius-lg); padding:1.8rem; box-shadow:var(--shadow-sm);
  width:260px; height:260px; box-sizing:border-box; margin-inline:auto;
  transition:box-shadow .2s ease, transform .2s ease;
}
.losning-contact-card:hover{ box-shadow:var(--shadow-md); transform:translateY(-2px); }
.losning-contact-avatar{ width:76px; height:76px; border-radius:var(--radius-md); object-fit:cover; background:var(--red); border:2px solid var(--line-strong); flex:none; }
.losning-contact-card span{ display:flex; flex-direction:column; align-items:center; }
.losning-contact-card strong{ font-size:1.1rem; color:var(--ink); }
.losning-contact-card em{ font-size:.95rem; color:var(--text-muted); font-style:normal; margin-top:.15rem; }
.losning-contact-card small{ font-size:.8rem; color:var(--text-muted); margin-top:.5rem; line-height:1.4; }
@media (max-width:760px){
  .losning-hero-row{ grid-template-columns:1fr; }
  .losning-contact-card{ width:100%; height:auto; max-width:320px; }
}
.losning-checklist{ display:grid; grid-template-columns:repeat(3,1fr); gap:1rem 1.5rem; list-style:none; margin:0; padding:0; }
.losning-checklist li{ display:flex; gap:.7rem; align-items:center; font-size:.9rem; color:var(--text); }
.losning-checklist-check{ color:var(--red); font-weight:800; flex:none; }
.losning-checklist-img{ flex:none; width:40px; height:40px; border-radius:50%; overflow:hidden; background:var(--red-soft); }
.losning-checklist-img img{ width:100%; height:100%; object-fit:cover; display:block; }
@media (max-width:760px){ .losning-checklist{ grid-template-columns:1fr; } }
.losning-faq{ max-width:70ch; }
.losning-faq h3{ font-size:1rem; color:var(--ink); margin:0 0 .4rem; padding-top:1.2rem; border-top:1px solid var(--line); }
.losning-faq h3:first-child{ border-top:none; padding-top:0; }
.losning-faq p{ color:var(--text-muted); margin:0 0 1.2rem; }
.losning-faq-wrap.has-image{ display:grid; grid-template-columns:1fr 1fr; gap:2.5rem; align-items:start; }
.losning-faq-wrap.has-image .losning-faq{ max-width:none; }
.losning-faq-img{ position:sticky; top:1.5rem; border-radius:var(--radius-lg); overflow:hidden; }
.losning-faq-img img{ width:100%; height:100%; object-fit:cover; display:block; }
@media (max-width:900px){
  .losning-faq-wrap.has-image{ grid-template-columns:1fr; }
  .losning-faq-img{ position:static; order:-1; max-height:260px; }
}
.losning-embedded-products{ margin-top:.4rem; }
.losning-whyus.has-image{ display:grid; grid-template-columns:1.1fr .9fr; gap:2.5rem; align-items:center; }
.losning-whyus-img{ border-radius:var(--radius-lg); overflow:hidden; }
.losning-whyus-img img{ width:100%; height:100%; object-fit:cover; display:block; }
@media (max-width:760px){ .losning-whyus.has-image{ grid-template-columns:1fr; } }

/* remote support card (Support page) */
.remote-support-card{
  display:flex; align-items:center; gap:1.5rem; flex-wrap:wrap;
  border:1px solid var(--line); border-radius:var(--radius-lg); background:var(--surface);
  padding:1.6rem 2rem; box-shadow:var(--shadow-sm);
}
.remote-support-text{ flex:1; min-width:240px; }
.remote-support-text h3{ font-size:1.1rem; margin-bottom:.4rem; color:var(--ink); }
.remote-support-text p{ font-size:.88rem; color:var(--text-muted); }

/* contact form (Kontakt os) */
.contact-honeypot{ position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden; }
.contact-form{ display:flex; flex-direction:column; gap:1.1rem; max-width:520px; }
.contact-field{ display:flex; flex-direction:column; gap:.4rem; font-size:.85rem; font-weight:600; color:var(--ink); }
.contact-field input, .contact-field textarea{
  font-family:inherit; font-weight:400; font-size:.9rem; color:var(--text);
  border:1px solid var(--line-strong); border-radius:var(--radius-md); padding:.7rem .9rem; background:var(--surface);
}
.contact-field textarea{ resize:vertical; }
.contact-field input:focus, .contact-field textarea:focus{ outline:2px solid var(--red); outline-offset:1px; }
.contact-notice{ border-radius:var(--radius-md); padding:1rem 1.2rem; margin-bottom:1.5rem; font-size:.9rem; }
.contact-notice p{ margin:0 0 .3rem; }
.contact-notice p:last-child{ margin-bottom:0; }
.contact-notice-success{ background:var(--red-soft); border:1px solid var(--red); color:var(--text); }
.contact-notice-error{ background:var(--red-soft); border:1px solid var(--red); color:var(--text); }

/* Kontakt os — layout + creative CCTV radar visual */
.contact-layout{ display:grid; grid-template-columns:1fr 340px; gap:3.5rem; align-items:start; }
@media (max-width:900px){ .contact-layout{ grid-template-columns:1fr; gap:2.5rem; } }
.contact-form-col{ max-width:520px; }
.contact-visual-col{ padding-top:.5rem; }

.radar{
  position:relative; width:230px; height:230px; margin:0 auto 1.6rem;
}
.radar-ring{
  position:absolute; border:1px solid var(--line); border-radius:50%;
}
.radar-ring-1{ inset:0; }
.radar-ring-2{ inset:19%; }
.radar-ring-3{ inset:38%; }
.radar-sweep{
  position:absolute; inset:0; border-radius:50%; overflow:hidden; pointer-events:none;
}
.radar-sweep::before{
  content:""; position:absolute; inset:-2px;
  background:conic-gradient(from 0deg, var(--red) 0deg, transparent 50deg, transparent 360deg);
  opacity:.3; animation:radar-spin 4.5s linear infinite; transform-origin:50% 50%;
}
@keyframes radar-spin{ to{ transform:rotate(360deg); } }
@media (prefers-reduced-motion: reduce){ .radar-sweep::before{ animation:none; opacity:.16; } }
.radar-center{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); z-index:2;
  width:60px; height:60px; border-radius:50%; background:var(--surface); border:1.5px solid var(--line-strong);
  display:flex; align-items:center; justify-content:center; box-shadow:var(--shadow-md); color:var(--red);
}
.radar-blip{
  position:absolute; width:7px; height:7px; border-radius:50%; background:var(--red); z-index:2;
  box-shadow:0 0 0 4px var(--red-soft);
}
.radar-blip-1{ top:22%; left:74%; }
.radar-blip-2{ top:70%; left:28%; }
.contact-visual-caption{
  text-align:center; font-size:.88rem; color:var(--text-muted); max-width:280px; margin:0 auto 2rem;
}
.contact-info-list{ list-style:none; margin:0; padding:1.4rem 0 0; border-top:1px solid var(--line); display:flex; flex-direction:column; gap:.9rem; }
.contact-info-list li{ display:flex; flex-direction:column; gap:.15rem; font-size:.88rem; }
.contact-info-list strong{ font-size:.72rem; text-transform:uppercase; letter-spacing:.06em; color:var(--text-muted); font-weight:700; }
.contact-info-list span{ color:var(--ink); font-weight:600; }

/* footer */
footer.site-footer{ background:var(--ink); color:#c7c5c1; }
/* Sticky footer site-wide: on short pages the footer sits at the bottom of the viewport
   instead of leaving a gap of page background above it. */
body{ display:flex; flex-direction:column; min-height:100vh; }
body > footer.site-footer{ margin-top:auto; }
.foot-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.4rem; padding-block:1.8rem; }
@media (max-width:760px){ .foot-grid{ grid-template-columns:repeat(2,1fr); } }
.foot-col h4{ font-size:.78rem; text-transform:uppercase; letter-spacing:.06em; color:#8a8886; margin-bottom:.6rem; }
.foot-col ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.4rem; font-size:.85rem; }
.foot-col a{ transition:color .12s ease; }
.foot-col a:hover{ color:var(--red); }
.foot-bottom{ border-top:1px solid #2c2c2e; padding-block:.8rem; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem; font-size:.75rem; color:#8a8886; }
.foot-legal{ display:flex; flex-direction:column; gap:.3rem; }
.foot-company{ font-size:.75rem; color:#8a8886; }
.pay-icons{ display:flex; gap:.5rem; flex-wrap:wrap; }
.pay-icons span{
  height:22px; padding:0 .55rem; border:1px solid #3a3a3c; border-radius:3px;
  display:inline-flex; align-items:center; justify-content:center;
  font-size:.68rem; font-weight:700; letter-spacing:.01em; color:#c7c5c1; white-space:nowrap;
}

/* Blog post (single.php) */
.crumb{ display:flex; gap:.4rem; align-items:center; font-size:.82rem; color:var(--text-muted); }
.crumb a{ color:var(--text-muted); text-decoration:none; }
.crumb a:hover{ color:var(--red); }

.post-h1{ font-size:clamp(1.6rem,3vw,2.2rem); color:var(--ink); margin:.6rem 0 .8rem; letter-spacing:-.01em; }
.post-hero-img{ width:100%; height:600px; border-radius:var(--radius-lg); overflow:hidden; margin-bottom:1.6rem; }
.post-hero-img img{ width:100%; height:100%; object-fit:cover; display:block; }
@media (max-width:760px){ .post-hero-img{ height:260px; } }
.post-meta-row{ display:flex; align-items:center; gap:.7rem; font-size:.85rem; color:var(--text-muted); flex-wrap:wrap; }
.post-meta-author{ display:flex; align-items:center; gap:.4rem; }
.post-meta-author img{ border-radius:50%; }

.post-body-grid{ display:grid; grid-template-columns:1fr 280px; gap:2.5rem; align-items:start; }

/* Mobile-only duplicates: TOC ahead of the article, contact card + products mid-article.
   The desktop sidebar versions are hidden on mobile so nothing shows twice. */
.post-toc-mobile, .post-inline-cta{ display:none; }
@media (max-width:900px){
  .post-body-grid{ grid-template-columns:1fr; }
  .post-sidebar{ position:static; }
  .post-toc-mobile{ display:block !important; }
  .post-toc-desktop, .post-sidebar-ctas{ display:none !important; }
  .post-inline-cta{ display:flex !important; flex-direction:column; gap:1.8rem; margin:2rem 0; }
}

.post-content{ font-size:1rem; color:var(--text); line-height:1.75; max-width:68ch; }
.post-content h2{ font-size:1.35rem; color:var(--ink); margin:2rem 0 .9rem; letter-spacing:-.005em; }
.post-content h2:first-child{ margin-top:0; }
.post-content h3{ font-size:1.1rem; color:var(--ink); margin:1.5rem 0 .7rem; }
.post-content p{ margin:0 0 1.1rem; }
.post-content ul, .post-content ol{ margin:0 0 1.1rem; padding-left:1.3rem; }
.post-content li{ margin-bottom:.4rem; }
.post-content img{ max-width:100%; height:auto; border-radius:var(--radius-md); margin:.5rem 0 1.3rem; display:block; }
.post-content blockquote{
  border-left:3px solid var(--red); margin:1.4rem 0; padding:.2rem 0 .2rem 1.1rem;
  font-size:1.05rem; color:var(--ink); font-style:italic;
}
.post-content a{ color:var(--red); text-decoration:underline; text-underline-offset:2px; }
.post-content a:hover{ color:var(--red-hover); }

.post-sidebar{ position:sticky; top:5.5rem; display:flex; flex-direction:column; gap:1.8rem; }
.side-card{
  border:1px solid var(--line); border-radius:var(--radius-md); padding:1.1rem 1.2rem;
  background:var(--surface); box-shadow:var(--shadow-sm);
}
.side-card h4{
  margin:0 0 .7rem; font-size:.72rem; letter-spacing:.05em; text-transform:uppercase; color:var(--text-muted);
}
.post-toc{ list-style:none; margin:0; padding:0; }
.post-toc li{ border-bottom:1px solid var(--line); }
.post-toc li:last-child{ border-bottom:none; }
.post-toc a{
  display:block; padding:.55rem 0; font-size:.85rem; color:var(--text); text-decoration:none;
}
.post-toc a:hover{ color:var(--red); }
.post-sidebar-ctas{ display:flex; flex-direction:column; gap:1.8rem; }
.post-sidebar .losning-contact-card, .post-inline-cta .losning-contact-card{ margin:0; width:100%; height:auto; max-width:none; }

.sidebar-prod-list{ display:flex; flex-direction:column; gap:1rem; }
.sidebar-prod-item{ display:flex; gap:.7rem; align-items:center; text-decoration:none; color:inherit; }
.sidebar-prod-img{
  width:52px; height:52px; border-radius:var(--radius-md); overflow:hidden; flex:none; background:var(--bg);
  display:flex; align-items:center; justify-content:center;
}
.sidebar-prod-img img{ width:100%; height:100%; object-fit:cover; display:block; }
.sidebar-prod-img svg{ width:24px; height:24px; color:var(--red); }
.sidebar-prod-info{ min-width:0; }
.sidebar-prod-info strong{
  display:block; font-size:.82rem; color:var(--ink); font-weight:600; line-height:1.3; margin-bottom:.25rem;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.sidebar-prod-price{ font-size:.8rem; color:var(--text); font-weight:700; }
.sidebar-prod-item:hover strong{ color:var(--red); }

.related-row{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; }
@media (max-width:760px){ .related-row{ grid-template-columns:1fr; } }
.related-card{
  display:block; border:1px solid var(--line); border-radius:var(--radius-lg); overflow:hidden;
  background:var(--surface); box-shadow:var(--shadow-sm); text-decoration:none; color:inherit;
  transition:box-shadow .2s ease, transform .2s ease;
}
.related-card:hover{ box-shadow:var(--shadow-md); transform:translateY(-3px); }
.related-card-img{ aspect-ratio:16/10; overflow:hidden; }
.related-card-img img{ width:100%; height:100%; object-fit:cover; display:block; }
.related-card-body{ padding:.9rem 1rem; }
.related-card-body h3{ font-size:.92rem; color:var(--ink); margin:0 0 .3rem; }
.related-card-body span{ font-size:.75rem; color:var(--text-muted); }