*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#f4efe6;color:#2b2621;font-family:'Space Grotesk',system-ui,sans-serif;-webkit-font-smoothing:antialiased}
::selection{background:#c96442;color:#f4efe6}
a{color:inherit;text-decoration:none}
button{font:inherit}

@keyframes wmRise{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
.wm-rise{opacity:0;animation:wmRise .9s cubic-bezier(.2,.7,.2,1) forwards}
.wm-d1{animation-delay:.05s}.wm-d2{animation-delay:.18s}.wm-d3{animation-delay:.31s}.wm-d4{animation-delay:.44s}
.wm-card{transition:transform .4s cubic-bezier(.2,.7,.2,1),box-shadow .4s}
.wm-card:hover{transform:translateY(-6px);box-shadow:0 22px 50px rgba(80,50,30,.14)}
.wm-link{position:relative}
.wm-link::after{content:"";position:absolute;left:0;bottom:-3px;height:1.5px;width:0;background:#c96442;transition:width .3s}
.wm-link:hover::after{width:100%}
.wm-btn{transition:transform .25s,background .25s,color .25s}
.wm-btn:hover{transform:translateY(-2px)}
.wm-exp{transition:background .3s}
.wm-exp:hover{background:#efe7d8}
.wm-arrow{transition:transform .35s}
.wm-card:hover .wm-arrow{transform:translate(4px,-4px)}

/* Layout hooks — propriedades que mudam em breakpoints vivem aqui, não inline */
.nav-links{margin-left:auto;display:flex;align-items:center;gap:32px;font-size:14.5px;color:#6b6259}
.hero-title{font-family:'Instrument Serif',serif;font-weight:400;font-size:88px;line-height:1.02;letter-spacing:-1px;margin:0;max-width:1000px}
.stats-row{display:flex;gap:64px;flex-wrap:wrap}
.stat-num{font-family:'Instrument Serif',serif;font-size:60px;color:#c96442;line-height:1}
.card-grid-eg{display:grid;grid-template-columns:1.15fr 1fr}
.card-grid-ph{display:grid;grid-template-columns:1fr 1.15fr}
.card-body{padding:44px 46px}
.about-grid{display:grid;grid-template-columns:1fr 1.4fr;gap:56px}
.exp-item{display:grid;grid-template-columns:auto 1fr auto;gap:28px;padding:28px 20px;border-bottom:1px solid rgba(0,0,0,.08);align-items:start}
.exp-stack{font-family:'JetBrains Mono',monospace;font-size:11px;color:#a89478;text-align:right;max-width:150px}
.skills-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.contact-title{font-family:'Instrument Serif',serif;font-weight:400;font-size:72px;line-height:1.05;margin:0;max-width:800px}

/* ===== Responsivo ===== */
@media (max-width:960px){
  .card-grid-eg,.card-grid-ph{grid-template-columns:1fr}
  .card-grid-ph .card-media{order:-1}
  .about-grid{grid-template-columns:1fr;gap:24px}
  .skills-grid{grid-template-columns:repeat(2,1fr)}
  .exp-item{grid-template-columns:1fr;gap:10px}
  .exp-stack{text-align:left;max-width:none}
  .hero-title{font-size:clamp(48px,8.5vw,88px)}
  .contact-title{font-size:clamp(40px,8vw,72px)}
}
@media (max-width:640px){
  .hero-title{font-size:clamp(40px,11vw,56px)}
  .contact-title{font-size:clamp(34px,10vw,48px)}
  .skills-grid{grid-template-columns:1fr}
  .stats-row{gap:36px}
  .stat-num{font-size:44px}
  .card-body{padding:30px 24px}
  .nav-links{gap:16px;font-size:13.5px}
  .nav-links a[data-i18n="navAbout"],.nav-links a[data-i18n="navExp"]{display:none}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .wm-rise{animation:none;opacity:1}
  .wm-card,.wm-btn,.wm-arrow,.wm-link::after,.wm-exp{transition:none}
  .wm-card:hover,.wm-btn:hover{transform:none}
}