@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&family=Libre+Caslon+Display&display=swap');
:root{font-family:'DM Sans',sans-serif;color:#263127;background:#f8f7f2;font-synthesis:none}*{box-sizing:border-box}body{margin:0}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}button,.button{cursor:pointer;background:#2f4336;color:#fff;border:1px solid #2f4336;padding:12px 18px;border-radius:2px}button:hover,.button:hover{opacity:.85}h1,h2,h3{font-family:'Libre Caslon Display',Georgia,serif;font-weight:400;line-height:1.07}h1{font-size:clamp(3rem,7vw,6.7rem)}h2{font-size:clamp(2.5rem,5vw,4rem)}.header{height:84px;display:flex;align-items:center;justify-content:space-between;max-width:1440px;margin:auto;padding:0 5%;gap:16px}.brand{font-size:18px;letter-spacing:.2em;font-weight:500}.brand small{display:block;font-size:9px;letter-spacing:.4em;margin-top:7px}.header nav{display:flex;gap:24px;font-size:12px;letter-spacing:.12em;text-transform:uppercase}.hero{min-height:680px;height:78vh;display:flex;align-items:center;background:linear-gradient(90deg,rgba(20,43,29,.73),rgba(20,43,29,.04)),url('https://images.unsplash.com/photo-1416879595882-3373a0480b5b?auto=format&fit=crop&w=1800&q=85') center/cover;color:white}.hero-content{padding:6%;max-width:950px}.hero h1{margin:20px 0}.hero p{max-width:510px;line-height:1.7}.eyebrow{text-transform:uppercase;letter-spacing:.24em;font-size:11px;font-weight:600}.light-button{display:inline-block;border-bottom:1px solid white;padding:12px 0;margin-top:30px;letter-spacing:.13em;text-transform:uppercase;font-size:11px}.section{padding:100px 6%;max-width:1500px;margin:auto}.section h2{margin:20px 0 48px}.works{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 24px}.work img,.photo-placeholder{height:390px;width:100%;object-fit:cover;background:#dce1d6}.photo-placeholder{display:grid;place-items:center;color:#6c786b}.work-info{display:flex;justify-content:space-between;align-items:baseline;gap:14px}.work-info h3{font-size:30px;margin:16px 0}.work-info span{font-size:12px;color:#6d766d}.about{background:#eceee6;max-width:none}.about p:not(.eyebrow){font-size:20px;max-width:730px;line-height:1.7}.project-page h1{margin:20px 0}.project-page .description{white-space:pre-wrap;line-height:1.8;max-width:750px}.back{font-size:12px;letter-spacing:.14em}.gallery{margin-top:65px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.gallery img{width:100%;object-fit:cover;max-height:720px}.gallery img:first-child{grid-column:1/-1;width:100%}footer{padding:40px 6%;border-top:1px solid #dadfd6;font-size:12px}.admin{max-width:1100px}.admin h1{font-size:clamp(2.6rem,5vw,4.5rem)}.toolbar{display:flex;gap:10px;flex-wrap:wrap;margin:20px 0}.outline{background:transparent;color:#2f4336}.danger{background:#8d3e36;border-color:#8d3e36}.icon-button{padding:10px}.admin-item{display:grid;grid-template-columns:90px minmax(140px,1fr) auto;align-items:center;gap:18px;border-bottom:1px solid #d5dacf;padding:14px 0}.admin-item img{width:80px;height:72px;object-fit:cover}.admin-item p{font-size:12px;color:#657064}.actions{display:flex;gap:7px;flex-wrap:wrap}.actions button{padding:9px 12px;font-size:12px}.form{max-width:670px;background:white;padding:28px;border:1px solid #e3e6dc;margin:25px 0}.form label{display:block;margin:16px 0;font-size:13px;font-weight:600}.form input:not([type=checkbox]),.form textarea{display:block;width:100%;padding:12px;border:1px solid #ced4ca;margin-top:8px;background:white}.form label.check{display:flex;align-items:center;gap:10px}.status{color:#87552d;font-size:13px}.photo-editor{margin:20px 0}.photo-row{display:flex;align-items:center;gap:12px;padding:8px;border-bottom:1px solid #e9e9e9}.photo-row img{width:90px;height:65px;object-fit:cover}.photo-row span{flex:1;font-size:12px}.photo-row button{padding:7px 10px;font-size:12px}.notice{padding:35px 0;color:#667067}.empty{min-height:50vh}@media(max-width:720px){.header{height:auto;min-height:82px;align-items:flex-start;flex-direction:column;justify-content:center;padding:16px 5%}.header nav{gap:16px}.hero{min-height:520px;height:65vh}.section{padding:65px 5%}.works{grid-template-columns:1fr}.work img,.photo-placeholder{height:300px}.gallery{grid-template-columns:1fr}.gallery img:first-child{grid-column:1}.admin-item{grid-template-columns:60px 1fr}.admin-item img{width:60px;height:60px}.admin-item .actions{grid-column:1/-1}.form{padding:15px}.photo-row{flex-wrap:wrap}}
/* Diseño propio v1 */
.ea-hero{min-height:65vh;display:flex;align-items:center;background:linear-gradient(100deg,rgba(18,43,29,.75),rgba(18,43,29,.15)),linear-gradient(25deg,#5a735e,#b7bda7);color:#fff}.ea-hero-inner{width:min(1100px,90%);margin:auto}.ea-hero h1{margin:16px 0 28px}.ea-hero p,.ea-kicker{letter-spacing:.18em;font-size:12px}.ea-section{max-width:1180px;padding:80px 25px;margin:auto}.ea-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:36px}.ea-project img,.ea-placeholder{width:100%;aspect-ratio:4/3;object-fit:cover;background:#d4dbcf}.ea-placeholder{display:grid;place-items:center;color:#536b57}.ea-project h3{font-size:28px;margin:14px 0 4px}.ea-contact{text-align:center;min-height:300px}.site-footer{padding:40px;text-align:center;background:#e8ebe4;letter-spacing:.15em;font-size:12px}.ea-detail h1{margin-bottom:5px}.ea-description{max-width:800px;line-height:1.8;margin:30px 0}.ea-photo-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:25px}.ea-photo-grid img{width:100%;object-fit:cover;max-height:500px}.ea-admin{max-width:880px;margin:auto;padding:55px 25px;min-height:70vh}.ea-admin h1{font-size:48px}.ea-admin-top{display:flex;align-items:center;justify-content:space-between;gap:20px}.ea-form{display:grid;gap:18px;max-width:700px;margin:28px 0}.ea-form label{display:grid;gap:7px}.ea-form input,.ea-form textarea,.ea-form select{padding:12px;border:1px solid #b8c1b8;background:white;width:100%;max-width:100%}.ea-form button{justify-self:start}.ea-admin-row{padding:18px 0;border-bottom:1px solid #d6ded6;display:flex;justify-content:space-between;gap:20px}.ea-admin-list{margin-top:25px}@media(max-width:680px){.ea-grid,.ea-photo-grid{grid-template-columns:1fr}.ea-section{padding:50px 20px}.header{height:auto;min-height:70px;flex-wrap:wrap;padding:15px}.ea-admin-top{align-items:start;flex-direction:column}}


/* Encabezado nuevo para Eugenia Anaya — reemplaza el encabezado anterior. */
.header {
  position: sticky;
  top: 0;
  z-index: 1000;
  width: 100%;
  max-width: none;
  height: 48px;
  min-height: 48px;
  margin: 0;
  padding: 0 clamp(12px, 4vw, 64px);
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  background: #fff;
  border-bottom: 1px solid #eee;
}
.header .brand {
  display: flex;
  align-items: center;
  flex: 0 1 auto;
  min-width: 0;
  font-size: inherit;
  letter-spacing: normal;
}
.header .brand img {
  display: block;
  height: 40px;
  width: auto;
  max-width: 100%;
  object-fit: contain;
}
.header nav {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  gap: clamp(12px, 3vw, 34px);
  font-family: 'Special Gothic Expanded One', sans-serif;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: uppercase;
}
.header nav a { color: #161616; text-decoration: none; }
.header nav a:hover { opacity: .65; }
.header nav a:focus-visible { outline: 2px solid #161616; outline-offset: 4px; }
@media (max-width: 520px) {
  .header { height: 48px; min-height: 48px; padding: 0 10px; flex-direction: row; flex-wrap: nowrap; align-items: center; }
  .header .brand img { height: 30px; }
  .header nav { font-size: 9px; gap: 11px; }
}



/* Portada fotográfica: reemplaza el fondo verde sin modificar los textos existentes. */
.ea-hero {
  background-image: linear-gradient(90deg,rgba(0,0,0,.40) 0%,rgba(0,0,0,.08) 72%),url('/assets/img/portada-eugenia.jpg');
  background-color: #667362;
  background-size: cover;
  background-position: center 56%;
  background-repeat: no-repeat;
  min-height: 65vh;
}
@media (max-width:680px){
  .ea-hero { min-height:60vh; background-position:55% center; }
}


/* Version 2.3: portada de alto completo y contacto con enlaces */
.ea-hero {
  min-height: calc(100vh - 48px);
  min-height: calc(100svh - 48px);
}
@media (max-width: 680px) {
  .ea-hero {
    min-height: calc(100vh - 48px);
    min-height: calc(100svh - 48px);
  }
}
.ea-contact-links {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 24px 34px;
  margin-top: 30px;
}
.ea-contact-link {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  color: #263127;
  font-weight: 500;
  font-size: clamp(14px, 1.65vw, 17px);
  overflow-wrap: anywhere;
}
.ea-contact-link:hover { opacity: .68; }
.ea-contact-link:focus-visible { outline: 2px solid currentColor; outline-offset: 5px; }
.ea-contact-link svg { width: 24px; height: 24px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
@media(max-width: 620px) {
  .ea-contact-links { flex-direction: column; gap: 22px; }
}


/* Eugenia Anaya v3.1 — Portfolio: nombre sobre la imagen al pasar el mouse. */
.ea-grid .ea-project {
  position: relative;
  display: block;
  overflow: hidden;
  isolation: isolate;
  aspect-ratio: 4 / 3;
  background: #d4dbcf;
  color: #fff;
  text-decoration: none;
}
.ea-grid .ea-project > img,
.ea-grid .ea-project > .ea-placeholder {
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
  object-fit: cover;
  transition: transform .45s ease;
}
.ea-project-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  text-align: center;
  background: rgba(0, 0, 0, .34);
  opacity: 0;
  transition: opacity .32s ease;
}
.ea-project-name {
  color: #fff;
  font-family: 'Libre Caslon Display', Georgia, serif;
  font-size: clamp(25px, 3vw, 43px);
  font-weight: 400;
  line-height: 1.12;
  text-wrap: balance;
  text-shadow: 0 1px 12px rgba(0,0,0,.25);
}
@media (hover: hover) and (pointer: fine) {
  .ea-grid .ea-project:hover .ea-project-overlay,
  .ea-grid .ea-project:focus-visible .ea-project-overlay {
    opacity: 1;
  }
  .ea-grid .ea-project:hover > img {
    transform: scale(1.025);
  }
}
.ea-grid .ea-project:focus-visible {
  outline: 3px solid #25362c;
  outline-offset: 4px;
}
@media (hover: none), (pointer: coarse) {
  /* En celulares el nombre siempre está visible: no existe hover. */
  .ea-project-overlay {
    opacity: 1;
    align-items: flex-end;
    justify-content: flex-start;
    text-align: left;
    padding: 38px 20px 20px;
    background: linear-gradient(to top, rgba(0,0,0,.67), rgba(0,0,0,0) 62%);
  }
  .ea-project-name { font-size: clamp(24px, 6.5vw, 36px); }
}
@media (prefers-reduced-motion: reduce) {
  .ea-grid .ea-project > img,
  .ea-project-overlay { transition: none; }
}