/* VANTELLE phone refinement: one compact header, unobstructed media, safe edges. */
:root{--vantelle-header-height:76px;--vantelle-anchor-gap:24px}
html{scroll-padding-top:var(--vantelle-anchor-gap)}
[id]{scroll-margin-top:0}
.gallery-media-nav{scroll-margin-top:0}
body[data-page=work] #photos{scroll-margin-top:112px}
.site-menu{max-height:calc(100dvh - 40px);overflow-y:auto;overscroll-behavior:contain}
.menu-links a{min-height:44px}
@media(max-width:760px), (max-height:500px) and (hover:none) and (pointer:coarse){
 :root{--vantelle-header-height:72px;--vantelle-anchor-gap:calc(var(--vantelle-header-height) + env(safe-area-inset-top,0px) + 16px)}
 .site-header{position:sticky;top:0;left:0;right:0;width:100%;max-width:none;height:calc(var(--vantelle-header-height) + env(safe-area-inset-top,0px));min-height:var(--vantelle-header-height);margin:0;padding-top:env(safe-area-inset-top,0px);padding-inline:max(18px,env(safe-area-inset-left,0px)) max(18px,env(safe-area-inset-right,0px));background:var(--stone);border-bottom:1px solid var(--line);border-radius:0;z-index:25;isolation:isolate;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;transform:none}
 .brand{gap:8px;min-height:52px;flex-shrink:0}.brand img{width:26px;height:36px}.brand>span{font-size:22px;letter-spacing:.1em;line-height:1.05}.brand small{font-size:10px;line-height:1.6;margin-top:5px}
 .header-right{gap:9px;min-width:0}.menu-trigger{gap:8px;min-width:44px;min-height:46px;padding:0;font-size:12px}.menu-trigger svg{width:20px;height:20px}
 .lang-select summary{min-height:44px;min-width:44px;padding:7px 9px;font-size:12px}.lang-options{inset-block-start:47px;min-width:150px}.lang-options a{min-height:44px}
 .header-work,.header-photos{display:none}
 .site-menu,html[dir=rtl] .site-menu{top:calc(env(safe-area-inset-top,0px) + 8px);inset-inline:12px;width:auto;max-width:none;padding:20px 24px;max-height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 24px);z-index:45}
 .menu-top{margin-bottom:10px}.menu-links{gap:0}.menu-links a{font-size:25px;line-height:1.3;padding-block:8px}.menu-note{font-size:12px;margin-top:14px;padding-top:14px}
 html[dir=rtl] .menu-links a{font-size:26px;line-height:1.5;padding-block:5px}
 /* The gallery selector stays at its introduction, rather than covering films. */
 .gallery-media-nav{position:relative;top:auto;z-index:1;margin-block:0 28px;padding:0;background:transparent}
 .home-media-links .media-choice,.gallery-media-nav .media-choice{min-height:84px;padding:14px 12px;gap:9px}
 .media-title{font-size:23px;line-height:1.2}.media-caption{font-size:11px;line-height:1.6}.media-symbol,.media-symbol svg{width:21px;height:21px}
 html[dir=rtl] .media-title{font-size:22px;line-height:1.45}html[dir=rtl] .media-caption{font-size:11px;line-height:1.8}
 .page-intro{padding-block:44px 32px}.page-intro h1{font-size:clamp(40px,10vw,56px);line-height:1.12;margin-bottom:20px}.page-intro>p:last-child{font-size:16px;line-height:1.8}
 html[dir=rtl] .page-intro h1{font-size:clamp(34px,9vw,46px);line-height:1.45}html[dir=rtl] .page-intro>p:last-child{font-size:16px;line-height:1.95}
 .films-section.section{padding-top:24px}.films-head{margin-bottom:28px}.films-head h2{font-size:36px;line-height:1.2}html[dir=rtl] .films-head h2{font-size:34px;line-height:1.5}
 .gallery-section{padding-top:48px}.gallery-tools{gap:16px}.gallery-filters{gap:5px}.gallery-filters button{min-height:44px;padding:8px 12px}
 .motion-grid{gap:28px 16px}.motion-card figcaption{padding-top:10px}.motion-card figcaption span{font-size:15px;line-height:1.6}.motion-card figcaption small{font-size:11px;line-height:1.7}
 html[dir=rtl] .motion-card figcaption span{font-size:15px;line-height:1.85}html[dir=rtl] .motion-card figcaption small{font-size:11px;line-height:1.85}
 .whatsapp-float{bottom:calc(14px + env(safe-area-inset-bottom,0px));min-height:46px;padding:10px 12px;font-size:12px;gap:7px;max-width:calc(50vw - 22px)}
 .back-home-float{bottom:calc(14px + env(safe-area-inset-bottom,0px));min-height:46px;padding:10px 12px;font-size:11px;max-width:calc(50vw - 22px)}
 .site-footer{padding-bottom:calc(96px + env(safe-area-inset-bottom,0px))}
 .motion-dialog,.motion-modal{max-height:calc(100dvh - 24px);max-width:calc(100vw - 24px)}
 .v-contact-dialog{max-height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 24px);overflow:auto}
 .v-contact-option{min-height:76px}.v-contact-option strong{font-size:18px}
}
@media(max-width:360px){
 .site-header{padding-inline:14px}.brand>span{font-size:19px}.brand{gap:7px}.brand img{width:23px}.header-right{gap:7px}.menu-trigger{font-size:11px;gap:5px}.menu-trigger svg{width:18px}
 .home-media-links .media-choice,.gallery-media-nav .media-choice{gap:6px;padding-inline:9px}.media-title{font-size:20px}.media-symbol,.media-symbol svg{width:18px;height:18px}
 html[dir=rtl] .media-title{font-size:20px}.media-caption,html[dir=rtl] .media-caption{font-size:10.5px}
}
@media(max-height:500px) and (orientation:landscape){
 :root{--vantelle-header-height:62px}.site-header{--vantelle-header-height:62px}.brand small{display:none}.site-menu,html[dir=rtl] .site-menu{max-height:calc(100dvh - 20px)}.menu-links{grid-template-columns:1fr 1fr;column-gap:24px}.menu-links a,html[dir=rtl] .menu-links a{font-size:22px;min-height:44px}.menu-note{margin-top:8px;padding-top:8px}
}

