/* =========================================================================
   PORTADA HARIEL (index.html)
   Mismo sistema visual del sitio: marfil / piedra / grafito / dorado,
   Cinzel para títulos y Montserrat para texto. Ritmo de secciones
   alternando claro y oscuro, como las láminas del brand book.
   ========================================================================= */
.home-body{background:var(--marfil);color:var(--grafito);}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
.skip-link{position:absolute;left:-999px;top:8px;z-index:100;background:#fff;color:#111;padding:10px 14px;border-radius:8px;}
.skip-link:focus{left:12px;}
.home-body a{color:inherit;text-decoration:none;}
.home-body :focus-visible{outline:2px solid var(--dorado);outline-offset:3px;}

/* ---------- barra superior ---------- */
.home-nav{background:linear-gradient(180deg,rgba(10,10,10,.7),transparent);backdrop-filter:none;transition:background .3s ease;}
.home-nav.scrolled{background:rgba(18,16,13,.94);backdrop-filter:blur(8px);box-shadow:0 1px 0 var(--linea);}
.home-nav .nav-links{gap:26px;}

/* ---------- secciones ---------- */
.h-section{padding:clamp(72px,9vw,120px) 0;position:relative;}
.h-light{background:var(--marfil);}
.h-paper{background:var(--piedra);}
.h-dark{background:var(--grafito);color:#EDE6DA;}
.h-section h2{font-size:clamp(30px,3.6vw,46px);line-height:1.1;margin:0 0 18px;color:inherit;font-weight:500;}
.h-dark h2{color:#F5EEE2;}
.h-section p{line-height:1.75;font-size:1.02rem;max-width:64ch;}
.h-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:44px;}
.h-head p{margin:0;color:var(--greige);}
.h-head-center{flex-direction:column;align-items:center;text-align:center;}
.h-link{font-weight:700;color:var(--dorado2) !important;border-bottom:1px solid var(--linea);padding-bottom:4px;}
.h-link:hover{border-color:var(--dorado2);}

/* ---------- 1. portada ---------- */
.h-hero{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:flex-end;overflow:hidden;background:#15120e;color:#fff;}
.h-hero-bg{
  position:absolute;inset:0;
  background:url('../images/torres/almeida/fachada-3.jpg') 62% 40%/cover no-repeat;
  transform:scale(1.04);animation:hHeroIn 1.6s ease-out forwards;
}
.h-hero-bg::after{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(16,13,10,.92) 0%,rgba(16,13,10,.72) 38%,rgba(16,13,10,.15) 72%,rgba(16,13,10,.3) 100%),
    linear-gradient(180deg,rgba(16,13,10,.55) 0%,transparent 30%,transparent 65%,rgba(16,13,10,.85) 100%);
}
@keyframes hHeroIn{to{transform:scale(1);}}
.h-hero-inner{position:relative;z-index:2;padding:150px 0 64px;}
.h-kicker{color:var(--dorado2);font-weight:600;letter-spacing:.08em;margin:0 0 18px;font-size:.95rem;}
.h-hero h1{font-size:clamp(34px,4.8vw,64px);line-height:1.08;max-width:17ch;margin:0 0 24px;color:#FFFAF2;font-weight:500;}
.h-lead{font-size:clamp(1rem,1.3vw,1.15rem);color:#E6DDCF;max-width:56ch;line-height:1.7;margin:0 0 32px;}
.h-facts{display:grid;grid-template-columns:repeat(3,auto);justify-content:start;gap:12px 56px;margin:56px 0 0;padding-top:26px;border-top:1px solid rgba(224,200,157,.28);}
.h-facts div{display:flex;flex-direction:column-reverse;gap:4px;}
.h-facts dt{font-size:.82rem;color:#CFC6B7;}
.h-facts dd{margin:0;font-family:"Cinzel",serif;font-size:clamp(22px,2.2vw,30px);color:var(--dorado2);}

/* ---------- 2. ¿qué es Hariel? ---------- */
.h-que{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(32px,6vw,90px);align-items:center;}
.h-que-mark{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:40px 20px;border-right:1px solid var(--linea);min-height:340px;}
.h-hebreo{font-family:"Frank Ruhl Libre","Times New Roman",serif;font-weight:300;font-size:clamp(84px,11vw,150px);line-height:1;color:var(--dorado);direction:rtl;}
.h-traduccion{margin-top:18px;font-style:italic;color:var(--greige);font-size:1.05rem;}
.h-def{font-size:1.14rem !important;color:#2a2622;}
.h-def strong{color:#8a6a36;font-weight:600;}
.h-conceptos{list-style:none;padding:0;margin:30px 0 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;border-top:1px solid var(--linea);padding-top:24px;}
.h-conceptos b{display:block;font-family:"Cinzel",serif;font-weight:600;color:#6d5430;margin-bottom:6px;}
.h-conceptos span{font-size:.9rem;color:var(--greige);line-height:1.55;}

/* ---------- 3. quiénes somos ---------- */
.h-split{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(32px,6vw,84px);align-items:center;}
.h-photo{margin:0;position:relative;}
.h-photo img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:4px 120px 4px 4px;}
.h-photo::after{content:"";position:absolute;inset:18px -18px -18px 18px;border:1px solid var(--dorado);border-radius:4px 120px 4px 4px;z-index:-1;}
.h-split-copy p{color:#3a342d;}
.h-pilares{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 34px;margin-top:34px;}
.h-pilares h3{font-size:1.1rem;margin:0 0 6px;color:#1f1b16;padding-left:14px;border-left:2px solid var(--dorado);}
.h-pilares p{margin:0;font-size:.93rem;color:var(--greige);line-height:1.6;padding-left:16px;}

/* ---------- 4. desarrollos ---------- */
.h-devs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:280px;gap:16px;}
.h-dev{position:relative;overflow:hidden;border-radius:6px;display:block;background:#222;}
.h-dev-lg{grid-row:span 2;}
.h-dev img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .7s ease;}
.h-dev::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(12,10,8,.88) 100%);}
.h-dev:hover img{transform:scale(1.04);}
.h-dev-info{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:22px 24px;}
.h-dev-info h3{margin:0 0 4px;font-size:1.3rem;color:#FFFAF2;font-weight:500;}
.h-dev-info p{margin:0;font-size:.88rem;color:#D9D0C1;line-height:1.5;}
.h-dev-lg .h-dev-info h3{font-size:1.8rem;}

/* ---------- 5. beneficios ---------- */
.h-benefits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1px solid var(--linea);}
.h-benefits article{padding:34px 30px 30px 0;border-bottom:1px solid var(--linea);}
.h-benefits article:not(:nth-child(3n)){border-right:1px solid var(--linea);}
.h-benefits article:not(:nth-child(3n+1)){padding-left:30px;}
.h-benefits h3{font-size:1.15rem;margin:0 0 10px;color:#1f1b16;font-weight:600;}
.h-benefits p{margin:0;font-size:.95rem;color:#5b544b;line-height:1.65;}

/* ---------- 6. esquema de rendimiento ---------- */
.h-rend{overflow:hidden;}
.h-rend-bg{position:absolute;inset:0;background:url('../images/torres/valle-real/fachada-2.jpg') right 30%/cover no-repeat;opacity:.16;}
.h-rend-grid{position:relative;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(32px,5vw,70px);align-items:start;}
.h-rend-grid > div > p{color:#D6CDBF;}
.h-table{width:100%;border-collapse:collapse;margin:28px 0 14px;font-size:1rem;}
.h-table th{font-weight:600;font-size:.8rem;color:#BFB4A3;text-align:left;padding:0 12px 12px 0;border-bottom:1px solid rgba(224,200,157,.3);}
.h-table td{padding:16px 12px 16px 0;border-bottom:1px solid rgba(255,255,255,.08);font-family:"Cinzel",serif;font-size:1.3rem;color:#F5EEE2;}
.h-table td:nth-child(3){color:var(--dorado2);}
.h-fine{font-size:.82rem !important;color:#A89E8E !important;}
.h-calc{background:#F5F0E7;color:var(--grafito);border-radius:6px;padding:32px;box-shadow:0 30px 70px rgba(0,0,0,.35);}
.h-calc h3{margin:0 0 20px;font-size:1.35rem;font-weight:600;}
.h-calc > label{font-size:.85rem;font-weight:600;color:#5b544b;}
.h-calc-precio{display:flex;align-items:center;gap:6px;border-bottom:2px solid var(--dorado);margin:6px 0 22px;}
.h-calc-precio span{font-family:"Cinzel",serif;font-size:1.6rem;color:#8a6a36;}
.h-calc-precio input{border:none;background:transparent;font-family:"Cinzel",serif;font-size:1.6rem;width:100%;padding:6px 0;color:var(--grafito);min-width:0;}
.h-calc-precio input:focus{outline:none;}
.h-calc-esq{border:none;padding:0;margin:0 0 22px;display:flex;gap:8px;}
.h-calc-esq legend{font-size:.85rem;font-weight:600;color:#5b544b;margin-bottom:8px;padding:0;}
.h-calc-esq label{flex:1;position:relative;cursor:pointer;text-align:center;padding:10px 0;border:1px solid #d8ccb6;border-radius:999px;font-weight:700;font-size:.95rem;transition:.2s;}
.h-calc-esq input{position:absolute;opacity:0;pointer-events:none;}
.h-calc-esq label:has(input:checked){background:var(--grafito);color:var(--dorado2);border-color:var(--grafito);}
.h-calc-esq label:has(input:focus-visible){outline:2px solid var(--dorado);outline-offset:2px;}
.h-calc-res{display:grid;grid-template-columns:1fr 1fr;gap:16px 20px;margin:0 0 24px;}
.h-calc-res div{display:flex;flex-direction:column-reverse;gap:2px;}
.h-calc-res dt{font-size:.8rem;color:var(--greige);}
.h-calc-res dd{margin:0;font-weight:700;font-size:1.05rem;}
.h-calc-big{font-family:"Cinzel",serif;font-size:1.6rem !important;color:#8a6a36;}
.h-calc .btn-primary{width:100%;}

/* ---------- 7. avances de obra ---------- */
.h-etapas{list-style:none;counter-reset:etapa;padding:0;margin:0 0 40px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));position:relative;}
.h-etapas::before{content:"";position:absolute;left:0;right:0;top:22px;height:1px;background:var(--dorado);opacity:.55;}
.h-etapas li{counter-increment:etapa;position:relative;padding:0 18px 0 0;}
.h-etapas li::before{
  content:counter(etapa);display:grid;place-items:center;width:44px;height:44px;border-radius:50%;
  background:var(--piedra);border:1px solid var(--dorado);font-family:"Cinzel",serif;color:#8a6a36;
  margin-bottom:18px;position:relative;z-index:1;
}
.h-etapas b{display:block;font-family:"Cinzel",serif;font-weight:600;margin-bottom:6px;color:#1f1b16;}
.h-etapas span{font-size:.9rem;color:#5b544b;line-height:1.55;display:block;}
.h-avance-links{display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding-top:26px;border-top:1px solid var(--linea);}
.h-avance-links span{font-weight:600;margin-right:6px;color:#5b544b;}
.h-avance-links a{padding:10px 16px;border:1px solid #cdbf9f;border-radius:999px;font-size:.9rem;font-weight:600;transition:.2s;}
.h-avance-links a:hover{background:var(--grafito);color:var(--dorado2);border-color:var(--grafito);}

/* ---------- 8. contacto ---------- */
.h-contact{background:#15120e;color:#EDE6DA;overflow:hidden;}
.h-contact-bg{position:absolute;inset:0;background:url('../images/render_index.jpg') center/cover no-repeat;opacity:.28;}
.h-contact::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#15120e 20%,rgba(21,18,14,.6) 100%);z-index:1;}
.h-contact-grid{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(32px,6vw,80px);align-items:center;}
.h-contact h2{color:#F5EEE2;}
.h-contact-copy p{color:#D6CDBF;}
.h-wa-inline{display:inline-flex;align-items:center;gap:10px;margin-top:14px;padding:13px 20px;border-radius:999px;background:#1f8f4e;color:#fff !important;font-weight:700;}
.h-wa-inline svg{width:22px;height:22px;fill:#fff;}
.h-wa-inline:hover{background:#25a35a;}
.h-form{background:rgba(245,240,231,.97);color:var(--grafito);border-radius:6px;padding:30px;display:flex;flex-direction:column;gap:14px;}
.h-form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.h-form label{display:flex;flex-direction:column;gap:6px;font-size:.85rem;font-weight:600;color:#4a443c;min-width:0;}
.h-form input:not([type=checkbox]), .h-form select, .h-form textarea{
  font:inherit;font-weight:400;font-size:.95rem;padding:12px 14px;border:1px solid #d8ccb6;border-radius:6px;background:#fff;color:var(--grafito);width:100%;box-sizing:border-box;
}
.h-form textarea{resize:vertical;min-height:84px;}
.h-form input:focus, .h-form select:focus, .h-form textarea:focus{outline:none;border-color:var(--dorado);box-shadow:0 0 0 3px rgba(201,167,107,.25);}
.h-check{flex-direction:row !important;align-items:flex-start;gap:10px !important;font-weight:400 !important;line-height:1.5;}
.h-check input{margin-top:3px;accent-color:#8a6a36;}
.h-check a{text-decoration:underline !important;}
.h-form .btn-primary{align-self:flex-start;}
.h-form-msg{margin:0;font-size:.9rem;min-height:1.2em;}
.h-form-msg.err{color:#a3322c;}
.h-form-msg.ok{color:#2e6b44;}

/* ---------- pie ---------- */
.h-footer{background:#0f0d0a;color:#BFB4A3;padding:56px 0 40px;font-size:.9rem;}
.h-footer-grid{display:grid;grid-template-columns:1.2fr 1fr 1.2fr;gap:36px;}
.h-footer p{line-height:1.6;margin:14px 0 0;}
.h-footer nav{display:flex;flex-direction:column;gap:10px;}
.h-footer a:hover{color:var(--dorado2);}
.h-footer-legal a{color:var(--dorado2);text-decoration:underline;}
.h-footer-legal p{font-size:.8rem;color:#8f8676;}

/* ---------- botón flotante de WhatsApp ---------- */
.wa-float{
  position:fixed;right:20px;bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:60;
  width:58px;height:58px;border-radius:50%;display:grid;place-items:center;
  background:#25D366;box-shadow:0 10px 26px rgba(0,0,0,.3);transition:transform .2s ease;
}
.wa-float svg{width:32px;height:32px;fill:#fff;}
.wa-float:hover{transform:scale(1.06);}

/* ---------- responsive ---------- */
@media (max-width:980px){
  .home-nav .nav-links.open a{color:#EDE6DA;}
  .h-que, .h-split, .h-rend-grid, .h-contact-grid{grid-template-columns:minmax(0,1fr);}
  .h-que-mark{border-right:none;border-bottom:1px solid var(--linea);min-height:0;padding:10px 0 34px;}
  .h-photo{max-width:520px;}
  .h-devs{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:240px;}
  .h-dev-lg{grid-column:span 2;grid-row:span 1;height:auto;}
  .h-benefits{grid-template-columns:repeat(2,minmax(0,1fr));}
  .h-benefits article{padding:28px 24px 26px 0 !important;border-right:none !important;}
  .h-benefits article:nth-child(odd){border-right:1px solid var(--linea) !important;}
  .h-benefits article:nth-child(even){padding-left:24px !important;}
  .h-etapas{grid-template-columns:minmax(0,1fr);gap:22px;}
  .h-etapas::before{left:22px;right:auto;top:0;bottom:0;width:1px;height:auto;}
  .h-etapas li{display:grid;grid-template-columns:44px 1fr;column-gap:18px;padding:0;}
  .h-etapas li::before{margin:0;grid-row:span 2;}
  .h-footer-grid{grid-template-columns:1fr 1fr;}
  .h-footer-grid > div:first-child{grid-column:1/-1;}
}
@media (max-width:640px){
  .h-hero-inner{padding:120px 0 40px;}
  .h-facts{grid-template-columns:1fr 1fr;gap:18px 24px;margin-top:40px;}
  .h-facts div:last-child{grid-column:1/-1;}
  .hero-actions a{flex:1 1 100%;}
  .h-conceptos{grid-template-columns:minmax(0,1fr);gap:16px;}
  .h-pilares{grid-template-columns:minmax(0,1fr);}
  .h-devs{grid-template-columns:minmax(0,1fr);grid-auto-rows:230px;}
  .h-dev-lg{grid-column:auto;}
  .h-benefits{grid-template-columns:minmax(0,1fr);}
  .h-benefits article{padding:24px 0 !important;border-right:none !important;}
  .h-calc, .h-form{padding:22px;}
  .h-form-row{grid-template-columns:minmax(0,1fr);}
  .h-form .btn-primary{align-self:stretch;}
  .h-table td{font-size:1.1rem;}
  .h-footer-grid{grid-template-columns:minmax(0,1fr);}
  .wa-float{width:54px;height:54px;right:14px;}
}
@media (prefers-reduced-motion:reduce){
  .h-hero-bg{animation:none;transform:none;}
  .h-dev img{transition:none;}
}

/* ajustes tras revisión visual */
.h-hero h1{max-width:20ch;}
.h-photo{isolation:isolate;}
.h-devs .h-dev:last-child{grid-column:1 / -1;}          /* Casa Madero cierra la cuadrícula a todo lo ancho */
.h-devs .h-dev:last-child img{object-position:center 60%;}
@media (max-width:640px){ .h-devs .h-dev:last-child{grid-column:auto;} }
@media (max-width:640px){
  .h-benefits article:nth-child(n){padding:24px 0 !important;border-right:none !important;}
}
@media (max-width:640px){ .h-dev-lg .h-dev-info h3{font-size:1.35rem;} }