/* One native SVG composition in each bar. Outlines contain no raster backdrop. */
.logo.brand{--brand-width:500px;display:block;position:relative;width:var(--brand-width);height:auto;aspect-ratio:760/176;flex:0 0 var(--brand-width);line-height:1;letter-spacing:0}
.brand-art{display:block;width:100%;height:auto;aspect-ratio:760/176;max-width:none;overflow:visible}
.site-header .nav{height:148px;gap:26px}
.hero>.container{padding-top:144px}
.site-header .desktop-nav{gap:20px}
.site-header .desktop-nav a{font-size:13px}
html{scroll-padding-top:162px}
.footer-v11-main{display:grid;grid-template-columns:minmax(0,430px) minmax(180px,1fr) auto 43px;gap:36px;align-items:center}
.footer-v11-main .logo.brand{--brand-width:430px;max-width:100%;width:100%}
.footer-v11-main>p{order:0;width:auto;line-height:1.8}
.footer-v11-main>a:nth-last-child(2){margin-left:0}
.footer-up{margin-left:0}
@media(max-width:1200px){
 .site-header .desktop-nav,.site-header .nav-cta{display:none}
 .site-header .menu-btn{display:flex;margin-left:auto}
 .site-header .mobile-menu{display:grid;position:absolute;top:148px;left:20px;right:20px;padding:14px;background:rgba(7,25,25,.98);border:1px solid rgba(112,235,195,.24);border-radius:14px;box-shadow:0 20px 45px rgba(0,0,0,.4);backdrop-filter:blur(23px);opacity:0;visibility:hidden;transform:translateY(-7px);transition:opacity .25s,transform .25s,visibility .25s}
 .site-header .mobile-menu.open{opacity:1;visibility:visible;transform:none}
 .site-header .mobile-menu a{font-size:14px;padding:14px;border-bottom:1px solid var(--line)}
 .site-header .mobile-menu a:last-child{border-bottom:0;color:var(--mint)}
 .footer-v11-main{grid-template-columns:minmax(0,380px) minmax(140px,1fr) auto 43px;gap:24px}
 .footer-v11-main .logo.brand{--brand-width:380px}
}
@media(max-width:900px) and (min-width:761px){
 .footer-v11-main{grid-template-columns:minmax(0,1fr) 43px;gap:24px}
 .footer-v11-main .logo.brand{--brand-width:380px;width:min(380px,100%);grid-column:1}
 .footer-v11-main>p{grid-row:2;grid-column:1}
 .footer-v11-main>a:nth-last-child(2){grid-row:3;grid-column:1}
 .footer-up{grid-row:1;grid-column:2}
}
@media(max-width:760px){
 .site-header .nav{width:calc(100% - 32px);height:110px;position:relative;gap:0}
 .site-header .logo.brand{--brand-width:450px;width:min(450px,calc(100% - 56px));max-width:calc(100% - 56px);flex:0 1 auto}
 .site-header .menu-btn{position:absolute;right:0;top:28px;width:40px;height:40px;margin:0;z-index:1}
 .site-header .mobile-menu{top:110px;left:12px;right:12px}
 .hero>.container{padding-top:136px}
 html{scroll-padding-top:124px}
 .footer-v11-main{display:grid;grid-template-columns:minmax(0,1fr) 43px;gap:22px}
 .footer-v11-main .logo.brand{--brand-width:430px;width:min(430px,100%);grid-column:1/-1;justify-self:start}
 .footer-v11-main>p{order:0;width:auto;grid-row:2;grid-column:1}
 .footer-v11-main>a:nth-last-child(2){order:0;margin:0;grid-row:3;grid-column:1}
 .footer-up{grid-row:2;grid-column:2}
}

