.sv-wrap {
    font-family: 'Century Gothic','CenturyGothic',sans-serif;
    background: #050508;
    color: #fff;
    overflow-x: hidden;
  }

  .sv-eyebrow {
    display: inline-block;
    padding: 5px 18px; border-radius: 999px;
    border: 1px solid rgba(6,182,212,0.35);
    background: rgba(6,182,212,0.08);
    color: #06b6d4;
    font-size: 10px; letter-spacing: 0.25em;
    text-transform: uppercase;
    margin-bottom: 1.2rem; font-weight: 500;
  }
  .sv-gradient {
    background: linear-gradient(135deg,#667eea,#764ba2,#f093fb,#4facfe,#00f2fe);
    background-size: 300% 300%;
    -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
    animation: svGs 8s ease infinite;
  }
  @keyframes svGs { 0%{background-position:0% 50%} 50%{background-position:100% 50%} 100%{background-position:0% 50%} }
  .sv-grid-bg {
    background-image:
      linear-gradient(rgba(255,255,255,0.02) 1px, transparent 1px),
      linear-gradient(90deg, rgba(255,255,255,0.02) 1px, transparent 1px);
    background-size: 50px 50px;
  }
  .sv-section-head { text-align: center; max-width: 1200px; margin: 0 auto 3rem; padding: 0 2rem; }
  .sv-section-head h2 { font-size: clamp(2rem,4.5vw,3.4rem); font-weight: 700; line-height: 1.1; letter-spacing: -0.02em; }
  .sv-section-head p { color: rgba(255,255,255,0.5); font-size: 1rem; margin-top: 1rem; max-width: 620px; margin-left: auto; margin-right: auto; line-height: 1.6; }

  /* HERO */
  .sv-hero { position: relative; padding: 9rem 2rem 4rem; text-align: center; overflow: hidden; }
  .sv-hero::before {
    content:''; position: absolute; inset: 0;
    background: radial-gradient(ellipse at 50% 40%, rgba(139,92,246,0.18) 0%, rgba(6,182,212,0.08) 35%, transparent 65%);
    pointer-events: none;
  }
  .sv-hero-inner { position: relative; z-index: 2; max-width: 980px; margin: 0 auto; }
  .sv-hero h1 { font-size: clamp(2rem,4.5vw,3.4rem); font-weight: 700; line-height: 1; letter-spacing: -0.03em; margin-bottom: 1.4rem; }
  .sv-hero p { font-size: 1rem; color: rgba(255,255,255,0.55); max-width: 1040px; margin: 0 auto; line-height: 1.6; }

  .sv-anchors {
    max-width: 1100px; margin: 2.5rem auto 0;
    display: flex; gap: 10px; justify-content: center; flex-wrap: wrap;
  }
  .sv-anchor {
    padding: 8px 18px; border-radius: 999px;
    background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1);
    color: rgba(255,255,255,0.7); font-size: 0.78rem; font-weight: 500;
    letter-spacing: 0.04em; text-decoration: none;
    transition: all 0.3s ease;
  }
  .sv-anchor:hover { background: rgba(255,255,255,0.1); color:#fff; transform: translateY(-2px); }

  /* LISTA DE SERVICIOS (ACCORDION NUMERADO) */
  .sv-list-section { padding: 5rem 2rem 7rem; max-width: 1280px; margin: 0 auto; }

  .sv-item {
    border-top: 1px solid rgba(255,255,255,0.08);
    padding: 2rem 0;
    cursor: pointer;
    transition: all 0.5s cubic-bezier(0.23,1,0.32,1);
    position: relative;
  }
  .sv-item:last-child { border-bottom: 1px solid rgba(255,255,255,0.08); }
  .sv-item:hover { padding-left: 1rem; }

  .sv-item-head {
    display: grid;
    grid-template-columns: 60px 1fr auto;
    gap: 1.5rem;
    align-items: center;
  }
  @media (max-width: 640px) {
    .sv-item-head { grid-template-columns: 40px 1fr auto; gap: 1rem; }
  }

  .sv-item-num {
    font-size: 0.85rem; font-weight: 700;
    letter-spacing: 0.15em; color: #06b6d4;
    font-variant-numeric: tabular-nums;
  }
  .sv-item:nth-child(2) .sv-item-num { color: #8b5cf6; }
  .sv-item:nth-child(3) .sv-item-num { color: #f093fb; }
  .sv-item:nth-child(4) .sv-item-num { color: #4facfe; }
  .sv-item:nth-child(5) .sv-item-num { color: #fb923c; }
  .sv-item:nth-child(6) .sv-item-num { color: #34d399; }
  .sv-item:nth-child(7) .sv-item-num { color: #06b6d4; }

  .sv-item-title {
    font-size: clamp(1.6rem, 3.5vw, 2.8rem);
    font-weight: 700; color: #fff;
    letter-spacing: -0.02em; line-height: 1.1;
    transition: color 0.4s ease;
  }
  .sv-item:hover .sv-item-title { color: #fff; }
  .sv-item.open .sv-item-title {
    background: linear-gradient(135deg,#06b6d4,#8b5cf6,#f093fb);
    background-size: 200% 200%;
    -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
    animation: svGs 8s ease infinite;
  }

  .sv-item-toggle {
    width: 44px; height: 44px; border-radius: 50%;
    border: 1px solid rgba(255,255,255,0.15);
    display: flex; align-items: center; justify-content: center;
    color: #fff; background: transparent;
    transition: all 0.5s cubic-bezier(0.34,1.56,0.64,1);
    flex-shrink: 0;
  }
  .sv-item:hover .sv-item-toggle { background: rgba(255,255,255,0.08); }
  .sv-item.open .sv-item-toggle {
    background: #fff; color: #000;
    transform: rotate(135deg);
    border-color: #fff;
  }

  .sv-item-body {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.7s cubic-bezier(0.23,1,0.32,1), opacity 0.5s ease, margin-top 0.5s ease;
    opacity: 0;
    margin-top: 0;
  }
  .sv-item.open .sv-item-body {
    max-height: 900px;
    opacity: 1;
    margin-top: 2rem;
  }

  .sv-item-grid {
    display: grid;
    grid-template-columns: 60px 1fr;
    gap: 1.5rem;
  }
  @media (max-width: 640px) { .sv-item-grid { grid-template-columns: 1fr; } }
  .sv-item-grid .sv-empty { display: block; }
  @media (max-width: 640px) { .sv-item-grid .sv-empty { display: none; } }

  .sv-item-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2.5rem;
  }
  @media (max-width: 840px) { .sv-item-content { grid-template-columns: 1fr; gap: 1.5rem; } }

  .sv-item-desc {
    font-size: 1rem; color: rgba(255,255,255,0.65);
    line-height: 1.65;
  }
  .sv-item-desc strong {
    color: #fff; font-weight: 700;
  }

  .sv-item-features {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
  }
  @media (max-width: 480px) { .sv-item-features { grid-template-columns: 1fr; } }
  .sv-feature {
    padding: 12px 14px;
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.07);
    border-radius: 12px;
    display: flex; align-items: center; gap: 10px;
    transition: all 0.3s ease;
  }
  .sv-feature:hover {
    background: rgba(255,255,255,0.06);
    border-color: rgba(6,182,212,0.25);
  }
  .sv-feature::before {
    content: '';
    width: 6px; height: 6px; border-radius: 50%;
    background: var(--dot, #06b6d4);
    box-shadow: 0 0 8px var(--dot, #06b6d4);
    flex-shrink: 0;
  }
  .sv-feature span {
    font-size: 0.82rem;
    color: rgba(255,255,255,0.75);
    font-weight: 500;
  }

  .sv-item-meta {
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid rgba(255,255,255,0.06);
    display: flex; gap: 2rem; flex-wrap: wrap;
    justify-content: space-between;
  }
  .sv-meta-item { display: flex; flex-direction: column; gap: 4px; }
  .sv-meta-label {
    font-size: 0.62rem; letter-spacing: 0.2em;
    text-transform: uppercase; color: rgba(255,255,255,0.4);
    font-weight: 600;
  }
  .sv-meta-value {
    font-size: 0.88rem; color: #fff; font-weight: 600;
  }

  /* METODOLOGÍA */
  .sv-method {
    padding: 6rem 2rem;
    background: radial-gradient(ellipse at 20% 50%, rgba(6,182,212,0.05) 0%, transparent 50%),
                radial-gradient(ellipse at 80% 50%, rgba(240,147,251,0.05) 0%, transparent 50%);
  }
  .sv-method-grid {
    max-width: 1280px; margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 1.2rem;
    counter-reset: step;
  }
  .sv-step {
    padding: 2rem 1.8rem;
    border-radius: 20px;
    background: rgba(255,255,255,0.025);
    border: 1px solid rgba(255,255,255,0.08);
    position: relative;
    transition: all 0.5s cubic-bezier(0.23,1,0.32,1);
    overflow: hidden;
  }
  .sv-step::before {
    content: '';
    position: absolute; top:0; left:0; right:0;
    height: 2px;
    background: linear-gradient(90deg, var(--step-color), transparent);
    opacity: 0.6;
  }
  .sv-step:hover {
    transform: translateY(-6px);
    background: rgba(255,255,255,0.04);
    border-color: rgba(255,255,255,0.15);
  }
  .sv-step-num {
    font-size: 0.7rem; letter-spacing: 0.3em;
    color: rgba(255,255,255,0.4); font-weight: 600;
    margin-bottom: 1rem;
  }
  .sv-step-icon {
    width: 44px; height: 44px; border-radius: 12px;
    display: flex; align-items: center; justify-content: center;
    margin-bottom: 1rem;
    background: var(--step-bg);
  }
  .sv-step h3 {
    font-size: 1.1rem; font-weight: 700; color: #fff;
    letter-spacing: -0.01em; margin-bottom: 0.5rem;
  }
  .sv-step p {
    font-size: 0.85rem; color: rgba(255,255,255,0.55);
    line-height: 1.55;
  }

  /* COMPARATIVA DE PLANES / FORMATOS */
  .sv-formats { padding: 6rem 2rem; max-width: 1280px; margin: 0 auto; }
  .sv-formats-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.2rem;
  }
  @media (min-width: 840px) { .sv-formats-grid { grid-template-columns: repeat(3, 1fr); } }

  .sv-format-card {
    padding: 2.2rem 2rem;
    border-radius: 22px;
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.08);
    position: relative;
    transition: all 0.5s cubic-bezier(0.23,1,0.32,1);
    display: flex; flex-direction: column;
  }
  .sv-format-card:hover {
    transform: translateY(-6px);
    border-color: rgba(255,255,255,0.2);
  }
  .sv-format-card.featured {
    background: rgba(6,182,212,0.05);
    border: 1px solid rgba(6,182,212,0.3);
  }
  .sv-format-card.featured::before {
    content: 'Más elegido';
    position: absolute; top: -10px; left: 50%;
    transform: translateX(-50%);
    background: #06b6d4; color: #000;
    font-size: 0.65rem; letter-spacing: 0.2em;
    text-transform: uppercase; font-weight: 700;
    padding: 5px 14px; border-radius: 999px;
    white-space: nowrap;
  }

  .sv-format-name {
    font-size: 0.7rem; letter-spacing: 0.25em;
    text-transform: uppercase; color: #06b6d4;
    font-weight: 600; margin-bottom: 0.8rem;
  }
  .sv-format-title {
    font-size: 1.5rem; font-weight: 700;
    color: #fff; letter-spacing: -0.01em;
    margin-bottom: 0.6rem;
  }
  .sv-format-desc {
    font-size: 0.88rem; color: rgba(255,255,255,0.55);
    line-height: 1.55; margin-bottom: 1.5rem;
  }

  .sv-format-list {
    list-style: none; padding: 0; margin: 0 0 1.8rem;
    flex: 1;
  }
  .sv-format-list li {
    font-size: 0.85rem; color: rgba(255,255,255,0.7);
    padding: 8px 0;
    display: flex; align-items: flex-start; gap: 10px;
    border-bottom: 1px solid rgba(255,255,255,0.05);
  }
  .sv-format-list li:last-child { border-bottom: none; }
  .sv-format-list li::before {
    content: '';
    width: 14px; height: 14px; border-radius: 50%;
    background: rgba(6,182,212,0.15);
    flex-shrink: 0; margin-top: 3px;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%2306b6d4' stroke-width='3'><path stroke-linecap='round' stroke-linejoin='round' d='M5 13l4 4L19 7'/></svg>");
    background-repeat: no-repeat;
    background-position: center;
  }

  .sv-format-btn {
    padding: 12px 20px;
    border-radius: 999px;
    background: transparent;
    color: #fff; font-weight: 700; font-size: 0.82rem;
    letter-spacing: 0.02em;
    border: 1px solid rgba(255,255,255,0.2);
    cursor: pointer; font-family: inherit;
    text-decoration: none; text-align: center;
    transition: all 0.3s ease;
  }
  .sv-format-btn:hover { background: rgba(255,255,255,0.08); transform: translateY(-2px); }
  .sv-format-card.featured .sv-format-btn {
    background: #06b6d4; color: #000; border-color: #06b6d4;
  }
  .sv-format-card.featured .sv-format-btn:hover {
    box-shadow: 0 20px 40px -10px rgba(6,182,212,0.5);
  }

  /* FAQ */
  .sv-faq {
    padding: 6rem 2rem;
    max-width: 900px; margin: 0 auto;
  }
  .sv-faq-item {
    border-bottom: 1px solid rgba(255,255,255,0.08);
    padding: 1.5rem 0;
    cursor: pointer;
  }
  .sv-faq-q {
    display: flex; justify-content: space-between; align-items: center;
    gap: 1rem;
  }
  .sv-faq-q h3 {
    font-size: 1.05rem; font-weight: 700;
    color: #fff; letter-spacing: -0.01em;
    transition: color 0.3s ease;
  }
  .sv-faq-item:hover .sv-faq-q h3 { color: #06b6d4; }
  .sv-faq-toggle {
    width: 28px; height: 28px; flex-shrink: 0;
    position: relative;
    transition: transform 0.4s cubic-bezier(0.34,1.56,0.64,1);
  }
  .sv-faq-toggle::before, .sv-faq-toggle::after {
    content: '';
    position: absolute; top: 50%; left: 50%;
    background: rgba(255,255,255,0.6);
    transition: background 0.3s ease;
  }
  .sv-faq-toggle::before {
    width: 14px; height: 1.5px;
    transform: translate(-50%, -50%);
  }
  .sv-faq-toggle::after {
    width: 1.5px; height: 14px;
    transform: translate(-50%, -50%);
  }
  .sv-faq-item.open .sv-faq-toggle { transform: rotate(135deg); }
  .sv-faq-item.open .sv-faq-toggle::before,
  .sv-faq-item.open .sv-faq-toggle::after { background: #06b6d4; }

  .sv-faq-a {
    max-height: 0; overflow: hidden;
    transition: max-height 0.5s ease, margin-top 0.4s ease;
  }
  .sv-faq-item.open .sv-faq-a {
    max-height: 400px;
    margin-top: 1rem;
  }
  .sv-faq-a p {
    font-size: 0.92rem; color: rgba(255,255,255,0.6);
    line-height: 1.6;
  }

  /* CTA FINAL */
  .sv-cta { padding: 7rem 2rem; text-align: center; position: relative; overflow: hidden; }
  .sv-cta::before {
    content:''; position: absolute; inset: 0;
    background: radial-gradient(ellipse at center, rgba(139,92,246,0.12) 0%, rgba(6,182,212,0.06) 40%, transparent 70%);
    pointer-events: none;
  }
  .sv-cta-inner { position: relative; z-index: 2; max-width: 820px; margin: 0 auto; }
  .sv-cta h2 {
    font-size: clamp(2.2rem,5vw,4rem);
    font-weight: 700; line-height: 1.05;
    letter-spacing: -0.02em; margin-bottom: 1.2rem;
  }
  .sv-cta p {
    color: rgba(255,255,255,0.55);
    font-size: 1.1rem; max-width: 560px;
    margin: 0 auto 2.5rem; line-height: 1.6;
  }
  .sv-cta-btns {
    display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap;
  }
  .sv-cta-btn {
    display: inline-flex; align-items: center; gap: 10px;
    padding: 14px 28px; border-radius: 999px;
    font-weight: 700; font-size: 0.9rem;
    letter-spacing: 0.02em;
    text-decoration: none; font-family: inherit;
    transition: all 0.3s cubic-bezier(0.23,1,0.32,1);
  }
  .sv-cta-primary { background: #06b6d4; color: #000; }
  .sv-cta-primary:hover { transform: translateY(-3px) scale(1.03); box-shadow: 0 20px 40px -10px rgba(6,182,212,0.5); }
  .sv-cta-ghost {
    background: transparent; color: #fff;
    border: 1px solid rgba(255,255,255,0.2);
  }
  .sv-cta-ghost:hover { background: rgba(255,255,255,0.06); transform: translateY(-3px); }

/* OVERLAY */
.modal-overlay{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.65);
    backdrop-filter:blur(4px);

    display:flex;
    justify-content:center;
    align-items:flex-start;

    overflow-y: auto;

    opacity:0;
    visibility:hidden;

    transition:all .35s ease;
    z-index:999;
}

/* ACTIVO */
.modal-overlay.active{
    opacity:1;
    visibility:visible;
}

/* MODAL */
.modal{
    width:100%;
    max-width:100%;
    background: rgba(0,0,0,.95);
    border-radius:20px;
    padding:50px;
    position:relative;
    overflow-y: auto;
    transform:translateY(40px) scale(.95);
    opacity:0;
    min-height: 300px;
    transition:all .35s ease;
}

/* ENTRADA */
.modal-overlay.active .modal{
    transform:translateY(0) scale(1);
    opacity:1;
}

/* BOTÓN CERRAR */
.close-modal{
    position:absolute;
    top:15px;
    right:18px;
    font-size:24px;
    cursor:pointer;
    color:#666;
    transition:.3s;
}

.close-modal:hover{
    color:#000;
    transform:rotate(90deg);
}

/* CONTENIDO */
.modal h1{
  font-size:clamp(2rem,4.5vw,3.4rem);
    margin-bottom:15px;
    color:#fff;
    line-height: 1;
    letter-spacing: -0.03em;
    text-align: center;
}
.modal .nos-hero-inner h1{
  font-size: clamp(2.6rem, 7vw, 5.8rem);
}

.modal p.subtitle{
    line-height:1.6;
    color:#fff;
    margin-bottom:20px;
    margin-top: 20px;
    text-align: center;
}

.modal button{
    padding:12px 20px;
    border:none;
    border-radius:30px;
    background:#06b6d4;
    color:#000;
    cursor:pointer;
    transition:.3s;
    float: right;
    position: absolute;
    right: 30px;
}

.modal button:hover{
    opacity:.9;
}

  .pf-impact { padding:6rem 2rem; max-width:1280px; margin:0 auto; }
  .pf-impact-grid {
    display: flex;
    justify-content: center;
    flex-flow: wrap;
    gap:1.2rem;
  }
  .pf-impact-card {
    width: 20%;
    padding:2rem 1.8rem;
    border-radius:20px;
    background:rgba(255,255,255,0.025);
    border:1px solid rgba(255,255,255,0.08);
    position:relative; overflow:hidden;
    transition:all 0.5s cubic-bezier(0.23,1,0.32,1);
  }
  .pf-impact-card::before {
    content:''; position:absolute;
    top:-50%; right:-50%; width:200px; height:200px;
    border-radius:50%;
    background:radial-gradient(circle, var(--imp-glow) 0%, transparent 60%);
    opacity:0.08; transition:opacity 0.5s ease;
  }
  .pf-impact-card:hover { transform:translateY(-6px); border-color:rgba(255,255,255,0.15); }
  .pf-impact-card:hover::before { opacity:0.2; }
  .pf-impact-icon {
    width:44px; height:44px; border-radius:12px;
    background:var(--imp-bg);
    display:flex; align-items:center; justify-content:center;
    margin-bottom:1rem; position:relative; z-index:2;
  }
  .pf-impact-num {
    font-size:1.6rem; font-weight:700; line-height:1;
    letter-spacing:-0.03em; margin-bottom:0.4rem;
    position:relative; z-index:2;
  }
  .pf-impact-label {
    font-size:0.78rem; color:rgba(255,255,255,0.7);
    font-weight:500; margin-bottom:0.3rem;
    position:relative; z-index:2;
  }
  .pf-impact-sub {
    font-size:0.7rem; color:rgba(255,255,255,0.4);
    letter-spacing:0.08em; position:relative; z-index:2;
  }
  .pf-section-head { text-align:center; max-width:1200px; margin:0 auto 3rem; padding:0 2rem; }
  .pf-section-head h2 { font-size:clamp(2rem,4.5vw,3.4rem); font-weight:700; line-height:1.1; letter-spacing:-0.02em; }
  .pf-section-head p { color:rgba(255,255,255,0.5); font-size:1rem; margin-top:1rem; max-width:580px; margin-left:auto; margin-right:auto; line-height:1.6; }
  .pf-eyebrow {
    display:inline-block; padding:5px 18px; border-radius:999px;
    border:1px solid rgba(6,182,212,0.35); background:rgba(6,182,212,0.08);
    color:#06b6d4; font-size:10px; letter-spacing:0.25em;
    text-transform:uppercase; margin-bottom:1.2rem; font-weight:500;
  }
   .pf-gradient {
    background:linear-gradient(135deg,#667eea,#764ba2,#f093fb,#4facfe,#00f2fe);
    background-size:300% 300%;
    -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
    animation:pfGs 8s ease infinite;
  }