/* Cabecera, tipografía y enlaces compartidos */
:root {
  --ink: #202b2a;
  --ink-soft: #3d4846;
  --muted: #52605e;
  --paper: #f5f2ea;
  --brand: #a6221e;
  --brand-dark: #7b1916;
  --line: #d8d9d2;
  --radius-xl: 5px;
  --radius-lg: 5px;
  --radius-md: 4px;
  --container: 1250px;
}
html { scroll-padding-top: 112px; }
body { font-family: "Segoe UI", Arial, sans-serif; line-height: 1.55; }
h1, h2, h3, h4 { font-weight: 650; letter-spacing: -.042em; text-wrap: balance; }
h2 { font-size: clamp(2rem, 3.25vw, 3.05rem); }
h3 { font-size: clamp(1.15rem, 1.7vw, 1.48rem); }
:focus-visible { outline: 3px solid #176089; outline-offset: 4px; }
.skip-link { position: absolute; left: 1rem; top: 0; transform: translateY(-150%); z-index: 200; padding: .7rem 1rem; background: white; color: var(--ink); }
.skip-link:focus { transform: translateY(0); }
.site-header { background: #fff; box-shadow: none; backdrop-filter: none; }
.top-strip { background: #263330; }
.top-strip .container { padding-block: .35rem; font-size: .81rem; }
.top-strip a { font-weight: 600; }
.top-strip a[href^="tel:"] { white-space: nowrap; }
.navbar { min-height: 74px; }
.brand { min-width: auto; }
.brand img { width: min(221px, 56vw); }
.nav-links a { font-size: .96rem; font-weight: 600; border-radius: 4px; }
.nav-links .nav-cta, .button { border-radius: 4px; box-shadow: none; }
.button { font: 650 1rem/1.28 "Segoe UI", Arial, sans-serif; min-height: 48px; }
.button--primary, .nav-links .nav-cta { background: var(--brand); color: #fff; }
.button--primary:hover, .nav-links .nav-cta:hover { background: var(--brand-dark); color: #fff; }
.plain-link { display: inline-flex; align-items: center; gap: .8rem; min-height: 44px; color: var(--brand-dark); font-weight: 650; }
.plain-link span { font-size: 1.18em; }
.plain-link:hover { text-decoration: underline; text-underline-offset: .25em; }
.container { width: min(calc(100% - clamp(36px, 8vw, 128px)), var(--container)); }
.local-line, .crumb-link { display: inline-block; font-size: .78rem; font-weight: 650; letter-spacing: .1em; text-transform: uppercase; color: var(--brand-dark); margin: 0 0 1.25rem; }
.crumb-link { letter-spacing: .035em; text-transform: none; font-size: .9rem; }
.crumb-link:hover { text-decoration: underline; }

/* Las cabeceras de empresa y contacto conservan el texto sobre una fotografía adaptable. */
.hero--photo { background: #263330; }
.hero--photo .hero-photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  z-index: -2;
}
.hero--photo::after {
  inset: 0;
  height: auto;
  background: linear-gradient(90deg, rgba(12,24,28,.88), rgba(12,24,28,.74) 62%, rgba(12,24,28,.64));
}
.hero--photo .hero__content { position: relative; }
.hero--photo .lead { color: #f4f5f2; }
@media(max-width:660px) {
  .hero--photo::after { background: rgba(12,24,28,.75); }
}

/* Una fotografía en su proporción acompaña al texto de cada portada. */
.ha-cover { background: var(--paper); border-bottom: 1px solid var(--line); }
.cover-layout { display: grid; grid-template-columns: minmax(0, .96fr) minmax(0, 1fr); align-items: center; gap: clamp(2rem, 4.5vw, 5.7rem); padding-block: clamp(2.6rem, 5vw, 5rem); }
.cover-copy { min-width: 0; }
.ha-cover h1, .catalog-intro h1 { color: var(--ink); font-size: clamp(2.75rem, 5.3vw, 5.25rem); line-height: 1.035; text-wrap: balance; letter-spacing: -.063em; overflow-wrap: break-word; }
.ha-cover h1 em, .catalog-intro h1 em { color: var(--brand); font-style: normal; }
.cover-intro { margin: 1.3rem 0 0; max-width: 53ch; color: var(--ink-soft); font-size: clamp(1.06rem, 1.35vw, 1.21rem); }
.cover-actions { display: flex; gap: .8rem 1.6rem; align-items: center; flex-wrap: wrap; margin-top: 1.65rem; }
.cover-photo, .work-photo, .service-figure, figure.media-card { margin: 0; }
.cover-photo img, .work-photo img { width: 100%; object-fit: cover; display: block; background: #e1ded4; }
.cover-photo img { height: clamp(310px, 33vw, 490px); }
.cover-photo figcaption, .work-photo figcaption, .service-figure figcaption { margin-top: .7rem; font-size: .85rem; line-height: 1.5; color: var(--muted); }
.cover-photo figcaption { display: flex; align-items: baseline; gap: .6rem; }
.cover-photo figcaption::before { content: ""; width: 20px; height: 2px; flex-shrink: 0; background: var(--brand); }
.service-cover h1 { font-size: clamp(2.5rem, 4.35vw, 4.3rem); }
.service-cover .cover-photo img { height: clamp(280px, 29vw, 420px); }
.ha-chapter, .service-copy.section, .section { padding-block: clamp(3.6rem, 6.5vw, 6.1rem); }
.section-tight { padding-block: clamp(2.8rem, 5vw, 4.4rem); }
.directory-layout, .community-layout { display: grid; grid-template-columns: minmax(0, .84fr) minmax(0, 1.16fr); gap: clamp(2rem, 7vw, 7.3rem); align-items: start; }
.directory-intro h2, .community-copy h2 { max-width: 18ch; }
.directory-intro p, .community-copy p:not(.local-line) { margin-top: 1.1rem; max-width: 57ch; }
.service-directory { border-top: 1px solid var(--ink); }
.service-directory>a { display: flex; align-items: center; justify-content: space-between; gap: 1.2rem; border-bottom: 1px solid var(--line); padding: 1.2rem .2rem; }
.service-directory>a:hover h3, .catalog-card a:hover h3 { color: var(--brand); }
.service-directory p { margin: .3rem 0 0; }
.service-directory>a>span { font-size: 1.4rem; color: var(--brand); }
.community-layout { grid-template-columns: repeat(2,minmax(0,1fr)); align-items: center; }
.work-photo img { aspect-ratio: 4 / 3; }
.community-section { background: #eae8df; }
.catalog-intro { padding-block: clamp(2.8rem,5vw,5rem); }
.catalog-intro .container { max-width: var(--container); }
.catalog-intro h1 { max-width: 16ch; }
.catalog-intro p:last-child { margin: 1.2rem 0 0; font-size: 1.14rem; max-width: 62ch; }
.catalog-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1.7rem; margin-top: 2.3rem; }
.catalog-card { min-width: 0; }
.catalog-image { overflow: hidden; background: #ece9e0; }
.catalog-image img { width: 100%; aspect-ratio: 1.65; object-fit: cover; }
.catalog-card h3 { margin-block: 1.1rem .6rem; }
.catalog-card p { margin: 0; }
.other-services>div { padding-block: 1.1rem; border-top: 1px solid var(--line); }
.other-services p { margin: .5rem 0 0; }
.service-copy h2+p, .service-copy h3+p, .company-copy h2+p, .company-copy h3+p, .contact-card h2+p { margin-top: 1rem; }
.service-copy p, .company-copy p { max-width: 66ch; }
.service-section-head { margin-bottom: 1.75rem; }
.service-figure img { display: block; width: 100%; height: auto; object-fit: contain; }
.service-points { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: clamp(1.3rem,3vw,3rem); margin: 1rem 0 0; }
.service-points>div { border-top: 2px solid var(--brand); padding-top: 1rem; }
.service-points dt { font-size: 1.18rem; font-weight: 650; }
.service-points dd { margin: .6rem 0 0; color: var(--muted); }
.feature-band { background: #263330; box-shadow: none; }
.feature-band::before { display: none; }
.feature-band h2 { max-width: 24ch; }
.feature-band p { margin: .9rem 0 0; }
.feature-band .button { position: relative; color: var(--ink); }
.page-contact .contact-grid { grid-template-columns: minmax(0,1.3fr) minmax(0,.7fr); gap: clamp(1.5rem,5vw,4rem); }
.form-grid { margin-top: 1.8rem; }
.contact-direct { padding: 1.2rem 0; }
.contact-channels dt { font-weight: 650; }
.contact-channels dd { margin: .2rem 0 1rem; overflow-wrap: anywhere; }
.contact-channels a { color: var(--brand-dark); text-decoration: underline; text-underline-offset: .2em; }
.checkbox-line input[type=checkbox] { width: 1.1rem; height: 1.1rem; flex: none; margin-top: .15rem; }
.contact-card, .media-card { box-shadow: none; }
.ha-footer { background: #202c29; color: #fff; padding: clamp(2.8rem,5vw,4.5rem) 0; }
.ha-footer .container { display: grid; grid-template-columns: 1.1fr 1.2fr 1fr; gap: 2.5rem; }
.ha-footer strong, .ha-footer h2 { color: #fff; font-size: 1.12rem; font-weight: 650; letter-spacing: 0; }
.ha-footer p { color: #d0d8d4; margin: .7rem 0 0; }
.ha-footer .photo-disclosure {
  max-width: 36ch;
  margin-top: 1.1rem;
  font-size: .84rem;
  color: #c6ceca;
}
.ha-footer ul { list-style: none; margin-top: .6rem; display: grid; gap: .38rem; }
.ha-footer a { color: #f4f7f4; display: inline-block; padding-block: .15rem; }
.ha-footer a:hover { text-decoration: underline; text-underline-offset: .2em; }
@media(max-width:900px) {
  .directory-layout, .community-layout { gap: 2rem; }
  .catalog-grid { gap: 1rem; }
}
@media(max-width:860px) {
  html { scroll-padding-top: 108px; }
  .top-strip .container { flex-direction: row; align-items: center; padding-block: .3rem; }
  .top-strip__links { display: flex; }
  .top-strip__links a[href^="mailto"] { display: none; }
  .navbar { min-height: 62px; }
  .nav-toggle { display: block; position: absolute; right: 0; width: 46px; height: 46px; opacity: 0; }
  .nav-toggle:focus-visible+.nav-toggle-label { outline: 3px solid #176089; outline-offset: 2px; }
  .nav-toggle-label { border-radius: 4px; }
  .nav-links { visibility: hidden; }
  .nav-toggle:checked ~ .nav-links { visibility: visible; }
  .cover-layout { gap: 1.7rem; }
  .catalog-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .service-points { grid-template-columns: 1fr; }
  .page-contact .contact-grid { grid-template-columns: 1fr; }
  .directory-layout { grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr); }
}
@media(max-width:660px) {
  html { scroll-padding-top: 101px; }
  .ha-cover h1, .catalog-intro h1 { font-size: clamp(2.5rem, 9vw, 3.25rem); }
  .service-cover h1 { font-size: clamp(2.28rem,8.2vw,3.1rem); }
  .cover-layout, .directory-layout, .community-layout, .catalog-grid, .ha-footer .container { grid-template-columns: 1fr; }
  .cover-layout { padding-block: 2.1rem 1.65rem; }
  .cover-photo img, .service-cover .cover-photo img { height: auto; aspect-ratio: 1.55; }
  .cover-actions { margin-top: 1.3rem; }
  .cover-actions .button { width: auto; }
  .community-layout { gap: 1.7rem; }
  .catalog-grid { gap: 2.4rem; }
  .local-line { margin-bottom: .8rem; }
}
@media(max-width:380px) {
 .top-strip .container>span { max-width: 18ch; font-size: .74rem; line-height: 1.2; }
}
@media(prefers-reduced-motion:reduce) {
 html { scroll-behavior: auto; }
 *, *::before, *::after { transition: none !important; }
}
.roof-detail { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: clamp(1.3rem,3vw,3rem); align-items: end; margin: 0 0 2.2rem; }
.roof-detail img { width: 100%; max-height: 285px; object-fit: cover; aspect-ratio: 1.9; }
.roof-detail figcaption { max-width: 26ch; padding-bottom: .7rem; border-bottom: 1px solid var(--line); }
@media(max-width:660px) {
 .roof-detail { display: block; }
 .roof-detail figcaption { max-width: none; border: 0; }
}

/* Identidad visual. Tipografías alojadas junto al sitio. */
@font-face {
  font-family: "HA Manrope";
  src: url("assets/ha-manrope-latin.woff2") format("woff2");
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
}
@font-face {
  font-family: "HA Newsreader";
  src: url("assets/ha-newsreader-italic-latin.woff2") format("woff2");
  font-style: italic;
  font-weight: 200 800;
  font-display: swap;
}
:root {
  --ha-sans: "HA Manrope", "Segoe UI", Arial, sans-serif;
  --ha-serif: "HA Newsreader", Georgia, serif;
  --ink: #1c2925;
  --ink-soft: #34433b;
  --muted: #506058;
  --brand: #a4231f;
  --paper: #f3f0e8;
}
body, .button { font-family: var(--ha-sans); }
h1, h2, h3, .nav-links a { font-family: var(--ha-sans); }
h1, h2 { font-weight: 600; }
h3 { font-weight: 670; }
.top-strip { background: #1e302b; }
.top-strip .container { min-height: 28px; }
.site-header, .ha-footer { border-color: #d6d9d1; }
.nav-links > li > a:not(.nav-cta) { font-weight: 600; background: transparent; border-radius: 0; }
.nav-links a[aria-current="page"]:not(.nav-cta) { color: var(--brand); text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 6px; }
.nav-links a:hover:not(.nav-cta) { color: var(--brand); }
.button, .nav-links .nav-cta { border-radius: 3px; font-weight: 700; }
.plain-link { text-underline-offset: .22em; }
.ha-cover h1 em, .catalog-intro h1 em {
  font-family: var(--ha-serif);
  font-style: italic;
  font-weight: 450;
  letter-spacing: -.045em;
}
.ha-cover:not(.home-hero) .cover-copy { padding-block: 0; }
.service-cover .cover-photo img, .work-photo img, .service-figure img, .catalog-image, .media-card { border-radius: 3px; }
.service-cover .cover-photo img { height: clamp(310px, 32vw, 465px); }
.local-line { display: flex; align-items: center; gap: .7rem; }
.local-line::before { content: ""; width: 25px; height: 1px; display: inline-block; background: currentColor; }
.crumb-link { text-underline-offset: .25em; }
.service-points dt { line-height: 1.35; }
.feature-band { border-radius: 3px; border-inline-start: 4px solid var(--brand); background: #21362f; }
.ha-footer { background: #1b2c25; }
.ha-footer .photo-disclosure { color: #c5cfc8; font-size: .77rem; max-width: 34ch; }

/* Una sola fotografía compone la portada. El texto descansa en la parte en sombra. */
.home-hero {
  isolation: isolate;
  position: relative;
  overflow: hidden;
  color: white;
  background: #20332c;
  border: 0;
}
.home-hero .cover-layout {
  display: flex;
  align-items: center;
  min-height: clamp(525px, 45vw, 665px);
  padding-block: clamp(3.25rem,5.8vw,6.5rem);
}
.home-hero .cover-photo { position: absolute; inset: 0; margin: 0; z-index: -2; }
.home-hero .cover-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 68% 49%; }
.home-hero .cover-photo::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg,rgba(13,27,22,.94) 0%,rgba(13,27,22,.87) 24%,rgba(13,27,22,.60) 43%,rgba(13,27,22,.10) 72%,rgba(13,27,22,.04) 100%);
}
.home-hero .cover-copy { max-width: min(55%,715px); }
.home-hero .local-line { color: #f3e5c8; margin: 0 0 1.25rem; font-size: .73rem; letter-spacing: .14em; }
.home-hero h1 {
  color: #fffdf7;
  font-size: clamp(3.45rem,5.55vw,5.9rem);
  line-height: 1.005;
  letter-spacing: -.057em;
  text-wrap: initial;
}
.home-hero h1 em { color: #f0d7ae; font-size: 1.075em; }
.home-hero .cover-intro { color: #fbf7eb; font-size: clamp(1rem,1.25vw,1.18rem); line-height: 1.55; max-width: 45ch; }
.home-hero .cover-actions { margin-top: 1.65rem; }
.home-hero .button--primary { background: #fff8ea; color: #202e28; box-shadow: none; border-color: #fff8ea; }
.home-hero .button--primary:hover { background: #efd7b1; border-color: #efd7b1; }
.home-hero .plain-link { color: #fff9ed; }
.home-hero .cover-actions .plain-link span { color: #f1dab3; }
.home-hero :focus-visible { outline-color: #fff; }
.home-hero .cover-photo figcaption { display: none; }

.home-services { background: #faf9f5; padding-block: clamp(3.2rem,5.4vw,5.4rem); }
.home-services__head { display: flex; align-items: end; justify-content: space-between; gap: 2rem; margin-bottom: 1.8rem; }
.home-services__head h2 { max-width: 20ch; }
.home-services__head p { color: var(--muted); margin: .7rem 0 0; max-width: 60ch; }
.home-services__head>.plain-link { flex: none; }
.home-services__grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: clamp(.95rem,1.7vw,1.6rem); }
.home-service { min-width: 0; display: flex; flex-direction: column; border-bottom: 1px solid #cacdc1; padding-bottom: .9rem; color: var(--ink); }
.home-service__image { overflow: hidden; background: #e1dbc9; border-radius: 3px; }
.home-service__image img { width: 100%; height: auto; aspect-ratio: 1.48; object-fit: cover; transition: transform .5s ease; }
.home-service:hover img { transform: scale(1.035); }
.home-service__name { margin-top: 1rem; display: grid; grid-template-columns: 1fr auto; align-items: baseline; gap: .5rem; }
.home-service__name h3 { font-size: clamp(1.12rem,1.6vw,1.45rem); letter-spacing: -.035em; }
.home-service__name span { color: var(--brand); font-size: 1.15rem; }
.home-service p { margin: .55rem 0 0; font-size: .97rem; line-height: 1.5; }
.home-service:hover h3 { color: var(--brand-dark); }
.community-section { background: #eeeade; border-top: 1px solid #e0ddcf; }
.community-section .work-photo img { aspect-ratio: 1.35; }
.community-section .community-copy p:not(.local-line) { line-height: 1.7; }
@media(max-width:1000px) {
  .home-hero .cover-copy { max-width: 64%; }
  .home-hero .cover-layout { min-height: 490px; }
  .home-services__grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1.6rem; }
}
@media(max-width:760px) {
  .home-hero .cover-copy { max-width: 78%; }
  .home-hero .cover-photo::after { background: linear-gradient(90deg,rgba(15,28,23,.94),rgba(15,28,23,.8) 30%,rgba(15,28,23,.39) 70%,rgba(15,28,23,.18)); }
  .home-services__head { align-items: start; flex-direction: column; gap: .45rem; }
}
@media(max-width:660px) {
  .service-cover .cover-photo img { height: auto; aspect-ratio: 1.55; }
  .home-hero .cover-layout { min-height: 0; display: flex; flex-direction: column; align-items: stretch; padding: 0; width: 100%; }
  .home-hero .cover-photo { position: relative; inset: auto; z-index: 0; order: -1; }
  .home-hero .cover-photo img { display: block; aspect-ratio: 2.2; height: auto; max-height: 275px; object-position: 55% 50%; }
  .home-hero .cover-photo::after { background: linear-gradient(0deg,rgba(31,48,41,.22),transparent 35%); }
  .home-hero .cover-copy { padding: 1.55rem max(18px,4vw) 1.8rem; max-width: 100%; background: #24382f; }
  .home-hero h1 { font-size: clamp(2.65rem,8.1vw,3.4rem); line-height: 1.035; text-wrap: balance; }
  .home-hero .local-line { margin-bottom: .65rem; font-size: .69rem; }
  .home-hero .cover-intro { margin-top: .8rem; max-width: 55ch; }
  .home-hero .cover-actions { margin-top: 1rem; }
  .home-services { padding-block: 2.7rem; }
}
@media(max-width:540px) {
  .home-services__grid { grid-template-columns: 1fr; gap: 0; }
  .home-service { display: grid; grid-template-columns: clamp(90px,26vw,127px) minmax(0,1fr); column-gap: .9rem; row-gap: .25rem; padding-block: .85rem; }
  .home-service__image { grid-row: 1/3; }
  .home-service__image img { height: 100%; min-height: 83px; max-height: 108px; aspect-ratio: 1.15; }
  .home-service__name { align-self: end; margin: 0; }
  .home-service__name h3 { line-height: 1.22; }
  .home-service p { margin: 0; font-size: .91rem; }
  .home-services__head { margin-bottom: .35rem; }
}
@media(prefers-reduced-motion:reduce) { .home-service:hover img { transform: none; } }