/* Additional ways to reach the studio, within the existing contact block. */
.contact-v11-details{display:flex;flex-wrap:wrap;gap:9px 18px;max-width:330px;margin-top:18px;font-size:14px;line-height:1.6}
.contact-v11-details a{color:#d1e8d7;white-space:nowrap}
.contact-v11-details a:hover{color:var(--mint)}
@media(max-width:360px){.contact-v11-copy .telegram-contact{gap:12px}.contact-v11-copy .telegram-mark{flex:0 0 36px;width:36px;height:36px;font-size:20px}.contact-v11-copy .telegram-contact strong{font-size:18px}}

/* Viewport layouts for the process and formats sections. */
:root{--section-bar-height:148px}
#process{min-height:calc(100svh - var(--section-bar-height));padding-block:clamp(32px,6svh,72px);display:flex;align-items:center;scroll-margin-top:-14px}
#process>.container{flex:none}
.site-header.is-process-section{background:#071011;transition:box-shadow .3s}
#pricing{scroll-margin-top:-14px}
.footer-v11-bottom .text-link{margin-left:auto}
@media(min-width:761px){
 #pricing{--format-space:clamp(8px,calc((100svh - 600px)*.065),24px);padding-top:var(--format-space);padding-bottom:calc(var(--format-space) + clamp(36px,5.6svh,56px));min-height:calc(100svh - var(--section-bar-height))}
 #pricing>.container{min-height:calc(100svh - var(--section-bar-height) - 2 * var(--format-space));display:grid;grid-template-rows:auto minmax(min-content,1fr) auto}
 #pricing .ux-heading{gap:32px;margin-bottom:var(--format-space)}
 #pricing .ux-kicker{font-size:10px;margin-bottom:clamp(8px,1.5svh,16px)}
 #pricing h2{font-size:clamp(30px,4.7svh,48px);line-height:1.08}
 #pricing .ux-heading>p{font-size:13px;line-height:1.6;max-width:310px;margin-bottom:0}
 #pricing .format-card{padding:clamp(12px,1.8svh,22px) 20px}
 #pricing .format-tag{font-size:9px;line-height:1.45}
 #pricing .format-card h3{font-size:clamp(22px,3.1svh,30px);line-height:1.15;margin:clamp(8px,1.4svh,16px) 0 8px}
 #pricing .format-card>p{font-size:clamp(12px,1.5svh,14px);line-height:1.55;min-height:0}
 #pricing .format-scope{padding:clamp(8px,1.4svh,18px) 0;margin-top:4px}
 #pricing .format-scope strong{font-size:14px;line-height:1.4;margin-bottom:4px}
 #pricing .format-scope span{font-size:11px;line-height:1.45}
 #pricing .format-card ul{padding:clamp(8px,1.6svh,18px) 0;margin:auto 0}
 #pricing .format-card li{font-size:clamp(12px,1.5svh,14px);line-height:1.4;margin-bottom:clamp(4px,.8svh,8px);gap:8px}
 #pricing .format-card li:last-child{margin-bottom:0}
 #pricing .format-card>p.format-price{font-size:11px;line-height:1.4;margin:0 0 8px}
 #pricing .format-card .ux-button{min-height:42px;padding:10px 14px;font-size:12px;line-height:1.4}
 #pricing .format-card>small{font-size:10px;line-height:1.45;margin-top:10px;min-height:29px}
 #pricing .format-help{padding-top:clamp(12px,1.8svh,20px);gap:24px}
 #pricing .format-help p,#pricing .format-help .text-link{font-size:12px;line-height:1.5}
}
@media(min-width:761px) and (max-width:1000px){
 #pricing .ux-heading{display:flex;gap:24px}
 #pricing .ux-heading>div{flex:1}
 #pricing h2{font-size:clamp(30px,3.8vw,36px)}
 #pricing .ux-heading>p{flex:0 0 240px;max-width:240px;font-size:12px;margin:0}
 #pricing .format-grid{gap:12px}
 #pricing .format-card{padding:14px}
 #pricing .format-card h3{font-size:24px}
 #pricing .format-card>p,#pricing .format-card li{font-size:13px}
 #pricing .format-card>small{min-height:43.5px}
}
@media(max-width:760px){
 :root{--section-bar-height:110px}
 #process{padding-block:40px}
 #pricing{padding-block:40px}
}