:root{
  /* ---- Paleta extraída de la fotografía (campo dorado + mastín) ---- */
  --ink:#17140f;
  --charcoal:#221e17;
  --charcoal-2:#2c2619;
  --olive:#4d451f;
  --gold:#a68a54;
  --gold-light:#d7c092;
  --rust:#7c5a30;
  --parchment:#efe8d6;
  --parchment-2:#e7dec6;
  --ink-soft:#4a4436;

  --display:'Cormorant', serif;
  --label:'Cormorant SC', serif;
  --body:'Jost', sans-serif;

  --wrap: 1180px;
}

*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
html, body{ height:100%; }
body{
  font-family:var(--body);
  background:var(--charcoal);
  color:var(--parchment-2);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
ul{list-style:none;}
section{position:relative;}
.wrap{max-width:var(--wrap); margin:0 auto; padding:0 32px;}

h1,h2,h3,h4{font-family:var(--display); font-weight:600; letter-spacing:.01em;}
.eyebrow{
  font-family:var(--label);
  font-size:15px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--gold);
}
.eyebrow::before{content:"— "; }
.eyebrow::after{content:" —"; }
.eyebrow-inline{font-size:13px; letter-spacing:.12em; color:var(--gold-light); text-transform:none;}
.eyebrow-inline::before, .eyebrow-inline::after{content:"";}

:focus-visible{outline:2px solid var(--gold); outline-offset:3px;}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important;}
}

/* ================= NAV ================= */
header.site-nav{
  position:fixed; top:0; left:0; right:0; z-index:100;
  background:rgba(23,20,15,.72);
  backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(166,138,84,.25);
  transition:background .4s ease, padding .4s ease;
  padding:14px 0;
}
header.site-nav.scrolled{
  background:rgba(23,20,15,.94);
  padding:8px 0;
}
.nav-inner{display:flex; align-items:center; justify-content:space-between; gap:24px;}
.brand{display:flex; align-items:center;}
.brand-logo{height:56px; width:auto; transition:height .3s ease;}
header.site-nav.scrolled .brand-logo{height:44px;}
footer .brand-logo{height:64px;}

nav.main-links{display:flex; gap:28px;}
nav.main-links a{
  font-family:var(--label); font-size:14px; letter-spacing:.13em; text-transform:uppercase;
  color:var(--parchment-2); position:relative; padding:4px 0;
}
nav.main-links a::after{
  content:""; position:absolute; left:0; bottom:0; width:0; height:1px; background:var(--gold);
  transition:width .3s ease;
}
nav.main-links a:hover::after, nav.main-links a:focus-visible::after{width:100%;}
nav.main-links a[aria-current="page"]{color:var(--gold-light);}
nav.main-links a[aria-current="page"]::after{width:100%;}

.nav-toggle{
  display:none; background:none; border:1px solid var(--gold); color:var(--parchment);
  width:42px; height:36px; border-radius:2px; cursor:pointer; position:relative;
}
.nav-toggle span, .nav-toggle span::before, .nav-toggle span::after{
  content:""; position:absolute; left:10px; right:10px; height:1px; background:var(--gold-light);
}
.nav-toggle span{top:17px;}
.nav-toggle span::before{top:-6px;}
.nav-toggle span::after{top:6px;}

@media (max-width:900px){
  nav.main-links{
    position:fixed; top:0; right:-100%; height:100vh; width:min(78vw,340px);
    background:var(--ink); flex-direction:column; justify-content:center; gap:26px;
    padding:40px; transition:right .4s ease; box-shadow:-10px 0 40px rgba(0,0,0,.4);
  }
  nav.main-links.open{right:0;}
  .nav-toggle{display:block;}
}

/* ================= HERO (Inicio) ================= */
.hero{
  min-height:100svh; display:flex; align-items:flex-end;
  background:
    linear-gradient(90deg, rgba(15,13,9,.75) 0%, rgba(15,13,9,.35) 42%, rgba(15,13,9,.15) 68%),
    linear-gradient(180deg, rgba(17,15,10,.15) 0%, rgba(15,13,9,.55) 78%, rgba(13,11,8,.85) 100%),
    url('assets/hero-dog.jpg') center 28% / cover no-repeat;
  padding-bottom:80px;
}
.hero-inner{width:100%; text-align:left; max-width:520px;}
.hero .eyebrow{color:var(--gold-light); font-size:14px;}
.hero h1{
  font-size:clamp(32px, 5vw, 58px); color:var(--parchment); font-style:italic; font-weight:600;
  line-height:1.05; margin-top:12px;
}
.hero-subtitle{
  font-family:var(--label); font-size:13px; letter-spacing:.42em; text-transform:uppercase;
  color:var(--gold); opacity:.85; margin-top:16px; padding-top:16px;
  border-top:1px solid rgba(166,138,84,.35); width:fit-content;
}

