/* ── crítico (antes inline en cada página; 2026-10-14) ── */
@font-face{font-family:'Baloo 2';font-style:normal;font-weight:500 800;font-display:swap;src:url(/fonts/baloo2-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Baloo 2';font-style:normal;font-weight:500 800;font-display:swap;src:url(/fonts/baloo2-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:'Mulish';font-style:normal;font-weight:400 800;font-display:swap;src:url(/fonts/mulish-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Mulish';font-style:normal;font-weight:400 800;font-display:swap;src:url(/fonts/mulish-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:'Mulish Fallback';src:local('Arial');font-weight:100 550;size-adjust:102.96%;ascent-override:97.61%;descent-override:24.28%;line-gap-override:0.00%}@font-face{font-family:'Mulish Fallback';src:local('Arial Bold'),local('Arial-BoldMT');font-weight:551 750;size-adjust:99.33%;ascent-override:101.18%;descent-override:25.17%;line-gap-override:0.00%}@font-face{font-family:'Mulish Fallback';src:local('Arial Bold'),local('Arial-BoldMT');font-weight:751 1000;size-adjust:101.31%;ascent-override:99.20%;descent-override:24.68%;line-gap-override:0.00%}@font-face{font-family:'Baloo 2 Fallback';src:local('Arial Bold'),local('Arial-BoldMT');font-weight:100 650;size-adjust:90.83%;ascent-override:118.69%;descent-override:57.69%;line-gap-override:0.00%}@font-face{font-family:'Baloo 2 Fallback';src:local('Arial Bold'),local('Arial-BoldMT');font-weight:651 750;size-adjust:92.44%;ascent-override:116.61%;descent-override:56.68%;line-gap-override:0.00%}@font-face{font-family:'Baloo 2 Fallback';src:local('Arial Bold'),local('Arial-BoldMT');font-weight:751 1000;size-adjust:93.85%;ascent-override:114.87%;descent-override:55.84%;line-gap-override:0.00%}:root{--color-primary: #1F5FD1;--color-secondary: #1B4DB3;--color-navy: #15356B;--color-ink: #16294F;--color-accent: #F6B71E;--color-accent-dk: #D99A06;--color-cta: #E8590C;--color-cta-dk: #C2410C;--color-bg: #FFFFFF;--color-bg-alt: #EEF3FB;--color-bg-soft: #F6F9FE;--color-text: #44516A;--color-text-muted: #6B7791;--color-border: #DBE4F0;--shadow-card: 0 6px 24px rgba(21,53,107,.08);--shadow-hover: 0 16px 44px rgba(21,53,107,.16);--shadow-soft: 0 2px 10px rgba(21,53,107,.06);--font-head: 'Baloo 2', 'Baloo 2 Fallback', 'Mulish', system-ui, sans-serif;--font-main: 'Mulish', 'Mulish Fallback', system-ui, -apple-system, sans-serif;--container: 1180px;--radius: 20px;--radius-sm: 12px;--radius-btn: 10px;--radius-pill: 999px;--transition: .22s ease}*, ::before, ::after{box-sizing: border-box;margin: 0px;padding: 0px}html{scroll-behavior: smooth}html, body{overflow-x: hidden}body{font-family: var(--font-main);font-size: 1rem;line-height: 1.7;color: var(--color-text);background: var(--color-bg);-webkit-font-smoothing: antialiased}h1, h2, h3, h4{font-family: var(--font-head);font-weight: 700;line-height: 1.18;color: var(--color-ink)}img, video, svg{max-width: 100%;height: auto;display: block}a{color: inherit;text-decoration: none}ul[role="list"]{list-style: none}button{font-family: inherit;cursor: pointer;border-width: medium;border-style: none;border-color: currentcolor;border-image: none;background: none}input, textarea, select{font-family: inherit;font-size: 1rem}.container{width: min(100% - 2rem, var(--container));margin-inline: auto}.skip-link{position: absolute;top: -100%;left: 1rem;background: var(--color-navy);color: rgb(255, 255, 255);padding: 0.5rem 1rem;border-radius: 0 0 var(--radius-sm) var(--radius-sm);z-index: 9999;font-size: 0.875rem}.skip-link:focus{top: 0px}.section{padding: 5.5rem 0px}.section--soft{background: var(--color-bg-soft)}.section-header{text-align: center;max-width: 680px;margin: 0px auto 3.25rem}.section-header .eyebrow, .eyebrow{display: inline-block;font-family: var(--font-main);font-size: 0.78rem;font-weight: 800;letter-spacing: 0.12em;text-transform: uppercase;color: var(--color-primary);margin-bottom: 0.85rem}.section-header h2{font-size: clamp(1.85rem, 3.4vw, 2.6rem);color: var(--color-ink);line-height: 1.16;margin-bottom: 0.85rem}.section-header p{color: var(--color-text-muted);font-size: 1.08rem}.header{position: sticky;top: 0px;z-index: 800;background: rgb(255, 255, 255);transition: box-shadow var(--transition)}.header__topbar{background: var(--color-accent);color: var(--color-navy);font-size: 0.82rem;font-weight: 600;padding: 0.5rem 0px}.header__topbar-inner{display: flex;align-items: center;justify-content: center;gap: 1.5rem;flex-wrap: wrap;text-align: center}.header__topbar-left, .header__topbar-right{display: flex;align-items: center;gap: 1.25rem;flex-wrap: wrap;justify-content: center}.topbar__link, .topbar__info{display: flex;align-items: center;gap: 0.4rem;color: var(--color-navy);text-decoration: none;white-space: nowrap}.topbar__link:hover{color: rgb(0, 0, 0);text-decoration: underline}.topbar__badge{background: var(--color-navy);color: rgb(255, 255, 255);font-size: 0.72rem;font-weight: 800;letter-spacing: 0.03em;padding: 0.2rem 0.7rem;border-radius: var(--radius-pill)}.header__main{display: flex;align-items: center;gap: 1.5rem;padding-block: 0.9rem}.header__logo{display: flex;align-items: center;flex-shrink: 0}.logo-svg{height: 46px;width: auto}.nav-main{flex: 1 1 0%;display: flex;align-items: center;justify-content: center}.nav-main > ul{display: flex;align-items: center;gap: 0.2rem;list-style: none}.nav-main > ul > li > a, .nav-main > ul > li > button{display: flex;align-items: center;gap: 0.25rem;padding: 0.55rem 0.85rem;font-family: var(--font-main);font-size: 0.94rem;font-weight: 700;color: var(--color-ink);border-radius: var(--radius-btn);transition: color var(--transition), background var(--transition);white-space: nowrap;background: none;border-width: medium;border-style: none;border-color: currentcolor;border-image: none;cursor: pointer}.nav-main > ul > li > a:hover, .nav-main > ul > li > button:hover, .nav-main > ul > li > a[aria-current="page"]{color: var(--color-primary);background: var(--color-bg-alt)}.nav-main > ul > li > a[aria-current="page"]{font-weight: 800}.has-dropdown{position: relative}.nav-dropdown{position: absolute;top: calc(100% + 0.4rem);left: 50%;transform: translateX(-50%);background: rgb(255, 255, 255);border-radius: var(--radius);box-shadow: var(--shadow-hover);border: 1px solid var(--color-border);padding: 0.8rem;min-width: 300px;opacity: 0;visibility: hidden;pointer-events: none;transition: opacity var(--transition), visibility var(--transition);z-index: 100;display: grid;grid-template-columns: 1fr 1fr;gap: 0.2rem}.has-dropdown:hover .nav-dropdown, .has-dropdown:focus-within .nav-dropdown{opacity: 1;visibility: visible;pointer-events: auto}@media (min-width: 769px){.has-dropdown::after{content: "";position: absolute;left: 0px;right: 0px;top: 100%;height: 0.6rem}}.nav-dropdown a{display: block;padding: 0.5rem 0.75rem;font-size: 0.875rem;font-weight: 600;color: var(--color-text);border-radius: var(--radius-btn);transition: background var(--transition), color var(--transition);white-space: nowrap}.nav-dropdown a:hover{background: var(--color-bg-alt);color: var(--color-primary)}.nav-dropdown a[aria-current="page"]{color: var(--color-primary);font-weight: 800}.header__cta{flex-shrink: 0;display: flex;align-items: center;gap: 0.5rem;padding: 0.7rem 1.4rem;background: var(--color-cta);color: rgb(255, 255, 255);border-radius: var(--radius-pill);font-family: var(--font-head);font-weight: 700;font-size: 0.95rem;white-space: nowrap;box-shadow: rgba(232, 89, 12, 0.34) 0px 6px 16px;transition: background var(--transition), transform var(--transition), box-shadow var(--transition)}.header__cta:hover{background: var(--color-cta-dk);transform: translateY(-1px);box-shadow: rgba(232, 89, 12, 0.42) 0px 10px 22px}.nav-toggle{display: none;flex-shrink: 0;width: 44px;height: 44px;align-items: center;justify-content: center;color: var(--color-navy);border-radius: var(--radius-btn)}.nav-toggle:hover{background: var(--color-bg-alt)}.hero{position: relative;background: var(--color-navy);color: rgb(255, 255, 255);padding: 5rem 0px 4.5rem;overflow: hidden;isolation: isolate}.hero__bg{position: absolute;inset: 0px;object-fit: cover;width: 100%;height: 100%;z-index: -2}.hero::after{content: "";position: absolute;inset: 0px;z-index: -1;background: linear-gradient(105deg, rgba(13, 26, 52, 0.92) 0%, rgba(15, 40, 86, 0.78) 45%, rgba(15, 40, 86, 0.45) 100%)}.hero__inner{display: grid;grid-template-columns: 1fr;gap: 2.5rem;align-items: center}.hero__eyebrow{display: inline-flex;align-items: center;gap: 0.5rem;background: rgba(246, 183, 30, 0.16);border: 1px solid rgba(246, 183, 30, 0.5);color: var(--color-accent);font-family: var(--font-main);font-size: 0.8rem;font-weight: 800;text-transform: uppercase;letter-spacing: 0.08em;padding: 0.4rem 0.95rem;border-radius: var(--radius-pill);margin-bottom: 1.1rem}.hero h1{font-size: clamp(2.2rem, 5.4vw, 3.5rem);font-weight: 800;line-height: 1.08;color: rgb(255, 255, 255);margin-bottom: 1.3rem;letter-spacing: -0.01em}.hero h1 em{font-style: normal;color: var(--color-accent)}.hero__subtitle{font-size: clamp(1.05rem, 2vw, 1.22rem);color: rgba(255, 255, 255, 0.9);margin-bottom: 2rem;line-height: 1.6;max-width: 620px}.hero__ctas{display: flex;flex-wrap: wrap;gap: 1rem}.hero__badges{display: flex;flex-wrap: wrap;gap: 0.7rem;margin-top: 2.5rem}.hero__badge{display: flex;align-items: center;gap: 0.5rem;background: rgba(255, 255, 255, 0.1);border: 1px solid rgba(255, 255, 255, 0.2);padding: 0.45rem 1rem;border-radius: var(--radius-pill);font-size: 0.85rem;font-weight: 600;color: rgb(255, 255, 255)}.hero__badge svg{color: var(--color-accent);flex-shrink: 0}.hero--home{padding: 7rem 0px 6rem;text-align: center}.hero--home .hero__inner{justify-items: center}.hero--home .hero__subtitle{margin-inline: auto}.hero--home .hero__ctas{justify-content: center}.hero--home .hero__badges{justify-content: center}.hero--centered{text-align: center}.hero--centered .hero__inner{justify-items: center;max-width: 880px;margin-inline: auto}.hero--centered .hero__eyebrow{margin-inline: auto}.hero--centered .hero__subtitle{margin-inline: auto}.hero--centered .hero__ctas{justify-content: center}.hero--centered .hero__badges{justify-content: center}.hero--centered .breadcrumb ol{display: flex;flex-wrap: wrap;gap: 0.4rem;justify-content: center;padding: 0px;margin: 0px;list-style: none}.intro-split{display: grid;grid-template-columns: 1fr 1.1fr;gap: 3.5rem;align-items: center}.intro-split__media{border-radius: var(--radius);overflow: hidden;box-shadow: var(--shadow-card);aspect-ratio: 4 / 5;background: var(--color-bg-alt)}.intro-split__media img{width: 100%;height: 100%;object-fit: cover}.intro-split__body h2{font-size: clamp(1.7rem, 3vw, 2.3rem);margin-bottom: 1.1rem}.intro-split__body > p{color: var(--color-text);margin-bottom: 1rem}.intro-split__body > p strong{color: var(--color-ink)}.check-list{list-style: none;display: flex;flex-direction: column;gap: 1rem;margin: 1.5rem 0px}.check-list li{display: flex;gap: 0.85rem;align-items: flex-start}.check-list li svg{flex-shrink: 0;color: var(--color-primary);margin-top: 0.15rem}.check-list li strong{color: var(--color-ink);font-weight: 800}.check-list li span{display: block;color: var(--color-text-muted);font-size: 0.94rem}.faq-answer{display: none;padding: 0px 1.3rem 1.2rem}.faq-answer p, .faq-answer ul, .faq-answer ol{font-size: 0.95rem;color: var(--color-text-muted);line-height: 1.7}.contact-form, .form-block{display: flex;flex-direction: column;gap: 1.2rem}.form-group{display: flex;flex-direction: column;gap: 0.45rem}.form-group label{font-size: 0.875rem;font-weight: 700;color: var(--color-ink)}.form-group input, .form-group textarea, .form-group select{padding: 0.8rem 1rem;border: 1.5px solid var(--color-border);border-radius: var(--radius-btn);font-size: 1rem;color: var(--color-text);background: var(--color-bg-soft);transition: border-color var(--transition), box-shadow var(--transition), background var(--transition);width: 100%;min-height: 46px}.form-group input:focus, .form-group textarea:focus, .form-group select:focus{border-color: var(--color-primary);background: rgb(255, 255, 255);box-shadow: rgba(31, 95, 209, 0.12) 0px 0px 0px 3px;outline: none}.form-section__grid{display: grid;grid-template-columns: 1fr 1fr;gap: 3.5rem;align-items: center}.form-section__card{background: rgb(255, 255, 255);border-radius: var(--radius);padding: 2.25rem;box-shadow: var(--shadow-card);border: 1px solid var(--color-border)}.form-section__card h2{font-size: 1.4rem;color: var(--color-ink);margin-bottom: 1.5rem}@media (max-width: 768px){.form-section__grid{grid-template-columns: 1fr;gap: 2rem}}.breadcrumb{display: flex;flex-wrap: wrap;align-items: center;gap: 0.4rem;font-size: 0.82rem;color: var(--color-text-muted);margin-bottom: 1.5rem;list-style: none}.breadcrumb li + li::before{content: "/";opacity: 0.5}.breadcrumb a{color: var(--color-text-muted)}.breadcrumb a:hover{color: var(--color-primary)}.btn{display: inline-flex;align-items: center;justify-content: center;gap: 0.55rem;padding: 0.9rem 1.85rem;border-radius: var(--radius-btn);font-family: var(--font-head);font-size: 1rem;font-weight: 700;cursor: pointer;border: 2px solid transparent;transition: background var(--transition), color var(--transition), border-color var(--transition), box-shadow var(--transition), transform var(--transition);min-height: 50px;white-space: nowrap}.btn--primary{background: var(--color-cta);color: rgb(255, 255, 255);border-color: var(--color-cta);box-shadow: rgba(232, 89, 12, 0.3) 0px 8px 20px}.btn--primary:hover{background: var(--color-cta-dk);border-color: var(--color-cta-dk);transform: translateY(-2px);box-shadow: rgba(232, 89, 12, 0.38) 0px 12px 26px}.btn--secondary{background: var(--color-accent);color: var(--color-navy);border-color: var(--color-accent);box-shadow: rgba(246, 183, 30, 0.32) 0px 8px 20px}.btn--secondary:hover{background: var(--color-accent-dk);border-color: var(--color-accent-dk);transform: translateY(-2px)}.btn--outline{background: transparent;color: rgb(255, 255, 255);border-color: rgba(255, 255, 255, 0.55)}.btn--outline:hover{background: rgba(255, 255, 255, 0.12);border-color: rgb(255, 255, 255)}.btn--sm{padding: 0.55rem 1.1rem;font-size: 0.9rem;min-height: 40px}.btn--lg{padding: 1.05rem 2.4rem;font-size: 1.08rem;min-height: 58px}.mobile-cta-bar{display: flex;position: fixed;bottom: 0px;left: 0px;right: 0px;z-index: 950;box-shadow: rgba(0, 0, 0, 0.14) 0px -2px 14px}.cta-btn{flex: 1 1 0%;display: flex;align-items: center;justify-content: center;gap: 0.5rem;padding: 1rem;font-family: var(--font-head);font-size: 0.95rem;font-weight: 700;min-height: 56px;border-width: medium;border-style: none;border-color: currentcolor;border-image: none;cursor: pointer}.cta-btn--email{background: var(--color-navy);color: rgb(255, 255, 255)}.cta-btn--presup{background: var(--color-accent);color: var(--color-navy)}@media (max-width: 768px){.section{padding: 3.75rem 0px}.header__topbar{display: none}.nav-main{display: none;position: fixed;inset: 0px;background: rgb(255, 255, 255);flex-direction: column;justify-content: flex-start;padding: 5rem 2rem 2rem;z-index: 700;overflow-y: auto}.nav-main > ul{flex-direction: column;align-items: stretch;gap: 0px;width: 100%}.nav-main > ul > li > a, .nav-main > ul > li > button{padding: 0.9rem 0.5rem;font-size: 1.05rem;border-radius: 0px;border-bottom: 1px solid var(--color-border)}.nav-dropdown{position: static;transform: none;opacity: 1;visibility: visible;pointer-events: auto;box-shadow: none;border-width: medium;border-style: none;border-color: currentcolor;border-image: none;background: var(--color-bg-alt);border-radius: var(--radius-sm);display: none;grid-template-columns: 1fr;padding: 0.5rem 0.75rem;min-width: 0px}.nav-toggle{display: flex}.header__cta{display: none}.header__main{padding-block: 0.75rem}.hero__inner{grid-template-columns: 1fr}.intro-split, .showcase-row{grid-template-columns: 1fr;gap: 2rem}.intro-split__media, .showcase-row__media{aspect-ratio: 16 / 10}.mobile-cta-bar{display: flex}main{padding-bottom: 3.5rem}}@media (max-width: 480px){.hero__ctas{flex-direction: column}.hero__ctas .btn{width: 100%}}@media (min-width: 769px){.mobile-cta-bar{display: none}}@media (prefers-reduced-motion: reduce){*, ::before, ::after{animation-duration: 0.001ms !important;transition-duration: 0.001ms !important;scroll-behavior: auto !important}}.hero--split{text-align: left}.hero--split .hero__inner{grid-template-columns: 1.05fr 0.95fr;align-items: center}.hero--split .hero__subtitle{max-width: 640px}.hero--split .breadcrumb ol{display: flex;flex-wrap: wrap;gap: 0.4rem;padding: 0px;margin: 0px;list-style: none}.hero--split .btn--lg{padding-inline: 2.1rem}.hero__media img{width: 100%;height: auto;border-radius: var(--radius);box-shadow: rgba(8, 20, 44, 0.4) 0px 24px 60px;display: block}@media (max-width: 768px){.hero--split .hero__inner{grid-template-columns: 1fr}.hero--split .hero__media{max-width: 520px;margin-inline: auto}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}/*elche-img-nav:start*/.nav-main>ul>li>button.is-active,.nav-main>ul>li>a.is-active{color:var(--color-primary);background:var(--color-bg-alt)}.nav-dropdown--single{grid-template-columns:1fr}.has-dropdown.submenu-open .nav-dropdown{opacity:1;visibility:visible;pointer-events:auto}@media (min-width:769px) and (max-width:1180px){.header__main{gap:.9rem}.nav-main>ul>li>a,.nav-main>ul>li>button{padding:.5rem .55rem;font-size:.88rem}.header__cta{padding:.6rem 1rem;font-size:.88rem}.logo-svg{height:40px}}@media (min-width:769px) and (max-width:1020px){.header__cta{display:none}}.nav-main>ul>li>a svg,.nav-main>ul>li>button svg{flex-shrink:0}@media (min-width:1181px){.header__main{gap:1rem}.nav-main>ul>li>a,.nav-main>ul>li>button{padding:.55rem .7rem}}.header__actions{display:flex;align-items:center;gap:.6rem;flex-shrink:0}.header__urgent{flex-shrink:0;display:inline-flex;align-items:center;gap:.45rem;min-height:44px;padding:.6rem 1.1rem;border-radius:var(--radius-pill);background:#C81E1E;color:#fff;font-family:var(--font-head);font-weight:700;font-size:.95rem;white-space:nowrap;box-shadow:0 6px 16px rgba(200,30,30,.3);transition:background var(--transition),transform var(--transition)}.header__urgent:hover{background:#9F1717;transform:translateY(-1px)}.header__urgent[aria-current="page"]{box-shadow:0 0 0 3px rgba(200,30,30,.28)}@media (min-width:769px) and (max-width:1280px){.header__urgent-lbl{display:none}.header__urgent{padding:.6rem .9rem}}@media (max-width:768px){.header__main{gap:.6rem}.logo-svg{height:40px}.header__actions{margin-left:auto}.header__urgent{padding:.5rem .85rem;font-size:.88rem}}@media (max-width:420px){.header__urgent-lbl{display:none}}.hero__bg-pic,.post-header__bg{position:absolute;inset:0;z-index:-2}.hero__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}.hero--home::after,.hero--centered::after{background:linear-gradient(180deg,rgba(13,26,52,.84) 0%,rgba(15,40,86,.7) 100%)}.legal-hero{position:relative;isolation:isolate;overflow:hidden;background:var(--color-navy)}.legal-hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(105deg,rgba(13,26,52,.9),rgba(15,40,86,.78))}.post-header--bg{position:relative;isolation:isolate;overflow:hidden;border-radius:var(--radius);padding:2.2rem 1.8rem 1.6rem;background:var(--color-navy);color:#fff}.post-header--bg::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(160deg,rgba(13,26,52,.9),rgba(15,40,86,.8))}.post-header.post-header--bg h1{color:#fff}.post-header.post-header--bg .eyebrow{background:rgba(246,183,30,.18);color:var(--color-accent)}.post-header.post-header--bg .post-meta{color:rgba(255,255,255,.85);border-bottom-color:rgba(255,255,255,.2)}.post-header.post-header--bg .post-meta strong{color:#fff}.post-main{min-width:0}@media (max-width:768px){.nav-main>ul>li>button{width:100%;text-align:left}.post-header--bg{padding:1.6rem 1.2rem 1.2rem}}/*elche-img-nav:end*/
/* ── fin crítico ── */

/* ============================================================
   style.css — Desatascos en Elche · REDISEÑO 2026
   Lenguaje visual: azul royal + dorado + banda navy,
   tipografía redondeada (Baloo 2 / Mulish), botones pill,
   hero a sangre completa, secciones zig-zag.
   Orden: variables · reset · layout · header · hero · intro-split
          feature-band · showcase · servicios · proceso · testimonios
          faq · cta-banner · footer · formulario · zonas · blog
          nosotros · legal · utilidades · responsive
   ============================================================ */

/* ─────────────────────────────────────────────────────────────
   1. CUSTOM PROPERTIES
   ───────────────────────────────────────────────────────────── */
:root {
  --color-primary:    #1F5FD1;   /* azul royal — botones, links, marca   */
  --color-secondary:  #1B4DB3;   /* azul medio — hovers, detalles        */
  --color-navy:       #15356B;   /* navy profundo — bandas oscuras        */
  --color-ink:        #16294F;   /* texto de titulares                   */
  --color-accent:     #F6B71E;   /* dorado — topbar, acentos             */
  --color-accent-dk:  #D99A06;
  --color-cta:        #E8590C;   /* naranja secundario — botones CTA     */
  --color-cta-dk:     #C2410C;   /* naranja oscuro — hover CTA           */
  --color-bg:         #FFFFFF;
  --color-bg-alt:     #EEF3FB;   /* azulado claro                        */
  --color-bg-soft:    #F6F9FE;
  --color-text:       #44516A;
  --color-text-muted: #6B7791;
  --color-border:     #DBE4F0;
  --shadow-card:      0 6px 24px rgba(21,53,107,.08);
  --shadow-hover:     0 16px 44px rgba(21,53,107,.16);
  --shadow-soft:      0 2px 10px rgba(21,53,107,.06);
  --font-head: 'Baloo 2', 'Baloo 2 Fallback', 'Mulish', system-ui, sans-serif;
  --font-main: 'Mulish', 'Mulish Fallback', system-ui, -apple-system, sans-serif;
  --container:        1180px;
  --radius:           20px;
  --radius-sm:        12px;
  --radius-btn:       10px;
  --radius-pill:      999px;
  --transition:       .22s ease;
}

/* ─────────────────────────────────────────────────────────────
   2. RESET
   ───────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
html, body { overflow-x: hidden; }
body {
  font-family: var(--font-main);
  font-size: 1rem;
  line-height: 1.7;
  color: var(--color-text);
  background: var(--color-bg);
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4 { font-family: var(--font-head); font-weight: 700; line-height: 1.18; color: var(--color-ink); }
img, video, svg { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
ul[role="list"] { list-style: none; }
button { font-family: inherit; cursor: pointer; border: none; background: none; }
input, textarea, select { font-family: inherit; font-size: 1rem; }

:focus-visible {
  outline: 3px solid var(--color-primary);
  outline-offset: 2px;
  border-radius: 4px;
}

/* ─────────────────────────────────────────────────────────────
   3. LAYOUT
   ───────────────────────────────────────────────────────────── */
.container {
  width: min(100% - 2rem, var(--container));
  margin-inline: auto;
}

.skip-link {
  position: absolute;
  top: -100%;
  left: 1rem;
  background: var(--color-navy);
  color: #fff;
  padding: .5rem 1rem;
  border-radius: 0 0 var(--radius-sm) var(--radius-sm);
  z-index: 9999;
  font-size: .875rem;
}
.skip-link:focus { top: 0; }

.section { padding: 5.5rem 0; }
.section--alt  { background: var(--color-bg-alt); }
.section--soft { background: var(--color-bg-soft); }
.section--navy { background: var(--color-navy); color: #fff; }

.section-header {
  text-align: center;
  max-width: 680px;
  margin: 0 auto 3.25rem;
}
.section-header .eyebrow,
.eyebrow {
  display: inline-block;
  font-family: var(--font-main);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--color-primary);
  margin-bottom: .85rem;
}
.section--navy .eyebrow { color: var(--color-accent); }
.section-header h2 {
  font-size: clamp(1.85rem, 3.4vw, 2.6rem);
  color: var(--color-ink);
  line-height: 1.16;
  margin-bottom: .85rem;
}
.section--navy .section-header h2 { color: #fff; }
.section-header p {
  color: var(--color-text-muted);
  font-size: 1.08rem;
}
.section--navy .section-header p { color: rgba(255,255,255,.82); }

/* ─────────────────────────────────────────────────────────────
   4. HEADER
   ───────────────────────────────────────────────────────────── */
.header {
  position: sticky;
  top: 0;
  z-index: 800;
  background: #fff;
  transition: box-shadow var(--transition);
}
.header.scrolled { box-shadow: 0 4px 20px rgba(21,53,107,.10); }

/* Topbar — barra anuncio DORADA (estilo referencia) */
.header__topbar {
  background: var(--color-accent);
  color: var(--color-navy);
  font-size: .82rem;
  font-weight: 600;
  padding: .5rem 0;
}
.header__topbar-inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.5rem;
  flex-wrap: wrap;
  text-align: center;
}
.header__topbar-left,
.header__topbar-right { display: flex; align-items: center; gap: 1.25rem; flex-wrap: wrap; justify-content: center; }
.topbar__link,
.topbar__info {
  display: flex;
  align-items: center;
  gap: .4rem;
  color: var(--color-navy);
  text-decoration: none;
  white-space: nowrap;
}
.topbar__link:hover { color: #000; text-decoration: underline; }
.topbar__badge {
  background: var(--color-navy);
  color: #fff;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .03em;
  padding: .2rem .7rem;
  border-radius: var(--radius-pill);
}

/* Header main */
.header__main {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  padding-block: .9rem;
}

/* Logo */
.header__logo { display: flex; align-items: center; flex-shrink: 0; }
.logo-svg { height: 46px; width: auto; }

/* Nav */
.nav-main { flex: 1; display: flex; align-items: center; justify-content: center; }
.nav-main > ul { display: flex; align-items: center; gap: .2rem; list-style: none; }
.nav-main > ul > li > a,
.nav-main > ul > li > button {
  display: flex;
  align-items: center;
  gap: .25rem;
  padding: .55rem .85rem;
  font-family: var(--font-main);
  font-size: .94rem;
  font-weight: 700;
  color: var(--color-ink);
  border-radius: var(--radius-btn);
  transition: color var(--transition), background var(--transition);
  white-space: nowrap;
  background: none;
  border: none;
  cursor: pointer;
}
.nav-main > ul > li > a:hover,
.nav-main > ul > li > button:hover,
.nav-main > ul > li > a[aria-current="page"] {
  color: var(--color-primary);
  background: var(--color-bg-alt);
}
.nav-main > ul > li > a[aria-current="page"] { font-weight: 800; }

/* Dropdown */
.has-dropdown { position: relative; }
.nav-dropdown {
  position: absolute;
  top: calc(100% + .4rem);
  left: 50%;
  transform: translateX(-50%);
  background: #fff;
  border-radius: var(--radius);
  box-shadow: var(--shadow-hover);
  border: 1px solid var(--color-border);
  padding: .8rem;
  min-width: 300px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity var(--transition), visibility var(--transition);
  z-index: 100;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .2rem;
}
.has-dropdown:hover .nav-dropdown,
.has-dropdown:focus-within .nav-dropdown {
  opacity: 1; visibility: visible; pointer-events: auto;
}
/* Puente invisible que cubre el hueco item→dropdown para que no se cierre al pasar el ratón (solo escritorio) */
@media (min-width: 769px) {
  .has-dropdown::after {
    content: '';
    position: absolute;
    left: 0; right: 0;
    top: 100%;
    height: .6rem;
  }
}
.nav-dropdown a {
  display: block;
  padding: .5rem .75rem;
  font-size: .875rem;
  font-weight: 600;
  color: var(--color-text);
  border-radius: var(--radius-btn);
  transition: background var(--transition), color var(--transition);
  white-space: nowrap;
}
.nav-dropdown a:hover { background: var(--color-bg-alt); color: var(--color-primary); }
.nav-dropdown a[aria-current="page"] { color: var(--color-primary); font-weight: 800; }

/* CTA nav — pill royal */
.header__cta {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: .7rem 1.4rem;
  background: var(--color-cta);
  color: #fff;
  border-radius: var(--radius-pill);
  font-family: var(--font-head);
  font-weight: 700;
  font-size: .95rem;
  white-space: nowrap;
  box-shadow: 0 6px 16px rgba(232,89,12,.34);
  transition: background var(--transition), transform var(--transition), box-shadow var(--transition);
}
.header__cta:hover { background: var(--color-cta-dk); transform: translateY(-1px); box-shadow: 0 10px 22px rgba(232,89,12,.42); }

/* Hamburger */
.nav-toggle {
  display: none;
  flex-shrink: 0;
  width: 44px; height: 44px;
  align-items: center;
  justify-content: center;
  color: var(--color-navy);
  border-radius: var(--radius-btn);
}
.nav-toggle:hover { background: var(--color-bg-alt); }

/* ─────────────────────────────────────────────────────────────
   5. HERO — a sangre completa con foto
   ───────────────────────────────────────────────────────────── */
.hero {
  position: relative;
  background: var(--color-navy);
  color: #fff;
  padding: 5rem 0 4.5rem;
  overflow: hidden;
  isolation: isolate;
}
.hero__bg {
  position: absolute;
  inset: 0;
  object-fit: cover;
  width: 100%;
  height: 100%;
  z-index: -2;
}
.hero::after {            /* overlay para legibilidad */
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(105deg, rgba(13,26,52,.92) 0%, rgba(15,40,86,.78) 45%, rgba(15,40,86,.45) 100%);
}
.hero__inner {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2.5rem;
  align-items: center;
}
.hero__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  background: rgba(246,183,30,.16);
  border: 1px solid rgba(246,183,30,.5);
  color: var(--color-accent);
  font-family: var(--font-main);
  font-size: .8rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .08em;
  padding: .4rem .95rem;
  border-radius: var(--radius-pill);
  margin-bottom: 1.1rem;
}
.hero h1 {
  font-size: clamp(2.2rem, 5.4vw, 3.5rem);
  font-weight: 800;
  line-height: 1.08;
  color: #fff;
  margin-bottom: 1.3rem;
  letter-spacing: -.01em;
}
.hero h1 em { font-style: normal; color: var(--color-accent); }
.hero__subtitle {
  font-size: clamp(1.05rem, 2vw, 1.22rem);
  color: rgba(255,255,255,.9);
  margin-bottom: 2rem;
  line-height: 1.6;
  max-width: 620px;
}
.hero__ctas { display: flex; flex-wrap: wrap; gap: 1rem; }
.hero__badges { display: flex; flex-wrap: wrap; gap: .7rem; margin-top: 2.5rem; }
.hero__badge {
  display: flex;
  align-items: center;
  gap: .5rem;
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.2);
  padding: .45rem 1rem;
  border-radius: var(--radius-pill);
  font-size: .85rem;
  font-weight: 600;
  color: #fff;
}
.hero__badge svg { color: var(--color-accent); flex-shrink: 0; }

/* Variante HOME — centrada, sin formulario (estilo referencia) */
.hero--home { padding: 7rem 0 6rem; text-align: center; }
.hero--home .hero__inner { justify-items: center; }
.hero--home .hero__subtitle { margin-inline: auto; }
.hero--home .hero__ctas { justify-content: center; }
.hero--home .hero__badges { justify-content: center; }

/* Variante interiores — centrada, sin formulario en cabecera */
.hero--centered { text-align: center; }
.hero--centered .hero__inner { justify-items: center; max-width: 880px; margin-inline: auto; }
.hero--centered .hero__eyebrow { margin-inline: auto; }
.hero--centered .hero__subtitle { margin-inline: auto; }
.hero--centered .hero__ctas { justify-content: center; }
.hero--centered .hero__badges { justify-content: center; }
.hero--centered .breadcrumb ol { display: flex; flex-wrap: wrap; gap: .4rem; justify-content: center; padding: 0; margin: 0; list-style: none; }

/* Hero form card (interiores conservan 2 columnas) */
.hero__form-card {
  background: #fff;
  border-radius: var(--radius);
  padding: 2rem;
  box-shadow: 0 24px 60px rgba(8,20,44,.4);
}
.hero__form-card h2 { color: var(--color-ink); font-size: 1.3rem; margin-bottom: 1.5rem; }

/* ─────────────────────────────────────────────────────────────
   6. INTRO-SPLIT (imagen + texto con check-bullets)
   ───────────────────────────────────────────────────────────── */
.intro-split { display: grid; grid-template-columns: 1fr 1.1fr; gap: 3.5rem; align-items: center; }
.intro-split--reverse { direction: rtl; }
.intro-split--reverse > * { direction: ltr; }
.intro-split__media {
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow-card);
  aspect-ratio: 4/5;
  background: var(--color-bg-alt);
}
.intro-split__media img { width: 100%; height: 100%; object-fit: cover; }
.intro-split__body h2 { font-size: clamp(1.7rem, 3vw, 2.3rem); margin-bottom: 1.1rem; }
.intro-split__body > p { color: var(--color-text); margin-bottom: 1rem; }
.intro-split__body > p strong { color: var(--color-ink); }
.check-list { list-style: none; display: flex; flex-direction: column; gap: 1rem; margin: 1.5rem 0; }
.check-list li { display: flex; gap: .85rem; align-items: flex-start; }
.check-list li svg { flex-shrink: 0; color: var(--color-primary); margin-top: .15rem; }
.check-list li strong { color: var(--color-ink); font-weight: 800; }
.check-list li span { display: block; color: var(--color-text-muted); font-size: .94rem; }

/* ─────────────────────────────────────────────────────────────
   7. FEATURE-BAND (banda navy con iconos — estilo referencia)
   ───────────────────────────────────────────────────────────── */
.feature-band { background: var(--color-navy); color: #fff; padding: 3.25rem 0; }
.feature-band__inner {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  gap: 2.5rem;
  align-items: center;
}
.feature-band__title {
  font-size: clamp(1.4rem, 2.6vw, 1.9rem);
  color: #fff;
  line-height: 1.2;
  border-right: 2px solid rgba(255,255,255,.18);
  padding-right: 2rem;
}
.feature-band__item { display: flex; align-items: flex-start; gap: 1rem; }
.feature-band__icon {
  width: 56px; height: 56px;
  flex-shrink: 0;
  border-radius: var(--radius-sm);
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(246,183,30,.35);
  display: flex; align-items: center; justify-content: center;
  color: var(--color-accent);
}
.feature-band__item h3 { color: #fff; font-size: 1.1rem; margin-bottom: .25rem; }
.feature-band__item p { color: rgba(255,255,255,.78); font-size: .92rem; line-height: 1.55; }

/* ─────────────────────────────────────────────────────────────
   8. SHOWCASE (filas zig-zag imagen/texto — maquinaria)
   ───────────────────────────────────────────────────────────── */
.showcase { display: flex; flex-direction: column; gap: 4.5rem; }
.showcase-row { display: grid; grid-template-columns: 1fr 1fr; gap: 3.5rem; align-items: center; }
.showcase-row:nth-child(even) .showcase-row__media { order: 2; }
.showcase-row__media {
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow-card);
  aspect-ratio: 16/11;
  background: var(--color-bg-alt);
}
.showcase-row__media img { width: 100%; height: 100%; object-fit: cover; }
.showcase-row__body h3 { font-size: clamp(1.4rem, 2.6vw, 1.85rem); margin-bottom: .9rem; }
.showcase-row__body p { color: var(--color-text); margin-bottom: 1.4rem; }
.showcase-row__body p strong { color: var(--color-ink); }

/* ─────────────────────────────────────────────────────────────
   9. SERVICIOS GRID
   ───────────────────────────────────────────────────────────── */
.services-grid { display: flex; flex-wrap: wrap; gap: 1.5rem; justify-content: center; }
.service-card {
  background: #fff;
  border-radius: var(--radius);
  box-shadow: var(--shadow-card);
  border: 1px solid var(--color-border);
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
  width: calc(33.333% - 1rem);
  min-width: 260px;
  transition: box-shadow var(--transition), transform var(--transition), border-color var(--transition);
  color: inherit;
  overflow: hidden;
}

/* Foto superior de la service-card */
.service-card__thumb {
  position: relative;
  width: 100%;
  height: 180px;
  overflow: hidden;
  flex-shrink: 0;
}
.service-card__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.45s ease;
}
.service-card:hover .service-card__thumb img {
  transform: scale(1.07);
}
.service-card__thumb::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 50%, rgba(15,30,60,.45) 100%);
  pointer-events: none;
}

