:root {
  --ink: #211624;
  --plum: #4c2b54;
  --violet: #7652c5;
  --green: #275d47;
  --mint: #c6ecd4;
  --paper: #f8f7fa;
  --white: #fff;
  --line: #d9d5de;
  font-family: Arial, Helvetica, sans-serif;
  color: var(--ink);
  background: var(--paper);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 88px; }
body { margin: 0; min-width: 320px; }
button, a { font: inherit; }
button { cursor: pointer; }
a { color: inherit; }
img { max-width: 100%; height: auto; }
::selection { background: var(--violet); color: var(--white); }
.container { width: min(100% - 64px, 1440px); margin-inline: auto; }
.skip-link { position: absolute; top: -100px; left: 1rem; z-index: 100; padding: 12px; background: var(--ink); color: var(--white); }
.skip-link:focus { top: 8px; }
.eyebrow { margin: 0; font-size: .8rem; line-height: 1.4; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; }
.eyebrow-dark { color: var(--plum); }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { letter-spacing: -.065em; }
h1 em, h2 em { font-style: normal; }
.section-pad { padding: clamp(72px, 7vw, 112px) 0; }

.site-header { position: sticky; top: 0; z-index: 30; background: rgba(248,247,250,.96); border-bottom: 1px solid var(--line); backdrop-filter: blur(16px); }
.header-inner { display: flex; align-items: center; justify-content: space-between; gap: 32px; min-height: 88px; }
.brand { display: block; line-height: 0; }
.brand img { display: block; width: 250px; height: auto; }
.nav { display: flex; align-items: center; gap: 38px; }
.nav a { font-size: .96rem; font-weight: 800; text-decoration: none; transition: color .2s; }
.nav a:hover, .nav a:focus-visible { color: var(--violet); }
.nav-contact { padding: 12px 21px; border: 1.5px solid var(--ink); }
.menu-toggle { display: none; }

.hero { overflow: hidden; background: var(--ink); color: var(--paper); }
.hero-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(310px, .65fr); gap: clamp(40px, 5vw, 96px); min-height: min(600px, 62vw); }
.hero-copy { display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; padding: clamp(52px, 5vw, 82px) 0 54px; }
.hero .eyebrow { color: var(--mint); }
.hero h1 { margin: 28px 0 45px; font-size: clamp(4.8rem, 8.5vw, 9.6rem); font-weight: 800; line-height: .84; }
.hero h1 em { color: var(--mint); }
.hero-bottom { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 34px; width: 100%; }
.hero-bottom p { max-width: 520px; margin: 0; font-size: clamp(1.15rem, 1.65vw, 1.48rem); line-height: 1.45; }
.hero-link { display: inline-flex; justify-content: space-between; gap: 20px; align-items: center; min-width: 186px; padding: 10px 0 8px; border-bottom: 2px solid var(--mint); color: var(--mint); font-size: .96rem; font-weight: 800; line-height: 1.25; text-decoration: none; }
.hero-link:hover { color: var(--white); border-color: var(--white); }
.hero-link span { font-size: 1.4rem; }
.hero-index { display: flex; flex-direction: column; justify-content: center; min-width: 0; padding: 56px 0 56px clamp(36px, 4.5vw, 76px); border-left: 1px solid rgba(198,236,212,.36); }
.index-head, .index-foot { font-size: .76rem; line-height: 1.4; font-weight: 800; letter-spacing: .13em; }
.index-head { margin-bottom: 36px; color: var(--mint); }
.index-row { display: grid; grid-template-columns: 38px 1fr 24px; align-items: baseline; gap: 12px; padding: 14px 0 17px; border-top: 1px solid rgba(248,247,250,.26); }
.index-row:last-of-type { border-bottom: 1px solid rgba(248,247,250,.26); }
.index-row span { color: var(--mint); font-size: .82rem; font-weight: 800; }
.index-row span:last-child { font-size: 1.2rem; }
.index-row strong { font-size: clamp(2.3rem, 3.5vw, 4rem); line-height: 1; letter-spacing: -.07em; }
.index-row:nth-of-type(3) strong { color: var(--mint); }
.index-row strong { transition: transform .25s, color .25s; }
.index-row:hover strong { transform: translateX(8px); color: var(--mint); }
.index-foot { margin: 30px 0 0; color: var(--mint); }
.hero-edge { display: flex; justify-content: space-between; gap: 20px; padding: 20px 0 24px; border-top: 1px solid rgba(248,247,250,.22); color: var(--mint); font-size: .72rem; letter-spacing: .13em; font-weight: 800; }
.format-ribbon { overflow: hidden; background: var(--violet); color: var(--white); }
.ribbon-track { width: max-content; padding: 15px 0; white-space: nowrap; font-size: clamp(.95rem, 1.65vw, 1.3rem); font-weight: 800; letter-spacing: .08em; word-spacing: .9em; animation: ribbon-move 28s linear infinite; }
.ribbon-track b { margin: 0 .7em; color: var(--mint); }
@keyframes ribbon-move { to { transform: translateX(-50%); } }

.thought { background: var(--paper); }
.thought-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); align-items: end; gap: 7vw; }
.thought h2 { max-width: 850px; margin: 26px 0 0; font-size: clamp(3.2rem, 5.1vw, 6.2rem); line-height: .97; }
.thought h2 em { color: var(--violet); }
.thought-visual { margin: 38px 0 0; }
.thought-visual figcaption { padding-top: 10px; color: var(--plum); font-size: .78rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.mockup-stage { position: relative; display: block; width: 100%; aspect-ratio: 3 / 2; overflow: hidden; isolation: isolate; container-type: inline-size; }
.mockup-photo { display: block; width: 100%; height: 100%; object-fit: cover; }
.thought-visual .mockup-stage { box-shadow: 14px 14px 0 var(--violet); }
.mockup-screen { position: absolute; left: 25.45%; top: 13.9%; width: 61.2%; height: 53.8%; display: flex; flex-direction: column; overflow: hidden; background: var(--ink); color: var(--white); container-type: inline-size; }
.screen-mini-header { display: flex; align-items: center; gap: 1.6cqw; padding: 2cqw 3cqw; border-bottom: 1px solid rgba(255,255,255,.25); font-size: 1.9cqw; font-weight: 800; letter-spacing: .08em; }
.screen-mini-header img { width: 3.4cqw; height: 3.4cqw; border-radius: .5cqw; }
.screen-mini-header small { margin-left: auto; font-size: 1.25cqw; letter-spacing: .1em; }
.screen-mini-content { flex: 1; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: 3cqw 4.2cqw; }
.screen-mini-content > span { color: var(--mint); font-size: 1.5cqw; font-weight: 800; letter-spacing: .11em; }
.screen-mini-content strong { margin-top: 2.6cqw; font-size: 10.2cqw; line-height: .86; letter-spacing: -.065em; }
.screen-mini-content em { color: var(--mint); font-style: normal; }
.screen-mini-content p { margin: 2.4cqw 0 0; font-size: 2cqw; }
.screen-mini-footer { display: flex; justify-content: space-between; gap: 1cqw; padding: 1.8cqw 3cqw; background: var(--violet); font-size: 1.45cqw; font-weight: 800; letter-spacing: .08em; }
.thought-copy { padding-bottom: 4px; }
.thought-copy p { max-width: 600px; margin-bottom: 20px; font-size: clamp(1.1rem, 1.35vw, 1.3rem); line-height: 1.5; }
.thought-copy p:nth-child(2) { font-weight: 800; }
.underlined-link { display: inline-flex; align-items: center; gap: 28px; margin-top: 12px; padding-bottom: 7px; border-bottom: 2px solid var(--ink); font-size: 1rem; font-weight: 800; text-decoration: none; }
.underlined-link:hover { color: var(--violet); border-color: var(--violet); }
.underlined-link span { font-size: 1.35rem; }
.thought-line { display: flex; justify-content: space-between; gap: 15px; margin-top: clamp(42px, 5vw, 70px); padding-top: 20px; border-top: 1px solid var(--ink); color: var(--plum); font-size: clamp(1rem, 1.5vw, 1.3rem); font-weight: 800; letter-spacing: -.025em; }

.work { background: var(--white); }
.work-intro { padding-top: clamp(70px, 7vw, 110px); padding-bottom: clamp(48px, 5vw, 72px); }
.work-intro h2 { margin: 22px 0 0; font-size: clamp(3.2rem, 5.5vw, 6.7rem); line-height: .98; }
.work-intro h2 em { color: var(--violet); }
.work-panel { overflow: hidden; }
.panel-digital { background: #eae4f6; }
.panel-tangible { background: var(--mint); }
.panel-grid { display: grid; grid-template-columns: minmax(220px, .72fr) minmax(0, 1.28fr); gap: 7vw; padding-top: clamp(60px, 6vw, 82px); padding-bottom: clamp(60px, 6vw, 82px); }
.panel-label { display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; font-size: .8rem; font-weight: 800; letter-spacing: .13em; }
.panel-label strong { font-size: clamp(9rem, 15vw, 17rem); line-height: .65; letter-spacing: -.15em; opacity: .14; margin-left: -.08em; }
.panel-visual { width: 100%; margin: 30px 0 0; }
.panel-tangible .panel-grid { grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: 5vw; }
.tote-print { position: absolute; left: 46%; top: 47%; width: 27%; display: flex; flex-direction: column; align-items: flex-start; gap: 1cqw; transform: rotate(-.7deg); mix-blend-mode: multiply; }
.tote-print img { display: block; width: 27%; height: auto; }
.tote-print strong { color: var(--ink); font-size: 4.7cqw; line-height: .95; font-weight: 800; letter-spacing: -.055em; }
.panel-copy { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; }
.panel-copy h3 { max-width: 850px; margin-bottom: 24px; font-size: clamp(3rem, 4.8vw, 5.5rem); line-height: 1; }
.panel-copy p { max-width: 600px; margin-bottom: 30px; font-size: clamp(1.08rem, 1.3vw, 1.28rem); line-height: 1.5; }
.panel-details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px; width: 100%; max-width: 820px; padding-top: 24px; border-top: 1px solid rgba(33,22,36,.35); }
.panel-details h4 { margin: 0 0 14px; font-size: clamp(1.35rem, 2vw, 1.8rem); line-height: 1.13; letter-spacing: -.045em; }
.panel-details p { max-width: 370px; margin: 0; font-size: 1.02rem; line-height: 1.5; }
.panel-tag { display: inline-block; padding-top: 15px; border-top: 2px solid currentColor; font-size: .8rem; font-weight: 800; letter-spacing: .12em; }
.panel-details + .panel-tag { margin-top: 36px; }
.panel-tangible .panel-label, .panel-tangible .panel-tag { color: var(--green); }

.example { background: var(--paper); }
.example-grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 8vw; align-items: start; }
.example h2 { margin: 25px 0 28px; font-size: clamp(3.2rem, 5.2vw, 6.1rem); line-height: .97; }
.example h2 em { color: var(--violet); }
.example-copy > p:last-child { max-width: 550px; font-size: clamp(1.13rem, 1.6vw, 1.42rem); line-height: 1.5; }
.example-list { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--ink); }
.example-list li { display: grid; grid-template-columns: 130px 1fr; gap: 30px; padding: 31px 0 36px; border-bottom: 1px solid var(--line); }
.example-list li > span { padding-top: 5px; color: var(--violet); font-size: .78rem; font-weight: 800; letter-spacing: .11em; }
.example-list h3 { margin: 0 0 13px; font-size: clamp(1.55rem, 2.4vw, 2.45rem); line-height: 1.12; }
.example-list p { max-width: 520px; margin: 0; font-size: 1.04rem; line-height: 1.5; }

