@font-face{font-family:OfficeIcons;src:url('assets/office-icons.woff2') format('woff2');font-display:block}
.office-page h1{font-size:clamp(46px,5.2vw,82px);font-weight:700;letter-spacing:-.035em}.office-page h2{font-size:clamp(28px,2.5vw,40px);line-height:1.25}.office-page h3{font-size:26px;line-height:1.35}.office-page .section{scroll-margin-top:110px}.office-page .soft{background:#f2f2f2}.office-page .center{text-align:center}.office-page .reading{max-width:1150px}.office-page .grid{align-items:center}.office-page p{line-height:1.75}.office-page .button{font-size:23px}.office-page .office-hero{min-height:700px;position:relative;isolation:isolate;display:flex;align-items:center;text-align:center;padding:70px 0 100px;overflow:hidden;color:#303030}.office-hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}.office-hero:before{content:'';position:absolute;inset:0;background:#ffffffc7;z-index:-1}.office-hero:after{content:'';position:absolute;bottom:-1px;left:0;right:0;height:40px;background:#f2f2f2;clip-path:polygon(0 100%,100% 0,100% 100%)}.office-subtitle{max-width:950px;font-size:clamp(25px,2.7vw,40px);font-weight:600;margin:0 auto 38px;line-height:1.35!important}.hero-benefits{list-style:none;text-align:left;display:table;margin:0 auto 44px;padding:0;font-size:26px;font-weight:600;line-height:1.8}.hero-benefits li:before{content:'✓';margin-right:18px;color:#303030}.office-illustration{display:flex;align-items:center;justify-content:center}.office-illustration img{width:auto;max-width:100%;max-height:400px}.office-benefits{margin-top:55px;align-items:start!important;row-gap:55px;text-align:center}.office-benefits h3{margin-top:24px}.office-benefits ul{text-align:left}.office-icon{font-family:OfficeIcons;font-style:normal;font-size:55px;line-height:1.2;display:block}.feature-icon{font-size:125px}.office-logos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:40px;align-items:center;justify-items:center;margin:65px auto 0;max-width:1100px}.office-logos>div{width:180px;height:160px;display:flex;align-items:center;justify-content:center}.office-logos img{width:140px;height:140px;object-fit:contain}.office-gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:45px}.office-gallery img{width:100%;height:220px;object-fit:cover;border-radius:12px}.office-news{display:grid;gap:55px;margin-top:55px}.office-news-item{display:grid;grid-template-columns:200px 1fr;gap:42px;align-items:start}.office-news-item img{width:200px;height:200px;border-radius:50%;object-fit:cover}.office-news-item h3{font-size:27px;margin-bottom:12px}.office-news-item time{display:block;color:#666;font-size:16px;margin-bottom:18px}.office-news-item p{font-size:18px;margin-bottom:15px}.read-more{font-weight:700;text-decoration:underline}.office-page footer .office-icon{display:none}
@media(max-width:1000px){.office-page .office-hero{min-height:650px}.office-logos{gap:20px}.office-logos>div{width:140px}.office-gallery{grid-template-columns:repeat(3,minmax(0,1fr))}.office-gallery img{height:180px}}
@media(max-width:600px){.office-page .office-hero{min-height:650px;padding:45px 0 70px}.office-page h1{font-size:43px}.office-subtitle{font-size:25px}.hero-benefits{font-size:21px}.office-page .button{font-size:18px}.office-page .section{scroll-margin-top:78px}.office-page h2{font-size:29px}.office-page h3{font-size:24px}.office-page .split{grid-template-columns:1fr}.office-illustration img{max-height:280px}.office-logos{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:35px}.office-logos>div{width:100%;height:125px}.office-logos img{width:110px;height:110px}.office-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.office-gallery img{height:150px}.office-news-item{grid-template-columns:1fr;gap:25px}.office-news-item img{width:160px;height:160px}.office-news-item h3{font-size:24px}.office-news-item p{font-size:17px}}

.office-page h1{font-weight:800}
/* Original composition: the copy occupies the right half of the hero image. */
@media(min-width:1001px){.office-page .office-hero>.wrap{width:44%;max-width:760px;margin-left:53%;margin-right:3%}.office-page .office-hero h1{font-size:clamp(46px,4vw,72px)}.office-subtitle{font-size:clamp(24px,2.05vw,34px)}.hero-benefits{font-size:24px}}
@media(min-width:601px) and (max-width:1000px){.office-page .office-hero>.wrap{width:49%;margin-left:48%;margin-right:3%}.office-page .office-hero h1{font-size:clamp(34px,4.4vw,44px)}.office-subtitle{font-size:24px}.hero-benefits{font-size:21px}}

/* Reveal the photograph on the left; soften it smoothly behind the right-hand copy. */
.office-hero:before{background:linear-gradient(90deg,rgba(0,0,0,.08) 0%,rgba(255,255,255,.12) 35%,rgba(255,255,255,.62) 60%,rgba(255,255,255,.88) 100%)}
@media(max-width:600px){.office-hero:before{background:rgba(255,255,255,.72)}}

/* Slight white veil on the photo; original white CTA restored. */
.office-hero:before{background:linear-gradient(90deg,rgba(255,255,255,.25) 0%,rgba(255,255,255,.3) 35%,rgba(255,255,255,.65) 60%,rgba(255,255,255,.88) 100%)}
.office-page .office-hero .button{background:#fff;color:#424242;box-shadow:0 5px 14px #0003}
.office-page .office-hero .button:hover{background:#f2f2f2}
@media(max-width:600px){.office-hero:before{background:rgba(255,255,255,.72)}}

/* Match the original CTA scale and restore depth behind its lower-right area. */
.office-hero:before{background:radial-gradient(ellipse 80% 75% at 100% 100%,rgba(0,0,0,.24) 0%,rgba(0,0,0,.12) 45%,transparent 100%),linear-gradient(90deg,rgba(255,255,255,.25) 0%,rgba(255,255,255,.3) 35%,rgba(255,255,255,.65) 60%,rgba(255,255,255,.88) 100%)}
.office-page .office-hero .button{font-size:28px;line-height:1.2;padding:25.2px 50.4px;border-radius:11.2px;min-height:84px;min-width:315px;max-width:100%}
@media(max-width:600px){.office-hero:before{background:radial-gradient(ellipse at 100% 100%,rgba(0,0,0,.16),transparent 75%),rgba(255,255,255,.72)}.office-page .office-hero .button{font-size:22px;padding:21px 30px;min-height:69px;min-width:0;width:min(100%,315px)}}

/* Optional, native scroll-scrubbed parallax: desktop and motion-enabled only. */
@supports ((animation-timeline:view()) and (animation-range:exit 0% exit 100%)){
 @media(min-width:1001px) and (prefers-reduced-motion:no-preference){
  .office-hero{view-timeline-name:--office-hero-scroll;view-timeline-axis:block}
  .office-hero-bg{inset:-70px 0 auto;height:calc(100% + 140px);animation:office-hero-parallax linear both;animation-timeline:--office-hero-scroll;animation-range:exit 0% exit 100%}
  @keyframes office-hero-parallax{from{transform:translateY(0)}to{transform:translateY(70px)}}
 }
}

/* Match Munich/NYC ink and make the desktop scroll depth more noticeable. */
.office-page{color:#424242}.office-page .office-hero,.office-page .hero-benefits li:before{color:#424242}
@supports ((animation-timeline:view()) and (animation-range:exit 0% exit 100%)){
 @media(min-width:1001px) and (prefers-reduced-motion:no-preference){
  .office-hero-bg{inset:-140px 0 auto;height:calc(100% + 280px)}
  @keyframes office-hero-parallax{from{transform:translateY(0)}to{transform:translateY(140px)}}
 }
}
