/* ============== CENSSURE - STYLES ============== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}

:root{
  --bg:#FAFAF7;
  --bg-soft:#F1F1EC;
  --bg-deep:#E8E8E1;
  --ink:#0A0A0A;
  --ink-soft:#1C1C1A;
  --muted:#666660;
  --muted-soft:#9A9A92;
  --accent:#D8FF00;
  --accent-deep:#BFEB00;
  --rule:rgba(10,10,10,.09);
  --rule-strong:rgba(10,10,10,.22);
  --font-display:"Space Grotesk",-apple-system,system-ui,sans-serif;
  --font-body:"Inter",-apple-system,system-ui,sans-serif;
  --gutter:clamp(1.25rem,3vw,2.5rem);
  --maxw:1200px;
}

body{
  font-family:var(--font-body);
  background:var(--bg);
  color:var(--ink);
  line-height:1.55;
  font-size:16.5px;
  overflow-x:hidden;
}
::selection{background:var(--accent);color:var(--ink)}

h1,h2,h3,h4{
  font-family:var(--font-display);
  color:var(--ink);
  letter-spacing:-.025em;
  line-height:1;
  font-weight:500;
}
h2{font-size:clamp(2.2rem,5vw,4.6rem);letter-spacing:-.035em;line-height:.98}
h3{font-size:clamp(1.4rem,2.1vw,1.85rem);letter-spacing:-.02em}

.eyebrow{
  font-family:var(--font-body);
  font-size:.82rem;letter-spacing:.04em;color:var(--muted);
  display:inline-flex;align-items:center;gap:.55rem;font-weight:500;
}
.eyebrow::before{
  content:"";width:.4rem;height:.4rem;background:var(--accent);
  display:inline-block;border-radius:50%;
}

.container{
  width:100%;max-width:var(--maxw);margin:0 auto;
  padding-left:var(--gutter);padding-right:var(--gutter);
  position:relative;
}
section{padding:clamp(5rem,10vw,9rem) 0;position:relative}
.section-header{max-width:60rem;margin-bottom:clamp(3rem,6vw,5rem)}
.section-header h2{margin:1rem 0 1.25rem}
.section-header p{
  font-size:clamp(1.05rem,1.2vw,1.18rem);
  color:var(--ink-soft);max-width:42rem;line-height:1.55;
}

/* ============== HEADER ============== */
.site-header{
  position:sticky;top:0;z-index:100;
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  background:rgba(250,250,247,.85);
  border-bottom:1px solid var(--rule);
}
.nav-inner{
  display:flex;align-items:center;justify-content:space-between;
  padding:1rem 0;gap:2rem;
}
.brand{
  display:inline-flex;align-items:center;text-decoration:none;
  color:var(--ink);height:32px;
}
.brand img{height:100%;width:auto;display:block}

.nav{display:flex;gap:2.2rem;align-items:center}
.nav a{
  font-size:.92rem;color:var(--ink-soft);text-decoration:none;
  font-weight:500;position:relative;padding:.35rem 0;transition:color .2s;
}
.nav a:not(.nav-cta)::after{
  content:"";position:absolute;bottom:-2px;left:0;width:0;height:2px;
  background:var(--accent);transition:width .3s cubic-bezier(.4,0,.2,1);
}
.nav a:not(.nav-cta):hover{color:var(--ink)}
.nav a:not(.nav-cta):hover::after{width:100%}
.nav a.active::after{width:100%}
.nav-cta{
  background:var(--ink);color:var(--bg)!important;
  padding:.58rem 1.15rem!important;border-radius:100px;
  font-weight:500;transition:all .2s;font-size:.88rem!important;
}
.nav-cta:hover{background:var(--accent);color:var(--ink)!important;transform:translateY(-1px)}
.nav-cta::after{display:none!important}
.burger{display:none;background:none;border:none;cursor:pointer;padding:.5rem;flex-direction:column;gap:5px}
.burger span{display:block;width:22px;height:2px;background:var(--ink)}

@media(max-width:820px){
  .nav{display:none}
  .nav.open{
    display:flex;flex-direction:column;
    position:absolute;top:100%;left:0;right:0;
    background:var(--bg);padding:1.5rem var(--gutter);gap:1rem;
    border-bottom:1px solid var(--rule);
  }
  .burger{display:flex}
}

/* ============== TACHADURA + HIGHLIGHT ============== */
.strike{
  display:inline;color:var(--muted);
  text-decoration-line:line-through;text-decoration-color:transparent;
  text-decoration-thickness:.07em;text-decoration-skip-ink:none;
  -webkit-text-decoration-line:line-through;
  -webkit-text-decoration-color:transparent;
  -webkit-text-decoration-thickness:.07em;
  -webkit-text-decoration-skip-ink:none;
  transition:text-decoration-color .55s cubic-bezier(.5,0,.1,1),color .3s;
}
.strike.done{text-decoration-color:var(--ink);-webkit-text-decoration-color:var(--ink)}

.authorize{
  display:inline;
  background-image:linear-gradient(transparent 62%,var(--accent) 62%);
  background-size:0% 100%;background-repeat:no-repeat;
  background-position:left center;padding:0 .08em;
  transition:background-size .7s cubic-bezier(.5,0,.1,1);
  font-weight:600;color:var(--ink);
  -webkit-box-decoration-break:clone;box-decoration-break:clone;
}
.authorize.done{background-size:100% 100%}

.hi{background:var(--accent);padding:0 .15em;font-weight:600;color:var(--ink)}

/* ============== HERO ============== */
.hero{padding-top:clamp(4rem,9vw,8rem);padding-bottom:clamp(4rem,8vw,7rem);position:relative}
.hero-inner{display:flex;flex-direction:column;gap:1.5rem;max-width:56rem;margin:0 auto;position:relative}
@media(min-width:640px){.hero-inner{gap:2rem}}

