/* Páginas web · paquetes, ejemplos, proceso, costos y cotización */
.pw-acc{display:flex;align-items:center;gap:26px;flex-wrap:wrap;margin-top:32px;animation-delay:.7s}
.nota{color:var(--dim);font-size:15px;margin-top:20px}

/* paquetes */
.pq-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.pq{display:flex;flex-direction:column;gap:16px}
.pq .precio small{font-size:.36em;letter-spacing:0;color:var(--dim);font-weight:400}
.pq .chk{margin-bottom:8px}
.pq .pill{align-self:flex-start;margin-top:auto}

/* ejemplos */
.ej-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.ej{display:grid;gap:16px}
.ej-img{display:block;overflow:hidden;border-radius:var(--r);border:1px solid var(--line);background:var(--bg3);aspect-ratio:16/10}
.ej-img img{width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .9s var(--ease)}
.ej:hover .ej-img img,.ej:focus-visible .ej-img img{transform:scale(1.04)}
.ej-pie{display:grid;grid-template-columns:1fr auto;align-items:baseline;gap:2px 12px}
.ej-pie b{font-size:clamp(22px,1.8vw,28px);font-weight:500;letter-spacing:-.025em}
.ej-pie .dim{grid-column:1;font-size:15px}
.ej-pie .fl{grid-column:2;grid-row:1;font-size:24px;transition:transform .5s var(--ease)}
.ej:hover .fl{transform:rotate(-45deg)}

/* proceso */
.proceso{padding-bottom:0}
.pr-lista{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line)}
.pr-lista li{display:grid;gap:10px;align-content:start;padding:28px 24px 0;border-right:1px solid var(--line)}
.pr-lista li:first-child{padding-left:0}
.pr-lista li:last-child{border-right:0}
.pr-lista i{font-style:normal;font-size:13px;color:var(--ac2);font-variant-numeric:tabular-nums}
.pr-lista b{font-size:clamp(26px,2.4vw,36px);font-weight:500;letter-spacing:-.03em}
.pr-lista span{color:var(--dim);max-width:30ch}

/* costos */
.costos h2{margin-bottom:48px}
.cs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.cs-grid .panel{display:grid;gap:14px;align-content:start}
.cs-grid .kicker{margin-bottom:0}
.mitad{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.mitad span{padding:12px 14px;color:var(--dim);font-size:15px}
.mitad span+span{border-left:1px solid var(--line)}
.mitad b{display:block;color:var(--txt);font-size:clamp(28px,2.6vw,38px);font-weight:500;letter-spacing:-.04em;line-height:1.1}

/* cotizar */
.cotizar{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}
.ct-txt{display:grid;gap:24px}
.cotizar .form .pill{justify-self:start;white-space:normal;text-align:center}

/* recursos */
.relacion{padding-top:0}

@media (max-width:900px){
  .pq-grid,.ej-grid,.cs-grid,.cotizar{grid-template-columns:1fr}
  .cotizar{gap:32px}
  .pr-lista{grid-template-columns:1fr 1fr;row-gap:28px}
  .pr-lista li{border-right:0;padding-left:0}
}
@media (max-width:480px){
  .pr-lista{grid-template-columns:1fr}
}