.signature { background: var(--plum); color: var(--white); }
.signature-grid { display: grid; grid-template-columns: .45fr 1fr; gap: 7vw; }
.signature .eyebrow { color: var(--mint); }
.signature h2 { margin: 0 0 28px; font-size: clamp(3.4rem, 6vw, 7.2rem); line-height: .95; }
.signature h2 em { color: var(--mint); }
.signature p:last-child { max-width: 850px; margin: 0; font-size: clamp(1.2rem, 1.7vw, 1.65rem); line-height: 1.45; }

.questions { background: var(--white); }
.questions-grid { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 8vw; }
.questions h2 { margin: 25px 0 24px; font-size: clamp(3.2rem, 5.3vw, 6.1rem); line-height: .97; }
.questions h2 em { color: var(--violet); }
.questions-intro { max-width: 480px; font-size: clamp(1.1rem, 1.55vw, 1.38rem); line-height: 1.5; }
.question-list { border-top: 1px solid var(--ink); }
.question-list details { padding: 27px 0; border-bottom: 1px solid var(--line); }
.question-list summary { position: relative; padding-right: 48px; font-size: clamp(1.15rem, 1.6vw, 1.5rem); line-height: 1.3; font-weight: 800; letter-spacing: -.025em; cursor: pointer; list-style: none; }
.question-list summary::-webkit-details-marker { display: none; }
.question-list summary::after { content: '+'; position: absolute; top: 0; right: 3px; color: var(--violet); font-size: 1.5rem; font-weight: 400; }
.question-list details[open] summary::after { content: '−'; }
.question-list details p { max-width: 580px; margin: 18px 45px 0 0; font-size: 1.05rem; line-height: 1.5; }

.contact { background: var(--mint); }
.contact-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 7vw; align-items: end; }
.contact h2 { margin: 24px 0 0; font-size: clamp(3.3rem, 5.4vw, 6.6rem); line-height: .98; }
.contact h2 em { color: var(--green); }
.contact-copy { padding-bottom: 8px; }
.contact-copy p { max-width: 560px; margin-bottom: 48px; font-size: clamp(1.15rem, 1.6vw, 1.5rem); line-height: 1.45; }
.contact-link { display: flex; justify-content: space-between; align-items: baseline; gap: 20px; width: 100%; max-width: 570px; padding-bottom: 13px; border-bottom: 2px solid var(--ink); font-size: clamp(1.3rem, 2.4vw, 2.25rem); font-weight: 800; letter-spacing: -.035em; text-decoration: none; }
.contact-link:hover { color: var(--green); border-color: var(--green); }
.contact-link span { font-size: 1.5rem; }

.site-footer { padding: 58px 0 22px; background: var(--paper); }
.footer-main { display: grid; grid-template-columns: 1.3fr 1fr auto; align-items: start; gap: 32px; padding-bottom: 70px; }
.footer-main img { display: block; width: 240px; }
.footer-main p { margin: 7px 0 0; font-size: 1rem; line-height: 1.45; }
.footer-main a:last-child { padding-top: 9px; font-size: .9rem; font-weight: 800; text-decoration: none; }
.footer-bottom { display: flex; justify-content: space-between; gap: 20px; padding-top: 20px; border-top: 1px solid var(--line); font-size: .75rem; font-weight: 800; letter-spacing: .08em; }