.hero-tag{
  display:inline-flex;align-items:center;gap:.55rem;
  font-size:.9rem;color:var(--muted);margin-bottom:1rem;font-weight:500;
}
.hero-tag::before{
  content:"";width:.45rem;height:.45rem;border-radius:50%;
  background:#19C37D;
  box-shadow:0 0 0 3px rgba(25,195,125,.18);
  animation:pulse 2.4s infinite;
}
@keyframes pulse{
  0%,100%{box-shadow:0 0 0 3px rgba(25,195,125,.18)}
  50%{box-shadow:0 0 0 6px rgba(25,195,125,.06)}
}

.hero-eslogan{
  font-family:var(--font-display);font-weight:600;
  font-size:clamp(1.05rem,1.55vw,1.4rem);
  color:var(--ink);margin-bottom:1.75rem;
  letter-spacing:-.015em;line-height:1.3;
  display:inline-flex;align-items:center;
  padding:.75rem 1.4rem;
  background:var(--accent);
  border-radius:100px;
  max-width:fit-content;
  box-shadow:0 6px 24px -8px rgba(216,255,0,.7), 0 0 0 1px rgba(10,10,10,.06);
  position:relative;
  transition:transform .3s ease;
}
.hero-eslogan:hover{transform:translateY(-2px)}

.hero-title{
  font-size:clamp(2.4rem,7.5vw,7rem);font-weight:500;line-height:1;
  letter-spacing:-.03em;margin-bottom:1.75rem;font-family:var(--font-display);
}
.hero-title-simple{
  font-family:var(--font-display);font-weight:500;
  font-size:clamp(2.8rem,8vw,7.5rem);line-height:.95;
  letter-spacing:-.04em;margin-bottom:1.75rem;
}

/* ============== MANIFIESTO HERO (sección con copy animado) ============== */
.manifesto-hero{
  background:var(--bg-soft);
  padding:clamp(5rem,10vw,9rem) 0;
  border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule);
}
.manifest-statement{max-width:72rem;margin:0 auto}
.manifest-pre{
  font-family:var(--font-display);font-weight:500;
  font-size:clamp(.95rem,1.3vw,1.15rem);
  color:var(--muted);margin-bottom:2rem;letter-spacing:.02em;
  text-transform:uppercase;
  display:flex;align-items:center;gap:.75rem;
}
.manifest-pre::before{
  content:"";width:2rem;height:1px;background:var(--ink);
}

/* Section header limpio sin eyebrow */
.section-header-clean h2{margin-top:0!important}
.section-center{text-align:center;margin-left:auto;margin-right:auto;max-width:48rem}
.section-center h2{margin-left:auto;margin-right:auto}
.section-center p{margin-left:auto;margin-right:auto}

/* HERO centrado (desktop + mobile) */
.hero-inner{align-items:center;text-align:center;margin-left:auto;margin-right:auto}
.hero-inner .hero-eslogan{margin-left:auto;margin-right:auto}
.hero-inner .hero-title-simple{margin-left:auto;margin-right:auto;text-align:center}
.hero-inner .hero-sub{margin-left:auto;margin-right:auto;text-align:center}
.hero-inner .hero-ctas{justify-content:center}
.hero-inner .proof-strip{justify-content:center;margin-left:auto;margin-right:auto;width:100%}
.hero-title .line{display:block}
.hero-title .kept{display:block;margin-top:.3em;font-weight:600}
@media(min-width:640px){.hero-title{line-height:.95;letter-spacing:-.04em}}

.hero-sub{
  font-size:clamp(1.1rem,1.4vw,1.35rem);
  color:var(--ink-soft);max-width:42rem;line-height:1.5;
  margin-bottom:2.5rem;font-weight:400;
}
.hero-ctas{display:flex;gap:.85rem;flex-wrap:wrap;align-items:center}

.proof-strip{
  margin-top:3.5rem;padding:1.25rem 0;
  border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
  display:flex;flex-wrap:wrap;gap:1rem 3rem;align-items:center;
  font-size:.85rem;color:var(--muted);
}
.proof-strip strong{color:var(--ink);font-weight:600;font-family:var(--font-display)}
.proof-strip .item{display:flex;align-items:center;gap:.6rem}

/* ============== BOTONES ============== */
.btn{
  display:inline-flex;align-items:center;gap:.5rem;
  padding:.95rem 1.5rem;border-radius:100px;
  font-size:.95rem;font-weight:500;text-decoration:none;
  transition:all .25s ease;cursor:pointer;border:none;
  font-family:inherit;
}
.btn-primary{background:var(--ink);color:var(--bg)}
.btn-primary:hover{background:var(--accent);color:var(--ink);transform:translateY(-2px);box-shadow:0 10px 30px -10px rgba(216,255,0,.5)}
.btn-ghost{background:transparent;color:var(--ink);border:1.5px solid var(--ink)}
.btn-ghost:hover{background:var(--ink);color:var(--bg)}
.btn .arrow{transition:transform .25s}
.btn:hover .arrow{transform:translateX(4px)}
.underline{position:relative}
.underline::after{
  content:"";position:absolute;bottom:-2px;left:0;width:100%;height:1.5px;
  background:currentColor;transform:scaleX(0);transform-origin:left;
  transition:transform .3s;
}
.btn-ghost:hover .underline::after{transform:scaleX(1)}

/* ============== MARQUEE (con logos) ============== */
.marquee{
  width:100%;overflow:hidden;background:var(--ink);
  padding:1rem 0;position:relative;
  border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);
}
.marquee::before,.marquee::after{
  content:"";position:absolute;top:0;bottom:0;width:80px;z-index:2;pointer-events:none;
}
.marquee::before{left:0;background:linear-gradient(to right,var(--ink),transparent)}
.marquee::after{right:0;background:linear-gradient(to left,var(--ink),transparent)}
.marquee-track{
  display:flex;animation:marquee 32s linear infinite;width:max-content;
  align-items:center;
}
.marquee-group{display:flex;align-items:center;gap:2.5rem;padding-right:2.5rem}
.marquee-group img{height:42px;width:auto;display:block;
  /* invertir a blanco para fondo oscuro */
  filter:invert(1) brightness(1.2);
}
.marquee-group .m-sym{height:48px}
@keyframes marquee{to{transform:translateX(-50%)}}

