
/* Preserve the reference composition and motion, refine the finishing details. */
:root{--studio-muted:#b7a9b2}
body{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body .landing-intro h1{max-width:540px;line-height:1.07;text-wrap:balance;letter-spacing:.025em}
body .landing-intro h2{margin-bottom:12px}
body .about-me p{line-height:1.35;letter-spacing:.01em;text-wrap:pretty}
body .what-content-in p{line-height:1.7;max-width:45ch}
body .what-tags{line-height:1.35}
body .career-info-box p{line-height:1.75;text-wrap:pretty}
body .work-project-description{line-height:1.75;text-wrap:pretty}
body .work-project-logo{object-fit:contain}
body .work-project-logo-wrap{border:1px solid #ff4d5f20}
body .contact-flex{gap:clamp(26px,4vw,70px)}
body .contact-box{min-width:0}
body .contact-box p{line-height:1.7;max-width:28ch}
body .contact-social{padding:10px 0;border-bottom-color:#ffffff30;transition:color .25s,border-color .25s}
body .contact-social:hover{border-color:var(--accentColor)}
body .navbar-connect{font-size:12px;letter-spacing:.12em}
body .header ul a{padding:12px 0;display:inline-block}
a:focus-visible,button:focus-visible,[role="button"]:focus-visible{outline:2px solid var(--accentColor);outline-offset:7px;border-radius:2px}
body .what-content:focus-visible{outline-offset:-3px}
body .studio-skip{position:fixed;left:16px;top:-90px;z-index:2147483647;padding:12px 18px;background:var(--accentColor);color:#100a0d;border-radius:5px}
body .studio-skip:focus{top:12px}
@media(min-width:1025px){body .landing-intro h1{max-width:clamp(250px,23vw,390px);font-size:clamp(34px,4.3vw,66px);line-height:1.08}body .landing-intro h2{font-size:clamp(20px,2vw,30px)}body .about-me p{font-size:clamp(23px,2vw,32px)}}
@media(min-width:768px) and (max-width:1024px){body .landing-intro h1{max-width:370px;font-size:40px}body .navbar-connect{display:none}}
@media(max-width:767px){body .landing-intro h1{max-width:250px;font-size:clamp(26px,7.6vw,38px);line-height:1.08}body .landing-intro h2{font-size:17px;letter-spacing:.08em;margin-bottom:9px}body .navbar-connect{display:none}body .about-me p{font-size:clamp(20px,5.7vw,28px);line-height:1.4;letter-spacing:0}body .about-me h3{letter-spacing:.16em;margin-bottom:22px}body .contact-flex{gap:35px}body .contact-box h2{font-size:19px;line-height:1.45}body .contact-box h5{font-size:14px;margin-top:20px}body .work-project-card{gap:28px;padding:30px 0}body .work-project-visual{min-height:260px}body .work-project-info{min-width:0}body .work-project-heading h3{overflow-wrap:anywhere}body .contact-social{min-height:44px}body .header ul{gap:20px}body .what-content-in p{font-size:14px}}
@media(hover:none),(pointer:coarse){body .cursor-main{display:none!important}body a,body button{touch-action:manipulation}}
@media(prefers-reduced-motion:reduce){body .loading-marquee,body .loaderGame-in,body .loaderGame-ball{animation:none!important}body .what-content-in,body .what-content:before,body .what-content:after,body .what-corner:before,body .what-corner:after{animation-duration:.01s!important;animation-delay:0s!important}body .work-project-logo-wrap{transition:none}}

body .portfolio-book-intro{font-size:14px;line-height:1.8;max-width:590px;opacity:.7;margin:20px 0 25px}body .portfolio-book-frame{height:720px;border-radius:14px;overflow:hidden}body .portfolio-book-note{font-size:11px;line-height:1.7;opacity:.5;margin:15px 0 0}@media(max-width:1024px){body .portfolio-book-frame{height:660px}}@media(max-width:700px){body .portfolio-book-frame{height:580px}body .portfolio-book-intro{font-size:12px;margin:15px 0}body .portfolio-book-note{font-size:10px}}

.no-webgl .what-box-in{display:flex!important}.no-webgl .about-section{opacity:1!important}.no-webgl .character-container{display:none}

.services-price-link{display:block;width:fit-content;font:500 12px/1.4 Manrope,sans-serif;letter-spacing:1px;margin-top:30px;padding:14px 20px;border:1px solid #ff4d6370;border-radius:4px;color:#ff6175;pointer-events:auto}.services-price-link:hover{background:#ff4d6318}.services-price-link:focus-visible{outline:2px solid #ff4d63;outline-offset:5px}

/* Consistent finishing layer across the main studio page. */
body{-webkit-font-smoothing:antialiased}body .landing-intro h1{text-wrap:balance}body .what-content-in p,body .contact-box p{color:#c6b9c1}body .contact-social{min-height:48px}body .services-price-link{font-size:12px;letter-spacing:.07em;padding:17px 24px;border-radius:7px;transition:background .2s,box-shadow .2s,transform .2s}body .services-price-link:hover{transform:translateY(-2px);box-shadow:0 10px 30px #ff4d6312}body .portfolio-book-frame{border:1px solid #ff4d6325;box-shadow:0 20px 70px #0002}body .header ul a{transition:color .2s}body .header ul a:hover{color:#ff6175}body .contact-box h5{overflow-wrap:anywhere}body .what-content{scroll-margin-top:100px}@media(max-width:767px){body .services-price-link{min-height:48px;font-size:11px;padding:16px 20px}body .header ul{gap:16px}body .header ul a{font-size:11px;min-height:44px}body .portfolio-book-frame{border-radius:9px}body .contact-box p{font-size:14px;line-height:1.8}body .contact-social{padding:14px 0}body .portfolio-book-intro{font-size:13px;line-height:1.8}}

body .navbar-title{display:flex;align-items:center;line-height:1}body .navbar-title img{width:64px;height:60px;object-fit:contain;display:block}body .work-project-logo{max-width:90%;max-height:90%;object-fit:contain}@media(max-width:767px){body .navbar-title img{width:48px;height:46px}}

.mobile-menu-toggle{display:none}
@media(max-width:767px){
 html,body{max-width:100%;overflow-x:clip}
 body .header{position:fixed!important;top:0!important;left:0!important;transform:none!important;width:100%!important;max-width:none!important;height:76px!important;margin:0!important;padding:10px 6%!important;display:flex!important;align-items:center!important;justify-content:space-between!important;background:rgba(16,10,13,.94);border-bottom:1px solid #ffffff12;backdrop-filter:blur(16px);z-index:99999!important}
 body .header .navbar-title{position:static!important;transform:none!important;margin:0!important;display:flex!important;align-items:center!important;width:50px!important;height:52px!important;opacity:1!important}
 body .navbar-title img{width:48px!important;height:48px!important;object-fit:contain}
 body .header .navbar-connect{display:none!important}
 body .mobile-menu-toggle{display:flex;flex-direction:column;justify-content:center;gap:7px;width:48px;height:48px;background:none;border:1px solid #ffffff25;border-radius:50%;padding:13px;color:#eee;cursor:pointer}
 body .mobile-menu-toggle span{display:block;height:1px;width:20px;background:currentColor;transition:transform .2s}
 body .mobile-menu-open .mobile-menu-toggle span:first-child{transform:translateY(4px) rotate(45deg)}body .mobile-menu-open .mobile-menu-toggle span:last-child{transform:translateY(-4px) rotate(-45deg)}
 body .header ul{display:none!important;position:absolute!important;top:76px!important;left:0!important;right:0!important;width:100%!important;padding:18px 6% 24px!important;margin:0!important;transform:none!important;background:#160e13;border-bottom:1px solid #ff4d6330;gap:0!important;align-items:stretch!important;flex-direction:column!important}
 body .header.mobile-menu-open ul{display:flex!important}body .header ul li{margin:0!important;border-bottom:1px solid #ffffff12}body .header ul a{font-size:13px!important;min-height:52px;display:flex!important;align-items:center;padding:15px 0!important}
 body .landing-section{height:100svh!important;min-height:700px;max-height:980px;overflow:hidden}
 body .landing-container{width:88%!important;height:100%!important}
 body .landing-intro{top:110px!important;left:0!important;z-index:20!important;transform:none!important}
 body .landing-intro h2{font-size:17px!important;line-height:1.5!important;letter-spacing:.04em!important;margin-bottom:9px!important}
 body .landing-intro h1{font-size:clamp(32px,8.5vw,44px)!important;line-height:1.08!important;letter-spacing:-.02em!important;max-width:290px!important}
 
 
 
 body .landing-info{left:6%!important;right:auto!important;bottom:30px!important;top:auto!important;transform:none!important;z-index:22!important;max-width:85%}
 body .landing-info h3{font-size:15px!important;line-height:1.4!important;letter-spacing:.07em!important}
 body .landing-info>h2:not(.landing-info-h2){display:none!important}
 body .landing-info .landing-info-h2{margin:5px 0 0!important;font-size:30px!important;line-height:1.2!important;height:38px!important;width:auto!important;letter-spacing:.02em!important}
 body .landing-info .landing-info-h2:after{display:none!important}body .landing-info .landing-h2-1{display:block!important;opacity:1!important;transform:none!important}body .landing-info .landing-h2-2{display:none!important}
 body .landing-circle1{width:180px;height:180px;opacity:.45}body .landing-circle2{display:none!important}
 body .portfolio-book-frame{width:100%!important}body .section-container{max-width:100%}
}
@media(max-width:767px) and (max-height:740px){body .landing-section{min-height:650px}body .landing-intro{top:100px!important}}
@media(max-width:767px){.no-webgl .landing-container:after{content:'';position:absolute;left:12%;right:12%;top:31%;bottom:18%;background:url('/images/sinner-sc-logo.png') center/contain no-repeat;opacity:.7;pointer-events:none}body .mobile-menu-toggle span{flex:none!important;position:static!important;opacity:1!important;visibility:visible!important}}
