/* V16 — mejoras visuales sobre V15. Sin cambios de contenido ni interacción. */
:root {
  --texto-claro-suave:rgba(245,247,245,.80);
  --texto-oscuro-suave:rgba(20,32,24,.76);
}

/* Lectura: separación natural entre palabras en todos los dispositivos. */
body main p, body #nosotros .porque-grid .body-copy,
body #nosotros .quiene-card p, body #servicios .acc-body p,
body #servicios .acc-body li, body #servicios .check-list .check-desc,
body #como-trabajamos .step p, body #como-trabajamos .prosumidores-box p,
body #como-trabajamos .prosumidores-box li,
body #financiacion p, body #marcas .section-head > p:not(.eyebrow) {
  text-align:left !important;
  text-align-last:left !important;
  word-spacing:normal !important;
  letter-spacing:normal !important;
  hyphens:none !important;
}
body #nosotros .body-copy, body #nosotros .quiene-card p,
body #servicios .resumen-card p, body #servicios .acc-body p,
body #servicios .check-list li, body #servicios .check-list .check-desc,
body #como-trabajamos .step p, body #como-trabajamos .prosumidores-box p,
body #como-trabajamos .prosumidores-box li,
body #financiacion .serv-intro-copy, body #financiacion .callout-card p,
body #marcas .section-head > p:not(.eyebrow) {
  font-size:16px !important;
  line-height:1.65 !important;
}
body #nosotros, body #servicios,
body #como-trabajamos, body #financiacion, body #contacto {
  padding-top:80px !important;
  padding-bottom:80px !important;
}
body #como-trabajamos{padding-top:48px !important;}
body .section-head{margin-bottom:32px !important;}
body #nosotros .section-head h2, body #servicios .section-head h2, body #como-trabajamos .process-heading h2,
body #financiacion .section-head h2, body #contacto .section-head h2,
body #marcas .section-head h2 {
  font-size:clamp(27px,3vw,40px) !important;
  line-height:1.16 !important;
  letter-spacing:-.025em !important;
  text-wrap:balance;
}
body #como-trabajamos .process-heading{margin-bottom:32px !important;}
body #nosotros .porque-grid .body-copy{max-width:none !important;width:100% !important;}

/* Una familia visual de tarjetas, conservando los acentos de cada sección. */
body #nosotros .quienes-cards, body #servicios .resumen-grid,
body #como-trabajamos .steps{gap:20px !important;}
body #nosotros .quiene-card, body #servicios .resumen-card,
body #como-trabajamos .step {
  border-radius:16px !important;
  padding:28px !important;
  min-width:0;
}
body #nosotros .quiene-card, body #como-trabajamos .step {
  box-shadow:0 6px 22px rgba(10,32,54,.045);
  border:1px solid rgba(10,32,54,.10);
}
body #nosotros .quiene-card{border-top:3px solid var(--musgo);}
body #nosotros .quiene-card.azul{border-top-color:var(--azul);}
body #nosotros .quiene-card p{margin-bottom:0;}
body #servicios .resumen-card{border-color:rgba(245,247,245,.19);}
body #servicios .resumen-card .icon-circle{width:46px;height:46px;margin-bottom:20px;}
body #servicios .resumen-card h4{font-size:19px;line-height:1.25;margin:0 0 12px;}
body #servicios .resumen-card li{font-size:14px;line-height:1.55;}
body #como-trabajamos .steps{background:none;border:0;margin-top:0;}
body #como-trabajamos .step h3{font-size:20px !important;line-height:1.25 !important;margin-bottom:14px !important;}
body #como-trabajamos .step-num{margin-bottom:18px !important;font-weight:600;}
body #como-trabajamos .prosumidores-box,
body #financiacion .callout-card{border-radius:16px;padding:28px !important;}

/* Servicios: menos aire redundante, con títulos y controles claros. */
body #servicios .serv-block{margin-top:36px !important;padding-top:0 !important;}
body #servicios .acc-group{gap:12px;}
body #servicios .acc-item{border-radius:14px;border-color:rgba(245,247,245,.19);}
body #servicios .acc-item summary{padding:20px 24px !important;}
body #servicios .acc-item summary .acc-title{font-size:19px;line-height:1.3;}
body #servicios .acc-item summary .acc-sub{font-size:14px;margin-top:5px;}
body #servicios .acc-item[open]{border-color:rgba(253,191,14,.38);}
body #servicios .acc-item .acc-body{padding:0 24px 24px !important;}
body #servicios .sys-infografia{max-width:920px;margin:0 auto 20px;border-radius:10px;}
body #servicios .check-list{gap:12px !important;}
body #servicios .check-list .check-title{font-size:16px !important;line-height:1.4 !important;}
body #servicios .acc-body .label-mini{margin:22px 0 12px;}
body #servicios .acc-body .system-user-line{margin:16px 0 20px;}