/* ============== SERVICIOS ============== */
.services-grid{
  display:grid;grid-template-columns:repeat(2,1fr);
  gap:1px;background:var(--rule);border:1px solid var(--rule);
  border-radius:14px;overflow:hidden;
}
@media(max-width:780px){.services-grid{grid-template-columns:1fr 1fr}}
.service{
  background:var(--bg);padding:clamp(1.8rem,3vw,2.5rem);
  position:relative;transition:background .3s, transform .3s;cursor:default;
  display:flex;flex-direction:column;
}
.service::before{
  content:"";position:absolute;top:0;left:0;right:0;height:3px;
  background:var(--accent);transform:scaleX(0);transform-origin:left;
  transition:transform .4s cubic-bezier(.4,0,.2,1);
}
.service:hover::before{transform:scaleX(1)}
.service:hover{background:linear-gradient(180deg,#FCFCE8 0%, var(--bg) 100%)}
.service-head{
  display:flex;justify-content:space-between;align-items:center;
  margin-bottom:1.75rem;
}
.service-num{
  font-family:var(--font-display);font-weight:600;
  font-size:.85rem;color:var(--muted);letter-spacing:.05em;
  padding:.3rem .7rem;background:var(--bg-soft);border-radius:100px;
  transition:all .3s;
}
.service:hover .service-num{background:var(--accent);color:var(--ink)}
.service-arrow{
  font-size:1.2rem;color:var(--muted);transition:all .3s;
  width:2.2rem;height:2.2rem;display:inline-flex;align-items:center;justify-content:center;
  border-radius:50%;background:var(--bg-soft);
}
.service:hover .service-arrow{color:var(--ink);background:var(--accent);transform:translate(2px,-2px)}
.service h3{margin-bottom:.4rem;letter-spacing:-.02em}
.service-tagline{
  font-size:1rem;color:var(--muted);margin-bottom:1rem;font-style:italic;
}
.service-desc{font-size:.95rem;color:var(--ink-soft);margin-bottom:1.5rem;line-height:1.6;flex:1}
.service-desc strong{color:var(--ink);font-weight:600}
.service-tags{list-style:none;display:flex;flex-wrap:wrap;gap:.4rem}
.service-tags li{
  font-size:.74rem;padding:.3rem .65rem;
  background:var(--bg-soft);border:1px solid var(--rule);
  border-radius:100px;color:var(--ink-soft);font-weight:500;
  transition:all .25s;
}
.service:hover .service-tags li{background:#fff;border-color:rgba(216,255,0,.4)}

/* ============== MANIFIESTO (nuevo - bien estructurado) ============== */
.manifesto{background:var(--ink);color:var(--bg)}
.manifesto h2,.manifesto h3,.manifesto h4{color:var(--bg)}
.manifesto .eyebrow{color:rgba(250,250,247,.6)}
.manifesto .section-header p{color:rgba(250,250,247,.7)}

.manifest-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:1px;
  background:rgba(250,250,247,.12);
  border:1px solid rgba(250,250,247,.12);border-radius:12px;overflow:hidden;
}
@media(max-width:780px){.manifest-grid{grid-template-columns:1fr}}
.manifest-col{background:var(--ink);padding:clamp(1.75rem,3.5vw,2.75rem)}

.manifest-head{
  display:flex;align-items:center;justify-content:space-between;
  padding-bottom:1.5rem;margin-bottom:1.75rem;
  border-bottom:1px solid rgba(250,250,247,.12);
}
.manifest-label{
  font-family:var(--font-display);font-weight:600;
  font-size:1.4rem;letter-spacing:-.02em;
  display:flex;align-items:center;gap:.65rem;
}
.manifest-col.cut .manifest-label{color:rgba(250,250,247,.55)}
.manifest-col.keep .manifest-label{color:var(--accent)}
.manifest-icon{
  display:inline-flex;align-items:center;justify-content:center;
  width:2rem;height:2rem;border-radius:50%;
  font-size:1.2rem;font-weight:700;
}
.manifest-col.cut .manifest-icon{background:rgba(250,250,247,.08);color:rgba(250,250,247,.55)}
.manifest-col.keep .manifest-icon{background:var(--accent);color:var(--ink)}
.manifest-count{
  font-family:var(--font-display);font-size:.8rem;
  color:rgba(250,250,247,.4);letter-spacing:.05em;
}

.manifest-list{list-style:none;display:flex;flex-direction:column;gap:0}
.manifest-list li{
  padding:1rem 0;
  border-bottom:1px solid rgba(250,250,247,.08);
  display:flex;align-items:flex-start;gap:.85rem;
  font-size:1.02rem;line-height:1.45;
}
.manifest-list li:last-child{border-bottom:none;padding-bottom:0}
.manifest-list li:first-child{padding-top:0}

.manifest-col.cut .manifest-list li{color:rgba(250,250,247,.6)}
.manifest-col.cut .manifest-list .item-text{
  text-decoration:line-through;text-decoration-thickness:1.5px;
  text-decoration-color:rgba(250,250,247,.35);
}
.manifest-col.keep .manifest-list li{color:var(--bg)}

.manifest-bullet{
  flex-shrink:0;width:1.3rem;height:1.3rem;margin-top:.1rem;
  display:inline-flex;align-items:center;justify-content:center;
  font-size:.7rem;font-weight:700;border-radius:50%;
}
.manifest-col.cut .manifest-bullet{
  background:rgba(250,250,247,.08);color:rgba(250,250,247,.5);
}
.manifest-col.keep .manifest-bullet{
  background:var(--accent);color:var(--ink);
}

.manifest-list .item-text{flex:1;font-weight:500;font-family:var(--font-display);font-size:1.05rem}
.manifest-list .item-desc{display:block;font-family:var(--font-body);font-weight:400;font-size:.88rem;margin-top:.25rem;line-height:1.5}
.manifest-col.cut .item-desc{color:rgba(250,250,247,.4);text-decoration:none}
.manifest-col.keep .item-desc{color:rgba(250,250,247,.65)}

/* ============== MÉTODO ============== */
.method-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2rem}
@media(max-width:900px){.method-grid{grid-template-columns:1fr 1fr;gap:2rem 1.5rem}}
@media(max-width:520px){.method-grid{grid-template-columns:1fr}}
.method-step{position:relative;padding-top:1.5rem}
.method-step::before{
  content:"";position:absolute;top:0;left:0;width:2.5rem;height:2px;background:var(--accent);
}
.method-num{
  font-family:var(--font-display);font-weight:500;
  font-size:.85rem;color:var(--accent-deep);margin-bottom:.5rem;letter-spacing:.05em;
}
.method-step h4{font-size:1.3rem;margin-bottom:.6rem;letter-spacing:-.02em}
.method-step p{font-size:.92rem;color:var(--muted);line-height:1.6}

/* ============== FAQ ============== */
.faq-list{display:flex;flex-direction:column;gap:.4rem;max-width:36rem;margin:0 auto}
.faq-item{
  border:1px solid var(--rule);border-radius:8px;
  background:var(--bg);transition:border-color .25s;
}
.faq-item[open]{border-color:var(--rule-strong);background:var(--bg-soft)}
.faq-item summary{
  list-style:none;cursor:pointer;padding:.85rem 1rem;
  display:flex;justify-content:space-between;align-items:center;
  font-family:var(--font-display);font-weight:500;font-size:.92rem;
  letter-spacing:-.005em;gap:1rem;line-height:1.35;
}
.faq-item summary::-webkit-details-marker{display:none}
.plus{
  display:inline-block;width:.9rem;height:.9rem;position:relative;flex-shrink:0;
}
.plus::before,.plus::after{
  content:"";position:absolute;background:var(--ink);
  left:50%;top:50%;transform:translate(-50%,-50%);
}
.plus::before{width:.9rem;height:1.3px}
.plus::after{width:1.3px;height:.9rem;transition:transform .25s}
.faq-item[open] .plus::after{transform:translate(-50%,-50%) rotate(90deg)}
.faq-answer{padding:0 1rem 1rem;font-size:.88rem;color:var(--ink-soft);line-height:1.55}

/* ============== BLOG (listado e individual) ============== */
.blog-hero{padding-top:clamp(3rem,7vw,6rem);padding-bottom:clamp(2rem,4vw,4rem)}
.blog-hero h1{
  font-family:var(--font-display);font-weight:500;
  font-size:clamp(2.5rem,6vw,5rem);letter-spacing:-.03em;
  line-height:1;margin:1rem 0 1.25rem;
}
.blog-hero p{font-size:clamp(1.05rem,1.2vw,1.18rem);color:var(--ink-soft);max-width:42rem}

.blog-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;
}
@media(max-width:900px){.blog-grid{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.blog-grid{grid-template-columns:1fr}}

.blog-card{
  background:var(--bg);border:1px solid var(--rule);
  border-radius:14px;overflow:hidden;text-decoration:none;
  color:var(--ink);transition:all .3s;display:flex;flex-direction:column;
}
.blog-card:hover{border-color:var(--rule-strong);transform:translateY(-4px);box-shadow:0 20px 40px -25px rgba(0,0,0,.12)}
.blog-card-cover{
  aspect-ratio:21/9;background:var(--bg-soft);
  display:flex;align-items:center;justify-content:center;
  position:relative;overflow:hidden;
}
.blog-card-cover::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(135deg,var(--bg-soft) 0%,var(--bg-deep) 100%);
}
.blog-card-cover .cover-tag{
  position:relative;z-index:2;
  font-family:var(--font-display);font-weight:600;
  font-size:.85rem;letter-spacing:.08em;text-transform:uppercase;
  padding:.4rem .9rem;background:var(--ink);color:var(--bg);border-radius:100px;
}
.blog-card-body{padding:1.5rem;display:flex;flex-direction:column;gap:.75rem;flex:1}
.blog-card-meta{
  display:flex;justify-content:space-between;align-items:center;
  font-size:.78rem;color:var(--muted);letter-spacing:.04em;
}
.blog-card-meta .cat{text-transform:uppercase;font-weight:600;color:var(--ink)}
.blog-card h3{
  font-size:1.25rem;letter-spacing:-.02em;line-height:1.2;
  margin-bottom:.25rem;
}
.blog-card-excerpt{font-size:.92rem;color:var(--ink-soft);line-height:1.55;flex:1}
.blog-card-foot{
  margin-top:.5rem;font-family:var(--font-display);font-size:.88rem;
  font-weight:500;color:var(--ink);display:flex;align-items:center;gap:.4rem;
}
.blog-card:hover .blog-card-foot{color:var(--ink)}
.blog-card:hover .blog-card-foot .arrow{transform:translateX(4px)}
.blog-card-foot .arrow{transition:transform .25s}

