.display-title{font-size:clamp(49px,calc(20.706px + 7.255vw),160px); line-height:.94; letter-spacing:-.04em; font-weight:500;}
.section-label,.chapter-tags,.canvas-caption,.window-bar,.screen-caption > span,.footer-columns h3,.contact-status > span{font-family:var(--font-ui); font-size:12px; line-height:1.4; letter-spacing:.01em;}
.section-label{display:block; text-transform:uppercase;}
.work-chapters{position:relative;}
.chapters-viewport{position:relative; overflow:hidden;}
.chapter-track{width:100%;}
.work-chapter{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:5vw; min-height:calc(100svh - var(--nav-height)); padding:48px var(--gutter) 80px;}
.chapter-copy{min-width:0; display:flex; flex-direction:column; align-items:flex-start; justify-content:center;}
.chapter-copy .display-title{margin:28px 0 36px; font-size:clamp(49px,min(calc(20.706px + 7.255vw),15.4svh),160px);}
.chapter-copy > p{max-width:440px; font-size:clamp(20px,1.25vw,24px); line-height:1.15; letter-spacing:-.03em;}
.chapter-tags{display:flex; flex-wrap:wrap; gap:12px 28px; margin-top:32px; text-transform:uppercase;}
.chapter-media{min-width:0; display:flex; flex-direction:column; justify-content:center; gap:20px;}
.work-mosaic{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); grid-template-rows:repeat(4,minmax(0,1fr)); height:min(74svh,780px); min-height:420px; overflow:hidden;}
.work-mosaic .media-tile.work-frame{position:relative; min-width:0; min-height:0; width:auto!important; height:auto!important; transform:none!important; clip-path:none!important; border-radius:0; --clip-x:0px; --clip-y:0px; --frame-scale:1; will-change:auto;}
.media-tile .tile-cover{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.media-tile.work-local-image{background:#111111;}
.work-local-image .tile-cover{object-fit:contain; object-position:center; user-select:none; -webkit-touch-callout:none;}
.work-local-image[data-image-focus="yono-phone"] .tile-cover{object-position:60% 50%;}
.media-tile.work-logo-video{background:#142850; color:#fff;}
.work-video-art{--work-logo-scale:2.2; position:absolute; inset:0; overflow:hidden;}
.work-video-art :is(video,[data-video-poster]){position:absolute; left:50%; top:50%; display:block; width:auto; height:100%; transform:translate(-50.677083%,-48.148148%) scale(var(--work-logo-scale)); transform-origin:50.677083% 48.148148%;}
.work-video-art video{opacity:0;}
.work-video-art [data-video-poster]{z-index:1; pointer-events:none;}
.work-logo-video[data-video-ready="true"] video{opacity:1;}
.work-logo-video[data-video-ready="true"] [data-video-poster]{opacity:0;}
.work-logo-video[data-video-clip="autotechnic-web"]{background:#161616;}
.work-logo-video[data-video-clip="coke"]{background:#161616;}
.work-logo-video[data-video-clip="autotechnic-web"] :is(video,[data-video-poster]){inset:0; width:100%; height:100%; object-fit:cover; object-position:center; transform:none;}
.work-logo-video[data-video-clip="coke"] :is(video,[data-video-poster]){inset:0; width:100%; height:100%; object-fit:cover; object-position:center; transform:none;}
.work-logo-video[data-video-phase="fade"] video{opacity:0; transition-duration:600ms;}
@media (max-width:991px){.work-video-art{--work-logo-scale:2.1;}
.work-logo-video[data-video-clip="autotechnic-web"] :is(video,[data-video-poster]){object-position:68% 50%;}
}
@media (prefers-reduced-motion:reduce){.work-video-art video{transition:none;}
}
.work-mosaic[data-work-mosaic="screen"] .work-frame:nth-child(1){grid-area:1 / 1 / 3 / 3;}
.work-mosaic[data-work-mosaic="screen"] .work-frame:nth-child(2){grid-area:1 / 3 / 3 / 5;}
.work-mosaic[data-work-mosaic="screen"] .work-frame:nth-child(3){grid-area:3 / 1 / 5 / 3;}
.work-mosaic[data-work-mosaic="screen"] .work-frame:nth-child(4){grid-area:3 / 3 / 5 / 5;}
.chapter-banner{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); min-height:calc(100svh - var(--nav-height));}
.banner-art{position:relative; min-width:0; min-height:720px; overflow:hidden;}
.green-canvas{--canvas-color:var(--surface); background-color:var(--canvas-color);}
.green-canvas{background-image:linear-gradient(to right,var(--line) 1px,transparent 1px),linear-gradient(to bottom,var(--line) 1px,transparent 1px); background-size:32px 32px;}
.customer-phone{position:absolute; inset:12% 16% 20%; display:flex; align-items:center; justify-content:center; transform-origin:center;}
.customer-phone img{display:block; width:auto; height:100%; max-width:100%; object-fit:contain;}
.green-canvas .customer-caption{left:16px; right:16px; max-width:none; text-align:center; background:transparent;}
#ritane-title .ritane-wordmark{width:auto; height:.95em; max-width:100%; margin:0 0 .12em;}
.canvas-caption{position:absolute; bottom:24px; left:16px; right:auto; max-width:calc(100% - 32px); padding:6px 8px; z-index:1; font-size:11px; color:var(--ink); background:var(--canvas-color);}
.banner-copy{min-width:0; padding:72px var(--gutter) 72px 8.8vw; color:white; background:var(--ink); display:flex; flex-direction:column; align-items:flex-start; justify-content:center;}
.banner-copy .display-title{font-size:clamp(49px,min(calc(20.706px + 7.255vw),15.4svh),160px);}
.banner-copy .section-label{margin-bottom:36px;}
.banner-copy .display-title{margin-bottom:52px;}
.banner-copy > p{font-size:clamp(22px,1.46vw,28px); line-height:1.08; letter-spacing:-.025em;}
.light-link{display:inline-flex; align-items:center; gap:18px; min-height:44px; max-width:100%; margin-top:38px; padding:8px 0; border-bottom:1px solid currentColor; font-family:var(--font-ui); font-size:18px; line-height:1.3;}
.light-link svg{flex:none;}
.feature-canvas{--main-top:clamp(280px,18vw,350px); --main-height:clamp(380px,28vw,540px); --secondary-top:clamp(680px,40vw,770px); --secondary-height:clamp(340px,30vw,500px); position:relative; min-height:calc(var(--secondary-top) + var(--secondary-height) + 96px);}
.feature-copy{width:50%; padding:110px var(--gutter) 0;}
.feature-copy .display-title{margin-bottom:52px;}
.feature-copy > p{font-size:clamp(22px,1.25vw,24px); line-height:1.15; letter-spacing:-.03em; max-width:440px;}
.ritane-context{max-width:440px;}
.feature-copy .ritane-context{margin-top:32px;}
.ritane-context h3{margin:0 0 12px; font-size:clamp(27px,2.1vw,40px); line-height:1.12; font-weight:500; letter-spacing:-.025em;}
.ritane-context p{font-size:clamp(18px,1.05vw,20px); line-height:1.5; letter-spacing:-.01em; color:var(--muted);}
.ritane-advisor-copy{position:absolute; left:50.6%; width:40%; top:calc(var(--main-top) + var(--main-height) + 64px);}
.media-window{position:relative; min-width:0; overflow:hidden; border-radius:12px; background:var(--surface);}
.feature-main{position:absolute; left:50.6%; width:40%; top:var(--main-top); height:var(--main-height);}
.admin-preview{height:calc(100% - 44px); display:flex; flex-direction:column; background-color:var(--surface); background-image:linear-gradient(to right,var(--line) 1px,transparent 1px),linear-gradient(to bottom,var(--line) 1px,transparent 1px); background-size:32px 32px;}
.admin-screen{flex:1; min-height:0; display:flex; align-items:center; justify-content:center; padding:24px 8%;}
.admin-screen img{display:block; width:100%; height:auto; max-height:100%; object-fit:contain; object-position:center; border-radius:8px; box-shadow:0 10px 24px rgb(0 0 0 / .13);}
.admin-caption{flex:none; display:flex; flex-direction:column; gap:12px; padding:20px;}
.admin-caption strong{font-size:clamp(25px,2.2vw,42px); line-height:1; font-weight:500; letter-spacing:-.03em;}
.admin-caption > span{font-family:var(--font-ui); font-size:11px; line-height:1.4;}
.feature-secondary{position:absolute; left:9.5%; width:23.5%; top:var(--secondary-top); height:var(--secondary-height);}
.window-bar{height:44px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:12px; padding:0 20px; text-transform:uppercase; background:#e7e7e7; font-size:11px;}
.window-dots{font-family:Arial,Helvetica,sans-serif; font-size:20px; letter-spacing:1px; line-height:1;}
.screen-placeholder{height:calc(100% - 44px); position:relative; background-color:var(--surface); background-image:linear-gradient(to right,#dfdfdf 1px,transparent 1px),linear-gradient(to bottom,#dfdfdf 1px,transparent 1px); background-size:32px 32px;}
.screen-caption{position:absolute; bottom:20px; left:20px; right:20px; display:flex; flex-direction:column; gap:12px;}
.screen-caption strong{font-size:clamp(25px,2.2vw,42px); line-height:1; font-weight:500; letter-spacing:-.03em;}
.screen-caption > span{font-size:11px;}
.sa-mockup{position:absolute; inset:6% 12% 28%; display:flex; align-items:center; justify-content:center;}
.sa-mockup img{display:block; width:auto; height:100%; max-width:100%; object-fit:contain;}
.light-link:active{color:var(--yellow);}
.studio-manifesto{padding:120px var(--gutter) 160px; display:grid; grid-template-columns:1.4fr 1fr; gap:7vw; align-items:end;}
.studio-manifesto .section-label{margin-bottom:36px;}
.studio-manifesto .display-title{font-size:clamp(64px,6.6vw,128px);}
.studio-body > p{font-size:clamp(28px,2.1vw,40px); letter-spacing:-.03em; line-height:1.1;}
.studio-body > .studio-approach{margin-top:24px; max-width:46ch; font-size:clamp(18px,1.25vw,22px); line-height:1.45; letter-spacing:-.02em;}
.studio-disciplines{display:grid; grid-template-columns:1fr 1fr; gap:8px 20px; margin-top:40px;}
.studio-disciplines a{font-family:var(--font-ui); font-size:16px; min-height:44px; display:flex; align-items:center;}
.full-footer{padding:clamp(72px,6vw,104px) var(--gutter) 40px; background:var(--surface);}
.contact-intro{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px; align-items:end;}
.contact-intro .display-title{grid-column:span 2; font-size:clamp(56px,6.5vw,124px);}
.contact-status{min-width:0;}
.contact-logo{display:block; width:160px; height:auto; margin-bottom:24px;}
.contact-status > p{display:flex; margin:16px 0 8px;}
.contact-status > span:last-child{display:block; max-width:300px; color:var(--muted); font-size:12px;}
.footer-columns{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px; margin-top:64px; padding-top:32px; border-top:1px solid var(--line);}
.footer-columns > div{min-width:0;}
.footer-work-links{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:20px;}
.footer-columns h3{font-size:12px; font-weight:400; text-transform:uppercase; margin:0 0 16px;}
.footer-columns a{min-height:44px; display:flex; align-items:center; gap:8px; font-family:var(--font-ui); font-size:14px; line-height:1.35;}
.footer-columns svg{flex:none; width:14px; height:14px;}
.footer-columns a > span{font-size:11px; color:var(--muted);}
@media (hover: hover) and (pointer: fine){.studio-disciplines a:hover,.footer-columns a:hover{color:var(--interactive);}
.light-link:hover{color:var(--yellow);}
}
@media (max-width:1100px){.banner-copy{padding:64px 32px;}
.banner-art{min-height:620px;}
.feature-canvas{min-height:1136px;}
.feature-copy{padding-top:88px;}
.feature-main{left:49%; width:47%; top:300px; height:400px;}
.ritane-advisor-copy{left:49%; width:47%; top:764px;}
.feature-secondary{left:5%; width:33%; top:650px; height:390px;}
.studio-manifesto{gap:40px;}
}
@media (max-width:991px){.display-title{font-size:clamp(49px,calc(20.706px + 7.255vw),94px); line-height:.98;}
.work-chapters,.work-chapters[data-enhanced="true"]{height:auto;}
.work-chapters[data-enhanced="true"] .chapters-viewport{position:relative; top:0; height:auto;}
.chapter-track,.work-chapters[data-enhanced="true"] .chapter-track{display:block; width:100%; transform:none!important; will-change:auto;}
.work-chapter,.work-chapters[data-enhanced="true"] .work-chapter{width:100%; height:auto; min-height:0; display:grid; grid-template-columns:1fr; gap:40px; padding:64px var(--gutter);}
.chapter-copy .display-title{font-size:clamp(49px,calc(20.706px + 7.255vw),94px); margin:24px 0 32px;}
.chapter-copy > p{font-size:23px; max-width:360px;}
.chapter-tags{margin-top:28px; font-size:11px;}
.work-mosaic{min-height:0; height:125vw; max-height:700px;}
.chapter-banner{grid-template-columns:1fr; min-height:0;}
.banner-art{min-height:0; height:min(110vw,760px);}
.banner-copy{padding:64px var(--gutter);}
.banner-copy .section-label{font-size:11px; margin-bottom:28px;}
.banner-copy .display-title{font-size:clamp(49px,calc(20.706px + 7.255vw),94px); margin-bottom:36px;}
.banner-copy > p{font-size:25px;}
.canvas-caption{bottom:20px; left:var(--gutter); right:var(--gutter); font-size:11px;}
.light-link{font-size:17px; margin-top:28px;}
.feature-canvas{display:flex; flex-direction:column; min-height:0; padding:64px var(--gutter) 80px; gap:40px;}
.feature-copy{width:100%; padding:0;}
.feature-copy .display-title{font-size:clamp(49px,calc(20.706px + 7.255vw),94px); margin-bottom:32px;}
.feature-copy > p{font-size:23px;}
.ritane-advisor-copy{position:static; width:85%; margin-left:7%;}
.feature-main{position:relative; inset:auto; width:100%; height:370px; transform:none!important;}
.feature-secondary{position:relative; inset:auto; width:78%; height:390px; margin-left:7%; transform:none!important;}
.media-window{border-radius:8px;}
.window-bar{font-size:11px; padding:0 12px; gap:8px;}
.window-dots{font-size:16px;}
.screen-caption{left:16px; right:16px; bottom:16px;}
.screen-caption strong,.admin-caption strong{font-size:27px;}
.admin-caption{padding:16px;}
.screen-caption > span{font-size:11px;}
.studio-manifesto{padding:64px var(--gutter) 80px; grid-template-columns:1fr; gap:40px;}
.studio-manifesto .section-label{font-size:11px; margin-bottom:24px;}
.studio-manifesto .display-title{font-size:clamp(48px,12.5vw,72px);}
.studio-body > p{font-size:28px;}
.studio-disciplines{margin-top:28px; gap:4px 12px;}
.full-footer{padding:56px var(--gutter) 32px;}
.contact-intro{grid-template-columns:1fr; gap:32px;}
.contact-intro .display-title{grid-column:auto; font-size:clamp(40px,12.2vw,64px);}
.contact-logo{width:116px; margin-bottom:20px;}
.contact-status > p{margin:12px 0 8px;}
.footer-columns{grid-template-columns:1fr 1fr; margin-top:40px; padding-top:28px; gap:28px 20px;}
.footer-work{grid-column:1/-1;}
.footer-columns h3{font-size:11px; margin-bottom:12px;}
.footer-columns a{font-size:14px;}
.screen-caption > span,.contact-status > span:last-child{font-size:12px;}
}
@media (prefers-reduced-motion:reduce), (max-height:650px){.work-chapters,.work-chapters[data-enhanced="true"]{height:auto;}
.work-chapters[data-enhanced="true"] .chapters-viewport{position:relative; top:0; height:auto;}
.chapter-track,.work-chapters[data-enhanced="true"] .chapter-track{display:block; width:100%; transform:none!important; will-change:auto;}
.work-chapter,.work-chapters[data-enhanced="true"] .work-chapter{width:100%; height:auto; min-height:700px;}
.feature-main,.feature-secondary{transform:none!important;}
}
@media (prefers-reduced-motion:reduce) and (max-width:991px), (max-height:650px) and (max-width:991px){.work-chapter,.work-chapters[data-enhanced="true"] .work-chapter{min-height:0;}
}
