/* Enkel Natur - komponenter ovanpå tokens.css.
   Allt är prefixat .en- så att Blocksys egna stilar lämnas ifred.
   Undantaget är butiksloopen (ul.products), som måste skrivas om för rutnätet. */

/* ─── Grund ──────────────────────────────────────────────────────────────── */
.en-wrap{max-width:var(--container-max);margin:0 auto;padding-left:var(--gutter-desktop);padding-right:var(--gutter-desktop)}
.en-wrap-narrow{max-width:var(--container-narrow);margin:0 auto;padding-left:var(--gutter-desktop);padding-right:var(--gutter-desktop)}
.en-section{padding-block:var(--space-24)}
.en-section-tight{padding-block:var(--space-12)}

.en-eyebrow{font-family:var(--font-sans-body);font-size:var(--text-eyebrow);font-weight:600;
  letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-brand);
  line-height:1.4;margin:0 0 18px}
.en-eyebrow-inv{color:var(--en-sage-200)}

.en-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:52px;padding:0 28px;
  border:1px solid transparent;border-radius:var(--radius-xs);font-family:var(--font-sans-body);
  font-size:12px;font-weight:600;letter-spacing:var(--tracking-button);text-transform:uppercase;
  text-decoration:none;cursor:pointer;white-space:nowrap;background:var(--brand-primary);color:#fff;
  transition:background var(--duration-fast) var(--ease-out)}
.en-btn:hover{background:var(--brand-primary-hover);color:#fff;text-decoration:none}
.en-btn-inverse{background:var(--text-inverse);color:var(--text-heading)}
.en-btn-inverse:hover{background:var(--en-linen-200);color:var(--text-heading)}

.en-tlink{font-family:var(--font-sans-body);font-size:13px;font-weight:600;letter-spacing:.04em;
  color:var(--text-link);text-decoration:none;border-bottom:1px solid var(--border-strong);padding-bottom:2px;
  white-space:nowrap}
.en-tlink:hover{border-color:currentColor;text-decoration:none}

.en-sec-head{display:flex;align-items:baseline;justify-content:space-between;gap:32px;margin-bottom:var(--space-10)}
.en-sec-head h2{font-family:var(--font-serif-display);font-weight:var(--weight-display);
  font-size:var(--text-display-sm);color:var(--text-heading);margin:0;line-height:var(--leading-heading)}

/* ─── Hjälte ─────────────────────────────────────────────────────────────── */
.en-hero{position:relative;height:clamp(560px,45vw,900px);overflow:hidden;background:var(--en-charcoal-800)}
.en-hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.en-hero-scrim{position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(30,32,27,.7) 0%,rgba(30,32,27,.28) 46%,rgba(30,32,27,0) 70%)}
.en-hero-scrim2{position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(30,32,27,0) 50%,rgba(30,32,27,.45) 100%)}
.en-hero-in{position:relative;max-width:var(--container-max);margin:0 auto;
  padding:0 var(--gutter-desktop) var(--space-20);height:100%;
  display:flex;flex-direction:column;justify-content:flex-end}
.en-hero h1{font-family:var(--font-serif-display);font-weight:var(--weight-display);
  font-size:var(--text-display-xl);line-height:1.06;letter-spacing:var(--tracking-display);
  color:var(--en-linen-50);max-width:16ch;margin:0;text-wrap:balance}
.en-hero h1 em{font-style:italic;font-weight:var(--weight-display-strong)}
.en-hero-lead{color:rgba(251,249,246,.88);font-family:var(--font-sans-body);font-size:var(--text-lead);
  max-width:48ch;margin:22px 0 0;line-height:1.6}
.en-hero-acts{margin:36px 0 0;display:flex;gap:26px;align-items:center;flex-wrap:wrap}
.en-hero-acts .en-tlink{color:var(--en-linen-50);border-bottom-color:rgba(251,249,246,.45)}

/* Utan bild: samma komposition på linne. */
.en-hero-flat{height:auto;background:var(--bg-page);border-bottom:1px solid var(--border-default)}
.en-hero-flat .en-hero-in{padding-block:var(--space-24)}
.en-hero-flat h1{color:var(--text-heading)}
.en-hero-flat .en-hero-lead{color:var(--text-body)}
.en-hero-flat .en-btn-inverse{background:var(--brand-primary);color:#fff}
.en-hero-flat .en-btn-inverse:hover{background:var(--brand-primary-hover)}
.en-hero-flat .en-tlink{color:var(--text-link);border-bottom-color:var(--border-strong)}

/* ─── Besvärsraden ───────────────────────────────────────────────────────── */
.en-besvar-row{margin-block:0}
.en-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1px;
  background:var(--border-default)}
.en-tile{position:relative;display:block;aspect-ratio:3/4;overflow:hidden;text-decoration:none;
  background:var(--surface-muted)}
.en-tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  transition:transform 700ms var(--ease-out)}
.en-tile:hover img{transform:scale(1.04)}
.en-tile-veil{position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(30,32,27,.16) 0%,rgba(30,32,27,.3) 45%,rgba(30,32,27,.82) 100%)}
.en-tile-cap{position:absolute;left:0;right:0;bottom:0;padding:28px 26px;display:block}
.en-tile-line{display:block;font-family:var(--font-sans-body);font-size:10px;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;color:var(--en-sage-200);margin-bottom:10px}
.en-tile-name{display:block;font-family:var(--font-serif-display);font-weight:var(--weight-display);
  font-size:clamp(20px,1.7vw,26px);line-height:1.15;color:var(--en-linen-50);
  hyphens:auto;overflow-wrap:break-word}
.en-tile-go{display:inline-block;margin-top:14px;font-family:var(--font-sans-body);font-size:12px;
  font-weight:600;letter-spacing:.04em;color:var(--en-linen-50);opacity:0;transform:translateY(6px);
  transition:opacity var(--duration-base) var(--ease-out),transform var(--duration-base) var(--ease-out)}
.en-tile:hover .en-tile-go,.en-tile:focus-visible .en-tile-go{opacity:1;transform:none}

/* ─── Produktkort och rutnät ─────────────────────────────────────────────── */
.en-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:28px 24px}
.en-pc{display:flex;flex-direction:column;gap:10px;height:100%;width:100%;text-decoration:none;color:inherit}
.en-pc:hover{text-decoration:none}
.en-pc-img{position:relative;display:block;aspect-ratio:1/1;overflow:hidden;
  border-radius:var(--radius-xs);background:var(--surface-muted)}
.en-pc-img img{width:100%;height:100%;object-fit:cover;
  transition:transform var(--duration-slow) var(--ease-out)}
.en-pc:hover .en-pc-img img{transform:scale(var(--image-hover-scale))}
.en-badge{position:absolute;top:10px;left:10px;background:var(--brand-accent);color:#fff;
  font-family:var(--font-sans-body);font-size:10px;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;padding:4px 8px;border-radius:var(--radius-xs)}
.en-pc-fmt{display:block;font-family:var(--font-sans-body);font-size:10px;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;color:var(--text-brand)}
.en-pc-name{display:block;font-family:var(--font-serif-display);font-weight:var(--weight-display-strong);
  font-size:17px;line-height:1.3;color:var(--text-heading)}
.en-pc-price{display:block;margin-top:auto;padding-top:6px;font-family:var(--font-sans-body);
  font-size:14px;font-weight:600;color:var(--text-heading);font-variant-numeric:tabular-nums}
.en-pc-price del{color:var(--text-subtle);font-weight:400;margin-right:8px;text-decoration-thickness:1px}
.en-pc-price ins{color:var(--status-sale);text-decoration:none}
.en-pc-price .woocommerce-Price-currencySymbol{font-weight:400}

/* ─── Rutinen ────────────────────────────────────────────────────────────── */
.en-ritual{padding-block:var(--space-24);background:var(--bg-page-alt)}
.en-ritual-h{text-align:center;margin-bottom:var(--space-16)}
.en-ritual-h h2{font-family:var(--font-serif-display);font-weight:var(--weight-display);
  font-size:var(--text-display-md);color:var(--text-heading);margin:0;line-height:var(--leading-heading)}
.en-steps{display:grid;grid-template-columns:repeat(3,1fr);position:relative}
.en-step{padding:0 40px;text-align:center;position:relative}
.en-step::before{content:"";position:absolute;top:26px;left:0;right:50%;height:1px;background:var(--border-default)}
.en-step::after{content:"";position:absolute;top:26px;left:50%;right:0;height:1px;background:var(--border-default)}
.en-step:first-child::before,.en-step:last-child::after{display:none}
.en-dot{width:52px;height:52px;border-radius:var(--radius-pill);background:var(--bg-page-alt);
  border:1px solid var(--border-strong);display:grid;place-items:center;margin:0 auto 24px;
  position:relative;z-index:1;font-family:var(--font-sans-body);font-size:12px;font-weight:700;
  color:var(--text-brand);letter-spacing:.06em}
.en-step h3{font-family:var(--font-sans-body);font-size:15px;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;color:var(--text-heading);margin:0 0 12px}
.en-step p{font-family:var(--font-sans-body);font-size:14px;line-height:1.65;color:var(--text-muted);
  max-width:30ch;margin:0 auto}

