/* COPROACTIVA — capa de identidad visual (2026-08-30)
   Se carga al final: profundidad de fondos, botones y flechas de marca.
   No modifica estructura ni contenido de las páginas. */

:root{
  --u-ink:#2f2f2f;
  --u-orange:#d5863b;
  --u-orange-deep:#a75f22;
  --u-orange-dark:#7f451f;
  --u-gold:#d0a207;
  --u-cream:#fffaf4;
  --u-line:rgba(127,69,31,.14);
  --u-sh-1:0 1px 2px rgba(58,33,12,.06),0 4px 12px rgba(58,33,12,.05);
  --u-sh-2:0 2px 4px rgba(58,33,12,.06),0 14px 34px rgba(58,33,12,.10);
  --u-sh-3:0 3px 6px rgba(58,33,12,.08),0 26px 60px rgba(58,33,12,.16);
  --u-grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.45'/%3E%3C/svg%3E");
}

/* ── FONDOS CON PROFUNDIDAD ─────────────────────────────── */
body{background:#fffdfa}
main section{position:relative;isolation:isolate}
/* grano finísimo: quita el aspecto plano sin ensuciar */
main section::after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:var(--u-grain);background-size:160px 160px;opacity:.035;mix-blend-mode:multiply}
.hero::after{display:none}

