/*
Theme Name: Bond Street Essentials
Theme URI: https://helene.cloud
Description: Undertema til Flatsome for nettbutikken Bond Street Essentials. Roligere, luftig stil basert på designutkast 2 (07.10.2026). Krever at Flatsome (3.x) er installert som hovedtema.
Author: Helene Åsheim Grønberg
Author URI: https://helene.cloud
Template: flatsome
Version: 1.1.3
License: Proprietary, alle rettigheter forbeholdt
Text Domain: bond-street-essentials
*/

/* ==========================================================================
   Bond Street Essentials, Flatsome-undertema 1.1.0

   Fra 1.1.0 settes Flatsome sine temainnstillinger fra functions.php (skrifter av,
   farger, header, footer, butikk). Denne fila står for resten av utseendet.

   Oppbygging:
   1. Skrifter (lokale, ingen Google-servere)
   2. Variabler
   3. Grunnstil, typografi, skjema
   4. Hjelpeklasser til UX Builder
   5. Toppstripe og header (logo, meny, megameny, søk, konto, handlekurv)
   6. Knapper
   7. Seksjonstitler, brødsmuler
   8. Produktkort og kategoriside
   9. Produktside
   10. Footer
   11. Mobil
   12. Redusert bevegelse

   Alle regler er skrevet med "body.bse" foran (klassen legges til av
   functions.php). Grunnen: Flatsome legger tema-innstillingene sine ut som
   inline-CSS ETTER denne fila, og flatsome-shop.css kan komme etter. Med
   "body.bse" (og ID-ene #header og #footer) vinner reglene her uten !important.
   !important brukes bare i ett avgrenset tilfelle: overstyringen av
   Flatsome sin hover-oppførsel i megamenyen (se punkt 5).

   Der jeg ikke er sikker på Flatsome sin klasse, star det en kommentar
   "sjekkes mot Flatsome". Se README.txt for samlet liste.
   ========================================================================== */


/* 1. Skrifter ------------------------------------------------------------- */
/* Filene ligger i ./fonts/. Se fonts/LES-MEG.txt for nøyaktig liste og kilde. */

@font-face {
  font-family: "Playfair Display";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/PlayfairDisplay-Regular.woff2") format("woff2");
}
@font-face {
  font-family: "Playfair Display";
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/PlayfairDisplay-Italic.woff2") format("woff2");
}
@font-face {
  font-family: "Roboto Condensed";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/RobotoCondensed-Regular.woff2") format("woff2");
}
@font-face {
  font-family: "Roboto Condensed";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/RobotoCondensed-Medium.woff2") format("woff2");
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("fonts/Roboto-Light.woff2") format("woff2");
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/Roboto-Regular.woff2") format("woff2");
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/Roboto-Medium.woff2") format("woff2");
}
/* Montserrat er fjernet i 1.1.0: logoen er et PNG-bilde, og fila fantes ikke i fonts/. */


/* 2. Variabler ------------------------------------------------------------ */

:root {
  --hvit: #FFFFFF;
  --lin: #F4F0EB;
  --stein: #D9CFC4;
  --linje: #E3DBD2;
  --mokka: #74645A;      /* mørkere enn brandkitets #8C7A6B, så små etiketter består kontrastkravet */
  --espresso: #2B2622;
  --espresso-80: rgba(43, 38, 34, .8);

  --display: "Playfair Display", Georgia, serif;
  --kondens: "Roboto Condensed", "Arial Narrow", sans-serif;
  --tekst: "Roboto", Arial, sans-serif;

  --bredde: 1320px;
  --luft: clamp(56px, 7vw, 104px);
  --kant: clamp(20px, 4vw, 48px);

  /* Flatsome skriver disse i inline-CSS fra color_primary og color_secondary
     (inc/functions/function-custom-css.php:8-10). Verdiene låses i functions.php,
     dette er bare et sikkerhetsnett. */
  --primary-color: #2B2622;
  --fs-color-primary: #2B2622;
  --fs-color-secondary: #74645A;
}


/* 3. Grunnstil, typografi, skjema ----------------------------------------- */

body.bse {
  background-color: var(--hvit);
  color: var(--espresso);
  font-family: var(--tekst);
  font-weight: 300;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}

body.bse a { color: var(--espresso); }
body.bse a:hover { color: var(--mokka); }

body.bse :focus-visible {
  outline: 2px solid var(--espresso);
  outline-offset: 3px;
}

/* Overskrifter: Playfair Display, rolig og uten versaler */
body.bse h1,
body.bse h2,
body.bse h3,
body.bse h4,
body.bse h5,
body.bse h6,
body.bse .heading-font {
  font-family: var(--display);
  font-weight: 400;
  color: var(--espresso);
  text-transform: none;
  letter-spacing: -.005em;
  font-variant-numeric: lining-nums;
}

/* Flatsome sin «alt font» (standard Dancing Script, Playball i noen demoer) skal ikke brukes */
body.bse .alt-font {
  font-family: var(--display);
  font-style: italic;
  font-weight: 400;
  letter-spacing: 0;
}

/* Priser, varenumre og tall: ren skrift med like tallbredder */
body.bse .price,
body.bse .amount,
body.bse .woocommerce-Price-amount,
body.bse .sku,
body.bse .qty,
body.bse .cart-price,
body.bse .woocommerce-result-count,
body.bse .product-small .count,
body.bse .bse-varenr,
body.bse .bse-tall {
  font-family: var(--tekst);
  font-variant-numeric: tabular-nums lining-nums;
}

/* Skjema: rette hjørner, ingen innvendig skygge */
body.bse input[type="text"],
body.bse input[type="email"],
body.bse input[type="tel"],
body.bse input[type="number"],
body.bse input[type="password"],
body.bse input[type="search"],
body.bse input[type="url"],
body.bse textarea,
body.bse select {
  background-color: var(--hvit);
  border: 1px solid var(--stein);
  border-radius: 0;
  box-shadow: none;
  color: var(--espresso);
  font-family: var(--tekst);
  font-weight: 300;
}
body.bse input[type="text"]:focus,
body.bse input[type="email"]:focus,
body.bse input[type="tel"]:focus,
body.bse input[type="number"]:focus,
body.bse input[type="password"]:focus,
body.bse input[type="search"]:focus,
body.bse input[type="url"]:focus,
body.bse textarea:focus,
body.bse select:focus {
  border-color: var(--espresso);
  box-shadow: none;
  outline: none;
}
body.bse input::placeholder,
body.bse textarea::placeholder { color: var(--mokka); opacity: 1; }
body.bse input[type="checkbox"],
body.bse input[type="radio"] { accent-color: var(--espresso); }