/* ─── Brödtext ───────────────────────────────────────────────────────────── */
.en-prose{padding-block:var(--space-20)}
.en-prose p,.en-prose li{font-family:var(--font-sans-body);font-size:var(--text-lead);line-height:1.75;
  color:var(--text-body)}
.en-prose p{margin:0 0 20px}
.en-prose h2{font-family:var(--font-serif-display);font-weight:var(--weight-display);
  font-size:var(--text-display-sm);color:var(--text-heading);margin:48px 0 18px;line-height:var(--leading-heading)}
.en-prose h3{font-family:var(--font-serif-display);font-weight:var(--weight-display-strong);
  font-size:var(--text-title);color:var(--text-heading);margin:36px 0 14px}
.en-prose ul{margin:0 0 20px;padding-left:0;list-style:none}
.en-prose li{border-top:1px solid var(--border-default);padding:12px 0}
.en-prose li:last-child{border-bottom:1px solid var(--border-default)}
.en-prose a{color:var(--text-link);text-decoration:underline;text-underline-offset:3px;
  text-decoration-thickness:1px;text-decoration-color:var(--border-strong)}
.en-prose a:hover{text-decoration-color:currentColor}

/* ─── Säkerhetsruta ──────────────────────────────────────────────────────── */
.en-safety{background:var(--status-warning-soft);border-radius:var(--radius-sm);padding:24px 26px}
.en-safety p{font-family:var(--font-sans-body);font-size:15px;line-height:1.7;color:var(--en-charcoal-700);margin:0}
.en-safety .en-eyebrow{color:var(--en-ochre-500);margin-bottom:10px}

/* ─── Uppmaningsband ─────────────────────────────────────────────────────── */
.en-cta-band{background:var(--surface-inverse);color:var(--text-inverse);padding-block:var(--space-20)}
.en-cta-in{display:flex;align-items:center;justify-content:space-between;gap:56px}
.en-cta-band h2{font-family:var(--font-serif-display);font-weight:var(--weight-display);
  font-size:var(--text-display-sm);color:var(--en-linen-50);margin:0 0 14px;line-height:var(--leading-heading)}
.en-cta-band p{font-family:var(--font-sans-body);font-size:16px;line-height:1.7;
  color:rgba(251,249,246,.78);margin:0;max-width:52ch}
.en-cta-act{margin:0;flex:none}

/* ─── Butiken: rubrik och chips ──────────────────────────────────────────── */
.en-shop-head{padding-block:var(--space-12) var(--space-10);border-bottom:1px solid var(--border-default)}
.en-shop-title{font-family:var(--font-serif-display);font-weight:var(--weight-display);
  font-size:var(--text-display-sm);color:var(--text-heading);margin:0;line-height:var(--leading-heading)}
.en-shop-title em{font-style:italic;font-weight:var(--weight-display-strong)}
.en-shop-sub{font-family:var(--font-sans-body);font-size:14px;color:var(--text-muted);margin:12px 0 0}
.en-chips{display:flex;gap:10px;margin-top:26px;flex-wrap:wrap}
.en-chip{display:inline-flex;align-items:center;gap:10px;border:1px solid var(--border-strong);
  background:var(--surface-card);border-radius:var(--radius-xs);padding:9px 16px 9px 10px;
  font-family:var(--font-sans-body);font-size:13px;font-weight:600;color:var(--text-heading);
  text-decoration:none;
  transition:border-color var(--duration-fast) var(--ease-out),background var(--duration-fast) var(--ease-out)}
.en-chip img{width:26px;height:26px;object-fit:contain;opacity:.85}
.en-chip:hover{border-color:var(--brand-primary);background:var(--surface-sage);text-decoration:none}
.en-chip.is-on{border-color:var(--brand-primary);background:var(--surface-sage);color:var(--en-sage-800)}

/* ─── Butiken: filterskena och rutnät ────────────────────────────────────── */
.en-shop{display:grid;grid-template-columns:212px 1fr;gap:56px;padding-block:var(--space-10) var(--space-20)}
.en-shop-plain{grid-template-columns:1fr}
.en-shop-head-plain{padding-block:var(--space-12) var(--space-8)}
.en-rail{position:sticky;top:calc(var(--nav-height) + 20px);align-self:start;font-family:var(--font-sans-body)}
.en-rail section{margin-bottom:34px}
.en-rail h3{font-family:var(--font-sans-body);font-size:11px;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:var(--text-heading);margin:0 0 14px}
.en-f{display:flex;align-items:center;gap:10px;padding:6px 0;font-size:14px;color:var(--text-body);
  text-decoration:none}
.en-f:hover{color:var(--text-heading);text-decoration:none}
.en-box{width:15px;height:15px;border:1px solid var(--border-strong);border-radius:var(--radius-xs);
  background:var(--surface-card);flex:none;display:grid;place-items:center}