/* lavado cálido de marca en secciones claras */
main section:not(.hero):not(.pilares){background-color:#fffdfa}
.about,.cmp,.terms{background:linear-gradient(180deg,var(--u-cream) 0%,#fff8ef 58%,#fffdfa 100%)!important}
#servicios,.rec,#blog{background:
  radial-gradient(760px 420px at 88% -8%,rgba(213,134,59,.10),transparent 62%),
  radial-gradient(620px 380px at -6% 108%,rgba(208,162,7,.09),transparent 64%),
  #fffdfa!important}
.contact{background:
  radial-gradient(820px 520px at 92% 8%,rgba(213,134,59,.22),transparent 60%),
  radial-gradient(700px 460px at 4% 96%,rgba(208,162,7,.13),transparent 62%),
  linear-gradient(165deg,#fffaf4 0%,#fff6ec 55%,#f9ead9 100%)!important}
.pilares-new{background:
  radial-gradient(700px 420px at 12% 0%,rgba(213,134,59,.12),transparent 60%),
  linear-gradient(160deg,#fffaf4 0%,#ffffff 50%,#fdf1e3 100%)!important}

/* filete superior de marca entre secciones */
main section:not(.hero)::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(213,134,59,.30) 18%,rgba(213,134,59,.30) 82%,transparent);z-index:0;pointer-events:none}
.pilares-new::before{height:1px;width:auto;background:linear-gradient(90deg,transparent,rgba(213,134,59,.30) 18%,rgba(213,134,59,.30) 82%,transparent)}

/* marca de agua del isotipo: da materia al fondo */
.about,.rec{overflow:clip}
#servicios .wrap,.rec .wrap,.about .wrap{position:relative}
.about .wrap::before,.rec .wrap::before{content:'';position:absolute;width:min(520px,52vw);aspect-ratio:1;right:-13%;top:-14%;background:url('coproactiva-isotipo.svg') center/contain no-repeat;opacity:.045;z-index:-1;pointer-events:none}
.rec .wrap::before{right:auto;left:-14%;top:auto;bottom:-16%}
@media(max-width:900px){.about .wrap::before,.rec .wrap::before{display:none}}

/* ── BOTONES ────────────────────────────────────────────── */
.btn{border-radius:999px!important;padding:14px 28px;font-weight:700;letter-spacing:.01em;position:relative;isolation:isolate;transition:transform .18s cubic-bezier(.2,.7,.3,1),box-shadow .18s ease,background .18s ease,border-color .18s ease}
.btn-p{background:linear-gradient(178deg,#c8762f 0%,#a75f22 62%,#96521c 100%)!important;color:#fff!important;border:1px solid rgba(101,54,20,.55)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 2px 4px rgba(88,47,17,.20),0 12px 26px rgba(167,95,34,.28)!important}
.btn-p:hover{transform:translateY(-2px);box-shadow:inset 0 1px 0 rgba(255,255,255,.32),0 4px 8px rgba(88,47,17,.22),0 18px 38px rgba(167,95,34,.34)!important;background:linear-gradient(178deg,#d18437 0%,#b06726 62%,#9d571e 100%)!important}
.btn-p:active{transform:translateY(0);box-shadow:inset 0 2px 5px rgba(72,37,12,.35)!important}
.btn-o{background:rgba(255,255,255,.92)!important;color:var(--u-orange-dark)!important;border:1px solid rgba(167,95,34,.30)!important;box-shadow:var(--u-sh-1);backdrop-filter:blur(6px)}
.btn-o:hover{background:#fff!important;border-color:rgba(167,95,34,.55)!important;transform:translateY(-2px);box-shadow:var(--u-sh-2)}
.btn-o:active{transform:translateY(0)}
.btn-wa{border-radius:999px!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 12px 26px rgba(37,211,102,.26)!important}
.btn:disabled,.btn[disabled]{filter:saturate(.35);box-shadow:none!important;transform:none!important}

/* flecha de marca dentro de los CTA principales */
.hero-btns .btn-p::after,#servicios>.wrap>div>.btn-p::after{content:'';width:16px;height:16px;flex:0 0 16px;margin-left:2px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h15'/%3E%3Cpath d='m13 6 6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h15'/%3E%3Cpath d='m13 6 6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;transition:transform .2s cubic-bezier(.2,.7,.3,1)}
.hero-btns .btn-p:hover::after,#servicios>.wrap>div>.btn-p:hover::after{transform:translateX(4px)}

/* ── ENLACES CON FLECHA (→ del contenido) ───────────────── */
.svc-more,.bc-read,.rc-link,.article-more{display:inline-flex;align-items:center;gap:7px;font-weight:700;color:var(--u-orange-deep)!important}
.svc-more{margin-top:16px;font-size:13.5px}
.svc-more::first-line{line-height:1.3}
.bc-read,.rc-link{position:relative}
.svc-more{position:static}
.u-arrow{width:15px;height:15px;flex:0 0 15px;fill:none;stroke:currentColor;stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s cubic-bezier(.2,.7,.3,1)}
.svc:hover .u-arrow,.bc:hover .u-arrow,.rc:hover .u-arrow,a:hover>.u-arrow{transform:translateX(4px)}
/* el glifo "→" del HTML se reemplaza por un chevron dibujado */
.svc-more,.rc-link,.bc-read{--u-arrow:1}
.svc-more:hover{color:var(--u-orange-dark)!important}
.svc:hover .svc-more,.rc:hover .rc-link,.bc:hover .bc-read{letter-spacing:.005em}

/* ── FLECHAS DEL CARRUSEL ───────────────────────────────── */
.blog-arrow{font-size:0!important;width:46px;height:46px;min-width:46px;border-radius:50%!important;border:1px solid rgba(167,95,34,.26)!important;background:#fff!important;box-shadow:var(--u-sh-1)!important;position:relative;transition:transform .18s cubic-bezier(.2,.7,.3,1),box-shadow .18s ease,background .18s ease,border-color .18s ease}
.blog-arrow::before{content:'';position:absolute;top:50%;left:50%;width:9px;height:9px;border-right:2.2px solid var(--u-orange-deep);border-bottom:2.2px solid var(--u-orange-deep);border-radius:1px;transition:border-color .18s ease}
.blog-prev::before{transform:translate(-40%,-50%) rotate(135deg)}
.blog-next::before{transform:translate(-60%,-50%) rotate(-45deg)}
.blog-arrow:hover{background:linear-gradient(178deg,#c8762f,#a75f22)!important;border-color:rgba(101,54,20,.5)!important;transform:translateY(-2px);box-shadow:var(--u-sh-2)!important}
.blog-arrow:hover::before{border-color:#fff}
.blog-arrow:disabled{opacity:.4;background:#fff!important;transform:none!important;box-shadow:none!important}
.blog-arrow:disabled::before{border-color:#b7b1a6}
@media(max-width:600px){
  .blog-arrow:hover{transform:translateY(-50%)}
}



/* ── TARJETAS Y SUPERFICIES ─────────────────────────────── */
.svc,.bc,.rc,.pillar-card,.con-form,.terms-box{border-radius:18px!important;border:1px solid var(--u-line)!important;box-shadow:var(--u-sh-1)!important;transition:transform .22s cubic-bezier(.2,.7,.3,1),box-shadow .22s ease,border-color .22s ease}
.svc:hover,.bc:hover,.rc:hover,.pillar-card:hover{transform:translateY(-4px);box-shadow:var(--u-sh-3)!important;border-color:rgba(167,95,34,.30)!important}
.svc::before{height:3px;background:linear-gradient(90deg,var(--u-orange),var(--u-gold))}
.con-form{box-shadow:var(--u-sh-3)!important;border-color:rgba(167,95,34,.20)!important}
.svc-icon,.bc-img{border-radius:14px}
.bc-img{border-radius:0}
.about-img{border-radius:20px;box-shadow:var(--u-sh-2)}

/* eyebrow con filete de marca */
.s-tag{display:inline-flex;align-items:center;gap:9px;white-space:nowrap;color:var(--u-orange-deep)!important}
@media(max-width:520px){.s-tag{white-space:normal}}
.s-tag::before{content:'';width:22px;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--u-orange),var(--u-gold));flex:0 0 22px}
.s-head.c .s-tag{justify-content:center}

/* navegación */
nav{box-shadow:0 1px 0 rgba(167,95,34,.10),0 10px 30px rgba(58,33,12,.05)}
.nav-links a{position:relative}
.nav-links a::after{content:'';position:absolute;left:0;right:100%;bottom:-6px;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--u-orange),var(--u-gold));transition:right .22s cubic-bezier(.2,.7,.3,1)}
.nav-links a:hover::after{right:0}

/* pill del hero y hero */
.hero-pill{border-radius:999px}
.hero::before{content:'';position:absolute;left:0;right:0;bottom:0;height:120px;background:linear-gradient(180deg,transparent,rgba(255,253,250,.75));z-index:1;pointer-events:none}

/* formulario */
.fg input,.fg select,.fg textarea{border-radius:12px!important}
.lw-progress-bar{background:linear-gradient(90deg,var(--u-orange),var(--u-gold))!important}

/* whatsapp flotante */
.wa-fab{box-shadow:0 2px 6px rgba(20,90,45,.22),0 14px 34px rgba(37,211,102,.34)!important;border:1px solid rgba(255,255,255,.35)}

/* footer con textura de marca */
footer{position:relative;overflow:hidden;background:linear-gradient(165deg,#33241a 0%,#2b1d14 55%,#241811 100%)!important}
footer::before{content:'';position:absolute;width:520px;height:520px;right:-150px;top:-180px;background:url('coproactiva-isotipo.svg') center/contain no-repeat;opacity:.05;pointer-events:none}
footer::after{content:'';position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,var(--u-orange),var(--u-gold),transparent)}
.ft-col ul li a:hover{color:#e9a35e!important}

/* ── MODO NOCHE ─────────────────────────────────────────── */
html[data-theme="dark"] body{background:#111}
html[data-theme="dark"] main section:not(.hero):not(.pilares){background-color:#141414}
html[data-theme="dark"] .about,html[data-theme="dark"] .cmp,html[data-theme="dark"] .terms{background:linear-gradient(180deg,#181818,#131313)!important}
html[data-theme="dark"] #servicios,html[data-theme="dark"] .rec,html[data-theme="dark"] #blog{background:radial-gradient(760px 420px at 88% -8%,rgba(213,134,59,.10),transparent 62%),#141414!important}
html[data-theme="dark"] .contact{background:radial-gradient(820px 520px at 92% 8%,rgba(213,134,59,.16),transparent 60%),linear-gradient(165deg,#171717,#121212)!important}
html[data-theme="dark"] .pilares-new{background:radial-gradient(700px 420px at 12% 0%,rgba(213,134,59,.12),transparent 60%),linear-gradient(160deg,#161616,#101010)!important}
html[data-theme="dark"] .svc,html[data-theme="dark"] .bc,html[data-theme="dark"] .rc,html[data-theme="dark"] .pillar-card,html[data-theme="dark"] .con-form,html[data-theme="dark"] .terms-box{background:#1c1c1c!important;border-color:rgba(213,134,59,.20)!important;box-shadow:0 20px 44px rgba(0,0,0,.45)!important}
html[data-theme="dark"] .blog-arrow{background:#1c1c1c!important;border-color:rgba(213,134,59,.30)!important}
html[data-theme="dark"] .blog-arrow::before{border-color:#e9a35e}
html[data-theme="dark"] .rc-icon,html[data-theme="dark"] .ci-icon{background:rgba(213,134,59,.14)!important;color:#e9a35e!important}
html[data-theme="dark"] .btn-o{background:#1c1c1c!important;color:#f3ece2!important;border-color:rgba(213,134,59,.34)!important}

/* ── PÁGINAS DE SERVICIO / BLOG (seo-pages, blog-*) ─────── */
.button{border-radius:999px!important;padding:14px 26px!important;position:relative;transition:transform .18s cubic-bezier(.2,.7,.3,1),box-shadow .18s ease,background .18s ease,border-color .18s ease}
.button:not(.secondary):not(.ghost){background:linear-gradient(178deg,#c8762f 0%,#a75f22 62%,#96521c 100%)!important;color:#fff!important;border:1px solid rgba(101,54,20,.55)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 2px 4px rgba(88,47,17,.20),0 12px 26px rgba(167,95,34,.28)!important}
.button:not(.secondary):not(.ghost):hover{transform:translateY(-2px);box-shadow:inset 0 1px 0 rgba(255,255,255,.32),0 4px 8px rgba(88,47,17,.22),0 18px 38px rgba(167,95,34,.34)!important}
.button.secondary{background:rgba(255,255,255,.94)!important;border:1px solid rgba(167,95,34,.30)!important;box-shadow:var(--u-sh-1)!important}
.button.secondary:hover{background:#fff!important;border-color:rgba(167,95,34,.55)!important;transform:translateY(-2px);box-shadow:var(--u-sh-2)!important}
.button:active{transform:translateY(0)!important}
.section{position:relative;isolation:isolate}
.section::after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:var(--u-grain);background-size:160px 160px;opacity:.035;mix-blend-mode:multiply}
.section.soft{background:
  radial-gradient(720px 400px at 90% -6%,rgba(213,134,59,.12),transparent 62%),
  radial-gradient(600px 360px at -4% 106%,rgba(208,162,7,.10),transparent 64%),
  linear-gradient(180deg,#fffaf4,#fff8ef)!important}
.feature-card,.service-scope-card,.hero-card,.faq details,.article-card{border-radius:18px!important;border:1px solid var(--u-line)!important;box-shadow:var(--u-sh-1)!important;transition:transform .22s cubic-bezier(.2,.7,.3,1),box-shadow .22s ease,border-color .22s ease}
.feature-card:hover,.service-scope-card:hover,.article-card:hover{transform:translateY(-4px);box-shadow:var(--u-sh-3)!important;border-color:rgba(167,95,34,.30)!important}
.hero-card{box-shadow:var(--u-sh-3)!important}
.faq details[open]{border-color:rgba(167,95,34,.32)!important;box-shadow:var(--u-sh-2)!important}
.eyebrow,.scope-label{color:var(--u-orange-deep)!important}
.cta-band{position:relative;overflow:hidden;background:linear-gradient(160deg,#3a2a1e 0%,#2f2f2f 58%,#241811 100%)!important}
.cta-band::before{content:'';position:absolute;width:460px;height:460px;right:-120px;top:-160px;background:url('coproactiva-isotipo.svg') center/contain no-repeat;opacity:.06;pointer-events:none}
.cta-band .cta-inner{position:relative;z-index:1}
.page-footer{position:relative;overflow:hidden;background:linear-gradient(165deg,#33241a 0%,#2b1d14 55%,#241811 100%)!important}
.page-footer::after{content:'';position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,var(--u-orange),var(--u-gold),transparent)}
.page-nav{box-shadow:0 1px 0 rgba(167,95,34,.10),0 10px 30px rgba(58,33,12,.05)}
.blog-hero{background:
  radial-gradient(700px 380px at 88% -10%,rgba(213,134,59,.14),transparent 62%),
  linear-gradient(180deg,#fffaf4 0%,#fffdfa 100%)!important}

@media(prefers-reduced-motion:reduce){
  .btn,.blog-arrow,.svc,.bc,.rc,.pillar-card{transition:none!important}
}

/* check del formulario: tilde centrada */
.lw-check{width:20px;height:20px}
.lw-card.is-selected .lw-check::after{left:50%!important;top:50%!important;width:4.5px!important;height:8.5px!important;border-width:0 2px 2px 0!important;transform:translate(-50%,-58%) rotate(45deg)!important}

/* ── MODO NOCHE: páginas de servicio y blog ─────────────── */
html[data-theme="dark"]{color-scheme:dark}
html[data-theme="dark"] body{color:#e9e4dc}
html[data-theme="dark"] .page-nav{background:#141414!important;border-color:rgba(213,134,59,.18)!important}
html[data-theme="dark"] .page-nav a{color:#e9e4dc!important}
html[data-theme="dark"] .section{background:#131313!important}
html[data-theme="dark"] .section.soft{background:radial-gradient(720px 400px at 90% -6%,rgba(213,134,59,.10),transparent 62%),#171717!important}
html[data-theme="dark"] .blog-hero,html[data-theme="dark"] .page-hero,html[data-theme="dark"] .hero{background:radial-gradient(700px 380px at 88% -10%,rgba(213,134,59,.12),transparent 62%),#151515!important}
html[data-theme="dark"] h1,html[data-theme="dark"] h2,html[data-theme="dark"] h3,html[data-theme="dark"] h4,html[data-theme="dark"] summary{color:#f5f1ea!important}
html[data-theme="dark"] p,html[data-theme="dark"] li,html[data-theme="dark"] .section-intro{color:#c9c2b8!important}
html[data-theme="dark"] .feature-card,html[data-theme="dark"] .service-scope-card,html[data-theme="dark"] .hero-card,html[data-theme="dark"] .faq details,html[data-theme="dark"] .article-card,html[data-theme="dark"] .note{background:#1c1c1c!important;border-color:rgba(213,134,59,.20)!important;box-shadow:0 20px 44px rgba(0,0,0,.45)!important}
html[data-theme="dark"] .note p,html[data-theme="dark"] .note strong{color:#e2dcd2!important}
html[data-theme="dark"] .button.secondary{background:#1c1c1c!important;color:#f3ece2!important;border-color:rgba(213,134,59,.34)!important}
html[data-theme="dark"] .eyebrow,html[data-theme="dark"] .scope-label{color:#e9a35e!important}
html[data-theme="dark"] .check-list li::marker{color:#e9a35e}
html[data-theme="dark"] a{color:#e9a35e}

/* modo noche: barra superior oscura en todas las plantillas */
html[data-theme="dark"] nav,html[data-theme="dark"] .page-nav{background:rgba(18,18,18,.96)!important;border-bottom-color:rgba(213,134,59,.24)!important}
html[data-theme="dark"] nav a,html[data-theme="dark"] .page-nav a,html[data-theme="dark"] .nav-links a{color:#c9c2b8!important}
html[data-theme="dark"] nav a:hover,html[data-theme="dark"] .page-nav a:hover,html[data-theme="dark"] .nav-links a:hover{color:#e9a35e!important}
html[data-theme="dark"] nav .btn-p,html[data-theme="dark"] .page-nav .button{color:#fff!important}
html[data-theme="dark"] .burger span{background:#f1eee9!important}
html[data-theme="dark"] .theme-toggle{color:#e9a35e!important}
html[data-theme="dark"] .mob{background:#1a1a1a!important}
html[data-theme="dark"] .mob a{color:#e2dcd2!important}

/* modo noche: logos planos (páginas de servicio y blog) pasan a blanco */
html[data-theme="dark"] .page-logo img,html[data-theme="dark"] nav .brand-logo:not([data-dark]){filter:brightness(0) invert(1)}

/* ── MÓVIL: carrusel de blog con tarjetas anchas ─────────── */
@media(max-width:600px){
  .blog-arrow{display:none!important}
  .blog-carousel{gap:0!important}
  #blog .wrap{padding-left:12px!important;padding-right:12px!important}
  .blog-grid{padding-left:0!important;padding-right:0!important;gap:10px!important}
  .bc{flex:0 0 93%!important}
  .bc-img{min-height:0!important;aspect-ratio:16/9!important}
  .bc-body{padding:14px 16px 16px!important}
  .bc-body h3{font-size:16.5px!important;line-height:1.28!important;margin-bottom:6px!important}
  .bc-body p{font-size:13px!important;line-height:1.5!important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:10px!important}
  .blog-grid{padding-bottom:12px!important}
  .blog-arrow{top:96px!important}
}
@media(max-width:420px){
  #blog .wrap{padding-left:10px!important;padding-right:10px!important}
  .bc{flex:0 0 94%!important}
}