/* Motion gives the opening a little depth; content remains in normal flow. */
body.era-2026 .hero { isolation:isolate; position:relative; overflow:hidden; }
body.era-2026 .hero-flow { position:absolute; z-index:-1; pointer-events:none; right:-1%; top:-50px; width:48%; height:calc(100% + 100px); color:var(--accent); opacity:.5; mask-image:linear-gradient(90deg,transparent,#000 65%); }
body.era-2026 .hero-flow svg { width:100%; height:100%; }
.flow-signals path { animation:flow-travel 16s linear infinite; animation-play-state:paused; }
.flow-signals path:nth-child(2) { animation-delay:-5s; }
.flow-signals path:nth-child(3) { animation-delay:-10s; }
body.ambient-running .flow-signals path { animation-play-state:running; }
@keyframes flow-travel { to { stroke-dashoffset:-100; } }
body.era-2026 .hero-explore { display:flex; flex-wrap:wrap; gap:12px 28px; align-items:center; margin:28px 0 0; }
body.era-2026 .hero-explore a { display:inline-flex; gap:10px; align-items:center; min-height:44px; font:14px/1.5 var(--f-body); text-decoration:underline; text-underline-offset:5px; text-decoration-color:var(--line-2); }
body.era-2026 .hero-explore a:hover { text-decoration-color:var(--accent); }
body.era-2026 .explore-dot { width:7px; height:7px; border-radius:50%; background:var(--accent); box-shadow:0 0 0 5px color-mix(in srgb,var(--accent) 12%,transparent); }
body.era-2026 #ambientPause { margin-left:auto; padding:8px 0; min-height:44px; color:var(--ink-dim); background:none; border:0; border-bottom:1px solid var(--line); font:11px/1.5 var(--f-mono); cursor:pointer; }
body.era-2026 .nav-list a[aria-current="location"] { color:var(--ink); }
body.era-2026 .nav-list a[aria-current="location"]::after { right:0; height:2px; }
body.era-2026 #site-header::after { content:""; position:absolute; bottom:-1px; left:0; width:100%; height:2px; background:var(--accent); transform:scaleX(var(--page-progress,0)); transform-origin:left; pointer-events:none; }
body.era-2026 .idea-lab { border-top:1px solid var(--line); }
/* html already reserves 90px for the sticky header; avoid doubling that gap. */
body.era-2026 main section[id], body.era-2026 .pricing-details details, body.era-2026 .custom-band { scroll-margin-top:16px; }
body.era-2026 .lab-heading h2 { font-size:clamp(28px,3.3vw,44px); margin-bottom:0; }
body.era-2026 .lab-next { font:14px/1.7 var(--f-body); color:var(--ink-dim); margin-top:18px; }
body.era-2026 .lab-next a { color:var(--ink); text-decoration:underline; text-underline-offset:4px; }
body.era-2026 .price-context { display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px 24px; font:14px/1.6 var(--f-body); color:var(--ink-dim); margin:28px 0 12px; }
body.era-2026 .price-context strong { color:var(--ink); }
body.era-2026 .kontakt-phone a { overflow-wrap:anywhere; }
@media(max-width:760px) {
  body.era-2026 .hero-flow { right:-18%; width:90%; opacity:.28; }
  body.era-2026 .hero-explore { gap:4px 20px; }
  body.era-2026 #ambientPause { margin-left:0; }
  body.era-2026 .lab-heading { grid-template-columns:1fr; gap:16px; }
}
@media(prefers-reduced-motion:reduce) { .flow-signals path { animation:none!important; } }

/* The site controls belong at the entrance, with the same content alignment. */
body.era-2026 .studio-playground { max-width:1320px; margin:0 auto; padding:14px 6vw; border-top:0; border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; gap:16px 28px; flex-wrap:wrap; }
body.era-2026 .studio-playground .theme-choice { display:flex; align-items:center; gap:12px; margin:0; }
body.era-2026 .studio-playground .jargon-slider { margin:0; gap:12px; }
body.era-2026 .studio-playground .jargon-slider input { width:140px; min-height:32px; background-size:100% 2px; background-repeat:no-repeat; background-position:center; }
body.era-2026 .studio-playground .jargon-label { font-size:11px; }
body.era-2026 .studio-playground output { min-width:4ch; font:12px var(--f-mono); }
body.era-2026 #jargonHint { margin:0; font:11px/1.5 var(--f-body); color:var(--ink-dim); }
body.era-2026 .studio-playground .text-btn { min-height:44px; color:var(--ink); white-space:nowrap; }
body.era-2026 [data-jargon-copy] { overflow-wrap:anywhere; hyphens:auto; }
body.era-1993 .studio-playground { padding:12px; border:2px ridge #999; display:flex; flex-wrap:wrap; gap:16px; align-items:center; }
body.era-2026 .price-start { font:700 clamp(28px,3vw,38px)/1.2 var(--f-display); margin:6px 0 14px; }
body.era-2026 .price-summary { font:14px/1.65 var(--f-body); color:var(--ink-dim); margin:0 0 auto; }
body.era-2026 .custom-compact { grid-template-columns:minmax(0,1fr) auto; gap:24px 40px; margin:24px 0; padding:24px; }
body.era-2026 .custom-compact h3 { font-size:24px; margin:0 0 10px; }
body.era-2026 .custom-compact p { font:15px/1.7 var(--f-body); color:var(--ink-dim); margin:0; }
body.era-2026 .custom-compact .custom-range { margin-top:8px; font-size:14px; }
body.era-2026 .custom-compact strong { color:var(--ink); }
body.era-2026 .custom-compact .cb-actions { grid-column:auto; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; }
body.era-2026 .pricing-support,body.era-2026 .pricing-advice { display:block; font:14px/1.7 var(--f-body); color:var(--ink-dim); margin:12px 0; padding:0; border:0; }
body.era-2026 .price-col-lede { min-height:3.1em; }
body.era-2026 .pricing-support a,body.era-2026 .pricing-advice a { color:var(--ink); text-decoration:underline; text-underline-offset:3px; }
body.era-2026 .pricing-details-label { margin-top:28px; }
/* Remove the legacy narrow container and headline-sized link styling. */
body.era-2026 .kontakt { max-width:1320px; }
body.era-2026 .kontakt-form { max-width:none; width:100%; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px 24px; padding:28px; border:1px solid var(--line-2); background:var(--bg-elev); }
body.era-2026 .kontakt .form-row { min-width:0; margin:0; }
body.era-2026 .form-row-wide { grid-column:1/-1; }
body.era-2026 .kontakt a { font:inherit; letter-spacing:normal; border:0; text-decoration:underline; text-underline-offset:4px; }
body.era-2026 .kontakt-lede { max-width:64ch; line-height:1.65; }
body.era-2026 #contactDirect { margin:8px 0; }
body.era-2026 #contactDirect a { font:500 clamp(16px,1.7vw,21px)/1.5 var(--f-body); padding:8px 0; margin:0; }
body.era-2026 .kontakt .contact-sketch { font:14px/1.7 var(--f-body); margin-top:20px; color:var(--ink-dim); }
body.era-2026 .kontakt .contact-sketch a { color:var(--ink); }
body.era-2026 .kontakt .form-row label { text-transform:none; letter-spacing:0; font:14px/1.5 var(--f-body); }
body.era-2026 .kontakt textarea { min-height:150px; }
body.era-2026 .contact-preview-note { border:0; padding:0; margin:0; }
body.era-2026 .cf-submit { text-transform:none; letter-spacing:0; }
body.era-2026 .cf-confirm:empty { display:none; }
body.era-2026 .cf-fallback { margin:0; font:12px/1.6 var(--f-body); }
@media(max-width:760px) {
  body.era-2026 .studio-playground { gap:10px 18px; padding:12px 6vw; }
  body.era-2026 .studio-playground .jargon-control { order:3; width:100%; }
  body.era-2026 .studio-playground .jargon-slider input { flex:1; min-width:60px; }
  body.era-2026 .studio-playground .theme-choice { gap:8px; }
  body.era-2026 .custom-compact { grid-template-columns:1fr; gap:12px; padding:20px; }
  body.era-2026 .custom-compact .cb-actions { flex-direction:row; flex-wrap:wrap; gap:0 20px; }
  body.era-2026 .kontakt-form { grid-template-columns:1fr; padding:20px 16px; gap:20px; }
}