.en-f.is-on .en-box{background:var(--brand-primary);border-color:var(--brand-primary)}
.en-f.is-on .en-box::after{content:"";width:7px;height:4px;border-left:1.5px solid #fff;
  border-bottom:1.5px solid #fff;transform:rotate(-45deg) translate(1px,-1px)}
.en-f.is-on{color:var(--text-heading);font-weight:600}
.en-cnt{margin-left:auto;font-size:12px;color:var(--text-subtle);font-variant-numeric:tabular-nums}
.en-reset{font-size:12px;color:var(--text-muted);text-decoration:underline;text-underline-offset:3px}

/* Blocksys loop skrivs om till katalogrutnätet. */
.en-shop-main ul.products{display:grid;grid-template-columns:repeat(4,1fr);gap:28px 24px;
  margin:0;padding:0;list-style:none}
.en-shop-main ul.products::before,.en-shop-main ul.products::after{display:none}
.en-shop-main ul.products li.product{width:auto;margin:0;padding:0;float:none;clear:none;display:flex}
.en-shop-main ul.products li.product::before,.en-shop-main ul.products li.product::after{display:none}
.en-shop-main .woocommerce-result-count,
.en-shop-main .woocommerce-ordering{font-family:var(--font-sans-body);font-size:13px;color:var(--text-muted)}
.en-shop-main .woocommerce-notices-wrapper:empty{display:none}

/* ─── Smala vyer ─────────────────────────────────────────────────────────── */
@media (max-width:900px){
  .en-wrap,.en-wrap-narrow{padding-left:var(--gutter);padding-right:var(--gutter)}
  .en-section{padding-block:var(--space-16)}
  .en-hero{height:auto;min-height:480px}
  .en-hero-in{padding-block:var(--space-16);padding-left:var(--gutter);padding-right:var(--gutter)}
  .en-hero h1{font-size:var(--text-display-md)}
  .en-tiles{grid-template-columns:1fr 1fr}
  .en-tile-go{opacity:1;transform:none}
  .en-grid,.en-shop-main ul.products{grid-template-columns:1fr 1fr;gap:24px 16px}
  .en-ritual-h h2{font-size:var(--text-display-sm)}
  .en-steps{grid-template-columns:1fr;gap:36px}
  .en-step{padding:0}
  .en-step::before,.en-step::after{display:none}
  .en-shop{grid-template-columns:1fr;gap:24px}
  .en-rail{position:static;display:grid;grid-template-columns:1fr 1fr;gap:0 28px}
  .en-cta-in{flex-direction:column;align-items:flex-start;gap:28px}
  .en-sec-head{flex-direction:column;align-items:flex-start;gap:12px}
}
@media (max-width:520px){
  .en-tiles{grid-template-columns:1fr}
  .en-tile{aspect-ratio:4/3}
  .en-grid,.en-shop-main ul.products{grid-template-columns:1fr}
  .en-rail{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  .en-tile img,.en-pc-img img,.en-tile-go{transition:none}
}

/* ─── Startsidan: linjeband ──────────────────────────────────────────────── */
.en-band{display:grid;grid-template-columns:1fr 1fr;min-height:540px;align-items:stretch}
.en-band.is-flipped .en-band-img{order:2}
.en-band-img{position:relative;overflow:hidden;background:var(--surface-muted)}
.en-band-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  transition:transform 900ms var(--ease-out)}
.en-band:hover .en-band-img img{transform:scale(1.03)}
.en-band-text{display:flex;flex-direction:column;justify-content:center;
  padding:var(--space-20) var(--space-20) var(--space-20) var(--space-16)}
.en-band:nth-of-type(even) .en-band-text{background:var(--bg-page-alt)}
.en-band-line{font-family:var(--font-sans-body);font-size:12px;font-weight:700;letter-spacing:.18em;
  text-transform:uppercase;color:var(--text-brand);margin:0 0 18px}
.en-band-text h2{font-family:var(--font-serif-display);font-weight:var(--weight-display);
  font-size:var(--text-display-md);max-width:20ch;line-height:1.14;letter-spacing:var(--tracking-display);
  color:var(--text-heading);margin:0;text-wrap:balance}
.en-band-text h2 em{font-style:italic;font-weight:var(--weight-display-strong)}
.en-band-lead{font-family:var(--font-sans-body);font-size:16px;line-height:1.65;color:var(--text-body);
  max-width:44ch;margin:20px 0 0}
.en-facts{margin:32px 0 0;max-width:44ch}
.en-facts dt{font-family:var(--font-sans-body);font-size:10px;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;color:var(--text-subtle);padding-top:14px;border-top:1px solid var(--border-default)}
.en-facts dd{margin:5px 0 14px;font-family:var(--font-sans-body);font-size:15px;line-height:1.55;
  color:var(--text-body)}
.en-facts dd:last-of-type{border-bottom:1px solid var(--border-default);padding-bottom:14px;margin-bottom:0}
.en-band-foot{margin:32px 0 0}

/* ─── Startsidan: metoden ────────────────────────────────────────────────── */
.en-method{background:var(--surface-sage);padding-block:var(--space-20)}
.en-method h2{font-family:var(--font-serif-display);font-weight:var(--weight-display);
  font-size:var(--text-display-sm);max-width:20ch;color:var(--en-sage-800);margin:0 0 var(--space-12);
  line-height:var(--leading-heading)}
.en-method-grid{display:grid;grid-template-columns:repeat(4,1fr)}
.en-method-grid > div{padding:0 28px;border-left:1px solid var(--en-sage-200)}
.en-method-grid > div:first-child{padding-left:0;border-left:0}
.en-num{display:block;margin-bottom:14px;font-family:var(--font-sans-body);font-size:12px;font-weight:600;
  letter-spacing:.1em;color:var(--en-sage-600);font-variant-numeric:tabular-nums}
.en-method-grid h3{font-family:var(--font-serif-display);font-weight:var(--weight-display-strong);
  font-size:20px;line-height:1.25;color:var(--en-sage-800);margin:0 0 10px}
.en-method-grid p{font-family:var(--font-sans-body);font-size:14px;line-height:1.65;color:var(--en-sage-700);margin:0}

/* ─── Startsidan: Danielas röst ──────────────────────────────────────────── */
.en-voice{display:grid;grid-template-columns:1fr 1fr;align-items:stretch;min-height:500px}
.en-voice-img{position:relative;overflow:hidden;background:var(--surface-muted)}
.en-voice-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.en-voice-text{display:flex;flex-direction:column;justify-content:center;
  padding:var(--space-20) var(--space-20) var(--space-20) var(--space-16);background:var(--bg-page-alt)}
.en-voice blockquote{margin:18px 0 0;font-family:var(--font-serif-display);font-weight:var(--weight-display);
  font-size:32px;line-height:1.34;letter-spacing:var(--tracking-display);color:var(--text-heading);
  max-width:22ch;text-wrap:balance}
.en-voice cite{display:block;margin-top:28px;font-family:var(--font-sans-body);font-size:13px;
  font-style:normal;color:var(--text-muted);letter-spacing:.03em;line-height:1.6}

/* ─── Startsidan: vanliga frågor ─────────────────────────────────────────── */
.en-faq{padding-block:var(--space-24)}
.en-faq h2{font-family:var(--font-serif-display);font-weight:var(--weight-display);
  font-size:var(--text-display-sm);color:var(--text-heading);margin:0 0 var(--space-10);
  text-align:center;line-height:var(--leading-heading)}
.en-faq details{border-top:1px solid var(--border-default)}
.en-faq details:last-of-type{border-bottom:1px solid var(--border-default)}
.en-faq summary{list-style:none;cursor:pointer;padding:22px 0;display:flex;justify-content:space-between;
  gap:24px;align-items:center;font-family:var(--font-sans-body);font-size:16px;font-weight:600;
  color:var(--text-heading)}
.en-faq summary::-webkit-details-marker{display:none}
.en-faq summary:hover{color:var(--brand-primary)}
.en-chev{color:var(--text-subtle);transition:transform var(--duration-base) var(--ease-out);flex:none;
  font-family:var(--font-sans-body);font-weight:400;font-size:18px}
.en-faq details[open] .en-chev{transform:rotate(45deg)}
.en-faq p{padding:0 0 24px;font-family:var(--font-sans-body);font-size:15px;line-height:1.7;
  color:var(--text-muted);max-width:62ch;margin:0}

/* ─── Startsidan: smala vyer ─────────────────────────────────────────────── */
@media (max-width:900px){
  .en-band,.en-band.is-flipped{grid-template-columns:1fr}
  .en-band.is-flipped .en-band-img{order:0}
  .en-band-img{min-height:300px}
  .en-band-text{padding:var(--space-12) var(--gutter)}
  .en-band-text h2{font-size:var(--text-display-sm)}
  .en-method-grid{grid-template-columns:1fr 1fr;gap:28px 0}
  .en-method-grid > div{padding:0 20px}
  .en-method-grid > div:nth-child(3){padding-left:0;border-left:0}
  .en-voice{grid-template-columns:1fr}
  .en-voice-img{min-height:300px}
  .en-voice-text{padding:var(--space-12) var(--gutter)}
  .en-voice blockquote{font-size:26px}
}
@media (max-width:520px){
  .en-method-grid{grid-template-columns:1fr}
  .en-method-grid > div{padding:0;border-left:0}
}

/* ─── Startsidan: rubrik över besvärsraden ───────────────────────────────── */
.en-besvar-row{padding-block:var(--space-20) 0}
.en-besvar-head{max-width:var(--container-max);margin:0 auto var(--space-12);
  padding-inline:var(--gutter-desktop);display:flex;align-items:flex-end;
  justify-content:space-between;gap:40px}
.en-besvar-head h2{font-family:var(--font-serif-display);font-weight:var(--weight-display);
  font-size:var(--text-display-md);max-width:14ch;color:var(--text-heading);margin:0;
  line-height:var(--leading-heading);letter-spacing:var(--tracking-display)}
.en-besvar-head p{font-family:var(--font-sans-body);font-size:15px;line-height:1.65;
  color:var(--text-muted);max-width:38ch;text-align:right;margin:0}

/* ─── Startsidan: konsultationsbandet ────────────────────────────────────── */
.en-konsult{background:var(--surface-inverse);color:var(--text-inverse);padding-block:var(--space-24)}
.en-konsult-in{max-width:var(--container-max);margin:0 auto;padding-inline:var(--gutter-desktop);
  display:grid;grid-template-columns:1.1fr .9fr;gap:80px;align-items:center}
.en-konsult h2{font-family:var(--font-serif-display);font-weight:var(--weight-display);
  font-size:var(--text-display-md);max-width:16ch;color:var(--en-linen-50);margin:0;
  line-height:var(--leading-heading);letter-spacing:var(--tracking-display)}
.en-konsult h2 em{font-style:italic;font-weight:var(--weight-display-strong)}
.en-konsult p{font-family:var(--font-sans-body);font-size:16px;line-height:1.7;
  color:rgba(251,249,246,.78);margin:22px 0 0}
.en-konsult-act{margin-top:32px!important}
.en-konsult figure{margin:0;aspect-ratio:3/2;overflow:hidden;border-radius:var(--radius-xs)}
.en-konsult figure img{width:100%;height:100%;object-fit:cover}

@media (max-width:900px){
  .en-besvar-head{flex-direction:column;align-items:flex-start;gap:12px;
    padding-inline:var(--gutter)}
  .en-besvar-head p{text-align:left}
  .en-konsult-in{grid-template-columns:1fr;gap:36px;padding-inline:var(--gutter)}
  .en-konsult h2{font-size:var(--text-display-sm)}
}

/* ─── Sidhuvudet ─────────────────────────────────────────────────────────── */
.en-announce{background:var(--surface-sage);min-height:36px;display:flex;align-items:center;
  justify-content:center;padding:8px var(--gutter);text-align:center;
  font-family:var(--font-sans-body);font-size:12px;letter-spacing:.02em;color:var(--en-sage-800)}
.en-hdr{position:sticky;top:0;z-index:100;background:rgba(246,243,238,.9);
  backdrop-filter:var(--backdrop-blur);-webkit-backdrop-filter:var(--backdrop-blur);
  border-bottom:1px solid var(--border-default)}
.en-hdr-in{max-width:var(--container-max);margin:0 auto;padding-inline:var(--gutter-desktop);
  height:var(--nav-height);display:flex;align-items:center;gap:40px}
.en-hdr-logo{display:flex;align-items:center;flex:none}
.en-hdr-logo img{height:56px;width:auto;display:block}

.en-nav ul{display:flex;gap:28px;list-style:none;margin:0;padding:0}
.en-nav a{font-family:var(--font-sans-body);font-size:14px;font-weight:500;color:var(--text-body);
  text-decoration:none;padding-bottom:2px;border-bottom:1px solid transparent;white-space:nowrap}
.en-nav a:hover{color:var(--brand-primary);text-decoration:none}
.en-nav .current-menu-item > a,.en-nav .current_page_item > a,
.en-nav .current-menu-ancestor > a,.en-nav .current_page_parent > a{
  color:var(--text-heading);border-bottom-color:var(--brand-primary)}

.en-hdr-right{margin-left:auto;display:flex;align-items:center;gap:20px;flex:none}
.en-langs{display:flex;gap:2px;border:1px solid var(--border-default);border-radius:var(--radius-pill);
  padding:2px;background:rgba(255,255,255,.5)}
.en-lang{padding:3px 10px;border-radius:var(--radius-pill);color:var(--text-muted);font-size:11px;
  font-weight:600;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;
  font-family:var(--font-sans-body)}
.en-lang:hover{color:var(--text-heading);text-decoration:none}
.en-lang.is-on{background:var(--surface-card);color:var(--text-heading)}
.en-cart{display:flex;align-items:center;gap:7px;color:var(--text-heading);font-weight:600;
  font-size:13px;font-family:var(--font-sans-body);text-decoration:none;white-space:nowrap}
.en-cart:hover{color:var(--brand-primary);text-decoration:none}
.en-cart b{background:var(--brand-primary);color:#fff;font-size:10px;min-width:17px;height:17px;
  border-radius:var(--radius-pill);display:grid;place-items:center;font-weight:700;padding:0 4px}

.en-burger{display:none;flex-direction:column;justify-content:center;gap:4px;width:40px;height:40px;
  margin-left:auto;background:none;border:0;cursor:pointer;padding:0}
.en-burger span{display:block;height:1.5px;width:20px;background:var(--text-heading);margin:0 auto;
  transition:transform var(--duration-fast) var(--ease-out),opacity var(--duration-fast) var(--ease-out)}
.en-burger[aria-expanded="true"] span:nth-child(1){transform:translateY(5.5px) rotate(45deg)}
.en-burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.en-burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-5.5px) rotate(-45deg)}

