/*
Theme Name: Kader Digitals
Theme URI: https://kaderdigitals.cl
Author: Kader Digitals
Description: Tema a medida para la agencia Kader Digitals (Branding, Video, Paid Ads, Web). Portada de una página con planes y precios, proyectos, guías y formulario de contacto.
Version: 1.6.0
Requires at least: 6.0
Requires PHP: 7.4
License: Propietario
Text Domain: kader
*/
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:80px}
body{margin:0;background:#050505}
.site-header{position:fixed;top:0;left:0;right:0;z-index:50;background:transparent;border-bottom:1px solid transparent;transition:background-color .3s,border-color .3s,backdrop-filter .3s,-webkit-backdrop-filter .3s}
.site-header.is-scrolled{background:rgba(5,5,5,0.48);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom-color:rgba(255,255,255,0.07)}
@media (prefers-reduced-motion:reduce){.site-header{transition:none}}
.admin-bar header.site-header{top:32px}
@media(max-width:782px){.admin-bar header.site-header{top:46px}}
.form-msg{margin:0 0 4px;padding:12px 16px;border-radius:10px;font-size:14px}
.form-ok{border:1px solid #2E7D4F;color:#9BE3B8}
.form-err{border:1px solid #9B3B3B;color:#F0A3A3}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.page-wrap{max-width:820px;margin:0 auto;padding:96px 24px;line-height:1.75;color:#D4D4D4}
.page-wrap h1,.page-wrap h2,.page-wrap h3{color:#fff;letter-spacing:-0.03em}
.page-wrap a{text-decoration:underline}
a{color:inherit}
.serif{font-family:'Instrument Serif',Georgia,serif;font-style:italic;font-weight:400;letter-spacing:-0.01em}
.mono{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:12px;letter-spacing:0.14em;text-transform:uppercase;color:#8A8A8A}
.nav{color:#A1A1A1;text-decoration:none;transition:color .2s}
.nav:hover{color:#fff}
.btn-w{display:inline-block;background:#fff;color:#050505;text-decoration:none;transition:background .2s,transform .2s}
.btn-w:hover{background:#D4D4D4;transform:translateY(-2px)}
.btn-o{display:inline-block;border:1px solid #3A3A3A;color:#fff;text-decoration:none;transition:border-color .2s,background .2s}
.btn-o:hover{border-color:#fff;background:#111}
.card{transition:border-color .3s,transform .3s}
.card:hover{border-color:#666;transform:translateY(-4px)}
.row{transition:background .25s}
.row:hover{background:#0E0E0E}
.arrow{transition:transform .25s}
.row:hover .arrow,.card:hover .arrow{transform:translateX(6px)}
.tab{font-family:inherit;cursor:pointer;background:transparent;color:#A1A1A1;border:1px solid #2A2A2A;padding:10px 20px;font-size:14px;font-weight:500;border-radius:999px;transition:color .2s,border-color .2s,background .2s}
.tab:hover{color:#fff;border-color:#777}
.tab-on{background:#fff;color:#050505;border-color:#fff}
.tab-on:hover{color:#050505;border-color:#fff}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
@keyframes rise{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.25}}
@keyframes scan{0%{transform:translateY(-100%)}100%{transform:translateY(400%)}}
.rise{animation:rise .9s cubic-bezier(.2,.7,.2,1) both}
.d1{animation-delay:.1s}.d2{animation-delay:.25s}.d3{animation-delay:.4s}
.floaty{animation:floaty 7s ease-in-out infinite}
.marq{animation:marquee 40s linear infinite}
.pulse{animation:pulse 2s ease-in-out infinite}
.scan{animation:scan 5s linear infinite}
@keyframes drift{to{background-position:30px 30px}}
@keyframes flow{to{stroke-dashoffset:-480}}
@keyframes beam{0%{top:-2%;opacity:0}10%{opacity:1}90%{opacity:1}100%{top:100%;opacity:0}}
@keyframes ring{0%{transform:scale(1);opacity:0.7}100%{transform:scale(5);opacity:0}}
@keyframes spin{to{transform:rotate(360deg)}}
.drift{animation:drift 14s linear infinite}
.flow{animation:flow 6s linear infinite}
.flow2{animation:flow 9s linear infinite;animation-delay:-3s}
.beam{animation:beam 9s linear infinite}
.ring{transform-box:fill-box;transform-origin:center;animation:ring 3.6s ease-out infinite}
.spin{animation:spin 90s linear infinite}
@keyframes sway{0%{transform:translate(0,0)}50%{transform:translate(22px,-30px)}100%{transform:translate(-14px,18px)}}
@keyframes twirl{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
.sw1{animation:sway 15s ease-in-out infinite alternate}
.sw2{animation:sway 22s ease-in-out infinite alternate-reverse}
.sw3{animation:sway 29s ease-in-out infinite alternate}
.twirl{animation:twirl 40s linear infinite}
@media (prefers-reduced-motion:reduce){.rise,.floaty,.marq,.pulse,.scan,.drift,.flow,.flow2,.beam,.ring,.spin,.sw1,.sw2,.sw3,.twirl{animation:none}}
.gd>summary{list-style:none;cursor:pointer}.gd>summary::-webkit-details-marker{display:none}.gd .gd-arrow{display:inline-block;transition:transform .25s}.gd[open] .gd-arrow{transform:rotate(90deg)}.gd>summary:hover .gd-arrow{opacity:.7}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid #fff;outline-offset:3px}

/* ---------- Blog ---------- */
.entry{font-size:18px;line-height:1.85;color:#C9C9C9}
.entry>*{margin:0 0 1.4em}
.entry h2{margin:2.2em 0 0.7em;font-weight:800;font-size:clamp(26px,3.4vw,36px);line-height:1.12;letter-spacing:-0.03em;color:#fff}
.entry h3{margin:1.8em 0 0.6em;font-weight:700;font-size:24px;line-height:1.2;letter-spacing:-0.02em;color:#fff}
.entry h4{margin:1.6em 0 0.5em;font-weight:700;font-size:19px;color:#fff}
.entry a{color:#fff;text-decoration:underline;text-underline-offset:3px;text-decoration-color:#6E6E6E}
.entry a:hover{text-decoration-color:#fff}
.entry ul,.entry ol{padding-left:1.3em}
.entry li{margin:0 0 0.5em}
.entry li::marker{color:#8A8A8A}
.entry blockquote{margin:2em 0;padding:4px 0 4px 24px;border-left:2px solid #3A3A3A;font-family:'Instrument Serif',Georgia,serif;font-style:italic;font-size:26px;line-height:1.4;color:#E5E5E5}
.entry blockquote p{margin:0}
.entry img,.entry video{max-width:100%;height:auto;border-radius:14px}
.entry figure{margin:2em 0}
.entry figcaption{margin-top:10px;font-size:13px;color:#8A8A8A;text-align:center}
.entry hr{border:0;border-top:1px solid #262626;margin:2.4em 0}
.entry code{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:0.88em;background:#121214;border:1px solid #232327;border-radius:6px;padding:2px 6px}
.entry pre{overflow-x:auto;background:#0A0A0A;border:1px solid #1F1F1F;border-radius:14px;padding:20px}
.entry pre code{background:none;border:0;padding:0}
.entry table{display:block;overflow-x:auto;border-collapse:collapse;font-size:15px}
.entry th,.entry td{border:1px solid #262626;padding:10px 14px;text-align:left}
.entry th{background:#0E0E0E;color:#fff}
.pager{margin-top:56px;display:flex;justify-content:center}
.pager .nav-links{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px}
.pager .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:42px;padding:0 16px;border:1px solid #2A2A2A;border-radius:999px;color:#A1A1A1;text-decoration:none;font-size:14px;font-weight:500;transition:color .2s,border-color .2s}
.pager a.page-numbers:hover{color:#fff;border-color:#777}
.pager .page-numbers.current{background:#fff;color:#050505;border-color:#fff}
.pager .dots{border-color:transparent}
.screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

.socials{list-style:none;margin:20px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.socials a{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid #2A2A2A;border-radius:999px;color:#A1A1A1;transition:color .2s,border-color .2s,background-color .2s}
.socials a:hover,.socials a:focus-visible{color:#050505;background:#fff;border-color:#fff}
@media (min-width:641px){.tabs-row{display:grid !important;grid-template-columns:repeat(4,1fr);gap:10px !important}.tabs-row>.tab{display:flex;align-items:center;justify-content:center;box-sizing:border-box;min-height:52px;padding:10px 14px;text-align:center;line-height:1.25}}
@media (min-width:641px) and (max-width:900px){.tabs-row{grid-template-columns:repeat(2,1fr)}.tabs-row>.tab:last-child:nth-child(odd){grid-column:1/-1}}
.socials a.wa-btn{width:auto;padding:0 22px;gap:8px;font-size:15px;font-weight:500;color:#fff;border-color:#3A3A3A;background:transparent;text-decoration:none;white-space:nowrap}
.socials a.wa-btn:hover,.socials a.wa-btn:focus-visible,.socials a.wa-btn:active{color:#fff;background:linear-gradient(90deg,#15803D,#22C55E);border-color:#22C55E;box-shadow:0 0 22px rgba(34,197,94,0.35)}
.nav-toggle{display:none;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:1px solid #2A2A2A;border-radius:999px;background:rgba(10,10,10,0.6);color:#fff;cursor:pointer}
.site-header:has(.site-nav.is-open){background:rgba(5,5,5,0.97);border-bottom-color:rgba(255,255,255,0.07)}
@media (max-width:860px){
.nav-toggle{display:inline-flex}
.site-nav{display:none !important;flex:0 0 100%;flex-direction:column !important;align-items:stretch !important;flex-wrap:nowrap !important;gap:0 !important;max-height:calc(100vh - 90px);overflow-y:auto;padding-bottom:12px}
.site-nav.is-open{display:flex !important}
.site-nav a{padding:16px 2px;border-top:1px solid #1A1A1A;font-size:15px !important}
}

/* Responsive móvil */
@media (max-width:640px){
section[style*="padding:136px 24px"]{padding-top:84px !important}
div[style*="padding:136px 24px"],div[style*="padding:128px 24px"]{padding-top:84px !important;padding-bottom:84px !important}
section[style*="margin-top:112px"]{margin-top:72px !important}
h2[style*="margin:0 0 80px"],h2[style*="margin:0 0 72px"]{margin-bottom:36px !important}
section#inicio a.btn-w,section#inicio a.btn-o,section#servicios a.btn-o{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:100%;text-align:center}
article.card{padding:24px !important;min-height:0 !important;gap:22px !important}
article.card h3{font-size:28px !important}
article.card h3 .serif{font-size:31px !important}
.tabs-row{display:grid !important;grid-template-columns:1fr 1fr;gap:10px !important}
.tabs-row>.tab{display:flex;align-items:center;justify-content:center;box-sizing:border-box;min-height:52px;padding:10px 12px;text-align:center;line-height:1.25}
.tabs-row>.tab:last-child:nth-child(odd){grid-column:1/-1}
.plat-box{padding:22px 20px !important;gap:16px !important}
.plat-list{display:flex !important;flex-direction:column;align-items:flex-start !important;gap:14px !important;width:100%}
.plat-list>.plat-sep{display:none !important}
.plat-list>span{display:block;font-size:26px !important;line-height:1.1;white-space:nowrap}
.step{flex-basis:100% !important;padding:26px 0 30px !important;border-right:0 !important;border-bottom:1px solid #1A1A1A}
.step>.mono{margin-bottom:18px !important}
summary.row{gap:16px !important;padding:24px 4px !important}
summary.row>span:first-child{gap:10px 16px !important}
.gd-arrow{flex:0 0 auto}
.gd-body{margin-left:0 !important;padding:0 4px 28px !important}
}

/* v1.7: botón Cotizar del menú y páginas de campaña */
.site-nav a.nav-cta{display:inline-block}
@media (max-width:860px){.site-nav a.nav-cta{margin:16px 0 8px;padding:15px 20px !important;border-top:0 !important;font-size:14px !important}}

/* Botón de WhatsApp: contorno y, al pasar el cursor o presionar, verde */
.btn-wa{display:inline-flex;align-items:center;justify-content:center;gap:8px;box-sizing:border-box;border:1px solid #3A3A3A;color:#fff;background:transparent;text-decoration:none;white-space:nowrap;transition:background .2s,border-color .2s,box-shadow .2s,transform .2s}
.btn-wa:hover,.btn-wa:focus-visible,.btn-wa:active{color:#fff;background:linear-gradient(90deg,#15803D,#22C55E);border-color:#22C55E;box-shadow:0 0 22px rgba(34,197,94,0.35)}
@media (max-width:640px){.btn-wa{white-space:normal;text-align:center}}

a.tab{text-decoration:none}