body.bse .is-divider { background-color: var(--stein); }


/* 4. Hjelpeklasser til UX Builder (feltet «Class») ------------------------- */

body.bse .bse-lin { background-color: var(--lin); }

body.bse .bse-etikett {
  font-family: var(--kondens);
  font-weight: 400;
  font-size: 12px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--mokka);
}
body.bse .bse-stor {
  font-family: var(--display);
  font-weight: 400;
  font-size: clamp(34px, 4.6vw, 64px);
  line-height: 1.12;
  letter-spacing: -.005em;
}
body.bse .bse-stor em { font-style: italic; }
body.bse .bse-mellom {
  font-family: var(--display);
  font-weight: 400;
  font-size: clamp(26px, 2.6vw, 38px);
  line-height: 1.2;
}
body.bse .bse-banner-tittel {
  font-family: var(--display);
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: .05em;
}
/* Knapp med mørk glass, til bruk på bilder (Button-elementet, feltet Class) */
body.bse .button.bse-glass {
  background-color: rgba(43, 38, 34, .55);
  border-color: transparent;
  color: var(--hvit);
}
body.bse .button.bse-glass:hover {
  background-color: rgba(43, 38, 34, .8);
  border-color: transparent;
  color: var(--hvit);
}

/* 4b. Klassene på sidene som er bygget i UX Builder (1.1.0) --------------- */
/* Følger «runde 2» og senere i stil.css i designutkastet. */

/* Etiketter: liten kondensert linje over titler. «lys» brukes på bilder. */
body.bse .bse-etikett { margin: 0 0 6px; line-height: 1.5; }
body.bse .bse-etikett.lys { color: var(--hvit); }
body.bse .dark .bse-etikett.lys { color: var(--hvit); }

/* Seksjonstittel (h2): kondensert, versaler, sperret. Ikke Playfair. */
body.bse h1.bse-seksjonstittel,
body.bse h2.bse-seksjonstittel,
body.bse h3.bse-seksjonstittel,
body.bse .bse-seksjonstittel {
  font-family: var(--kondens);
  font-weight: 400;
  font-size: 15px;
  line-height: 1.4;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--espresso);
  margin: 0 0 44px;
}

/* Toppbildet: stor tittel i versaler, liten undertekst, glassknapp */
body.bse h1.bse-helt-tittel,
body.bse .bse-helt-tittel {
  font-family: var(--display);
  font-weight: 400;
  font-size: clamp(34px, 5.2vw, 72px);
  line-height: 1.05;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--hvit);
  margin: 0;
}
body.bse .bse-helt-under {
  font-family: var(--kondens);
  font-weight: 400;
  font-size: 13px;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--hvit);
  margin: 18px auto 26px;
}
/* Knappene i bannere (Button: stil White + Outline) blir glassknappen fra utkastet */
body.bse .banner .button.white.is-outline,
body.bse .bse-to-opp .button.white.is-outline {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  min-height: 0;
  padding: 12px 20px;
  line-height: 1.4;
  background-color: rgba(43, 38, 34, .55);
  border: 0;
  color: var(--hvit);
  font-size: 12.5px;
  letter-spacing: .2em;
}
body.bse .banner .button.white.is-outline::before,
body.bse .banner .button.white.is-outline::after {
  content: "";
  width: 14px;
  height: 1px;
  background-color: currentColor;
}
body.bse .banner .button.white.is-outline:hover {
  background-color: rgba(43, 38, 34, .8);
  color: var(--hvit);
  border: 0;
}

/* Søkebåndet under toppbildet */
body.bse .bse-sokeband { padding: 46px 0 10px; }
body.bse .bse-sokeband .searchform {
  max-width: 560px;
  margin: 0 auto;
  border: 1px solid var(--stein);
  background-color: var(--hvit);
}
body.bse .bse-sokeband .searchform .search-field {
  height: 58px;
  padding: 0 22px;
  border: 0;
  font-size: 16px;
}
body.bse .bse-sokeband .searchform .ux-search-submit,
body.bse .bse-sokeband .searchform .ux-search-submit:hover {
  height: 58px;
  min-width: 64px;
  padding: 0 22px;
  background-color: var(--espresso);
  color: var(--hvit);
}
body.bse .bse-snarveier {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin: 18px 0 0;
}
body.bse .bse-snarveier a {
  font-family: var(--kondens);
  font-weight: 400;
  font-size: 12.5px;
  letter-spacing: .14em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--espresso);
  border: 1px solid var(--stein);
  padding: 8px 14px;
  transition: background-color .2s, color .2s, border-color .2s;
}
body.bse .bse-snarveier a:hover {
  background-color: var(--espresso);
  border-color: var(--espresso);
  color: var(--hvit);
}

/* Kategoriene: bilde 4:5 og navn under */
body.bse .bse-kategorier .img-inner img { transition: opacity .3s; }
body.bse .bse-kategorier .img:hover .img-inner img { opacity: .85; }
body.bse .bse-kat-navn {
  margin: 14px 0 0;
  text-align: center;
  font-family: var(--kondens);
  font-weight: 400;
  font-size: 14px;
  letter-spacing: .18em;
  text-transform: uppercase;
}
body.bse .bse-kat-navn a { text-decoration: none; color: var(--espresso); }
body.bse .bse-kat-navn a:hover { text-decoration: underline; text-underline-offset: 4px; }

/* Siste nytt: produktkortene får samme stil som i butikken (punkt 8) */
body.bse .bse-siste-nytt .bse-seksjonstittel { margin-bottom: 36px; }

