/* uxrosario.cl — hoja de estilos de las páginas de artículo */
:root{
  --ground:#F8F0E5; --surface:#FFFFFF; --ink:#0D3B4E; --muted:#52646F;
  --rule:#E6DACA; --olive:#41586A; --olive-deep:#0D3B4E; --olive-soft:#F0E6D6;
  --steel:#5D768C; --sand:#E8C198;
  --navh:72px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0; background:var(--ground); color:var(--ink);
  font-family:"Lato",Arial,sans-serif; font-size:1.06rem; line-height:1.7;
  -webkit-font-smoothing:antialiased;}
.wrap{max-width:46rem; margin:0 auto; padding:0 clamp(1.2rem,5vw,2rem);}
h1,h2,h3{font-family:"Outfit",sans-serif; line-height:1.14; text-wrap:balance; letter-spacing:-.02em;}
a{color:var(--olive); text-underline-offset:3px; text-decoration-thickness:1px;}
a:hover{color:var(--olive-deep);}

/* nav */
.nav{position:sticky; top:0; z-index:40; background:rgba(248,240,229,.92);
  backdrop-filter:blur(8px); border-bottom:1px solid var(--rule);}
.nav-in{max-width:76rem; margin:0 auto; padding:0 clamp(1.2rem,5vw,2rem); height:var(--navh);
  display:flex; align-items:center; justify-content:space-between; gap:1rem;}
.wordmark{font-family:"Outfit",sans-serif; font-size:1.18rem; font-weight:600;
  letter-spacing:.18em; color:var(--ink); text-decoration:none; white-space:nowrap;}