@media (max-width:640px){
  .hero{
    background:
      linear-gradient(180deg, rgba(15,13,9,.2) 0%, rgba(15,13,9,.45) 55%, rgba(13,11,8,.92) 100%),
      url('assets/hero-dog.jpg') 78% 22% / cover no-repeat;
    align-items:flex-end;
    padding-bottom:56px;
  }
  .hero-subtitle{letter-spacing:.32em; margin-top:12px; padding-top:12px;}
}

/* Otras páginas: pequeño respiro bajo el nav fijo */
.page-hero{padding-top:150px;}

/* ================= SECTION SCAFFOLDING ================= */
.section{padding:110px 0; border-top:1px solid rgba(166,138,84,.14);}
.section:first-of-type{border-top:none;}
.section.dark{background:var(--charcoal); color:var(--parchment);}
.section.dark .ink-soft{color:var(--parchment-2);}
.section-head{text-align:center; max-width:640px; margin:0 auto 62px;}
.section-head h2{font-size:clamp(34px,4.2vw,48px); margin-top:10px; font-style:italic; color:var(--parchment);}

/* ================= SOBRE NOSOTROS ================= */
.about-copy{max-width:760px; margin:0 auto; text-align:center; font-size:18px; color:var(--parchment-2);}

.team-grid{
  margin-top:70px; display:grid; grid-template-columns:repeat(3,1fr); gap:44px;
}
.team-card{text-align:center;}

/* ================= MARCO FOTOGRÁFICO (elemento distintivo) ================= */
.frame{
  position:relative; aspect-ratio:4/5; margin:0 auto 22px; max-width:260px;
  border:1px solid var(--gold); padding:10px;
}
.frame::before{
  content:""; position:absolute; inset:6px; border:1px solid rgba(166,138,84,.55); pointer-events:none;
}
.frame-corner{position:absolute; width:16px; height:16px; border:1px solid var(--gold); z-index:2;}
.frame .frame-corner.tl{top:-1px; left:-1px; border-right:none; border-bottom:none;}
.frame .frame-corner.tr{top:-1px; right:-1px; border-left:none; border-bottom:none;}
.frame .frame-corner.bl{bottom:-1px; left:-1px; border-right:none; border-top:none;}
.frame .frame-corner.br{bottom:-1px; right:-1px; border-left:none; border-top:none;}
.frame-media{width:100%; height:100%; overflow:hidden; background:var(--olive); position:relative;}
.frame-media img{width:100%; height:100%; object-fit:cover;}
/* Fotos del equipo: prioriza la parte superior del encuadre para no cortar la cabeza en retratos */
.team-card .frame-media img{object-position:center 15%;}
.placeholder-fallback{
  position:absolute; inset:0; display:none; align-items:center; justify-content:center; flex-direction:column; gap:10px;
  background:linear-gradient(160deg, var(--olive), var(--ink));
}
.placeholder-fallback svg{width:34px; height:34px; opacity:.55; color:var(--gold-light);}
.placeholder-fallback span{
  font-family:var(--label); font-size:11.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--gold-light); opacity:.75;
}

.team-card h3{font-size:26px; font-style:italic; color:var(--parchment);}
.team-card .role{display:block; margin:4px 0 14px;}
.team-card p.bio{font-size:15.5px; color:var(--parchment-2); max-width:320px; margin:0 auto;}

/* ================= FICHA DE EJEMPLAR (Machos / Hembras) ================= */
.dog-panels{margin-top:20px;}
.back-link{
  display:inline-block; margin-bottom:36px; font-family:var(--label); font-size:14px;
  letter-spacing:.1em; text-transform:uppercase; color:var(--gold-light);
  border-bottom:1px solid var(--gold); padding-bottom:2px;
}
.back-link:hover{color:var(--parchment);}
.dog-panel{
  display:grid; grid-template-columns:300px 1fr; gap:48px;
  padding:56px 0; border-bottom:1px solid rgba(166,138,84,.25);
}
.dog-panel:first-child{padding-top:0;}
.dog-panel:last-child{border-bottom:none;}
.dog-panel-media .frame{max-width:none;}
.thumb-row{display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:10px;}
.thumb .frame{aspect-ratio:1/1; max-width:none; padding:4px;}
.thumb .frame::before{inset:3px;}
.thumb .placeholder-fallback span{display:none;}
.thumb .placeholder-fallback svg{width:20px; height:20px;}