/* Contacto: campos cómodos y separación clara entre formulario y datos. */
body #contacto .contacto-grid{gap:40px;align-items:start;}
body #contacto #contactForm{padding:28px;background:rgba(255,255,255,.035);border:1px solid rgba(245,247,245,.16);border-radius:16px;min-width:0;}
body #contacto .field{margin-bottom:20px;}
body #contacto .field label{font-family:var(--font-body);font-size:14px;line-height:1.45;letter-spacing:0;color:var(--texto-claro);margin-bottom:8px;}
body #contacto .field input:not([type=file]), body #contacto .field select, body #contacto .field textarea {
  border-radius:9px;font-size:16px;line-height:1.5;padding:12px 14px;
  border-color:rgba(245,247,245,.24);background:rgba(10,32,54,.64);
}
body #contacto .field textarea{min-height:140px;resize:vertical;}
body #contacto .field input:focus, body #contacto .field select:focus, body #contacto .field textarea:focus{border-color:var(--cobre);outline:2px solid rgba(253,191,14,.22);outline-offset:2px;}
body #contacto .file-drop{border-radius:10px;padding:22px 16px;}
body #contacto .file-drop-hint{font-size:12px;line-height:1.5;}
body #contacto .info-block{border:0;margin:0;padding:12px 0;}
body #contacto .info-row{padding-bottom:20px;margin-bottom:20px;border-bottom:1px solid rgba(245,247,245,.12);gap:14px;}
body #contacto .info-row:last-child{border-bottom:0;}
body #contacto .info-row .t{font-size:16px;line-height:1.5;overflow-wrap:anywhere;}
body #contacto .info-row .s{font-size:14px;line-height:1.5;}
body #contacto .info-row > div, body #contacto .info-row > a{min-width:0;}
body #contacto .contact-submit{width:100%;border-radius:10px !important;}
body #financiacion .btn{border-radius:10px;min-height:48px;}

@media (min-width:901px) and (max-width:1100px){
  body #servicios .resumen-grid,body #como-trabajamos .steps{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
}
@media (max-width:900px){
  body #nosotros,body #servicios,body #como-trabajamos,body #financiacion,body #contacto{padding-top:64px !important;padding-bottom:64px !important;}
  body #como-trabajamos{padding-top:36px !important;}
  body #contacto .contacto-grid{grid-template-columns:minmax(0,1fr);gap:24px;}
  body #nosotros .quiene-card,body #servicios .resumen-card,body #como-trabajamos .step{padding:24px !important;}
}
@media (max-width:600px){
  body .section-head,body #como-trabajamos .process-heading{margin-bottom:26px !important;}
  body #nosotros .body-copy,body #nosotros .quiene-card p,
  body #servicios .resumen-card p,body #servicios .acc-body p,
  body #servicios .check-list li,body #servicios .check-list .check-desc,
  body #como-trabajamos .step p,body #como-trabajamos .prosumidores-box p,
  body #como-trabajamos .prosumidores-box li,body #financiacion .serv-intro-copy,
  body #financiacion .callout-card p,body #marcas .section-head > p:not(.eyebrow){font-size:15px !important;line-height:1.65 !important;}
  body #nosotros .quiene-card,body #servicios .resumen-card,body #como-trabajamos .step{padding:22px !important;}
  body #servicios .acc-item summary{padding:18px !important;}
  body #servicios .acc-item summary .acc-title{font-size:17px;}
  body #servicios .acc-item .acc-body{padding:0 18px 20px !important;}
  body #servicios .check-list .check-title{font-size:15px !important;}
  body #contacto #contactForm{padding:22px 16px;}
  body #contacto .field-row{grid-template-columns:1fr;gap:0;}
  body #contacto .info-block{padding:8px 2px;}
  body #como-trabajamos .prosumidores-box,body #financiacion .callout-card{padding:22px !important;}
}

