/* Teruel 375 · styles.css */
:root{
  --bg:#ffffff;
  --fg:#111;
  --muted:#666;
  --badge-bg: rgba(0,0,0,.55);
  --badge-fg:#fff;
  --focus:#0a7cff;
  --card:#f5f5f7;
  --shadow:0 10px 30px rgba(0,0,0,.08);
}

*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--fg)}
body{line-height:1.55;font-family:Arial,Helvetica,sans-serif}
.wrapper{width:min(1120px,92vw);margin-inline:auto}

/* A11y */
.skip-link{position:absolute;left:-9999px;top:auto;background:#000;color:#fff;padding:.6rem .8rem;z-index:9999}
.skip-link:focus{left:1rem;top:1rem;outline:none}

/* Header */
.site-header{border-bottom:1px solid #e6e6e9;background:#fff;position:sticky;top:0;z-index:100}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:1rem 0}
.title{font-size:clamp(1.6rem,2.5vw,2.4rem);margin:0;letter-spacing:.2px}
.subtitle{margin:.15rem 0 0;color:var(--muted);font-weight:600}
.contact-mini{display:flex;gap:.6rem;align-items:center}
.icon-link{display:inline-grid;place-items:center;width:42px;height:42px;border-radius:999px;border:1px solid #ddd;background:#fff;box-shadow:var(--shadow);line-height:0}
.icon-link svg{width:22px;height:22px;display:block}
.icon-link svg *{vector-effect:non-scaling-stroke}
.icon-link:focus-visible{outline:3px solid var(--focus);outline-offset:2px}

/* Intro */
.hero{display:grid;grid-template-columns:1fr;background:var(--card);border-radius:18px;padding:1.25rem;margin:1.25rem 0 0;box-shadow:var(--shadow)}
.hero-title{margin:.25rem 0;font-size:clamp(1.2rem,2.2vw,1.6rem)}
.hero-lede{margin:.25rem 0 0;color:var(--muted)}

/* Features */
.features{margin:2rem 0 0}
.features h2{font-size:clamp(1.2rem,2vw,1.4rem);margin:0 0 .6rem}
.feature-list{display:grid;grid-template-columns:1fr;gap:.3rem .8rem;padding:0;margin:0;list-style:none;font-size:medium;}
.feature-list li{padding:.55rem .7rem;background:var(--card);border-radius:12px}
@media (min-width:900px){.feature-list{grid-template-columns:1fr 1fr}}

/* Gallery / Carousel (sección “Imágenes”) */
.gallery{margin:2rem 0 0}
.section-head{display:flex;align-items:baseline;gap:.8rem}
.section-head .muted{color:var(--muted);margin:0}
.carousel{margin-top:.75rem;border-radius:18px;background:var(--card);padding:.6rem;box-shadow:var(--shadow)}
.track{display:flex;gap:.6rem;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding:.2rem;scrollbar-width:thin}
.slide{scroll-snap-align:start;position:relative;border:0;padding:0;background:transparent;cursor:pointer;min-width:clamp(260px,60vw,560px);aspect-ratio:16/9;border-radius:14px;overflow:hidden}
.slide img{width:100%;height:100%;object-fit:cover;display:block;background:#ddd}
.slide .badge{position:absolute;left:.6rem;bottom:.6rem;background:var(--badge-bg);color:var(--badge-fg);padding:.25rem .45rem;border-radius:6px;font-size:.85rem}

/* Oculta barra de scroll de la galería (sin romper el scroll) */
.gallery .track{scrollbar-width:none}
.gallery .track::-webkit-scrollbar{display:none}

/* Map */
.map{margin:2rem 0 0}
.map-embed{margin-top:.5rem;border-radius:18px;overflow:hidden;background:#e9eef1;box-shadow:var(--shadow)}
.map-embed iframe{width:100%;height:min(65vh,520px);border:0;display:block}
.coords{color:var(--muted);font-size:.95rem;margin:.6rem 0 0}

/* Contact */
.contact{margin:2rem 0 3rem}
.contact-list{list-style:none;padding:0;margin:.5rem 0 0;display:grid;gap:.5rem}
.contact-item{display:flex;align-items:center;gap:.6rem;padding:.7rem 1rem;background:var(--card);border-radius:14px;text-decoration:none;color:inherit;box-shadow:var(--shadow)}
.contact-item:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.icon{font-size:1.2rem}

/* Footer */
.site-footer{border-top:1px solid #eee;padding:1rem 0;color:var(--muted);background:#fff}

/* Dialog / Lightbox */
dialog#lightbox{width:min(92vw,1100px);border:0;border-radius:14px;padding:0;background:#000;color:#fff}
#lightbox::backdrop{background:rgba(0,0,0,.6);backdrop-filter:blur(2px)}
#lightbox img{width:100%;height:auto;display:block}
#lightbox .close{position:absolute;top:.4rem;right:.6rem;font-size:2rem;line-height:1;border:0;background:transparent;color:#fff;cursor:pointer}
#lightbox .close:focus-visible{outline:3px solid var(--focus);outline-offset:2px}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){.track{scroll-behavior:auto}}

/* Ajuste de separación de párrafos en Ubicación */
.map p.muted + p.muted{margin-top:0}

/* ===== HERO (entre header y main): cross-fade (sin scroll) ===== */
.hero-carousel .carousel{
  border-radius:18px;background:var(--card);box-shadow:var(--shadow);padding:0
}
.hero-carousel .track{
  position:relative;overflow:hidden;height:clamp(220px,40vw,520px)
}
.hero-carousel .slide{
  position:absolute;inset:0;min-width:0;border-radius:0;opacity:0;
  transition:opacity 2s ease;pointer-events:none
}
.hero-carousel .slide img{width:100%;height:100%;object-fit:cover;display:block}
.hero-carousel .slide.is-active{opacity:1;pointer-events:auto}

/* Oculta visualmente (pero accesible) los textos de apoyo en los iconos del header */
.sr-only{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0,0,0,0) !important;
  white-space:nowrap !important;
  border:0 !important;
}

/* Oculta las badges del hero */
.hero-carousel .slide .badge{
  display:none !important;
}

/* ===== Sección del plano ===== */
.blueprint {
  margin: 2rem 0 0;
}

.blueprint h2 {
  font-size: clamp(1.2rem, 2vw, 1.4rem);
  font-weight: 600;
  color: var(--fg);
  margin: 0 auto 1rem;
  width: min(1120px, 92vw);
  text-align: left;
}

.blueprint-img {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  background: var(--card);
  box-shadow: var(--shadow);
  border-radius: 12px;
  overflow: hidden;
}

.blueprint-img img {
  width: 90%;
  max-width: 1100px;
  height: auto;
  display: block;
  border-radius: 12px;
}