/* ==========================================================================
   Asociación El Curtido — Panel de accesibilidad (estilos)
   Todo cuelga de clases "ec-*" en <html>; sin ellas la web es idéntica a la original.
   ========================================================================== */

html{font-size:calc(100%*var(--ec-fs,1));}

/* ---------- Botón flotante y panel ---------- */
#eca-root{font-family:Verdana,Tahoma,Arial,sans-serif; font-size:16px; line-height:1.4; letter-spacing:normal; word-spacing:normal; text-align:left;}
#eca-root *{box-sizing:border-box;}
.eca-open{
  position:fixed; right:14px; bottom:18px; z-index:9000; width:56px; height:56px; border-radius:50%;
  border:3px solid #fff; background:#123423; color:#fff; display:flex; align-items:center; justify-content:center;
  cursor:pointer; box-shadow:0 6px 20px rgba(0,0,0,.35); padding:0;
}
.eca-open:hover{background:#1E6B4F;}
.eca-open svg{width:34px; height:34px; display:block;}
.eca-open:focus-visible{outline:4px solid #ffbf00; outline-offset:3px;}
.eca-open[aria-expanded="true"]{display:none;}

.eca-panel{
  position:fixed; z-index:10050; top:0; right:0; bottom:0; width:392px; max-width:100vw;
  background:#fff; color:#1C2620; display:flex; flex-direction:column;
  box-shadow:-10px 0 40px rgba(0,0,0,.30); border-left:4px solid #123423;
}
.eca-panel[hidden]{display:none;}
.eca-head{display:flex; align-items:center; justify-content:space-between; gap:10px; padding:14px 16px; background:#123423; color:#fff;}
.eca-head h2{margin:0; font:700 18px/1.2 Verdana,Tahoma,Arial,sans-serif; color:#fff; letter-spacing:0;}
.eca-head h2:focus{outline:none;}
.eca-body{flex:1; overflow-y:auto; overscroll-behavior:contain; padding:6px 16px 16px; -webkit-overflow-scrolling:touch;}
.eca-foot{padding:12px 16px calc(12px + env(safe-area-inset-bottom)); border-top:2px solid #d5dbd6; background:#f4f7f4; display:grid; gap:8px;}
.eca-note{font-size:13px; color:#3b4640; margin:10px 0 0;}
.eca-group{border:0; margin:0; padding:0; min-width:0;}
.eca-group + .eca-group{margin-top:6px;}
.eca-group > legend, .eca-title{
  font:700 15px/1.3 Verdana,Tahoma,Arial,sans-serif; color:#123423; padding:14px 0 6px; margin:0; width:100%;
  border-bottom:2px solid #d5dbd6; display:block;
}
.eca-row{margin:10px 0 0;}
.eca-lab{display:block; font-size:14px; font-weight:700; margin:0 0 5px; color:#1C2620;}
.eca-seg{display:flex; gap:6px; flex-wrap:wrap;}
.eca-btn{
  min-height:44px; min-width:44px; padding:8px 12px; border:2px solid #1E6B4F; background:#fff; color:#123423;
  border-radius:10px; font:700 14px/1.2 Verdana,Tahoma,Arial,sans-serif; cursor:pointer; text-align:center;
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
}
.eca-btn:hover{background:#E9F3EC;}
.eca-btn[aria-pressed="true"], .eca-btn[aria-checked="true"]{background:#123423; color:#fff; border-color:#123423;}
.eca-btn[aria-pressed="true"]::before, .eca-btn[aria-checked="true"]::before{content:"\2713"; font-weight:900;}
.eca-btn:disabled{opacity:.55; cursor:not-allowed;}
.eca-btn:focus-visible, .eca-select:focus-visible, .eca-panel h2:focus-visible{outline:4px solid #ffbf00; outline-offset:2px; box-shadow:0 0 0 2px #000;}
.eca-btn.eca-primary{background:#1E6B4F; color:#fff; border-color:#1E6B4F;}
.eca-btn.eca-primary:hover{background:#123423;}
.eca-btn.eca-danger{border-color:#8a1c1c; color:#8a1c1c; background:#fff;}
.eca-btn.eca-danger:hover{background:#fdeeee;}
.eca-head .eca-btn{background:#fff; color:#123423; border-color:#fff;}
.eca-size{display:flex; align-items:center; gap:8px; flex-wrap:wrap;}
.eca-size output{font-weight:700; min-width:64px; text-align:center;}
.eca-select{width:100%; min-height:44px; padding:8px 10px; border:2px solid #1E6B4F; border-radius:10px; background:#fff; color:#1C2620; font:600 14px Verdana,Tahoma,Arial,sans-serif;}
.eca-voice{display:grid; grid-template-columns:1fr 1fr; gap:8px;}
.eca-voice .eca-btn{width:100%;}
.eca-status{margin:10px 0 0; padding:10px 12px; border:2px dashed #1E6B4F; border-radius:10px; font-size:14px; min-height:44px; background:#f4f7f4;}
.eca-sr{position:absolute!important; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap;}

/* Barra de lectura activa */
.eca-reading{
  position:fixed; right:14px; bottom:84px; z-index:9001; background:#123423; color:#fff; border:3px solid #fff;
  border-radius:14px; padding:10px 12px; display:flex; gap:8px; align-items:center; flex-wrap:wrap; max-width:calc(100vw - 28px);
  box-shadow:0 6px 20px rgba(0,0,0,.35); font:700 14px/1.2 Verdana,Tahoma,Arial,sans-serif;
}
.eca-reading[hidden]{display:none;}
.eca-reading .eca-btn{min-height:44px; background:#fff; color:#123423; border-color:#fff;}
.eca-reading .eca-btn:hover{background:#E9F3EC;}

/* Bloque que se está leyendo */
.ec-leyendo{outline:4px solid #ffbf00!important; outline-offset:4px; background-color:rgba(255,191,0,.18)!important; border-radius:4px;}

@media (max-width:640px){
  .eca-panel{top:auto; width:100%; max-height:90vh; max-height:90dvh; border-left:0; border-top:4px solid #123423; border-radius:18px 18px 0 0;}
  .eca-open{right:10px; bottom:12px; width:52px; height:52px;}
  .eca-reading{right:10px; bottom:72px;}
}
@media (max-height:480px) and (orientation:landscape){
  .eca-panel{top:0; max-height:none; width:min(392px,100vw); right:0; left:auto; border-radius:0; border-top:0; border-left:4px solid #123423;}
}

/* ---------- Tipografía y espaciado ---------- */
html.ec-ls1 body *{letter-spacing:.05em!important; word-spacing:.08em!important;}
html.ec-ls2 body *{letter-spacing:.12em!important; word-spacing:.16em!important;}
html.ec-lh1 body *{line-height:1.7!important;}
html.ec-lh2 body *{line-height:2!important;}
html.ec-lh1 h1,html.ec-lh1 h2,html.ec-lh1 h3,html.ec-lh1 h4,html.ec-lh2 h1,html.ec-lh2 h2,html.ec-lh2 h3,html.ec-lh2 h4{line-height:1.4!important;}
html.ec-lh1 p + p, html.ec-lh2 p + p{margin-top:1.2em;}
html.ec-font body, html.ec-font body *{font-family:Verdana,Tahoma,"Segoe UI",Arial,sans-serif!important;}
html.ec-left body *{text-align:left!important;}

/* ---------- Enlaces, botones y foco ---------- */
html.ec-ul a{text-decoration:underline!important; text-underline-offset:.2em; text-decoration-thickness:2px;}
html.ec-hl a:not(.skip-link):not(.eca-btn), html.ec-hl button:not(.eca-btn):not(.eca-open), html.ec-hl .btn, html.ec-hl [role="button"], html.ec-hl summary{
  outline:2px solid currentColor; outline-offset:2px;
}
html.ec-hl a:not(.skip-link):not(.eca-btn){text-decoration:underline!important; text-underline-offset:.2em; font-weight:700;}
html.ec-focus :focus, html.ec-focus :focus-visible{outline:4px solid #ffbf00!important; outline-offset:3px!important; box-shadow:0 0 0 7px #000!important; border-radius:4px;}

/* ---------- Movimiento ---------- */
html.ec-nomotion{scroll-behavior:auto!important;}
html.ec-nomotion *, html.ec-nomotion *::before, html.ec-nomotion *::after{
  animation:none!important; transition:none!important; scroll-behavior:auto!important;
}
html.ec-nomotion .reveal, html.ec-nomotion .hero .eyebrow, html.ec-nomotion .hero h1, html.ec-nomotion .hero p.lead, html.ec-nomotion .hero-actions{
  opacity:1!important; transform:none!important;
}

/* ---------- Elementos decorativos ---------- */
html.ec-nodeco .wave-divider, html.ec-nodeco .hero-bg-note, html.ec-nodeco .fb-feature-visual,
html.ec-nodeco svg.ic, html.ec-nodeco .eyebrow::before{display:none!important;}
html.ec-nodeco .hero-bg-img{display:none!important;}
html.ec-nodeco .hero-bg{background:#123423!important;}
html.ec-nodeco .hero-bg::after{display:none!important;}
html.ec-nodeco *{text-shadow:none!important;}
html.ec-nodeco section{background-image:none!important;}

/* ---------- Contraste reforzado (conserva el diseño, endurece texto y bordes) ---------- */
html.ec-ct-reinforced{
  --tinta:#000; --tinta-suave:#1a1a1a; --azul:#0B4A33; --azul-oscuro:#06251a; --verde:#0F5236; --linea:#5f6b64;
}
html.ec-ct-reinforced body{color:#000;}
html.ec-ct-reinforced p, html.ec-ct-reinforced li, html.ec-ct-reinforced span{opacity:1!important;}
html.ec-ct-reinforced a{text-decoration:underline; text-underline-offset:.18em;}
html.ec-ct-reinforced nav a, html.ec-ct-reinforced .brand, html.ec-ct-reinforced .btn, html.ec-ct-reinforced footer a{text-decoration:none;}
html.ec-ct-reinforced button, html.ec-ct-reinforced .btn, html.ec-ct-reinforced input, html.ec-ct-reinforced select, html.ec-ct-reinforced textarea{border-width:2px; border-color:#06251a;}
html.ec-ct-reinforced footer, html.ec-ct-reinforced footer *{color:#fff;}
html.ec-ct-reinforced .hero .btn:not(.btn-primary){border-color:#fff;}
html.ec-ct-reinforced .hero-bg::after{background:linear-gradient(180deg, rgba(0,0,0,.45), rgba(0,0,0,.75))!important;}

/* ---------- Alto contraste (fondo negro, texto blanco, enlaces amarillos) ---------- */
html.ec-ct-high{--tinta:#fff; --tinta-suave:#fff; --azul:#ffe600; --azul-oscuro:#fff; --verde:#ffe600; --linea:#fff; --crudo:#000; --crudo-2:#000; --blanco:#000; --gris-claro:#000; --verde-suave:#000;}
html.ec-ct-high body{background:#000!important; color:#fff!important;}
html.ec-ct-high *:not(img):not(svg):not(path):not(iframe):not(video):not(canvas):not(.eca-open){
  background-color:#000!important; background-image:none!important; color:#fff!important;
  border-color:#fff!important; box-shadow:none!important; text-shadow:none!important; opacity:1;
}
html.ec-ct-high a, html.ec-ct-high a *{color:#ffe600!important; text-decoration:underline!important; text-underline-offset:.18em;}
html.ec-ct-high a.brand, html.ec-ct-high a.brand *{text-decoration:none!important;}
html.ec-ct-high button, html.ec-ct-high .btn, html.ec-ct-high input, html.ec-ct-high select, html.ec-ct-high textarea, html.ec-ct-high .logo-tile{
  border:2px solid #fff!important;
}
html.ec-ct-high .btn, html.ec-ct-high .btn *{text-decoration:none!important;}
html.ec-ct-high [aria-pressed="true"], html.ec-ct-high [aria-checked="true"], html.ec-ct-high [aria-expanded="true"]{outline:3px solid #ffe600!important; outline-offset:-3px;}
html.ec-ct-high svg [stroke]:not([stroke="none"]){stroke:#fff!important;}
html.ec-ct-high svg [fill]:not([fill="none"]){fill:#fff!important;}
html.ec-ct-high .hamburger span{background:#fff!important;}
html.ec-ct-high .hero-bg::after{display:block; background:rgba(0,0,0,.72)!important;}
html.ec-ct-high .brand img, html.ec-ct-high .logo-tile img, html.ec-ct-high footer img{background:#fff!important; padding:3px; border-radius:6px;}
html.ec-ct-high .eca-open{background:#000!important; border-color:#ffe600!important; color:#ffe600!important;}
html.ec-ct-high .eca-open svg *{stroke:#ffe600!important;}
html.ec-ct-high .switch-track, html.ec-ct-high .switch-track::after{background:#fff!important;}
html.ec-ct-high .ec-leyendo{outline:4px solid #ffe600!important;}
html.ec-ct-high ::placeholder{color:#fff!important; opacity:1;}

/* ---------- Modos de lectura ---------- */
html.ec-read1 body *{line-height:1.9!important; letter-spacing:.02em;}
html.ec-read1 h1,html.ec-read1 h2,html.ec-read1 h3,html.ec-read1 h4{line-height:1.4!important;}
html.ec-read1 main p, html.ec-read1 main li{max-width:70ch;}
html.ec-read1 main p + p{margin-top:1.2em;}
html.ec-read1 .wave-divider, html.ec-read1 .hero-bg-note, html.ec-read1 .fb-feature-visual{display:none!important;}
html.ec-read1 *{text-shadow:none!important;}

html.ec-read2 body{background:#fff!important; color:#111!important;}
html.ec-read2 body *{line-height:1.9!important;}
html.ec-read2 h1,html.ec-read2 h2,html.ec-read2 h3,html.ec-read2 h4{line-height:1.4!important;}
html.ec-read2 .wave-divider, html.ec-read2 .hero-bg-note, html.ec-read2 .fb-feature-visual, html.ec-read2 svg.ic, html.ec-read2 .eyebrow::before{display:none!important;}
html.ec-read2 section{background:#fff!important; background-image:none!important; padding-top:56px; padding-bottom:56px;}
html.ec-read2 section *:not(img):not(svg):not(path):not(iframe):not(button):not(.btn):not(a.btn):not(.eca-btn):not(.ec-leyendo):not(input):not(select):not(textarea){
  box-shadow:none!important; text-shadow:none!important; background-image:none!important;
}
html.ec-read2 section, html.ec-read2 section :not(img):not(svg):not(path):not(button):not(.btn):not(a.btn):not(.hero-bg):not(.hero-bg *):not(.eca-btn):not(.ec-leyendo):not(input):not(select):not(textarea):not(.logo-tile){
  background-color:transparent;
}
html.ec-read2 main section:not(.hero){background:#fff!important;}
html.ec-read2 .container{max-width:880px;}
html.ec-read2 main p, html.ec-read2 main li{max-width:68ch; color:#111;}
html.ec-read2 main section:not(.hero) h1, html.ec-read2 main section:not(.hero) h2, html.ec-read2 main section:not(.hero) h3, html.ec-read2 main section:not(.hero) h4{color:#06251a;}
html.ec-read2 main a:not(.btn){color:#0B3A8A; text-decoration:underline; text-underline-offset:.2em;}
html.ec-read2 .hero-bg::after{background:rgba(0,0,0,.6)!important;}
html.ec-read2 :where(.servicios-grid,.quienes-grid,.cifras-grid,.equipo-grid,.eqh-grid,.colabora-grid,.certs-grid,.logos-grid,.contacto-grid,.tcn-grid,.trabaja-grid,.footer-grid){grid-template-columns:minmax(0,1fr)!important;}
html.ec-read2 .reveal{opacity:1!important; transform:none!important;}
html.ec-read2 *, html.ec-read2 *::before, html.ec-read2 *::after{animation:none!important; transition:none!important; scroll-behavior:auto!important;}
html.ec-read2 .hero .eyebrow, html.ec-read2 .hero h1, html.ec-read2 .hero p.lead, html.ec-read2 .hero-actions{opacity:1!important; transform:none!important;}

/* ---------- Preferencias del sistema ---------- */
@media (forced-colors:active){
  .eca-open, .eca-btn, .eca-panel{border:2px solid ButtonText; forced-color-adjust:auto;}
}
@media print{ #eca-root{display:none!important;} }

/* ---------- Menú compacto cuando el texto ampliado no cabe en la barra (copia del diseño móvil original) ---------- */
html.ec-navcompact nav.mainnav{position:fixed; inset:64px 0 0 0; background:var(--crudo); flex-direction:column; align-items:stretch; justify-content:flex-start; padding:24px; gap:4px; transform:translateX(100%); transition:transform 0.35s ease; overflow-y:auto;}
html.ec-navcompact nav.mainnav.open{transform:translateX(0);}
html.ec-navcompact nav.mainnav > a{padding:17px 6px; font-size:calc(17px*var(--ec-fs,1)); border-bottom:1px solid var(--linea); border-radius:0; width:100%;}
html.ec-navcompact nav.mainnav > a::after{display:none;}
html.ec-navcompact .nav-dropdown{width:100%;}
html.ec-navcompact .nav-dropdown-toggle{width:100%; padding:17px 6px; font-size:calc(17px*var(--ec-fs,1)); border-bottom:1px solid var(--linea); justify-content:space-between;}
html.ec-navcompact .nav-dropdown-panel{position:static; transform:none; opacity:1; visibility:visible; box-shadow:none; border:none; width:auto; padding:0 0 0 14px; display:none; background:transparent;}
html.ec-navcompact .nav-dropdown.open .nav-dropdown-panel{display:grid;}
html.ec-navcompact .nav-cta{margin:16px 0 0; text-align:center; justify-content:center;}
html.ec-navcompact .hamburger{display:block;}
html.ec-navcompact .topbar{display:none;}

/* El menú móvil cerrado no debe poder recibir el foco del teclado */
@media (max-width:1080px){
  nav.mainnav:not(.open){visibility:hidden; transition:transform .35s ease, visibility 0s linear .35s;}
  nav.mainnav.open{visibility:visible; transition:transform .35s ease;}
}
html.ec-navcompact nav.mainnav:not(.open){visibility:hidden; transition:transform .35s ease, visibility 0s linear .35s;}
html.ec-navcompact nav.mainnav.open{visibility:visible; transition:transform .35s ease;}

/* ---------- Foco visible en formularios (antes solo cambiaba el color del borde) ---------- */
html input:focus-visible, html select:focus-visible, html textarea:focus-visible,
html .field input:focus, html .field textarea:focus, html .tcn-form input:focus, html .tcn-form select:focus, html .tcn-form textarea:focus{
  outline:3px solid #1E6B4F!important; outline-offset:2px!important;
}

/* Tablas de las páginas legales: que no ensanchen la página en móvil o con texto ampliado */
td, th{overflow-wrap:anywhere;}
table{max-width:100%;}

@media (max-height:480px){
  .eca-foot{grid-template-columns:1fr 1fr; padding:8px 12px;}
  .eca-head{padding:8px 14px;}
}