@media (max-width:900px){
  .en-hdr-in{gap:16px;padding-inline:var(--gutter)}
  .en-hdr-logo img{height:44px}
  .en-burger{display:flex}
  .en-nav{position:absolute;left:0;right:0;top:100%;background:var(--bg-page);
    border-bottom:1px solid var(--border-default);display:none}
  .en-nav.is-open{display:block}
  .en-nav ul{flex-direction:column;gap:0;padding:8px var(--gutter) 16px}
  .en-nav a{display:block;padding:14px 0;font-size:16px;border-bottom:1px solid var(--border-default)}
  .en-nav li:last-child a{border-bottom:0}
  .en-hdr-right{margin-left:0;gap:12px}
  .en-cart span{display:none}
}
@media (max-width:520px){
  .en-langs{display:none}
}

/* ─── Förtroenderaden ────────────────────────────────────────────────────── */
.en-trust{display:flex;border-top:1px solid var(--border-default);border-bottom:1px solid var(--border-default)}
.en-trust > div{flex:1;padding:20px 24px 20px 0;font-family:var(--font-sans-body);font-size:13px;
  line-height:1.6;color:var(--text-muted);border-right:1px solid var(--border-default)}
.en-trust > div:last-child{border-right:0;padding-right:0}
.en-trust b{display:block;color:var(--text-heading);font-weight:600;font-size:14px;margin-bottom:3px}

/* ─── Bloggarkivet ───────────────────────────────────────────────────────── */
.en-posts{display:grid;gap:0}
.en-post{display:grid;grid-template-columns:300px 1fr;gap:40px;align-items:start;
  padding:36px 0;border-top:1px solid var(--border-default)}
.en-post:last-child{border-bottom:1px solid var(--border-default)}
.en-post-img{display:block;aspect-ratio:4/3;overflow:hidden;border-radius:var(--radius-xs);
  background:var(--surface-muted)}
.en-post-img img{width:100%;height:100%;object-fit:cover;
  transition:transform var(--duration-slow) var(--ease-out)}
.en-post:hover .en-post-img img{transform:scale(var(--image-hover-scale))}
.en-post-cat{font-family:var(--font-sans-body);font-size:11px;font-weight:600;
  letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-brand);margin:0 0 12px}
.en-post h2{font-family:var(--font-serif-display);font-weight:var(--weight-display);font-size:28px;
  line-height:1.2;letter-spacing:var(--tracking-display);margin:0 0 12px;max-width:26ch}
.en-post h2 a{color:var(--text-heading);text-decoration:none}
.en-post h2 a:hover{color:var(--brand-primary);text-decoration:none}
.en-post-excerpt{font-family:var(--font-sans-body);font-size:15px;line-height:1.7;
  color:var(--text-muted);margin:0;max-width:62ch}
.en-post-meta{font-family:var(--font-sans-body);font-size:12px;color:var(--text-subtle);margin:16px 0 0}
.en-post-meta-top{margin:0 0 28px}
.en-pagination{margin-top:var(--space-12);font-family:var(--font-sans-body);font-size:14px}
.en-pagination .page-numbers{padding:8px 14px;color:var(--text-body);text-decoration:none}
.en-pagination .current{color:var(--text-heading);font-weight:600}
.en-empty{font-family:var(--font-sans-body);color:var(--text-muted)}

/* ─── Formulär i textspalten ─────────────────────────────────────────────── */
.en-prose input[type=text],.en-prose input[type=email],.en-prose input[type=tel],
.en-prose input[type=url],.en-prose textarea,.en-prose select{
  width:100%;font-family:var(--font-sans-body);font-size:15px;color:var(--text-heading);
  background:var(--surface-card);border:1px solid var(--border-strong);border-radius:var(--radius-xs);
  padding:12px 14px;transition:border-color var(--duration-fast) var(--ease-out)}
.en-prose input:focus,.en-prose textarea:focus,.en-prose select:focus{
  border-color:var(--border-focus);outline:none;box-shadow:var(--focus-ring)}
.en-prose label{font-family:var(--font-sans-body);font-size:13px;font-weight:600;
  color:var(--text-heading);display:block;margin-bottom:6px}
.en-prose button[type=submit],.en-prose input[type=submit],.en-prose .wpforms-submit{
  display:inline-flex;align-items:center;justify-content:center;height:52px;padding:0 28px;
  background:var(--brand-primary);color:#fff;border:1px solid transparent;border-radius:var(--radius-xs);
  font-family:var(--font-sans-body);font-size:12px;font-weight:600;letter-spacing:var(--tracking-button);
  text-transform:uppercase;cursor:pointer;box-shadow:none!important}
.en-prose button[type=submit]:hover,.en-prose .wpforms-submit:hover{background:var(--brand-primary-hover)}
.en-prose .wpforms-field{margin-bottom:20px}

/* ─── Enskild produkt ────────────────────────────────────────────────────── */
.single-product .en-product-line{margin-bottom:12px}
.single-product .en-product-line a{color:inherit;text-decoration:none}
.single-product .en-product-line a:hover{text-decoration:underline;text-underline-offset:3px}
.single-product .product_title{font-family:var(--font-serif-display)!important;
  font-weight:var(--weight-display)!important;font-size:var(--text-display-sm)!important;
  line-height:var(--leading-heading)!important;letter-spacing:var(--tracking-display)!important;
  color:var(--text-heading)!important}
.single-product .summary .price{font-family:var(--font-sans-body)!important;font-weight:600!important;
  color:var(--text-heading)!important;font-variant-numeric:tabular-nums}
.single-product .summary .price del{color:var(--text-subtle)!important;font-weight:400!important}
.single-product .summary .price ins{color:var(--status-sale)!important;text-decoration:none!important}
.single-product .single_add_to_cart_button{border-radius:var(--radius-xs)!important;
  background:var(--brand-primary)!important;color:#fff!important;font-family:var(--font-sans-body)!important;
  font-weight:600!important;letter-spacing:var(--tracking-button)!important;text-transform:uppercase!important;
  font-size:12px!important;box-shadow:none!important}
.single-product .single_add_to_cart_button:hover{background:var(--brand-primary-hover)!important}
.single-product .woocommerce-product-gallery img{border-radius:var(--radius-xs)}
.single-product .en-safety{margin-top:0}

@media (max-width:900px){
  .en-trust{flex-wrap:wrap}
  .en-trust > div{flex:1 1 46%;border-right:0;border-bottom:1px solid var(--border-default);padding-right:16px}
  .en-post{grid-template-columns:1fr;gap:20px;padding:28px 0}
  .en-post h2{font-size:24px}
}

/* Blocksys citatstil bort: designsystemet tillåter ingen färgad kantlist. */
.en-voice blockquote{border:0!important;padding:0!important;background:none!important;
  quotes:none;font-style:normal}
.en-voice blockquote::before,.en-voice blockquote::after{content:none}
.en-prose blockquote{border:0;border-top:1px solid var(--border-default);
  border-bottom:1px solid var(--border-default);background:none;margin:32px 0;padding:24px 0;
  font-family:var(--font-serif-display);font-weight:var(--weight-display);font-size:24px;
  line-height:1.4;color:var(--text-heading);font-style:normal}

/* ─── Förtroenderaden, omgjord ───────────────────────────────────────────── */
/* Fyra lika spalter med hårfina avdelare som går hela höjden, i stället för
   flexrader som blev olika höga och drog isär texten. */
