@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;500;600&family=Montserrat:wght@300;400;500;600&display=swap');
:root {
  --gold:#c8a45d;
  --black:#080909;
  --cream:#eee9df
}
* {
  box-sizing:border-box;
  margin:0;
  padding:0
}
html {
  scroll-behavior:smooth
}
body {
  background:var(--black);
  color:var(--cream);
  font-family:'Playfair Display',Georgia,serif
}
a {
  color:inherit;
  text-decoration:none
}
.topbar {
  position:absolute;
  z-index:5;
  top:0;
  left:0;
  width:100%;
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:18px 5.5%;
  background:linear-gradient(#090909a8,transparent)
}
.brand {
  font-size:16px;
  letter-spacing:1.5px;
  text-align:center;
  white-space:nowrap
}
.brand small {
  display:block;
  font:8px Montserrat,sans-serif;
  letter-spacing:5px;
  margin-top:6px
}
nav {
  display:flex;
  gap:22px;
  font-size:9px
}
nav a {
  padding-bottom:7px;
  border-bottom:1px solid transparent
}
nav a:hover {
  color:var(--gold);
  border-color:var(--gold)
}
.hero {
  height:min(700px,100vh);
  min-height:540px;
  position:relative;
  display:flex;
  align-items:center
}
.hero-photo {
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,#080909e8 0%,#080909a8 31%,#08090914 72%),linear-gradient(0deg,#08090944,transparent 35%),url("cabra.jpg") center 35%/cover no-repeat
}
.hero-copy {
  position:relative;
  margin-left:5.5%;
  padding-top:45px
}
.gold-line {
  display:block;
  width:24px;
  height:1px;
  background:var(--gold);
  margin-bottom:18px
}
h1 {
  font-size:clamp(42px,6vw,74px);
  font-weight:400;
  line-height:.98;
  letter-spacing:1px
}
h1 em {
  font-style:normal;
  color:var(--gold)
}
.tracking {
  font:10px Montserrat,sans-serif;
  letter-spacing:5px;
  margin:15px 0 22px
}
.hero-copy>p:not(.tracking) {
  font-size:14px;
  line-height:1.6
}
.down {
  display:inline-block;
  color:var(--gold);
  font:32px Montserrat,sans-serif;
  margin-top:25px
}
.categories {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  padding:25px 4%;
  background:#0b0c0c
}
.categories article {
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  border-right:1px solid #34312a;
  gap:7px;
  padding:0 10px
}
.categories article:last-child {
  border:0
}
.categories article span {
  font-size:28px;
  color:var(--gold)
}
.categories b {
  font-size:12px;
  font-weight:400
}
.categories i,.award-cards i {
  font-size:11px;
  color:var(--gold);
  font-style:italic
}
.section {
  padding:48px 5.5%
}
.gallery {
  display:flex;
  justify-content:center;
  align-items:center;
  min-height:320px;
  text-align:center;
  padding:64px 5.5%;
  background:radial-gradient(ellipse at center,#17130d 0%,#090909 70%)
}
.gallery .section-intro {
  width:min(100%,560px);
  margin:0 auto;
  display:flex;
  flex-direction:column;
  align-items:center
}
.gallery .gold-line {
  margin:0 auto 20px
}
.gallery .section-intro h2 {
  margin-bottom:14px
}
.gallery .section-intro p {
  max-width:420px;
  margin:0 auto;
  line-height:1.9
}
.gallery .outline-button {
  margin-top:28px;
  padding:13px 28px;
  border:1px solid var(--gold);
  border-radius:2px;
  letter-spacing:1.5px;
  font-size:10px;
  transition:background .25s,color .25s,transform .25s
}
.gallery .outline-button:hover {
  background:var(--gold);
  color:#090909;
  transform:translateY(-2px)
}
.section-intro h2,.about h2,.contact h2 {
  font-size:31px;
  font-weight:400;
  letter-spacing:2px;
  margin-bottom:10px
}
.section-intro p {
  font-size:12px;
  line-height:1.7;
  color:#d2cec6
}
.outline-button {
  display:inline-block;
  border:1px solid var(--gold);
  padding:10px 17px;
  margin-top:20px;
  color:var(--gold);
  font:9px Montserrat,sans-serif;
  letter-spacing:1px
}
.gallery-grid {
  display:grid;
  grid-template-columns:1.25fr .85fr .85fr;
  grid-template-rows:140px 140px;
  gap:10px
}
.gallery-grid img {
  width:100%;
  height:100%;
  object-fit:cover;
  border:1px solid #292621
}
.gallery-grid>img:first-child {
  grid-row:span 2
}
.gallery-grid>img:nth-of-type(2) {
  grid-row:span 2
}
.stack {
  display:grid;
  grid-template-rows:1fr 1fr;
  gap:10px;
  min-height:290px
}
.gallery-grid>img:nth-of-type(3) {
  grid-column:1;
  grid-row:3
}
.gallery-grid>img:nth-of-type(4) {
  grid-column:2;
  grid-row:3
}
.gallery-grid>img:nth-of-type(5) {
  grid-column:3;
  grid-row:3
}
.gallery-grid>img:nth-of-type(6) {
  grid-column:1;
  grid-row:4
}
.gallery-grid>img:nth-of-type(7) {
  grid-column:2;
  grid-row:4
}
.gallery-grid>img:nth-of-type(8) {
  grid-column:3;
  grid-row:4
}
.awards {
  background:linear-gradient(90deg,#090909e8,#090909a8),url("premios-fondo.jpg") center/cover
}
.wide {
  margin-bottom:18px
}
.wide h2 {
  font-size:30px
}
.award-cards {
  display:grid;
  grid-template-columns:minmax(260px,440px);
  justify-content:center;
  gap:18px
}
.award-cards article {
  border:1px solid #8a7045;
  border-radius:4px;
  padding:10px;
  background:linear-gradient(145deg,#121212,#080808);
  box-shadow:0 12px 30px #0007;
  overflow:hidden;
  text-align:left
}
.award-cards img {
  display:block;
  width:100%;
  height:210px;
  object-fit:cover;
  object-position:center 42%;
  border:1px solid #30291e
}
.award-cards h3 {
  font-size:15px;
  font-weight:400;
  line-height:1.5;
  margin:15px 6px 8px
}
.award-cards i {
  display:block;
  margin:0 6px 10px;
  font-size:12px;
  letter-spacing:.3px
}
.about {
  display:grid;
  grid-template-columns:1.1fr 1fr;
  align-items:center;
  background:#0b0c0c
}
.about>img {
  width:100%;
  height:300px;
  object-fit:cover;
  filter:grayscale(1)
}
.about>div {
  padding:35px 8%
}
.about h2 {
  font-size:26px
}
.about p {
  font-size:12px;
  line-height:1.7;
  color:#d0ccc5;
  margin:12px 0
}
.signature {
  font-size:25px;
  font-style:italic;
  text-align:right;
  color:#d9d4ca;
  margin-top:15px
}
.contact {
  position:relative;
  min-height:245px;
  display:flex;
  justify-content:center;
  align-items:center;
  text-align:center;
  padding:35px 20px;
  background:#090909
}
.contact-content {
  position:relative
}
.contact h2 {
  font-size:26px
}
.contact p {
  font-size:12px;
  line-height:1.6
}
.instagram-button {
  display:inline-flex;
  align-items:center;
  gap:12px;
  border:1px solid #655334;
  padding:12px 20px;
  margin-top:24px;
  text-align:left;
  transition:.25s
}
.instagram-button:hover {
  background:#c8a45d1c;
  border-color:var(--gold)
}
.instagram-icon {
  font:26px Montserrat,sans-serif;
  color:var(--gold)
}
.instagram-button span:last-child {
  font-size:13px
}
.instagram-button small {
  display:block;
  font:10px Montserrat,sans-serif;
  color:var(--gold);
  margin-top:4px
}
footer {
  padding:18px 5%;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  border-top:1px solid #2b271f;
  font-size:12px;
  letter-spacing:2px
}
footer small {
  font:7px Montserrat,sans-serif;
  letter-spacing:4px
}
@media(max-width:760px) {
  .topbar {
    padding:14px 4%;
    flex-direction:column;
    gap:14px
  }
  .brand {
    font-size:13px
  }
  nav {
    justify-content:center;
    flex-wrap:wrap;
    gap:10px 15px;
    font-size:8px
  }
  .hero {
    min-height:600px;
    height:85vh
  }
  .hero-copy {
    margin-left:6%;
    padding-top:100px
  }
  .hero-photo {
    background-position:58% center
  }
  .categories {
    padding:18px 2%;
    grid-template-columns:repeat(2,1fr);
    gap:20px
  }
  .categories article:nth-child(2) {
    border:0
  }
  .gallery {
    grid-template-columns:1fr
  }
  .gallery-grid {
    grid-template-columns:repeat(3,1fr);
    grid-template-rows:130px 130px;
    gap:7px
  }
  .gallery-grid>img:first-child,.gallery-grid>img:nth-of-type(2) {
    grid-row:auto
  }
  .stack {
    min-height:130px
  }
  .award-cards {
    grid-template-columns:1fr
  }
  .award-cards img {
    height:180px
  }
  .about {
    grid-template-columns:1fr
  }
  .about>img {
    height:240px
  }
  .about>div {
    padding:35px 8%
  }
  .section {
    padding:38px 5%
  }
  .contact {
    min-height:300px
  }
}
@media(max-width:760px) {
  .gallery {
    min-height:280px;
    padding:48px 6%
  }
  .award-cards {
    grid-template-columns:minmax(0,1fr);
    max-width:440px;
    margin:0 auto
  }
  .award-cards img {
    height:190px
  }
}
/* GALERÍA — fondo exclusivo de esta sección */

.gallery.section#galeria {
  position:relative;
  isolation:isolate;
  display:flex;
  justify-content:center;
  align-items:center;
  min-height:410px;
  padding:72px 24px;
  overflow:hidden;
  text-align:center;
  background:#090909;
}
.gallery.section#galeria::before {
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  /* Fondo elegante sin fotografía: negro, sombras y matices dorados */
  background:
    radial-gradient(ellipse at 50% 0%,rgba(200,164,93,.13),transparent 55%),
    radial-gradient(ellipse at 0% 100%,rgba(200,164,93,.06),transparent 42%),
    linear-gradient(135deg,#11110f 0%,#080909 48%,#15120d 100%);
}
.gallery.section#galeria::after {
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:
    linear-gradient(90deg,rgba(7,7,7,.18),rgba(7,7,7,.04) 50%,rgba(7,7,7,.18)),
    linear-gradient(0deg,rgba(7,7,7,.22),rgba(7,7,7,.04));
  pointer-events:none;
}
.gallery.section#galeria .gallery-content {
  position:relative;
  z-index:1;
  width:min(100%,620px);
  margin:0 auto;
}
.gallery.section#galeria .gold-line {
  margin:0 auto 20px
}
.gallery.section#galeria .gallery-kicker {
  margin:0 0 12px;
  color:var(--gold);
  font:10px Montserrat,sans-serif;
  letter-spacing:3px;
  text-transform:uppercase;
}
.gallery.section#galeria h2 {
  margin:0 0 17px;
  font-size:clamp(32px,5vw,46px);
  font-weight:400;
  letter-spacing:2px;
}
.gallery.section#galeria .gallery-description {
  max-width:460px;
  margin:0 auto;
  color:#e1dcd2;
  font-size:13px;
  line-height:1.9;
}
.gallery.section#galeria .outline-button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:16px;
  margin-top:28px;
  padding:14px 22px;
  border:1px solid var(--gold);
  color:var(--gold);
  background:rgba(8,9,9,.35);
  font:10px Montserrat,sans-serif;
  letter-spacing:1.4px;
  transition:background .25s,color .25s,transform .25s;
}
.gallery.section#galeria .outline-button:hover {
  color:#090909;
  background:var(--gold);
  transform:translateY(-2px);
}
.gallery.section#galeria .gallery-handle {
  margin:14px 0 0;
  color:#c9c0b1;
  font:10px Montserrat,sans-serif;
  letter-spacing:1.5px;
}
@media(max-width:760px) {
  .gallery.section#galeria {
    min-height:370px;
    padding:58px 20px
  }
  .gallery.section#galeria .gallery-description {
    font-size:12px
  }
  .gallery.section#galeria .outline-button {
    padding:13px 16px;
    gap:11px;
    font-size:9px
  }
}
/* Foto del concurso: conservar proporción y evitar estiramiento */