/* To bannere side om side */
body.bse .bse-to-opp h3 {
  font-family: var(--display);
  font-weight: 400;
  font-size: clamp(26px, 3vw, 42px);
  line-height: 1.1;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--hvit);
  margin: 6px 0 18px;
}

/* Merkelinja */
body.bse .bse-merker { border-top: 1px solid var(--linje); }
body.bse .bse-merkelinje {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px 36px;
  margin: 14px 0 0;
  font-family: var(--kondens);
  font-weight: 400;
  font-size: 15px;
  letter-spacing: .2em;
  text-transform: uppercase;
}
body.bse .bse-merkelinje a { text-decoration: none; color: var(--espresso); }
body.bse .bse-merkelinje a:hover { text-decoration: underline; text-underline-offset: 6px; }

/* Sentrert kolonne og ingress (interiørtjenester) */
body.bse .bse-sentrert { text-align: center; margin-left: auto; margin-right: auto; }
body.bse .bse-sentrert .col-inner { text-align: center; }
body.bse .bse-ingress {
  font-family: var(--display);
  font-weight: 400;
  font-size: clamp(20px, 2.2vw, 26px);
  line-height: 1.45;
  max-width: 46ch;
  margin: 0 auto 18px;
}

/* Tjenestekort: bilde 4:5, tittel i Playfair. Kan stå på en kolonne eller et element. */
body.bse .bse-tjeneste img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
body.bse .bse-tjeneste .img { margin-bottom: 22px; }
body.bse .bse-tjeneste h3 {
  font-family: var(--display);
  font-weight: 400;
  font-size: 22px;
  margin: 8px 0 10px;
  text-transform: none;
  letter-spacing: 0;
}

/* Kontaktblokken med Ida: bilde 4:5 og stor tittel */
body.bse .bse-kontakt-ida img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
body.bse .bse-kontakt-ida .bse-stor { margin-bottom: 18px; }


/* 5. Toppstripe og header -------------------------------------------------- */

/* Toppstripe (Header Builder: Top bar) */
body.bse #top-bar {
  background-color: var(--lin);
  color: var(--espresso);
  font-family: var(--kondens);
  font-weight: 400;
  font-size: 12.5px;
  letter-spacing: .1em;
  text-transform: uppercase;
}
body.bse #top-bar .nav > li > a,
body.bse #top-bar a,
body.bse #top-bar .html {
  color: var(--espresso);
  font-family: var(--kondens);
  font-weight: 400;
  font-size: 12.5px;
  letter-spacing: .1em;
}
body.bse #top-bar .header-bg-color { background-color: var(--lin); }

/* Hovedheader: hvit, tynn linje under */
body.bse #header .header-bg-color,
body.bse #header .header-wrapper.stuck .header-bg-color {
  background-color: var(--hvit);
}
body.bse #header .header-wrapper {
  background-color: var(--hvit);
  border-bottom: 1px solid var(--linje);   /* sjekkes mot Flatsome (.header-wrapper og .stuck ved sticky) */
}
body.bse #header .header-wrapper.stuck { box-shadow: none; }
body.bse #masthead.header-main { color: var(--espresso); }
body.bse #wide-nav { background-color: var(--hvit); border-top: 0; box-shadow: none; }

/* Logo. Bredden (250 px) låses i functions.php (logo_width), dette er et tak på høyden. */
body.bse #logo img,
body.bse #logo svg { max-height: 52px; width: auto; }
body.bse #logo a { color: var(--espresso); }

/* Toppstripa: tre tekster med små prikker mellom, som i utkastet (1.1.0) */
body.bse #top-bar .flex-center { flex: 1 1 auto; }
body.bse #top-bar .html_topbar_left { width: 100%; }
body.bse .bse-toppstripe {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 4px 28px;
  width: 100%;
  line-height: 1.4;
}
body.bse .bse-toppstripe > span + span::before {
  content: "";
  display: inline-block;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background-color: var(--mokka);
  margin: 0 28px 3px 0;
  vertical-align: middle;
}

/* Lenkene til venstre i headeren (HTML 3): «Butikken på Frogner» og «Kontakt» */
body.bse #header .html_top_right_text .bse-hodelenker {
  display: flex;
  gap: 18px;
  font-family: var(--kondens);
  font-weight: 400;
  font-size: 13px;
  letter-spacing: .12em;
  text-transform: uppercase;
}
body.bse #header .bse-hodelenker a { color: var(--espresso); text-decoration: none; }
body.bse #header .bse-hodelenker a:hover { text-decoration: underline; text-underline-offset: 4px; }

/* Søkefeltet til høyre: 280 px bredt som i utkastet */
body.bse #header .header-search-form { width: 280px; max-width: 100%; }
body.bse #header .header-search-form .searchform-wrapper { width: 100%; }

/* Hovedmenyen sentrert i raden under logoen */
body.bse #wide-nav { border-top: 0; }
body.bse #wide-nav .flex-center { margin: 0 auto; }
body.bse #wide-nav .header-bottom-nav > li { margin-left: clamp(7px, 1.1vw, 17px); margin-right: clamp(7px, 1.1vw, 17px); }

/* Hovedmeny: Roboto Condensed, versaler, sperring, strek under ved hover */
body.bse #header .nav > li { margin-left: clamp(7px, 1.1vw, 17px); margin-right: clamp(7px, 1.1vw, 17px); }
body.bse #header .nav > li > a {
  font-family: var(--kondens);
  font-weight: 400;
  font-size: 13px;
  line-height: 1.2;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--espresso);
  padding: 12px 0 16px;
  border-bottom: 2px solid transparent;
}
/* Flatsome sin animerte understrek på menypunkter slås av, vi bruker egen */
body.bse #header .nav > li > a::before { content: none; }   /* sjekkes mot Flatsome (.nav-line, .nav-line-bottom) */
body.bse #header .nav > li:hover > a,
body.bse #header .nav > li.active > a,
body.bse #header .nav > li.current-dropdown > a,
body.bse #header .nav > li.bse-open > a {
  color: var(--espresso);
  border-bottom-color: var(--espresso);
}
/* Pilen etter menypunkt (ikon-fonten) gjøres liten og rolig */
body.bse #header .nav > li > a > i.icon-angle-down { font-size: 1em; opacity: .55; margin-left: 4px; }