/* Cuerpo de la card (antes era todo padding) */
.service-card__body {
  padding: 1.5rem 1.6rem 1.9rem;
  display: flex;
  flex-direction: column;
  gap: .8rem;
  flex: 1;
}
.service-card:hover {
  box-shadow: var(--shadow-hover);
  transform: translateY(-4px);
  border-color: var(--color-primary);
}
.service-card__icon {
  width: 56px; height: 56px;
  background: var(--color-bg-alt);
  border-radius: var(--radius-sm);
  display: flex; align-items: center; justify-content: center;
  color: var(--color-primary);
  flex-shrink: 0;
}
.service-card__icon--accent { background: #FEF6E0; color: var(--color-accent-dk); }
.service-card__icon--red    { background: #FDECEC; color: #DC2626; }
.service-card h3 { font-size: 1.18rem; color: var(--color-ink); }
.service-card p { font-size: .92rem; color: var(--color-text-muted); margin: 0; line-height: 1.6; }
.service-card__perks { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .4rem; }
.service-card__perks li { font-size: .86rem; color: var(--color-text-muted); display: flex; align-items: flex-start; gap: .45rem; }
.service-card__perks li::before {
  content: '';
  display: block;
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--color-accent);
  flex-shrink: 0;
  margin-top: .55em;
}
.service-card__link {
  margin-top: auto;
  font-family: var(--font-head);
  font-size: .9rem;
  font-weight: 700;
  color: var(--color-primary);
  display: flex;
  align-items: center;
  gap: .3rem;
}

/* ─────────────────────────────────────────────────────────────
   10. PROCESO (4 pasos)
   ───────────────────────────────────────────────────────────── */
.proceso-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; }
.proceso-step {
  background: #fff;
  border-radius: var(--radius);
  box-shadow: var(--shadow-card);
  border: 1px solid var(--color-border);
  padding: 2.25rem 1.5rem;
  text-align: center;
  position: relative;
}
.proceso-step__num {
  font-family: var(--font-head);
  font-size: 2.75rem;
  font-weight: 800;
  color: var(--color-bg-alt);
  line-height: 1;
  margin-bottom: .5rem;
  display: block;
}
.proceso-step__icon {
  width: 52px; height: 52px;
  background: var(--color-primary);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto .85rem;
  color: #fff;
}
.proceso-step h3 { font-size: 1.1rem; color: var(--color-ink); margin-bottom: .4rem; }
.proceso-step p { font-size: .88rem; color: var(--color-text-muted); }
.proceso-step::after {
  content: '→';
  position: absolute;
  right: -1rem;
  top: 3rem;
  font-size: 1.4rem;
  color: var(--color-accent);
  font-weight: 700;
}
.proceso-step:last-child::after { display: none; }