/* Menú V16: barra compacta y panel lateral en celular. */
body header#siteHeader, body header#siteHeader.scrolled {
  top:14px !important;left:16px !important;right:16px !important;
  width:auto !important;max-width:1240px;margin:0 auto !important;
  padding:0 !important;min-height:0 !important;
  background:#fff !important;border:1px solid rgba(10,32,54,.10) !important;
  border-radius:18px !important;box-shadow:0 8px 28px rgba(10,32,54,.13) !important;
  backdrop-filter:none !important;-webkit-backdrop-filter:none !important;
}
body header#siteHeader > .wrap {
  min-height:74px !important;padding:10px 18px !important;gap:16px !important;
  width:100% !important;max-width:none !important;border:0 !important;
  border-radius:18px !important;background:transparent !important;
  display:flex;align-items:center;justify-content:space-between !important;
}
body header#siteHeader .logo-img{width:154px !important;height:46px !important;max-width:none !important;}
body header#siteHeader .nav-right{margin:0 !important;flex:0 0 auto;}
body header#siteHeader .nav-right .budget-cta{min-height:46px !important;padding:0 16px !important;border-radius:11px !important;font-size:13px !important;gap:8px;box-shadow:none !important;}
@media (min-width:881px){
  body header#siteHeader nav.main-nav{position:static !important;transform:none !important;margin:0 !important;width:auto;}
  body header#siteHeader nav.main-nav ul{gap:2px;}
  body header#siteHeader nav.main-nav a{font-size:13px !important;min-height:40px;padding:0 9px !important;border-radius:9px !important;display:flex;align-items:center;white-space:nowrap;}
  body header#siteHeader nav.main-nav a::after{display:none;}
  body header#siteHeader nav.main-nav a.active{background:#eaf3fb !important;color:var(--azul) !important;box-shadow:none;}
  body header#siteHeader nav.main-nav a:hover{background:#f1f5f8 !important;}
}
@media (min-width:881px) and (max-width:1100px){
  body header#siteHeader > .wrap{gap:8px !important;padding:10px 12px !important;}
  body header#siteHeader .logo-img{width:120px !important;height:40px !important;}
  body header#siteHeader nav.main-nav a{font-size:12px !important;padding:0 6px !important;}
  body header#siteHeader .nav-right .budget-cta{padding:0 12px !important;font-size:12px !important;}
  body header#siteHeader .nav-right .budget-icon,body header#siteHeader .nav-right .budget-arrow{display:none;}
}
@media (max-width:880px){
  body header#siteHeader,body header#siteHeader.scrolled{top:10px !important;left:10px !important;right:10px !important;border-radius:15px !important;}
  body header#siteHeader > .wrap{min-height:64px !important;padding:8px 12px !important;}
  body header#siteHeader .logo-img{width:142px !important;height:44px !important;}
  body header#siteHeader .nav-toggle{margin:0;width:44px;height:44px;border-radius:11px;background:#eef4f8;}
  body.nav-open header#siteHeader::before{content:"";position:fixed;inset:0;background:rgba(10,32,54,.48);z-index:70;}
  html.nav-ready body header#siteHeader nav.main-nav{
    position:fixed;top:0;bottom:0;left:auto;right:0;
    width:min(420px,100vw);height:100dvh;max-height:none;margin:0 !important;
    padding:24px 26px 28px;transform:translateX(105%);border-radius:22px 0 0 22px;
    background:#fff;box-shadow:-16px 0 48px rgba(10,32,54,.18);z-index:80;
    transition:transform .25s ease;overflow-y:auto;
  }
  html.nav-ready body header#siteHeader nav.main-nav.open{transform:translateX(0);}
  body header#siteHeader .nav-close{margin-bottom:26px;}
  body header#siteHeader .nav-close button{background:#f2f6f8;border-color:#dce5eb;}
  body header#siteHeader nav.main-nav ul{gap:8px;}
  body header#siteHeader nav.main-nav li{border:0;}
  body header#siteHeader nav.main-nav li a{font-size:19px;font-weight:600;line-height:1.4;padding:14px 16px;border-radius:12px;box-shadow:none;}
  body header#siteHeader nav.main-nav li a.active{background:#eaf3fb !important;color:var(--azul);}
  body header#siteHeader .nav-cta{margin-top:auto;padding-top:32px;}
  body header#siteHeader .nav-cta .btn{min-height:52px;border-radius:12px;box-shadow:none;}
  html:not(.nav-ready) body header#siteHeader nav.main-nav{width:100%;}
  html:not(.nav-ready) body header#siteHeader{left:auto !important;right:auto !important;top:0 !important;width:calc(100% - 20px) !important;margin:10px auto !important;}
}