/* Post individual */
.post-hero{padding:clamp(3rem,7vw,6rem) 0 clamp(2rem,4vw,3rem)}
.post-back{
  font-size:.85rem;color:var(--muted);text-decoration:none;
  display:inline-flex;align-items:center;gap:.4rem;margin-bottom:1.5rem;
  transition:color .2s;
}
.post-back:hover{color:var(--ink)}
.post-meta{
  display:flex;gap:1.5rem;align-items:center;flex-wrap:wrap;
  font-size:.85rem;color:var(--muted);margin-bottom:1.25rem;
}
.post-meta .cat{font-weight:600;color:var(--ink);text-transform:uppercase;letter-spacing:.05em}
.post-meta .dot-sep{width:3px;height:3px;background:var(--muted-soft);border-radius:50%}

.post-title{
  font-family:var(--font-display);font-weight:500;
  font-size:clamp(2rem,5vw,4rem);letter-spacing:-.03em;
  line-height:1;margin-bottom:1.5rem;max-width:50rem;
}
.post-lead{
  font-size:clamp(1.1rem,1.4vw,1.35rem);
  color:var(--ink-soft);line-height:1.5;max-width:44rem;
}

.post-cover{
  aspect-ratio:21/9;background:var(--bg-soft);
  border-radius:14px;margin:0 auto clamp(2rem,4vw,3.5rem);
  max-width:var(--maxw);overflow:hidden;
  display:flex;align-items:center;justify-content:center;
  position:relative;
}
.post-cover::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(135deg,var(--bg-soft) 0%,var(--bg-deep) 100%);
}
.post-cover .cover-label{
  position:relative;z-index:2;font-family:var(--font-display);
  font-weight:600;font-size:1rem;color:var(--ink);letter-spacing:.05em;
  padding:.5rem 1.2rem;background:var(--accent);border-radius:100px;
}

