
:root{
  --verde: #1F4A3D;
  --verde-oscuro: #163933;
  --terracota: #B5432E;
  --terracota-hover: #9c3826;
  --mostaza: #D9922B;
  --crema: #FAF6EF;
  --crema-2: #F3EEE3;
  --texto: #26312C;
  --texto-suave: #5C685F;
  --borde: #E5DFD1;
  --blanco: #FFFFFF;

  --font-display: 'Montserrat', 'Trebuchet MS', sans-serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 24px;
  --shadow-card: 0 8px 24px rgba(31, 74, 61, .08);
  --container-w: 1200px;
}

*, *::before, *::after{ box-sizing: border-box; }

/* ---------- Buscador ---------- */
.search-panel{
  background: var(--blanco);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-card);
  padding: 15px 16px 7px 28px;
  display: flex;
  align-items: center;
  gap: 32px;
  transform: translateY(40px);
  flex-wrap: wrap;
  margin-top: -59px;
  
  width: 95%;

  border-radius: 23px;
  border: 1px solid #ccc; /* Borde gris claro */
  box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.2); /* Sombra gris difuminada */
  
}
.search-field{ flex: 1 1 320px; min-width: 260px; }
.search-field label{
  display: block;
  font-family: var(--font-display);
  font-size: 21px;
  font-weight: 600;
  color: var(--verde-oscuro);
  margin-bottom: 12px;
}
.search-input-row{
  display: flex;
  align-items: center;
  border: 1.5px solid var(--borde);
  border-radius: 999px;
  padding: 6px 6px 6px 20px;
}
.search-input-row input{
  flex: 1;
  border: none;
  outline: none;
  background: transparent;
  font-family: var(--font-body);
  font-size: 14.5px;
  color: var(--texto);
}
.search-input-row input::placeholder{ color: #9AA39B; }
.search-btn{
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: none;
  background: var(--verde);
  color: var(--blanco);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex-shrink: 0;
  transition: background-color .15s ease;
}
.search-btn:hover{ background: var(--terracota); }

.search-quicklinks{
  display: flex;
  gap: 28px;
  flex-wrap: wrap;
}
.quicklink{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--texto);
  text-align: center;
}
.quicklink svg{ color: var(--verde); }
.quicklink:hover{ color: var(--terracota); }
.quicklink:hover svg{ color: var(--terracota); }