.dog-panel-info h3{font-size:34px; font-style:italic; margin:6px 0 22px; color:var(--ink);}
.section.dark .dog-panel-info h3{color:var(--parchment);}

.specs-box{
  display:grid; gap:0; margin-bottom:26px; border-top:1px solid rgba(166,138,84,.3);
}
.spec-row{
  display:grid; grid-template-columns:200px 1fr; gap:16px; padding:11px 0;
  border-bottom:1px solid rgba(166,138,84,.2); font-size:15px;
}
.spec-row .label{font-family:var(--label); letter-spacing:.1em; text-transform:uppercase; color:var(--gold); font-size:13px;}
.spec-row .value{color:var(--parchment-2);}
.section.dark .spec-row .value{color:var(--parchment-2);}

.desc-block{margin-bottom:26px;}
.desc-block .eyebrow{display:block; margin-bottom:10px;}
.editable-note{font-size:15.5px; font-style:italic; color:var(--parchment-2); max-width:60ch;}
.section.dark .editable-note{color:var(--parchment-2);}

.titles-block .eyebrow{display:block; margin-bottom:12px;}
.titles-list{display:grid; gap:8px;}
.titles-list li{font-size:14.5px; color:var(--gold-light);}
.section.dark .titles-list li{color:var(--parchment-2);}
.titles-list li strong{color:var(--rust); font-family:var(--display); font-style:italic; font-size:16px;}
.section.dark .titles-list li strong{color:var(--gold-light);}
.titles-list .ev, .titles-list .yr{opacity:.85; font-size:13px;}
.titles-empty .muted{opacity:.65; font-style:italic;}

@media (max-width:760px){
  .dog-panel{grid-template-columns:1fr;}
  .spec-row{grid-template-columns:1fr; gap:2px;}
}

/* ================= INFORMACIÓN TÉCNICA: estándar FCI completo ================= */
.standard-meta{
  text-align:center; font-family:var(--label); font-size:13px; letter-spacing:.12em;
  color:var(--gold-light); text-transform:uppercase; margin-top:-30px; margin-bottom:60px; opacity:.75;
}
.standard-quote{
  max-width:640px; margin:0 auto 50px; text-align:center; font-style:italic;
  font-size:19px; color:var(--parchment-2); font-family:var(--display); line-height:1.5;
}
.tech-subsection{margin-top:74px;}
.tech-subsection:first-of-type{margin-top:0;}
.tech-subsection-head{margin-bottom:34px; text-align:center;}
.tech-subsection-head h3{font-size:27px; font-style:italic; color:var(--parchment);}
.tech-subsection-head .eyebrow{display:block; margin-bottom:8px;}

.temperamento-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:2px; background:rgba(166,138,84,.3); margin-top:10px;}
.temperamento-item{display:flex; gap:14px; align-items:flex-start; background:var(--charcoal-2); padding:22px 24px;}
.temperamento-item svg{width:24px; height:24px; color:var(--gold); flex-shrink:0; margin-top:2px;}
.temperamento-item strong{color:var(--gold-light); font-family:var(--label); font-size:13.5px; letter-spacing:.06em; display:block; margin-bottom:4px; text-transform:uppercase;}
.temperamento-item p{font-size:14px; color:var(--parchment-2); margin:0;}

.color-swatches{display:grid; grid-template-columns:repeat(auto-fit,minmax(110px,1fr)); gap:28px; margin-top:14px;}
.color-swatch{text-align:center;}
.color-swatch .chip{width:72px; height:72px; border-radius:50%; margin:0 auto 12px; border:2px solid var(--gold); box-shadow:inset 0 0 0 3px var(--charcoal-2);}
.color-swatch span{font-family:var(--label); font-size:12px; letter-spacing:.05em; color:var(--parchment-2); text-transform:uppercase; display:block;}
.color-rules{margin-top:36px; border-top:1px solid rgba(166,138,84,.25); padding-top:26px; display:grid; gap:12px; max-width:700px; margin-left:auto; margin-right:auto;}
.color-rules p{font-size:14.5px; color:var(--parchment-2);}
.color-rules strong{color:var(--gold-light);}