.post-content{
  max-width:42rem;margin:0 auto;padding-bottom:clamp(4rem,8vw,7rem);
}
.post-content h2{font-size:clamp(1.6rem,3vw,2.2rem);margin:2.5rem 0 1rem;letter-spacing:-.025em}
.post-content h3{font-size:clamp(1.3rem,2.2vw,1.6rem);margin:2rem 0 .85rem}
.post-content p{margin-bottom:1.2rem;font-size:1.05rem;line-height:1.7;color:var(--ink-soft)}
.post-content ul,.post-content ol{margin:0 0 1.2rem 1.5rem;color:var(--ink-soft)}
.post-content li{margin-bottom:.5rem;line-height:1.6}
.post-content a{color:var(--ink);font-weight:500;text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:3px}
.post-content blockquote{
  border-left:3px solid var(--accent);padding:.5rem 0 .5rem 1.5rem;
  margin:1.5rem 0;font-style:italic;color:var(--ink-soft);
  font-size:1.1rem;
}
.post-content code{
  background:var(--bg-soft);padding:.15rem .4rem;border-radius:4px;
  font-family:"JetBrains Mono",monospace;font-size:.9em;
}

/* ============== CONTACTO ============== */
.contact-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(2.5rem,5vw,5rem);align-items:start}
@media(max-width:900px){.contact-grid{grid-template-columns:1fr}}
.contact-intro h2{margin:1rem 0 1.5rem}
.contact-intro p{font-size:1.05rem;color:var(--ink-soft);line-height:1.6}
.contact-direct{margin-top:2rem;padding-top:1.5rem;border-top:1px solid var(--rule)}
.contact-direct-label{
  display:block;font-size:.78rem;color:var(--muted);
  letter-spacing:.05em;text-transform:uppercase;margin-bottom:.5rem;
}
.contact-direct a{
  font-family:var(--font-display);font-weight:500;font-size:1.4rem;
  color:var(--ink);text-decoration:none;letter-spacing:-.02em;border-bottom:2px solid var(--accent);
}

