/* Christian Gamero · plantillas interiores, widget de WhatsApp y piezas del tema.
   Mismas reglas que la home: sin bordes en cajas (relleno de color), sin serif, dividers solo a todo el ancho. */

:root{--acc:#4cc282}
html,body{overflow-x:clip}
.cg-page{width:1440px;background:#070807}
.cg-skip{position:absolute;left:-9999px;top:8px;z-index:200;padding:10px 14px;border-radius:8px;background:#fdfdfb;color:#121412;font:600 14px Geist,sans-serif}
.cg-skip:focus{left:12px}
.cg-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.cg-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.j-ghost{border:0!important;background:#151715!important;box-shadow:none!important}
@media (hover:hover) and (pointer:fine){.j-ghost:hover{background:#1c1f1c!important}}
.h-err{margin:0 0 16px;padding:12px 14px;border-radius:10px;background:#2a1414;color:#ffb4b4;font-size:14px}/* ---------- Desplegable de servicios (cabecera) ---------- */
.j-dd{position:relative;display:flex}
.j-dd>a{display:inline-flex;align-items:center;gap:5px}
.j-dd>a svg{opacity:.6;transition:transform .3s}
.j-dd:focus-within>a svg{transform:rotate(180deg)}
@media (hover:hover) and (pointer:fine){.j-dd:hover>a svg{transform:rotate(180deg)}}
.j-mm-srv summary{list-style:none;display:flex;align-items:center;justify-content:space-between;padding:16px 0;border-bottom:1px solid #161816;font-family:Geist,sans-serif;font-size:30px;font-weight:500;letter-spacing:-.035em;color:#f2f3f1;cursor:pointer}
.j-mm-srv summary::-webkit-details-marker{display:none}
.j-mm-srv[open] summary svg{transform:rotate(180deg)}
.j-mm nav .j-mm-srv a{padding:11px 0 11px 2px;border:0;font-family:Geist,sans-serif;font-size:17px;letter-spacing:0;color:#a3a7a1}/* ---------- Cabecera de páginas interiores ---------- */
.pg-top{position:relative;background-color:#070807;background-image:radial-gradient(#151815 1px,transparent 1px);background-size:18px 18px;color:#e9ebe8;font-family:Geist,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
.pg-top *{box-sizing:border-box}
.pg-top a{color:inherit;text-decoration:none}
.pg-hero{display:grid;grid-template-columns:minmax(0,1fr) 540px;gap:72px;align-items:center;padding:48px 120px 96px}
.pg-hero.solo{grid-template-columns:minmax(0,880px)}
.pg-migas ol{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0 0 28px;padding:0;font-size:13px;color:#7d817b}
.pg-migas li+li::before{content:'/';margin-right:8px;color:#3a3d3a}
@media (hover:hover) and (pointer:fine){.pg-migas a:hover{color:#f2f3f1}}
.pg-h1{margin:0;font-family:Geist,sans-serif;font-weight:500;font-size:58px;line-height:1.03;letter-spacing:-.045em;color:#f2f3f1;text-wrap:balance}
.pg-lead{margin:24px 0 0;max-width:640px;font-size:17px;line-height:1.65;color:#a3a7a1;text-wrap:pretty}
.pg-lead b{color:#e9ebe8;font-weight:500}
.pg-lead a{color:#f2f3f1;text-decoration:underline;text-decoration-color:var(--acc);text-underline-offset:3px}
.pg-ctas{display:flex;flex-wrap:wrap;gap:10px;margin-top:32px}
.pg-meta{display:flex;flex-wrap:wrap;align-items:center;gap:10px 28px;margin:28px 0 0;font-size:14px;color:#8a8e88}
.pg-meta b{color:#f2f3f1;font-weight:500}
.pg-meta .st{color:#e3a33a;letter-spacing:1px;font-size:12px}
@media (hover:hover) and (pointer:fine){.pg-meta a:hover b{color:var(--acc)}}
.pg-hero-v .v-win{height:430px}
.pg-hero-cap{display:inline-flex;align-items:center;gap:8px;margin-top:14px;font-size:13px;color:#8a8e88;transition:color .3s}
@media (hover:hover) and (pointer:fine){.pg-hero-cap:hover{color:#f2f3f1}}
.pg-yo{grid-template-columns:minmax(0,1fr) 520px;padding-bottom:24px}
.pg-foto{display:block;width:520px;height:520px;object-fit:cover;mix-blend-mode:lighten;-webkit-mask-image:radial-gradient(ellipse 58% 62% at 50% 44%,#000 58%,transparent 100%);mask-image:radial-gradient(ellipse 58% 62% at 50% 44%,#000 58%,transparent 100%)}
.pg-post-h .pg-h1{font-size:50px;max-width:920px}
.pg-autor{display:flex;align-items:center;gap:12px;margin:28px 0 0;font-size:14px;color:#8a8e88}
.pg-autor img{border-radius:50%}
.pg-autor a{color:#f2f3f1}/* ---------- Bloques de contenido ---------- */
.pg-2c{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:80px;align-items:start}
.pg-txt+.pg-txt{margin-top:88px;padding-top:88px;border-top:1px solid var(--cg2-line)}
.pg-txt>.v-h2{font-size:38px}
.pg-inc{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:0 40px;margin:0;padding:0}
.pg-inc li{display:flex;gap:14px;padding:22px 0;border-top:1px solid var(--cg2-line)}
.pg-inc svg{flex:none;margin-top:3px;color:var(--cg2-acc)}
.pg-inc b{display:block;margin-bottom:4px;font-family:Geist,sans-serif;font-size:18px;font-weight:500;letter-spacing:-.02em;color:var(--cg2-ink)}
.pg-inc span{font-size:14.5px;line-height:1.6;color:var(--cg2-mut)}
.pg-prosa{max-width:720px;font-size:17px;line-height:1.75;color:var(--cg2-mut)}
.pg-prosa p{margin:0 0 18px}
.pg-prosa b,.pg-prosa strong{font-weight:500;color:var(--cg2-ink)}
.pg-prosa a{color:var(--cg2-ink);text-decoration:underline;text-decoration-color:var(--cg2-acc);text-decoration-thickness:1.5px;text-underline-offset:3px;transition:text-decoration-color .3s}
@media (hover:hover) and (pointer:fine){.pg-prosa a:hover{text-decoration-color:var(--cg2-ink)}}
.pg-prosa ul,.pg-prosa ol{margin:0 0 18px;padding-left:22px}
.pg-prosa li{margin:8px 0}
.pg-prosa li::marker{color:var(--cg2-acc)}
.pg-prosa h2{margin:64px 0 16px;font-family:Geist,sans-serif;font-size:31px;font-weight:500;line-height:1.15;letter-spacing:-.035em;color:var(--cg2-ink);scroll-margin-top:96px}
.pg-prosa h3{margin:32px 0 10px;font-family:Geist,sans-serif;font-size:20px;font-weight:500;letter-spacing:-.02em;color:var(--cg2-ink)}
.pg-prosa>:first-child{margin-top:0}
.pg-art{max-width:760px;margin:0 auto}
.v-qs .a p{margin:0}
.v-qs .a a{color:var(--cg2-ink);text-decoration:underline;text-decoration-color:var(--cg2-acc);text-underline-offset:3px}/* Enlazado interno */
.pg-rel{display:grid;grid-template-columns:1fr 1fr;gap:64px;margin-top:40px}
.pg-rel h3{margin:0 0 8px;font-size:13px;font-weight:500;color:var(--cg2-dim)}
.pg-links{list-style:none;margin:0;padding:0}
.pg-links a{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 0;border-top:1px solid var(--cg2-line)}
.pg-links b{display:block;font-family:Geist,sans-serif;font-size:18px;font-weight:500;letter-spacing:-.02em;color:var(--cg2-ink)}
.pg-links small{display:block;margin-top:3px;font-size:13.5px;color:var(--cg2-mut)}
.pg-links a>span{flex:1;min-width:0}
.pg-ico{display:grid;place-items:center;flex:none;width:44px;height:44px;border-radius:12px;background:var(--cg2-card);color:var(--cg2-acc);box-shadow:0 12px 24px -18px rgba(0,0,0,.35);transition:background-color .3s,color .3s}
@media (hover:hover) and (pointer:fine){.pg-links a:hover .pg-ico{background:var(--acc,#4cc282);color:#06140c}}
.pg-min{display:block;flex:none;width:72px;height:46px;overflow:hidden;border-radius:9px;background:var(--cg2-chip)}
.pg-min img{display:block;width:100%;height:100%;object-fit:cover}
.pg-links svg{flex:none;color:var(--cg2-dim);transition:transform .6s cubic-bezier(.16,1,.3,1),color .3s}
@media (hover:hover) and (pointer:fine){.pg-links a:hover svg{transform:rotate(-45deg);color:var(--cg2-ink)}}
@media (hover:hover) and (pointer:fine){.pg-links a:hover .pg-ico svg{transform:none;color:inherit}}/* Filtros (proyectos y blog) */
.pg-filtro{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 44px}
.pg-filtro button,.pg-filtro a{border:0;border-radius:9px;padding:9px 14px;background:#151715;color:#a5a9a3;font:500 14px Geist,sans-serif;cursor:pointer;transition:background-color .25s,color .25s}
@media (hover:hover) and (pointer:fine){.pg-filtro button:hover,.pg-filtro a:hover{color:#f2f3f1}}
.pg-filtro.claro a{background:var(--cg2-chip);color:var(--cg2-mut)}
@media (hover:hover) and (pointer:fine){.pg-filtro.claro a:hover{color:var(--cg2-ink)}}
.pg-filtro [aria-pressed="true"],.pg-filtro [aria-current="page"]{background:var(--acc)!important;color:#06140c!important}
.pg-proyectos{margin-top:0;row-gap:56px}
.v-mini[hidden]{display:none}/* Ficha de proyecto */
.pg-ficha{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:56px;align-items:start}
.pg-scroll{height:760px}
.pg-scroll-in{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain}
.pg-scroll .pg-scroll-in img{flex:none;height:auto;object-fit:initial;transition:none}
.pg-datos{position:static}
.pg-datos dl{display:grid;grid-template-columns:110px 1fr;gap:12px 16px;margin:0 0 24px;font-size:14.5px}
.pg-datos dt{color:var(--cg2-dim)}
.pg-datos dd{margin:0;color:var(--cg2-ink)}
.pg-datos dd a{text-decoration:underline;text-decoration-color:var(--cg2-acc);text-underline-offset:3px}
.pg-datos .h-btn{margin-top:12px}/* Blog */
.pg-posts{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 56px;margin:0;padding:0}
.pg-posts a{display:block;padding:32px 0;border-top:1px solid var(--cg2-line)}
.pg-posts small{font-size:13px;color:var(--cg2-dim)}
.pg-posts h2{margin:10px 0 0;font-family:Geist,sans-serif;font-size:26px;font-weight:500;line-height:1.15;letter-spacing:-.03em;color:var(--cg2-ink);text-wrap:balance}
.pg-posts p{margin:12px 0 0;font-size:15px;line-height:1.6;color:var(--cg2-mut)}
.pg-posts .h-more{margin-top:18px}
.pg-post{display:grid;grid-template-columns:250px minmax(0,740px);gap:72px;justify-content:center}
.pg-ind{align-self:start;font-size:14px}
.pg-ind b{display:block;margin-bottom:10px;font-size:13px;font-weight:500;color:var(--cg2-dim)}
.pg-ind ol{list-style:none;margin:0;padding:0}
.pg-ind a{display:block;padding:7px 0;line-height:1.4;color:var(--cg2-mut);transition:color .25s}
.pg-ind a.on{color:var(--cg2-ink)}
@media (hover:hover) and (pointer:fine){.pg-ind a:hover{color:var(--cg2-ink)}}
.pg-post .pg-art{margin:0}
.pg-cta{display:flex;align-items:center;gap:20px;margin:56px 0 0;padding:28px;border-radius:16px;background:var(--cg2-card);box-shadow:var(--cg2-soft)}
.pg-cta img{flex:none;border-radius:50%}
.pg-cta b{font-family:Geist,sans-serif;font-size:20px;font-weight:500;color:var(--cg2-ink)}
.pg-cta p{margin:6px 0 0;font-size:15px;line-height:1.55}
.pg-cta .h-btn{margin-left:auto;text-decoration:none}
.navigation.pagination{margin-top:40px}
.nav-links{display:flex;gap:6px}
.nav-links .page-numbers{padding:9px 14px;border-radius:9px;background:var(--cg2-chip);color:var(--cg2-mut);font-size:14px}
.nav-links .current{background:var(--acc);color:#06140c}/* Opiniones */
.pg-resenas{columns:3;column-gap:20px;margin-top:48px}
.pg-resenas .v-rv{break-inside:avoid;margin:0 0 20px;padding:24px;border-radius:16px;background:var(--cg2-card);box-shadow:var(--cg2-soft)}
.pg-resenas .v-rv:nth-child(5n+2){background:#0f3a2a;box-shadow:none;--cg2-ink:#fff;--cg2-mut:rgba(255,255,255,.72)}
.pg-resenas .v-rv:nth-child(7n+4){background:#4cc282;box-shadow:none;--cg2-ink:#06140c;--cg2-mut:#123d25}
.pg-resenas .v-rv:nth-child(7n+4) .st{color:#06140c}
.pg-resenas blockquote{font-size:17px!important;line-height:1.45!important}
.pg-ver{display:flex;flex-wrap:wrap;align-items:center;gap:28px;margin:16px 0 0}/* ---------- PageSpeed en "Esta web también la he hecho yo" ---------- */
.psi:not(.hb *){margin-top:44px}
.psi-l{list-style:none;display:flex;flex-wrap:wrap;gap:24px 44px;margin:0;padding:0}
.psi-l li{position:relative;display:flex;align-items:center;gap:14px}
.psi-l svg{width:58px;height:58px;transform:rotate(-90deg)}
.psi-l circle{fill:none;stroke:#1d201d;stroke-width:4}
.psi-l circle.v{stroke:var(--acc);stroke-linecap:round;stroke-dasharray:0 100;transition:stroke-dasharray 1.6s cubic-bezier(.16,1,.3,1)}
.psi.on circle.v{stroke-dasharray:var(--v) 100}
.psi-l b{position:absolute;left:0;top:50%;width:58px;transform:translateY(-50%);text-align:center;font-family:Geist,sans-serif;font-size:18px;font-weight:500;color:#f2f3f1}
.psi-l span{font-size:14px;color:#a3a7a1}
.psi-src{margin:18px 0 0;font-size:13px;color:#6f736d}/* ---------- Widget de WhatsApp ---------- */
.wa:not(.hb *){font-family:Geist,system-ui,sans-serif}
.wa .v-fab{border:0;cursor:pointer}
.wa .v-fab svg{width:24px;height:24px}
.wa-pop{position:fixed;z-index:61;right:28px;bottom:100px;width:360px;overflow:hidden;border-radius:18px;background:#fdfdfb;box-shadow:0 34px 80px -24px rgba(0,0,0,.5),0 2px 8px rgba(0,0,0,.08);transform-origin:calc(100% - 28px) calc(100% + 40px)}
.wa-pop:not([hidden]){animation:wa-in .4s cubic-bezier(.16,1,.3,1)}
@keyframes wa-in{from{opacity:0;transform:translateY(12px) scale(.94)}to{opacity:1;transform:none}}
.wa-top{display:flex;align-items:center;gap:12px;padding:18px 14px 12px 18px;background:#fdfdfb;color:#121412}
.wa-top img{width:44px;height:44px;border-radius:50%;object-fit:cover}
.wa-top b{display:block;font:600 17px Geist,Geist,sans-serif;letter-spacing:-.01em}
.wa-top small{display:block;margin-top:2px;color:#6b6f69}
.wa-x{display:grid;place-items:center;width:34px;height:34px;margin-left:auto;border:0;border-radius:9px;background:#eef0eb;color:#5b5f59;cursor:pointer}
@media (hover:hover) and (pointer:fine){.wa-x:hover{background:#e3e5df}}
.wa-top small{font-size:12.5px;line-height:1.35}
.wa-mot{margin:0;padding:6px 8px;list-style:none;background:#fdfdfb}
.wa-mot li+li{border-top:1px solid #ecede8}
.wa-mot button{display:flex;align-items:center;gap:14px;width:100%;padding:13px 10px;border:0;border-radius:12px;background:none;text-align:left;font-family:inherit;color:#121412;cursor:pointer;transition:background-color .2s}
@media (hover:hover) and (pointer:fine){.wa-mot button:hover{background:#f1f2ed}}
.wa-mot i{display:grid;place-items:center;width:38px;height:38px;flex:none;border-radius:10px;background:#4cc282;color:#06140c}
.wa-mot i svg{width:18px;height:18px}
.wa-mot b{display:block;font-size:14.5px;font-weight:600}
.wa-mot small{display:block;margin-top:2px;font-size:13px;color:#6b6f69}
.wa-fl{width:16px;height:16px;margin-left:auto;flex:none;color:#a3a7a1;transition:transform .3s cubic-bezier(.16,1,.3,1)}
@media (hover:hover) and (pointer:fine){.wa-mot button:hover .wa-fl{transform:translateX(3px);color:#17824a}}
.wa-pie{margin:0;padding:12px 16px 14px;background:#f4f5f1;font-size:13px;color:#6b6f69}
.wa-pie a{color:#121412;font-weight:600;text-decoration:none}
@media (hover:hover) and (pointer:fine){.wa-pie a:hover{color:#17824a}}
.wa-saludo{position:fixed;z-index:60;right:28px;bottom:98px;width:300px;animation:wa-in .5s cubic-bezier(.16,1,.3,1);transform-origin:calc(100% - 28px) 100%}
.wa-saludo-b{display:flex;align-items:flex-start;gap:12px;width:100%;padding:14px 16px;border:0;border-radius:16px 16px 4px 16px;background:#fdfdfb;box-shadow:0 24px 50px -18px rgba(0,0,0,.45),0 2px 6px rgba(0,0,0,.06);text-align:left;font:14px/1.45 Geist,sans-serif;color:#3b3e3a;cursor:pointer}
.wa-saludo-b img{width:40px;height:40px;flex:none;border-radius:50%;object-fit:cover}
.wa-saludo-b b{display:block;margin-bottom:2px;font-size:14px;font-weight:600;color:#121412}
.wa-saludo-x{position:absolute;top:-9px;left:-9px;display:grid;place-items:center;width:24px;height:24px;border:0;border-radius:50%;background:#121412;color:#f2f3f1;cursor:pointer}
.wa-form{display:flex;align-items:flex-end;gap:8px;padding:6px 16px 14px;background:#fdfdfb}
.wa-form textarea{flex:1;max-height:120px;resize:none;border:0;border-radius:12px;padding:13px 14px;background:#efefe9;font:15px/1.4 Geist,sans-serif;color:#121412;outline:0}
.wa-form textarea:focus{background:#e9e9e2}
.wa-form button{display:grid;place-items:center;width:46px;height:46px;flex:none;border:0;border-radius:12px;background:var(--acc,#4cc282);color:#06140c;cursor:pointer}
@media (hover:hover) and (pointer:fine){.wa-form button:hover{filter:brightness(1.06)}}/* ---------- Aviso de cookies ---------- */
.ck{position:fixed;z-index:70;left:24px;bottom:24px;max-width:400px;padding:18px 18px 16px;border-radius:16px;background:#121412;color:#c9ccc7;font:14px/1.5 Geist,sans-serif;box-shadow:0 24px 60px -20px rgba(0,0,0,.5);animation:wa-in .5s cubic-bezier(.16,1,.3,1)}
.ck p{margin:0}
.ck a{color:#f2f3f1}
.ck div{display:flex;gap:8px;margin-top:14px}
.ck button{flex:1;height:42px;border:0;border-radius:10px;background:#242724;color:#f2f3f1;font:500 14px Geist,sans-serif;cursor:pointer;transition:background-color .2s}
@media (hover:hover) and (pointer:fine){.ck button:hover{background:#2e322e}}
.ck button[data-ck="si"]{background:var(--acc,#4cc282);color:#06140c}
@media (hover:hover) and (pointer:fine){.ck button[data-ck="si"]:hover{filter:brightness(1.06)}}/* ---------- Ordenador estrecho y móvil ---------- */
@media (max-width:1023px){
	.cg-page{width:100%}
	.j-ddp{display:none}
	.pg-hero,.pg-yo{grid-template-columns:1fr!important;gap:32px;padding:28px 20px 56px}
	.pg-h1{font-size:36px}
	.pg-post-h .pg-h1{font-size:32px}
	.pg-lead{font-size:16px}
	.pg-ctas a{width:100%;justify-content:space-between}
	.pg-ctas .j-ghost{justify-content:center}
	.pg-hero-v .v-win{height:240px}
	.pg-foto{width:100%;height:340px;margin:-20px 0 -40px}
	.pg-2c{grid-template-columns:1fr;gap:24px}
	.pg-txt>.v-h2{position:static;font-size:28px!important}
	.pg-txt+.pg-txt{margin-top:48px;padding-top:48px}
	.pg-inc{grid-template-columns:1fr}
	.pg-prosa{font-size:16px}
	.pg-prosa h2{font-size:26px;margin-top:48px}
	.pg-rel{grid-template-columns:1fr;gap:40px}
	.pg-ficha{grid-template-columns:1fr}
	.pg-scroll{height:480px}
	.pg-datos{position:static}
	.pg-posts{grid-template-columns:1fr}
	.pg-post{grid-template-columns:1fr;gap:28px}
	.pg-ind{position:static;padding:18px;border-radius:14px}
	.pg-cta{flex-wrap:wrap;padding:22px}
	.pg-cta .h-btn{margin-left:0;width:100%;justify-content:space-between}
	.pg-resenas{columns:1}
	.psi-l{gap:20px 28px}
	.wa-pop{left:12px;right:12px;bottom:84px;width:auto}
	.ck{left:12px;right:12px;bottom:84px;max-width:none}}/* Escala tipográfica única de la web (7/11/2026): H1 del hero 52/500, entradilla 16, H2 de sección 44/600. Igual que la portada y las páginas de servicio. */
@media (min-width:1024px){.pg-h1{font-size:52px!important;font-weight:500;line-height:1.04}.v-h2{font-size:44px;font-weight:600}}
.pg-lead{font-size:16px;line-height:1.62}
@media (max-width:1023px){.pg-h1{font-size:40px!important}}
.h-cta-h{font-weight:600}
@media (min-width:1024px){.v-band h2{font-size:44px;font-weight:600}}
@media (max-width:1023px){.v-h2,.h-cta-h,.v-band h2{font-weight:600}}