.en-trust{display:grid;grid-template-columns:repeat(4,1fr);gap:0;
  border-top:1px solid var(--border-default);border-bottom:1px solid var(--border-default)}
.en-trust > div{padding:28px 32px;font-family:var(--font-sans-body);font-size:13px;line-height:1.6;
  color:var(--text-muted);border-right:0;border-left:1px solid var(--border-default)}
.en-trust > div:first-child{border-left:0;padding-left:0}
.en-trust > div:last-child{padding-right:0}
.en-trust b{display:block;font-family:var(--font-serif-display);font-weight:var(--weight-display-strong);
  font-size:17px;line-height:1.3;color:var(--text-heading);margin-bottom:8px;letter-spacing:0}

/* ─── Brödtext: luftigare rytm, ingen textvägg ───────────────────────────── */
.en-prose > .en-wrap-narrow > p:first-of-type{font-size:20px;line-height:1.7;color:var(--text-heading)}
.en-prose p{margin:0 0 24px;max-width:66ch}
.en-prose h2{margin:64px 0 20px;padding-top:24px;border-top:1px solid var(--border-default)}
.en-prose h2:first-child{margin-top:0;padding-top:0;border-top:0}
.en-prose h3{margin:40px 0 14px}
.en-prose ul{margin:0 0 24px;max-width:66ch}
.en-prose li{padding:14px 0;line-height:1.7}
.en-prose li strong{color:var(--text-heading)}

/* ─── Butikens funktionssidor: varukorg, kassa, mitt konto ───────────────── */
.en-prose-wide{padding-block:var(--space-16) var(--space-24)}
.en-prose-wide .woocommerce{font-family:var(--font-sans-body)}

.en-prose-wide .shop_table{width:100%;border-collapse:collapse;border:0;font-size:15px}
.en-prose-wide .shop_table th{font-family:var(--font-sans-body);font-size:11px;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted);text-align:left;
  padding:0 16px 14px 0;border-bottom:1px solid var(--border-strong)}
.en-prose-wide .shop_table td{padding:22px 16px 22px 0;border-top:1px solid var(--border-default);
  border-bottom:0;vertical-align:middle;color:var(--text-body)}
.en-prose-wide .shop_table .product-thumbnail{width:96px}
.en-prose-wide .shop_table .product-thumbnail img{width:80px;height:80px;object-fit:cover;
  border-radius:var(--radius-xs)}
.en-prose-wide .shop_table .product-name a{font-family:var(--font-serif-display);
  font-weight:var(--weight-display-strong);font-size:18px;line-height:1.3;color:var(--text-heading);
  text-decoration:none;border:0}
.en-prose-wide .shop_table .product-name a:hover{color:var(--brand-primary);text-decoration:none}
.en-prose-wide .shop_table .product-price,
.en-prose-wide .shop_table .product-subtotal{font-weight:600;color:var(--text-heading);
  font-variant-numeric:tabular-nums;white-space:nowrap}
.en-prose-wide .shop_table .product-remove{width:40px;text-align:right}
.en-prose-wide .quantity{display:inline-flex;align-items:center;border:1px solid var(--border-strong);
  border-radius:var(--radius-xs);background:var(--surface-card);overflow:hidden}
.en-prose-wide .quantity input{width:46px;text-align:center;border:0;background:none;
  font-family:var(--font-sans-body);font-size:15px;padding:10px 0;color:var(--text-heading)}
.en-prose-wide .quantity input:focus{box-shadow:none;outline:none}

/* Knappar: salvia för det som för framåt, ram för det som bara uppdaterar. */
.en-prose-wide .button,.en-prose-wide button[type=submit]{
  display:inline-flex;align-items:center;justify-content:center;height:52px;padding:0 26px;
  border-radius:var(--radius-xs);font-family:var(--font-sans-body);font-size:12px;font-weight:600;
  letter-spacing:var(--tracking-button);text-transform:uppercase;text-decoration:none;
  border:1px solid var(--text-heading);background:transparent;color:var(--text-heading);
  box-shadow:none!important;white-space:nowrap;line-height:1;
  transition:background var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out)}
.en-prose-wide .button:hover,.en-prose-wide button[type=submit]:hover{
  background:var(--text-heading);color:var(--text-inverse)}
.en-prose-wide .checkout-button,
.en-prose-wide .button[name=apply_coupon],
.en-prose-wide .wc-forward,
.en-prose-wide #place_order{background:var(--brand-primary);border-color:var(--brand-primary);color:#fff}
.en-prose-wide .checkout-button:hover,
.en-prose-wide .button[name=apply_coupon]:hover,
.en-prose-wide .wc-forward:hover,
.en-prose-wide #place_order:hover{background:var(--brand-primary-hover);
  border-color:var(--brand-primary-hover);color:#fff}
.en-prose-wide .button:disabled,.en-prose-wide button[type=submit]:disabled{opacity:.4}

