:root{
  --wss-primary:#006bb2;
  --wss-primary-2:#00b5e8;
  --wss-dark:#0c3b55;
  --wss-card:#ffffff;
  --wss-shadow:0 10px 18px rgba(0,0,0,.08);
}

/* ===== Grid / Cards ===== */
.wss-grid{display:grid;gap:18px;margin:10px 0}
.wss-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.wss-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.wss-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:1024px){.wss-cols-4{grid-template-columns:repeat(3,1fr)}}
@media(max-width:860px){.wss-cols-3,.wss-cols-4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.wss-cols-2,.wss-cols-3,.wss-cols-4{grid-template-columns:1fr}}
.wss-card{background:var(--wss-card);border-radius:16px;box-shadow:var(--wss-shadow);overflow:hidden;border:1px solid #e9eef3}
.wss-card-body{padding:18px}
.wss-card-title{margin:0 0 8px;color:var(--wss-dark);font-size:22px !important;}
.wss-card-text{margin:0 0 14px;color:#334}
.wss-card-actions{display:flex;gap:10px;flex-wrap:wrap}
.wss-btn{display:inline-block;background:var(--wss-primary);color:#fff;text-decoration:none;padding:10px 16px;border-radius:10px;box-shadow:0 8px 18px rgba(0,107,178,.25);transition:transform .15s ease, box-shadow .15s ease;border:0;cursor:pointer}
.wss-btn:hover{background:var(--wss-primary-2);transform:translateY(-1px);box-shadow:0 12px 22px rgba(0,181,232,.25)}
.wss-btn-outline{background:#fff;color:var(--wss-primary);border:1px solid var(--wss-primary)}
.wss-btn-outline:hover{background:#f0fbff}

/* ===== Single ===== */
.wss-chip{background:rgba(0,0,0,.06);padding:4px 10px;border-radius:999px;display:inline-block;margin-top:6px}
.wss-single-intro,.wss-single-body{background:#fff;border:1px solid #e9eef3;border-radius:16px;padding:16px;margin:12px 0;box-shadow:var(--wss-shadow)}
.wss-plan-card{background:#fff;border:1px solid #e9eef3;border-radius:16px;padding:16px;box-shadow:var(--wss-shadow)}
.wss-price{display:flex;align-items:baseline;gap:10px;margin:6px 0 10px}
.wss-price-old{text-decoration:line-through;opacity:.6}
.wss-price-now{font-size:1.4rem;font-weight:700;color:var(--wss-dark)}
.wss-period{opacity:.7}
.wss-feat{padding-left:18px}
.wss-empty{padding:14px 16px;background:#f6fbff;border:1px solid #d9ecff;border-radius:12px}

/* ===== Acordeón ===== */
.wss-accordion{display:flex;flex-direction:column;gap:14px}
.wss-acc-item{background:rgba(0,32,64,.25);border-radius:14px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.wss-acc-head{width:100%;display:flex;align-items:center;gap:10px;border:none;background:linear-gradient(180deg,#144d6f,#0f3f5d);color:#fff;padding:14px 18px;border-radius:14px;cursor:pointer}
.wss-acc-icon{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;background:#1f7ab0;font-weight:700;transition:transform .2s}
.wss-acc-title{font-weight:600}
.wss-acc-body{display:none;padding:14px 18px;color:#e8f1f8}
.wss-acc-item.open .wss-acc-body{display:block}
.wss-acc-item.open .wss-acc-icon{background:#2db6e6; transform:rotate(45deg)} /* + se “convierte” en x con un pequeño giro */

/* ===== FAB + Modal Cotizador ===== */
.wss-quote-fab{position:fixed; right:18px; bottom:18px; width:56px; height:56px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:var(--wss-primary); color:#fff; box-shadow:0 12px 26px rgba(0,0,0,.18); cursor:pointer; z-index:9999; font-size:26px; line-height:1; border:0}
.wss-quote-fab:hover{ background:var(--wss-primary-2); }

.wss-quote-modal{position:fixed; inset:0; background:rgba(0,0,0,.5); display:none; align-items:center; justify-content:center; z-index:10000}
.wss-quote-modal.open{ display:flex; }
.wss-quote-dialog{position:relative; background:#fff; border-radius:14px; width:min(820px,96vw); box-shadow:0 16px 36px rgba(0,0,0,.2); padding:18px}
.wss-quote-close{ position:absolute; background:transparent; border:0; font-size:28px; right:22px; top:16px; cursor:pointer }
.wss-required{ color:#d63638 }

/* Steps */
.wss-step{border:1px solid #edf1f5; border-radius:12px; padding:12px 12px 6px; margin-bottom:12px; background:#fbfdff}
.wss-step legend{font-weight:700; padding:0 6px; color:#0c3b55}
.wss-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:10px}
.wss-col label{display:block;font-weight:600;margin:0 0 4px}
@media (max-width:760px){ .wss-row{grid-template-columns:1fr} }

select, input, textarea{width:100%; padding:8px 10px; border:1px solid #dfe5ec; border-radius:8px; background:#fff}
select:focus, input:focus, textarea:focus{outline:none; border-color:#bcd6ea; box-shadow:0 0 0 3px rgba(0,107,178,.14)}

.wss-quote-actions{ display:flex; gap:10px; margin-top:10px }
