/* ════════════════════════════════════════════════════════════════
   STARTSEITE · Layout nach Ihrer Vorlage „Tariq Consulting 2026"
   Eigener, gekapselter Namensraum (.tpl / .t-*), damit Navigation,
   Fußbereich und alle Unterseiten unberührt bleiben.
   ════════════════════════════════════════════════════════════════ */
.tpl{padding-top:68px}
:root{--progress:0%}
.tpl{--wine:#6F1022;--wine2:#8E1B31;--dark:#26030B;--ink:#171314;--muted:#5E5852;--paper:#FBFAF8;--soft:#F4EFED;--line:#DFD8D6;
  background:var(--paper);color:var(--ink);font-family:"DM Sans",system-ui,sans-serif}
.tpl *{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:78px}
.tpl{overflow-x:clip}  /* clip statt hidden: sonst wirkt position:sticky nicht */
.tpl :where(a){color:inherit;text-decoration:none}
.tpl button{font:inherit}
/* Grundwerte des Designsystems im Vorlagenbereich neutralisieren,
   damit die Vorlage ihre eigene Typografie und Farbführung behält */
.tpl :where(h1,h2,h3,h4,h5,h6){color:inherit;font-family:inherit;font-weight:inherit;letter-spacing:normal;margin:0}
.tpl :where(p,ul,ol,li,figure,blockquote){margin:0}
.tpl :where(h1,h2,h3) em{color:inherit;font-style:normal}
.t-progress{position:fixed;right:0;top:0;width:3px;height:100vh;z-index:1000;background:#6f102211}
.t-progress i{display:block;height:var(--progress);background:var(--wine)}
.t-cta{min-height:48px;padding:0 20px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;background:var(--wine);color:#fff;font-size:13px;font-weight:700;border:0;cursor:pointer;box-shadow:0 12px 28px #6f102229;transition:.25s}
.t-cta:hover{transform:translateY(-2px);background:var(--wine2)}
.t-ghost{background:#fff;color:var(--wine);border:1px solid #E2D8D8;box-shadow:0 6px 18px rgba(23,19,20,.06)}
.t-light{background:#fff;color:var(--wine)}
.t-arrow{margin-left:8px}
.t-section{padding:120px clamp(22px,6vw,110px)}
.t-eyebrow{margin:0 0 17px;color:var(--wine);font-size:11.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase}
.t-heading{max-width:1150px;margin-bottom:55px}
.t-heading.t-center{text-align:center;margin-left:auto;margin-right:auto}
.t-heading h2{margin:0;font-family:"Playfair Display",serif;font-size:clamp(42px,5vw,76px);font-weight:500;line-height:1.04;letter-spacing:-.04em}
.t-heading h2 em{font-style:normal;color:var(--wine)}
.t-heading>p:not(.t-eyebrow){max-width:720px;color:var(--muted);font-size:16px;line-height:1.75;margin-top:23px}
.t-heading.t-center>p:not(.t-eyebrow){margin-left:auto;margin-right:auto}
.t-reveal{opacity:0;transform:translateY(22px);transition:opacity .75s,transform .75s}
.no-js .t-reveal,.no-io .t-reveal{opacity:1;transform:none}
.t-reveal.t-show{opacity:1;transform:none}
.t-heading.t-reveal h2{opacity:.35;transform:translateY(13px);transition:opacity .8s,transform .8s}
.t-heading.t-reveal>p{opacity:0;transform:translateY(10px);transition:opacity .7s .14s,transform .7s .14s}
.t-heading.t-show h2,.t-heading.t-show>p{opacity:1;transform:none}
.t-hero{min-height:calc(100vh - 68px);display:grid;grid-template-columns:1.04fr .96fr}
.t-hero{background:linear-gradient(158deg,#FCFBFA 0%,#F2EFEE 100%)}
.t-hero-copy{padding:40px 5vw 80px clamp(24px,6vw,110px);display:flex;flex-direction:column;justify-content:center}
.t-hero h1{margin:0;font-family:"Playfair Display",serif;font-size:clamp(64px,7vw,110px);font-weight:500;line-height:.93;letter-spacing:-.055em}
.t-hero h1 span{display:block;color:var(--wine)}
.t-hero-lead{max-width:690px;color:var(--muted);font-size:17px;line-height:1.72;margin:27px 0 0}
.t-actions{display:flex;gap:12px;margin-top:30px}
.t-micro{font-size:11.5px;color:#8d8586;margin-top:14px}
.t-proof{display:grid;grid-template-columns:repeat(4,1fr);margin-top:42px;padding-top:21px;border-top:1px solid var(--line)}
.t-proof span{display:grid;gap:4px;padding-right:14px}
.t-proof span+span{padding-left:14px;border-left:1px solid var(--line)}
.t-proof b{font-size:13px;color:var(--wine)}
.t-proof small{font-size:11px;color:var(--muted)}
.t-hero-art{min-height:620px;position:relative;overflow:hidden;display:grid;place-items:center;background:radial-gradient(circle at 48% 43%,#9b1d3a 0,#520a1a 42%,#28030c 77%)}
.t-hero-art:before{content:"";position:absolute;inset:0;background-image:linear-gradient(#ffffff08 1px,transparent 1px),linear-gradient(90deg,#ffffff08 1px,transparent 1px);background-size:42px 42px}
.t-system{position:relative;width:min(92%,650px);aspect-ratio:1}
.t-ring{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);border:1px solid #ffffff22;border-radius:50%;animation:spin 24s linear infinite}
.t-r1{width:70%;height:70%}
.t-r2{width:50%;height:50%;border-style:dashed;animation-direction:reverse}
.t-r3{width:31%;height:31%;animation-duration:13s}
.t-core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:140px;height:140px;border-radius:50%;display:grid;place-items:center;align-content:center;color:#fff;background:#ffffff17;border:1px solid #ffffff55;box-shadow:0 0 0 14px #ffffff0b,0 30px 70px #0006;backdrop-filter:blur(14px)}
.t-core b{font-family:"Playfair Display",serif;font-size:30px}
.t-core small{font-size:11px;letter-spacing:.14em;text-transform:uppercase}
.t-node{position:absolute;min-width:122px;padding:11px 14px;border-radius:11px;color:#fff;background:#1d010773;border:1px solid #ffffff33;backdrop-filter:blur(10px);display:grid;gap:3px;animation:float 4s ease-in-out infinite}
.t-node b{font-size:11.5px}
.t-node small{font-size:10.5px;color:#ffffff88}
.t-n1{left:2%;top:12%}
.t-n2{right:1%;top:12%;animation-delay:-.7s}
.t-n3{left:-1%;top:44%;animation-delay:-1.4s}
.t-n4{right:-1%;top:44%;animation-delay:-2.1s}
.t-n5{left:3%;bottom:11%;animation-delay:-2.8s}
.t-n6{right:1%;bottom:11%;animation-delay:-3.5s}
.t-status{position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:72%;padding:13px 16px;border-radius:11px;color:#fff;background:#160006aa;border:1px solid #ffffff29;display:flex;align-items:center;gap:12px;font-size:11.5px}
.t-dot{width:7px;height:7px;border-radius:50%;background:#eb6b84;box-shadow:0 0 0 5px #eb6b8422,0 0 15px #eb6b84}
.t-status b{margin-left:auto;color:#f3a1b3}
.t-strip{min-height:88px;padding:20px clamp(22px,6vw,110px);display:flex;align-items:center;justify-content:space-between;gap:30px;background:#fff;border-bottom:1px solid var(--line)}
.t-strip>span{font-size:11px;color:var(--muted);letter-spacing:.15em;text-transform:uppercase}
.t-strip div{display:flex;gap:20px;flex-wrap:wrap}
.t-strip b{font-size:11.5px;letter-spacing:.1em}
.t-strip i{width:3px;height:3px;border-radius:50%;background:var(--wine);align-self:center}
.t-problems{background:#fff}
.t-problem-grid{display:grid;grid-template-columns:repeat(5,1fr);border:1px solid var(--line);border-radius:18px;overflow:hidden}
.t-problem{min-height:300px;padding:27px;border-right:1px solid var(--line);transition:.3s}
.t-problem:last-child{border:0}
.t-problem:hover{background:#fdf5f6;transform:translateY(-4px)}
.t-problem>span{font-family:"Playfair Display",serif;color:var(--wine)}
.t-problem h3{font-family:"Playfair Display",serif;font-size:23px;font-weight:500;margin:70px 0 13px}
.t-problem p{color:var(--muted);font-size:13.5px;line-height:1.65}
.t-targets{background:var(--soft)}
.t-target-stage{display:grid;grid-template-columns:.66fr 1.34fr;border:1px solid var(--line);border-radius:19px;overflow:hidden;box-shadow:0 30px 70px #3c212716}
.t-target-tabs{background:#fff;border-right:1px solid var(--line)}
.t-target-tabs button{width:100%;min-height:125px;padding:16px 23px;border:0;border-bottom:1px solid var(--line);background:#fff;display:grid;grid-template-columns:36px 1fr;text-align:left;align-items:center;cursor:pointer}
.t-target-tabs .t-target-index{font-family:"Playfair Display",serif;color:#aaa}
.t-target-tabs .t-tab-copy{display:grid;gap:7px;color:inherit}
.t-target-tabs button b{font-size:13.5px;line-height:1.35}
.t-target-tabs button small{max-width:310px;color:var(--muted);font-size:10.5px;line-height:1.45;font-weight:500}
.t-target-tabs button.t-active{background:#fdf6f7;box-shadow:inset 3px 0 var(--wine);color:var(--wine)}
.t-target-panel{min-height:500px;padding:52px;display:flex;flex-direction:column;justify-content:space-between;background:linear-gradient(145deg,#fff,#f9f4f3);position:relative;overflow:hidden}
.t-target-panel:before{content:"";position:absolute;width:520px;height:520px;border-radius:50%;right:-170px;top:-220px;border:1px solid #6f102215;box-shadow:0 0 0 60px #6f102206,0 0 0 120px #6f102204}
.t-target-copy{position:relative}
.t-target-copy small{font-size:11px;color:var(--wine);letter-spacing:.16em;text-transform:uppercase}
.t-target-copy h3{max-width:850px;margin:12px 0 14px;font-family:"Playfair Display",serif;font-size:clamp(34px,3.5vw,56px);font-weight:500;line-height:1.06}
.t-target-copy p{max-width:700px;color:var(--muted);font-size:14px;line-height:1.7}
.t-flow{display:grid;grid-template-columns:repeat(5,1fr);margin:35px 0;position:relative}
.t-flow span{display:grid;justify-items:center;gap:10px;position:relative}
.t-flow i{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:#fff;border:1px solid #6f102244;color:var(--wine);font-family:"Playfair Display",serif;font-style:normal;position:relative;z-index:2}
.t-flow b{font-size:11.5px}
.t-flow span:not(:last-child):after{content:"";position:absolute;left:calc(50% + 22px);top:22px;width:calc(100% - 44px);height:1px;background:#6f102255}
.t-outcome{position:relative;display:flex;align-items:flex-start;gap:12px;padding:14px 16px;border-radius:11px;background:#fff;border:1px solid var(--line);font-size:13px;color:var(--muted);line-height:1.6}
.t-method{background:#fff}
.t-method-stage{display:grid;grid-template-columns:.55fr 1.45fr;border:1px solid var(--line);border-radius:19px;overflow:hidden;min-height:610px;box-shadow:0 35px 80px #34192014}
.t-phase-tabs{background:var(--paper);border-right:1px solid var(--line)}
.t-phase-tabs button{width:100%;min-height:98px;border:0;border-bottom:1px solid var(--line);background:transparent;display:grid;grid-template-columns:45px 1fr;text-align:left;align-items:center;padding:0 23px;cursor:pointer}
.t-phase-tabs span{font-family:"Playfair Display",serif;color:#aaa}
.t-phase-tabs b{font-size:13.5px}
.t-phase-tabs button.t-active{background:#fff;box-shadow:inset 3px 0 var(--wine);color:var(--wine)}
.t-phase-panel{padding:55px;display:grid;grid-template-columns:1fr 1fr;align-items:center;background:radial-gradient(circle at 30% 50%,#f5e6e9,#fff 57%)}
.t-phase-wheel{width:min(33vw,360px);aspect-ratio:1;border-radius:50%;border:1px solid #6f102222;display:grid;place-items:center;position:relative;margin:auto}
.t-phase-wheel:before,.t-phase-wheel:after{content:"";position:absolute;border-radius:50%;border:1px dashed #6f102233}
.t-phase-wheel:before{inset:15%;animation:spin 20s linear infinite}
.t-phase-wheel:after{inset:31%;animation:spin 15s linear reverse infinite}
.t-phase-wheel b{position:relative;z-index:2;width:92px;height:92px;border-radius:50%;display:grid;place-items:center;background:var(--wine);color:#fff;font-family:"Playfair Display",serif;font-size:32px;box-shadow:0 20px 45px #6f102233}
.t-phase-copy small{font-size:11px;color:var(--wine);text-transform:uppercase;letter-spacing:.14em}
.t-phase-copy h3{font-family:"Playfair Display",serif;font-size:50px;font-weight:500;margin:10px 0 14px}
.t-phase-copy p{color:var(--muted);font-size:15px;line-height:1.75}
.t-result{margin-top:25px;padding:15px;border:1px solid var(--line);border-radius:9px;display:grid;gap:4px}
.t-result span{font-size:11px;color:var(--muted);text-transform:uppercase}
.t-result b{font-size:13.5px;color:var(--wine)}
.t-solutions,.t-examples{color:#fff;background:radial-gradient(circle at 50% 0,#5c0d1d,#26030b 60%)}
.t-solutions .t-heading h2 em,.t-examples .t-heading h2 em{color:#efa3b3}
.t-solutions .t-heading>p:not(.t-eyebrow),.t-examples .t-heading>p:not(.t-eyebrow){color:#ffffff90}
.t-solution-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.t-solution{min-height:400px;padding:15px;border:1px solid #ffffff20;border-radius:17px;background:#ffffff08;transition:.3s}
.t-solution:hover{transform:translateY(-7px);background:#ffffff12}
.t-solution-art{height:165px;border-radius:11px;display:grid;place-items:center;position:relative;overflow:hidden;background:#ffffff0d}
.t-solution-art:before{content:"";position:absolute;width:180px;height:180px;border-radius:50%;border:1px solid #ffffff1f;box-shadow:0 0 0 32px #ffffff08,0 0 0 64px #ffffff05}
.t-solution-art>b{position:relative;width:60px;height:60px;border-radius:50%;display:grid;place-items:center;background:var(--wine);font-family:"Playfair Display",serif;font-size:22px}
.t-solution>div:last-child{padding:20px 10px}
.t-solution small{font-size:11px;color:#e98ca0}
.t-solution h3{font-family:"Playfair Display",serif;font-size:27px;font-weight:500;margin:8px 0 10px}
.t-solution p{font-size:13.5px;line-height:1.7;color:#ffffff90}
.t-tags{display:flex;gap:7px;flex-wrap:wrap;margin-top:16px}
.t-tags span{padding:6px 8px;border:1px solid #ffffff21;border-radius:999px;font-size:10.5px;color:#ffffffaa}
.t-process{background:#fff}
.t-process-grid{display:grid;grid-template-columns:repeat(5,1fr);position:relative}
.t-process-grid:before{content:"";position:absolute;top:30px;left:5%;right:5%;height:1px;background:var(--line)}
.t-process-grid article{padding:0 20px;position:relative}
.t-process-grid article>span{width:61px;height:61px;border-radius:50%;display:grid;place-items:center;position:relative;z-index:2;background:#fff;border:1px solid #6f102244;color:var(--wine);font-family:"Playfair Display",serif}
.t-process-grid h3{font-family:"Playfair Display",serif;font-size:22px;font-weight:500;margin:23px 0 9px}
.t-process-grid p{font-size:13px;color:var(--muted);line-height:1.7}
.t-example-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.t-example{--rx:0deg;--ry:0deg;padding:14px 14px 28px;border-radius:17px;border:1px solid #ffffff20;
  background:linear-gradient(145deg,#ffffff0d,#ffffff06);transition:transform .22s ease,border-color .3s,box-shadow .3s;
  transform-style:preserve-3d;will-change:transform}
.t-example.t-show{transform:perspective(1100px) rotateX(var(--rx)) rotateY(var(--ry))}
.t-example:hover{border-color:#ffffff36;box-shadow:0 26px 65px #13010678}
.t-demo{height:280px;border-radius:12px;padding:18px;background:radial-gradient(circle at 50% 15%,#74142b,#2a040d 68%);border:1px solid #ffffff18;position:relative;overflow:hidden;
  transform:translateZ(16px);box-shadow:inset 0 1px #ffffff14,0 18px 40px #16020840}
.t-demo:before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle,#ffffff22 1px,transparent 1px);background-size:24px 24px;opacity:.12}
.t-demo:after{content:"";position:absolute;left:12%;right:12%;top:-35%;height:52%;border-radius:50%;
  background:radial-gradient(ellipse,#ffffff16,transparent 68%);pointer-events:none}
.t-demo-head{position:relative;display:flex;justify-content:space-between;font-size:11px;color:#ffffff99;letter-spacing:.08em}
.t-demo-head em{font-style:normal;color:#f1a2b3}
.t-feed-window{position:relative;height:218px;margin-top:14px;overflow:hidden;
  -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 9%,#000 91%,transparent 100%);
  mask-image:linear-gradient(180deg,transparent 0,#000 9%,#000 91%,transparent 100%)}
.t-feed{position:relative;display:grid;gap:8px;padding:12px 0 32px;animation:tfeedtravel 9s ease-in-out infinite}
.t-feed div{padding:11px;border:1px solid #ffffff22;border-radius:8px;background:#ffffff0b;display:flex;align-items:center;gap:9px}
.t-feed div{animation:tfeedfocus 9s ease-in-out infinite}
.t-feed div:nth-child(2){animation-delay:-7.2s}.t-feed div:nth-child(3){animation-delay:-5.4s}
.t-feed div:nth-child(4){animation-delay:-3.6s}.t-feed div:nth-child(5){animation-delay:-1.8s}
.t-feed i{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:#a12641;font-size:11px;font-style:normal}
.t-feed span{display:grid;gap:2px}
.t-feed b{font-size:11.5px}
.t-feed small{font-size:10.5px;color:#ffffffa8}
.t-feed em{margin-left:auto;font-size:10.5px;font-style:normal;color:#ed8da1}
.t-gauge{position:relative;width:150px;height:150px;border-radius:50%;margin:25px auto 13px;display:grid;place-items:center;border:1px solid #ffffff21}
.t-gauge:before{content:"";position:absolute;inset:12%;border:7px solid #ffffff10;border-top-color:#e95878;border-right-color:#e95878;border-radius:50%;animation:spin 6s linear infinite}
.t-gauge b{font-family:"Playfair Display",serif;font-size:35px}
.t-kpis{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.t-kpis span{display:grid;text-align:center;gap:3px;padding:7px;background:#ffffff0b;border-radius:7px}
.t-kpis b{font-size:13px}
.t-kpis small{font-size:9.5px;color:#ffffffa8}
.t-demo-flow{position:relative;display:grid;grid-template-columns:repeat(4,1fr);margin-top:65px}
.t-demo-flow span{display:grid;justify-items:center;gap:9px}
.t-demo-flow i{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#ffffff10;border:1px solid #ffffff33;font-style:normal;font-size:11px}
.t-demo-flow b{font-size:10.5px}
.t-example>div:last-child{padding:20px 10px 0}
.t-example small{font-size:11px;color:#e98ca0;text-transform:uppercase}
.t-example h3{font-family:"Playfair Display",serif;font-size:27px;font-weight:500;margin:9px 0}
.t-example p{font-size:13.5px;line-height:1.7;color:#ffffff90}
@keyframes tfeedtravel{0%,12%,100%{transform:translateY(0)}48%,64%{transform:translateY(-58px)}}
@keyframes tfeedfocus{0%,22%,100%{background:#ffffff0b;border-color:#ffffff22}11%{background:#ffffff17;border-color:#f1acbb80;box-shadow:0 8px 24px #12010645}}
.t-difference{background:var(--paper)}
.t-diff-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.t-diff-grid article{min-height:265px;padding:27px;border-right:1px solid var(--line)}
.t-diff-grid article:last-child{border:0}
.t-diff-grid span{font-family:"Playfair Display",serif;color:var(--wine)}
.t-diff-grid h3{font-family:"Playfair Display",serif;font-size:24px;font-weight:500;margin:55px 0 12px}
.t-diff-grid p{font-size:13px;color:var(--muted);line-height:1.7}
.t-founder{display:grid;grid-template-columns:.8fr 1.2fr;gap:85px;align-items:center;background:#fff}
.t-founder-art{width:min(100%,520px);aspect-ratio:1;border-radius:50%;margin:auto;display:grid;place-items:center;position:relative;background:radial-gradient(circle,#eed7db,#faf5f4 48%,transparent 70%)}
.t-founder-art:before,.t-founder-art:after{content:"";position:absolute;border-radius:50%;border:1px solid #6f102222}
.t-founder-art:before{inset:8%;animation:spin 24s linear infinite}
.t-founder-art:after{inset:25%;border-style:dashed;animation:spin 18s linear reverse infinite}
.t-founder-art b{font-family:"Playfair Display",serif;color:var(--wine);font-size:64px}
.t-founder-copy h2{font-family:"Playfair Display",serif;font-size:clamp(40px,4.2vw,66px);font-weight:500;line-height:1.05;margin:0}
.t-founder-copy>p:not(.t-eyebrow){font-size:15px;line-height:1.8;color:var(--muted)}
.t-founder blockquote{margin:30px 0 20px;padding-left:20px;border-left:2px solid var(--wine);font-family:"Playfair Display",serif;font-size:23px;line-height:1.35}
.t-founder-copy>b{font-size:13px;color:var(--wine)}
.t-founder-copy small{display:block;font-size:11px;color:var(--muted)}
.t-analysis{background:var(--soft)}
.t-analyzer{border:1px solid var(--line);border-radius:19px;overflow:hidden;background:#fff;box-shadow:0 35px 90px #3e1f271c}
.t-analyzer-head{min-height:88px;padding:16px 26px;display:flex;align-items:center;border-bottom:1px solid var(--line)}
.t-analyzer-head>div:first-child{display:grid;gap:2px;min-width:160px}
.t-analyzer-head strong{font-family:"Playfair Display",serif;color:var(--wine);font-size:23px}
.t-analyzer-head small{font-size:11px;color:var(--wine)}
.t-stepbar{display:grid;grid-template-columns:repeat(3,1fr);flex:1}
.t-stepbar span{display:grid;justify-items:center;gap:6px;font-size:11px;color:#999}
.t-stepbar i{width:31px;height:31px;border-radius:50%;display:grid;place-items:center;background:var(--soft);border:1px solid var(--line);font-style:normal}
.t-stepbar .t-active{color:var(--wine);font-weight:700}
.t-stepbar .t-active i{background:var(--wine);color:#fff}
.t-analyzer-body{display:grid;grid-template-columns:1.08fr .92fr;min-height:560px}
.t-question{padding:45px}
.t-question h3{font-family:"Playfair Display",serif;font-size:clamp(37px,3.5vw,57px);font-weight:500;line-height:1.06;margin:0}
.t-question h3 em{font-style:normal;color:var(--wine)}
.t-question>p:not(.t-eyebrow){font-size:14px;color:var(--muted);line-height:1.7}
.t-choices{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;margin-top:30px}
.t-choices button{min-height:82px;padding:14px;border:1px solid var(--line);border-radius:10px;background:#fff;display:grid;grid-template-columns:31px 1fr auto;align-items:center;text-align:left;cursor:pointer}
.t-choices button span{font-family:"Playfair Display",serif;color:#aaa}
.t-choices button b{font-size:13px}
.t-choices button.t-selected{border-color:var(--wine);background:#fdf6f7;color:var(--wine);box-shadow:0 10px 24px #6f102217}
.t-check{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:var(--wine);color:#fff;font-size:11px}
.t-analyzer-art{position:relative;overflow:hidden;color:#fff;background:radial-gradient(circle at 50% 44%,#881b35,#4d0918 42%,#29040d 74%);display:grid;place-items:center}
.t-analyzer-art .t-phase-wheel{width:min(32vw,360px);border-color:#ffffff22}
.t-analyzer-art .t-phase-wheel:before,.t-analyzer-art .t-phase-wheel:after{border-color:#ffffff22}
.t-analyzer-art .t-phase-wheel b{background:#ffffff15;border:1px solid #ffffff33;font-size:26px}
.t-analyzer-summary{position:absolute;left:50%;bottom:32px;transform:translateX(-50%);width:68%;padding:15px;border-radius:11px;background:#14010699;border:1px solid #ffffff24;display:grid;gap:4px}
.t-analyzer-summary small{font-size:10.5px;color:#ffffffa8}
.t-analyzer-summary b{font-size:12px;color:#efa0b2}
.t-bar{height:4px;background:#ffffff1b;border-radius:9px;margin-top:8px}
.t-bar i{display:block;height:100%;width:33%;background:#e85d7c;border-radius:9px;transition:.35s}
.t-analyzer-foot{min-height:77px;padding:12px 18px;display:flex;align-items:center;gap:22px;border-top:1px solid var(--line)}
.t-analyzer-foot>span{font-size:11.5px;color:var(--muted)}
.t-analyzer-foot .t-back{margin-left:auto}
.t-summary-grid{display:grid;gap:8px;margin-top:25px}
.t-summary-grid span{padding:12px;border:1px solid var(--line);border-radius:9px;display:grid;gap:3px}
.t-summary-grid small{font-size:10.5px;color:var(--muted);text-transform:uppercase}
.t-summary-grid b{font-size:13px}
.t-faq{display:grid;grid-template-columns:.75fr 1.25fr;gap:80px;background:var(--paper)}
.t-faq-list details{border-top:1px solid var(--line)}
.t-faq-list details:last-child{border-bottom:1px solid var(--line)}
.t-faq-list summary{list-style:none;cursor:pointer;padding:24px 0;display:flex;justify-content:space-between;font-family:"Playfair Display",serif;font-size:19px}
.t-faq-list summary::-webkit-details-marker{display:none}
.t-faq-list summary span{color:var(--wine)}
.t-faq-list details p{margin:-4px 50px 24px 0;color:var(--muted);font-size:13.5px;line-height:1.75}
.t-final{min-height:620px;padding:100px 22px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#fff;background:radial-gradient(circle at 50% 115%,#9b1e3b,#6f1022 28%,#26030b 78%);position:relative;overflow:hidden}
.t-final:before{content:"";position:absolute;width:850px;height:850px;border:1px solid #ffffff12;border-radius:50%;box-shadow:0 0 0 110px #ffffff07,0 0 0 220px #ffffff05}
.t-final>*{position:relative}
.t-final h2{max-width:1050px;margin:0;font-family:"Playfair Display",serif;font-size:clamp(48px,5.7vw,86px);font-weight:500;line-height:1.02}
.t-final h2 em{font-style:normal;color:#f1acbb}
.t-final p{color:#ffffff99}
@keyframes spin{
  to{transform:rotate(360deg)}
}
@keyframes float{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-7px)}
}

@media(max-width:1100px){
  .t-hero{grid-template-columns:1fr 1fr}
  .t-hero h1{font-size:70px}
  .t-problem-grid{grid-template-columns:repeat(3,1fr)}
  .t-solution-grid{grid-template-columns:repeat(2,1fr)}
  .t-example-grid{grid-template-columns:1fr}
  .t-example{display:grid;grid-template-columns:1fr 1fr}
  .t-diff-grid,.t-footer-grid{grid-template-columns:repeat(2,1fr)}
  .t-analyzer-body{grid-template-columns:1fr}
  .t-analyzer-art{min-height:520px}
  .t-process-grid{grid-template-columns:repeat(3,1fr);gap:30px}
  .t-process-grid:before{display:none}
}
@media(max-width:760px){
  html{scroll-padding-top:70px}
  .t-section{padding:88px 19px}
  .t-heading h2{font-size:41px}
  .t-hero{grid-template-columns:1fr}
  .t-hero-copy{padding:58px 19px 70px}
  .t-hero h1{font-size:55px}
  .t-hero-lead{font-size:16px}
  .t-actions{display:grid}
  .t-cta{width:100%}
  .t-proof{grid-template-columns:1fr 1fr;gap:14px}
  .t-hero-art{min-height:570px}
  .t-node{min-width:100px;padding:9px}
  .t-strip{flex-direction:column;align-items:flex-start}
  .t-strip i{display:none}
  .t-problem-grid{grid-template-columns:1fr}
  .t-problem{min-height:230px;border-right:0;border-bottom:1px solid var(--line)}
  .t-target-stage,.t-method-stage{grid-template-columns:1fr}
  .t-target-tabs,.t-phase-tabs{display:flex;overflow:auto;border-right:0;border-bottom:1px solid var(--line)}
  .t-target-tabs button{min-width:280px;min-height:110px;border-right:1px solid var(--line)}
  .t-phase-tabs button{min-width:175px;min-height:72px;border-right:1px solid var(--line)}
  .t-target-panel{padding:32px 19px;min-height:550px}
  .t-target-copy h3{font-size:38px}
  .t-flow{overflow:auto}
  .t-flow span{min-width:95px}
  .t-phase-panel{grid-template-columns:1fr;padding:35px 18px;gap:30px}
  .t-phase-wheel{width:250px}
  .t-phase-copy{text-align:center}
  .t-solution-grid{grid-template-columns:1fr}
  .t-process-grid{grid-template-columns:1fr}
  .t-process-grid article{padding:18px 0 18px 76px;position:relative}
  .t-process-grid article>span{position:absolute;left:0;top:16px}
  .t-example{display:block}
  .t-diff-grid{grid-template-columns:1fr}
  .t-diff-grid article{border-right:0;border-bottom:1px solid var(--line)}
  .t-founder{grid-template-columns:1fr;gap:45px}
  .t-founder-copy h2{font-size:41px}
  .t-analyzer-head{display:block}
  .t-stepbar{margin-top:15px}
  .t-question{padding:32px 17px}
  .t-question h3{font-size:38px}
  .t-choices{grid-template-columns:1fr}
  .t-analyzer-art{min-height:470px}
  .t-analyzer-art .t-phase-wheel{width:310px}
  .t-analyzer-foot{flex-direction:column;align-items:stretch;gap:8px}
  .t-analyzer-foot .t-back{margin-left:0}
  .t-faq{grid-template-columns:1fr;gap:15px}
  .t-final h2{font-size:46px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}
  .t-reveal{opacity:1;transform:none}
  .t-feed,.t-feed div{animation:none!important;transform:none!important}
  .t-solution.t-show,.t-example.t-show{transform:none!important}
}
/* ── Bildmarke statt Buchstaben in den Grafiken ── */
.t-core b{display:flex;align-items:center;justify-content:center}
.t-core .tcm{width:76px;height:auto;display:block}
.t-founder-art b{display:flex;align-items:center;justify-content:center}
.t-founder-art .tcm{width:min(46%,210px);height:auto;display:block}
.t-founder-photo-wrap{width:min(100%,500px);aspect-ratio:auto;border-radius:28px;margin:auto;background:none;overflow:hidden;display:block;box-shadow:0 24px 60px rgba(46,7,16,.12)}
.t-founder-photo-wrap:before,.t-founder-photo-wrap:after{display:none}
.t-founder-photo{display:block;width:100%;height:auto;border-radius:28px}

.t-phase-wheel b .tcm{width:60px;height:auto;display:block}
.t-analyzer-art .t-phase-wheel b{display:flex;align-items:center;justify-content:center}

/* ── Lösungskarten sind Links ── */
a.t-solution{display:block;text-decoration:none}
a.t-solution:focus-visible{outline:2.5px solid #F1ACBB;outline-offset:3px}

/* ── Zielgruppen-Panel: Verweis auf die Detailseite ── */
.t-outcome a{color:var(--wine2);font-weight:700;text-decoration:underline;text-underline-offset:2px}
.t-solutions .t-outcome a,.t-examples .t-outcome a{color:#F1ACBB}

/* ── Sichtbarer Fokus im gesamten Vorlagenbereich ── */
.tpl :focus-visible{outline:2.5px solid var(--wine);outline-offset:3px;border-radius:4px}
.t-solutions :focus-visible,.t-examples :focus-visible,.t-final :focus-visible{outline-color:#F1ACBB}

/* ── Demo-Kennzeichnung ── */
.t-demo-note{position:relative;margin-top:12px;font-size:11px;color:#ffffff88;text-align:center}

/* ── Verweis unter dem Lösungsraster ── */
.t-sol-more{display:flex;justify-content:center;margin-top:34px}

/* ── Positionierungszeile über der Überschrift (nach Ihrer Vorlage) ── */
.t-position{font-family:'DM Sans',system-ui,sans-serif;font-weight:700;font-size:13px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--wine);margin:0 0 20px}

/* Objekte: leichte Füllung, damit sie im Glas wie Gegenstände wirken */
.obj .fill{fill:rgba(255,255,255,.07);stroke:none}
.obj .scr{fill:rgba(242,162,178,.13);stroke:rgba(255,255,255,.28);stroke-width:1.2}

/* ── Positionierungszeile über der Überschrift (nach Ihrer Vorlage) ── */
.t-position{font-family:'DM Sans',system-ui,sans-serif;font-weight:700;font-size:13px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--wine);margin:0 0 20px}

/* Objekte: leichte Füllung, damit sie im Glas wie Gegenstände wirken */
.obj .fill{fill:rgba(255,255,255,.07);stroke:none}
.obj .scr{fill:rgba(242,162,178,.13);stroke:rgba(255,255,255,.28);stroke-width:1.2}

/* ════════════════════════════════════════════════════════════════════
   HERO-BÜHNE · Ihr 3D-Render mit Bewegungsebene
   Das Bild bleibt unverändert. Bewegt werden Kamerafahrt, Podestleuchten,
   Energiewellen und ein Lichtstreif. Bei reduzierter Bewegung steht alles still.
   ════════════════════════════════════════════════════════════════════ */
.h3d{position:relative;width:100%;height:100%;min-height:660px;overflow:hidden;background:#170409}
.h3d-par{position:absolute;inset:0;transition:transform .55s cubic-bezier(.22,.7,.3,1);will-change:transform}

.h3d-cam{position:absolute;inset:0;transform-origin:52% 48%;
  animation:h3dken 28s ease-in-out infinite;will-change:transform}
.h3d-img{position:absolute;inset:0;display:block}
.h3d-img img{width:100%;height:100%;object-fit:cover;display:block}

/* Lichtfluss auf den vorhandenen Leuchtspuren */
.h3d-trace{position:absolute;inset:0;width:100%;height:100%;overflow:visible;
  mix-blend-mode:screen;pointer-events:none}
.h3d-trace path{fill:none;stroke:#FF5E7E;stroke-width:2.6;stroke-linecap:round;
  stroke-dasharray:13 100;stroke-dashoffset:0;
  filter:drop-shadow(0 0 5px rgba(255,70,110,.95)) drop-shadow(0 0 12px rgba(255,70,110,.55));
  animation:h3dtrace 2.9s linear infinite}
@keyframes h3dtrace{to{stroke-dashoffset:-113}}
@keyframes h3dken{0%,100%{transform:scale(1.01) translate(0,0)}
                  50%{transform:scale(1.045) translate(-.5%,-.6%)}}

/* Bewegungsebene */
.h3d-fx{position:absolute;inset:0;pointer-events:none;overflow:hidden}

/* Podestleuchten atmen */
.gl{position:absolute;left:var(--x);top:var(--y);width:var(--s);aspect-ratio:1;
  transform:translate(-50%,-50%);border-radius:50%;mix-blend-mode:screen;
  background:radial-gradient(circle,rgba(255,104,134,.50) 0%,rgba(255,74,110,.20) 42%,rgba(255,74,110,0) 68%);
  animation:h3dglow 4.8s ease-in-out infinite;animation-delay:var(--d,0s)}
.gl.core{background:radial-gradient(circle,rgba(255,132,158,.62) 0%,rgba(255,80,116,.26) 40%,rgba(255,80,116,0) 68%);
  animation-duration:6.2s}
@keyframes h3dglow{0%,100%{opacity:.22;transform:translate(-50%,-50%) scale(.9)}
                   50%{opacity:.72;transform:translate(-50%,-50%) scale(1.16)}}

/* Energiewellen vom Kern nach außen */
.wave{position:absolute;left:48%;top:52.9%;width:13%;aspect-ratio:1;transform:translate(-50%,-50%);
  border-radius:50%;border:1.5px solid rgba(255,120,150,.55);mix-blend-mode:screen;
  animation:h3dwave 7.5s cubic-bezier(.25,.6,.4,1) infinite}
.wave.w2{animation-delay:-2.5s}
.wave.w3{animation-delay:-5s}
@keyframes h3dwave{0%{opacity:0;transform:translate(-50%,-50%) scale(.45)}
                   14%{opacity:.55}
                   100%{opacity:0;transform:translate(-50%,-50%) scale(6.2)}}

/* langsamer Lichtstreif über die Szene */
.sweep{position:absolute;inset:-25% -45%;mix-blend-mode:screen;
  background:linear-gradient(112deg,transparent 42%,rgba(255,168,190,.10) 49%,transparent 57%);
  animation:h3dsweep 13s linear infinite}
@keyframes h3dsweep{0%{transform:translateX(-38%)}100%{transform:translateX(38%)}}

/* unsichtbare Flächen über den Podesten */
.h3d-hots{position:absolute;inset:0}
.hot{position:absolute;left:var(--x);top:var(--y);width:var(--w);height:var(--h);
  transform:translate(-50%,-50%);border-radius:18px;display:block}
.hot span{position:absolute;inset:0;border-radius:18px;border:1px solid transparent;
  background:radial-gradient(circle at 50% 60%,rgba(255,120,150,.16),rgba(255,120,150,0) 68%);
  opacity:0;transition:opacity .35s}
.hot:hover span,.hot:focus-visible span{opacity:1;border-color:rgba(255,150,175,.38)}
.hot:focus-visible{outline:none}

@media(max-width:1100px){
  .t-hero-art{min-height:0}
  .h3d{min-height:0;height:auto;aspect-ratio:890/1195}
  .h3d-img img{height:100%}
}

@media(prefers-reduced-motion:reduce){
  .h3d-cam,.gl,.wave,.sweep,.h3d-trace path{animation:none}
  .gl{opacity:.4}.wave{opacity:0}.h3d-trace{opacity:0}
}

/* ── Positionierungszeile über der Überschrift (nach Ihrer Vorlage) ── */
.t-position{font-family:'DM Sans',system-ui,sans-serif;font-weight:700;font-size:13px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--wine);margin:0 0 20px}

/* Objekte: leichte Füllung, damit sie im Glas wie Gegenstände wirken */
.obj .fill{fill:rgba(255,255,255,.07);stroke:none}
.obj .scr{fill:rgba(242,162,178,.13);stroke:rgba(255,255,255,.28);stroke-width:1.2}

/* ── Positionierungszeile über der Überschrift (nach Ihrer Vorlage) ── */
.t-position{font-family:'DM Sans',system-ui,sans-serif;font-weight:700;font-size:13px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--wine);margin:0 0 20px}

/* Objekte: leichte Füllung, damit sie im Glas wie Gegenstände wirken */
.obj .fill{fill:rgba(255,255,255,.07);stroke:none}
.obj .scr{fill:rgba(242,162,178,.13);stroke:rgba(255,255,255,.28);stroke-width:1.2}

/* ════════════════════════════════════════════════════════════════════
   HERO-BÜHNE · Ihr 3D-Render mit Bewegungsebene
   Das Bild bleibt unverändert. Bewegt werden Kamerafahrt, Podestleuchten,
   Energiewellen und ein Lichtstreif. Bei reduzierter Bewegung steht alles still.
   ════════════════════════════════════════════════════════════════════ */
.h3d{position:relative;width:100%;height:100%;min-height:660px;overflow:hidden;background:#170409}
.h3d-par{position:absolute;inset:0;transition:transform .55s cubic-bezier(.22,.7,.3,1);will-change:transform}

.h3d-cam{position:absolute;inset:0;transform-origin:52% 48%;
  animation:h3dken 28s ease-in-out infinite;will-change:transform}
.h3d-img{position:absolute;inset:0;display:block}
.h3d-img img{width:100%;height:100%;object-fit:cover;display:block}

/* Lichtfluss auf den vorhandenen Leuchtspuren */
.h3d-trace{position:absolute;inset:0;width:100%;height:100%;overflow:visible;
  mix-blend-mode:screen;pointer-events:none}
.h3d-trace path{fill:none;stroke:#FF5E7E;stroke-width:2.6;stroke-linecap:round;
  stroke-dasharray:13 100;stroke-dashoffset:0;
  filter:drop-shadow(0 0 5px rgba(255,70,110,.95)) drop-shadow(0 0 12px rgba(255,70,110,.55));
  animation:h3dtrace 2.9s linear infinite}
@keyframes h3dtrace{to{stroke-dashoffset:-113}}
@keyframes h3dken{0%,100%{transform:scale(1.01) translate(0,0)}
                  50%{transform:scale(1.045) translate(-.5%,-.6%)}}

/* Bewegungsebene */
.h3d-fx{position:absolute;inset:0;pointer-events:none;overflow:hidden}

/* Podestleuchten atmen */
.gl{position:absolute;left:var(--x);top:var(--y);width:var(--s);aspect-ratio:1;
  transform:translate(-50%,-50%);border-radius:50%;mix-blend-mode:screen;
  background:radial-gradient(circle,rgba(255,104,134,.50) 0%,rgba(255,74,110,.20) 42%,rgba(255,74,110,0) 68%);
  animation:h3dglow 4.8s ease-in-out infinite;animation-delay:var(--d,0s)}
.gl.core{background:radial-gradient(circle,rgba(255,132,158,.62) 0%,rgba(255,80,116,.26) 40%,rgba(255,80,116,0) 68%);
  animation-duration:6.2s}
@keyframes h3dglow{0%,100%{opacity:.22;transform:translate(-50%,-50%) scale(.9)}
                   50%{opacity:.72;transform:translate(-50%,-50%) scale(1.16)}}

/* Energiewellen vom Kern nach außen */
.wave{position:absolute;left:48%;top:52.9%;width:13%;aspect-ratio:1;transform:translate(-50%,-50%);
  border-radius:50%;border:1.5px solid rgba(255,120,150,.55);mix-blend-mode:screen;
  animation:h3dwave 7.5s cubic-bezier(.25,.6,.4,1) infinite}
.wave.w2{animation-delay:-2.5s}
.wave.w3{animation-delay:-5s}
@keyframes h3dwave{0%{opacity:0;transform:translate(-50%,-50%) scale(.45)}
                   14%{opacity:.55}
                   100%{opacity:0;transform:translate(-50%,-50%) scale(6.2)}}

/* langsamer Lichtstreif über die Szene */
.sweep{position:absolute;inset:-25% -45%;mix-blend-mode:screen;
  background:linear-gradient(112deg,transparent 42%,rgba(255,168,190,.10) 49%,transparent 57%);
  animation:h3dsweep 13s linear infinite}
@keyframes h3dsweep{0%{transform:translateX(-38%)}100%{transform:translateX(38%)}}

/* unsichtbare Flächen über den Podesten */
.h3d-hots{position:absolute;inset:0}
.hot{position:absolute;left:var(--x);top:var(--y);width:var(--w);height:var(--h);
  transform:translate(-50%,-50%);border-radius:18px;display:block}
.hot span{position:absolute;inset:0;border-radius:18px;border:1px solid transparent;
  background:radial-gradient(circle at 50% 60%,rgba(255,120,150,.16),rgba(255,120,150,0) 68%);
  opacity:0;transition:opacity .35s}
.hot:hover span,.hot:focus-visible span{opacity:1;border-color:rgba(255,150,175,.38)}
.hot:focus-visible{outline:none}

@media(max-width:1100px){
  .t-hero-art{min-height:0}
  .h3d{min-height:0;height:auto;aspect-ratio:890/1195}
  .h3d-img img{height:100%}
}

@media(prefers-reduced-motion:reduce){
  .h3d-cam,.gl,.wave,.sweep,.h3d-trace path{animation:none}
  .gl{opacity:.4}.wave{opacity:0}.h3d-trace{opacity:0}
}

/* ════════════════════════════════════════════════════════════════════
   HERO-BÜHNE rechts · Medaillon, zwei Bereiche, Rahmenzeilen
   Aufbau und Typografie nativ gebaut, nur das Medaillon ist ein Bild.
   ════════════════════════════════════════════════════════════════════ */
.med{container-type:inline-size;position:relative;width:100%;height:100%;min-height:660px;overflow:hidden;
  background:radial-gradient(ellipse 90% 70% at 56% 28%,#4E1D22 0%,#3A1418 38%,#280D11 72%,#1C080A 100%)}
/* feine Struktur wie im Render */
.med-noise{position:absolute;inset:0;pointer-events:none;opacity:.5;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)' opacity='.42'/%3E%3C/svg%3E");
  animation:medgrain 9s steps(4) infinite}
@keyframes medgrain{0%{transform:translate(0,0)}25%{transform:translate(-1%,1%)}
  50%{transform:translate(1%,-1%)}75%{transform:translate(-1%,-1%)}100%{transform:translate(0,0)}}

.med-in{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;
  padding:clamp(30px,5.2vh,74px) clamp(20px,4.6cqw,54px);
  transition:transform .55s cubic-bezier(.22,.7,.3,1);will-change:transform}

/* senkrechte Hilfslinien wie im Entwurf */
.med-guide{position:absolute;top:0;bottom:0;width:1px;background:rgba(255,255,255,.075)}
.med-guide.gl{left:clamp(20px,4.6cqw,54px)}
.med-guide.gr{right:clamp(20px,4.6cqw,54px)}

/* Rahmenzeilen */
.mline{display:block;height:1px;background:rgba(255,255,255,.19)}
.mcaps{text-align:center;font-family:'DM Sans',system-ui,sans-serif;font-weight:500;
  font-size:clamp(9.5px,1.95cqw,14px);letter-spacing:.2em;text-transform:uppercase;
  color:#C9B4B2;margin:0}
.mcaps i{font-style:normal;color:rgba(255,255,255,.38);padding:0 .35em}
.med-top .mcaps{margin-bottom:clamp(14px,1.8vh,22px)}
.med-bot .mcaps{margin:clamp(13px,1.7vh,20px) 0;font-size:clamp(8.6px,1.72cqw,13px);letter-spacing:.16em}

/* Mittelzeile */
.med-mid{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
  gap:0;flex:0 0 auto;margin:clamp(24px,8.5cqw,84px) 0}

/* Medaillon — vollständig gebaut, mit der echten Bildmarke */
.mcoin{position:relative;width:clamp(136px,27cqw,280px);aspect-ratio:1;justify-self:center;
  animation:medbreath 11s ease-in-out infinite}
@keyframes medbreath{0%,100%{transform:scale(1)}50%{transform:scale(1.028)}}
.mhalo{position:absolute;left:50%;top:50%;width:168%;aspect-ratio:1;transform:translate(-50%,-50%);
  border-radius:50%;z-index:0;
  background:radial-gradient(circle,rgba(190,72,88,.30) 0%,rgba(190,72,88,.09) 42%,rgba(190,72,88,0) 68%);
  animation:medhalo 7s ease-in-out infinite}
@keyframes medhalo{0%,100%{opacity:.5;transform:translate(-50%,-50%) scale(.96)}
                   50%{opacity:1;transform:translate(-50%,-50%) scale(1.08)}}

/* Rand: gedrehter Metallverlauf mit Fase */
.coin{position:absolute;inset:0;border-radius:50%;z-index:1;
  background:conic-gradient(from 202deg,#71363A 0deg,#9A5457 26deg,#4C2126 70deg,#8A4A4D 122deg,
    #3A171B 176deg,#6E3438 224deg,#A05B5E 282deg,#452025 330deg,#71363A 360deg);
  box-shadow:0 20px 38px rgba(0,0,0,.58),0 4px 10px rgba(0,0,0,.45),
    inset 0 2px 3px rgba(255,196,196,.32),inset 0 -4px 8px rgba(0,0,0,.55)}
/* Innenfläche */
.coin::before{content:"";position:absolute;inset:7.6%;border-radius:50%;
  background:radial-gradient(circle at 36% 26%,#422324 0%,#301719 44%,#210E11 100%);
  box-shadow:inset 0 7px 16px rgba(0,0,0,.78),inset 0 -4px 10px rgba(255,180,180,.09),
    0 0 0 1px rgba(255,205,205,.16),0 0 0 3px rgba(0,0,0,.35)}
/* schmaler Lichtreif zwischen Rand und Fläche */
.coin::after{content:"";position:absolute;inset:6.2%;border-radius:50%;pointer-events:none;
  border:1px solid rgba(255,215,215,.14);
  box-shadow:inset 0 -10px 16px rgba(255,200,200,.07)}
/* Struktur auf der Innenfläche */
.coin-face{position:absolute;inset:7.6%;border-radius:50%;pointer-events:none;opacity:.55;
  mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.1' numOctaves='4'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E")}
/* Glasreflex oben links */
.coin-gloss{position:absolute;inset:8.5%;border-radius:50%;pointer-events:none;
  background:radial-gradient(ellipse 68% 44% at 31% 19%,rgba(255,255,255,.17),rgba(255,255,255,0) 62%)}
/* Bildmarke, geprägt */
.coin-mark{position:absolute;left:50%;top:50%;width:52%;height:auto;transform:translate(-50%,-50%);
  filter:drop-shadow(0 2px 0 rgba(0,0,0,.5)) drop-shadow(0 4px 7px rgba(0,0,0,.55))
         drop-shadow(0 -1px 0 rgba(255,240,235,.22))}
/* wandernder Glanz auf dem Rand */
.msheen{position:absolute;inset:0;border-radius:50%;pointer-events:none;
  background:conic-gradient(from 0deg,transparent 0deg,rgba(255,224,228,.55) 20deg,transparent 54deg,
    transparent 186deg,rgba(255,224,228,.30) 208deg,transparent 244deg,transparent 360deg);
  -webkit-mask:radial-gradient(circle,transparent 0 43.5%,#000 45%,#000 49.6%,transparent 50.6%);
  mask:radial-gradient(circle,transparent 0 43.5%,#000 45%,#000 49.6%,transparent 50.6%);
  mix-blend-mode:screen;animation:medspin 16s linear infinite}
@keyframes medspin{to{transform:rotate(360deg)}}

/* Bereichsspalten */
.mcol{display:flex;align-items:center;text-decoration:none;min-width:0}
.mcol.l{justify-content:flex-end}
.mtxt{display:block;flex:1;min-width:0}
.mcol.l .mtxt{text-align:left}
.mnum{display:block;font-family:'DM Sans',system-ui,sans-serif;font-weight:500;font-size:clamp(9.5px,1.5cqw,12px);
  letter-spacing:.14em;color:#9C8583}
.mrule{display:block;height:1px;background:rgba(255,255,255,.22);margin:8px 0 13px}
.mname{display:block;font-family:'DM Sans',system-ui,sans-serif;font-weight:600;
  font-size:clamp(9.4px,1.76cqw,16px);letter-spacing:.025em;text-transform:uppercase;color:#F1EAE8;
  transition:color .3s;line-height:1.25}
.msub{display:block;margin-top:clamp(7px,1vh,12px);font-family:'DM Sans',system-ui,sans-serif;
  font-size:clamp(9.4px,1.5cqw,13.5px);color:#A38D8C;line-height:1.45;white-space:nowrap}
.mcol:hover .mname{color:#fff}
.mcol:focus-visible{outline:2px solid rgba(255,180,195,.7);outline-offset:10px;border-radius:6px}

/* Verbindung zum Medaillon */
.mconn{position:relative;flex:none;width:clamp(18px,4.6cqw,66px);height:1px;
  background:rgba(255,255,255,.22);margin:0 clamp(5px,1.1cqw,14px)}
.mring{position:absolute;top:50%;width:9px;height:9px;border-radius:50%;
  border:1px solid rgba(255,255,255,.5);background:rgba(30,10,14,.9);transform:translateY(-50%)}
.mcol.l .mring{left:-4px}
.mcol.r .mring{right:-4px}
.mflow{position:absolute;top:50%;width:16px;height:2px;border-radius:2px;transform:translateY(-50%);
  background:linear-gradient(90deg,rgba(255,150,170,0),#FF93AB,rgba(255,150,170,0));
  filter:drop-shadow(0 0 5px rgba(255,110,140,.9));animation:medflow 3.1s linear infinite}
.mcol.l .mflow{animation-name:medflow}
.mcol.r .mflow{animation-name:medflowr;animation-delay:-1.55s}
@keyframes medflow{0%{left:-6px;opacity:0}12%{opacity:1}88%{opacity:1}100%{left:calc(100% - 10px);opacity:0}}
@keyframes medflowr{0%{right:-6px;opacity:0}12%{opacity:1}88%{opacity:1}100%{right:calc(100% - 10px);opacity:0}}

@media(max-width:1100px){
  .t-hero-art{min-height:0}
  .med{min-height:0;aspect-ratio:1/.96}
  .med-in{padding:clamp(26px,5vw,44px) clamp(18px,4vw,34px)}
  .mconn{width:clamp(22px,3.4vw,40px)}
}
/* schmale Bildschirme: Bereiche unter das Medaillon, nichts wird abgeschnitten */
@media(max-width:620px){
  .med{aspect-ratio:auto;min-height:0}
  .med-in{position:relative;padding:34px 22px 78px}
  .med-mid{grid-template-columns:1fr;justify-items:center;gap:20px;margin:24px 0}
  .mcoin{grid-row:1;width:min(52vw,220px)}
  .mcol{width:100%;max-width:340px;justify-content:center}
  .mcol.l{justify-content:center}
  .mtxt{width:100%}
  .mcol.l{grid-row:2}.mcol.r{grid-row:3}
  .mconn{display:none}
  .mtxt{flex:0 1 auto}
  .mcol.l .mtxt,.mcol.r .mtxt{text-align:center;width:100%}
  .mrule{margin:7px auto 11px;width:70%}
  .mname{font-size:14px;letter-spacing:.04em}
  .msub{font-size:12.5px;white-space:normal}
  .mcaps{font-size:10px;letter-spacing:.12em}
  .med-bot .mcaps{font-size:9.5px;letter-spacing:.09em;white-space:normal;line-height:2}
  .med-guide{display:none}
}

@media(prefers-reduced-motion:reduce){
  .med-noise,.mcoin,.mhalo,.msheen,.mflow{animation:none}
  .mflow{opacity:0}
}

/* ════════════════════════════════════════════════════════════════════
   HERO-BÜHNE rechts · Kennzahlen-Raster mit Medaillon
   Vier Karten, die vierte in Weinrot, darüber mittig die Bildmarke.
   ════════════════════════════════════════════════════════════════════ */
.kpi{container-type:inline-size;position:relative;width:100%;height:100%;min-height:640px;
  display:flex;align-items:center;background:transparent}
.kpi-in{position:relative;width:100%;padding:clamp(24px,5cqw,58px);
  transition:transform .55s cubic-bezier(.22,.7,.3,1);will-change:transform}
.kpi-grid{display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:1fr;gap:clamp(12px,2.4cqw,22px)}

.kcard{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid #EDE8E6;
  border-radius:clamp(12px,1.8cqw,20px);padding:clamp(16px,3cqw,28px);text-decoration:none;color:inherit;
  box-shadow:0 10px 30px rgba(23,19,20,.05),0 2px 6px rgba(23,19,20,.03);
  min-height:clamp(150px,26cqw,230px);overflow:hidden;
  transition:transform .35s var(--ease,cubic-bezier(.22,.7,.3,1)),box-shadow .35s,border-color .35s}
.kcard:hover{transform:translateY(-4px);box-shadow:0 20px 44px rgba(23,19,20,.10);border-color:#E2D8D8}
.kcard:focus-visible{outline:2.5px solid var(--wine);outline-offset:4px}

.kc-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.kc-lab{font-family:'DM Sans',system-ui,sans-serif;font-weight:700;font-size:clamp(9.5px,1.5cqw,12px);
  letter-spacing:.14em;text-transform:uppercase;color:#8F8583}
.kc-ic{flex:none;width:clamp(14px,1.9cqw,18px);height:auto;fill:none;stroke:#B9AFAD;stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round;transition:stroke .3s}
.kcard:hover .kc-ic{stroke:var(--wine)}
.kc-num{display:block;margin-top:clamp(10px,1.8cqw,18px);font-family:'Playfair Display',Georgia,serif;
  font-weight:500;font-size:clamp(22px,4.4cqw,40px);letter-spacing:-.025em;line-height:1.05;color:#171314}
.kc-sub{display:block;margin-top:6px;font-family:'DM Sans',system-ui,sans-serif;
  font-size:clamp(10.5px,1.6cqw,13.5px);color:#9A8E8C}

.kcard.kcard-spotlight,.kcard.kcard-soft,.kcard.kcard-warm{background:linear-gradient(180deg,#FFFFFF 0%,#FCF8F8 100%)}
.kcard.kcard-spotlight{background:linear-gradient(180deg,#FFFDFC 0%,#FBF3F4 100%)}
.kcard.kcard-soft{background:linear-gradient(180deg,#FFFFFF 0%,#FAF8F8 100%)}
.kcard.kcard-warm{background:linear-gradient(180deg,#FFFDFC 0%,#FAF4F2 100%)}
.kc-state{display:inline-flex;align-items:center;align-self:flex-start;margin-top:12px;padding:6px 10px;border-radius:999px;
  font:700 clamp(10px,1.5cqw,12px)/1 'DM Sans',system-ui,sans-serif;letter-spacing:.02em;border:1px solid #E7D8DB;background:#fff;color:#7A1526}
.kc-state.up{background:#F9EEF0;border-color:#E6C8D0;color:#7A1526}
.kc-state.up::before,.kc-state.neutral::before,.kc-state.soft::before{content:"";width:7px;height:7px;border-radius:50%;margin-right:7px;background:currentColor;opacity:.8}
.kc-state.neutral{background:#F8F3F1;border-color:#E8DDD9;color:#6F5B57}
.kc-state.soft{background:#FBF1EE;border-color:#EDD6CF;color:#8A2837}
.kc-meta,.kc-slots,.kc-metrics{display:grid;gap:8px;margin-top:14px}
.kc-meta{grid-template-columns:1fr}
.kc-meta span,.kc-slots span,.kc-metrics span{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 11px;border-radius:12px;border:1px solid #EFE3E3;background:rgba(255,255,255,.72)}
.kc-meta span{font:600 clamp(10.5px,1.55cqw,13px)/1.2 'DM Sans',system-ui,sans-serif;color:#5F5654}
.kc-meta span b,.kc-slots span b,.kc-metrics span b{font-weight:700;color:#211A1B}
.kc-meta span i{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--wine);margin-right:8px;box-shadow:18px 0 0 rgba(111,16,34,.22),36px 0 0 rgba(111,16,34,.12)}
.kc-meta span{justify-content:flex-start}.kc-meta span b{margin-left:auto}
.kc-slots{grid-template-columns:1fr}
.kc-slots span{align-items:center}
.kc-slots span b{font-size:12px;color:#7A1526;min-width:42px}
.kc-slots span em{font-style:normal;font:600 clamp(10.5px,1.55cqw,13px)/1.2 'DM Sans',system-ui,sans-serif;color:#5F5654;flex:1}
.kc-metrics{grid-template-columns:repeat(3,1fr)}
.kc-metrics span{display:block;padding:10px 10px 9px}
.kc-metrics small{display:block;font:700 9px/1.1 'DM Sans',system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#9C8E8C;margin-bottom:6px}
.kc-metrics b{display:block;font:700 clamp(13px,2cqw,17px)/1 'DM Sans',system-ui,sans-serif;color:#1F191A}

/* Diagramme */
.kc-chart{display:block;width:100%;height:clamp(38px,7cqw,66px);margin-top:auto;padding-top:12px;overflow:visible}
.kc-chart .ln{fill:none;stroke:var(--wine);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:100;stroke-dashoffset:100;animation:kdraw 1.5s cubic-bezier(.4,0,.2,1) .35s forwards}
@keyframes kdraw{to{stroke-dashoffset:0}}
.kc-chart .dots circle{fill:var(--wine);opacity:0;animation:kdot .4s ease-out forwards}
.kc-chart .dots circle:nth-child(1){animation-delay:.45s}.kc-chart .dots circle:nth-child(2){animation-delay:.58s}
.kc-chart .dots circle:nth-child(3){animation-delay:.71s}.kc-chart .dots circle:nth-child(4){animation-delay:.84s}
.kc-chart .dots circle:nth-child(5){animation-delay:.97s}.kc-chart .dots circle:nth-child(6){animation-delay:1.1s}
.kc-chart .dots circle:nth-child(7){animation-delay:1.23s}.kc-chart .dots circle:nth-child(8){animation-delay:1.36s}
.kc-chart .dots circle:nth-child(9){animation-delay:1.49s}.kc-chart .dots circle:nth-child(10){animation-delay:1.62s}
@keyframes kdot{to{opacity:1}}
.kc-chart .dots .last{animation:kdot .4s ease-out 1.62s forwards,kpulse 2.6s ease-in-out 2.1s infinite}
@keyframes kpulse{0%,100%{r:4}50%{r:5.6}}
.kc-chart .area{fill:url(#kgrad);opacity:0;animation:kfade .9s ease-out .9s forwards}
@keyframes kfade{to{opacity:.12}}
.kc-chart .br{fill:var(--wine);transform-origin:50% 100%;transform:scaleY(0);
  animation:kbar .7s cubic-bezier(.3,1.3,.5,1) forwards}
@keyframes kbar{to{transform:scaleY(1)}}
.kc-chart.bars .br:nth-child(n+9){fill:var(--wine2,#8E1B31)}

/* Weinrote Karte */
.kcard.wine{background:linear-gradient(150deg,#7A1526 0%,#5E0F1C 100%);border-color:transparent;
  justify-content:flex-start}
.kcard.wine .kc-lab{padding-left:clamp(0px,3.2cqw,30px)}
.kcard.wine .kc-lab{color:rgba(255,255,255,.78)}
.kcard.wine p{margin-top:auto;font-family:'DM Sans',system-ui,sans-serif;
  font-size:clamp(11.5px,1.85cqw,15px);line-height:1.55;color:rgba(255,255,255,.9)}
.kc-clock{width:clamp(30px,5cqw,46px);height:auto;margin-top:clamp(12px,2.4cqw,22px);
  fill:none;stroke:rgba(255,255,255,.85);stroke-width:2.2;stroke-linecap:round}
.kcard.wine::after{content:"";position:absolute;inset:-40% -60%;pointer-events:none;
  background:linear-gradient(112deg,transparent 44%,rgba(255,255,255,.10) 50%,transparent 56%);
  animation:kshine 9s linear infinite}
@keyframes kshine{0%{transform:translateX(-30%)}100%{transform:translateX(30%)}}

/* Medaillon in der Mitte des Rasters */
.kbadge{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:clamp(56px,10.5cqw,96px);aspect-ratio:1;z-index:3;
  animation:medbreath 11s ease-in-out infinite}
@keyframes medbreath{0%,100%{transform:translate(-50%,-50%) scale(1)}
                     50%{transform:translate(-50%,-50%) scale(1.04)}}
.mhalo{position:absolute;left:50%;top:50%;width:180%;aspect-ratio:1;transform:translate(-50%,-50%);
  border-radius:50%;z-index:0;
  background:radial-gradient(circle,rgba(111,16,34,.20) 0%,rgba(111,16,34,.06) 44%,rgba(111,16,34,0) 70%);
  animation:medhalo 7s ease-in-out infinite}
@keyframes medhalo{0%,100%{opacity:.5;transform:translate(-50%,-50%) scale(.96)}
                   50%{opacity:1;transform:translate(-50%,-50%) scale(1.08)}}
.coin{position:absolute;inset:0;border-radius:50%;z-index:1;
  background:conic-gradient(from 202deg,#71363A 0deg,#9A5457 26deg,#4C2126 70deg,#8A4A4D 122deg,
    #3A171B 176deg,#6E3438 224deg,#A05B5E 282deg,#452025 330deg,#71363A 360deg);
  box-shadow:0 12px 26px rgba(23,19,20,.30),0 3px 8px rgba(23,19,20,.20),
    inset 0 2px 3px rgba(255,196,196,.32),inset 0 -4px 8px rgba(0,0,0,.5),
    0 0 0 clamp(5px,.9cqw,9px) #FBFAF9}
.coin::before{content:"";position:absolute;inset:7.6%;border-radius:50%;
  background:radial-gradient(circle at 36% 26%,#422324 0%,#301719 44%,#210E11 100%);
  box-shadow:inset 0 6px 14px rgba(0,0,0,.75),inset 0 -3px 8px rgba(255,180,180,.09),
    0 0 0 1px rgba(255,205,205,.16)}
.coin::after{content:"";position:absolute;inset:6.2%;border-radius:50%;pointer-events:none;
  border:1px solid rgba(255,215,215,.14)}
.coin-face{position:absolute;inset:7.6%;border-radius:50%;pointer-events:none;opacity:.5;
  mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.1' numOctaves='4'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E")}
.coin-gloss{position:absolute;inset:8.5%;border-radius:50%;pointer-events:none;
  background:radial-gradient(ellipse 68% 44% at 31% 19%,rgba(255,255,255,.17),rgba(255,255,255,0) 62%)}
.coin-mark{position:absolute;left:50%;top:50%;width:52%;height:auto;transform:translate(-50%,-50%);
  filter:drop-shadow(0 1px 0 rgba(0,0,0,.5)) drop-shadow(0 3px 5px rgba(0,0,0,.5))}
.msheen{position:absolute;inset:0;border-radius:50%;pointer-events:none;
  background:conic-gradient(from 0deg,transparent 0deg,rgba(255,224,228,.55) 20deg,transparent 54deg,
    transparent 186deg,rgba(255,224,228,.30) 208deg,transparent 244deg,transparent 360deg);
  -webkit-mask:radial-gradient(circle,transparent 0 43.5%,#000 45%,#000 49.6%,transparent 50.6%);
  mask:radial-gradient(circle,transparent 0 43.5%,#000 45%,#000 49.6%,transparent 50.6%);
  mix-blend-mode:screen;animation:medspin 16s linear infinite}
@keyframes medspin{to{transform:rotate(360deg)}}

@media(max-width:1100px){.t-hero-art{min-height:0}.kpi{min-height:0;padding:8px 0 28px}}
@media(max-width:560px){
  .kpi-grid{grid-template-columns:1fr}
  .kbadge{display:none}
  .kcard{min-height:0}
  .kc-metrics{grid-template-columns:1fr 1fr 1fr}
  .kc-meta span,.kc-slots span,.kc-metrics span{padding:8px 10px}
  .kpi-in{padding-bottom:76px}
}
@media(prefers-reduced-motion:reduce){
  .kc-chart .ln,.kc-chart .dots circle,.kc-chart .area,.kc-chart .br,
  .kcard.wine::after,.kbadge,.mhalo,.msheen{animation:none}
  .kc-chart .ln{stroke-dashoffset:0}.kc-chart .dots circle{opacity:1}
  .kc-chart .area{opacity:.12}.kc-chart .br{transform:none}
}

/* Hero rechts ist jetzt hell — dunkle Fläche und Raster der Vorlage aufheben */
.t-hero-art{background:none;min-height:0}
.t-hero-art::before{display:none}

/* ════════════════════════════════════════════════════════════════
   SCROLL-BÜHNEN · fünf Sektionen, die beim Scrollen stehen bleiben
   und ihre Schritte durchzählen (01 → 02 → 03 …).
   ════════════════════════════════════════════════════════════════ */
.t-stage{--step-scroll:40vh;--p:0;position:relative;
  height:calc(100vh - 68px + (var(--steps) - 1) * var(--step-scroll))}
.t-stage-in{position:sticky;top:68px;height:calc(100vh - 68px);
  display:flex;align-items:center;overflow:hidden}
@supports(height:100svh){
  .t-stage{height:calc(100svh - 68px + (var(--steps) - 1) * var(--step-scroll))}
  .t-stage-in{height:calc(100svh - 68px)}
}
.t-stage .t-heading{margin-bottom:clamp(18px,3vh,40px);max-width:900px}
.t-stage .t-heading h2{font-size:clamp(28px,3.5vw,54px);line-height:1.06}
.t-stage .t-heading>p{font-size:14.5px;margin-top:15px;max-width:640px}

/* gestapelte Schrittebenen — immer nur eine sichtbar */
.t-layerbox{display:grid}
.t-layer{grid-area:1/1;opacity:0;visibility:hidden;transform:translateY(16px);
  transition:opacity .5s cubic-bezier(.4,0,.2,1),transform .5s cubic-bezier(.4,0,.2,1)}
.t-layer.is-on{opacity:1;visibility:visible;transform:none}

/* ohne JavaScript: alles ausgeklappt, nichts klebt */
.no-js .t-stage{height:auto}
.no-js .t-stage-in{position:static;height:auto;padding:70px 0}
.no-js .t-layerbox{display:block}
.no-js .t-layer{opacity:1;visibility:visible;transform:none}

@keyframes tflow{to{background-position:0 10px}}
@keyframes tblink{0%,100%{opacity:1}50%{opacity:.3}}
@keyframes tpulse{0%,100%{box-shadow:0 0 0 0 #ff4d6326}50%{box-shadow:0 0 0 9px #ff4d6300}}
@keyframes tpulse2{0%,100%{box-shadow:0 0 0 0 #ffffff33}50%{box-shadow:0 0 0 12px #ffffff00}}
@keyframes tshine{0%{transform:translateX(-100%)}60%,100%{transform:translateX(100%)}}
@keyframes tdash{to{stroke-dashoffset:-22}}
@keyframes tbreath{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@keyframes tspark{0%{transform:translateY(0);opacity:0}12%{opacity:1}88%{opacity:1}100%{transform:translateY(420px);opacity:0}}
@keyframes tslide{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}

/* ── 01 · Die Ausgangslage ─────────────────────────────────────── */
.t-diag .t-stage-in{background:linear-gradient(158deg,#3A0714 0%,#26030B 55%,#190207 100%);color:#F3E9EA}
.t-diag-panel{width:100%;padding:clamp(24px,3vh,48px) clamp(22px,6vw,110px)}
.t-diag h2{color:#fff}
.t-diag .t-heading h2 em{color:#F1ACBB}
.t-diag .t-heading>p{color:#CDB6BA}
.t-diag-grid{display:grid;grid-template-columns:1fr 1.02fr;gap:clamp(26px,4vw,72px);align-items:start}
.t-count{display:flex;align-items:baseline;gap:14px}
.t-count b{font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#B98F98}
.t-count span{font-family:"Playfair Display",serif;font-size:17px;color:#8E6B72}
.t-count [data-num]{font-style:normal;font-size:31px;color:#F1ACBB}
.t-dcopy{margin:16px 0 clamp(18px,3vh,30px)}
.t-dstep h3{font-family:"Playfair Display",serif;font-size:clamp(22px,2.3vw,34px);font-weight:500;color:#fff;line-height:1.15}
.t-dstep p{margin-top:12px;color:#C7B0B4;font-size:14px;line-height:1.72;max-width:470px}
.t-rail{list-style:none;margin:0;padding:0;border-top:1px solid #ffffff1c}
.t-rail li{border-bottom:1px solid #ffffff12;position:relative}
.t-rail li::before{content:"";position:absolute;left:-16px;top:12%;bottom:12%;width:2px;
  background:#F1ACBB;transform:scaleY(0);transform-origin:center;transition:transform .45s}
.t-rail li.is-on::before{transform:scaleY(1)}
.t-rail button{width:100%;display:grid;grid-template-columns:34px 1fr;gap:10px;align-items:center;
  background:none;border:0;color:#A98D93;text-align:left;padding:10px 0;cursor:pointer;transition:.35s}
.t-rail button span{font-family:"Playfair Display",serif;font-size:14px;color:#7E5F66;transition:.35s}
.t-rail button b{font-size:13px;font-weight:500}
.t-rail button:hover{color:#EBD8DB}
.t-rail li.is-done button{color:#8F757B}
.t-rail li.is-on button{color:#fff}
.t-rail li.is-on button span{color:#F1ACBB}
.t-chain{display:grid;justify-items:stretch}
.t-cnode{display:grid;grid-template-columns:44px minmax(148px,auto) 1fr;align-items:center;gap:14px}
.t-cbox{width:44px;height:44px;border:1px solid #ffffff2b;border-radius:11px;display:grid;place-items:center;
  background:#ffffff08;transition:.4s}
.t-ic{width:20px;height:20px;fill:none;stroke:#E0C8CD;stroke-width:1.5;transition:.4s}
.t-cname{font-size:12px;letter-spacing:.15em;text-transform:uppercase;color:#BCA1A6;transition:.4s}
.t-cflag{justify-self:start;position:relative;padding-left:26px;font-size:11.5px;color:#FF95A3;opacity:0;transform:translateX(6px);transition:.4s;white-space:nowrap}
.t-cflag::before{content:"";position:absolute;left:0;top:50%;width:16px;height:1px;background:#FF5E75}
.t-cnode.is-hit .t-cflag{opacity:1;transform:none}
.t-cnode.is-hit .t-cbox{border-color:#FF7181;background:#ff4d6314;animation:tpulse 1.9s ease-in-out infinite}
.t-cnode.is-hit .t-ic{stroke:#FF95A3}
.t-cnode.is-hit .t-cname{color:#fff}
.t-clink{height:clamp(14px,2.4vh,26px);width:2px;margin-left:21px;position:relative;overflow:hidden}
.t-clink i{position:absolute;inset:0;
  background:repeating-linear-gradient(180deg,#ffffff3d 0 5px,transparent 5px 10px);
  background-size:2px 10px;animation:tflow 1s linear infinite}
.t-clink.is-cut i{background:repeating-linear-gradient(180deg,#FF5E75 0 5px,transparent 5px 10px);
  background-size:2px 10px;animation:tflow 1s linear infinite,tblink 1.5s ease-in-out infinite}
.t-dquote{margin-top:clamp(18px,3vh,34px);padding-left:18px;border-left:2px solid #F1ACBB;
  font-family:"Playfair Display",serif;font-size:clamp(17px,1.7vw,25px);color:#fff;line-height:1.32}
.t-dquote em{display:block;font-style:normal;color:#F1ACBB}

/* ── 02 · Die TC-Methode ───────────────────────────────────────── */
.t-meth .t-stage-in{background:linear-gradient(180deg,#fff 0%,#FBF7F6 100%)}
.t-meth-panel{width:100%;padding:clamp(24px,3vh,48px) clamp(22px,6vw,110px)}
.t-meth-grid{display:grid;grid-template-columns:.7fr .85fr 1fr;gap:clamp(18px,3vw,48px);align-items:center}
.t-mtabs{list-style:none;margin:0;padding:0;border-left:1px solid var(--line)}
.t-mtabs button{width:100%;display:grid;grid-template-columns:32px 1fr;gap:8px;align-items:center;
  background:none;border:0;text-align:left;padding:clamp(8px,1.3vh,14px) 0 clamp(8px,1.3vh,14px) 16px;
  cursor:pointer;color:#8C8280;transition:.35s;position:relative}
.t-mtabs li{position:relative}
.t-mtabs li::before{content:"";position:absolute;left:-1px;top:0;bottom:0;width:2px;background:var(--wine);
  transform:scaleY(0);transform-origin:top;transition:transform .45s}
.t-mtabs li.is-on::before{transform:scaleY(1)}
.t-mtabs span{font-family:"Playfair Display",serif;font-size:14px;color:#C0B4B2;transition:.35s}
.t-mtabs b{font-size:13.5px;font-weight:500}
.t-mtabs button:hover{color:var(--ink)}
.t-mtabs li.is-done button{color:#6d6462}
.t-mtabs li.is-on button{color:var(--wine)}
.t-mtabs li.is-on span{color:var(--wine)}
.t-stack-wrap{display:grid;place-items:center}
.t-stack{width:100%;max-height:min(50vh,430px)}
.t-stack-grid{fill:none;stroke:#E9E0DE;stroke-width:1;opacity:.55}
.t-stack-shadow{fill:#6F1022;opacity:.08;filter:blur(10px)}
.t-ptop{fill:#fff;stroke:#D9CDCB;stroke-width:1.2;transition:.45s}
.t-pdot{fill:#C9B9B7;transition:.45s}
.t-picon{fill:none;stroke:#fff;stroke-width:1.55;stroke-linecap:round;stroke-linejoin:round;transition:.45s}
.t-pflow{fill:none;stroke:#D8CBC9;stroke-width:1.4;stroke-dasharray:4 6;transition:.45s}
.t-punit{fill:#F8F3F2;stroke:#D8CBC9;stroke-width:1.2;transition:.45s}
.t-pstate{fill:none;stroke:#D8CBC9;stroke-width:2;stroke-linecap:round;transition:.45s}
/* Ebene noch nicht gebaut: nur angedeutet */
.t-plate.is-off .t-ptop{fill:#FBF8F7;stroke:#E6DCDA;stroke-dasharray:4 5}
.t-plate.is-off .t-pdot{fill:#DCD2D0}
.t-plate.is-off .t-pflow{stroke:#E2D9D7}
/* bereits gebaut */
.t-plate.is-lit .t-ptop{fill:#FBEEF0;stroke:#CE95A2}
.t-plate.is-lit .t-pdot{fill:#AF6374}
.t-plate.is-lit .t-pstate{stroke:#CE95A2}
.t-plate.is-lit .t-pflow{stroke:#CE95A2}
.t-plate.is-lit .t-punit{fill:#F3DDE2;stroke:#AF6374}
/* zuletzt hinzugekommen */
.t-plate.is-on .t-ptop{fill:#6F1022;stroke:#6F1022}
.t-plate.is-on .t-pdot{fill:#8E1B31;stroke:#E9B8C2;stroke-width:1}
.t-plate.is-on .t-pstate{stroke:#F1ACBB}
.t-plate.is-on .t-pflow{stroke:#F1ACBB}
.t-plate.is-on .t-punit{fill:#8E1B31;stroke:#F1ACBB}

/* Fix: Stack-Karten dürfen beim Scroll-/Step-Wechsel nicht schwarz werden */
.t-pmini{
  fill:#FFFFFF;
  stroke:#E6D9DC;
  stroke-width:1.2;
  transition:fill .45s,stroke .45s,opacity .45s;
}
.t-pstat{
  fill:#FFFFFF;
  stroke:#E6D9DC;
  stroke-width:1.2;
  transition:fill .45s,stroke .45s,opacity .45s;
}
.t-p-label{
  fill:#8C7D80;
  font-family:"DM Sans",system-ui,sans-serif;
  font-size:10px;
  font-weight:700;
  letter-spacing:.08em;
}
.t-p-title{
  fill:#2B2425;
  font-family:"DM Sans",system-ui,sans-serif;
  font-size:16px;
  font-weight:700;
}
.t-p-value{
  fill:#6F1022;
  font-family:"DM Sans",system-ui,sans-serif;
  font-size:16px;
  font-weight:800;
}
.t-p-sub{
  fill:#9A8C8F;
  font-family:"DM Sans",system-ui,sans-serif;
  font-size:9px;
  font-weight:600;
}
.t-pstatus{
  fill:#7ECF65;
  stroke:#FFFFFF;
  stroke-width:1.2;
}
.t-plate.is-off .t-pmini,
.t-plate.is-off .t-pstat{
  fill:#FFFDFC;
  stroke:#E9DEDF;
}
.t-plate.is-off .t-p-title{fill:#625A5C}
.t-plate.is-off .t-p-label,
.t-plate.is-off .t-p-sub{fill:#A99B9E}
.t-plate.is-off .t-pstatus{fill:#CFC5C7}
.t-plate.is-lit .t-pmini,
.t-plate.is-lit .t-pstat{
  fill:#FFFFFF;
  stroke:#DDBFC6;
}
.t-plate.is-lit .t-p-title{fill:#5F2834}
.t-plate.is-lit .t-p-value{fill:#7A1526}
.t-plate.is-lit .t-pstatus{fill:#7ECF65}
.t-plate.is-on .t-pmini{
  fill:#FFFFFF;
  stroke:#F0D9DE;
}
.t-plate.is-on .t-pstat{
  fill:#8E1B31;
  stroke:#C96A7D;
}
.t-plate.is-on .t-p-label{fill:#F1C6CF}
.t-plate.is-on .t-p-title{fill:#FFFFFF}
.t-plate.is-on .t-p-value{fill:#FFFFFF}
.t-plate.is-on .t-p-sub{fill:#F0C5CE}
.t-plate.is-on .t-pstatus{
  fill:#A9E17F;
  stroke:#7A1526;
}

.t-beam{fill:none;stroke:#D8CBC9;stroke-width:1.5}
.t-spark{fill:#8E1B31;animation:tspark 3.6s ease-in-out infinite}
.t-mnum{display:block;font-family:"Playfair Display",serif;font-size:clamp(40px,4.6vw,74px);
  line-height:1;color:#EADADD}
.t-mstep h3{font-family:"Playfair Display",serif;font-size:clamp(24px,2.5vw,40px);font-weight:500;margin-top:-6px}
.t-mstep p{color:var(--muted);font-size:14px;line-height:1.75;margin-top:11px;max-width:430px}
.t-mstep .t-result{max-width:300px}
.t-mrail{margin-top:clamp(16px,2.6vh,32px);display:grid;gap:11px}
.t-mrail-bar{height:2px;background:var(--line);position:relative;overflow:hidden}
.t-mrail-bar i{position:absolute;left:0;top:0;bottom:0;background:var(--wine);width:calc(var(--p) * 100%)}
.t-mrail-lab{font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.t-mrail-lab b{font-family:"Playfair Display",serif;font-size:17px;letter-spacing:0;color:var(--wine)}
.t-mname{display:inline-grid;vertical-align:bottom}
.t-mname em{font-style:normal;color:var(--ink)}

/* ── 03 · Individuelle Architektur ─────────────────────────────── */
.t-arch .t-stage-in{background:var(--paper)}
.t-arch-panel{width:100%;padding:clamp(24px,3vh,48px) clamp(22px,6vw,110px)}
.t-arch-grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:clamp(20px,3vw,52px);align-items:stretch}
.t-arch-left{background:linear-gradient(165deg,#7C1226 0%,#4A0A17 100%);color:#fff;border-radius:20px;
  padding:clamp(22px,2.6vw,40px);display:flex;flex-direction:column;justify-content:center;
  box-shadow:0 30px 70px #6f10221f}
.t-sliders{list-style:none;margin:0;padding:0;display:grid;gap:clamp(13px,2.1vh,26px)}
.t-sl-top{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:9px}
.t-sl-top b{font-size:13.5px;font-weight:500}
.t-sl-top em{font-style:normal;font-size:11.5px;color:#F1ACBB;opacity:0;transform:translateY(4px);transition:.45s}
.t-sliders li.is-on .t-sl-top em,.t-sliders li.is-done .t-sl-top em{opacity:1;transform:none}
.t-track{display:block;height:5px;border-radius:3px;background:#ffffff24;position:relative;overflow:hidden}
.t-track i{position:absolute;left:0;top:0;bottom:0;width:12%;border-radius:3px;
  background:linear-gradient(90deg,#C8607A,#F1ACBB);transition:width .75s cubic-bezier(.4,0,.2,1)}
.t-sliders li.is-on .t-track i,.t-sliders li.is-done .t-track i{width:var(--soll)}
.t-sliders li.is-on .t-track::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,transparent,#ffffff59,transparent);animation:tshine 2.4s ease-in-out infinite}
.t-arch-note{margin-top:clamp(18px,2.6vh,28px);font-size:13px;line-height:1.7;color:#DCC4C8}
.t-arch-right{display:flex;flex-direction:column;gap:clamp(10px,1.8vh,20px)}
.t-arch-caps{display:flex;align-items:center;gap:12px;font-size:10.5px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--muted)}
.t-arch-caps i{width:4px;height:4px;border-radius:50%;background:#C9B9B7}
.t-radial{position:relative;flex:1;min-height:min(44vh,340px);display:grid;place-items:center}
.t-rlines{position:absolute;inset:0;width:100%;height:100%}
.t-rlines path{fill:none;stroke:#D3C6C4;stroke-width:1.4;vector-effect:non-scaling-stroke;stroke-dasharray:5 6;
  animation:tdash 1.8s linear infinite;transition:stroke .45s,stroke-width .45s}
.t-rlines path.is-on{stroke:#8E1B31;stroke-width:2}
.t-rcore{width:clamp(118px,13vw,164px);aspect-ratio:1;border-radius:26px;position:relative;z-index:2;
  background:linear-gradient(160deg,#8E1B31,#55091B);color:#fff;display:grid;place-content:center;
  text-align:center;gap:6px;padding:14px;box-shadow:0 26px 58px #6f102230;animation:tbreath 5.5s ease-in-out infinite}
.t-rcore b{font-family:"Playfair Display",serif;font-size:clamp(16px,1.5vw,21px);font-weight:500}
.t-rcore small{font-size:10.5px;color:#E9C8CE;line-height:1.4}
.t-abox{position:absolute;width:clamp(132px,14vw,188px);padding:13px 15px;background:#fff;
  border:1px solid var(--line);border-radius:14px;box-shadow:0 12px 28px #3419200f;transition:.45s;z-index:2}
.t-abox b{display:block;font-size:13px}
.t-abox small{display:block;margin-top:5px;font-size:11px;color:var(--muted);line-height:1.5}
.t-abox[data-box="0"]{left:0;top:6%}
.t-abox[data-box="1"]{right:0;top:6%}
.t-abox[data-box="2"]{right:0;bottom:6%}
.t-abox[data-box="3"]{left:0;bottom:6%}
.t-abox.is-on{border-color:#6F1022;box-shadow:0 22px 46px #6f102224;transform:translateY(-4px)}
.t-abox.is-on b{color:var(--wine)}
.t-chip{align-self:flex-start;padding:9px 16px;border:1px solid var(--line);border-radius:999px;
  background:#fff;font-size:11px;letter-spacing:.06em;color:var(--muted)}

/* ── 04 · Die Zusammenarbeit ───────────────────────────────────── */
.t-work .t-stage-in{background:linear-gradient(150deg,#7C1226 0%,#5A0C1C 48%,#3A0713 100%);color:#fff}
.t-work-panel{width:100%;padding:clamp(24px,3vh,48px) clamp(22px,6vw,110px)}
.t-work h2{color:#fff}
.t-work .t-heading h2 em{color:#F1ACBB}
.t-timeline{position:relative;display:flex;align-items:flex-start;justify-content:space-between;
  max-width:940px;margin:0 auto clamp(22px,4vh,44px)}
.t-tline{position:absolute;left:10%;right:10%;top:25px;height:2px;background:#ffffff24}
.t-tline i{display:block;height:100%;background:#F1ACBB;width:calc(var(--p) * 100%)}
.t-tnode{width:20%;background:none;border:0;color:#fff;display:grid;justify-items:center;gap:11px;
  cursor:pointer;position:relative;z-index:2;padding:0}
.t-tdot{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;position:relative;
  border:1px solid #ffffff3d;background:#4E0A19;font-family:"Playfair Display",serif;font-size:15px;transition:.4s}
.t-tdot b{transition:opacity .3s}
.t-tcheck{position:absolute;font-style:normal;font-size:19px;opacity:0;transition:opacity .3s}
.t-tnode.is-done .t-tdot{background:#F1ACBB;border-color:#F1ACBB;color:#4E0A19}
.t-tnode.is-done .t-tdot b{opacity:0}
.t-tnode.is-done .t-tcheck{opacity:1}
.t-tnode.is-on .t-tdot{background:#fff;border-color:#fff;color:var(--wine);animation:tpulse2 2.4s ease-in-out infinite}
.t-tname{font-size:12px;letter-spacing:.06em;color:#D2B6BB;transition:.35s;text-align:center}
.t-tnode.is-on .t-tname{color:#fff}
.t-tcards{max-width:620px;margin:0 auto;width:100%}
.t-tcard{background:#fff;color:var(--ink);border-radius:18px;padding:clamp(20px,2.6vw,34px);
  box-shadow:0 30px 70px #16020740}
.t-tstep{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--wine)}
.t-tcard h3{font-family:"Playfair Display",serif;font-size:clamp(22px,2.4vw,36px);font-weight:500;margin-top:9px}
.t-tcard p{color:var(--muted);font-size:14px;line-height:1.7;margin-top:10px}

/* ── 05 · Was uns unterscheidet ────────────────────────────────── */
.t-diff .t-stage-in{background:#fff}
.t-diff-panel{width:100%;padding:clamp(24px,3vh,48px) clamp(22px,6vw,110px)}
.t-dcols{display:grid;grid-template-columns:.88fr 1.12fr;gap:clamp(22px,4vw,64px);align-items:center}
.t-diff-left{background:linear-gradient(165deg,#7C1226 0%,#440815 100%);color:#fff;border-radius:20px;
  padding:clamp(24px,3vw,44px);box-shadow:0 30px 70px #6f10221f}
.t-dclaim{display:block;font-family:"Playfair Display",serif;font-size:clamp(26px,2.9vw,46px);
  font-weight:500;line-height:1.14}
.t-dflow{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin:clamp(16px,2.6vh,30px) 0}
.t-dflow span{padding:7px 13px;border:1px solid #ffffff2e;border-radius:999px;font-size:10.5px;
  letter-spacing:.16em;text-transform:uppercase;transition:.4s}
.t-dflow span.is-on{background:rgba(255,255,255,.16);color:#fff;border-color:rgba(255,255,255,.5)}
.t-dflow span.is-now{background:#fff;color:var(--wine);border-color:#fff}
.t-dflow i{width:18px;height:1px;background:#ffffff3d;position:relative;overflow:hidden}
.t-dflow i::after{content:"";position:absolute;inset:0;background:#F1ACBB;animation:tslide 1.9s linear infinite}
.t-diff-left p{font-size:13.5px;line-height:1.7;color:#DCC2C6}
.t-ulist{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.t-ulist button{width:100%;display:grid;grid-template-columns:52px 1fr;gap:14px;align-items:start;
  text-align:left;background:#FBF7F6;border:1px solid var(--line);border-radius:14px;
  padding:clamp(13px,1.7vw,21px);cursor:pointer;transition:.45s;position:relative;overflow:hidden}
.t-unum{font-family:"Playfair Display",serif;font-size:25px;color:#C6ADB2;transition:.45s}
.t-utxt b{display:block;font-size:15px}
.t-utxt small{display:block;margin-top:6px;font-size:12.5px;color:var(--muted);line-height:1.65}
.t-uline{position:absolute;left:0;top:0;bottom:0;width:3px;background:#F1ACBB;
  transform:scaleY(0);transform-origin:top;transition:transform .5s}
.t-ulist li.is-on button{background:linear-gradient(120deg,#6F1022,#480916);border-color:#6F1022;color:#fff;
  transform:translateX(7px);box-shadow:0 22px 44px #6f102226}
.t-ulist li.is-on .t-unum{color:#F1ACBB}
.t-ulist li.is-on .t-utxt small{color:#E2C9CD}
.t-ulist li.is-on .t-uline{transform:scaleY(1)}

/* ── kleinere Bildschirme ──────────────────────────────────────── */
@media(max-width:1080px){
  .t-meth-grid{grid-template-columns:.8fr 1.2fr}
  .t-stack-wrap{display:none}
}
@media(max-width:980px){
  .t-stage{--step-scroll:36vh}
  .t-diag-grid,.t-arch-grid,.t-dcols{grid-template-columns:1fr}
  .t-diag-right{display:grid;gap:14px}
  .t-radial{display:grid;grid-template-columns:1fr 1fr;gap:9px;min-height:0}
  .t-rlines{display:none}
  .t-rcore{grid-column:1/-1;width:100%;aspect-ratio:auto;padding:16px;animation:none}
  .t-abox{position:static;width:auto}
  .t-arch-left{order:2}
  .t-chain{display:none}
}
@media(max-width:900px){
  /* Auf kleinen Geräten muss der Inhalt in eine Bildschirmhöhe passen */
  .t-stage-in{align-items:flex-start}
  .t-stage .t-heading{margin-bottom:14px}
  .t-diag-panel,.t-meth-panel,.t-arch-panel,.t-work-panel,.t-diff-panel{padding-top:20px;padding-bottom:20px}
  .t-arch-left{padding:16px 18px}
  .t-sliders{gap:11px}
  .t-arch-note,.t-arch-caps{display:none}
  .t-abox{padding:10px 12px}
  .t-abox small{margin-top:3px}
  .t-rcore{padding:12px}
  .t-radial{gap:7px}
  .t-chip{font-size:10.5px;padding:7px 12px}
  .t-diff-left{padding:18px}
  .t-diff-left p{display:none}
  .t-dclaim{font-size:25px}
  .t-dflow{margin:14px 0 0}
  .t-ulist{gap:7px}
  .t-ulist button{padding:11px 12px}
  .t-utxt small{font-size:11.5px;margin-top:4px}
  .t-tcard{padding:18px}
  .t-mstep p{font-size:13px}
}
@media(max-width:640px){
  .t-stage{--step-scroll:30vh}
  .t-stage .t-heading h2{font-size:clamp(26px,7vw,34px)}
  .t-tdot{width:40px;height:40px;font-size:13px}
  .t-tname{display:none}
  .t-tline{top:19px}
  .t-mtabs{display:none}
  .t-meth-grid{grid-template-columns:1fr}
  .t-ulist button{grid-template-columns:38px 1fr;gap:10px}
  .t-dquote{font-size:17px}
}

@media(prefers-reduced-motion:reduce){
  .t-clink i,.t-cnode.is-hit .t-cbox,.t-spark,.t-rcore,.t-rlines path,
  .t-sliders li.is-on .t-track::after,.t-tnode.is-on .t-tdot,.t-dflow i::after{animation:none}
  .t-layer{transition:opacity .2s}
}

/* ── Berufssuche in der Bereichs-Sektion ──────────────────────────── */
.t-berufe{position:relative;max-width:780px;margin:0 0 clamp(22px,3vh,36px)}
.t-bfield{display:grid;grid-template-columns:22px 1fr auto;align-items:center;gap:12px;
  background:#fff;border:1px solid var(--line);border-radius:12px;padding:0 16px;height:56px;
  box-shadow:0 10px 26px #34192010;transition:.3s}
.t-bfield:focus-within{border-color:var(--wine);box-shadow:0 14px 34px #6f10221f}
.t-bic{width:20px;height:20px;fill:none;stroke:#9A8E8C;stroke-width:1.6}
.t-bfield input{border:0;background:none;font:inherit;font-size:15px;color:var(--ink);
  width:100%;padding:0}
.t-bfield input:focus,.t-bfield input:focus-visible{outline:0}
.t-bfield input::placeholder{color:#A79C9A}
.t-bfield input::-webkit-search-cancel-button{display:none}
.t-bclear{border:0;background:none;font-size:22px;line-height:1;color:#9A8E8C;cursor:pointer;padding:0 4px}
.t-bclear:hover{color:var(--wine)}
.t-bhits{position:absolute;left:0;right:0;top:60px;z-index:20;list-style:none;margin:0;padding:6px;
  background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 24px 54px #34192021;
  max-height:320px;overflow:auto}
.t-bhits button{width:100%;display:flex;justify-content:space-between;align-items:center;gap:16px;
  background:none;border:0;border-radius:8px;padding:11px 12px;text-align:left;cursor:pointer;transition:.18s}
.t-bhits button b{font-size:14px;font-weight:500}
.t-bhits button span{font-size:11.5px;color:var(--muted);white-space:nowrap}
.t-bhits button:hover,.t-bhits button.t-bsel{background:var(--soft)}
.t-bhits button:hover b,.t-bhits button.t-bsel b{color:var(--wine)}
.t-bhint{margin-top:11px;font-size:12.5px;line-height:1.6;color:var(--muted)}
.t-bcard{margin-top:16px;background:#fff;border:1px solid var(--line);border-radius:16px;
  padding:clamp(18px,2.2vw,26px);box-shadow:0 18px 44px #34192012}
.t-bcard-top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;
  padding-bottom:14px;border-bottom:1px solid var(--line)}
.t-bcard-top b{display:block;font-family:"Playfair Display",serif;font-size:clamp(20px,2vw,27px);font-weight:500}
.t-bcard-top span{display:block;margin-top:5px;font-size:11.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--wine)}
.t-bclose{border:0;background:none;font-size:24px;line-height:1;color:#9A8E8C;cursor:pointer;padding:0 2px}
.t-bclose:hover{color:var(--wine)}
.t-bsys{list-style:none;margin:16px 0 18px;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.t-bsys li{display:grid;grid-template-columns:30px 1fr;gap:9px;align-items:start}
.t-bnum{font-family:"Playfair Display",serif;font-size:17px;color:#C6ADB2}
.t-bsys b{display:block;font-size:13.5px;line-height:1.35}
.t-bsys small{display:block;margin-top:6px;font-size:12.5px;line-height:1.6;color:var(--muted)}
@media(max-width:860px){
  .t-bsys{grid-template-columns:1fr;gap:11px}
  .t-bfield{height:52px}
}

/* ── Bildplätze ───────────────────────────────────────────────────── */
.tcbild{position:relative;margin:0;border-radius:14px;overflow:hidden;
  aspect-ratio:var(--ar,4/3);background:var(--soft)}
.tcbild img{display:block;width:100%;height:100%;object-fit:cover}
.tcph{display:grid;place-items:center;text-align:center;
  background:linear-gradient(150deg,#F8F0F1 0%,#EFE3E4 100%);border:1px dashed #CDB2B8}
.tcph.hell{background:linear-gradient(150deg,#ffffff12,#ffffff06);border-color:#ffffff2e}
.tcph-in{display:grid;justify-items:center;gap:7px;padding:clamp(10px,1.8vw,20px);max-width:44ch}
.tcph-mark{width:42px;height:27px;opacity:.45}
.tcph b{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--wine)}
.tcph.hell b{color:#F1ACBB}
.tcph.hell .tcph-mark{opacity:.55}
.tcph small{font-size:11.5px;line-height:1.55;color:var(--muted)}
.tcph.hell small{color:#D2B9BE}
.tcgrund{position:absolute;inset:0;background:var(--bild) center/cover;
  opacity:var(--deckung);pointer-events:none}

/* Bereichsbild in der Bereichsauswahl */
.t-target-panel{display:grid;grid-template-columns:1fr minmax(210px,.56fr);
  align-items:center;column-gap:clamp(20px,2.6vw,44px)}
.t-target-main{display:flex;flex-direction:column;justify-content:space-between;height:100%}
.t-zgbild{position:relative;z-index:1}

/* Bild in den Lösungskarten — Zahl liegt darüber */
.t-solution-art .tcbild{position:absolute;inset:0;aspect-ratio:auto;border-radius:11px}
.t-solution-art .tcbild:not(.tcszene):not(.tcgrafik):not(.tcph){background:none}
.t-solution-art .tcbild img{filter:saturate(.92)}
.t-solution-art .tcbild:not(.tcph):not(.tcszene):not(.tcgrafik)::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,#26030b33,#26030bb3)}
.t-solution-art .tcph{border-style:dashed}
.t-solution-art .tcph small{display:none}
.t-solution-art.hasimg::before{display:none}
.t-solution-art.hasimg>b{position:absolute;left:13px;top:13px;width:46px;height:46px;font-size:17px;z-index:2;
  box-shadow:0 8px 20px #26030b4d}

/* Bild in den Bühnen — feste, flache Höhe, damit die Bühne nie überläuft */
.t-diagbild{aspect-ratio:auto;height:clamp(84px,13vh,146px);max-width:min(100%,392px);
  margin-bottom:clamp(10px,1.8vh,18px)}
.t-diffbild{aspect-ratio:auto;height:clamp(126px,18vh,190px);max-width:100%}
.t-diagbild .tcph-in small,.t-diffbild .tcph-in small{display:none}
.t-diagbild .tcph-in,.t-diffbild .tcph-in{gap:5px}
.t-work-body{display:grid;grid-template-columns:minmax(200px,.78fr) minmax(0,1.22fr);
  gap:clamp(18px,3vw,44px);align-items:center;max-width:1000px;margin:0 auto;width:100%}
.t-work-body .t-tcards{margin:0;max-width:none}
.t-diffbild{margin-top:clamp(12px,2vh,22px)}
.t-scale-arch{height:auto;min-height:190px;display:grid;gap:8px;padding:14px;
  border:1px solid #ffffff2b;border-radius:14px;background:linear-gradient(145deg,#ffffff16,#ffffff08);
  box-shadow:inset 0 1px 0 #ffffff1c}
.t-scale-arch>small{font-size:9px;letter-spacing:.18em;color:#e8cbd1}
.t-scale-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.t-scale-grid span{display:grid;place-items:center;min-height:31px;padding:6px 8px;border-radius:8px;
  border:1px solid #ffffff24;background:#ffffff0d;color:#f7e9ec;font-size:9.5px;font-weight:700;
  line-height:1.25;text-align:center}
.t-scale-core{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 11px;
  border-radius:9px;background:#fff;color:var(--wine-dark);box-shadow:0 10px 24px #23030b2e}
.t-scale-core b{font-size:12px;line-height:1.2}.t-scale-core em{font-style:normal;font-size:8px;letter-spacing:.08em;
  text-transform:uppercase;color:#896a71;text-align:right}
.t-scale-arch>strong{font-size:10px;letter-spacing:.04em;color:#f3cbd3;text-align:center}

/* ── Redaktionelle Systemgrafiken ──────────────────────────────────
   Flache SVGs statt dekorativer 3D-Szenen. Die gleiche visuelle Grammatik
   verbindet Beratung, IT und die branchenspezifischen Abläufe. */
.tcgrafik{display:grid;place-items:center;padding:clamp(9px,1.2vw,16px);
  background:linear-gradient(145deg,#FFFDFC,#F7F1F0);border:1px solid #E6DAD8}
.tcgrafik.hell{background:linear-gradient(145deg,#ffffff12,#ffffff06);border-color:#ffffff24}
.tcgrafik .tcg{display:block;width:100%;height:100%;overflow:visible}
.t-stage .tcgrafik .tcg{transform:translate3d(0,var(--gshift,0),0) scale(var(--gscale,1));
  transition:transform .16s linear;transform-origin:center}
.tcg-grid{fill:none;stroke:#6F1022;stroke-width:.7;opacity:.08}
.tcgrafik.hell .tcg-grid{stroke:#fff;opacity:.07}
.tcg-route{fill:none;stroke:#BE9DA4;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.tcgrafik.hell .tcg-route{stroke:#D9AEB8;opacity:.78}
.tcg-draw{stroke-dasharray:7 8;animation:tcgflow 6s linear infinite}
.tcg-progressline{fill:none;stroke:#8E1B31;stroke-width:2.6;stroke-linecap:round;
  stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--gp,0));transition:stroke-dashoffset .7s cubic-bezier(.22,.75,.25,1)}
.tcgrafik.hell .tcg-progressline{stroke:#F1ACBB}
.tcg-node rect{fill:#fff;stroke:#D9CCCA;stroke-width:1.15;transition:.35s}
.tcgrafik.hell .tcg-node rect{fill:#ffffff08;stroke:#ffffff2f}
.tcg-node.active rect{fill:#F9ECEF;stroke:#8E1B31}
.tcgrafik.hell .tcg-node.active rect{fill:#ffffff14;stroke:#F1ACBB}
.tcg-label,.tcg-caption,.tcg-sub,.tcg-no,.tcg-kicker,.tcg-status text,.tcg-module text,.tcg-alert text{
  font-family:"DM Sans",sans-serif;text-anchor:middle}
.tcg-label{fill:#241D1C;font-size:12px;font-weight:700}
.tcg-sub{fill:#8B807E;font-size:9.5px}
.tcg-caption{fill:#746967;font-size:10.5px}
.tcg-no{fill:#8E1B31;font:700 10px "DM Sans",sans-serif;text-anchor:middle}
.tcg-kicker{fill:#8E1B31;font-size:10.5px;font-weight:700;letter-spacing:.16em;text-anchor:start}
.tcgrafik.hell .tcg-label,.tcgrafik.hell .tcg-caption{fill:#F6E9EC}
.tcgrafik.hell .tcg-sub{fill:#CFAEB5}
.tcgrafik.hell .tcg-no,.tcgrafik.hell .tcg-kicker{fill:#F1ACBB}
.tcg-step,.tcg-phase circle{fill:#fff;stroke:#CDB9BD;stroke-width:1.35;transition:.35s}
.tcg-gstep{opacity:.28;transition:opacity .5s,transform .55s cubic-bezier(.22,.75,.25,1);transform-origin:center}
.tcg-gstep.is-done{opacity:.68}
.tcg-gstep.is-on{opacity:1;transform:translateY(-3px)}
.tcg-gstep.is-on .tcg-step,.tcg-gstep.is-on circle{fill:#F7E7EA;stroke:#8E1B31}
.tcg-gstep.is-done .tcg-step,.tcg-gstep.is-done circle{fill:#8E1B31;stroke:#8E1B31}
.tcg-gstep.is-done .tcg-no{fill:#fff}
.tcgrafik.hell .tcg-step,.tcgrafik.hell .tcg-phase circle{fill:#4C0A18;stroke:#B87686}
.tcgrafik.hell .tcg-gstep.is-on .tcg-step,.tcgrafik.hell .tcg-gstep.is-on circle{fill:#F1ACBB;stroke:#fff}
.tcgrafik.hell .tcg-gstep.is-on .tcg-no{fill:#4C0A18}
.tcgrafik.hell .tcg-gstep.is-done .tcg-step,.tcgrafik.hell .tcg-gstep.is-done circle{fill:#9E5264;stroke:#C88695}
.tcg-status{transform:translate(22px,255px)}
.tcg-status circle{fill:#8E1B31;stroke:none;animation:tcgpulse 2.8s ease-in-out infinite}
.tcg-status text{fill:#695E5C;font-size:9.5px;font-weight:700;letter-spacing:.1em;text-anchor:start}
.tcgrafik.hell .tcg-status circle{fill:#F1ACBB}
.tcgrafik.hell .tcg-status text{fill:#E8CED4}
.tcg-alert rect{fill:#8E1B31;stroke:none}
.tcg-alert text{fill:#fff;font-size:9.5px;font-weight:700;letter-spacing:.12em}
.tcg-alert-line{fill:none;stroke:#8E1B31;stroke-width:1.3;stroke-dasharray:3 4}
.tcg-alert{opacity:0;visibility:hidden;transform:translateY(5px);transition:.4s}
.tcg-alert.is-on{opacity:1;visibility:visible;transform:none}
.tcg-metric .tcg-value{fill:#8E1B31;font:500 30px "Playfair Display",serif;text-anchor:start}
.tcg-metric .tcg-caption{font-size:9.5px;text-anchor:start}
.tcg-icon path{fill:none;stroke:#8E1B31;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.tcgrafik.hell .tcg-icon path{stroke:#F1ACBB}
.tcg-sequence{opacity:0;transform:translateY(10px);transition:.55s cubic-bezier(.22,.75,.25,1);transition-delay:var(--d,0s)}
.tcgrafik.tcg-live .tcg-sequence{opacity:1;transform:none}
.tcg-foundation{fill:none;stroke:#E8C8CF;stroke-width:5;stroke-linecap:round}
.tcg-module rect{fill:#ffffff0c;stroke:#ffffff3b;stroke-width:1}
.tcg-module text{fill:#fff;font-size:9px;font-weight:700;letter-spacing:.12em}
.tcg-module path{fill:none;stroke:#F1ACBB;stroke-width:1.1;stroke-dasharray:3 4}
.tcg-module.is-on rect{fill:#ffffff1b;stroke:#F1ACBB}
.tcg-module.is-done rect{fill:#ffffff10;stroke:#B97887}
.tcg-growth{fill:none;stroke:#F1ACBB;stroke-width:2.2;stroke-linecap:round}
.tcg-arrow{fill:none;stroke:#F1ACBB;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.tcg-core circle{fill:#F8E9EC;stroke:#8E1B31;stroke-width:1.4}
.tcgrafik.hell .tcg-core circle{fill:#ffffff0e;stroke:#F1ACBB}
.tcg-symbol path{fill:none;stroke:#8E1B31;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.tcgrafik.hell .tcg-symbol path{stroke:#F2C4CE}
.tcg-vnode>circle{fill:#fff;stroke:#D6C5C8;stroke-width:1.3;transition:fill .45s,stroke .45s,filter .45s}
.tcgrafik.hell .tcg-vnode>circle{fill:#4A0916;stroke:#A96272}
.tcg-gstep.is-on .tcg-vnode>circle{fill:#F8E9EC;stroke:#8E1B31;filter:drop-shadow(0 10px 9px #450b1738)}
.tcg-gstep.is-done .tcg-vnode>circle{fill:#8E1B31;stroke:#8E1B31}
.tcg-gstep.is-done .tcg-symbol path{stroke:#fff}
.tcgrafik.hell .tcg-gstep.is-on .tcg-vnode>circle{fill:#8E1B31;stroke:#F2C4CE;filter:drop-shadow(0 10px 12px #0007)}
.tcgrafik.hell .tcg-gstep.is-done .tcg-vnode>circle{fill:#641024;stroke:#BC7786}
.tcg-emblem .tcg-vnode>circle{fill:#8E1B31;stroke:#B85D72;stroke-width:2;filter:drop-shadow(0 15px 13px #35081142)}
.tcg-emblem .tcg-symbol path{stroke:#fff;stroke-width:2}
.tcgrafik.hell .tcg-emblem .tcg-vnode>circle{fill:#72142A;stroke:#E3A4B2;filter:drop-shadow(0 18px 16px #0008)}
.tcgrafik .tcg-vnode.has-brand>circle,.tcgrafik.hell .tcg-vnode.has-brand>circle,.tcgrafik .tcg-emblem .tcg-vnode.has-brand>circle{fill:#fff;stroke:#E4D6D9;stroke-width:1.15;filter:drop-shadow(0 11px 14px #28060e38)}
.tcgrafik .tcg-brand{filter:drop-shadow(0 3px 5px #29071026);transform-box:fill-box;transform-origin:center}
.tcg-orbit{fill:none;stroke:#CDB8BD;stroke-width:1;stroke-dasharray:3 7;transform-origin:320px 150px;animation:tcgorbit 24s linear infinite}
.tcg-orbit.inner{stroke:#8E1B31;opacity:.25;animation-direction:reverse;animation-duration:18s}
.tcgrafik.hell .tcg-orbit{stroke:#E6B5C0;opacity:.32}
.tcg-alert-line{stroke:#8E1B31;stroke-width:1.4;stroke-dasharray:3 4}
.tcg-break{fill:#8E1B31;stroke:#8E1B31}
.tcg-breakmark{fill:none;stroke:#fff;stroke-width:2.2;stroke-linecap:round}
.tcg-corner{fill:none;stroke:#D3C3C6;stroke-width:1;stroke-linecap:round;opacity:.55}
.tcg-sparkline,.tcg-rise{fill:none;stroke:#8E1B31;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;opacity:.6;stroke-dasharray:5 7;animation:tcgflow 7s linear infinite}
.tcgrafik.hell .tcg-sparkline,.tcgrafik.hell .tcg-rise{stroke:#F1ACBB}
.tcg-pulse-dot circle,.tcg-data-dots circle{fill:#8E1B31;stroke:#fff;stroke-width:1;animation:tcgpulse 2.4s ease-in-out infinite}
.tcgrafik.hell .tcg-pulse-dot circle,.tcgrafik.hell .tcg-data-dots circle{fill:#F1ACBB;stroke:#5A0C1C}
.tcg-foundation-shadow{fill:#6F1022;opacity:.13;filter:blur(7px)}
.tcg-module .tcg-symbol path{stroke:#F1ACBB;stroke-dasharray:none}
.tcg-module.is-on .tcg-symbol path,.tcg-module.is-done .tcg-symbol path{stroke:#fff;stroke-dasharray:none}
.t-target-stage .tcgrafik.tcg-live .tcg-gstep,
.t-solution .tcgrafik.tcg-live .tcg-gstep{opacity:1;transform:none}
.t-solution-art .tcgrafik{border-radius:11px;background:linear-gradient(150deg,#651124,#320710);border-color:#ffffff1c}
.t-solution-art .tcgrafik .tcg{transform:scale(1.02)}
.t-solution{--rx:0deg;--ry:0deg;transform-style:preserve-3d;will-change:transform;
  transition:transform .22s ease,border-color .3s,box-shadow .3s}
.t-solution.t-show{transform:perspective(1200px) rotateX(var(--rx)) rotateY(var(--ry))}
.t-solution:hover{box-shadow:0 30px 70px #13010670;border-color:#ffffff36}
.t-solution-art{transform:translateZ(14px);box-shadow:inset 0 1px #ffffff12,0 16px 36px #16020835}
.tcgrafik .tcg-node.is-on rect,.tcgrafik .tcg-module.is-on rect,.tcgrafik .tcg-gstep.is-on circle{
  filter:drop-shadow(0 8px 8px #25030b35)}
.t-zgbild .tcgrafik{min-height:250px}
.t-diagbild.tcgrafik,.t-diffbild.tcgrafik,.t-workbild.tcgrafik{border-radius:12px}
@keyframes tcgflow{to{stroke-dashoffset:-60}}
@keyframes tcgpulse{0%,100%{opacity:.45}50%{opacity:1}}
@keyframes tcgfloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}
@keyframes tcgorbit{to{transform:rotate(360deg)}}

@media(max-width:980px){
  .t-target-panel{grid-template-columns:1fr;row-gap:22px}
  .t-work-body{grid-template-columns:1fr}
  .t-workbild{display:none}
  .t-diagbild{display:none}
  .t-diffbild{display:none}
}

/* ── Gebaute Szenen in den Bildplätzen ────────────────────────────── */
.tcszene{display:grid;place-items:center;padding:clamp(4px,1vw,14px);
  background:linear-gradient(155deg,#FCF8F7 0%,#F0E6E6 100%);border:1px solid #E8DCDC}
.tcszene .isoart{width:100%;height:100%;display:block}
.tcszene .isoart .t{fill:#F7F2F0}
.tcszene .isoart .l{fill:#E4DAD8}
.tcszene .isoart .r{fill:#D3C6C4}
.tcszene .isoart .p{fill:#FCF9F8}
.tcszene .isoart .pl{fill:#ECE3E1}
.tcszene .isoart .pr{fill:#DDD2D0}
.tcszene .isoart .a{fill:#CBA9AF}
.tcszene .isoart .al{fill:#BB959D}
.tcszene .isoart .ar{fill:#A9838C}
.tcszene .isoart .sol{fill:#C6B7B5}
.tcszene .isoart .scr{fill:#8E1B31}
.tcszene .isoart .scr2{fill:#EEDCDF}
.tcszene .isoart polygon,.tcszene .isoart ellipse,.tcszene .isoart circle{
  stroke:#BCA9A8;stroke-width:.7;stroke-linejoin:round}
.tcszene .isoart .ln,.tcszene .isoart .lnw{stroke:#AF9B9B;stroke-width:1.1;fill:none;stroke-linecap:round}
.tcszene .isoart .lnf{stroke:#C7B7B7;stroke-width:.6;fill:none}
.tcszene .isoart .blade{stroke:#8E1B31;stroke-width:2.4;stroke-linecap:round;fill:none}

/* Szene auf dunklen Flächen */
.tcszene.hell{background:linear-gradient(155deg,#ffffff14 0%,#ffffff06 100%);border-color:#ffffff26}
.tcszene.hell .isoart .t{fill:#6C2E3B}
.tcszene.hell .isoart .l{fill:#56222D}
.tcszene.hell .isoart .r{fill:#451A24}
.tcszene.hell .isoart .p{fill:#5F2833}
.tcszene.hell .isoart .pl{fill:#4B1F29}
.tcszene.hell .isoart .pr{fill:#3C1720}
.tcszene.hell .isoart .a{fill:#C07E8D}
.tcszene.hell .isoart .al{fill:#A96A7A}
.tcszene.hell .isoart .ar{fill:#925869}
.tcszene.hell .isoart .sol{fill:#7A4250}
.tcszene.hell .isoart .scr{fill:#F1ACBB}
.tcszene.hell .isoart .scr2{fill:#7E3B49}
.tcszene.hell .isoart polygon,.tcszene.hell .isoart ellipse,.tcszene.hell .isoart circle{stroke:#95606D}
.tcszene.hell .isoart .ln,.tcszene.hell .isoart .lnw{stroke:#C88C99}
.tcszene.hell .isoart .lnf{stroke:#8E5563}
.tcszene.hell .isoart .blade{stroke:#F1ACBB}

/* Auf schmalen Bildschirmen tragen Text und Diagramm — Bild raus, damit
   die Bühne nicht überläuft. (Muss am Ende stehen, um .tcszene zu schlagen.) */
@media(max-width:980px){
  .tcbild.t-diagbild,.tcbild.t-diffbild,.tcbild.t-workbild{display:none}
}

/* Flache Bildschirme: Bühne etwas straffen */
@media(max-height:780px){
  .tcbild.t-diagbild{height:clamp(72px,10.5vh,108px)}
  .tcbild.t-diffbild{height:clamp(84px,12vh,128px)}
}

/* Zweiter Knopf auf dunklem Grund: Umriss statt weißer Fläche */
.t-outline{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.45);box-shadow:none}
.t-outline:hover{background:rgba(255,255,255,.12);border-color:#fff;color:#fff}

/* V6 · Startseiten-Grafiken: räumlicher, aber weiterhin zurückhaltend */
.t-stage .tcgrafik,.t-solution-art .tcgrafik,.t-diagbild.tcgrafik,.t-diffbild.tcgrafik,.t-workbild.tcgrafik{
  position:relative;isolation:isolate;border:1px solid rgba(111,16,34,.12);
  box-shadow:0 28px 70px rgba(49,8,18,.10),inset 0 1px rgba(255,255,255,.72);
  transform-style:preserve-3d
}
.t-stage .tcgrafik::after,.t-solution-art .tcgrafik::after,.t-diagbild.tcgrafik::after,.t-diffbild.tcgrafik::after,.t-workbild.tcgrafik::after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(130deg,rgba(255,255,255,.10),transparent 30%,transparent 72%,rgba(111,16,34,.05))
}
.tcgrafik .tcg-vnode>circle{filter:drop-shadow(0 10px 10px rgba(49,8,18,.15))}
.tcgrafik.hell .tcg-vnode>circle{filter:drop-shadow(0 13px 14px rgba(0,0,0,.35))}
.tcgrafik .tcg-emblem{transform-origin:center;animation:tcgBreathe 5.2s ease-in-out infinite}
@keyframes tcgBreathe{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-3px) scale(1.018)}}
@media(prefers-reduced-motion:reduce){.tcgrafik .tcg-emblem{animation:none}}

/* Realistische Agenda statt generischer Uhr */
.kc-agenda{width:min(100%,260px);margin-top:clamp(12px,2.4cqw,22px);padding:10px 12px;border-radius:14px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.08);backdrop-filter:blur(6px)}
.kc-ag-hd{display:flex;gap:6px;margin-bottom:8px}.kc-ag-hd span{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.28)}
.kc-ag-row{display:grid;grid-template-columns:10px 46px 1fr;gap:10px;align-items:center;padding:7px 0;border-top:1px solid rgba(255,255,255,.08);font-family:'DM Sans',system-ui,sans-serif}
.kc-ag-row:first-of-type{border-top:0}.kc-ag-row i{width:10px;height:10px;border-radius:50%;background:#f4c8d2;box-shadow:0 0 0 3px rgba(255,255,255,.08)}
.kc-ag-row.done i{background:#b9e982}.kc-ag-row b{font-size:11px;color:rgba(255,255,255,.92)}.kc-ag-row em{font-style:normal;font-size:11px;color:rgba(255,255,255,.76)}

/* ── Hero KPI cards v2 · emotionaler, aber bewusst minimal ── */
.kcard-dark{
  background:linear-gradient(160deg,#3A0712 0%,#26040B 100%);
  border-color:rgba(255,255,255,.10);
  color:#fff;
  box-shadow:0 18px 44px rgba(57,7,18,.18),inset 0 1px 0 rgba(255,255,255,.06);
}
.kcard-dark::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(circle at 92% 5%,rgba(193,49,78,.18),transparent 34%),
    linear-gradient(115deg,rgba(255,255,255,.035),transparent 28%);
}
.kcard-dark:hover{border-color:rgba(255,255,255,.18);box-shadow:0 24px 56px rgba(57,7,18,.25)}
.kcard-dark .kc-lab{color:rgba(255,255,255,.72)}
.kcard-dark .kc-ic{stroke:rgba(255,255,255,.60)}
.kcard-dark:hover .kc-ic{stroke:#fff}
.kcard-dark .kc-num{color:#fff;font-size:clamp(22px,3.6cqw,34px);margin-top:clamp(8px,1.4cqw,14px)}
.kcard-dark .kc-sub{color:rgba(255,255,255,.66);font-size:clamp(10.5px,1.45cqw,12.5px)}

.kc-channels{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-top:clamp(14px,2cqw,20px);position:relative;z-index:1}
.kc-channels>span{min-width:0;padding:9px 6px 8px;border:1px solid rgba(255,255,255,.10);border-radius:11px;background:rgba(255,255,255,.055);text-align:center}
.kc-channels i{display:flex;width:24px;height:24px;margin:0 auto 7px;align-items:center;justify-content:center;border-radius:7px;background:rgba(255,255,255,.11);color:#fff;font:700 8px/1 'DM Sans',sans-serif;text-transform:uppercase;font-style:normal}
.kc-channels b{display:block;color:#fff;font:700 clamp(14px,2.2cqw,19px)/1 'DM Sans',sans-serif}
.kc-channels small{display:block;margin-top:5px;color:rgba(255,255,255,.52);font:500 clamp(7px,1.05cqw,9px)/1.15 'DM Sans',sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kc-total{display:grid;grid-template-columns:1fr auto auto 64px;gap:9px;align-items:center;margin-top:9px;padding:9px 11px;border:1px solid rgba(255,255,255,.09);border-radius:11px;background:rgba(255,255,255,.045);position:relative;z-index:1}
.kc-total span{font:600 10px/1 'DM Sans',sans-serif;color:rgba(255,255,255,.68)}
.kc-total b{font:700 17px/1 'DM Sans',sans-serif;color:#fff}
.kc-total em{font:700 10px/1 'DM Sans',sans-serif;color:#8FE16D;font-style:normal}
.kc-total svg{width:64px;height:24px;overflow:visible}.kc-total svg path{fill:none;stroke:#E95A76;stroke-width:2.2;stroke-linecap:round}

.kc-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;margin-top:14px;padding:3px;border:1px solid rgba(255,255,255,.09);border-radius:10px;background:rgba(0,0,0,.14);position:relative;z-index:1}
.kc-tabs span{padding:7px 4px;text-align:center;border-radius:7px;color:rgba(255,255,255,.55);font:600 9px/1 'DM Sans',sans-serif}
.kc-tabs .on{background:rgba(255,255,255,.09);color:#fff}
.kc-appointments{display:grid;gap:6px;margin-top:8px;position:relative;z-index:1}
.kc-appointments>span{display:grid;grid-template-columns:42px 1fr auto;align-items:center;gap:8px;padding:8px 9px;border:1px solid rgba(255,255,255,.08);border-radius:9px;background:rgba(255,255,255,.035)}
.kc-appointments b{color:#fff;font:700 10px/1 'DM Sans',sans-serif}
.kc-appointments em{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:rgba(255,255,255,.72);font:500 10px/1 'DM Sans',sans-serif;font-style:normal}
.kc-appointments i{padding:4px 7px;border-radius:999px;background:rgba(212,145,56,.22);color:#F4C46E;font:700 8px/1 'DM Sans',sans-serif;font-style:normal}
.kc-appointments i.ok{background:rgba(99,176,82,.24);color:#A7E292}

.kc-period{display:inline-flex;align-items:center;padding:5px 8px;border:1px solid rgba(255,255,255,.10);border-radius:8px;color:rgba(255,255,255,.62);font:600 8px/1 'DM Sans',sans-serif}
.kc-resultline{position:relative;margin-top:10px;height:72px;border:1px solid rgba(255,255,255,.08);border-radius:11px;background:rgba(255,255,255,.035);overflow:hidden}
.kc-resultline>span{position:absolute;right:8px;top:8px;z-index:2;padding:7px 8px;border:1px solid rgba(255,255,255,.10);border-radius:8px;background:rgba(0,0,0,.18);color:#fff;font:700 14px/1 'DM Sans',sans-serif;text-align:right}
.kc-resultline>span small{display:block;margin-top:4px;color:rgba(255,255,255,.48);font:500 7px/1 'DM Sans',sans-serif}
.kc-resultline svg{position:absolute;inset:7px 6px 4px;width:calc(100% - 12px);height:calc(100% - 11px)}
.kc-resultline .grid{fill:none;stroke:rgba(255,255,255,.07);stroke-width:1}
.kc-resultline .line{fill:none;stroke:#F04D70;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.kc-metrics-dark{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:8px;position:relative;z-index:1}
.kc-metrics-dark span{padding:8px 8px 7px;border:1px solid rgba(255,255,255,.09);border-radius:10px;background:rgba(255,255,255,.04)}
.kc-metrics-dark small{display:block;color:rgba(255,255,255,.48);font:600 7px/1.1 'DM Sans',sans-serif;margin-bottom:5px}
.kc-metrics-dark b{display:block;color:#fff;font:700 clamp(13px,1.8cqw,16px)/1 'DM Sans',sans-serif}

/* Das bestehende Agenda-Widget bleibt bewusst ruhiger als Gegenpol. */
.kcard.wine{box-shadow:0 20px 48px rgba(85,9,24,.18)}

@media(max-width:1100px){
  .kc-channels small{display:none}
  .kc-total{grid-template-columns:1fr auto auto}.kc-total svg{display:none}
  .kc-appointments>span{grid-template-columns:38px 1fr}.kc-appointments i{display:none}
}
@media(max-width:700px){
  .kc-channels{grid-template-columns:repeat(4,1fr)}
  .kc-metrics-dark{grid-template-columns:repeat(3,1fr)}
}

/* Reale App-Logos in der Diagnose-Kette */
.t-cbox.t-appbox{background:#fff;border-color:rgba(255,255,255,.78);box-shadow:0 8px 22px rgba(0,0,0,.12);overflow:hidden}
.t-brand-ic{width:28px;height:28px;display:block;overflow:visible;filter:none;transform:translateZ(0)}
.t-cnode.is-hit .t-cbox.t-appbox{background:#fff;border-color:#FF7181;box-shadow:0 0 0 3px rgba(255,113,129,.12),0 8px 22px rgba(0,0,0,.15);animation:tpulse 1.9s ease-in-out infinite}
.t-cnode.is-hit .t-brand-ic{filter:saturate(1.08) brightness(1.02)}