.en-prose-wide .coupon{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.en-prose-wide .coupon input[type=text]{width:220px;height:52px;margin:0}
.en-prose-wide .actions{padding-top:28px!important}

/* Summeringsrutan: vitt kort på linne, hårfin ram, ingen streckad kant. */
.en-prose-wide .cart_totals{background:var(--surface-card);border:1px solid var(--border-default);
  border-radius:var(--radius-sm);padding:28px}
.en-prose-wide .cart_totals h2{font-family:var(--font-serif-display);
  font-weight:var(--weight-display);font-size:var(--text-title);color:var(--text-heading);
  margin:0 0 20px;padding:0;border:0;letter-spacing:0}
.en-prose-wide .cart_totals table{width:100%;border-collapse:collapse}
.en-prose-wide .cart_totals th,.en-prose-wide .cart_totals td{padding:14px 0;border:0;
  border-top:1px solid var(--border-default);border-style:solid!important;font-size:14px;text-align:left}
.en-prose-wide .cart_totals tr:first-child th,
.en-prose-wide .cart_totals tr:first-child td{border-top:0}
.en-prose-wide .cart_totals th{font-weight:600;color:var(--text-body);white-space:nowrap}
.en-prose-wide .cart_totals td{text-align:right;color:var(--text-heading);font-weight:600;
  font-variant-numeric:tabular-nums;white-space:nowrap}
.en-prose-wide .cart_totals .order-total td{font-size:17px}
.en-prose-wide .cart_totals .checkout-button{width:100%;margin-top:22px}
.en-prose-wide .wc-proceed-to-checkout{padding:0}

.en-prose-wide .woocommerce-info,.en-prose-wide .woocommerce-message,
.en-prose-wide .woocommerce-error{background:var(--surface-sage);border:0;
  border-radius:var(--radius-sm);padding:18px 22px;color:var(--en-sage-800);font-size:15px}
.en-prose-wide .woocommerce-info::before,.en-prose-wide .woocommerce-message::before{display:none}
.en-prose-wide .cart-empty{margin-bottom:20px}

@media (max-width:900px){
  .en-trust{grid-template-columns:1fr 1fr}
  .en-trust > div{padding:24px 20px;border-left:1px solid var(--border-default);
    border-top:1px solid var(--border-default)}
  .en-trust > div:nth-child(-n+2){border-top:0}
  .en-trust > div:nth-child(odd){border-left:0;padding-left:0}
  .en-prose > .en-wrap-narrow > p:first-of-type{font-size:18px}
  .en-prose-wide .shop_table thead{display:none}
  .en-prose-wide .shop_table tr{display:grid;grid-template-columns:96px 1fr auto;gap:0 16px;
    padding:20px 0;border-top:1px solid var(--border-default)}
  .en-prose-wide .shop_table td{display:block;padding:4px 0;border:0}
  .en-prose-wide .shop_table .product-thumbnail{grid-row:span 3}
  .en-prose-wide .shop_table .product-remove{grid-column:3;text-align:right}
  .en-prose-wide .coupon input[type=text]{width:100%}
}
@media (max-width:520px){
  .en-trust{grid-template-columns:1fr}
  .en-trust > div{border-left:0;padding-left:0;padding-right:0}
  .en-trust > div:first-child{border-top:0}
  .en-trust > div:nth-child(2){border-top:1px solid var(--border-default)}
}

/* Antalsfältet: Blocksy nollställer bredden, vi tvingar tillbaka den. */
.en-prose-wide .quantity input.qty,
.en-prose-wide .quantity input[type=number]{flex:0 0 auto!important;width:46px!important;
  min-width:46px!important;opacity:1!important;text-align:center}

/* Summeringsraden fick inte plats på en rad: momsnoteringen bryts nu ut
   under beloppet i stället för att rinna ut ur kortet. */
.en-prose-wide .cart_totals td{white-space:normal}
.en-prose-wide .cart_totals td .amount,
.en-prose-wide .cart_totals td .woocommerce-Price-amount{white-space:nowrap}
.en-prose-wide .cart_totals .order-total td small,
.en-prose-wide .cart_totals td .includes_tax{display:block;margin-top:4px;font-size:12px;
  font-weight:400;color:var(--text-muted);white-space:normal}
.en-prose-wide .cart_totals th{white-space:normal;padding-right:12px}

/* ─── Sidfoten ───────────────────────────────────────────────────────────── */
.en-ftr{background:var(--surface-inverse);color:var(--text-inverse);
  padding-block:var(--space-20) var(--space-10)}
.en-ftr-in{max-width:var(--container-max);margin:0 auto;padding-inline:var(--gutter-desktop);
  display:grid;grid-template-columns:2fr 1fr 1fr 1.2fr;gap:48px}
.en-ftr-mark{height:112px;width:auto;display:block;margin:0 0 22px}
.en-ftr-brand p{font-family:var(--font-sans-body);font-size:14px;line-height:1.7;
  color:rgba(251,249,246,.72);max-width:38ch;margin:0}
.en-ftr-col h4{font-family:var(--font-sans-body);font-size:15px;font-weight:600;letter-spacing:.04em;
  color:var(--en-linen-50);margin:0 0 16px}
.en-ftr-col ul{list-style:none;padding:0;margin:0;display:grid;gap:10px;
  font-family:var(--font-sans-body);font-size:14px}
.en-ftr a{color:rgba(251,249,246,.72);text-decoration:none}
.en-ftr a:hover{color:var(--en-linen-50);text-decoration:none}
.en-ftr-note{max-width:var(--container-max);margin:56px auto 0;padding:20px var(--gutter-desktop) 0;
  border-top:1px solid rgba(251,249,246,.14);display:flex;justify-content:space-between;gap:24px;
  font-family:var(--font-sans-body);font-size:12px;color:rgba(251,249,246,.55)}

@media (max-width:900px){
  .en-ftr-in{grid-template-columns:1fr 1fr;gap:36px 32px;padding-inline:var(--gutter)}
  .en-ftr-brand{grid-column:1 / -1}
  .en-ftr-note{flex-direction:column;gap:8px;padding-inline:var(--gutter)}
}
@media (max-width:520px){
  .en-ftr-in{grid-template-columns:1fr}
}

/* Formulärfälten fick ingen egen höjd och klippte texten. Nu sitter höjden
   på fältet och paddingen enbart i sidled, så inget skärs av. */
.en-prose input[type=text],
.en-prose input[type=email],
.en-prose input[type=tel],
.en-prose input[type=url],
.en-prose input[type=number],
.en-prose input[type=search],
.en-prose select{height:52px;padding:0 16px;line-height:normal;box-sizing:border-box}
.en-prose select{appearance:none;-webkit-appearance:none;-moz-appearance:none;
  padding-right:44px;cursor:pointer;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%236F6C64' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 16px center;background-size:14px 9px}
.en-prose textarea{padding:14px 16px;line-height:1.6;min-height:150px;box-sizing:border-box}
.en-prose input[type=checkbox],.en-prose input[type=radio]{width:auto;height:auto;
  margin-right:8px;accent-color:var(--brand-primary)}
.en-prose .wpforms-field-label{font-family:var(--font-sans-body);font-size:13px;font-weight:600;
  color:var(--text-heading)}
.en-prose .wpforms-field-description,.en-prose .wpforms-required-label{
  font-family:var(--font-sans-body);font-size:12px;color:var(--text-muted)}
.en-prose .wpforms-field-checkbox label,.en-prose .wpforms-field-radio label{
  display:flex;align-items:flex-start;gap:4px;font-weight:400;font-size:14px;
  color:var(--text-body);margin-bottom:0}
.en-prose .wpforms-container{margin:0 0 32px}

/* Logotypen i sidfoten låg på en ljus bricka, för att wordmarken är nästan
   svart. Brickan lyste som en klisterlapp mitt i det svarta fältet. Nu ligger
   märket direkt på svärtan i en ljus variant, utan platta bakom sig. */
.en-ftr-mark{height:112px;width:auto;display:block;margin:-8px 0 20px -6px}

/* ─── Linjejämförelsen ───────────────────────────────────────────────────── */
/* Tre spalter i stället för en tabell. Inga ramar, bara hårfina avdelare
   mellan spalterna och mellan faktaraderna, så att den läses som en
   jämförelse och inte som ett kalkylblad. */
.en-compare-head{max-width:60ch;margin-bottom:var(--space-12)}
.en-compare-head h2{font-family:var(--font-serif-display);font-weight:var(--weight-display);
  font-size:var(--text-display-md);color:var(--text-heading);margin:0 0 10px;
  line-height:var(--leading-heading);letter-spacing:var(--tracking-display)}
.en-compare-head p{font-family:var(--font-sans-body);font-size:15px;line-height:1.65;
  color:var(--text-muted);margin:0}

.en-lines{display:grid;grid-template-columns:repeat(3,1fr);gap:0;
  border-top:1px solid var(--border-default)}
.en-line{padding:36px 40px;border-left:1px solid var(--border-default);
  display:flex;flex-direction:column;
  transition:background var(--duration-base) var(--ease-out)}
.en-line:first-child{border-left:0;padding-left:0}
.en-line:last-child{padding-right:0}
.en-line:hover{background:var(--bg-page-alt)}
.en-line-kicker{font-family:var(--font-sans-body);font-size:11px;font-weight:600;
  letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-brand);
  margin:0 0 12px}
.en-line h3{font-family:var(--font-serif-display);font-weight:var(--weight-display);
  font-size:30px;line-height:1.1;letter-spacing:var(--tracking-display);
  color:var(--text-heading);margin:0 0 28px}
.en-line dl{margin:0;display:contents}
.en-fact{display:flex;flex-direction:column;justify-content:flex-start}
.en-line dt{font-family:var(--font-sans-body);font-size:10px;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;color:var(--text-subtle);
  padding-top:16px;border-top:1px solid var(--border-default)}
.en-line dd{margin:6px 0 18px;font-family:var(--font-sans-body);font-size:15px;
  line-height:1.6;color:var(--text-body)}
.en-line-foot{margin:20px 0 0;align-self:start}

/* Faktaraderna ska ligga i linje tvärs över spalterna, annars hoppar
   etiketterna upp och ner när en text bryts på två rader. */
@supports (grid-template-rows: subgrid) {
  .en-lines{grid-template-rows:auto auto auto auto auto auto}
  .en-line{display:grid;grid-template-rows:subgrid;grid-row:span 6;row-gap:0}
}

.en-compare .en-safety-note{margin-top:var(--space-10);
  padding-top:20px;border-top:1px solid var(--border-default)}

@media (max-width:900px){
  .en-compare-head h2{font-size:var(--text-display-sm)}
  .en-lines{grid-template-columns:1fr;border-top:0}
  .en-line{padding:28px 0;border-left:0;border-top:1px solid var(--border-default)}
  .en-line:first-child{border-top:1px solid var(--border-default)}
  .en-line:hover{background:none}
  .en-line h3{font-size:26px;margin-bottom:20px}
}

/* ─── Produktsidan: beskrivningen ────────────────────────────────────────── */
/* Texterna kom med egna style-attribut i orange, lila och Helvetica.
   inc/product-content.php läser dem som struktur och slänger dem; här får
   strukturen sitt utseende ur designsystemet i stället. */
.en-desc{font-family:var(--font-sans-body);font-size:var(--text-base);
  line-height:var(--leading-body);color:var(--text-body);max-width:var(--container-narrow)}
.en-desc > *:first-child{margin-top:0}
.en-desc > *:last-child{margin-bottom:0}
.en-desc p{margin:0 0 var(--space-4)}
.en-desc h2,.en-desc h3{font-family:var(--font-serif-display);font-weight:var(--weight-display);
  color:var(--text-heading);line-height:var(--leading-heading);
  letter-spacing:var(--tracking-display);text-transform:none}
.en-desc h2{font-size:var(--text-display-sm);margin:var(--space-12) 0 var(--space-4)}
.en-desc h3{font-size:var(--text-title);margin:var(--space-10) 0 var(--space-3)}
.en-desc h4{font-family:var(--font-sans-body);font-weight:var(--weight-semibold);
  font-size:var(--text-base);color:var(--text-heading);margin:0 0 var(--space-2);
  letter-spacing:0;text-transform:none}
.en-desc strong,.en-desc b{font-weight:var(--weight-semibold);color:var(--text-heading)}
.en-desc em,.en-desc i{font-style:italic;color:inherit}
.en-desc a{color:var(--text-link);text-underline-offset:3px}
.en-desc ul,.en-desc ol{margin:0 0 var(--space-4);padding-left:var(--space-5)}
.en-desc ul{list-style:none;padding-left:0}
.en-desc ul li{position:relative;padding-left:var(--space-5);margin-bottom:var(--space-2);
  display:block}
.en-desc ul li::before{content:"";position:absolute;left:0;top:11px;width:6px;height:1px;
  background:var(--en-sage-400)}
.en-desc ol li{margin-bottom:var(--space-2);padding-left:var(--space-1)}
.en-desc ol li::marker{color:var(--text-subtle);font-variant-numeric:tabular-nums}
.en-desc hr{border:0;border-top:1px solid var(--border-default);margin:var(--space-10) 0}
.en-desc img{border-radius:var(--radius-xs)}

/* Inledningen stod centrerad med en färgad linje under. Samma roll, lugnare:
   större ingress, hårfin avdelare, vänsterställt som allt annat. */
.en-desc .en-d-center{text-align:left;border-bottom:1px solid var(--border-default);
  padding-bottom:var(--space-8);margin-bottom:var(--space-10)}
.en-desc .en-d-center > p{max-width:none}
.en-desc .en-d-center h2{margin-top:0}

/* Två kort bredvid varandra. */
.en-desc .en-d-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-6);
  margin:0 0 var(--space-8)}
