/* All new rules are scoped below the approved hero. */
.tech-chapter,.system,.offers,.contact{--mono:'SFMono-Regular',Consolas,'Liberation Mono',monospace}
.tech-chapter h2,.system h2,.offers h2,.contact h2{font-family:var(--sans);font-weight:550;letter-spacing:-.065em;line-height:.99}
.tech-chapter h2 em,.system h2 em,.offers h2 em,.contact h2 em{font-style:normal;letter-spacing:-.065em;color:#c9a96e}
.tech-chapter .eyebrow,.system .eyebrow,.offers .eyebrow,.contact .eyebrow,.core-caption,.network-label,.workflow-caption,.workflow-demo li>span{font-family:var(--mono);letter-spacing:1.1px;font-size:12px}
.tech-chapter .stage{background:#050608;min-height:800px}
.tech-chapter .red-image{background-image:linear-gradient(#c9a96e09 1px,transparent 1px),linear-gradient(90deg,#c9a96e09 1px,transparent 1px);background-size:70px 70px;transform:none!important}
.tech-chapter .red-shade{background:radial-gradient(ellipse at 73% 41%,#c9a96e0a,transparent 55%)}
.tech-chapter .red-copy,.tech-chapter .red-second{left:7%;top:19%;width:55%;max-width:700px}
.tech-chapter h2{font-size:clamp(60px,6.6vw,112px);margin-bottom:26px}
.tech-chapter .chapter-description,.tech-chapter .red-second>p:last-child{font-size:16px;line-height:1.7;color:#c0c0c5;max-width:450px}
.neural-network{position:absolute;right:-2%;top:1%;width:64%;height:75%;pointer-events:none;z-index:1}.neural-network canvas{display:block;width:100%;height:100%}
.network-label{position:absolute;right:12%;top:12%;color:#9a9aa3;font-size:11px}
.workflow-demo{position:absolute;bottom:115px;left:7%;right:7%;z-index:3;border:1px solid #ffffff20;background:#0b0c0fd9;backdrop-filter:blur(18px)}
.workflow-caption{display:flex;justify-content:space-between;border-bottom:1px solid #ffffff17;padding:15px 20px;color:#c9a96e}.workflow-caption>span{color:#8c8c96;letter-spacing:0}
.workflow-demo ol{display:grid;grid-template-columns:repeat(4,1fr);list-style:none;margin:0;padding:0}
.workflow-demo li{padding:20px;position:relative;transition:background .5s;border-right:1px solid #ffffff15}.workflow-demo li:last-child{border:0}.workflow-demo li.active{background:#c9a96e12}.workflow-demo li.active:before{content:'';position:absolute;inset:0 0 auto;height:2px;background:#c9a96e;box-shadow:0 0 18px #c9a96e66}
.workflow-demo li>span{font-size:11px;color:#9a9aa3;display:block;margin-bottom:12px}.workflow-demo li.active>span{color:#e8ca92}.workflow-demo strong{font-size:14px;display:block;font-weight:500;margin-bottom:7px}.workflow-demo small{font-size:12px;color:#8c8c96}
.system .stage,.system.live-3d .stage{background:radial-gradient(ellipse at 76% 44%,#292621 0%,#101012 33%,#050608 73%)}
.system .chrome-image{background:linear-gradient(90deg,transparent 49.85%,#ffffff06 50%,transparent 50.15%);background-size:110px 100%}
.system .system-copy{top:15%}.system h2{font-size:clamp(60px,6.4vw,105px)}.system .chapter-description{color:#a1a1aa;max-width:430px}
.system .services{border-top:1px solid #ffffff25;margin-top:28px}.system .service{font-family:var(--mono);font-size:14px;padding:16px 0;max-width:420px}.system .service.active{background:linear-gradient(90deg,#c9a96e15,transparent)}
.system .sculpture{right:-2%;width:61%}.core-caption{position:absolute;right:10%;top:13%;font-size:13px;color:#e8ca92}.core-caption span{display:block;font-size:10px;color:#8c8c96;margin-top:8px}.system .rotate-hint{top:auto;bottom:172px;right:23%;font-family:var(--mono);font-size:11px}
.system .edit-scene{border-radius:4px;font-family:var(--mono);font-size:12px}
.offers{color:#f5f5f7;background:#0b0c0f;padding-top:95px;border-top:1px solid #ffffff1c}.offers h2{font-size:clamp(60px,7vw,110px);margin-bottom:55px}.offers .section-top>span{font-family:var(--mono);color:#8c8c96}.offers .eyebrow{color:#c9a96e}
.offers .offer-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;border:0;align-items:start}
.offers .offer-list details{background:#101114;border:1px solid #ffffff22;border-radius:4px;overflow:hidden}.offers .offer-list details[open]{border-color:#c9a96e90}.offers .offer-list details:hover{background:#151618}
.offers summary{display:grid;grid-template-columns:1fr 26px;gap:24px;padding:28px}.offers .offer-number{grid-column:1;font-family:var(--mono);font-size:12px;padding:0;color:#c9a96e}.offers .offer-name{grid-row:2;grid-column:1/-1;font-family:var(--sans);font-size:29px;font-weight:500;letter-spacing:-1px}.offers .offer-name small{font-size:13px;line-height:1.6;min-height:42px;margin-top:14px;color:#a1a1aa;max-width:240px}.offers .price{grid-row:3;grid-column:1;font-family:var(--mono);font-size:24px;color:#f5f5f7}.offers .price small{font-size:12px;color:#9696a0;margin-top:10px}.offers .expand{grid-row:1;grid-column:2;font-size:25px}
.offers .offer-body{display:flex;flex-direction:column;margin:0;padding:0 28px 30px;gap:20px;font-size:14px;line-height:1.7;max-width:none}.offers .offer-body>p{color:#b0b0ba}.offers .offer-body li{margin-bottom:8px}.offers .offer-body li:before{color:#c9a96e;opacity:1}.offers .text-link{color:#e8ca92;font-size:14px}.offers .pricing-note{margin:24px 0 0;max-width:850px;color:#9696a0;opacity:1}
.offers .process{margin-top:90px;padding-top:35px;border-top:1px solid #ffffff22}.offers .process li{font-family:var(--sans);font-size:23px;font-weight:500}.offers .process li>span{font-family:var(--mono);border-color:#ffffff25;color:#c9a96e}.offers .process li small{font-weight:400;color:#a1a1aa;font-size:13px}
.contact{background:radial-gradient(ellipse at var(--mx,50%) var(--my,40%),#26231c 0%,#0b0c0f 42%,#050608 75%);border-top:1px solid #ffffff1a}.contact h2{font-size:clamp(64px,9vw,140px);line-height:1.04;margin:38px 0}.contact .contact-cta{border-radius:5px;font-family:var(--mono);font-size:14px}.contact .contact-details{font-family:var(--mono)}
@media(max-width:1000px) and (min-width:761px){.offers summary{padding:22px;gap:20px}.offers .offer-body{padding:0 22px 26px}.offers .price{font-size:20px}.workflow-demo strong{font-size:13px}.workflow-demo li{padding:15px}.system .system-copy{top:13%}.system h2{font-size:6.5vw}}
@media(max-width:760px){.tech-chapter{height:210svh}.tech-chapter .stage{height:100svh;min-height:930px}.tech-chapter .red-copy,.tech-chapter .red-second{top:9%;left:7%;width:86%;max-width:none}.tech-chapter h2{font-size:13vw;line-height:1.03;margin-bottom:20px}.tech-chapter .eyebrow{font-size:11px;margin-bottom:20px}.tech-chapter .chapter-description,.tech-chapter .red-second>p:last-child{font-size:15px;max-width:340px}.neural-network{right:-10%;top:25%;height:43%;width:100%;opacity:.85}.network-label{top:34%;right:7%;font-size:9px}.workflow-demo{bottom:110px;left:7%;right:7%}.workflow-caption{font-size:10px;padding:12px}.workflow-caption>span{font-size:9px}.workflow-demo ol{grid-template-columns:1fr 1fr}.workflow-demo li{padding:14px 12px;border-bottom:1px solid #ffffff15}.workflow-demo li>span{font-size:10px;margin-bottom:8px}.workflow-demo strong{font-size:12px}.workflow-demo small{font-size:11px}.tech-chapter .chapter-caption{bottom:80px;font-size:10px}.system .stage{height:1050px;min-height:1050px}.system .system-copy{top:8%;width:86%}.system h2{font-size:13vw}.system .chapter-description{font-size:15px}.system .sculpture{width:100%;right:-15%;top:23%;height:44%}.core-caption{top:35%;right:7%;font-size:11px}.core-caption span{font-size:9px}.system .services{margin-top:300px}.system .service{font-size:13px;padding:16px 0}.system .edit-scene{top:57%;bottom:auto;font-size:11px}.offers{padding:65px 7%}.offers h2{font-size:13vw;margin:25px 0 35px}.offers .offer-list{grid-template-columns:1fr;gap:15px}.offers summary{padding:24px;grid-template-columns:1fr 28px;gap:18px}.offers .offer-name{font-size:29px}.offers .offer-name small{min-height:0;max-width:none;font-size:13px;margin-top:10px}.offers .price{font-size:23px}.offers .offer-body{padding:0 24px 25px;font-size:14px}.offers .process{margin-top:55px}.offers .process li{font-size:22px}.contact h2{font-size:13.5vw}.contact .contact-details{font-size:12px}.contact .eyebrow{font-size:11px}}
@media(prefers-reduced-motion:reduce){.tech-chapter .stage{height:auto;min-height:1000px}.tech-chapter .red-copy{top:8%}.tech-chapter .red-second{top:40%}.tech-chapter .red-second h2{font-size:clamp(44px,6vw,85px)}.neural-network{opacity:.35}.tech-chapter .workflow-demo{bottom:75px}.system .services{margin-top:28px}@media(max-width:760px){.tech-chapter .red-second{top:37%}.system .services{margin-top:300px}}}

/* Restrained golden-hand surface effect, layered behind the existing headline. */
.garden .stage>.hero-signal-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none;opacity:1}
.garden .garden-copy{z-index:2}
.garden .scene-bottom,.garden .chapter-caption{z-index:2}
@media(prefers-reduced-motion:reduce){.garden .hero-signal-canvas{display:none!important}}

/* Hero: ruhige Studio-Komposition, dann kontrollierte Zerlegung des Systemkerns. */
.upright-hero.chapter.garden{height:240svh;color:#1d1d1f}
.upright-hero .stage{background:#f5f5f7;min-height:650px;--hero-gold:#917141}
.upright-hero .garden-image{background:none;transform:none!important}
.upright-hero .garden-wash{background:radial-gradient(ellipse at 73% 47%,#c9a96e09,transparent 56%)}
.upright-hero .garden-copy{top:30%;left:7%;width:48%;text-align:left;transform-origin:left center}
.upright-hero .garden-copy .eyebrow{font-size:12px;letter-spacing:1.5px;margin-bottom:36px}
.upright-hero h1{align-items:flex-start;font-size:clamp(100px,11vw,180px);line-height:.78;margin:0 0 35px}
.upright-hero h1 em{margin-left:3.5vw;color:var(--hero-gold);text-shadow:none}
.upright-hero .hero-sub{margin-left:0;font-size:16px;line-height:1.7}
/* Das Standbild bringt seinen eigenen dunklen Hintergrund mit — die weiche
   Maske verhindert, dass davon ein sichtbarer Kasten in der Lobby steht. */
.hero-still{position:absolute;right:9%;top:50%;transform:translateY(-50%);height:58%;width:38%;object-fit:contain;z-index:1;-webkit-mask-image:radial-gradient(ellipse at 50% 50%,#000 46%,transparent 74%);mask-image:radial-gradient(ellipse at 50% 50%,#000 46%,transparent 74%)}
.upright-hero.scene-ready .hero-still{visibility:hidden}
.upright-hero .scene-bottom{left:7%;right:7%}.upright-hero .chapter-caption{left:7%}
@media(max-width:760px){.upright-hero.chapter.garden{height:225svh}.upright-hero .stage{min-height:760px}.upright-hero .garden-copy{top:16%;left:7%;width:85%}.upright-hero h1{font-size:20vw;line-height:.82;margin-bottom:24px}.upright-hero h1 em{margin-left:7vw}.upright-hero .garden-copy .eyebrow{font-size:10px;letter-spacing:1px;margin-bottom:24px}.upright-hero .hero-sub{font-size:14px;max-width:230px}.hero-still{right:-5%;bottom:4%;width:84%;height:64%}.upright-hero .scene-bottom>span{max-width:95px}.upright-hero .scene-bottom{bottom:123px}.upright-hero .chapter-caption{bottom:96px}}
@media(prefers-reduced-motion:reduce){.upright-hero.chapter.garden{height:auto}.upright-hero.scene-ready .hero-still{visibility:visible}.upright-hero .stage{background:#f5f5f7!important;color:#1d1d1f!important}}

/* Die cineastische Lobby bleibt der Bühnenhintergrund des Heros. */
.upright-hero .garden-image{background-size:cover;background-position:center;transform:scale(1.025)!important}
.upright-hero .garden-wash{background:linear-gradient(90deg,#f6f6f750 0%,#f6f6f726 35%,transparent 60%)}
.upright-hero .stage{background:#e8e8e8;color:#1d1d1f;--hero-gold:#89682f}
.upright-hero .hero-sub{max-width:360px;text-shadow:0 1px 10px #fff7}
@media(max-width:760px){.upright-hero .garden-image{background-position:47% center}.upright-hero .garden-wash{background:linear-gradient(#f6f6f74d,transparent 65%)}.upright-hero .hero-sub{max-width:250px}}

/* Der Systemkern liegt auf einer festen Leinwand über der klebenden Hero-Bühne. */
.hero-core-canvas{position:fixed;inset:0;width:100%;height:100%;z-index:4;pointer-events:none;opacity:1}
.upright-hero .stage::after{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(180deg,#050608cc,#050608);opacity:var(--hero-fade,0)}
.tech-chapter .network-label{color:#c9a96e;right:10%;top:10%;letter-spacing:1.5px}
/* Die Bahnen-Szene blendet weich auf, sobald sie wirklich läuft. */
.neural-network canvas{opacity:0;transition:opacity .6s ease}
.tech-chapter.flow-live .neural-network canvas{opacity:1}
@media(max-width:760px){.tech-chapter .network-label{right:7%;top:35%;font-size:9px}.hero-still{top:46%;bottom:auto;height:54%;right:0;width:80%;transform:none}}
@media(prefers-reduced-motion:reduce){.hero-core-canvas{display:none!important}.upright-hero .stage::after{display:none}.neural-network{background:radial-gradient(ellipse at center,#c9a96e18,transparent 65%)}}

/* AntonBusiness technology atelier: human ideas meet precisely connected systems. */
.upright-hero .stage{background:#080a0d;color:#f5f5f7;--hero-gold:#e8ca92}
.upright-hero .garden-image{background-image:url('assets/technology-atelier.webp');background-position:center;transform:scale(1.025)!important}
.upright-hero .garden-wash{background:linear-gradient(90deg,#050608e6 0%,#050608a8 34%,#0506081a 66%,#05060826),linear-gradient(0deg,#050608 0%,transparent 24%)}
.upright-hero .hero-sub{color:#d3d4d8;text-shadow:none}
.upright-hero .garden-copy .eyebrow{color:#e8ca92}
.upright-hero .chapter-caption,.upright-hero .scene-bottom{color:#d3d4d8}
.masthead{color:#f5f5f7}.masthead .top-contact{border-bottom-color:#ffffff80}
@media(max-width:760px){.upright-hero .garden-image{background-position:62% center}.upright-hero .garden-wash{background:linear-gradient(#050608c9 0%,#05060891 36%,#05060826 65%,#050608 100%)}.upright-hero .garden-copy .eyebrow{font-size:11px}.upright-hero .hero-sub{font-size:16px}}
@media(prefers-reduced-motion:reduce){.upright-hero .stage{background:#080a0d!important;color:#f5f5f7!important}}

/* Knowledge becomes action: one readable scene and an open synaptic topology. */
.tech-chapter .red-copy{width:47%;top:18%;max-width:650px}
.tech-chapter .red-copy h2{font-size:clamp(60px,6.1vw,100px);line-height:1.03;letter-spacing:-.06em}
.tech-chapter .chapter-description{max-width:390px}
.tech-chapter .red-image{background-image:radial-gradient(circle,#c9a96e16 .7px,transparent .9px);background-size:34px 34px;mask-image:linear-gradient(90deg,transparent,#000 65%)}
.tech-chapter .red-shade{background:radial-gradient(ellipse at 73% 40%,#c9a96e13,transparent 52%)}
.tech-chapter .network-label{font-size:12px;letter-spacing:1px}
.workflow-demo{background:linear-gradient(140deg,#161719eb,#0b0c0fe8);border-color:#c9a96e30;border-radius:16px;overflow:hidden}
.workflow-demo ol{grid-template-columns:repeat(3,minmax(0,1fr))}
.workflow-demo li{padding:22px 24px}.workflow-demo li>span{font-size:12px}.workflow-demo strong{font-size:16px;line-height:1.4;margin-bottom:10px}.workflow-demo small{display:block;font-size:14px;line-height:1.6;max-width:330px;color:#acadb5}
@media(min-width:1101px) and (max-height:820px){.tech-chapter .stage{min-height:700px}.tech-chapter .red-copy{top:11%}.tech-chapter .red-copy h2{font-size:clamp(54px,5.8vw,82px)}.workflow-demo{bottom:105px}.workflow-demo li{padding:16px 20px}}
@media(prefers-reduced-motion:reduce){.tech-chapter .red-copy{top:12%}}
/* M54 — kurze Desktop-Fenster. Die Copy-Spalte haengt an top:15%, ist aber
   fast 700 px hoch; die Bildunterschrift steht bei bottom:38px in derselben
   Buehne (overflow:hidden). Unter rund 900 px Fensterhoehe lief die Spalte
   deshalb in die Bildunterschrift und ueber die Buehnenunterkante hinaus.
   Die alte Kompensation in style.css (@media(max-height:760px) and
   (min-width:761px): .system-copy{top:10%} usw.) ist wirkungslos — die Regeln
   hier in tech.css sind spezifischer (.system .system-copy) und ueberstimmen
   sie. Darum steht die Kompensation jetzt hier, mit gemessenen Schwellen.
   Nur Desktop: mobile.css gilt geschlossen bis 1100px und stellt das Kapitel
   dort auf Fluss-Layout um. Darum min-width:1101px — wie beim Kurz-Fenster-
   Block des Technikkapitels weiter unten. Mit min-width:761px traefe die
   Regel auch Handys im Querformat (844x390, 932x430). */
@media (min-width:1101px) and (max-height:899px){
  .system .system-copy{top:auto;bottom:84px}
}
@media (min-width:1101px) and (max-height:820px){
  .system .system-copy{bottom:56px}
  .system h2{font-size:clamp(50px,5.4vw,84px);margin-bottom:16px}
  .system .system-copy .eyebrow{margin-bottom:14px}
  .system .services{margin-top:16px}
  .system .service{padding:10px 0}
  .system .service-description{margin-top:10px;min-height:26px}
  .system .sys-stats{margin-top:14px}
  .system .sys-hint{margin-top:10px}
}