.award-cards img,

.award-card img,

.recognition img,

.recognition-card img,

.awards img {
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  image-rendering:auto;
}
.award-cards,

.award-card,

.recognition,

.recognition-card {
  overflow:hidden;
}
/* Corrección de tarjeta de reconocimiento: imagen y texto visibles */

.award-cards article {
  display:flex;
  flex-direction:column;
  min-width:0;
  height:auto;
}
.award-cards article img {
  display:block;
  width:100%;
  height:210px;
  max-height:210px;
  flex:0 0 210px;
  object-fit:contain;
  object-position:center;
  background:#0a0a0a;
}
.award-cards article h3 {
  display:block;
  height:auto;
  margin:14px 6px 8px;
  color:var(--cream);
  line-height:1.5;
  overflow:visible;
}
.award-cards article i {
  display:block;
  margin:0 6px 12px;
}
.categories article span {
  display:block;
  min-height:30px;
  line-height:1;
  font-size:27px;
  color:var(--gold);
}
/* Contacto: enlaces y datos actualizados */

.contact a[href^="mailto:"], .contact a[href^="tel:"] {
  color:inherit;
  text-decoration:none;
}
.contact a[href^="mailto:"]:hover, .contact a[href^="tel:"]:hover {
  color:var(--gold);
}
/* Contacto: distribución profesional para email, teléfono e Instagram */

