/* Shared, fluid layout. Decorative 3D transforms stay in hero.css. */
:root{--max:1240px;--gutter:clamp(18px,3vw,36px);--section-space:clamp(40px,5vw,64px)}
html{scroll-padding-top:24px}
body{overflow-x:clip}
.hero-inner,.projects,.about,.cta-section,footer{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter)}
.site-nav{height:80px;gap:20px}
.hero-content{padding-top:28px}
.hero-topline{gap:16px}
.portrait-stage{height:300px;margin:30px 0 18px}
.hero-portrait{height:360px;max-width:100%;object-fit:contain}
.portrait-stage::before{max-width:100%}
.portrait-stage .hero-title{bottom:4px;font-size:clamp(52px,12.6vw,148px);line-height:1.05}
.title-word{max-width:100%}
.hero-bottom{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:32px;padding:24px 0}
.hero-description h2{font-size:clamp(30px,3.6vw,46px);margin-bottom:16px}
.hero-description p{margin-bottom:20px}
.hero-art{min-width:0;max-width:340px}
.scene-3d{height:250px}
.sphere-hover{scale:.86}
.scene-3d::before{width:250px;height:250px}
.orbit-dot{animation-name:satellite-mobile}
.business-proof{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr) minmax(0,1.1fr) auto;gap:24px;padding:20px 0}
.proof-primary strong{font-size:46px}
.projects{padding-block:var(--section-space)}
.projects-head{display:block;margin-bottom:28px}
.projects h2{font-size:clamp(34px,4.8vw,60px);margin-top:14px;line-height:1.06}
.grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.card{margin-bottom:0}
.card h3{font-size:clamp(21px,2vw,24px)}
.about{padding-block:var(--section-space);grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:start}
.about h2{font-size:clamp(34px,4.5vw,56px);line-height:1.05}
.about p{margin-bottom:0}
.about-motion{height:120px;margin-top:24px;gap:24px}
.about-cube{flex-shrink:0}
.skills-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.skill{min-width:0;gap:10px;padding:14px 12px;height:auto;min-height:64px}
.skill b{font-size:14px;overflow-wrap:anywhere}
.skill span{font-size:9px}
.cta-section{padding-bottom:var(--section-space)}
.ctabox{padding:clamp(22px,3.2vw,40px);grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;align-items:center}
.ctabox h2{font-size:clamp(34px,4.8vw,64px);line-height:1.02}
.ctalinks{min-width:0}
.ctalinks a{gap:12px;padding:12px 14px;font-size:13px;min-width:0}
.ctalinks a span:first-child{min-width:0;overflow-wrap:anywhere}
.ctalinks a span:last-child{flex-shrink:0}
footer{gap:16px;padding-top:22px;padding-bottom:30px;line-height:1.5}
@media(min-width:621px) and (max-width:1000px){
 .nav-links{gap:20px}.portrait-stage{height:270px}.hero-portrait{height:320px}
 .hero-bottom{gap:24px}.hero-description p{font-size:13px}.hero-art{max-width:280px}
 .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 22px}
 .about{gap:28px}.skills-grid{grid-template-columns:1fr}.skill{min-height:54px}
 .ctabox{grid-template-columns:1fr;gap:28px}.ctalinks{display:grid;grid-template-columns:1fr}
 .business-proof{grid-template-columns:1.2fr 1fr 1fr;gap:18px}.proof-scroll{display:none!important}
}
@media(max-width:620px){
 body{padding-bottom:calc(72px + env(safe-area-inset-bottom,0px))}
 html{scroll-padding-top:18px}
 .site-nav{height:72px;gap:12px}.nav-links{display:none}.nav-contact{gap:12px}
 .hero-content{padding-top:22px}.hero-topline{flex-direction:column;align-items:flex-start;gap:12px}
 .portrait-stage{height:235px;margin:28px 0 16px}.hero-portrait{height:270px}
 .portrait-stage .hero-title{font-size:clamp(38px,13vw,80px);bottom:16px}
 .hero-divider{font-size:8px;gap:12px;line-height:1.5;padding-top:12px}
 .hero-bottom{grid-template-columns:1fr;gap:18px;padding:24px 0 20px}
 .hero-description h2{font-size:clamp(29px,7.8vw,40px);margin-bottom:14px}
 .hero-description p{font-size:13px;line-height:1.65;margin-bottom:20px;max-width:440px}
 .hero-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 .button-primary,.button-secondary{font-size:11px;padding:0 12px;gap:8px;min-height:48px}
 .hero-art{width:100%;max-width:280px;margin-top:0}.scene-3d{height:190px}
 .sphere-hover{scale:.64}.scene-3d::before{width:180px;height:180px}
 .orbit-dot{animation-name:satellite-compact}.hero-cube{top:16px;right:12px}
 .art-caption{padding:0 4px;gap:12px;font-size:7px;line-height:1.5;margin-top:5px}
 .business-proof{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 14px;padding:20px 0}
 .proof-primary{grid-column:1/-1;justify-content:flex-start;padding-bottom:18px;gap:16px}
 .proof-primary strong{font-size:46px}.proof-primary span{font-size:11px}
 .proof-item b{font-size:11px;line-height:1.4}.proof-item span{font-size:10px;line-height:1.5}
 .projects-head{margin-bottom:24px}.projects h2,.about h2{font-size:clamp(32px,8.5vw,44px)}
 .grid{grid-template-columns:minmax(0,1fr);gap:32px}.card{margin:0}
 .about{grid-template-columns:minmax(0,1fr);gap:30px}.about h2{margin-bottom:16px}
 .about p{font-size:14px}.about-motion{height:104px;margin-top:18px}
 .skills-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.skill{min-height:66px;flex-direction:column;align-items:flex-start;justify-content:center;gap:7px}
 .skill b{font-size:13px}.skill span{font-size:8px}
 .ctabox{grid-template-columns:minmax(0,1fr);gap:24px;padding:24px 18px}
 .ctabox h2{font-size:clamp(32px,8.8vw,48px)}.ctalinks a{font-size:12px;min-height:52px;padding:12px}
 footer{flex-direction:column;gap:7px;font-size:10px;padding-bottom:24px}
 .mobilebar{bottom:0;left:0;right:0;padding:6px 10px calc(6px + env(safe-area-inset-bottom,0px));border-bottom:0;grid-template-columns:repeat(3,minmax(0,1fr))}
 .mobilebar a{font-size:10px;letter-spacing:.04em;min-width:0}
}
@keyframes satellite-compact{from{transform:rotate(0deg) translateX(90px) rotate(0deg)}to{transform:rotate(360deg) translateX(90px) rotate(-360deg)}}