/* ─────────────────────────────────────────────────────────────
   11. TESTIMONIOS
   ───────────────────────────────────────────────────────────── */
.testimonios-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.testimonio-card {
  background: #fff;
  border-radius: var(--radius);
  box-shadow: var(--shadow-card);
  border: 1px solid var(--color-border);
  padding: 1.9rem;
  display: flex;
  flex-direction: column;
  gap: .85rem;
}
.testimonio-card__stars { display: flex; gap: .2rem; }
.star-svg { color: var(--color-accent); flex-shrink: 0; }
.testimonio-card blockquote { font-size: .95rem; color: var(--color-text); line-height: 1.65; flex: 1; }
.testimonio-card blockquote::before { content: '\201C'; }
.testimonio-card blockquote::after  { content: '\201D'; }
.testimonio-card__author {
  display: flex; align-items: center; gap: .75rem;
  border-top: 1px solid var(--color-border);
  padding-top: .85rem;
}
.testimonio-card__avatar {
  width: 42px; height: 42px;
  border-radius: 50%;
  background: var(--color-bg-alt);
  overflow: hidden;
  flex-shrink: 0;
}
.testimonio-card__avatar img { width: 100%; height: 100%; object-fit: cover; }
.testimonio-card__name { font-size: .9rem; font-weight: 800; color: var(--color-ink); font-family: var(--font-head); }
.testimonio-card__loc { font-size: .8rem; color: var(--color-text-muted); }
.google-badge {
  display: inline-flex; align-items: center; gap: .5rem;
  margin-top: 2rem;
  padding: .55rem 1.1rem;
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-pill);
  font-size: .85rem;
  color: var(--color-text);
  box-shadow: var(--shadow-soft);
}

