/* ============================================================
   CraftLayer3D — Landingpage  (Variante A: Zentriert & Klassisch)
   Designsystem aus dem Logo abgeleitet
   ============================================================ */
:root{
  /* Logo-Farben */
  --blue:#1e63e9;
  --blue-bright:#2d7ff9;
  --blue-light:#4d9bff;
  --blue-pale:#9cc0ff;
  --navy:#0d1422;
  --navy-2:#111c30;
  --navy-3:#16243c;

  /* neutrale Skala */
  --ink:#16202f;
  --slate:#5a6b82;
  --slate-soft:#8696ad;
  --bg:#ffffff;
  --bg-soft:#f3f7fd;
  --bg-tint:#eaf1fe;
  --line:#e4eaf3;
  --line-soft:#eef2f8;

  --radius:18px;
  --radius-sm:12px;
  --shadow-sm:0 1px 2px rgba(13,20,34,.05), 0 8px 24px -12px rgba(13,20,34,.12);
  --shadow-md:0 4px 12px -2px rgba(13,20,34,.08), 0 24px 48px -16px rgba(13,20,34,.18);
  --shadow-blue:0 12px 30px -8px rgba(30,99,233,.45);

  --maxw:1180px;
  --ease:cubic-bezier(.22,.61,.36,1);

  --font-display:'Space Grotesk',system-ui,sans-serif;
  --font-body:'Manrope',system-ui,sans-serif;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;font-family:var(--font-body);color:var(--ink);background:var(--bg);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow-x:hidden;line-height:1.55;
}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px;}
section{position:relative;}

/* selection */
::selection{background:var(--blue);color:#fff;}

/* ---------- Typography ---------- */
h1,h2,h3,h4{font-family:var(--font-display);font-weight:600;line-height:1.04;letter-spacing:-.02em;margin:0;}
.eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--font-body);font-weight:700;font-size:13px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--blue);
}
.eyebrow::before{content:"";width:22px;height:2px;background:var(--blue);border-radius:2px;}
.eyebrow.center{justify-content:center;}

/* ============================================================
   NAV
   ============================================================ */
.nav{
  position:fixed;inset:0 0 auto 0;z-index:100;
  display:flex;align-items:center;justify-content:space-between;
  padding:18px 28px;transition:background .35s var(--ease),box-shadow .35s var(--ease),padding .35s var(--ease),backdrop-filter .35s;
}
.nav.scrolled{
  background:rgba(255,255,255,.82);backdrop-filter:blur(14px) saturate(1.4);
  box-shadow:0 1px 0 var(--line),0 8px 30px -18px rgba(13,20,34,.4);
  padding:12px 28px;
}
.nav-logo{display:flex;align-items:center;gap:11px;font-family:var(--font-display);font-weight:700;font-size:21px;letter-spacing:-.02em;}
.nav-logo .mark{width:30px;height:30px;flex:none;}
.nav-logo .word{color:#fff;transition:color .35s var(--ease);}
.nav-logo .word b{color:var(--blue-light);transition:color .35s var(--ease);font-weight:700;}
.nav.scrolled .nav-logo .word{color:var(--navy);}
.nav.scrolled .nav-logo .word b{color:var(--blue);}
.nav-links{display:flex;align-items:center;gap:34px;}
.nav-links a{font-weight:600;font-size:15px;color:rgba(255,255,255,.82);transition:color .25s;position:relative;}
.nav-links a::after{content:"";position:absolute;left:0;right:0;bottom:-5px;height:2px;background:var(--blue-light);border-radius:2px;transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease);}
.nav-links a:hover{color:#fff;}
.nav-links a:hover::after{transform:scaleX(1);}
.nav.scrolled .nav-links a{color:var(--slate);}
.nav.scrolled .nav-links a:hover{color:var(--navy);}
/* CTA-Button im Nav behält eigene Textfarbe (sonst überschreibt .nav-links a die Farbe) */
.nav-links a.btn{color:var(--navy);}
.nav-links a.btn::after{display:none;}
.nav.scrolled .nav-links a.btn{color:var(--navy);}
.nav-links a:last-child{display:inline-flex;}

/* buttons */
.btn{
  display:inline-flex;align-items:center;gap:9px;cursor:pointer;border:none;
  font-family:var(--font-body);font-weight:700;font-size:15px;
  padding:13px 24px;border-radius:12px;transition:transform .2s var(--ease),box-shadow .25s var(--ease),background .25s;
  white-space:nowrap;
}
.btn .ico{transition:transform .3s var(--ease);}
.btn:hover .ico{transform:translateX(4px);}
.btn-primary{background:var(--blue);color:#fff;box-shadow:var(--shadow-blue);}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 16px 36px -8px rgba(30,99,233,.55);background:var(--blue-bright);}
.btn-ghost{background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.22);backdrop-filter:blur(6px);}
.btn-ghost:hover{background:rgba(255,255,255,.16);transform:translateY(-2px);}
.btn-light{background:#fff;color:var(--navy);box-shadow:var(--shadow-sm);}
.btn-light:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);}
.btn-sm{padding:10px 18px;font-size:14px;}

