/* AutomateK · sección de Planes. Hoja propia: tres planes de mayor a menor
   precio, bloque de comparación y una sola llamada a la acción en toda la
   sección. Los planes van de menor a mayor precio. Borrando su línea de
   index.html y la sección, la página vuelve a como estaba. */

#planes{padding-top:clamp(52px,6.5vw,86px)}
.plnCab{max-width:820px;margin:0 auto clamp(34px,4.6vw,50px);text-align:center}
.plnEntra{font-size:clamp(17px,1.7vw,21px);line-height:1.55;color:#61697A;margin:22px auto 0;max-width:38em;text-wrap:pretty}
.plnCond{margin:22px auto 0;display:inline-flex;align-items:center;gap:11px;background:#FFFFFF;border:1px solid #E5E5E7;border-radius:999px;padding:10px 20px;font-size:14.5px;color:#1D1D1F;text-align:left}
.plnCondIco{flex:none;width:20px;height:20px;border-radius:6px;background:rgba(28,75,216,.1);color:#1C4BD8;display:grid;place-items:center}
.plnCondIco svg{width:13px;height:13px}

.plnGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(5,auto);column-gap:16px;row-gap:0;align-items:stretch}
.plnCard{display:grid;grid-row:span 5;grid-template-rows:subgrid;background:#FFFFFF;border:1px solid #E5E5E7;border-radius:24px;padding:clamp(26px,3vw,34px);box-shadow:0 1px 2px rgba(11,11,12,.04);transition:transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s}
.plnCard:hover{transform:translateY(-5px);box-shadow:0 26px 54px -30px rgba(11,11,12,.2)}
.plnCardRec{background:#FBFCFF;border:1.5px solid #1C4BD8;box-shadow:0 30px 64px -34px rgba(28,75,216,.42)}
.plnCardRec:hover{box-shadow:0 40px 74px -34px rgba(28,75,216,.5)}

.plnNom{display:flex;align-items:center;flex-wrap:wrap;gap:9px;font-family:'JetBrains Mono',monospace;font-size:11.5px;letter-spacing:.16em;color:#61697A}
.plnNomRec{color:#1C4BD8}
.plnRec{display:inline-flex;align-items:center;padding:4px 9px;border-radius:999px;background:#1C4BD8;color:#FFFFFF;font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.14em}
.plnPrecio{display:flex;align-items:baseline;gap:7px;margin:20px 0 0}
.plnCifra{font-family:'General Sans',Inter,sans-serif;font-weight:700;font-size:clamp(34px,3.6vw,44px);line-height:1;letter-spacing:-.03em;color:#1D1D1F;font-variant-numeric:tabular-nums}
.plnMes{font-size:15px;color:#61697A}
.plnTxt{margin:18px 0 0;font-size:clamp(15px,1.45vw,16.5px);line-height:1.55;color:#1D1D1F;font-weight:600;text-wrap:pretty}

.plnLista{list-style:none;margin:18px 0 0;padding:0;display:flex;flex-direction:column;gap:12px;align-content:start}
.plnItem{display:flex;align-items:flex-start;gap:10px;font-size:clamp(14.5px,1.4vw,15.5px);line-height:1.5;color:#61697A;text-wrap:pretty}
.plnCheck{flex:none;margin-top:3px;width:15px;height:15px;border-radius:5px;background:rgba(28,75,216,.1);color:#1C4BD8;display:grid;place-items:center}
.plnCheck svg{width:10px;height:10px}

.plnDet{margin:20px 0 0;align-self:end;padding-top:16px;border-top:1px solid #EDEDEF}
.plnDetRec{border-top-color:rgba(28,75,216,.18)}
.plnDetSum{display:flex;align-items:center;justify-content:space-between;gap:10px;cursor:pointer;list-style:none;font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:#61697A;transition:color .2s}
.plnDetSum::-webkit-details-marker{display:none}
.plnDetSum:hover{color:#1C4BD8}
.plnDetSig{font-family:Inter,sans-serif;font-size:17px;line-height:1;letter-spacing:0;transition:transform .25s cubic-bezier(.22,1,.36,1)}
.plnDet[open] .plnDetSum{color:#1C4BD8}
.plnDet[open] .plnDetSig{transform:rotate(45deg)}
.plnDetTxt{margin:14px 0 0;font-size:14.5px;line-height:1.6;color:#61697A;text-wrap:pretty}

.plnIncl{margin:clamp(20px,2.4vw,28px) 0 0;display:flex;align-items:center;justify-content:center;gap:11px;font-size:15px;line-height:1.5;color:#61697A;text-align:left}
.plnInclIco{flex:none;width:20px;height:20px;border-radius:6px;background:rgba(28,75,216,.1);color:#1C4BD8;display:grid;place-items:center}
.plnInclIco svg{width:13px;height:13px}

.plnComp{margin:clamp(30px,3.8vw,46px) auto 0;max-width:940px;background:#0B0B0C;border-radius:26px;padding:clamp(28px,3.8vw,46px) clamp(24px,3.8vw,50px);box-shadow:0 44px 96px -54px rgba(11,11,12,.6)}
.plnCompT{margin:0;font-size:clamp(18px,1.85vw,23px);line-height:1.5;color:#F5F5F7;text-wrap:pretty}
.plnCompFuerte{color:#FFFFFF;font-weight:600}
.plnCompB{margin:18px 0 0;padding-top:18px;border-top:1px solid rgba(245,245,247,.14);font-size:clamp(15.5px,1.5vw,17.5px);line-height:1.6;color:#A1A1A6;text-wrap:pretty}

.plnPie{margin:clamp(14px,1.6vw,20px) 0 0;display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center}
.plnPieTxt{margin:0;max-width:44em;font-size:clamp(15.5px,1.5vw,17px);line-height:1.55;color:#61697A;text-wrap:pretty}
.plnBtn{display:inline-flex;align-items:center;gap:10px;min-height:54px;padding:0 32px;background:#1C4BD8;color:#FFFFFF;font-weight:600;font-size:16.5px;border-radius:999px;text-decoration:none;box-shadow:0 14px 30px -14px rgba(28,75,216,.55);transition:transform .25s cubic-bezier(.22,1,.36,1),filter .2s}
.plnBtn:hover{transform:translateY(-2px);filter:brightness(1.09)}

@media(max-width:900px){
  .plnGrid{grid-template-columns:1fr;grid-template-rows:auto;row-gap:16px}
  .plnCard{grid-row:auto;grid-template-rows:auto;display:flex;flex-direction:column}
  .plnIncl{align-items:flex-start}
}