.contact-form{
  background:var(--bg-soft);border:1px solid var(--rule);
  border-radius:14px;padding:clamp(1.75rem,3vw,2.5rem);
  display:flex;flex-direction:column;gap:1.1rem;
}
.form-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}
@media(max-width:540px){.form-grid-2{grid-template-columns:1fr}}
.form-label{display:flex;flex-direction:column;gap:.4rem}
.form-label span{font-size:.78rem;color:var(--muted);letter-spacing:.05em;text-transform:uppercase;font-weight:500}
.form-label input,.form-label select,.form-label textarea{
  font-family:inherit;font-size:.95rem;color:var(--ink);
  padding:.85rem 1rem;background:var(--bg);
  border:1px solid var(--rule);border-radius:8px;transition:border-color .2s;
  width:100%;
}
.form-label input:focus,.form-label select:focus,.form-label textarea:focus{
  outline:none;border-color:var(--ink);
}
.form-label textarea{min-height:110px;resize:vertical;font-family:inherit}
.contact-form button{
  background:var(--ink);color:var(--bg);
  border:none;padding:1rem 1.5rem;border-radius:100px;
  font-family:inherit;font-size:.95rem;font-weight:500;cursor:pointer;
  transition:all .25s;align-self:flex-start;margin-top:.5rem;
}
.contact-form button:hover{background:var(--accent);color:var(--ink);transform:translateY(-2px)}
.form-status{font-size:.85rem;color:var(--muted);margin-top:.5rem}
.form-status.success{color:#19C37D}
.form-status.error{color:#E5484D}

/* ============== FOOTER ============== */
footer{background:var(--ink);color:rgba(250,250,247,.6);padding:4rem 0 2rem}
.footer-top{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:2rem;padding-bottom:3rem;border-bottom:1px solid rgba(250,250,247,.12)}
.footer-brand{max-width:24rem}
.footer-brand .brand{filter:invert(1) brightness(1.2);margin-bottom:1.25rem;height:36px}
.footer-tagline{font-family:var(--font-display);font-size:1.4rem;line-height:1.25;color:var(--bg);letter-spacing:-.02em}
.footer-tagline .hi{background:var(--accent);color:var(--ink)}

.footer-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;padding-top:3rem}
@media(max-width:680px){.footer-grid{grid-template-columns:1fr 1fr}}
.footer-col{display:flex;flex-direction:column;gap:.6rem}
.footer-col .label{font-size:.75rem;color:rgba(250,250,247,.4);text-transform:uppercase;letter-spacing:.08em;margin-bottom:.5rem;font-weight:500}
.footer-col a{color:rgba(250,250,247,.7);text-decoration:none;font-size:.92rem;transition:color .2s}
.footer-col a:hover{color:var(--accent)}
.footer-col p{font-size:.85rem;color:rgba(250,250,247,.5)}

.footer-bottom{
  padding-top:2rem;margin-top:3rem;border-top:1px solid rgba(250,250,247,.08);
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem;
  font-size:.8rem;color:rgba(250,250,247,.4);
}
.footer-bottom a{color:rgba(250,250,247,.4);text-decoration:none;margin-right:1rem}
.footer-bottom a:hover{color:var(--accent)}

/* ============== WHATSAPP FLOATING ============== */
.wa-float{
  position:fixed;bottom:1.5rem;right:1.5rem;z-index:99;
  width:58px;height:58px;background:#25D366;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 8px 24px rgba(37,211,102,.4);text-decoration:none;
  transition:transform .25s;
}
.wa-float:hover{transform:scale(1.08)}
.wa-float svg{width:30px;height:30px;color:#fff}
.wa-float::before{
  content:"";position:absolute;inset:0;border-radius:50%;background:#25D366;
  animation:waRipple 2.4s infinite;z-index:-1;
}
@keyframes waRipple{
  0%{transform:scale(1);opacity:.5}
  100%{transform:scale(1.7);opacity:0}
}
.wa-tooltip{
  position:absolute;right:72px;top:50%;transform:translateY(-50%);
  background:var(--ink);color:var(--bg);
  padding:.55rem .9rem;border-radius:8px;
  font-size:.82rem;white-space:nowrap;
  opacity:0;pointer-events:none;transition:opacity .25s;
}
.wa-float:hover .wa-tooltip{opacity:1}
@media(max-width:520px){.wa-float{bottom:1rem;right:1rem;width:54px;height:54px}.wa-float svg{width:26px;height:26px}}

/* ============== REVEAL ============== */
[data-reveal]{opacity:0;transform:translateY(20px);transition:opacity .8s ease,transform .8s ease}
[data-reveal].in{opacity:1;transform:translateY(0)}
@media (prefers-reduced-motion:reduce){
  [data-reveal]{opacity:1;transform:none;transition:none}
  .marquee-track,.wa-float::before{animation:none}
}

/* ============== MOBILE OPTIMIZATIONS ============== */
@media(max-width:780px){
  body{font-size:15.5px}
  section{padding:clamp(3rem,7vw,4.5rem) 0}
  .container{padding-left:1.1rem;padding-right:1.1rem}
  h2{font-size:clamp(1.85rem,7vw,2.4rem)!important;line-height:1.05!important}

  /* ===== Hero ===== */
  .hero{padding-top:2.25rem;padding-bottom:2.5rem}
  .hero-inner{
    gap:1.1rem;
    align-items:center!important;text-align:center!important;
  }
  .hero-inner .hero-eslogan{margin-left:auto!important;margin-right:auto!important}
  .hero-inner .hero-title-simple{margin-left:auto!important;margin-right:auto!important;text-align:center!important}
  .hero-inner .hero-sub{margin-left:auto!important;margin-right:auto!important;text-align:center!important}
  .hero-inner .hero-ctas{justify-content:center!important}
  .hero-inner .proof-strip{justify-content:center!important}
  .hero-eslogan{
    font-size:.95rem;padding:.6rem 1.1rem .6rem .85rem;
    margin-bottom:1.25rem;
    line-height:1.3;letter-spacing:-.01em;font-weight:700;
  }
  .hero-eslogan::before{width:.45rem;height:.45rem}
  .hero-title-simple{
    font-size:clamp(2.4rem,10.5vw,3.5rem);
    line-height:.98;margin-bottom:1.1rem;
  }
  .hero-sub{font-size:.98rem;margin-bottom:1.5rem;line-height:1.55}
  .hero-ctas{width:100%;justify-content:center}
  .hero-ctas .btn{flex:1;justify-content:center;padding:.85rem 1rem;font-size:.9rem}

  /* Proof strip más compacto en mobile */
  .proof-strip{
    margin-top:1.75rem;padding:.85rem 0;gap:.5rem 1.25rem;
    flex-direction:row;flex-wrap:wrap;justify-content:center;
    font-size:.78rem;
  }
  .proof-strip .item{width:auto}

  /* ===== Marquee más fino en mobile ===== */
  .marquee{padding:.45rem 0;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink)}
  .marquee::before,.marquee::after{width:40px}
  .marquee-group img{height:22px}
  .marquee-group .m-sym{height:26px}
  .marquee-group{gap:1.1rem;padding-right:1.1rem}

  /* ===== Servicios en mobile: 2x2 con color ===== */
  .services-grid{grid-template-columns:1fr 1fr;border-radius:14px;gap:1px;background:var(--rule)}
  .service{
    padding:1rem .85rem;
    display:flex;flex-direction:column;
    background:var(--bg);
    min-height:auto;
    text-align:center;
    align-items:center;
  }
  .service:nth-child(1){background:linear-gradient(135deg,#FCFCE8 0%, var(--bg) 70%);border-top:2px solid var(--accent)}
  .service:nth-child(2){background:linear-gradient(135deg,#EAF7FF 0%, var(--bg) 70%);border-top:2px solid #5EBFFF}
  .service:nth-child(3){background:linear-gradient(135deg,#F5EAFF 0%, var(--bg) 70%);border-top:2px solid #B083FF}
  .service:nth-child(4){background:linear-gradient(135deg,#FFF1E0 0%, var(--bg) 70%);border-top:2px solid #FFA94D}
  .service::before{display:none}
  .service-head{margin-bottom:.55rem;width:100%;justify-content:center;gap:.6rem}
  .service-num{
    font-size:.65rem;padding:.18rem .5rem;
    background:rgba(255,255,255,.85);font-weight:600;
  }
  .service-arrow{display:none}
  .service h3{font-size:.92rem;margin-bottom:.25rem;letter-spacing:-.015em;line-height:1.2;text-align:center}
  .service-tagline{font-size:.72rem;margin-bottom:.45rem;line-height:1.35;color:var(--muted);font-style:italic;text-align:center}
  .service-desc{
    font-size:.72rem;margin-bottom:.6rem;line-height:1.45;color:var(--ink-soft);text-align:center;
  }
  .service-desc strong{font-weight:600;color:var(--ink)}
  .service-tags{gap:.2rem;margin-top:auto;padding-top:.2rem;justify-content:center}
  .service-tags li{
    font-size:.58rem;padding:.15rem .4rem;
    background:rgba(255,255,255,.85);border:none;color:var(--ink-soft);font-weight:500;
  }
  /* Mostrar solo 2 tags por card para que quepa */
  .service-tags li:nth-child(n+3){display:none}

  /* Sección "Cómo trabajamos" más compacta en mobile (era 2 cols, mantener) */
  .method-grid{grid-template-columns:1fr 1fr;gap:1rem;text-align:center}
  .method-step{
    padding:1.25rem 1rem 1.1rem;background:var(--bg-soft);border-radius:10px;
    padding-top:1.75rem;text-align:center;
  }
  .method-step::before{
    left:50%;top:.9rem;width:2rem;
    transform:translateX(-50%);
  }
  .method-step h4{font-size:1rem;margin-bottom:.4rem}
  .method-num{font-size:.68rem;margin-bottom:.35rem}
  .method-step p{font-size:.82rem;line-height:1.5}

  /* ===== Footer compacto en mobile ===== */
  footer{padding:1.75rem 0 1rem}
  .footer-top{padding-bottom:1.25rem;gap:.85rem;text-align:center;flex-direction:column;align-items:center}
  .footer-brand{max-width:100%;text-align:center}
  .footer-brand .brand{height:22px;margin-bottom:.85rem;margin-left:auto;margin-right:auto}
  .footer-tagline{font-size:.95rem;line-height:1.3}

  .footer-grid{
    grid-template-columns:1fr 1fr;gap:1.1rem;
    padding-top:1.25rem;text-align:center;
  }
  .footer-col{gap:.35rem;align-items:center}
  .footer-col .label{font-size:.65rem;margin-bottom:.25rem}
  .footer-col a{font-size:.82rem}
  .footer-col p{font-size:.75rem}
  /* "Síguenos" se oculta en mobile, ahorra espacio */
  .footer-col:nth-child(3){grid-column:1 / -1;display:flex;flex-direction:row;flex-wrap:wrap;gap:.85rem;align-items:center;justify-content:center;padding-top:.5rem;border-top:1px solid rgba(255,255,255,.08)}
  .footer-col:nth-child(3) .label{width:100%;margin-bottom:0}

  .footer-bottom{
    padding-top:1rem;margin-top:1.25rem;
    flex-direction:column;text-align:center;gap:.5rem;
    font-size:.72rem;
  }
  .footer-bottom a{margin-right:.65rem;font-size:.72rem}

  /* ===== Método ===== */
  .method-grid{grid-template-columns:1fr 1fr;gap:1.5rem 1.25rem}
  .method-step{padding-top:1rem}
  .method-step::before{width:2rem}
  .method-step h4{font-size:1.05rem}
  .method-num{font-size:.7rem}
  .method-step p{font-size:.82rem;line-height:1.55}

  /* ===== FAQ ===== */
  .faq-item summary{padding:.9rem 1rem;font-size:.92rem;gap:.6rem}
  .faq-answer{padding:0 1rem 1rem;font-size:.88rem;line-height:1.6}

  /* ===== Contacto ===== */
  .contact-grid{gap:2rem}
  .contact-intro h2{margin:.5rem 0 1rem}
  .contact-intro p{font-size:.95rem}
  .contact-direct a{font-size:1.1rem}
  .contact-form{padding:1.25rem;gap:.85rem}
  .form-label input,.form-label select,.form-label textarea{font-size:16px;padding:.75rem .85rem}
  .contact-form button{width:100%;justify-content:center;padding:.95rem}

  /* ===== Header mobile ===== */
  .site-header{position:sticky}
  .nav-inner{padding:.7rem 0;gap:1rem;position:relative}
  .brand{margin-left:.5rem}
  .brand img{height:22px}
  .burger{padding:.3rem;background:transparent;border:none;cursor:pointer;display:flex;flex-direction:column;gap:5px;z-index:101}
  .burger span{display:block;width:22px;height:2px;background:var(--ink);transition:all .3s}
  .burger.active span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .burger.active span:nth-child(2){opacity:0}
  .burger.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .nav.open{
    padding:1.5rem 1.5rem 2rem;gap:1.1rem;font-size:1.05rem;
    align-items:center;text-align:center;
  }
  .nav.open a{padding:.55rem 0;width:100%}
  .nav.open .nav-cta{
    align-self:center;padding:.85rem 1.6rem!important;
    margin-top:.75rem;font-size:.95rem!important;
  }

  /* ===== Blog ===== */
  .blog-hero h1{font-size:clamp(2.2rem,9vw,3rem)}
  .blog-grid{grid-template-columns:1fr;gap:1.25rem}
  .blog-card-body{padding:1.25rem;gap:.65rem}
  .blog-card h3{font-size:1.1rem}

  /* ===== Post individual ===== */
  .post-title{font-size:clamp(1.8rem,8vw,2.5rem)}
  .post-lead{font-size:1.05rem}
  .post-content{padding-bottom:3rem;padding-left:1.1rem;padding-right:1.1rem}
  .post-content p{font-size:.98rem;line-height:1.65}
  .post-content h2{font-size:1.4rem;margin:1.75rem 0 .75rem}
  .post-content h3{font-size:1.15rem}
  .post-cover{margin-bottom:2rem;border-radius:10px}
}

@media(max-width:420px){
  .service-tags li:nth-child(n+4){display:inline-block}
  .hero-eslogan{font-size:.88rem;padding:.55rem 1rem .55rem .75rem}
  .hero-ctas{flex-direction:column}
  .hero-ctas .btn{width:100%}
  .footer-grid{grid-template-columns:1fr}
  /* Buttons más cómodos al tap */
  .btn{padding:.85rem 1.25rem}
}

/* ============== PÁGINAS LEGALES ============== */
.legal-page{padding:clamp(4rem,8vw,7rem) 0}
.legal-content{max-width:46rem;margin:0 auto}
.legal-header{margin-bottom:clamp(2.5rem,5vw,4rem);padding-bottom:2rem;border-bottom:1px solid var(--rule)}
.legal-header h1{
  font-family:var(--font-display);font-weight:500;
  font-size:clamp(2.2rem,5vw,3.6rem);letter-spacing:-.03em;
  line-height:1.05;margin-bottom:1rem;
}
.legal-lead{font-size:clamp(1.05rem,1.3vw,1.2rem);color:var(--muted);line-height:1.5}
.legal-body h2{
  font-family:var(--font-display);font-weight:600;
  font-size:clamp(1.3rem,2.2vw,1.7rem);letter-spacing:-.02em;
  margin:2.5rem 0 1rem;line-height:1.2;
}
.legal-body h2:first-child{margin-top:0}
.legal-body h3{
  font-family:var(--font-display);font-weight:500;
  font-size:clamp(1.1rem,1.8vw,1.3rem);letter-spacing:-.015em;
  margin:1.75rem 0 .75rem;
}
.legal-body p{margin-bottom:1.1rem;font-size:1rem;line-height:1.7;color:var(--ink-soft)}
.legal-body ul,.legal-body ol{margin:0 0 1.2rem 1.4rem;color:var(--ink-soft)}
.legal-body li{margin-bottom:.5rem;line-height:1.6;font-size:.98rem}
.legal-body a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:3px;font-weight:500}
.legal-body strong{color:var(--ink);font-weight:600}

@media(max-width:780px){
  .legal-page{padding:3rem 0}
  .legal-header h1{font-size:clamp(1.8rem,8vw,2.5rem)}
  .legal-body h2{font-size:1.2rem;margin:2rem 0 .75rem}
  .legal-body p,.legal-body li{font-size:.94rem}
}

/* ============== BLOG CATEGORY PILLS ============== */
.cat-pills{
  display:flex;flex-wrap:wrap;gap:.5rem;
  padding:.5rem 0;
}
.cat-pill{
  display:inline-flex;align-items:center;gap:.5rem;
  padding:.55rem 1rem;
  background:var(--bg-soft);border:1px solid var(--rule);
  border-radius:100px;text-decoration:none;
  font-size:.85rem;font-weight:500;color:var(--ink-soft);
  font-family:var(--font-display);letter-spacing:-.005em;
  transition:all .25s;
  --cat-color:var(--accent);
}
.cat-pill:hover{border-color:var(--ink);color:var(--ink);transform:translateY(-1px)}
.cat-pill.active{
  background:var(--ink);color:var(--bg);border-color:var(--ink);
}
.cat-pill.active .cat-count{background:rgba(255,255,255,.15);color:var(--bg)}
.cat-dot{
  width:.55rem;height:.55rem;border-radius:50%;
  background:var(--cat-color);flex-shrink:0;
  box-shadow:0 0 0 2px rgba(0,0,0,.04);
}
.cat-pill.active .cat-dot{box-shadow:0 0 0 2px rgba(255,255,255,.15)}
.cat-count{
  font-size:.72rem;padding:.1rem .45rem;
  background:rgba(0,0,0,.06);border-radius:100px;
  color:var(--muted);font-weight:600;
}

/* Coloring blog covers según categoría */
.blog-card-cover{
  --cat-color:var(--accent);
}
.blog-card-cover::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(135deg, var(--cat-color) 0%, rgba(0,0,0,.05) 100%);
  opacity:.18;
}
.blog-card-cover .cover-tag{z-index:2}

/* Coloring de cat en cards */
.blog-card-meta .cat{
  --cat-color:var(--accent);
  display:inline-flex;align-items:center;gap:.35rem;
}
.blog-card-meta .cat::before{
  content:"";width:.4rem;height:.4rem;border-radius:50%;
  background:var(--cat-color);
}

/* ============== COVER IMAGES (cuando hay imagen real) ============== */
.blog-card-cover.has-image,
.post-cover.has-image{
  background-size:cover;background-position:center;background-repeat:no-repeat;
}
.blog-card-cover.has-image::after,
.post-cover.has-image::after{
  background:linear-gradient(180deg, rgba(0,0,0,.05) 0%, rgba(0,0,0,.45) 100%);
  opacity:1;
}
.blog-card-cover.has-image .cover-tag{
  background:rgba(0,0,0,.7);color:#fff;backdrop-filter:blur(4px);
}
.post-cover.has-image .cover-label{
  background:var(--accent);color:var(--ink);
  box-shadow:0 4px 16px rgba(0,0,0,.25);
}

/* ============== VALIDACIÓN DEL FORM ============== */
/* Resaltar campos con error (al intentar enviar incompletos) */
.contact-form input:invalid:not(:placeholder-shown),
.contact-form select:invalid:not([value=""]),
.contact-form textarea:invalid:not(:placeholder-shown){
  border-color:#E5484D;
  background:rgba(229,72,77,.04);
}
/* Forzar rojo cuando el campo está marcado como tocado y vacío */
.contact-form .field-error input,
.contact-form .field-error select,
.contact-form .field-error textarea,
.contact-form input.has-error,
.contact-form select.has-error,
.contact-form textarea.has-error{
  border-color:#E5484D!important;
  background:rgba(229,72,77,.04)!important;
  animation:shake .35s ease;
}
.contact-form .field-error span,
.contact-form label.has-error span{color:#E5484D!important}

@keyframes shake{
  0%,100%{transform:translateX(0)}
  25%{transform:translateX(-4px)}
  75%{transform:translateX(4px)}
}

/* Mensaje de error sutil debajo */
.field-error-msg{
  font-size:.78rem;color:#E5484D;margin-top:.25rem;display:block;
}
