/**
 * ITSecure Template – modules.css
 * Styles für alle Custom-Module
 * Farbschema: Orange (#E8570C) + Dunkelblau (#0E3D6B)
 */

/* ═══════════════════════════════════════════════════════
   HERO MODUL
═══════════════════════════════════════════════════════ */
.hero-wrap {
  position:relative; padding:120px 5.5% 80px; overflow:hidden;
  max-width:var(--container); margin:0 auto;
  background:var(--clr-bg);
}
/* Hintergrund-Blobs */
.hero-blob {
  position:absolute; top:-140px; right:-80px;
  width:560px; height:560px; pointer-events:none;
  background:radial-gradient(circle, rgba(var(--clr-primary-rgb),.04) 0%, transparent 65%);
}
.hero-blob-2 {
  position:absolute; bottom:-80px; left:-60px;
  width:380px; height:380px; pointer-events:none;
  background:radial-gradient(circle, rgba(var(--clr-secondary-rgb, 14,61,107),.03) 0%, transparent 65%);
}
/* Hero-Layout */
.hero-inner {
  position:relative; z-index:2;
  max-width:var(--container); margin:0 auto;
}

/* Style 1: Zentriert (hero-centered) */
.hero-centered .hero-inner { text-align:center; }
.hero-centered .hero-content { max-width:800px; margin:0 auto; }
.hero-centered .hero-badge { margin:0 auto 24px; }
.hero-centered .hero-lead { margin:0 auto 36px; }
.hero-centered .hero-btns { justify-content:center; }

/* Style 2: Links mit Akzent-Linie (hero-left) */
.hero-left .hero-inner { text-align:left; }
.hero-left .hero-content { max-width:700px; padding-left:28px; border-left:4px solid var(--clr-primary); }
.hero-left .hero-badge { margin-bottom:24px; }
.hero-left .hero-lead { margin-bottom:36px; }
.hero-left .hero-btns { justify-content:flex-start; }


/* Badge */
.hero-badge {
  display:inline-flex; align-items:center; gap:7px;
  background:rgba(var(--clr-primary-rgb),.05);
  border:1px solid rgba(var(--clr-primary-rgb),.12);
  border-radius:100px; padding:5px 15px;
  font-size:.76rem; font-weight:600; color:var(--clr-primary);
  letter-spacing:.06em; text-transform:uppercase; margin:0 auto 24px;
  animation:fadeUp .7s ease both;
}
.badge-pulse {
  width:7px; height:7px; background:var(--clr-primary);
  border-radius:50%; flex-shrink:0;
  animation:pulse 2s ease-in-out infinite;
}
@keyframes pulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.35;transform:scale(.7)} }

/* Headline */
.hero-content h1 {
  font-size:clamp(2.3rem,3.8vw,3.5rem); font-weight:800;
  line-height:1.1; letter-spacing:-.03em; color:var(--clr-text);
  margin-bottom:20px; animation:fadeUp .7s ease .1s both;
}
.hero-content h1 em {
  font-style:italic; font-family:var(--font-accent);
  font-weight:600; color:var(--clr-primary);
}
.hero-lead {
  font-size:1.02rem; color:var(--clr-text-muted);
  line-height:1.78; max-width:580px; margin:0 auto 36px;
  animation:fadeUp .7s ease .2s both;
}
.hero-btns { display:flex; gap:12px; flex-wrap:wrap; justify-content:center; animation:fadeUp .7s ease .3s both; }

@keyframes fadeUp { from{opacity:0;transform:translateY(24px)} to{opacity:1;transform:translateY(0)} }

/* Hero Visual */
.hero-visual { animation:fadeLeft .9s ease .15s both; }
@keyframes fadeLeft { from{opacity:0;transform:translateX(32px)} to{opacity:1;transform:translateX(0)} }

.hero-card-wrap { position:relative; height:415px; }
.hero-card {
  position:absolute; background:var(--clr-surface);
  border:1px solid var(--clr-border); border-radius:18px;
  box-shadow:var(--shadow-md);
}
.hc-main   { top:0; left:0; right:0; padding:26px; }
.hc-float1 { bottom:64px; right:-14px; width:185px; padding:15px 17px; animation:float1 4s ease-in-out infinite; }
.hc-float2 { bottom:0; left:14px; width:168px; padding:13px 15px; animation:float2 5s ease-in-out infinite; }
@keyframes float1 { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-10px)} }
@keyframes float2 { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-7px)} }