/* ─────────────────────────────────────────────────────────────
   12. FAQ ACCORDION
   ───────────────────────────────────────────────────────────── */
.faq-list { max-width: 800px; margin: 0 auto; display: flex; flex-direction: column; gap: .75rem; }
.faq-item {
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  overflow: hidden;
  transition: box-shadow var(--transition);
}
.faq-item:hover { box-shadow: var(--shadow-soft); }
.faq-question {
  width: 100%;
  text-align: left;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: 1.15rem 1.3rem;
  font-family: var(--font-head);
  font-size: 1.02rem;
  font-weight: 700;
  color: var(--color-ink);
  background: none;
  cursor: pointer;
  transition: color var(--transition);
}
.faq-question:hover { color: var(--color-primary); }
.faq-question__icon {
  flex-shrink: 0;
  width: 26px; height: 26px;
  border-radius: 50%;
  background: var(--color-bg-alt);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.2rem;
  color: var(--color-primary);
  transition: background var(--transition), color var(--transition), transform var(--transition);
}
.faq-question[aria-expanded="true"] .faq-question__icon {
  background: var(--color-primary);
  color: #fff;
  transform: rotate(45deg);
}
.faq-answer { display: none; padding: 0 1.3rem 1.2rem; }
.faq-answer[open],
.faq-question[aria-expanded="true"] + .faq-answer { display: block; }
.faq-answer p, .faq-answer ul, .faq-answer ol { font-size: .95rem; color: var(--color-text-muted); line-height: 1.7; }
.faq-answer ul { padding-left: 1.25rem; }
.faq-answer li { margin-bottom: .35rem; }

