/* A single photographic opening with live, accessible typography. */
.marketing-service .service-theme-marketing{padding-top:88px}
.marketing-service .breadcrumbs{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);padding:0;margin:0}
.marketing-service .breadcrumbs:focus-within{z-index:30;clip-path:none;width:auto;height:auto;background:#fff;padding:15px}
.marketing-hero{position:relative;isolation:isolate;overflow:hidden;background:#f5f5f5;color:#191919;min-height:660px;height:calc(100svh - 88px);max-height:960px}
.marketing-hero-backdrop{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:75% bottom;animation:marketing-photo-enter 1.8s cubic-bezier(.2,.65,.25,1) both}
.marketing-hero:after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,#f6f6f63d 0%,transparent 54%)}
.marketing-hero-content{padding-block:clamp(50px,4.5vw,85px) 140px}
.marketing-hero .eyebrow{font-size:clamp(10px,.65vw,13px);letter-spacing:.055em;color:#494641;margin:0 0 32px;animation:marketing-copy-enter .85s .05s both}
.studio-subpage .marketing-hero h1{font-size:clamp(58px,5.5vw,112px);line-height:1.06;letter-spacing:-.065em;font-weight:600;max-width:none;margin:0 0 30px;color:#191919}
.marketing-hero h1>span{display:block;animation:marketing-copy-enter 1s .13s both}
.marketing-hero h1>.marketing-hero-accent{color:#ff5000;animation-delay:.26s}
.marketing-hero-copy{width:min(39%,510px);animation:marketing-copy-enter 1s .4s both}
.marketing-hero-copy>p{color:#494641;font-size:clamp(15px,1.03vw,19px);line-height:1.6;margin:0 0 30px;text-wrap:pretty}
.marketing-hero .studio-button{background:#191919;color:#fff;border:1px solid #191919;gap:22px;padding:18px 27px}
.marketing-hero .studio-button:hover{background:#ff5000;border-color:#ff5000;color:#fff;transform:translateY(-3px)}
.marketing-hero-footer{position:absolute;inset-inline:0;bottom:32px}
.marketing-hero-caption{display:flex;width:fit-content;align-items:center;gap:20px;font-size:11px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:#292723;animation:marketing-copy-enter 1s .65s both}
.marketing-hero-caption>span{width:44px;height:2px;background:currentColor;transition:width .3s}
.marketing-hero-caption:hover>span{width:65px}
.marketing-hero-caption b{font-size:18px;font-weight:400}
@keyframes marketing-photo-enter{from{transform:scale(1.045)}to{transform:scale(1)}}
@keyframes marketing-copy-enter{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:1800px){.marketing-hero{min-height:780px}.marketing-hero-copy{width:32%}}
@media(min-width:761px) and (max-width:1100px){.marketing-hero{min-height:690px}.marketing-hero-copy{width:45%}.marketing-hero-backdrop{object-position:69% bottom}.studio-subpage .marketing-hero h1{font-size:6.1vw}}
@media(max-width:760px){
  .marketing-service .service-theme-marketing{padding-top:75px}
  .marketing-hero{height:auto;min-height:0;max-height:none;background:#f5f5f5;padding-bottom:clamp(270px,62vw,440px)}
  .marketing-hero-content{padding-block:40px 36px}
  .marketing-hero .eyebrow{font-size:9px;margin-bottom:27px}
  .studio-subpage .marketing-hero h1{font-size:clamp(42px,8.9vw,67px);line-height:1.07;margin-bottom:24px;letter-spacing:-.06em}
  .marketing-hero-copy{width:100%;max-width:530px}
  .marketing-hero-copy>p{font-size:15px;line-height:1.65;margin-bottom:25px}
  .marketing-hero .studio-button{font-size:12px;padding:16px 23px}
  .marketing-hero-backdrop{inset:auto 0 0;width:100%;height:clamp(320px,72vw,510px);object-position:100% bottom;object-fit:cover}
  .marketing-hero:after{background:linear-gradient(#f5f5f5 0%,#f5f5f5 48%,transparent 68%)}
  .marketing-hero-footer{bottom:20px}
  .marketing-hero-caption{font-size:8px;gap:10px;letter-spacing:.04em}
  .marketing-hero-caption>span{width:25px}
}
@media(prefers-reduced-motion:reduce){.marketing-hero-backdrop,.marketing-hero .eyebrow,.marketing-hero h1>span,.marketing-hero-copy,.marketing-hero-caption{animation:none}.marketing-hero .studio-button,.marketing-hero-caption>span{transition:none}}
.studio-motion-paused .marketing-hero-backdrop,.studio-motion-paused .marketing-hero .eyebrow,.studio-motion-paused .marketing-hero h1>span,.studio-motion-paused .marketing-hero-copy,.studio-motion-paused .marketing-hero-caption{animation:none}