.faltas-grid{display:grid; grid-template-columns:1fr 1fr; gap:2px; background:rgba(166,138,84,.3); margin-top:10px;}
.faltas-col{background:var(--charcoal-2); padding:30px 34px;}
.faltas-col.descalificantes{background:#241a1a;}
.faltas-col h4{font-size:19px; font-style:italic; margin-bottom:16px;}
.faltas-col.descalificantes h4{color:#d69b9b;}
.faltas-col:not(.descalificantes) h4{color:var(--gold-light);}
.faltas-col ul{display:grid; gap:10px;}
.faltas-col li{font-size:14px; color:var(--parchment-2); padding-left:18px; position:relative;}
.faltas-col li::before{content:"—"; position:absolute; left:0; color:var(--gold); opacity:.6;}
.faltas-col.descalificantes li::before{color:#c97a7a;}

.standard-closing{
  margin-top:74px; text-align:center; max-width:700px; margin-left:auto; margin-right:auto;
  border-top:1px solid rgba(166,138,84,.3); padding-top:44px;
}
.standard-closing p.quote{font-style:italic; font-size:18px; color:var(--parchment); font-family:var(--display); margin-bottom:22px;}
.standard-closing p.note{font-size:14px; color:var(--parchment-2);}

@media (max-width:760px){
  .faltas-grid{grid-template-columns:1fr;}
}

/* ================= CAMADAS: destacadas (foto + tira de fotos + datos) + anteriores ================= */
.camadas-featured{display:grid; gap:36px; margin-top:44px;}
.camada-featured{
  background:var(--charcoal-2); border:1px solid var(--gold);
  display:grid; grid-template-columns:1.05fr .55fr 1fr; gap:0;
}
.camada-foto-principal{padding:14px;}
.camada-foto-principal .frame{max-width:none; width:100%; height:100%; aspect-ratio:4/5;}

.camada-tira{padding:14px 8px; display:flex; flex-direction:column; gap:10px; justify-content:center;}
.camada-tira .frame{max-width:none; width:100%; padding:4px; aspect-ratio:1/1;}
.camada-tira .frame::before{inset:3px;}
.camada-tira .placeholder-fallback span{display:none;}
.camada-tira .placeholder-fallback svg{width:20px; height:20px;}

.camada-featured-info{padding:40px 42px 40px 30px; display:flex; flex-direction:column; justify-content:center;}
.camada-estado{
  display:block; width:fit-content;
  font-family:var(--label); font-size:14px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--gold); margin-bottom:16px;
}
.camada-estado::before{content:"— "; }
.camada-estado::after{content:" —"; }
.camada-estado.estado-proxima{color:var(--gold-light);}
.camada-featured-info h3{font-size:30px; font-style:italic; color:var(--parchment); margin-bottom:18px;}
.camada-featured-info .specs-box{border-top:1px solid rgba(166,138,84,.3); margin-bottom:22px;}
.camada-featured-info .spec-row{grid-template-columns:112px 1fr;}
.camada-featured-info p.desc{color:var(--parchment-2); font-size:15px; margin-bottom:26px; max-width:40ch;}

@media (max-width:900px){
  .camada-featured{grid-template-columns:minmax(0,1fr);}
  .camada-featured > *{min-width:0;}
  .camada-tira .frame{min-width:0;}
  .camada-foto-principal .frame{aspect-ratio:16/10;}
  .camada-tira{flex-direction:row; padding:8px 14px;}
  .camada-tira .frame{aspect-ratio:1/1;}
}

.camadas-anteriores-head{margin-top:80px;}
.camadas-empty{
  margin-top:40px; padding:40px; text-align:center; border:1px dashed rgba(166,138,84,.35);
  color:var(--parchment-2); font-size:15px; font-style:italic;
}

/* ================= PERROS IMPORTADOS (sección breve) ================= */
.imported-grid{
  margin-top:56px; display:grid; grid-template-columns:repeat(2,1fr); gap:2px; background:rgba(166,138,84,.3);
}
.imported-card{
  background:var(--charcoal-2); padding:34px; display:grid; grid-template-columns:150px 1fr; gap:26px; align-items:start;
}
.imported-card .frame{max-width:none; aspect-ratio:1/1;}
.imported-info h3{
  font-size:24px; font-style:italic; color:var(--parchment); margin:6px 0 14px;
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
}
.rol-badge{
  font-family:var(--label); font-size:11.5px; letter-spacing:.1em; text-transform:uppercase;
  color:var(--ink); background:var(--gold-light); padding:3px 10px; border-radius:20px; font-style:normal;
}
.specs-box.compact{margin-bottom:16px; border-top:none;}
.specs-box.compact .spec-row{padding:6px 0; grid-template-columns:120px 1fr;}
.imported-card .editable-note{font-size:14.5px;}

@media (max-width:760px){
  .imported-grid{grid-template-columns:minmax(0,1fr);}
  .imported-card{grid-template-columns:minmax(0,1fr); padding:24px 20px; gap:20px;}
  .imported-card .frame{max-width:230px; margin:0 auto; width:100%;}
  .imported-info{min-width:0; text-align:center;}
  .imported-info h3{justify-content:center;}
  .imported-info .specs-box{text-align:left;}
  .specs-box.compact .spec-row{grid-template-columns:minmax(0,1fr); gap:2px; padding:9px 0;}
  .imported-info, .imported-info *{overflow-wrap:anywhere;}
  .imported-card .editable-note{text-align:left;}
}

/* ================= HITOS DESTACADOS (timeline) ================= */
.page-hero-tight{padding:90px 0 110px;}
.milestones{margin-top:50px; max-width:820px; margin-left:auto; margin-right:auto;}
.milestone{
  display:grid; grid-template-columns:110px 90px 1fr; gap:24px; align-items:start; padding:26px 0;
  border-bottom:1px solid rgba(166,138,84,.25);
}
.milestone:last-child{border-bottom:none;}
.milestone-photo .frame{max-width:none; aspect-ratio:1/1; padding:5px;}
.milestone-photo .frame::before{inset:3px;}
.milestone-year{
  font-family:var(--display); font-style:italic; font-size:30px; color:var(--gold-light); padding-top:6px;
}
.milestone-text h4{font-size:19px; margin-bottom:8px; color:var(--parchment);}
.milestone-text .editable-note{font-size:14.5px;}

@media (max-width:640px){
  .milestone{grid-template-columns:64px 1fr; grid-template-areas:"photo year" "text text";}
  .milestone-photo{grid-area:photo;}
  .milestone-year{grid-area:year; font-size:22px; align-self:center;}
  .milestone-text{grid-area:text;}
}

/* ================= LOGROS: categorías de títulos (números grandes) ================= */
.titulos-grid{margin-top:50px; display:grid; gap:24px;}
.titulo-categoria{background:var(--charcoal-2); padding:32px 30px;}
.titulo-categoria h3{
  font-size:23px; font-style:italic; color:var(--parchment); margin-bottom:6px;
  display:flex; align-items:baseline; gap:10px;
}
.titulo-count-big{
  font-family:var(--label); font-style:normal; font-size:15px; color:var(--ink);
  background:var(--gold); padding:2px 10px; border-radius:20px;
}
.titulo-subgrupos{margin-top:16px; display:grid; gap:18px;}
.titulo-subgrupo .eyebrow-inline{
  display:block; font-family:var(--label); font-size:13.5px; letter-spacing:.08em; color:var(--gold-light);
  margin-bottom:8px; text-transform:uppercase;
}
.titulo-count{color:var(--gold); opacity:.8;}
.titulo-subgrupo .titles-list{gap:5px;}
.titulo-subgrupo .titles-list li{font-size:14px;}

/* -- Tarjetas de estadística con número grande en círculo (prioridad: Especializadas primero) -- */
.stat-categoria{
  background:var(--charcoal-2); border:1px solid rgba(166,138,84,.25); padding:36px 40px;
}
.stat-categoria-muted{padding:24px 32px; opacity:.82;}
.stat-categoria-head{display:flex; align-items:center; gap:30px; margin-bottom:26px; flex-wrap:wrap;}
.stat-circle{
  flex-shrink:0; width:130px; height:130px; border-radius:50%;
  border:2px solid var(--gold); display:flex; align-items:center; justify-content:center;
  background:radial-gradient(circle at 35% 30%, rgba(166,138,84,.18), transparent 70%);
}
.stat-categoria-muted .stat-circle{width:96px; height:96px; border-color:var(--gold-light); opacity:.9;}
.stat-num-mega{
  font-family:var(--display); font-style:italic; font-size:clamp(48px,6vw,64px); line-height:1;
  color:var(--gold);
}
.stat-categoria-muted .stat-num-mega{font-size:clamp(34px,4vw,44px); color:var(--gold-light);}
.stat-categoria-title h3{font-size:26px; font-style:italic; color:var(--parchment); margin-bottom:4px;}
.stat-sub{font-family:var(--body); font-size:13.5px; color:var(--parchment-2); opacity:.85;}
.stat-paises{display:flex; flex-wrap:wrap; gap:30px 36px;}
.stat-pais{display:flex; flex-direction:column; align-items:center; min-width:74px;}
.stat-num-mid{font-family:var(--display); font-style:italic; font-size:36px; color:var(--gold-light); line-height:1;}
.stat-pais-label{
  font-family:var(--label); font-size:12px; letter-spacing:.08em; text-transform:uppercase;
  color:var(--parchment-2); margin-top:4px; text-align:center;
}
.stat-ver-detalle{
  display:inline-block; margin-top:26px; font-family:var(--label); font-size:13px; letter-spacing:.1em;
  text-transform:uppercase; background:var(--rust); color:var(--parchment); border:none;
  padding:11px 26px; border-radius:3px; cursor:pointer; transition:background .25s ease;
}
.stat-ver-detalle:hover{background:var(--olive);}

@media (max-width:640px){
  .stat-categoria{padding:26px 22px;}
  .stat-categoria-head{gap:18px;}
  .stat-circle{width:100px; height:100px;}
  .stat-paises{gap:20px 26px;}
}

@media (max-width:760px){
  .titulos-grid{grid-template-columns:1fr;}
}

/* -- Modal de detalle de Logros -- */
.logros-modal{
  position:fixed; inset:0; z-index:210; background:rgba(10,9,6,.88);
  display:flex; align-items:center; justify-content:center; padding:24px;
  opacity:0; visibility:hidden; transition:opacity .25s ease;
}
.logros-modal.open{opacity:1; visibility:visible;}
.logros-modal-inner{
  position:relative; background:var(--charcoal-2); border:1px solid var(--gold);
  max-width:640px; width:100%; max-height:84vh; overflow-y:auto; padding:44px 38px;
}
.logros-modal-close{
  position:absolute; top:14px; right:16px; background:none; border:1px solid var(--gold);
  color:var(--parchment); font-size:22px; line-height:1; width:38px; height:38px; border-radius:50%; cursor:pointer;
}
.logros-modal-close:hover{background:rgba(166,138,84,.25);}
.logros-modal-content h3{
  font-size:28px; font-style:italic; color:var(--parchment); margin-bottom:22px;
  display:flex; align-items:baseline; gap:12px;
}
.modal-count{
  font-family:var(--label); font-style:normal; font-size:15px; color:var(--ink);
  background:var(--gold); padding:2px 12px; border-radius:20px;
}
.modal-subgrupo{margin-bottom:22px;}
.modal-subgrupo:last-child{margin-bottom:0;}
.modal-subgrupo .eyebrow-inline{
  display:block; font-family:var(--label); font-size:13.5px; letter-spacing:.08em; color:var(--gold-light);
  margin-bottom:10px; text-transform:uppercase;
}
.modal-subgrupo .titles-list{gap:7px;}
.modal-subgrupo .titles-list li{font-size:14px; color:var(--parchment-2);}

/* ================= GALERÍA / LIGHTBOX (ver fotos en grande) ================= */
.gallery-frame{cursor:zoom-in;}
.gallery-frame .frame-media{position:relative;}
.zoom-hint{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  background:rgba(23,20,15,.45); opacity:0; transition:opacity .25s ease; font-size:22px;
  pointer-events:none;
}
.gallery-frame:hover .zoom-hint, .gallery-frame:focus-visible .zoom-hint{opacity:1;}

.lightbox{
  position:fixed; inset:0; z-index:200; background:rgba(10,9,6,.94);
  display:flex; align-items:center; justify-content:center;
  opacity:0; visibility:hidden; transition:opacity .3s ease;
}
.lightbox.open{opacity:1; visibility:visible;}
.lightbox-stage{
  position:relative; max-width:min(88vw,900px); max-height:84vh; display:flex; flex-direction:column; align-items:center; gap:14px;
}
.lightbox-img{
  max-width:100%; max-height:74vh; object-fit:contain; border:1px solid var(--gold);
  box-shadow:0 20px 60px rgba(0,0,0,.5); background:var(--charcoal);
}
.lightbox-placeholder{
  display:none; width:min(88vw,500px); aspect-ratio:4/5; background:linear-gradient(160deg, var(--olive), var(--ink));
  border:1px solid var(--gold); flex-direction:column; align-items:center; justify-content:center; gap:14px;
}
.lightbox-placeholder svg{width:44px; height:44px; color:var(--gold-light); opacity:.6;}
.lightbox-placeholder span{font-family:var(--label); letter-spacing:.14em; text-transform:uppercase; color:var(--gold-light); font-size:13px;}
.lightbox-caption{
  font-family:var(--label); letter-spacing:.12em; text-transform:uppercase; font-size:13px; color:var(--gold-light);
}
.lightbox-close{
  position:absolute; top:22px; right:26px; background:none; border:1px solid var(--gold);
  color:var(--parchment); font-size:26px; line-height:1; width:44px; height:44px; border-radius:50%;
  cursor:pointer; transition:background .25s ease;
}
.lightbox-close:hover{background:rgba(166,138,84,.25);}
.lightbox-nav{
  background:none; border:1px solid var(--gold); color:var(--parchment);
  width:50px; height:50px; border-radius:50%; font-size:18px; cursor:pointer;
  transition:background .25s ease; flex-shrink:0; margin:0 18px;
}
.lightbox-nav:hover{background:rgba(166,138,84,.25);}
.lightbox{flex-direction:row;}
@media (max-width:640px){
  .lightbox-nav{width:42px; height:42px; margin:0 8px;}
  .lightbox-close{top:14px; right:14px; width:38px; height:38px; font-size:22px;}
}

/* ================= VISTA PREVIA DE EJEMPLARES (Machos / Hembras) ================= */
.dog-preview-grid{
  margin-top:36px; display:grid; grid-template-columns:repeat(4, 1fr); gap:36px 28px;
}
.dog-preview{
  display:flex; flex-direction:column; align-items:center; text-align:center;
  padding:0 0 22px; border-bottom:1px solid rgba(166,138,84,.16);
}
.dog-preview-media{width:100%;}
.dog-preview-media .frame{max-width:none; aspect-ratio:4/5; margin-bottom:0;}
.hidden-thumbs{display:none;}
.dog-preview-info{padding-top:14px; position:relative;}
.dog-preview-info h3{font-size:22px; font-style:italic; margin-bottom:4px; color:var(--parchment);}
.registro-line{
  display:block; font-family:var(--label); font-size:12px; letter-spacing:.05em; color:var(--gold);
  margin-bottom:14px; font-style:italic; line-height:1.3;
}
.btn-conocer{
  display:inline-block; font-family:var(--label); font-size:12.5px; letter-spacing:.1em; text-transform:uppercase;
  background:var(--rust); color:var(--parchment); border:none; padding:8px 20px; border-radius:3px; cursor:pointer;
  transition:background .25s ease;
}
.btn-conocer:hover{background:var(--olive);}

@media (max-width:980px){
  .dog-preview-grid{grid-template-columns:repeat(2, 1fr);}
}
@media (max-width:560px){
  .dog-preview-grid{grid-template-columns:1fr; max-width:320px; margin-left:auto; margin-right:auto;}
}

/* ================= MODAL DE DETALLE ("Conoce") ================= */
.detail-modal{
  position:fixed; inset:0; z-index:210; background:rgba(10,9,6,.88);
  display:flex; align-items:center; justify-content:center; padding:24px;
  opacity:0; visibility:hidden; transition:opacity .25s ease;
}
.detail-modal.open{opacity:1; visibility:visible;}
.detail-modal-inner{
  position:relative; background:var(--charcoal-2); border:1px solid var(--gold);
  max-width:560px; width:100%; max-height:84vh; overflow-y:auto; padding:44px 38px;
}
.detail-modal-close{
  position:absolute; top:14px; right:16px; background:none; border:1px solid var(--gold);
  color:var(--parchment); font-size:22px; line-height:1; width:38px; height:38px; border-radius:50%; cursor:pointer;
}
.detail-modal-close:hover{background:rgba(166,138,84,.25);}
.detail-modal-content h3{font-size:28px; font-style:italic; color:var(--parchment); margin:8px 0 20px;}
.detail-modal-content .specs-box{border-top:1px solid rgba(166,138,84,.3);}
.modal-gallery{margin-top:26px;}
.modal-gallery .eyebrow{display:block; margin-bottom:12px;}
.modal-gallery .thumb-row{grid-template-columns:repeat(3, 90px);}

/* ================= LOGROS (real, agrupados por perro) ================= */
.logros-cards{margin-top:50px; display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:2px; background:var(--gold);}
.logro-card{background:var(--charcoal-2); padding:32px 30px;}
.logro-card h4{font-size:21px; font-style:italic; color:var(--parchment); margin-bottom:16px; display:flex; flex-direction:column; gap:4px;}

/* ================= CAMADAS ================= */
.litter{
  display:grid; grid-template-columns:.9fr 1.1fr; gap:44px; align-items:center;
  padding:40px 0; border-bottom:1px solid rgba(166,138,84,.25);
}
.litter:last-child{border-bottom:none;}
.litter-frame{max-width:none; aspect-ratio:16/10;}
.litter-info .eyebrow{display:block; margin-bottom:10px;}
.litter-info h3{font-size:28px; font-style:italic; color:var(--parchment); margin-bottom:14px;}
.parents{display:flex; gap:36px; margin:16px 0 18px; flex-wrap:wrap;}
.parents div span.label{display:block; font-family:var(--label); font-size:12px; letter-spacing:.14em; color:var(--gold); text-transform:uppercase;}
.parents div strong{font-family:var(--display); font-style:italic; font-size:20px; color:var(--parchment);}
.litter-info p.desc{color:var(--parchment-2); max-width:56ch;}

@media (max-width:760px){
  .litter{grid-template-columns:1fr;}
}

/* ================= TESTIMONIOS ================= */
.testi-grid{margin-top:60px; display:grid; grid-template-columns:repeat(3,1fr); gap:36px;}
.testi{
  background:var(--charcoal-2); padding:38px 30px; position:relative; border-top:2px solid var(--gold);
}
.testi .quote-mark{font-family:var(--display); font-size:52px; color:var(--gold); line-height:0; position:relative; top:18px;}
.testi p{font-size:16px; font-style:italic; color:var(--parchment-2); margin-bottom:18px;}
.testi .who{font-family:var(--label); font-size:13px; letter-spacing:.1em; text-transform:uppercase; color:var(--gold-light);}

@media (max-width:900px){
  .testi-grid{grid-template-columns:1fr;}
}

/* ================= INFORMACION TECNICA ================= */
.tech-grid{margin-top:60px; display:grid; grid-template-columns:repeat(2,1fr); gap:2px; background:rgba(166,138,84,.35);}
.tech-item{background:var(--charcoal-2); padding:30px 34px;}
.tech-item h4{font-size:19px; color:var(--gold-light); margin-bottom:8px; font-style:italic;}
.tech-item p{font-size:15px; color:var(--parchment-2);}
@media (max-width:760px){.tech-grid{grid-template-columns:1fr;}}

/* ================= CONTACTO ================= */
.contact-grid{display:grid; grid-template-columns:1.1fr .9fr; gap:70px; margin-top:50px; align-items:start;}
form.contact-form{display:grid; gap:20px;}
.field{display:grid; gap:8px;}
.field label{font-family:var(--label); font-size:13px; letter-spacing:.12em; text-transform:uppercase; color:var(--parchment-2);}
.field input, .field textarea, .field select{
  font-family:var(--body); font-size:15.5px; padding:13px 14px; background:var(--parchment);
  border:1px solid rgba(74,68,54,.35); color:var(--ink); border-radius:2px;
}
.field input:focus, .field textarea:focus, .field select:focus{border-color:var(--gold); background:#fff;}
.field select{cursor:pointer;}
.btn{
  justify-self:start; font-family:var(--label); font-size:14px; letter-spacing:.14em; text-transform:uppercase;
  padding:15px 34px; background:var(--rust); color:var(--parchment); border:none; cursor:pointer;
  transition:background .3s ease, transform .2s ease;
}
.btn:hover{background:var(--olive); transform:translateY(-2px);}
.form-note{font-size:13px; color:var(--parchment-2); margin-top:-6px;}

.contact-side{
  background:var(--charcoal-2); padding:40px 34px; color:var(--parchment);
}
.contact-side h3{font-style:italic; font-size:26px; margin-bottom:16px;}
.contact-side p{color:var(--parchment-2); font-size:15px; margin-bottom:26px;}
.wa-btn{
  display:inline-flex; align-items:center; gap:12px; background:#2f5b3f; color:#fff;
  padding:15px 24px; font-family:var(--label); letter-spacing:.1em; text-transform:uppercase; font-size:14px;
}
.wa-btn:hover{background:#264d34;}
.contact-list{margin-top:30px; display:grid; gap:12px; font-size:15px;}
.contact-list span.label{display:block; font-family:var(--label); font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--gold);}

@media (max-width:900px){
  .contact-grid{grid-template-columns:1fr;}
}

/* ============ FLOATING WHATSAPP ============ */
.wa-float{
  position:fixed; bottom:26px; right:26px; z-index:90; background:#2f5b3f; color:#fff;
  width:58px; height:58px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  box-shadow:0 8px 22px rgba(0,0,0,.35); transition:transform .25s ease;
}
.wa-float:hover{transform:scale(1.08);}
.wa-float svg{width:28px; height:28px;}

/* ================= FOOTER ================= */
footer{background:var(--ink); color:var(--parchment-2); padding:56px 0 28px; text-align:center;}
footer .footer-brand{margin-bottom:20px; justify-content:center; display:flex;}
footer nav{display:flex; flex-wrap:wrap; justify-content:center; gap:22px; margin-bottom:30px;}
footer nav a{font-family:var(--label); font-size:13px; letter-spacing:.12em; text-transform:uppercase; color:var(--parchment-2);}
footer nav a:hover{color:var(--gold);}
footer .fine{font-size:13px; opacity:.55;}

/* ================= RESPONSIVE ================= */
@media (max-width:900px){
  .team-grid{grid-template-columns:1fr; max-width:320px; margin-left:auto; margin-right:auto;}
  .section{padding:80px 0;}
  .page-hero{padding-top:120px;}
}