/* ============================================================
   HERO
   ============================================================ */
.hero{
  position:relative;background:var(--navy);color:#fff;
  padding:184px 0 120px;text-align:center;overflow:hidden;
  isolation:isolate;
}
.hero-bg{position:absolute;inset:0;z-index:-2;overflow:hidden;}
.hero-bg .glow{position:absolute;border-radius:50%;filter:blur(90px);opacity:.5;}
.hero-bg .g1{width:560px;height:560px;background:radial-gradient(circle,#1e63e9,transparent 70%);top:-160px;left:50%;transform:translateX(-50%);opacity:.55;}
.hero-bg .g2{width:420px;height:420px;background:radial-gradient(circle,#2d7ff9,transparent 70%);bottom:-140px;left:8%;opacity:.32;}
.hero-bg .g3{width:380px;height:380px;background:radial-gradient(circle,#4d9bff,transparent 70%);top:30%;right:4%;opacity:.28;}
/* grid floor */
.hero-grid{
  position:absolute;left:50%;bottom:-60px;transform:translateX(-50%) perspective(700px) rotateX(62deg);
  width:1600px;height:560px;z-index:-1;
  background-image:linear-gradient(rgba(120,165,255,.18) 1px,transparent 1px),linear-gradient(90deg,rgba(120,165,255,.18) 1px,transparent 1px);
  background-size:46px 46px;
  mask-image:radial-gradient(ellipse 60% 80% at 50% 0%,#000 30%,transparent 75%);
  -webkit-mask-image:radial-gradient(ellipse 60% 80% at 50% 0%,#000 30%,transparent 75%);
  animation:gridShift 14s linear infinite;
}
@keyframes gridShift{to{background-position:0 46px;}}

.hero-mark{display:flex;justify-content:center;margin-bottom:30px;animation:floatMark 6s var(--ease) infinite;will-change:transform;}
@keyframes floatMark{0%,100%{transform:translateY(0) rotate(0);}50%{transform:translateY(-14px) rotate(-1.5deg);}}
.hero-mark svg{filter:drop-shadow(0 24px 40px rgba(30,99,233,.5));}

.hero h1{font-size:clamp(40px,6.6vw,78px);font-weight:600;letter-spacing:-.03em;max-width:16ch;margin:0 auto 22px;}
.hero h1 .grad{background:linear-gradient(100deg,var(--blue-light),var(--blue-pale));-webkit-background-clip:text;background-clip:text;color:transparent;}
.hero .lede{font-size:clamp(17px,1.9vw,21px);color:#aebbd0;max-width:56ch;margin:0 auto;font-weight:400;}
.hero .cta-row{display:flex;gap:14px;justify-content:center;margin-top:38px;flex-wrap:wrap;}
.hero .pill-row{display:flex;gap:10px;justify-content:center;margin-top:30px;flex-wrap:wrap;}
.pill{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:600;color:#9fb0c9;border:1px solid rgba(255,255,255,.14);border-radius:30px;padding:7px 15px;background:rgba(255,255,255,.04);}
.pill .dot{width:7px;height:7px;border-radius:50%;background:var(--blue-light);box-shadow:0 0 10px var(--blue-light);}
.hero .pill-note{margin:14px auto 0;font-size:12.5px;color:#7e8eaa;letter-spacing:.01em;}

.scrollcue{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;color:#7e8eaa;font-size:12px;letter-spacing:.1em;text-transform:uppercase;}
.scrollcue .mouse{width:22px;height:36px;border:2px solid #44546e;border-radius:14px;position:relative;}
.scrollcue .mouse::after{content:"";position:absolute;top:6px;left:50%;transform:translateX(-50%);width:4px;height:7px;border-radius:3px;background:var(--blue-light);animation:scrollDot 1.7s infinite;}
@keyframes scrollDot{0%{opacity:0;transform:translate(-50%,0);}40%{opacity:1;}80%{opacity:0;transform:translate(-50%,12px);}100%{opacity:0;}}

/* wave divider into light */
.hero-foot{position:absolute;left:0;right:0;bottom:-1px;line-height:0;z-index:1;}
.hero-foot svg{width:100%;height:80px;display:block;}

/* ============================================================
   STATS
   ============================================================ */
.stats{background:var(--bg);padding:54px 0;}
.stats .row{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
.stat{text-align:center;padding:10px;position:relative;}
.stat:not(:last-child)::after{content:"";position:absolute;right:-12px;top:14%;height:72%;width:1px;background:var(--line);}
.stat .num{font-family:var(--font-display);font-weight:700;font-size:clamp(34px,4vw,46px);color:var(--navy);letter-spacing:-.03em;line-height:1;}
.stat .num .u{color:var(--blue);}
.stat .lbl{margin-top:8px;font-size:14px;color:var(--slate);font-weight:600;}

/* ============================================================
   SECTION shared
   ============================================================ */
.section{padding:104px 0;}
.section.soft{background:var(--bg-soft);}
.section-head{max-width:640px;margin:0 auto 56px;text-align:center;}
.section-head h2{font-size:clamp(30px,4vw,46px);margin:16px 0 14px;color:var(--navy);}
.section-head p{color:var(--slate);font-size:17px;margin:0;}

/* ---------- Leistungen ---------- */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
/* Ablauf: 4 Schritte — responsiv 4 → 2 → 1 */
.cards.steps{grid-template-columns:repeat(4,1fr);}
@media (max-width:900px){.cards.steps{grid-template-columns:repeat(2,1fr);}}
@media (max-width:560px){.cards.steps{grid-template-columns:1fr;}}
.lcard{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:34px 30px 30px;
  position:relative;overflow:hidden;transition:transform .4s var(--ease),box-shadow .4s var(--ease),border-color .4s;
}
.lcard::before{content:"";position:absolute;left:0;top:0;height:3px;width:100%;background:linear-gradient(90deg,var(--blue),var(--blue-light));transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease);}
.lcard:hover{transform:translateY(-8px);box-shadow:var(--shadow-md);border-color:transparent;}
.lcard:hover::before{transform:scaleX(1);}
.lcard .licon{
  width:58px;height:58px;border-radius:15px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(145deg,var(--bg-tint),#fff);border:1px solid var(--line);color:var(--blue);margin-bottom:22px;
  transition:transform .4s var(--ease);
}
.lcard:hover .licon{transform:scale(1.06) rotate(-4deg);}
.lcard .licon svg{width:28px;height:28px;}
.lcard h3{font-size:23px;color:var(--navy);margin-bottom:10px;}
.lcard p{color:var(--slate);font-size:15.5px;margin:0 0 18px;}
.lcard .feats{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:9px;}
.lcard .feats li{display:flex;align-items:center;gap:10px;font-size:14.5px;color:var(--ink);font-weight:500;}
.lcard .feats li svg{color:var(--blue);flex:none;}

/* ---------- Portfolio — Endlos-Roll ---------- */
.roll{position:relative;overflow:hidden;
  -webkit-mask:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%);
  mask:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%);}
.roll-track{display:flex;width:max-content;will-change:transform;
  animation:roll var(--roll-dur,42s) linear infinite;}
.roll:hover .roll-track{animation-play-state:paused;}
@keyframes roll{from{transform:translate3d(0,0,0);}to{transform:translate3d(-50%,0,0);}}
.gitem{position:relative;flex:0 0 auto;width:330px;margin-right:22px;
  border-radius:var(--radius);overflow:hidden;background:var(--bg-tint);
  box-shadow:var(--shadow-sm);transition:transform .45s var(--ease),box-shadow .45s var(--ease);}
.roll:hover .gitem:hover{transform:translateY(-6px);box-shadow:var(--shadow-md);}
.gitem image-slot{width:100%;height:320px;display:block;}
.gitem .cap{position:absolute;left:0;right:0;bottom:0;padding:40px 18px 16px;background:linear-gradient(transparent,rgba(13,20,34,.86));color:#fff;opacity:0;transform:translateY(8px);transition:opacity .35s var(--ease),transform .35s var(--ease);pointer-events:none;}
.roll:hover .gitem:hover .cap{opacity:1;transform:none;}
.gitem .cap .t{font-family:var(--font-display);font-weight:600;font-size:16px;}
.gitem .cap .s{font-size:12.5px;color:#b9c6dc;}
@media (prefers-reduced-motion: reduce){
  .roll-track{animation:none;flex-wrap:wrap;width:auto;justify-content:center;gap:22px;}
  .gitem{margin-right:0;}
}

/* ---------- Kontakt ---------- */
.contact{background:var(--navy);color:#fff;}
.contact .grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:52px;align-items:start;}
.contact h2{font-size:clamp(30px,4vw,46px);margin:16px 0 16px;}
.contact .lede{color:#aebbd0;font-size:17px;max-width:42ch;}
.contact .info{list-style:none;padding:0;margin:32px 0 0;display:flex;flex-direction:column;gap:16px;}
.contact .info li{display:flex;align-items:center;gap:14px;font-size:15.5px;}
.contact .info .ci{width:44px;height:44px;flex:none;border-radius:12px;background:rgba(77,155,255,.14);border:1px solid rgba(77,155,255,.3);display:flex;align-items:center;justify-content:center;color:var(--blue-light);}
.contact .info b{display:block;font-weight:700;}
.contact .info span{color:#9fb0c9;font-size:13.5px;}

.form-card{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12);border-radius:var(--radius);padding:30px;backdrop-filter:blur(6px);}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.field{margin-bottom:16px;}
.field label{display:block;font-size:13px;font-weight:700;color:#aebbd0;margin-bottom:7px;letter-spacing:.02em;}
.field input,.field textarea,.field select{
  width:100%;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);border-radius:11px;
  color:#fff;font-family:var(--font-body);font-size:15px;padding:12px 14px;transition:border-color .25s,background .25s,box-shadow .25s;
}
.field textarea{resize:vertical;min-height:96px;}
.field input::placeholder,.field textarea::placeholder{color:#6f809a;}
.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-color:var(--blue-light);background:rgba(77,155,255,.1);box-shadow:0 0 0 4px rgba(77,155,255,.14);}
.field select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%234d9bff' stroke-width='3'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;cursor:pointer;}

.dropzone{
  border:2px dashed rgba(77,155,255,.4);border-radius:14px;background:rgba(77,155,255,.06);
  padding:30px 22px;text-align:center;cursor:pointer;transition:border-color .25s,background .25s,transform .25s;
  position:relative;
}
.dropzone:hover{border-color:var(--blue-light);background:rgba(77,155,255,.1);}
.dropzone.drag{border-color:var(--blue-light);background:rgba(77,155,255,.16);transform:scale(1.01);}
.dropzone .di{width:48px;height:48px;margin:0 auto 12px;border-radius:50%;background:rgba(77,155,255,.16);display:flex;align-items:center;justify-content:center;color:var(--blue-light);animation:pulseUp 2.4s var(--ease) infinite;}
@keyframes pulseUp{0%,100%{transform:translateY(0);box-shadow:0 0 0 0 rgba(77,155,255,.4);}50%{transform:translateY(-5px);box-shadow:0 0 0 12px rgba(77,155,255,0);}}
.dropzone .dt{font-weight:700;font-size:15px;}
.dropzone .dt b{color:var(--blue-light);}
.dropzone .ds{font-size:13px;color:#8696ad;margin-top:4px;}
.dropzone .files{margin-top:14px;display:flex;flex-direction:column;gap:7px;}
.dropzone .filechip{display:flex;align-items:center;gap:8px;justify-content:center;font-size:13px;color:#cdd8e8;background:rgba(255,255,255,.07);border-radius:8px;padding:6px 12px;}
.form-card .btn-primary{width:100%;justify-content:center;margin-top:6px;}
.hp-field{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0;pointer-events:none;}
.form-note{font-size:12.5px;color:#7e8eaa;text-align:center;margin-top:14px;}

/* ============================================================
   FOOTER
   ============================================================ */
.footer{background:#fff;border-top:1px solid var(--line);padding:56px 0 30px;}
.footer .top{display:flex;justify-content:space-between;gap:40px;flex-wrap:wrap;align-items:flex-start;}
.footer .logo-img{height:62px;width:auto;}
.footer .fcol h4{font-size:13px;text-transform:uppercase;letter-spacing:.1em;color:var(--slate-soft);margin-bottom:14px;font-family:var(--font-body);font-weight:700;}
.footer .fcol a{display:block;color:var(--slate);font-size:15px;margin-bottom:9px;transition:color .2s,transform .2s;}
.footer .fcol a:hover{color:var(--blue);transform:translateX(3px);}
.footer .cols{display:flex;gap:64px;flex-wrap:wrap;}
.footer .bottom{margin-top:42px;padding-top:22px;border-top:1px solid var(--line-soft);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;color:var(--slate-soft);font-size:13.5px;}

/* ============================================================
   Scroll-Reveal
   ============================================================ */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s var(--ease),transform .8s var(--ease);}
.reveal.in{opacity:1;transform:none;}
.reveal.d1{transition-delay:.08s;}
.reveal.d2{transition-delay:.16s;}
.reveal.d3{transition-delay:.24s;}
.reveal.d4{transition-delay:.32s;}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none;}
  .hero-mark,.hero-grid,.dropzone .di{animation:none;}
  html{scroll-behavior:auto;}
}

/* ============================================================
   Responsive
   ============================================================ */
@media (max-width:960px){
  .nav-links{display:none;}
  .contact .grid{grid-template-columns:1fr;gap:36px;}
  .gitem{width:280px;}
  .gitem image-slot{height:280px;}
}
@media (max-width:680px){
  .cards{grid-template-columns:1fr;}
  .stats .row{grid-template-columns:1fr 1fr;gap:30px 12px;}
  .stat:not(:last-child)::after{display:none;}
  .field-row{grid-template-columns:1fr;}
  .section{padding:74px 0;}
  .hero{padding:150px 0 96px;}
  .gitem{width:240px;}
  .gitem image-slot{height:240px;}
}

/* ============================================================
   LEGAL PAGES (Impressum / Datenschutz)
   ============================================================ */
.nav.legal-nav{position:fixed;background:rgba(255,255,255,.86);backdrop-filter:blur(14px) saturate(1.4);box-shadow:0 1px 0 var(--line),0 8px 30px -18px rgba(13,20,34,.4);}
.nav.legal-nav .nav-logo .word{color:var(--navy);}
.nav.legal-nav .nav-logo .word b{color:var(--blue);}
.nav.legal-nav .nav-links a{color:var(--slate);}
.nav.legal-nav .nav-links a:hover{color:var(--navy);}
.nav.legal-nav .nav-links a.btn{color:var(--navy);}

.legal-hero{
  background:var(--navy);color:#fff;padding:150px 0 64px;position:relative;overflow:hidden;isolation:isolate;
}
.legal-hero .glow{position:absolute;width:480px;height:480px;border-radius:50%;filter:blur(90px);background:radial-gradient(circle,#1e63e9,transparent 70%);opacity:.4;top:-180px;left:50%;transform:translateX(-50%);z-index:-1;}
.legal-hero .eyebrow{color:var(--blue-light);}
.legal-hero .eyebrow::before{background:var(--blue-light);}
.legal-hero h1{font-size:clamp(34px,5vw,56px);margin:14px 0 10px;letter-spacing:-.03em;}
.legal-hero p{color:#aebbd0;font-size:16px;margin:0;}
.legal-hero .back{display:inline-flex;align-items:center;gap:7px;color:#9fb0c9;font-weight:600;font-size:14px;margin-top:22px;transition:color .2s,transform .2s;}
.legal-hero .back:hover{color:#fff;transform:translateX(-3px);}

.legal-body{padding:64px 0 90px;background:var(--bg);}
.legal-body .wrap{max-width:820px;}
.legal-note{
  border:1px solid #f0d68a;background:#fff9e8;border-radius:14px;padding:18px 22px;margin-bottom:44px;
  display:flex;gap:14px;align-items:flex-start;
}
.legal-note .ni{flex:none;width:30px;height:30px;border-radius:8px;background:#f6c544;display:flex;align-items:center;justify-content:center;color:#5c4406;font-weight:800;}
.legal-note p{margin:0;font-size:14.5px;color:#6b5713;line-height:1.55;}
.legal-note b{color:#4d3d08;}

.legal-body h2{font-size:23px;color:var(--navy);margin:42px 0 12px;letter-spacing:-.02em;}
.legal-body h2:first-of-type{margin-top:0;}
.legal-body h3{font-size:17px;color:var(--navy);font-family:var(--font-body);font-weight:700;margin:26px 0 8px;}
.legal-body p,.legal-body li{color:var(--slate);font-size:15.5px;line-height:1.7;}
.legal-body p{margin:0 0 14px;}
.legal-body ul{margin:0 0 16px;padding-left:22px;}
.legal-body li{margin-bottom:6px;}
.legal-body a{color:var(--blue);font-weight:600;}
.legal-body a:hover{text-decoration:underline;}
.legal-body .ph{background:var(--bg-tint);color:var(--blue);border-radius:6px;padding:1px 7px;font-weight:700;font-size:.94em;white-space:nowrap;}
.legal-body .addr{background:var(--bg-soft);border:1px solid var(--line);border-radius:12px;padding:20px 24px;margin:0 0 18px;line-height:1.8;color:var(--ink);font-size:15.5px;}
.legal-body .addr b{color:var(--navy);}
.legal-body hr{border:none;border-top:1px solid var(--line);margin:40px 0;}
.legal-body .toc{background:var(--bg-soft);border:1px solid var(--line);border-radius:14px;padding:22px 26px;margin-bottom:44px;}
.legal-body .toc h4{margin:0 0 12px;font-size:13px;text-transform:uppercase;letter-spacing:.1em;color:var(--slate-soft);font-family:var(--font-body);font-weight:700;}
.legal-body .toc ol{margin:0;padding-left:20px;columns:2;column-gap:34px;}
.legal-body .toc a{color:var(--slate);font-weight:600;font-size:14.5px;line-height:2;}
.legal-body .toc a:hover{color:var(--blue);}
@media (max-width:680px){
  .legal-body .toc ol{columns:1;}
  .legal-hero{padding:124px 0 50px;}
}