.card-head { display:flex; align-items:center; gap:11px; margin-bottom:20px; }
.card-ico  { width:38px; height:38px; background:rgba(var(--clr-primary-rgb),.10); border-radius:9px; display:grid; place-items:center; font-size:1rem; flex-shrink:0; }
.card-title { font-weight:700; font-size:.92rem; color:var(--clr-text); }
.card-sub   { font-size:.73rem; color:var(--clr-text-pale); margin-top:1px; }

/* Meter Bars */
.meter-group { display:flex; flex-direction:column; gap:10px; }
.meter-top  { display:flex; justify-content:space-between; font-size:.76rem; margin-bottom:4px; }
.meter-top span:first-child { color:var(--clr-text-mid); font-weight:500; }
.meter-top span:last-child  { color:var(--clr-primary); font-weight:700; }
.meter-bar  { height:7px; background:var(--clr-bg-soft); border-radius:100px; overflow:hidden; }
.meter-fill { height:100%; border-radius:100px; background:linear-gradient(90deg,var(--clr-primary),rgba(var(--clr-primary-rgb),.6)); }

/* Stats Row */
.card-stats { display:flex; gap:9px; margin-top:16px; }
.cstat { flex:1; background:var(--clr-bg); border-radius:8px; padding:10px; text-align:center; border:1px solid var(--clr-border-light); }
.cstat-n { font-weight:800; font-size:1.1rem; color:var(--clr-primary); display:block; }
.cstat-l { font-size:.67rem; color:var(--clr-text-pale); }

/* Float Cards */
.float-ico  { width:32px; height:32px; border-radius:8px; background:rgba(14,61,107,.10); display:grid; place-items:center; font-size:.9rem; margin-bottom:7px; }
.float-name { font-size:.78rem; font-weight:700; color:var(--clr-text); margin-bottom:1px; }
.float-desc { font-size:.7rem; color:var(--clr-text-muted); }
.status-pill { display:inline-flex; align-items:center; gap:4px; margin-top:7px; padding:3px 9px; border-radius:100px; font-size:.68rem; font-weight:600; background:#EDFAF3; color:#1A9E5A; border:1px solid rgba(26,158,90,.2); }
.status-pill::before { content:'●'; font-size:.45rem; }

/* ═══════════════════════════════════════════════════════
   TRUST BAR MODUL
═══════════════════════════════════════════════════════ */
.trust-bar { max-width:var(--container); margin:0 auto; padding:26px 5.5%; display:flex; justify-content:center; align-items:center; gap:40px; flex-wrap:wrap; }
.trust-item { display:flex; align-items:center; gap:12px; }
.trust-item + .trust-item { padding-left:20px; border-left:1px solid var(--clr-border); }
.trust-icon { width:42px; height:42px; background:rgba(var(--clr-primary-rgb),.10); border-radius:9px; display:grid; place-items:center; font-size:1.05rem; flex-shrink:0; }
.trust-num  { font-weight:800; font-size:1.45rem; color:var(--clr-secondary); line-height:1; letter-spacing:-.02em; }
.trust-desc { font-size:.76rem; color:var(--clr-text-muted); margin-top:1px; }

/* ═══════════════════════════════════════════════════════
   TOPICS OVERVIEW MODUL
═══════════════════════════════════════════════════════ */
.topics-inner { padding:0 5.5%; max-width:var(--container); margin:0 auto; }
.topics-grid  { display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
.topic-card   {
  border-radius:20px; padding:32px 28px;
  border:1.5px solid transparent;
  transition:transform .3s, box-shadow .3s;
  position:relative; overflow:hidden; cursor:pointer;
}
.topic-card::after { content:''; position:absolute; bottom:0; right:0; width:80px; height:80px; border-radius:50%; background:currentColor; opacity:.06; transform:translate(20px,20px); }
.topic-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-lg); }
a.topic-card { text-decoration:none; color:inherit; cursor:pointer; display:flex; flex-direction:column; }

