/* ESTÉTICA CONSTRUCTOR GRID - ESTRUCSORIA S.L. (CONSTRUCCIÓN) */
@import url('https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@400;600&family=Space+Grotesk:wght@400;600;700&display=swap');

:root {
    --concrete-bg: #F4F4F4;       /* Gris Cemento Claro */
    --asphalt-dark: #0D0D0D;      /* Negro Asfalto */
    --safety-orange: #FF5A00;     /* Naranja Obra / Seguridad */
    --white-paper: #FFFFFF;       /* Blanco Plano */
    --border-heavy: 3px solid var(--asphalt-dark);
    --shadow-hard: 6px 6px 0px var(--asphalt-dark);
    --transition: transform 0.2s ease, box-shadow 0.2s ease;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
body { 
    font-family: 'Space Grotesk', sans-serif; 
    background-color: var(--concrete-bg); 
    /* Patrón de plano técnico */
    background-image: radial-gradient(var(--asphalt-dark) 1px, transparent 1px);
    background-size: 20px 20px;
    color: var(--asphalt-dark); 
    line-height: 1.6; 
}
h1, h2, h3, h4 { font-weight: 700; text-transform: uppercase; }

/* CONTENEDOR CENTRAL (ESTRUCTURA) */
.blueprint-wrapper { max-width: 1400px; margin: 40px auto; background: var(--white-paper); border: var(--border-heavy); box-shadow: 12px 12px 0px rgba(13, 13, 13, 0.1); display: flex; flex-direction: column; }

/* BARRA DE DATOS (TOP BAR) */
.top-data-bar { display: flex; justify-content: space-between; background: var(--safety-orange); color: var(--asphalt-dark); font-family: 'Roboto Mono', monospace; font-size: 0.85rem; font-weight: 600; padding: 10px 30px; border-bottom: var(--border-heavy); text-transform: uppercase; }
.top-data-bar span { display: inline-block; margin-right: 20px; }

/* CABECERA (HEADER) */
header { display: flex; justify-content: space-between; align-items: center; padding: 30px; border-bottom: var(--border-heavy); background: var(--white-paper); position: sticky; top: 0; z-index: 100; }
.brand h1 { font-size: 2.5rem; letter-spacing: -1px; line-height: 1; }
.brand h1 span { color: var(--safety-orange); }
.brand p { font-family: 'Roboto Mono', monospace; font-size: 0.8rem; background: var(--asphalt-dark); color: var(--white-paper); display: inline-block; padding: 4px 10px; margin-top: 10px; font-weight: 600; }

nav { display: flex; align-items: center; gap: 30px; }
.nav-links { display: flex; list-style: none; gap: 20px; }
.nav-links a { text-decoration: none; color: var(--asphalt-dark); font-size: 0.95rem; font-weight: 600; border: 2px solid transparent; padding: 8px 16px; transition: var(--transition); text-transform: uppercase; }
.nav-links a:hover { border: 2px solid var(--asphalt-dark); background: var(--concrete-bg); box-shadow: 4px 4px 0px var(--safety-orange); }

.lang-selector { font-family: 'Roboto Mono', monospace; border: 2px solid var(--asphalt-dark); background: var(--white-paper); padding: 8px 12px; font-weight: 600; cursor: pointer; transition: var(--transition); outline: none; }
.lang-selector:hover { background: var(--safety-orange); box-shadow: 3px 3px 0px var(--asphalt-dark); }

/* HERO SECTION (ZONA DE OBRA) */
.hero { display: grid; grid-template-columns: 1fr 1fr; border-bottom: var(--border-heavy); }
.hero-content { padding: 60px 40px; display: flex; flex-direction: column; justify-content: center; border-right: var(--border-heavy); background: var(--white-paper); }
.hero-content h2 { font-size: 4rem; line-height: 1; margin-bottom: 25px; }
.hero-content h2 span { background: var(--safety-orange); color: var(--white-paper); padding: 0 10px; }
.hero-content p { font-family: 'Roboto Mono', monospace; font-size: 1.1rem; margin-bottom: 0; border-left: 4px solid var(--safety-orange); padding-left: 20px; }
.hero-image { position: relative; min-height: 400px; background: var(--asphalt-dark); }
.hero-image img, .hero-image video { position: absolute; width: 100%; height: 100%; object-fit: cover; opacity: 0.8; mix-blend-mode: luminosity; }
/* BLOQUES DE CONTENIDO */
.content-block { border-bottom: var(--border-heavy); }
.section-header { padding: 30px; border-bottom: var(--border-heavy); background: var(--concrete-bg); }
.section-title { font-size: 2.5rem; margin: 0; display: flex; align-items: center; gap: 15px; }
.section-title::before { content: '🏗️'; font-size: 2rem; }

/* SERVICIOS (REGLA: SOLO TÍTULOS - BLOQUES TÉCNICOS) */
.services-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
.service-card { border-right: var(--border-heavy); border-bottom: var(--border-heavy); position: relative; overflow: hidden; background: var(--white-paper); display: flex; flex-direction: column; }
.service-card img { width: 100%; height: 250px; object-fit: cover; border-bottom: var(--border-heavy); filter: grayscale(100%) contrast(1.2); transition: filter 0.4s ease; }
.service-card:hover img { filter: grayscale(0%); }
.service-card h3 { padding: 25px; margin: 0; font-size: 1.2rem; text-align: left; background: var(--white-paper); transition: var(--transition); }
.service-card:hover h3 { background: var(--safety-orange); color: var(--white-paper); }

/* TESTIMONIOS (REGLA: 100% ANÓNIMOS - FORMATO EXPEDIENTE) */
.testimonial-grid { display: grid; grid-template-columns: 1fr 1fr; }
.testimonial-card { padding: 40px; border-right: var(--border-heavy); border-bottom: var(--border-heavy); background: var(--concrete-bg); position: relative; }
.testimonial-card p { font-size: 1.1rem; font-weight: 600; line-height: 1.6; position: relative; z-index: 1; }
.testimonial-card::before { content: 'EXP-REV //'; display: block; font-family: 'Roboto Mono', monospace; font-size: 0.85rem; color: var(--safety-orange); margin-bottom: 15px; font-weight: bold; }

/* DUDAS (REGLA: EXACTAMENTE 2, H3 + P - FORMATO MANUAL TÉCNICO) */
.faq-grid { display: grid; grid-template-columns: 1fr; }
.faq-box { padding: 40px; border-bottom: var(--border-heavy); background: var(--white-paper); }
.faq-box:last-child { border-bottom: none; }
.faq-box h3 { font-size: 1.5rem; margin-bottom: 15px; background: var(--asphalt-dark); color: var(--safety-orange); display: inline-block; padding: 8px 15px; }
.faq-box p { font-family: 'Roboto Mono', monospace; font-size: 1rem; line-height: 1.7; }

/* FOOTER (ZONA DE DESCARGA) */
footer { display: flex; flex-direction: column; background: var(--white-paper); }
.footer-columns { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); border-bottom: var(--border-heavy); }
.footer-columns > div { padding: 40px; border-right: var(--border-heavy); }
.footer-columns h4 { font-family: 'Roboto Mono', monospace; font-weight: 600; font-size: 1.1rem; text-transform: uppercase; margin-bottom: 20px; color: var(--safety-orange); }
.footer-columns p { margin-bottom: 10px; font-size: 0.95rem; font-weight: 600; }
.footer-menu-links { list-style: none; }
.footer-menu-links li { margin-bottom: 12px; }
.footer-menu-links a { color: var(--asphalt-dark); text-decoration: none; font-size: 0.95rem; font-weight: 600; transition: var(--transition); display: inline-block; }
.footer-menu-links a:hover { transform: translateX(5px); color: var(--safety-orange); }

/* REGLA ESTRICTA LOGO KIT DIGITAL: BLANCO, PADDING, SIN FILTROS */
.logo-kit-local { display: block; margin: 40px auto; max-width: 280px; width: 100%; height: auto; background-color: #FFFFFF; padding: 15px; border-radius: 0px; border: var(--border-heavy); box-shadow: var(--shadow-hard); }
.footer-legal-text { text-align: center; padding: 25px; font-size: 0.85rem; font-family: 'Roboto Mono', monospace; font-weight: 600; background: var(--asphalt-dark); color: var(--white-paper); text-transform: uppercase; }

/* RESPONSIVE */
@media (max-width: 1024px) {
    .hero, .testimonial-grid { grid-template-columns: 1fr; }
    .hero-content, .testimonial-card, .footer-columns > div { border-right: none; border-bottom: var(--border-heavy); }
    header { flex-direction: column; gap: 20px; text-align: center; }
    .nav-links { flex-wrap: wrap; justify-content: center; }
    .top-data-bar { flex-direction: column; text-align: center; gap: 10px; }
    .top-data-bar span { margin-right: 0; }
}