/* Branchen · Logistik / Transport · architecture "Zahlen & Tor": the numbers lead.
 * theme: existing brand (League Spartan via --font-family, #1e88e5 accent, dark navy #020b17/#030d1d/#041326/#041826)
 * Differs from every other Branchen page: stat hero (one very large monospace number instead of a panel),
 * horizontal KPI band, hand-built four-node attack chain with arrows, gate scenario with a real blockquote,
 * three-row incident ledger, classic process timeline (header left / steps right), arrow text list for modules,
 * two-column FAQ. No icon card grid, no report-preview mockup, no checkmark panel.
 */

/* ---------- Hero ---------- */
.lg-hero{background:#030d1d;padding:120px 0 100px;position:relative;overflow:hidden;}
.lg-hero::before{content:'';position:absolute;top:-200px;right:-200px;width:700px;height:700px;border-radius:50%;background:radial-gradient(circle,rgba(30,136,229,0.08) 0%,transparent 70%);pointer-events:none;}
.lg-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(30,136,229,0.12);border:1px solid rgba(30,136,229,0.3);border-radius:4px;padding:5px 14px;font-size:0.72rem;font-weight:700;letter-spacing:0.13em;text-transform:uppercase;color:#1e88e5;margin-bottom:1.5rem;}
.lg-badge svg{flex-shrink:0;}
.lg-h1{font-size:clamp(2.2rem,4.5vw,3.6rem);font-weight:800;letter-spacing:-0.03em;line-height:1.05;color:#fff;margin-bottom:1.5rem;overflow-wrap:anywhere;}
.lg-h1 .accent{color:#1e88e5;}
.lg-hero-text{font-size:1.05rem;line-height:1.75;color:rgba(255,255,255,0.75);max-width:580px;margin-bottom:2.5rem;}
.lg-cta-group{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;margin-bottom:3rem;}
.lg-btn-primary{display:inline-flex;align-items:center;gap:8px;background:#1e88e5;color:#fff !important;font-weight:700;font-size:0.9rem;padding:14px 28px;border-radius:6px;text-decoration:none !important;transition:background 0.2s,transform 0.15s,box-shadow 0.2s;box-shadow:0 4px 18px rgba(30,136,229,0.35);white-space:normal;}
.lg-btn-primary:hover{background:#0A3570;transform:translateY(-2px);box-shadow:0 8px 28px rgba(30,136,229,0.45);}
.lg-btn-primary:focus-visible{outline:2px solid #fff;outline-offset:3px;}
.lg-btn-secondary{display:inline-flex;align-items:center;gap:8px;color:rgba(255,255,255,0.75) !important;font-size:0.88rem;font-weight:500;text-decoration:none !important;padding:14px 0;border-bottom:1px solid rgba(255,255,255,0.25);transition:color 0.2s;}
.lg-btn-secondary:hover{color:#fff !important;}
.lg-btn-secondary:focus-visible{outline:2px solid #1e88e5;outline-offset:3px;}
.lg-trust-row{display:flex;align-items:center;gap:1.5rem;flex-wrap:wrap;}
.lg-trust-item{display:flex;align-items:center;gap:6px;font-size:0.78rem;font-weight:600;color:rgba(255,255,255,0.55);}
.lg-trust-item svg{color:#1e88e5;flex-shrink:0;}

/* Hero stat: no box, no border. One number, one label, one source line. */
.lg-herostat{padding-left:2.5rem;border-left:2px solid rgba(30,136,229,0.35);}
.lg-herostat-kicker{font-family:monospace;font-size:0.68rem;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;color:rgba(30,136,229,0.85);margin-bottom:0.75rem;}
.lg-herostat-num{font-family:monospace;font-weight:800;font-size:clamp(5rem,12vw,10.5rem);line-height:0.9;letter-spacing:-0.06em;color:#fff;margin:0 0 0.75rem -0.04em;}
.lg-herostat-num span{color:#1e88e5;font-size:0.42em;letter-spacing:-0.02em;margin-left:0.08em;}
.lg-herostat-label{font-size:clamp(1.05rem,1.6vw,1.3rem);font-weight:600;line-height:1.35;color:rgba(255,255,255,0.88);max-width:420px;margin:0 0 1rem;overflow-wrap:anywhere;}
.lg-herostat-src{font-family:monospace;font-size:0.7rem;line-height:1.5;color:rgba(255,255,255,0.4);max-width:440px;}

/* ---------- Shared section shell ---------- */
.section-dark{background:#020b17;padding:80px 0;}
.section-mid{background:#030d1d;padding:80px 0;}
.section-light{background:#041326;padding:80px 0;}
.lg-kicker{font-size:0.68rem;font-weight:700;letter-spacing:0.13em;text-transform:uppercase;color:#1e88e5;display:block;margin-bottom:0.6rem;}
.lg-h2{font-size:clamp(1.6rem,3vw,2.2rem);font-weight:800;color:#fff;letter-spacing:-0.02em;line-height:1.2;margin-bottom:1rem;overflow-wrap:anywhere;}
.lg-lead{font-size:0.95rem;color:rgba(255,255,255,0.55);line-height:1.7;max-width:680px;}
.lg-section-head{margin-bottom:2.75rem;}
.lg-arrow-link{display:inline-flex;align-items:center;gap:6px;color:#1e88e5 !important;font-size:0.84rem;font-weight:600;text-decoration:none !important;transition:color 0.2s,gap 0.2s;white-space:nowrap;}
.lg-arrow-link:hover{color:#5fb0f0 !important;gap:9px;}
.lg-arrow-link:focus-visible{outline:2px solid #1e88e5;outline-offset:3px;border-radius:2px;}
.lg-arrow-link-lg{font-size:0.95rem;}

/* ---------- 2. KPI band ---------- */
.lg-kpi-section{background:#020b17;padding:72px 0 80px;border-top:1px solid rgba(30,136,229,0.12);}
.lg-kpi-head{margin-bottom:2.25rem;}
.lg-kpi-band{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid rgba(255,255,255,0.1);border-bottom:1px solid rgba(255,255,255,0.1);}
.lg-kpi{padding:1.9rem 1.5rem 1.7rem;border-left:1px solid rgba(255,255,255,0.1);min-width:0;display:flex;flex-direction:column;}
.lg-kpi:first-child{border-left:none;padding-left:0;}
.lg-kpi-num{font-family:monospace;font-weight:800;font-size:clamp(2.4rem,4vw,3.4rem);line-height:1;letter-spacing:-0.04em;color:#fff;margin-bottom:0.85rem;white-space:nowrap;}
.lg-kpi-label{font-size:0.86rem;line-height:1.55;color:rgba(255,255,255,0.7);flex:1;overflow-wrap:anywhere;}
.lg-kpi-src{font-family:monospace;font-size:0.66rem;letter-spacing:0.02em;color:rgba(30,136,229,0.8);margin-top:1rem;padding-top:0.7rem;border-top:1px dashed rgba(255,255,255,0.1);overflow-wrap:anywhere;}
@media(max-width:991px){
  .lg-kpi-band{grid-template-columns:repeat(2,minmax(0,1fr));}
  .lg-kpi{padding:1.5rem 1.25rem;}
  .lg-kpi:first-child{padding-left:0;}
  .lg-kpi:nth-child(3){border-left:none;padding-left:0;}
  .lg-kpi:nth-child(n+3){border-top:1px solid rgba(255,255,255,0.1);}
}
@media(max-width:400px){
  .lg-kpi-num{font-size:1.7rem;letter-spacing:-0.05em;}
  .lg-kpi{padding:1.15rem 0.75rem;}
  .lg-kpi-label{font-size:0.8rem;}
}

/* ---------- 3. Attack chain ---------- */
.lg-chain{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr);align-items:stretch;gap:0;}
.lg-node{position:relative;background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.09);border-radius:12px;padding:1.5rem 1.4rem 1.4rem;min-width:0;display:flex;flex-direction:column;transition:border-color 0.2s,background 0.2s;}
.lg-node:hover{border-color:rgba(30,136,229,0.35);background:rgba(30,136,229,0.05);}
.lg-node-idx{font-family:monospace;font-size:0.66rem;font-weight:800;letter-spacing:0.12em;color:rgba(30,136,229,0.7);margin-bottom:0.9rem;}
.lg-node-name{font-family:monospace;font-size:1.45rem;font-weight:800;letter-spacing:-0.03em;line-height:1;color:#fff;margin-bottom:0.3rem;overflow-wrap:anywhere;}
.lg-node-sub{font-size:0.72rem;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:rgba(255,255,255,0.45);margin-bottom:0.9rem;padding-bottom:0.9rem;border-bottom:1px solid rgba(255,255,255,0.08);}
.lg-node-risk{font-size:0.83rem;line-height:1.6;color:rgba(255,255,255,0.6);margin:0;}
.lg-node-gate{border-color:rgba(30,136,229,0.4);background:linear-gradient(160deg,rgba(30,136,229,0.14) 0%,rgba(30,136,229,0.04) 100%);}
.lg-node-gate .lg-node-idx,.lg-node-gate .lg-node-sub{color:#1e88e5;}
.lg-arrow{display:flex;align-items:center;justify-content:center;color:rgba(30,136,229,0.6);padding:0 0.35rem;}
.lg-arrow svg{display:block;}
.lg-chain-note{margin:1.75rem auto 0;max-width:820px;font-size:0.82rem;line-height:1.65;color:rgba(255,255,255,0.45);padding-left:1rem;border-left:2px solid rgba(255,255,255,0.12);}
@media(max-width:991px){
  .lg-chain{grid-template-columns:minmax(0,1fr);}
  .lg-arrow{padding:0.35rem 0;}
  .lg-arrow svg{transform:rotate(90deg);}
  .lg-node{padding:1.3rem 1.2rem;}
}

/* ---------- 4. Gate scenario + blockquote ---------- */
.lg-gate{display:grid;grid-template-columns:minmax(0,0.9fr) minmax(0,1.1fr);gap:3rem;align-items:start;}
.lg-gate-head .lg-h2{margin-bottom:0;}
.lg-gate-body{display:flex;flex-direction:column;gap:1.75rem;}
.lg-gate-kicker{display:flex;align-items:center;gap:8px;font-family:monospace;font-size:0.7rem;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:#1e88e5;margin-bottom:0.9rem;}
.lg-gate-kicker svg{flex-shrink:0;}
.lg-gate-text{color:rgba(255,255,255,0.7);font-size:0.95rem;line-height:1.8;margin:0;}
.lg-gate-quote{margin:0;padding:0.25rem 0 0.25rem 1.5rem;border-left:3px solid #1e88e5;}
.lg-gate-quote p{color:#fff;font-size:clamp(1.15rem,2vw,1.5rem);font-weight:600;line-height:1.35;letter-spacing:-0.01em;margin:0 0 0.6rem;overflow-wrap:anywhere;}
.lg-gate-quote footer{font-family:monospace;font-size:0.72rem;letter-spacing:0.03em;color:rgba(255,255,255,0.45);}
.lg-gate-quote footer::before{content:'— ';}
@media(max-width:991px){
  .lg-gate{grid-template-columns:minmax(0,1fr);gap:1.75rem;}
}

/* ---------- 5. Incident ledger ---------- */
.lg-ledger{border-top:1px solid rgba(255,255,255,0.12);}
.lg-ledger-row{display:grid;grid-template-columns:minmax(0,0.9fr) minmax(0,1.6fr);gap:2rem;align-items:baseline;padding:1.5rem 0;border-bottom:1px solid rgba(255,255,255,0.12);}
.lg-ledger-name{color:#fff;font-size:1.1rem;font-weight:700;letter-spacing:-0.01em;line-height:1.3;overflow-wrap:anywhere;}
.lg-ledger-tag{display:block;font-family:monospace;font-size:0.68rem;font-weight:600;letter-spacing:0.04em;color:rgba(30,136,229,0.85);margin-top:0.4rem;}
.lg-ledger-text{color:rgba(255,255,255,0.65);font-size:0.92rem;line-height:1.65;margin:0;}
.lg-ledger-foot{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem 2rem;margin-top:1.25rem;}
.lg-ledger-disclaimer{color:rgba(255,255,255,0.35);font-size:0.74rem;font-style:italic;line-height:1.55;margin:0;max-width:520px;}
@media(max-width:767px){
  .lg-ledger-row{grid-template-columns:minmax(0,1fr);gap:0.6rem;padding:1.25rem 0;}
}

/* ---------- 6. Process (classic timeline) ---------- */
.lg-process{display:grid;grid-template-columns:minmax(0,0.85fr) minmax(0,1.15fr);gap:3.5rem;align-items:start;}
.lg-process-head{position:sticky;top:110px;}
.process-timeline{position:relative;padding-left:2rem;}
.process-timeline::before{content:'';position:absolute;left:11px;top:0;bottom:0;width:2px;background:rgba(30,136,229,0.2);}
.process-step{position:relative;padding-bottom:2rem;}
.process-step:last-child{padding-bottom:0;}
.process-step::before{content:'';position:absolute;left:-1.7rem;top:4px;width:10px;height:10px;border-radius:50%;background:#1e88e5;border:2px solid #030d1d;box-shadow:0 0 0 3px rgba(30,136,229,0.2);}
.process-step-num{font-size:0.62rem;font-weight:800;letter-spacing:0.1em;text-transform:uppercase;color:rgba(30,136,229,0.6);margin-bottom:4px;font-family:monospace;}
.process-step h4{color:#fff;font-size:0.97rem;font-weight:700;margin-bottom:5px;overflow-wrap:anywhere;}
.process-step p{color:rgba(255,255,255,0.5);font-size:0.83rem;line-height:1.65;margin:0;}
@media(max-width:991px){
  .lg-process{grid-template-columns:minmax(0,1fr);gap:2rem;}
  .lg-process-head{position:static;}
}

/* ---------- 7. Modules + compliance (text list with arrows) ---------- */
.lg-mod-list{list-style:none;margin:0;padding:0;border-top:1px solid rgba(255,255,255,0.1);}
.lg-mod{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:1.5rem;align-items:center;padding:1.4rem 0;border-bottom:1px solid rgba(255,255,255,0.1);}
.lg-mod-idx{font-family:monospace;font-size:0.72rem;font-weight:800;letter-spacing:0.1em;color:rgba(30,136,229,0.7);padding-top:2px;}
.lg-mod-body{min-width:0;}
.lg-mod-body h4{color:#fff;font-size:1.02rem;font-weight:700;margin:0 0 4px;overflow-wrap:anywhere;}
.lg-mod-body p{color:rgba(255,255,255,0.55);font-size:0.86rem;line-height:1.6;margin:0;}
.lg-compliance{margin-top:3rem;display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,0.6fr);gap:2rem 3rem;align-items:center;padding-top:2rem;border-top:2px solid rgba(30,136,229,0.25);}
.lg-compliance-text h3{color:#fff;font-size:1.2rem;font-weight:700;letter-spacing:-0.01em;margin:0 0 0.5rem;overflow-wrap:anywhere;}
.lg-compliance-text p{color:rgba(255,255,255,0.55);font-size:0.9rem;line-height:1.7;margin:0;}
.lg-compliance-links{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:0.6rem;}
.lg-compliance-links li{padding:0.85rem 0;border-bottom:1px solid rgba(255,255,255,0.1);}
.lg-compliance-links li:first-child{border-top:1px solid rgba(255,255,255,0.1);}
@media(max-width:767px){
  .lg-mod{grid-template-columns:auto minmax(0,1fr);gap:0.75rem 1rem;}
  .lg-mod .lg-arrow-link{grid-column:2;}
  .lg-compliance{grid-template-columns:minmax(0,1fr);}
}

/* ---------- 8. FAQ (two columns, shared accordion pattern) ---------- */
.faq-lg .accordion-item{background:rgba(255,255,255,0.02);border:1px solid rgba(255,255,255,0.07);border-radius:8px;margin-bottom:0.75rem;overflow:hidden;}
.faq-lg .accordion-button{background:transparent;border:none;box-shadow:none;padding:1.1rem 1.25rem;width:100%;text-align:left;display:flex;align-items:center;justify-content:space-between;gap:1rem;cursor:pointer;}
.faq-lg .accordion-button:not(.collapsed){background:rgba(30,136,229,0.08);border-bottom:1px solid rgba(30,136,229,0.15);}
.faq-lg .accordion-button h3{font-size:0.95rem;font-weight:600;color:rgba(255,255,255,0.88);margin:0;line-height:1.4;overflow-wrap:anywhere;}
.faq-lg .accordion-button:not(.collapsed) h3{color:#fff;}
.faq-lg .accordion-button::after{filter:invert(1) brightness(0.55);flex-shrink:0;}
.faq-lg .accordion-button:not(.collapsed)::after{filter:invert(0.4) sepia(1) saturate(3) hue-rotate(180deg) brightness(1.2);}
.faq-lg .accordion-button:focus-visible{outline:2px solid #1e88e5;outline-offset:-2px;}
.faq-lg .accordion-body{padding:1rem 1.25rem 1.25rem;color:rgba(255,255,255,0.6);font-size:0.87rem;line-height:1.75;}

/* ---------- 9. CTA footer ---------- */
.lg-cta-footer{background:linear-gradient(135deg,#0A3570 0%,#062449 100%);padding:70px 0;text-align:center;}
.lg-cta-footer h2{color:#fff;font-size:clamp(1.6rem,3vw,2.2rem);font-weight:800;letter-spacing:-0.02em;margin-bottom:1rem;overflow-wrap:anywhere;}
.lg-cta-footer p{color:rgba(255,255,255,0.75);font-size:1rem;max-width:600px;margin:0 auto 2rem;line-height:1.6;}
.lg-cta-group-footer{display:flex;align-items:center;justify-content:center;gap:1.5rem;flex-wrap:wrap;}
.lg-cta-mail{display:inline-flex;align-items:center;gap:8px;color:rgba(255,255,255,0.8) !important;font-size:0.9rem;text-decoration:none !important;overflow-wrap:anywhere;}
.lg-cta-mail:hover{color:#fff !important;}
.lg-cta-mail:focus-visible{outline:2px solid #fff;outline-offset:3px;}

/* ---------- Responsive ---------- */
@media(max-width:991px){
  .lg-herostat{padding-left:1.5rem;margin-top:0.5rem;}
  .lg-herostat-num{font-size:clamp(5rem,18vw,8rem);}
}
@media(max-width:768px){
  .lg-hero{padding:90px 0 70px;}
  .section-dark,.section-mid,.section-light,.lg-cta-footer{padding:56px 0;}
  .lg-kpi-section{padding:52px 0 60px;}
  .lg-section-head{margin-bottom:2rem;}
  .lg-herostat-num{font-size:clamp(4.5rem,22vw,7rem);}
}

/* Long CTA labels (esp. German) can outgrow narrow viewports — never let them
 * wrap to a second line. Shrink type/padding progressively and drop the
 * trailing icon before that would happen. */
@media(max-width:480px){
  .lg-btn-primary{width:100%;justify-content:center;font-size:0.84rem;padding:13px 16px;letter-spacing:-0.005em;}
  .lg-cta-group{gap:0.75rem;}
  .lg-arrow-link{white-space:normal;}
  .faq-lg .accordion-button h3{font-size:0.88rem;}
}
@media(max-width:380px){
  .lg-btn-primary{font-size:0.78rem;padding:13px 12px;gap:6px;}
  .lg-btn-primary svg{display:none;}
  .lg-herostat-num{font-size:4rem;}
}