/* ===== DreamLUX — tema estatico compartido (estilo demo 3) ===== */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
:root { --primary:#ec6b00; --accent:#ff6a00; --dark:#141414; --light:#fff; --gray:#8a8a8a; }
html { scroll-behavior:smooth; }
body { font-family:'Segoe UI',system-ui,-apple-system,sans-serif; color:var(--dark);
  line-height:1.6; overflow-x:hidden; background:#fff; -webkit-font-smoothing:antialiased; }
.container { max-width:1200px; margin:0 auto; padding:0 2rem; }
img { max-width:100%; }

/* NAV */
.nav { position:fixed; top:0; width:100%; z-index:1000; background:rgba(255,255,255,0.92);
  backdrop-filter:blur(12px); padding:0.85rem 0; border-bottom:1px solid transparent;
  transition:border-color .3s, box-shadow .3s; }
.nav.scrolled { border-bottom-color:#eee; box-shadow:0 4px 24px rgba(0,0,0,0.05); }
.nav .container { display:flex; align-items:center; justify-content:space-between; }
.nav-logo img { height:30px; width:auto; display:block; }
.nav-links { display:flex; gap:2rem; list-style:none; }
.nav-links a { text-decoration:none; color:var(--dark); font-weight:500; font-size:0.9rem;
  position:relative; padding-bottom:4px; }
.nav-links a::after { content:''; position:absolute; bottom:0; left:0; width:0; height:2px;
  background:var(--primary); transition:width .3s; }
.nav-links a:hover::after { width:100%; }
.btn { display:inline-block; padding:0.7rem 2rem; background:var(--primary); color:var(--light);
  text-decoration:none; border-radius:4px; font-weight:600; font-size:0.85rem; border:none;
  cursor:pointer; transition:background .2s, transform .2s; }
.btn:hover { background:var(--accent); transform:translateY(-1px); }
.btn-light { background:#fff; color:var(--dark); }
.btn-light:hover { background:#f2f2f2; }

/* HERO (home) */
.hero { height:100vh; min-height:600px; display:flex; align-items:center; position:relative;
  background:#0d0d0d; overflow:hidden; }
.hero-img { position:absolute; inset:0; background-size:cover; background-position:center; }
.hero-overlay { position:absolute; inset:0;
  background:linear-gradient(to right, rgba(9,9,13,0.86) 0%, rgba(9,9,13,0.5) 48%, rgba(9,9,13,0.2) 100%),
    linear-gradient(to top, rgba(9,9,13,0.7), transparent 45%),
    radial-gradient(ellipse at 78% 55%, rgba(236,107,0,0.22), transparent 55%); }
.hero .container { position:relative; z-index:1; max-width:760px; }
.hero-badge { display:inline-block; padding:0.4rem 1.2rem; border:1px solid rgba(255,255,255,0.2);
  border-radius:50px; font-size:0.78rem; font-weight:600; color:rgba(255,255,255,0.85);
  margin-bottom:1.6rem; letter-spacing:0.03em; }
.hero h1 { font-size:clamp(2.3rem,6vw,4rem); font-weight:900; color:var(--light); line-height:1.08;
  margin-bottom:1.3rem; letter-spacing:-1px; }
.hero h1 span { color:var(--accent); }
.hero p { font-size:1.15rem; color:rgba(255,255,255,0.7); margin-bottom:2.3rem; max-width:560px; }
.hero-actions { display:flex; gap:1rem; flex-wrap:wrap; }
.scroll-indicator { position:absolute; bottom:2rem; left:50%; transform:translateX(-50%);
  color:rgba(255,255,255,0.45); font-size:1.5rem; animation:bounce 2s infinite; z-index:1; text-decoration:none; }
@keyframes bounce { 0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(10px)} }

/* PAGE HERO (subpaginas) */
.page-hero { position:relative; padding:9rem 0 4rem; background:#0d0d0d; overflow:hidden; }
.page-hero .hero-img { opacity:1; }
.page-hero .hero-overlay { background:linear-gradient(to right, rgba(9,9,13,0.85) 0%, rgba(9,9,13,0.55) 55%, rgba(9,9,13,0.35) 100%),
  linear-gradient(to top, rgba(9,9,13,0.65), transparent 55%),
  radial-gradient(ellipse at 80% 30%, rgba(236,107,0,0.22), transparent 60%); }
.page-hero .container { position:relative; z-index:1; }
.breadcrumb { color:rgba(255,255,255,0.55); font-size:0.82rem; margin-bottom:1rem; }
.breadcrumb a { color:rgba(255,255,255,0.55); text-decoration:none; }
.breadcrumb a:hover { color:var(--accent); }
.page-hero h1 { font-size:clamp(1.9rem,4.5vw,3rem); font-weight:900; color:#fff; line-height:1.12;
  letter-spacing:-0.5px; max-width:820px; }
.page-hero p { color:rgba(255,255,255,0.72); font-size:1.1rem; max-width:680px; margin-top:1rem; }
.page-hero .hero-actions { margin-top:2rem; }
.page-hero.center { text-align:center; }
.page-hero.center .breadcrumb,
.page-hero.center h1,
.page-hero.center p { margin-left:auto; margin-right:auto; }
.page-hero.center .hero-actions { justify-content:center; }

/* INTRO */
.intro { padding:7rem 0 4rem; text-align:center; }
.intro h2 { font-size:clamp(1.7rem,4vw,2.3rem); font-weight:800; max-width:820px; margin:0 auto 1rem; }
.intro p { color:var(--gray); font-size:1.08rem; max-width:720px; margin:0 auto; }

/* SECTIONS */
.section { padding:7.5rem 0; }
.section + .section, .section-tint + .section-tint { border-top:1px solid rgba(0,0,0,0.04); }
.section-alt { background:#fafafa; border-top:1px solid #f0f0f0; border-bottom:1px solid #f0f0f0; }
.section-header { text-align:center; margin-bottom:3rem; }
.section-header h2 { font-size:clamp(1.9rem,4.5vw,2.5rem); font-weight:800; margin-bottom:0.5rem; }
.section-header p { color:var(--gray); font-size:1.05rem; }

/* CONTENT (texto largo) */
.content { max-width:820px; margin:0 auto; }
.content h2 { font-size:1.6rem; font-weight:800; margin:2.5rem 0 1rem; }
.content h3 { font-size:1.25rem; font-weight:700; margin:2rem 0 0.75rem; }
.content p { color:#4a4a4a; font-size:1.05rem; margin-bottom:1.2rem; }
.content ul { color:#4a4a4a; font-size:1.05rem; margin:0 0 1.2rem 1.2rem; }
.content li { margin-bottom:0.4rem; }

/* FEATURE CARDS (destacados desde h2/h3) */
.feature-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem; }
.fc { background:#fff; border:1px solid #ececec; border-radius:14px; padding:1.8rem;
  transition:transform .3s, box-shadow .3s, border-color .3s; }
.fc:hover { transform:translateY(-4px); box-shadow:0 16px 34px rgba(0,0,0,0.07); border-color:#e0e0e0; }
.fc .fc-num { display:inline-flex; width:38px; height:38px; align-items:center; justify-content:center;
  background:rgba(236,107,0,0.1); color:var(--primary); border-radius:10px; font-weight:800; margin-bottom:1rem; }
.fc h3 { font-size:1.1rem; margin-bottom:0.4rem; }
.fc p { color:var(--gray); font-size:0.92rem; }

/* CARDS (poster) */
.cards { display:grid; grid-template-columns:repeat(3,1fr); gap:1.6rem; }
.card { position:relative; display:block; text-decoration:none; border-radius:16px; overflow:hidden;
  aspect-ratio:3/4; background:var(--dark); transition:transform .3s, box-shadow .3s; }
.card:hover { transform:translateY(-6px); box-shadow:0 20px 40px rgba(0,0,0,0.18); }
.card-bg { position:absolute; inset:0; background-size:cover; background-position:center; transition:transform .5s; }
.card:hover .card-bg { transform:scale(1.08); }
.card-overlay { position:absolute; inset:0;
  background:linear-gradient(to top, rgba(0,0,0,0.9), rgba(0,0,0,0.15) 60%, rgba(0,0,0,0.05));
  display:flex; flex-direction:column; justify-content:flex-end; padding:2rem; }
.card-accent { width:40px; height:3px; background:var(--accent); margin-bottom:1rem; transition:width .3s; }
.card:hover .card-accent { width:70px; }
.card-overlay h3 { color:var(--light); font-size:1.3rem; margin-bottom:0.5rem; }
.card-overlay p { color:rgba(255,255,255,0.7); font-size:0.85rem; }

/* GALLERY */
.gallery { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.gallery a { display:block; aspect-ratio:4/3; border-radius:12px; overflow:hidden; background:#0d0d0d; }
.gallery img { width:100%; height:100%; object-fit:cover; transition:transform .5s; display:block; }
.gallery a:hover img { transform:scale(1.06); }

/* FEATURES (zigzag) */
.features { padding:7.5rem 0; }
.features-grid { display:grid; grid-template-columns:1fr 1fr; gap:5rem; align-items:center; }
.features-grid + .features-grid { margin-top:6rem; }
.feature-text h3 { font-size:clamp(1.6rem,3.5vw,2rem); font-weight:800; margin-bottom:1rem; }
.feature-text p { color:var(--gray); font-size:1.05rem; margin-bottom:1.5rem; }
.feature-text .link { color:var(--primary); text-decoration:none; font-weight:600;
  display:inline-flex; align-items:center; gap:0.5rem; transition:gap .3s; }
.feature-text .link:hover { gap:1rem; }
.feature-visual { aspect-ratio:4/3; border-radius:16px; overflow:hidden; background-size:cover;
  background-position:center; box-shadow:0 20px 50px rgba(0,0,0,0.12); }

/* STATS BANNER */
.stats-banner { padding:4rem 0; background:linear-gradient(135deg,var(--primary),#d45a00); color:var(--light); }
.stats-banner .container { display:grid; grid-template-columns:repeat(4,1fr); gap:2rem; text-align:center; }
.sb-number { font-size:clamp(1.8rem,4vw,2.5rem); font-weight:900; }
.sb-label { opacity:0.85; font-size:0.95rem; }

/* CHIPS */
.chips { display:flex; flex-wrap:wrap; gap:0.8rem; justify-content:center; }
.chip { text-decoration:none; color:var(--dark); background:#f5f5f5; border:1px solid #ececec;
  border-radius:50px; padding:0.6rem 1.5rem; font-size:0.9rem; font-weight:600; transition:all .25s; }
.chip:hover { color:#fff; background:var(--primary); border-color:var(--primary); transform:translateY(-2px); }

/* LOGOS */
.logos { padding:5rem 0; background:#fafafa; border-top:1px solid #f0f0f0; border-bottom:1px solid #f0f0f0; }
.logos .section-header { margin-bottom:2.5rem; }
.logos-grid { display:flex; flex-wrap:wrap; gap:2.5rem 3.2rem; align-items:center; justify-content:center; }
.logos-grid img { height:36px; max-width:120px; object-fit:contain; filter:grayscale(1); opacity:0.5; transition:filter .3s, opacity .3s; }
.logos-grid img:hover { filter:none; opacity:1; }

/* CONTACT */
.contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:start; }
.contact-card { background:#fafafa; border:1px solid #eee; border-radius:16px; padding:2rem; }
.contact-card h3 { font-size:1.15rem; margin-bottom:1rem; }
.contact-list { list-style:none; }
.contact-list li { margin-bottom:0.8rem; color:#4a4a4a; }
.contact-list a { color:var(--primary); text-decoration:none; font-weight:600; }

/* FORM (HubSpot embed) */
.form-wrap { background:#fafafa; border:1px solid #eee; border-radius:16px; padding:2rem; }
.form-wrap .hs-form,
.form-wrap input[type=text], .form-wrap input[type=email], .form-wrap input[type=tel],
.form-wrap input[type=number], .form-wrap textarea, .form-wrap select, .form-wrap .hs-input {
  width:100%; padding:0.7rem 0.9rem; border:1px solid #ddd; border-radius:6px; font-size:0.95rem;
  margin-top:0.3rem; font-family:inherit; background:#fff; }
.form-wrap .hs-form { width:auto; border:none; padding:0; background:none; }
.form-wrap label { font-size:0.88rem; font-weight:600; display:block; margin-top:1rem; color:#333; }
.form-wrap .hs-form-field { margin-bottom:0.4rem; }
.form-wrap ul.inputs-list { list-style:none; margin:0.4rem 0 0; padding:0; }
.form-wrap .hs-error-msg, .form-wrap .hs-error-msgs label { color:#c0392b; font-size:0.82rem; font-weight:500; }
.form-wrap .hs-button, .form-wrap input[type=submit] {
  width:auto; background:var(--primary); color:#fff; border:none; padding:0.8rem 2.2rem;
  border-radius:4px; font-weight:700; cursor:pointer; margin-top:1.3rem; font-size:0.95rem; }
.form-wrap .hs-button:hover, .form-wrap input[type=submit]:hover { background:var(--accent); }
.form-wrap .legal-consent-container { font-size:0.78rem; color:#888; margin-top:0.8rem; }

/* CTA */
.cta { text-align:center; padding:7rem 2rem; background:#0d0d0d; color:#fff; position:relative; overflow:hidden; }
.cta::before { content:''; position:absolute; inset:0;
  background:radial-gradient(ellipse at center, rgba(236,107,0,0.2), transparent 60%); }
.cta-inner { position:relative; z-index:1; }
.cta h2 { font-size:clamp(2rem,5vw,2.75rem); font-weight:900; margin-bottom:1rem; }
.cta p { color:rgba(255,255,255,0.6); margin-bottom:2rem; font-size:1.1rem; }
.cta .btn { font-size:1rem; padding:0.9rem 2.6rem; }

/* FOOTER */
.footer { background:var(--dark); color:rgba(255,255,255,0.5); padding:4rem 0 2rem; }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1.2fr; gap:3rem; }
.footer-brand img { height:28px; width:auto; margin-bottom:1rem; }
.footer-brand p { font-size:0.85rem; max-width:260px; }
.footer h4 { color:var(--light); margin-bottom:1rem; font-size:0.9rem; }
.footer-links { list-style:none; }
.footer-links li { margin-bottom:0.45rem; font-size:0.85rem; }
.footer-links a { color:rgba(255,255,255,0.5); text-decoration:none; transition:color .2s; }
.footer-links a:hover { color:var(--accent); }
.footer-bottom { border-top:1px solid rgba(255,255,255,0.08); margin-top:3rem; padding-top:1.5rem; text-align:center; font-size:0.8rem; }

@media (max-width:880px) {
  .features-grid { grid-template-columns:1fr; gap:2.5rem; }
  .features-grid + .features-grid { margin-top:4rem; }
  .features-grid .feature-visual { order:-1; }
  .cards, .feature-cards, .gallery { grid-template-columns:repeat(2,1fr); }
  .stats-banner .container { grid-template-columns:repeat(2,1fr); gap:2.5rem; }
  .contact-grid, .footer-grid { grid-template-columns:1fr; }
  .footer-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width:560px) {
  .nav-links { display:none; }
  .cards, .feature-cards, .gallery { grid-template-columns:1fr; }
  .footer-grid { grid-template-columns:1fr; }
}

/* ===================== MAS COLOR DE MARCA ===================== */
/* fondos tintados en calido y secciones oscuras para romper el blanco */
.intro { background:linear-gradient(180deg,#fff5ec,#fff); }
.tipos { padding:6rem 0 5rem; background:linear-gradient(180deg,#fff,#fff5ec); }
.logos { background:#fff5ec; }

/* acento naranja bajo cada titular de seccion */
.section-header h2 { position:relative; padding-bottom:1.1rem; }
.section-header h2::after { content:""; position:absolute; left:50%; bottom:0; transform:translateX(-50%);
  width:58px; height:4px; border-radius:2px; background:linear-gradient(90deg,var(--primary),#ffb347); }

/* tarjetas con acento naranja arriba */
.fc { border-top:3px solid var(--primary); }

/* variantes de fondo de seccion */
.section-tint { background:linear-gradient(180deg,#fff5ec,#fff); }
.section-dark { background:#0f0f15; color:#fff; }
.section-dark .section-header h2 { color:#fff; }
.section-dark .section-header p { color:rgba(255,255,255,0.6); }
.section-dark p, .section-dark .content p, .section-dark .content li { color:rgba(255,255,255,0.72); }
.section-dark .content h2, .section-dark .content h3 { color:#fff; }
.section-dark .feature-text h3 { color:#fff; }
.section-dark .feature-text p { color:rgba(255,255,255,0.66); }
.section-dark .fc { background:rgba(255,255,255,0.05); border-color:rgba(255,255,255,0.1); border-top-color:var(--primary); }
.section-dark .fc h3 { color:#fff; }
.section-dark .fc p { color:rgba(255,255,255,0.6); }
.section-dark .fc .fc-num { background:rgba(255,122,26,0.16); }
.section-dark .chip { background:rgba(255,255,255,0.06); border-color:rgba(255,255,255,0.14); color:#fff; }
.section-dark .chip:hover { background:var(--primary); border-color:var(--primary); }

/* nav con filo naranja sutil */
.nav.scrolled { border-bottom:2px solid rgba(236,107,0,0.25); }

/* ===================== TARJETAS DE MODELO (modulos LED) ===================== */
.models { display:grid; grid-template-columns:repeat(4,1fr); gap:1.3rem; }
.model-card { display:block; text-decoration:none; color:inherit; background:#fff;
  border:1px solid #ececec; border-radius:14px; overflow:hidden;
  transition:transform .3s, box-shadow .3s, border-color .3s; }
.model-card:hover { transform:translateY(-5px); box-shadow:0 16px 34px rgba(0,0,0,0.09); border-color:#e7c9ad; }
.model-img { aspect-ratio:1/1; background:#f4f4f4 center/cover no-repeat; }
.model-body { padding:1.1rem 1.2rem 1.3rem; }
.model-pitch { display:inline-block; background:rgba(236,107,0,0.12); color:var(--primary);
  font-weight:800; font-size:0.76rem; letter-spacing:0.02em; padding:0.22rem 0.6rem;
  border-radius:6px; margin-bottom:0.6rem; }
.model-body h3 { font-size:1rem; margin-bottom:0.25rem; line-height:1.25; }
.model-body p { color:var(--gray); font-size:0.82rem; }
.section-dark .model-card { background:rgba(255,255,255,0.05); border-color:rgba(255,255,255,0.1); }
.section-dark .model-card:hover { border-color:rgba(255,122,26,0.4); }
.section-dark .model-card h3 { color:#fff; }
@media (max-width:880px){ .models { grid-template-columns:repeat(2,1fr); } }

/* ===================== FICHA DE MODELO ===================== */
.hero-pitch { display:inline-block; background:rgba(255,122,26,0.18); border:1px solid rgba(255,122,26,0.45);
  color:#ffb347; font-weight:800; padding:0.2rem 0.7rem; border-radius:6px; font-size:0.9rem; }
.model-detail { display:grid; grid-template-columns:1fr 1fr; gap:3.5rem; align-items:start; }
.model-photo { aspect-ratio:1/1; background:#f4f4f4 center/contain no-repeat; border-radius:16px;
  border:1px solid #ececec; }
.specs { list-style:none; margin:0 0 1.8rem; }
.specs li { display:flex; justify-content:space-between; gap:1rem; padding:0.9rem 0; border-bottom:1px solid #eee; }
.specs li span { color:var(--gray); }
.specs li strong { font-weight:700; text-align:right; }
@media (max-width:880px){ .model-detail { grid-template-columns:1fr; gap:2rem; } }

/* ===================== REJILLA DE PROYECTOS ===================== */
.projects { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; }
.project-card { position:relative; display:block; border-radius:14px; overflow:hidden;
  aspect-ratio:4/3; background:#0d0d0d; text-decoration:none; box-shadow:0 6px 16px rgba(0,0,0,0.3); }
.project-card::after { content:""; position:absolute; inset:0; pointer-events:none; z-index:1;
  background:linear-gradient(to top, rgba(8,8,8,0.45), rgba(8,8,8,0) 40%); transition:background .35s; }
.project-card:hover::after { background:linear-gradient(to top, rgba(8,8,8,0.9), rgba(8,8,8,0.1) 75%); }
.project-card img { width:100%; height:100%; object-fit:cover; transition:transform .6s ease; display:block; }
.project-card:hover img { transform:scale(1.08); }
.project-cap { position:absolute; inset:0; z-index:2; display:flex; flex-direction:column;
  justify-content:flex-end; padding:1.1rem; opacity:0; transform:translateY(10px);
  transition:opacity .3s ease, transform .3s ease; }
.project-card:hover .project-cap { opacity:1; transform:none; }
.project-cap span { color:#fff; font-size:0.86rem; font-weight:700; line-height:1.3; }
.project-cap .pc-link { color:var(--primary); font-size:0.72rem; font-weight:700; margin-top:0.4rem;
  text-transform:uppercase; letter-spacing:0.05em; }
.projects-count { text-align:center; color:var(--gray); margin-bottom:2.2rem; font-size:0.95rem; }
@media (max-width:880px){ .projects { grid-template-columns:repeat(2,1fr); }
  .project-cap { opacity:1; transform:none; }
  .project-card::after { background:linear-gradient(to top, rgba(8,8,8,0.85), rgba(8,8,8,0) 55%); } }

/* ===================== BLOG ===================== */
.blog-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.6rem; }
.blog-card { display:block; text-decoration:none; color:inherit; background:#fff;
  border:1px solid #ececec; border-radius:14px; overflow:hidden;
  transition:transform .3s, box-shadow .3s, border-color .3s; }
.blog-card:hover { transform:translateY(-5px); box-shadow:0 18px 36px rgba(0,0,0,0.08); border-color:#e7c9ad; }
.blog-img { aspect-ratio:16/10; background:#0d0d0d center/cover no-repeat; }
.blog-body { padding:1.2rem 1.3rem 1.5rem; }
.blog-date { color:var(--primary); font-weight:700; font-size:0.76rem; text-transform:uppercase; letter-spacing:0.03em; }
.blog-body h3 { font-size:1.05rem; line-height:1.3; margin:0.4rem 0; }
.blog-body p { color:var(--gray); font-size:0.88rem; }
.section-dark .blog-card { background:rgba(255,255,255,0.05); border-color:rgba(255,255,255,0.1); }
.section-dark .blog-card h3 { color:#fff; }
/* contenido de artículo */
.content img { max-width:100%; height:auto; border-radius:10px; margin:1.2rem 0; }
.content a { color:var(--primary); text-decoration:underline; }
.content a:hover { color:var(--accent); }
.content h1 { font-size:1.8rem; font-weight:800; margin:2rem 0 1rem; }
.article-meta { color:var(--gray); font-size:0.9rem; margin-top:0.8rem; }
@media (max-width:880px){ .blog-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .blog-grid { grid-template-columns:1fr; } }

/* ===================== TABLAS DE CONTENIDO ===================== */
.content table.tabla-specs { width:100%; border-collapse:collapse; margin:1.4rem 0; font-size:0.95rem; }
.content .tabla-specs th, .content .tabla-specs td { padding:0.7rem 0.9rem; text-align:left;
  border-bottom:1px solid #ececec; vertical-align:top; }
.content .tabla-specs thead th { background:#fff5ec; font-weight:700; font-size:0.88rem;
  border-bottom:2px solid var(--primary); }
.content .tabla-specs tbody tr:last-child td { border-bottom:none; }
.section-dark .tabla-specs th, .section-dark .tabla-specs td { border-bottom-color:rgba(255,255,255,0.12); }
.section-dark .tabla-specs thead th { background:rgba(255,122,26,0.12); }
/* listas de contenido algo mas aireadas */
.content ul li, .content ol li { margin-bottom:0.55rem; }
.content ol { margin:0 0 1.2rem 1.3rem; color:#4a4a4a; font-size:1.05rem; }

/* UX:INI — Bloque A auditoria 2026-07-29 (mejorar_ux.py, idempotente) */
/* --- A3: paleta accesible --------------------------------------------- */
/* #ec6b00 da 3,15:1 sobre blanco (AA pide 4,5). Se reserva para decoracion
   y titulares grandes; el texto y los botones usan --primary-ink (4,60:1). */
:root { --primary-ink:#c25400; --primary-ink-dark:#a84800; --gray:#6b6b6b; }

/* --- A1: el CTA dentro de .content salia naranja sobre naranja --------- */
/* .content a (0,1,1) ganaba a .btn (0,1,0) y pintaba el texto del boton del
   mismo color que su fondo. Afectaba a 234 paginas. */
.content a.btn { color:var(--light); text-decoration:none; }
.content a.btn:hover { color:var(--light); }
.content a.btn.btn-light,
.content a.btn.btn-light:hover { color:var(--dark); }

/* --- A3: contraste de botones, enlaces y texto secundario -------------- */
.btn { background:var(--primary-ink); }
.btn:hover { background:var(--primary-ink-dark); }
/* .btn-light (0,1,0) se define ANTES que este bloque, asi que el .btn de
   arriba le pisaba el fondo blanco y el boton secundario salia naranja.
   Con .btn.btn-light (0,2,0) vuelve a ganar. */
.btn.btn-light { background:#fff; color:var(--dark); }
.btn.btn-light:hover { background:#f2f2f2; color:var(--dark); }
.content a, .link, .contact-list a, .blog-date, .model-pitch, .fc-num {
  color:var(--primary-ink); }

/* --- A5: foco visible (no habia ninguna regla :focus en todo el CSS) --- */
:where(a, button, input, select, textarea):focus-visible {
  outline:3px solid var(--primary-ink); outline-offset:2px; border-radius:4px; }

/* --- A4: los 116 proyectos mostraban el titulo solo al pasar el raton -- */
.project-cap { opacity:1; transform:none; }
.project-card::after {
  background:linear-gradient(to top, rgba(8,8,8,0.85), rgba(8,8,8,0) 55%); }

/* --- A7: acabado ------------------------------------------------------- */
:where(h1,h2,h3,h4)[id] { scroll-margin-top:90px; }
.hero { height:100dvh; }
@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after {
    animation-duration:.001ms !important; animation-iteration-count:1 !important;
    transition-duration:.001ms !important; scroll-behavior:auto !important; }
  .btn:hover, .project-card:hover img { transform:none; }
}

/* --- A2: menu movil ---------------------------------------------------- */
/* Antes: @media (max-width:560px){ .nav-links{display:none} } sin nada que lo
   sustituyera. En movil la cabecera quedaba en logo + boton Presupuesto. */
.nav-toggle { display:none; width:44px; height:44px; padding:0; border:0;
  background:none; cursor:pointer; align-items:center; justify-content:center; }
.nav-toggle span { display:block; width:22px; height:2px; background:var(--dark);
  position:relative; transition:background .2s; }
.nav-toggle span::before, .nav-toggle span::after {
  content:''; position:absolute; left:0; width:22px; height:2px;
  background:var(--dark); transition:transform .25s; }
.nav-toggle span::before { top:-7px; }
.nav-toggle span::after  { top:7px; }
.nav-toggle[aria-expanded="true"] span { background:transparent; }
.nav-toggle[aria-expanded="true"] span::before { transform:translateY(7px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span::after  { transform:translateY(-7px) rotate(-45deg); }
.nav-extra, .nav-cta { display:none; }

/* El menu pasa a hamburguesa por debajo de 940px, no de 560: entre 561 y 940
   los 5 enlaces + logo + boton no caben con holgura y la barra se desbordaba
   (a 600px "Contacto" quedaba debajo del boton de presupuesto; a 900px el
   logo rozaba el primer enlace). */
@media (max-width:940px) {
  .nav .container { flex-wrap:wrap; gap:0.6rem; }
  .nav-logo { margin-right:auto; }
  .nav-toggle { display:inline-flex; }
  .nav-links { display:none; order:9; width:100%; }
  .nav-links.is-open { display:flex; flex-direction:column; gap:0;
    padding:0.4rem 0 0.6rem; }
  .nav-links.is-open li { width:100%; border-top:1px solid #ececec; }
  .nav-links.is-open a { display:block; padding:0.85rem 0.25rem; font-size:1rem; }
  .nav-extra { display:block; }
}

@media (max-width:560px) {
  /* el boton de presupuesto ya no cabe junto a logo + hamburguesa (235+44+140
     se salen de los 326px utiles a 390px): pasa a ser la entrada destacada del
     panel, sigue a un toque y la barra aguanta hasta 320px */
  .nav > .container > .btn { display:none; }
  .nav .container { padding-left:1.1rem; padding-right:1.1rem; }
  .nav-logo img { height:26px; }
  .nav-cta { display:block; border-top:0 !important; padding-top:0.6rem; }
  .nav-links.is-open .nav-cta a { background:var(--primary-ink); color:var(--light);
    border-radius:4px; text-align:center; font-weight:600; padding:0.85rem 1rem; }
  /* A6/E5: areas de pulsacion de 44 px */
  .breadcrumb a, .footer-links a, .contact-list a { display:inline-block;
    padding-top:0.55rem; padding-bottom:0.55rem; }
  .link { padding-top:0.5rem; padding-bottom:0.5rem; }
}
/* UX:FIN */

/* FORM:PRESUPUESTO — formulario propio (sustituye al embed de HubSpot).
   Va al final a proposito: reusa .form-wrap y solo anade lo que el embed no
   tenia (toggle, slider, boton). Selectores propios de .budget-form, asi que
   no pisa ninguna regla anterior. */
.budget-form .control-group { margin-bottom:0.2rem; }
.budget-form .grid-2-col { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.budget-form .label-wrapper { display:flex; align-items:baseline; justify-content:space-between;
  gap:1rem; margin-top:1rem; }
.budget-form .label-wrapper label { margin-top:0; }
.budget-form .value-bubble { font-weight:700; font-size:0.85rem; color:var(--primary-ink);
  background:rgba(236,107,0,0.1); border-radius:999px; padding:0.15rem 0.7rem; }

.budget-form .form-toggle { display:grid; grid-template-columns:1fr 1fr; gap:0.5rem;
  margin-top:0.45rem; }
.budget-form .toggle-btn { padding:0.7rem 0.9rem; border:1px solid #ddd; border-radius:6px;
  background:#fff; font-family:inherit; font-size:0.92rem; font-weight:600; color:#4a4a4a;
  cursor:pointer; transition:background .18s, border-color .18s, color .18s; }
.budget-form .toggle-btn:hover { border-color:var(--primary-ink); color:var(--primary-ink); }
.budget-form .toggle-btn.active { background:var(--primary-ink); border-color:var(--primary-ink);
  color:#fff; }

.budget-form .slider { -webkit-appearance:none; appearance:none; width:100%; height:6px;
  margin-top:0.9rem; border-radius:999px; background:#e4e4e4; outline:none; padding:0; }
.budget-form .slider::-webkit-slider-thumb { -webkit-appearance:none; appearance:none;
  width:22px; height:22px; border-radius:50%; background:var(--primary-ink); cursor:pointer;
  border:3px solid #fff; box-shadow:0 1px 4px rgba(0,0,0,0.25); }
.budget-form .slider::-moz-range-thumb { width:22px; height:22px; border-radius:50%;
  background:var(--primary-ink); cursor:pointer; border:3px solid #fff;
  box-shadow:0 1px 4px rgba(0,0,0,0.25); }
.budget-form .slider:focus-visible { box-shadow:0 0 0 3px rgba(236,107,0,0.35); }

.budget-form .btn-submit { width:100%; margin-top:1.4rem; padding:0.95rem 1.5rem; border:none;
  border-radius:4px; background:var(--primary-ink); color:#fff; font-family:inherit;
  font-size:0.95rem; font-weight:700; letter-spacing:0.02em; cursor:pointer;
  transition:background .2s; }
.budget-form .btn-submit:hover:not(:disabled) { background:var(--primary-ink-dark); }
.budget-form .btn-submit:disabled { opacity:0.72; cursor:default; }
.budget-form .form-legal { font-size:0.78rem; color:#6b6b6b; margin-top:0.9rem; line-height:1.5; }
.budget-form .form-legal a { color:var(--primary-ink); font-weight:600; }
.budget-form .cf-turnstile { margin-top:1rem; }

@media (max-width:640px) {
  .budget-form .grid-2-col { grid-template-columns:1fr; gap:0; }
}
/* FORM:FIN */
/* razón social del grupo en el pie (legales.py) */
.footer-bottom .fiscal{display:block;margin-top:.4rem;opacity:.75;font-size:.85em}