.elementor-532 .elementor-element.elementor-element-52cb9b7{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-532 .elementor-element.elementor-element-8f2179f{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-532 .elementor-element.elementor-element-7f91677{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-532 .elementor-element.elementor-element-d50fb50{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-532 .elementor-element.elementor-element-44858ff{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-532 .elementor-element.elementor-element-91c8b55{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-532 .elementor-element.elementor-element-4a0452d{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-532 .elementor-element.elementor-element-5a2fa9a{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-532 .elementor-element.elementor-element-ed8797c{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-532 .elementor-element.elementor-element-b077a6f{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-532 .elementor-element.elementor-element-b78ac21{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-532 .elementor-element.elementor-element-9ce3f64{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-532 .elementor-element.elementor-element-5005e7f{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-532 .elementor-element.elementor-element-6edd269{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-532 .elementor-element.elementor-element-8950263{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-532 .elementor-element.elementor-element-71fee59{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}:root{--page-title-display:none;}/* Start custom CSS for container, class: .elementor-element-52cb9b7 *//* ==========================================================================
   StikmaWork one-pager — BASISDATEI
   Einmal pro Seite laden, VOR den einzelnen Sektions-CSS-Dateien.
   Enthält: Design-Tokens, Schriften, Reset, Layout-Helfer, Komponentenklassen.
   ========================================================================== */

/* ===== tokens/fonts.css ===== */
/* Fonts — SUBSTITUTION IN EFFECT.
   No brand font binaries were supplied. The STIKMAWORK wordmark is a rounded
   geometric sans; body/UI type across the site and tech packs is an
   industrial low-contrast grotesk. Nearest Google Fonts matches are used:
     Barlow            — core UI + body (signage-derived, slightly rounded grotesk)
     Barlow Condensed  — display, eyebrows, spec labels
     IBM Plex Mono     — technical data: article numbers, GSM, sizes, order refs
   Replace with the licensed brand faces when available: swap the @import below
   for local @font-face rules and keep the --font-* token names unchanged. */
@import url("https://fonts.googleapis.com/css2?family=Barlow:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,400&family=Barlow+Condensed:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap");

:root{
  --font-core:"Barlow","Helvetica Neue",Arial,sans-serif;
  --font-display:"Barlow Condensed","Barlow",Arial,sans-serif;
  --font-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
}

/* ===== tokens/colors.css ===== */
/* Colours — sampled from the supplied logo, service icon tiles and truck livery.
   Two brand colours only: STIKMA Navy and STIKMA Cyan. Everything else is
   neutral or a functional signal. */
:root{
  /* ---- Brand base ---- */
  --navy-900:#0E1B2A;
  --navy-800:#152740;
  --navy-700:#1C334C; /* PRIMARY. Icon tile ground, wordmark, footers */
  --navy-600:#243954;
  --navy-500:#2E4763;
  --navy-400:#435667;
  --navy-300:#6B7C8E;
  --navy-200:#9DACBB;
  --navy-100:#C9D6E1;
  --navy-050:#E8EEF4;
  --navy-025:#F4F7FA;

  --cyan-700:#0076A8;
  --cyan-600:#0091CC;
  --cyan-500:#00AEEF; /* PRIMARY ACCENT. Logo peak, icon glyphs, CTAs */
  --cyan-400:#3EC1F3;
  --cyan-300:#7FD6F7;
  --cyan-200:#B7E8FB;
  --cyan-100:#E1F5FE;

  /* ---- Neutrals ---- */
  --white:#FFFFFF;
  --grey-050:#F7F8F9;
  --grey-100:#EEF0F2;
  --grey-200:#DFE3E7;
  --grey-300:#C4CAD1;
  --grey-400:#9AA2AB;
  --grey-500:#6E767F;
  --grey-600:#4C545C;
  --grey-700:#33393F;
  --grey-900:#16191C;

  /* ---- Functional signals ---- */
  --signal-hi-vis:#F2C200;   /* hard hat / hi-vis yellow, from crew photography */
  --signal-alert:#D6382B;    /* protective red, from crew photography */
  --signal-eco:#3E9C55;      /* THINK GREEN programme */
  --signal-info:var(--cyan-500);

  /* ================= SEMANTIC ALIASES ================= */
  /* Text */
  --text-strong:var(--navy-700);
  --text-body:var(--grey-600);
  --text-muted:var(--grey-500);
  --text-faint:var(--grey-400);
  --text-accent:var(--cyan-600);
  --text-on-dark:var(--white);
  --text-on-dark-muted:var(--navy-100);
  --text-on-accent:var(--white);
  --text-link:var(--cyan-600);
  --text-link-hover:var(--navy-700);

  /* Surfaces */
  --surface-page:var(--white);
  --surface-sunken:var(--grey-050);
  --surface-card:var(--white);
  --surface-card-alt:var(--navy-025);
  --surface-inverse:var(--navy-700);
  --surface-inverse-deep:var(--navy-900);
  --surface-accent:var(--cyan-500);
  --surface-accent-soft:var(--cyan-100);
  --surface-tile:var(--navy-700); /* the rounded-square service icon tile */

  /* Lines */
  --border-subtle:var(--grey-200);
  --border-default:var(--grey-300);
  --border-strong:var(--navy-700);
  --border-accent:var(--cyan-500);
  --border-on-dark:rgba(255,255,255,.16);

  /* Interactive */
  --action-primary:var(--cyan-500);
  --action-primary-hover:var(--cyan-600);
  --action-primary-active:var(--cyan-700);
  --action-secondary:var(--navy-700);
  --action-secondary-hover:var(--navy-800);
  --action-secondary-active:var(--navy-900);
  --action-disabled:var(--grey-200);
  --action-disabled-text:var(--grey-400);
  --focus-ring:var(--cyan-500);
}

/* ===== tokens/typography.css ===== */
/* Type scale. Display is Barlow Condensed set UPPERCASE with negative tracking;
   body is Barlow. Headline case is Sentence case; eyebrows and buttons are UPPERCASE. */
:root{
  /* Sizes — 1.250 major-third above 20px, tighter steps below */
  --text-3xs:11px;
  --text-2xs:12px;
  --text-xs:13px;
  --text-sm:15px;
  --text-base:17px;
  --text-md:19px;
  --text-lg:22px;
  --text-xl:27px;
  --text-2xl:34px;
  --text-3xl:44px;
  --text-4xl:56px;
  --text-5xl:72px;
  --text-6xl:96px;

  /* Weights */
  --weight-light:300; /* @kind font */
  --weight-regular:400; /* @kind font */
  --weight-medium:500; /* @kind font */
  --weight-semibold:600; /* @kind font */
  --weight-bold:700; /* @kind font */
  --weight-extrabold:800; /* @kind font */

  /* Line heights */
  --leading-flat:1; /* @kind font */
  --leading-tight:1.08; /* @kind font */
  --leading-snug:1.24; /* @kind font */
  --leading-normal:1.5; /* @kind font */
  --leading-relaxed:1.62; /* @kind font */

  /* Tracking */
  --tracking-display:-0.02em; /* @kind font */
  --tracking-tight:-0.01em; /* @kind font */
  --tracking-normal:0; /* @kind font */
  --tracking-wide:0.04em; /* @kind font */
  --tracking-label:0.11em;  /* eyebrows, button labels */
  --tracking-mono:0.02em; /* @kind font */

  /* ---- Semantic roles ---- */
  --type-hero-family:var(--font-display); /* @kind font */
  --type-hero-size:var(--text-5xl); /* @kind font */
  --type-hero-weight:var(--weight-bold); /* @kind font */
  --type-hero-leading:var(--leading-tight); /* @kind font */
  --type-hero-tracking:var(--tracking-display); /* @kind font */

  --type-h1-size:var(--text-4xl); /* @kind font */
  --type-h2-size:var(--text-3xl); /* @kind font */
  --type-h3-size:var(--text-xl); /* @kind font */
  --type-h4-size:var(--text-lg); /* @kind font */

  --type-eyebrow-family:var(--font-core); /* @kind font */
  --type-eyebrow-size:var(--text-2xs); /* @kind font */
  --type-eyebrow-weight:var(--weight-semibold); /* @kind font */
  --type-eyebrow-tracking:var(--tracking-label); /* @kind font */

  --type-body-family:var(--font-core); /* @kind font */
  --type-body-size:var(--text-base); /* @kind font */
  --type-body-leading:var(--leading-relaxed); /* @kind font */

  --type-lead-size:var(--text-md); /* @kind font */
  --type-caption-size:var(--text-xs); /* @kind font */

  --type-spec-family:var(--font-mono); /* @kind font */
  --type-spec-size:var(--text-2xs); /* @kind font */
  --type-spec-tracking:var(--tracking-mono); /* @kind font */
}

/* ===== tokens/spacing.css ===== */
/* Spacing — 4px base grid. Section rhythm is generous: the brand lets
   full-bleed photography breathe against large white gutters. */
:root{
  --space-0:0;
  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --space-5:20px;
  --space-6:24px;
  --space-7:32px;
  --space-8:40px;
  --space-9:48px;
  --space-10:64px;
  --space-11:80px;
  --space-12:104px;
  --space-13:136px;

  /* Semantic */
  --gap-inline:var(--space-3);      /* icon ↔ label */
  --gap-stack:var(--space-4);       /* paragraph rhythm */
  --gap-card:var(--space-6);        /* card interior padding */
  --gap-card-lg:var(--space-8);
  --gap-grid:var(--space-6);        /* card grid gutter */
  --gap-section:var(--space-12);    /* vertical section rhythm, desktop */
  --gap-section-sm:var(--space-10);

  --page-gutter:var(--space-8);
  --page-gutter-wide:var(--space-10);
  --page-max:1280px; /* @kind spacing */
  --prose-max:66ch; /* @kind spacing */

  --control-h-sm:34px;
  --control-h-md:44px;   /* default; also the mobile minimum hit target */
  --control-h-lg:54px;
  --control-pad-x-sm:var(--space-4);
  --control-pad-x-md:var(--space-6);
  --control-pad-x-lg:var(--space-8);
}

/* ===== tokens/radius-border.css ===== */
/* Radii — the brand runs SQUARE at large scale (image wedges, section bands,
   buttons) and ROUNDED only on the service icon tile, which uses a generous
   ~22% squircle-style corner. Nothing in between; avoid soft 8px "app" corners. */
:root{
  --radius-none:0;
  --radius-xs:2px;
  --radius-sm:3px;   /* inputs, buttons, badges — near-square, just off sharp */
  --radius-md:4px;   /* cards */
  --radius-lg:6px;   /* dialogs */
  --radius-tile:22%; /* service icon tile — percentage keeps it a squircle at any size */
  --radius-pill:999px; /* tags / counts only */

  --border-hair:1px; /* @kind spacing */
  --border-thin:1px; /* @kind spacing */
  --border-medium:2px; /* @kind spacing */
  --border-thick:3px; /* @kind spacing */
  --border-rule:4px;   /* the cyan accent rule under section headings */
  --border-bar:6px;    /* heavy cyan bar on inverse sections */
}

/* ===== tokens/elevation.css ===== */
/* Elevation — restrained. Photography and flat navy blocks carry the hierarchy,
   not shadow. Shadows are cool-tinted (navy, never neutral black) and tight. */
:root{
  --shadow-none:none;
  --shadow-hairline:0 0 0 1px var(--border-subtle);
  --shadow-sm:0 1px 2px rgba(14,27,42,.06),0 1px 1px rgba(14,27,42,.04);
  --shadow-md:0 2px 6px rgba(14,27,42,.08),0 1px 2px rgba(14,27,42,.05);
  --shadow-lg:0 8px 24px rgba(14,27,42,.10),0 2px 6px rgba(14,27,42,.06);
  --shadow-xl:0 20px 56px rgba(14,27,42,.16);
  --shadow-lifted:0 12px 28px rgba(14,27,42,.13);  /* card hover */
  --shadow-tile:0 6px 18px rgba(28,51,76,.22);     /* navy icon tile */
  --shadow-inset-line:inset 0 -1px 0 var(--border-subtle);
  --shadow-focus:0 0 0 3px rgba(0,174,239,.35);

  /* Protection gradients — used to seat text over photography */
  --scrim-bottom:linear-gradient(to top,rgba(14,27,42,.82) 0%,rgba(14,27,42,.45) 42%,rgba(14,27,42,0) 100%); /* @kind other */
  --scrim-left:linear-gradient(to right,rgba(14,27,42,.85) 0%,rgba(14,27,42,.5) 46%,rgba(14,27,42,0) 100%); /* @kind other */
  --scrim-flat:rgba(14,27,42,.55); /* @kind other */

  --glass-dark:rgba(14,27,42,.62); /* @kind other */
  --glass-blur:blur(10px); /* @kind other */
}

/* ===== tokens/motion.css ===== */
/* Motion — industrial and matter-of-fact. Short, linear-ish eases, no bounce,
   no spring, no parallax. Movement is a slide or a wipe along the brand
   diagonal; opacity fades carry everything else. */
:root{
  --duration-instant:80ms; /* @kind other */
  --duration-fast:140ms; /* @kind other */
  --duration-base:220ms; /* @kind other */
  --duration-slow:360ms; /* @kind other */
  --duration-wipe:520ms; /* @kind other */  /* diagonal reveal of a media wedge */

  --ease-standard:cubic-bezier(.2,0,.2,1); /* @kind other */
  --ease-out:cubic-bezier(.16,1,.3,1); /* @kind other */
  --ease-in:cubic-bezier(.5,0,1,1); /* @kind other */
  --ease-linear:linear; /* @kind other */

  --transition-control:background-color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard),box-shadow var(--duration-fast) var(--ease-standard); /* @kind other */
  --transition-card:transform var(--duration-base) var(--ease-standard),box-shadow var(--duration-base) var(--ease-standard); /* @kind other */
  --transition-fade:opacity var(--duration-base) var(--ease-standard); /* @kind other */

  --press-scale:0.985; /* @kind other */   /* controls compress very slightly on press */
  --hover-lift:-2px;     /* cards rise 2px, never more */
}

/* ===== tokens/geometry.css ===== */
/* THE DIAGONAL — the single most identifiable brand device.
   Measured from the supplied photography: every angled edge is exactly
   30deg off vertical (60deg off horizontal), leaning right-over-left, i.e.
   the top edge sits further right than the bottom edge. Never mirror it,
   never change the angle, never round the point. */
:root{
  --diagonal-angle:30deg; /* @kind other */
  --diagonal-run:17.32%;    /* tan(30deg) — horizontal travel per 100% height */
  --diagonal-gap:1.4%;      /* white keyline between two abutting wedges */

  /* Ready-made clip paths for a 100%-height media block */
  --clip-wedge-right:polygon(0 0,100% 0,calc(100% - 17.32%) 100%,0 100%); /* @kind other */
  --clip-wedge-left:polygon(17.32% 0,100% 0,100% 100%,0 100%); /* @kind other */
  --clip-wedge-both:polygon(17.32% 0,100% 0,calc(100% - 17.32%) 100%,0 100%); /* @kind other */
  --clip-wedge-right-inv:polygon(0 0,calc(100% - 17.32%) 0,100% 100%,0 100%); /* @kind other */

  /* Section bands whose bottom edge is cut on the diagonal */
  --clip-band-bottom:polygon(0 0,100% 0,100% calc(100% - 6vw),0 100%); /* @kind other */
}

/* ===== tokens/base.css ===== */
/* Minimal element defaults so every specimen, card and kit starts consistent. */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--type-body-family);font-size:var(--type-body-size);line-height:var(--type-body-leading);color:var(--text-body);background:var(--surface-page);-webkit-font-smoothing:antialiased;text-wrap:pretty}
h1,h2,h3,h4,h5,h6{margin:0;color:var(--text-strong);font-weight:var(--weight-bold);line-height:var(--leading-tight);letter-spacing:var(--tracking-tight)}
h1{font-family:var(--font-display);font-size:var(--type-h1-size);letter-spacing:var(--tracking-display)}
h2{font-family:var(--font-display);font-size:var(--type-h2-size);letter-spacing:var(--tracking-display)}
h3{font-size:var(--type-h3-size);font-weight:var(--weight-semibold)}
h4{font-size:var(--type-h4-size);font-weight:var(--weight-semibold)}
p{margin:0 0 var(--gap-stack)}
p:last-child{margin-bottom:0}
a{color:var(--text-link);text-decoration:none;border-bottom:1px solid rgba(0,174,239,.4);transition:var(--transition-control)}
a:hover{color:var(--text-link-hover);border-bottom-color:var(--navy-700)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
strong{color:var(--text-strong);font-weight:var(--weight-semibold)}
img,svg{display:block;max-width:100%}
code,kbd,samp{font-family:var(--font-mono);font-size:.92em}
hr{border:0;border-top:var(--border-rule) solid var(--border-accent);width:56px;margin:var(--space-6) 0}
::selection{background:var(--cyan-200);color:var(--navy-900)}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms !important;transition-duration:.01ms !important}}


/* ===== Reset / Grundlagen ===== */
.sw-page,.sw-page *{box-sizing:border-box}
.sw-page{font-family:var(--font-core);font-size:17px;line-height:1.62;color:var(--text-body)}
.sw-page img{max-width:100%;display:block}
.sw-page a{color:var(--cyan-600);text-decoration:none}
.sw-page a:hover{color:var(--navy-700)}
.sw-page h1,.sw-page h2,.sw-page h3,.sw-page p{margin:0}
.sw-page button{font-family:inherit}
.sw-page [hidden]{display:none !important}

/* ===== Layout-Helfer (aus dem Original übernommen) ===== */
.pad{padding-left:40px;padding-right:40px}
.ph,.sw-ph{border-bottom:1px dashed var(--cyan-500);cursor:help}
.hlogo,.nav-side>*{flex:none}
.hlogo,.nav-side>span,.nav-main>a{white-space:nowrap}
@media(max-width:1180px){.hphone{display:none !important}}
@media(max-width:1120px){
  .hero{grid-template-columns:1fr !important}
  .hero-media{display:none !important}
  .hero-col{padding:80px 40px !important}
}
@media(max-width:1100px){.nav-main{display:none !important}}
@media(max-width:900px){
  .grid3,.grid2{grid-template-columns:1fr !important}
  .nav-main,.nav-side{display:none !important}
  .sec{padding-top:64px !important;padding-bottom:64px !important}
  .h1{font-size:40px !important}
  .h2{font-size:32px !important}
  .pad{padding-left:24px !important;padding-right:24px !important}
}

.site-header {
    display: none;
}

/* ===== Button ===== */
.sw-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:var(--font-core);
  font-weight:600;line-height:1;letter-spacing:.11em;text-transform:uppercase;border-radius:3px;
  border:2px solid transparent;cursor:pointer;text-decoration:none;white-space:nowrap;
  transition:background 140ms cubic-bezier(.2,0,.2,1),color 140ms cubic-bezier(.2,0,.2,1),border-color 140ms cubic-bezier(.2,0,.2,1),transform 80ms cubic-bezier(.2,0,.2,1)}
.sw-btn:active{transform:scale(.985)}
.sw-btn--sm{height:34px;padding:0 16px;font-size:11px}
.sw-btn--md{height:44px;padding:0 20px;font-size:12px}
.sw-btn--lg{height:54px;padding:0 28px;font-size:13px}
.sw-btn--full{width:100%}
.sw-btn--primary{background:var(--cyan-500);border-color:var(--cyan-500);color:#fff}
.sw-btn--primary:hover{background:var(--cyan-600);border-color:var(--cyan-600);color:#fff}
.sw-btn--outline{background:transparent;border-color:var(--navy-700);color:var(--navy-700)}
.sw-btn--outline:hover{background:var(--navy-700);border-color:var(--navy-700);color:#fff}
.sw-btn--onDark{background:#fff;border-color:#fff;color:var(--navy-700)}
.sw-btn--onDark:hover{background:var(--cyan-500);border-color:var(--cyan-500);color:#fff}
.sw-btn:focus-visible{outline:2px solid var(--cyan-500);outline-offset:2px}

/* ===== Eyebrow ===== */
.sw-eyebrow{display:flex;align-items:center;gap:12px;font-family:var(--font-core);font-size:12px;
  font-weight:600;line-height:1;letter-spacing:.11em;text-transform:uppercase;color:var(--cyan-600)}
.sw-eyebrow--on-dark{color:var(--cyan-400)}
.sw-eyebrow__rule{width:24px;height:4px;background:currentColor;flex:0 0 auto}

/* ===== StatBlock ===== */
.sw-stat{display:flex;flex-direction:column;gap:8px}
.sw-stat__fig{display:flex;align-items:baseline;gap:4px;font-family:var(--font-display);font-size:56px;
  font-weight:700;line-height:1.02;letter-spacing:-.02em;color:var(--text-strong)}
.sw-stat__suffix{color:var(--cyan-500)}
.sw-stat__label{font-size:11px;font-weight:600;letter-spacing:.11em;text-transform:uppercase;color:var(--text-muted)}

/* ===== DiagonalMedia — 30° Markendiagonale, nie ändern ===== */
.sw-diag{position:relative;overflow:hidden;background:var(--navy-800)}
.sw-diag__img{width:100%;height:100%;object-fit:cover;object-position:center}
.sw-diag--right{-webkit-clip-path:polygon(0 0,100% 0,calc(100% - 17.32%) 100%,0 100%);clip-path:polygon(0 0,100% 0,calc(100% - 17.32%) 100%,0 100%)}
.sw-diag--left{-webkit-clip-path:polygon(17.32% 0,100% 0,100% 100%,0 100%);clip-path:polygon(17.32% 0,100% 0,100% 100%,0 100%)}
.sw-diag--both{-webkit-clip-path:polygon(17.32% 0,100% 0,calc(100% - 17.32%) 100%,0 100%);clip-path:polygon(17.32% 0,100% 0,calc(100% - 17.32%) 100%,0 100%)}
.sw-diag--pairLeft,.sw-diag--pairRight{position:absolute;inset:0}
.sw-diag--pairLeft{-webkit-clip-path:polygon(0 0,58.31% 0,40.99% 100%,0 100%);clip-path:polygon(0 0,58.31% 0,40.99% 100%,0 100%)}
.sw-diag--pairRight{-webkit-clip-path:polygon(59.01% 0,100% 0,100% 100%,41.69% 100%);clip-path:polygon(59.01% 0,100% 0,100% 100%,41.69% 100%)}
.sw-diag__scrim{position:absolute;inset:0}
.sw-diag__scrim--flat{background:var(--scrim-flat)}
.sw-diag__scrim--bottom{background:var(--scrim-bottom)}
.sw-diag__overlay{position:absolute;inset:0}

/* ===== Formular ===== */
.sw-field{display:flex;flex-direction:column;gap:8px}
.sw-field__label{font-size:11px;font-weight:600;letter-spacing:.11em;text-transform:uppercase;color:var(--text-strong)}
.sw-req{color:var(--cyan-500)}
.sw-input,.sw-select,.sw-textarea{width:100%;font-family:var(--font-core);font-size:15px;color:var(--text-strong);
  background:#fff;border:1px solid var(--border-default);border-radius:3px;outline:none;
  transition:border-color 140ms cubic-bezier(.2,0,.2,1),box-shadow 140ms cubic-bezier(.2,0,.2,1)}
.sw-input,.sw-select{height:44px;padding:0 14px}
.sw-select{padding-right:40px;appearance:none;-webkit-appearance:none;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2212%22%20height%3D%228%22%20viewBox%3D%220%200%2012%208%22%3E%3Cpath%20d%3D%22M1%201.5%206%206.5%2011%201.5%22%20fill%3D%22none%22%20stroke%3D%22%236E767F%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22square%22%2F%3E%3C%2Fsvg%3E");
  background-repeat:no-repeat;background-position:right 14px center}
.sw-textarea{padding:12px 14px;line-height:1.62;resize:vertical}
.sw-input:focus,.sw-select:focus,.sw-textarea:focus{border-color:var(--cyan-500);box-shadow:var(--shadow-focus)}
.sw-input.is-invalid,.sw-select.is-invalid,.sw-textarea.is-invalid{border-color:var(--signal-alert)}
.sw-field__error{font-size:12px;color:var(--signal-alert)}

/* ===== Icons (Lucide, per Maske in currentColor) ===== */
.sw-icon{display:inline-block;flex:0 0 auto;background:currentColor;
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;
  -webkit-mask-size:contain;mask-size:contain}
.sw-icon--arrow-right{-webkit-mask-image:url("https://cdn.jsdelivr.net/npm/lucide-static@0.469.0/icons/arrow-right.svg");mask-image:url("https://cdn.jsdelivr.net/npm/lucide-static@0.469.0/icons/arrow-right.svg")}
.sw-icon--check{-webkit-mask-image:url("https://cdn.jsdelivr.net/npm/lucide-static@0.469.0/icons/check.svg");mask-image:url("https://cdn.jsdelivr.net/npm/lucide-static@0.469.0/icons/check.svg")}
.sw-icon--plus{-webkit-mask-image:url("https://cdn.jsdelivr.net/npm/lucide-static@0.469.0/icons/plus.svg");mask-image:url("https://cdn.jsdelivr.net/npm/lucide-static@0.469.0/icons/plus.svg")}
.sw-icon--minus{-webkit-mask-image:url("https://cdn.jsdelivr.net/npm/lucide-static@0.469.0/icons/minus.svg");mask-image:url("https://cdn.jsdelivr.net/npm/lucide-static@0.469.0/icons/minus.svg")}
.sw-icon--play{-webkit-mask-image:url("https://cdn.jsdelivr.net/npm/lucide-static@0.469.0/icons/play.svg");mask-image:url("https://cdn.jsdelivr.net/npm/lucide-static@0.469.0/icons/play.svg")}

/* ===== FAQ-Akkordeon ===== */
.sw-faq__toggle{-webkit-appearance:none;appearance:none}
.sw-faq__toggle .sw-icon--plus{-webkit-mask-image:url("https://cdn.jsdelivr.net/npm/lucide-static@0.469.0/icons/plus.svg");mask-image:url("https://cdn.jsdelivr.net/npm/lucide-static@0.469.0/icons/plus.svg")}
.sw-faq__toggle[aria-expanded="true"] .sw-icon--plus{-webkit-mask-image:url("https://cdn.jsdelivr.net/npm/lucide-static@0.469.0/icons/minus.svg");mask-image:url("https://cdn.jsdelivr.net/npm/lucide-static@0.469.0/icons/minus.svg")}

/* StikmaWork one-pager · Sektion: header
   Voraussetzung: 00-stikmawork-base.css (Tokens, Schriften, Komponentenklassen)
   Burger-Menü ist CSS-only (Checkbox), kein JS nötig. */

/* ---------- Box-Modell (Hauptursache für Überlauf) ---------- */

.sw-hdr,
.sw-hdr *,
.sw-hdr *::before,
.sw-hdr *::after{ box-sizing:border-box; }

/* ---------- Shell ---------- */

.sw-hdr{
  position:sticky;
  top:0;
  z-index:60;
  width:100%;
  background:#fff;
  border-bottom:1px solid var(--border-subtle);
}

.sw-hdr__inner{
  position:relative;
  width:100%;
  max-width:1280px;
  margin:0 auto;
  padding:0 clamp(16px, 4vw, 40px);
  min-height:80px;
  display:flex;
  align-items:center;
  gap:clamp(12px, 2vw, 28px);
}

/* ---------- Logo ---------- */

.sw-hdr__logo{
  display:flex;
  align-items:center;
  flex:0 0 auto;
  min-width:0;
  margin-right:auto;
}

.sw-hdr__logo img{
  display:block;
  height:clamp(18px, 2.4vw, 24px);   /* Höhe steuert, Breite folgt */
  width:auto;
  max-width:100%;
  object-fit:contain;
}

/* ---------- Navigation (Desktop) ---------- */

.sw-hdr__nav{
  display:flex;
  align-items:center;
  flex:0 1 auto;
  min-width:0;
  gap:clamp(12px, 1.5vw, 26px);
}

.sw-hdr__link{
  font-size:12px;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--text-muted);
  text-decoration:none;
  white-space:nowrap;
  transition:color .18s ease;
}

.sw-hdr__link:hover,
.sw-hdr__link:focus-visible{ color:var(--navy-700); }

/* ---------- Rechte Seite ---------- */

.sw-hdr__actions{
  display:flex;
  align-items:center;
  flex:0 0 auto;
  min-width:0;
  gap:clamp(12px, 1.5vw, 20px);
  margin-left:clamp(12px, 2vw, 28px);
}

.sw-hdr__phone{
  font-family:var(--font-mono);
  font-size:13px;
  color:var(--text-strong);
  white-space:nowrap;
}

/* ---------- Burger (nur mobil sichtbar) ---------- */

.sw-hdr__toggle{                     /* visuell versteckt, bleibt fokussierbar */
  position:absolute;
  width:1px;height:1px;
  opacity:0;
  pointer-events:none;
}

.sw-hdr__burger{
  display:none;
  width:42px;height:42px;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  border:1px solid var(--border-subtle);
  border-radius:8px;
  background:#fff;
  cursor:pointer;
}

.sw-hdr__burger i{
  position:relative;
  display:block;
  width:18px;height:2px;
  border-radius:2px;
  background:var(--text-strong);
  transition:background .18s ease;
}

.sw-hdr__burger i::before,
.sw-hdr__burger i::after{
  content:"";
  position:absolute;
  left:0;
  width:18px;height:2px;
  border-radius:2px;
  background:var(--text-strong);
  transition:top .18s ease, transform .18s ease;
}

.sw-hdr__burger i::before{ top:-6px; }
.sw-hdr__burger i::after { top: 6px; }

.sw-hdr__toggle:checked ~ .sw-hdr__burger i{ background:transparent; }
.sw-hdr__toggle:checked ~ .sw-hdr__burger i::before{ top:0; transform:rotate(45deg); }
.sw-hdr__toggle:checked ~ .sw-hdr__burger i::after { top:0; transform:rotate(-45deg); }

.sw-hdr__toggle:focus-visible ~ .sw-hdr__burger{
  outline:2px solid var(--navy-700);
  outline-offset:2px;
}

/* ---------- Stufe 1: Telefonnummer weicht zuerst ---------- */

@media (max-width:1320px){
  .sw-hdr__phone{ display:none; }
  .button-hide { display:none; }
}

/* ---------- Stufe 2: Menü einklappen ---------- */
/* Die 7 Links + Logo + CTA brauchen real ~1200px. Darunter: Burger. */

@media (max-width:1200px){
  .sw-hdr__burger{ display:flex; }

  .sw-hdr__nav{
    display:none;
    position:absolute;
    left:0; right:0; top:100%;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    padding:4px clamp(16px, 4vw, 40px) 16px;
    background:#fff;
    border-bottom:1px solid var(--border-subtle);
    box-shadow:0 14px 28px rgba(16,24,40,.10);
  }

  .sw-hdr__toggle:checked ~ .sw-hdr__nav{ display:flex; }

  .sw-hdr__link{
    padding:15px 2px;
    font-size:13px;
    letter-spacing:.11em;
    border-bottom:1px solid var(--border-subtle);
  }
  .sw-hdr__link:last-child{ border-bottom:0; }

  .sw-hdr__nav-phone{ display:flex; }
}

/* ---------- Mobil ---------- */

@media (max-width:760px){
  .sw-hdr__inner{ min-height:64px; gap:12px; }
}

@media (max-width:400px){
  .sw-hdr__actions .sw-btn{
    padding-inline:12px;
    font-size:12px;
  }
}

/* Telefonnummer als letzter Menüpunkt — nur im aufgeklappten Menü */
.sw-hdr__nav-phone{
  display:none;
  align-items:center;
  gap:8px;
  padding:15px 2px 4px;
  font-family:var(--font-mono);
  font-size:14px;
  color:var(--text-strong);
  text-decoration:none;
}

/* ---------- Anker unter dem Sticky-Header ---------- */

:target{ scroll-margin-top:96px; }

@media (max-width:760px){
  :target{ scroll-margin-top:76px; }
}

/* ---------- Motion ---------- */

@media (prefers-reduced-motion:reduce){
  .sw-hdr__link,
  .sw-hdr__burger i,
  .sw-hdr__burger i::before,
  .sw-hdr__burger i::after{ transition:none; }
}



.sw-lang{
  position:relative;
  display:inline-flex;
  flex:0 0 auto;
}
 
.sw-lang__toggle{
  display:inline-flex;
  align-items:center;
  gap:6px;
  height:34px;
  padding:0 6px;
  margin:0;
  border:0;
  border-radius:var(--radius-sm);
  background:transparent;
  -webkit-appearance:none;
  appearance:none;
  cursor:pointer;
  transition:background-color var(--duration-fast) var(--ease-standard);
}
 
.sw-lang__toggle:hover,
.sw-lang__toggle:focus-visible{ background:var(--navy-025); }
.sw-lang__toggle[aria-expanded="true"]{ background:var(--navy-050); }
 
.sw-lang__caret{
  width:10px;
  height:7px;
  color:var(--text-faint);
  transition:transform var(--duration-fast) var(--ease-standard);
}
 
.sw-lang__toggle[aria-expanded="true"] .sw-lang__caret{ transform:rotate(180deg); }
 
/* ---------- Flagge ---------- */
 
.sw-lang__flag{
  display:block;
  flex:0 0 auto;
  width:24px;
  height:16px;
  overflow:hidden;
  line-height:0;
  border-radius:var(--radius-xs);
  box-shadow:0 0 0 1px rgba(14,27,42,.16);
}
 
.sw-lang__flag svg{
  display:block;
  width:100%;
  height:100%;
}
 
/* ---------- Aufklappmenue — schmale Flaggenspalte ---------- */
 
.sw-lang__menu{
  position:absolute;
  top:calc(100% + 9px);
  right:0;
  z-index:80;                       /* ueber dem Nav-Panel, innerhalb des Headers */
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:6px;
  background:#fff;                  /* deckend, damit nichts durchscheint */
  border:1px solid var(--border-subtle);
  border-radius:var(--radius-md);
  box-shadow:var(--shadow-lg);
  animation:sw-lang-in var(--duration-fast) var(--ease-standard);
}
 
.sw-lang__menu[hidden]{ display:none; }
 
@keyframes sw-lang-in{
  from{ opacity:0; transform:translateY(-4px); }
  to  { opacity:1; transform:none; }
}
 
.sw-lang__item{
  display:block;
  padding:5px;
  border:0;                          /* hebt den Basis-Linkunterstrich auf */
  border-radius:var(--radius-xs);
  line-height:0;
  text-decoration:none;
  transition:background-color var(--duration-fast) var(--ease-standard);
}
 
.sw-lang__item:hover,
.sw-lang__item:focus-visible{ background:var(--navy-025); }
 
/* ---------- Farbe bleibt bei Hover unveraendert ----------
   Theme-Regeln, die Links im Header auf Weiss setzen, werden neutralisiert. */
 
.sw-hdr .sw-lang__toggle,
.sw-hdr .sw-lang__toggle:hover,
.sw-hdr .sw-lang__toggle:focus,
.sw-hdr .sw-lang__toggle:focus-visible,
.sw-hdr .sw-lang__item,
.sw-hdr .sw-lang__item:hover,
.sw-hdr .sw-lang__item:focus,
.sw-hdr .sw-lang__item:focus-visible,
.sw-hdr .sw-lang__item:active{
  color:var(--text-strong);
  background-color:transparent;
}
 
.sw-hdr .sw-lang__toggle:hover,
.sw-hdr .sw-lang__item:hover,
.sw-hdr .sw-lang__item:focus-visible,
.sw-hdr .sw-lang__toggle:focus-visible{ background-color:var(--navy-025); }
 
.sw-hdr .sw-lang__toggle[aria-expanded="true"]{ background-color:var(--navy-050); }
 
/* ---------- Mobil: neben dem Burger ---------- */
 
@media (max-width:1200px){
  .sw-hdr__actions{ margin-left:0; }
  .sw-lang{ margin-right:2px; }
}
 
@media (max-width:420px){
  .sw-lang__toggle{ gap:5px; padding:0 4px; }
  .sw-lang__flag{ width:22px; height:15px; }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-8f2179f *//* StikmaWork one-pager · Sektion: hero
   Voraussetzung: 00-stikmawork-base.css (Tokens, .sw-btn, .sw-eyebrow, .sw-diag)

   Layout: full-bleed Grid. Text links auf der Shell-Kante des Headers,
   Bild rechts bis zum Viewport-Rand. Kein Wrapper-Div dazwischen.
   Für hyphens:auto muss <html lang="de"> gesetzt sein. */

.sw-hero,
.sw-hero *,
.sw-hero *::before,
.sw-hero *::after{ box-sizing:border-box; }

/* ============================================================
   Shell
   section.sw-hero (0,1,1) statt .sw-hero (0,1,0) — schlägt ein
   evtl. vorhandenes .hero{display:block|flex} aus dem Base,
   unabhängig von der Ladereihenfolge der Dateien.
   ============================================================ */

section.sw-hero{
  /* Nutzt die globalen Tokens, falls vorhanden — sonst diese Werte. */
  --hero-shell:var(--sw-shell, 1280px);
  --hero-pad:var(--sw-pad, clamp(16px, 4vw, 40px));

  display:grid;
  grid-template-columns:minmax(0, 1fr) minmax(0, .92fr);
  align-items:stretch;
  min-height:min(640px, 78vh);

  /* % statt 100vw: vw enthält die Scrollbar und verschiebt die Kante ~8px.
     + --hero-pad, weil der Header seine Innenkante 40px innerhalb der Shell hat. */
  padding-inline-start:max(
    var(--hero-pad),
    calc((100% - var(--hero-shell)) / 2 + var(--hero-pad))
  );
}

/* Explizite Platzierung statt Quellreihenfolge: kein .hero-col oder
   .hero-media aus dem Base kann die Spalten noch verschieben. */
.sw-hero > .sw-hero__copy { grid-column:1; grid-row:1; }
.sw-hero > .sw-hero__media{ grid-column:2; grid-row:1; }

/* ============================================================
   Textspalte
   ============================================================ */

.sw-hero > .sw-hero__copy{
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:clamp(20px, 2.4vw, 28px);
  min-width:0;
  padding:clamp(48px, 7vw, 96px) clamp(24px, 4vw, 64px) clamp(48px, 7vw, 96px) 0;
}

.sw-hero__copy .sw-eyebrow{ flex-wrap:wrap; min-width:0; }
.sw-hero__copy .sw-eyebrow > span{ min-width:0; overflow-wrap:break-word; }

.sw-hero__title{
  margin:0;
  font-family:var(--font-display);
  font-size:clamp(32px, 4.6vw, 64px);
  font-weight:700;
  line-height:1.06;
  letter-spacing:-.02em;
  color:var(--text-strong);
  text-wrap:balance;
  overflow-wrap:break-word;
  hyphens:auto;              /* trennt „Arbeits-kleidung" statt überzulaufen */
}

.sw-hero__lead{
  margin:0;
  max-width:34em;
  font-size:clamp(16px, 1.35vw, 19px);
  line-height:1.55;
  overflow-wrap:break-word;
  hyphens:auto;
}

/* ---------- CTAs ----------
   .sw-btn hat im Base sehr wahrscheinlich white-space:nowrap.
   „Kostenlose Workwear-Analyse anfordern" wäre damit ~420px am Stück. */

.sw-hero__actions{
  display:flex;
  flex-wrap:wrap;
  gap:16px;
  min-width:0;
}

.sw-hero__actions .sw-btn{
  flex:0 1 auto;
  min-width:0;
  max-width:100%;
  white-space:normal;
  text-align:center;
  justify-content:center;
  hyphens:auto;
}

/* ---------- Trust-Zeile ---------- */

.sw-hero__trust{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px 14px;
  min-width:0;
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.02em;
  text-transform:uppercase;
  color:var(--text-muted);
}

.sw-hero__sep{ color:var(--cyan-500); user-select:none; }

/* ============================================================
   Bildspalte
   ============================================================ */

.sw-hero > .sw-hero__media{
  position:relative;
  min-width:0;
  min-height:0;
}

.sw-hero__frame{ height:100%; }

.sw-hero__img{
  display:block;
  width:100%;
  height:100% !important;
  object-fit:cover;          /* ohne das rendert das PNG in Originalgröße */
  object-position:58% 40%;
}

/* ============================================================
   Breakpoints
   ============================================================ */

@media (max-width:1100px){
  section.sw-hero{ grid-template-columns:minmax(0, 1fr) minmax(0, .78fr); }
  .sw-hero__lead{ max-width:30em; }
}

@media (max-width:900px){
  section.sw-hero{
    grid-template-columns:minmax(0, 1fr);
    min-height:0;
    padding-inline-start:0;
  }

  /* Bild oben, Text darunter. Zum Tauschen die beiden Werte drehen. */
  .sw-hero > .sw-hero__media{ grid-column:1; grid-row:1; }
  .sw-hero > .sw-hero__copy { grid-column:1; grid-row:2; }

  .sw-hero > .sw-hero__copy{
    padding:clamp(32px, 6vw, 56px) var(--hero-pad);
    max-width:720px;
  }

  .sw-hero__frame{
    height:auto;
    aspect-ratio:16 / 9;
  }
  .sw-hero__img{ object-position:58% 35%; }

  /* Die Diagonale ergibt nur im Zweispalter Sinn */
  .sw-hero .sw-diag--left{ clip-path:none; -webkit-clip-path:none; }
}

@media (max-width:560px){
  .sw-hero__title{ line-height:1.12; }

  .sw-hero__actions{ flex-direction:column; align-items:stretch; gap:12px; }
  .sw-hero__actions .sw-btn{ width:100%; }

  .sw-hero__trust{ flex-direction:column; align-items:flex-start; gap:6px; }
  .sw-hero__sep{ display:none; }

  .sw-hero__frame{ aspect-ratio:4 / 3; }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-8871f42 *//* StikmaWork one-pager · Sektion: trust
   Voraussetzung: 00-stikmawork-base.css (Tokens, .sw-stat)

   Container: gleiche Shell wie der Header (max-width + --sw-pad),
   damit „35" exakt unter der Logokante steht — auf jeder Breite. */

/* ---------- Diese Tokens gehören nach 00-base.css ---------- */
/*
:root{
  --sw-shell:1280px;
  --sw-pad:clamp(16px, 4vw, 40px);
}
*/

.sw-trust,
.sw-trust *,
.sw-trust *::before,
.sw-trust *::after{ box-sizing:border-box; }

/* ---------- Shell ---------- */

.sw-trust{
  background:var(--navy-025);
  border-top:1px solid var(--border-subtle);
  border-bottom:1px solid var(--border-subtle);
}

.sw-trust__inner{
  width:100%;
  max-width:var(--sw-shell, 1280px);
  margin:0 auto;
  padding:clamp(40px, 6vw, 56px) var(--sw-pad, 40px);
}

/* ---------- Kennzahlen ---------- */

.sw-trust__stats{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));   /* minmax(0,…), sonst Überlauf */
  gap:clamp(20px, 2.6vw, 32px);
  align-items:start;
}

.sw-trust__stats > *{ min-width:0; }

/* Optional: falls .sw-stat__fig im Base eine feste px-Größe hat.
   Max-Wert an eure Basisgröße anpassen. */
.sw-trust__stats .sw-stat__fig{
  font-size:clamp(30px, 3.6vw, 48px);
  line-height:1;
}

.sw-trust__stats .sw-stat__label{
  overflow-wrap:break-word;
  hyphens:auto;                                       /* „Produktions- und Lagerfläche" */
  text-wrap:balance;
}

/* ---------- Logo-/Zertifikatsreihe ---------- */
/* Feste Spaltenzahl statt auto-fit: 6 → 3 → 2 teilt immer glatt auf,
   auto-fit lässt sonst eine einzelne Kachel in der letzten Reihe stehen. */

.sw-trust__logos{
  display:grid;
  grid-template-columns:repeat(6, minmax(0, 1fr));
  gap:clamp(12px, 1.4vw, 16px);
  margin-top:clamp(32px, 4.5vw, 48px);
}

.sw-trust__logo,
.sw-trust__cert{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-height:60px;
  padding:8px 12px;
  background:#fff;
  font-family:var(--font-mono);
  font-size:11px;
  line-height:1.35;
  text-align:center;
  overflow-wrap:break-word;
}

.sw-trust__logo{                                       /* Platzhalter */
  border:1px dashed var(--grey-200);
  letter-spacing:.08em;
  color:var(--grey-400);
}

.sw-trust__cert{
  border:1px solid var(--border-subtle);
  letter-spacing:.06em;
  color:var(--text-muted);
}

/* Greift automatisch, sobald echte Kundenlogos die Platzhalter ersetzen */
.sw-trust__logo img,
.sw-trust__cert img{
  display:block;
  width:auto;
  max-width:100%;
  max-height:32px;
  object-fit:contain;
  filter:grayscale(1);
  opacity:.7;
  transition:opacity .18s ease, filter .18s ease;
}

.sw-trust__logo:hover img{
  filter:grayscale(0);
  opacity:1;
}

/* ---------- Breakpoints ---------- */

@media (max-width:900px){
  .sw-trust__stats{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .sw-trust__logos{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
}

@media (max-width:560px){
  .sw-trust__logos{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .sw-trust__logo,
  .sw-trust__cert{ min-height:54px; }
}

@media (max-width:380px){
  .sw-trust__stats{ grid-template-columns:minmax(0, 1fr); }
}

@media (prefers-reduced-motion:reduce){
  .sw-trust__logo img,
  .sw-trust__cert img{ transition:none; }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-7f91677 *//* ============================================================
   Markenleiste
   ============================================================ */

.sw-produktion__logos{
  --sw-logo-gap:clamp(12px, 1.6vw, 20px);
  --sw-logo-visible:5;                 /* muss zu VISIBLE im JS passen */

  display:grid;
  grid-auto-flow:column;               /* alle Logos in einer Zeile */
  grid-auto-columns:calc((100% - (var(--sw-logo-visible) - 1) * var(--sw-logo-gap)) / var(--sw-logo-visible));
  gap:var(--sw-logo-gap);
  margin-top:clamp(24px, 3vw, 32px);
  overflow:hidden;                     /* Fallback für ältere Browser */
  overflow:clip;
}

/* Feste Höhe: nur so haben max-height:100% am Bild und die
   optische Grundlinie aller Kacheln eine definite Bezugsgröße. */
.sw-produktion__logo{
  display:flex;
  align-items:center;
  justify-content:center;
  height:clamp(76px, 8vw, 104px);
  padding:clamp(10px, 1.4vw, 18px);
  background:#fff;
  border:1px solid var(--border-subtle);
  border-radius:4px;
  overflow:hidden;
  will-change:transform;               /* flüssige Rotation per JS */
}

.sw-produktion__logo img{
  display:block;
  width:auto;
  height:auto;
  max-width:100%;
  max-height:100%;
  object-fit:contain;
  filter:grayscale(1);
  opacity:.7;
  transition:opacity .18s ease, filter .18s ease;
}

.sw-produktion__logo:hover img{
  filter:grayscale(0);
  opacity:1;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-fbe3daa *//* StikmaWork one-pager · Sektion: trust
   Voraussetzung: 00-stikmawork-base.css (Tokens, .sw-stat)

   Container: gleiche Shell wie der Header (max-width + --sw-pad),
   damit „35" exakt unter der Logokante steht — auf jeder Breite. */

/* ---------- Diese Tokens gehören nach 00-base.css ---------- */
/*
:root{
  --sw-shell:1280px;
  --sw-pad:clamp(16px, 4vw, 40px);
}
*/

.sw-trust,
.sw-trust *,
.sw-trust *::before,
.sw-trust *::after{ box-sizing:border-box; }

/* ---------- Shell ---------- */

.sw-trust{
  background:var(--navy-025);
  border-top:1px solid var(--border-subtle);
  border-bottom:1px solid var(--border-subtle);
}

.sw-trust__inner{
  width:100%;
  max-width:var(--sw-shell, 1280px);
  margin:0 auto;
  padding:clamp(40px, 6vw, 56px) var(--sw-pad, 40px);
}

/* ---------- Kennzahlen ---------- */

.sw-trust__stats{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));   /* minmax(0,…), sonst Überlauf */
  gap:clamp(20px, 2.6vw, 32px);
  align-items:start;
}

.sw-trust__stats > *{ min-width:0; }

/* Optional: falls .sw-stat__fig im Base eine feste px-Größe hat.
   Max-Wert an eure Basisgröße anpassen. */
.sw-trust__stats .sw-stat__fig{
  font-size:clamp(30px, 3.6vw, 48px);
  line-height:1;
}

.sw-trust__stats .sw-stat__label{
  overflow-wrap:break-word;
  hyphens:auto;                                       /* „Produktions- und Lagerfläche" */
  text-wrap:balance;
}

/* ---------- Logo-/Zertifikatsreihe ---------- */
/* Feste Spaltenzahl statt auto-fit: 6 → 3 → 2 teilt immer glatt auf,
   auto-fit lässt sonst eine einzelne Kachel in der letzten Reihe stehen. */

.sw-trust__logos{
  display:grid;
  grid-template-columns:repeat(6, minmax(0, 1fr));
  gap:clamp(12px, 1.4vw, 16px);
  margin-top:clamp(32px, 4.5vw, 48px);
}

.sw-trust__logo,
.sw-trust__cert{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-height:60px;
  padding:8px 12px;
  background:#fff;
  font-family:var(--font-mono);
  font-size:11px;
  line-height:1.35;
  text-align:center;
  overflow-wrap:break-word;
}

.sw-trust__logo{                                       /* Platzhalter */
  border:1px dashed var(--grey-200);
  letter-spacing:.08em;
  color:var(--grey-400);
}

.sw-trust__cert{
  border:1px solid var(--border-subtle);
  letter-spacing:.06em;
  color:var(--text-muted);
}

/* Greift automatisch, sobald echte Kundenlogos die Platzhalter ersetzen */
.sw-trust__logo img,
.sw-trust__cert img{
  display:block;
  width:auto;
  max-width:100%;
  max-height:32px;
  object-fit:contain;
  filter:grayscale(1);
  opacity:.7;
  transition:opacity .18s ease, filter .18s ease;
}

.sw-trust__logo:hover img{
  filter:grayscale(0);
  opacity:1;
}

/* ---------- Breakpoints ---------- */

@media (max-width:900px){
  .sw-trust__stats{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .sw-trust__logos{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
}

@media (max-width:560px){
  .sw-trust__logos{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .sw-trust__logo,
  .sw-trust__cert{ min-height:54px; }
}

@media (max-width:380px){
  .sw-trust__stats{ grid-template-columns:minmax(0, 1fr); }
}

@media (prefers-reduced-motion:reduce){
  .sw-trust__logo img,
  .sw-trust__cert img{ transition:none; }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-d50fb50 *//* StikmaWork one-pager · Sektion: trust
   Voraussetzung: 00-stikmawork-base.css (Tokens, .sw-stat)

   Container: gleiche Shell wie der Header (max-width + --sw-pad),
   damit „35" exakt unter der Logokante steht — auf jeder Breite. */

/* ---------- Diese Tokens gehören nach 00-base.css ---------- */
/*
:root{
  --sw-shell:1280px;
  --sw-pad:clamp(16px, 4vw, 40px);
}
*/

.sw-trust,
.sw-trust *,
.sw-trust *::before,
.sw-trust *::after{ box-sizing:border-box; }

/* ---------- Shell ---------- */

.sw-trust{
  background:var(--navy-700) !important;
  border-top:1px solid var(--border-subtle);
  border-bottom:1px solid var(--border-subtle);
}

.sw-trust__inner{
  width:100%;
  max-width:var(--sw-shell, 1280px);
  margin:0 auto;
  padding:clamp(40px, 6vw, 56px) var(--sw-pad, 40px);
}

/* ---------- Kennzahlen ---------- */

.sw-trust__stats{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));   /* minmax(0,…), sonst Überlauf */
  gap:clamp(20px, 2.6vw, 32px);
  align-items:start;
}

.sw-trust__stats > *{ min-width:0; }

/* Optional: falls .sw-stat__fig im Base eine feste px-Größe hat.
   Max-Wert an eure Basisgröße anpassen. */
.sw-trust__stats .sw-stat__fig{
  font-size:clamp(30px, 3.6vw, 48px);
  line-height:1;
  color: #fff
}

.sw-stat:last-of-type .sw-stat__fig > span:first-child {
  font-size: 24px;
}

.sw-trust__stats .sw-stat__label{
  overflow-wrap:break-word;
  hyphens:auto;                                       /* „Produktions- und Lagerfläche" */
  text-wrap:balance;
}

/* ---------- Logo-/Zertifikatsreihe ---------- */
/* Feste Spaltenzahl statt auto-fit: 6 → 3 → 2 teilt immer glatt auf,
   auto-fit lässt sonst eine einzelne Kachel in der letzten Reihe stehen. */

.sw-trust__logos{
  display:grid;
  grid-template-columns:repeat(6, minmax(0, 1fr));
  gap:clamp(12px, 1.4vw, 16px);
  margin-top:clamp(32px, 4.5vw, 48px);
}

.sw-trust__logo,
.sw-trust__cert{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-height:60px;
  padding:8px 12px;
  background:#fff;
  font-family:var(--font-mono);
  font-size:11px;
  line-height:1.35;
  text-align:center;
  overflow-wrap:break-word;
}

.sw-trust__logo{                                       /* Platzhalter */
  border:1px dashed var(--grey-200);
  letter-spacing:.08em;
  color:var(--grey-400);
}

.sw-trust__cert{
  border:1px solid var(--border-subtle);
  letter-spacing:.06em;
  color:var(--text-muted);
}

/* Greift automatisch, sobald echte Kundenlogos die Platzhalter ersetzen */
.sw-trust__logo img,
.sw-trust__cert img{
  display:block;
  width:auto;
  max-width:100%;
  max-height:32px;
  object-fit:contain;
  filter:grayscale(1);
  opacity:.7;
  transition:opacity .18s ease, filter .18s ease;
}

.sw-trust__logo:hover img{
  filter:grayscale(0);
  opacity:1;
}

/* ---------- Breakpoints ---------- */

@media (max-width:900px){
  .sw-trust__stats{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .sw-trust__logos{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
}

@media (max-width:560px){
  .sw-trust__logos{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .sw-trust__logo,
  .sw-trust__cert{ min-height:54px; }
}

@media (max-width:380px){
  .sw-trust__stats{ grid-template-columns:minmax(0, 1fr); }
}

@media (prefers-reduced-motion:reduce){
  .sw-trust__logo img,
  .sw-trust__cert img{ transition:none; }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-a8a4863 *//* StikmaWork one-pager · Sektion: trust
   Voraussetzung: 00-stikmawork-base.css (Tokens, .sw-stat)

   Container: gleiche Shell wie der Header (max-width + --sw-pad),
   damit „35" exakt unter der Logokante steht — auf jeder Breite. */

/* ---------- Diese Tokens gehören nach 00-base.css ---------- */
/*
:root{
  --sw-shell:1280px;
  --sw-pad:clamp(16px, 4vw, 40px);
}
*/

.sw-trust,
.sw-trust *,
.sw-trust *::before,
.sw-trust *::after{ box-sizing:border-box; }

/* ---------- Shell ---------- */

.sw-trust{
  background:var(--navy-025);
  border-top:1px solid var(--border-subtle);
  border-bottom:1px solid var(--border-subtle);
}

.sw-trust__inner{
  width:100%;
  max-width:var(--sw-shell, 1280px);
  margin:0 auto;
  padding:clamp(40px, 6vw, 56px) var(--sw-pad, 40px);
}

/* ---------- Kennzahlen ---------- */

.sw-trust__stats{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));   /* minmax(0,…), sonst Überlauf */
  gap:clamp(20px, 2.6vw, 32px);
  align-items:start;
}

.sw-trust__stats > *{ min-width:0; }

/* Optional: falls .sw-stat__fig im Base eine feste px-Größe hat.
   Max-Wert an eure Basisgröße anpassen. */
.sw-trust__stats .sw-stat__fig{
  font-size:clamp(30px, 3.6vw, 48px);
  line-height:1;
}

.sw-trust__stats .sw-stat__label{
  overflow-wrap:break-word;
  hyphens:auto;                                       /* „Produktions- und Lagerfläche" */
  text-wrap:balance;
}

/* ---------- Logo-/Zertifikatsreihe ---------- */
/* Feste Spaltenzahl statt auto-fit: 6 → 3 → 2 teilt immer glatt auf,
   auto-fit lässt sonst eine einzelne Kachel in der letzten Reihe stehen. */

.sw-trust__logos{
  display:grid;
  grid-template-columns:repeat(6, minmax(0, 1fr));
  gap:clamp(12px, 1.4vw, 16px);
  margin-top:clamp(32px, 4.5vw, 48px);
}

.sw-trust__logo,
.sw-trust__cert{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-height:60px;
  padding:8px 12px;
  background:#fff;
  font-family:var(--font-mono);
  font-size:11px;
  line-height:1.35;
  text-align:center;
  overflow-wrap:break-word;
}

.sw-trust__logo{                                       /* Platzhalter */
  border:1px dashed var(--grey-200);
  letter-spacing:.08em;
  color:var(--grey-400);
}

.sw-trust__cert{
  border:1px solid var(--border-subtle);
  letter-spacing:.06em;
  color:var(--text-muted);
}

/* Greift automatisch, sobald echte Kundenlogos die Platzhalter ersetzen */
.sw-trust__logo img,
.sw-trust__cert img{
  display:block;
  width:auto;
  max-width:100%;
  max-height:32px;
  object-fit:contain;
  filter:grayscale(1);
  opacity:.7;
  transition:opacity .18s ease, filter .18s ease;
}

.sw-trust__logo:hover img{
  filter:grayscale(0);
  opacity:1;
}

/* ---------- Breakpoints ---------- */

@media (max-width:900px){
  .sw-trust__stats{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .sw-trust__logos{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
}

@media (max-width:560px){
  .sw-trust__logos{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .sw-trust__logo,
  .sw-trust__cert{ min-height:54px; }
}

@media (max-width:380px){
  .sw-trust__stats{ grid-template-columns:minmax(0, 1fr); }
}

@media (prefers-reduced-motion:reduce){
  .sw-trust__logo img,
  .sw-trust__cert img{ transition:none; }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-44858ff */.sw-kosten-1{padding:104px 0}
.sw-kosten-2{max-width:1280px;margin:0 auto;padding:0 40px;display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:80px}
.sw-kosten-3{display:flex;flex-direction:column;gap:24px}
.sw-kosten-4{margin:0;font-family:var(--font-display);font-size:44px;font-weight:700;line-height:1.08;letter-spacing:-.02em;color:var(--text-strong);text-wrap:pretty}
.sw-kosten-5{width:64px;height:4px;background:var(--cyan-500)}
.sw-kosten-6{margin:0;font-size:19px;line-height:1.55}
.sw-kosten-7{margin-top:8px}
.sw-kosten-8{height:300px}
.sw-kosten-9{object-position:45% 50%}
.sw-kosten-10{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--border-subtle);border:1px solid var(--border-subtle)}
.sw-kosten-11{background:#fff;padding:24px;display:flex;gap:16px}
.sw-kosten-12{font-family:var(--font-mono);font-size:12px;color:var(--cyan-600);padding-top:4px}
.sw-kosten-13{margin:0;font-size:15px;line-height:1.55}
.sw-kosten-14{color:var(--text-strong)}
.sw-kosten-15{background:#fff;padding:24px;display:flex;gap:16px;grid-column:span 2}
.sw-kosten-16{margin:32px 0 0;font-size:17px;line-height:1.6;max-width:52em}
.sw-kosten-17{display:inline-flex;align-items:center;gap:8px;margin-top:20px;font-size:15px;font-weight:600;border-bottom:1px solid currentColor;padding-bottom:2px}
.sw-kosten-18{width:16px;height:16px}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-c37271e *//* StikmaWork one-pager · Sektion: trust
   Voraussetzung: 00-stikmawork-base.css (Tokens, .sw-stat)

   Container: gleiche Shell wie der Header (max-width + --sw-pad),
   damit „35" exakt unter der Logokante steht — auf jeder Breite. */

/* ---------- Diese Tokens gehören nach 00-base.css ---------- */
/*
:root{
  --sw-shell:1280px;
  --sw-pad:clamp(16px, 4vw, 40px);
}
*/

.sw-trust,
.sw-trust *,
.sw-trust *::before,
.sw-trust *::after{ box-sizing:border-box; }

/* ---------- Shell ---------- */

.sw-trust{
  background:var(--navy-025);
  border-top:1px solid var(--border-subtle);
  border-bottom:1px solid var(--border-subtle);
}

.sw-trust__inner{
  width:100%;
  max-width:var(--sw-shell, 1280px);
  margin:0 auto;
  padding:clamp(40px, 6vw, 56px) var(--sw-pad, 40px);
}

/* ---------- Kennzahlen ---------- */

.sw-trust__stats{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));   /* minmax(0,…), sonst Überlauf */
  gap:clamp(20px, 2.6vw, 32px);
  align-items:start;
}

.sw-trust__stats > *{ min-width:0; }

/* Optional: falls .sw-stat__fig im Base eine feste px-Größe hat.
   Max-Wert an eure Basisgröße anpassen. */
.sw-trust__stats .sw-stat__fig{
  font-size:clamp(30px, 3.6vw, 48px);
  line-height:1;
}

.sw-trust__stats .sw-stat__label{
  overflow-wrap:break-word;
  hyphens:auto;                                       /* „Produktions- und Lagerfläche" */
  text-wrap:balance;
}

/* ---------- Logo-/Zertifikatsreihe ---------- */
/* Feste Spaltenzahl statt auto-fit: 6 → 3 → 2 teilt immer glatt auf,
   auto-fit lässt sonst eine einzelne Kachel in der letzten Reihe stehen. */

.sw-trust__logos{
  display:grid;
  grid-template-columns:repeat(6, minmax(0, 1fr));
  gap:clamp(12px, 1.4vw, 16px);
  margin-top:clamp(32px, 4.5vw, 48px);
}

.sw-trust__logo,
.sw-trust__cert{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-height:60px;
  padding:8px 12px;
  background:#fff;
  font-family:var(--font-mono);
  font-size:11px;
  line-height:1.35;
  text-align:center;
  overflow-wrap:break-word;
}

.sw-trust__logo{                                       /* Platzhalter */
  border:1px dashed var(--grey-200);
  letter-spacing:.08em;
  color:var(--grey-400);
}

.sw-trust__cert{
  border:1px solid var(--border-subtle);
  letter-spacing:.06em;
  color:var(--text-muted);
}

/* Greift automatisch, sobald echte Kundenlogos die Platzhalter ersetzen */
.sw-trust__logo img,
.sw-trust__cert img{
  display:block;
  width:auto;
  max-width:100%;
  max-height:32px;
  object-fit:contain;
  filter:grayscale(1);
  opacity:.7;
  transition:opacity .18s ease, filter .18s ease;
}

.sw-trust__logo:hover img{
  filter:grayscale(0);
  opacity:1;
}

/* ---------- Breakpoints ---------- */

@media (max-width:900px){
  .sw-trust__stats{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .sw-trust__logos{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
}

@media (max-width:560px){
  .sw-trust__logos{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .sw-trust__logo,
  .sw-trust__cert{ min-height:54px; }
}

@media (max-width:380px){
  .sw-trust__stats{ grid-template-columns:minmax(0, 1fr); }
}

@media (prefers-reduced-motion:reduce){
  .sw-trust__logo img,
  .sw-trust__cert img{ transition:none; }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-91c8b55 *//* StikmaWork one-pager · Sektion: prozess
   Voraussetzung: 00-stikmawork-base.css (Tokens, .sw-eyebrow)
   Für hyphens:auto muss <html lang="de"> gesetzt sein. */

.sw-prozess,
.sw-prozess *,
.sw-prozess *::before,
.sw-prozess *::after{ box-sizing:border-box; }

/* ============================================================
   Shell
   ============================================================ */

.sw-prozess{
  --pz-shell:var(--sw-shell, 1280px);
  --pz-pad:var(--sw-pad, clamp(16px, 4vw, 40px));

  background:var(--navy-025);
  border-top:1px solid var(--border-subtle);
  border-bottom:1px solid var(--border-subtle);
  padding:clamp(56px, 8vw, 104px) 0;
}

.sw-prozess__inner{
  width:100%;
  max-width:var(--pz-shell);
  margin:0 auto;
  padding:0 var(--pz-pad);
}

/* ============================================================
   Kopfbereich
   ============================================================ */

.sw-prozess__head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:clamp(24px, 4vw, 64px);
  margin-bottom:clamp(36px, 5vw, 64px);
}

.sw-prozess__head-main{
  display:flex;
  flex-direction:column;
  gap:clamp(14px, 1.8vw, 20px);
  min-width:0;
  max-width:24em;
}

.sw-prozess__title{
  margin:0;
  font-family:var(--font-display);
  font-size:clamp(28px, 3.3vw, 44px);
  font-weight:700;
  line-height:1.08;
  letter-spacing:-.02em;
  color:var(--text-strong);
  text-wrap:balance;
  overflow-wrap:break-word;
  hyphens:auto;
}

.sw-prozess__lead{
  margin:0;
  min-width:0;
  max-width:30em;
  font-size:clamp(15px, 1.25vw, 17px);
  line-height:1.6;
  overflow-wrap:break-word;
  hyphens:auto;
}

/* ============================================================
   Phasen-Übersicht
   Die Spaltenbreiten 3:5:3:2 entsprechen der Anzahl Schritte je Phase.
   Die Proportion ist die Information — deshalb bleibt sie am Desktop.
   ============================================================ */

.sw-prozess__map{
  display:grid;
  grid-template-columns:minmax(0, 3fr) minmax(0, 5fr) minmax(0, 3fr) minmax(0, 2fr);
  gap:16px;
  margin-bottom:clamp(36px, 5vw, 56px);
}

.sw-prozess__map-item{
  display:flex;
  flex-direction:column;
  gap:10px;
  min-width:0;
}

.sw-prozess__bar{
  display:flex;
  gap:4px;
  min-width:0;
}

/* Eine Klasse statt sechs. Die Rampe kommt aus nth-child. */
.sw-prozess__seg{
  flex:1 1 0;
  min-width:0;
  height:4px;
  background:var(--cyan-500);
}

.sw-prozess__seg:nth-child(1){ opacity:.45; }
.sw-prozess__seg:nth-child(2){ opacity:.59; }
.sw-prozess__seg:nth-child(3){ opacity:.73; }
.sw-prozess__seg:nth-child(4){ opacity:.87; }
.sw-prozess__seg:nth-child(5){ opacity:1; }   /* war 1.01 — ungültig */

.sw-prozess__map-label{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--text-muted);
  white-space:nowrap;
}

/* ============================================================
   Phasen
   ============================================================ */

.sw-prozess__phases{
  display:flex;
  flex-direction:column;
  gap:clamp(32px, 4.5vw, 48px);
}

.sw-prozess__phase{
  display:grid;
  grid-template-columns:200px minmax(0, 1fr);
  gap:clamp(20px, 3vw, 40px);
  align-items:start;
}

.sw-prozess__phase-head{
  display:flex;
  flex-direction:column;
  gap:12px;
  min-width:0;
  padding-top:4px;

  /* Optional: Phasentitel bleibt neben den Karten stehen.
     80px = Headerhöhe. Einkommentieren, wenn gewünscht:
  position:sticky;
  top:calc(80px + 24px);
  */
}

.sw-prozess__phase-eyebrow{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--text-muted);
}

.sw-prozess__phase-title{
  margin:0;
  font-family:var(--font-display);
  font-size:clamp(21px, 2vw, 27px);
  font-weight:700;
  line-height:1.12;
  letter-spacing:-.01em;
  color:var(--text-strong);
  overflow-wrap:break-word;
  hyphens:auto;
}

.sw-prozess__phase-rule{
  width:40px;
  height:4px;
  flex:0 0 auto;
  background:var(--cyan-500);
}

/* ============================================================
   Schrittkarten
   ============================================================ */

/* min(230px,100%) statt 230px: sonst läuft die Spur aus dem Container,
   sobald der Container schmaler als 230px wird. */
.sw-prozess__steps{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(min(230px, 100%), 1fr));
  gap:16px;
}

.sw-prozess__step{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:8px;
  min-width:0;
  overflow:hidden;
  padding:clamp(18px, 2.2vw, 24px);
  background:#fff;
  border:1px solid var(--border-subtle);
  border-radius:4px;
  box-shadow:var(--shadow-sm);
  transition:transform var(--dur-220, 220ms) var(--ease-standard),
             box-shadow var(--dur-220, 220ms) var(--ease-standard);
}

@media (hover:hover){
  .sw-prozess__step:hover{
    transform:translateY(-2px);
    box-shadow:var(--shadow-lifted);
  }
}

.sw-prozess__step-num{
  position:absolute;
  top:8px;
  right:14px;
  font-family:var(--font-display);
  font-size:clamp(40px, 5vw, 56px);
  font-weight:700;
  line-height:1;
  color:var(--navy-050);
  pointer-events:none;
  user-select:none;
}

.sw-prozess__step-eyebrow{
  position:relative;
  padding-right:56px;              /* hält Abstand zur Geisterziffer */
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.08em;
  color:var(--cyan-600);
}

.sw-prozess__step-title{
  position:relative;
  margin:0;
  max-width:14em;
  font-size:clamp(17px, 1.4vw, 19px);
  font-weight:600;
  line-height:1.25;
  color:var(--text-strong);
  overflow-wrap:break-word;
  hyphens:auto;                    /* „Produktentwicklung", „Qualitätskontrolle" */
}

.sw-prozess__step-text{
  position:relative;
  margin:0;
  max-width:32ch;
  font-size:15px;
  line-height:1.55;
  overflow-wrap:break-word;
  hyphens:auto;
}

/* ============================================================
   Abschluss
   ============================================================ */

.sw-prozess__outro{
  display:flex;
  align-items:stretch;
  gap:clamp(16px, 2vw, 24px);
  margin-top:clamp(36px, 5vw, 56px);
  padding-top:clamp(24px, 3vw, 32px);
  border-top:1px solid var(--grey-200);
}

.sw-prozess__outro-rule{
  width:4px;
  flex:0 0 4px;
  background:var(--cyan-500);
}

.sw-prozess__outro-text{
  margin:0;
  min-width:0;
  align-self:center;
  font-family:var(--font-display);
  font-size:clamp(22px, 2.6vw, 34px);
  font-weight:700;
  line-height:1.12;
  letter-spacing:-.01em;
  color:var(--text-strong);
  text-wrap:balance;
  overflow-wrap:break-word;
  hyphens:auto;
}

/* ============================================================
   Breakpoints
   ============================================================ */

@media (max-width:1024px){
  .sw-prozess__phase{
    grid-template-columns:minmax(0, 1fr);
  }
  .sw-prozess__phase-head{
    position:static;               /* sticky ergibt einspaltig keinen Sinn */
    padding-top:0;
  }
}

@media (max-width:720px){
  /* Proportion 3:5:3:2 geht verloren, dafür bleiben die Labels lesbar */
  .sw-prozess__map{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:20px 16px;
  }
}

@media (max-width:420px){
  .sw-prozess__map{ grid-template-columns:minmax(0, 1fr); }
  .sw-prozess__map-label{ white-space:normal; }
}

@media (prefers-reduced-motion:reduce){
  .sw-prozess__step{ transition:none; }
  .sw-prozess__step:hover{ transform:none; }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-0f24a49 *//* StikmaWork one-pager · Sektion: trust
   Voraussetzung: 00-stikmawork-base.css (Tokens, .sw-stat)

   Container: gleiche Shell wie der Header (max-width + --sw-pad),
   damit „35" exakt unter der Logokante steht — auf jeder Breite. */

/* ---------- Diese Tokens gehören nach 00-base.css ---------- */
/*
:root{
  --sw-shell:1280px;
  --sw-pad:clamp(16px, 4vw, 40px);
}
*/

.sw-trust,
.sw-trust *,
.sw-trust *::before,
.sw-trust *::after{ box-sizing:border-box; }

/* ---------- Shell ---------- */

.sw-trust{
  background:var(--navy-025);
  border-top:1px solid var(--border-subtle);
  border-bottom:1px solid var(--border-subtle);
}

.sw-trust__inner{
  width:100%;
  max-width:var(--sw-shell, 1280px);
  margin:0 auto;
  padding:clamp(40px, 6vw, 56px) var(--sw-pad, 40px);
}

/* ---------- Kennzahlen ---------- */

.sw-trust__stats{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));   /* minmax(0,…), sonst Überlauf */
  gap:clamp(20px, 2.6vw, 32px);
  align-items:start;
}

.sw-trust__stats > *{ min-width:0; }

/* Optional: falls .sw-stat__fig im Base eine feste px-Größe hat.
   Max-Wert an eure Basisgröße anpassen. */
.sw-trust__stats .sw-stat__fig{
  font-size:clamp(30px, 3.6vw, 48px);
  line-height:1;
}

.sw-trust__stats .sw-stat__label{
  overflow-wrap:break-word;
  hyphens:auto;                                       /* „Produktions- und Lagerfläche" */
  text-wrap:balance;
}

/* ---------- Logo-/Zertifikatsreihe ---------- */
/* Feste Spaltenzahl statt auto-fit: 6 → 3 → 2 teilt immer glatt auf,
   auto-fit lässt sonst eine einzelne Kachel in der letzten Reihe stehen. */

.sw-trust__logos{
  display:grid;
  grid-template-columns:repeat(6, minmax(0, 1fr));
  gap:clamp(12px, 1.4vw, 16px);
  margin-top:clamp(32px, 4.5vw, 48px);
}

.sw-trust__logo,
.sw-trust__cert{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-height:60px;
  padding:8px 12px;
  background:#fff;
  font-family:var(--font-mono);
  font-size:11px;
  line-height:1.35;
  text-align:center;
  overflow-wrap:break-word;
}

.sw-trust__logo{                                       /* Platzhalter */
  border:1px dashed var(--grey-200);
  letter-spacing:.08em;
  color:var(--grey-400);
}

.sw-trust__cert{
  border:1px solid var(--border-subtle);
  letter-spacing:.06em;
  color:var(--text-muted);
}

/* Greift automatisch, sobald echte Kundenlogos die Platzhalter ersetzen */
.sw-trust__logo img,
.sw-trust__cert img{
  display:block;
  width:auto;
  max-width:100%;
  max-height:32px;
  object-fit:contain;
  filter:grayscale(1);
  opacity:.7;
  transition:opacity .18s ease, filter .18s ease;
}

.sw-trust__logo:hover img{
  filter:grayscale(0);
  opacity:1;
}

/* ---------- Breakpoints ---------- */

@media (max-width:900px){
  .sw-trust__stats{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .sw-trust__logos{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
}

@media (max-width:560px){
  .sw-trust__logos{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .sw-trust__logo,
  .sw-trust__cert{ min-height:54px; }
}

@media (max-width:380px){
  .sw-trust__stats{ grid-template-columns:minmax(0, 1fr); }
}

@media (prefers-reduced-motion:reduce){
  .sw-trust__logo img,
  .sw-trust__cert img{ transition:none; }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-4a0452d *//* StikmaWork one-pager · Sektion: modelle
   Voraussetzung: 00-stikmawork-base.css (Tokens, .sw-eyebrow, .sw-btn)

   Die helle und die dunkle Karte teilen sich EIN Regelwerk.
   Der Farbwechsel läuft komplett über --card-* Variablen im Modifier.
   Für hyphens:auto muss <html lang="de"> gesetzt sein. */

.sw-modelle,
.sw-modelle *,
.sw-modelle *::before,
.sw-modelle *::after{ box-sizing:border-box; }

/* ============================================================
   Shell
   ============================================================ */

.sw-modelle{
  --md-shell:var(--sw-shell, 1280px);
  --md-pad:var(--sw-pad, clamp(16px, 4vw, 40px));

  padding:clamp(56px, 8vw, 104px) 0;
}

.sw-modelle__inner{
  width:100%;
  max-width:var(--md-shell);
  margin:0 auto;
  padding:0 var(--md-pad);
}

/* ============================================================
   Kopfbereich
   ============================================================ */

.sw-modelle__head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:clamp(24px, 4vw, 64px);
  margin-bottom:clamp(36px, 5vw, 56px);
}

.sw-modelle__head-main{
  display:flex;
  flex-direction:column;
  gap:clamp(14px, 1.8vw, 20px);
  min-width:0;
  max-width:26em;
}

.sw-modelle__title{
  margin:0;
  font-family:var(--font-display);
  font-size:clamp(28px, 3.3vw, 44px);
  font-weight:700;
  line-height:1.08;
  letter-spacing:-.02em;
  color:var(--text-strong);
  text-wrap:balance;
  overflow-wrap:break-word;
  hyphens:auto;
}

.sw-modelle__lead{
  margin:0;
  min-width:0;
  max-width:32em;
  font-size:clamp(15px, 1.25vw, 17px);
  line-height:1.6;
  overflow-wrap:break-word;
  hyphens:auto;
}

/* ============================================================
   Kartenraster
   ============================================================ */

.sw-modelle__grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:clamp(16px, 2vw, 24px);
  align-items:start;              /* 5 vs. 12 Schritte — keine Streckung */
}

/* ============================================================
   Karte · Farbschema als Variablensatz
   ============================================================ */

.sw-modelle__card{
  --card-bg:#fff;
  --card-border:var(--border-subtle);
  --card-top:var(--grey-300);
  --card-top-width:4px;
  --card-line:var(--border-subtle);
  --card-eyebrow:var(--text-muted);
  --card-title:var(--text-strong);
  --card-claim:var(--cyan-600);
  --card-count:var(--text-muted);
  --card-step:var(--text-strong);
  --card-rail:var(--grey-200);
  --card-text:var(--text-body);
  --card-muted:var(--text-muted);
  --card-typical:var(--text-strong);
  --card-shadow:var(--shadow-sm);

  display:flex;
  flex-direction:column;
  gap:clamp(18px, 2.2vw, 24px);
  min-width:0;
  padding:clamp(24px, 3vw, 40px);
  border-radius:4px;
  background:var(--card-bg);
  border:1px solid var(--card-border);
  border-top:var(--card-top-width) solid var(--card-top);
  box-shadow:var(--card-shadow);
}

.sw-modelle__card--featured{
  --card-bg:var(--navy-700);
  --card-border:transparent;      /* transparent statt none: gleiche Innenbreite */
  --card-top:var(--cyan-500);
  --card-top-width:6px;
  --card-line:rgba(255,255,255,.18);
  --card-eyebrow:var(--cyan-300);
  --card-title:#fff;
  --card-claim:var(--cyan-300);
  --card-count:var(--navy-100);
  --card-step:#fff;
  --card-rail:rgba(255,255,255,.28);
  --card-text:var(--navy-100);
  --card-muted:var(--navy-100);
  --card-typical:#fff;
  --card-shadow:var(--shadow-xl);
}

/* ---------- Kartenkopf ---------- */

.sw-modelle__card-head{
  display:flex;
  flex-direction:column;
  gap:14px;
  min-width:0;
}

.sw-modelle__card-eyebrow{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--card-eyebrow);
  overflow-wrap:break-word;
}

.sw-modelle__card-title{
  margin:0;
  font-family:var(--font-display);
  font-size:clamp(24px, 2.5vw, 34px);
  font-weight:700;
  line-height:1.08;
  letter-spacing:-.01em;
  color:var(--card-title);
  text-wrap:balance;
  overflow-wrap:break-word;
  hyphens:auto;
}

.sw-modelle__card-claim{
  margin:0;
  font-size:clamp(17px, 1.5vw, 19px);
  font-weight:600;
  line-height:1.4;
  color:var(--card-claim);
  overflow-wrap:break-word;
  hyphens:auto;
}

/* ---------- Schrittliste ---------- */

.sw-modelle__steps{
  display:flex;
  flex-direction:column;
  padding:clamp(18px, 2.2vw, 24px) 0;
  border-top:1px solid var(--card-line);
  border-bottom:1px solid var(--card-line);
}

.sw-modelle__steps-count{
  margin-bottom:18px;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--card-count);
}

.sw-modelle__step{
  display:flex;
  align-items:flex-start;
  gap:14px;
  min-width:0;
}

.sw-modelle__rail{
  display:flex;
  flex-direction:column;
  align-items:center;
  align-self:stretch;
  flex:none;
}

.sw-modelle__rail-dot{
  width:9px;
  height:9px;
  margin-top:6px;
  flex:none;
  background:var(--cyan-500);
}

.sw-modelle__rail-line{
  width:1px;
  flex:1;
  min-height:14px;
  background:var(--card-rail);
}

/* Statt einer eigenen Klasse für den letzten Eintrag */
.sw-modelle__step:last-child .sw-modelle__rail-line{ display:none; }

.sw-modelle__step-label{
  min-width:0;
  padding-bottom:10px;
  font-size:15px;
  line-height:1.5;
  color:var(--card-step);
  overflow-wrap:break-word;
  hyphens:auto;                   /* „Bestandsmanagement", „Nachproduktion" */
}

.sw-modelle__step:last-child .sw-modelle__step-label{ padding-bottom:0; }

/* ---------- Fließtext ---------- */

.sw-modelle__card-text{
  margin:0;
  min-width:0;
  font-size:15px;
  line-height:1.6;
  color:var(--card-text);
  overflow-wrap:break-word;
  hyphens:auto;
}

.sw-modelle__card-typical{
  margin:0;
  min-width:0;
  font-size:13px;
  line-height:1.55;
  color:var(--card-muted);
  overflow-wrap:break-word;
  hyphens:auto;
}

/* display:block ersetzt das <br> im Markup */
.sw-modelle__card-typical-label{
  display:block;
  margin-bottom:2px;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--card-typical);
}

/* ============================================================
   Abschluss
   ============================================================ */

.sw-modelle__footer{
  display:flex;
  flex-wrap:wrap;
  align-items:flex-start;
  justify-content:space-between;
  gap:clamp(24px, 3vw, 40px);
  margin-top:clamp(32px, 4vw, 48px);
  padding-top:clamp(24px, 3vw, 32px);
  border-top:1px solid var(--border-subtle);
}

/* 72ch waren breiter als der Container — der Button hatte keinen Platz
   und ist immer umgebrochen. */
.sw-modelle__footer-text{
  flex:1 1 34em;
  margin:0;
  min-width:0;
  max-width:62ch;
  font-size:clamp(15px, 1.25vw, 17px);
  line-height:1.62;
  overflow-wrap:break-word;
  hyphens:auto;
}

.sw-modelle__footer .sw-btn{
  flex:0 0 auto;
  max-width:100%;
  white-space:normal;
  text-align:center;
  justify-content:center;
}

/* ============================================================
   Breakpoints
   ============================================================ */

@media (max-width:960px){
  .sw-modelle__grid{
    grid-template-columns:minmax(0, 1fr);
    max-width:620px;
    margin-inline:auto;
  }
}

@media (max-width:560px){
  .sw-modelle__footer{ gap:20px; }
  .sw-modelle__footer .sw-btn{ width:100%; }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-1ee3c16 *//* StikmaWork one-pager · Sektion: trust
   Voraussetzung: 00-stikmawork-base.css (Tokens, .sw-stat)

   Container: gleiche Shell wie der Header (max-width + --sw-pad),
   damit „35" exakt unter der Logokante steht — auf jeder Breite. */

/* ---------- Diese Tokens gehören nach 00-base.css ---------- */
/*
:root{
  --sw-shell:1280px;
  --sw-pad:clamp(16px, 4vw, 40px);
}
*/

.sw-trust,
.sw-trust *,
.sw-trust *::before,
.sw-trust *::after{ box-sizing:border-box; }

/* ---------- Shell ---------- */

.sw-trust{
  background:var(--navy-025);
  border-top:1px solid var(--border-subtle);
  border-bottom:1px solid var(--border-subtle);
}

.sw-trust__inner{
  width:100%;
  max-width:var(--sw-shell, 1280px);
  margin:0 auto;
  padding:clamp(40px, 6vw, 56px) var(--sw-pad, 40px);
}

/* ---------- Kennzahlen ---------- */

.sw-trust__stats{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));   /* minmax(0,…), sonst Überlauf */
  gap:clamp(20px, 2.6vw, 32px);
  align-items:start;
}

.sw-trust__stats > *{ min-width:0; }

/* Optional: falls .sw-stat__fig im Base eine feste px-Größe hat.
   Max-Wert an eure Basisgröße anpassen. */
.sw-trust__stats .sw-stat__fig{
  font-size:clamp(30px, 3.6vw, 48px);
  line-height:1;
}

.sw-trust__stats .sw-stat__label{
  overflow-wrap:break-word;
  hyphens:auto;                                       /* „Produktions- und Lagerfläche" */
  text-wrap:balance;
}

/* ---------- Logo-/Zertifikatsreihe ---------- */
/* Feste Spaltenzahl statt auto-fit: 6 → 3 → 2 teilt immer glatt auf,
   auto-fit lässt sonst eine einzelne Kachel in der letzten Reihe stehen. */

.sw-trust__logos{
  display:grid;
  grid-template-columns:repeat(6, minmax(0, 1fr));
  gap:clamp(12px, 1.4vw, 16px);
  margin-top:clamp(32px, 4.5vw, 48px);
}

.sw-trust__logo,
.sw-trust__cert{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-height:60px;
  padding:8px 12px;
  background:#fff;
  font-family:var(--font-mono);
  font-size:11px;
  line-height:1.35;
  text-align:center;
  overflow-wrap:break-word;
}

.sw-trust__logo{                                       /* Platzhalter */
  border:1px dashed var(--grey-200);
  letter-spacing:.08em;
  color:var(--grey-400);
}

.sw-trust__cert{
  border:1px solid var(--border-subtle);
  letter-spacing:.06em;
  color:var(--text-muted);
}

/* Greift automatisch, sobald echte Kundenlogos die Platzhalter ersetzen */
.sw-trust__logo img,
.sw-trust__cert img{
  display:block;
  width:auto;
  max-width:100%;
  max-height:32px;
  object-fit:contain;
  filter:grayscale(1);
  opacity:.7;
  transition:opacity .18s ease, filter .18s ease;
}

.sw-trust__logo:hover img{
  filter:grayscale(0);
  opacity:1;
}

/* ---------- Breakpoints ---------- */

@media (max-width:900px){
  .sw-trust__stats{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .sw-trust__logos{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
}

@media (max-width:560px){
  .sw-trust__logos{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .sw-trust__logo,
  .sw-trust__cert{ min-height:54px; }
}

@media (max-width:380px){
  .sw-trust__stats{ grid-template-columns:minmax(0, 1fr); }
}

@media (prefers-reduced-motion:reduce){
  .sw-trust__logo img,
  .sw-trust__cert img{ transition:none; }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-5a2fa9a *//* StikmaWork one-pager · Sektion: film
   Voraussetzung: 00-stikmawork-base.css (Tokens, .sw-eyebrow, .sw-diag, .sw-icon)

   Kopfbereich sitzt in der Shell, das Medium läuft full-bleed.
   Die Bildunterschrift richtet sich auf dieselbe Kante wie der Kopf aus. */

.sw-film,
.sw-film *,
.sw-film *::before,
.sw-film *::after{ box-sizing:border-box; }

/* ============================================================
   Shell
   ============================================================ */

.sw-film{
  --fl-shell:var(--sw-shell, 1280px);
  --fl-pad:var(--sw-pad, clamp(16px, 4vw, 40px));

  background:var(--navy-700);
  padding:clamp(56px, 8vw, 104px) 0;
}

.sw-film__inner{
  width:100%;
  max-width:var(--fl-shell);
  margin:0 auto;
  padding:0 var(--fl-pad);
}

/* ============================================================
   Kopfbereich
   ============================================================ */

.sw-film__head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:clamp(24px, 4vw, 64px);
  margin-bottom:clamp(28px, 4vw, 48px);
}

.sw-film__head-main{
  display:flex;
  flex-direction:column;
  gap:clamp(14px, 1.8vw, 20px);
  min-width:0;
  max-width:24em;
}

.sw-film__title{
  margin:0;
  font-family:var(--font-display);
  font-size:clamp(28px, 3.3vw, 44px);
  font-weight:700;
  line-height:1.08;
  letter-spacing:-.02em;
  color:#fff;
  text-wrap:balance;
  overflow-wrap:break-word;
  hyphens:auto;
}

.sw-film__lead{
  margin:0;
  min-width:0;
  max-width:30em;
  font-size:clamp(15px, 1.25vw, 17px);
  line-height:1.6;
  color:var(--navy-100);
  overflow-wrap:break-word;
  hyphens:auto;
}

/* ============================================================
   Medium
   ============================================================ */

.sw-film__media{ position:relative; }

/* 620px fix war auf dem Handy die halbe Seitenhöhe */
.sw-film__frame{
  position:relative;
  height:clamp(300px, 42vw, 620px);
}

/* Absolut statt height:100% — gleiche Begründung wie im Hero:
   0,2,0 schlägt ein .sw-diag .sw-diag__img aus dem Base, und
   absolute Positionierung braucht keine definite Elternhöhe. */
.sw-film__frame > .sw-film__img{
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:50% 42%;
}

/* ---------- Play-Overlay ---------- */

.sw-film__overlay{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:var(--fl-pad);
}

.sw-film__play{
  display:flex;
  align-items:center;
  justify-content:center;
  width:clamp(64px, 8vw, 96px);
  height:clamp(64px, 8vw, 96px);
  padding:0;
  border:0;
  border-radius:3px;
  background:var(--cyan-500);
  box-shadow:var(--shadow-xl);
  cursor:pointer;
  transition:background 140ms cubic-bezier(.2, 0, .2, 1);
}

@media (hover:hover){
  .sw-film__play:hover{ background:var(--cyan-600); }
}

/* Fehlte komplett — der Button war per Tastatur unsichtbar */
.sw-film__play:focus-visible{
  outline:3px solid #fff;
  outline-offset:4px;
}

.sw-film__play-inner{ display:flex; color:#fff; }

.sw-film__play-icon{
  width:clamp(28px, 3.4vw, 40px);
  height:clamp(28px, 3.4vw, 40px);
}

/* ---------- Platzhalter-Hinweis ---------- */

.sw-film__note{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:12px;
  width:100%;
  max-width:520px;
  max-height:100%;
  overflow:auto;
  padding:clamp(20px, 3vw, 40px);
  background:rgba(14, 27, 42, .72);
  border:1px dashed var(--cyan-300);
  text-align:center;
}

.sw-film__note-eyebrow{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--cyan-300);
}

.sw-film__note-text{
  margin:0;
  font-size:clamp(15px, 1.4vw, 17px);
  line-height:1.55;
  color:#fff;
  overflow-wrap:break-word;
  hyphens:auto;
}

.sw-film__note-close{
  padding:0;
  border:0;
  background:none;
  cursor:pointer;
  font:inherit;
  font-size:13px;
  font-weight:600;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--cyan-300);
  text-decoration:underline;
  text-underline-offset:3px;
}

.sw-film__note-close:focus-visible{
  outline:2px solid var(--cyan-300);
  outline-offset:3px;
}

/* ---------- Bildunterschrift ---------- */
/* Gleiche Kantenformel wie Hero und Header: % statt 100vw, plus --fl-pad. */

.sw-film__caption{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  display:flex;
  flex-wrap:wrap;
  align-items:flex-end;
  justify-content:space-between;
  gap:clamp(12px, 2vw, 24px);
  padding:clamp(20px, 3vw, 32px) max(
    var(--fl-pad),
    calc((100% - var(--fl-shell)) / 2 + var(--fl-pad))
  );
  pointer-events:none;
}

/* Damit die title-Tooltips der Platzhalter erreichbar bleiben */
.sw-film__caption .ph{ pointer-events:auto; }

.sw-film__caption-main{
  display:flex;
  flex-direction:column;
  gap:6px;
  min-width:0;
}

.sw-film__caption-title{
  font-family:var(--font-display);
  font-size:clamp(19px, 2vw, 27px);
  font-weight:700;
  line-height:1.1;
  color:#fff;
  overflow-wrap:break-word;
}

.sw-film__caption-meta{
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--navy-100);
}

.sw-film__caption-note{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--navy-100);
}

/* ============================================================
   Breakpoints
   ============================================================ */

@media (max-width:760px){
  .sw-film__caption{
    flex-direction:column;
    align-items:flex-start;
    gap:10px;
  }

  /* Die Diagonale schneidet auf schmalen Screens zu viel Bild weg */
  .sw-film .sw-diag--both{ clip-path:none; -webkit-clip-path:none; }
}

@media (max-width:480px){
  .sw-film__caption-note{ display:none; }   /* reiner Produktionshinweis */
}

@media (prefers-reduced-motion:reduce){
  .sw-film__play{ transition:none; }
}

/* ============================================================
   Video
   Liegt im Markup NACH .sw-diag__overlay, damit es beim Abspielen
   ohne z-index-Tricks über den Bedienelementen liegt.
   ============================================================ */

.sw-film__video{
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;        /* nicht cover — sonst wird der Film beschnitten */
  background:#000;
  opacity:0;
  pointer-events:none;
  transition:opacity .2s ease;
}

.sw-film__frame.is-playing .sw-film__video{
  opacity:1;
  pointer-events:auto;
}

/* Vorschaubild, Scrim und Bedienelemente treten zurück */
.sw-film__frame.is-playing .sw-film__img,
.sw-film__frame.is-playing .sw-diag__scrim,
.sw-film__frame.is-playing .sw-film__overlay,
.sw-film__frame.is-playing .sw-film__caption{
  opacity:0;
  pointer-events:none;
  transition:opacity .2s ease;
}

/* Ein laufender Film ist ein Rechteck — die Diagonale würde
   die Enden der nativen Steuerleiste abschneiden. */
.sw-film__frame.is-playing{
  clip-path:none;
  -webkit-clip-path:none;
  background:#000;
}

@media (prefers-reduced-motion:reduce){
  .sw-film__video,
  .sw-film__frame.is-playing .sw-film__img,
  .sw-film__frame.is-playing .sw-diag__scrim,
  .sw-film__frame.is-playing .sw-film__overlay,
  .sw-film__frame.is-playing .sw-film__caption{ transition:none; }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-cdbd964 *//* StikmaWork one-pager · Sektion: trust
   Voraussetzung: 00-stikmawork-base.css (Tokens, .sw-stat)

   Container: gleiche Shell wie der Header (max-width + --sw-pad),
   damit „35" exakt unter der Logokante steht — auf jeder Breite. */

/* ---------- Diese Tokens gehören nach 00-base.css ---------- */
/*
:root{
  --sw-shell:1280px;
  --sw-pad:clamp(16px, 4vw, 40px);
}
*/

.sw-trust,
.sw-trust *,
.sw-trust *::before,
.sw-trust *::after{ box-sizing:border-box; }

/* ---------- Shell ---------- */

.sw-trust{
  background:var(--navy-025);
  border-top:1px solid var(--border-subtle);
  border-bottom:1px solid var(--border-subtle);
}

.sw-trust__inner{
  width:100%;
  max-width:var(--sw-shell, 1280px);
  margin:0 auto;
  padding:clamp(40px, 6vw, 56px) var(--sw-pad, 40px);
}

/* ---------- Kennzahlen ---------- */

.sw-trust__stats{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));   /* minmax(0,…), sonst Überlauf */
  gap:clamp(20px, 2.6vw, 32px);
  align-items:start;
}

.sw-trust__stats > *{ min-width:0; }

/* Optional: falls .sw-stat__fig im Base eine feste px-Größe hat.
   Max-Wert an eure Basisgröße anpassen. */
.sw-trust__stats .sw-stat__fig{
  font-size:clamp(30px, 3.6vw, 48px);
  line-height:1;
}

.sw-trust__stats .sw-stat__label{
  overflow-wrap:break-word;
  hyphens:auto;                                       /* „Produktions- und Lagerfläche" */
  text-wrap:balance;
}

/* ---------- Logo-/Zertifikatsreihe ---------- */
/* Feste Spaltenzahl statt auto-fit: 6 → 3 → 2 teilt immer glatt auf,
   auto-fit lässt sonst eine einzelne Kachel in der letzten Reihe stehen. */

.sw-trust__logos{
  display:grid;
  grid-template-columns:repeat(6, minmax(0, 1fr));
  gap:clamp(12px, 1.4vw, 16px);
  margin-top:clamp(32px, 4.5vw, 48px);
}

.sw-trust__logo,
.sw-trust__cert{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-height:60px;
  padding:8px 12px;
  background:#fff;
  font-family:var(--font-mono);
  font-size:11px;
  line-height:1.35;
  text-align:center;
  overflow-wrap:break-word;
}

.sw-trust__logo{                                       /* Platzhalter */
  border:1px dashed var(--grey-200);
  letter-spacing:.08em;
  color:var(--grey-400);
}

.sw-trust__cert{
  border:1px solid var(--border-subtle);
  letter-spacing:.06em;
  color:var(--text-muted);
}

/* Greift automatisch, sobald echte Kundenlogos die Platzhalter ersetzen */
.sw-trust__logo img,
.sw-trust__cert img{
  display:block;
  width:auto;
  max-width:100%;
  max-height:32px;
  object-fit:contain;
  filter:grayscale(1);
  opacity:.7;
  transition:opacity .18s ease, filter .18s ease;
}

.sw-trust__logo:hover img{
  filter:grayscale(0);
  opacity:1;
}

/* ---------- Breakpoints ---------- */

@media (max-width:900px){
  .sw-trust__stats{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .sw-trust__logos{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
}

@media (max-width:560px){
  .sw-trust__logos{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .sw-trust__logo,
  .sw-trust__cert{ min-height:54px; }
}

@media (max-width:380px){
  .sw-trust__stats{ grid-template-columns:minmax(0, 1fr); }
}

@media (prefers-reduced-motion:reduce){
  .sw-trust__logo img,
  .sw-trust__cert img{ transition:none; }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-ed8797c *//* StikmaWork one-pager · Sektion: lager
   Voraussetzung: 00-stikmawork-base.css (Tokens, .sw-eyebrow)
   Für hyphens:auto muss <html lang="de"> gesetzt sein. */

.sw-lager,
.sw-lager *,
.sw-lager *::before,
.sw-lager *::after{ box-sizing:border-box; }

/* ============================================================
   Shell
   ============================================================ */

.sw-lager{
  --lg-shell:var(--sw-shell, 1280px);
  --lg-pad:var(--sw-pad, clamp(16px, 4vw, 40px));

  padding:clamp(56px, 8vw, 104px) 0;
}

.sw-lager__inner{
  width:100%;
  max-width:var(--lg-shell);
  margin:0 auto;
  padding:0 var(--lg-pad);
  display:grid;
  grid-template-columns:minmax(0, 1.1fr) minmax(0, .9fr);
  gap:clamp(32px, 5vw, 80px);
  align-items:start;
}

/* ============================================================
   Textspalte
   ============================================================ */

.sw-lager__copy{
  display:flex;
  flex-direction:column;
  gap:clamp(18px, 2.2vw, 24px);
  min-width:0;
}

.sw-lager__title{
  margin:0;
  font-family:var(--font-display);
  font-size:clamp(28px, 3.3vw, 44px);
  font-weight:700;
  line-height:1.08;
  letter-spacing:-.02em;
  color:var(--text-strong);
  text-wrap:balance;
  overflow-wrap:break-word;
  hyphens:auto;
}

.sw-lager__lead{
  margin:0;
  min-width:0;
  font-size:clamp(16px, 1.35vw, 19px);
  line-height:1.55;
  overflow-wrap:break-word;
  hyphens:auto;
}

.sw-lager__text{
  margin:0;
  min-width:0;
  max-width:60ch;
  font-size:clamp(15px, 1.25vw, 17px);
  line-height:1.62;
  overflow-wrap:break-word;
  hyphens:auto;
}

/* ---------- Punktliste ---------- */

.sw-lager__list{
  display:flex;
  flex-direction:column;
  gap:14px;
  margin-top:8px;
}

/* Eine Klasse statt zwei: der Abschlussrahmen kommt aus :last-child */
.sw-lager__item{
  display:flex;
  align-items:flex-start;
  gap:14px;
  min-width:0;
  padding-top:14px;
  border-top:1px solid var(--border-subtle);
}

.sw-lager__item:last-child{
  padding-bottom:14px;
  border-bottom:1px solid var(--border-subtle);
}

.sw-lager__dot{
  width:6px;
  height:6px;
  margin-top:9px;
  flex:none;
  background:var(--cyan-500);
}

.sw-lager__item-text{
  min-width:0;
  font-size:15px;
  line-height:1.55;
  overflow-wrap:break-word;
  hyphens:auto;              /* „Nachbestellungen", „Neueinstellungen" */
}

/* ============================================================
   Karte
   ============================================================ */

.sw-lager__card{
  display:flex;
  flex-direction:column;
  gap:clamp(16px, 2vw, 20px);
  min-width:0;
  padding:clamp(24px, 3vw, 40px);
  background:var(--navy-700);
  border-top:6px solid var(--cyan-500);
  color:#fff;

  /* Optional: Karte läuft neben der langen Liste mit.
     80px = Headerhöhe. Einkommentieren, wenn gewünscht:
  position:sticky;
  top:calc(80px + 24px);
  */
}

.sw-lager__card-icon{
  display:block;
  width:clamp(52px, 5vw, 64px);
  height:clamp(52px, 5vw, 64px);
  flex:none;
  border-radius:22%;
  object-fit:contain;
  box-shadow:var(--shadow-tile);
}

.sw-lager__card-title{
  margin:0;
  font-family:var(--font-display);
  font-size:clamp(24px, 2.5vw, 34px);
  font-weight:700;
  line-height:1.1;
  color:#fff;
  text-wrap:balance;
  overflow-wrap:break-word;
  hyphens:auto;
}

.sw-lager__card-text{
  margin:0;
  min-width:0;
  font-size:clamp(15px, 1.25vw, 17px);
  line-height:1.6;
  color:var(--navy-100);
  overflow-wrap:break-word;
  hyphens:auto;
}

/* ============================================================
   Breakpoints
   ============================================================ */

@media (max-width:960px){
  .sw-lager__inner{ grid-template-columns:minmax(0, 1fr); }

  .sw-lager__copy{ max-width:70ch; }

  .sw-lager__card{
    position:static;         /* sticky ergibt einspaltig keinen Sinn */
    max-width:70ch;
  }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-e2a5521 *//* StikmaWork one-pager · Sektion: trust
   Voraussetzung: 00-stikmawork-base.css (Tokens, .sw-stat)

   Container: gleiche Shell wie der Header (max-width + --sw-pad),
   damit „35" exakt unter der Logokante steht — auf jeder Breite. */

/* ---------- Diese Tokens gehören nach 00-base.css ---------- */
/*
:root{
  --sw-shell:1280px;
  --sw-pad:clamp(16px, 4vw, 40px);
}
*/

.sw-trust,
.sw-trust *,
.sw-trust *::before,
.sw-trust *::after{ box-sizing:border-box; }

/* ---------- Shell ---------- */

.sw-trust{
  background:var(--navy-025);
  border-top:1px solid var(--border-subtle);
  border-bottom:1px solid var(--border-subtle);
}

.sw-trust__inner{
  width:100%;
  max-width:var(--sw-shell, 1280px);
  margin:0 auto;
  padding:clamp(40px, 6vw, 56px) var(--sw-pad, 40px);
}

/* ---------- Kennzahlen ---------- */

.sw-trust__stats{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));   /* minmax(0,…), sonst Überlauf */
  gap:clamp(20px, 2.6vw, 32px);
  align-items:start;
}

.sw-trust__stats > *{ min-width:0; }

/* Optional: falls .sw-stat__fig im Base eine feste px-Größe hat.
   Max-Wert an eure Basisgröße anpassen. */
.sw-trust__stats .sw-stat__fig{
  font-size:clamp(30px, 3.6vw, 48px);
  line-height:1;
}

.sw-trust__stats .sw-stat__label{
  overflow-wrap:break-word;
  hyphens:auto;                                       /* „Produktions- und Lagerfläche" */
  text-wrap:balance;
}

/* ---------- Logo-/Zertifikatsreihe ---------- */
/* Feste Spaltenzahl statt auto-fit: 6 → 3 → 2 teilt immer glatt auf,
   auto-fit lässt sonst eine einzelne Kachel in der letzten Reihe stehen. */

.sw-trust__logos{
  display:grid;
  grid-template-columns:repeat(6, minmax(0, 1fr));
  gap:clamp(12px, 1.4vw, 16px);
  margin-top:clamp(32px, 4.5vw, 48px);
}

.sw-trust__logo,
.sw-trust__cert{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-height:60px;
  padding:8px 12px;
  background:#fff;
  font-family:var(--font-mono);
  font-size:11px;
  line-height:1.35;
  text-align:center;
  overflow-wrap:break-word;
}

.sw-trust__logo{                                       /* Platzhalter */
  border:1px dashed var(--grey-200);
  letter-spacing:.08em;
  color:var(--grey-400);
}

.sw-trust__cert{
  border:1px solid var(--border-subtle);
  letter-spacing:.06em;
  color:var(--text-muted);
}

/* Greift automatisch, sobald echte Kundenlogos die Platzhalter ersetzen */
.sw-trust__logo img,
.sw-trust__cert img{
  display:block;
  width:auto;
  max-width:100%;
  max-height:32px;
  object-fit:contain;
  filter:grayscale(1);
  opacity:.7;
  transition:opacity .18s ease, filter .18s ease;
}

.sw-trust__logo:hover img{
  filter:grayscale(0);
  opacity:1;
}

/* ---------- Breakpoints ---------- */

@media (max-width:900px){
  .sw-trust__stats{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .sw-trust__logos{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
}

@media (max-width:560px){
  .sw-trust__logos{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .sw-trust__logo,
  .sw-trust__cert{ min-height:54px; }
}

@media (max-width:380px){
  .sw-trust__stats{ grid-template-columns:minmax(0, 1fr); }
}

@media (prefers-reduced-motion:reduce){
  .sw-trust__logo img,
  .sw-trust__cert img{ transition:none; }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-b077a6f *//* ============================================================
   Markenleiste
   ============================================================ */

.sw-produktion__logos{
  --sw-logo-gap:clamp(12px, 1.6vw, 20px);
  --sw-logo-visible:5;                 /* muss zu VISIBLE im JS passen */

  display:grid;
  grid-auto-flow:column;               /* alle Logos in einer Zeile */
  grid-auto-columns:calc((100% - (var(--sw-logo-visible) - 1) * var(--sw-logo-gap)) / var(--sw-logo-visible));
  gap:var(--sw-logo-gap);
  margin-top:clamp(24px, 3vw, 32px);
  overflow:hidden;                     /* Fallback für ältere Browser */
  overflow:clip;
}

/* Feste Höhe: nur so haben max-height:100% am Bild und die
   optische Grundlinie aller Kacheln eine definite Bezugsgröße. */
.sw-produktion__logo{
  display:flex;
  align-items:center;
  justify-content:center;
  height:clamp(76px, 8vw, 104px);
  padding:clamp(10px, 1.4vw, 18px);
  background:#fff;
  border:1px solid var(--border-subtle);
  border-radius:4px;
  overflow:hidden;
  will-change:transform;               /* flüssige Rotation per JS */
}

.sw-produktion__logo img{
  display:block;
  width:auto;
  height:auto;
  max-width:100%;
  max-height:100%;
  object-fit:contain;
  filter:grayscale(1);
  opacity:.7;
  transition:opacity .18s ease, filter .18s ease;
}

.sw-produktion__logo:hover img{
  filter:grayscale(0);
  opacity:1;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-f0b8993 *//* StikmaWork one-pager · Sektion: trust
   Voraussetzung: 00-stikmawork-base.css (Tokens, .sw-stat)

   Container: gleiche Shell wie der Header (max-width + --sw-pad),
   damit „35" exakt unter der Logokante steht — auf jeder Breite. */

/* ---------- Diese Tokens gehören nach 00-base.css ---------- */
/*
:root{
  --sw-shell:1280px;
  --sw-pad:clamp(16px, 4vw, 40px);
}
*/

.sw-trust,
.sw-trust *,
.sw-trust *::before,
.sw-trust *::after{ box-sizing:border-box; }

/* ---------- Shell ---------- */

.sw-trust{
  background:var(--navy-025);
  border-top:1px solid var(--border-subtle);
  border-bottom:1px solid var(--border-subtle);
}

.sw-trust__inner{
  width:100%;
  max-width:var(--sw-shell, 1280px);
  margin:0 auto;
  padding:clamp(40px, 6vw, 56px) var(--sw-pad, 40px);
}

/* ---------- Kennzahlen ---------- */

.sw-trust__stats{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));   /* minmax(0,…), sonst Überlauf */
  gap:clamp(20px, 2.6vw, 32px);
  align-items:start;
}

.sw-trust__stats > *{ min-width:0; }

/* Optional: falls .sw-stat__fig im Base eine feste px-Größe hat.
   Max-Wert an eure Basisgröße anpassen. */
.sw-trust__stats .sw-stat__fig{
  font-size:clamp(30px, 3.6vw, 48px);
  line-height:1;
}

.sw-trust__stats .sw-stat__label{
  overflow-wrap:break-word;
  hyphens:auto;                                       /* „Produktions- und Lagerfläche" */
  text-wrap:balance;
}

/* ---------- Logo-/Zertifikatsreihe ---------- */
/* Feste Spaltenzahl statt auto-fit: 6 → 3 → 2 teilt immer glatt auf,
   auto-fit lässt sonst eine einzelne Kachel in der letzten Reihe stehen. */

.sw-trust__logos{
  display:grid;
  grid-template-columns:repeat(6, minmax(0, 1fr));
  gap:clamp(12px, 1.4vw, 16px);
  margin-top:clamp(32px, 4.5vw, 48px);
}

.sw-trust__logo,
.sw-trust__cert{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-height:60px;
  padding:8px 12px;
  background:#fff;
  font-family:var(--font-mono);
  font-size:11px;
  line-height:1.35;
  text-align:center;
  overflow-wrap:break-word;
}

.sw-trust__logo{                                       /* Platzhalter */
  border:1px dashed var(--grey-200);
  letter-spacing:.08em;
  color:var(--grey-400);
}

.sw-trust__cert{
  border:1px solid var(--border-subtle);
  letter-spacing:.06em;
  color:var(--text-muted);
}

/* Greift automatisch, sobald echte Kundenlogos die Platzhalter ersetzen */
.sw-trust__logo img,
.sw-trust__cert img{
  display:block;
  width:auto;
  max-width:100%;
  max-height:32px;
  object-fit:contain;
  filter:grayscale(1);
  opacity:.7;
  transition:opacity .18s ease, filter .18s ease;
}

.sw-trust__logo:hover img{
  filter:grayscale(0);
  opacity:1;
}

/* ---------- Breakpoints ---------- */

@media (max-width:900px){
  .sw-trust__stats{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .sw-trust__logos{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
}

@media (max-width:560px){
  .sw-trust__logos{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .sw-trust__logo,
  .sw-trust__cert{ min-height:54px; }
}

@media (max-width:380px){
  .sw-trust__stats{ grid-template-columns:minmax(0, 1fr); }
}

@media (prefers-reduced-motion:reduce){
  .sw-trust__logo img,
  .sw-trust__cert img{ transition:none; }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-b78ac21 *//* StikmaWork one-pager · Sektion: standorte
   Voraussetzung: 00-stikmawork-base.css (Tokens, .sw-eyebrow, .sw-diag, .sw-icon)
   Für hyphens:auto muss <html lang="de"> gesetzt sein. */

.sw-standorte,
.sw-standorte *,
.sw-standorte *::before,
.sw-standorte *::after{ box-sizing:border-box; }

/* ============================================================
   Shell
   ============================================================ */

.sw-standorte{
  --st-shell:var(--sw-shell, 1280px);
  --st-pad:var(--sw-pad, clamp(16px, 4vw, 40px));

  background:var(--navy-025);
  border-top:1px solid var(--border-subtle);
  border-bottom:1px solid var(--border-subtle);
  padding:clamp(56px, 8vw, 104px) 0;
}

/* Beide Blöcke teilen sich eine Shell-Definition */
.sw-standorte__inner{
  width:100%;
  max-width:var(--st-shell);
  margin:0 auto;
  padding:0 var(--st-pad);
}

.sw-standorte__inner--split{
  display:grid;
  grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
  gap:clamp(32px, 5vw, 80px);
  align-items:start;
}

.sw-standorte__inner--portal{ margin-top:clamp(36px, 5vw, 64px); }

/* ============================================================
   Textspalte
   ============================================================ */

.sw-standorte__copy{
  display:flex;
  flex-direction:column;
  gap:clamp(18px, 2.2vw, 24px);
  min-width:0;
}

.sw-standorte__icon{
  display:block;
  width:clamp(52px, 5vw, 64px);
  height:clamp(52px, 5vw, 64px);
  flex:none;
  border-radius:22%;
  object-fit:contain;
  box-shadow:var(--shadow-tile);
}

.sw-standorte__title{
  margin:0;
  font-family:var(--font-display);
  font-size:clamp(28px, 3.3vw, 44px);
  font-weight:700;
  line-height:1.08;
  letter-spacing:-.02em;
  color:var(--text-strong);
  text-wrap:balance;
  overflow-wrap:break-word;
  hyphens:auto;
}

.sw-standorte__lead{
  margin:0;
  min-width:0;
  font-size:clamp(16px, 1.35vw, 19px);
  line-height:1.55;
  overflow-wrap:break-word;
  hyphens:auto;
}

/* ============================================================
   Checkliste
   ============================================================ */

.sw-standorte__list{
  display:flex;
  flex-direction:column;
  min-width:0;
}

.sw-standorte__item{
  display:flex;
  align-items:flex-start;
  gap:16px;
  min-width:0;
  padding:16px 0;
  border-bottom:1px solid var(--border-subtle);
}

.sw-standorte__check{
  display:flex;
  margin-top:4px;
  flex:none;
  color:var(--cyan-500);
}

.sw-standorte__check-icon{
  width:18px;
  height:18px;
}

.sw-standorte__item-text{
  min-width:0;
  font-size:15px;
  line-height:1.55;
  overflow-wrap:break-word;
  hyphens:auto;              /* „länderspezifischer", „Kommissionierung" */
}

/* ============================================================
   Portal-Karte
   ============================================================ */

.sw-standorte__portal{
  display:grid;
  grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
  gap:0;
  background:#fff;
  border:1px solid var(--border-subtle);
  border-radius:4px;
  box-shadow:var(--shadow-sm);
  overflow:hidden;
}

.sw-standorte__portal-copy{
  display:flex;
  flex-direction:column;
  gap:16px;
  min-width:0;
  padding:clamp(24px, 3vw, 40px);
}

.sw-standorte__portal-title{
  margin:0;
  font-family:var(--font-display);
  font-size:clamp(24px, 2.5vw, 34px);
  font-weight:700;
  line-height:1.1;
  color:var(--text-strong);
  text-wrap:balance;
  overflow-wrap:break-word;
  hyphens:auto;
}

.sw-standorte__portal-text{
  margin:0;
  min-width:0;
  font-size:clamp(15px, 1.25vw, 17px);
  line-height:1.6;
  overflow-wrap:break-word;
  hyphens:auto;
}

/* ---------- Bildzelle ---------- */

.sw-standorte__portal-media{
  position:relative;
  min-width:0;
  min-height:280px;
}

/* Rahmen absolut in die Zelle statt height:100% — Prozenthöhen
   brauchen eine definite Elternhöhe, absolute Positionierung nicht. */
.sw-standorte__portal-media > .sw-standorte__portal-frame{
  position:absolute;
  inset:0;
}

/* 0,3,0 — schlägt ein .sw-diag .sw-diag__img aus dem Base */
.sw-standorte__portal-frame > .sw-diag__img{
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}

/* ============================================================
   Breakpoints
   ============================================================ */

@media (max-width:960px){
  .sw-standorte__inner--split{ grid-template-columns:minmax(0, 1fr); }
  .sw-standorte__copy{ max-width:70ch; }

  .sw-standorte__portal{ grid-template-columns:minmax(0, 1fr); }

  .sw-standorte__portal-media{
    min-height:0;
    aspect-ratio:16 / 9;
    order:2;                 /* Bild unter den Text */
  }
  .sw-standorte__portal-copy{ order:1; }

  /* Die Diagonale ergibt nur neben dem Text Sinn */
  .sw-standorte .sw-diag--left{ clip-path:none; -webkit-clip-path:none; }
}

@media (max-width:560px){
  .sw-standorte__portal-media{ aspect-ratio:4 / 3; }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-9309c37 *//* StikmaWork one-pager · Sektion: trust
   Voraussetzung: 00-stikmawork-base.css (Tokens, .sw-stat)

   Container: gleiche Shell wie der Header (max-width + --sw-pad),
   damit „35" exakt unter der Logokante steht — auf jeder Breite. */

/* ---------- Diese Tokens gehören nach 00-base.css ---------- */
/*
:root{
  --sw-shell:1280px;
  --sw-pad:clamp(16px, 4vw, 40px);
}
*/

.sw-trust,
.sw-trust *,
.sw-trust *::before,
.sw-trust *::after{ box-sizing:border-box; }

/* ---------- Shell ---------- */

.sw-trust{
  background:var(--navy-025);
  border-top:1px solid var(--border-subtle);
  border-bottom:1px solid var(--border-subtle);
}

.sw-trust__inner{
  width:100%;
  max-width:var(--sw-shell, 1280px);
  margin:0 auto;
  padding:clamp(40px, 6vw, 56px) var(--sw-pad, 40px);
}

/* ---------- Kennzahlen ---------- */

.sw-trust__stats{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));   /* minmax(0,…), sonst Überlauf */
  gap:clamp(20px, 2.6vw, 32px);
  align-items:start;
}

.sw-trust__stats > *{ min-width:0; }

/* Optional: falls .sw-stat__fig im Base eine feste px-Größe hat.
   Max-Wert an eure Basisgröße anpassen. */
.sw-trust__stats .sw-stat__fig{
  font-size:clamp(30px, 3.6vw, 48px);
  line-height:1;
}

.sw-trust__stats .sw-stat__label{
  overflow-wrap:break-word;
  hyphens:auto;                                       /* „Produktions- und Lagerfläche" */
  text-wrap:balance;
}

/* ---------- Logo-/Zertifikatsreihe ---------- */
/* Feste Spaltenzahl statt auto-fit: 6 → 3 → 2 teilt immer glatt auf,
   auto-fit lässt sonst eine einzelne Kachel in der letzten Reihe stehen. */

.sw-trust__logos{
  display:grid;
  grid-template-columns:repeat(6, minmax(0, 1fr));
  gap:clamp(12px, 1.4vw, 16px);
  margin-top:clamp(32px, 4.5vw, 48px);
}

.sw-trust__logo,
.sw-trust__cert{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-height:60px;
  padding:8px 12px;
  background:#fff;
  font-family:var(--font-mono);
  font-size:11px;
  line-height:1.35;
  text-align:center;
  overflow-wrap:break-word;
}

.sw-trust__logo{                                       /* Platzhalter */
  border:1px dashed var(--grey-200);
  letter-spacing:.08em;
  color:var(--grey-400);
}

.sw-trust__cert{
  border:1px solid var(--border-subtle);
  letter-spacing:.06em;
  color:var(--text-muted);
}

/* Greift automatisch, sobald echte Kundenlogos die Platzhalter ersetzen */
.sw-trust__logo img,
.sw-trust__cert img{
  display:block;
  width:auto;
  max-width:100%;
  max-height:32px;
  object-fit:contain;
  filter:grayscale(1);
  opacity:.7;
  transition:opacity .18s ease, filter .18s ease;
}

.sw-trust__logo:hover img{
  filter:grayscale(0);
  opacity:1;
}

/* ---------- Breakpoints ---------- */

@media (max-width:900px){
  .sw-trust__stats{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .sw-trust__logos{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
}

@media (max-width:560px){
  .sw-trust__logos{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .sw-trust__logo,
  .sw-trust__cert{ min-height:54px; }
}

@media (max-width:380px){
  .sw-trust__stats{ grid-template-columns:minmax(0, 1fr); }
}

@media (prefers-reduced-motion:reduce){
  .sw-trust__logo img,
  .sw-trust__cert img{ transition:none; }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-9ce3f64 *//* StikmaWork one-pager · Sektion: referenzen
   Voraussetzung: 00-stikmawork-base.css (Tokens, .sw-eyebrow, .sw-diag)
   Für hyphens:auto muss <html lang="de"> gesetzt sein. */

.sw-referenzen,
.sw-referenzen *,
.sw-referenzen *::before,
.sw-referenzen *::after{ box-sizing:border-box; }

/* ============================================================
   Shell
   ============================================================ */

.sw-referenzen{
  --rf-shell:var(--sw-shell, 1280px);
  --rf-pad:var(--sw-pad, clamp(16px, 4vw, 40px));

  padding:clamp(56px, 8vw, 104px) 0;
}

.sw-referenzen__inner{
  width:100%;
  max-width:var(--rf-shell);
  margin:0 auto;
  padding:0 var(--rf-pad);
}

/* ============================================================
   Kopfbereich
   ============================================================ */

.sw-referenzen__head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:clamp(24px, 4vw, 64px);
  margin-bottom:clamp(28px, 4vw, 48px);
}

.sw-referenzen__head-main{
  display:flex;
  flex-direction:column;
  gap:clamp(14px, 1.8vw, 20px);
  min-width:0;
  max-width:26em;
}

.sw-referenzen__title{
  margin:0;
  font-family:var(--font-display);
  font-size:clamp(28px, 3.3vw, 44px);
  font-weight:700;
  line-height:1.08;
  letter-spacing:-.02em;
  color:var(--text-strong);
  text-wrap:balance;
  overflow-wrap:break-word;
  hyphens:auto;
}

.sw-referenzen__lead{
  margin:0;
  min-width:0;
  max-width:30em;
  font-size:clamp(15px, 1.25vw, 17px);
  line-height:1.6;
  overflow-wrap:break-word;
  hyphens:auto;
}

/* ============================================================
   Referenzkarten
   ============================================================ */

.sw-referenzen__grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:clamp(16px, 2vw, 24px);
  align-items:start;
}

.sw-referenzen__card{
  display:flex;
  flex-direction:column;
  gap:14px;
  min-width:0;
  padding:clamp(22px, 2.6vw, 32px);
  background:#fff;
  border:1px solid var(--border-subtle);
  border-radius:4px;
  box-shadow:var(--shadow-sm);
}

.sw-referenzen__card-meta{
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--text-muted);
  overflow-wrap:break-word;
}

.sw-referenzen__card-title{
  margin:0;
  font-family:var(--font-display);
  font-size:clamp(21px, 2vw, 27px);
  font-weight:700;
  line-height:1.12;
  color:var(--text-strong);
  text-wrap:balance;
  overflow-wrap:break-word;
  hyphens:auto;
}

.sw-referenzen__flag{
  display:inline-block;
  font-family:var(--font-mono);
  font-size:11px;
  font-weight:400;
  letter-spacing:.04em;
  color:var(--text-muted);
  white-space:nowrap;
}

.sw-referenzen__card-text{
  margin:0;
  min-width:0;
  font-size:15px;
  line-height:1.6;
  overflow-wrap:break-word;
  hyphens:auto;
}

/* ============================================================
   Zitat + Bild
   ============================================================ */

.sw-referenzen__quote-row{
  display:grid;
  grid-template-columns:minmax(0, 1fr) minmax(0, .55fr);
  gap:clamp(28px, 4vw, 56px);
  align-items:center;
  margin-top:clamp(36px, 5vw, 56px);
}

.sw-referenzen__quote{
  margin:0;
  min-width:0;
  padding-left:clamp(20px, 2.6vw, 32px);
  border-left:4px solid var(--cyan-500);
}

.sw-referenzen__quote-text{
  margin:0;
  font-family:var(--font-display);
  font-size:clamp(22px, 2.6vw, 34px);
  font-weight:700;
  line-height:1.18;
  color:var(--text-strong);
  text-wrap:balance;
  overflow-wrap:break-word;
  hyphens:auto;
}

.sw-referenzen__quote-source{
  margin-top:clamp(14px, 1.8vw, 20px);
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--text-muted);
}

.sw-referenzen__media{
  position:relative;
  min-width:0;
  height:clamp(220px, 24vw, 300px);
}

/* Rahmen absolut in die Zelle, Bild absolut in den Rahmen —
   0,3,0 schlägt ein .sw-diag .sw-diag__img aus dem Base. */
.sw-referenzen__media > .sw-referenzen__frame{
  position:absolute;
  inset:0;
}

.sw-referenzen__frame > .sw-diag__img{
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}

/* ============================================================
   Breakpoints
   ============================================================ */

@media (max-width:1000px){
  .sw-referenzen__grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
}

@media (max-width:860px){
  .sw-referenzen__quote-row{
    grid-template-columns:minmax(0, 1fr);
    align-items:start;
  }

  .sw-referenzen__media{
    height:auto;
    aspect-ratio:16 / 9;
  }

  .sw-referenzen .sw-diag--both{ clip-path:none; -webkit-clip-path:none; }
}

@media (max-width:640px){
  .sw-referenzen__grid{ grid-template-columns:minmax(0, 1fr); }
  .sw-referenzen__flag{ white-space:normal; }
}

@media (max-width:560px){
  .sw-referenzen__media{ aspect-ratio:4 / 3; }
}

/* ============================================================
   Größenerfassung / App
   ============================================================ */

.sw-referenzen__app{
  display:grid;
  grid-template-columns:minmax(0, 22em) minmax(0, 1fr);
  gap:clamp(20px, 3vw, 48px);
  align-items:start;
  margin-top:clamp(20px, 2.5vw, 28px);
  padding:clamp(24px, 3vw, 40px);
  background:#fff;
  border:1px solid var(--border-subtle);
  border-left:4px solid var(--cyan-500);
  border-radius:4px;
  box-shadow:var(--shadow-sm);
}

.sw-referenzen__app-head{
  display:flex;
  flex-direction:column;
  gap:clamp(12px, 1.5vw, 16px);
  min-width:0;
}

.sw-referenzen__app-title{
  margin:0;
  font-family:var(--font-display);
  font-size:clamp(21px, 2.2vw, 28px);
  font-weight:700;
  line-height:1.16;
  letter-spacing:-.01em;
  color:var(--text-strong);
  text-wrap:balance;
  overflow-wrap:break-word;
  hyphens:auto;              /* „Größenerfassung" */
}

.sw-referenzen__app-body{
  display:flex;
  flex-direction:column;
  gap:clamp(12px, 1.4vw, 16px);
  min-width:0;
  max-width:62ch;
}

.sw-referenzen__app-text{
  margin:0;
  font-size:clamp(15px, 1.25vw, 17px);
  line-height:1.6;
  overflow-wrap:break-word;
  hyphens:auto;              /* „Nachbestellungen", „Neueinstellungen" */
}

@media (max-width:860px){
  .sw-referenzen__app{ grid-template-columns:minmax(0, 1fr); }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-1a1a2e8 *//* StikmaWork one-pager · Sektion: trust
   Voraussetzung: 00-stikmawork-base.css (Tokens, .sw-stat)

   Container: gleiche Shell wie der Header (max-width + --sw-pad),
   damit „35" exakt unter der Logokante steht — auf jeder Breite. */

/* ---------- Diese Tokens gehören nach 00-base.css ---------- */
/*
:root{
  --sw-shell:1280px;
  --sw-pad:clamp(16px, 4vw, 40px);
}
*/

.sw-trust,
.sw-trust *,
.sw-trust *::before,
.sw-trust *::after{ box-sizing:border-box; }

/* ---------- Shell ---------- */

.sw-trust{
  background:var(--navy-025);
  border-top:1px solid var(--border-subtle);
  border-bottom:1px solid var(--border-subtle);
}

.sw-trust__inner{
  width:100%;
  max-width:var(--sw-shell, 1280px);
  margin:0 auto;
  padding:clamp(40px, 6vw, 56px) var(--sw-pad, 40px);
}

/* ---------- Kennzahlen ---------- */

.sw-trust__stats{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));   /* minmax(0,…), sonst Überlauf */
  gap:clamp(20px, 2.6vw, 32px);
  align-items:start;
}

.sw-trust__stats > *{ min-width:0; }

/* Optional: falls .sw-stat__fig im Base eine feste px-Größe hat.
   Max-Wert an eure Basisgröße anpassen. */
.sw-trust__stats .sw-stat__fig{
  font-size:clamp(30px, 3.6vw, 48px);
  line-height:1;
}

.sw-trust__stats .sw-stat__label{
  overflow-wrap:break-word;
  hyphens:auto;                                       /* „Produktions- und Lagerfläche" */
  text-wrap:balance;
}

/* ---------- Logo-/Zertifikatsreihe ---------- */
/* Feste Spaltenzahl statt auto-fit: 6 → 3 → 2 teilt immer glatt auf,
   auto-fit lässt sonst eine einzelne Kachel in der letzten Reihe stehen. */

.sw-trust__logos{
  display:grid;
  grid-template-columns:repeat(6, minmax(0, 1fr));
  gap:clamp(12px, 1.4vw, 16px);
  margin-top:clamp(32px, 4.5vw, 48px);
}

.sw-trust__logo,
.sw-trust__cert{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-height:60px;
  padding:8px 12px;
  background:#fff;
  font-family:var(--font-mono);
  font-size:11px;
  line-height:1.35;
  text-align:center;
  overflow-wrap:break-word;
}

.sw-trust__logo{                                       /* Platzhalter */
  border:1px dashed var(--grey-200);
  letter-spacing:.08em;
  color:var(--grey-400);
}

.sw-trust__cert{
  border:1px solid var(--border-subtle);
  letter-spacing:.06em;
  color:var(--text-muted);
}

/* Greift automatisch, sobald echte Kundenlogos die Platzhalter ersetzen */
.sw-trust__logo img,
.sw-trust__cert img{
  display:block;
  width:auto;
  max-width:100%;
  max-height:32px;
  object-fit:contain;
  filter:grayscale(1);
  opacity:.7;
  transition:opacity .18s ease, filter .18s ease;
}

.sw-trust__logo:hover img{
  filter:grayscale(0);
  opacity:1;
}

/* ---------- Breakpoints ---------- */

@media (max-width:900px){
  .sw-trust__stats{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .sw-trust__logos{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
}

@media (max-width:560px){
  .sw-trust__logos{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .sw-trust__logo,
  .sw-trust__cert{ min-height:54px; }
}

@media (max-width:380px){
  .sw-trust__stats{ grid-template-columns:minmax(0, 1fr); }
}

@media (prefers-reduced-motion:reduce){
  .sw-trust__logo img,
  .sw-trust__cert img{ transition:none; }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-5005e7f *//* StikmaWork one-pager · Sektion: marken
   Voraussetzung: 00-stikmawork-base.css (Tokens, .sw-eyebrow, .sw-btn)
   Für hyphens:auto muss <html lang="de"> gesetzt sein. */

.sw-marken,
.sw-marken *,
.sw-marken *::before,
.sw-marken *::after{ box-sizing:border-box; }

/* ============================================================
   Shell
   ============================================================ */

.sw-marken{
  --mk-shell:var(--sw-shell, 1280px);
  --mk-pad:var(--sw-pad, clamp(16px, 4vw, 40px));

  background:var(--navy-700);
  border-top:6px solid var(--cyan-500);
  color:#fff;
  padding:clamp(56px, 8vw, 104px) 0;
}

.sw-marken__inner{
  width:100%;
  max-width:var(--mk-shell);
  margin:0 auto;
  padding:0 var(--mk-pad);
  display:grid;
  grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
  gap:clamp(32px, 5vw, 80px);
  align-items:start;
}

/* ============================================================
   Textspalte
   ============================================================ */

.sw-marken__copy{
  display:flex;
  flex-direction:column;
  gap:clamp(18px, 2.2vw, 24px);
  min-width:0;
}

.sw-marken__icon{
  display:block;
  width:clamp(52px, 5vw, 64px);
  height:clamp(52px, 5vw, 64px);
  flex:none;
  border-radius:22%;
  object-fit:contain;
}

.sw-marken__title{
  margin:0;
  font-family:var(--font-display);
  font-size:clamp(28px, 3.3vw, 44px);
  font-weight:700;
  line-height:1.08;
  letter-spacing:-.02em;
  color:#fff;
  text-wrap:balance;
  overflow-wrap:break-word;
  hyphens:auto;
}

.sw-marken__lead{
  margin:0;
  min-width:0;
  font-size:clamp(16px, 1.35vw, 19px);
  line-height:1.55;
  color:var(--navy-100);
  overflow-wrap:break-word;
  hyphens:auto;
}

/* ---------- Fallnotiz + CTA ---------- */

.sw-marken__case{
  margin-top:8px;
  padding-top:clamp(18px, 2.2vw, 24px);
  border-top:1px solid rgba(255, 255, 255, .18);
}

.sw-marken__case-text{
  margin:0;
  min-width:0;
  font-size:clamp(15px, 1.25vw, 17px);
  line-height:1.6;
  color:var(--navy-100);
  overflow-wrap:break-word;
  hyphens:auto;
}

.sw-marken__strong{ color:#fff; }

.sw-marken__actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:clamp(20px, 2.6vw, 28px);
}

.sw-marken__actions .sw-btn{
  flex:0 1 auto;
  min-width:0;
  max-width:100%;
  white-space:normal;
  text-align:center;
  justify-content:center;
  hyphens:auto;
}

/* ============================================================
   Leistungsliste
   ============================================================ */

.sw-marken__list{
  display:flex;
  flex-direction:column;
  min-width:0;
}

.sw-marken__item{
  display:flex;
  align-items:flex-start;
  gap:clamp(14px, 1.8vw, 20px);
  min-width:0;
  padding:18px 0;
  border-bottom:1px solid rgba(255, 255, 255, .14);
}

.sw-marken__item:first-child{ padding-top:0; }

.sw-marken__num{
  flex:0 0 auto;
  padding-top:3px;
  font-family:var(--font-mono);
  font-size:12px;
  font-variant-numeric:tabular-nums;
  color:var(--cyan-500);
}

.sw-marken__item-text{
  margin:0;
  min-width:0;
  font-size:15px;
  line-height:1.55;
  color:var(--navy-100);
  overflow-wrap:break-word;
  hyphens:auto;            /* „Kollektionsentwicklung", „Händlerbelieferung" */
}

/* ============================================================
   Breakpoints
   ============================================================ */

@media (max-width:960px){
  .sw-marken__inner{ grid-template-columns:minmax(0, 1fr); }
  .sw-marken__copy{ max-width:70ch; }
  .sw-marken__list{ max-width:70ch; }
  .sw-marken__item:first-child{ padding-top:18px; }
}

@media (max-width:520px){
  .sw-marken__actions{ align-items:stretch; }
  .sw-marken__actions .sw-btn{ width:100%; }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-71572d8 *//* StikmaWork one-pager · Sektion: trust
   Voraussetzung: 00-stikmawork-base.css (Tokens, .sw-stat)

   Container: gleiche Shell wie der Header (max-width + --sw-pad),
   damit „35" exakt unter der Logokante steht — auf jeder Breite. */

/* ---------- Diese Tokens gehören nach 00-base.css ---------- */
/*
:root{
  --sw-shell:1280px;
  --sw-pad:clamp(16px, 4vw, 40px);
}
*/

.sw-trust,
.sw-trust *,
.sw-trust *::before,
.sw-trust *::after{ box-sizing:border-box; }

/* ---------- Shell ---------- */

.sw-trust{
  background:var(--navy-025);
  border-top:1px solid var(--border-subtle);
  border-bottom:1px solid var(--border-subtle);
}

.sw-trust__inner{
  width:100%;
  max-width:var(--sw-shell, 1280px);
  margin:0 auto;
  padding:clamp(40px, 6vw, 56px) var(--sw-pad, 40px);
}

/* ---------- Kennzahlen ---------- */

.sw-trust__stats{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));   /* minmax(0,…), sonst Überlauf */
  gap:clamp(20px, 2.6vw, 32px);
  align-items:start;
}

.sw-trust__stats > *{ min-width:0; }

/* Optional: falls .sw-stat__fig im Base eine feste px-Größe hat.
   Max-Wert an eure Basisgröße anpassen. */
.sw-trust__stats .sw-stat__fig{
  font-size:clamp(30px, 3.6vw, 48px);
  line-height:1;
}

.sw-trust__stats .sw-stat__label{
  overflow-wrap:break-word;
  hyphens:auto;                                       /* „Produktions- und Lagerfläche" */
  text-wrap:balance;
}

/* ---------- Logo-/Zertifikatsreihe ---------- */
/* Feste Spaltenzahl statt auto-fit: 6 → 3 → 2 teilt immer glatt auf,
   auto-fit lässt sonst eine einzelne Kachel in der letzten Reihe stehen. */

.sw-trust__logos{
  display:grid;
  grid-template-columns:repeat(6, minmax(0, 1fr));
  gap:clamp(12px, 1.4vw, 16px);
  margin-top:clamp(32px, 4.5vw, 48px);
}

.sw-trust__logo,
.sw-trust__cert{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-height:60px;
  padding:8px 12px;
  background:#fff;
  font-family:var(--font-mono);
  font-size:11px;
  line-height:1.35;
  text-align:center;
  overflow-wrap:break-word;
}

.sw-trust__logo{                                       /* Platzhalter */
  border:1px dashed var(--grey-200);
  letter-spacing:.08em;
  color:var(--grey-400);
}

.sw-trust__cert{
  border:1px solid var(--border-subtle);
  letter-spacing:.06em;
  color:var(--text-muted);
}

/* Greift automatisch, sobald echte Kundenlogos die Platzhalter ersetzen */
.sw-trust__logo img,
.sw-trust__cert img{
  display:block;
  width:auto;
  max-width:100%;
  max-height:32px;
  object-fit:contain;
  filter:grayscale(1);
  opacity:.7;
  transition:opacity .18s ease, filter .18s ease;
}

.sw-trust__logo:hover img{
  filter:grayscale(0);
  opacity:1;
}

/* ---------- Breakpoints ---------- */

@media (max-width:900px){
  .sw-trust__stats{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .sw-trust__logos{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
}

@media (max-width:560px){
  .sw-trust__logos{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .sw-trust__logo,
  .sw-trust__cert{ min-height:54px; }
}

@media (max-width:380px){
  .sw-trust__stats{ grid-template-columns:minmax(0, 1fr); }
}

@media (prefers-reduced-motion:reduce){
  .sw-trust__logo img,
  .sw-trust__cert img{ transition:none; }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-6edd269 *//* StikmaWork one-pager · Sektion: faq
   Voraussetzung: 00-stikmawork-base.css (Tokens, .sw-icon)
   Für hyphens:auto muss <html lang="de"> gesetzt sein. */

.sw-faq,
.sw-faq *,
.sw-faq *::before,
.sw-faq *::after{ box-sizing:border-box; }

/* ============================================================
   Shell
   ============================================================ */

.sw-faq{
  --fq-shell:var(--sw-shell, 1280px);
  --fq-pad:var(--sw-pad, clamp(16px, 4vw, 40px));

  padding:clamp(56px, 8vw, 104px) 0;
}

.sw-faq__inner{
  width:100%;
  max-width:var(--fq-shell);
  margin:0 auto;
  padding:0 var(--fq-pad);
  display:grid;
  grid-template-columns:minmax(0, .6fr) minmax(0, 1.4fr);
  gap:clamp(28px, 5vw, 80px);
  align-items:start;
}

.sw-faq__title{
  margin:0;
  min-width:0;
  font-family:var(--font-display);
  font-size:clamp(28px, 3.3vw, 44px);
  font-weight:700;
  line-height:1.08;
  letter-spacing:-.02em;
  color:var(--text-strong);
  text-wrap:balance;
  overflow-wrap:break-word;
  hyphens:auto;

  /* Optional: Überschrift läuft neben der Liste mit.
     80px = Headerhöhe. Einkommentieren, wenn gewünscht:
  position:sticky;
  top:calc(80px + 24px);
  */
}

.sw-faq__list{ min-width:0; }

/* ============================================================
   Eintrag
   ============================================================ */

/* Eine Klasse statt zwei — der Abschlussrahmen kommt aus :last-child */
.sw-faq__item{
  min-width:0;
  border-top:1px solid var(--grey-200);
}

.sw-faq__item:last-child{
  border-bottom:1px solid var(--grey-200);
}

.sw-faq__toggle{
  display:flex;
  text-wrap: wrap;
  align-items:center;
  justify-content:space-between;
  gap:clamp(16px, 3vw, 32px);
  width:100%;
  padding:clamp(18px, 2.4vw, 24px) 0;
  border:0;
  background:none;
  cursor:pointer;
  font:inherit;
  text-align:left;
  color:var(--text-strong);
}

/* Fehlte komplett — die Buttons waren per Tastatur unsichtbar */
.sw-faq__toggle:focus-visible{
  outline:2px solid var(--cyan-600);
  outline-offset:-2px;
}

@media (hover:hover){
  .sw-faq__toggle:hover .sw-faq__question{ color:var(--cyan-600); }
}

.sw-faq__question{
  min-width:0;
  font-family:var(--font-display);
  font-size:clamp(19px, 2vw, 27px);
  font-weight:700;
  line-height:1.15;
  letter-spacing:-.01em;
  overflow-wrap:break-word;
  hyphens:auto;
  transition:color .18s ease;
}

.sw-faq__icon-wrap{
  display:flex;
  align-items:center;
  flex:none;
  color:var(--cyan-600);
  transition:transform .18s ease;
}

/* Plus wird zum × — funktioniert, sobald das Skript aria-expanded
   oder .is-open setzt. Ohne beides bleibt es einfach ein Plus. */
.sw-faq__toggle[aria-expanded="true"] .sw-faq__icon-wrap,
.sw-faq__toggle.is-open .sw-faq__icon-wrap{
  transform:rotate(45deg);
}

.sw-faq__icon{
  width:20px;
  height:20px;
}

/* ============================================================
   Antwort
   ============================================================ */

.sw-faq__panel[hidden]{ display:none; }

.sw-faq__answer{
  margin:0;
  min-width:0;
  max-width:70ch;
  padding:0 clamp(0px, 6vw, 80px) clamp(20px, 2.8vw, 28px) 0;
  font-size:clamp(15px, 1.25vw, 17px);
  line-height:1.62;
  overflow-wrap:break-word;
  hyphens:auto;
}

/* ============================================================
   Breakpoints
   ============================================================ */

@media (max-width:900px){
  .sw-faq__inner{ grid-template-columns:minmax(0, 1fr); }
  .sw-faq__title{ position:static; }
}

@media (prefers-reduced-motion:reduce){
  .sw-faq__question,
  .sw-faq__icon-wrap{ transition:none; }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-ce00de1 *//* StikmaWork one-pager · Sektion: trust
   Voraussetzung: 00-stikmawork-base.css (Tokens, .sw-stat)

   Container: gleiche Shell wie der Header (max-width + --sw-pad),
   damit „35" exakt unter der Logokante steht — auf jeder Breite. */

/* ---------- Diese Tokens gehören nach 00-base.css ---------- */
/*
:root{
  --sw-shell:1280px;
  --sw-pad:clamp(16px, 4vw, 40px);
}
*/

.sw-trust,
.sw-trust *,
.sw-trust *::before,
.sw-trust *::after{ box-sizing:border-box; }

/* ---------- Shell ---------- */

.sw-trust{
  background:var(--navy-025);
  border-top:1px solid var(--border-subtle);
  border-bottom:1px solid var(--border-subtle);
}

.sw-trust__inner{
  width:100%;
  max-width:var(--sw-shell, 1280px);
  margin:0 auto;
  padding:clamp(40px, 6vw, 56px) var(--sw-pad, 40px);
}

/* ---------- Kennzahlen ---------- */

.sw-trust__stats{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));   /* minmax(0,…), sonst Überlauf */
  gap:clamp(20px, 2.6vw, 32px);
  align-items:start;
}

.sw-trust__stats > *{ min-width:0; }

/* Optional: falls .sw-stat__fig im Base eine feste px-Größe hat.
   Max-Wert an eure Basisgröße anpassen. */
.sw-trust__stats .sw-stat__fig{
  font-size:clamp(30px, 3.6vw, 48px);
  line-height:1;
}

.sw-trust__stats .sw-stat__label{
  overflow-wrap:break-word;
  hyphens:auto;                                       /* „Produktions- und Lagerfläche" */
  text-wrap:balance;
}

/* ---------- Logo-/Zertifikatsreihe ---------- */
/* Feste Spaltenzahl statt auto-fit: 6 → 3 → 2 teilt immer glatt auf,
   auto-fit lässt sonst eine einzelne Kachel in der letzten Reihe stehen. */

.sw-trust__logos{
  display:grid;
  grid-template-columns:repeat(6, minmax(0, 1fr));
  gap:clamp(12px, 1.4vw, 16px);
  margin-top:clamp(32px, 4.5vw, 48px);
}

.sw-trust__logo,
.sw-trust__cert{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-height:60px;
  padding:8px 12px;
  background:#fff;
  font-family:var(--font-mono);
  font-size:11px;
  line-height:1.35;
  text-align:center;
  overflow-wrap:break-word;
}

.sw-trust__logo{                                       /* Platzhalter */
  border:1px dashed var(--grey-200);
  letter-spacing:.08em;
  color:var(--grey-400);
}

.sw-trust__cert{
  border:1px solid var(--border-subtle);
  letter-spacing:.06em;
  color:var(--text-muted);
}

/* Greift automatisch, sobald echte Kundenlogos die Platzhalter ersetzen */
.sw-trust__logo img,
.sw-trust__cert img{
  display:block;
  width:auto;
  max-width:100%;
  max-height:32px;
  object-fit:contain;
  filter:grayscale(1);
  opacity:.7;
  transition:opacity .18s ease, filter .18s ease;
}

.sw-trust__logo:hover img{
  filter:grayscale(0);
  opacity:1;
}

/* ---------- Breakpoints ---------- */

@media (max-width:900px){
  .sw-trust__stats{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .sw-trust__logos{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
}

@media (max-width:560px){
  .sw-trust__logos{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .sw-trust__logo,
  .sw-trust__cert{ min-height:54px; }
}

@media (max-width:380px){
  .sw-trust__stats{ grid-template-columns:minmax(0, 1fr); }
}

@media (prefers-reduced-motion:reduce){
  .sw-trust__logo img,
  .sw-trust__cert img{ transition:none; }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-8950263 *//* StikmaWork one-pager · Sektion: anfrage
   Voraussetzung: 00-stikmawork-base.css (Tokens, .sw-eyebrow, .sw-btn,
   .sw-field, .sw-input, .sw-select, .sw-textarea, .sw-req, .sw-icon)
   Für hyphens:auto muss <html lang="de"> gesetzt sein. */

.sw-anfrage,
.sw-anfrage *,
.sw-anfrage *::before,
.sw-anfrage *::after{ box-sizing:border-box; }

/* ============================================================
   Shell
   ============================================================ */

.sw-anfrage{
  --an-shell:var(--sw-shell, 1280px);
  --an-pad:var(--sw-pad, clamp(16px, 4vw, 40px));

  background:var(--navy-025);
  border-top:1px solid var(--border-subtle);
  padding:clamp(56px, 8vw, 104px) 0;
}

.sw-anfrage__inner{
  width:100%;
  max-width:var(--an-shell);
  margin:0 auto;
  padding:0 var(--an-pad);
  display:grid;
  grid-template-columns:minmax(0, .85fr) minmax(0, 1.15fr);
  gap:clamp(32px, 5vw, 80px);
  align-items:start;
}

/* ============================================================
   Textspalte
   ============================================================ */

.sw-anfrage__copy{
  display:flex;
  flex-direction:column;
  gap:clamp(18px, 2.2vw, 24px);
  min-width:0;
}

.sw-anfrage__title{
  margin:0;
  font-family:var(--font-display);
  font-size:clamp(28px, 3.3vw, 44px);
  font-weight:700;
  line-height:1.08;
  letter-spacing:-.02em;
  color:var(--text-strong);
  text-wrap:balance;
  overflow-wrap:break-word;
  hyphens:auto;
}

.sw-anfrage__text{
  margin:0;
  min-width:0;
  font-size:clamp(15px, 1.25vw, 17px);
  line-height:1.62;
  overflow-wrap:break-word;
  hyphens:auto;
}

.sw-anfrage__note{
  margin:0;
  min-width:0;
  font-size:clamp(15px, 1.25vw, 17px);
  font-weight:600;
  line-height:1.62;
  color:var(--text-strong);
}

.sw-anfrage__contact{
  display:flex;
  flex-direction:column;
  gap:8px;
  padding-top:clamp(18px, 2.2vw, 24px);
  border-top:1px solid var(--border-subtle);
  font-family:var(--font-mono);
  font-size:13px;
  color:var(--text-muted);
  overflow-wrap:break-word;
}

.sw-anfrage__phone{ color:var(--text-strong); }

/* ============================================================
   Formularkarte
   ============================================================ */

.sw-anfrage__card{
  min-width:0;
  padding:clamp(20px, 3vw, 40px);
  background:#fff;
  border:1px solid var(--border-subtle);
  border-top:6px solid var(--cyan-500);
  border-radius:4px;
  box-shadow:var(--shadow-sm);
}

.sw-anfrage__form{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:clamp(14px, 1.8vw, 20px);
}

.sw-anfrage__form > *{ min-width:0; }

.sw-anfrage__full{ grid-column:span 2; }

/* Felder dürfen nie breiter werden als ihre Spalte */
.sw-anfrage__form .sw-input,
.sw-anfrage__form .sw-select,
.sw-anfrage__form .sw-textarea{
  width:100%;
  max-width:100%;
}

.sw-anfrage__form .sw-textarea{
  resize:vertical;
  min-height:110px;
}

.sw-anfrage__submit{
  grid-column:span 2;
  display:flex;
  flex-direction:column;
  gap:16px;
  margin-top:4px;
}

.sw-anfrage__submit .sw-btn{
  max-width:100%;
  white-space:normal;
  text-align:center;
  justify-content:center;
}

.sw-anfrage__disclaimer{
  margin:0;
  font-family:var(--font-mono);
  font-size:12px;
  line-height:1.6;
  letter-spacing:.02em;
  text-transform:uppercase;
  color:var(--text-muted);
  overflow-wrap:break-word;
}

/* ============================================================
   Bestätigung
   ============================================================ */

.sw-thanks[hidden]{ display:none; }

.sw-anfrage__thanks{
  display:flex;
  flex-direction:column;
  gap:clamp(18px, 2.2vw, 24px);
  min-width:0;
  padding:clamp(16px, 2.4vw, 24px) 0;
}

.sw-anfrage__thanks-icon-wrap{
  display:flex;
  flex:none;
  color:var(--cyan-500);
}

.sw-anfrage__thanks-icon{
  width:40px;
  height:40px;
}

/* War 44px wie die H2 der Sektion — in einer Karte zu laut */
.sw-anfrage__thanks-title{
  margin:0;
  font-family:var(--font-display);
  font-size:clamp(24px, 2.6vw, 34px);
  font-weight:700;
  line-height:1.1;
  letter-spacing:-.02em;
  color:var(--text-strong);
  text-wrap:balance;
  overflow-wrap:break-word;
  hyphens:auto;
}

.sw-anfrage__thanks-text{
  margin:0;
  min-width:0;
  max-width:60ch;
  font-size:clamp(15px, 1.25vw, 17px);
  line-height:1.62;
  overflow-wrap:break-word;
  hyphens:auto;
}

.sw-anfrage__thanks-actions{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:16px;
}

.sw-anfrage__thanks-actions .sw-btn{
  max-width:100%;
  white-space:normal;
  text-align:center;
  justify-content:center;
}

.sw-anfrage__linkbtn{
  padding:0 0 2px;
  border:0;
  border-bottom:1px solid currentColor;
  background:none;
  cursor:pointer;
  font:inherit;
  font-size:15px;
  font-weight:600;
  color:var(--cyan-600);
  transition:color .18s ease;
}

.sw-anfrage__linkbtn:focus-visible{
  outline:2px solid var(--cyan-600);
  outline-offset:3px;
}

@media (hover:hover){
  .sw-anfrage__linkbtn:hover{ color:var(--text-strong); }
}

/* ============================================================
   Breakpoints
   ============================================================ */

@media (max-width:960px){
  .sw-anfrage__inner{ grid-template-columns:minmax(0, 1fr); }
  .sw-anfrage__copy{ max-width:70ch; }
}

@media (max-width:560px){
  .sw-anfrage__form{ grid-template-columns:minmax(0, 1fr); }

  /* Pflicht: span 2 erzeugt im Einspalter eine implizite zweite Spalte */
  .sw-anfrage__full,
  .sw-anfrage__submit{ grid-column:auto; }

  .sw-anfrage__thanks-actions{ align-items:stretch; }
  .sw-anfrage__thanks-actions .sw-btn{ width:100%; }
}

@media (prefers-reduced-motion:reduce){
  .sw-anfrage__linkbtn{ transition:none; }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-54d9f7e *//* StikmaWork one-pager · Sektion: trust
   Voraussetzung: 00-stikmawork-base.css (Tokens, .sw-stat)

   Container: gleiche Shell wie der Header (max-width + --sw-pad),
   damit „35" exakt unter der Logokante steht — auf jeder Breite. */

/* ---------- Diese Tokens gehören nach 00-base.css ---------- */
/*
:root{
  --sw-shell:1280px;
  --sw-pad:clamp(16px, 4vw, 40px);
}
*/

.sw-trust,
.sw-trust *,
.sw-trust *::before,
.sw-trust *::after{ box-sizing:border-box; }

/* ---------- Shell ---------- */

.sw-trust{
  background:var(--navy-025);
  border-top:1px solid var(--border-subtle);
  border-bottom:1px solid var(--border-subtle);
}

.sw-trust__inner{
  width:100%;
  max-width:var(--sw-shell, 1280px);
  margin:0 auto;
  padding:clamp(40px, 6vw, 56px) var(--sw-pad, 40px);
}

/* ---------- Kennzahlen ---------- */

.sw-trust__stats{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));   /* minmax(0,…), sonst Überlauf */
  gap:clamp(20px, 2.6vw, 32px);
  align-items:start;
}

.sw-trust__stats > *{ min-width:0; }

/* Optional: falls .sw-stat__fig im Base eine feste px-Größe hat.
   Max-Wert an eure Basisgröße anpassen. */
.sw-trust__stats .sw-stat__fig{
  font-size:clamp(30px, 3.6vw, 48px);
  line-height:1;
}

.sw-trust__stats .sw-stat__label{
  overflow-wrap:break-word;
  hyphens:auto;                                       /* „Produktions- und Lagerfläche" */
  text-wrap:balance;
}

/* ---------- Logo-/Zertifikatsreihe ---------- */
/* Feste Spaltenzahl statt auto-fit: 6 → 3 → 2 teilt immer glatt auf,
   auto-fit lässt sonst eine einzelne Kachel in der letzten Reihe stehen. */

.sw-trust__logos{
  display:grid;
  grid-template-columns:repeat(6, minmax(0, 1fr));
  gap:clamp(12px, 1.4vw, 16px);
  margin-top:clamp(32px, 4.5vw, 48px);
}

.sw-trust__logo,
.sw-trust__cert{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-height:60px;
  padding:8px 12px;
  background:#fff;
  font-family:var(--font-mono);
  font-size:11px;
  line-height:1.35;
  text-align:center;
  overflow-wrap:break-word;
}

.sw-trust__logo{                                       /* Platzhalter */
  border:1px dashed var(--grey-200);
  letter-spacing:.08em;
  color:var(--grey-400);
}

.sw-trust__cert{
  border:1px solid var(--border-subtle);
  letter-spacing:.06em;
  color:var(--text-muted);
}

/* Greift automatisch, sobald echte Kundenlogos die Platzhalter ersetzen */
.sw-trust__logo img,
.sw-trust__cert img{
  display:block;
  width:auto;
  max-width:100%;
  max-height:32px;
  object-fit:contain;
  filter:grayscale(1);
  opacity:.7;
  transition:opacity .18s ease, filter .18s ease;
}

.sw-trust__logo:hover img{
  filter:grayscale(0);
  opacity:1;
}

/* ---------- Breakpoints ---------- */

@media (max-width:900px){
  .sw-trust__stats{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .sw-trust__logos{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
}

@media (max-width:560px){
  .sw-trust__logos{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .sw-trust__logo,
  .sw-trust__cert{ min-height:54px; }
}

@media (max-width:380px){
  .sw-trust__stats{ grid-template-columns:minmax(0, 1fr); }
}

@media (prefers-reduced-motion:reduce){
  .sw-trust__logo img,
  .sw-trust__cert img{ transition:none; }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-71fee59 *//* StikmaWork one-pager · Sektion: footer
   Voraussetzung: 00-stikmawork-base.css (Tokens, .sw-eyebrow)
   Für hyphens:auto muss <html lang="de"> gesetzt sein. */

.sw-footer,
.sw-footer *,
.sw-footer *::before,
.sw-footer *::after{ box-sizing:border-box; }

/* ============================================================
   Shell
   ============================================================ */

.sw-footer{
  --ft-shell:var(--sw-shell, 1280px);
  --ft-pad:var(--sw-pad, clamp(16px, 4vw, 40px));

  background:var(--navy-700);
  color:#fff;
  padding:clamp(48px, 6vw, 80px) 0 clamp(24px, 3vw, 32px);
}

.sw-footer__inner{
  width:100%;
  max-width:var(--ft-shell);
  margin:0 auto;
  padding:0 var(--ft-pad);
}

/* ============================================================
   Spalten
   ============================================================ */

.sw-footer__cols{
  display:grid;
  grid-template-columns:minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.1fr);
  gap:clamp(28px, 4vw, 48px);
}

.sw-footer__col{ min-width:0; }

/* Eine Klasse für beide Listen — der Kontaktblock setzt nur den gap höher */
.sw-footer__list{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-top:20px;
  min-width:0;
  font-size:15px;
  line-height:1.45;
  color:var(--navy-100);
  overflow-wrap:break-word;
  hyphens:auto;              /* „Kommissionierung", „Lebensmittelindustrie" */
}

.sw-footer__list--contact{ gap:12px; }

.sw-footer__strong{
  font-family:var(--font-mono);
  font-size:13px;
  color:#fff;
}

.sw-footer__meta{
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.04em;
  text-transform:uppercase;
}

/* Greift automatisch, sobald aus den <span> echte Links werden */
.sw-footer__list a{
  color:inherit;
  text-decoration:none;
  transition:color .18s ease;
}

.sw-footer__list a:hover,
.sw-footer__list a:focus-visible{ color:#fff; }

/* ============================================================
   Fußzeile
   ============================================================ */

.sw-footer__bottom{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:clamp(16px, 2.4vw, 24px);
  margin-top:clamp(36px, 5vw, 64px);
  padding-top:clamp(20px, 2.6vw, 28px);
  border-top:1px solid rgba(255, 255, 255, .18);
}

/* Höhe steuert, Breite folgt — sonst verzerrt das Wortmarken-PNG */
.sw-footer__logo{
  display:block;
  height:22px;
  width:auto;
  max-width:100%;
  flex:0 0 auto;
  object-fit:contain;
}

.sw-footer__legal{
  display:flex;
  flex-wrap:wrap;
  gap:clamp(12px, 1.6vw, 20px);
  min-width:0;
  font-size:13px;
  color:var(--navy-100);
}

.sw-footer__legal a{
  color:inherit;
  text-decoration:none;
  transition:color .18s ease;
}

.sw-footer__legal a:hover,
.sw-footer__legal a:focus-visible{ color:#fff; }

.sw-footer__certs{
  display:flex;
  flex-wrap:wrap;
  gap:clamp(12px, 1.6vw, 20px);
  min-width:0;
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--navy-100);
}

/* ============================================================
   Breakpoints
   ============================================================ */

@media (max-width:900px){
  .sw-footer__cols{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
}

@media (max-width:560px){
  .sw-footer__cols{ grid-template-columns:minmax(0, 1fr); }

  .sw-footer__bottom{
    flex-direction:column;
    align-items:flex-start;
  }
}

@media (prefers-reduced-motion:reduce){
  .sw-footer__list a,
  .sw-footer__legal a{ transition:none; }
}/* End custom CSS */