

/* Responsive upgrade: phone / tablet / desktop */
html{scroll-padding-top:24px}body{width:100%;min-width:0;overflow-x:clip}
*,*::before,*::after{min-width:0}
img,svg,video,canvas{max-width:100%}
.nav a,.lang-picker button,.motion-toggle,.btn{touch-action:manipulation}
@media(max-width:1080px){
  .hero{grid-template-columns:1fr;gap:28px;padding-top:24px}
  .hero-copy{grid-row:1;margin-top:0}
  .visual{grid-row:2;max-width:min(100%,660px);height:580px;margin-inline:auto}
  .grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hero-motion{height:calc(100% - 70px)}
}
@media(max-width:760px){
  header.wrap{display:flex;flex-wrap:wrap;gap:10px 12px;align-items:center;padding-top:14px;padding-bottom:10px}
  header .brand{flex:1 1 auto;max-width:calc(100% - 128px)}
  header .status{display:none}
  header .lang-picker{order:2;margin:0 0 0 auto;flex:0 0 auto}
  header .nav{order:3;display:flex;justify-content:flex-start;flex-wrap:nowrap;width:100%;gap:4px;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin;padding:7px 3px;-webkit-overflow-scrolling:touch}
  header .nav a{flex:0 0 auto;white-space:nowrap;padding:11px 13px;font-size:12px}
  .hero{padding-top:24px;gap:18px}
  .hero h1{font-size:clamp(43px,10.3vw,72px);line-height:1;overflow-wrap:anywhere}
  .hero-copy p{max-width:100%;line-height:1.75}
  .visual{height:540px;width:100%;max-width:510px}
  .hero-motion{top:26px;left:20%;width:62%;height:calc(100% - 86px);object-fit:cover}
  .visual .frame{top:14px;bottom:46px;left:17%;right:14%}
  .visual .float.one{top:45px;left:0}
  .visual .float.two{bottom:84px;right:0}
  .motion-toggle{left:20%;bottom:8px;min-height:42px}
  .grid{grid-template-columns:1fr}
  .services,.process-grid,.client-form{grid-template-columns:1fr}
  .client-form .full{grid-column:auto}
  .portfolio-project .card-visual{height:215px}
  .section{padding:60px 0}
  .contact{padding:24px}
  .heading h2{overflow-wrap:anywhere}
  input,select,textarea{max-width:100%;font-size:16px}
}
@media(max-width:430px){
  .wrap{width:min(100% - 24px,1260px)}
  header .brand{font-size:clamp(14px,4vw,18px);max-width:calc(100% - 108px)}
  header .brand img{max-width:38px;max-height:38px}
  .lang-picker button{min-height:38px;min-width:38px;padding:7px}
  .hero h1{font-size:clamp(38px,10vw,52px);letter-spacing:-.035em}
  .visual{height:460px}
  .hero-motion{left:17%;width:68%;top:20px;height:calc(100% - 73px)}
  .visual .frame{left:14%;right:12%;top:12px;bottom:35px}
  .visual .float.one{left:-2%;top:48px;max-width:145px;padding:8px}
  .visual .float.two{right:-1%;bottom:77px;max-width:142px;padding:8px}
  .visual .float strong{font-size:9px}
  .visual .float small{font-size:8px}
  .visual .pixel{font-size:clamp(24px,9vw,38px);right:0;top:0}
  .motion-toggle{left:17%;bottom:2px}
  .stripe{white-space:normal;line-height:1.7}
  .project-subtitle{min-height:0}
  .card-body{padding:18px}
  .portfolio-project h3{font-size:22px}
  .phone-showcase{transform:rotate(-5deg) scale(.9)}
  .security-ui{width:95%}
}
@media(prefers-reduced-motion:reduce){.visual .scan{animation:none!important}}


/* Transparent PNG logo: no added tile, clipping, or glow box */
.brand img{width:56px;height:56px;object-fit:contain;border-radius:0;box-shadow:none;background:transparent;filter:drop-shadow(0 0 7px rgba(155,117,255,.24))}