.wordmark em{font-style:normal; font-weight:200;}
.nav-links{display:flex; align-items:center; gap:clamp(.9rem,2.5vw,1.7rem);}
.nav-links a{font-size:.92rem; color:var(--ink); text-decoration:none; letter-spacing:.01em;}
.nav-links a:hover{color:var(--steel);}
.nav-cta{background:var(--ink); color:#fff !important; padding:.55rem 1.05rem; border-radius:999px;}
.nav-cta:hover{background:var(--steel);}
@media (max-width:620px){
  :root{--navh:62px;}
  .nav-links a:not(.nav-cta){display:none;}
  .wordmark{font-size:1rem; letter-spacing:.14em;}
}

/* cabecera del artículo */
.art-head{padding:clamp(2.6rem,7vw,4.4rem) 0 clamp(1.6rem,4vw,2.4rem); border-bottom:1px solid var(--rule);}
.crumb{font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; color:var(--steel);
  margin:0 0 1.4rem;}
.crumb a{color:var(--steel); text-decoration:none;}
.crumb a:hover{text-decoration:underline;}
.art-head h1{margin:0 0 1.1rem; font-weight:300; font-size:clamp(2.1rem,5.6vw,3.3rem);}
.art-head h1 b{font-weight:600;}
.lede{font-size:clamp(1.08rem,2.2vw,1.26rem); color:var(--muted); margin:0; line-height:1.55;}
.byline{margin-top:1.6rem; font-size:.84rem; color:var(--steel); letter-spacing:.04em;}

/* cuerpo */
article{padding:clamp(1.8rem,5vw,2.8rem) 0 1rem;}
article h2{margin:2.8rem 0 .9rem; font-size:clamp(1.35rem,3.2vw,1.75rem); font-weight:600;}
article h3{margin:2rem 0 .5rem; font-size:1.1rem; font-weight:600; letter-spacing:-.01em;}
article p{margin:0 0 1.15rem;}
article ul,article ol{padding-left:1.3rem; margin:0 0 1.3rem;}
article li{padding:.22rem 0;}
article strong{font-weight:700;}

.box{background:var(--surface); border:1px solid var(--rule); border-left:3px solid var(--steel);
  border-radius:0 12px 12px 0; padding:1.15rem 1.4rem; margin:1.8rem 0; font-size:.98rem;}
.box .t{font-family:"Outfit",sans-serif; font-size:.72rem; letter-spacing:.16em; text-transform:uppercase;
  color:var(--steel); display:block; margin-bottom:.5rem; font-weight:600;}
.box p:last-child{margin-bottom:0;}

.dato{display:grid; grid-template-columns:5.6rem 1fr; gap:1rem; align-items:baseline;
  padding:1rem 0; border-bottom:1px solid var(--rule);}
.dato:first-of-type{border-top:1px solid var(--rule);}
.dato .n{font-family:"Outfit",sans-serif; font-weight:600; font-size:1.9rem; color:var(--ink);
  line-height:1; white-space:nowrap;}
.dato .d{font-size:.98rem; line-height:1.5;}
@media (max-width:520px){ .dato{grid-template-columns:1fr; gap:.2rem;} }

/* cierre */
.cierre{background:var(--ink); color:#fff; border-radius:20px; padding:clamp(1.8rem,5vw,2.6rem);
  margin:3rem 0 1rem; text-align:center;}
.cierre h2{margin:0 0 .7rem; color:#fff; font-weight:300; font-size:clamp(1.4rem,3.4vw,1.9rem);}
.cierre h2 b{font-weight:600;}
.cierre p{margin:0 auto 1.5rem; max-width:34rem; color:#DCE5EA; font-size:1rem;}
.btn{display:inline-block; padding:.85rem 1.6rem; border-radius:999px; font-weight:700;
  font-size:.95rem; text-decoration:none; border:1px solid transparent; letter-spacing:.01em;}
.btn-solid{background:var(--sand); color:#0D3B4E; border-color:var(--sand);}
.btn-solid:hover{background:#F2D3B0; color:#0D3B4E;}
.btn-line{border-color:var(--rule); color:var(--ink);}
.btn-line:hover{border-color:var(--ink);}

/* fuentes citadas */
.fuentes{border-top:1px solid var(--rule); margin-top:2.6rem; padding-top:1.4rem; font-size:.86rem; color:var(--muted);}
.fuentes h2{font-size:.96rem; margin:0 0 .6rem; font-weight:600;}
.fuentes ol{padding-left:1.2rem;}
.fuentes li{padding:.22rem 0; line-height:1.5;}

/* pie */
.foot{border-top:1px solid var(--rule); margin-top:2.6rem; padding:2.2rem 0 3rem; text-align:center;}
.foot p{margin:0 0 1rem; color:var(--muted); font-size:.95rem;}
.foot .links{display:flex; gap:1.4rem; justify-content:center; flex-wrap:wrap; font-size:.9rem;}
.foot .links a{color:var(--ink); text-decoration:none;}
.foot .links a:hover{text-decoration:underline;}

/* marcador de contenido que Rosario debe completar antes de publicar */
.completar{background:#FFF8E1; border:1px dashed #B45309; border-radius:10px;
  padding:1.1rem 1.3rem; margin:1.6rem 0; font-size:.96rem; color:#7C4A05;}
.completar .t{font-family:"Outfit",sans-serif; font-size:.72rem; letter-spacing:.16em;
  text-transform:uppercase; display:block; margin-bottom:.5rem; font-weight:600; color:#B45309;}
.completar p:last-child{margin-bottom:0;}

/* ── página de servicios ── */
body.pag-servicios .wrap{max-width:70rem;}
body.pag-servicios .crumb,
body.pag-servicios .art-head h1,
body.pag-servicios .lede,
body.pag-servicios .byline,
body.pag-servicios article > p,
body.pag-servicios article > ul,
body.pag-servicios article > h2,
body.pag-servicios article > h3{max-width:40rem;}
body.pag-servicios .cierre,
body.pag-servicios .foot{max-width:54rem; margin-left:auto; margin-right:auto;}

.svc{border-radius:22px; padding:2.4rem 2.6rem; margin:1.6rem 0;
  display:grid; grid-template-columns:1fr 1.3fr; gap:2.8rem; align-items:start;
  background:var(--surface); border:1px solid var(--rule);}

/* el número como ancla visual */
.svc .num{display:block; font-family:"Outfit",sans-serif; font-weight:200;
  font-size:3.4rem; line-height:1; letter-spacing:-.03em; color:var(--steel);
  margin-bottom:1rem; opacity:.55;}
.svc h2{margin:0 0 .75rem; font-size:1.75rem; font-weight:600; max-width:none; line-height:1.12;}
.svc .para{color:var(--muted); margin:0 0 1.6rem; font-size:1.02rem; line-height:1.6;}
.svc-der{display:grid; grid-template-columns:1fr 1fr; gap:2rem;}
.svc-der h3{margin:0 0 .8rem; font-size:.7rem; letter-spacing:.17em; text-transform:uppercase;
  color:var(--steel); font-weight:700; font-family:"Outfit",sans-serif;
  padding-bottom:.55rem; border-bottom:1px solid var(--rule);}
.svc ul{margin:0; padding-left:0; list-style:none;}
.svc li{padding:.5rem 0 .5rem 1.1rem; font-size:.95rem; line-height:1.55; position:relative;}
.svc li::before{content:""; position:absolute; left:0; top:1.05em; width:5px; height:5px;
  border-radius:50%; background:var(--steel); opacity:.6;}
.svc .acciones{display:flex; gap:.6rem; flex-wrap:wrap;}
.svc .acciones .btn{padding:.78rem 1.3rem; font-size:.88rem;}
.destacado{display:inline-block; background:var(--olive-soft); color:var(--olive-deep);
  font-size:.72rem; letter-spacing:.07em; padding:.3rem .8rem; border-radius:999px;
  font-weight:700; margin-bottom:.9rem;}

/* 01 · el servicio de entrada, en navy */
.svc--oscuro{background:var(--ink); border-color:var(--ink); color:#fff;}
.svc--oscuro h2{color:#fff;}
.svc--oscuro .num{color:var(--sand); opacity:.85;}
.svc--oscuro .para{color:#D3DEE4;}
.svc--oscuro .svc-der h3{color:var(--sand); border-bottom-color:rgba(255,255,255,.22);}
.svc--oscuro li{color:#E8EEF1;}
.svc--oscuro li::before{background:var(--sand); opacity:.9;}
.svc--oscuro .destacado{background:var(--sand); color:var(--ink);}
.svc--oscuro .btn-line{border-color:rgba(255,255,255,.45); color:#fff; background:transparent;}
.svc--oscuro .btn-line:hover{border-color:#fff; background:rgba(255,255,255,.08);}

/* 03 · arena suave, para cerrar el ritmo */
.svc--suave{background:var(--olive-soft); border-color:#E0D2BD;}

@media (max-width:900px){
  .svc{grid-template-columns:1fr; gap:1.8rem; padding:1.8rem 1.6rem;}
  .svc .num{font-size:2.6rem; margin-bottom:.7rem;}
}
@media (max-width:560px){
  .svc-der{grid-template-columns:1fr; gap:1.4rem;}
}