.contact-links {
  display:flex;
  justify-content:center;
  align-items:stretch;
  gap:0;
  margin:26px auto 0;
  max-width:980px;
}
.contact-link {
  display:flex;
  align-items:center;
  gap:13px;
  padding:10px 24px;
  text-align:left;
  border-right:1px solid #40382b;
  min-width:0;
}
.contact-link:last-child {
  border-right:0
}
.contact-symbol {
  color:var(--gold);
  font:26px Montserrat,sans-serif;
  line-height:1;
}
.contact-link>span:last-child {
  font-size:13px
}
.contact-link small {
  display:block;
  margin-top:5px;
  color:#c7bda9;
  font:10px Montserrat,sans-serif;
  overflow-wrap:anywhere;
}
.contact-link:hover {
  color:var(--gold)
}
.categories article:nth-child(2)>span,

.categories article:nth-child(3)>span {
  font-size:26px;
}
@media(max-width:760px) {
  .contact-links {
    flex-direction:column;
    align-items:stretch;
    max-width:340px
  }
  .contact-link {
    border-right:0;
    border-bottom:1px solid #40382b;
    padding:13px 10px
  }
  .contact-link:last-child {
    border-bottom:0
  }
}
/* Iconografía coherente con el acabado negro y dorado */

.categories .category-icon {
  display:block;
  min-height:30px;
  color:var(--gold);
  font-family:Georgia,"Times New Roman",serif;
  font-size:26px;
  line-height:1;
  font-style:normal;
  filter:none;
}
.contact-link .instagram-mark {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:27px;
  height:27px;
  flex:0 0 27px;
  color:var(--gold);
}
.contact-link .instagram-mark svg {
  width:25px;
  height:25px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.6;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.contact-link .instagram-mark .instagram-dot {
  fill:currentColor;
  stroke:none
}
