@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&family=Playfair+Display:wght@500&display=swap');
*{box-sizing:border-box;}
body{margin:0;background:#2A2521;font-family:"Poppins",sans-serif;color:#F4F0E8;}
.wrap{max-width:1400px;margin:0 auto;padding:24px;}
.navbox{border:0.5px solid #4A433C;border-radius:16px;padding:22px 40px;display:flex;justify-content:space-between;align-items:center;position:sticky;top:24px;background:#2A2521;z-index:10;}
.navbox .logo{color:#F4F0E8;font-size:24px;font-weight:700;text-decoration:none;}
.links{display:flex;gap:40px;font-size:15px;color:#B5AFA5;align-items:center;}
.navlink{color:inherit;text-decoration:none;}
.links .active{background:#3D362F;color:#F4F0E8;font-weight:500;padding:8px 18px;border-radius:8px;}

.page{max-width:1100px;margin:0 auto;padding:80px 24px;min-height:50vh;}
h1.title{font-family:"Playfair Display",serif;font-weight:500;font-size:44px;margin:0 0 40px;color:#F4F0E8;}
.divider{max-width:1100px;margin:0 auto;border:none;border-top:0.5px solid #46403A;}

/* Trayectoria */
.rowA{display:flex;align-items:center;gap:60px;}
.placeholder{width:340px;height:260px;flex-shrink:0;border-radius:12px;background:linear-gradient(135deg,#3D362F,#4A433C);display:flex;align-items:center;justify-content:center;color:#7C7368;font-size:13px;text-align:center;border:0.5px dashed #5C564E;}
.txtA{flex:1;font-size:16px;line-height:1.75;color:#A39C90;}
.txtA strong{color:#F4F0E8;font-weight:500;}

/* Empresas */
.companies{display:flex;gap:32px;}
.card{flex:1;background:#332C26;border-radius:12px;padding:32px;border:0.5px solid #46403A;}
.card img{width:100%;border-radius:8px;margin-bottom:20px;display:block;}
.card h3{font-family:"Playfair Display",serif;font-weight:500;font-size:22px;margin:0 0 12px;color:#F4F0E8;}
.card p{font-size:15px;line-height:1.65;color:#A39C90;margin:0 0 16px;}
.card a{color:#C98756;font-size:14px;text-decoration:none;font-weight:500;}

/* Contacto */
.contact{display:flex;gap:60px;}
.contact-form{flex:1.3;display:flex;flex-direction:column;gap:16px;}
.contact-form input,.contact-form textarea{background:#332C26;border:0.5px solid #46403A;border-radius:8px;padding:14px 16px;color:#F4F0E8;font-family:"Poppins",sans-serif;font-size:15px;}
.contact-form textarea{min-height:110px;resize:vertical;}
.contact-form button{background:#7C8C5C;color:#22241A;border:none;border-radius:24px;padding:14px 28px;font-size:15px;font-weight:500;cursor:pointer;align-self:flex-start;}
.honeypot{position:absolute;left:-9999px;}
.social{flex:0.5;display:flex;flex-direction:column;gap:28px;justify-content:center;align-items:center;}
.social a{color:#A39C90;font-size:14px;text-decoration:none;display:flex;flex-direction:column;align-items:center;gap:8px;}
.social .icon{width:40px;height:40px;border-radius:10px;background:#332C26;border:0.5px solid #46403A;display:flex;align-items:center;justify-content:center;}
.social .icon svg{width:20px;height:20px;}

/* Hero (solo Home) */
.hero{display:flex;align-items:center;justify-content:center;padding:158px 20px 70px;gap:225px;position:relative;min-height:460px;max-width:1300px;margin:0 auto;}
.txt{flex-shrink:0;width:480px;}
h1.name{font-family:"Playfair Display",serif;font-weight:500;font-size:68px;color:#F4F0E8;margin:0 0 14px;line-height:1.05;white-space:nowrap;text-align:justify;text-align-last:justify;}
.tag{font-size:16px;letter-spacing:3px;color:#C98756;font-weight:500;margin:0 0 26px;white-space:nowrap;text-align:justify;text-align-last:justify;}
.pitch{font-size:17px;line-height:1.7;color:#A39C90;margin:0;text-align:justify;text-align-last:justify;}
.photo-wrap{width:310px;flex-shrink:0;position:relative;display:flex;justify-content:center;align-items:flex-end;height:400px;align-self:flex-end;}
.glow{position:absolute;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle, rgba(120,105,85,0.6) 0%, rgba(120,105,85,0) 72%);bottom:20px;}
.photo-wrap img{position:relative;width:100%;display:block;-webkit-mask-image:linear-gradient(to bottom, black 78%, transparent 100%);mask-image:linear-gradient(to bottom, black 78%, transparent 100%);}

footer{max-width:1100px;margin:0 auto;padding:40px 24px 60px;color:#7C7368;font-size:13px;}

/* Blog */
.blog-card{display:flex;gap:28px;margin-bottom:44px;padding-bottom:44px;border-bottom:0.5px solid #46403A;text-decoration:none;color:inherit;}
.blog-card img{width:180px;height:130px;object-fit:cover;border-radius:10px;flex-shrink:0;}
.blog-card .noimg{width:180px;height:130px;border-radius:10px;background:#332C26;flex-shrink:0;}
.blog-card h2{font-family:"Playfair Display",serif;font-weight:500;font-size:22px;margin:0 0 8px;color:#F4F0E8;}
.blog-card .fecha{font-size:13px;color:#C98756;margin:0 0 10px;}
.blog-card p{font-size:15px;color:#A39C90;margin:0;line-height:1.6;}
.post-body{max-width:760px;margin:0 auto;}
.back-link{font-size:14px;color:#A39C90;text-decoration:none;}
.post-title{font-family:"Playfair Display",serif;font-weight:500;font-size:38px;margin:24px 0 8px;line-height:1.15;}
.post-fecha{font-size:14px;color:#C98756;margin:0 0 32px;}
.post-img{width:100%;border-radius:12px;margin:24px 0;}
.post-body p{font-size:17px;line-height:1.8;color:#D8D2C6;margin:0 0 20px;}

/* ==================== RESPONSIVE ==================== */
@media (max-width: 900px) {
  .navbox{padding:16px 20px;flex-wrap:wrap;gap:12px;}
  .links{gap:18px;font-size:13px;flex-wrap:wrap;}
  .links .active{padding:6px 12px;}

  .hero{flex-direction:column-reverse;gap:32px;padding:40px 16px 40px;max-width:100%;}
  .txt{width:100%;max-width:100%;text-align:center;}
  h1.name{font-size:11vw;white-space:normal;text-align:center;text-align-last:center;line-height:1.1;}
  .tag{font-size:3.4vw;white-space:normal;text-align:center;text-align-last:center;letter-spacing:1.5px;}
  .pitch{font-size:15px;text-align:center;text-align-last:center;max-width:440px;margin:0 auto;}
  .photo-wrap{width:220px;height:280px;align-self:center;}
  .glow{width:210px;height:210px;}

  .page{padding:48px 20px;}
  h1.title{font-size:30px;}
  .rowA{flex-direction:column;gap:28px;}
  .placeholder{width:100%;height:220px;}
  .companies{flex-direction:column;gap:24px;}
  .contact{flex-direction:column;gap:36px;}
  .social{flex-direction:row;justify-content:center;}
  .blog-card{flex-direction:column;}
  .blog-card img,.blog-card .noimg{width:100%;height:180px;}
}

@media (max-width: 480px) {
  h1.name{font-size:12.5vw;}
  .tag{font-size:3.8vw;}
  .navbox span.logo, .navbox .logo{font-size:20px;}
  .links{gap:12px;font-size:12px;}
}