/* «Interiørtjenester» i menyen kan merkes med klassen bse-tjeneste (Utseende > Menyer > CSS-klasser) */
body.bse #header .nav > li.bse-tjeneste > a { color: var(--mokka); }
body.bse #header .nav > li.bse-tjeneste:hover > a { color: var(--espresso); }

/* Dropdown og megameny: hvit flate, tynne linjer, myk skygge ned */
body.bse #header .nav-dropdown {
  background-color: var(--hvit);
  border: 1px solid var(--linje);
  border-radius: 0;
  box-shadow: 0 30px 40px -30px rgba(43, 38, 34, .25);
  color: var(--espresso);
  padding: 20px 0;
  font-size: 15px;
}
/* Flatsome sin lille pil over dropdown og ekstra rammer */
body.bse #header .nav-dropdown-has-arrow li.has-dropdown::before,
body.bse #header .nav-dropdown-has-arrow li.has-dropdown::after { display: none; }   /* sjekkes mot Flatsome (.nav-dropdown-has-arrow) */

/* Megameny: «Full width» og «Container width» i Menu Item Design
   Plassering og bredde (venstre/høyre) lar jeg Flatsome styre. sjekkes mot Flatsome (JS som beregner full-width-plassering) */
body.bse #header li.menu-item-design-full-width > .nav-dropdown,
body.bse #header li.menu-item-design-container-width > .nav-dropdown,
body.bse #header .nav-dropdown-full,
body.bse #header .mega-menu {
  padding: 40px 0 44px;
  border-width: 1px 0;
}   /* sjekkes mot Flatsome (.menu-item-design-full-width, .nav-dropdown-full, .mega-menu) */

/* Vanlige lenker i dropdown og megameny */
body.bse #header .nav-dropdown > li > a,
body.bse #header .nav-dropdown li li > a,
body.bse #header .nav-dropdown .ux-menu-link__link {
  font-family: var(--tekst);
  font-weight: 300;
  font-size: 15px;
  letter-spacing: 0;
  text-transform: none;
  color: var(--espresso-80);
  padding: 4px 20px;
  border-bottom: 0;
}
body.bse #header .nav-dropdown > li > a:hover,
body.bse #header .nav-dropdown li li > a:hover,
body.bse #header .nav-dropdown .ux-menu-link__link:hover {
  color: var(--espresso);
  background: transparent;
  text-decoration: underline;
  text-underline-offset: 4px;
}
/* Gruppetitler i megamenyen (kolonneoverskrifter) */
body.bse #header .nav-dropdown > li.nav-dropdown-col > a,
body.bse #header .nav-dropdown .ux-menu-title,
body.bse #header .nav-dropdown .nav-column > li.menu-item-has-children > a {
  font-family: var(--kondens);
  font-weight: 500;
  font-size: 13px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--espresso);
}   /* sjekkes mot Flatsome (.nav-dropdown-col, .ux-menu-title, .nav-column) */

/* Usynlig bro mellom menypunkt og panel, så musa ikke «faller ut» i et gap */
body.bse #header li.menu-item.has-dropdown > .nav-dropdown::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -24px;
  height: 24px;
}

/* Megamenyens hover-oppførsel (se js/meny.js).
   Bare når JS har satt klassen bse-hover-meny på <html>, dvs. på enheter med
   ekte hover. Da styrer vi åpen/lukket selv, med 120 ms åpningsforsinkelse og
   350 ms lukkeforsinkelse, og Flatsome sin egen :hover og .current-dropdown
   får ikke lenger lukke panelet for tidlig. Uten JS, på touch og på mobil er
   dette helt urørt og Flatsome oppfører seg som vanlig.
   !important er nødvendig her fordi Flatsome setter åpen tilstand med egne
   regler på :hover og .current-dropdown. */
html.bse-hover-meny body.bse #header .nav > li.menu-item.has-dropdown > .nav-dropdown {
  opacity: 0 !important;
  visibility: hidden !important;
  max-height: 0 !important;
  pointer-events: none;
  transition: opacity .18s ease, visibility 0s linear .18s;
}
html.bse-hover-meny body.bse #header .nav > li.menu-item.has-dropdown.bse-open > .nav-dropdown {
  opacity: 1 !important;
  visibility: visible !important;
  max-height: none !important;
  overflow: visible !important;
  pointer-events: auto;
  transition: opacity .18s ease, visibility 0s;
}   /* Flatsome 3.20.11: lukket = opacity 0, visibility hidden, max-height 0 og left -99999px (flatsome.css .nav-dropdown) */
/* Lukket tilstand i Flatsome flytter panelet til left: -99999px, og åpen setter
   left: -15px bare sammen med .current-dropdown. Vanlige dropdowns får derfor
   samme left når vi åpner med bse-open. Container width og full width har
   egen plassering (under og i Flatsome sin JS). */
html.bse-hover-meny body.bse #header .nav > li.menu-item.has-dropdown.bse-open:not(.menu-item-design-full-width):not(.menu-item-design-container-width) > .nav-dropdown {
  left: -15px;
}

/* Megameny (1.1.0). Menypunkt med «Menu Item Design: Full width» i hovedmenyen
   i raden under logoen (#wide-nav). Panelet spenner hele bredden, innholdet
   ligger innenfor 1320 px, lenkene flyter i fem kolonner og bildet står til
   høyre. Bildet legges til av functions.php (kategoribildet), se README.
   Plasseringen settes her med !important, fordi Flatsome sin JS ellers setter
   inline left, top og width når panelet åpnes. Bare på PC (850 px og bredere). */