@media (max-width: 1050px) {
  .header-inner { gap: 20px; }
  .brand img { width: 220px; }
  .nav { gap: 20px; }
  .nav a { font-size: .9rem; }
  .hero-grid { grid-template-columns: minmax(0, 1fr) minmax(250px, .62fr); gap: 35px; }
  .hero h1 { font-size: clamp(4.6rem, 8.5vw, 7.4rem); }
  .hero-bottom { display: block; }
  .hero-link { margin-top: 30px; }
  .hero-index { padding-left: 30px; }
  .panel-grid { grid-template-columns: .5fr 1fr; }
}
@media (max-width: 800px) {
  .container { width: min(100% - 40px, 680px); }
  .header-inner { min-height: 76px; }
  .brand img { width: 215px; }
  .menu-toggle { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; width: 48px; height: 48px; border: 1px solid var(--ink); background: transparent; }
  .menu-toggle span { display: block; width: 22px; height: 2px; background: var(--ink); }
  .nav { display: none; position: absolute; top: 75px; left: 0; right: 0; flex-direction: column; align-items: stretch; gap: 0; padding: 22px 20px 28px; border-bottom: 1px solid var(--line); background: var(--paper); box-shadow: 0 16px 20px rgba(33,22,36,.08); }
  .nav.is-open { display: flex; }
  .nav a { padding: 14px 5px; }
  .nav .nav-contact { margin-top: 8px; padding: 14px; text-align: center; }
  .hero-grid { display: block; min-height: auto; }
  .hero-copy { padding: 62px 0 46px; }
  .hero h1 { margin: 30px 0 38px; font-size: clamp(4.7rem, 12vw, 7rem); }
  .hero-bottom { max-width: 650px; }
  .hero-index { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; padding: 30px 0 45px; border-left: 0; border-top: 1px solid rgba(198,236,212,.36); }
  .index-head, .index-foot { grid-column: 1/-1; margin: 0 0 17px; }
  .index-row { display: block; padding: 17px 12px 17px 0; border-bottom: 1px solid rgba(248,247,250,.26); }
  .index-row strong { display: block; margin-top: 10px; font-size: clamp(2rem, 6.5vw, 3.5rem); }
  .index-row span:last-child { display: none; }
  .index-foot { margin: 22px 0 0; }
  .thought-grid, .example-grid, .signature-grid, .questions-grid, .contact-grid { grid-template-columns: 1fr; gap: 45px; }
  .thought h2 { font-size: clamp(3rem, 8vw, 5.2rem); }
  .thought-line { margin-top: 46px; }
  .work-intro h2 { font-size: clamp(3rem, 8vw, 5.2rem); }
  .panel-grid { grid-template-columns: 1fr; gap: 25px; min-height: 0; }
  .panel-tangible .panel-grid { grid-template-columns: 1fr; gap: 28px; }
  .panel-label { display: block; }
  .panel-label strong { display: none; }
  .panel-visual { max-width: 560px; margin-top: 24px; }
  .panel-copy h3 { font-size: clamp(3rem, 8vw, 5rem); }
  .example h2, .questions h2 { font-size: clamp(3rem, 8vw, 5.2rem); }
  .signature h2 { font-size: clamp(3.1rem, 8vw, 5.3rem); }
  .contact h2 { font-size: clamp(3rem, 8vw, 5.3rem); }
  .footer-main { grid-template-columns: 1fr auto; gap: 25px; }
  .footer-main p { grid-column: 1; }
  .footer-main a:last-child { grid-column: 2; grid-row: 1; }
}
@media (max-width: 520px) {
  .container { width: calc(100% - 32px); }
  .section-pad { padding: 68px 0; }
  .brand img { width: 195px; }
  .hero-copy { padding: 54px 0 40px; }
  .hero h1 { font-size: clamp(3.25rem, 11vw, 5.7rem); }
  .hero-bottom p { font-size: 1.12rem; }
  .hero-index { padding-bottom: 33px; }
  .index-row strong { font-size: clamp(1.8rem, 7.2vw, 2.7rem); }
  .hero-edge { font-size: .6rem; }
  .hero-edge span:last-child { display: none; }
  .thought h2, .work-intro h2, .panel-copy h3, .signature h2, .contact h2 { font-size: clamp(2.6rem, 9.2vw, 3.9rem); }
  .thought-visual { margin-top: 28px; }
  .thought-visual figcaption { font-size: .68rem; }
  .panel-visual img { aspect-ratio: 1.35; }
  .thought-copy p, .panel-copy p, .contact-copy p { font-size: 1.08rem; }
  .thought-line { font-size: .9rem; }
  .work-intro { padding-top: 68px; padding-bottom: 52px; }
  .panel-grid { padding-top: 60px; padding-bottom: 62px; }
  .panel-details { grid-template-columns: 1fr; gap: 25px; }
  .panel-details p { font-size: 1.02rem; }
  .example h2, .questions h2 { font-size: clamp(2.6rem, 9.2vw, 3.9rem); }
  .example-list li { grid-template-columns: 1fr; gap: 9px; padding: 26px 0 30px; }
  .question-list summary { font-size: 1.13rem; }
  .question-list details p { margin-right: 15px; }
  .footer-main { padding-bottom: 45px; }
  .footer-main img { width: 200px; }
  .footer-bottom span:last-child { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* Auszeit campaign */
.escape-hero { position:relative; overflow:hidden; isolation:isolate; background:var(--ink); color:white; min-height:720px; }
.escape-scenes, .escape-scene, .escape-shade { position:absolute; inset:0; width:100%; height:100%; }
.escape-scenes { z-index:-3; }
.escape-scene { object-fit:cover; object-position:center; opacity:0; transition:opacity 1.4s ease; }
.escape-scene.is-active { opacity:1; }
.escape-shade { z-index:-2; background:linear-gradient(90deg,rgba(33,22,36,.87),rgba(33,22,36,.56) 45%,rgba(33,22,36,.05) 78%),linear-gradient(0deg,rgba(33,22,36,.6),transparent 30%); }
.escape-content { padding-top:clamp(70px,7vw,110px); padding-bottom:54px; }
.escape-content .eyebrow { color:var(--mint); }
.escape-content h1 { max-width:900px; margin:28px 0 28px; font-size:clamp(3.4rem,5.6vw,6rem); line-height:1.02; letter-spacing:-.06em; }
.escape-content h1 em { color:var(--mint); }
.escape-lead { max-width:565px; font-size:1.2rem; line-height:1.55; text-wrap:pretty; }
.solid-link { display:inline-block; padding:16px 22px; background:var(--mint); color:var(--ink); font-weight:700; text-decoration:none; transition:background .2s,transform .2s; }
.solid-link:hover { background:white; transform:translateY(-3px); }
.quiet-link { padding:12px 0; border-bottom:1px solid currentColor; text-decoration:none; font-weight:700; }
.escape-controls { display:flex; justify-content:space-between; align-items:center; gap:24px; padding:24px 0 30px; border-top:1px solid #ffffff40; }
.scene-selector { display:flex; flex-wrap:wrap; gap:12px; }
.scene-selector button { padding:10px 14px; color:white; border:1px solid #ffffff60; background:rgba(33,22,36,.35); font-size:.9rem; }
.scene-selector button.is-active { background:var(--mint); border-color:var(--mint); color:var(--ink); }
.escape-note { font-size:.8rem; letter-spacing:.08em; font-weight:700; }
.editorial-photo { display:block; width:100%; aspect-ratio:3/2; object-fit:cover; }
.panel-visual { overflow:visible; }
.panel-visual figcaption { margin-top:12px; font-size:.875rem; letter-spacing:0; font-weight:500; }
.showcase { background:var(--paper); }
.showcase-intro { max-width:950px; margin-bottom:46px; }
.showcase h2 { margin:22px 0 24px; font-size:clamp(2.8rem,4.5vw,5rem); line-height:1.03; }
.showcase h2 em { color:var(--violet); }
.showcase-intro>p:last-child { max-width:670px; font-size:1.15rem; line-height:1.55; }
.showcase-grid { display:grid; grid-template-columns:1fr 1fr; gap:32px; }
.project-card { margin:0; }
.project-image { overflow:hidden; }
.project-image img { width:100%; display:block; aspect-ratio:3/2; object-fit:cover; transition:transform .8s ease; }
.project-card:hover .project-image img { transform:scale(1.045); }
.project-card figcaption { padding:24px 0 0; }
.project-card figcaption>span { font-size:.875rem; font-weight:700; letter-spacing:.08em; color:var(--violet); }
.project-card h3 { font-size:clamp(1.8rem,2.4vw,2.5rem); line-height:1.1; margin:12px 0 14px; letter-spacing:-.045em; }
.project-card p { font-size:1.05rem; line-height:1.5; max-width:550px; }
.project-card small { color:var(--plum); font-size:.875rem; }
.handoff { background:var(--green); color:white; }
.handoff-grid { display:grid; grid-template-columns:1fr 1fr; gap:8vw; align-items:center; }
.handoff .eyebrow { color:var(--mint); }
.handoff h2 { margin:24px 0; font-size:clamp(2.8rem,4.6vw,5rem); line-height:1.02; }
.handoff h2 em { color:var(--mint); }
.handoff p { font-size:1.1rem; line-height:1.6; max-width:590px; }
.handoff .solid-link { margin-top:14px; }
.handoff-list { padding:0; margin:0; list-style:none; }
.handoff-list li { display:grid; grid-template-columns:52px 1fr; gap:24px; padding:26px 0; border-top:1px solid #ffffff50; }
.handoff-list li>span { color:var(--mint); font-size:1.5rem; }
.handoff-list h3 { font-size:1.5rem; letter-spacing:-.035em; line-height:1.2; margin:0 0 12px; }
.handoff-list p { margin:0; font-size:1rem; }
.motion-ready .reveal { opacity:0; transform:translateY(24px); transition:opacity .8s ease,transform .8s ease; }
.motion-ready .reveal.is-visible { opacity:1; transform:none; }
:focus-visible { outline:3px solid var(--violet); outline-offset:5px; }
.escape-hero :focus-visible,.handoff :focus-visible { outline-color:var(--mint); }
@media(max-width:800px) {
 .escape-hero { min-height:690px; }
 .escape-content { padding-top:70px; }
 .escape-content h1 { font-size:clamp(3rem,7.5vw,4.5rem); }
 .escape-shade { background:linear-gradient(90deg,#211624db,#21162470),linear-gradient(0deg,#21162499,transparent); }
 .escape-controls { align-items:flex-start; flex-direction:column; }
 .escape-note { display:none; }
 .showcase-grid,.handoff-grid { grid-template-columns:1fr; gap:44px; }
 .showcase h2,.handoff h2 { font-size:clamp(2.6rem,7.5vw,4rem); }
}
@media(max-width:520px) {
 .escape-content { padding-top:52px; padding-bottom:36px; }
 .escape-content h1 { font-size:clamp(2.7rem,10vw,3.5rem); }
 .escape-lead { font-size:1.06rem; }
 .escape-scene { object-position:62% center; }
 .escape-controls { padding-bottom:24px; }
 .scene-selector { gap:6px; }
 .scene-selector button { font-size:.875rem; padding:10px; }
 .escape-hero { min-height:0; }
 .showcase-grid { gap:42px; }
}
@media(prefers-reduced-motion:reduce) {
 .escape-scene.is-active { animation:none; }
 .motion-ready .reveal { opacity:1; transform:none; }
 .project-card:hover .project-image img { transform:none; }
}

/* Mehr Spannung zwischen großen Bildflächen und ruhigen Informationen. */
.format-ribbon { position:relative; z-index:2; transform:rotate(-1.2deg) scale(1.02); margin:-9px 0 8px; box-shadow:0 10px 0 var(--mint); }
.thought { padding-bottom:70px; }
.thought-visual .editorial-photo { box-shadow:16px 16px 0 var(--violet); transform:rotate(-1.5deg); transition:transform .6s ease; }
.thought-visual:hover .editorial-photo { transform:rotate(0); }
.thought-visual figcaption { margin-top:18px; }
.showcase { background:var(--ink); color:white; overflow:hidden; }
.showcase .eyebrow-dark,.showcase h2 em,.project-card figcaption>span { color:var(--mint); }
.showcase-intro { display:grid; grid-template-columns:1.3fr .7fr; column-gap:60px; max-width:none; align-items:end; }
.showcase-intro .eyebrow { grid-column:1/-1; }
.showcase-intro>p:last-child { margin-bottom:28px; }
.showcase-grid { grid-template-columns:1.15fr .85fr; gap:60px; align-items:start; padding:30px 0 10px; }
.project-card:nth-child(2) { margin-top:145px; }
.project-image { box-shadow:12px 12px 0 var(--violet); transform:rotate(-1.5deg); overflow:hidden; }
.project-card:nth-child(2) .project-image { transform:rotate(2deg); box-shadow:12px 12px 0 var(--green); }
.project-card figcaption { padding-top:35px; }
.project-card small { color:#d6cce2; }
.stationery { padding-top:90px; background:var(--violet); color:white; overflow:hidden; }
.stationery-heading { display:grid; grid-template-columns:1.5fr .6fr; gap:0 6vw; align-items:end; padding-bottom:55px; }
.stationery-heading .eyebrow { color:var(--mint); grid-column:1/-1; }
.stationery h2 { font-size:clamp(3rem,5.8vw,6.5rem); letter-spacing:-.06em; line-height:1.02; margin:28px 0 0; }
.stationery h2 em { color:var(--mint); }
.stationery-heading>p:last-child { font-size:1.15rem; line-height:1.5; margin-bottom:0; }
.stationery-stage { position:relative; margin:0; }
.stationery-stage>img { width:100%; display:block; max-height:900px; object-fit:cover; }
.stationery-stage figcaption { position:absolute; bottom:0; left:0; right:0; display:flex; justify-content:space-between; gap:20px; background:#211624e8; padding:22px 4vw; font-size:.9rem; letter-spacing:.06em; }
.stationery-details { display:grid; grid-template-columns:repeat(3,1fr); gap:40px; padding-top:50px; padding-bottom:65px; }
.stationery-details>div { border-top:1px solid #ffffff70; padding-top:24px; }
.stationery-details span { color:var(--mint); font-size:.875rem; letter-spacing:.07em; font-weight:700; }
.stationery-details h3 { font-size:1.8rem; line-height:1.13; letter-spacing:-.04em; margin:16px 0; }
.stationery-details p { font-size:1.02rem; line-height:1.55; margin:0; }
.panel-copy h3 { font-size:clamp(2.7rem,4.2vw,4.8rem); }
.work-intro { padding-top:70px; padding-bottom:45px; }
@media(max-width:800px){
 .showcase-intro,.showcase-grid,.stationery-heading { grid-template-columns:1fr; gap:26px; }
 .showcase-grid { gap:50px; padding-right:12px; }
 .project-card:nth-child(2) { margin-top:0; }
 .showcase-intro>p:last-child { margin:0; }
 .stationery { padding-top:64px; }
 .stationery-heading { padding-bottom:36px; }
 .stationery-heading h2 { margin-top:0; }
 .stationery-details { grid-template-columns:1fr; gap:30px; }
 .stationery-stage>img { min-height:370px; object-position:center; }
 .stationery-stage figcaption { position:static; flex-direction:column; gap:8px; padding:18px 20px; font-size:.875rem; }
}
@media(prefers-reduced-motion:reduce){
 .thought-visual .editorial-photo,.project-image,.project-card:nth-child(2) .project-image { transform:none; }
}
.project-wide { grid-column:1/-1; display:grid; grid-template-columns:1.4fr .6fr; gap:55px; align-items:center; margin-top:45px; }
.project-wide .project-image { transform:rotate(-1deg); }
.project-wide figcaption { padding:0; }
@media(max-width:800px){ .project-wide { grid-template-columns:1fr; gap:30px; margin-top:0; } }
body { overflow-x:clip; }
.showcase-grid .project-card:nth-child(2), .stationery-details>div:nth-child(2) { transition-delay:.12s; }
.stationery-details>div:nth-child(3) { transition-delay:.24s; }
.textile { background:var(--paper); }
.textile-intro { display:grid; grid-template-columns:1.3fr .7fr; gap:6vw; align-items:end; margin-bottom:45px; }
.textile h2 { font-size:clamp(3rem,5.5vw,6rem); line-height:1.02; margin:25px 0 0; }
.textile h2 em { color:var(--violet); }
.textile-intro>p { font-size:1.15rem; line-height:1.55; margin-bottom:0; }
.textile-visual { margin-top:0; margin-bottom:0; }
.textile-visual>img { width:100%; display:block; box-shadow:14px 14px 0 var(--violet); }
.textile-visual figcaption { display:grid; grid-template-columns:1.2fr .8fr; gap:5vw; align-items:start; padding-top:40px; }
.textile-visual figcaption span { color:var(--violet); font-size:.875rem; font-weight:700; letter-spacing:.08em; }
.textile-visual h3 { font-size:2rem; line-height:1.15; margin:14px 0; letter-spacing:-.045em; }
.textile-visual figcaption p { margin:0; font-size:1rem; line-height:1.5; }
.textile-bottom { display:flex; gap:24px; align-items:center; justify-content:space-between; padding-top:30px; border-top:1px solid var(--line); margin-top:25px; }
.textile-bottom p { margin:0; font-size:1.05rem; }
@media(max-width:800px){ .textile-intro,.textile-visual figcaption { grid-template-columns:1fr; gap:26px; }.textile-bottom { align-items:flex-start; flex-direction:column; }.textile-visual { padding-right:12px; } }

/* Konkrete Leistungen und zusätzliche Anwendungen. */
.deliverables { margin:20px 0 0; padding:0; list-style:none; font-size:1rem; line-height:1.5; }
.deliverables li { position:relative; padding:9px 0 9px 19px; border-bottom:1px solid #21162420; }
.deliverables li::before { content:""; position:absolute; left:0; top:19px; width:6px; height:6px; background:var(--violet); }
.panel-tangible .deliverables li::before { background:var(--green); }
.service-more { padding-top:64px; padding-bottom:80px; }
.service-more-heading { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:40px; align-items:start; margin-bottom:30px; }
.service-more-heading .eyebrow { font-size:.875rem; padding-top:5px; }
.service-more-heading>p:last-child { max-width:590px; margin:0; font-size:1.1rem; line-height:1.55; }
.service-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.service-card { display:flex; flex-direction:column; align-items:flex-start; min-width:0; padding:clamp(26px,3vw,46px); background:var(--paper); border:1px solid var(--line); }
.service-card:nth-child(2) { background:var(--mint); border-color:var(--mint); }
.service-card:nth-child(3) { background:#eae4f6; border-color:#eae4f6; }
.service-card:nth-child(4) { background:var(--ink); color:var(--white); border-color:var(--ink); }
.service-number { font-size:.875rem; line-height:1.4; font-weight:800; letter-spacing:.07em; color:var(--plum); }
.service-card:nth-child(4) .service-number { color:var(--mint); }
.service-card h3 { margin:22px 0 18px; font-size:clamp(1.9rem,2.7vw,2.75rem); line-height:1.07; letter-spacing:-.05em; }
.service-card>p { max-width:540px; margin-bottom:0; font-size:1.05rem; line-height:1.55; }
.service-card .deliverables { width:100%; margin-bottom:28px; }
.service-card>a { display:inline-flex; align-items:center; gap:24px; padding:8px 0; margin-top:auto; border-bottom:2px solid currentColor; font-size:1rem; font-weight:700; line-height:1.4; text-decoration:none; }
.service-card>a::after { content:"↗"; font-size:1.25rem; }
.service-card>a:hover { color:var(--violet); }
.service-card:nth-child(4) .deliverables li { border-color:#ffffff35; }
.service-card:nth-child(4) .deliverables li::before { background:var(--mint); }
.service-card:nth-child(4)>a:hover { color:var(--mint); }
.project-notes { margin:24px 0; font-size:1rem; line-height:1.5; }
.project-notes>div { padding:12px 0; border-top:1px solid #ffffff30; }
.project-notes dt { margin-bottom:5px; color:var(--mint); font-weight:700; }
.project-notes dd { margin:0; color:#f0ebf4; }
.application-examples { background:#efedf2; overflow:hidden; }
.application-case { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.25fr); gap:clamp(30px,4.5vw,70px); align-items:center; }
.application-copy { min-width:0; }
.application-copy .eyebrow { font-size:.875rem; letter-spacing:.08em; }
.application-copy h2 { margin:24px 0; font-size:clamp(2.4rem,3.7vw,4rem); line-height:1.03; letter-spacing:-.055em; }
.application-copy h2 em { color:var(--green); }
.application-copy>p:not(.eyebrow) { max-width:570px; font-size:1.08rem; line-height:1.55; }
.application-notes { margin:24px 0; font-size:1rem; line-height:1.5; }
.application-notes>div { padding:13px 0; border-top:1px solid #21162435; }
.application-notes dt { margin-bottom:4px; font-weight:700; }
.application-notes dd { margin:0; }
.concept-label { display:block; color:var(--plum); font-size:.875rem; line-height:1.5; }
.application-image { min-width:0; margin:0; }
.application-image img { display:block; width:100%; box-shadow:12px 12px 0 var(--green); transform:rotate(1deg); transition:transform .6s ease; }
.application-case:hover .application-image img { transform:rotate(0); }
.application-campaign { grid-template-columns:minmax(0,1.25fr) minmax(0,.85fr); margin-top:90px; padding-top:70px; border-top:1px solid var(--line); }
.application-campaign h2 em { color:var(--violet); }
.application-campaign .application-image img { transform:rotate(-1deg); box-shadow:12px 12px 0 var(--violet); }
.application-campaign:hover .application-image img { transform:rotate(0); }
.project-starts { background:var(--green); color:var(--white); }
.starts-heading { max-width:970px; }
.starts-heading .eyebrow { color:var(--mint); font-size:.875rem; }
.starts-heading h2 { margin:24px 0 45px; font-size:clamp(2.6rem,4.5vw,5rem); line-height:1.03; }
.starts-heading h2 em { color:var(--mint); }
.starts-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:40px; }
.starts-grid article { padding-top:24px; border-top:1px solid #c6ecd480; }
.starts-grid article>span { color:var(--mint); font-size:.875rem; font-weight:800; letter-spacing:.06em; }
.starts-grid h3 { margin:20px 0 16px; font-size:clamp(1.65rem,2.2vw,2.25rem); line-height:1.13; letter-spacing:-.045em; }
.starts-grid p { margin-bottom:0; font-size:1.05rem; line-height:1.6; }
.contact-copy>p { margin-bottom:24px; }
.contact-prompts { padding:0; margin:0 0 36px; list-style:none; font-size:1rem; line-height:1.5; }
.contact-prompts li { position:relative; padding:10px 0 10px 20px; border-bottom:1px solid #275d4730; }
.contact-prompts li::before { content:"↗"; position:absolute; left:0; color:var(--green); }
.footer-main { padding-bottom:36px; }
.footer-format-links { display:flex; flex-wrap:wrap; gap:14px 32px; padding-bottom:32px; }
.footer-format-links a { padding:4px 0; font-size:1rem; line-height:1.4; text-underline-offset:5px; }
.footer-format-links a:hover { color:var(--violet); }
@media(max-width:1000px) {
 .application-case,.application-campaign { grid-template-columns:1fr; gap:36px; }
 .application-copy { max-width:680px; }
 .application-image { margin-right:12px; }
 .application-campaign .application-copy { grid-row:1; }
 .application-campaign { margin-top:70px; padding-top:55px; }
 .starts-grid { gap:26px; }
}
@media(max-width:800px) {
 .service-more-heading,.service-grid,.starts-grid { grid-template-columns:1fr; }
 .service-more-heading { gap:18px; }
 .service-more { padding-top:48px; padding-bottom:56px; }
 .service-card { padding:28px; }
 .service-card h3 { font-size:2.15rem; }
 .service-card .deliverables { margin-top:18px; }
 .starts-grid { gap:36px; }
 .starts-grid h3 { max-width:450px; }
 .starts-grid p { max-width:600px; }
 .contact-prompts { margin-bottom:30px; }
}
@media(max-width:520px) {
 .service-card { padding:24px; }
 .service-card h3 { font-size:1.9rem; }
 .service-number { letter-spacing:.02em; }
 .application-copy h2 { font-size:2.5rem; }
 .application-copy .eyebrow { font-size:.8rem; }
 .application-campaign { margin-top:60px; padding-top:45px; }
 .footer-format-links { gap:12px 20px; }
}
@media(prefers-reduced-motion:reduce) {
 .application-image img,.application-campaign .application-image img { transform:none; transition:none; }
}

/* Bildbühne, versetzte Mockups und direkte Interaktion. */
[hidden] { display:none!important; }
html { scrollbar-gutter:stable; }
.site-header::after { content:""; position:absolute; left:0; right:0; bottom:-2px; height:3px; background:var(--violet); transform:scaleX(var(--page-progress,0)); transform-origin:left; pointer-events:none; }
.escape-hero { display:flex; flex-direction:column; min-height:680px; }
.escape-content { flex:1; padding-bottom:40px; }
.escape-controls { flex:none; }
.escape-scenes { transform:translateY(var(--hero-offset,0px)) scale(1.09); }
.format-playground { margin:40px 0 0; }
.format-stage { position:relative; isolation:isolate; background:var(--ink); box-shadow:12px 12px 0 var(--violet); transform:perspective(1100px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)); transition:transform .25s ease; }
.format-stage::before { content:""; position:absolute; inset:-12px 20px 20px -12px; background:var(--mint); z-index:-1; }
.format-slide { margin:0; background:var(--ink); color:var(--white); }
.format-slide:not([hidden]) { animation:format-enter .45s ease both; }
.format-slide img { display:block; width:100%; aspect-ratio:3/2; object-fit:cover; }
.format-slide figcaption { padding:18px 22px; font-size:.9rem; line-height:1.45; }
.format-slide figcaption>span { display:block; margin-bottom:5px; color:var(--mint); font-size:.8rem; font-weight:800; letter-spacing:.1em; }
.format-controls { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-top:30px; }
.format-controls button { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px; border:1px solid var(--line); background:var(--white); color:var(--ink); font-size:1rem; font-weight:700; }
.format-controls button[aria-selected="true"] { background:var(--ink); color:var(--mint); border-color:var(--ink); }
.format-controls button:hover { border-color:var(--violet); }
.format-controls button>span { transition:transform .25s; }
.format-controls button:hover>span { transform:translate(3px,-3px); }
@keyframes format-enter { from { opacity:.2; transform:translateY(8px); } to { opacity:1; transform:none; } }
.panel-digital { overflow:visible; }
.panel-digital .panel-label { justify-content:flex-start; align-self:start; position:sticky; top:112px; }
.digital-collage { position:relative; width:100%; aspect-ratio:1/1; margin-top:38px; }
.digital-primary { position:absolute; left:0; top:0; width:94%; transform:rotate(-3deg); box-shadow:10px 10px 0 var(--violet); }
.digital-secondary { position:absolute; right:0; bottom:0; width:80%; border:7px solid var(--paper); transform:rotate(5deg); box-shadow:0 14px 32px #21162435; }
.digital-collage img { display:block; width:100%; aspect-ratio:3/2; object-fit:cover; }
.collage-label { position:absolute; left:-8px; bottom:24%; padding:14px 18px; background:var(--ink); color:var(--mint); transform:rotate(-6deg); font-size:clamp(.9rem,1.3vw,1.3rem); line-height:1.2; letter-spacing:.06em; }
.digital-caption { margin:30px 0 0; font-size:.9rem; line-height:1.55; letter-spacing:0; font-weight:400; }
.service-grid { counter-reset:service-format 2; }
.service-card { position:relative; isolation:isolate; overflow:hidden; counter-increment:service-format; transition:transform .35s ease,box-shadow .35s ease; }
.service-card::before { content:"0" counter(service-format); position:absolute; top:0; right:14px; color:currentColor; opacity:.07; font-size:clamp(7rem,11vw,12rem); line-height:1; font-weight:800; letter-spacing:-.09em; z-index:-1; pointer-events:none; }
.service-card:nth-child(even) { margin-top:24px; margin-bottom:-24px; }
.service-card:hover,.motion-ready .service-card.is-visible:hover { transform:translateY(-6px); box-shadow:8px 8px 0 var(--violet); }
.showcase { position:relative; }
.showcase>.container { position:relative; z-index:1; }
.showcase::before { content:""; position:absolute; width:min(44vw,640px); height:min(44vw,640px); right:-14vw; top:38%; border:70px solid #c6ecd414; transform:rotate(25deg); pointer-events:none; }
.mockup-open { display:block; position:relative; width:100%; margin:0; padding:0; border:0; background:transparent; color:var(--white); line-height:0; cursor:zoom-in; }
.mockup-open>img { display:block; width:100%; }
.mockup-open::after { content:"Groß ansehen ↗"; position:absolute; right:16px; bottom:16px; padding:12px 16px; border:1px solid #ffffff60; background:#211624e8; color:var(--white); font-size:.875rem; font-weight:700; line-height:1.2; letter-spacing:0; opacity:0; transform:translateY(6px); transition:opacity .2s,transform .2s; pointer-events:none; }
.mockup-open:hover::after,.mockup-open:focus-visible::after { opacity:1; transform:none; }
.digital-collage .mockup-open::after { padding:8px 10px; font-size:.75rem; right:10px; bottom:10px; }
.stationery-stage .mockup-open>img { max-height:900px; object-fit:cover; }
.textile-visual .mockup-open { box-shadow:14px 14px 0 var(--violet); }
html.preview-open { overflow:hidden; }
.mockup-dialog { width:min(1320px,calc(100% - 32px)); max-height:calc(100dvh - 32px); padding:20px; border:1px solid #ffffff35; background:var(--ink); color:var(--white); }
.mockup-dialog::backdrop { background:#211624e8; backdrop-filter:blur(8px); }
.mockup-dialog[open] { display:flex; flex-direction:column; gap:16px; }
.mockup-dialog-bar { display:flex; align-items:center; justify-content:space-between; gap:24px; }
.mockup-dialog h2 { margin:0; font-size:1.65rem; letter-spacing:-.04em; }
.mockup-close { display:flex; align-items:center; gap:18px; padding:10px 14px; border:1px solid #ffffff70; background:transparent; color:var(--white); font-size:1rem; }
.mockup-close>span { color:var(--mint); font-size:1.5rem; }
.mockup-dialog>img { display:block; width:100%; max-height:calc(100dvh - 200px); min-height:0; object-fit:contain; }
.mockup-dialog>p { margin:0; font-size:.95rem; line-height:1.45; color:#e3dcea; }
@media(hover:none) {
 .mockup-open::after { opacity:1; transform:none; }
}
@media(max-width:800px) {
 .escape-hero { min-height:630px; }
 .escape-content { padding-bottom:30px; }
 .panel-digital .panel-label { position:static; }
 .digital-collage { max-width:570px; aspect-ratio:1.2/1; }
 .digital-primary { width:88%; }
 .digital-secondary { width:68%; }
 .service-card:nth-child(even) { margin-top:0; margin-bottom:0; }
 .format-playground { margin-right:12px; }
 .stationery-stage .mockup-open>img { min-height:370px; object-position:center; }
 .mockup-dialog>img { max-height:calc(100dvh - 230px); }
}
@media(max-width:520px) {
 .escape-hero { min-height:0; }
 .format-controls { gap:6px; }
 .format-controls button { padding:14px 10px; font-size:.95rem; }
 .format-slide figcaption { padding:16px; }
 .digital-secondary { border-width:5px; }
 .collage-label { font-size:.85rem; padding:12px; }
 .mockup-open::after { right:10px; bottom:10px; padding:9px 12px; font-size:.8rem; }
 .mockup-dialog { padding:14px; }
 .mockup-dialog-bar { gap:14px; }
 .mockup-dialog h2 { font-size:1.35rem; }
 .mockup-close { gap:10px; font-size:.9rem; }
}
@media(prefers-reduced-motion:reduce) {
 .format-stage,.escape-scenes { transform:none; }
 .format-stage,.format-slide,.service-card,.mockup-open::after,.format-controls button>span { animation:none!important; transition:none!important; }
 .service-card:hover,.motion-ready .service-card.is-visible:hover,.format-controls button:hover>span { transform:none; }
 .escape-scene { transition:none; }
}

/* Konkrete Festpreise mit anklickbaren, bebilderten Beispielseiten. */
.pricing { background:#eeebf3; }
.pricing-intro { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr); gap:6vw; align-items:end; margin-bottom:46px; }
.pricing h2 { margin:24px 0 0; font-size:clamp(2.6rem,4.8vw,5.2rem); line-height:1.02; }
.pricing h2 em { color:var(--violet); }
.pricing-intro>div>p:not(.eyebrow) { font-size:1.1rem; line-height:1.6; }
.pricing-intro .pricing-running-costs { margin-bottom:0; font-size:1rem; color:var(--plum); }
.price-list { display:grid; gap:36px; }
.price-case { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr); background:var(--white); border:1px solid var(--line); }
.price-visual { min-width:0; border-right:1px solid var(--line); background:var(--paper); }
.price-browser-bar { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:12px; padding:16px 22px; background:var(--ink); color:var(--white); font-size:.95rem; line-height:1.4; font-weight:700; }
.price-browser-bar>span:last-child { color:var(--mint); font-size:.8rem; letter-spacing:.08em; }
.price-visual iframe { display:block; width:100%; max-width:100%; border:0; background:white; }
.price-preview-bottom { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:14px 20px; padding:18px 22px; border-top:1px solid var(--line); }
.price-preview-bottom p { max-width:310px; margin:0; font-size:.95rem; line-height:1.45; }
.example-open { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:12px 16px; border:1px solid var(--ink); background:transparent; color:var(--ink); font-size:1rem; font-weight:700; line-height:1.4; text-decoration:none; }
.example-open:hover { background:var(--ink); color:var(--mint); }
.price-copy { padding:clamp(26px,3vw,44px); min-width:0; }
.price-copy .eyebrow { font-size:.875rem; letter-spacing:.06em; }
.price-copy h3 { font-size:clamp(1.9rem,2.6vw,2.8rem); line-height:1.1; letter-spacing:-.045em; margin:18px 0 24px; }
.fixed-price { margin-bottom:24px; }
.fixed-price>strong { display:block; color:var(--violet); font-size:clamp(3rem,4.3vw,4.8rem); line-height:1.05; letter-spacing:-.045em; }
.fixed-price>span { display:block; margin-top:8px; font-size:.95rem; line-height:1.4; }
.price-pages { font-size:1rem; line-height:1.65; }
.price-features { padding-left:19px; margin:24px 0; font-size:1rem; line-height:1.55; }
.price-features li { padding:6px 0; }
.price-scope-link { font-size:.95rem; line-height:1.5; color:var(--plum); margin-bottom:24px; }
.price-request { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:14px 20px; background:var(--ink); color:white; text-decoration:none; font-size:1rem; font-weight:700; line-height:1.4; }
.price-request:hover { background:var(--violet); }
.price-included { display:grid; grid-template-columns:minmax(0,.65fr) minmax(0,1.35fr); gap:5vw; padding:44px; margin-top:40px; background:var(--mint); }
.price-included-heading h3 { font-size:clamp(1.8rem,2.8vw,2.7rem); line-height:1.15; letter-spacing:-.045em; margin:20px 0 0; }
.price-included ul { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:26px 30px; margin:0; padding:0; list-style:none; }
.price-included li { border-top:1px solid #275d4750; padding-top:16px; font-size:1rem; line-height:1.55; }
.price-included li>strong,.price-included li>span { display:block; }
.price-included li>strong { margin-bottom:8px; }
.price-final-note { max-width:1080px; margin:24px 0 0; font-size:1rem; line-height:1.6; }
.example-dialog { width:min(1240px,calc(100% - 32px)); height:calc(100dvh - 32px); max-height:calc(100dvh - 32px); padding:16px; border:1px solid #ffffff40; background:var(--ink); color:var(--white); }
.example-dialog::backdrop { background:#211624e8; backdrop-filter:blur(8px); }
.example-dialog[open] { display:flex; flex-direction:column; gap:16px; }
.example-dialog-bar { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:20px; align-items:start; }
.example-dialog-bar h2 { margin:0; font-size:1.5rem; letter-spacing:-.035em; line-height:1.2; }
.example-dialog-bar p { margin:8px 0 0; color:var(--mint); font-size:.95rem; line-height:1.4; }
.example-close { display:flex; align-items:center; gap:14px; min-height:44px; padding:10px 14px; border:1px solid #ffffff70; background:transparent; color:white; font-size:1rem; }
.example-close>span { font-size:1.5rem; color:var(--mint); }
.example-dialog iframe { flex:1; min-height:0; width:100%; border:0; background:white; }

/* Geräteanpassung für die gesamte Seite, einschließlich kurzer Querformate. */
:root { --header-height:88px; }
body { min-width:0; }
h1,h2,h3,h4 { overflow-wrap:anywhere; }
.container>* { min-width:0; }
.panel-details,.panel-details>div,.panel-copy,.thought-copy,.contact-copy,.project-card { min-width:0; }
.contact-link { min-width:0; overflow-wrap:anywhere; }
.nav a,.scene-selector button,.menu-toggle,.format-controls button { min-height:44px; }
.mockup-dialog { overflow-y:auto; }
.mockup-dialog-bar { min-width:0; }
.mockup-dialog-bar h2 { min-width:0; }
.mockup-close { flex-shrink:0; min-height:44px; }
@media(max-width:1100px) {
 .price-case { grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); }
 .price-copy { padding:28px; }
 .price-included { grid-template-columns:1fr; gap:30px; padding:36px; }
}
@media(max-width:1000px) {
 .menu-toggle { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; width:48px; height:48px; border:1px solid var(--ink); background:transparent; flex-shrink:0; }
 .menu-toggle span { display:block; width:22px; height:2px; background:var(--ink); }
 .nav { display:none; position:absolute; top:calc(var(--header-height) - 1px); left:0; right:0; flex-direction:column; align-items:stretch; gap:0; padding:18px 24px 24px; border-bottom:1px solid var(--line); background:var(--paper); box-shadow:0 16px 20px #21162415; max-height:calc(100dvh - var(--header-height)); overflow-y:auto; overscroll-behavior:contain; }
 .nav.is-open { display:flex; }
 .nav a { padding:13px 5px; font-size:1rem; flex-shrink:0; }
 .nav .nav-contact { margin-top:8px; padding:14px; text-align:center; }
 .pricing-intro,.price-case { grid-template-columns:1fr; gap:0; }
 .pricing-intro { gap:28px; }
 .price-visual { border-right:0; border-bottom:1px solid var(--line); }
 .price-copy { padding:32px; }
 .fixed-price>strong { font-size:3.5rem; }
}
@media(max-width:800px) {
 :root { --header-height:76px; }
 .price-included { padding:28px; }
 .price-included ul { grid-template-columns:1fr; }
 .pricing h2 { font-size:clamp(2.6rem,7vw,4rem); }
 .stationery-heading,.textile-intro,.showcase-intro { min-width:0; }
}
@media(max-width:520px) {
 .price-copy { padding:24px; }
 .price-copy h3 { font-size:2rem; }
 .fixed-price>strong { font-size:3.25rem; }
 .price-browser-bar,.price-preview-bottom { padding-inline:16px; }
 .price-preview-bottom { flex-direction:column; align-items:stretch; }
 .price-preview-bottom p { max-width:none; }
 .price-included { padding:24px; }
 .example-dialog { width:calc(100% - 16px); height:calc(100dvh - 16px); max-height:calc(100dvh - 16px); padding:12px; gap:12px; }
 .example-dialog-bar { gap:12px; }
 .example-dialog-bar h2 { font-size:1.25rem; }
 .example-close { padding:8px 10px; gap:8px; font-size:.95rem; }
}
@media(max-width:380px) {
 .thought h2,.work-intro h2,.showcase h2,.handoff h2,.stationery h2,.textile h2,.application-copy h2,.starts-heading h2,.questions h2,.contact h2,.pricing h2 { font-size:2.3rem; }
 .panel-copy h3 { font-size:2.25rem; }
 .format-controls { grid-template-columns:1fr; gap:6px; }
 .format-controls button { padding:12px 14px; }
 .footer-main { grid-template-columns:1fr; gap:20px; }
 .footer-main a:last-child { grid-column:1; grid-row:auto; }
 .contact-link { gap:12px; font-size:1.25rem; }
 .price-copy { padding:20px; }
}
@media(max-height:520px) and (orientation:landscape) {
 :root { --header-height:64px; }
 html { scroll-padding-top:74px; }
 .header-inner { min-height:64px; }
 .brand img { width:185px; }
 .escape-hero { min-height:0; }
 .escape-content { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:16px 28px; align-items:end; padding-top:28px; padding-bottom:24px; }
 .escape-content>.eyebrow { grid-column:1/-1; }
 .escape-content h1 { margin:0; font-size:clamp(2rem,4.7vw,3rem); line-height:1.05; }
 .escape-lead { margin:0; font-size:1rem; line-height:1.5; }
 .escape-controls { padding:14px 0 18px; flex-direction:row; }
 .escape-note { display:none; }
 .section-pad { padding-block:54px; }
 .panel-digital .panel-label { position:static; }
 .mockup-dialog { width:min(1100px,calc(100% - 24px)); max-height:calc(100dvh - 16px); padding:12px; }
 .mockup-dialog[open] { gap:12px; }
 .mockup-dialog>img { max-height:calc(100dvh - 130px); }
 .mockup-dialog-bar h2 { font-size:1.3rem; }
 .mockup-dialog>p { font-size:.875rem; }
 .example-dialog { height:calc(100dvh - 16px); max-height:calc(100dvh - 16px); padding:12px; }
}
@media(max-width:560px) and (max-height:520px) and (orientation:landscape) {
 .escape-content { grid-template-columns:1fr; }
 .escape-content h1 { font-size:2.1rem; }
}

/* Oktober-Aktionen, echte Unterseiten und sichtbar bedienbare Beispiele. */
.nav a[aria-current="page"] { color:var(--violet); text-decoration:underline; text-underline-offset:7px; }
.nav { gap:clamp(18px,2.5vw,36px); }
.october { background:var(--mint); }
.october-heading { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr); gap:6vw; align-items:end; margin-bottom:36px; }
.october .eyebrow { color:var(--green); font-size:.875rem; letter-spacing:.08em; }
.october h2 { margin:20px 0 0; font-size:clamp(2.8rem,4.8vw,5.2rem); line-height:1.02; }
.october h2 em { color:var(--green); }
.october-heading p:not(.eyebrow) { margin:20px 0 0; font-size:1.1rem; line-height:1.55; }
.offer-date { display:inline-block; padding:10px 14px; background:var(--ink); color:white; font-size:1rem; font-weight:700; line-height:1.4; }
.october-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.october-card { display:flex; flex-direction:column; min-width:0; background:white; border:1px solid #275d4740; }
.october-card>img { display:block; width:100%; aspect-ratio:16/7; object-fit:cover; }
.october-card-copy { display:flex; flex-direction:column; flex:1; align-items:flex-start; padding:clamp(22px,2.2vw,34px); }
.october-card h3 { margin:20px 0 22px; font-size:clamp(1.8rem,2.5vw,2.5rem); letter-spacing:-.05em; line-height:1.1; }
.october-price { margin-bottom:22px; }
.october-price strong { display:block; color:var(--violet); font-size:clamp(3.25rem,4vw,4.75rem); line-height:1; letter-spacing:-.06em; }
.october-price span { display:block; font-size:.95rem; margin-top:10px; line-height:1.4; }
.october-card-copy>p:not(.eyebrow,.october-price) { font-size:1rem; line-height:1.55; }
.october-scope { font-weight:700; }
.october-card-actions { display:flex; flex-direction:column; align-items:stretch; gap:12px; width:100%; padding-top:12px; margin-top:auto; }
.offer-detail,.offer-request { display:flex; align-items:center; justify-content:center; min-height:48px; padding:12px; font-size:1rem; font-weight:700; text-align:center; line-height:1.35; text-decoration:none; }
.offer-detail { border:1px solid currentColor; }
.offer-detail:hover { background:var(--mint); color:var(--ink); }
.offer-request { background:var(--ink); color:white; }
.offer-request:hover { background:var(--violet); }
.october-card:nth-child(2) { background:var(--violet); color:white; border-color:var(--violet); }
.october-card:nth-child(2) .eyebrow,.october-card:nth-child(2) .october-price strong { color:var(--mint); }
.october-card:nth-child(2) .offer-request { background:var(--mint); color:var(--ink); }
.october-card:nth-child(2) .offer-request:hover { background:white; }
.offer-terms { max-width:1160px; margin:24px 0 0; font-size:1rem; line-height:1.6; }
.price-offer-label { display:inline-block; padding:9px 12px; margin:0 0 18px; background:var(--mint); color:var(--green); font-size:.95rem; font-weight:700; line-height:1.4; }
.example-interactive-hint { display:flex; flex-wrap:wrap; gap:8px 16px; padding:18px 22px 12px; background:var(--mint); color:var(--ink); font-size:1rem; line-height:1.4; }
.example-interactive-hint strong { padding:6px 10px; background:var(--green); color:white; }
.example-interactive-hint span { align-self:center; }
.example-page-nav { display:flex; flex-wrap:wrap; gap:9px; padding:8px 22px 16px; background:var(--mint); }
.example-page-link { display:inline-flex; align-items:center; justify-content:center; min-height:46px; padding:11px 14px; border:1px solid #275d4770; background:white; color:var(--ink); font-size:1rem; font-weight:700; line-height:1.35; text-decoration:none; }
.example-page-link:hover { border-color:var(--violet); box-shadow:0 3px 0 var(--violet); }
.example-page-link[aria-current="page"] { background:var(--violet); border-color:var(--violet); color:white; }
.example-preview-status { padding:10px 22px; margin:0; background:#f1f8f3; font-size:.95rem; font-weight:700; line-height:1.4; border-bottom:1px solid var(--line); }
.price-preview-bottom .example-open { background:var(--violet); border-color:var(--violet); color:white; }
.price-preview-bottom .example-open:hover { background:var(--ink); border-color:var(--ink); }
.content-heading { max-width:950px; margin-bottom:42px; }
.content-heading h2,.related-topic h2,.seo-example h2 { margin:22px 0; font-size:clamp(2.6rem,4.5vw,5rem); line-height:1.03; }
.content-heading h2 em,.related-topic h2 em,.seo-example h2 em { color:var(--violet); }
.content-heading>p:not(.eyebrow) { max-width:780px; margin-bottom:0; font-size:1.1rem; line-height:1.65; }
.work-overview,.process-detail { background:white; }
.overview-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.overview-grid article { display:flex; flex-direction:column; align-items:flex-start; min-width:0; padding:32px; background:var(--paper); border-top:5px solid var(--violet); }
.overview-grid article:nth-child(2) { background:var(--mint); border-color:var(--green); }
.overview-grid article:nth-child(3) { background:var(--ink); color:white; border-color:var(--mint); }
.overview-grid article>span,.seo-grid article>span { font-size:.875rem; font-weight:700; letter-spacing:.08em; line-height:1.4; }
.overview-grid h3 { margin:24px 0 18px; font-size:clamp(1.8rem,2.4vw,2.6rem); line-height:1.1; }
.overview-grid p { font-size:1.05rem; line-height:1.6; }
.overview-grid a { display:inline-flex; align-items:center; min-height:44px; margin-top:auto; font-weight:700; text-underline-offset:6px; font-size:1rem; line-height:1.4; }
.showcase-more { display:flex; justify-content:space-between; align-items:center; gap:32px; padding-top:40px; margin-top:36px; border-top:1px solid #ffffff40; }
.showcase-more p { max-width:680px; margin:0; font-size:1.1rem; line-height:1.6; }
.subpage-hero { background:#eae4f6; }
.subpage-hero-grid { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:6vw; align-items:center; }
.subpage-hero-grid:not(:has(.subpage-visual)) { grid-template-columns:1fr; }
.subpage-hero h1 { margin:22px 0 26px; max-width:950px; font-size:clamp(3rem,5.6vw,6rem); line-height:1.03; }
.subpage-hero h1 em { color:var(--violet); }
.subpage-lead { max-width:780px; margin-bottom:0; font-size:clamp(1.1rem,1.45vw,1.3rem); line-height:1.65; }
.subpage-visual { min-width:0; margin:0 12px 12px 0; }
.subpage-visual img { display:block; width:100%; box-shadow:12px 12px 0 var(--violet); }
.subpage-visual figcaption { margin-top:24px; font-size:.95rem; line-height:1.4; }
.page-jump-links { display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
.page-jump-links a { display:inline-flex; align-items:center; justify-content:center; min-height:46px; padding:11px 16px; border:1px solid currentColor; font-size:1rem; font-weight:700; line-height:1.35; text-decoration:none; }
.page-jump-links a:hover { background:var(--ink); color:white; border-color:var(--ink); }
.subpage-hero-dark { background:var(--ink); color:white; }
.subpage-hero-green { background:var(--green); color:white; }
.subpage-hero-dark h1 em,.subpage-hero-green h1 em { color:var(--mint); }
.subpage-hero-dark .page-jump-links a:hover,.subpage-hero-green .page-jump-links a:hover { background:var(--mint); color:var(--ink); border-color:var(--mint); }
.subpage-hero-dark :focus-visible,.subpage-hero-green :focus-visible { outline-color:var(--mint); }
.related-topic { background:var(--paper); }
.related-topic-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; gap:6vw; }
.related-topic-grid>div { min-width:0; }
.related-topic-grid p:not(.eyebrow) { font-size:1.1rem; line-height:1.65; }
.text-link { display:block; margin-top:22px; font-size:1rem; line-height:1.5; text-underline-offset:5px; }
.legal-service { background:white; }
.legal-service-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:40px; }
.legal-service-grid h3,.legal-notice h3 { font-size:1.7rem; line-height:1.2; letter-spacing:-.035em; }
.plain-list { padding-left:22px; margin:0; font-size:1.05rem; line-height:1.65; }
.plain-list li { padding:7px 0; }
.legal-notice { padding:28px 32px; margin-top:34px; border-left:5px solid var(--green); background:#e8f4ec; }
.legal-notice p { max-width:1120px; font-size:1rem; line-height:1.65; }
.legal-notice p:last-child { margin-bottom:0; }
.legal-notice a { display:inline-flex; align-items:center; min-height:44px; font-size:1rem; font-weight:700; line-height:1.4; text-underline-offset:5px; }
.seo-explainer { background:white; }
.seo-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:26px; }
.seo-grid article { padding:32px; background:var(--paper); border-top:4px solid var(--violet); }
.seo-grid h3 { margin:22px 0 18px; font-size:clamp(1.7rem,2.6vw,2.5rem); line-height:1.12; }
.seo-grid p { margin-bottom:0; font-size:1.05rem; line-height:1.65; }
.seo-example { background:var(--mint); }
.search-preview { padding:32px; border:1px solid #275d4750; background:white; }
.search-preview-label { display:block; margin-bottom:26px; color:var(--green); font-size:.95rem; font-weight:700; line-height:1.4; }
.search-preview .search-site { margin-bottom:5px; font-size:1rem; font-weight:700; }
.search-preview .search-url { margin-bottom:20px; font-size:.95rem; }
.search-preview h3 { font-size:1.5rem; line-height:1.35; letter-spacing:-.02em; color:var(--violet); }
.search-preview p { font-size:1rem; line-height:1.6; }
.search-preview small { font-size:.95rem; line-height:1.4; }
.seo-package { background:var(--ink); color:white; }
.seo-package-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:6vw; }
.seo-package h2 { margin:24px 0; font-size:clamp(2.6rem,4.5vw,5rem); line-height:1.04; }
.seo-package .eyebrow,.seo-package h2 em { color:var(--mint); }
.seo-package h3 { font-size:1.75rem; letter-spacing:-.035em; line-height:1.2; }
.seo-package p { font-size:1.05rem; line-height:1.65; }
.seo-fixed-price strong { display:block; color:var(--mint); font-size:5rem; line-height:1.1; letter-spacing:-.05em; }
.seo-fixed-price span { display:block; margin-top:12px; font-size:1rem; line-height:1.4; }
.seo-package-note { padding-top:24px; margin-top:24px; border-top:1px solid #ffffff40; }
.source-note { margin-top:34px; margin-bottom:0; font-size:1rem; line-height:1.5; }
@media(max-width:1100px) {
 .october-card-copy,.overview-grid article { padding:24px; }
}
@media(max-width:900px) {
 .october-heading,.subpage-hero-grid,.related-topic-grid,.seo-package-grid { grid-template-columns:1fr; gap:32px; }
 .october-grid,.overview-grid { grid-template-columns:1fr; }
 .october-card { display:grid; grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr); }
 .october-card>img { height:100%; aspect-ratio:auto; min-height:220px; }
 .october-card-copy { padding:28px; }
 .october-card h3 { margin-top:16px; }
 .subpage-visual { max-width:650px; }
 .legal-service-grid { grid-template-columns:1fr; gap:28px; }
 .showcase-more { flex-direction:column; align-items:flex-start; }
}
@media(max-width:620px) {
 .october-card { display:flex; }
 .october-card>img { height:auto; aspect-ratio:16/6; min-height:0; }
 .october-card-copy { padding:24px; }
 .october h2,.content-heading h2,.related-topic h2,.seo-example h2,.seo-package h2 { font-size:clamp(2.5rem,8vw,3.5rem); }
 .subpage-hero h1 { font-size:clamp(2.7rem,9vw,3.8rem); }
 .seo-grid { grid-template-columns:1fr; }
 .seo-grid article,.search-preview { padding:24px; }
 .example-interactive-hint { padding:16px 16px 12px; }
 .example-page-nav { padding:8px 16px 14px; }
 .example-page-link { flex:1 1 auto; }
 .example-preview-status { padding-inline:16px; }
 .legal-notice { padding:24px; }
 .seo-fixed-price strong { font-size:4rem; }
}
@media(max-height:520px) and (orientation:landscape) {
 .subpage-hero h1 { font-size:clamp(2.5rem,4.8vw,3.5rem); }
 .october-card>img { aspect-ratio:16/6; }
}

/* Gleich hohe Hero-Szenen und eine nahtlose, doppelte Laufbandgruppe. */
.escape-hero { height:clamp(600px,calc(100svh - var(--header-height)),760px); min-height:0; display:flex; flex-direction:column; justify-content:space-between; }
.escape-content { width:min(100% - 64px,1440px); padding-top:clamp(48px,5vw,76px); padding-bottom:24px; }
.escape-content h1 { margin:22px 0 24px; font-size:clamp(3rem,5.5vw,5.6rem); line-height:1.03; }
.escape-content h1 #escape-place,.escape-content h1 em { display:block; }
.escape-controls { padding-block:20px 24px; }
.escape-scene { width:100%; height:100%; object-fit:cover; transition:opacity .65s ease; }
.ribbon-track { display:flex; width:max-content; padding:0; word-spacing:normal; white-space:normal; animation:ribbon-seamless 24s linear infinite; will-change:transform; }
.ribbon-set { display:flex; flex:0 0 auto; align-items:center; justify-content:space-around; min-width:100vw; gap:clamp(24px,2.5vw,40px); padding:16px 24px; }
.ribbon-set span,.ribbon-set b { flex-shrink:0; white-space:nowrap; }
.ribbon-set b { margin:0; }
@keyframes ribbon-seamless { to { transform:translate3d(-50%,0,0); } }
.regular-price { display:block; margin-bottom:14px; font-size:1rem; line-height:1.4; font-weight:400; }
.regular-price del { margin-left:8px; font-size:1.35rem; font-weight:700; text-decoration-thickness:2px; }
.october-price>.regular-price { margin-top:0; }
.fixed-price>.regular-price { font-size:1rem; margin-bottom:16px; }
.price-copy { display:flex; flex-direction:column; align-items:flex-start; }
.price-individual { width:100%; margin-top:28px; padding:24px 20px; background:#f0ebf8; }
.price-individual h4 { margin:0 0 14px; font-size:1.35rem; line-height:1.3; letter-spacing:-.03em; }
.price-individual ul { margin:0; padding-left:18px; font-size:1rem; line-height:1.6; }
.price-individual li { padding:5px 0; }
.price-individual p { margin:16px 0 0; font-size:.95rem; line-height:1.6; }
.price-guarantee { margin:24px 0 0; padding-top:20px; border-top:1px solid var(--line); font-size:1rem; line-height:1.6; }
.small-services { background:var(--mint); }
.home-contact { background:var(--mint); }
.home-contact-grid { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:40px; align-items:center; }
.home-contact h2 { max-width:900px; margin:24px 0; font-size:clamp(2.8rem,4.5vw,5rem); line-height:1.04; }
.home-contact h2 em { color:var(--green); }
.home-contact p:not(.eyebrow) { max-width:650px; margin-bottom:0; font-size:1.1rem; line-height:1.6; }
.footer-service { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:32px; align-items:center; padding:30px; margin-bottom:28px; background:var(--mint); }
.footer-service h2 { margin:16px 0; font-size:2rem; letter-spacing:-.035em; line-height:1.2; }
.footer-service p:not(.eyebrow) { max-width:780px; margin:0; font-size:1rem; line-height:1.6; }
.footer-legal-links { display:flex; flex-wrap:wrap; gap:20px 28px; margin-bottom:24px; }
.footer-legal-links a { display:inline-flex; align-items:center; min-height:44px; font-size:1rem; font-weight:700; text-underline-offset:5px; }
.legal-page { background:white; }
.legal-page-copy { max-width:1000px; }
.legal-page h1 { margin:24px 0 44px; font-size:clamp(2.8rem,5vw,5.3rem); line-height:1.06; }
.legal-page h2 { margin:32px 0 16px; font-size:1.65rem; letter-spacing:-.035em; line-height:1.3; }
.legal-page p { font-size:1.05rem; line-height:1.7; }
.legal-draft-note { padding:24px; background:#eeebf3; border-left:4px solid var(--violet); }
.legal-draft-note p { margin:14px 0 0; }
@media(max-width:900px) {
 .home-contact-grid,.footer-service { grid-template-columns:1fr; gap:24px; }
 .home-contact-grid>.price-request,.footer-service>.example-open { justify-self:start; }
}
@media(max-width:800px) {
 .escape-content { width:min(100% - 40px,680px); }
 .escape-content h1 { font-size:clamp(2.9rem,6.8vw,4.7rem); }
 .escape-hero { height:620px; }
}
@media(max-width:520px) {
 .escape-content { width:calc(100% - 32px); padding-top:44px; }
 .escape-content h1 { font-size:clamp(2.6rem,8.7vw,3.4rem); }
 .escape-lead { font-size:1.05rem; }
 .escape-hero { height:580px; }
 .escape-note { font-size:.875rem; line-height:1.5; letter-spacing:.03em; }
 .footer-service { padding:24px; }
 .footer-service h2 { font-size:1.7rem; }
 .home-contact h2 { font-size:clamp(2.5rem,8vw,3.5rem); }
}
@media(max-height:520px) and (orientation:landscape) {
 .escape-hero { height:calc(100svh - var(--header-height)); min-height:270px; }
 .escape-content { padding-top:24px; padding-bottom:20px; }
 .escape-content h1 { margin:0; font-size:clamp(1.75rem,3.5vw,2.7rem); line-height:1.04; }
 .escape-controls { display:none; }
}
@media(prefers-reduced-motion:reduce) {
 .ribbon-track { animation:none; width:100%; }
 .ribbon-set { min-width:0; width:100%; flex-wrap:wrap; justify-content:center; gap:16px 24px; }
 .ribbon-set:nth-child(2) { display:none; }
}

/* Ruhigere Angebote und eine ausgeglichene Startseite. */
.homepage .october { background:#f1eff4; }
.homepage .october h2 em { color:var(--plum); }
.homepage .october-card,.homepage .october-card:nth-child(2) { background:var(--white); color:var(--ink); border-color:var(--line); }
.homepage .october-card .eyebrow,.homepage .october-card:nth-child(2) .eyebrow { color:var(--plum); }
.homepage .october-price strong,.homepage .october-card:nth-child(2) .october-price strong { color:var(--ink); }
.homepage .october-card .offer-request,.homepage .october-card:nth-child(2) .offer-request { background:var(--ink); color:var(--white); }
.homepage .october-card .offer-request:hover,.homepage .october-card:nth-child(2) .offer-request:hover { background:var(--plum); color:var(--white); }
.homepage .thought-grid { align-items:start; gap:clamp(36px,5vw,72px); }
.homepage .thought-grid>.format-playground { margin-top:0; }
.homepage .thought-copy h2 { margin:22px 0 28px; font-size:clamp(2.8rem,4.3vw,5.1rem); line-height:1.02; }
.homepage .home-legal { padding:0 0 clamp(48px,5vw,72px); background:var(--paper); }
.homepage .home-legal .footer-service { margin-bottom:0; }
@media(max-width:800px) {
 .homepage .thought-copy { grid-row:1; }
 .homepage .thought-copy h2 { font-size:clamp(2.6rem,7vw,4rem); }
.homepage .thought-grid>.format-playground { margin-top:0; }
}

/* Der Rechtsseiten-Hinweis gehört zur Angebotsfläche. */
.homepage .october { padding-bottom:30px; }
.homepage .home-legal { padding:0 0 clamp(64px,6vw,88px); background:#f1eff4; }
.home-legal-row { display:grid; grid-template-columns:minmax(180px,.65fr) minmax(0,1.35fr) auto; align-items:center; gap:clamp(24px,3.5vw,48px); padding-top:26px; border-top:1px solid #ccc4d3; }
.home-legal-row h2 { margin:0; font-size:clamp(1.4rem,1.8vw,1.7rem); line-height:1.15; letter-spacing:-.035em; color:var(--plum); }
.home-legal-copy { min-width:0; }
.home-legal-copy p { margin:0; font-size:1rem; line-height:1.6; }
.home-legal-copy .home-legal-note { margin-top:8px; font-size:.875rem; line-height:1.55; color:var(--plum); }
.home-legal-link { display:inline-flex; align-items:center; min-height:44px; padding:10px 0; border-bottom:1px solid var(--ink); color:var(--ink); font-size:1rem; line-height:1.3; font-weight:700; text-decoration:none; white-space:nowrap; }
.home-legal-link:hover,.home-legal-link:focus-visible { color:var(--violet); border-color:var(--violet); }
@media(max-width:1100px) {
 .home-legal-row { grid-template-columns:minmax(180px,.6fr) minmax(0,1.4fr); gap:18px 32px; }
 .home-legal-row>.home-legal-link { grid-column:2; justify-self:start; }
}
@media(max-width:700px) {
 .home-legal-row { grid-template-columns:1fr; align-items:start; gap:16px; padding-top:24px; }
 .home-legal-row h2 { font-size:1.55rem; }
 .home-legal-row h2 br { display:none; }
 .home-legal-row>.home-legal-link { grid-column:auto; justify-self:start; }
}

/* Preisvorteile und die einzelnen Festpreis-Beispiele klar erkennen. */
.regular-price del { display:inline-block; padding-block:2px 4px; color:var(--violet); font-size:clamp(1.45rem,2vw,1.7rem); font-weight:800; text-decoration-color:var(--plum); text-decoration-thickness:3px; text-decoration-skip-ink:none; }
.price-list { gap:clamp(48px,5vw,72px); }
.price-case { border:1px solid #c6bccf; box-shadow:0 10px 24px #2116240b; }
.price-case::before { grid-column:1/-1; padding:18px 24px; border-left:6px solid var(--violet); background:var(--ink); color:var(--white); font-size:clamp(1.05rem,1.4vw,1.25rem); font-weight:700; line-height:1.4; letter-spacing:.01em; }
#preis-kompakt::before { content:"01 / Klarer Einstieg"; }
#preis-portfolio::before { content:"02 / Portfolio mit Galerie"; }
#preis-leistungen::before { content:"03 / Dein Angebot im Überblick"; }
#preis-studio::before { content:"04 / Studio mit Kursübersicht"; }
#preis-shop::before { content:"05 / Kleiner Shop, klarer Start"; }
.price-case .price-browser-bar { border-bottom:1px solid var(--line); background:#f1eff4; color:var(--ink); }
.price-case .price-browser-bar>span:last-child { color:var(--plum); font-size:.875rem; }
@media(max-width:520px) {
 .price-case::before { padding:16px; }
}

.home-small-tasks { padding-block:clamp(48px,5vw,72px); background:var(--white); }
.home-small-grid { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.65fr); align-items:start; gap:clamp(36px,5vw,72px); }
.home-small-grid h2 { margin:20px 0 22px; font-size:clamp(2.2rem,3vw,3.3rem); line-height:1.04; letter-spacing:-.05em; }
.home-small-grid h2 em { color:var(--violet); }
.home-small-grid>div>p:not(.eyebrow) { margin:0; max-width:460px; font-size:1.05rem; line-height:1.6; }
.home-task-links { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.home-task-links>a { display:flex; flex-direction:column; align-items:flex-start; min-width:0; padding-top:24px; border-top:3px solid var(--plum); text-decoration:none; }
.home-task-links h3 { margin:0 0 14px; font-size:1.4rem; line-height:1.25; letter-spacing:-.035em; }
.home-task-links p { margin:0 0 18px; font-size:1rem; line-height:1.6; }
.home-task-links span { display:inline-flex; align-items:center; min-height:44px; margin-top:auto; font-size:.95rem; line-height:1.4; font-weight:700; text-decoration:underline; text-underline-offset:5px; }
.home-task-links>a:hover,.home-task-links>a:focus-visible { color:var(--violet); border-color:var(--violet); }
@media(max-width:900px) {
 .home-small-grid { grid-template-columns:1fr; gap:30px; }
}
@media(max-width:620px) {
 .home-task-links { grid-template-columns:1fr; gap:26px; }
 .home-task-links>a { padding-top:18px; }
 .home-task-links h3 { margin-bottom:10px; }
 .home-task-links p { margin-bottom:8px; }
}

/* Gleicher Hero-Rahmen auf allen sechs Informations- und Angebotsseiten. */
.subpage-hero-unified {
 --subpage-hero-height:640px;
 block-size:var(--subpage-hero-height);
 padding-block:48px;
 background:#ede8f4;
 color:var(--ink);
}
.subpage-hero-unified .subpage-hero-grid { block-size:100%; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:clamp(28px,4vw,64px); align-items:center; }
.subpage-hero-copy { min-width:0; }
.subpage-hero-unified .eyebrow { color:var(--plum); }
.subpage-hero-unified h1 { margin:18px 0 24px; font-size:clamp(2.7rem,4.3vw,4.4rem); line-height:1.05; }
.subpage-hero-unified h1 em { color:var(--violet); }
.subpage-hero-unified .subpage-lead { max-width:700px; font-size:clamp(1.05rem,1.35vw,1.2rem); line-height:1.6; }
.subpage-hero-unified .page-jump-links { gap:10px; margin-top:28px; }
.subpage-hero-unified .page-jump-links a { min-height:44px; padding:10px 15px; font-size:.95rem; border-color:var(--plum); background:transparent; color:var(--ink); }
.subpage-hero-unified .page-jump-links a:first-child { background:var(--plum); color:var(--white); }
.subpage-hero-unified .page-jump-links a:hover { background:var(--ink); border-color:var(--ink); color:var(--white); }
.subpage-hero-unified .subpage-visual { width:100%; max-width:580px; min-width:0; justify-self:end; margin:0 10px 10px 0; }
.subpage-hero-unified .subpage-visual img { display:block; width:100%; height:auto; aspect-ratio:3/2; object-fit:cover; box-shadow:10px 10px 0 var(--violet); }
.subpage-hero-unified .subpage-visual figcaption { margin-top:20px; color:var(--plum); font-size:.875rem; line-height:1.45; }
@media(max-width:1100px) {
 .subpage-hero-unified { --subpage-hero-height:640px; padding-block:40px; }
 .subpage-hero-unified .subpage-hero-grid { grid-template-columns:minmax(0,1.18fr) minmax(0,.82fr); gap:28px; }
 .subpage-hero-unified h1 { font-size:clamp(2.35rem,4.2vw,3.4rem); }
 .subpage-hero-unified .subpage-lead { font-size:1.05rem; line-height:1.55; }
}
@media(max-width:760px) {
 .subpage-hero-unified { --subpage-hero-height:760px; padding-block:32px; }
 .subpage-hero-unified .subpage-hero-grid { width:min(100% - 36px,1440px); grid-template-columns:1fr; grid-template-rows:minmax(0,1fr) 244px; gap:24px; }
 .subpage-hero-unified h1 { margin:18px 0 20px; font-size:clamp(2.2rem,7.1vw,3.1rem); }
 .subpage-hero-unified .page-jump-links { margin-top:22px; gap:8px; }
 .subpage-hero-unified .page-jump-links a { padding:9px 12px; font-size:.925rem; }
 .subpage-hero-unified .subpage-visual { align-self:start; justify-self:start; width:min(100% - 8px,360px); margin:0 8px 8px 0; }
 .subpage-hero-unified .subpage-visual img { block-size:210px; object-fit:contain; background:#e7e0f0; box-shadow:8px 8px 0 var(--violet); }
 .subpage-hero-unified .subpage-visual figcaption { margin-top:14px; font-size:.8125rem; }
}
@media(max-width:480px) {
 .subpage-hero-unified { --subpage-hero-height:820px; }
}
@media(max-width:360px) {
 .subpage-hero-unified { --subpage-hero-height:880px; }
 .subpage-hero-unified h1 { font-size:2.1rem; }
}
@media(min-width:620px) and (max-height:520px) and (orientation:landscape) {
 .subpage-hero-unified { --subpage-hero-height:640px; padding-block:28px; }
 .subpage-hero-unified .subpage-hero-grid { grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr); grid-template-rows:1fr; gap:24px; }
 .subpage-hero-unified h1 { margin:16px 0 20px; font-size:clamp(2.1rem,4vw,3rem); }
 .subpage-hero-unified .subpage-lead { font-size:1rem; line-height:1.5; }
 .subpage-hero-unified .page-jump-links { margin-top:22px; gap:8px; }
 .subpage-hero-unified .page-jump-links a { padding:9px 12px; font-size:.925rem; }
 .subpage-hero-unified .subpage-visual { align-self:center; justify-self:end; width:100%; margin:0 8px 8px 0; }
 .subpage-hero-unified .subpage-visual img { block-size:auto; object-fit:cover; }
}

/* Festpreise: ein klarer Farbwechsel zwischen Hero und Preisbeispielen. */
.page-festpreise .subpage-hero-unified { background:var(--plum); color:var(--paper); }
.page-festpreise .subpage-hero-unified .eyebrow,
.page-festpreise .subpage-hero-unified h1 em,
.page-festpreise .subpage-hero-unified .subpage-visual figcaption { color:var(--mint); }
.page-festpreise .subpage-hero-unified .page-jump-links a { border-color:var(--mint); color:var(--white); background:transparent; }
.page-festpreise .subpage-hero-unified .page-jump-links a:first-child { background:var(--mint); color:var(--ink); }
.page-festpreise .subpage-hero-unified .page-jump-links a:hover,
.page-festpreise .subpage-hero-unified .page-jump-links a:focus-visible { background:var(--white); border-color:var(--white); color:var(--ink); }
.page-festpreise .subpage-hero-unified :focus-visible { outline-color:var(--mint); }

/* Clear page endings and compact fixed-price examples. */
html { overflow-x:clip; }
.site-footer { padding-top:42px; border-top:6px solid var(--violet); background:var(--ink); color:var(--white); }
.site-footer .footer-main { padding-bottom:28px; }
.site-footer .footer-main p { color:#e0d5eb; }
.site-footer .footer-format-links a:hover, .site-footer .footer-legal-links a:hover { color:var(--mint); }
.site-footer .footer-bottom { border-top-color:#c9b9dc55; color:#e0d5eb; }
.site-footer .footer-service { color:var(--ink); border-left:5px solid var(--violet); }
.site-footer :focus-visible { outline-color:var(--mint); }
.site-footer .footer-service :focus-visible { outline-color:var(--violet); }

.small-services .overview-grid { align-items:stretch; }
.small-services .overview-grid article { border:1px solid #baa9ce; border-top:5px solid var(--violet); }
.small-services .overview-grid article:nth-child(2) { background:#ede5f6; border-color:#b09bc9; border-top-color:var(--violet); }
.small-services .overview-grid article:nth-child(3) { border-color:var(--ink); border-top-color:var(--mint); }

.price-list { gap:30px; }
.price-case { grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); border:2px solid #ac99c1; box-shadow:0 8px 0 #dcd2e8; scroll-margin-top:24px; }
.price-case:nth-child(even) { border-color:#91b8a0; box-shadow:0 8px 0 #c2e2ce; }
.price-case::before { padding:11px 20px; font-size:1rem; line-height:1.4; }
.price-case:nth-child(even)::before { border-left-color:var(--mint); }
.price-visual { align-self:start; background:var(--white); }
.price-case .price-browser-bar { padding:10px 18px; font-size:.86rem; }
.price-case .price-browser-bar > span:last-child { font-size:.78rem; }
.price-case .example-interactive-hint { gap:6px 12px; padding:12px 18px 8px; font-size:.86rem; }
.price-case .example-interactive-hint strong { padding:5px 8px; }
.price-case .example-page-nav { gap:6px; padding:5px 18px 10px; }
.price-case .example-page-link { min-height:44px; padding:8px 11px; font-size:.86rem; }
.price-case .example-preview-status { padding:7px 18px; font-size:.82rem; }
.price-case .price-visual iframe { height:clamp(260px,34vh,330px)!important; }
.price-case .price-preview-bottom { gap:10px; padding:12px 18px; }
.price-case .price-preview-bottom p { max-width:230px; font-size:.82rem; }
.price-case .price-preview-bottom .example-open { min-height:44px; padding:9px 12px; font-size:.86rem; }
.price-copy { padding:16px 24px; }
.price-copy .eyebrow { margin:0; font-size:.78rem; }
.price-copy h3 { margin:10px 0 14px; font-size:clamp(1.5rem,2vw,2rem); line-height:1.12; }
.price-copy .price-offer-label { margin:0 0 10px; padding:6px 9px; font-size:.8rem; }
.price-copy .fixed-price { margin:0 0 12px; }
.price-copy .fixed-price > strong { font-size:2.65rem; }
.price-copy .fixed-price > span { margin-top:4px; font-size:.84rem; }
.price-copy .fixed-price > .regular-price { margin:0 0 7px; font-size:.84rem; }
.price-copy .regular-price del { font-size:1.15rem; }
.price-copy .price-pages { margin:0 0 10px; font-size:.9rem; line-height:1.45; }
.price-copy .price-features { margin:0 0 12px; font-size:.9rem; line-height:1.45; }
.price-copy .price-features li { padding:2px 0; }
.price-copy .price-scope-link { margin:0 0 12px; font-size:.82rem; line-height:1.45; }
.price-copy .price-request { min-height:44px; padding:10px 16px; font-size:.9rem; }
.price-more { width:100%; margin-top:10px; border:1px solid #c6b8d8; background:#f0ebf6; }
.price-more summary { display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:44px; padding:10px 14px; font-size:.86rem; font-weight:700; line-height:1.4; cursor:pointer; list-style:none; }
.price-more summary::-webkit-details-marker { display:none; }
.price-more summary > span { font-size:1.3rem; }
.price-more[open] summary > span { transform:rotate(45deg); }
.price-more-content { padding:0 14px 16px; }
.price-more-pages { margin:0 0 14px; padding-left:18px; font-size:.9rem; line-height:1.55; }
.price-more .price-individual { margin:0; padding:10px 0; background:transparent; }
.price-more .price-individual h4 { font-size:1.08rem; }
.price-more .price-individual ul, .price-more .price-individual p, .price-more .price-guarantee { font-size:.9rem; line-height:1.55; }
.price-more .price-guarantee { margin:12px 0 0; padding-top:12px; }

@media(max-width:900px) {
 .price-case { grid-template-columns:1fr; }
 .price-copy { grid-column:1; grid-row:2; }
 .price-visual { grid-column:1; grid-row:3; width:100%; border-right:0; border-top:1px solid #c6b8d8; }
 .price-copy h3 { font-size:1.65rem; }
 .price-case .price-visual iframe { height:280px!important; }
}
@media(max-width:520px) {
 .price-case::before { padding:11px 16px; font-size:.92rem; }
 .price-copy { padding:18px; }
 .price-case .price-preview-bottom { flex-direction:column; align-items:stretch; }
 .price-case .price-preview-bottom p { max-width:none; }
 .price-case .example-interactive-hint, .price-case .example-page-nav, .price-case .example-preview-status { padding-inline:14px; }
 .site-footer { padding-top:32px; }
 .site-footer .footer-service { padding:20px; }
}