.gallery-item:target,.motion-card:target{outline:2px solid var(--gold);outline-offset:5px}
@media(max-width:760px), (max-height:500px) and (hover:none) and (pointer:coarse){
 body[data-page=work] .page-intro{padding-block:26px 22px}
 body[data-page=work] .page-intro>.eyebrow{margin-bottom:12px}
 body[data-page=work] .page-intro h1{font-size:35px;line-height:1.16;margin-bottom:16px}
 body[data-page=work] .page-intro>p:last-child{font-size:14px;line-height:1.8;margin-bottom:0}
 html[dir=rtl] body[data-page=work] .page-intro h1{font-size:32px;line-height:1.4}
 html[dir=rtl] body[data-page=work] .page-intro>p:last-child{font-size:14px;line-height:1.9}
 body[data-page=work] .gallery-media-nav{margin-bottom:16px}
 .films-head{display:block;margin-bottom:22px}.films-head .eyebrow{margin-bottom:10px;font-size:10px}
 .films-head h2{font-size:30px;line-height:1.2;margin-bottom:14px}
 .films-head>p{font-size:14px;line-height:1.8;max-width:none;margin-bottom:0}
 html[dir=rtl] .films-head h2{font-size:29px;line-height:1.4}
 html[dir=rtl] .films-head>p{font-size:14px;line-height:1.9}
}

@media(max-width:760px), (max-height:500px) and (hover:none) and (pointer:coarse){body[data-page=work] #photos{scroll-margin-top:0}}
/* Open the RTL language list into the viewport, rather than past the left edge. */
@media(max-width:760px), (max-height:500px) and (hover:none) and (pointer:coarse){
 html[dir=rtl] .lang-options{left:0;right:auto;direction:rtl;text-align:start}
}
/* Override legacy :root/even-story offsets once; do not add two header gaps. */
:root{scroll-padding-top:var(--vantelle-anchor-gap)}
.project-story,.project-story:nth-child(even),.fabric-panel{scroll-margin-top:0}
body[data-page=work] #videos{scroll-margin-top:0}
/* Previous/next arrows follow the same reading direction as keyboard/swipes. */
html[dir=rtl] #lightboxPrev .previous-arrow{transform:none}
html[dir=rtl] #lightboxNext svg{transform:rotate(180deg)}
