@font-face {
  font-family: 'SolacheDisplay';
  src: url('assets/latin.woff2') format('woff2');
  font-weight: 400 800;
  font-display: swap;
}

:root{
  --dark: #38383B;
  --orange: #CC7D3D;
  --orange-2: #C9812F;
  --text-dark: #1A1A1A;
  --muted: #6b6b6b;
}

*{box-sizing:border-box; margin:0; padding:0;}
body{
  font-family: 'SolacheDisplay', 'Trebuchet MS', sans-serif;
  color: var(--text-dark);
  background:#fff;
}
a{text-decoration:none; color:inherit;}
img{max-width:100%; display:block;}

/* NAVBAR */
.navbar{
  background: var(--dark);
  position: sticky; top:0; z-index: 50;
}
.navbar-inner{
  max-width:1400px; margin:0 auto;
  display:flex; align-items:center; justify-content:space-between;
  padding: 14px 32px;
}
.brand-logo{height:34px; width:auto;}
.nav-links{display:flex; gap:28px;}
.nav-links a{color:#fff; font-size:15px; opacity:.9;}
.nav-links a:hover{opacity:1; color: var(--orange);}

/* HERO */
.hero{
  position:relative;
  overflow:hidden;
  min-height:560px;
  display:flex; align-items:center;
}
.hero-deco{
  position:absolute; inset:0;
  background-image:
    radial-gradient(circle at 8% 15%, rgba(200,200,200,.15) 0 60px, transparent 62px),
    radial-gradient(circle at 6% 60%, rgba(230,180,140,.18) 0 90px, transparent 92px),
    radial-gradient(circle at 44% 10%, rgba(200,200,200,.15) 0 45px, transparent 47px),
    radial-gradient(circle at 48% 75%, rgba(200,200,200,.15) 0 70px, transparent 72px);
  pointer-events:none;
}
.hero-inner{
  position:relative;
  max-width:1400px; width:100%; margin:0 auto;
  display:flex; align-items:center; justify-content:space-between;
  gap:40px; padding: 40px 32px;
}
.hero-text h1{
  font-size:56px; line-height:1.05; font-weight:800;
  letter-spacing:.5px;
}
.hero-underline{
  display:block; width:220px; height:8px; border-radius:4px;
  background: var(--orange); margin-top:22px;
}
.hero-photo-wrap{
  position:relative; display:flex; align-items:center; gap:24px;
  padding-left:24px;
}
.hero-divider{
  width:2px; align-self:stretch; background:#333; opacity:.7; min-height:520px;
}
.hero-photo{
  width:420px; height:420px; object-fit:cover;
  filter: grayscale(100%);
}

/* SECCIONES */
.secciones{position:relative; padding:70px 32px; overflow:hidden;}
.secciones-bg{
  position:absolute; inset:0;
  background-size:cover; background-position:center;
  opacity:.9;
}
.secciones-inner{position:relative; max-width:1100px; margin:0 auto; text-align:center;}
.secciones-inner h2{font-size:32px; font-weight:700; margin-bottom:50px;}
.secciones-grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:50px 40px;
  justify-items:center;
}
.seccion-item{display:flex; flex-direction:column; align-items:center; gap:14px; width:170px;}
.seccion-item img{width:90px; height:90px; object-fit:contain;}
.seccion-item span{font-weight:600; font-size:15px;}
.seccion-item--offset{grid-column: span 1;}
.secciones-grid > :nth-child(4){grid-column: 1 / 2; margin-left:60px;}
.secciones-grid > :nth-child(5){grid-column: 2 / 3;}

/* BOLETIN */
.boletin{
  position:relative;
  background-size:cover; background-position:center;
  padding:90px 32px;
}
.boletin-overlay{
  position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(20,20,20,.15), rgba(20,20,20,.55));
}
.boletin-inner{
  position:relative; max-width:520px; margin-left:auto; text-align:center;
  color:#fff;
}
.boletin-inner h2{font-size:30px; font-weight:800; margin-bottom:14px;}
.boletin-inner p{font-size:15px; opacity:.95; margin-bottom:26px; line-height:1.5;}
.boletin-form{display:flex; flex-direction:column; gap:14px;}
.boletin-form input{
  padding:14px 16px; border:none; border-radius:4px;
  background:#fff; font-size:14px; color:#333;
}
.boletin-form button{
  margin-top:6px; padding:14px; border:none; border-radius:4px;
  background: var(--orange-2); color:#fff; font-weight:700; font-size:15px;
  cursor:pointer;
}
.boletin-form button:hover{background:#b56f27;}

/* FOOTER */
.footer{background: var(--dark); color:#fff; padding:20px 32px 24px;}
.footer-inner{
  max-width:1400px; margin:0 auto;
  display:flex; align-items:center; gap:40px; flex-wrap:wrap;
}
.footer-btn{
  background: var(--orange-2); color:#fff; font-weight:700;
  padding:10px 20px; border-radius:4px; font-size:14px;
}
.footer-social{display:flex; gap:16px; margin-left:auto;}
.footer-social a{color:#fff; opacity:.9;}
.footer-social a:hover{opacity:1; color:var(--orange);}
.footer-copy{max-width:1400px; margin:16px auto 0; font-size:12px; opacity:.6;}

/* RESPONSIVE */
@media (max-width:900px){
  .hero-inner{flex-direction:column; text-align:center;}
  .hero-photo-wrap{padding-left:0;}
  .hero-divider{display:none;}
  .hero-photo{width:280px; height:280px;}
  .hero-text h1{font-size:40px;}
  .secciones-grid{grid-template-columns:repeat(2,1fr);}
  .secciones-grid > :nth-child(4), .secciones-grid > :nth-child(5){grid-column:auto; margin-left:0;}
  .boletin-inner{margin:0 auto;}
}
@media (max-width:560px){
  .secciones-grid{grid-template-columns:1fr;}
  .navbar-inner{padding:12px 20px;}
}