.en-desc .en-d-card{background:var(--bg-page-alt);border:1px solid var(--border-default);
  border-radius:var(--radius-xs);padding:var(--space-6);box-shadow:none}
.en-desc .en-d-card > *:last-child{margin-bottom:0}
.en-desc .en-d-card{margin:0 0 var(--space-6)}
.en-desc .en-d-row > .en-d-card{margin:0}

/* Rubriken som hade ett färgat streck bredvid sig. */
.en-desc .en-d-bar{border-left:1px solid var(--en-sage-400);padding-left:var(--space-4)}

/* Den avslutande uppmaningen: hel bottenplatta i stället för orange banderoll. */
.en-desc .en-d-note{background:var(--surface-inverse);color:var(--text-inverse);
  border-radius:var(--radius-xs);padding:var(--space-6) var(--space-8);margin:var(--space-10) 0;
  font-family:var(--font-serif-display);font-weight:var(--weight-display);
  font-size:var(--text-title);line-height:var(--leading-tight);text-align:left}
.en-desc .en-d-note strong,.en-desc .en-d-note b{color:inherit;font-weight:var(--weight-display-strong)}
.en-desc .en-d-note *{color:inherit}

/* ─── Produktsidan: WooCommerces egna delar ──────────────────────────────── */
/* Rean-märket satt i Blocksys gröna; terrakotta är designsystemets enda
   säljfärg, och salvia ska inte betyda "rea". */
.single-product .onsale,.woocommerce span.onsale{background:var(--status-sale)!important;
  color:#fff!important;border-radius:var(--radius-xs)!important;font-family:var(--font-sans-body)!important;
  font-size:var(--text-eyebrow)!important;font-weight:var(--weight-semibold)!important;
  letter-spacing:var(--tracking-eyebrow)!important;text-transform:uppercase!important;
  padding:6px 10px!important;line-height:1!important;min-width:0!important;min-height:0!important;
  box-shadow:none!important}

.single-product .ct-breadcrumbs{font-family:var(--font-sans-body);font-size:var(--text-caption);
  letter-spacing:.04em;color:var(--text-subtle)}
.single-product .ct-breadcrumbs a{color:var(--text-muted);text-decoration:none}
.single-product .ct-breadcrumbs a:hover{color:var(--brand-primary)}

.single-product .quantity input,.single-product .quantity .ct-increase,
.single-product .quantity .ct-decrease{border-radius:var(--radius-xs)!important;
  border-color:var(--border-strong)!important;font-family:var(--font-sans-body)!important;
  color:var(--text-heading)!important;box-shadow:none!important}
.single-product .quantity{border-radius:var(--radius-xs)!important}

.single-product .product_meta{font-family:var(--font-sans-body);font-size:var(--text-caption);
  letter-spacing:.04em;color:var(--text-subtle);border-top:1px solid var(--border-default);
  padding-top:var(--space-5);margin-top:var(--space-6)}
.single-product .product_meta a{color:var(--text-muted);text-decoration:none}
.single-product .product_meta a:hover{color:var(--brand-primary)}

.single-product .woocommerce-product-gallery__wrapper img{border-radius:var(--radius-xs)}
.single-product .flex-control-thumbs img{border-radius:var(--radius-xs);border:1px solid transparent}
.single-product .flex-control-thumbs .flex-active{border-color:var(--border-strong)}

/* Flikarna: text med understruken aktiv flik, ingen låda. */
.single-product .woocommerce-tabs ul.tabs{border-bottom:1px solid var(--border-default)!important;
  padding:0!important;margin:0 0 var(--space-10)!important;display:flex;gap:var(--space-8);
  justify-content:flex-start}
.single-product .woocommerce-tabs ul.tabs::before,
.single-product .woocommerce-tabs ul.tabs::after{display:none!important}
.single-product .woocommerce-tabs ul.tabs li{background:none!important;border:0!important;
  border-radius:0!important;margin:0!important;padding:0!important;box-shadow:none!important}
.single-product .woocommerce-tabs ul.tabs li::before,
.single-product .woocommerce-tabs ul.tabs li::after{display:none!important}
.single-product .woocommerce-tabs ul.tabs li a{font-family:var(--font-sans-body)!important;
  font-size:var(--text-eyebrow)!important;font-weight:var(--weight-semibold)!important;
  letter-spacing:var(--tracking-eyebrow)!important;text-transform:uppercase!important;
  color:var(--text-subtle)!important;padding:0 0 var(--space-4)!important;display:block;
  border-bottom:1px solid transparent}
.single-product .woocommerce-tabs ul.tabs li a:hover{color:var(--text-body)!important}
.single-product .woocommerce-tabs ul.tabs li.active a{color:var(--text-heading)!important;
  border-bottom-color:var(--en-sage-400)}
.single-product .woocommerce-Tabs-panel > h2{position:absolute;width:1px;height:1px;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Egenskapstabellen: hårfina linjer, ingen zebra. */
.single-product .shop_attributes{border:0!important;font-family:var(--font-sans-body);
  font-size:var(--text-small);width:100%;max-width:var(--container-narrow)}
.single-product .shop_attributes tr,.single-product .shop_attributes tbody tr{background:none!important}
.single-product .shop_attributes th,.single-product .shop_attributes td{border:0!important;
  border-bottom:1px solid var(--border-default)!important;padding:var(--space-3) 0!important;
  background:none!important;text-align:left}
.single-product .shop_attributes th{font-weight:var(--weight-medium);color:var(--text-muted);
  width:40%}
.single-product .shop_attributes td{color:var(--text-heading)}
.single-product .shop_attributes p{margin:0}

.single-product #reviews h2,.single-product #reviews h3{font-family:var(--font-serif-display);
  font-weight:var(--weight-display);font-size:var(--text-title);color:var(--text-heading);
  letter-spacing:var(--tracking-display)}
.single-product .woocommerce-noreviews,.single-product #review_form .comment-notes{
  font-family:var(--font-sans-body);font-size:var(--text-small);color:var(--text-muted)}

/* Korsförsäljningen får katalogkortet och samma rubrikstil som resten. */
.single-product .up-sells,.single-product .related{margin-top:var(--section-gap)}
.single-product .up-sells > h2,.single-product .related > h2{font-family:var(--font-serif-display)!important;
  font-weight:var(--weight-display)!important;font-size:var(--text-display-sm)!important;
  color:var(--text-heading)!important;letter-spacing:var(--tracking-display)!important;
  text-transform:none!important;margin:0 0 var(--space-8)!important}
.single-product .up-sells ul.products,.single-product .related ul.products{display:grid;
  grid-template-columns:repeat(3,1fr);gap:28px 24px;margin:0;padding:0;list-style:none}
.single-product .up-sells ul.products::before,.single-product .up-sells ul.products::after,
.single-product .related ul.products::before,.single-product .related ul.products::after{display:none}
.single-product .up-sells ul.products li.product,
.single-product .related ul.products li.product{width:auto;margin:0;padding:0;float:none;
  clear:none;display:flex}
.single-product .up-sells ul.products li.product::before,
.single-product .up-sells ul.products li.product::after,
.single-product .related ul.products li.product::before,
.single-product .related ul.products li.product::after{display:none}

@media (max-width:900px){
  .en-desc .en-d-row{grid-template-columns:1fr;gap:var(--space-4)}
  .en-desc h2{font-size:26px}
  .single-product .up-sells ul.products,.single-product .related ul.products{
    grid-template-columns:1fr 1fr;gap:24px 16px}
  .single-product .woocommerce-tabs ul.tabs{gap:var(--space-5);overflow-x:auto}
}
@media (max-width:560px){
  .en-desc .en-d-note{padding:var(--space-5);font-size:var(--text-lead)}
  .single-product .up-sells ul.products,.single-product .related ul.products{
    grid-template-columns:1fr}
}

/* Brickorna under korttexten: små etiketter, inte kort. */
.en-desc .en-d-chip{display:inline-block;background:var(--surface-muted);
  border:1px solid var(--border-default);border-radius:var(--radius-xs);
  padding:5px 10px;margin:0 6px 6px 0;font-family:var(--font-sans-body);
  font-size:var(--text-caption);letter-spacing:.03em;color:var(--text-muted);
  line-height:1.3}

/* Kortbeskrivningen i summan står i en smal spalt, så rutnätet blir en spalt
   och rubriken får inte vara lika stor som sidans egen. */