@media (min-width: 850px) {
  body.bse #wide-nav .header-bottom-nav,
  body.bse #wide-nav .header-bottom-nav > li.menu-item-design-full-width { position: static; }

  body.bse #header #wide-nav li.menu-item-design-full-width > .nav-dropdown {
    --mega-kant: max(var(--kant), calc((100% - var(--bredde)) / 2 + var(--kant)));
    position: absolute;
    top: 100% !important;
    right: 0 !important;
    bottom: auto !important;
    left: 0 !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0;
    margin: 0 !important;
    transform: none !important;
    display: block;
    padding: 28px calc(var(--mega-kant) + 220px + 40px) 28px var(--mega-kant);
    columns: 5 140px;
    column-gap: 28px;
    column-fill: balance;
    border-width: 1px 0;
    text-align: left;
  }

  /* Vanlige lenker og grupper (underpunkt med egne underpunkter) */
  body.bse #header #wide-nav li.menu-item-design-full-width > .nav-dropdown > li {
    display: block;
    width: auto;
    min-width: 0;
    white-space: normal;
    break-inside: avoid;
    border: 0;
    margin: 0;
    padding: 0;
  }
  body.bse #header #wide-nav li.menu-item-design-full-width > .nav-dropdown > li.nav-dropdown-col {
    break-inside: auto;
    margin-bottom: 18px;
  }
  body.bse #header #wide-nav li.menu-item-design-full-width > .nav-dropdown > li.nav-dropdown-col > a {
    break-after: avoid;
    margin-bottom: 4px;
    padding: 2px 0;
    font-family: var(--kondens);
    font-weight: 500;
    font-size: 12px;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--espresso);
  }
  body.bse #header #wide-nav li.menu-item-design-full-width .nav-column { padding: 0; margin: 0; }
  body.bse #header #wide-nav li.menu-item-design-full-width .nav-column > li { break-inside: avoid; border: 0; }
  body.bse #header #wide-nav li.menu-item-design-full-width > .nav-dropdown > li:not(.nav-dropdown-col) > a,
  body.bse #header #wide-nav li.menu-item-design-full-width .nav-column > li > a {
    display: block;
    padding: 2px 0;
    font-size: 14px;
    line-height: 1.45;
    white-space: normal;
  }

  /* Bildet til høyre (functions.php legger det til som siste underpunkt) */
  body.bse #header #wide-nav li.menu-item-design-full-width > .nav-dropdown > li.bse-mega-bilde {
    position: absolute;
    top: 28px;
    right: var(--mega-kant);
    width: 220px;
  }
  body.bse #header #wide-nav li.bse-mega-bilde > a.bse-mega-bilde-lenke,
  body.bse #header #wide-nav li.bse-mega-bilde > a.bse-mega-bilde-lenke:hover {
    display: block;
    padding: 0;
    text-decoration: none;
    background: transparent;
  }
  body.bse #header #wide-nav li.bse-mega-bilde img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 3;
    object-fit: cover;
  }
  body.bse #header #wide-nav li.bse-mega-bilde .bse-lenke-pil {
    display: inline-block;
    margin-top: 10px;
    padding-bottom: 3px;
    border-bottom: 1px solid currentColor;
    font-family: var(--kondens);
    font-size: 13px;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--espresso);
  }

  /* Flatsome sitt bildepunkt (CSS-klassen image-column) plasseres likt, for manuell bruk */
  body.bse #header #wide-nav li.menu-item-design-full-width > .nav-dropdown > li.image-column {
    position: absolute;
    top: 28px;
    right: var(--mega-kant);
    width: 220px;
  }
  body.bse #header #wide-nav li.menu-item-design-full-width > .nav-dropdown > li.image-column > a { margin: 0 !important; }
}

/* Søk oppe til høyre (Header Builder: Search, type Form). Strek under, ingen boks. */
body.bse #header .header-search-form .search-field,
body.bse #header .searchform .search-field,
body.bse .searchform .search-field {
  border: 0;
  border-bottom: 1px solid var(--stein);
  background-color: transparent;
  box-shadow: none;
  border-radius: 0;
  height: auto;
  padding: 8px 30px 8px 0;
  font-family: var(--tekst);
  font-weight: 300;
  font-size: 14px;
  color: var(--espresso);
}
body.bse #header .searchform .search-field:focus,
body.bse .searchform .search-field:focus { border-bottom-color: var(--espresso); }
body.bse .searchform .ux-search-submit,
body.bse .searchform .ux-search-submit:hover {
  background: transparent;
  border: 0;
  box-shadow: none;
  color: var(--espresso);
  min-height: 0;
  padding: 0 2px;
  margin: 0;
  line-height: 1;
}
body.bse .searchform .ux-search-submit i { font-size: 17px; }   /* sjekkes mot Flatsome (.searchform, .ux-search-submit, .search-field) */

/* Konto og handlekurv: bare ikon, ingen tekst */
body.bse #header .nav > li.has-icon > a,
body.bse #header .nav > li.has-icon:hover > a,
body.bse #header .nav > li.has-icon.current-dropdown > a {
  border-bottom-color: transparent;
  padding: 12px 0;
  letter-spacing: 0;
}
body.bse #header .cart-item .header-cart-title,
body.bse #header .account-item .header-account-title {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}   /* sjekkes mot Flatsome (.header-cart-title, .header-account-title) */
body.bse #header .nav > li.has-icon i { color: var(--espresso); font-size: 1.15em; }

/* Handlekurvtelleren: liten espresso-sirkel med hvitt tall */
body.bse #header [data-icon-label]::after,
body.bse #header .cart-icon strong {
  background-color: var(--espresso);
  border: 0;
  border-radius: 9px;
  color: var(--hvit);
  font-family: var(--tekst);
  font-weight: 500;
  font-size: 11px;
  line-height: 18px;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  font-variant-numeric: tabular-nums lining-nums;
  text-align: center;
}
body.bse #header .cart-icon strong::after,
body.bse #header .cart-icon strong::before { display: none; }   /* sjekkes mot Flatsome (data-icon-label og .cart-icon strong) */

/* Dropdown for handlekurv og konto: samme rolige flate */
body.bse #header .cart-item .nav-dropdown,
body.bse #header .account-item .nav-dropdown { padding: 20px; }
body.bse #header .widget_shopping_cart .woocommerce-mini-cart__total { font-variant-numeric: tabular-nums lining-nums; }


/* 6. Knapper --------------------------------------------------------------- */

