*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#F2EBE2;color:#27221e;font-family:"DM Sans",Arial,sans-serif;line-height:1.55}body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");z-index:20}.intro{position:fixed;inset:0;background:#F2EBE2;display:grid;place-items:center;z-index:100;animation:none}.intro img{width:min(42vw,430px);max-width:70%;opacity:0;transform:translateY(45px) scale(.92);animation:logoIn 1.15s .15s cubic-bezier(.16,1,.3,1) forwards}.site-header{position:fixed;top:0;left:0;right:0;height:88px;padding:0 5vw;display:flex;align-items:center;z-index:50;mix-blend-mode:multiply}.floating-brand{position:fixed;right:42px;top:22px;width:92px;height:92px;display:flex;align-items:center;justify-content:center;text-decoration:none;z-index:60;opacity:0;pointer-events:none;transform:translateY(-8px);transition:opacity .45s ease,transform .45s cubic-bezier(.16,1,.3,1)}
.floating-brand img{width:78px;height:auto;object-fit:contain;display:block;filter:drop-shadow(0 8px 12px rgba(39,34,30,.06))}
.floating-brand.logo-ready{opacity:1;pointer-events:auto;transform:none}
.floating-brand:hover img{transform:scale(1.035);transition:transform .35s ease}.nav{display:flex;gap:28px;align-items:center;margin-left:4vw}.nav a{color:inherit;text-decoration:none;text-transform:uppercase;font-size:11px;letter-spacing:.12em;font-weight:600;position:relative}.nav a:not(.nav-cta):after{content:"";position:absolute;left:0;bottom:-7px;width:0;height:1px;background:#27221e;transition:.3s}.nav a:hover:after{width:100%}.nav-cta{border:1px solid #27221e;padding:11px 17px;border-radius:100px;transition:.25s}.nav-cta:hover{background:#27221e;color:#F2EBE2}.menu-toggle{display:none;border:0;background:none;width:44px;height:44px}.menu-toggle span{display:block;width:25px;height:1px;background:#27221e;margin:6px auto}.hero{min-height:100svh;position:relative;display:flex;align-items:center;padding:150px 9vw 100px;overflow:hidden;background:#F2EBE2}.hero:after{content:"";position:absolute;width:55vw;height:55vw;border-radius:50%;right:-22vw;top:15%;background:#E6D5BE;opacity:.5;filter:blur(1px)}.hero-copy{max-width:790px;position:relative;z-index:2}.eyebrow,.section-label{font-size:10px;letter-spacing:.2em;text-transform:uppercase;font-weight:600}.hero h1,h2{font-family:"Playfair Display",Georgia,serif;font-weight:500;line-height:.98;letter-spacing:-.035em}.hero h1{font-size:clamp(58px,8.2vw,128px);margin:25px 0 32px}.hero h1 em,h2 em{font-style:italic;font-weight:500}.lead{font-size:clamp(16px,1.45vw,20px);max-width:520px;margin-bottom:35px}.button{display:inline-flex;gap:32px;align-items:center;text-decoration:none;color:#27221e;border:1px solid #27221e;border-radius:100px;padding:15px 21px;font-size:11px;text-transform:uppercase;letter-spacing:.12em;font-weight:600;transition:.3s}.button:hover{background:#27221e;color:#F2EBE2;transform:translateY(-2px)}.button span{font-size:16px}.hero-scroll{position:absolute;bottom:35px;left:9vw;font-size:10px;text-transform:uppercase;letter-spacing:.18em;z-index:3}.hero-scroll span{display:inline-block;width:55px;height:1px;background:#27221e;vertical-align:middle;margin-left:15px}.section-pad{padding:130px 9vw}.section-label{margin-bottom:65px}.split,.services-head,.works-head,.contact-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:9vw}.split h2,.services h2,.works h2,.instagram h2,.contact h2{font-size:clamp(48px,6.5vw,96px);margin:0}.copy{max-width:520px;font-size:18px}.copy p{margin-top:0;margin-bottom:28px}.small{font-size:11px;letter-spacing:.15em;text-transform:uppercase}.services{background:#E6D5BE}.services-head{align-items:end;margin-bottom:70px}.services-head p,.works-head p{max-width:350px;margin:0;font-size:16px}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.service-card{min-height:310px;border:1px solid rgba(39,34,30,.22);padding:28px;display:flex;flex-direction:column;justify-content:space-between;transition:.4s}.service-card:hover{background:#F2EBE2;transform:translateY(-6px)}.service-card span{font-size:10px;letter-spacing:.15em}.service-card h3{font-family:"Playfair Display",Georgia,serif;font-size:36px;font-weight:500;margin:0 0 10px}.service-card p{font-size:14px;margin:0;max-width:310px}.works-head{margin-bottom:70px}.gallery{display:grid;grid-template-columns:1.2fr 1fr 1fr;grid-auto-rows:260px;gap:18px}.gallery-item{overflow:hidden}.gallery-item.tall{grid-row:span 2}.gallery-item.wide{grid-column:span 2}.placeholder{height:100%;display:grid;place-items:center;background:#d9c4a9;color:#6f5c48;font-family:"Playfair Display",Georgia,serif;font-size:26px;transition:.5s}.gallery-item:hover .placeholder{transform:scale(1.03);background:#cdb89e}.instagram{background:#F2EBE2;color:#27221e}.instagram-box{background:#E6D5BE;color:#27221e;padding:75px 7vw;display:grid;grid-template-columns:1fr .8fr;gap:7vw;align-items:end}.instagram .section-label{margin-bottom:45px}.insta-right{max-width:380px}.insta-right p{font-size:18px;margin:0 0 30px}.button.dark{border-color:#27221e}.button.dark:hover{background:#27221e;color:#E6D5BE}.contact{background:#F2EBE2}.contact-grid{align-items:end}.contact h2{margin-bottom:35px}.contact-grid>div:first-child p{max-width:390px}.contact-links{display:flex;flex-direction:column}.contact-links a{font-family:"Playfair Display",Georgia,serif;font-size:clamp(25px,3vw,43px);color:#27221e;text-decoration:none;border-bottom:1px solid rgba(39,34,30,.25);padding:17px 0;display:flex;justify-content:space-between;transition:.3s}.contact-links a:hover{padding-left:10px}.contact-links span{font-family:"DM Sans";font-size:16px}footer{padding:45px 5vw;display:flex;align-items:center;justify-content:space-between;border-top:1px solid rgba(39,34,30,.15);font-size:10px;text-transform:uppercase;letter-spacing:.12em}footer img{width:75px}footer a{color:inherit;text-decoration:none}.reveal{opacity:0;transform:translateY(30px);transition:opacity .8s ease,transform .8s cubic-bezier(.16,1,.3,1)}.reveal.visible{opacity:1;transform:none}@keyframes logoIn{to{opacity:1;transform:none}}@keyframes introOut{to{opacity:0;visibility:hidden;pointer-events:none}}@media(max-width:900px){.site-header{height:72px;padding:0 6vw}.floating-brand{right:68px;top:14px;width:58px;height:58px}.floating-brand img{width:48px;max-height:48px}.nav{position:fixed;inset:0;background:#F2EBE2;display:flex;flex-direction:column;justify-content:center;gap:27px;transform:translateY(-100%);transition:.45s cubic-bezier(.76,0,.24,1)}.nav.open{transform:none}.nav a{font-size:14px}.menu-toggle{display:block;position:relative;z-index:3}.menu-toggle.active span:first-child{transform:rotate(45deg) translate(3px,3px)}.menu-toggle.active span:last-child{transform:rotate(-45deg) translate(2px,-2px)}.hero{padding:130px 7vw 90px}.hero h1{font-size:clamp(52px,13vw,90px)}.section-pad{padding:95px 7vw}.split,.services-head,.works-head,.contact-grid,.instagram-box{grid-template-columns:1fr;gap:35px}.section-label{margin-bottom:45px}.service-grid{grid-template-columns:1fr}.service-card{min-height:240px}.gallery{grid-template-columns:1fr 1fr;grid-auto-rows:220px}.gallery-item.tall{grid-row:span 1}.gallery-item.wide{grid-column:span 2}.instagram-box{padding:50px 7vw}footer{gap:20px;flex-wrap:wrap}}@media(max-width:560px){.floating-brand{right:60px;top:10px;width:52px;height:52px}.floating-brand img{width:43px;max-height:43px}.hero{min-height:92svh}.hero-scroll{display:none}.lead{font-size:15px}.gallery{grid-template-columns:1fr;grid-auto-rows:250px}.gallery-item.wide{grid-column:span 1}.contact-links a{font-size:25px}footer{flex-direction:column;align-items:flex-start}}

/* Entwurf 3 – dauerhaft sichtbares TA24U-Logo rechts */
.floating-brand{transition:transform .45s cubic-bezier(.16,1,.3,1),opacity .3s ease}
.site-header.scrolled .floating-brand{transform:translateY(-50%) scale(.92)}

/* Scroll-safe navigation */
.site-header {
  z-index: 100;
  pointer-events: none;
}
.site-header .nav,
.site-header .floating-brand,
.site-header .menu-toggle {
  pointer-events: auto;
}
.site-header .nav {
  position: relative;
  z-index: 101;
}
.site-header.scrolled {
  background: rgba(242, 235, 226, .96);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: 0 1px 0 rgba(39, 34, 30, .08);
}
.site-header.scrolled .nav a {
  text-shadow: none;
}

/* Smooth logo docking after intro */
.floating-brand.logo-ready {
  opacity: 1;
  top: 34px;
  right: 4vw;
  width: 125px;
  transform: none;
}
.floating-brand.logo-ready img {
  width: 105px;
}

@media (max-width: 800px) {
  .floating-brand {
    right: 20px;
    width: 150px;
  }
  .floating-brand img {
    width: 110px;
  }
  .floating-brand.logo-ready {
    top: 22px;
    right: 58px;
    width: 90px;
  }
  .floating-brand.logo-ready img {
    width: 76px;
  }
}


/* Intro: Navigation erst nach der Logo-Animation einblenden */
.site-header { opacity:0; visibility:hidden; transition:opacity .45s ease, visibility 0s linear .45s; }
.site-header.intro-done { opacity:1; visibility:visible; transition:opacity .55s ease; }


/* TA24U FULL IMAGE HOVER */
.gallery-item {
    position: relative;
    overflow: visible;
    z-index: 1;
    background: #E6D5BE;
}

.gallery-item .gallery-image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
}

.gallery-item .image-cover {
    object-fit: cover;
    opacity: 1;
    z-index: 1;
}

.gallery-item .image-full {
    object-fit: contain;
    opacity: 0;
    transform: scale(0.85);
    z-index: 2;
    pointer-events: none;
    transition:
        opacity 0.45s ease,
        transform 0.65s cubic-bezier(0.16, 1, 0.3, 1);
}

.gallery-item:hover {
    z-index: 50;
}

.gallery-item:hover .image-full {
    opacity: 1;
    transform: scale(1.15);
}

@media (max-width: 700px) {
    .gallery-item {
        overflow: hidden;
    }

    .gallery-item:hover .image-full {
        transform: none;
    }
}
