/* ==========================================================================
   TDE Hülle v1 — gemeinsame Gestaltung für den Website-Neubau
   Wird pro Entwurfsseite eingebunden (kein globales Asset, Live bleibt unberührt)
   ========================================================================== */
.tdex{
  --bg:#04090d; --bg-2:#080f15; --card:#0a141c; --card-h:#0d1a23;
  --ink:#ffffff; --ink-2:#a7b6c2; --ink-3:#6e8497;
  --teal:#0a9396; --teal-2:#4fb3c4; --frame:rgba(79,179,196,.55);
  --line:rgba(255,255,255,.10); --line-2:rgba(255,255,255,.06);
  --sans:"DM Sans",system-ui,-apple-system,sans-serif;
  --mono:"Space Mono",ui-monospace,monospace;
  --rhythm:clamp(80px,9vw,150px);
  --wrap:1292px;
  background:var(--bg); color:var(--ink); font-family:var(--sans);
  -webkit-font-smoothing:antialiased;
}
.tdex *{box-sizing:border-box}
.tdex .wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
.tdex section{padding:var(--rhythm) 0}
.tdex section+section{border-top:1px solid var(--line-2)}

/* Typografie ------------------------------------------------------------- */
.tdex h1{font-size:clamp(38px,5.2vw,72px);line-height:1;letter-spacing:-.035em;font-weight:500;margin:0}
.tdex h1 .mute{color:var(--ink-2)}
.tdex h2{font-size:clamp(30px,4vw,54px);line-height:1.03;letter-spacing:-.035em;font-weight:500;margin:0;max-width:20ch}
.tdex h3{font-size:clamp(20px,2.3vw,29px);line-height:1.15;letter-spacing:-.025em;font-weight:500;margin:0}
.tdex p{font-size:16.5px;line-height:1.68;color:var(--ink-2);margin:16px 0 0;max-width:62ch}
.tdex .kick{font-family:var(--mono);font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--teal-2);margin:0 0 18px}
.tdex .hl{color:var(--ink);font-weight:500;text-shadow:0 0 16px rgba(150,225,250,.5),0 0 34px rgba(79,179,196,.28)}
.tdex .mono{font-family:var(--mono)}
.tdex a{color:var(--teal-2);text-decoration:none}
.tdex a:hover{color:var(--ink)}

/* Buttons ---------------------------------------------------------------- */
.tdex .btn{display:inline-block;font-family:var(--mono);font-size:12px;letter-spacing:.1em;
  text-transform:uppercase;padding:14px 22px;border:1px solid transparent;border-radius:2px;
  transition:background .2s,color .2s,border-color .2s,transform .2s;cursor:pointer}