body.bse .button,
body.bse .button.primary,
body.bse .button.secondary,
body.bse .button.alt,
body.bse input[type="submit"],
body.bse button[type="submit"] {
  background-color: var(--espresso);
  border: 1px solid var(--espresso);
  border-radius: 0;
  box-shadow: none;
  color: var(--hvit);
  font-family: var(--kondens);
  font-weight: 400;
  font-size: 13px;
  letter-spacing: .16em;
  text-transform: uppercase;
  text-shadow: none;
  min-height: 48px;
  line-height: 46px;
  padding: 0 28px;
  transition: background-color .2s, color .2s, border-color .2s;
}
body.bse .button:hover,
body.bse .button.primary:hover,
body.bse .button.secondary:hover,
body.bse .button.alt:hover,
body.bse input[type="submit"]:hover,
body.bse button[type="submit"]:hover {
  background-color: transparent;
  border-color: var(--espresso);
  color: var(--espresso);
  box-shadow: none;
}
/* Utlinjet knapp (.is-outline): motsatt rekkefølge */
body.bse .button.is-outline,
body.bse .button.primary.is-outline,
body.bse .button.secondary.is-outline {
  background-color: transparent;
  border: 1px solid var(--espresso);
  color: var(--espresso);
  line-height: 46px;
}
body.bse .button.is-outline:hover,
body.bse .button.primary.is-outline:hover,
body.bse .button.secondary.is-outline:hover {
  background-color: var(--espresso);
  border-color: var(--espresso);
  color: var(--hvit);
}
/* Knapper på mørk flate eller bilde: hvit variant (Button-elementet, stil «White») */
body.bse .button.white { background-color: var(--hvit); border-color: var(--hvit); color: var(--espresso); }
body.bse .button.white:hover { background-color: transparent; color: var(--hvit); }
/* Ikonknapper skal ikke arve målene på knappene */
body.bse .button.icon,
body.bse .button.is-small { min-height: 0; line-height: 1.6; padding-left: 14px; padding-right: 14px; }


/* 7. Seksjonstitler og brodsmuler ------------------------------------------ */

/* Seksjonstitler på forsiden (UX Builder: Title) og i widgets: enklere skrift, små versaler med sperring */
body.bse .section-title,
body.bse .section-title-container .section-title span,
body.bse .section-title-normal span,
body.bse .section-title-center span,
body.bse .section-title a {
  font-family: var(--kondens);
  font-weight: 400;
  font-size: 15px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--espresso);
}
/* Flatsome sine dekorative streker på hver side av titlene fjernes */
body.bse .section-title b { display: none; }   /* sjekkes mot Flatsome (.section-title b, .section-title-center) */
body.bse .section-title-container { margin-bottom: 44px; }

/* Brødsmuler */
body.bse .breadcrumbs,
body.bse .woocommerce-breadcrumb {
  font-family: var(--kondens);
  font-weight: 400;
  font-size: 12.5px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--mokka);
}   /* sjekkes mot Flatsome (.breadcrumbs, .woocommerce-breadcrumb) */
body.bse .breadcrumbs a { color: var(--mokka); text-decoration: none; }
body.bse .breadcrumbs a:hover { color: var(--espresso); text-decoration: underline; }
body.bse .breadcrumbs .divider { opacity: .6; }


/* 8. Produktkort og kategoriside ------------------------------------------- */

body.bse .product-small.box { background: transparent; box-shadow: none; }

/* Bildet: hvit flate, tynn ramme, produktet litt inne fra kanten */
body.bse .product-small .box-image {
  background-color: var(--hvit);
  border: 1px solid var(--linje);
  overflow: hidden;
}
body.bse .product-small .box-image img {
  box-sizing: border-box;
  padding: 7%;
  object-fit: contain;
  transition: transform .6s ease;
}   /* sjekkes mot Flatsome (.box-image, bildeforhold settes i Theme Options / UX Builder) */
body.bse .product-small .box:hover .box-image img { transform: scale(1.04); }

/* Tekstdelen: venstrestilt */
body.bse .product-small .box-text,
body.bse .product-small .box-text.text-center {
  text-align: left;
  padding: 16px 0 0;
}
body.bse .product-small .box-text .title-wrapper { margin: 0 0 4px; }
body.bse .product-small .box-text .name,
body.bse .product-small .box-text .product-title,
body.bse .product-small .box-text .woocommerce-loop-product__title,
body.bse .product-small .box-text .woocommerce-loop-product__title a,
body.bse .product-small .box-text .product-title a {
  font-family: var(--tekst);
  font-weight: 400;
  font-size: 15px;
  line-height: 1.45;
  letter-spacing: 0;
  text-transform: none;
  color: var(--espresso);
}
/* Kategorilinja over tittelen */
body.bse .product-small .box-text .category,
body.bse .product-small .box-text .product-cat {
  font-family: var(--kondens);
  font-weight: 400;
  font-size: 11px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--mokka);
  opacity: 1;
  margin-bottom: 6px;
}
/* Pris */
body.bse .product-small .price-wrapper .price,
body.bse .product-small .price {
  font-family: var(--tekst);
  font-weight: 500;
  font-size: 15px;
  color: var(--espresso);
}
body.bse .price del,
body.bse .price del .amount { color: var(--mokka); font-weight: 300; }
body.bse .price ins { background: transparent; text-decoration: none; font-weight: 500; }
/* Varenummer under prisen (lagt til av functions.php) */
body.bse .bse-varenr {
  display: block;
  margin-top: 2px;
  font-weight: 400;
  font-size: 12px;
  letter-spacing: .02em;
  color: var(--mokka);
}

/* Merker (Nyhet, Salg): ren tekst, ingen sirkel */
body.bse .badge-container { margin: 0; }
body.bse .badge-container .badge,
body.bse .badge-container .badge-inner,
body.bse .badge-container .badge-circle .badge-inner {
  background: transparent;
  border-radius: 0;
  width: auto;
  height: auto;
  color: var(--mokka);
  font-family: var(--kondens);
  font-weight: 400;
  font-size: 11px;
  letter-spacing: .16em;
  text-transform: uppercase;
  padding: 6px 10px 0 0;
}   /* sjekkes mot Flatsome (.badge-container, .badge-inner, .badge-circle, .on-sale) */

