/* ER Creativity Production – cinematic monochrome hero, editorial navigation.
   Photo is a clean crop of the selected reference; all UI is live HTML. */
:root { --er-office-white: #f7f8f6; }
body[data-page="home"] #site-header { position:sticky!important; top:0; z-index:501; margin-bottom:-84px; pointer-events:none; }
body[data-page="home"] #site-header > * { pointer-events:auto; }
.site-header { background:rgba(8,10,9,.97)!important; border-bottom:1px solid rgba(255,255,255,.075)!important; }
body[data-page="home"] .site-header { background:transparent!important; border-color:transparent!important; box-shadow:none!important; backdrop-filter:none!important; -webkit-backdrop-filter:none!important; transition:background .28s ease, border-color .28s ease!important; }
body[data-page="home"].er-header-scrolled .site-header,
body[data-page="home"]:has(.mobile-panel.is-open) .site-header { background:rgba(7,9,9,.96)!important; border-color:rgba(255,255,255,.1)!important; backdrop-filter:blur(18px)!important; -webkit-backdrop-filter:blur(18px)!important; }
.site-header .nav-inner { width:min(1512px,calc(100% - 2 * clamp(22px,4vw,64px)))!important; min-height:84px!important; grid-template-columns:minmax(94px,1fr) auto minmax(182px,1fr)!important; gap:clamp(18px,3vw,55px)!important; }
.site-header .logo-link img { width:66px!important; height:51px!important; max-height:51px!important; object-fit:contain!important; }
.site-header .desktop-nav { gap:clamp(24px,2.8vw,46px)!important; }
.site-header .desktop-nav .nav-link { color:#f3f4f2!important; font-family:'Inter',Arial,sans-serif; font-size:clamp(13px,.94vw,15px)!important; font-weight:500!important; letter-spacing:-.02em!important; opacity:.96; }
.site-header .nav-link::after { background:#fff!important; height:1px!important; bottom:2px!important; }
.site-header .nav-link:hover{opacity:1;color:#fff!important;}
.site-header .nav-actions { gap:clamp(14px,1.4vw,22px)!important; }
.site-header .lang-select { color:#fff!important; font-weight:500!important; }
.site-header .lang-select .lang-caret { color:rgba(255,255,255,.9)!important; }
.site-header .nav-cta { background:transparent!important; border:1.2px solid rgba(255,255,255,.97)!important; color:#fff!important; min-height:50px!important; padding:0 21px!important; border-radius:100px!important; font-family:'Inter',Arial,sans-serif!important; font-size:clamp(12px,.9vw,14px)!important; font-weight:500!important; box-shadow:none!important; transition:background .2s,color .2s,border-color .2s!important; }
.site-header .nav-cta:hover { background:#fff!important; color:#080a09!important; transform:none!important; }
.site-header .nav-cta svg { width:16px!important; height:16px!important; }
body[data-page="home"] .er-office-hero { position:relative; isolation:isolate; overflow:hidden; width:100%; min-height:min(980px,100svh); height:max(720px,100svh); display:flex; align-items:center; background:#050606!important; color:#fff; border-bottom:1px solid rgba(255,255,255,.12); }
body[data-page="home"] .er-office-photo { position:absolute; inset:0 0 0 42%; z-index:-2; background-image:url('../images/er-office-hero-desktop.webp'); background-size:cover; background-position:center 46%; filter:grayscale(1) contrast(1.035); }
body[data-page="home"] .er-office-wash { position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,#050606 0%,#050606 18%,rgba(5,6,6,.96) 28%,rgba(5,6,6,.88) 38%,rgba(5,6,6,.53) 51%,rgba(5,6,6,.13) 72%,rgba(5,6,6,.16) 100%),linear-gradient(0deg,rgba(3,4,4,.57),transparent 20%,transparent 77%,rgba(3,4,4,.45)); }
body[data-page="home"] .er-office-frame { width:min(1512px,calc(100% - 2 * clamp(22px,4vw,64px))); padding:clamp(150px,19vh,205px) 0 clamp(100px,11vh,138px); display:flex; align-items:center; flex:1; }
body[data-page="home"] .er-office-content { max-width:min(795px,71%); margin:0; }
body[data-page="home"] .er-office-kicker { font-size:clamp(10px,.8vw,12px); letter-spacing:.36em; color:rgba(255,255,255,.81); font-weight:600; margin:0 0 clamp(28px,3.1vw,46px); }
body[data-page="home"] .er-office-heading { font-family:'Inter Tight','Inter',Arial,sans-serif; font-size:clamp(69px,7.4vw,124px); line-height:.965; letter-spacing:-.078em; font-weight:760; margin:0!important; color:#fff; white-space:normal; text-wrap:balance; }
body[data-page="home"] .er-office-lead { margin:clamp(26px,3vw,41px) 0 0; width:min(100%,565px); font-size:clamp(16px,1.3vw,19px); font-weight:400; line-height:1.6; letter-spacing:-.012em; color:#d4d7d5; }
body[data-page="home"] .er-office-cta { display:inline-flex; gap:clamp(20px,2vw,30px); align-items:center; justify-content:space-between; margin-top:26px; min-height:52px; border:1.25px solid #fff; color:#fff; border-radius:50px; padding:0 20px 0 29px; font-size:clamp(14px,1.05vw,17px); font-weight:500; transition:background .22s,color .22s,transform .22s; }
body[data-page="home"] .er-office-cta:hover { background:#fff;color:#080a09; transform:translateY(-1px); }
body[data-page="home"] .er-office-cta svg { width:19px;height:19px; }
body[data-page="home"] .er-office-cta:focus-visible, .site-header .nav-cta:focus-visible { outline:2px solid #C6FF34; outline-offset:5px; }
@media (min-width:1700px){body[data-page="home"] .er-office-photo{inset-inline-start:43%;background-position:center center;}body[data-page="home"] .er-office-heading{font-size:clamp(116px,7vw,143px);}}
@media (max-width:1100px){
  body[data-page="home"] .er-office-content{max-width:74%}
  body[data-page="home"] .er-office-heading{font-size:clamp(64px,8.5vw,99px)}
  .site-header .nav-inner { grid-template-columns:minmax(75px,1fr) auto minmax(165px,1fr)!important; }
  .site-header .desktop-nav { gap:clamp(14px,2vw,26px)!important; }
  .site-header .nav-cta { padding-inline:15px!important; }
}
@media (max-width:800px){
  body[data-page="home"] #site-header{margin-bottom:-76px}
  .site-header .nav-inner { min-height:76px!important; display:flex!important; justify-content:space-between!important; }
  .site-header .logo-link img { width:62px!important;height:45px!important; }
  .site-header .desktop-nav { display:none!important; }
  .site-header .nav-cta { min-height:41px!important; padding:0 15px!important; font-size:12px!important; }
  body[data-page="home"] .er-office-hero { min-height:690px; height:100svh; max-height:850px; }
  body[data-page="home"] .er-office-frame{padding:150px 0 84px;}
  body[data-page="home"] .er-office-content{max-width:78%;}
  body[data-page="home"] .er-office-photo{inset-inline-start:30%; background-position:center center;}
  body[data-page="home"] .er-office-wash{background:linear-gradient(90deg,#050606 0%,rgba(5,6,6,.95) 20%,rgba(5,6,6,.71) 58%,rgba(5,6,6,.25) 100%),linear-gradient(0deg,rgba(5,6,6,.56),transparent 30%,rgba(5,6,6,.2));}
  body[data-page="home"] .er-office-heading{font-size:clamp(57px,9.3vw,88px);}
}
@media (max-width:600px){
  .site-header .nav-inner{width:calc(100% - 36px)!important;}
  .site-header .nav-actions{gap:8px!important;}
  .site-header .lang-select{padding-inline:2px!important;min-height:36px!important;}
  .site-header .nav-cta{font-size:11px!important; min-height:39px!important; padding:0 11px!important;}
  .site-header .nav-cta svg {width:12px!important;}
  .site-header .menu-toggle{width:37px;height:37px;}
  body[data-page="home"] .er-office-hero{min-height:680px; height:100svh; max-height:790px;}
  body[data-page="home"] .er-office-photo{inset:0; background-image:url('../images/er-office-hero-mobile.webp'); background-size:cover;background-position:center 35%; opacity:.55;}
  body[data-page="home"] .er-office-wash{background:linear-gradient(90deg,rgba(3,4,4,.96) 0%,rgba(3,4,4,.79) 48%,rgba(3,4,4,.55) 100%),linear-gradient(0deg,rgba(3,4,4,.69),transparent 50%,rgba(3,4,4,.2));}
  body[data-page="home"] .er-office-frame {width:calc(100% - 44px); padding:138px 0 76px;align-items:center;}
  body[data-page="home"] .er-office-content {max-width:100%;}
  body[data-page="home"] .er-office-kicker {font-size:10px;letter-spacing:.27em;margin-bottom:25px;}
  body[data-page="home"] .er-office-heading {font-size:clamp(49px,12vw,71px);letter-spacing:-.078em;line-height:.985;}
  body[data-page="home"] .er-office-lead {font-size:15px;line-height:1.57;max-width:410px;margin-top:28px;}
  body[data-page="home"] .er-office-cta {min-height:48px;font-size:14px;}
}
@media (max-width:360px){.site-header .nav-cta { font-size:10px!important; padding:0 9px!important; }body[data-page="home"] .er-office-heading {font-size:clamp(44px,12vw,54px);}body[data-page="home"] .er-office-frame {width:calc(100% - 34px);} }
@media(prefers-reduced-motion:reduce){.site-header,body[data-page="home"] .er-office-cta{transition:none!important}}
/* Final optical adjustments: preserve the reference's inset and image beneath navigation. */
body[data-page="home"] #site-header {background:transparent!important;}
body[data-page="home"].er-header-scrolled #site-header {background:rgba(7,9,9,.95)!important;}
body[data-page="home"] .er-office-frame {flex:0 1 auto!important; margin-inline:auto!important;}
@media (min-width:801px) {
  /* Blend the photograph into the dark editorial text field—no hard vertical edge. */
  body[data-page="home"] .er-office-photo {
    inset-inline-start:22%;
    -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.42) 17%,#000 36%);
    mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.42) 17%,#000 36%);
  }
}