*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0;background:#4A3E33}
body{-webkit-font-smoothing:antialiased}
a{color:#FFFFFF;text-decoration:none}
a:hover{color:#FFC145}
:focus-visible{outline:2px solid #FF8A00;outline-offset:3px}
img{max-width:none}

.hero-heading{background:linear-gradient(180deg,#D8C7B2 0%,#FFFFFF 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}

@keyframes introWord{0%{opacity:0;transform:scale(.98)}12%{opacity:1;transform:scale(1)}30%{opacity:1;transform:scale(1)}42%{opacity:0;transform:scale(1.01)}100%{opacity:0}}
@keyframes introMark{0%,38%{opacity:0;transform:scale(.96)}52%{opacity:1;transform:scale(1)}74%{opacity:1;transform:scale(1)}88%{opacity:0;transform:scale(1.02)}100%{opacity:0}}
@keyframes introVeil{0%,74%{opacity:1;visibility:visible}100%{opacity:0;visibility:hidden}}

@media (max-width:820px){
  header{flex-wrap:wrap;justify-content:center !important;gap:10px 16px !important}
  header a{font-size:.8rem !important}
  [data-lang-toggle]{padding:5px 12px !important}
  h1.hero-heading{font-size:8.8vw !important}
  [data-hero-face]{width:min(80vw,58svh) !important;bottom:clamp(56px,11vh,96px) !important}
  [data-hero-copy] p{max-width:none !important;font-size:.78rem !important}
  [data-marquee-row]>div{width:248px !important;height:160px !important}
  #servicios > div > div{gap:16px !important;padding:24px 0 !important}
  #servicios span[style*="140px"]{width:1.4em !important;font-size:2.6rem !important}
  [data-card-wrap]{position:static !important;height:auto !important;margin-bottom:20px}
  [data-card]{transform:none !important;border-radius:28px !important;padding:14px !important;gap:16px !important}
  [data-card] > div:first-child > span{font-size:2.6rem !important}
  [data-proj-grid]{height:auto !important;flex-direction:column !important}
  [data-proj-grid] > div{flex:none !important;width:100% !important}
  [data-proj-grid] > div > div{flex:none !important;height:150px !important;border-radius:20px !important}
  [data-proj-grid] > div > div > div{flex:1 1 0 !important;height:150px !important;border-radius:20px !important}
  [data-proj-grid] > div > div[data-proj-row]{height:auto !important}
  [data-brief-panel]{padding:20px !important;border-radius:24px !important}
}

@media (prefers-reduced-motion: reduce){
  [data-intro]{display:none !important}
  *,*::before,*::after{animation-duration:.01ms !important;transition-duration:.01ms !important;scroll-behavior:auto !important}
}

/* ---- hover / focus states (were style-hover / style-focus in the design source) ---- */
.nav-link:hover{opacity:.7}
.lang-toggle-btn:hover{background:rgba(255,255,255,.12)}
.btn-pill:hover{background:#EDE3D6}
.icon-btn:hover{background:rgba(255,255,255,.12)}
.chip:hover{background:rgba(255,255,255,.1)}
.social-link:hover{color:#FF4D1C}
.field-underline:focus{border-bottom-color:#FFFFFF}
.field-box:focus{border-color:#FFFFFF}
.footer-link:hover{color:#FF4D1C}