/* Kategoriside: tittel, antall, sortering */
body.bse .shop-page-title.is-xlarge,
body.bse .shop-page-title h1 {
  font-size: clamp(30px, 3.6vw, 48px);
  line-height: 1.15;
}
body.bse .woocommerce-result-count { font-size: 14px; color: var(--mokka); }
body.bse .woocommerce-ordering select {
  border: 0;
  border-bottom: 1px solid var(--stein);
  background-color: transparent;
  font-size: 14px;
  padding: 6px 4px;
}
body.bse .widget-title + .is-divider { display: none; }
/* Kategorikort (Shop: vis underkategorier): samme rolige stil som kategoriene i utkastet */
body.bse .product-category .box-text .header-title,
body.bse .product-category .box-text h5 {
  font-family: var(--kondens);
  font-weight: 400;
  font-size: 14px;
  letter-spacing: .18em;
  text-transform: uppercase;
}
body.bse .product-category .box-text .count {
  font-size: 12.5px;
  color: var(--mokka);
  opacity: 1;
}   /* sjekkes mot Flatsome (.product-category, .header-title, .count) */


/* 9. Produktside ----------------------------------------------------------- */

/* Produktnavn og pris i ren skrift, siden navnene inneholder tall og koder */
body.bse .product-info .product-title,
body.bse .product-info .product_title {
  font-family: var(--tekst);
  font-weight: 400;
  font-size: 26px;
  line-height: 1.35;
  letter-spacing: 0;
  text-transform: none;
  margin: 10px 0 14px;
}
body.bse .product-info .price,
body.bse .product-info .price .amount {
  font-family: var(--tekst);
  font-weight: 400;
  font-size: 26px;
  color: var(--espresso);
}
body.bse .product-info .product-short-description { font-size: 16px; }

/* Lagerstatus: liten grønn prikk i stedet for farget tekst */
body.bse .product-info .stock {
  color: var(--espresso);
  font-size: 14px;
  font-weight: 300;
}
body.bse .product-info .stock.in-stock::before {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-right: 8px;
  border-radius: 50%;
  background-color: #3F6B3A;
  vertical-align: middle;
}

/* Antallsvelger */
body.bse .quantity .ux-quantity__button,
body.bse .quantity .minus,
body.bse .quantity .plus {
  background-color: var(--hvit);
  border: 1px solid var(--stein);
  border-radius: 0;
  box-shadow: none;
  color: var(--espresso);
}
body.bse .quantity input.qty {
  border: 1px solid var(--stein);
  border-radius: 0;
  font-size: 15px;
  text-align: center;
}   /* sjekkes mot Flatsome (.ux-quantity, .ux-quantity__button, .minus, .plus) */

/* Legg i handlekurv */
body.bse .product-info form.cart .single_add_to_cart_button {
  min-width: 0;
  padding-left: 28px;
  padding-right: 28px;
}

/* Meta (varenummer, kategori) */
body.bse .product-info .product_meta { font-size: 14px; color: var(--mokka); }
body.bse .product-info .product_meta .sku { color: var(--espresso); }
body.bse .product-info .product_meta a { color: var(--mokka); }

/* Galleri: tynn ramme rundt hovedbildet og miniatyrene */
body.bse .product-images .woocommerce-product-gallery__image,
body.bse .product-gallery .woocommerce-product-gallery__image { border: 1px solid var(--linje); }
body.bse .product-thumbnails .col a,
body.bse .product-thumbnails .col > a { border: 1px solid var(--linje); display: block; }
body.bse .product-thumbnails .is-nav-selected a { border-color: var(--espresso); opacity: 1; }
/* sjekkes mot Flatsome (.product-images, .product-gallery, .product-thumbnails, .is-nav-selected) */

/* Faner / trekkspill (Theme Options > Shop > Product page > Tabs: «Accordion» anbefales) */
body.bse .accordion-title,
body.bse .tabbed-content .nav > li > a,
body.bse .woocommerce-tabs .nav > li > a {
  font-family: var(--kondens);
  font-weight: 400;
  font-size: 13px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--espresso);
}   /* sjekkes mot Flatsome (.accordion-title, .tabbed-content, .woocommerce-tabs) */
body.bse .accordion-title { border-color: var(--linje); }
body.bse .accordion-inner { font-size: 16px; }

/* Relaterte og nyeste produkter: samme rolige titler som seksjonstitlene */
body.bse .product-section-title,
body.bse .related-products-wrapper .product-section-title {
  font-family: var(--kondens);
  font-weight: 400;
  font-size: 15px;
  letter-spacing: .22em;
  text-transform: uppercase;
}   /* sjekkes mot Flatsome (.product-section-title) */


/* 10. Footer ----------------------------------------------------------------- */

body.bse #footer,
body.bse #footer .footer-widgets,
body.bse #footer .footer-1,
body.bse #footer .footer-2 {
  background-color: var(--lin);
  color: var(--espresso);
}   /* sjekkes mot Flatsome (#footer, .footer-widgets, .footer-1, .footer-2, .dark) */
body.bse #footer .dark,
body.bse #footer .dark p,
body.bse #footer .dark li,
body.bse #footer .dark a,
body.bse #footer .dark h4,
body.bse #footer .dark .widget-title { color: var(--espresso); }
body.bse #footer a { color: var(--espresso); text-decoration: none; }
body.bse #footer a:hover { color: var(--espresso); text-decoration: underline; text-underline-offset: 4px; }

/* Footer-titler (Kundeservice, Sider, Åpningstider): Roboto Condensed, små versaler med sperring. Ikke Playball. */
body.bse #footer .widget-title,
body.bse #footer .widgettitle,
body.bse #footer h4 {
  font-family: var(--kondens);
  font-weight: 400;
  font-size: 13px;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--espresso);
  display: block;
  margin: 0 0 16px;
}
body.bse #footer .is-divider { display: none; }
body.bse #footer .widget ul,
body.bse #footer .widget li { border: 0; }
body.bse #footer .widget li { margin-bottom: 6px; }
body.bse #footer .widget li a { padding: 0; font-weight: 300; }