/* ─────────────────────────────────────────────────────────────
   13. CTA BANNER
   ───────────────────────────────────────────────────────────── */
.cta-banner {
  position: relative;
  background: var(--color-primary);
  background-image: linear-gradient(120deg, var(--color-secondary), var(--color-primary));
  color: #fff;
  padding: 5.5rem 0;
  text-align: center;
  overflow: hidden;
}
.cta-banner h2 { font-size: clamp(1.9rem, 4vw, 2.7rem); color: #fff; margin-bottom: 1rem; }
.cta-banner h2 em { font-style: normal; color: var(--color-accent); }
.cta-banner p { color: rgba(255,255,255,.9); font-size: 1.12rem; margin-bottom: 2.5rem; max-width: 600px; margin-inline: auto; }
.cta-banner__btns { display: flex; justify-content: center; flex-wrap: wrap; gap: 1rem; }

/* ─────────────────────────────────────────────────────────────
   14. FOOTER
   ───────────────────────────────────────────────────────────── */
.footer { background: var(--color-navy); color: rgba(255,255,255,.75); padding: 4.5rem 0 0; }
.footer__grid { display: grid; grid-template-columns: 2fr 1.5fr 1.5fr 1.5fr; gap: 3rem; padding-bottom: 3rem; }
.footer__brand .footer-logo { margin-bottom: 1.1rem; display: inline-block; }
.footer__brand p { font-size: .9rem; color: rgba(255,255,255,.7); line-height: 1.7; margin-bottom: 1.25rem; }
.footer__social { display: flex; gap: .65rem; }
.footer__social a {
  width: 38px; height: 38px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.22);
  display: flex; align-items: center; justify-content: center;
  color: rgba(255,255,255,.75);
  transition: border-color var(--transition), color var(--transition), background var(--transition);
}
.footer__social a:hover { border-color: var(--color-accent); color: var(--color-navy); background: var(--color-accent); }
.footer__col h4, .footer__title {
  font-family: var(--font-head);
  font-size: .92rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: #fff;
  margin-bottom: 1.1rem;
}
.footer__col ul { list-style: none; display: flex; flex-direction: column; gap: .55rem; }
.footer__col ul li a { font-size: .9rem; color: rgba(255,255,255,.72); transition: color var(--transition); }
.footer__col ul li a:hover { color: var(--color-accent); }
.footer__col p { font-size: .9rem; color: rgba(255,255,255,.72); }
.footer__nap { display: flex; flex-direction: column; gap: .65rem; }
.footer__nap-item { display: flex; align-items: flex-start; gap: .55rem; font-size: .88rem; color: rgba(255,255,255,.72); }
.footer__nap-item a { color: rgba(255,255,255,.72); }
.footer__nap-item a:hover { color: var(--color-accent); }
.footer__nap-item svg { flex-shrink: 0; color: var(--color-accent); margin-top: .15em; }
.footer__bottom { border-top: 1px solid rgba(255,255,255,.14); padding: 1.4rem 0; }
.footer__bottom-inner {
  display: flex; justify-content: space-between; align-items: center;
  flex-wrap: wrap; gap: 1rem;
  font-size: .82rem; color: rgba(255,255,255,.6);
}
.footer__bottom-inner a { color: #fff !important; }
.footer__legal-links { display: flex; gap: 1.5rem; flex-wrap: wrap; }
.footer__legal-links a { color: rgba(255,255,255,.6); transition: color var(--transition); }
.footer__legal-links a:hover { color: var(--color-accent); }

/* ─────────────────────────────────────────────────────────────
   15. FORMULARIO
   ───────────────────────────────────────────────────────────── */
.contact-form, .form-block { display: flex; flex-direction: column; gap: 1.2rem; }
.form-group { display: flex; flex-direction: column; gap: .45rem; }
.form-group label { font-size: .875rem; font-weight: 700; color: var(--color-ink); }
.form-group input,
.form-group textarea,
.form-group select {
  padding: .8rem 1rem;
  border: 1.5px solid var(--color-border);
  border-radius: var(--radius-btn);
  font-size: 1rem;
  color: var(--color-text);
  background: var(--color-bg-soft);
  transition: border-color var(--transition), box-shadow var(--transition), background var(--transition);
  width: 100%;
  min-height: 46px;
}
.form-group input:focus,
.form-group textarea:focus,
.form-group select:focus {
  border-color: var(--color-primary);
  background: #fff;
  box-shadow: 0 0 0 3px rgba(31,95,209,.12);
  outline: none;
}
.form-group input[aria-invalid="true"],
.form-group textarea[aria-invalid="true"] { border-color: #DC2626; }
.form-group textarea { resize: vertical; min-height: 120px; }
.field-error { font-size: .8rem; color: #DC2626; display: flex; align-items: center; gap: .3rem; }
.form-group--checkbox { flex-direction: row; align-items: flex-start; gap: .6rem; }
.form-group--checkbox label { font-size: .875rem; font-weight: 400; color: var(--color-text-muted); cursor: pointer; }
.form-group--checkbox input[type="checkbox"] { width: 18px; height: 18px; min-height: auto; flex-shrink: 0; margin-top: .1em; }
.checkbox-label { display: flex; align-items: flex-start; gap: .6rem; cursor: pointer; font-size: .875rem; color: var(--color-text-muted); }
.checkbox-label input[type="checkbox"] { width: 18px; height: 18px; flex-shrink: 0; margin-top: .1em; accent-color: var(--color-primary); }
.checkbox-label a { color: var(--color-primary); text-decoration: underline; }
.form-send-error { padding: .75rem 1rem; background: #FEF2F2; border: 1px solid #FECACA; border-radius: var(--radius-btn); color: #DC2626; font-size: .875rem; }

/* ─────────────────────────────────────────────────────────────
   16. PÁGINAS DE ZONA / LOCALIDAD
   ───────────────────────────────────────────────────────────── */
.zona-hero { position: relative; background: var(--color-navy); color: #fff; padding: 4.5rem 0 3.5rem; }
.zona-hero h1 { font-size: clamp(1.9rem, 4vw, 2.9rem); color: #fff; margin-bottom: .75rem; }
.zona-hero .lead { color: rgba(255,255,255,.88); font-size: 1.12rem; max-width: 660px; }
.zona-servicios-cluster { display: flex; flex-wrap: wrap; gap: .7rem; margin: 2rem 0; }
.zona-servicios-cluster a {
  display: flex; align-items: center; gap: .5rem;
  padding: .55rem 1.1rem;
  background: #fff;
  border-radius: var(--radius-pill);
  font-size: .875rem; font-weight: 700;
  color: var(--color-primary);
  border: 1.5px solid var(--color-border);
  transition: background var(--transition), border-color var(--transition);
}
.zona-servicios-cluster a:hover { background: var(--color-bg-alt); border-color: var(--color-primary); }
.mapa-wrapper { border-radius: var(--radius); overflow: hidden; height: 380px; box-shadow: var(--shadow-card); }
.mapa-wrapper iframe { width: 100%; height: 100%; border: 0; }
.mapa-section { padding: 4rem 0; }
.mapa-facade-btn { width: 100%; height: 380px; background: var(--color-bg-alt); border: 2px dashed var(--color-border); border-radius: var(--radius); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1rem; cursor: pointer; color: var(--color-text-muted); font-size: 1rem; font-weight: 700; text-align: center; padding: 1rem; transition: background var(--transition); }
.mapa-facade-btn:hover { background: #e2e8f0; }
.mapa-facade-btn svg { color: var(--color-primary); }
.form-section__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 3.5rem; align-items: center; }
.form-section__card { background: #fff; border-radius: var(--radius); padding: 2.25rem; box-shadow: var(--shadow-card); border: 1px solid var(--color-border); }
.form-section__card h2 { font-size: 1.4rem; color: var(--color-ink); margin-bottom: 1.5rem; }
@media (max-width: 768px) { .form-section__grid { grid-template-columns: 1fr; gap: 2rem; } }

/* ─────────────────────────────────────────────────────────────
   17. BLOG
   ───────────────────────────────────────────────────────────── */
.blog-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.blog-card {
  background: #fff;
  border-radius: var(--radius);
  box-shadow: var(--shadow-card);
  border: 1px solid var(--color-border);
  overflow: hidden;
  display: flex; flex-direction: column;
  transition: box-shadow var(--transition), transform var(--transition);
  color: inherit;
}
.blog-card:hover { box-shadow: var(--shadow-hover); transform: translateY(-4px); }
.blog-card__img { aspect-ratio: 16/9; overflow: hidden; background: var(--color-bg-alt); }
.blog-card__img img { width: 100%; height: 100%; object-fit: cover; }
.blog-card__body { padding: 1.4rem; flex: 1; display: flex; flex-direction: column; gap: .5rem; }
.blog-card__tag { font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .07em; color: var(--color-primary); }
.blog-card h3 { font-size: 1.1rem; color: var(--color-ink); line-height: 1.35; }
.blog-card p { font-size: .88rem; color: var(--color-text-muted); line-height: 1.6; flex: 1; }
.blog-card__meta { font-size: .8rem; color: var(--color-text-muted); margin-top: auto; padding-top: .5rem; border-top: 1px solid var(--color-border); }

.blog-article { max-width: 740px; margin: 0 auto; padding: 3rem 1.5rem; }
.blog-article__header { margin-bottom: 2rem; }
.blog-article h1 { font-size: clamp(1.7rem, 3.5vw, 2.4rem); color: var(--color-ink); line-height: 1.2; }
.blog-article__meta { display: flex; align-items: center; gap: 1rem; font-size: .85rem; color: var(--color-text-muted); flex-wrap: wrap; margin-top: .75rem; }
.blog-article__meta time { font-weight: 700; }
.blog-article__body h2, .blog-article__body h3 { color: var(--color-ink); margin: 2rem 0 .75rem; }
.blog-article__body h2 { font-size: 1.5rem; }
.blog-article__body h3 { font-size: 1.2rem; }
.blog-article__body p, .blog-article__body li { font-size: 1rem; line-height: 1.8; margin-bottom: 1rem; }
.blog-article__body ul, .blog-article__body ol { padding-left: 1.5rem; margin-bottom: 1rem; }
.blog-article__body strong { color: var(--color-ink); }
.blog-article__body a { color: var(--color-primary); text-decoration: underline; }
.blog-article__cta { background: var(--color-bg-alt); border-radius: var(--radius); padding: 1.75rem; margin-top: 2.5rem; text-align: center; }

/* Breadcrumb */
.breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; font-size: .82rem; color: var(--color-text-muted); margin-bottom: 1.5rem; list-style: none; }
.breadcrumb li + li::before { content: '/'; opacity: .5; }
.breadcrumb a { color: var(--color-text-muted); }
.breadcrumb a:hover { color: var(--color-primary); }

/* ─────────────────────────────────────────────────────────────
   18. NOSOTROS
   ───────────────────────────────────────────────────────────── */
.nosotros-grid { display: grid; grid-template-columns: 1fr 1.2fr; gap: 4rem; align-items: center; }
.nosotros-img-card {
  background: var(--color-navy);
  border-radius: var(--radius);
  aspect-ratio: 4/5;
  overflow: hidden;
  position: relative;
  display: flex; align-items: center; justify-content: center;
}
.nosotros-img-card img { width: 100%; height: 100%; object-fit: cover; }
.nosotros-shape { position: absolute; bottom: -2rem; right: -2rem; width: 150px; height: 150px; background: var(--color-accent); border-radius: 50%; opacity: .25; }
.nosotros-text { display: flex; flex-direction: column; gap: 1.2rem; }
.nosotros-text h2 { font-size: clamp(1.6rem, 3vw, 2.2rem); color: var(--color-ink); line-height: 1.22; }
.nosotros-text p { color: var(--color-text); line-height: 1.75; }
.nosotros-features { display: flex; flex-direction: column; gap: 1rem; margin-top: .5rem; }
.nosotros-feature { display: flex; align-items: flex-start; gap: .9rem; }
.nosotros-feature__icon {
  width: 46px; height: 46px;
  border-radius: var(--radius-sm);
  background: var(--color-bg-alt);
  display: flex; align-items: center; justify-content: center;
  color: var(--color-primary);
  flex-shrink: 0;
}
.nosotros-feature h3 { font-size: 1rem; color: var(--color-ink); margin-bottom: .2rem; }
.nosotros-feature p { font-size: .9rem; color: var(--color-text-muted); }
.stats-row { display: flex; gap: 2.5rem; flex-wrap: wrap; margin-top: 1rem; }
.stat-item { text-align: center; }
.stat-item .stat-num { font-family: var(--font-head); font-size: 2.3rem; font-weight: 800; color: var(--color-primary); display: block; line-height: 1; }
.stat-item .stat-label { font-size: .78rem; color: var(--color-text-muted); text-transform: uppercase; letter-spacing: .06em; }

/* ─────────────────────────────────────────────────────────────
   19. LEGAL
   ───────────────────────────────────────────────────────────── */
.legal-page { max-width: 820px; margin: 0 auto; padding: 4rem 1.5rem; }
.legal-page h1 { font-size: clamp(1.7rem, 3vw, 2.2rem); color: var(--color-ink); margin-bottom: 2rem; }
.legal-page h2 { font-size: 1.3rem; color: var(--color-ink); margin: 2rem 0 .75rem; }
.legal-page p, .legal-page li { font-size: .92rem; color: var(--color-text-muted); line-height: 1.75; margin-bottom: .75rem; }
.legal-page ul { padding-left: 1.5rem; }
.legal-page a { color: var(--color-primary); text-decoration: underline; }

/* ─────────────────────────────────────────────────────────────
   20. UTILIDADES
   ───────────────────────────────────────────────────────────── */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .55rem;
  padding: .9rem 1.85rem;
  border-radius: var(--radius-btn);
  font-family: var(--font-head);
  font-size: 1rem;
  font-weight: 700;
  cursor: pointer;
  border: 2px solid transparent;
  transition: background var(--transition), color var(--transition), border-color var(--transition), box-shadow var(--transition), transform var(--transition);
  min-height: 50px;
  white-space: nowrap;
}
.btn--primary { background: var(--color-cta); color: #fff; border-color: var(--color-cta); box-shadow: 0 8px 20px rgba(232,89,12,.30); }
.btn--primary:hover { background: var(--color-cta-dk); border-color: var(--color-cta-dk); transform: translateY(-2px); box-shadow: 0 12px 26px rgba(232,89,12,.38); }
.btn--secondary { background: var(--color-accent); color: var(--color-navy); border-color: var(--color-accent); box-shadow: 0 8px 20px rgba(246,183,30,.32); }
.btn--secondary:hover { background: var(--color-accent-dk); border-color: var(--color-accent-dk); transform: translateY(-2px); }
.btn--outline { background: transparent; color: #fff; border-color: rgba(255,255,255,.55); }
.btn--outline:hover { background: rgba(255,255,255,.12); border-color: #fff; }
.btn--outline-dark { background: transparent; color: var(--color-primary); border-color: var(--color-primary); }
.btn--outline-dark:hover { background: var(--color-primary); color: #fff; }
.btn--full { width: 100%; }
.btn--sm { padding: .55rem 1.1rem; font-size: .9rem; min-height: 40px; }
.btn--lg { padding: 1.05rem 2.4rem; font-size: 1.08rem; min-height: 58px; }

.badge-urgency {
  display: inline-flex; align-items: center; gap: .4rem;
  background: #DC2626; color: #fff;
  font-size: .75rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em;
  padding: .25rem .7rem; border-radius: var(--radius-pill);
}
.badge-disponible {
  display: inline-flex; align-items: center; gap: .4rem;
  background: #16A34A; color: #fff;
  font-size: .75rem; font-weight: 800;
  padding: .25rem .7rem; border-radius: var(--radius-pill);
}

.whatsapp-float {
  position: fixed; bottom: 5.5rem; right: 1.25rem;
  width: 60px; height: 60px;
  background: #25D366; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 6px 20px rgba(0,0,0,.25);
  z-index: 900; color: #fff;
  transition: transform var(--transition);
}
.whatsapp-float:hover { transform: scale(1.08); }

.mobile-cta-bar { display: flex; position: fixed; bottom: 0; left: 0; right: 0; z-index: 950; box-shadow: 0 -2px 14px rgba(0,0,0,.14); }
.cta-btn {
  flex: 1; display: flex; align-items: center; justify-content: center; gap: .5rem;
  padding: 1rem; font-family: var(--font-head); font-size: .95rem; font-weight: 700;
  min-height: 56px; border: none; cursor: pointer;
}
.cta-btn--email   { background: var(--color-navy); color: #fff; }
.cta-btn--wa      { background: #25D366; color: #fff; }
.cta-btn--presup  { background: var(--color-accent); color: var(--color-navy); }

.section-divider { height: 5px; background: linear-gradient(90deg, var(--color-navy), var(--color-primary), var(--color-accent)); }

/* ─────────────────────────────────────────────────────────────
   21. RESPONSIVE
   ───────────────────────────────────────────────────────────── */
@media (max-width: 1024px) {
  .proceso-steps { grid-template-columns: repeat(2, 1fr); }
  .proceso-step::after { display: none; }
  .blog-grid { grid-template-columns: repeat(2, 1fr); }
  .testimonios-grid { grid-template-columns: repeat(2, 1fr); }
  .footer__grid { grid-template-columns: 1fr 1fr; gap: 2rem; }
  .feature-band__inner { grid-template-columns: 1fr 1fr; }
  .feature-band__title { grid-column: 1 / -1; border-right: none; border-bottom: 2px solid rgba(255,255,255,.18); padding-right: 0; padding-bottom: 1.25rem; }
}

@media (max-width: 768px) {
  .section { padding: 3.75rem 0; }

  /* Header */
  .header__topbar { display: none; }
  .nav-main { display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: #fff; flex-direction: column; justify-content: flex-start; padding: 5rem 2rem 2rem; z-index: 700; overflow-y: auto; }
  .nav-main.is-open { display: flex; }
  .nav-main > ul { flex-direction: column; align-items: stretch; gap: 0; width: 100%; }
  .nav-main > ul > li > a,
  .nav-main > ul > li > button { padding: .9rem .5rem; font-size: 1.05rem; border-radius: 0; border-bottom: 1px solid var(--color-border); }
  .nav-dropdown { position: static; transform: none; opacity: 1; visibility: visible; pointer-events: auto; box-shadow: none; border: none; background: var(--color-bg-alt); border-radius: var(--radius-sm); display: none; grid-template-columns: 1fr; padding: .5rem .75rem; min-width: 0; }
  .has-dropdown.submenu-open .nav-dropdown { display: grid; }
  .nav-toggle { display: flex; }
  .header__cta { display: none; }
  .header__main { padding-block: .75rem; }
  body.menu-open { overflow: hidden; }

  /* Grids */
  .service-card { width: calc(50% - .75rem); }
  .testimonios-grid { grid-template-columns: 1fr; }
  .blog-grid { grid-template-columns: 1fr; }
  .nosotros-grid { grid-template-columns: 1fr; }
  .nosotros-img-card { aspect-ratio: 16/9; }
  .hero__inner { grid-template-columns: 1fr; }
  .intro-split, .showcase-row { grid-template-columns: 1fr; gap: 2rem; }
  .intro-split--reverse { direction: ltr; }
  .showcase-row:nth-child(even) .showcase-row__media { order: 0; }
  .intro-split__media, .showcase-row__media { aspect-ratio: 16/10; }
  .feature-band__inner { grid-template-columns: 1fr; gap: 1.5rem; }
  .feature-band__title { border-bottom: none; padding-bottom: 0; }

  /* Mobile CTA bar */
  .mobile-cta-bar { display: flex; }
  .whatsapp-float { bottom: 5rem; }
  main { padding-bottom: 3.5rem; }
}

@media (max-width: 480px) {
  .service-card { width: 100%; }
  .proceso-steps { grid-template-columns: 1fr; }
  .stats-row { gap: 1.5rem; }
  .hero__ctas { flex-direction: column; }
  .hero__ctas .btn { width: 100%; }
  .cta-banner__btns { flex-direction: column; align-items: center; }
  .footer__grid { grid-template-columns: 1fr; gap: 2rem; }
}

@media (min-width: 769px) {
  .mobile-cta-bar { display: none; }
  .whatsapp-float { bottom: 1.5rem; }
}

@media (min-width: 900px) {
  .hero__inner--two-col { grid-template-columns: 1fr 420px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
}

/* ── Hero split (servicios: texto + imagen) ─────────────────── */
.hero--split { text-align: left; }
.hero--split .hero__inner { grid-template-columns: 1.05fr .95fr; align-items: center; }
.hero--split .hero__subtitle { max-width: 640px; }
.hero--split .breadcrumb ol { display: flex; flex-wrap: wrap; gap: .4rem; padding: 0; margin: 0; list-style: none; }
.hero--split .btn--lg { padding-inline: 2.1rem; }
.hero__media img { width: 100%; height: auto; border-radius: var(--radius); box-shadow: 0 24px 60px rgba(8,20,44,.4); display: block; }
@media (max-width: 768px) {
  .hero--split .hero__inner { grid-template-columns: 1fr; }
  .hero--split .hero__media { max-width: 520px; margin-inline: auto; }
}

/* ── Razones (Por qué elegirnos) ────────────────────────────── */
.razones-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.razon-card { background: #fff; border: 1px solid var(--color-border); border-radius: var(--radius); box-shadow: var(--shadow-card); padding: 1.75rem; display: flex; flex-direction: column; gap: .55rem; }
.razon-card__icon { width: 50px; height: 50px; border-radius: var(--radius-sm); background: rgba(31,95,209,.1); color: var(--color-secondary); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.razon-card h3 { font-size: 1.05rem; color: var(--color-ink); margin: 0; }
.razon-card p { font-size: .9rem; color: var(--color-text-muted); margin: 0; line-height: 1.55; }
@media (max-width: 860px) { .razones-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 540px) { .razones-grid { grid-template-columns: 1fr; } }

/* ── Caso real en páginas de servicio (enlaza a /trabajos/) ─── */
.section--caso { padding-block: 3.5rem; }
.caso-real { max-width: 880px; margin-inline: auto; background: #fff; border: 1px solid var(--color-border); border-left: 5px solid var(--color-accent); border-radius: var(--radius); box-shadow: var(--shadow-card); padding: 2rem 2.25rem; }
.caso-real h2 { font-size: clamp(1.35rem, 2.6vw, 1.75rem); margin: .2rem 0 1.25rem; }
.caso-real__dl { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; margin: 0 0 1.4rem; }
.caso-real__dl dt { font-weight: 800; color: var(--color-primary); font-size: .85rem; text-transform: uppercase; letter-spacing: .06em; margin-bottom: .3rem; }
.caso-real__dl dd { margin: 0; color: var(--color-text); font-size: .95rem; line-height: 1.55; }
.caso-real__link { display: inline-flex; align-items: center; gap: .4rem; min-height: 44px; font-family: var(--font-head); font-weight: 700; color: var(--color-primary); }
.caso-real__link:hover { color: var(--color-secondary); text-decoration: underline; }
@media (max-width: 768px) { .caso-real { padding: 1.5rem 1.25rem; } .caso-real__dl { grid-template-columns: 1fr; gap: .9rem; } }

/* ── Utilidad accesible: oculto visualmente, legible por lectores ── */
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0 }

/* ── Guía relacionada en páginas de servicio ─────────────────── */
.section--guia { padding-block: 2.5rem 0; }
.guia-rel { max-width: 880px; margin-inline: auto; display: flex; gap: .75rem; align-items: flex-start; background: var(--color-bg-soft); border: 1px solid var(--color-border); border-radius: var(--radius-sm); padding: 1rem 1.25rem; color: var(--color-text); }
.guia-rel svg { flex-shrink: 0; color: var(--color-primary); margin-top: .2rem; }
.guia-rel a { color: var(--color-primary); font-weight: 700; text-decoration: underline; text-underline-offset: 2px; }

/* ── Imagen de las tarjetas de artículos relacionados ── */
.related-card__img { overflow: hidden; }
.related-card__img picture, .related-card__img img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* ── FAB: presupuesto + volver arriba (aparecen al hacer scroll) ── */
.fab { position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 960; display: flex; flex-direction: column; align-items: flex-end; gap: .7rem;
       opacity: 0; visibility: hidden; transform: translateY(12px); transition: opacity var(--transition), transform var(--transition), visibility var(--transition); }
.fab.is-visible { opacity: 1; visibility: visible; transform: none; }
.fab__btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; min-width: 52px; height: 52px; padding: 0 .95rem;
            border-radius: var(--radius-pill); border: 0; cursor: pointer; font-family: var(--font-head); font-weight: 700; font-size: .95rem;
            box-shadow: 0 10px 24px rgba(8, 20, 44, .28); transition: transform var(--transition), background var(--transition); }
.fab__btn:hover { transform: translateY(-2px); }
.fab__btn:focus-visible { outline: 3px solid var(--color-accent); outline-offset: 3px; }
.fab__btn--cta { background: var(--color-cta); color: #fff; }
.fab__btn--cta:hover { background: var(--color-cta-dk); }
.fab__btn--top { width: 52px; padding: 0; background: var(--color-navy); color: #fff; }
@media (max-width: 768px) {
  .fab { right: .9rem; bottom: calc(56px + .9rem); }      /* por encima de la barra CTA móvil */
  .fab__label { display: none; }
  .fab__btn--cta { width: 52px; padding: 0; }
}
@media (prefers-reduced-motion: reduce) { .fab, .fab__btn { transition: none; } }



/* v5: proceso, grid 4×1, cluster de zonas (tools/_elche_v5.py) */



/* v5: proceso, grid 4×1, cluster de zonas (tools/_elche_v5.py) */

/* v5: proceso, grid 4×1, cluster de zonas (tools/_elche_v5.py) */

/* Imágenes de cabecera, figuras y menú (tools/_elche_nav_css.py) */
/*elche-img-nav:start*/.nav-main>ul>li>button.is-active,.nav-main>ul>li>a.is-active{color:var(--color-primary);background:var(--color-bg-alt)}.nav-dropdown--single{grid-template-columns:1fr}.has-dropdown.submenu-open .nav-dropdown{opacity:1;visibility:visible;pointer-events:auto}@media (min-width:769px) and (max-width:1180px){.header__main{gap:.9rem}.nav-main>ul>li>a,.nav-main>ul>li>button{padding:.5rem .55rem;font-size:.88rem}.header__cta{padding:.6rem 1rem;font-size:.88rem}.logo-svg{height:40px}}@media (min-width:769px) and (max-width:1020px){.header__cta{display:none}}.nav-main>ul>li>a svg,.nav-main>ul>li>button svg{flex-shrink:0}@media (min-width:1181px){.header__main{gap:1rem}.nav-main>ul>li>a,.nav-main>ul>li>button{padding:.55rem .7rem}}.header__actions{display:flex;align-items:center;gap:.6rem;flex-shrink:0}.header__urgent{flex-shrink:0;display:inline-flex;align-items:center;gap:.45rem;min-height:44px;padding:.6rem 1.1rem;border-radius:var(--radius-pill);background:#C81E1E;color:#fff;font-family:var(--font-head);font-weight:700;font-size:.95rem;white-space:nowrap;box-shadow:0 6px 16px rgba(200,30,30,.3);transition:background var(--transition),transform var(--transition)}.header__urgent:hover{background:#9F1717;transform:translateY(-1px)}.header__urgent[aria-current="page"]{box-shadow:0 0 0 3px rgba(200,30,30,.28)}@media (min-width:769px) and (max-width:1280px){.header__urgent-lbl{display:none}.header__urgent{padding:.6rem .9rem}}@media (max-width:768px){.header__main{gap:.6rem}.logo-svg{height:40px}.header__actions{margin-left:auto}.header__urgent{padding:.5rem .85rem;font-size:.88rem}}@media (max-width:420px){.header__urgent-lbl{display:none}}.hero__bg-pic,.post-header__bg{position:absolute;inset:0;z-index:-2}.hero__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}.hero--home::after,.hero--centered::after{background:linear-gradient(180deg,rgba(13,26,52,.84) 0%,rgba(15,40,86,.7) 100%)}.legal-hero{position:relative;isolation:isolate;overflow:hidden;background:var(--color-navy)}.legal-hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(105deg,rgba(13,26,52,.9),rgba(15,40,86,.78))}.post-header--bg{position:relative;isolation:isolate;overflow:hidden;border-radius:var(--radius);padding:2.2rem 1.8rem 1.6rem;background:var(--color-navy);color:#fff}.post-header--bg::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(160deg,rgba(13,26,52,.9),rgba(15,40,86,.8))}.post-header.post-header--bg h1{color:#fff}.post-header.post-header--bg .eyebrow{background:rgba(246,183,30,.18);color:var(--color-accent)}.post-header.post-header--bg .post-meta{color:rgba(255,255,255,.85);border-bottom-color:rgba(255,255,255,.2)}.post-header.post-header--bg .post-meta strong{color:#fff}.post-main{min-width:0}@media (max-width:768px){.nav-main>ul>li>button{width:100%;text-align:left}.post-header--bg{padding:1.6rem 1.2rem 1.2rem}}.media-figure{max-width:860px;margin:0 auto 3rem}.media-figure__grid{display:grid;gap:1rem}.media-figure--duo .media-figure__grid{grid-template-columns:1fr 1fr}.media-figure img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:var(--radius);box-shadow:var(--shadow-card);background:var(--color-bg-alt)}.media-figure figcaption{margin-top:.8rem;font-size:.9rem;color:var(--color-text-muted);text-align:center;line-height:1.55}.post-content .media-figure{margin:1.5rem 0 2rem}.post-content table{display:block;max-width:100%;overflow-x:auto}@media (max-width:640px){.media-figure--duo .media-figure__grid{grid-template-columns:1fr}}.error-page__img img{width:280px;max-width:70vw;height:auto;margin:0 auto;border-radius:var(--radius)}/*elche-img-nav:end*/

/* v5: proceso, grid 4×1, cluster de zonas (tools/_elche_v5.py) */
/*elche-v5:start*/
.service-card p strong{color:var(--color-ink);font-weight:800}
.services-grid--4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.25rem}
.services-grid--4 .service-card{width:auto;min-width:0}
.services-grid--4 .service-card__thumb{height:165px}
.services-grid--4 .service-card__body{padding:1.3rem 1.3rem 1.6rem}
.services-grid--4 .service-card h3{font-size:1.08rem}
@media (max-width:1024px){.services-grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.services-grid--4{grid-template-columns:1fr}}

.proceso-steps{gap:1.25rem;align-items:stretch}
.proceso-step{text-align:left;padding:1.75rem 1.5rem 1.7rem;transition:transform var(--transition),box-shadow var(--transition),border-color var(--transition)}
.proceso-step{border-top:4px solid var(--color-primary)}
.proceso-step:last-child{border-top-color:var(--color-accent)}
.proceso-step:hover{transform:translateY(-4px);box-shadow:var(--shadow-hover)}
.proceso-step__num{display:inline-flex;align-items:center;gap:.35rem;margin:0 0 1.4rem;padding:.3rem .8rem;border-radius:var(--radius-pill);background:var(--color-bg-alt);color:var(--color-primary);font-family:var(--font-main);font-size:.74rem;font-weight:800;letter-spacing:.12em;line-height:1.2;text-transform:uppercase}
.proceso-step__num::before{content:"Paso"}
.proceso-step__icon{position:absolute;top:1.3rem;right:1.3rem;margin:0;width:48px;height:48px;border-radius:14px;background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));box-shadow:0 8px 18px rgba(31,95,209,.28)}
.proceso-step:last-child .proceso-step__icon{background:linear-gradient(135deg,var(--color-accent),var(--color-cta));box-shadow:0 8px 18px rgba(232,89,12,.28)}
.proceso-step h3{font-size:1.14rem;margin:0 0 .5rem}
.proceso-step p{font-size:.93rem;line-height:1.65;color:var(--color-text)}
.proceso-step::after{content:"";top:2.35rem;right:calc(-1.25rem - 1px);width:1.25rem;height:2px;font-size:0;background:repeating-linear-gradient(90deg,var(--color-accent) 0 5px,transparent 5px 9px)}

.services-grid--zona .service-card{position:relative}
.services-grid--zona .service-card__body{padding:1.6rem 1.6rem 1.7rem;gap:.7rem}
.services-grid--zona .service-card__icon{width:52px;height:52px;margin-bottom:.2rem}
.services-grid--zona .service-card h3{font-size:1.12rem;line-height:1.28}
.services-grid--zona .service-card h3 a{color:inherit;transition:color var(--transition)}
.services-grid--zona .service-card h3 a::after{content:"";position:absolute;inset:0;border-radius:var(--radius)}
.services-grid--zona .service-card:hover h3 a{color:var(--color-primary)}
.services-grid--zona .service-card p{font-size:.93rem}
.services-grid--zona .service-card__perks{margin-top:auto;padding-top:.9rem;border-top:1px solid var(--color-border)}

@media (max-width:768px){body main{padding-bottom:0}.fab{bottom:.9rem}}
/*elche-v5:end*/

/* ── seofix 2026-10-14 ── */
main>section:not(:first-of-type){content-visibility:auto;contain-intrinsic-size:auto 640px}
.faq-item>summary{list-style:none}
.faq-item>summary::-webkit-details-marker{display:none}
.faq-item[open]>.faq-answer{display:block}
.faq-item[open] .faq-question__icon{background:var(--color-primary);color:#fff;transform:rotate(45deg)}
.faq-question:focus-visible{outline:3px solid var(--color-primary);outline-offset:2px}
.caso-card__tag{pointer-events:none}
.caso-zoom{position:absolute;inset:0;display:block;width:100%;height:100%;padding:0;border:0;background:none;cursor:zoom-in}
.caso-zoom:focus-visible{outline:3px solid var(--color-primary);outline-offset:-3px}
.lightbox{max-width:min(1100px,94vw);max-height:92vh;padding:0;border:0;border-radius:12px;background:#0d1a34;overflow:hidden}
.lightbox::backdrop{background:rgba(5,10,25,.85)}
.lightbox img{display:block;max-width:100%;max-height:82vh;width:auto;height:auto;margin:0 auto}
.lightbox p{margin:0;padding:.75rem 1rem;color:#fff;font-size:.95rem;text-align:center}
.lightbox__close{position:absolute;top:.5rem;right:.5rem;width:44px;height:44px;border:0;border-radius:50%;background:rgba(255,255,255,.92);color:#0d1a34;font-size:1.6rem;line-height:1;cursor:pointer}
.lightbox__close:focus-visible{outline:3px solid #F6B71E;outline-offset:2px}
.cta-presupuesto{text-align:center;max-width:720px;margin:0 auto}
.cta-presupuesto p{margin:0 auto 1.5rem}
.gracias-pasos{max-width:640px;margin:1.5rem auto;text-align:left}
.gracias-pasos li{margin-bottom:.5rem}
.form-status{margin:1rem 0 0;padding:.9rem 1rem;border-radius:8px;background:#F0F5FB;border-left:3px solid transparent;font-size:.95rem;line-height:1.5}
.form-status:empty{display:none}
.form-status.is-pending{color:#475569}
.form-status.is-success{background:#e8f5ec;color:#145f38;border-left-color:#1f8a4c;font-weight:600}
.form-status.is-error{background:#fbeae7;color:#8c231a;border-left-color:#c0392b}