/* Farbvarianten – nutzen CSS-Variable aus templateDetails */
.tc-1 { background:rgba(var(--clr-primary-rgb),.08);   color:var(--clr-topic1); border-color:rgba(var(--clr-primary-rgb),.18); }
.tc-2 { background:rgba(var(--clr-secondary-rgb),.08); color:var(--clr-topic2); border-color:rgba(var(--clr-secondary-rgb),.18); }
.tc-3 { background:#EDFAF3; color:var(--clr-topic3); border-color:rgba(26,158,90,.18); }
.tc-4 { background:#F3EEFF; color:var(--clr-topic4); border-color:rgba(124,58,237,.18); }

.tc-num  { font-size:.72rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; opacity:.55; margin-bottom:20px; }
.tc-icon { font-size:2rem; margin-bottom:14px; display:block; }
.topic-card h3 { font-size:1.05rem; font-weight:800; color:var(--clr-text); letter-spacing:-.02em; margin-bottom:10px; }
.topic-card p  { font-size:.84rem; color:var(--clr-text-mid); line-height:1.65; margin-bottom:18px; }
.tc-items { display:flex; flex-direction:column; gap:7px; }
.tc-item  { display:flex; align-items:center; gap:8px; font-size:.8rem; color:var(--clr-text-mid); font-weight:500; }
.tc-dot   { width:5px; height:5px; border-radius:50%; flex-shrink:0; background:currentColor; }
.tc-link  { display:inline-flex; align-items:center; gap:5px; margin-top:18px; font-size:.8rem; font-weight:600; text-decoration:none; transition:gap .2s; color:currentColor; }
.tc-link:hover { gap:9px; }

/* ═══════════════════════════════════════════════════════
   DETAIL-SEKTIONEN – gemeinsame Stile
═══════════════════════════════════════════════════════ */
.det-inner {
  max-width:var(--container); margin:0 auto; padding:0 5.5%;
  display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:center;
}
.det-inner:not(:has(.det-visual)) {
  grid-template-columns:1fr;
}
.det-inner:not(:has(.det-visual)) .service-list {
  grid-template-columns:repeat(3, 1fr);
}
.det-inner.layout-flip { direction:rtl; }
.det-inner.layout-flip > * { direction:ltr; }

.det-label {
  display:inline-flex; align-items:center; gap:8px;
  border-radius:100px; padding:5px 14px;
  font-size:.72rem; font-weight:700;
  letter-spacing:.08em; text-transform:uppercase;
  margin-bottom:16px; border:1px solid transparent;
}
.det-content h2 {
  font-size:clamp(1.55rem,2.3vw,2.2rem); font-weight:800;
  color:var(--clr-text); letter-spacing:-.03em; line-height:1.18; margin-bottom:14px;
}
.det-content h2 em { font-style:italic; font-family:var(--font-accent); font-weight:600; }
.det-lead { font-size:.93rem; color:var(--clr-text-muted); line-height:1.78; margin-bottom:28px; }

/* Service-Liste (2-spaltig) */
.service-list { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:28px; }
.sl-item {
  background:var(--clr-bg); border:1.5px solid var(--clr-border-light);
  border-radius:10px; padding:12px 14px;
  display:flex; align-items:flex-start; gap:10px;
  transition:border-color .2s, box-shadow .2s;
}
.sl-item:hover { border-color:rgba(var(--clr-primary-rgb),.3); box-shadow:var(--shadow-sm); }
a.sl-link, a.sl-link:hover, a.sl-link:visited { text-decoration:none !important; cursor:pointer; color:inherit; }
a.sl-link:hover .sl-name { color:var(--clr-primary); }
a.sl-link::after { content:'→'; position:absolute; right:14px; top:50%; transform:translateY(-50%); color:var(--clr-primary); opacity:0; transition:opacity .2s; font-size:.85rem; }
a.sl-link { position:relative; padding-right:36px; }
a.sl-link:hover::after { opacity:1; }
.det-btn-row { display:flex; justify-content:flex-end; margin-top:4px; }
.sl-ico  { font-size:1.05rem; flex-shrink:0; margin-top:1px; }
.sl-name { font-size:.83rem; font-weight:600; color:var(--clr-text); margin-bottom:2px; }
.sl-desc { font-size:.75rem; color:var(--clr-text-muted); line-height:1.5; }

/* Visual-Box (rechte Seite) */
.dv-box {
  background:var(--clr-surface); border:1.5px solid var(--clr-border-light);
  border-radius:20px; padding:28px; box-shadow:var(--shadow-md);
  position:relative; overflow:hidden;
}
.dv-head { display:flex; align-items:center; gap:10px; margin-bottom:20px; }
.dv-ico  { width:40px; height:40px; border-radius:10px; display:grid; place-items:center; font-size:1.1rem; flex-shrink:0; }
.dv-title { font-weight:700; font-size:.9rem; color:var(--clr-text); }
.dv-sub   { font-size:.73rem; color:var(--clr-text-pale); margin-top:1px; }

/* ──────────────────────────────
   IT-SICHERHEIT Visual: Checks
────────────────────────────── */
.sec-checks { display:flex; flex-direction:column; gap:8px; }
.sc-row     { display:flex; align-items:center; gap:10px; background:var(--clr-bg); border:1px solid var(--clr-border-light); border-radius:9px; padding:10px 13px; }
.sc-check   { width:22px; height:22px; border-radius:50%; display:grid; place-items:center; font-size:.65rem; font-weight:700; flex-shrink:0; }
.sc-check.ok   { background:#EDFAF3; color:#1A9E5A; border:1px solid rgba(26,158,90,.2); }
.sc-check.warn { background:#FFF6E0; color:#B07D00; border:1px solid rgba(176,125,0,.2); }
.sc-label { font-size:.8rem; color:var(--clr-text-mid); font-weight:500; }
.sc-badge { margin-left:auto; font-size:.68rem; font-weight:600; padding:2px 9px; border-radius:100px; white-space:nowrap; }
.sc-badge.ok   { background:#EDFAF3; color:#1A9E5A; }
.sc-badge.warn { background:#FFF6E0; color:#B07D00; }
.sc-badge.info { background:rgba(var(--clr-secondary-rgb),.10); color:var(--clr-secondary); }

/* ──────────────────────────────
   IT-LÖSUNGEN Visual: Grid
────────────────────────────── */
.sol-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.sv-card  { background:var(--clr-bg); border:1px solid var(--clr-border-light); border-radius:10px; padding:14px; text-align:center; transition:border-color .2s; }
.sv-card:hover { border-color:rgba(var(--clr-secondary-rgb),.3); }
.svc-icon { font-size:1.4rem; margin-bottom:6px; }
.svc-name { font-size:.78rem; font-weight:600; color:var(--clr-text); }
.svc-stat { font-size:.7rem; color:var(--clr-text-pale); margin-top:2px; }

/* ──────────────────────────────
   IT-STRATEGIE Visual: Steps
────────────────────────────── */
.str-steps { display:flex; flex-direction:column; }
.str-step  { display:flex; gap:14px; position:relative; }
.str-step:not(:last-child)::after { content:''; position:absolute; left:15px; top:36px; bottom:-12px; width:2px; background:linear-gradient(to bottom,rgba(26,158,90,.3),transparent); }
.ss-num   { width:32px; height:32px; border-radius:50%; background:#EDFAF3; border:1.5px solid rgba(26,158,90,.25); display:grid; place-items:center; font-size:.75rem; font-weight:700; color:var(--clr-topic3); flex-shrink:0; margin-top:2px; }
.ss-body  { padding-bottom:18px; }
.ss-title { font-size:.85rem; font-weight:700; color:var(--clr-text); margin-bottom:3px; }
.ss-desc  { font-size:.78rem; color:var(--clr-text-muted); line-height:1.55; }

/* ──────────────────────────────
   SOFTWARE Visual: Mockup
────────────────────────────── */
.sw-mockup   { background:var(--clr-bg); border:1.5px solid var(--clr-border); border-radius:12px; overflow:hidden; box-shadow:var(--shadow-sm); }
.sw-titlebar { background:var(--clr-surface); padding:10px 14px; display:flex; align-items:center; gap:6px; border-bottom:1px solid var(--clr-border-light); }
.sw-dot { width:10px; height:10px; border-radius:50%; }
.sw-dot.r{background:#FF5F57} .sw-dot.y{background:#FFBD2E} .sw-dot.g{background:#28C840}
.sw-titlebar-label { margin-left:8px; font-size:.7rem; color:var(--clr-text-pale); }
.sw-rows { padding:12px 14px; display:flex; flex-direction:column; gap:7px; }
.sw-row  { background:var(--clr-surface); border:1px solid var(--clr-border-light); border-radius:7px; padding:9px 12px; display:flex; align-items:center; gap:9px; }
.sw-line { height:7px; background:var(--clr-bg-soft); border-radius:4px; flex:1; }
.sw-pill { padding:2px 9px; border-radius:100px; font-size:.63rem; font-weight:700; white-space:nowrap; }
.sw-pill.done { background:#EDFAF3; color:#1A9E5A; }
.sw-pill.wip  { background:#FFF6E0; color:#B07D00; }
.sw-pill.new  { background:rgba(var(--clr-primary-rgb),.10); color:var(--clr-primary); }
.sw-pill.dev  { background:#F3EEFF; color:var(--clr-topic4); }
.sw-chart { display:flex; gap:5px; align-items:flex-end; padding:8px 14px 12px; height:58px; }
.sw-bar   { flex:1; border-radius:4px 4px 0 0; background:var(--clr-bg-soft); }
.sw-bar.hi  { background:var(--clr-topic4); opacity:.55; }
.sw-bar.mid { background:var(--clr-topic4); opacity:.3; }

/* ═══════════════════════════════════════════════════════
   KONTAKTFORMULAR
═══════════════════════════════════════════════════════ */
/* Zwei-Spalten-Layout */
.kontakt-layout {
  display:grid; grid-template-columns:280px 1fr; gap:56px;
  max-width:1100px; margin:0 auto; align-items:start;
}
.kontakt-info h3, .kontakt-formular h3 {
  font-size:1.05rem; font-weight:700; color:var(--clr-text);
  margin-bottom:24px; padding-bottom:12px;
  border-bottom:2px solid var(--clr-primary);
}
.kf-intro { font-size:.85rem; color:var(--clr-text-muted); line-height:1.7; margin-bottom:24px; }

/* Kontaktdaten (links) */
.kontakt-info { text-align:left; }
.ki-block { display:flex; align-items:flex-start; gap:14px; margin-bottom:28px; }
.ki-icon {
  width:36px; height:36px; min-width:36px; border-radius:10px;
  background:rgba(var(--clr-primary-rgb),.06);
  color:var(--clr-primary); display:grid; place-items:center; flex-shrink:0;
}
.ki-label { font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em; color:var(--clr-text-muted); margin-bottom:6px; }
.ki-block p { font-size:.88rem; color:var(--clr-text-mid); line-height:1.7; margin:0; }
.ki-block a { color:var(--clr-primary); text-decoration:none; }
.ki-block a:hover { text-decoration:underline; }

/* Formular (rechts) */
.kontakt-formular { background:var(--clr-bg); border:1px solid var(--clr-border-light); border-radius:var(--radius-lg); padding:36px; text-align:left; }
.kontakt-formular h3 { border-bottom:none; margin-bottom:8px; padding-bottom:0; }
.kontakt-form { max-width:none; margin:0; text-align:left; }
.kf-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.kf-field { margin-bottom:18px; }
.kf-field label {
  display:block; font-size:.82rem; font-weight:600; color:var(--clr-text);
  margin-bottom:6px;
}
.kf-req { color:var(--clr-primary); }
.kf-opt { font-weight:400; color:var(--clr-text-muted); font-size:.78rem; }
.kf-field input,
.kf-field textarea {
  width:100%; padding:12px 16px; font-size:.9rem; font-family:inherit;
  border:1.5px solid var(--clr-border-light); border-radius:var(--radius-md);
  background:var(--clr-surface); color:var(--clr-text);
  transition:border-color .2s, box-shadow .2s;
}
.kf-field input:focus,
.kf-field textarea:focus {
  outline:none; border-color:var(--clr-primary);
  box-shadow:0 0 0 3px rgba(var(--clr-primary-rgb),.1);
}
.kf-field input::placeholder,
.kf-field textarea::placeholder { color:var(--clr-text-pale); }
.kf-field textarea { resize:vertical; min-height:120px; }
.kf-check { margin:20px 0; text-align:left; }
.kf-check label {
  font-size:.82rem; color:var(--clr-text-mid); line-height:1.6; cursor:pointer;
}
.kf-check input[type="checkbox"] {
  width:14px; height:14px; margin-right:8px;
  accent-color:var(--clr-primary);
  vertical-align:middle;
}
.kf-check a { color:var(--clr-primary); text-decoration:underline; }
.kf-submit { margin-top:8px; }
.kf-submit .btn { width:100%; justify-content:center; padding:14px 24px; font-size:.95rem; }

/* Erfolgsmeldung */
.kontakt-success {
  text-align:center; padding:48px 24px;
  background:var(--clr-surface); border:1.5px solid rgba(26,158,90,.2);
  border-radius:var(--radius-lg);
}
.ks-icon {
  width:56px; height:56px; border-radius:50%;
  background:rgba(26,158,90,.1); color:#1A9E5A;
  display:grid; place-items:center; font-size:1.5rem; font-weight:700;
  margin:0 auto 16px;
}
.kontakt-success h3 { color:#1A9E5A; font-size:1.2rem; margin-bottom:8px; }
.kontakt-success p { color:var(--clr-text-mid); font-size:.92rem; }

/* Fehlermeldung */
.kontakt-error {
  background:rgba(220,38,38,.06); border:1px solid rgba(220,38,38,.2);
  border-radius:var(--radius-md); padding:12px 18px; margin-bottom:20px;
}
.kontakt-error p { color:#B91C1C; font-size:.85rem; margin:0; }

/* Responsive */
@media (max-width:768px) {
  .kontakt-layout { grid-template-columns:1fr; gap:32px; }
  .kontakt-formular { padding:24px; }
}
@media (max-width:480px) {
  .kf-row { grid-template-columns:1fr; }
}

/* ═══════════════════════════════════════════════════════
   CTA MODUL
═══════════════════════════════════════════════════════ */
.cta-box { max-width:var(--container); margin:0 auto; padding:0 5.5%; }
.cta-inner {
  background:linear-gradient(135deg, var(--cta-grad-start) 0%, var(--cta-grad-end) 100%);
  border-radius:22px; padding:60px 56px;
  display:grid; grid-template-columns:1fr auto; align-items:center; gap:36px;
  position:relative; overflow:hidden;
  box-shadow:0 20px 56px rgba(14,61,107,.25);
}
.cta-inner::before { content:''; position:absolute; top:-80px; right:80px; width:260px; height:260px; background:rgba(255,255,255,.07); border-radius:50%; }
.cta-inner::after  { content:''; position:absolute; bottom:-60px; left:200px; width:160px; height:160px; background:rgba(255,255,255,.05); border-radius:50%; }
.cta-text { position:relative; z-index:1; }
.cta-text h2 { font-size:clamp(1.45rem,2.2vw,2.1rem); font-weight:800; color:#fff; letter-spacing:-.03em; line-height:1.2; margin-bottom:9px; }
.cta-text p  { font-size:.93rem; color:rgba(255,255,255,.75); line-height:1.7; }
.cta-btns { display:flex; flex-direction:column; gap:10px; flex-shrink:0; position:relative; z-index:1; }

/* Kontaktformular unter CTA */
.pos-kontakt { padding:0 0 var(--section-y) 0; background:var(--clr-surface); border-top:1px solid var(--clr-border-light); }
.cta-form-section {
  max-width:var(--container); margin:0 auto; padding:60px 5.5% 0;
}
.cta-form-inner { max-width:640px; margin:0 auto; }
.cta-form-wide { max-width:1100px; margin:0 auto; }
.cta-form-section h2 {
  font-size:clamp(1.3rem,2vw,1.8rem); font-weight:800;
  color:var(--clr-text); margin-bottom:8px;
}
.cta-form-sub {
  font-size:.92rem; color:var(--clr-text-muted); margin-bottom:32px;
}
.cta-form-section .kontakt-form { text-align:left; }

/* ═══════════════════════════════════════════════════════
   RESPONSIVE MODULES
═══════════════════════════════════════════════════════ */
@media (max-width:1024px) {
  .topics-grid { grid-template-columns:1fr 1fr; }
  .det-inner { gap:48px; }
  .det-inner.layout-flip { direction:ltr; }
  .det-inner:not(:has(.det-visual)) .service-list { grid-template-columns:repeat(2, 1fr); }
  .hero-inner { gap:48px; }
}
@media (max-width:768px) {
  .hero-inner  { grid-template-columns:1fr; }
  .hero-visual { display:none; }
  .hero-wrap   { padding:100px 5.5% 56px; }
  .det-inner   { grid-template-columns:1fr; }
  .det-visual  { display:none; }
  .topics-grid { grid-template-columns:1fr 1fr; gap:14px; }
  .service-list { grid-template-columns:1fr; }
  .trust-bar   { gap:8px; }
  .trust-item + .trust-item { padding-left:12px; }
  .cta-inner   { grid-template-columns:1fr; padding:40px 32px; }
  .cta-btns    { flex-direction:row; flex-wrap:wrap; }
}
@media (max-width:480px) {
  .topics-grid { grid-template-columns:1fr; }
}