.tdex .btn-p{background:var(--teal);color:#fff}
.tdex .btn-p:hover{background:var(--teal-2);color:#fff}
.tdex .btn-s{border-color:rgba(255,255,255,.22);color:var(--ink)}
.tdex .btn-s:hover{border-color:var(--teal-2);color:var(--teal-2)}
.tdex .acts{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}

/* Karten ----------------------------------------------------------------- */
.tdex .grid{display:grid;gap:16px;margin-top:clamp(30px,4vw,52px)}
.tdex .g-2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.tdex .g-3{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.tdex .g-4{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.tdex .card{background:var(--card);border:1px solid var(--line);border-radius:14px;
  padding:26px 24px 28px;transition:transform .25s cubic-bezier(.2,.7,.2,1),border-color .25s,background .25s}
.tdex .card:hover{transform:translateY(-4px);border-color:rgba(79,179,196,.45);background:var(--card-h)}
.tdex .card h3{margin:12px 0 8px}
.tdex .card p{font-size:14.5px;margin:0;color:var(--ink-2)}
.tdex .card .spec{display:block;font-family:var(--mono);font-size:11.5px;color:var(--teal-2);margin-top:20px}

/* Tabellenzeilen --------------------------------------------------------- */
.tdex .rows{border-bottom:1px solid var(--line)}
.tdex .row{display:grid;grid-template-columns:minmax(150px,1.1fr) 2fr minmax(140px,.9fr) auto;
  gap:clamp(14px,3vw,40px);align-items:center;padding:22px 0;border-top:1px solid var(--line);transition:background .18s}
.tdex .row:hover{background:rgba(255,255,255,.028)}
.tdex .row .pn{font-family:var(--mono);font-size:15px;color:var(--ink)}
.tdex .row .ds{font-size:14.5px;color:var(--ink-2);line-height:1.5}
.tdex .row .sp{font-family:var(--mono);font-size:12px;color:var(--ink-3)}
@media(max-width:800px){.tdex .row{grid-template-columns:1fr 1fr;row-gap:8px}.tdex .row .ds{grid-column:1/-1;order:3}}

/* Chips / Filter --------------------------------------------------------- */
.tdex .chips{display:flex;gap:8px;flex-wrap:wrap;padding:26px 0}
.tdex .chip{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink-2);border:1px solid var(--line);padding:9px 14px;border-radius:999px;cursor:pointer;transition:.18s}
.tdex .chip:hover{border-color:var(--teal-2);color:var(--ink)}
.tdex .chip.on{background:var(--teal);border-color:var(--teal);color:#fff}

/* Kennzahlen ------------------------------------------------------------- */
.tdex .stats{display:flex;gap:34px;flex-wrap:wrap;margin-top:38px;font-family:var(--mono);font-size:11.5px;color:var(--ink-3)}
.tdex .stats b{display:block;color:var(--ink);font-size:26px;font-weight:400;letter-spacing:-.02em;margin-bottom:6px}

/* Auftritt --------------------------------------------------------------- */
@keyframes tdexUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.tdex .up{animation:tdexUp .7s both cubic-bezier(.2,.7,.2,1)}
.tdex .d1{animation-delay:.06s}.tdex .d2{animation-delay:.14s}
.tdex .d3{animation-delay:.22s}.tdex .d4{animation-delay:.3s}
@media(prefers-reduced-motion:reduce){.tdex *{animation:none !important}}

/* Header / Wortmarke ----------------------------------------------------- */
body.tdex-page header,body.tdex-page header .navbar,body.tdex-page header nav{background:#04090d !important}
body.tdex-page header{border-bottom:1px solid rgba(255,255,255,.10) !important;box-shadow:none !important}
body.tdex-page header a,body.tdex-page header .nav-link,body.tdex-page header span{color:#a7b6c2 !important}
body.tdex-page header a:hover{color:#fff !important}
body.tdex-page header a.logo img{display:none !important}
body.tdex-page header a.logo{display:flex !important;align-items:center;line-height:1.15 !important;height:auto !important;
  font-family:"DM Sans",system-ui,sans-serif;font-weight:700;font-size:22px !important;letter-spacing:-.02em}
body.tdex-page header a.logo:before{content:"timing";color:#fff !important}
body.tdex-page header a.logo:after{content:"devices";color:#4fb3c4 !important}
body.tdex-page header .brand{display:flex !important;flex-direction:column !important;align-items:flex-start !important;gap:2px !important}
body.tdex-page header .brand .stamp{font-family:"Space Mono",monospace !important;font-size:9.5px !important;
  letter-spacing:.26em !important;text-transform:uppercase !important;color:#6e8497 !important;
  border:0 !important;padding:0 !important;margin:0 !important;line-height:1.2 !important}
body.tdex-page header .brand .stamp b{display:none !important}

/* Footer ----------------------------------------------------------------- */
.tdex .foot{border-top:1px solid var(--line);padding:clamp(40px,5vw,64px) 0 90px}
.tdex .fgrid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:clamp(24px,4vw,48px)}
@media(max-width:860px){.tdex .fgrid{grid-template-columns:1fr 1fr}}
.tdex .fgrid h5{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink-3);margin:0 0 16px;font-weight:400}
.tdex .fgrid a{display:block;color:var(--ink-2);font-size:14px;margin-bottom:10px}
.tdex .fnote{margin-top:44px;padding-top:22px;border-top:1px solid var(--line);display:flex;gap:22px;flex-wrap:wrap;
  font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}