.en-desc-short{max-width:none}
.en-desc-short h3{font-size:var(--text-title);margin:0 0 var(--space-2)}
.en-desc-short .en-d-row{grid-template-columns:1fr}
.en-desc-short > div > p:first-of-type + p{margin-top:0}

/* Blocksy drar flikinnehållet till full sidbredd. Brödtext i 1290 px är
   ingen läsbar radlängd - beskrivningen hör hemma i den smala spalten. */
.single-product .woocommerce-Tabs-panel .en-desc{max-width:var(--container-narrow)!important}

/* Den avslutande plattan ärvde den dämpade textfärgen från inledningsregeln,
   och grått på kolsvart går inte att läsa. */
.en-desc .en-d-center:not(.en-d-note) > p{font-size:var(--text-lead);color:var(--text-muted)}
.en-desc .en-d-note,.en-desc .en-d-note p,.en-desc .en-d-note h2,
.en-desc .en-d-note h3,.en-desc .en-d-note h4,.en-desc .en-d-note li{color:var(--text-inverse)}
.en-desc .en-d-note.en-d-center{border-bottom:0;padding-bottom:var(--space-6);
  margin-bottom:var(--space-10)}
.en-desc .en-d-note ul li::before{background:var(--en-sage-300)}

/* ─── Mobilen ────────────────────────────────────────────────────────────── */
/* Butiken var byggd nerifrån skrivbordet: filterskenan la sig som ett 615 px
   högt block ovanför rutnätet, och besvären stod två gånger - en gång som chips
   under rubriken, en gång som lista i skenan. På en telefon betydde det att man
   skrollade förbi hela filtret innan första produkten syntes.
   Här görs skenan till två rader brickor, och besvären står bara kvar överst. */

@media (max-width:720px){
  /* Chipsen blev en ojämn trappa när de radbröts efter textlängd. */
  .en-chips{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:20px}
  .en-chip{padding:10px 12px;font-size:12px;gap:8px;min-height:44px;line-height:1.25}
  .en-chip img{width:20px;height:20px;flex:0 0 20px}

  .en-shop{gap:16px;padding-block:var(--space-6) var(--space-16)}

  /* Skenan: rubrik på egen rad, filtren som brickor bredvid varandra. */
  .en-rail{display:block}
  .en-rail section{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}
  .en-rail h3{flex:0 0 100%;margin:0 0 2px}
  .en-rail .en-f{display:inline-flex;align-items:center;gap:6px;padding:9px 12px;
    min-height:40px;font-size:13px;border:1px solid var(--border-default);
    border-radius:var(--radius-xs);background:var(--surface-card)}
  .en-rail .en-f.is-on{border-color:var(--brand-primary);background:var(--surface-sage);
    color:var(--en-sage-800)}
  .en-rail .en-box{display:none}          /* bricka som är på syns på färgen */
  .en-rail .en-cnt{margin-left:2px;font-size:12px}
  .en-reset{display:inline-block;padding:8px 0;min-height:40px}

  /* Besvären står redan som chips under rubriken. Klassen måste väga lika
     tungt som .en-rail section ovan, annars vinner den och sektionen står kvar. */
  .en-rail .en-rail-besvar{display:none}
  .en-shop-plain .en-rail .en-rail-besvar{display:flex}

  /* Två produkter i bredd. En i taget gjorde butiken 10 000 px lång. */
  .en-shop-main ul.products,.en-grid{grid-template-columns:1fr 1fr;gap:22px 12px}
  .en-pc{gap:7px}
  .en-pc-name{font-size:15px;line-height:1.28}
  .en-pc-fmt{font-size:9px;letter-spacing:.1em}
  .en-pc-price{font-size:13px}
  .en-badge{top:7px;left:7px;padding:3px 6px;font-size:9px}

  /* Sorteringen satt som en ensam liten ikon längst ut till höger. */
  .en-shop-main .woocommerce-ordering{width:100%;margin-bottom:var(--space-4)}
  .en-shop-main .woocommerce-ordering select{width:100%;font-size:16px;
    padding:12px 44px 12px 12px;border:1px solid var(--border-default);
    border-radius:var(--radius-xs);background:var(--surface-card);
    font-family:var(--font-sans-body);color:var(--text-body);
    line-height:1.4;height:auto;min-height:48px;text-overflow:ellipsis}
  /* Blocksy lägger sin sorteringsikon ovanpå fältet; den får en egen hörna. */
  .en-shop-main .woocommerce-ordering{position:relative}
  .en-shop-main .woocommerce-ordering::after,
  .en-shop-main .woocommerce-ordering > svg,
  .en-shop-main .woocommerce-ordering .ct-icon{position:absolute;right:14px;
    top:50%;transform:translateY(-50%);pointer-events:none}

  /* Långa produktnamn gjorde korten olika höga i tvåspalten. */
  .en-pc-name{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;
    overflow:hidden}
}

/* Under 400 px blir två spalter trånga för rubriken, men fortfarande bättre
   än en enda kolumn: titeln får kortare rader i stället. */
@media (max-width:400px){
  .en-shop-main ul.products,.en-grid{gap:20px 10px}
  .en-pc-name{font-size:14px}
  .en-chip{font-size:11px;padding:9px 10px}
}

/* Formulären följde WPForms egna mått: 1 px grå ramar, egen typsnittstack och
   14 px text, vilket får iOS att zooma in vid fokus. */
.wpforms-container .wpforms-field-label{font-family:var(--font-sans-body);
  font-size:var(--text-small);font-weight:var(--weight-semibold);
  color:var(--text-heading)}
.wpforms-container .wpforms-field-sublabel,
.wpforms-container .wpforms-field-description{font-family:var(--font-sans-body);
  font-size:var(--text-caption);color:var(--text-muted)}
.wpforms-container input[type=text],.wpforms-container input[type=email],
.wpforms-container input[type=tel],.wpforms-container input[type=url],
.wpforms-container input[type=number],.wpforms-container select,
.wpforms-container textarea{font-family:var(--font-sans-body)!important;
  font-size:16px!important;color:var(--text-heading)!important;
  background:var(--surface-card)!important;border:1px solid var(--border-strong)!important;
  border-radius:var(--radius-xs)!important;padding:11px 12px!important;
  box-shadow:none!important;max-width:100%}
.wpforms-container input:focus,.wpforms-container select:focus,
.wpforms-container textarea:focus{border-color:var(--border-focus)!important;
  outline:2px solid var(--en-sage-200);outline-offset:1px}
.wpforms-container button[type=submit]{font-family:var(--font-sans-body)!important;
  font-size:12px!important;font-weight:var(--weight-semibold)!important;
  letter-spacing:var(--tracking-button)!important;text-transform:uppercase!important;
  background:var(--brand-primary)!important;color:#fff!important;
  border:0!important;border-radius:var(--radius-xs)!important;
  padding:14px 22px!important;min-height:46px;box-shadow:none!important}
.wpforms-container button[type=submit]:hover{background:var(--brand-primary-hover)!important}
.wpforms-container .wpforms-required-label{color:var(--status-error)}

/* Träffytor: sifferbrickan i varukorgen och språkvalet satt på 14-17 px höjd. */
@media (max-width:720px){
  .en-cart{display:inline-flex;align-items:center;min-height:44px}
  .en-lang{min-height:36px;display:inline-flex;align-items:center;padding-inline:10px}
  .en-ftr-col a,.en-ftr-note a{display:inline-block;padding-block:4px}
}

/* ─── Lazy Loading ───────────────────────────────────────────────────────── */
/* LiteSpeed setzt vor jedes Bild einen SVG-Platzhalter. Der war kaltgrau und
   legte sich über die Leinenfläche der Bildkästen - auf dem Handy sah man
   deshalb graue Blöcke, wo Fotos hingehören. Der Platzhalter darf seinen Platz
   behalten (sonst springt das Layout), aber er bleibt unsichtbar, sodass die
   Fläche des Kastens durchscheint, bis das Foto da ist. */
.en-tile img[src^="data:image/svg"],
.en-band-img img[src^="data:image/svg"],
.en-pc-img img[src^="data:image/svg"],
.en-hero img[src^="data:image/svg"],
.en-post img[src^="data:image/svg"],
.woocommerce-product-gallery img[src^="data:image/svg"]{opacity:0}

/* Die Kästen tragen die Fläche, in Leinen statt im Browser-Weiß. */
.en-pc-img,.en-tile,.en-band-img{background:var(--surface-muted)}
.en-post-img,.en-blog-img{background:var(--surface-muted)}
.woocommerce-product-gallery__image{background:var(--surface-muted)}

/* Sanft einblenden, wenn das Foto eintrifft - kein harter Sprung von der
   leeren Fläche zum Bild. */
.en-tile img,.en-band-img img,.en-pc-img img,
.woocommerce-product-gallery img{transition:opacity 300ms var(--ease-out),
  transform var(--duration-slow) var(--ease-out)}
@media (prefers-reduced-motion:reduce){
  .en-tile img,.en-band-img img,.en-pc-img img,
  .woocommerce-product-gallery img{transition:none}
}