/* Footeren fra functions.php (bse_footer): fire kolonner, 1.4fr 1fr 1fr 1fr som i utkastet */
body.bse .bse-fot { background-color: var(--lin); color: var(--espresso); padding: 80px 0 64px; }
body.bse .bse-fot-rad {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1fr;
  gap: 40px;
}
body.bse .bse-fot-logo { display: block; width: 100%; max-width: 230px; height: auto; }
body.bse .bse-fot-adresse p { margin: 22px 0 0; }
body.bse .bse-fot ul { list-style: none; margin: 0; padding: 0; }
body.bse .bse-fot li { margin: 0 0 6px; padding: 0; border: 0; }
body.bse .bse-fot li a { font-weight: 300; }

/* Åpningstider: to kolonner, like tallbredder */
body.bse #footer .bse-tider,
body.bse #footer .ebp-tider {
  display: grid;
  grid-template-columns: auto auto;
  justify-content: start;
  gap: 4px 28px;
  margin: 0;
  font-variant-numeric: tabular-nums lining-nums;
}
body.bse #footer .bse-tider dt,
body.bse #footer .ebp-tider dt {
  font-family: var(--kondens);
  font-weight: 400;
  font-size: 13px;
  letter-spacing: .14em;
  text-transform: uppercase;
  margin: 0;
}
body.bse #footer .bse-tider dd,
body.bse #footer .ebp-tider dd { margin: 0; }

/* Nederste linje: copyright til venstre, betalingsikoner i midten, sosiale til høyre.
   .footer-secondary (Flatsome) holder både footer_right_text og betalingsikonene,
   så den «løses opp» med display: contents og hvert barn blir et eget flex-element. */
body.bse #footer .absolute-footer {
  background-color: var(--lin);
  color: var(--mokka);
  font-size: 13px;
  padding: 0 0 32px;
}
body.bse #footer .absolute-footer > .container {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding-top: 24px;
  border-top: 1px solid var(--stein);
}
body.bse #footer .absolute-footer > .container::before,
body.bse #footer .absolute-footer > .container::after { display: none; }
body.bse #footer .absolute-footer .footer-primary { order: 1; float: none; }
body.bse #footer .absolute-footer .footer-secondary { display: contents; }
body.bse #footer .absolute-footer .payment-icons { order: 2; }
body.bse #footer .absolute-footer .footer-text { order: 3; padding: 0; }
body.bse #footer .absolute-footer .copyright-footer { padding: 0; }
body.bse #footer .absolute-footer a,
body.bse #footer .absolute-footer .dark a { color: var(--mokka); }
body.bse #footer .absolute-footer a:hover { color: var(--espresso); }
body.bse #footer .payment-icons .payment-icon {
  background-color: transparent;
  border: 1px solid var(--stein);
  border-radius: 0;
  opacity: 1;
  color: var(--mokka);
  padding: 3px 8px;
}
body.bse #footer .payment-icons .payment-icon svg { height: 16px; fill: currentColor; }


/* 11. Mobil ------------------------------------------------------------------- */
/* Selve mobilmenyen er Flatsome sin (utglidende panel). Her justeres bare farger og skrift. */

@media (max-width: 849px) {
  body.bse #top-bar { font-size: 12px; }
  /* Bare første tekst i toppstripa på mobil, som i utkastet */
  body.bse .bse-toppstripe > span:nth-child(n+2) { display: none; }
  body.bse .bse-fot-rad { grid-template-columns: 1fr 1fr; }
  body.bse .bse-fot { padding: 56px 0 40px; }
  body.bse #footer .absolute-footer > .container { justify-content: center; text-align: center; }
  /* Mobilpanelet: lenkene «Butikken på Frogner» og «Kontakt» under hverandre */
  body.bse .mobile-sidebar .bse-hodelenker { display: grid; gap: 0; }
  body.bse .mobile-sidebar .bse-hodelenker a {
    padding: 14px 0;
    border-bottom: 1px solid var(--linje);
    font-family: var(--kondens);
    font-size: 14px;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--espresso);
  }
  body.bse .bse-helt-under { margin: 12px auto 18px; }
  body.bse #logo img,
  body.bse #logo svg { max-height: 36px; }

  body.bse #main-menu,
  body.bse .mobile-sidebar { background-color: var(--hvit); color: var(--espresso); }
  body.bse #main-menu .nav-sidebar > li > a,
  body.bse .mobile-sidebar .nav-sidebar > li > a {
    font-family: var(--kondens);
    font-weight: 400;
    font-size: 15px;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--espresso);
    padding: 16px 0;
    border-bottom: 1px solid var(--linje);
  }
  body.bse #main-menu .nav-sidebar .children a,
  body.bse #main-menu .nav-sidebar .sub-menu a,
  body.bse .mobile-sidebar .sub-menu a {
    font-family: var(--tekst);
    font-weight: 300;
    font-size: 16px;
    letter-spacing: 0;
    text-transform: none;
    color: var(--espresso-80);
  }
  body.bse #main-menu .search-field,
  body.bse .mobile-sidebar .search-field { border-bottom: 1px solid var(--stein); }
  /* sjekkes mot Flatsome (#main-menu, .mobile-sidebar, .nav-sidebar, .children) */

  body.bse .product-small .box-text { padding-top: 12px; }
  body.bse .section-title-container { margin-bottom: 28px; }
}


/* 12. Redusert bevegelse ----------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  body.bse *,
  body.bse *::before,
  body.bse *::after {
    animation: none !important;
    transition: none !important;
  }
}

/* 1.1.2: toppstripen viser bare første tekst på mobil, så den holder seg på én linje */
@media (max-width: 849px) {
  body.bse .ebp-toppstripe span:not(:first-child),
  body.bse .bse-toppstripe > span:not(:first-child) { display: none; }
}
/* 1.1.2: nyhetsbrev i footeren (Mailchimp for WordPress) */
body.bse #footer .bse-fot-nyhetsbrev { margin-top: 28px; }
body.bse #footer .mc4wp-form input[type="email"] { width: 100%; max-width: 280px; border: 1px solid var(--stein, #D9CFC4); background: #fff; }
body.bse #footer .mc4wp-form input[type="submit"] { margin-top: 8px; background: var(--espresso, #2B2622); color: #fff; border: 0; text-transform: uppercase; letter-spacing: .14em; font-size: 12px; }