/* The creative ones — keep the colour and play, sharpen the composition. */
body.df {--df-width:1240px;--df-gutter:max(24px,calc((100% - var(--df-width))/2));--df-ease:cubic-bezier(.4,0,.2,1);}
body.df :is(h1,h2,h3) {text-wrap:balance;}
body.df .section-title {font-size:clamp(34px,4.5vw,62px);line-height:1.12;letter-spacing:-.03em;max-width:24ch;}
body.df .section-label {letter-spacing:.16em;font-size:11px;color:var(--cyan);}
body.df .hero {min-height:820px;}
body.df .hero-title {font-size:clamp(58px,9vw,132px);line-height:1;}
body.df .hero-sub,body.df .hero-cta-row {animation:none;opacity:1;transform:none;}
body.df .hero-sub {letter-spacing:.09em;line-height:1.6;}
body.df .hero-content {padding-top:120px;padding-bottom:100px;}
body.df .hero-cta {transition:background-color .2s var(--df-ease),color .2s var(--df-ease),border-color .2s var(--df-ease);}
body.df .hero-cta:hover {transform:none;}
body.df .shape,body.df .scroll-line,body.df .slot-reel-inner.placeholder,body.df .slot-btn.pulse {animation:none;}
body.df .scroll-indicator {animation:none;opacity:1;}
body.df .about,body.df .process {max-width:1336px;padding:88px 48px;gap:64px;}
body.df .about-text p {font-size:17px;line-height:1.8;max-width:62ch;}
body.df .about-text p + p {margin-top:24px;}
body.df .ttt-container {padding:32px 24px;background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.12);border-radius:16px;min-width:0;}
body.df .ttt-board {width:min(100%,320px);height:auto;aspect-ratio:1;}
body.df .process-timeline {margin-top:40px;}
body.df .step-title {font-size:17px;line-height:1.4;}
body.df .step-desc {font-size:15px;line-height:1.7;}
body.df .step-number {color:rgba(255,255,255,.7);letter-spacing:.1em;}
body.df .services-header {max-width:1336px;padding:64px 48px 40px;}
body.df .service-strip .strip-content,body.df .service-strip:hover .strip-content {max-width:1336px;padding:28px 48px;gap:28px;}
body.df .strip-title {font-size:clamp(23px,2.5vw,34px);line-height:1.25;min-width:0;}
body.df .strip-desc {opacity:1;transform:none;color:rgba(255,255,255,.72);font-size:15px;line-height:1.7;max-width:380px;flex:0 1 380px;}
body.df .strip-number {color:var(--cyan);min-width:26px;}
body.df .strip-arrow {opacity:.7;transform:none;}
body.df .service-strip:hover .strip-title {transform:none;}
body.df .statement {padding:88px 48px;background:rgba(255,255,255,.025);}
body.df .statement h2 {font-size:clamp(27px,3.6vw,46px);max-width:30ch;line-height:1.35;}
body.df .slot-section {padding:72px 32px;}
body.df .slot-sub {margin-bottom:28px;}
body.df .slot-result {margin-top:24px;}
body.df .projekte {padding:88px 0;background:var(--dark);}
body.df .projekte-header,body.df .marken-header {max-width:1336px;padding:0 48px 40px;}
body.df .projekte-sub,body.df .marken-sub {color:rgba(255,255,255,.72);font-size:16px;line-height:1.75;max-width:65ch;}
body.df .projekt-row {max-width:1240px;margin:0 auto 24px;min-height:460px;grid-template-columns:minmax(0,1fr) minmax(0,1fr);border:1px solid rgba(255,255,255,.13);border-radius:12px;overflow:hidden;}
body.df .projekt-info {padding:36px;min-width:0;}
body.df .projekt-info .projekt-number {font-size:54px;color:rgba(255,255,255,.3);margin-bottom:16px;}
body.df .projekt-info h3 {font-size:25px;line-height:1.3;letter-spacing:-.02em;}
body.df .projekt-info p {font-size:16px;line-height:1.75;max-width:62ch;}
body.df .projekt-info .tag {font-size:11px;letter-spacing:.025em;padding:7px 10px;}
body.df .projekt-image {min-width:0;}
body.df .df-project-image .overlay {opacity:.65;}
body.df .df-project-preview {position:absolute;top:32px;left:28px;width:calc(100% - 56px);height:calc(100% - 110px);object-fit:cover;object-position:top;z-index:2;border:5px solid rgba(255,255,255,.94);border-radius:8px;box-shadow:0 16px 40px rgba(0,0,0,.2);}
body.df .projekt-image .projekt-url {font-size:clamp(17px,1.7vw,24px);left:28px;bottom:24px;opacity:1;transform:none;overflow-wrap:anywhere;max-width:calc(100% - 56px);}
body.df .typed-section {padding:64px 32px;}
body.df .typed-text {font-size:clamp(20px,2.1vw,28px);max-width:40ch;margin-inline:auto;}
body.df .marken {padding:80px 0;}
body.df .marken-grid-refs {max-width:1240px;margin:auto;gap:20px;}
body.df .marken-ref {display:flex;flex-direction:column;direction:ltr;border:1px solid rgba(255,255,255,.12);border-radius:10px;overflow:hidden;min-width:0;}
body.df .marken-ref-image {min-height:88px;height:88px;flex:none;}
body.df .marken-ref-info {padding:28px;min-width:0;}
body.df .marken-ref-info h3 {font-size:19px;line-height:1.4;overflow-wrap:normal;word-break:normal;white-space:nowrap;}
body.df .marken-ref-info p {font-size:15px;line-height:1.7;}
body.df .marken-ref-url {font-size:18px;line-height:1.45;left:28px;bottom:26px;max-width:calc(100% - 56px);overflow-wrap:normal;word-break:normal;white-space:nowrap;opacity:1;transform:none;}
body.df .marken-ref-info .tag {font-size:10px;letter-spacing:.025em;padding:6px 8px;}
body.df .tc-contact {padding:88px 32px;}
body.df .snake-section {padding:64px 32px;}
body.df .snake-hint {max-width:55ch;line-height:1.7;margin-inline:auto;}
body.df .reveal,body.df .reveal-left,body.df .reveal-right,body.df .reveal-scale {opacity:1;transform:none;transition:none;}
body.df [data-parallax-speed] {transform:none!important;}
body.df :is(a,button,input,textarea):focus-visible {outline:2px solid var(--cyan);outline-offset:4px;}
body.df .modal-content {max-width:min(800px,calc(100vw - 32px));}
body.df .modal-content :is(p,li) {line-height:1.8;max-width:75ch;overflow-wrap:anywhere;}
@media(max-width:1100px) {
 body.df .about {gap:36px;}
 body.df .projekt-row,body.df .marken-grid-refs {margin-inline:24px;}
 body.df .projekt-info {padding:28px;}
 body.df .marken-grid-refs {grid-template-columns:minmax(0,1fr);}
 body.df .service-strip .strip-content,body.df .service-strip:hover .strip-content {gap:20px;padding-inline:32px;}
 body.df .strip-desc {flex-basis:310px;}
}
@media(max-width:767px) {
 body.df .hero {min-height:680px;}
 body.df .hero-title {font-size:clamp(40px,10vw,76px);}
 body.df .hero-title .line:nth-child(2) {margin-left:.2em;}
 body.df .hero-title .line:nth-child(3) {margin-left:.5em;}
 body.df .hero-content {padding:120px 20px 88px;max-width:100%;}
 body.df .hero-cta-row {flex-wrap:wrap;gap:12px;}
 body.df .hero-cta {font-size:12px;padding:14px 20px;}
 body.df .about,body.df .process {padding:56px 24px;grid-template-columns:minmax(0,1fr);gap:32px;}
 body.df .about-text p {font-size:16px;}
 body.df .ttt-container {padding:24px 18px;}
 body.df .services-header {padding:48px 24px 28px;}
 body.df .service-strip .strip-content,body.df .service-strip:hover .strip-content {display:grid;grid-template-columns:26px minmax(0,1fr) 20px;padding:24px;gap:12px 16px;}
 body.df .strip-title {font-size:22px;}
 body.df .strip-desc {display:block;grid-column:2;grid-row:2;font-size:14px;max-width:none;}
 body.df .strip-arrow {grid-column:3;grid-row:1;}
 body.df .statement {padding:56px 24px;}
 body.df .slot-section {padding:56px 24px;}
 body.df .slot-section h2 {font-size:25px;line-height:1.35;}
 body.df .projekte,body.df .marken {padding-block:56px;}
 body.df .projekte-header,body.df .marken-header {padding:0 24px 32px;}
 body.df .projekt-row {grid-template-columns:minmax(0,1fr);min-height:0;margin-inline:16px;direction:ltr;}
 body.df .projekt-image {height:300px;min-height:0;}
 body.df .projekt-info {padding:24px;}
 body.df .projekt-info h3 {font-size:23px;}
 body.df .projekt-info .projekt-number {font-size:40px;}
 body.df .df-project-preview {top:20px;left:20px;width:calc(100% - 40px);height:calc(100% - 82px);}
 body.df .projekt-image .projekt-url {font-size:17px;left:20px;bottom:20px;}
 body.df .marken-grid-refs {margin-inline:16px;}
 body.df .marken-ref-image {min-height:80px;height:80px;}
 body.df .marken-ref-url {font-size:clamp(13px,3.6vw,18px);left:24px;max-width:calc(100% - 48px);}
 body.df .marken-ref-info h3 {font-size:clamp(13px,3.6vw,19px);}
 body.df .marken-ref-info {padding:24px;}
 body.df .typed-section {padding:48px 24px;}
 body.df .tc-contact,body.df .snake-section {padding:56px 20px;}
}
body.df .projekt-number {opacity:.18!important;transform:none!important;transition:none!important;}
body.df .shape {filter:blur(80px)!important;}
body.df .tc-orb,body.df .tc-terminal {animation:none;}
@media(prefers-reduced-motion:reduce) {
 body.df .hero-title .line {opacity:1;transform:none;text-shadow:none!important;}
 body.df *,body.df *::before,body.df *::after {animation:none!important;transition:none!important;scroll-behavior:auto!important;}
}