/* Contacto V16: información a la izquierda, formulario claro a la derecha. */
body #contacto{background:linear-gradient(125deg,#0A2036 0%,#123152 100%);}
body #contacto #contactForm{background:#fff;color:var(--grafito);border:1px solid #e0e7ec;box-shadow:0 16px 40px rgba(0,0,0,.13);padding:32px;border-radius:20px;}
body #contacto .field label{color:var(--grafito);font-weight:600;}
body #contacto .field input:not([type=file]),body #contacto .field select,body #contacto .field textarea{background:#f6f8fa;color:var(--grafito);border-color:#cbd7e0;}
body #contacto .field input::placeholder,body #contacto .field textarea::placeholder{color:#607487;opacity:1;}
body #contacto .field input:focus,body #contacto .field select:focus,body #contacto .field textarea:focus{border-color:var(--azul);outline-color:rgba(6,101,189,.18);background:#fff;}
body #contacto .file-drop{background:#f6faf3;border-color:#aec898;}
body #contacto .file-drop-text{color:var(--grafito);}
body #contacto .file-drop-hint{color:#546577;}
body #contacto .file-drop-inner .icon{color:#4f781c;}
body #contacto .file-drop-name{color:#416a18;overflow-wrap:anywhere;}
body #contacto .form-response-note,body #contacto .form-response-note span{color:#546577 !important;}
body #contacto .form-response-note svg{color:#4f781c !important;}
body #contacto .form-success{color:#285716;border-color:#89ad77;background:#f3f9ef;}
body #contacto .form-error{color:#9d3221;border-color:#dc998d;background:#fff5f2;}
body #contacto .info-block{padding:0;}
body #contacto .info-row{padding:18px;margin:0 0 12px;border:1px solid rgba(255,255,255,.13);border-radius:13px;background:rgba(255,255,255,.035);}
body #contacto .info-row:last-child{border:1px solid rgba(255,255,255,.13);}
body #contacto .info-row .icon{width:22px;height:22px;margin-top:2px;}
body #contacto .info-row .s{margin-top:4px;color:rgba(245,247,245,.75);}
@media (min-width:901px){
  body #contacto > .wrap{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);column-gap:56px;row-gap:30px;align-items:start;}
  body #contacto .contacto-grid{display:contents;}
  body #contacto .section-head{grid-column:1;grid-row:1;margin:8px 0 0 !important;max-width:none;}
  body #contacto .section-head h2{max-width:15ch;text-wrap:balance;}
  body #contacto .section-head > p:not(.eyebrow){font-size:17px;line-height:1.65;max-width:40ch;}
  body #contacto #contactForm{grid-column:2;grid-row:1 / span 2;}
  body #contacto .contacto-grid > div.reveal{grid-column:1;grid-row:2;}
}
@media (max-width:900px){
  body #contacto #contactForm{padding:26px;border-radius:18px;}
}
@media (max-width:600px){
  body #contacto #contactForm{padding:24px 18px;}
  body #contacto .info-row{padding:16px;}
}

/* V17 — ajustes solicitados tras la revisión visual. */
body header#siteHeader, body header#siteHeader.scrolled,
html:not(.nav-ready) body header#siteHeader {
  top:0 !important;
  margin-top:0 !important;
  border-top-left-radius:0 !important;
  border-top-right-radius:0 !important;
}
body header#siteHeader > .wrap {
  border-top-left-radius:0 !important;
  border-top-right-radius:0 !important;
}
body #contacto .section-head { container-type:inline-size; }
body #contacto .section-head h2 {
  max-width:none !important;
  font-size:clamp(18px,6.2cqi,34px) !important;
  line-height:1.2 !important;
  white-space:nowrap;
  text-wrap:nowrap;
  letter-spacing:-.025em !important;
}
@media (max-width:600px) {
  body #marcas .section-head {container-type:inline-size;}
  body #marcas .section-head h2 {
    font-size:clamp(17px,6.1cqi,27px) !important;
    line-height:1.2 !important;
    white-space:nowrap;
    text-wrap:nowrap;
    letter-spacing:-.025em !important;
  }
}

/* V18: justificación reservada a párrafos amplios de escritorio.
   La última línea queda a la izquierda; sin compresión artificial de espacios.
   El guionado automático depende del diccionario español del navegador. */
@media (min-width:1025px) {
  body #nosotros .porque-grid .body-copy,
  body #nosotros .quiene-card p,
  body #servicios .acc-body > p,
  body #servicios .acc-body .check-list .check-desc,
  body #servicios .acc-body .callout-card p,
  body #como-trabajamos .prosumidores-box p,
  body #como-trabajamos .prosumidores-box li,
  body #financiacion .serv-intro-copy,
  body #financiacion .financing-options p,
  body #financiacion .callout-card p,
  body #marcas .section-head > p:not(.eyebrow) {
    text-align:justify !important;
    text-align-last:left !important;
    text-justify:auto !important;
    word-spacing:normal !important;
    letter-spacing:normal !important;
    hyphens:auto !important;
    -webkit-hyphens:auto !important;
    overflow-wrap:break-word !important;
  }
}
