:root{
  --bg: #f5f7fb;
  --text: #0c0f14;
  --muted: #4b5563;
  --card: #ffffff;

  --accent: #872FF5;
  --cta: #FF006E;

  --g-one:    linear-gradient(180deg,#2647ff 0%, #6a2cff 100%);
  --g-pro:    linear-gradient(180deg,#ff6a3d 0%, #ff3980 100%);
  --g-web:    linear-gradient(180deg,#ffad33 0%, #ff6a00 100%);
  --g-custom: linear-gradient(180deg,#0bb5b6 0%, #0b6f92 100%);
  --g-one-top:    linear-gradient(180deg,#2647ff 0%, #6a2cff 100%);
  --g-pro-top:    linear-gradient(180deg,#ff6a3d 0%, #ff3980 100%);
  --g-web-top:    linear-gradient(180deg,#ffad33 0%, #ff6a00 100%);
  --g-custom-top: linear-gradient(180deg,#0bb5b6 0%, #0b6f92 100%);

  --btn:       linear-gradient(180deg,#ff3e8a 0%, #d62185 100%);
  --btn-grad:  var(--btn);

  --chip-bg:   #ffd24d;
  --chip-text: #0c0f14;

  --ahorro:        #16a34a;
  --ahorro-bg:     #f0fff4;
  --ahorro-bg2:    #e6fcf0;
  --ahorro-strong: #148a3e;

  --shadow:        0 22px 48px rgba(15, 23, 42, 0.20);
  --shadow-base:   0 10px 30px rgba(0, 0, 0, 0.05);
  --shadow-active: 0 15px 40px rgba(0, 0, 0, 0.15);
  --radius: 22px;
  --rail-color: rgba(12,15,20,.12);
  --rail-dot: #fff;
  --flashH: 56px;
  --announcementH: 0px;

  /* Colores de resaltado (no neón) */
  --hl-1:#4A3CFF;
  --hl-2:#7C3BFF;
  --hl-3:#FF4F7A;
  --hl-4:#FF7A3C;
  --hl-5:#FF8A00;
  --hl-6:#FFBD2E;
  --hl-7:#00A887;
  --hl-8:#2CC7C0;
}

*{ box-sizing:border-box; }
html,body{
  margin:0; padding:0;
  font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;
  color:var(--text); background:var(--bg);
  overflow-x:hidden;
}
.sr-only{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

.announcement-bar{
  position:sticky;
  top:0;
  z-index:80;
  background:linear-gradient(115deg,#160c2d 0%,#2d1557 40%,#872ff5 100%);
  color:#fff;
  border-bottom:1px solid rgba(255,255,255,0.18);
  box-shadow:0 12px 28px rgba(12,15,20,0.26);
}
.announcement-bar__inner{
  max-width:1180px;
  margin:0 auto;
  padding:10px 20px;
  display:flex;
  align-items:center;
  gap:18px;
  flex-wrap:wrap;
}
.flash-countdown{
  display:flex;
  align-items:center;
  gap:10px;
  font-weight:700;
  text-transform:uppercase;
  font-size:12px;
  letter-spacing:0.14em;
}
.flash-countdown__values{
  display:flex;
  gap:8px;
}
.flash-countdown__value{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:6px 8px;
  min-width:46px;
  background:rgba(255,255,255,0.16);
  border:1px solid rgba(255,255,255,0.25);
  border-radius:12px;
  box-shadow:0 10px 18px rgba(12,15,20,0.25);
}
.flash-countdown__value strong{
  font-size:18px;
  line-height:1;
}
.flash-countdown__value small{
  font-size:11px;
  letter-spacing:0.1em;
  opacity:0.85;
}
.flash-rotator{
  flex:1;
  min-width:220px;
  overflow:hidden;
  display:flex;
  align-items:center;
  height:var(--flash-rotator-h, auto);
}
.flash-rotator__track{
  display:flex;
  flex-direction:column;
  gap:4px;
  width:100%;
}
.flash-rotator__item{
  display:flex;
  align-items:center;
  gap:6px;
  font-weight:600;
  letter-spacing:0.02em;
  color:#fff;
  opacity:0.45;
  transition:opacity .3s ease;
  white-space:nowrap;
  overflow:hidden;
  width:100%;
  position:relative;
  padding:3px 0;
}
.flash-rotator__item strong{
  font-weight:800;
}
.flash-rotator__item[data-active="true"]{
  opacity:1;
}
.flash-rotator__item[data-marquee="true"]{
  will-change:transform;
}
.flash-rotator__item[data-active="true"][data-marquee="true"]{
  animation:flash-marquee var(--flash-marquee-duration, 8s) linear infinite;
}
@keyframes flash-marquee{
  0%{
    transform:translateX(0);
  }
  12%{
    transform:translateX(0);
  }
  88%{
    transform:translateX(calc(-1 * var(--flash-marquee-distance, 0px)));
  }
  100%{
    transform:translateX(calc(-1 * var(--flash-marquee-distance, 0px)));
  }
}
.flash-cta{
  border:1px solid rgba(255,255,255,0.75);
  background:rgba(255,255,255,0.14);
  color:#fff;
  padding:12px 24px;
  border-radius:999px;
  font-weight:800;
  letter-spacing:0.08em;
  text-transform:uppercase;
  cursor:pointer;
  transition:background .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.flash-cta:hover,
.flash-cta:focus-visible{
  background:#fff;
  color:#1b0f2d;
  transform:translateY(-1px);
  box-shadow:0 18px 30px rgba(0,0,0,0.25);
}
.site-header{
  position:sticky;
  top:0;
  z-index:60;
  backdrop-filter:blur(18px);
  background:rgba(245,247,251,0.92);
  border-bottom:1px solid rgba(12,15,20,0.05);
  box-shadow:0 8px 30px rgba(12,15,20,0.08);
}
.site-header__inner{
  max-width:1180px;
  margin:0 auto;
  padding:16px 20px;
  display:flex;
  align-items:center;
  gap:24px;
}
.site-header__inner > .brand{
  order:1;
}
.site-header__inner > .site-nav{
  order:2;
  flex:1;
  min-width:0;
}
.site-header__inner > .header-actions{
  order:3;
  margin-left:32px;
}
.site-header__inner > .header-toggle{
  order:4;
}
.brand{
  display:flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
  color:var(--text);
  font-weight:900;
  letter-spacing:0.08em;
}
.brand__icon{
  width:34px;
  height:34px;
  filter:drop-shadow(0 12px 22px rgba(12,15,20,0.22));
}
.brand__text{
  display:flex;
  flex-direction:column;
  line-height:1;
}
.brand__name{
  font-size:14px;
}
.brand__tag{
  font-size:11px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:0.2em;
  color:var(--muted);
}
.site-nav{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:28px;
}
.header-actions{
  display:flex;
  align-items:center;
  gap:12px;
  margin-left:32px;
}
.header-actions .header-cta{
  box-shadow:0 16px 30px rgba(255,0,110,0.3);
}
.header-cta__note{
  font-size:12px;
  color:var(--muted);
  display:inline-flex;
  align-items:center;
  gap:6px;
  white-space:nowrap;
}
.nav__links{
  display:flex;
  align-items:center;
  gap:20px;
}
.nav__links a{
  text-decoration:none;
  font-weight:600;
  color:var(--muted);
  position:relative;
  padding:4px 0;
  transition:color .2s ease;
}
.nav__links a::after{
  content:'';
  position:absolute;
  left:0;
  bottom:0;
  width:100%;
  height:2px;
  background:var(--accent);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .2s ease;
}
.nav__links a:hover,
.nav__links a:focus{
  color:var(--text);
}
.nav__links a:hover::after,
.nav__links a:focus::after{
  transform:scaleX(1);
}
.header-cta{
  box-shadow:0 16px 30px rgba(255,0,110,0.3);
  white-space:nowrap;
}
.header-toggle{
  display:none;
  width:46px;
  height:46px;
  border-radius:14px;
  border:1px solid rgba(12,15,20,0.12);
  background:#fff;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:box-shadow .2s ease, transform .2s ease;
}
.header-toggle:hover{
  box-shadow:0 12px 24px rgba(0,0,0,0.12);
  transform:translateY(-1px);
}
.header-toggle__bars{
  position:relative;
  width:20px;
  height:2px;
  background:var(--text);
  border-radius:999px;
}
.header-toggle__bars::before,
.header-toggle__bars::after{
  content:'';
  position:absolute;
  left:0;
  width:20px;
  height:2px;
  background:var(--text);
  border-radius:999px;
}
.header-toggle__bars::before{
  top:-6px;
}
.header-toggle__bars::after{
  top:6px;
}
.header-toggle[aria-expanded="true"] .header-toggle__bars{
  background:transparent;
}
.header-toggle[aria-expanded="true"] .header-toggle__bars::before{
  transform:translateY(6px) rotate(45deg);
}
.header-toggle[aria-expanded="true"] .header-toggle__bars::after{
  transform:translateY(-6px) rotate(-45deg);
}

@media (max-width: 820px){
  .site-header__inner{
    padding:10px 14px;
    flex-wrap:wrap;
    gap:10px;
  }
  .header-toggle{
    display:flex;
    order:2;
    margin-left:auto;
    width:46px;
    height:46px;
  }
  .site-nav{
    order:5;
    flex:none;
    width:auto;
    position:fixed;
    left:16px;
    right:16px;
    top:calc(var(--flashH,56px) + 64px);
    flex-direction:column;
    gap:16px;
    background:#fff;
    border-radius:24px;
    border:1px solid rgba(12,15,20,0.08);
    box-shadow:0 32px 70px rgba(12,15,20,0.24);
    padding:20px;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(-10px);
    transition:opacity .25s ease, transform .25s ease;
  }
  .site-nav[data-open="true"]{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translateY(0);
  }
  .header-actions{
    order:4;
    width:auto;
    justify-content:flex-end;
    margin:0;
    margin-left:0;
    display:none;
  }
  .header-cta__note{
    display:none;
  }
  .header-actions .header-cta{
    flex:1;
    margin-right:10px;
  }
  .nav__links{
    flex-direction:column;
    align-items:flex-start;
    width:100%;
  }
  .nav__links a{
    font-size:16px;
  }
  .header-cta{
    width:100%;
    justify-content:center;
  }
  .nav__ctaBlock{
    flex-direction:column;
    width:100%;
    gap:12px;
  }
  .auth-actions{
    width:100%;
    flex-direction:column;
  }
  .auth-btn{
    width:100%;
  }
}

@media (max-width: 640px){
  .announcement-bar__inner{
    flex-direction:column;
    align-items:flex-start;
  }
  .flash-rotator{
    width:100%;
  }
  .flash-cta{
    width:100%;
    text-align:center;
  }
}




[data-animate]{
  opacity:0;
  transform:translate3d(0,28px,0);
  transition:opacity .6s cubic-bezier(.2,.7,.2,1), transform .6s cubic-bezier(.2,.7,.2,1);
  transition-delay:var(--delay,0s);
  will-change:opacity,transform;
}
[data-animate="fade-left"]{ transform:translate3d(-34px,0,0); }
[data-animate="fade-right"]{ transform:translate3d(34px,0,0); }
[data-animate="scale"]{ transform:translate3d(0,20px,0) scale(.96); }
[data-animate].is-visible{
  opacity:1;
  transform:translate3d(0,0,0);
}

@media (prefers-reduced-motion: reduce){
  [data-animate]{
    opacity:1 !important;
    transform:none !important;
    transition:none !important;
  }
  .social-proof__logos span,
  .services__cta-pill,
  .services__cta-metric{ animation:none !important; }
  .hero__bgGrid,
  .tools__marquee-track,
  .flash-rotator__track{ animation:none !important; transition:none !important; }
}

.chip--outline{
  display:inline-flex; align-items:center; gap:6px;
  background:rgba(135,47,245,0.12); color:var(--accent);
  border:1px solid rgba(135,47,245,0.25); border-radius:999px;
  padding:6px 14px; font-weight:700; font-size:12px; letter-spacing:.12em;
  text-transform:uppercase;
}

.social-proof{
  max-width:1180px; margin:20px auto 48px; padding:0 20px;
  display:grid; gap:36px;
}
.social-proof__head h2{
  margin:12px 0 14px; font-size:clamp(28px,5vw,42px);
  line-height:1.05; font-weight:900; letter-spacing:-0.02em;
}
.social-proof__head p{
  margin:0; max-width:640px; color:var(--muted); line-height:1.6;
}

.social-proof__metrics{
  display:grid; gap:18px;
  grid-template-columns:repeat(auto-fit, minmax(220px,1fr));
}
.metric-card{
  background:var(--card); border:1px solid rgba(12,15,20,0.08);
  border-radius:18px; padding:26px;
  box-shadow:var(--shadow-base);
  position:relative; overflow:hidden;
  text-align:center;
  transition:transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s cubic-bezier(.2,.7,.2,1), border-color .35s ease;
}
.metric-card::after{
  content:''; position:absolute; inset:0;
  background:radial-gradient(circle at top right, rgba(135,47,245,0.18), transparent 65%);
  opacity:0; pointer-events:none;
  transition:opacity .35s ease;
}
.metric-card:hover,
.metric-card:focus-within{
  transform:translateY(-8px);
  box-shadow:0 22px 44px rgba(15,23,42,0.18);
  border-color:rgba(135,47,245,0.28);
}
.metric-card:hover::after,
.metric-card:focus-within::after{ opacity:1; }
.metric-card__value{
  display:block;
  font-size:44px;
  font-weight:900;
  color:#d62185;
  margin-bottom:10px;
  transition:color .35s ease;
}
.metric-card:hover .metric-card__value,
.metric-card:focus-within .metric-card__value{ color:var(--accent); }
.metric-card__label{
  margin:0; color:var(--muted); line-height:1.5; font-size:15px;
}

.social-proof__logos{
  display:flex; flex-wrap:wrap; gap:18px;
  align-items:center; justify-content:space-between;
  background:linear-gradient(100deg,rgba(135,47,245,0.1),rgba(255,0,110,0.12));
  border:1px solid rgba(12,15,20,0.08); border-radius:20px;
  padding:24px 28px; box-shadow:0 18px 32px rgba(12,15,20,0.12);
}
.social-proof__logos span{
  font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:rgba(12,15,20,0.72); font-size:13px;
  padding:10px 18px; border-radius:999px;
  background:rgba(255,255,255,0.45);
  box-shadow:0 12px 22px rgba(15,23,42,0.12);
  transition:transform .35s cubic-bezier(.2,.7,.2,1), background .35s ease, color .35s ease, box-shadow .35s ease;
  animation:pillFloat 6s ease-in-out infinite;
  animation-delay:var(--delay,0s);
}
.social-proof__logos span:hover,
.social-proof__logos span:focus{
  transform:translateY(-6px) scale(1.03);
  background:#ffffff;
  color:var(--text);
  box-shadow:0 18px 36px rgba(15,23,42,0.18);
  animation-play-state:paused;
}
.social-proof__logos span:nth-child(2n){ animation-duration:7.2s; }
.social-proof__logos span:nth-child(3n){ animation-duration:5.6s; }

@keyframes pillFloat{
  0%,100%{ transform:translateY(0); }
  50%{ transform:translateY(-6px); }
}

.trust-belt{
  margin:28px auto 18px;
  background:linear-gradient(90deg, rgba(255,255,255,0.95), rgba(245,244,255,0.95));
  border-radius:24px;
  box-shadow:0 18px 42px rgba(15,23,42,0.14);
  padding:14px;
  overflow:hidden;
  border:1px solid rgba(12,15,20,0.06);
  max-width:1180px;
  width:calc(100% - 40px);
}
.trust-belt__track{
  display:flex;
  gap:12px;
  align-items:center;
  width:max-content;
  animation: beltScroll 40s linear infinite;
}
.trust-belt__logo{
  aspect-ratio:16/9;
  min-height:60px;
  border-radius:16px;
  background:rgba(255,255,255,0.9);
  border:1px dashed rgba(12,15,20,0.15);
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.8);
  padding:8px 12px;
}
.trust-belt__logo img{
  max-height:100%;
  max-width:100%;
  object-fit:contain;
  display:block;
}
.trust-belt:hover .trust-belt__track{ animation-play-state:paused; }

@keyframes beltScroll{
  from { transform:translateX(0); }
  to   { transform:translateX(-50%); }
}

.social-proof__quotes{ position:relative; margin-top:32px; }
.testimonial-carousel{
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:12px;
  align-items:center;
  position:relative;
  padding:0 72px;
}
.ts-viewport{
  overflow:hidden;
  border-radius:24px;
  position:relative;
  mask-image:linear-gradient(90deg, transparent 0%, #000 8%, #000 92%, transparent 100%);
  cursor:grab;
}
.ts-viewport.is-dragging{ cursor:grabbing; }
.ts-track{
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:minmax(340px, min(520px, 88vw));
  gap:22px;
  padding:18px 14px;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  align-items:stretch;
}
.ts-track::-webkit-scrollbar{ display:none; }
.ts-nav{
  width:48px; height:48px; border-radius:50%;
  border:none; background:var(--btn); color:#fff;
  box-shadow:0 14px 36px rgba(214,33,133,0.28);
  display:inline-flex; align-items:center; justify-content:center;
  cursor:pointer; transition:transform .2s ease, box-shadow .2s ease, background .2s ease;
  position:absolute; top:50%; transform:translateY(-50%);
  z-index:2;
}
.ts-nav:hover,
.ts-nav:focus-visible{
  transform:translateY(calc(-50% - 2px));
  box-shadow:0 18px 42px rgba(214,33,133,0.34);
  background:linear-gradient(135deg, #ff3e8a, #d62185);
}
.ts-nav--prev{ left:10px; }
.ts-nav--next{ right:10px; }
.ts-dots{
  display:flex; gap:10px; justify-content:center; margin-top:16px;
}
.ts-dot{
  width:12px; height:12px; border-radius:50%;
  border:1px solid rgba(12,15,20,0.28);
  background:rgba(255,255,255,0.9);
  transition:transform .2s ease, background .2s ease, border-color .2s ease;
}
.ts-dot.is-active{
  background:var(--btn);
  border-color:transparent;
  transform:scale(1.12);
}

.cta-belt{
  margin:24px auto 0;
  padding:16px 18px;
  border-radius:16px;
  background:linear-gradient(135deg, #ff4da3, #d62185);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  font-weight:800;
  letter-spacing:0.01em;
  box-shadow:0 18px 32px rgba(214,33,133,0.25);
}
.cta-belt__btn{
  border:none;
  background:#fff;
  color:#d62185;
  font-weight:900;
  border-radius:12px;
  padding:10px 14px;
  cursor:pointer;
  box-shadow:0 10px 22px rgba(0,0,0,0.12);
  transition:transform .18s ease, box-shadow .18s ease;
}
.cta-belt__btn:hover,
.cta-belt__btn:focus-visible{
  transform:translateY(-1px);
  box-shadow:0 14px 26px rgba(0,0,0,0.18);
}

/* Override metric numbers size/color */
.metric-card__value{
  font-size:44px;
  color:#d62185;
}

.quote-card{
  background:var(--card); border-radius:18px;
  padding:56px 30px 30px; border:1px solid rgba(12,15,20,0.08);
  box-shadow:0 18px 36px rgba(15,23,42,0.14);
  display:flex; flex-direction:column; gap:20px; position:relative;
  transition:transform .4s cubic-bezier(.2,.7,.2,1), box-shadow .4s cubic-bezier(.2,.7,.2,1), border-color .4s ease;
  will-change:transform, box-shadow;
  scroll-snap-align:start;
}
.quote-card::before{
  content:'“'; position:absolute; top:18px; left:24px;
  font-size:52px; color:rgba(135,47,245,0.2); font-weight:800;
  pointer-events:none;
}
.quote-card:hover,
.quote-card:focus-within{
  transform:translateY(-8px) scale(1.005);
  box-shadow:0 26px 50px rgba(15,23,42,0.18);
  border-color:rgba(135,47,245,0.28);
}
.quote-card blockquote{
  margin:0; color:#1a1a1a; line-height:1.6; font-size:16px;
  font-weight:500;
  position:relative;
}
.quote-highlight{
  font-weight:800;
  font-size:17px;
  color:var(--quote-neon, #10e0c3);
  text-shadow:
    0 0 2px rgba(0,0,0,0.35),
    0 0 6px color-mix(in srgb, var(--quote-neon, #10e0c3) 65%, transparent),
    0 0 12px color-mix(in srgb, var(--quote-neon, #10e0c3) 38%, transparent);
  letter-spacing:0.01em;
}
.quote-highlight--mint{ --quote-neon:#16f2c8; }
.quote-highlight--aqua{ --quote-neon:#35d0ff; }
.quote-highlight--pink{ --quote-neon:#ff4da3; }
.quote-highlight--lime{ --quote-neon:#b6ff4d; }
.quote-card blockquote::after{
  content:''; position:absolute; left:0; bottom:-12px;
  width:72px; height:2px;
  background:linear-gradient(90deg, rgba(135,47,245,0.4), rgba(255,0,110,0.4));
  opacity:.6;
}
.quote-card__meta{ margin-top:auto; }
.quote-card__rating{
  position:absolute; top:12px; right:12px;
  display:inline-flex; align-items:center; gap:8px;
  padding:5px 9px;
  background:rgba(255,255,255,0.9);
  border:1px solid rgba(12,15,20,0.06);
  border-radius:999px;
  box-shadow:0 10px 22px rgba(15,23,42,0.12);
  backdrop-filter:blur(5px);
}
.quote-card__stars{
  display:flex; gap:4px; color:#0fb268;
}
.quote-card__stars i{ font-size:13px; }
.quote-card__score{
  font-size:12px; font-weight:800; letter-spacing:.06em;
  text-transform:uppercase; color:rgba(12,15,20,0.6);
}
.quote-card figcaption{
  display:flex; flex-direction:column; gap:12px;
}
.quote-card strong{
  font-weight:800; color:#0f172a;
}
.quote-card__author span{
  font-size:13px; color:#3f4855; text-transform:uppercase;
  letter-spacing:.08em;
}
.quote-card__author{
  display:flex;
  align-items:center;
  gap:16px;
}
.quote-card__avatar{
  width:72px;
  height:72px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
}
.quote-card__avatar img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
}

@media(max-width:680px){
  .social-proof__logos{ justify-content:center; }
  .testimonial-carousel{ grid-template-columns:1fr; row-gap:12px; padding:0 18px; }
  .ts-track{
    grid-auto-columns:minmax(260px, calc(100vw - 66px));
    gap:16px;
    padding:14px 10px;
  }
  .ts-viewport{ mask-image:none; }
  .ts-nav{ width:44px; height:44px; top:50%; transform:translateY(-50%); }
  .ts-nav--prev{ left:-6px; }
  .ts-nav--next{ right:-6px; }
  .ts-dots{ flex-wrap:wrap; padding:0 6px; margin-top:12px; }
}

.how-flow{
  max-width:1180px; margin:48px auto 56px; padding:0 20px;
}
.how__head h2{
  margin:0; font-weight:900; font-size:clamp(28px,5vw,44px);
  line-height:1.05; letter-spacing:-0.02em;
}
.how__head p{ margin:8px 0 14px; color:var(--muted); max-width:720px; }

.how__badges{ display:flex; flex-wrap:wrap; gap:10px; margin-top:6px; }
.badge{
  display:inline-flex; align-items:center; gap:6px;
  background:var(--card); color:var(--text);
  padding:8px 12px; border-radius:999px;
  border:1px solid rgba(12,15,20,.06);
  box-shadow:0 5px 15px rgba(0,0,0,0.05);
  font-weight:600;
}
.badge b{ font-weight:800; color:var(--accent); }

.flow__grid{
  display:grid; grid-template-columns:220px 1fr; gap:36px; margin-top:40px;
}

.flow__rail{ position:relative; padding:10px 0; display:flex; justify-content:center; }
.flow__rail::before{
  content:''; width:4px; border-radius:4px; background:var(--rail-color);
  position:absolute; top:0; bottom:0;
}
.rail__dots{
  position:relative; height:100%; display:grid; grid-template-rows:repeat(4,1fr);
  justify-items:center; width:100%;
}
.flow__rail .dot{
  width:16px; height:16px; border-radius:50%;
  background:var(--rail-dot); border:3px solid var(--rail-color);
  box-shadow:0 4px 8px rgba(0,0,0,0.1); transition:all .25s ease; position:relative; z-index:5;
}
.flow__rail .dot.is-active{ border-color:var(--rail-dot); box-shadow:0 0 0 4px rgba(255,255,255,.4); }
.flow__rail .dot--one.is-active   { background:#2647ff; }
.flow__rail .dot--pro.is-active   { background:#ff6a3d; }
.flow__rail .dot--web.is-active   { background:#ffad33; }
.flow__rail .dot--custom.is-active{ background:#0bb5b6; }

.flow__steps{ display:grid; gap:28px; }
.step{
  background:var(--card); border:1px solid rgba(12,15,20,.08);
  border-radius:18px; box-shadow:var(--shadow-base); padding:24px;
  transition: all .3s cubic-bezier(.2,.7,.2,1); outline:none;
}
.step:hover{ transform: translateY(-4px); box-shadow:0 12px 28px rgba(0,0,0,0.1); }
.step.is-active{ border-color:var(--accent); box-shadow:0 15px 40px rgba(135,47,245,0.15); background:#fff; transform: scale(1.02); }
.step__top{ display:flex; align-items:center; gap:15px; margin-bottom:8px; }
.step__top h3{ margin:0; font-size:20px; font-weight:900; }

.how-flow .chip{
  display:inline-flex; align-items:center; justify-content:center;
  width:38px; height:38px; border-radius:50%; color:#fff; font-weight:900;
  box-shadow:0 8px 18px rgba(0,0,0,.2); font-size:16px;
}
.how-flow .chip--one   { background: var(--g-one); }
.how-flow .chip--pro   { background: var(--g-pro); }
.how-flow .chip--web   { background: var(--g-web); }
.how-flow .chip--custom{ background: var(--g-custom); }

.step p{ margin:0 0 12px; color:var(--muted); line-height:1.5; }
.step__list{ margin:0; padding-left:0; list-style:none; display:grid; gap:8px; }
.step__list li{ position:relative; padding-left:18px; font-size:15px; color:var(--text); opacity:.9; }
.step__list li::before{ content:"✓"; position:absolute; left:0; top:0; color:var(--accent); font-weight:800; }

.how__cta{ display:flex; justify-content:center; margin-top:40px; }
.btn-flow-cta{
  border:0; color:#fff; font-weight:800; letter-spacing:.05em; border-radius:999px;
  padding:16px 30px; cursor:pointer; background: var(--btn-grad);
  box-shadow: 0 14px 26px rgba(214,33,133,.35); text-decoration:none;
  transition: transform .2s ease, box-shadow .2s ease;
}
.btn-flow-cta:hover{ transform: translateY(-2px); box-shadow:0 18px 34px rgba(214,33,133,.40); }

@media (max-width:900px){
  .flow__grid{ grid-template-columns:1fr; }
  .flow__rail{ display:none; }
  .flow__steps{ gap:20px; }
}

.portfolio{
  max-width:1180px; margin:36px auto 56px; padding:0 20px;
  display:grid; gap:24px;
}
.portfolio__head h2{
  margin:12px 0 14px; font-size:clamp(28px,5vw,42px);
  line-height:1.05; font-weight:900;
}
.portfolio__head p{
  margin:0; max-width:620px; color:var(--muted); line-height:1.6;
}
.portfolio__carousel{ position:relative; overflow:hidden; }
.portfolio__viewport{ overflow:hidden; }
.portfolio__track{
  display:flex;
  gap:16px;
  padding:6px;
  touch-action:pan-y;
  user-select:none;
  -webkit-user-drag:none;
  will-change:transform;
}
.pf-card{
  min-width:260px;
  max-width:320px;
  flex:0 0 280px;
  background:var(--pf-card-grad,#fff);
  border:0;
  border-radius:22px;
  padding:10px;
  box-shadow:0 18px 45px rgba(15,23,42,0.2);
  display:grid;
  grid-template-rows:auto 1fr auto;
  cursor:grab;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  position:relative;
}
.pf-card:active{ cursor:grabbing; }
.pf-card:hover{ transform:translateY(-6px); box-shadow:0 20px 50px rgba(15,23,42,0.24); }
.pf-card::before{
  content:"";
  position:absolute;
  inset:4px;
  border-radius:18px;
  background:linear-gradient(180deg,rgba(255,255,255,0.06),rgba(0,0,0,0.05));
  pointer-events:none;
  z-index:0;
}
.pf-card > *{ position:relative; z-index:1; }
.pf-card__preview{
  height:220px;
  background:#fff;
  border-radius:16px;
  overflow:hidden;
  margin:8px 12px 12px 12px;
  box-shadow:0 12px 28px rgba(15,23,42,0.14);
  position:relative;
}
.pf-card__preview img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.pf-card__preview iframe{
  width:100%;
  height:100%;
  border:0;
  background:#fff;
  pointer-events:none;
  transform:scale(1.02);
  transform-origin:top left;
}
.pf-card__preview--image img{
  object-position:top center;
}
.pf-card__preview > *{
  border-radius:12px;
  overflow:hidden;
}
.pf-band{
  padding:12px 16px 10px;
  font-weight:800;
  font-size:15px;
  color:#fff;
  border-radius:16px 16px 12px 12px;
  letter-spacing:0.03em;
}
.pf-card:nth-child(4n+1){ --pf-card-grad:linear-gradient(135deg,#4A3CFF,#7C3BFF); }
.pf-card:nth-child(4n+2){ --pf-card-grad:linear-gradient(135deg,#FF4F7A,#FF7A3C); }
.pf-card:nth-child(4n+3){ --pf-card-grad:linear-gradient(135deg,#FF8A00,#FFBD2E); }
.pf-card:nth-child(4n+4){ --pf-card-grad:linear-gradient(135deg,#00A887,#2CC7C0); }
.pf-card:nth-child(4n+1) .pf-band{ background:linear-gradient(135deg,#4A3CFF,#7C3BFF); }
.pf-card:nth-child(4n+2) .pf-band{ background:linear-gradient(135deg,#FF4F7A,#FF7A3C); }
.pf-card:nth-child(4n+3) .pf-band{ background:linear-gradient(135deg,#FF8A00,#FFBD2E); color:#0c0f14; }
.pf-card:nth-child(4n+4) .pf-band{ background:linear-gradient(135deg,#00A887,#2CC7C0); color:#0c0f14; }
.pf-card__meta{
  padding:10px 14px 14px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:0;
  position:relative;
  background:var(--pf-meta-bg,#fff);
  color:#0c0f14;
  border-top:0;
  border-radius:14px;
  margin:8px 8px 6px 8px;
}
.pf-card:nth-child(4n+1) .pf-card__meta{ --pf-meta-bg:linear-gradient(135deg,#4A3CFF,#7C3BFF); color:#fff; }
.pf-card:nth-child(4n+2) .pf-card__meta{ --pf-meta-bg:linear-gradient(135deg,#FF4F7A,#FF7A3C); color:#fff; }
.pf-card:nth-child(4n+3) .pf-card__meta{ --pf-meta-bg:linear-gradient(135deg,#FF8A00,#FFBD2E); color:#0c0f14; }
.pf-card:nth-child(4n+4) .pf-card__meta{ --pf-meta-bg:linear-gradient(135deg,#00A887,#2CC7C0); color:#0c0f14; }
.pf-tag{
  display:none;
}
.pf-open{
  border:0;
  background:rgba(255,255,255,0.18);
  color:#fff;
  border-radius:12px;
  padding:8px 12px;
  font-weight:800;
  cursor:pointer;
  transition:transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
  box-shadow:0 8px 18px rgba(0,0,0,0.12);
}
.pf-open:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 22px rgba(255,0,149,0.28);
}
.pf-open--pill{
  position:absolute;
  left:50%;
  bottom:12px;
  transform:translateX(-50%);
  background:var(--btn);
  color:#fff;
  padding:12px 18px;
  border-radius:999px;
  box-shadow:0 14px 28px rgba(214,33,133,0.28);
}
.pf-open--pill:hover,
.pf-open--pill:focus-visible{
  box-shadow:0 18px 34px rgba(214,33,133,0.32);
  transform:translateX(-50%) translateY(-1px);
}
.pf-controls{
  position:absolute;
  inset:0;
  pointer-events:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 6px;
}
.pf-nav{
  width:34px;
  height:34px;
  border-radius:50%;
  border:0;
  background:var(--btn);
  color:#fff;
  font-size:18px;
  cursor:pointer;
  pointer-events:auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 12px 26px rgba(214,33,133,0.3);
  transition:transform .15s ease, opacity .15s ease, box-shadow .15s ease;
}
.pf-nav:hover{
  transform:translateY(-2px);
  opacity:0.95;
  box-shadow:0 16px 30px rgba(214,33,133,0.35);
}
.pf-dots{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:10px;
  margin-top:10px;
}
.pf-dot{
  width:10px;
  height:10px;
  border-radius:50%;
  border:1px solid rgba(12,15,20,0.25);
  background:rgba(255,255,255,0.9);
  cursor:pointer;
  transition:transform .2s ease, background .2s ease, border-color .2s ease;
}
.pf-dot.is-active{
  background:var(--btn);
  border-color:transparent;
  transform:scale(1.12);
}

.pf-modals{ position:relative; z-index:50; }
.pf-modal{ position:fixed; inset:0; display:flex; align-items:center; justify-content:center; z-index:1200; }
.pf-modal-open .pf-modal{ z-index:2000; }
.pf-modal-open .top-countdown,
.pf-modal-open .cookie-banner{
  display:none !important;
}
.pf-modal[hidden]{ display:none !important; }
.pf-modal__overlay{ position:absolute; inset:0; background:rgba(12,15,20,0.75); }
.pf-modal__content{
  position:relative;
  width:min(1024px, 92vw);
  height:min(720px, 80vh);
  background:#f7f9fc;
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 18px 34px rgba(0,0,0,0.2);
  border:1px solid #dce3f0;
  display:flex;
  flex-direction:column;
}
.pf-modal__close{
  position:absolute;
  top:12px;
  right:12px;
  width:30px;
  height:30px;
  border-radius:50%;
  border:0;
  background:#e2e8f4;
  color:#1c2736;
  font-size:18px;
  cursor:pointer;
  z-index:2;
  transition:transform .2s ease, opacity .2s ease;
}
.pf-modal__close:hover{ transform:scale(1.05); opacity:0.9; }
.pf-modal__chrome{
  display:flex;
  align-items:center;
  gap:12px;
  padding:12px 16px;
  background:#eef2f8;
  border-bottom:1px solid #dce3f0;
}
.pf-lights{
  display:flex;
  align-items:center;
  gap:8px;
}
.pf-chrome__middle{
  flex:1;
  min-width:0;
  display:flex;
  justify-content:center;
}
.pf-light{
  width:12px;
  height:12px;
  border-radius:50%;
  display:inline-block;
  box-shadow:0 0 0 1px rgba(0,0,0,0.08);
}
.pf-light--red{ background:#ff5f57; }
.pf-light--yellow{ background:#febc2e; }
.pf-light--green{ background:#28c840; }
.pf-url{
  color:#1c2736;
  font-size:13px;
  background:#fff;
  padding:6px 12px;
  border-radius:10px;
  border:1px solid #dce3f0;
  min-width:60%;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  text-align:center;
}
.pf-modal__frame{
  flex:1;
  background:#fff;
}
.pf-modal__frame iframe{
  border:0;
  width:100%;
  height:100%;
  background:#fff;
  box-shadow:none;
}
.pf-social{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:12px;
}

@media (max-width:820px){
  .pf-card{ flex:0 0 240px; min-width:240px; }
  .pf-modal__content{ width:96vw; height:72vh; }
}

.services{
  max-width:1180px; margin:36px auto 60px; padding:0 20px;
  display:grid; gap:34px;
}
.services__head h2{
  margin:12px 0 14px; font-size:clamp(28px,5vw,42px);
  line-height:1.06; font-weight:900;
}
.services__head p{
  margin:0; max-width:620px; color:var(--muted); line-height:1.6;
}
.services__layout{
  display:grid; gap:28px; grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);
  align-items:stretch;
}
.services__grid{
  display:grid; gap:22px;
}
.service-card{
  --icon-bg:rgba(11,181,182,0.14);
  --icon-color:#0bb5b6;
  background:var(--card); border-radius:22px;
  padding:28px; border:1px solid rgba(12,15,20,0.08);
  box-shadow:var(--shadow-base); display:grid; gap:14px;
  position:relative; overflow:hidden;
  transition:transform .4s cubic-bezier(.2,.7,.2,1), box-shadow .4s cubic-bezier(.2,.7,.2,1), border-color .4s ease;
  will-change:transform, box-shadow;
}
.service-card::before{
  content:''; position:absolute; inset:0;
  background:linear-gradient(135deg, rgba(11,181,182,0.16), transparent 60%);
  opacity:0; transition:opacity .4s ease;
  pointer-events:none;
}
.service-card:hover,
.service-card:focus-within{
  transform:translateY(-10px);
  box-shadow:0 24px 48px rgba(15,23,42,0.2);
  border-color:rgba(11,181,182,0.28);
}
.service-card:hover::before,
.service-card:focus-within::before{ opacity:1; }
.service-card__icon{
  width:48px; height:48px;
  border-radius:16px;
  background:var(--icon-bg);
  color:var(--icon-color);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:20px;
  box-shadow:0 14px 28px rgba(14,118,145,0.16);
}
.service-card__icon i{line-height:1;}
.service-card h3{
  margin:0; font-size:20px; font-weight:900;
}
.service-card p{
  margin:0; color:var(--muted); line-height:1.55;
}
.service-card ul{
  margin:0; padding-left:0; list-style:none; display:grid; gap:8px;
}
.service-card li{
  position:relative; padding-left:18px; font-size:15px; color:var(--text);
}
.service-card li::before{
  content:"✓"; position:absolute; left:0; top:0;
  color:#0bb5b6; font-weight:800;
}

.services__cta{
  background:linear-gradient(190deg,rgba(38,71,255,0.95) 0%, rgba(106,44,255,0.9) 65%, rgba(135,47,245,0.85) 100%);
  color:#f8fafc; border-radius:24px; padding:36px;
  display:grid; gap:24px; border:1px solid rgba(255,255,255,0.24);
  box-shadow:0 28px 46px rgba(24,32,56,0.35);
  position:relative; overflow:hidden;
  transition:transform .45s cubic-bezier(.18,.72,.24,1), box-shadow .45s cubic-bezier(.18,.72,.24,1);
}
.services__cta::after{
  content:''; position:absolute; inset:-40% 20% auto;
  height:160%; background:linear-gradient(120deg, rgba(255,255,255,0.35) 0%, rgba(255,255,255,0) 60%);
  opacity:0; transform:translateX(-40%);
  transition:opacity .45s ease, transform .45s ease;
  pointer-events:none;
}
.services__cta:hover,
.services__cta:focus-within{
  transform:translateY(-12px);
  box-shadow:0 34px 58px rgba(24,32,56,0.42);
}
.services__cta:hover::after,
.services__cta:focus-within::after{
  opacity:1;
  transform:translateX(0);
}
.services__badge{
  display:inline-flex; align-items:center; gap:6px;
  padding:6px 12px; border-radius:999px;
  background:rgba(255,255,255,0.18); color:#ffd24d;
  font-size:11px; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  border:1px solid rgba(255,255,255,0.3);
}
.services__cta-head{
  display:grid; gap:14px;
}
.services__cta-head h3{
  margin:0; font-size:22px; font-weight:900;
}
.services__cta-head p{
  margin:0; color:rgba(248,250,252,0.88); max-width:340px; line-height:1.6; font-size:15px;
}
.services__cta-visual{
  position:relative;
  border-radius:26px;
  background:rgba(12,11,30,0.35);
  padding:24px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  box-shadow:0 22px 48px rgba(10,8,30,0.5);
  backdrop-filter:blur(12px);
  min-height:220px;
}
.services__cta-glass{
  width:100%;
  max-width:320px;
  border-radius:20px;
  background:rgba(255,255,255,0.08);
  border:1px solid rgba(255,255,255,0.18);
  padding:16px;
  box-shadow:0 18px 36px rgba(8,8,20,0.45);
}
.services__cta-glass img{
  width:100%;
  display:block;
  border-radius:14px;
  box-shadow:0 24px 36px rgba(5,6,24,0.4);
}
.services__cta-pill,
.services__cta-metric{
  position:absolute;
  display:flex;
  flex-direction:column;
  gap:2px;
  padding:10px 14px;
  border-radius:16px;
  font-size:12px;
  backdrop-filter:blur(12px);
  background:rgba(9,9,20,0.55);
  border:1px solid rgba(255,255,255,0.18);
  box-shadow:0 12px 28px rgba(7,6,22,0.5);
  animation:pillFloat 9s ease-in-out infinite;
}
.services__cta-pill{
  top:22px;
  left:22px;
  color:#fff;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.services__cta-pill strong{
  font-size:13px;
  letter-spacing:normal;
  text-transform:none;
}
.services__cta-metric{
  bottom:22px;
  right:22px;
  animation-delay:1.6s;
  color:#ffd24d;
  text-align:right;
}
.services__cta-metric strong{
  font-size:22px;
  line-height:1;
  color:#fff;
}
.services__cta-metric span{
  color:rgba(255,255,255,0.78);
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.services__cta ul{
  margin:0; padding-left:0; list-style:none; display:grid; gap:12px;
}
.services__cta li{
  position:relative; padding-left:22px; font-size:15px; line-height:1.7;
}
.services__cta li::before{
  content:"✓"; position:absolute; left:0; top:2px;
  color:#ffd24d; font-weight:800; font-size:16px;
}
.services__cta-actions{
  display:grid; gap:10px; align-items:flex-start;
}
.services__cta-note{
  font-size:13px; color:rgba(248,250,252,0.8);
}
.services__cta .btn--cta{
  background:linear-gradient(135deg,#ffd24d 0%, #ffb347 100%);
  color:#0c0f14;
  display:inline-flex; align-items:center; gap:10px;
  padding:14px 26px; border-radius:18px;
  box-shadow:0 16px 28px rgba(255,176,55,0.32);
  text-decoration:none;
  transition:transform .28s cubic-bezier(.2,.7,.2,1), box-shadow .28s cubic-bezier(.2,.7,.2,1);
}
.services__cta .btn--cta::after{ display:none; }
.services__cta .btn--cta svg{
  width:18px; height:18px; fill:currentColor;
  transition:transform .28s cubic-bezier(.2,.7,.2,1);
}
.services__cta .btn--cta:hover,
.services__cta .btn--cta:focus{
  transform:translateY(-4px);
  box-shadow:0 22px 34px rgba(255,176,55,0.42);
}
.services__cta .btn--cta:hover svg,
.services__cta .btn--cta:focus svg{
  transform:translateX(4px);
}

@media(max-width:960px){
  .services__layout{ grid-template-columns:1fr; }
  .services__cta{ order:-1; }
  .services__cta-visual{
    min-height:200px;
  }
}

.guarantee{
  max-width:1180px;
  margin:40px auto 56px;
  padding:0 20px;
}
.guarantee__inner{
  background:linear-gradient(120deg,rgba(255,255,255,0.95),rgba(247,244,255,0.96));
  border-radius:32px;
  border:1px solid rgba(12,15,20,0.05);
  box-shadow:0 30px 60px rgba(12,15,20,0.12);
  padding:40px;
  display:grid;
  gap:28px;
}
.guarantee__head h2{
  margin:12px 0 10px;
  font-size:clamp(30px,4.6vw,46px);
  line-height:1.05;
}
.guarantee__head p{
  margin:0;
  color:var(--muted);
  max-width:640px;
}
.guarantee__grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:18px;
}
.guarantee-card{
  background:#fff;
  border-radius:22px;
  border:1px solid rgba(12,15,20,0.08);
  padding:22px;
  box-shadow:0 18px 34px rgba(12,15,20,0.08);
  position:relative;
}
.guarantee-card h3{
  margin:0 0 10px;
  font-size:20px;
  font-weight:800;
}
.guarantee-card::after{
  content:'';
  position:absolute;
  inset:0;
  border-radius:22px;
  padding:1px;
  background:linear-gradient(140deg,#872ff5,#ff3e8a,#0bb5b6);
  mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  mask-composite:exclude;
  pointer-events:none;
  opacity:0;
  transition:opacity .3s ease;
}
.guarantee-card:hover::after,
.guarantee-card:focus-within::after{
  opacity:1;
}
.guarantee__cta{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
}
.guarantee__cta .btn,
.guarantee__cta .btn-outline{
  flex:1;
  min-width:220px;
}
@media(max-width:720px){
  .guarantee__inner{ padding:30px 22px; }
  .guarantee__cta{
    flex-direction:column;
  }
}

.tools{
  max-width:1180px; margin:20px auto 56px; padding:0 20px;
  display:grid; gap:40px;
}
.tools__head h2{
  margin:12px 0 14px; font-size:clamp(28px,5vw,42px);
  line-height:1.05; font-weight:900;
}
.tools__head p{
  margin:0; max-width:680px; color:var(--muted); line-height:1.6;
}
.tools__grid{
  display:grid; gap:22px;
  grid-template-columns:repeat(auto-fit, minmax(260px,1fr));
}
.tool-card{
  --icon-bg:rgba(135,47,245,0.12);
  --icon-color:#872ff5;
  background:linear-gradient(160deg, rgba(255,255,255,0.92) 0%, rgba(245,247,251,0.98) 100%);
  border-radius:22px;
  padding:28px;
  border:1px solid rgba(12,15,20,0.06);
  box-shadow:0 20px 40px rgba(15,23,42,0.12);
  display:grid; gap:14px;
  position:relative; overflow:hidden;
  transition:transform .4s cubic-bezier(.2,.7,.2,1), box-shadow .4s ease, border-color .4s ease;
}
.tool-card::after{
  content:''; position:absolute; inset:-40% -20% auto;
  height:70%; background:radial-gradient(circle, rgba(135,47,245,0.28) 0%, transparent 70%);
  opacity:0; transition:opacity .45s ease, transform .45s ease;
}
.tool-card:hover,
.tool-card:focus-within{
  transform:translateY(-10px);
  box-shadow:0 28px 56px rgba(15,23,42,0.18);
  border-color:rgba(135,47,245,0.25);
}
.tool-card:hover::after,
.tool-card:focus-within::after{
  opacity:1;
  transform:translateY(12px);
}
.tool-card__icon{
  width:48px; height:48px;
  border-radius:16px;
  background:var(--icon-bg);
  color:var(--icon-color);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:20px;
  box-shadow:0 12px 24px rgba(15,23,42,0.18);
}
.tool-card__icon i{line-height:1;}
.tool-card h3{
  margin:0; font-size:20px; font-weight:900;
}
.tool-card p{
  margin:0; color:var(--muted); line-height:1.55;
}
.tool-card ul{
  margin:0; padding-left:0; list-style:none; display:grid; gap:6px;
  font-weight:600; color:var(--text);
}
.tool-card li{
  position:relative; padding-left:18px;
}
.tool-card li::before{
  content:'•'; position:absolute; left:0; top:0; color:var(--accent);
}

.tools__ticker{
  background:rgba(255,255,255,0.9);
  border-radius:32px;
  padding:16px 22px 16px 18px;
  display:flex;
  align-items:center;
  gap:18px;
  box-shadow:0 22px 48px rgba(15,23,42,0.12);
  border:1px solid rgba(12,15,20,0.08);
  overflow:hidden;
}
.tools__badge{
  font-size:11px; font-weight:800; letter-spacing:.18em; text-transform:uppercase;
  color:#fff;
  background:linear-gradient(120deg,#475569,#1f2937);
  border-radius:999px;
  padding:10px 18px;
  display:inline-flex; align-items:center; gap:8px;
  flex-shrink:0;
  box-shadow:0 10px 22px rgba(15,23,42,0.2);
}
.tools__badge::after{
  content:'›';
  font-size:12px; opacity:.65;
}
.tools__marquee{
  position:relative; flex:1;
  overflow:hidden;
}
.tools__marquee::before,
.tools__marquee::after{
  content:''; position:absolute; top:0; bottom:0; width:60px;
  pointer-events:none; z-index:2;
}
.tools__marquee::before{
  left:0;
  background:linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
}
.tools__marquee::after{
  right:0;
  background:linear-gradient(270deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
}
.tools__marquee-track{
  display:flex; align-items:center; gap:48px;
  padding:10px 0;
  min-width:100%;
  animation:toolsMarquee 16s linear infinite;
  text-transform:uppercase;
  letter-spacing:.18em;
  font-weight:700;
  color:rgba(12,15,20,0.46);
}
.tools__marquee:hover .tools__marquee-track{
  animation-play-state:paused;
}
.tools__marquee span{
  white-space:nowrap;
  transition:color .2s ease;
}
.tools__marquee span:hover{
  color:rgba(12,15,20,0.72);
}

@keyframes toolsMarquee{
  0%{ transform:translateX(0); }
  100%{ transform:translateX(-100%); }
}

@media(max-width:640px){
  .tools__ticker{ padding:14px 18px; gap:14px; }
  .tools__badge{ letter-spacing:.14em; padding:8px 14px; }
  .tools__marquee-track{ gap:28px; font-size:12px; }
}

.pricing-wrap{
  max-width:1180px;
  margin:48px auto 56px;
  padding:0 20px;
}
.pricing-head{
  display:grid;
  gap:14px;
  margin-bottom:6px;
}
.pricing-head h1,
.pricing-head h2{
  margin:0;
  font-size:clamp(30px,4.8vw,44px);
  line-height:1.06;
  font-weight:800;
}
.pricing-head__sub{
  margin:0;
  color:var(--muted);
  max-width:740px;
  font-size:clamp(14px,2.1vw,16.5px);
}
.toolbar{
  display:flex;
  align-items:center;
  gap:16px;
  flex-wrap:wrap;
  justify-content:flex-start;
  margin-top:10px;
}
.toggle-group{
  display:flex;
  gap:10px;
}
.toggle-btn{
  appearance:none;
  border:0;
  cursor:pointer;
  padding:12px 20px;
  border-radius:999px;
  font-weight:700;
  font-size:15px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:2px;
  background:#fff;
  color:var(--text);
  box-shadow:0 8px 20px rgba(12,15,20,.08), inset 0 0 0 2px #e5e7eb;
  transition:all .2s ease;
}
.toggle-btn span{
  font-weight:500;
  font-size:12px;
}
.toggle-btn .promo-label{
  font-weight:700;
  color:var(--ahorro-strong);
}
.toggle-btn.is-active{
  box-shadow:0 10px 26px rgba(12,15,20,.15), inset 0 0 0 2px #c7a8ff;
  transform:translateY(-1px);
}
.iva-switch{
  display:flex;
  align-items:center;
  gap:8px;
  margin-left:4px;
}
.switch{
  position:relative;
  display:inline-block;
  width:48px;
  height:26px;
}
.switch input{
  opacity:0;
  width:0;
  height:0;
}
.slider{
  position:absolute;
  cursor:pointer;
  inset:0;
  background:#e5e7eb;
  border-radius:999px;
  transition:.2s;
}
.slider::before{
  content:"";
  position:absolute;
  height:20px;
  width:20px;
  left:4px;
  top:3px;
  background:#fff;
  border-radius:50%;
  box-shadow:0 1px 3px rgba(0,0,0,.2);
  transition:.2s;
}
.switch input:checked + .slider{ background:#c7a8ff; }
.switch input:checked + .slider::before{ transform:translateX(22px); }
.iva-label{
  font-size:13.5px;
  color:var(--text);
}
.savings-hint{
  color:var(--ahorro-strong);
  font-weight:800;
  min-height:20px;
  margin-left:8px;
}
.cards{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:24px;
  margin-top:16px;
}
.card{
  background:linear-gradient(180deg,#ffffff 0%,#fafbff 100%);
  border-radius:var(--radius);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  min-height:620px;
  box-shadow:12px 16px 36px rgba(12,15,20,.12),-8px -8px 22px rgba(255,255,255,.6);
  border:1px solid rgba(12,15,20,.04);
  transition:transform .26s cubic-bezier(.2,.7,.2,1), box-shadow .26s ease, outline-offset .2s ease;
  outline:3px solid transparent;
  outline-offset:6px;
  position:relative;
}
.card:hover{
  transform:scale(1.03);
  z-index:3;
  box-shadow:0 20px 40px rgba(12,15,20,.2);
}
.card[aria-checked="true"]{
  transform:scale(1.035);
  z-index:3;
  box-shadow:0 20px 40px rgba(12,15,20,.2);
  outline:3px solid var(--card-accent, var(--accent));
  outline-offset:3px;
}
.card:focus-visible{
  outline:3px solid var(--card-accent, var(--accent));
  outline-offset:3px;
}
.is-featured .card__top{ filter:saturate(1.03); }
.is-featured[aria-checked="true"]{ transform:scale(1.045); }
.card.is-tilting{
  transform:translateZ(0) rotateX(var(--rx,0)) rotateY(var(--ry,0)) translateY(var(--ty,0));
  filter:drop-shadow(0 18px 30px rgba(0,0,0,.14));
}
.ribbon{
  position:absolute;
  top:14px;
  right:-32px;
  transform:rotate(36deg);
  background:#111;
  color:#fff;
  font-weight:800;
  letter-spacing:.02em;
  padding:8px 48px;
  font-size:12px;
  z-index:2;
  box-shadow:0 12px 18px rgba(0,0,0,.18);
}
.card__top{
  padding:24px;
  color:#fff;
  position:relative;
  isolation:isolate;
}
.card__top::after{
  content:'';
  position:absolute;
  inset:0;
  z-index:0;
  opacity:.25;
  background:linear-gradient(90deg,rgba(255,255,255,.12) 0%,rgba(0,0,0,.12) 50%,rgba(255,255,255,.12) 100%);
  mix-blend-mode:soft-light;
}
.card__top>*{ position:relative; z-index:1; }
.card--one{ --card-accent:#2647ff; }
.card--pro{ --card-accent:#ff6a3d; }
.card--webstore{ --card-accent:#ffad33; }
.card--custom{ --card-accent:#0bb5b6; }
.card--one .card__top{ background:var(--g-one-top); }
.card--pro .card__top{ background:var(--g-pro-top); }
.card--webstore .card__top{ background:var(--g-web-top); }
.card--custom .card__top{ background:var(--g-custom-top); }
.card__kicker{
  display:flex;
  align-items:center;
  gap:8px;
  opacity:.95;
}
.card__brand{
  margin:0;
  font-weight:800;
  letter-spacing:.045em;
  font-size:13px;
}
.card__tag{
  font-size:12px;
  font-weight:700;
  background:rgba(255,255,255,.16);
  padding:4px 8px;
  border-radius:999px;
}
.card__title{
  margin:6px 0 10px;
  font-size:32px;
  line-height:1;
  font-weight:800;
  display:flex;
  align-items:center;
  gap:10px;
}
.card__title span{ display:block; }
.card__title-logo{
  width:30px;
  height:30px;
  flex:0 0 30px;
  filter:drop-shadow(0 6px 14px rgba(12,15,20,.25));
}
.card__price{
  display:flex;
  align-items:baseline;
  gap:6px;
  flex-wrap:wrap;
}
.card__price .prefix{
  font-size:16px;
  font-weight:600;
  opacity:.9;
  margin-right:6px;
}
.card__price .amount{ font-size:30px; font-weight:800; }
.card__price .currency{ font-size:14px; opacity:.9; font-weight:600; }
.vat-flag{
  font-size:12px;
  font-weight:700;
  opacity:.85;
  background:rgba(255,255,255,.22);
  padding:2px 8px;
  border-radius:999px;
}
.pricing-wrap .chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:var(--chip-bg);
  color:var(--chip-text);
  border-radius:999px;
  padding:8px 14px;
  font-weight:800;
  font-size:15px;
  position:absolute;
  left:24px;
  bottom:-18px;
  box-shadow:0 12px 20px rgba(0,0,0,.18);
}
.card__body{
  padding:40px 24px 24px;
  display:flex;
  flex-direction:column;
  gap:16px;
  flex:1;
}
.card__subtitle{
  margin:12px 0 4px;
  font-weight:700;
}
.list{
  margin:0;
  padding-left:0;
  list-style:none;
  display:flex;
  flex-direction:column;
  gap:10px;
  color:#1f2937;
  font-size:14.5px;
}
.list li{
  display:flex;
  gap:10px;
  align-items:flex-start;
}
.plan-icon{
  width:32px;
  height:32px;
  flex:0 0 32px;
  border-radius:12px;
  background:rgba(135,47,245,0.15);
  color:rgba(135,47,245,1);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:15px;
  box-shadow:0 10px 20px rgba(12,15,20,0.08);
}
.plan-icon i{ line-height:1; }
.card--one .plan-icon{
  background:rgba(38,71,255,0.14);
  color:#2647ff;
}
.card--pro .plan-icon{
  background:rgba(255,106,61,0.18);
  color:#ff6a3d;
}
.card--webstore .plan-icon{
  background:rgba(255,173,51,0.18);
  color:#ff6a00;
}
.card--custom .plan-icon{
  background:rgba(11,181,182,0.18);
  color:#0b6f92;
}
.value-breakdown{
  margin-top:12px;
  margin-bottom:12px;
}
.toggle-valor{
  width:100%;
  appearance:none;
  border:0;
  text-align:left;
  cursor:pointer;
  font-weight:700;
  color:var(--ahorro);
  background:var(--ahorro-bg);
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:10px 14px;
  border-radius:8px;
  transition:background-color .2s ease,color .2s ease;
}
.toggle-valor:hover{
  background:var(--ahorro-bg2);
  color:var(--ahorro-strong);
}
.toggle-valor-label{
  font-size:14px;
  flex-grow:1;
}
.toggle-valor-amount{
  font-size:15px;
  margin-right:8px;
}
.toggle-icon{
  transition:transform .3s cubic-bezier(.2,.7,.2,1);
  flex-shrink:0;
}
.valor-items-wrapper{
  max-height:0;
  overflow:hidden;
  transition:max-height .4s ease-out,padding .4s ease-out,border .4s ease-out;
  font-size:14px;
  color:var(--muted);
  padding:0 16px;
  border:1px solid transparent;
}
.valor-item{
  display:flex;
  justify-content:space-between;
  margin-top:14px;
}
.valor-calculo{
  margin-top:16px;
  padding-top:16px;
  border-top:1px dashed rgba(12,15,20,.15);
  font-weight:600;
  color:var(--text);
}
.value-breakdown.is-open .valor-items-wrapper{
  max-height:640px;
  padding:12px 16px 16px;
  border-color:#d1f3e0;
  border-top:none;
  border-bottom-left-radius:8px;
  border-bottom-right-radius:8px;
}
.value-breakdown.is-open .toggle-icon{ transform:rotate(180deg); }
.value-breakdown.is-open .toggle-valor{
  border-bottom-left-radius:0;
  border-bottom-right-radius:0;
  background:var(--ahorro-bg2);
}
.btn--lg{
  padding:14px 22px;
}
.pricing-footnote{
  text-align:center;
  margin-top:34px;
  color:var(--muted);
  font-size:12.5px;
}
.trust{
  display:flex;
  justify-content:center;
  gap:10px;
  margin-top:20px;
  margin-bottom:12px;
  color:#1f2937;
  font-size:13px;
}
.t-sep{ opacity:.4; }
@media (max-width:1140px){
  .cards{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:620px){
  .cards{ grid-template-columns:1fr; }
  .card{
    min-height:590px;
    box-shadow:8px 10px 24px rgba(12,15,20,.10),-6px -6px 18px rgba(255,255,255,.65);
  }
  .card:hover{ transform:scale(1.02); }
  .card[aria-checked="true"]{ transform:scale(1.03); }
}
@media (prefers-reduced-motion: reduce){
  [data-animate]{
    opacity:1 !important;
    transform:none !important;
    transition:none !important;
  }
  .social-proof__logos span,
  .services__cta-pill,
  .services__cta-metric{ animation:none !important; }
  .hero__bgGrid,
  .tools__marquee-track,
  .flash-rotator__track{ animation:none !important; transition:none !important; }
}

.chip--outline{
  display:inline-flex; align-items:center; gap:6px;
  background:rgba(135,47,245,0.12); color:var(--accent);
  border:1px solid rgba(135,47,245,0.25); border-radius:999px;
  padding:6px 14px; font-weight:700; font-size:12px; letter-spacing:.12em;
  text-transform:uppercase;
}

.social-proof{
  max-width:1180px; margin:20px auto 48px; padding:0 20px;
  display:grid; gap:36px;
}
.social-proof__head h2{
  margin:12px 0 14px; font-size:clamp(28px,5vw,42px);
  line-height:1.05; font-weight:900; letter-spacing:-0.02em;
}
.social-proof__head p{
  margin:0; max-width:640px; color:var(--muted); line-height:1.6;
}

.social-proof__metrics{
  display:grid; gap:18px;
  grid-template-columns:repeat(auto-fit, minmax(220px,1fr));
}
.metric-card{
  background:var(--card); border:1px solid rgba(12,15,20,0.08);
  border-radius:18px; padding:26px;
  box-shadow:var(--shadow-base);
  position:relative; overflow:hidden;
  transition:transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s cubic-bezier(.2,.7,.2,1), border-color .35s ease;
}
.metric-card::after{
  content:''; position:absolute; inset:0;
  background:radial-gradient(circle at top right, rgba(135,47,245,0.18), transparent 65%);
  opacity:0; pointer-events:none;
  transition:opacity .35s ease;
}
.metric-card:hover,
.metric-card:focus-within{
  transform:translateY(-8px);
  box-shadow:0 22px 44px rgba(15,23,42,0.18);
  border-color:rgba(135,47,245,0.28);
}
.metric-card:hover::after,
.metric-card:focus-within::after{ opacity:1; }
.metric-card__value{
  display:block; font-size:32px; font-weight:900; color:var(--text);
  margin-bottom:10px;
  transition:color .35s ease;
}
.metric-card:hover .metric-card__value,
.metric-card:focus-within .metric-card__value{ color:var(--accent); }
.metric-card__label{
  margin:0; color:var(--muted); line-height:1.5; font-size:15px;
}

.social-proof__logos{
  display:flex; flex-wrap:wrap; gap:18px;
  align-items:center; justify-content:space-between;
  background:linear-gradient(100deg,rgba(135,47,245,0.1),rgba(255,0,110,0.12));
  border:1px solid rgba(12,15,20,0.08); border-radius:20px;
  padding:24px 28px; box-shadow:0 18px 32px rgba(12,15,20,0.12);
}
.social-proof__logos span{
  font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:rgba(12,15,20,0.72); font-size:13px;
  padding:10px 18px; border-radius:999px;
  background:rgba(255,255,255,0.45);
  box-shadow:0 12px 22px rgba(15,23,42,0.12);
  transition:transform .35s cubic-bezier(.2,.7,.2,1), background .35s ease, color .35s ease, box-shadow .35s ease;
  animation:pillFloat 6s ease-in-out infinite;
  animation-delay:var(--delay,0s);
}
.social-proof__logos span:hover,
.social-proof__logos span:focus{
  transform:translateY(-6px) scale(1.03);
  background:#ffffff;
  color:var(--text);
  box-shadow:0 18px 36px rgba(15,23,42,0.18);
  animation-play-state:paused;
}
.social-proof__logos span:nth-child(2n){ animation-duration:7.2s; }
.social-proof__logos span:nth-child(3n){ animation-duration:5.6s; }

@keyframes pillFloat{
  0%,100%{ transform:translateY(0); }
  50%{ transform:translateY(-6px); }
}


@media(max-width:680px){
  .social-proof__logos{ justify-content:center; }
}

.how-flow{
  max-width:1180px; margin:48px auto 56px; padding:0 20px;
}
.how__head h2{
  margin:0; font-weight:900; font-size:clamp(28px,5vw,44px);
  line-height:1.05; letter-spacing:-0.02em;
}
.how__head p{ margin:8px 0 14px; color:var(--muted); max-width:720px; }

.how__badges{ display:flex; flex-wrap:wrap; gap:10px; margin-top:6px; }
.badge{
  display:inline-flex; align-items:center; gap:6px;
  background:var(--card); color:var(--text);
  padding:8px 12px; border-radius:999px;
  border:1px solid rgba(12,15,20,.06);
  box-shadow:0 5px 15px rgba(0,0,0,0.05);
  font-weight:600;
}
.badge b{ font-weight:800; color:var(--accent); }

.flow__grid{
  display:grid; grid-template-columns:220px 1fr; gap:36px; margin-top:40px;
}

.flow__rail{ position:relative; padding:10px 0; display:flex; justify-content:center; }
.flow__rail::before{
  content:''; width:4px; border-radius:4px; background:var(--rail-color);
  position:absolute; top:0; bottom:0;
}
.rail__dots{
  position:relative; height:100%; display:grid; grid-template-rows:repeat(4,1fr);
  justify-items:center; width:100%;
}
.flow__rail .dot{
  width:16px; height:16px; border-radius:50%;
  background:var(--rail-dot); border:3px solid var(--rail-color);
  box-shadow:0 4px 8px rgba(0,0,0,0.1); transition:all .25s ease; position:relative; z-index:5;
}
.flow__rail .dot.is-active{ border-color:var(--rail-dot); box-shadow:0 0 0 4px rgba(255,255,255,.4); }
.flow__rail .dot--one.is-active   { background:#2647ff; }
.flow__rail .dot--pro.is-active   { background:#ff6a3d; }
.flow__rail .dot--web.is-active   { background:#ffad33; }
.flow__rail .dot--custom.is-active{ background:#0bb5b6; }

.flow__steps{ display:grid; gap:28px; }
.step{
  background:var(--card); border:1px solid rgba(12,15,20,.08);
  border-radius:18px; box-shadow:var(--shadow-base); padding:24px;
  transition: all .3s cubic-bezier(.2,.7,.2,1); outline:none;
}
.step:hover{ transform: translateY(-4px); box-shadow:0 12px 28px rgba(0,0,0,0.1); }
.step.is-active{ border-color:var(--accent); box-shadow:0 15px 40px rgba(135,47,245,0.15); background:#fff; transform: scale(1.02); }
.step__top{ display:flex; align-items:center; gap:15px; margin-bottom:8px; }
.step__top h3{ margin:0; font-size:20px; font-weight:900; }

.how-flow .chip{
  display:inline-flex; align-items:center; justify-content:center;
  width:38px; height:38px; border-radius:50%; color:#fff; font-weight:900;
  box-shadow:0 8px 18px rgba(0,0,0,.2); font-size:16px;
}
.how-flow .chip--one   { background: var(--g-one); }
.how-flow .chip--pro   { background: var(--g-pro); }
.how-flow .chip--web   { background: var(--g-web); }
.how-flow .chip--custom{ background: var(--g-custom); }

.step p{ margin:0 0 12px; color:var(--muted); line-height:1.5; }
.step__list{ margin:0; padding-left:0; list-style:none; display:grid; gap:8px; }
.step__list li{ position:relative; padding-left:18px; font-size:15px; color:var(--text); opacity:.9; }
.step__list li::before{ content:"✓"; position:absolute; left:0; top:0; color:var(--accent); font-weight:800; }

.how__cta{ display:flex; justify-content:center; margin-top:40px; }
.btn-flow-cta{
  border:0; color:#fff; font-weight:800; letter-spacing:.05em; border-radius:999px;
  padding:16px 30px; cursor:pointer; background: var(--btn-grad);
  box-shadow: 0 14px 26px rgba(214,33,133,.35); text-decoration:none;
  transition: transform .2s ease, box-shadow .2s ease;
}
.btn-flow-cta:hover{ transform: translateY(-2px); box-shadow:0 18px 34px rgba(214,33,133,.40); }

@media (max-width:900px){
  .flow__grid{ grid-template-columns:1fr; }
  .flow__rail{ display:none; }
  .flow__steps{ gap:20px; }
}

.portfolio{
  max-width:1180px; margin:36px auto 56px; padding:0 20px;
  display:grid; gap:36px;
}
.portfolio__head h2{
  margin:12px 0 14px; font-size:clamp(28px,5vw,42px);
  line-height:1.05; font-weight:900;
}
.portfolio__head p{
  margin:0; max-width:620px; color:var(--muted); line-height:1.6;
}
.portfolio__grid{
  display:grid; gap:24px;
  grid-template-columns:repeat(auto-fit, minmax(280px,1fr));
}
.portfolio-card{
  background:var(--card); border-radius:22px;
  padding:30px; display:flex; flex-direction:column; gap:20px;
  border:1px solid rgba(12,15,20,0.1); box-shadow:var(--shadow-base);
  min-height:100%;
  position:relative; overflow:hidden;
  transition:transform .4s cubic-bezier(.18,.72,.24,1), box-shadow .4s cubic-bezier(.18,.72,.24,1), border-color .4s ease;
  will-change:transform, box-shadow;
}
.portfolio-card::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(135deg, rgba(135,47,245,0.12), transparent 55%);
  opacity:0; pointer-events:none;
  transition:opacity .4s ease;
}
.portfolio-card:hover,
.portfolio-card:focus-within{
  transform:translateY(-12px);
  box-shadow:0 26px 54px rgba(15,23,42,0.22);
  border-color:rgba(135,47,245,0.28);
}
.portfolio-card:hover::after,
.portfolio-card:focus-within::after{ opacity:1; }
.portfolio-card header h3{
  margin:0 0 4px; font-size:22px; font-weight:900;
}
.portfolio-card header p{
  margin:0; color:rgba(12,15,20,0.65); font-weight:600; letter-spacing:.02em;
}
.portfolio-card ul{
  margin:0; padding-left:0; list-style:none; display:grid; gap:10px;
}
.portfolio-card li{
  position:relative; padding-left:18px; color:var(--text); line-height:1.5;
}
.portfolio-card li::before{
  content:'•'; position:absolute; left:0; top:0; color:var(--accent);
  font-size:18px; line-height:1;
}
.portfolio-card footer{
  margin-top:auto; display:flex; align-items:center; justify-content:space-between;
  gap:18px; font-size:14px;
}
.portfolio-card footer a{
  color:var(--accent); font-weight:700; text-decoration:none;
}
.portfolio-card footer a::after{
  content:'→'; display:inline-block; margin-left:6px;
  transition:transform .3s ease;
}
.portfolio-card footer a:hover,
.portfolio-card footer a:focus{
  text-decoration:none;
}
.portfolio-card footer a:hover::after,
.portfolio-card footer a:focus::after{
  transform:translateX(4px);
}
.portfolio-card .tag{
  display:inline-flex; align-items:center; gap:6px;
  padding:6px 12px; border-radius:999px;
  background:rgba(12,15,20,0.06); color:rgba(12,15,20,0.75);
  font-weight:700; font-size:12px; letter-spacing:.08em; text-transform:uppercase;
}
.portfolio-card--one{ border-top:4px solid #2647ff; }
.portfolio-card--pro{ border-top:4px solid #ff6a3d; }
.portfolio-card--web{ border-top:4px solid #ffad33; }

@media(max-width:680px){
  .portfolio{ gap:28px; }
}

.services{
  max-width:1180px; margin:36px auto 60px; padding:0 20px;
  display:grid; gap:34px;
}
.services__head h2{
  margin:12px 0 14px; font-size:clamp(28px,5vw,42px);
  line-height:1.06; font-weight:900;
}
.services__head p{
  margin:0; max-width:620px; color:var(--muted); line-height:1.6;
}
.services__layout{
  display:grid; gap:28px; grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);
  align-items:stretch;
}
.services__grid{
  display:grid; gap:22px;
}
.service-card{
  --icon-bg:rgba(11,181,182,0.14);
  --icon-color:#0bb5b6;
  background:var(--card); border-radius:22px;
  padding:28px; border:1px solid rgba(12,15,20,0.08);
  box-shadow:var(--shadow-base); display:grid; gap:14px;
  position:relative; overflow:hidden;
  transition:transform .4s cubic-bezier(.2,.7,.2,1), box-shadow .4s cubic-bezier(.2,.7,.2,1), border-color .4s ease;
  will-change:transform, box-shadow;
}
.service-card::before{
  content:''; position:absolute; inset:0;
  background:linear-gradient(135deg, rgba(11,181,182,0.16), transparent 60%);
  opacity:0; transition:opacity .4s ease;
  pointer-events:none;
}
.service-card:hover,
.service-card:focus-within{
  transform:translateY(-10px);
  box-shadow:0 24px 48px rgba(15,23,42,0.2);
  border-color:rgba(11,181,182,0.28);
}
.service-card:hover::before,
.service-card:focus-within::before{ opacity:1; }
.service-card__icon{
  width:48px; height:48px;
  border-radius:16px;
  background:var(--icon-bg);
  color:var(--icon-color);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:20px;
  box-shadow:0 14px 28px rgba(14,118,145,0.16);
}
.service-card__icon i{line-height:1;}
.service-card h3{
  margin:0; font-size:20px; font-weight:900;
}
.service-card p{
  margin:0; color:var(--muted); line-height:1.55;
}
.service-card ul{
  margin:0; padding-left:0; list-style:none; display:grid; gap:8px;
}
.service-card li{
  position:relative; padding-left:18px; font-size:15px; color:var(--text);
}
.service-card li::before{
  content:"✓"; position:absolute; left:0; top:0;
  color:#0bb5b6; font-weight:800;
}

.services__cta{
  background:linear-gradient(190deg,rgba(38,71,255,0.95) 0%, rgba(106,44,255,0.9) 65%, rgba(135,47,245,0.85) 100%);
  color:#f8fafc; border-radius:24px; padding:36px;
  display:grid; gap:24px; border:1px solid rgba(255,255,255,0.24);
  box-shadow:0 28px 46px rgba(24,32,56,0.35);
  position:relative; overflow:hidden;
  transition:transform .45s cubic-bezier(.18,.72,.24,1), box-shadow .45s cubic-bezier(.18,.72,.24,1);
}
.services__cta::after{
  content:''; position:absolute; inset:-40% 20% auto;
  height:160%; background:linear-gradient(120deg, rgba(255,255,255,0.35) 0%, rgba(255,255,255,0) 60%);
  opacity:0; transform:translateX(-40%);
  transition:opacity .45s ease, transform .45s ease;
  pointer-events:none;
}
.services__cta:hover,
.services__cta:focus-within{
  transform:translateY(-12px);
  box-shadow:0 34px 58px rgba(24,32,56,0.42);
}
.services__cta:hover::after,
.services__cta:focus-within::after{
  opacity:1;
  transform:translateX(0);
}
.services__badge{
  display:inline-flex; align-items:center; gap:6px;
  padding:6px 12px; border-radius:999px;
  background:rgba(255,255,255,0.18); color:#ffd24d;
  font-size:11px; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  border:1px solid rgba(255,255,255,0.3);
}
.services__cta-head{
  display:grid; gap:14px;
}
.services__cta-head h3{
  margin:0; font-size:22px; font-weight:900;
}
.services__cta-head p{
  margin:0; color:rgba(248,250,252,0.88); max-width:340px; line-height:1.6; font-size:15px;
}
.services__cta-visual{
  position:relative;
  border-radius:26px;
  background:rgba(12,11,30,0.35);
  padding:24px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  box-shadow:0 22px 48px rgba(10,8,30,0.5);
  backdrop-filter:blur(12px);
  min-height:220px;
}
.services__cta-glass{
  width:100%;
  max-width:320px;
  border-radius:20px;
  background:rgba(255,255,255,0.08);
  border:1px solid rgba(255,255,255,0.18);
  padding:16px;
  box-shadow:0 18px 36px rgba(8,8,20,0.45);
}
.services__cta-glass img{
  width:100%;
  display:block;
  border-radius:14px;
  box-shadow:0 24px 36px rgba(5,6,24,0.4);
}
.services__cta-pill,
.services__cta-metric{
  position:absolute;
  display:flex;
  flex-direction:column;
  gap:2px;
  padding:10px 14px;
  border-radius:16px;
  font-size:12px;
  backdrop-filter:blur(12px);
  background:rgba(9,9,20,0.55);
  border:1px solid rgba(255,255,255,0.18);
  box-shadow:0 12px 28px rgba(7,6,22,0.5);
  animation:pillFloat 9s ease-in-out infinite;
}
.services__cta-pill{
  top:22px;
  left:22px;
  color:#fff;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.services__cta-pill strong{
  font-size:13px;
  letter-spacing:normal;
  text-transform:none;
}
.services__cta-metric{
  bottom:22px;
  right:22px;
  animation-delay:1.6s;
  color:#ffd24d;
  text-align:right;
}
.services__cta-metric strong{
  font-size:22px;
  line-height:1;
  color:#fff;
}
.services__cta-metric span{
  color:rgba(255,255,255,0.78);
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.services__cta ul{
  margin:0; padding-left:0; list-style:none; display:grid; gap:12px;
}
.services__cta li{
  position:relative; padding-left:22px; font-size:15px; line-height:1.7;
}
.services__cta li::before{
  content:"✓"; position:absolute; left:0; top:2px;
  color:#ffd24d; font-weight:800; font-size:16px;
}
.services__cta-actions{
  display:grid; gap:10px; align-items:flex-start;
}
.services__cta-note{
  font-size:13px; color:rgba(248,250,252,0.8);
}
.services__cta .btn--cta{
  background:linear-gradient(135deg,#ffd24d 0%, #ffb347 100%);
  color:#0c0f14;
  display:inline-flex; align-items:center; gap:10px;
  padding:14px 26px; border-radius:18px;
  box-shadow:0 16px 28px rgba(255,176,55,0.32);
  text-decoration:none;
  transition:transform .28s cubic-bezier(.2,.7,.2,1), box-shadow .28s cubic-bezier(.2,.7,.2,1);
}
.services__cta .btn--cta::after{ display:none; }
.services__cta .btn--cta svg{
  width:18px; height:18px; fill:currentColor;
  transition:transform .28s cubic-bezier(.2,.7,.2,1);
}
.services__cta .btn--cta:hover,
.services__cta .btn--cta:focus{
  transform:translateY(-4px);
  box-shadow:0 22px 34px rgba(255,176,55,0.42);
}
.services__cta .btn--cta:hover svg,
.services__cta .btn--cta:focus svg{
  transform:translateX(4px);
}

@media(max-width:960px){
  .services__layout{ grid-template-columns:1fr; }
  .services__cta{ order:-1; }
  .services__cta-visual{
    min-height:200px;
  }
}

.guarantee{
  max-width:1180px;
  margin:40px auto 56px;
  padding:0 20px;
}
.guarantee__inner{
  background:linear-gradient(120deg,rgba(255,255,255,0.95),rgba(247,244,255,0.96));
  border-radius:32px;
  border:1px solid rgba(12,15,20,0.05);
  box-shadow:0 30px 60px rgba(12,15,20,0.12);
  padding:40px;
  display:grid;
  gap:28px;
}
.guarantee__head h2{
  margin:12px 0 10px;
  font-size:clamp(30px,4.6vw,46px);
  line-height:1.05;
}
.guarantee__head p{
  margin:0;
  color:var(--muted);
  max-width:640px;
}
.guarantee__grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:18px;
}
.guarantee-card{
  background:#fff;
  border-radius:22px;
  border:1px solid rgba(12,15,20,0.08);
  padding:22px;
  box-shadow:0 18px 34px rgba(12,15,20,0.08);
  position:relative;
}
.guarantee-card h3{
  margin:0 0 10px;
  font-size:20px;
  font-weight:800;
}
.guarantee-card::after{
  content:'';
  position:absolute;
  inset:0;
  border-radius:22px;
  padding:1px;
  background:linear-gradient(140deg,#872ff5,#ff3e8a,#0bb5b6);
  mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  mask-composite:exclude;
  pointer-events:none;
  opacity:0;
  transition:opacity .3s ease;
}
.guarantee-card:hover::after,
.guarantee-card:focus-within::after{
  opacity:1;
}
.guarantee__cta{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
}
.guarantee__cta .btn,
.guarantee__cta .btn-outline{
  flex:1;
  min-width:220px;
}
@media(max-width:720px){
  .guarantee__inner{ padding:30px 22px; }
  .guarantee__cta{
    flex-direction:column;
  }
}

.tools{
  max-width:1180px; margin:20px auto 56px; padding:0 20px;
  display:grid; gap:40px;
}
.tools__head h2{
  margin:12px 0 14px; font-size:clamp(28px,5vw,42px);
  line-height:1.05; font-weight:900;
}
.tools__head p{
  margin:0; max-width:680px; color:var(--muted); line-height:1.6;
}
.tools__grid{
  display:grid; gap:22px;
  grid-template-columns:repeat(auto-fit, minmax(260px,1fr));
}
.tool-card{
  --icon-bg:rgba(135,47,245,0.12);
  --icon-color:#872ff5;
  background:linear-gradient(160deg, rgba(255,255,255,0.92) 0%, rgba(245,247,251,0.98) 100%);
  border-radius:22px;
  padding:28px;
  border:1px solid rgba(12,15,20,0.06);
  box-shadow:0 20px 40px rgba(15,23,42,0.12);
  display:grid; gap:14px;
  position:relative; overflow:hidden;
  transition:transform .4s cubic-bezier(.2,.7,.2,1), box-shadow .4s ease, border-color .4s ease;
}
.tool-card::after{
  content:''; position:absolute; inset:-40% -20% auto;
  height:70%; background:radial-gradient(circle, rgba(135,47,245,0.28) 0%, transparent 70%);
  opacity:0; transition:opacity .45s ease, transform .45s ease;
}
.tool-card:hover,
.tool-card:focus-within{
  transform:translateY(-10px);
  box-shadow:0 28px 56px rgba(15,23,42,0.18);
  border-color:rgba(135,47,245,0.25);
}
.tool-card:hover::after,
.tool-card:focus-within::after{
  opacity:1;
  transform:translateY(12px);
}
.tool-card__icon{
  width:48px; height:48px;
  border-radius:16px;
  background:var(--icon-bg);
  color:var(--icon-color);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:20px;
  box-shadow:0 12px 24px rgba(15,23,42,0.18);
}
.tool-card__icon i{line-height:1;}
.tool-card h3{
  margin:0; font-size:20px; font-weight:900;
}
.tool-card p{
  margin:0; color:var(--muted); line-height:1.55;
}
.tool-card ul{
  margin:0; padding-left:0; list-style:none; display:grid; gap:6px;
  font-weight:600; color:var(--text);
}
.tool-card li{
  position:relative; padding-left:18px;
}
.tool-card li::before{
  content:'•'; position:absolute; left:0; top:0; color:var(--accent);
}

.tools__ticker{
  background:rgba(255,255,255,0.9);
  border-radius:32px;
  padding:16px 22px 16px 18px;
  display:flex;
  align-items:center;
  gap:18px;
  box-shadow:0 22px 48px rgba(15,23,42,0.12);
  border:1px solid rgba(12,15,20,0.08);
  overflow:hidden;
}
.tools__badge{
  font-size:11px; font-weight:800; letter-spacing:.18em; text-transform:uppercase;
  color:#fff;
  background:linear-gradient(120deg,#475569,#1f2937);
  border-radius:999px;
  padding:10px 18px;
  display:inline-flex; align-items:center; gap:8px;
  flex-shrink:0;
  box-shadow:0 10px 22px rgba(15,23,42,0.2);
}
.tools__badge::after{
  content:'›';
  font-size:12px; opacity:.65;
}
.tools__marquee{
  position:relative; flex:1;
  overflow:hidden;
}
.tools__marquee::before,
.tools__marquee::after{
  content:''; position:absolute; top:0; bottom:0; width:60px;
  pointer-events:none; z-index:2;
}
.tools__marquee::before{
  left:0;
  background:linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
}
.tools__marquee::after{
  right:0;
  background:linear-gradient(270deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
}
.tools__marquee-track{
  display:flex; align-items:center; gap:48px;
  padding:10px 0;
  min-width:100%;
  animation:toolsMarquee 16s linear infinite;
  text-transform:uppercase;
  letter-spacing:.18em;
  font-weight:700;
  color:rgba(12,15,20,0.46);
}
.tools__marquee:hover .tools__marquee-track{
  animation-play-state:paused;
}
.tools__marquee span{
  white-space:nowrap;
  transition:color .2s ease;
}
.tools__marquee span:hover{
  color:rgba(12,15,20,0.72);
}

@keyframes toolsMarquee{
  0%{ transform:translateX(0); }
  100%{ transform:translateX(-100%); }
}

@media(max-width:640px){
  .tools__ticker{ padding:14px 18px; gap:14px; }
  .tools__badge{ letter-spacing:.14em; padding:8px 14px; }
  .tools__marquee-track{ gap:28px; font-size:12px; }
}

.pricing-wrap{
  max-width:1180px;
  margin:48px auto 56px;
  padding:0 20px;
}
.pricing-head{
  display:grid;
  gap:14px;
  margin-bottom:6px;
}
.pricing-head h1,
.pricing-head h2{
  margin:0;
  font-size:clamp(30px,4.8vw,44px);
  line-height:1.06;
  font-weight:800;
}
.pricing-head__sub{
  margin:0;
  color:var(--muted);
  max-width:740px;
  font-size:clamp(14px,2.1vw,16.5px);
}
.toolbar{
  display:flex;
  align-items:center;
  gap:16px;
  flex-wrap:wrap;
  justify-content:flex-start;
  margin-top:10px;
}
.toggle-group{
  display:flex;
  gap:10px;
}
.toggle-btn{
  appearance:none;
  border:0;
  cursor:pointer;
  padding:12px 20px;
  border-radius:999px;
  font-weight:700;
  font-size:15px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:2px;
  background:#fff;
  color:var(--text);
  box-shadow:0 8px 20px rgba(12,15,20,.08), inset 0 0 0 2px #e5e7eb;
  transition:all .2s ease;
}
.toggle-btn span{
  font-weight:500;
  font-size:12px;
}
.toggle-btn .promo-label{
  font-weight:700;
  color:var(--ahorro-strong);
}
.toggle-btn.is-active{
  box-shadow:0 10px 26px rgba(12,15,20,.15), inset 0 0 0 2px #c7a8ff;
  transform:translateY(-1px);
}
.iva-switch{
  display:flex;
  align-items:center;
  gap:8px;
  margin-left:4px;
}
.switch{
  position:relative;
  display:inline-block;
  width:48px;
  height:26px;
}
.switch input{
  opacity:0;
  width:0;
  height:0;
}
.slider{
  position:absolute;
  cursor:pointer;
  inset:0;
  background:#e5e7eb;
  border-radius:999px;
  transition:.2s;
}
.slider::before{
  content:"";
  position:absolute;
  height:20px;
  width:20px;
  left:4px;
  top:3px;
  background:#fff;
  border-radius:50%;
  box-shadow:0 1px 3px rgba(0,0,0,.2);
  transition:.2s;
}
.switch input:checked + .slider{ background:#c7a8ff; }
.switch input:checked + .slider::before{ transform:translateX(22px); }
.iva-label{
  font-size:13.5px;
  color:var(--text);
}
.savings-hint{
  color:var(--ahorro-strong);
  font-weight:800;
  min-height:20px;
  margin-left:8px;
}
.cards{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:24px;
  margin-top:16px;
}
.card{
  background:linear-gradient(180deg,#ffffff 0%,#fafbff 100%);
  border-radius:var(--radius);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  min-height:620px;
  box-shadow:12px 16px 36px rgba(12,15,20,.12),-8px -8px 22px rgba(255,255,255,.6);
  border:1px solid rgba(12,15,20,.04);
  transition:transform .26s cubic-bezier(.2,.7,.2,1), box-shadow .26s ease, outline-offset .2s ease;
  outline:3px solid transparent;
  outline-offset:6px;
  position:relative;
}
.card:hover{
  transform:scale(1.03);
  z-index:3;
  box-shadow:0 20px 40px rgba(12,15,20,.2);
}
.card[aria-checked="true"]{
  transform:scale(1.035);
  z-index:3;
  box-shadow:0 20px 40px rgba(12,15,20,.2);
  outline:3px solid var(--card-accent, var(--accent));
  outline-offset:3px;
}
.card:focus-visible{
  outline:3px solid var(--card-accent, var(--accent));
  outline-offset:3px;
}
.is-featured .card__top{ filter:saturate(1.03); }
.is-featured[aria-checked="true"]{ transform:scale(1.045); }
.card.is-tilting{
  transform:translateZ(0) rotateX(var(--rx,0)) rotateY(var(--ry,0)) translateY(var(--ty,0));
  filter:drop-shadow(0 18px 30px rgba(0,0,0,.14));
}
.ribbon{
  position:absolute;
  top:14px;
  right:-32px;
  transform:rotate(36deg);
  background:#111;
  color:#fff;
  font-weight:800;
  letter-spacing:.02em;
  padding:8px 48px;
  font-size:12px;
  z-index:2;
  box-shadow:0 12px 18px rgba(0,0,0,.18);
}
.card__top{
  padding:24px;
  color:#fff;
  position:relative;
  isolation:isolate;
}
.card__top::after{
  content:'';
  position:absolute;
  inset:0;
  z-index:0;
  opacity:.25;
  background:linear-gradient(90deg,rgba(255,255,255,.12) 0%,rgba(0,0,0,.12) 50%,rgba(255,255,255,.12) 100%);
  mix-blend-mode:soft-light;
}
.card__top>*{ position:relative; z-index:1; }
.card--one{ --card-accent:#2647ff; }
.card--pro{ --card-accent:#ff6a3d; }
.card--webstore{ --card-accent:#ffad33; }
.card--custom{ --card-accent:#0bb5b6; }
.card--one .card__top{ background:var(--g-one-top); }
.card--pro .card__top{ background:var(--g-pro-top); }
.card--webstore .card__top{ background:var(--g-web-top); }
.card--custom .card__top{ background:var(--g-custom-top); }
.card__kicker{
  display:flex;
  align-items:center;
  gap:8px;
  opacity:.95;
}
.card__brand{
  margin:0;
  font-weight:800;
  letter-spacing:.045em;
  font-size:13px;
}
.card__tag{
  font-size:12px;
  font-weight:700;
  background:rgba(255,255,255,.16);
  padding:4px 8px;
  border-radius:999px;
}
.card__title{
  margin:6px 0 10px;
  font-size:32px;
  line-height:1;
  font-weight:800;
  display:flex;
  align-items:center;
  gap:10px;
}
.card__title span{ display:block; }
.card__title-logo{
  width:30px;
  height:30px;
  flex:0 0 30px;
  filter:drop-shadow(0 6px 14px rgba(12,15,20,.25));
}
.card__price{
  display:flex;
  align-items:baseline;
  gap:6px;
  flex-wrap:wrap;
}
.card__price .prefix{
  font-size:16px;
  font-weight:600;
  opacity:.9;
  margin-right:6px;
}
.card__price .amount{ font-size:30px; font-weight:800; }
.card__price .currency{ font-size:14px; opacity:.9; font-weight:600; }
.vat-flag{
  font-size:12px;
  font-weight:700;
  opacity:.85;
  background:rgba(255,255,255,.22);
  padding:2px 8px;
  border-radius:999px;
}
.pricing-wrap .chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:var(--chip-bg);
  color:var(--chip-text);
  border-radius:999px;
  padding:8px 14px;
  font-weight:800;
  font-size:15px;
  position:absolute;
  left:24px;
  bottom:-18px;
  box-shadow:0 12px 20px rgba(0,0,0,.18);
}
.card__body{
  padding:40px 24px 24px;
  display:flex;
  flex-direction:column;
  gap:16px;
  flex:1;
}
.card__subtitle{
  margin:12px 0 4px;
  font-weight:700;
}
.list{
  margin:0;
  padding-left:0;
  list-style:none;
  display:flex;
  flex-direction:column;
  gap:10px;
  color:#1f2937;
  font-size:14.5px;
}
.list li{
  display:flex;
  gap:10px;
  align-items:flex-start;
}
.i{
  width:18px;
  height:18px;
  flex:0 0 18px;
  border-radius:4px;
  background:#e8ecff;
  box-shadow:inset 0 0 0 2px rgba(12,15,20,.06);
}
.i-domain{ background:#f0fff4; }
.i-hosting{ background:#eef9ff; }
.i-seo{ background:#fff6e6; }
.i-rocket{ background:#ffe9f5; }
.i-sections{ background:#f2f7ff; }
.i-cms{ background:#f4edff; }
.i-lock,.i-ssl{ background:#e8ffef; }
.i-analytics{ background:#fff6e6; }
.i-integrations{ background:#eefcff; }
.i-support{ background:#f2f2ff; }
.i-cart{ background:#fff0f0; }
.i-payments{ background:#fff4f1; }
.i-panel{ background:#f3f4ff; }
.i-mail{ background:#f0f7ff; }
.i-discovery{ background:#f3f6ff; }
.i-ux{ background:#fbefff; }
.i-dev{ background:#f2fbff; }
.i-api{ background:#eef9ff; }
.value-breakdown{
  margin-top:12px;
  margin-bottom:12px;
}
.toggle-valor{
  width:100%;
  appearance:none;
  border:0;
  text-align:left;
  cursor:pointer;
  font-weight:700;
  color:var(--ahorro);
  background:var(--ahorro-bg);
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:10px 14px;
  border-radius:8px;
  transition:background-color .2s ease,color .2s ease;
}
.toggle-valor:hover{
  background:var(--ahorro-bg2);
  color:var(--ahorro-strong);
}
.toggle-valor-label{
  font-size:14px;
  flex-grow:1;
}
.toggle-valor-amount{
  font-size:15px;
  margin-right:8px;
}
.toggle-icon{
  transition:transform .3s cubic-bezier(.2,.7,.2,1);
  flex-shrink:0;
}
.valor-items-wrapper{
  max-height:0;
  overflow:hidden;
  transition:max-height .4s ease-out,padding .4s ease-out,border .4s ease-out;
  font-size:14px;
  color:var(--muted);
  padding:0 16px;
  border:1px solid transparent;
}
.valor-item{
  display:flex;
  justify-content:space-between;
  margin-top:14px;
}
.valor-calculo{
  margin-top:16px;
  padding-top:16px;
  border-top:1px dashed rgba(12,15,20,.15);
  font-weight:600;
  color:var(--text);
}
.value-breakdown.is-open .valor-items-wrapper{
  max-height:640px;
  padding:12px 16px 16px;
  border-color:#d1f3e0;
  border-top:none;
  border-bottom-left-radius:8px;
  border-bottom-right-radius:8px;
}
.value-breakdown.is-open .toggle-icon{ transform:rotate(180deg); }
.value-breakdown.is-open .toggle-valor{
  border-bottom-left-radius:0;
  border-bottom-right-radius:0;
  background:var(--ahorro-bg2);
}
.btn--lg{
  padding:14px 22px;
}
.pricing-footnote{
  text-align:center;
  margin-top:34px;
  color:var(--muted);
  font-size:12.5px;
}
.trust{
  display:flex;
  justify-content:center;
  gap:10px;
  margin-top:20px;
  margin-bottom:12px;
  color:#1f2937;
  font-size:13px;
}
.t-sep{ opacity:.4; }
@media (max-width:1140px){
  .cards{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:620px){
  .cards{ grid-template-columns:1fr; }
  .card{
    min-height:590px;
    box-shadow:8px 10px 24px rgba(12,15,20,.10),-6px -6px 18px rgba(255,255,255,.65);
  }
  .card:hover{ transform:scale(1.02); }
  .card[aria-checked="true"]{ transform:scale(1.03); }
}
@media (prefers-reduced-motion: reduce){
  [data-animate]{
    opacity:1 !important;
    transform:none !important;
    transition:none !important;
  }
  .social-proof__logos span,
  .services__cta-pill,
  .services__cta-metric{ animation:none !important; }
  .hero__bgGrid,
  .tools__marquee-track,
  .flash-rotator__track{ animation:none !important; transition:none !important; }
}

.chip--outline{
  display:inline-flex; align-items:center; gap:6px;
  background:rgba(135,47,245,0.12); color:var(--accent);
  border:1px solid rgba(135,47,245,0.25); border-radius:999px;
  padding:6px 14px; font-weight:700; font-size:12px; letter-spacing:.12em;
  text-transform:uppercase;
}

.social-proof{
  max-width:1180px; margin:20px auto 48px; padding:0 20px;
  display:grid; gap:36px;
}
.social-proof__head h2{
  margin:12px 0 14px; font-size:clamp(28px,5vw,42px);
  line-height:1.05; font-weight:900; letter-spacing:-0.02em;
}
.social-proof__head p{
  margin:0; max-width:640px; color:var(--muted); line-height:1.6;
}

.social-proof__metrics{
  display:grid; gap:18px;
  grid-template-columns:repeat(auto-fit, minmax(220px,1fr));
}
.metric-card{
  background:var(--card); border:1px solid rgba(12,15,20,0.08);
  border-radius:18px; padding:26px;
  box-shadow:var(--shadow-base);
  position:relative; overflow:hidden;
  transition:transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s cubic-bezier(.2,.7,.2,1), border-color .35s ease;
}
.metric-card::after{
  content:''; position:absolute; inset:0;
  background:radial-gradient(circle at top right, rgba(135,47,245,0.18), transparent 65%);
  opacity:0; pointer-events:none;
  transition:opacity .35s ease;
}
.metric-card:hover,
.metric-card:focus-within{
  transform:translateY(-8px);
  box-shadow:0 22px 44px rgba(15,23,42,0.18);
  border-color:rgba(135,47,245,0.28);
}
.metric-card:hover::after,
.metric-card:focus-within::after{ opacity:1; }
.metric-card__value{
  display:block; font-size:32px; font-weight:900; color:var(--text);
  margin-bottom:10px;
  transition:color .35s ease;
}
.metric-card:hover .metric-card__value,
.metric-card:focus-within .metric-card__value{ color:var(--accent); }
.metric-card__label{
  margin:0; color:var(--muted); line-height:1.5; font-size:15px;
}

.social-proof__logos{
  display:flex; flex-wrap:wrap; gap:18px;
  align-items:center; justify-content:space-between;
  background:linear-gradient(100deg,rgba(135,47,245,0.1),rgba(255,0,110,0.12));
  border:1px solid rgba(12,15,20,0.08); border-radius:20px;
  padding:24px 28px; box-shadow:0 18px 32px rgba(12,15,20,0.12);
}
.social-proof__logos span{
  font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:rgba(12,15,20,0.72); font-size:13px;
  padding:10px 18px; border-radius:999px;
  background:rgba(255,255,255,0.45);
  box-shadow:0 12px 22px rgba(15,23,42,0.12);
  transition:transform .35s cubic-bezier(.2,.7,.2,1), background .35s ease, color .35s ease, box-shadow .35s ease;
  animation:pillFloat 6s ease-in-out infinite;
  animation-delay:var(--delay,0s);
}
.social-proof__logos span:hover,
.social-proof__logos span:focus{
  transform:translateY(-6px) scale(1.03);
  background:#ffffff;
  color:var(--text);
  box-shadow:0 18px 36px rgba(15,23,42,0.18);
  animation-play-state:paused;
}
.social-proof__logos span:nth-child(2n){ animation-duration:7.2s; }
.social-proof__logos span:nth-child(3n){ animation-duration:5.6s; }

@keyframes pillFloat{
  0%,100%{ transform:translateY(0); }
  50%{ transform:translateY(-6px); }
}


@media(max-width:680px){
  .social-proof__logos{ justify-content:center; }
}

.how-flow{
  max-width:1180px; margin:48px auto 56px; padding:0 20px;
}
.how__head h2{
  margin:0; font-weight:900; font-size:clamp(28px,5vw,44px);
  line-height:1.05; letter-spacing:-0.02em;
}
.how__head p{ margin:8px 0 14px; color:var(--muted); max-width:720px; }

.how__badges{ display:flex; flex-wrap:wrap; gap:10px; margin-top:6px; }
.badge{
  display:inline-flex; align-items:center; gap:6px;
  background:var(--card); color:var(--text);
  padding:8px 12px; border-radius:999px;
  border:1px solid rgba(12,15,20,.06);
  box-shadow:0 5px 15px rgba(0,0,0,0.05);
  font-weight:600;
}
.badge b{ font-weight:800; color:var(--accent); }

.flow__grid{
  display:grid; grid-template-columns:220px 1fr; gap:36px; margin-top:40px;
}

.flow__rail{ position:relative; padding:10px 0; display:flex; justify-content:center; }
.flow__rail::before{
  content:''; width:4px; border-radius:4px; background:var(--rail-color);
  position:absolute; top:0; bottom:0;
}
.rail__dots{
  position:relative; height:100%; display:grid; grid-template-rows:repeat(4,1fr);
  justify-items:center; width:100%;
}
.flow__rail .dot{
  width:16px; height:16px; border-radius:50%;
  background:var(--rail-dot); border:3px solid var(--rail-color);
  box-shadow:0 4px 8px rgba(0,0,0,0.1); transition:all .25s ease; position:relative; z-index:5;
}
.flow__rail .dot.is-active{ border-color:var(--rail-dot); box-shadow:0 0 0 4px rgba(255,255,255,.4); }
.flow__rail .dot--one.is-active   { background:#2647ff; }
.flow__rail .dot--pro.is-active   { background:#ff6a3d; }
.flow__rail .dot--web.is-active   { background:#ffad33; }
.flow__rail .dot--custom.is-active{ background:#0bb5b6; }

.flow__steps{ display:grid; gap:28px; }
.step{
  background:var(--card); border:1px solid rgba(12,15,20,.08);
  border-radius:18px; box-shadow:var(--shadow-base); padding:24px;
  transition: all .3s cubic-bezier(.2,.7,.2,1); outline:none;
}
.step:hover{ transform: translateY(-4px); box-shadow:0 12px 28px rgba(0,0,0,0.1); }
.step.is-active{ border-color:var(--accent); box-shadow:0 15px 40px rgba(135,47,245,0.15); background:#fff; transform: scale(1.02); }
.step__top{ display:flex; align-items:center; gap:15px; margin-bottom:8px; }
.step__top h3{ margin:0; font-size:20px; font-weight:900; }

.how-flow .chip{
  display:inline-flex; align-items:center; justify-content:center;
  width:38px; height:38px; border-radius:50%; color:#fff; font-weight:900;
  box-shadow:0 8px 18px rgba(0,0,0,.2); font-size:16px;
}
.how-flow .chip--one   { background: var(--g-one); }
.how-flow .chip--pro   { background: var(--g-pro); }
.how-flow .chip--web   { background: var(--g-web); }
.how-flow .chip--custom{ background: var(--g-custom); }

.step p{ margin:0 0 12px; color:var(--muted); line-height:1.5; }
.step__list{ margin:0; padding-left:0; list-style:none; display:grid; gap:8px; }
.step__list li{ position:relative; padding-left:18px; font-size:15px; color:var(--text); opacity:.9; }
.step__list li::before{ content:"✓"; position:absolute; left:0; top:0; color:var(--accent); font-weight:800; }

.how__cta{ display:flex; justify-content:center; margin-top:40px; }
.btn-flow-cta{
  border:0; color:#fff; font-weight:800; letter-spacing:.05em; border-radius:999px;
  padding:16px 30px; cursor:pointer; background: var(--btn-grad);
  box-shadow: 0 14px 26px rgba(214,33,133,.35); text-decoration:none;
  transition: transform .2s ease, box-shadow .2s ease;
}
.btn-flow-cta:hover{ transform: translateY(-2px); box-shadow:0 18px 34px rgba(214,33,133,.40); }

@media (max-width:900px){
  .flow__grid{ grid-template-columns:1fr; }
  .flow__rail{ display:none; }
  .flow__steps{ gap:20px; }
}

.portfolio{
  max-width:1180px; margin:36px auto 56px; padding:0 20px;
  display:grid; gap:36px;
}
.portfolio__head h2{
  margin:12px 0 14px; font-size:clamp(28px,5vw,42px);
  line-height:1.05; font-weight:900;
}
.portfolio__head p{
  margin:0; max-width:620px; color:var(--muted); line-height:1.6;
}
.portfolio__grid{
  display:grid; gap:24px;
  grid-template-columns:repeat(auto-fit, minmax(280px,1fr));
}
.portfolio-card{
  background:var(--card); border-radius:22px;
  padding:30px; display:flex; flex-direction:column; gap:20px;
  border:1px solid rgba(12,15,20,0.1); box-shadow:var(--shadow-base);
  min-height:100%;
  position:relative; overflow:hidden;
  transition:transform .4s cubic-bezier(.18,.72,.24,1), box-shadow .4s cubic-bezier(.18,.72,.24,1), border-color .4s ease;
  will-change:transform, box-shadow;
}
.portfolio-card::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(135deg, rgba(135,47,245,0.12), transparent 55%);
  opacity:0; pointer-events:none;
  transition:opacity .4s ease;
}
.portfolio-card:hover,
.portfolio-card:focus-within{
  transform:translateY(-12px);
  box-shadow:0 26px 54px rgba(15,23,42,0.22);
  border-color:rgba(135,47,245,0.28);
}
.portfolio-card:hover::after,
.portfolio-card:focus-within::after{ opacity:1; }
.portfolio-card header h3{
  margin:0 0 4px; font-size:22px; font-weight:900;
}
.portfolio-card header p{
  margin:0; color:rgba(12,15,20,0.65); font-weight:600; letter-spacing:.02em;
}
.portfolio-card ul{
  margin:0; padding-left:0; list-style:none; display:grid; gap:10px;
}
.portfolio-card li{
  position:relative; padding-left:18px; color:var(--text); line-height:1.5;
}
.portfolio-card li::before{
  content:'•'; position:absolute; left:0; top:0; color:var(--accent);
  font-size:18px; line-height:1;
}
.portfolio-card footer{
  margin-top:auto; display:flex; align-items:center; justify-content:space-between;
  gap:18px; font-size:14px;
}
.portfolio-card footer a{
  color:var(--accent); font-weight:700; text-decoration:none;
}
.portfolio-card footer a::after{
  content:'→'; display:inline-block; margin-left:6px;
  transition:transform .3s ease;
}
.portfolio-card footer a:hover,
.portfolio-card footer a:focus{
  text-decoration:none;
}
.portfolio-card footer a:hover::after,
.portfolio-card footer a:focus::after{
  transform:translateX(4px);
}
.portfolio-card .tag{
  display:inline-flex; align-items:center; gap:6px;
  padding:6px 12px; border-radius:999px;
  background:rgba(12,15,20,0.06); color:rgba(12,15,20,0.75);
  font-weight:700; font-size:12px; letter-spacing:.08em; text-transform:uppercase;
}
.portfolio-card--one{ border-top:4px solid #2647ff; }
.portfolio-card--pro{ border-top:4px solid #ff6a3d; }
.portfolio-card--web{ border-top:4px solid #ffad33; }

@media(max-width:680px){
  .portfolio{ gap:28px; }
}

.services{
  max-width:1180px; margin:36px auto 60px; padding:0 20px;
  display:grid; gap:34px;
}
.services__head h2{
  margin:12px 0 14px; font-size:clamp(28px,5vw,42px);
  line-height:1.06; font-weight:900;
}
.services__head p{
  margin:0; max-width:620px; color:var(--muted); line-height:1.6;
}
.services__layout{
  display:grid; gap:28px; grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);
  align-items:stretch;
}
.services__grid{
  display:grid; gap:22px;
}
.service-card{
  --icon-bg:rgba(11,181,182,0.14);
  --icon-color:#0bb5b6;
  background:var(--card); border-radius:22px;
  padding:28px; border:1px solid rgba(12,15,20,0.08);
  box-shadow:var(--shadow-base); display:grid; gap:14px;
  position:relative; overflow:hidden;
  transition:transform .4s cubic-bezier(.2,.7,.2,1), box-shadow .4s cubic-bezier(.2,.7,.2,1), border-color .4s ease;
  will-change:transform, box-shadow;
}
.service-card::before{
  content:''; position:absolute; inset:0;
  background:linear-gradient(135deg, rgba(11,181,182,0.16), transparent 60%);
  opacity:0; transition:opacity .4s ease;
  pointer-events:none;
}
.service-card:hover,
.service-card:focus-within{
  transform:translateY(-10px);
  box-shadow:0 24px 48px rgba(15,23,42,0.2);
  border-color:rgba(11,181,182,0.28);
}
.service-card:hover::before,
.service-card:focus-within::before{ opacity:1; }
.service-card__icon{
  width:48px; height:48px;
  border-radius:16px;
  background:var(--icon-bg);
  color:var(--icon-color);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:20px;
  box-shadow:0 14px 28px rgba(14,118,145,0.16);
}
.service-card__icon i{line-height:1;}
.service-card h3{
  margin:0; font-size:20px; font-weight:900;
}
.service-card p{
  margin:0; color:var(--muted); line-height:1.55;
}
.service-card ul{
  margin:0; padding-left:0; list-style:none; display:grid; gap:8px;
}
.service-card li{
  position:relative; padding-left:18px; font-size:15px; color:var(--text);
}
.service-card li::before{
  content:"✓"; position:absolute; left:0; top:0;
  color:#0bb5b6; font-weight:800;
}

.services__cta{
  background:linear-gradient(190deg,rgba(38,71,255,0.95) 0%, rgba(106,44,255,0.9) 65%, rgba(135,47,245,0.85) 100%);
  color:#f8fafc; border-radius:24px; padding:36px;
  display:grid; gap:24px; border:1px solid rgba(255,255,255,0.24);
  box-shadow:0 28px 46px rgba(24,32,56,0.35);
  position:relative; overflow:hidden;
  transition:transform .45s cubic-bezier(.18,.72,.24,1), box-shadow .45s cubic-bezier(.18,.72,.24,1);
}
.services__cta::after{
  content:''; position:absolute; inset:-40% 20% auto;
  height:160%; background:linear-gradient(120deg, rgba(255,255,255,0.35) 0%, rgba(255,255,255,0) 60%);
  opacity:0; transform:translateX(-40%);
  transition:opacity .45s ease, transform .45s ease;
  pointer-events:none;
}
.services__cta:hover,
.services__cta:focus-within{
  transform:translateY(-12px);
  box-shadow:0 34px 58px rgba(24,32,56,0.42);
}
.services__cta:hover::after,
.services__cta:focus-within::after{
  opacity:1;
  transform:translateX(0);
}
.services__badge{
  display:inline-flex; align-items:center; gap:6px;
  padding:6px 12px; border-radius:999px;
  background:rgba(255,255,255,0.18); color:#ffd24d;
  font-size:11px; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  border:1px solid rgba(255,255,255,0.3);
}
.services__cta-head{
  display:grid; gap:14px;
}
.services__cta-head h3{
  margin:0; font-size:22px; font-weight:900;
}
.services__cta-head p{
  margin:0; color:rgba(248,250,252,0.88); max-width:340px; line-height:1.6; font-size:15px;
}
.services__cta-visual{
  position:relative;
  border-radius:26px;
  background:rgba(12,11,30,0.35);
  padding:24px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  box-shadow:0 22px 48px rgba(10,8,30,0.5);
  backdrop-filter:blur(12px);
  min-height:220px;
}
.services__cta-glass{
  width:100%;
  max-width:320px;
  border-radius:20px;
  background:rgba(255,255,255,0.08);
  border:1px solid rgba(255,255,255,0.18);
  padding:16px;
  box-shadow:0 18px 36px rgba(8,8,20,0.45);
}
.services__cta-glass img{
  width:100%;
  display:block;
  border-radius:14px;
  box-shadow:0 24px 36px rgba(5,6,24,0.4);
}
.services__cta-pill,
.services__cta-metric{
  position:absolute;
  display:flex;
  flex-direction:column;
  gap:2px;
  padding:10px 14px;
  border-radius:16px;
  font-size:12px;
  backdrop-filter:blur(12px);
  background:rgba(9,9,20,0.55);
  border:1px solid rgba(255,255,255,0.18);
  box-shadow:0 12px 28px rgba(7,6,22,0.5);
  animation:pillFloat 9s ease-in-out infinite;
}
.services__cta-pill{
  top:22px;
  left:22px;
  color:#fff;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.services__cta-pill strong{
  font-size:13px;
  letter-spacing:normal;
  text-transform:none;
}
.services__cta-metric{
  bottom:22px;
  right:22px;
  animation-delay:1.6s;
  color:#ffd24d;
  text-align:right;
}
.services__cta-metric strong{
  font-size:22px;
  line-height:1;
  color:#fff;
}
.services__cta-metric span{
  color:rgba(255,255,255,0.78);
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.services__cta ul{
  margin:0; padding-left:0; list-style:none; display:grid; gap:12px;
}
.services__cta li{
  position:relative; padding-left:22px; font-size:15px; line-height:1.7;
}
.services__cta li::before{
  content:"✓"; position:absolute; left:0; top:2px;
  color:#ffd24d; font-weight:800; font-size:16px;
}
.services__cta-actions{
  display:grid; gap:10px; align-items:flex-start;
}
.services__cta-note{
  font-size:13px; color:rgba(248,250,252,0.8);
}
.services__cta .btn--cta{
  background:linear-gradient(135deg,#ffd24d 0%, #ffb347 100%);
  color:#0c0f14;
  display:inline-flex; align-items:center; gap:10px;
  padding:14px 26px; border-radius:18px;
  box-shadow:0 16px 28px rgba(255,176,55,0.32);
  text-decoration:none;
  transition:transform .28s cubic-bezier(.2,.7,.2,1), box-shadow .28s cubic-bezier(.2,.7,.2,1);
}
.services__cta .btn--cta::after{ display:none; }
.services__cta .btn--cta svg{
  width:18px; height:18px; fill:currentColor;
  transition:transform .28s cubic-bezier(.2,.7,.2,1);
}
.services__cta .btn--cta:hover,
.services__cta .btn--cta:focus{
  transform:translateY(-4px);
  box-shadow:0 22px 34px rgba(255,176,55,0.42);
}
.services__cta .btn--cta:hover svg,
.services__cta .btn--cta:focus svg{
  transform:translateX(4px);
}

@media(max-width:960px){
  .services__layout{ grid-template-columns:1fr; }
  .services__cta{ order:-1; }
  .services__cta-visual{
    min-height:200px;
  }
}

.guarantee{
  max-width:1180px;
  margin:40px auto 56px;
  padding:0 20px;
}
.guarantee__inner{
  background:linear-gradient(120deg,rgba(255,255,255,0.95),rgba(247,244,255,0.96));
  border-radius:32px;
  border:1px solid rgba(12,15,20,0.05);
  box-shadow:0 30px 60px rgba(12,15,20,0.12);
  padding:40px;
  display:grid;
  gap:28px;
}
.guarantee__head h2{
  margin:12px 0 10px;
  font-size:clamp(30px,4.6vw,46px);
  line-height:1.05;
}
.guarantee__head p{
  margin:0;
  color:var(--muted);
  max-width:640px;
}
.guarantee__grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:18px;
}
.guarantee-card{
  background:#fff;
  border-radius:22px;
  border:1px solid rgba(12,15,20,0.08);
  padding:22px;
  box-shadow:0 18px 34px rgba(12,15,20,0.08);
  position:relative;
}
.guarantee-card h3{
  margin:0 0 10px;
  font-size:20px;
  font-weight:800;
}
.guarantee-card::after{
  content:'';
  position:absolute;
  inset:0;
  border-radius:22px;
  padding:1px;
  background:linear-gradient(140deg,#872ff5,#ff3e8a,#0bb5b6);
  mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  mask-composite:exclude;
  pointer-events:none;
  opacity:0;
  transition:opacity .3s ease;
}
.guarantee-card:hover::after,
.guarantee-card:focus-within::after{
  opacity:1;
}
.guarantee__cta{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
}
.guarantee__cta .btn,
.guarantee__cta .btn-outline{
  flex:1;
  min-width:220px;
}
@media(max-width:720px){
  .guarantee__inner{ padding:30px 22px; }
  .guarantee__cta{
    flex-direction:column;
  }
}

.tools{
  max-width:1180px; margin:20px auto 56px; padding:0 20px;
  display:grid; gap:40px;
}
.tools__head h2{
  margin:12px 0 14px; font-size:clamp(28px,5vw,42px);
  line-height:1.05; font-weight:900;
}
.tools__head p{
  margin:0; max-width:680px; color:var(--muted); line-height:1.6;
}
.tools__grid{
  display:grid; gap:22px;
  grid-template-columns:repeat(auto-fit, minmax(260px,1fr));
}
.tool-card{
  --icon-bg:rgba(135,47,245,0.12);
  --icon-color:#872ff5;
  background:linear-gradient(160deg, rgba(255,255,255,0.92) 0%, rgba(245,247,251,0.98) 100%);
  border-radius:22px;
  padding:28px;
  border:1px solid rgba(12,15,20,0.06);
  box-shadow:0 20px 40px rgba(15,23,42,0.12);
  display:grid; gap:14px;
  position:relative; overflow:hidden;
  transition:transform .4s cubic-bezier(.2,.7,.2,1), box-shadow .4s ease, border-color .4s ease;
}
.tool-card::after{
  content:''; position:absolute; inset:-40% -20% auto;
  height:70%; background:radial-gradient(circle, rgba(135,47,245,0.28) 0%, transparent 70%);
  opacity:0; transition:opacity .45s ease, transform .45s ease;
}
.tool-card:hover,
.tool-card:focus-within{
  transform:translateY(-10px);
  box-shadow:0 28px 56px rgba(15,23,42,0.18);
  border-color:rgba(135,47,245,0.25);
}
.tool-card:hover::after,
.tool-card:focus-within::after{
  opacity:1;
  transform:translateY(12px);
}
.tool-card__icon{
  width:48px; height:48px;
  border-radius:16px;
  background:var(--icon-bg);
  color:var(--icon-color);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:20px;
  box-shadow:0 12px 24px rgba(15,23,42,0.18);
}
.tool-card__icon i{line-height:1;}
.tool-card h3{
  margin:0; font-size:20px; font-weight:900;
}
.tool-card p{
  margin:0; color:var(--muted); line-height:1.55;
}
.tool-card ul{
  margin:0; padding-left:0; list-style:none; display:grid; gap:6px;
  font-weight:600; color:var(--text);
}
.tool-card li{
  position:relative; padding-left:18px;
}
.tool-card li::before{
  content:'•'; position:absolute; left:0; top:0; color:var(--accent);
}

.tools__ticker{
  background:rgba(255,255,255,0.9);
  border-radius:32px;
  padding:16px 22px 16px 18px;
  display:flex;
  align-items:center;
  gap:18px;
  box-shadow:0 22px 48px rgba(15,23,42,0.12);
  border:1px solid rgba(12,15,20,0.08);
  overflow:hidden;
}
.tools__badge{
  font-size:11px; font-weight:800; letter-spacing:.18em; text-transform:uppercase;
  color:#fff;
  background:linear-gradient(120deg,#475569,#1f2937);
  border-radius:999px;
  padding:10px 18px;
  display:inline-flex; align-items:center; gap:8px;
  flex-shrink:0;
  box-shadow:0 10px 22px rgba(15,23,42,0.2);
}
.tools__badge::after{
  content:'›';
  font-size:12px; opacity:.65;
}
.tools__marquee{
  position:relative; flex:1;
  overflow:hidden;
}
.tools__marquee::before,
.tools__marquee::after{
  content:''; position:absolute; top:0; bottom:0; width:60px;
  pointer-events:none; z-index:2;
}
.tools__marquee::before{
  left:0;
  background:linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
}
.tools__marquee::after{
  right:0;
  background:linear-gradient(270deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
}
.tools__marquee-track{
  display:flex; align-items:center; gap:48px;
  padding:10px 0;
  min-width:100%;
  animation:toolsMarquee 16s linear infinite;
  text-transform:uppercase;
  letter-spacing:.18em;
  font-weight:700;
  color:rgba(12,15,20,0.46);
}
.tools__marquee:hover .tools__marquee-track{
  animation-play-state:paused;
}
.tools__marquee span{
  white-space:nowrap;
  transition:color .2s ease;
}
.tools__marquee span:hover{
  color:rgba(12,15,20,0.72);
}

@keyframes toolsMarquee{
  0%{ transform:translateX(0); }
  100%{ transform:translateX(-100%); }
}

@media(max-width:640px){
  .tools__ticker{ padding:14px 18px; gap:14px; }
  .tools__badge{ letter-spacing:.14em; padding:8px 14px; }
  .tools__marquee-track{ gap:28px; font-size:12px; }
}

.pricing-wrap{
  max-width:1180px;
  margin:48px auto 56px;
  padding:0 20px;
}
.pricing-head{
  display:grid;
  gap:14px;
  margin-bottom:6px;
}
.pricing-head h1,
.pricing-head h2{
  margin:0;
  font-size:clamp(30px,4.8vw,44px);
  line-height:1.06;
  font-weight:800;
}
.pricing-head__sub{
  margin:0;
  color:var(--muted);
  max-width:740px;
  font-size:clamp(14px,2.1vw,16.5px);
}
.toolbar{
  display:flex;
  align-items:center;
  gap:16px;
  flex-wrap:wrap;
  justify-content:flex-start;
  margin-top:10px;
}
.toggle-group{
  display:flex;
  gap:10px;
}
.toggle-btn{
  appearance:none;
  border:0;
  cursor:pointer;
  padding:12px 20px;
  border-radius:999px;
  font-weight:700;
  font-size:15px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:2px;
  background:#fff;
  color:var(--text);
  box-shadow:0 8px 20px rgba(12,15,20,.08), inset 0 0 0 2px #e5e7eb;
  transition:all .2s ease;
}
.toggle-btn span{
  font-weight:500;
  font-size:12px;
}
.toggle-btn .promo-label{
  font-weight:700;
  color:var(--ahorro-strong);
}
.toggle-btn.is-active{
  box-shadow:0 10px 26px rgba(12,15,20,.15), inset 0 0 0 2px #c7a8ff;
  transform:translateY(-1px);
}
.iva-switch{
  display:flex;
  align-items:center;
  gap:8px;
  margin-left:4px;
}
.switch{
  position:relative;
  display:inline-block;
  width:48px;
  height:26px;
}
.switch input{
  opacity:0;
  width:0;
  height:0;
}
.slider{
  position:absolute;
  cursor:pointer;
  inset:0;
  background:#e5e7eb;
  border-radius:999px;
  transition:.2s;
}
.slider::before{
  content:"";
  position:absolute;
  height:20px;
  width:20px;
  left:4px;
  top:3px;
  background:#fff;
  border-radius:50%;
  box-shadow:0 1px 3px rgba(0,0,0,.2);
  transition:.2s;
}
.switch input:checked + .slider{ background:#c7a8ff; }
.switch input:checked + .slider::before{ transform:translateX(22px); }
.iva-label{
  font-size:13.5px;
  color:var(--text);
}
.savings-hint{
  color:var(--ahorro-strong);
  font-weight:800;
  min-height:20px;
  margin-left:8px;
}
.cards{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:24px;
  margin-top:16px;
}
.card{
  background:linear-gradient(180deg,#ffffff 0%,#fafbff 100%);
  border-radius:var(--radius);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  min-height:620px;
  box-shadow:12px 16px 36px rgba(12,15,20,.12),-8px -8px 22px rgba(255,255,255,.6);
  border:1px solid rgba(12,15,20,.04);
  transition:transform .26s cubic-bezier(.2,.7,.2,1), box-shadow .26s ease, outline-offset .2s ease;
  outline:3px solid transparent;
  outline-offset:6px;
  position:relative;
}
.card:hover{
  transform:scale(1.03);
  z-index:3;
  box-shadow:0 20px 40px rgba(12,15,20,.2);
}
.card[aria-checked="true"]{
  transform:scale(1.035);
  z-index:3;
  box-shadow:0 20px 40px rgba(12,15,20,.2);
  outline:3px solid var(--card-accent, var(--accent));
  outline-offset:3px;
}
.card:focus-visible{
  outline:3px solid var(--card-accent, var(--accent));
  outline-offset:3px;
}
.is-featured .card__top{ filter:saturate(1.03); }
.is-featured[aria-checked="true"]{ transform:scale(1.045); }
.card.is-tilting{
  transform:translateZ(0) rotateX(var(--rx,0)) rotateY(var(--ry,0)) translateY(var(--ty,0));
  filter:drop-shadow(0 18px 30px rgba(0,0,0,.14));
}
.ribbon{
  position:absolute;
  top:14px;
  right:-32px;
  transform:rotate(36deg);
  background:#111;
  color:#fff;
  font-weight:800;
  letter-spacing:.02em;
  padding:8px 48px;
  font-size:12px;
  z-index:2;
  box-shadow:0 12px 18px rgba(0,0,0,.18);
}
.card__top{
  padding:24px;
  color:#fff;
  position:relative;
  isolation:isolate;
}
.card__top::after{
  content:'';
  position:absolute;
  inset:0;
  z-index:0;
  opacity:.25;
  background:linear-gradient(90deg,rgba(255,255,255,.12) 0%,rgba(0,0,0,.12) 50%,rgba(255,255,255,.12) 100%);
  mix-blend-mode:soft-light;
}
.card__top>*{ position:relative; z-index:1; }
.card--one{ --card-accent:#2647ff; }
.card--pro{ --card-accent:#ff6a3d; }
.card--webstore{ --card-accent:#ffad33; }
.card--custom{ --card-accent:#0bb5b6; }
.card--one .card__top{ background:var(--g-one-top); }
.card--pro .card__top{ background:var(--g-pro-top); }
.card--webstore .card__top{ background:var(--g-web-top); }
.card--custom .card__top{ background:var(--g-custom-top); }
.card__kicker{
  display:flex;
  align-items:center;
  gap:8px;
  opacity:.95;
}
.card__brand{
  margin:0;
  font-weight:800;
  letter-spacing:.045em;
  font-size:13px;
}
.card__tag{
  font-size:12px;
  font-weight:700;
  background:rgba(255,255,255,.16);
  padding:4px 8px;
  border-radius:999px;
}
.card__title{
  margin:6px 0 10px;
  font-size:32px;
  line-height:1;
  font-weight:800;
  display:flex;
  align-items:center;
  gap:10px;
}
.card__title span{ display:block; }
.card__title-logo{
  width:30px;
  height:30px;
  flex:0 0 30px;
  filter:drop-shadow(0 6px 14px rgba(12,15,20,.25));
}
.card__price{
  display:flex;
  align-items:baseline;
  gap:6px;
  flex-wrap:wrap;
}
.card__price .prefix{
  font-size:16px;
  font-weight:600;
  opacity:.9;
  margin-right:6px;
}
.card__price .amount{ font-size:30px; font-weight:800; }
.card__price .currency{ font-size:14px; opacity:.9; font-weight:600; }
.vat-flag{
  font-size:12px;
  font-weight:700;
  opacity:.85;
  background:rgba(255,255,255,.22);
  padding:2px 8px;
  border-radius:999px;
}
.pricing-wrap .chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:var(--chip-bg);
  color:var(--chip-text);
  border-radius:999px;
  padding:8px 14px;
  font-weight:800;
  font-size:15px;
  position:absolute;
  left:24px;
  bottom:-18px;
  box-shadow:0 12px 20px rgba(0,0,0,.18);
}
.card__body{
  padding:40px 24px 24px;
  display:flex;
  flex-direction:column;
  gap:16px;
  flex:1;
}
.card__subtitle{
  margin:12px 0 4px;
  font-weight:700;
}
.list{
  margin:0;
  padding-left:0;
  list-style:none;
  display:flex;
  flex-direction:column;
  gap:10px;
  color:#1f2937;
  font-size:14.5px;
}
.list li{
  display:flex;
  gap:10px;
  align-items:flex-start;
}
.i{
  width:18px;
  height:18px;
  flex:0 0 18px;
  border-radius:4px;
  background:#e8ecff;
  box-shadow:inset 0 0 0 2px rgba(12,15,20,.06);
}
.i-domain{ background:#f0fff4; }
.i-hosting{ background:#eef9ff; }
.i-seo{ background:#fff6e6; }
.i-rocket{ background:#ffe9f5; }
.i-sections{ background:#f2f7ff; }
.i-cms{ background:#f4edff; }
.i-lock,.i-ssl{ background:#e8ffef; }
.i-analytics{ background:#fff6e6; }
.i-integrations{ background:#eefcff; }
.i-support{ background:#f2f2ff; }
.i-cart{ background:#fff0f0; }
.i-payments{ background:#fff4f1; }
.i-panel{ background:#f3f4ff; }
.i-mail{ background:#f0f7ff; }
.i-discovery{ background:#f3f6ff; }
.i-ux{ background:#fbefff; }
.i-dev{ background:#f2fbff; }
.i-api{ background:#eef9ff; }
.value-breakdown{
  margin-top:12px;
  margin-bottom:12px;
}
.toggle-valor{
  width:100%;
  appearance:none;
  border:0;
  text-align:left;
  cursor:pointer;
  font-weight:700;
  color:var(--ahorro);
  background:var(--ahorro-bg);
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:10px 14px;
  border-radius:8px;
  transition:background-color .2s ease,color .2s ease;
}
.toggle-valor:hover{
  background:var(--ahorro-bg2);
  color:var(--ahorro-strong);
}
.toggle-valor-label{
  font-size:14px;
  flex-grow:1;
}
.toggle-valor-amount{
  font-size:15px;
  margin-right:8px;
}
.toggle-icon{
  transition:transform .3s cubic-bezier(.2,.7,.2,1);
  flex-shrink:0;
}
.valor-items-wrapper{
  max-height:0;
  overflow:hidden;
  transition:max-height .4s ease-out,padding .4s ease-out,border .4s ease-out;
  font-size:14px;
  color:var(--muted);
  padding:0 16px;
  border:1px solid transparent;
}
.valor-item{
  display:flex;
  justify-content:space-between;
  margin-top:14px;
}
.valor-calculo{
  margin-top:16px;
  padding-top:16px;
  border-top:1px dashed rgba(12,15,20,.15);
  font-weight:600;
  color:var(--text);
}
.value-breakdown.is-open .valor-items-wrapper{
  max-height:640px;
  padding:12px 16px 16px;
  border-color:#d1f3e0;
  border-top:none;
  border-bottom-left-radius:8px;
  border-bottom-right-radius:8px;
}
.value-breakdown.is-open .toggle-icon{ transform:rotate(180deg); }
.value-breakdown.is-open .toggle-valor{
  border-bottom-left-radius:0;
  border-bottom-right-radius:0;
  background:var(--ahorro-bg2);
}
.btn--lg{
  padding:14px 22px;
}
.pricing-footnote{
  text-align:center;
  margin-top:34px;
  color:var(--muted);
  font-size:12.5px;
}
.trust{
  display:flex;
  justify-content:center;
  gap:10px;
  margin-top:20px;
  margin-bottom:12px;
  color:#1f2937;
  font-size:13px;
}
.t-sep{ opacity:.4; }
@media (max-width:1140px){
  .cards{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:620px){
  .cards{ grid-template-columns:1fr; }
  .card{
    min-height:590px;
    box-shadow:8px 10px 24px rgba(12,15,20,.10),-6px -6px 18px rgba(255,255,255,.65);
  }
  .card:hover{ transform:scale(1.02); }
  .card[aria-checked="true"]{ transform:scale(1.03); }
}
@media (prefers-reduced-motion: reduce){
  [data-animate]{
    opacity:1 !important;
    transform:none !important;
    transition:none !important;
  }
  .social-proof__logos span,
  .services__cta-pill,
  .services__cta-metric{ animation:none !important; }
  .hero__bgGrid,
  .tools__marquee-track,
  .flash-rotator__track{ animation:none !important; transition:none !important; }
}

.chip--outline{
  display:inline-flex; align-items:center; gap:6px;
  background:rgba(135,47,245,0.12); color:var(--accent);
  border:1px solid rgba(135,47,245,0.25); border-radius:999px;
  padding:6px 14px; font-weight:700; font-size:12px; letter-spacing:.12em;
  text-transform:uppercase;
}

.social-proof{
  max-width:1180px; margin:20px auto 48px; padding:0 20px;
  display:grid; gap:36px;
}
.social-proof__head h2{
  margin:12px 0 14px; font-size:clamp(28px,5vw,42px);
  line-height:1.05; font-weight:900; letter-spacing:-0.02em;
}
.social-proof__head p{
  margin:0; max-width:640px; color:var(--muted); line-height:1.6;
}

.social-proof__metrics{
  display:grid; gap:18px;
  grid-template-columns:repeat(auto-fit, minmax(220px,1fr));
}
.metric-card{
  background:var(--card); border:1px solid rgba(12,15,20,0.08);
  border-radius:18px; padding:26px;
  box-shadow:var(--shadow-base);
  position:relative; overflow:hidden;
  transition:transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s cubic-bezier(.2,.7,.2,1), border-color .35s ease;
}
.metric-card::after{
  content:''; position:absolute; inset:0;
  background:radial-gradient(circle at top right, rgba(135,47,245,0.18), transparent 65%);
  opacity:0; pointer-events:none;
  transition:opacity .35s ease;
}
.metric-card:hover,
.metric-card:focus-within{
  transform:translateY(-8px);
  box-shadow:0 22px 44px rgba(15,23,42,0.18);
  border-color:rgba(135,47,245,0.28);
}
.metric-card:hover::after,
.metric-card:focus-within::after{ opacity:1; }
.metric-card__value{
  display:block; font-size:32px; font-weight:900; color:var(--text);
  margin-bottom:10px;
  transition:color .35s ease;
}
.metric-card:hover .metric-card__value,
.metric-card:focus-within .metric-card__value{ color:var(--accent); }
.metric-card__label{
  margin:0; color:var(--muted); line-height:1.5; font-size:15px;
}

.social-proof__logos{
  display:flex; flex-wrap:wrap; gap:18px;
  align-items:center; justify-content:space-between;
  background:linear-gradient(100deg,rgba(135,47,245,0.1),rgba(255,0,110,0.12));
  border:1px solid rgba(12,15,20,0.08); border-radius:20px;
  padding:24px 28px; box-shadow:0 18px 32px rgba(12,15,20,0.12);
}
.social-proof__logos span{
  font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:rgba(12,15,20,0.72); font-size:13px;
  padding:10px 18px; border-radius:999px;
  background:rgba(255,255,255,0.45);
  box-shadow:0 12px 22px rgba(15,23,42,0.12);
  transition:transform .35s cubic-bezier(.2,.7,.2,1), background .35s ease, color .35s ease, box-shadow .35s ease;
  animation:pillFloat 6s ease-in-out infinite;
  animation-delay:var(--delay,0s);
}
.social-proof__logos span:hover,
.social-proof__logos span:focus{
  transform:translateY(-6px) scale(1.03);
  background:#ffffff;
  color:var(--text);
  box-shadow:0 18px 36px rgba(15,23,42,0.18);
  animation-play-state:paused;
}
.social-proof__logos span:nth-child(2n){ animation-duration:7.2s; }
.social-proof__logos span:nth-child(3n){ animation-duration:5.6s; }

@keyframes pillFloat{
  0%,100%{ transform:translateY(0); }
  50%{ transform:translateY(-6px); }
}


@media(max-width:680px){
  .social-proof__logos{ justify-content:center; }
}

.how-flow{
  max-width:1180px; margin:48px auto 56px; padding:0 20px;
}
.how__head h2{
  margin:0; font-weight:900; font-size:clamp(28px,5vw,44px);
  line-height:1.05; letter-spacing:-0.02em;
}
.how__head p{ margin:8px 0 14px; color:var(--muted); max-width:720px; }

.how__badges{ display:flex; flex-wrap:wrap; gap:10px; margin-top:6px; }
.badge{
  display:inline-flex; align-items:center; gap:6px;
  background:var(--card); color:var(--text);
  padding:8px 12px; border-radius:999px;
  border:1px solid rgba(12,15,20,.06);
  box-shadow:0 5px 15px rgba(0,0,0,0.05);
  font-weight:600;
}
.badge b{ font-weight:800; color:var(--accent); }

.flow__grid{
  display:grid; grid-template-columns:220px 1fr; gap:36px; margin-top:40px;
}

.flow__rail{ position:relative; padding:10px 0; display:flex; justify-content:center; }
.flow__rail::before{
  content:''; width:4px; border-radius:4px; background:var(--rail-color);
  position:absolute; top:0; bottom:0;
}
.rail__dots{
  position:relative; height:100%; display:grid; grid-template-rows:repeat(4,1fr);
  justify-items:center; width:100%;
}
.flow__rail .dot{
  width:16px; height:16px; border-radius:50%;
  background:var(--rail-dot); border:3px solid var(--rail-color);
  box-shadow:0 4px 8px rgba(0,0,0,0.1); transition:all .25s ease; position:relative; z-index:5;
}
.flow__rail .dot.is-active{ border-color:var(--rail-dot); box-shadow:0 0 0 4px rgba(255,255,255,.4); }
.flow__rail .dot--one.is-active   { background:#2647ff; }
.flow__rail .dot--pro.is-active   { background:#ff6a3d; }
.flow__rail .dot--web.is-active   { background:#ffad33; }
.flow__rail .dot--custom.is-active{ background:#0bb5b6; }

.flow__steps{ display:grid; gap:28px; }
.step{
  background:var(--card); border:1px solid rgba(12,15,20,.08);
  border-radius:18px; box-shadow:var(--shadow-base); padding:24px;
  transition: all .3s cubic-bezier(.2,.7,.2,1); outline:none;
}
.step:hover{ transform: translateY(-4px); box-shadow:0 12px 28px rgba(0,0,0,0.1); }
.step.is-active{ border-color:var(--accent); box-shadow:0 15px 40px rgba(135,47,245,0.15); background:#fff; transform: scale(1.02); }
.step__top{ display:flex; align-items:center; gap:15px; margin-bottom:8px; }
.step__top h3{ margin:0; font-size:20px; font-weight:900; }

.how-flow .chip{
  display:inline-flex; align-items:center; justify-content:center;
  width:38px; height:38px; border-radius:50%; color:#fff; font-weight:900;
  box-shadow:0 8px 18px rgba(0,0,0,.2); font-size:16px;
}
.how-flow .chip--one   { background: var(--g-one); }
.how-flow .chip--pro   { background: var(--g-pro); }
.how-flow .chip--web   { background: var(--g-web); }
.how-flow .chip--custom{ background: var(--g-custom); }

.step p{ margin:0 0 12px; color:var(--muted); line-height:1.5; }
.step__list{ margin:0; padding-left:0; list-style:none; display:grid; gap:8px; }
.step__list li{ position:relative; padding-left:18px; font-size:15px; color:var(--text); opacity:.9; }
.step__list li::before{ content:"✓"; position:absolute; left:0; top:0; color:var(--accent); font-weight:800; }

.how__cta{ display:flex; justify-content:center; margin-top:40px; }
.btn-flow-cta{
  border:0; color:#fff; font-weight:800; letter-spacing:.05em; border-radius:999px;
  padding:16px 30px; cursor:pointer; background: var(--btn-grad);
  box-shadow: 0 14px 26px rgba(214,33,133,.35); text-decoration:none;
  transition: transform .2s ease, box-shadow .2s ease;
}
.btn-flow-cta:hover{ transform: translateY(-2px); box-shadow:0 18px 34px rgba(214,33,133,.40); }

@media (max-width:900px){
  .flow__grid{ grid-template-columns:1fr; }
  .flow__rail{ display:none; }
  .flow__steps{ gap:20px; }
}

.portfolio{
  max-width:1180px; margin:36px auto 56px; padding:0 20px;
  display:grid; gap:36px;
}
.portfolio__head h2{
  margin:12px 0 14px; font-size:clamp(28px,5vw,42px);
  line-height:1.05; font-weight:900;
}
.portfolio__head p{
  margin:0; max-width:620px; color:var(--muted); line-height:1.6;
}
.portfolio__grid{
  display:grid; gap:24px;
  grid-template-columns:repeat(auto-fit, minmax(280px,1fr));
}
.portfolio-card{
  background:var(--card); border-radius:22px;
  padding:30px; display:flex; flex-direction:column; gap:20px;
  border:1px solid rgba(12,15,20,0.1); box-shadow:var(--shadow-base);
  min-height:100%;
  position:relative; overflow:hidden;
  transition:transform .4s cubic-bezier(.18,.72,.24,1), box-shadow .4s cubic-bezier(.18,.72,.24,1), border-color .4s ease;
  will-change:transform, box-shadow;
}
.portfolio-card::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(135deg, rgba(135,47,245,0.12), transparent 55%);
  opacity:0; pointer-events:none;
  transition:opacity .4s ease;
}
.portfolio-card:hover,
.portfolio-card:focus-within{
  transform:translateY(-12px);
  box-shadow:0 26px 54px rgba(15,23,42,0.22);
  border-color:rgba(135,47,245,0.28);
}
.portfolio-card:hover::after,
.portfolio-card:focus-within::after{ opacity:1; }
.portfolio-card header h3{
  margin:0 0 4px; font-size:22px; font-weight:900;
}
.portfolio-card header p{
  margin:0; color:rgba(12,15,20,0.65); font-weight:600; letter-spacing:.02em;
}
.portfolio-card ul{
  margin:0; padding-left:0; list-style:none; display:grid; gap:10px;
}
.portfolio-card li{
  position:relative; padding-left:18px; color:var(--text); line-height:1.5;
}
.portfolio-card li::before{
  content:'•'; position:absolute; left:0; top:0; color:var(--accent);
  font-size:18px; line-height:1;
}
.portfolio-card footer{
  margin-top:auto; display:flex; align-items:center; justify-content:space-between;
  gap:18px; font-size:14px;
}
.portfolio-card footer a{
  color:var(--accent); font-weight:700; text-decoration:none;
}
.portfolio-card footer a::after{
  content:'→'; display:inline-block; margin-left:6px;
  transition:transform .3s ease;
}
.portfolio-card footer a:hover,
.portfolio-card footer a:focus{
  text-decoration:none;
}
.portfolio-card footer a:hover::after,
.portfolio-card footer a:focus::after{
  transform:translateX(4px);
}
.portfolio-card .tag{
  display:inline-flex; align-items:center; gap:6px;
  padding:6px 12px; border-radius:999px;
  background:rgba(12,15,20,0.06); color:rgba(12,15,20,0.75);
  font-weight:700; font-size:12px; letter-spacing:.08em; text-transform:uppercase;
}
.portfolio-card--one{ border-top:4px solid #2647ff; }
.portfolio-card--pro{ border-top:4px solid #ff6a3d; }
.portfolio-card--web{ border-top:4px solid #ffad33; }

@media(max-width:680px){
  .portfolio{ gap:28px; }
}

.services{
  max-width:1180px; margin:36px auto 60px; padding:0 20px;
  display:grid; gap:34px;
}
.services__head h2{
  margin:12px 0 14px; font-size:clamp(28px,5vw,42px);
  line-height:1.06; font-weight:900;
}
.services__head p{
  margin:0; max-width:620px; color:var(--muted); line-height:1.6;
}
.services__layout{
  display:grid; gap:28px; grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);
  align-items:stretch;
}
.services__grid{
  display:grid; gap:22px;
}
.service-card{
  --icon-bg:rgba(11,181,182,0.14);
  --icon-color:#0bb5b6;
  background:var(--card); border-radius:22px;
  padding:28px; border:1px solid rgba(12,15,20,0.08);
  box-shadow:var(--shadow-base); display:grid; gap:14px;
  position:relative; overflow:hidden;
  transition:transform .4s cubic-bezier(.2,.7,.2,1), box-shadow .4s cubic-bezier(.2,.7,.2,1), border-color .4s ease;
  will-change:transform, box-shadow;
}
.service-card::before{
  content:''; position:absolute; inset:0;
  background:linear-gradient(135deg, rgba(11,181,182,0.16), transparent 60%);
  opacity:0; transition:opacity .4s ease;
  pointer-events:none;
}
.service-card:hover,
.service-card:focus-within{
  transform:translateY(-10px);
  box-shadow:0 24px 48px rgba(15,23,42,0.2);
  border-color:rgba(11,181,182,0.28);
}
.service-card:hover::before,
.service-card:focus-within::before{ opacity:1; }
.service-card__icon{
  width:48px; height:48px;
  border-radius:16px;
  background:var(--icon-bg);
  color:var(--icon-color);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:20px;
  box-shadow:0 14px 28px rgba(14,118,145,0.16);
}
.service-card__icon i{line-height:1;}
.service-card h3{
  margin:0; font-size:20px; font-weight:900;
}
.service-card p{
  margin:0; color:var(--muted); line-height:1.55;
}
.service-card ul{
  margin:0; padding-left:0; list-style:none; display:grid; gap:8px;
}
.service-card li{
  position:relative; padding-left:18px; font-size:15px; color:var(--text);
}
.service-card li::before{
  content:"✓"; position:absolute; left:0; top:0;
  color:#0bb5b6; font-weight:800;
}

.services__cta{
  background:linear-gradient(190deg,rgba(38,71,255,0.95) 0%, rgba(106,44,255,0.9) 65%, rgba(135,47,245,0.85) 100%);
  color:#f8fafc; border-radius:24px; padding:36px;
  display:grid; gap:24px; border:1px solid rgba(255,255,255,0.24);
  box-shadow:0 28px 46px rgba(24,32,56,0.35);
  position:relative; overflow:hidden;
  transition:transform .45s cubic-bezier(.18,.72,.24,1), box-shadow .45s cubic-bezier(.18,.72,.24,1);
}
.services__cta::after{
  content:''; position:absolute; inset:-40% 20% auto;
  height:160%; background:linear-gradient(120deg, rgba(255,255,255,0.35) 0%, rgba(255,255,255,0) 60%);
  opacity:0; transform:translateX(-40%);
  transition:opacity .45s ease, transform .45s ease;
  pointer-events:none;
}
.services__cta:hover,
.services__cta:focus-within{
  transform:translateY(-12px);
  box-shadow:0 34px 58px rgba(24,32,56,0.42);
}
.services__cta:hover::after,
.services__cta:focus-within::after{
  opacity:1;
  transform:translateX(0);
}
.services__badge{
  display:inline-flex; align-items:center; gap:6px;
  padding:6px 12px; border-radius:999px;
  background:rgba(255,255,255,0.18); color:#ffd24d;
  font-size:11px; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  border:1px solid rgba(255,255,255,0.3);
}
.services__cta-head{
  display:grid; gap:14px;
}
.services__cta-head h3{
  margin:0; font-size:22px; font-weight:900;
}
.services__cta-head p{
  margin:0; color:rgba(248,250,252,0.88); max-width:340px; line-height:1.6; font-size:15px;
}
.services__cta-visual{
  position:relative;
  border-radius:26px;
  background:rgba(12,11,30,0.35);
  padding:24px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  box-shadow:0 22px 48px rgba(10,8,30,0.5);
  backdrop-filter:blur(12px);
  min-height:220px;
}
.services__cta-glass{
  width:100%;
  max-width:320px;
  border-radius:20px;
  background:rgba(255,255,255,0.08);
  border:1px solid rgba(255,255,255,0.18);
  padding:16px;
  box-shadow:0 18px 36px rgba(8,8,20,0.45);
}
.services__cta-glass img{
  width:100%;
  display:block;
  border-radius:14px;
  box-shadow:0 24px 36px rgba(5,6,24,0.4);
}
.services__cta-pill,
.services__cta-metric{
  position:absolute;
  display:flex;
  flex-direction:column;
  gap:2px;
  padding:10px 14px;
  border-radius:16px;
  font-size:12px;
  backdrop-filter:blur(12px);
  background:rgba(9,9,20,0.55);
  border:1px solid rgba(255,255,255,0.18);
  box-shadow:0 12px 28px rgba(7,6,22,0.5);
  animation:pillFloat 9s ease-in-out infinite;
}
.services__cta-pill{
  top:22px;
  left:22px;
  color:#fff;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.services__cta-pill strong{
  font-size:13px;
  letter-spacing:normal;
  text-transform:none;
}
.services__cta-metric{
  bottom:22px;
  right:22px;
  animation-delay:1.6s;
  color:#ffd24d;
  text-align:right;
}
.services__cta-metric strong{
  font-size:22px;
  line-height:1;
  color:#fff;
}
.services__cta-metric span{
  color:rgba(255,255,255,0.78);
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.services__cta ul{
  margin:0; padding-left:0; list-style:none; display:grid; gap:12px;
}
.services__cta li{
  position:relative; padding-left:22px; font-size:15px; line-height:1.7;
}
.services__cta li::before{
  content:"✓"; position:absolute; left:0; top:2px;
  color:#ffd24d; font-weight:800; font-size:16px;
}
.services__cta-actions{
  display:grid; gap:10px; align-items:flex-start;
}
.services__cta-note{
  font-size:13px; color:rgba(248,250,252,0.8);
}
.services__cta .btn--cta{
  background:linear-gradient(135deg,#ffd24d 0%, #ffb347 100%);
  color:#0c0f14;
  display:inline-flex; align-items:center; gap:10px;
  padding:14px 26px; border-radius:18px;
  box-shadow:0 16px 28px rgba(255,176,55,0.32);
  text-decoration:none;
  transition:transform .28s cubic-bezier(.2,.7,.2,1), box-shadow .28s cubic-bezier(.2,.7,.2,1);
}
.services__cta .btn--cta::after{ display:none; }
.services__cta .btn--cta svg{
  width:18px; height:18px; fill:currentColor;
  transition:transform .28s cubic-bezier(.2,.7,.2,1);
}
.services__cta .btn--cta:hover,
.services__cta .btn--cta:focus{
  transform:translateY(-4px);
  box-shadow:0 22px 34px rgba(255,176,55,0.42);
}
.services__cta .btn--cta:hover svg,
.services__cta .btn--cta:focus svg{
  transform:translateX(4px);
}

@media(max-width:960px){
  .services__layout{ grid-template-columns:1fr; }
  .services__cta{ order:-1; }
  .services__cta-visual{
    min-height:200px;
  }
}

.guarantee{
  max-width:1180px;
  margin:40px auto 56px;
  padding:0 20px;
}
.guarantee__inner{
  background:linear-gradient(120deg,rgba(255,255,255,0.95),rgba(247,244,255,0.96));
  border-radius:32px;
  border:1px solid rgba(12,15,20,0.05);
  box-shadow:0 30px 60px rgba(12,15,20,0.12);
  padding:40px;
  display:grid;
  gap:28px;
}
.guarantee__head h2{
  margin:12px 0 10px;
  font-size:clamp(30px,4.6vw,46px);
  line-height:1.05;
}
.guarantee__head p{
  margin:0;
  color:var(--muted);
  max-width:640px;
}
.guarantee__grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:18px;
}
.guarantee-card{
  background:#fff;
  border-radius:22px;
  border:1px solid rgba(12,15,20,0.08);
  padding:22px;
  box-shadow:0 18px 34px rgba(12,15,20,0.08);
  position:relative;
}
.guarantee-card h3{
  margin:0 0 10px;
  font-size:20px;
  font-weight:800;
}
.guarantee-card::after{
  content:'';
  position:absolute;
  inset:0;
  border-radius:22px;
  padding:1px;
  background:linear-gradient(140deg,#872ff5,#ff3e8a,#0bb5b6);
  mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  mask-composite:exclude;
  pointer-events:none;
  opacity:0;
  transition:opacity .3s ease;
}
.guarantee-card:hover::after,
.guarantee-card:focus-within::after{
  opacity:1;
}
.guarantee__cta{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
}
.guarantee__cta .btn,
.guarantee__cta .btn-outline{
  flex:1;
  min-width:220px;
}
@media(max-width:720px){
  .guarantee__inner{ padding:30px 22px; }
  .guarantee__cta{
    flex-direction:column;
  }
}

.tools{
  max-width:1180px; margin:20px auto 56px; padding:0 20px;
  display:grid; gap:40px;
}
.tools__head h2{
  margin:12px 0 14px; font-size:clamp(28px,5vw,42px);
  line-height:1.05; font-weight:900;
}
.tools__head p{
  margin:0; max-width:680px; color:var(--muted); line-height:1.6;
}
.tools__grid{
  display:grid; gap:22px;
  grid-template-columns:repeat(auto-fit, minmax(260px,1fr));
}
.tool-card{
  --icon-bg:rgba(135,47,245,0.12);
  --icon-color:#872ff5;
  background:linear-gradient(160deg, rgba(255,255,255,0.92) 0%, rgba(245,247,251,0.98) 100%);
  border-radius:22px;
  padding:28px;
  border:1px solid rgba(12,15,20,0.06);
  box-shadow:0 20px 40px rgba(15,23,42,0.12);
  display:grid; gap:14px;
  position:relative; overflow:hidden;
  transition:transform .4s cubic-bezier(.2,.7,.2,1), box-shadow .4s ease, border-color .4s ease;
}
.tool-card::after{
  content:''; position:absolute; inset:-40% -20% auto;
  height:70%; background:radial-gradient(circle, rgba(135,47,245,0.28) 0%, transparent 70%);
  opacity:0; transition:opacity .45s ease, transform .45s ease;
}
.tool-card:hover,
.tool-card:focus-within{
  transform:translateY(-10px);
  box-shadow:0 28px 56px rgba(15,23,42,0.18);
  border-color:rgba(135,47,245,0.25);
}
.tool-card:hover::after,
.tool-card:focus-within::after{
  opacity:1;
  transform:translateY(12px);
}
.tool-card__icon{
  width:48px; height:48px;
  border-radius:16px;
  background:var(--icon-bg);
  color:var(--icon-color);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:20px;
  box-shadow:0 12px 24px rgba(15,23,42,0.18);
}
.tool-card__icon i{line-height:1;}
.tool-card h3{
  margin:0; font-size:20px; font-weight:900;
}
.tool-card p{
  margin:0; color:var(--muted); line-height:1.55;
}
.tool-card ul{
  margin:0; padding-left:0; list-style:none; display:grid; gap:6px;
  font-weight:600; color:var(--text);
}
.tool-card li{
  position:relative; padding-left:18px;
}
.tool-card li::before{
  content:'•'; position:absolute; left:0; top:0; color:var(--accent);
}

.tools__ticker{
  background:rgba(255,255,255,0.9);
  border-radius:32px;
  padding:16px 22px 16px 18px;
  display:flex;
  align-items:center;
  gap:18px;
  box-shadow:0 22px 48px rgba(15,23,42,0.12);
  border:1px solid rgba(12,15,20,0.08);
  overflow:hidden;
}
.tools__badge{
  font-size:11px; font-weight:800; letter-spacing:.18em; text-transform:uppercase;
  color:#fff;
  background:linear-gradient(120deg,#475569,#1f2937);
  border-radius:999px;
  padding:10px 18px;
  display:inline-flex; align-items:center; gap:8px;
  flex-shrink:0;
  box-shadow:0 10px 22px rgba(15,23,42,0.2);
}
.tools__badge::after{
  content:'›';
  font-size:12px; opacity:.65;
}
.tools__marquee{
  position:relative; flex:1;
  overflow:hidden;
}
.tools__marquee::before,
.tools__marquee::after{
  content:''; position:absolute; top:0; bottom:0; width:60px;
  pointer-events:none; z-index:2;
}
.tools__marquee::before{
  left:0;
  background:linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
}
.tools__marquee::after{
  right:0;
  background:linear-gradient(270deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
}
.tools__marquee-track{
  display:flex; align-items:center; gap:48px;
  padding:10px 0;
  min-width:100%;
  animation:toolsMarquee 16s linear infinite;
  text-transform:uppercase;
  letter-spacing:.18em;
  font-weight:700;
  color:rgba(12,15,20,0.46);
}
.tools__marquee:hover .tools__marquee-track{
  animation-play-state:paused;
}
.tools__marquee span{
  white-space:nowrap;
  transition:color .2s ease;
}
.tools__marquee span:hover{
  color:rgba(12,15,20,0.72);
}

@keyframes toolsMarquee{
  0%{ transform:translateX(0); }
  100%{ transform:translateX(-100%); }
}

@media(max-width:640px){
  .tools__ticker{ padding:14px 18px; gap:14px; }
  .tools__badge{ letter-spacing:.14em; padding:8px 14px; }
  .tools__marquee-track{ gap:28px; font-size:12px; }
}

.pricing-wrap{
  max-width:1180px;
  margin:48px auto 56px;
  padding:0 20px;
}
.pricing-head{
  display:grid;
  gap:14px;
  margin-bottom:6px;
}
.pricing-head h1,
.pricing-head h2{
  margin:0;
  font-size:clamp(30px,4.8vw,44px);
  line-height:1.06;
  font-weight:800;
}
.pricing-head__sub{
  margin:0;
  color:var(--muted);
  max-width:740px;
  font-size:clamp(14px,2.1vw,16.5px);
}
.toolbar{
  display:flex;
  align-items:center;
  gap:16px;
  flex-wrap:wrap;
  justify-content:flex-start;
  margin-top:10px;
}
.toggle-group{
  display:flex;
  gap:10px;
}
.toggle-btn{
  appearance:none;
  border:0;
  cursor:pointer;
  padding:12px 20px;
  border-radius:999px;
  font-weight:700;
  font-size:15px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:2px;
  background:#fff;
  color:var(--text);
  box-shadow:0 8px 20px rgba(12,15,20,.08), inset 0 0 0 2px #e5e7eb;
  transition:all .2s ease;
}
.toggle-btn span{
  font-weight:500;
  font-size:12px;
}
.toggle-btn .promo-label{
  font-weight:700;
  color:var(--ahorro-strong);
}
.toggle-btn.is-active{
  box-shadow:0 10px 26px rgba(12,15,20,.15), inset 0 0 0 2px #c7a8ff;
  transform:translateY(-1px);
}
.iva-switch{
  display:flex;
  align-items:center;
  gap:8px;
  margin-left:4px;
}
.switch{
  position:relative;
  display:inline-block;
  width:48px;
  height:26px;
}
.switch input{
  opacity:0;
  width:0;
  height:0;
}
.slider{
  position:absolute;
  cursor:pointer;
  inset:0;
  background:#e5e7eb;
  border-radius:999px;
  transition:.2s;
}
.slider::before{
  content:"";
  position:absolute;
  height:20px;
  width:20px;
  left:4px;
  top:3px;
  background:#fff;
  border-radius:50%;
  box-shadow:0 1px 3px rgba(0,0,0,.2);
  transition:.2s;
}
.switch input:checked + .slider{ background:#c7a8ff; }
.switch input:checked + .slider::before{ transform:translateX(22px); }
.iva-label{
  font-size:13.5px;
  color:var(--text);
}
.savings-hint{
  color:var(--ahorro-strong);
  font-weight:800;
  min-height:20px;
  margin-left:8px;
}
.cards{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:24px;
  margin-top:16px;
}
.card{
  background:linear-gradient(180deg,#ffffff 0%,#fafbff 100%);
  border-radius:var(--radius);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  min-height:620px;
  box-shadow:12px 16px 36px rgba(12,15,20,.12),-8px -8px 22px rgba(255,255,255,.6);
  border:1px solid rgba(12,15,20,.04);
  transition:transform .26s cubic-bezier(.2,.7,.2,1), box-shadow .26s ease, outline-offset .2s ease;
  outline:3px solid transparent;
  outline-offset:6px;
  position:relative;
}
.card:hover{
  transform:scale(1.03);
  z-index:3;
  box-shadow:0 20px 40px rgba(12,15,20,.2);
}
.card[aria-checked="true"]{
  transform:scale(1.035);
  z-index:3;
  box-shadow:0 20px 40px rgba(12,15,20,.2);
  outline:3px solid var(--card-accent, var(--accent));
  outline-offset:3px;
}
.card:focus-visible{
  outline:3px solid var(--card-accent, var(--accent));
  outline-offset:3px;
}
.is-featured .card__top{ filter:saturate(1.03); }
.is-featured[aria-checked="true"]{ transform:scale(1.045); }
.card.is-tilting{
  transform:translateZ(0) rotateX(var(--rx,0)) rotateY(var(--ry,0)) translateY(var(--ty,0));
  filter:drop-shadow(0 18px 30px rgba(0,0,0,.14));
}
.ribbon{
  position:absolute;
  top:14px;
  right:-32px;
  transform:rotate(36deg);
  background:#111;
  color:#fff;
  font-weight:800;
  letter-spacing:.02em;
  padding:8px 48px;
  font-size:12px;
  z-index:2;
  box-shadow:0 12px 18px rgba(0,0,0,.18);
}
.card__top{
  padding:24px;
  color:#fff;
  position:relative;
  isolation:isolate;
}
.card__top::after{
  content:'';
  position:absolute;
  inset:0;
  z-index:0;
  opacity:.25;
  background:linear-gradient(90deg,rgba(255,255,255,.12) 0%,rgba(0,0,0,.12) 50%,rgba(255,255,255,.12) 100%);
  mix-blend-mode:soft-light;
}
.card__top>*{ position:relative; z-index:1; }
.card--one{ --card-accent:#2647ff; }
.card--pro{ --card-accent:#ff6a3d; }
.card--webstore{ --card-accent:#ffad33; }
.card--custom{ --card-accent:#0bb5b6; }
.card--one .card__top{ background:var(--g-one-top); }
.card--pro .card__top{ background:var(--g-pro-top); }
.card--webstore .card__top{ background:var(--g-web-top); }
.card--custom .card__top{ background:var(--g-custom-top); }
.card__kicker{
  display:flex;
  align-items:center;
  gap:8px;
  opacity:.95;
}
.card__brand{
  margin:0;
  font-weight:800;
  letter-spacing:.045em;
  font-size:13px;
}
.card__tag{
  font-size:12px;
  font-weight:700;
  background:rgba(255,255,255,.16);
  padding:4px 8px;
  border-radius:999px;
}
.card__title{
  margin:6px 0 10px;
  font-size:32px;
  line-height:1;
  font-weight:800;
  display:flex;
  align-items:center;
  gap:10px;
}
.card__title span{ display:block; }
.card__title-logo{
  width:30px;
  height:30px;
  flex:0 0 30px;
  filter:drop-shadow(0 6px 14px rgba(12,15,20,.25));
}
.card__price{
  display:flex;
  align-items:baseline;
  gap:6px;
  flex-wrap:wrap;
}
.card__price .prefix{
  font-size:16px;
  font-weight:600;
  opacity:.9;
  margin-right:6px;
}
.card__price .amount{ font-size:30px; font-weight:800; }
.card__price .currency{ font-size:14px; opacity:.9; font-weight:600; }
.vat-flag{
  font-size:12px;
  font-weight:700;
  opacity:.85;
  background:rgba(255,255,255,.22);
  padding:2px 8px;
  border-radius:999px;
}
.pricing-wrap .chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:var(--chip-bg);
  color:var(--chip-text);
  border-radius:999px;
  padding:8px 14px;
  font-weight:800;
  font-size:15px;
  position:absolute;
  left:24px;
  bottom:-18px;
  box-shadow:0 12px 20px rgba(0,0,0,.18);
}
.card__body{
  padding:40px 24px 24px;
  display:flex;
  flex-direction:column;
  gap:16px;
  flex:1;
}
.card__subtitle{
  margin:12px 0 4px;
  font-weight:700;
}
.list{
  margin:0;
  padding-left:0;
  list-style:none;
  display:flex;
  flex-direction:column;
  gap:10px;
  color:#1f2937;
  font-size:14.5px;
}
.list li{
  display:flex;
  gap:10px;
  align-items:flex-start;
}
.i{
  width:18px;
  height:18px;
  flex:0 0 18px;
  border-radius:4px;
  background:#e8ecff;
  box-shadow:inset 0 0 0 2px rgba(12,15,20,.06);
}
.i-domain{ background:#f0fff4; }
.i-hosting{ background:#eef9ff; }
.i-seo{ background:#fff6e6; }
.i-rocket{ background:#ffe9f5; }
.i-sections{ background:#f2f7ff; }
.i-cms{ background:#f4edff; }
.i-lock,.i-ssl{ background:#e8ffef; }
.i-analytics{ background:#fff6e6; }
.i-integrations{ background:#eefcff; }
.i-support{ background:#f2f2ff; }
.i-cart{ background:#fff0f0; }
.i-payments{ background:#fff4f1; }
.i-panel{ background:#f3f4ff; }
.i-mail{ background:#f0f7ff; }
.i-discovery{ background:#f3f6ff; }
.i-ux{ background:#fbefff; }
.i-dev{ background:#f2fbff; }
.i-api{ background:#eef9ff; }
.value-breakdown{
  margin-top:12px;
  margin-bottom:12px;
}
.toggle-valor{
  width:100%;
  appearance:none;
  border:0;
  text-align:left;
  cursor:pointer;
  font-weight:700;
  color:var(--ahorro);
  background:var(--ahorro-bg);
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:10px 14px;
  border-radius:8px;
  transition:background-color .2s ease,color .2s ease;
}
.toggle-valor:hover{
  background:var(--ahorro-bg2);
  color:var(--ahorro-strong);
}
.toggle-valor-label{
  font-size:14px;
  flex-grow:1;
}
.toggle-valor-amount{
  font-size:15px;
  margin-right:8px;
}
.toggle-icon{
  transition:transform .3s cubic-bezier(.2,.7,.2,1);
  flex-shrink:0;
}
.valor-items-wrapper{
  max-height:0;
  overflow:hidden;
  transition:max-height .4s ease-out,padding .4s ease-out,border .4s ease-out;
  font-size:14px;
  color:var(--muted);
  padding:0 16px;
  border:1px solid transparent;
}
.valor-item{
  display:flex;
  justify-content:space-between;
  margin-top:14px;
}
.valor-calculo{
  margin-top:16px;
  padding-top:16px;
  border-top:1px dashed rgba(12,15,20,.15);
  font-weight:600;
  color:var(--text);
}
.value-breakdown.is-open .valor-items-wrapper{
  max-height:640px;
  padding:12px 16px 16px;
  border-color:#d1f3e0;
  border-top:none;
  border-bottom-left-radius:8px;
  border-bottom-right-radius:8px;
}
.value-breakdown.is-open .toggle-icon{ transform:rotate(180deg); }
.value-breakdown.is-open .toggle-valor{
  border-bottom-left-radius:0;
  border-bottom-right-radius:0;
  background:var(--ahorro-bg2);
}
.btn--lg{
  padding:14px 22px;
}
.pricing-footnote{
  text-align:center;
  margin-top:34px;
  color:var(--muted);
  font-size:12.5px;
}
.trust{
  display:flex;
  justify-content:center;
  gap:10px;
  margin-top:20px;
  margin-bottom:12px;
  color:#1f2937;
  font-size:13px;
}
.t-sep{ opacity:.4; }
@media (max-width:1140px){
  .cards{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:620px){
  .cards{ grid-template-columns:1fr; }
  .card{
    min-height:590px;
    box-shadow:8px 10px 24px rgba(12,15,20,.10),-6px -6px 18px rgba(255,255,255,.65);
  }
  .card:hover{ transform:scale(1.02); }
  .card[aria-checked="true"]{ transform:scale(1.03); }
}
@media (prefers-reduced-motion: reduce){
  .card,
  .btn,
  .toggle-btn,
  .switch .slider,
  .switch .slider::before,
}

.faq-pulse{
  max-width:980px; margin:48px auto 60px; padding:0 20px;
}
.faq__head h2{
  margin:0; font-weight:900; font-size:clamp(30px,5vw,44px); line-height:1.08; letter-spacing:-0.02em;
}
.faq__head p{ margin:8px 0 16px; color:var(--muted); }

.faq__controls{ display:flex; flex-wrap:wrap; gap:12px; margin:18px 0 20px; align-items:center; }
.faq__search{
  position:relative;
  flex:1 1 260px;
}
.faq__search::before{
  content:'\f002';
  font-family:'Font Awesome 6 Free';
  font-weight:900;
  position:absolute;
  left:18px;
  top:50%;
  transform:translateY(-50%);
  color:rgba(12,15,20,0.35);
  font-size:15px;
  pointer-events:none;
}
.faq__search input{
  width:100%; padding:12px 18px 12px 46px; border-radius:999px;
  border:1px solid rgba(12,15,20,.08);
  background:linear-gradient(135deg,#fff,#f5f7fb);
  font:inherit; color:var(--text);
  box-shadow:0 14px 30px rgba(15,23,42,0.08);
  transition:box-shadow .2s ease, border-color .2s ease;
}
.faq__search input:focus{
  outline:none;
  border-color:rgba(135,47,245,0.45);
  box-shadow:0 18px 34px rgba(135,47,245,0.18);
}
.faq__filters{
  display:flex; flex-wrap:wrap; gap:8px;
  flex:2 1 min(520px,100%);
}

.faq-pulse .chip{
  border:1px solid rgba(12,15,20,.12); border-radius:999px; padding:8px 12px; background:#fff;
  cursor:pointer; font-weight:700; font-size:13px; color:var(--text);
  transition: all .15s ease;
}
.faq-pulse .chip:hover{ transform: translateY(-1px); box-shadow:0 8px 16px rgba(15,23,42,.07); }
.faq-pulse .chip.is-active{
  border-color: var(--accent); background: var(--accent); color:#fff;
  box-shadow:0 8px 20px rgba(135,47,245,0.2);
}
.faq__toggle-all{
  margin-left:auto;
  border-radius:999px;
  border:1px solid rgba(12,15,20,.12);
  background:#fff;
  color:var(--text);
  font-weight:700;
  letter-spacing:.02em;
  padding:10px 18px;
  cursor:pointer;
  transition:transform .2s ease, box-shadow .2s ease, opacity .2s ease, background .2s ease;
}
.faq__toggle-all:hover{
  transform:translateY(-1px);
  box-shadow:0 12px 24px rgba(12,15,20,.25);
}
.faq__toggle-all[aria-expanded="true"]{
  background:#0c0f14;
  color:#fff;
  box-shadow:0 12px 24px rgba(12,15,20,.35);
}

.faq__list{ display:grid; gap:14px; }
.faq__item{
  --faq-accent:#872ff5;
  --faq-accent-soft:rgba(135,47,245,0.12);
  --faq-icon-bg:rgba(135,47,245,0.12);
  background:#fff; border:1px solid rgba(12,15,20,.06); border-radius:18px;
  box-shadow: var(--shadow-base); position:relative; overflow:hidden;
  opacity:0; filter: blur(4px);
  transition: opacity .45s ease, transform .45s ease, filter .45s ease;
}
.faq__item.in-view{ opacity:1; filter: blur(0); }

.faq__item::before{
  content:''; position:absolute; left:0; top:0; bottom:0; width:4px; opacity:1; background: var(--faq-accent);
}

.faq__q{
  width:100%; text-align:left; padding:18px 56px 18px 18px;
  background:transparent; border:0; cursor:pointer; position:relative;
  color: var(--text); font-weight:700; letter-spacing:.01em; font-family: inherit;
  display:flex; align-items:flex-start; gap:14px; line-height:1.4;
}
.faq__q:focus{ outline:2px solid rgba(135,47,245,0.5); outline-offset:2px; border-radius:18px; }
.faq__q-icon{
  width:38px; height:38px;
  border-radius:14px;
  background:var(--faq-icon-bg);
  color:var(--faq-accent);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:16px;
  flex-shrink:0;
  box-shadow:0 8px 18px rgba(12,15,20,0.08);
}
.faq__q-icon i{line-height:1;}

.faq__icon{
  position:absolute; right:18px; top:50%; transform:translateY(-50%);
  width:26px; height:26px; border-radius:50%; transition: background .2s ease;
}
.faq__icon{ background: var(--faq-accent-soft); }

.faq__icon::before,
.faq__icon::after{
  content:''; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:12px; height:2px; border-radius:2px; background:var(--text);
}
.faq__icon::after{ transform:translate(-50%,-50%) rotate(90deg); transition: transform .2s ease; }

.faq__a{ height:0; overflow:hidden; transition: padding 0.3s ease; padding:0 18px; }
.faq__a p{ margin:0 0 12px; color:var(--text); opacity:.85; line-height:1.5; }
.faq__a strong{ font-weight:500; }

.faq__item.is-open .faq__a{ padding:0 18px 16px; }
.faq__item.is-open{
  box-shadow: 0 0 0 2px var(--faq-accent-soft), var(--shadow-base);
}
.faq__item.is-open .faq__icon::after{ transform:translate(-50%,-50%) rotate(0deg); }

.faq__item[data-category="tiempos"]{
  --faq-accent:#2F80ED;
  --faq-accent-soft:rgba(47,128,237,0.16);
  --faq-icon-bg:rgba(47,128,237,0.14);
}
.faq__item[data-category="pagos"]{
  --faq-accent:#F2994A;
  --faq-accent-soft:rgba(242,153,74,0.18);
  --faq-icon-bg:rgba(242,153,74,0.16);
}
.faq__item[data-category="integraciones"]{
  --faq-accent:#9B51E0;
  --faq-accent-soft:rgba(155,81,224,0.18);
  --faq-icon-bg:rgba(155,81,224,0.16);
}
.faq__item[data-category="contenido"]{
  --faq-accent:#2D9CDB;
  --faq-accent-soft:rgba(45,156,219,0.18);
  --faq-icon-bg:rgba(45,156,219,0.16);
}
.faq__item[data-category="soporte"]{
  --faq-accent:#00B894;
  --faq-accent-soft:rgba(0,184,148,0.18);
  --faq-icon-bg:rgba(0,184,148,0.16);
}

.faq__item[data-hidden="true"]{ display:none !important; }

.faq__cta{ display:flex; justify-content:center; margin-top:30px; }
.btn-faq-contact{
  border:0; color:#fff; font-weight:800; letter-spacing:.02em;
  border-radius:999px; padding:14px 25px; cursor:pointer;
  background: var(--btn-grad);
  box-shadow: 0 10px 20px rgba(214,33,133,.35);
  text-decoration: none;
  transition: transform .2s ease, box-shadow .2s ease;
}
.btn-faq-contact:hover{ transform: translateY(-2px); box-shadow:0 14px 28px rgba(214,33,133,.45); }

mark.faq-hit{ background:rgba(38,71,255,0.1); color:inherit; padding:0 .15em; border-radius:4px; }

@media (min-width:980px){
  .faq__list{ grid-template-columns: 1fr 1fr; }
}

.cta-final{
  position:relative;
  margin:48px 0;
  padding:64px 20px;
  background:var(--bg);
  overflow:visible;
  border-radius:0;
  box-shadow:none;
}
.cta-final__inner{
  position:relative;
  z-index:1;
  max-width:1180px;
  margin:0 auto;
  display:grid;
  grid-template-columns: minmax(0,1.4fr) minmax(0,1fr);
  gap:48px;
  align-items:stretch;
}
.cta-final__copy{
  display:flex;
  flex-direction:column;
  gap:22px;
}
.cta-final__kicker{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.16em;
  font-size:12px;
  color:rgba(12,15,20,0.55);
}
.cta-final__title{
  margin:0;
  font-size:clamp(32px,5vw,44px);
  line-height:1.05;
  font-weight:900;
  color:var(--text);
}
.cta-final__lead{
  margin:0;
  color:var(--muted);
  max-width:520px;
  line-height:1.6;
}
.cta-final__list{
  margin:0;
  padding-left:0;
  list-style:none;
  display:grid;
  gap:10px;
}
.cta-final__list li{
  position:relative;
  padding-left:22px;
  color:var(--text);
  opacity:.9;
}
.cta-final__list li::before{
  content:"✓";
  position:absolute;
  left:0; top:0;
  font-weight:800;
  color:#ffd24d;
}
.cta-final__actions{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
}
.cta-final__primary{
  background:var(--btn);
  box-shadow:0 18px 34px rgba(214,33,133,0.45);
  color:#fff;
}
.cta-final__ghost,
.cta-final__outline{
  background:var(--btn);
  color:#fff;
  border:0;
  box-shadow:0 16px 30px rgba(214,33,133,0.4);
}
.cta-final__contact{
  margin:0;
  font-size:14px;
  color:rgba(12,15,20,0.65);
}
.cta-final__contact a{
  color:var(--accent);
  font-weight:700;
  text-decoration:none;
}
.cta-final__contact a:hover{ text-decoration:underline; }

.cta-final__card{
  position:relative;
  background:linear-gradient(180deg, rgba(38,71,255,0.92) 0%, rgba(106,44,255,0.88) 100%);
  border:1px solid rgba(255,255,255,0.25);
  border-radius:24px;
  padding:34px;
  display:flex;
  flex-direction:column;
  gap:22px;
  box-shadow:0 25px 45px rgba(24,32,56,0.35);
  color:#f8fafc;
}
.cta-final__badge{
  align-self:flex-start;
  background:rgba(255,210,77,0.2);
  border:1px solid rgba(255,210,77,0.55);
  color:#ffd24d;
  padding:6px 12px;
  border-radius:999px;
  font-size:12px;
  letter-spacing:.14em;
  text-transform:uppercase;
  font-weight:800;
}
.cta-final__card h3{
  margin:0;
  font-size:22px;
  font-weight:800;
  color:#fff;
}
.cta-final__card-list{
  margin:0;
  padding-left:0;
  list-style:none;
  display:grid;
  gap:14px;
  color:rgba(248,250,252,0.9);
}
.cta-final__card-list li{
  display:flex;
  gap:12px;
  align-items:flex-start;
}
.cta-final__card-list strong{
  color:#ffd24d;
  font-size:16px;
}
.cta-final__slots{
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:16px;
  border-radius:18px;
  background:rgba(255,255,255,0.1);
  border:1px solid rgba(255,255,255,0.18);
}
.cta-final__slots-label{
  font-size:12px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:rgba(248,250,252,0.7);
}
.cta-final__slots-counter{
  display:flex;
  align-items:baseline;
  gap:12px;
  font-weight:700;
  color:#fff;
}
.cta-final__slots-number{
  font-size:30px;
  font-variant-numeric:tabular-nums;
  line-height:1;
  padding:8px 14px;
  border-radius:12px;
  background:rgba(12,15,20,0.25);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,0.18);
  transition:transform .35s ease, box-shadow .35s ease;
}
.cta-final__slots-counter.is-updating .cta-final__slots-number{
  transform:translateY(-6px) scale(1.05);
  box-shadow:0 12px 24px rgba(12,15,20,0.25);
}
.cta-final__slots-text{
  font-size:15px;
  opacity:.85;
}
.cta-final__social{
  display:flex;
  align-items:center;
  gap:14px;
}
.cta-social{
  width:42px;
  height:42px;
  border-radius:12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  transition:transform .18s ease, box-shadow .18s ease;
}
.cta-social svg{
  width:20px;
  height:20px;
  fill:currentColor;
}
.cta-social--fb{
  background:linear-gradient(135deg,#1877f2,#1455b1);
  box-shadow:0 12px 20px rgba(20,85,177,0.35);
}
.cta-social--ig{
  background:linear-gradient(135deg,#f9ce34,#ee2a7b 50%,#6228d7);
  box-shadow:0 12px 20px rgba(238,42,123,0.35);
}
.cta-social--li{
  background:linear-gradient(135deg,#0a66c2,#004182);
  box-shadow:0 12px 20px rgba(10,102,194,0.35);
}
.cta-social--wa{
  background:linear-gradient(135deg,#25d366,#128c7e);
  box-shadow:0 12px 20px rgba(18,140,126,0.35);
}
.cta-social:hover{
  transform:translateY(-3px);
  box-shadow:0 18px 26px rgba(12,15,20,0.25);
}
.cta-final__footnote{
  margin:0;
  font-size:13px;
  color:rgba(248,250,252,0.65);
  line-height:1.5;
}

@media (max-width:900px){
  .cta-final{
    margin:80px 0;
    padding:70px 20px;
  }
  .cta-final__inner{
    grid-template-columns:1fr;
    gap:36px;
  }
  .cta-final__card{
    padding:28px;
  }
}

@media (max-width:540px){
  .cta-final{
    margin:70px 0;
    padding:60px 18px;
  }
  .cta-final__actions{
    flex-direction:column;
    align-items:stretch;
  }
  .cta-final__social{
    justify-content:flex-start;
  }
  .cta-final__card{
    padding:24px;
  }
}

.site-footer{
  margin-top:80px;
  background: radial-gradient(circle at top left, rgba(135,47,245,0.35), transparent 55%),
              radial-gradient(circle at top right, rgba(255,0,110,0.25), transparent 60%),
              #0c0f14;
  color:#f8fafc;
  padding:70px 20px 40px;
  position:relative;
  overflow:hidden;
}
.site-footer::before{
  content:''; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(12,15,20,0) 0%, rgba(12,15,20,0.75) 100%);
  pointer-events:none;
}
.footer__top{
  position:relative; z-index:1;
  max-width:1180px; margin:0 auto 48px;
  padding:32px 36px;
  border-radius:28px;
  border:1px solid rgba(148,163,184,0.18);
  background:rgba(12,18,32,0.68);
  display:flex; flex-direction:column; gap:22px;
  box-shadow:0 26px 52px rgba(12,15,20,0.35);
}
.footer__top-text{
  display:flex; flex-direction:column; gap:10px;
  max-width:520px;
}
.footer__kicker{
  font-size:12px; letter-spacing:.32em; text-transform:uppercase;
  color:rgba(241,245,249,0.7); font-weight:800;
}
.footer__top-text h2{
  margin:0; font-size:clamp(26px,4vw,34px); font-weight:900; color:#fff;
}
.footer__top-text p{
  margin:0; color:rgba(241,245,249,0.78); line-height:1.6;
}
.footer__top-actions{
  display:flex; flex-wrap:wrap; gap:14px;
}
.footer__top-primary{
  box-shadow:0 20px 36px rgba(214,33,133,0.45);
}
.footer__top-secondary{
  background:var(--btn);
  color:#fff;
  border:0;
  box-shadow:0 18px 34px rgba(214,33,133,0.45);
}

.footer__body{
  position:relative; z-index:1;
  max-width:1180px; margin:0 auto 42px;
  display:grid; gap:40px;
  grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);
}

.footer__brand{
  display:flex; flex-direction:column; gap:22px;
}
.footer__logo{
  display:flex; align-items:center; gap:12px;
  font-weight:900; font-size:22px; letter-spacing:.08em; color:#fff;
}
.footer__logo-icon{
  width:34px; height:34px;
  display:inline-flex;
  color:#fff;
}
.footer__logo-icon svg{ width:34px; height:34px; }
.footer__logo-text{ letter-spacing:.08em; }
.footer__tagline{
  margin:0; color:rgba(248,250,252,0.72);
  max-width:420px; line-height:1.6;
}
.footer__stats{
  display:flex; flex-wrap:wrap; gap:18px;
}
.footer__stat{
  min-width:150px;
  background:rgba(255,255,255,0.06);
  border:1px solid rgba(255,255,255,0.1);
  border-radius:18px;
  padding:14px 18px;
}
.footer__stat-value{
  display:block;
  font-weight:900; font-size:20px; color:#fff;
}
.footer__stat-label{
  font-size:13px; color:rgba(248,250,252,0.75);
}

.footer__columns{
  display:grid; gap:34px;
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
}
.footer__column{
  display:flex; flex-direction:column; gap:14px;
}
.footer__label{
  font-size:12px; letter-spacing:.2em; text-transform:uppercase;
  color:rgba(248,250,252,0.55); font-weight:700;
}
.footer__links{
  display:grid; gap:10px;
}
.footer__links a{
  color:rgba(248,250,252,0.85); text-decoration:none; font-weight:600;
  transition:color .2s ease, transform .2s ease;
}
.footer__links a:hover{
  color:#fff; transform:translateX(4px);
}
.footer__contact{
  display:flex; flex-direction:column; gap:10px;
}
.footer__contact a{
  color:#fff; text-decoration:none; font-weight:600;
}
.footer__contact a:hover{
  color:rgba(255,255,255,0.85);
}
.footer__schedule{
  font-size:13px; color:rgba(248,250,252,0.62);
}
.footer__social{
  display:flex; gap:10px; flex-wrap:wrap;
}
.footer__social a{
  padding:8px 14px; border-radius:999px;
  background:rgba(248,250,252,0.1); color:#fff;
  font-weight:600; text-decoration:none;
  transition:background .2s ease, transform .2s ease;
}
.footer__social a:hover{
  background:rgba(248,250,252,0.18); transform:translateY(-1px);
}

.footer__bottom{
  position:relative; z-index:1;
  max-width:1180px; margin:48px auto 0;
  display:flex; flex-direction:column; gap:16px;
  color:rgba(248,250,252,0.6);
  font-size:13px;
  padding-top:24px;
  border-top:1px solid rgba(148,163,184,0.18);
}
.footer__legal{
  display:flex; gap:18px; flex-wrap:wrap;
}
.footer__legal a{
  color:rgba(248,250,252,0.7); text-decoration:none;
  transition:color .2s ease;
}
.footer__legal a:hover{ color:#fff; }

@media (min-width:820px){
  .footer__top{
    flex-direction:row;
    align-items:center;
    justify-content:space-between;
  }
}
@media (max-width:920px){
  .footer__body{
    grid-template-columns:1fr;
  }
}
@media (min-width:720px){
  .footer__bottom{
    flex-direction:row;
    align-items:center;
    justify-content:space-between;
  }
}

.modal[hidden]{ display:none !important; }
.modal{
  position:fixed; inset:0; z-index:999;
  display:flex; align-items:center; justify-content:center;
  padding:30px;
}
.modal__overlay{
  position:absolute; inset:0; background:rgba(12,15,20,.7); backdrop-filter:blur(6px);
}
.modal__content{
  position:relative; z-index:1;
  width:min(720px, 100%);
  max-height:90vh;
  background:#fff;
  border-radius:18px;
  box-shadow:0 30px 60px rgba(12,15,20,.35);
  padding:32px;
  display:flex; flex-direction:column;
  animation:modalIn .28s ease;
}
.modal__header{
  margin-bottom:18px;
}
.modal__header h2{
  margin:0;
  font-size:clamp(22px, 4vw, 32px);
  line-height:1.1;
  font-weight:800;
  color:var(--text);
}
.modal__lead{
  margin:8px 0 0;
  font-size:15px;
  color:var(--muted);
  line-height:1.5;
}
.modal__body{
  overflow:auto;
  padding-right:6px;
  color:var(--muted);
  line-height:1.6;
  font-size:15px;
  display:flex; flex-direction:column; gap:18px;
}
#brief-form{
  width:100%;
  max-width:960px;
  margin:0 auto;
}
.modal__body--iframe{
  padding:0;
  min-height:520px;
}
.modal__iframe{
  width:100%;
  min-height:70vh;
  border:0;
  border-radius:0 0 18px 18px;
  background:#0f172a;
}
.modal__close{
  position:absolute;
  top:18px; right:18px;
  border:0; background:rgba(12,15,20,.06);
  width:36px; height:36px;
  border-radius:50%;
  font-size:24px;
  cursor:pointer;
  color:var(--text);
  display:flex; align-items:center; justify-content:center;
  transition:background .2s ease, transform .2s ease;
}
.modal__close:hover{
  background:rgba(12,15,20,.12);
  transform:scale(1.05);
}

.exit-offer .modal__close{
  background:rgba(255,255,255,0.12);
  color:#fff;
}
.exit-offer .modal__close:hover{
  background:rgba(255,255,255,0.2);
}

.exit-offer .modal__content{
  width:min(640px,100%);
  background:radial-gradient(circle at 20% 20%, rgba(255,62,138,0.18) 0%, rgba(255,62,138,0) 32%), radial-gradient(circle at 80% 20%, rgba(135,47,245,0.22) 0%, rgba(135,47,245,0) 36%), linear-gradient(145deg,#0d081a 0%,#150f2c 45%,#241049 100%);
  color:#fff;
  text-align:center;
  padding:34px 28px 32px;
  align-items:center;
}
.exit-offer .modal__body{
  color:#fff;
  align-items:center;
  text-align:center;
}
.exit-offer__eyebrow{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 14px;
  border-radius:999px;
  font-size:12px;
  letter-spacing:.16em;
  text-transform:uppercase;
  font-weight:800;
  background:rgba(255,255,255,0.12);
  color:#ff9cf7;
}
.exit-offer__title{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
  color:#ffd447;
  margin:12px 0 4px;
  font-size:clamp(30px,6vw,46px);
  line-height:1.1;
  font-weight:900;
  text-transform:uppercase;
}
.exit-offer__label{
  font-size:clamp(14px,3vw,18px);
  letter-spacing:.14em;
  color:#f8d77f;
}
.exit-offer__price{
  display:inline-block;
  font-size:clamp(44px,8vw,64px);
  color:#ffeb7a;
  text-shadow:0 8px 20px rgba(0,0,0,0.35);
}
.exit-offer__priceRow{
  display:inline-flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  justify-content:center;
}
.exit-offer__currency{
  font-size:.55em;
  letter-spacing:.06em;
}
.exit-offer__sticker{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 12px;
  border-radius:999px;
  background:linear-gradient(135deg,#1dd1a1,#10ac84);
  color:#0b1420;
  font-size:13px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  box-shadow:0 10px 24px rgba(0,0,0,0.25);
}
.exit-offer__subtitle{
  margin:0 0 10px;
  color:#27e6ff;
  font-size:clamp(20px,4vw,30px);
  font-weight:800;
  text-transform:uppercase;
}
.exit-offer__lead{
  margin:4px auto 14px;
  color:rgba(255,255,255,0.88);
  max-width:640px;
  line-height:1.5;
  font-size:clamp(15px, 2.2vw, 18px);
}
.exit-offer__timer{
  margin:14px auto 8px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
}
.exit-offer__timerLabel{
  text-transform:uppercase;
  letter-spacing:.18em;
  font-size:12px;
  font-weight:700;
  color:rgba(255,255,255,0.9);
}
.exit-offer__values{
  display:flex;
  justify-content:center;
  gap:14px;
}
.exit-offer .flash-countdown__value{
  background:rgba(255,255,255,0.12);
  border-color:rgba(255,255,255,0.16);
  box-shadow:0 10px 22px rgba(0,0,0,0.26);
  color:#fff;
  min-width:68px;
  padding:10px 14px;
}
.exit-offer .flash-countdown__value strong{
  font-size:24px;
}
.exit-offer .flash-countdown__value small{
  font-size:13px;
}
.exit-offer__pills{
  margin:14px auto 4px;
  padding:0;
  list-style:none;
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
  max-width:620px;
  justify-items:center;
}
.exit-offer__pills li{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:10px 12px;
  background:rgba(255,255,255,0.08);
  border:1px solid rgba(255,255,255,0.14);
  border-radius:12px;
  color:#fff;
  font-weight:700;
  text-align:center;
  width:100%;
}
.exit-offer__pills i{
  color:#8bf1ff;
}
.exit-offer__actions{
  margin-top:18px;
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:10px;
}
.modal-mark{
  position:absolute;
  top:14px;
  left:14px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 14px;
  border-radius:999px;
  background:rgba(255,255,255,0.12);
  color:#fff;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-size:14px;
}
.modal-mark__icon{
  display:inline-flex;
  width:26px;
  height:26px;
}
.modal-mark__icon svg{
  width:100%;
  height:100%;
}
.exit-offer__actions .btn-outline{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
}
.exit-offer__actions .btn,
.exit-offer__actions .btn-outline{
  min-width:210px;
}

@media (max-width:640px){
  .exit-offer .modal__content{
    width:calc(100vw - 24px);
    padding:22px 14px 20px;
  }
  .exit-offer__title{ font-size:24px; }
  .exit-offer__price{ font-size:26px; }
  .exit-offer__lead{ font-size:14px; }
  .exit-offer__values{
    gap:8px;
  }
  .exit-offer__timer{
    margin:12px auto 6px;
  }
  .exit-offer .flash-countdown__value{
    min-width:60px;
    padding:8px 10px;
  }
  .exit-offer .flash-countdown__value strong{
    font-size:20px;
  }
  .exit-offer__bullets{
    font-size:14px;
  }
  .exit-offer__pills{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:10px;
    max-width:500px;
    width:100%;
  }
  .exit-offer__actions{
    gap:8px;
    width:100%;
    flex-direction:column;
  }
  .exit-offer__actions .btn,
  .exit-offer__actions .btn-outline{
    min-width:0;
    width:100%;
    padding:12px 14px;
  }
}

@media (min-width:1024px){
  .exit-offer__pills{
    grid-template-columns:repeat(4, minmax(0, 1fr));
    max-width:900px;
  }
}

@keyframes modalIn{
  from{ transform:translateY(12px); opacity:0; }
  to{ transform:translateY(0); opacity:1; }
}

/* Landing hero + CTA flow */
.hero{
  position:relative;
  min-height:calc(100vh - var(--flashH,0px));
  padding:clamp(120px, 16vw, 180px) 16px 110px;
  background:#000;
  color:#fff;
  overflow:visible;
  display:flex;
  flex-direction:column;
  align-items:center;
}
.hero::before,
.hero::after{
  display:none;
}
.hero__inner{
  position:relative;
  z-index:3;
  width:100%;
  max-width:1100px;
  display:flex;
  justify-content:center;
  align-items:flex-start;
}
.bg-gradient{
  position:absolute;
  inset:0;
  z-index:0;
  filter:blur(190px) saturate(150%);
  opacity:.83;
  background:
    radial-gradient(circle at 20% 25%, #ff5000 0%, transparent 45%),
    radial-gradient(circle at 80% 30%, #ff0095 0%, transparent 45%),
    radial-gradient(circle at 50% 75%, #00e0ff 0%, transparent 50%),
    radial-gradient(circle at 30% 85%, #00ff90 0%, transparent 50%),
    radial-gradient(circle at 70% 55%, #a100ff 0%, transparent 45%);
  pointer-events:none;
}
.bg-kodin{
  position:absolute;
  inset:0;
  z-index:1;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:2vh;
  opacity:0.12;
  pointer-events:none;
}
.bg-kodin .row{
  width:200%;
  font-size:260px;
  font-weight:900;
  text-transform:uppercase;
  color:#e6e6e6;
  white-space:nowrap;
  line-height:0.85;
  display:flex;
  justify-content:space-between;
  animation: kodinMove 38s linear infinite;
  animation-fill-mode:both;
}
.bg-kodin .row:nth-child(odd){
  transform:translateX(-8%);
  animation-duration:40s;
}
.bg-kodin .row:nth-child(even){
  transform:translateX(-2%);
  animation-direction:reverse;
  animation-duration:44s;
}
@keyframes kodinMove{
  0%{ transform:translateX(-8%); }
  100%{ transform:translateX(-38%); }
}
.bg-overlay{
  position:absolute;
  inset:0;
  z-index:2;
  background:linear-gradient(
    to bottom,
    rgba(0,0,0,0.35),
    rgba(0,0,0,0.75) 35%,
    rgba(0,0,0,0.90)
  );
}
.top-countdown{
  position:fixed;
  top:calc(var(--announcementH, 0px) + var(--headerH, 72px) + 8px);
  left:0;
  right:0;
  z-index:900;
  transform:none;
  width:min(780px, calc(100% - 32px));
  max-width:780px;
  margin:0 auto;
  padding:8px 0;
  box-sizing:border-box;
  display:flex;
  justify-content:center;
  pointer-events:auto;
}
.top-countdown .inner{
  width:100%;
  max-width:740px;
  margin:0 auto;
  padding:10px 18px;
  display:flex;
  align-items:center;
  gap:14px;
  flex-wrap:nowrap;
  justify-content:space-between;
  background:rgba(255,255,255,0.06);
  backdrop-filter:blur(18px) saturate(140%);
  border-radius:28px;
  border:1px solid rgba(255,255,255,0.12);
  box-shadow:0 10px 28px rgba(0,0,0,0.25);
  position:relative;
}
.top-countdown.is-solid .inner{
  background:rgba(0,0,0,0.9);
  border-color:rgba(255,255,255,0.08);
  box-shadow:0 14px 32px rgba(0,0,0,0.4);
}
.cd-close{
  position:absolute;
  top:8px;
  right:10px;
  border:0;
  background:rgba(0,0,0,0.35);
  color:#fff;
  width:24px;
  height:24px;
  border-radius:50%;
  cursor:pointer;
  font-size:16px;
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:transform .2s ease, opacity .2s ease;
}
.cd-close:hover{
  transform:scale(1.05);
  opacity:0.9;
}
.cd-title{
  font-weight:800;
  letter-spacing:1px;
  font-size:17px;
  text-transform:uppercase;
  display:inline-flex;
  align-items:center;
  gap:8px;
  white-space:nowrap;
}
.cd-boxes{
  display:flex;
  gap:12px;
  align-items:center;
  flex-wrap:nowrap;
  justify-content:center;
}
.cd-card{
  background:rgba(255,255,255,0.12);
  border:1px solid rgba(255,255,255,0.22);
  padding:12px 20px;
  border-radius:16px;
  backdrop-filter:blur(14px);
  font-weight:700;
  font-size:17px;
  letter-spacing:1px;
  color:#fff;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:4px;
}
.cd-card span{
  font-size:22px;
  font-weight:900;
  color:#ffd84d;
}
.cd-card small{
  font-size:11px;
  color:#fff;
  opacity:.85;
}
.cd-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 18px;
  border-radius:18px;
  background:var(--btn);
  color:#fff;
  font-weight:800;
  letter-spacing:.04em;
  text-decoration:none;
  box-shadow:0 18px 32px rgba(214,33,133,0.35);
  text-transform:uppercase;
  font-size:13px;
  transition:transform .2s ease, box-shadow .2s ease;
  align-self:center;
}
.cd-cta:hover{
  transform:translateY(-2px);
  box-shadow:0 22px 36px rgba(214,33,133,0.4);
}
.hero-card{
  position:relative;
  z-index:3;
  width:100%;
  max-width:1040px;
  margin:0 auto;
  padding:54px 52px;
  border-radius:34px;
  background:
    linear-gradient(145deg, rgba(255,120,40,0.18), rgba(70,20,120,0.25)),
    radial-gradient(circle at 25% 25%, rgba(255,130,50,0.3), transparent 52%),
    radial-gradient(circle at 75% 20%, rgba(60,0,140,0.32), transparent 55%),
    radial-gradient(circle at 50% 78%, rgba(0,160,120,0.24), transparent 55%),
    rgba(12,12,16,0.86);
  border:1px solid rgba(255,255,255,0.14);
  backdrop-filter:blur(26px) saturate(160%);
  box-shadow:0 26px 90px rgba(0,0,0,0.65);
  text-align:center;
}
.badge-group{
  display:flex;
  justify-content:center;
  gap:16px;
  margin-bottom:26px;
  flex-wrap:wrap;
}
.badge-main{
  background:linear-gradient(90deg,#ff006a,#b100ff);
  padding:10px 26px;
  border-radius:40px;
  font-weight:800;
  font-size:15px;
  box-shadow:0 0 25px rgba(255,0,149,.45);
}
.badge-msi{
  background:#ffd24d;
  padding:12px 24px;
  border-radius:999px;
  font-size:14px;
  font-weight:900;
  color:#0c0f14;
  letter-spacing:.06em;
  text-transform:uppercase;
  box-shadow:0 16px 32px rgba(0,0,0,0.18);
}
.hero-title{
  font-size:48px;
  font-weight:800;
  text-transform:uppercase;
  line-height:1.1;
  margin-bottom:12px;
  color:#fff;
}
.highlight{
  font-size:78px;
  font-weight:900;
  color:#00ffea;
  text-shadow:0 0 50px rgba(0,255,230,0.9);
  letter-spacing:-1px;
  display:inline-block;
  margin-top:5px;
}
.subtitle{
  font-size:26px;
  opacity:0.85;
  margin:0;
}
.price-area{
  margin:40px 0;
}
.old-price{
  font-size:20px;
  opacity:0.75;
  text-decoration:line-through;
  display:block;
  margin-bottom:6px;
}
.price{
  font-size:108px;
  font-weight:900;
  color:#ffd84d;
  text-shadow:0 0 35px rgba(255,216,77,.6);
  letter-spacing:-4px;
}
.features{
  margin:50px auto;
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  justify-items:center;
  width:100%;
  max-width:900px;
  gap:20px;
}
.f-item{
  width:100%;
  text-align:center;
  justify-content:center;
  padding:16px 10px;
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.18);
  border-radius:12px;
  display:flex;
  align-items:center;
  gap:10px;
  font-weight:600;
  font-size:17px;
  transition:transform .2s ease, box-shadow .2s ease;
}
.f-item i{
  color:#ffd84d;
  font-size:22px;
}
.f-item:hover{
  transform:translateY(-4px);
  box-shadow:0 10px 26px rgba(0,0,0,0.18);
}
.buttons{
  margin-top:10px;
  display:flex;
  justify-content:center;
  gap:24px;
  flex-wrap:wrap;
}
.hero-trust{
  margin-top:14px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  justify-content:center;
}
.trust-pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 14px;
  border-radius:999px;
  background:rgba(255,255,255,0.14);
  border:1px solid rgba(255,255,255,0.22);
  color:#fff;
  font-weight:700;
  font-size:14px;
}
.trust-pill i{
  color:#ff8bd6;
}
.btn-primary{
  padding:18px 55px;
  border-radius:40px;
  font-size:19px;
  font-weight:900;
  color:white;
  text-transform:uppercase;
  background:linear-gradient(90deg,#ff006a,#b100ff,#ff4d00);
  background-size:300% 100%;
  border:none;
  cursor:pointer;
  box-shadow:0 0 40px rgba(255,0,149,.55);
  transition:.35s;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
}
.btn-primary:hover{
  background-position:100% 0;
  transform:translateY(-1px);
  box-shadow:0 0 55px rgba(255,0,149,.75);
}
.btn-secondary{
  padding:18px 55px;
  border-radius:40px;
  font-size:18px;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.25);
  color:white;
  cursor:pointer;
  transition:.3s;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.btn-secondary:hover{
  background:rgba(255,255,255,.22);
  transform:translateY(-1px);
}
.btn-badge-yellow{
  background:#ffd24d;
  color:#0c0f14;
  font-weight:900;
  border-radius:999px;
  padding:12px 24px;
  border:none;
  box-shadow:0 10px 22px rgba(0,0,0,0.12);
  letter-spacing:.05em;
  text-transform:uppercase;
  text-decoration:none;
}
.btn-badge-yellow:hover,
.btn-badge-yellow:focus-visible{
  transform:translateY(-1px);
  box-shadow:0 14px 28px rgba(0,0,0,0.16);
  color:#0c0f14;
  text-decoration:none;
}
@media (max-width:900px){
  .hero{
    padding:110px 14px 90px;
  }
  .features{
    grid-template-columns: repeat(2, 1fr);
  }
  .top-countdown .inner{
    flex-direction:column;
    align-items:center;
    text-align:center;
    gap:8px;
    width:100%;
    max-width:100%;
    display:flex;
  }
  .top-countdown{
    left:0;
    right:0;
    transform:none;
    width:calc(100% - 16px);
    max-width:none;
    margin:0 auto;
    padding:6px 8px 10px;
  }
  .cd-boxes{
    width:100%;
    justify-content:center;
    gap:8px;
  }
  .cd-cta{
    width:100%;
  }
}
@media (max-width:720px){
  .hero{
    padding:100px 12px 90px;
  }
  .hero-card{
    padding:38px 26px;
    margin:0 8px;
  }
  .top-countdown{
    top:calc(var(--announcementH, 0px) + var(--headerH, 66px));
    left:0;
    right:0;
    transform:none;
    width:calc(100% - 12px);
    max-width:none;
    margin:0 auto;
    padding:4px 6px 8px;
  }
  .top-countdown .inner{
    padding:8px 10px;
    border-radius:16px;
    max-width:100%;
    gap:3px;
  }
  .cd-boxes{
    width:100%;
    justify-content:center;
    gap:3px;
  }
  .cd-card{
    padding:6px 8px;
  }
  .hero-title{
    font-size:34px;
  }
  .highlight{
    font-size:52px;
    letter-spacing:-0.5px;
  }
  .price{
    font-size:72px;
    letter-spacing:-2px;
  }
  .features{
    gap:16px;
  }
  .buttons{
    gap:14px;
  }
  .btn-primary,
  .btn-secondary{
    width:100%;
  }
}
@media (max-width:550px){
  .features{
    grid-template-columns:repeat(1, 1fr);
  }
}

.wa-fab{
  position:fixed;
  right:20px;
  bottom:24px;
  width:72px;
  height:72px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#25d366;
  color:#fff;
  border-radius:50%;
  border:2px solid #fff;
  text-decoration:none;
  box-shadow:0 18px 36px rgba(0,0,0,0.22);
  transition:transform .15s ease, box-shadow .15s ease;
  z-index:150;
}
.wa-fab:hover{
  transform:translateY(-1px);
  box-shadow:0 22px 44px rgba(0,0,0,0.28);
}
.wa-fab svg{
  width:32px;
  height:32px;
  fill:currentColor;
}
.wa-fab::after{
  content:"Hola";
  position:absolute;
  right:82px;
  bottom:16px;
  padding:10px 14px;
  border-radius:16px;
  background:#fff;
  color:var(--text);
  font-weight:700;
  font-size:15px;
  line-height:1.1;
  white-space:nowrap;
  box-shadow:0 12px 28px rgba(0,0,0,0.18);
  animation:waBubbleSwap 7s ease-in-out infinite;
}
.wa-fab::before{
  content:"";
  position:absolute;
  right:64px;
  bottom:24px;
  width:12px;
  height:12px;
  background:#fff;
  transform:rotate(45deg);
  box-shadow:-4px 12px 16px rgba(0,0,0,0.08);
}
@keyframes waBubbleSwap{
  0%,45%{content:"Hola";}
  55%,100%{content:"¿Necesitas ayuda?";}
}
.wa-fab--no-bubble::after,
.wa-fab--no-bubble::before{
  display:none;
}
.has-cookie-banner #wa-fab{
  bottom:132px;
}
.has-cookie-banner .wa-fab::after,
.has-cookie-banner .wa-fab::before{
  display:none;
}
.cookie-banner{
  position:fixed;
  left:0;
  right:0;
  bottom:0;
  width:100%;
  padding:0 20px 20px;
  z-index:190;
}
.cookie-banner__inner{
  max-width:1180px;
  margin:0 auto;
  display:flex;
  align-items:center;
  gap:14px;
  padding:12px 16px;
  border-radius:14px;
  background:var(--text);
  color:#f5f7fb;
  box-shadow:0 -8px 26px rgba(0,0,0,0.18);
  border:1px solid rgba(255,255,255,0.08);
}
.cookie-banner__text{
  flex:1;
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  color:rgba(255,255,255,0.86);
  font-size:14px;
  line-height:1.35;
}
.cookie-banner__text strong{
  color:#fff;
  font-size:14.5px;
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.cookie-banner__text span{
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.cookie-banner__btn{
  align-self:center;
  padding:10px 14px;
  border-radius:12px;
  border:0;
  background:#fff;
  color:#fff;
  color:var(--text);
  font-weight:800;
  letter-spacing:.02em;
  cursor:pointer;
  transition:transform .15s ease, box-shadow .15s ease;
  box-shadow:0 12px 22px rgba(0,0,0,0.12);
}
.cookie-banner__btn:hover,
.cookie-banner__btn:focus-visible{
  transform:translateY(-1px);
  box-shadow:0 16px 28px rgba(0,0,0,0.16);
}
.cookie-banner__btn:active{
  transform:translateY(0);
  box-shadow:0 10px 18px rgba(0,0,0,0.14);
}
@media (max-width:640px){
  .cookie-banner{
    padding:0 12px 16px;
  }
  .has-cookie-banner #wa-fab{
    bottom:124px;
  }
  .has-cookie-banner .wa-fab::after,
  .has-cookie-banner .wa-fab::before{
    display:none;
  }
  .cookie-banner__inner{
    flex-direction:column;
    align-items:flex-start;
    gap:10px;
    padding:12px 14px;
  }
  .cookie-banner__text{
    font-size:13px;
  }
  .cookie-banner__text strong{
    font-size:14px;
  }
  .cookie-banner__btn{
    width:100%;
    text-align:center;
  }
}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:14px 24px;
  border-radius:999px;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  border:0;
  cursor:pointer;
  background:var(--btn);
  color:#fff;
  text-decoration:none;
  transition:transform .2s ease, box-shadow .2s ease;
  box-shadow:0 18px 32px rgba(214,33,133,.35);
}
.btn:hover,
.btn:focus-visible{
  transform:translateY(-2px);
  box-shadow:0 22px 36px rgba(214,33,133,.4);
}
.btn-outline{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:14px 24px;
  border-radius:999px;
  font-weight:700;
  letter-spacing:.02em;
  border:1px solid rgba(12,15,20,.18);
  background:rgba(255,255,255,.82);
  color:var(--text);
  cursor:pointer;
  text-decoration:none;
  transition:transform .2s ease, background .2s ease;
  box-shadow:0 10px 26px rgba(12,15,20,.12);
}
.btn-outline:hover,
.btn-outline:focus-visible{
  transform:translateY(-2px);
  background:#fff;
}

.hint{
  font-size:13px;
  color:var(--muted);
  margin:12px 0 0;
}
.modal .grid{
  display:grid;
  gap:12px;
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
}
.modal input,
.modal textarea,
.modal select{
  width:100%;
  border-radius:12px;
  border:1px solid rgba(12,15,20,.12);
  padding:12px 14px;
  font:inherit;
  background:#fff;
  box-shadow:0 8px 22px rgba(12,15,20,.06);
}
.modal textarea{
  min-height:120px;
  resize:vertical;
}
.modal fieldset{
  border:1px solid rgba(12,15,20,.12);
  border-radius:12px;
  padding:12px 16px;
  display:grid;
  gap:8px;
  grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
}
.modal fieldset legend{
  font-weight:700;
  color:var(--text);
  padding:0 4px;
}
.modal label{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-weight:600;
}

.modal-section{
  display:flex;
  flex-direction:column;
  gap:10px;
  color:var(--muted);
}
.modal-section h3{
  margin:0;
  font-size:18px;
  font-weight:800;
  color:var(--text);
}
.modal-subsection{
  display:flex;
  flex-direction:column;
  gap:6px;
}
.modal-subsection h4{
  margin:0;
  font-size:15px;
  font-weight:700;
  color:var(--text);
  text-transform:uppercase;
  letter-spacing:.06em;
}
.modal-section ol{
  margin:0;
  padding-left:20px;
  display:grid;
  gap:6px;
}
.modal-section ul{
  margin:6px 0 0;
  padding-left:18px;
  display:grid;
  gap:4px;
}
.modal-intro{
  margin:0;
  color:var(--muted);
}
.modal-note{
  margin:0;
  font-size:14px;
  color:var(--muted);
}
.modal-section a{
  color:var(--accent);
  text-decoration:none;
  font-weight:600;
}
.modal-section a:hover{
  text-decoration:underline;
}

.modal-form{
  display:flex;
  flex-direction:column;
  gap:18px;
}
.modal-form__group{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.modal-form__grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:16px;
}
.modal-form label{
  font-size:14px;
  font-weight:700;
  color:var(--text);
}
.modal-form input,
.modal-form select,
.modal-form textarea{
  width:100%;
  padding:12px 14px;
  border-radius:12px;
  border:1px solid rgba(12,15,20,0.15);
  background:#fff;
  font:inherit;
  color:var(--text);
  transition:border-color .18s ease, box-shadow .18s ease;
}
.modal-form input:focus,
.modal-form select:focus,
.modal-form textarea:focus{
  border-color:rgba(135,47,245,0.55);
  box-shadow:0 0 0 3px rgba(135,47,245,0.18);
  outline:none;
}
.modal-form textarea{
  resize:vertical;
  min-height:90px;
}
.modal-form__footer{
  display:flex;
  flex-direction:column;
  gap:12px;
  align-items:flex-start;
}
.modal-form__small{
  margin:0;
  font-size:12.5px;
  color:var(--muted);
}
.modal-form__small a{
  color:var(--accent);
  text-decoration:none;
  font-weight:600;
}
.modal-form__small a:hover{ text-decoration:underline; }
.modal-form__submit{
  min-width:180px;
}

.brief-progress{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(160px, 1fr));
  gap:10px;
  margin-bottom:18px;
}
.brief-progress__step{
  border:1px solid rgba(12,15,20,0.16);
  border-radius:999px;
  padding:12px 14px;
  text-align:center;
  background:#f7f8fb;
  font-weight:800;
  letter-spacing:.05em;
  cursor:pointer;
  color:var(--muted);
  transition:all .2s ease;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  box-shadow:0 8px 18px rgba(0,0,0,0.04);
}
.brief-progress__step.is-active{
  border-color:rgba(135,47,245,0.35);
  color:#2b0e5d;
  background:linear-gradient(135deg, rgba(135,47,245,0.12), rgba(0,200,255,0.08));
  box-shadow:0 10px 24px rgba(0,0,0,0.08);
  transform:translateY(-2px);
}
.brief-progress__step i{
  color:var(--accent);
}
.brief-step{
  display:none;
  gap:18px;
  animation:modalIn .25s ease;
  background:#fff;
  border:1px solid rgba(12,15,20,0.08);
  border-radius:18px;
  padding:18px;
  box-shadow:0 14px 32px rgba(0,0,0,0.06);
  width:100%;
}
.brief-step.is-active{
  display:grid;
}
.brief-progress__meter{
  height:8px;
  background:#f0f2f7;
  border-radius:999px;
  overflow:hidden;
  margin:-4px 2px 14px;
  box-shadow:inset 0 1px 2px rgba(0,0,0,0.05);
}
.brief-progress__bar{
  height:100%;
  width:0;
  border-radius:999px;
  background:#ff3e8a;
  transition:width .25s ease;
  box-shadow:0 6px 16px rgba(0,0,0,0.12);
}
.brief-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:16px;
}
.brief-grid label{
  display:flex;
  flex-direction:column;
  font-weight:600;
  font-size:14px;
  color:var(--muted);
  gap:6px;
  background:#fff;
  border:1px solid rgba(12,15,20,0.08);
  border-radius:12px;
  padding:12px;
  box-shadow:0 8px 20px rgba(0,0,0,0.03);
  width:100%;
  box-sizing:border-box;
  position:relative;
}
.brief-grid input{
  padding:12px 38px 12px 12px;
  border-radius:12px;
  border:1px solid rgba(12,15,20,0.12);
}
.brief-grid select{
  padding:12px 38px 12px 12px;
  border-radius:12px;
  border:1px solid rgba(12,15,20,0.12);
  background:#fff;
}
.brief-grid textarea{
  padding:12px 38px 12px 12px;
}
.brief-grid input,
.brief-grid select{
  width:100%;
}
.brief-fieldset{
  border:1px solid rgba(12,15,20,0.1);
  border-radius:16px;
  padding:16px;
  display:grid;
  gap:12px;
  background:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.8);
  grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
}
.brief-fieldset > .brief-row,
.brief-fieldset > .brief-question,
.brief-fieldset > select,
.brief-fieldset > .brief-note,
.brief-fieldset > textarea{
  grid-column:1 / -1;
}
.brief-conditional{
  grid-column:1 / -1;
}
.brief-fieldset label{
  width:100%;
  box-sizing:border-box;
  word-break:break-word;
}
.brief-question{
  font-weight:700;
  color:var(--text);
  margin:0 0 4px;
  font-size:15px;
}
.brief-row{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:14px;
  align-items:start;
}
.brief-conditional{
  padding:12px 14px;
  border:1px dashed rgba(12,15,20,0.25);
  border-radius:12px;
  background:#f7f8fb;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.9);
}
.brief-fieldset select,
.brief-fieldset textarea,
.brief-fieldset input[type="text"],
.brief-fieldset input[type="url"],
.brief-fieldset input[type="number"]{
  width:100%;
  padding:12px 38px 12px 12px;
  border-radius:12px;
  border:1px solid rgba(12,15,20,0.12);
}
.brief-conditional[hidden]{
  display:none;
}
.brief-note{
  margin:6px 0 0;
  font-size:13px;
  color:var(--muted);
}
.brief-stack{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:6px;
}
.brief-row > div{
  background:#f9fafb;
  border:1px solid rgba(12,15,20,0.08);
  border-radius:12px;
  padding:12px;
  box-shadow:0 10px 24px rgba(0,0,0,0.03);
  display:flex;
  flex-direction:column;
  gap:10px;
  width:100%;
  box-sizing:border-box;
}
.brief-row > div p:last-child{
  margin-bottom:0;
}
.brief-field{
  padding-right:42px;
  position:relative;
}
.brief-inputWrap{
  position:relative;
  display:block;
}
.brief-status{
  position:absolute;
  top:50%;
  right:12px;
  width:18px;
  height:18px;
  border-radius:50%;
  background:rgba(0,0,0,0.04);
  border:1px solid rgba(0,0,0,0.06);
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-size:10px;
  font-weight:900;
  opacity:0;
  transform:translateY(-50%) scale(0.85);
  transition:all .2s ease;
  pointer-events:none;
  z-index:2;
  box-shadow:0 3px 8px rgba(0,0,0,0.08);
}
.brief-status.is-valid{
  background:#16a34a;
  border-color:#0f8a32;
  opacity:1;
  transform:translateY(-50%) scale(1);
}
.brief-status.is-invalid{
  background:#dc2626;
  border-color:#b91c1c;
  opacity:1;
  transform:translateY(-50%) scale(1);
}
.brief-fieldset legend,
.brief-fieldset__label{
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-size:12px;
  margin-bottom:4px;
  color:var(--muted);
}
.brief-fieldset label{
  display:grid;
  grid-template-columns:auto 1fr;
  align-items:flex-start;
  gap:10px;
  font-weight:700;
  cursor:pointer;
  color:var(--text);
  line-height:1.4;
  background:#fff;
  border:1px solid rgba(12,15,20,0.06);
  border-radius:10px;
  padding:10px 12px;
  word-break:break-word;
  position:relative;
}
.brief-fieldset input[type="checkbox"],
.brief-fieldset input[type="radio"]{
  transform:translateY(4px);
  flex-shrink:0;
}
.brief-nav{
  display:flex;
  gap:10px;
  margin-top:18px;
  justify-content:flex-end;
  flex-wrap:wrap;
}
.brief-nav .btn,
.brief-nav .btn-outline{
  min-width:140px;
  padding:12px 16px;
  border-radius:14px;
  font-weight:800;
  letter-spacing:.01em;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  box-shadow:0 8px 20px rgba(0,0,0,0.08);
}
.brief-nav .btn-outline{
  box-shadow:none;
}
.brief-checkout{
  margin-top:24px;
  border:1px solid rgba(12,15,20,0.12);
  border-radius:18px;
  padding:18px;
  background:linear-gradient(135deg, rgba(135,47,245,0.06), rgba(0,170,255,0.04));
  box-shadow:0 10px 26px rgba(0,0,0,0.04);
}
.brief-checkout__head{
  display:flex;
  justify-content:space-between;
  gap:14px;
  align-items:flex-start;
  flex-wrap:wrap;
  margin-bottom:12px;
}
.brief-checkout__eyebrow{
  margin:0;
  font-size:12px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--muted);
  font-weight:800;
}
.brief-checkout__title{
  margin:4px 0;
}
.brief-checkout__lead{
  margin:0;
  color:var(--muted);
}
.brief-checkout__status{
  padding:8px 12px;
  border-radius:12px;
  background:rgba(135,47,245,0.08);
  color:var(--accent);
  font-weight:700;
}
.brief-checkout__body{
  display:grid;
  gap:10px;
}
.mp-wallet-container{
  min-height:120px;
  padding:8px;
  background:#fff;
  border:1px dashed rgba(12,15,20,0.15);
  border-radius:12px;
}
.brief-highlight{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:12px;
}
.chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 10px;
  border-radius:999px;
  font-weight:700;
  font-size:12px;
}
.chip--outline{
  border:1px solid rgba(12,15,20,0.16);
  color:#0c0f14;
  background:linear-gradient(135deg, rgba(135,47,245,0.08), rgba(0,170,255,0.04));
}
.hl{font-weight:800;}
.hl.hl-1{color:var(--hl-1);}
.hl.hl-2{color:var(--hl-2);}
.hl.hl-3{color:var(--hl-3);}
.hl.hl-4{color:var(--hl-4);}
.hl.hl-5{color:var(--hl-5);}
.hl.hl-6{color:var(--hl-6);}
.hl.hl-7{color:var(--hl-7);}
.hl.hl-8{color:var(--hl-8);}
.mp-wallet--loading{
  opacity:0.9;
}
.mp-skeleton{
  display:grid;
  gap:8px;
}
.mp-skeleton__bar{
  height:12px;
  border-radius:10px;
  background:linear-gradient(90deg, rgba(12,15,20,0.08), rgba(12,15,20,0.15), rgba(12,15,20,0.08));
  background-size:200% 100%;
  animation:mp-sheen 1.2s ease-in-out infinite;
}
.mp-fallback{
  border:1px solid rgba(12,15,20,0.12);
  border-radius:12px;
  padding:14px;
  background:#fffaf5;
}
.mp-fallback__box{
  display:grid;
  gap:10px;
}
.mp-fallback__text{
  margin:0;
  color:#7a4b00;
  font-weight:600;
}
.mp-fallback__actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.brief-checkout__helper{
  margin:0;
  color:var(--muted);
  font-size:13px;
}
.brief-step--payment{
  background:linear-gradient(145deg, rgba(255,255,255,0.9), rgba(135,47,245,0.05));
  border-radius:18px;
  padding:10px 10px 2px;
}
.payment-head{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:flex-start;
  flex-wrap:wrap;
  margin-bottom:8px;
}
.payment-eyebrow{
  margin:0;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:12px;
  color:var(--muted);
  font-weight:800;
}
.payment-title{
  margin:2px 0;
  font-size:22px;
}
.payment-lead{
  margin:0;
  color:var(--muted);
}
.payment-badges{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.payment-grid{
  display:grid;
  grid-template-columns:2fr 1fr;
  gap:18px;
  align-items:start;
}
.payment-left{
  display:grid;
  gap:14px;
}
.pay-card-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
  gap:12px;
}
.pay-card{
  display:block;
  position:relative;
}
.pay-card__body{
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:10px;
  align-items:center;
  padding:12px;
  background:#fff;
  border:1px solid rgba(12,15,20,0.1);
  border-radius:14px;
  box-shadow:0 12px 28px rgba(0,0,0,0.06);
  transition:all .2s ease;
  cursor:pointer;
}
.pay-card input:checked + .pay-card__body{
  border-color:var(--accent);
  box-shadow:0 18px 40px rgba(135,47,245,0.16);
  transform:translateY(-2px);
}
.pay-card__icon{
  width:46px;
  height:46px;
  border-radius:12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:rgba(12,15,20,0.06);
  color:var(--text);
  font-size:18px;
}
.pay-card__icon img{
  width:100%;
  height:100%;
  object-fit:contain;
}
.pay-card__icon--mp{
  background:linear-gradient(135deg,#5c7bff 0%, #9d4bff 100%);
  color:#fff;
}
.pay-card__icon--mp{
  border-radius:6px;
  background:#ffd602;
  border:1px solid rgba(12,15,20,0.14);
  box-shadow:0 8px 16px rgba(0,0,0,0.08);
}
.pay-card__icon--paypal{
  background:#023087;
  color:#fff;
}
.pay-card__info{
  display:flex;
  flex-direction:column;
  gap:2px;
}
.pay-card__info span{
  color:var(--muted);
  font-size:13px;
}
.pay-card__cta{
  border:1px solid rgba(2,48,135,0.2);
  background:rgba(2,48,135,0.08);
  color:#023087;
  border-radius:10px;
  padding:8px 10px;
  font-weight:800;
  display:inline-flex;
  align-items:center;
  gap:6px;
  cursor:pointer;
  transition:all .16s ease;
}
.pay-card__cta:hover{
  background:rgba(2,48,135,0.16);
  border-color:rgba(2,48,135,0.3);
}
.mp-preview{
  border:1px solid rgba(12,15,20,0.12);
  border-radius:16px;
  padding:14px;
  background:linear-gradient(135deg, rgba(135,47,245,0.08), rgba(0,170,255,0.06));
  box-shadow:0 14px 30px rgba(0,0,0,0.08);
  display:grid;
  gap:12px;
}
.mp-preview__head{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
  flex-wrap:wrap;
}
.mp-preview__brand{
  display:flex;
  align-items:center;
  gap:10px;
}
.mp-preview__logo{
  width:40px;
  height:40px;
  border-radius:12px;
  background:#fff;
  border:1px solid rgba(12,15,20,0.1);
  display:grid;
  place-items:center;
  color:var(--accent);
}
.mp-preview__logo--mp{
  border-radius:6px;
  background:#ffd602;
  border:1px solid rgba(12,15,20,0.14);
  box-shadow:0 8px 16px rgba(0,0,0,0.08);
}
.mp-preview__logo img{
  width:100%;
  height:100%;
  object-fit:contain;
}
.mp-preview__fields{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:8px;
}
.mp-preview__field{
  display:block;
  padding:10px 12px;
  border-radius:10px;
  background:#fff;
  border:1px dashed rgba(12,15,20,0.14);
  color:var(--muted);
  font-size:12px;
}
.mp-preview__field--wide{
  grid-column:span 2;
}
.mp-preview__note{
  margin:0;
  color:var(--muted);
  font-size:13px;
}
.payment-helpers{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
}
.payment-hint{
  margin:0;
  color:var(--muted);
  font-size:13px;
}
.btn--ghost{
  background:#fff;
  border:1px solid rgba(12,15,20,0.12);
  color:var(--text);
  box-shadow:0 12px 26px rgba(0,0,0,0.08);
}
.btn--ghost:hover{
  transform:translateY(-2px);
  border-color:rgba(12,15,20,0.24);
}
.payment-summary{
  display:grid;
  gap:10px;
}
.payment-summary__card{
  background:#fff;
  border:1px solid rgba(12,15,20,0.12);
  border-radius:16px;
  padding:14px;
  box-shadow:0 14px 30px rgba(0,0,0,0.08);
  display:grid;
  gap:6px;
}
.payment-summary__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  font-weight:800;
}
.payment-summary__pill{
  background:rgba(135,47,245,0.12);
  color:var(--accent);
  padding:6px 10px;
  border-radius:999px;
  font-size:12px;
}
.payment-summary__row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:10px 0;
  border-bottom:1px dashed rgba(12,15,20,0.12);
  font-weight:700;
}
.payment-summary__row:last-child{
  border-bottom:0;
  padding-bottom:0;
}
.payment-summary__row--total strong{
  font-size:18px;
}
.payment-summary__note{
  margin:0;
  color:var(--muted);
  font-size:13px;
}
.chip--purple{
  background:rgba(135,47,245,0.14);
  color:var(--accent);
  border:1px solid rgba(135,47,245,0.24);
}
.is-disabled{
  opacity:0.55;
  cursor:not-allowed;
  pointer-events:none;
}
.brief-upsells{
  display:grid;
  gap:10px;
}
.upsell-card{
  border:1px solid rgba(12,15,20,0.12);
  border-radius:14px;
  padding:12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  background:#fff;
}
.upsell-card h4{
  margin:0 0 4px;
}
.upsell-card p{
  margin:0;
  color:var(--muted);
}

@media(max-width:980px){
  .payment-grid{
    grid-template-columns:1fr;
  }
  .payment-summary{
    order:-1;
  }
}
@media(max-width:640px){
  .pay-card__body{
    grid-template-columns:1fr;
    text-align:left;
  }
  .pay-card__body .chip{
    justify-self:flex-start;
  }
  .mp-preview__fields{
    grid-template-columns:1fr;
  }
}
@media(max-width:600px){
  .brief-progress{
    grid-template-columns:1fr;
  }
  .brief-nav{
    flex-direction:column;
  }
  .brief-nav .btn,
  .brief-nav .btn-outline{
    width:100%;
  }
  .brief-checkout__head{
    flex-direction:column;
  }
  .brief-checkout__status{
    width:100%;
    text-align:left;
  }
}

@keyframes mp-sheen{
  0%{ background-position:200% 0; }
  100%{ background-position:-200% 0; }
}

@media (max-width:540px){
  .modal{ padding:20px; }
  .modal__content{ padding:26px 22px; }
  .modal__close{ top:12px; right:12px; }
  .modal-form__grid{
    grid-template-columns:1fr;
  }
}

/* Pricing single plan */
.pricing--single{
  padding:80px 20px;
  background:
    radial-gradient(circle at 14% 18%, rgba(38,71,255,0.06), transparent 26%),
    radial-gradient(circle at 82% 6%, rgba(255,0,110,0.06), transparent 28%),
    #f5f7fb;
  color:var(--text);
}
.pricing--single .pricing-head{
  max-width:1000px;
  margin:0 auto 30px;
  text-align:center;
}
.pricing--single .pricing-head h2{
  color:#111827;
  font-size:36px;
  margin:12px 0 8px;
}
.pricing--single .pricing-head__sub{
  color:var(--muted);
  max-width:760px;
  margin:0 auto;
}
.pricing--single .chip{
  background:linear-gradient(90deg,#2647ff 0%, #872ff5 100%);
  color:#fff;
  font-weight:700;
  border:none;
}
.pricing-single{
  max-width:1100px;
  margin:0 auto;
  background:#ffffff;
  border:1px solid rgba(12,15,20,0.05);
  border-radius:26px;
  box-shadow:0 18px 42px rgba(16, 24, 40, 0.10);
  padding:26px;
  display:flex;
  flex-direction:column;
  gap:28px;
}
.pricing-single__top{
  display:grid;
  grid-template-columns:1.1fr 0.9fr;
  gap:22px;
  align-items:start;
}
.price-pill{
  position:relative;
  background:#ffffff;
  border:1px solid rgba(12,15,20,0.06);
  border-radius:22px;
  padding:22px;
  box-shadow:0 16px 32px rgba(16, 24, 40, 0.10);
  color:var(--text);
}
.price-pill::after{
  content:'';
  position:absolute;
  inset:-1px;
  border-radius:22px;
  padding:1px;
  background:linear-gradient(90deg,#2647ff 0%, #ff3e8a 70%, #872ff5 100%);
  -webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;
          mask-composite:exclude;
  pointer-events:none;
}
.price-pill__label{
  text-transform:uppercase;
  letter-spacing:0.14em;
  font-weight:800;
  color:#3b82f6;
  font-size:12px;
}
.price-pill__value{
  display:flex;
  align-items:flex-end;
  gap:10px;
  margin:10px 0 6px;
}
.price-pill__amount{
  font-size:44px;
  font-weight:800;
  color:#2647ff;
}
.price-pill__meta{
  color:var(--muted);
  font-weight:600;
}
.price-pill__desc{
  color:var(--muted);
  font-size:15px;
  margin:0 0 14px;
}
.price-pill__cta{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}
.price-pill .btn{
  background:var(--btn);
  color:#fff;
  border:none;
}
.price-pill .btn-outline{
  border-color:#2647ff;
  color:#2647ff;
}
.inclusions{
  background:#f8fafc;
  border:1px solid rgba(12,15,20,0.04);
  border-radius:20px;
  padding:20px 18px;
}
.inclusions h3{
  margin:0 0 10px;
  color:#111827;
}
.inclusions__list{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:10px 12px;
  color:var(--muted);
}
.inclusions__list li{
  position:relative;
  padding-left:18px;
}
.inclusions__list li::before{
  content:'•';
  position:absolute;
  left:0;
  color:#ff6a3d;
}
.pricing-steps{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));
  gap:10px;
  color:var(--muted);
}
.pricing-steps .step{
  padding:14px;
  border-radius:14px;
  background:linear-gradient(135deg, rgba(38,71,255,0.06), rgba(255,106,61,0.06));
  border:1px solid rgba(12,15,20,0.04);
  color:#0c0f14;
}
.pricing-footnote{
  max-width:1100px;
  margin:12px auto 0;
  color:var(--muted);
  text-align:center;
}

@media(max-width:900px){
  .pricing--single{
    padding:60px 16px;
  }
  .pricing-single__top{
    grid-template-columns:1fr;
  }
  .inclusions__list{
    grid-template-columns:1fr;
  }
}

@media (max-width:540px){
  .modal{ padding:20px; }
  .modal__content{ padding:26px 22px; }
  .modal__close{ top:12px; right:12px; }
  .modal-form__grid{
    grid-template-columns:1fr;
  }
}