{"id":369,"date":"2026-05-02T02:39:14","date_gmt":"2026-05-02T02:39:14","guid":{"rendered":"https:\/\/studiovainilla.com\/?page_id=369"},"modified":"2026-09-26T16:26:27","modified_gmt":"2026-09-26T22:26:27","slug":"branding","status":"publish","type":"page","link":"https:\/\/studiovainilla.com\/en\/branding\/","title":{"rendered":"Branding"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"369\" class=\"elementor elementor-369\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-77bbb81 e-con-full e-flex e-con e-parent\" data-id=\"77bbb81\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e17c032 elementor-widget elementor-widget-html\" data-id=\"e17c032\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n\/* ==========================================================\n   STUDIOVAINILLA \u2014 BRANDING 2026\n   V1.2 \u2014 Conversi\u00f3n \/ visuales \/ Registra tu Marca IMPI\n   compatible con Header + Footer global\n   Elementor HTML Widget ready\n========================================================== *\/\n\n#svb26{\n  --ink:#17141f;\n  --ink2:#312c3a;\n  --muted:#736d7b;\n  --purple:#7046ff;\n  --purple2:#9c65ff;\n  --blue:#527dff;\n  --cyan:#43d4d0;\n  --pink:#eb72c4;\n  --lav:#f7f3ff;\n  --lav2:#f0eaff;\n  --ice:#f5f9ff;\n  --mint:#effbf9;\n  --line:rgba(112,70,255,.13);\n  --shadow:0 24px 70px rgba(45,31,84,.10);\n  --max:1360px;\n\n  color:var(--ink);\n  background:#fff;\n  font-family:\n    Inter,\n    -apple-system,\n    BlinkMacSystemFont,\n    \"SF Pro Display\",\n    \"Helvetica Neue\",\n    Arial,\n    sans-serif;\n  overflow:hidden;\n}\n\n#svb26 *,\n#svb26 *::before,\n#svb26 *::after{\n  box-sizing:border-box;\n}\n\n#svb26 a{\n  text-decoration:none;\n  color:inherit;\n}\n\n#svb26 img{\n  display:block;\n  max-width:100%;\n}\n\n.svb26-container{\n  width:min(calc(100% - 48px),var(--max));\n  margin:auto;\n}\n\n.svb26-kicker{\n  display:inline-flex;\n  align-items:center;\n  gap:9px;\n  margin:0 0 16px;\n  color:#6f6680;\n  font-size:10px;\n  font-weight:850;\n  letter-spacing:.16em;\n  text-transform:uppercase;\n}\n\n.svb26-kicker::before{\n  content:\"\";\n  width:7px;\n  height:7px;\n  border-radius:50%;\n  background:linear-gradient(\n    135deg,\n    var(--purple),\n    var(--blue),\n    var(--cyan)\n  );\n  box-shadow:0 0 0 6px rgba(112,70,255,.07);\n}\n\n.svb26-display{\n  margin:0;\n  color:var(--ink);\n  font-size:clamp(48px,6.2vw,94px);\n  line-height:.92;\n  letter-spacing:-.068em;\n  font-weight:760;\n}\n\n.svb26-display .muted{\n  color:#aaa5af;\n}\n\n.svb26-display .grad{\n  color:transparent;\n  background:linear-gradient(\n    105deg,\n    var(--purple),\n    var(--blue) 55%,\n    var(--cyan)\n  );\n  -webkit-background-clip:text;\n  background-clip:text;\n}\n\n.svb26-h2{\n  margin:0;\n  color:var(--ink);\n  font-size:clamp(38px,4.65vw,70px);\n  line-height:.96;\n  letter-spacing:-.058em;\n  font-weight:750;\n}\n\n.svb26-h2 .muted{\n  color:#aaa5af;\n}\n\n.svb26-lead{\n  margin:0;\n  color:var(--muted);\n  font-size:16px;\n  line-height:1.65;\n}\n\n.svb26-btn{\n  display:inline-flex;\n  align-items:center;\n  justify-content:center;\n  gap:8px;\n  min-height:50px;\n  padding:0 20px;\n  border:1px solid transparent;\n  border-radius:999px;\n  font-size:13px;\n  font-weight:800;\n  transition:\n    transform .22s ease,\n    box-shadow .22s ease,\n    background .22s ease;\n}\n\n.svb26-btn:hover{\n  transform:translateY(-2px);\n}\n\n#svb26 .svb26-btn.primary,\n#svb26 .svb26-btn.primary:link,\n#svb26 .svb26-btn.primary:visited,\n#svb26 .svb26-btn.primary:hover,\n#svb26 .svb26-btn.primary:focus,\n#svb26 .svb26-btn.primary:active{\n  color:#fff!important;\n  -webkit-text-fill-color:#fff!important;\n  background:linear-gradient(\n    110deg,\n    var(--purple),\n    var(--blue) 58%,\n    var(--cyan)\n  );\n  box-shadow:0 15px 34px rgba(94,76,235,.22);\n}\n\n.svb26-btn.secondary{\n  color:#4a4160;\n  border-color:rgba(112,70,255,.16);\n  background:rgba(255,255,255,.78);\n  backdrop-filter:blur(14px);\n}\n\n\n\/* ==========================================================\n   HERO\n========================================================== *\/\n\n.svb26-hero{\n  position:relative;\n  min-height:770px;\n  padding:168px 0 92px;\n  background:#f7f3ff;\n  overflow:hidden;\n}\n\n.svb26-hero::before{\n  content:\"\";\n  position:absolute;\n  inset:0;\n  background-image:\n    linear-gradient(\n      rgba(112,70,255,.05) 1px,\n      transparent 1px\n    ),\n    linear-gradient(\n      90deg,\n      rgba(112,70,255,.05) 1px,\n      transparent 1px\n    );\n  background-size:48px 48px;\n  mask-image:linear-gradient(\n    to bottom,\n    black,\n    rgba(0,0,0,.45) 58%,\n    transparent\n  );\n}\n\n.svb26-hero::after{\n  content:\"\";\n  position:absolute;\n  right:-8%;\n  top:-18%;\n  width:64%;\n  height:78%;\n  background:\n    radial-gradient(\n      circle at 42% 35%,\n      rgba(112,70,255,.20),\n      transparent 30%\n    ),\n    radial-gradient(\n      circle at 68% 48%,\n      rgba(67,212,208,.14),\n      transparent 27%\n    ),\n    radial-gradient(\n      circle at 54% 78%,\n      rgba(235,114,196,.12),\n      transparent 25%\n    );\n  filter:blur(34px);\n}\n\n.svb26-hero .svb26-container{\n  position:relative;\n  z-index:2;\n  display:grid;\n  grid-template-columns:minmax(0,1.04fr) minmax(440px,.96fr);\n  gap:46px;\n  align-items:center;\n}\n\n.svb26-hero-copy{\n  padding:15px 0;\n}\n\n.svb26-hero p{\n  max-width:680px;\n  margin:27px 0 0;\n  color:#6f6977;\n  font-size:17px;\n  line-height:1.62;\n}\n\n.svb26-hero-actions{\n  display:flex;\n  flex-wrap:wrap;\n  gap:10px;\n  margin-top:28px;\n}\n\n.svb26-pills{\n  display:flex;\n  flex-wrap:wrap;\n  gap:8px;\n  margin-top:24px;\n}\n\n.svb26-pills span{\n  display:inline-flex;\n  align-items:center;\n  gap:7px;\n  padding:8px 11px;\n  border:1px solid rgba(112,70,255,.11);\n  border-radius:999px;\n  background:rgba(255,255,255,.68);\n  color:#665f70;\n  font-size:10px;\n  font-weight:700;\n  backdrop-filter:blur(12px);\n}\n\n.svb26-pills i{\n  width:5px;\n  height:5px;\n  border-radius:50%;\n  background:linear-gradient(\n    135deg,\n    var(--purple),\n    var(--cyan)\n  );\n  box-shadow:0 0 9px rgba(67,212,208,.7);\n}\n\n\n\/* ==========================================================\n   HERO COLLAGE\n========================================================== *\/\n\n.svb26-hero-visual{\n  position:relative;\n  min-height:545px;\n}\n\n.svb26-hero-panel{\n  position:absolute;\n  inset:18px 0 0 34px;\n  border:1px solid rgba(112,70,255,.13);\n  border-radius:34px;\n  background:rgba(255,255,255,.84);\n  box-shadow:0 30px 85px rgba(49,35,91,.15);\n  backdrop-filter:blur(18px);\n  padding:18px;\n  overflow:hidden;\n}\n\n.svb26-windowbar{\n  display:flex;\n  align-items:center;\n  justify-content:space-between;\n  margin-bottom:12px;\n}\n\n.svb26-dots{\n  display:flex;\n  gap:6px;\n}\n\n.svb26-dots i{\n  width:8px;\n  height:8px;\n  border-radius:50%;\n  background:rgba(112,70,255,.18);\n}\n\n.svb26-windowtag{\n  padding:6px 10px;\n  border-radius:999px;\n  background:#f3efff;\n  color:#6554c8;\n  font-size:8px;\n  font-weight:800;\n}\n\n.svb26-collage{\n  position:relative;\n  height:470px;\n}\n\n.svb26-board{\n  position:absolute;\n  overflow:hidden;\n  border-radius:22px;\n  box-shadow:0 18px 45px rgba(31,22,59,.13);\n}\n\n.svb26-board img{\n  width:100%;\n  height:100%;\n  object-fit:cover;\n}\n\n.svb26-board.a{\n  left:0;\n  top:0;\n  width:62%;\n  height:270px;\n}\n\n.svb26-board.b{\n  right:0;\n  top:14px;\n  width:34%;\n  height:155px;\n  padding:15px;\n  background:linear-gradient(135deg,#6e55dc,#a39df5);\n}\n\n.svb26-board.c{\n  left:8%;\n  bottom:35px;\n  width:36%;\n  height:150px;\n  padding:18px;\n  border:1px solid rgba(112,70,255,.11);\n  background:rgba(255,255,255,.96);\n}\n\n.svb26-board.d{\n  right:0;\n  bottom:0;\n  width:48%;\n  height:230px;\n}\n\n.svb26-palette-title{\n  margin:0 0 12px;\n  color:#fff;\n  font-size:15px;\n  font-weight:800;\n}\n\n.svb26-swatches{\n  display:grid;\n  grid-template-columns:1fr 1fr;\n  gap:8px;\n}\n\n.svb26-swatch{\n  height:48px;\n  border-radius:11px;\n  box-shadow:\n    inset 0 0 0 1px rgba(255,255,255,.2);\n}\n\n.svb26-type small{\n  display:block;\n  margin-bottom:8px;\n  color:#6d58ce;\n  font-size:8px;\n  font-weight:850;\n  letter-spacing:.12em;\n  text-transform:uppercase;\n}\n\n.svb26-type strong{\n  display:block;\n  color:var(--ink);\n  font-size:30px;\n  line-height:1;\n  letter-spacing:-.04em;\n}\n\n.svb26-type span{\n  display:block;\n  margin-top:8px;\n  color:#6d6873;\n  font-size:10px;\n  line-height:1.45;\n}\n\n.svb26-float{\n  position:absolute;\n  z-index:5;\n  padding:12px 14px;\n  border:1px solid rgba(112,70,255,.12);\n  border-radius:16px;\n  background:rgba(255,255,255,.92);\n  box-shadow:0 15px 40px rgba(40,30,78,.11);\n  backdrop-filter:blur(14px);\n  animation:svbFloat 5.5s ease-in-out infinite alternate;\n}\n\n.svb26-float.one{\n  right:-5px;\n  top:190px;\n}\n\n.svb26-float.two{\n  left:0;\n  bottom:155px;\n  animation-delay:.8s;\n}\n\n.svb26-float strong{\n  display:block;\n  color:#5b47c7;\n  font-size:13px;\n  line-height:1.1;\n}\n\n.svb26-float span{\n  display:block;\n  margin-top:3px;\n  color:#706a76;\n  font-size:9px;\n}\n\n@keyframes svbFloat{\n  to{\n    transform:translateY(-8px);\n  }\n}\n\n\n\/* ==========================================================\n   CAPABILITY RAIL\n========================================================== *\/\n\n.svb26-caprail-wrap{\n  position:relative;\n  z-index:5;\n  margin-top:-28px;\n}\n\n.svb26-caprail{\n  display:flex;\n  align-items:center;\n  justify-content:center;\n  gap:8px;\n  padding:12px;\n  border:1px solid rgba(112,70,255,.12);\n  border-radius:26px;\n  background:rgba(255,255,255,.92);\n  box-shadow:0 22px 60px rgba(48,34,85,.09);\n  backdrop-filter:blur(20px);\n}\n\n.svb26-caprail a{\n  display:inline-flex;\n  align-items:center;\n  gap:8px;\n  padding:10px 14px;\n  border:1px solid rgba(112,70,255,.11);\n  border-radius:999px;\n  background:#fff;\n  color:#4a4452;\n  font-size:11px;\n  font-weight:760;\n  white-space:nowrap;\n}\n\n.svb26-caprail a::before{\n  content:\"\";\n  width:6px;\n  height:6px;\n  border-radius:50%;\n  background:linear-gradient(\n    135deg,\n    var(--purple),\n    var(--blue),\n    var(--cyan)\n  );\n}\n\n\n\/* ==========================================================\n   BRAND SYSTEM\n========================================================== *\/\n\n.svb26-system{\n  position:relative;\n  padding:108px 0 94px;\n  background:linear-gradient(180deg,#fff,#fbfaff);\n}\n\n.svb26-section-head{\n  display:grid;\n  grid-template-columns:1.12fr .88fr;\n  gap:60px;\n  align-items:end;\n  margin-bottom:42px;\n}\n\n.svb26-section-head .svb26-lead{\n  max-width:520px;\n  justify-self:end;\n}\n\n.svb26-system-grid{\n  display:grid;\n  grid-template-columns:repeat(4,minmax(0,1fr));\n  gap:10px;\n}\n\n.svb26-system-card{\n  position:relative;\n  min-height:255px;\n  padding:20px;\n  border:1px solid rgba(112,70,255,.10);\n  border-radius:22px;\n  background:#fff;\n  box-shadow:0 14px 34px rgba(44,31,80,.05);\n  overflow:hidden;\n}\n\n.svb26-system-card::before{\n  content:\"\";\n  position:absolute;\n  inset:auto -60px -90px auto;\n  width:180px;\n  height:180px;\n  border-radius:50%;\n  background:radial-gradient(\n    circle,\n    rgba(112,70,255,.11),\n    transparent 67%\n  );\n}\n\n.svb26-system-num{\n  display:flex;\n  align-items:center;\n  justify-content:space-between;\n  margin-bottom:46px;\n  color:#8f8897;\n  font-size:8px;\n  font-weight:850;\n  letter-spacing:.14em;\n}\n\n.svb26-system-icon{\n  display:grid;\n  width:37px;\n  height:37px;\n  place-items:center;\n  border:1px solid rgba(112,70,255,.11);\n  border-radius:12px;\n  background:#f5f1ff;\n  color:#6550d7;\n  font-size:15px;\n}\n\n.svb26-system-card h3{\n  margin:0 0 8px;\n  color:var(--ink);\n  font-size:18px;\n  line-height:1.12;\n  letter-spacing:-.025em;\n}\n\n.svb26-system-card p{\n  margin:0;\n  color:#726c79;\n  font-size:11px;\n  line-height:1.55;\n}\n\n\n\/* ==========================================================\n   PREMIUM PLAN\n========================================================== *\/\n\n.svb26-plan{\n  position:relative;\n  padding:100px 0;\n  background:#f7f3ff;\n}\n\n.svb26-plan::before{\n  content:\"\";\n  position:absolute;\n  inset:0;\n  background-image:radial-gradient(\n    rgba(112,70,255,.14) 1px,\n    transparent 1px\n  );\n  background-size:24px 24px;\n  opacity:.32;\n  mask-image:linear-gradient(\n    to bottom,\n    transparent,\n    black 15%,\n    black 85%,\n    transparent\n  );\n}\n\n.svb26-plan-grid{\n  position:relative;\n  z-index:2;\n  display:grid;\n  grid-template-columns:.92fr 1.08fr;\n  gap:14px;\n  align-items:stretch;\n}\n\n.svb26-plan-visual{\n  position:relative;\n  min-height:660px;\n  border:1px solid rgba(112,70,255,.11);\n  border-radius:28px;\n  overflow:hidden;\n  background:\n    linear-gradient(\n      135deg,\n      rgba(27,19,45,.34),\n      rgba(75,57,117,.20)\n    ),\n    url('https:\/\/images.unsplash.com\/photo-1558655146-d09347e92766?q=80&w=1600&auto=format&fit=crop');\n  background-size:cover;\n  background-position:center;\n  box-shadow:var(--shadow);\n}\n\n.svb26-plan-visual::after{\n  content:\"\";\n  position:absolute;\n  inset:0;\n  background:linear-gradient(\n    to top,\n    rgba(26,18,44,.82),\n    rgba(26,18,44,.12) 60%\n  );\n}\n\n.svb26-plan-visual-inner{\n  position:relative;\n  z-index:2;\n  min-height:660px;\n  display:flex;\n  flex-direction:column;\n  justify-content:space-between;\n  padding:28px;\n}\n\n.svb26-plan-badge{\n  width:max-content;\n  padding:8px 11px;\n  border:1px solid rgba(255,255,255,.17);\n  border-radius:999px;\n  background:rgba(255,255,255,.13);\n  color:#fff;\n  font-size:9px;\n  font-weight:800;\n  backdrop-filter:blur(12px);\n}\n\n.svb26-plan-visual h3{\n  max-width:570px;\n  margin:0 0 10px;\n  color:#fff;\n  font-size:clamp(30px,3.8vw,48px);\n  line-height:1.02;\n  letter-spacing:-.045em;\n}\n\n.svb26-plan-visual p{\n  max-width:530px;\n  margin:0;\n  color:rgba(255,255,255,.76);\n  font-size:13px;\n  line-height:1.6;\n}\n\n.svb26-plan-card{\n  position:relative;\n  overflow:hidden;\n  padding:28px;\n  border:1px solid rgba(112,70,255,.10);\n  border-radius:28px;\n  background:rgba(255,255,255,.95);\n  box-shadow:var(--shadow);\n}\n\n.svb26-plan-card::before{\n  content:\"\";\n  position:absolute;\n  inset:0;\n  background:\n    radial-gradient(\n      circle at 10% 10%,\n      rgba(112,70,255,.09),\n      transparent 32%\n    ),\n    radial-gradient(\n      circle at 90% 90%,\n      rgba(67,212,208,.11),\n      transparent 28%\n    );\n}\n\n.svb26-plan-inner{\n  position:relative;\n  z-index:2;\n}\n\n.svb26-plan-label{\n  display:inline-flex;\n  align-items:center;\n  gap:7px;\n  padding:7px 10px;\n  border-radius:999px;\n  background:#f1ecff;\n  color:#624ad8;\n  font-size:9px;\n  font-weight:850;\n}\n\n.svb26-plan-card h3{\n  margin:16px 0 9px;\n  color:var(--ink);\n  font-size:clamp(30px,3.8vw,46px);\n  line-height:1;\n  letter-spacing:-.05em;\n}\n\n.svb26-plan-card>div>p{\n  margin:0 0 20px;\n  color:#6d6773;\n  font-size:13px;\n  line-height:1.6;\n}\n\n.svb26-deliverables{\n  display:grid;\n  grid-template-columns:1fr 1fr;\n  gap:8px;\n}\n\n.svb26-deliverable{\n  display:grid;\n  grid-template-columns:38px 1fr;\n  gap:10px;\n  padding:11px;\n  border:1px solid rgba(112,70,255,.08);\n  border-radius:15px;\n  background:#faf9ff;\n}\n\n.svb26-deliverable-icon{\n  display:grid;\n  width:38px;\n  height:38px;\n  place-items:center;\n  border-radius:12px;\n  background:#fff;\n  color:#6650d8;\n  box-shadow:0 8px 20px rgba(45,30,80,.05);\n  font-size:15px;\n}\n\n.svb26-deliverable strong{\n  display:block;\n  margin-bottom:2px;\n  color:var(--ink);\n  font-size:12px;\n  line-height:1.15;\n}\n\n.svb26-deliverable span{\n  display:block;\n  color:#756f7b;\n  font-size:9.5px;\n  line-height:1.42;\n}\n\n.svb26-note{\n  margin:16px 0;\n  padding:13px 14px;\n  border:1px solid rgba(112,70,255,.10);\n  border-radius:15px;\n  background:#f3efff;\n  color:#625896;\n  font-size:10px;\n  line-height:1.5;\n}\n\n.svb26-plan-actions{\n  display:flex;\n  flex-wrap:wrap;\n  gap:8px;\n}\n\n\n\/* ==========================================================\n   CLOUD\n========================================================== *\/\n\n.svb26-cloud{\n  position:relative;\n  padding:96px 0;\n  background:#fff;\n}\n\n.svb26-cloud-card{\n  position:relative;\n  overflow:hidden;\n  border:1px solid rgba(112,70,255,.11);\n  border-radius:30px;\n  background:linear-gradient(\n    135deg,\n    #2d214a 0%,\n    #49376f 55%,\n    #5360ad 100%\n  );\n  box-shadow:0 30px 84px rgba(26,22,46,.14);\n}\n\n.svb26-cloud-card::before{\n  content:\"\";\n  position:absolute;\n  inset:0;\n  background:\n    radial-gradient(\n      circle at 10% 18%,\n      rgba(156,101,255,.24),\n      transparent 28%\n    ),\n    radial-gradient(\n      circle at 90% 80%,\n      rgba(67,212,208,.17),\n      transparent 30%\n    ),\n    linear-gradient(\n      rgba(255,255,255,.035) 1px,\n      transparent 1px\n    ),\n    linear-gradient(\n      90deg,\n      rgba(255,255,255,.035) 1px,\n      transparent 1px\n    );\n  background-size:auto,auto,42px 42px,42px 42px;\n}\n\n.svb26-cloud-inner{\n  position:relative;\n  z-index:2;\n  display:grid;\n  grid-template-columns:1.04fr .96fr;\n  gap:22px;\n  padding:26px;\n}\n\n.svb26-cloud-content{\n  padding:14px;\n}\n\n.svb26-cloud-top{\n  display:flex;\n  align-items:center;\n  gap:14px;\n  margin-bottom:20px;\n}\n\n.svb26-cloud-logo{\n  width:76px;\n  height:76px;\n  display:flex;\n  align-items:center;\n  justify-content:center;\n  padding:11px;\n  border:1px solid rgba(255,255,255,.50);\n  border-radius:20px;\n  background:#fff;\n  box-shadow:0 14px 32px rgba(20,14,35,.17);\n}\n\n.svb26-cloud-logo img{\n  max-width:100%;\n  max-height:100%;\n  object-fit:contain;\n}\n\n.svb26-cloud-top small{\n  display:block;\n  margin-bottom:5px;\n  color:rgba(255,255,255,.56);\n  font-size:8px;\n  font-weight:850;\n  letter-spacing:.13em;\n  text-transform:uppercase;\n}\n\n.svb26-cloud-top strong{\n  display:block;\n  color:#fff;\n  font-size:24px;\n  line-height:1;\n  letter-spacing:-.04em;\n}\n\n.svb26-cloud h3{\n  max-width:660px;\n  margin:0 0 12px;\n  color:#fff;\n  font-size:clamp(28px,3.4vw,46px);\n  line-height:1.03;\n  letter-spacing:-.045em;\n}\n\n.svb26-cloud p{\n  max-width:650px;\n  margin:0 0 19px;\n  color:rgba(255,255,255,.74);\n  font-size:13px;\n  line-height:1.65;\n}\n\n.svb26-cloud-features{\n  display:grid;\n  grid-template-columns:1fr 1fr;\n  gap:8px;\n}\n\n.svb26-cloud-feature{\n  padding:12px 13px;\n  border:1px solid rgba(255,255,255,.11);\n  border-radius:15px;\n  background:rgba(255,255,255,.07);\n  color:rgba(255,255,255,.70);\n  font-size:10px;\n  line-height:1.45;\n  backdrop-filter:blur(12px);\n}\n\n.svb26-cloud-feature strong{\n  display:block;\n  margin-bottom:3px;\n  color:#fff;\n  font-size:12px;\n}\n\n.svb26-cloud-visual{\n  min-height:430px;\n  border:1px solid rgba(255,255,255,.11);\n  border-radius:24px;\n  background:\n    linear-gradient(\n      135deg,\n      rgba(255,255,255,.05),\n      rgba(255,255,255,.01)\n    ),\n    url('https:\/\/studiovainilla.com\/wp-content\/uploads\/2026\/05\/Vainilla-Cloud-by-StudioVainilla-Branding-scaled.png');\n  background-size:cover;\n  background-position:center;\n  box-shadow:0 18px 42px rgba(20,14,35,.18);\n}\n\n\n\/* ==========================================================\n   VISUAL SHOWCASE\n========================================================== *\/\n\n.svb26-showcase{\n  position:relative;\n  padding:98px 0;\n  background:#fff;\n  overflow:hidden;\n}\n\n.svb26-showcase::before{\n  content:\"\";\n  position:absolute;\n  inset:0;\n  background:\n    radial-gradient(\n      circle at 8% 20%,\n      rgba(112,70,255,.07),\n      transparent 24%\n    ),\n    radial-gradient(\n      circle at 90% 78%,\n      rgba(67,212,208,.07),\n      transparent 25%\n    );\n  pointer-events:none;\n}\n\n.svb26-showcase-grid{\n  position:relative;\n  z-index:2;\n  display:grid;\n  grid-template-columns:1.12fr .88fr;\n  grid-template-rows:260px 220px;\n  gap:12px;\n}\n\n.svb26-showcase-card{\n  position:relative;\n  overflow:hidden;\n  border:1px solid rgba(112,70,255,.11);\n  border-radius:24px;\n  background:#eee;\n  box-shadow:0 16px 44px rgba(45,31,84,.07);\n}\n\n.svb26-showcase-card img{\n  width:100%;\n  height:100%;\n  object-fit:cover;\n  transition:transform .7s ease;\n}\n\n.svb26-showcase-card:hover img{\n  transform:scale(1.04);\n}\n\n.svb26-showcase-card::after{\n  content:\"\";\n  position:absolute;\n  inset:0;\n  background:linear-gradient(\n    to top,\n    rgba(19,14,31,.68),\n    rgba(19,14,31,.04) 65%\n  );\n}\n\n.svb26-showcase-card.a{\n  grid-row:1\/3;\n}\n\n.svb26-showcase-caption{\n  position:absolute;\n  z-index:2;\n  left:18px;\n  right:18px;\n  bottom:17px;\n  color:#fff;\n}\n\n.svb26-showcase-caption small{\n  display:block;\n  margin-bottom:5px;\n  color:rgba(255,255,255,.62);\n  font-size:7px;\n  font-weight:850;\n  letter-spacing:.13em;\n  text-transform:uppercase;\n}\n\n.svb26-showcase-caption strong{\n  display:block;\n  font-size:17px;\n  line-height:1.15;\n  letter-spacing:-.025em;\n}\n\n.svb26-showcase-demo{\n  position:absolute;\n  z-index:3;\n  top:12px;\n  right:12px;\n  padding:6px 9px;\n  border:1px solid rgba(255,255,255,.25);\n  border-radius:999px;\n  background:rgba(20,15,34,.30);\n  color:#fff;\n  font-size:7px;\n  font-weight:850;\n  letter-spacing:.1em;\n  text-transform:uppercase;\n  backdrop-filter:blur(10px);\n}\n\n\n\/* ==========================================================\n   REGISTRA TU MARCA \/ IMPI\n========================================================== *\/\n\n.svb26-impi{\n  position:relative;\n  padding:102px 0;\n  background:linear-gradient(180deg,#fff,#f7f3ff);\n  overflow:hidden;\n}\n\n.svb26-impi::before{\n  content:\"\";\n  position:absolute;\n  width:520px;\n  height:520px;\n  right:-170px;\n  top:-210px;\n  border-radius:50%;\n  background:radial-gradient(\n    circle,\n    rgba(112,70,255,.14),\n    rgba(67,212,208,.07) 46%,\n    transparent 70%\n  );\n  filter:blur(8px);\n}\n\n.svb26-impi-wrap{\n  position:relative;\n  z-index:2;\n  display:grid;\n  grid-template-columns:.95fr 1.05fr;\n  gap:14px;\n}\n\n.svb26-impi-visual{\n  position:relative;\n  min-height:560px;\n  overflow:hidden;\n  border:1px solid rgba(112,70,255,.12);\n  border-radius:28px;\n  background:#ece7f8;\n  box-shadow:var(--shadow);\n}\n\n.svb26-impi-visual img{\n  width:100%;\n  height:100%;\n  object-fit:cover;\n}\n\n.svb26-impi-visual::after{\n  content:\"\";\n  position:absolute;\n  inset:0;\n  background:linear-gradient(\n    to top,\n    rgba(24,18,42,.76),\n    rgba(24,18,42,.04) 62%\n  );\n}\n\n.svb26-impi-visual-copy{\n  position:absolute;\n  z-index:3;\n  left:24px;\n  right:24px;\n  bottom:23px;\n  color:#fff;\n}\n\n.svb26-impi-visual-copy small{\n  display:block;\n  margin-bottom:7px;\n  color:#aef1ea;\n  font-size:8px;\n  font-weight:850;\n  letter-spacing:.14em;\n  text-transform:uppercase;\n}\n\n.svb26-impi-visual-copy h3{\n  max-width:500px;\n  margin:0;\n  color:#fff;\n  font-size:clamp(29px,3.5vw,45px);\n  line-height:1;\n  letter-spacing:-.045em;\n}\n\n.svb26-impi-visual-copy p{\n  max-width:520px;\n  margin:11px 0 0;\n  color:rgba(255,255,255,.72);\n  font-size:12px;\n  line-height:1.58;\n}\n\n.svb26-impi-card{\n  position:relative;\n  overflow:hidden;\n  padding:28px;\n  border:1px solid rgba(112,70,255,.11);\n  border-radius:28px;\n  background:rgba(255,255,255,.96);\n  box-shadow:var(--shadow);\n}\n\n.svb26-impi-card h3{\n  margin:0;\n  color:var(--ink);\n  font-size:clamp(31px,3.7vw,49px);\n  line-height:1;\n  letter-spacing:-.052em;\n}\n\n.svb26-impi-card>p{\n  margin:13px 0 0;\n  color:#716b78;\n  font-size:13px;\n  line-height:1.62;\n}\n\n.svb26-impi-routes{\n  display:grid;\n  grid-template-columns:1fr 1fr;\n  gap:9px;\n  margin-top:22px;\n}\n\n.svb26-impi-route{\n  padding:16px;\n  border:1px solid rgba(112,70,255,.09);\n  border-radius:17px;\n  background:#faf9ff;\n}\n\n.svb26-impi-route small{\n  display:block;\n  margin-bottom:16px;\n  color:#8f8897;\n  font-size:7px;\n  font-weight:850;\n  letter-spacing:.13em;\n  text-transform:uppercase;\n}\n\n.svb26-impi-route h4{\n  margin:0 0 7px;\n  color:var(--ink);\n  font-size:16px;\n  line-height:1.15;\n}\n\n.svb26-impi-route p{\n  margin:0;\n  color:#746e7a;\n  font-size:10px;\n  line-height:1.5;\n}\n\n.svb26-impi-steps{\n  display:grid;\n  grid-template-columns:repeat(4,1fr);\n  gap:6px;\n  margin-top:10px;\n}\n\n.svb26-impi-step{\n  padding:11px;\n  border:1px solid rgba(112,70,255,.08);\n  border-radius:13px;\n  background:#fff;\n}\n\n.svb26-impi-step strong{\n  display:block;\n  margin-bottom:3px;\n  color:#6650d8;\n  font-size:9px;\n}\n\n.svb26-impi-step span{\n  display:block;\n  color:#776f7d;\n  font-size:8px;\n  line-height:1.35;\n}\n\n.svb26-impi-note{\n  margin:14px 0;\n  padding:12px 13px;\n  border:1px solid rgba(112,70,255,.10);\n  border-radius:14px;\n  background:#f1ecff;\n  color:#625896;\n  font-size:9.5px;\n  line-height:1.5;\n}\n\n.svb26-impi-actions{\n  display:flex;\n  flex-wrap:wrap;\n  gap:8px;\n}\n\n\n\/* ==========================================================\n   NEED \/ FIT\n========================================================== *\/\n\n.svb26-fit{\n  position:relative;\n  padding:96px 0;\n  background:#fff;\n}\n\n.svb26-fit-grid{\n  display:grid;\n  grid-template-columns:repeat(4,minmax(0,1fr));\n  gap:10px;\n}\n\n.svb26-fit-card{\n  position:relative;\n  min-height:245px;\n  padding:21px;\n  border:1px solid rgba(112,70,255,.10);\n  border-radius:22px;\n  background:linear-gradient(145deg,#fff,#faf8ff);\n  box-shadow:0 14px 34px rgba(44,31,80,.045);\n  overflow:hidden;\n}\n\n.svb26-fit-card::after{\n  content:\"\";\n  position:absolute;\n  width:170px;\n  height:170px;\n  right:-80px;\n  bottom:-90px;\n  border-radius:50%;\n  background:radial-gradient(\n    circle,\n    rgba(67,212,208,.11),\n    transparent 68%\n  );\n}\n\n.svb26-fit-num{\n  display:block;\n  margin-bottom:42px;\n  color:#8f8897;\n  font-size:8px;\n  font-weight:850;\n  letter-spacing:.14em;\n  text-transform:uppercase;\n}\n\n.svb26-fit-card h3{\n  margin:0 0 8px;\n  color:var(--ink);\n  font-size:18px;\n  line-height:1.13;\n  letter-spacing:-.025em;\n}\n\n.svb26-fit-card p{\n  margin:0;\n  color:#726c79;\n  font-size:11px;\n  line-height:1.55;\n}\n\n.svb26-fit-result{\n  display:inline-flex;\n  align-items:center;\n  gap:6px;\n  margin-top:15px;\n  color:#6550d7;\n  font-size:9px;\n  font-weight:800;\n}\n\n.svb26-fit-result::before{\n  content:\"\";\n  width:6px;\n  height:6px;\n  border-radius:50%;\n  background:linear-gradient(\n    135deg,\n    var(--purple),\n    var(--cyan)\n  );\n}\n\n\n\/* ==========================================================\n   CLIENT JOURNEY\n========================================================== *\/\n\n.svb26-journey{\n  position:relative;\n  padding:100px 0;\n  background:linear-gradient(180deg,#fbfaff,#fff);\n}\n\n.svb26-journey-track{\n  display:grid;\n  grid-template-columns:repeat(5,minmax(0,1fr));\n  gap:8px;\n}\n\n.svb26-journey-step{\n  position:relative;\n  padding:18px 16px;\n  border:1px solid rgba(112,70,255,.10);\n  border-radius:19px;\n  background:#fff;\n  box-shadow:0 10px 28px rgba(45,31,84,.04);\n}\n\n.svb26-journey-step:not(:last-child)::after{\n  content:\"\u2192\";\n  position:absolute;\n  right:-10px;\n  top:31px;\n  z-index:3;\n  display:grid;\n  width:20px;\n  height:20px;\n  place-items:center;\n  border-radius:50%;\n  background:#f1ecff;\n  color:#6b54db;\n  font-size:10px;\n  font-weight:900;\n}\n\n.svb26-journey-step small{\n  display:block;\n  margin-bottom:28px;\n  color:#8f8897;\n  font-size:8px;\n  font-weight:850;\n  letter-spacing:.13em;\n  text-transform:uppercase;\n}\n\n.svb26-journey-step h3{\n  margin:0 0 7px;\n  color:var(--ink);\n  font-size:15px;\n  line-height:1.15;\n}\n\n.svb26-journey-step p{\n  margin:0;\n  color:#746e7a;\n  font-size:10px;\n  line-height:1.5;\n}\n\n\n\/* ==========================================================\n   INVESTMENT \/ SCOPE\n========================================================== *\/\n\n.svb26-invest{\n  position:relative;\n  padding:96px 0;\n  background:#f7f3ff;\n}\n\n.svb26-invest-card{\n  position:relative;\n  overflow:hidden;\n  display:grid;\n  grid-template-columns:.9fr 1.1fr;\n  gap:28px;\n  padding:30px;\n  border:1px solid rgba(112,70,255,.11);\n  border-radius:28px;\n  background:rgba(255,255,255,.94);\n  box-shadow:var(--shadow);\n}\n\n.svb26-invest-card::before{\n  content:\"\";\n  position:absolute;\n  width:360px;\n  height:360px;\n  right:-120px;\n  top:-180px;\n  border-radius:50%;\n  background:radial-gradient(\n    circle,\n    rgba(112,70,255,.13),\n    rgba(67,212,208,.08) 45%,\n    transparent 70%\n  );\n}\n\n.svb26-invest-copy,\n.svb26-invest-factors{\n  position:relative;\n  z-index:2;\n}\n\n.svb26-invest-copy h3{\n  margin:0;\n  color:var(--ink);\n  font-size:clamp(30px,3.7vw,48px);\n  line-height:1;\n  letter-spacing:-.05em;\n}\n\n.svb26-invest-copy p{\n  margin:13px 0 0;\n  color:#716b78;\n  font-size:13px;\n  line-height:1.62;\n}\n\n.svb26-invest-factors{\n  display:grid;\n  grid-template-columns:1fr 1fr;\n  gap:8px;\n}\n\n.svb26-invest-factor{\n  padding:13px 14px;\n  border:1px solid rgba(112,70,255,.09);\n  border-radius:15px;\n  background:#faf9ff;\n}\n\n.svb26-invest-factor strong{\n  display:block;\n  margin-bottom:3px;\n  color:var(--ink);\n  font-size:12px;\n}\n\n.svb26-invest-factor span{\n  display:block;\n  color:#756f7b;\n  font-size:9.5px;\n  line-height:1.42;\n}\n\n.svb26-invest-note{\n  position:relative;\n  z-index:2;\n  grid-column:1\/-1;\n  margin-top:-4px;\n  padding:13px 14px;\n  border:1px solid rgba(112,70,255,.10);\n  border-radius:15px;\n  background:#f1ecff;\n  color:#625896;\n  font-size:10px;\n  line-height:1.5;\n}\n\n\n\/* ==========================================================\n   AFTER BRANDING\n========================================================== *\/\n\n.svb26-after{\n  position:relative;\n  padding:96px 0;\n  background:#fff;\n}\n\n.svb26-after-grid{\n  display:grid;\n  grid-template-columns:1.05fr .95fr;\n  gap:14px;\n}\n\n.svb26-after-main,\n.svb26-after-side{\n  border:1px solid rgba(112,70,255,.11);\n  border-radius:26px;\n  overflow:hidden;\n}\n\n.svb26-after-main{\n  position:relative;\n  min-height:380px;\n  padding:28px;\n  background:linear-gradient(\n    135deg,\n    #2d214a,\n    #49376f 58%,\n    #5360ad\n  );\n  color:#fff;\n}\n\n.svb26-after-main::before{\n  content:\"\";\n  position:absolute;\n  inset:0;\n  background:\n    radial-gradient(\n      circle at 82% 20%,\n      rgba(67,212,208,.20),\n      transparent 30%\n    ),\n    radial-gradient(\n      circle at 10% 90%,\n      rgba(156,101,255,.25),\n      transparent 34%\n    );\n}\n\n.svb26-after-main-content{\n  position:relative;\n  z-index:2;\n  max-width:620px;\n}\n\n.svb26-after-main .svb26-kicker{\n  color:#d8d1ff;\n}\n\n.svb26-after-main h3{\n  margin:0;\n  color:#fff;\n  font-size:clamp(31px,3.9vw,50px);\n  line-height:1;\n  letter-spacing:-.05em;\n}\n\n.svb26-after-main p{\n  margin:14px 0 0;\n  color:rgba(255,255,255,.72);\n  font-size:13px;\n  line-height:1.65;\n}\n\n.svb26-after-list{\n  display:grid;\n  grid-template-columns:1fr 1fr;\n  gap:8px;\n  margin-top:24px;\n}\n\n.svb26-after-item{\n  padding:12px 13px;\n  border:1px solid rgba(255,255,255,.11);\n  border-radius:15px;\n  background:rgba(255,255,255,.07);\n  font-size:10px;\n  line-height:1.45;\n  color:rgba(255,255,255,.72);\n}\n\n.svb26-after-item strong{\n  display:block;\n  margin-bottom:3px;\n  color:#fff;\n  font-size:12px;\n}\n\n.svb26-after-side{\n  display:flex;\n  flex-direction:column;\n  justify-content:center;\n  padding:28px;\n  background:linear-gradient(145deg,#fff,#faf8ff);\n}\n\n.svb26-after-side h3{\n  margin:0;\n  color:var(--ink);\n  font-size:28px;\n  line-height:1.02;\n  letter-spacing:-.04em;\n}\n\n.svb26-after-side p{\n  margin:12px 0 18px;\n  color:#716b78;\n  font-size:12px;\n  line-height:1.6;\n}\n\n\n\/* ==========================================================\n   FAQ\n========================================================== *\/\n\n.svb26-faq{\n  position:relative;\n  padding:96px 0;\n  background:linear-gradient(180deg,#fbfaff,#fff);\n}\n\n.svb26-faq-list{\n  display:grid;\n  gap:8px;\n  max-width:980px;\n  margin:0 auto;\n}\n\n.svb26-faq-item{\n  border:1px solid rgba(112,70,255,.10);\n  border-radius:18px;\n  background:#fff;\n  box-shadow:0 8px 24px rgba(45,31,84,.035);\n  overflow:hidden;\n}\n\n.svb26-faq-q{\n  display:grid;\n  grid-template-columns:1fr 34px;\n  gap:14px;\n  align-items:center;\n  padding:16px 18px;\n  cursor:pointer;\n}\n\n.svb26-faq-q h3{\n  margin:0;\n  color:var(--ink);\n  font-size:14px;\n  line-height:1.3;\n}\n\n.svb26-faq-toggle{\n  display:grid;\n  width:34px;\n  height:34px;\n  place-items:center;\n  border-radius:50%;\n  background:#f1ecff;\n  color:#6650d8;\n  font-weight:800;\n  transition:\n    transform .25s ease,\n    background .25s ease,\n    color .25s ease;\n}\n\n.svb26-faq-a{\n  max-height:0;\n  overflow:hidden;\n  padding:0 18px;\n  transition:\n    max-height .3s ease,\n    padding .3s ease;\n}\n\n.svb26-faq-a p{\n  margin:0;\n  color:#746e7a;\n  font-size:11px;\n  line-height:1.58;\n}\n\n.svb26-faq-item.open .svb26-faq-a{\n  max-height:180px;\n  padding:0 18px 16px;\n}\n\n.svb26-faq-item.open .svb26-faq-toggle{\n  transform:rotate(45deg);\n  background:linear-gradient(\n    135deg,\n    var(--purple),\n    var(--blue)\n  );\n  color:#fff;\n}\n\n\n\/* ==========================================================\n   CTA\n========================================================== *\/\n\n.svb26-cta{\n  padding:72px 0;\n  background:#fff;\n}\n\n.svb26-cta-box{\n  position:relative;\n  overflow:hidden;\n  display:grid;\n  grid-template-columns:1fr auto;\n  gap:28px;\n  align-items:center;\n  padding:32px 34px;\n  border:1px solid rgba(112,70,255,.12);\n  border-radius:26px;\n  background:linear-gradient(\n    120deg,\n    #fbf9ff,\n    #f5f9ff 60%,\n    #effbf9\n  );\n  box-shadow:0 20px 60px rgba(50,35,88,.08);\n}\n\n.svb26-cta-box::before{\n  content:\"\";\n  position:absolute;\n  width:300px;\n  height:300px;\n  right:-90px;\n  top:-145px;\n  border-radius:50%;\n  background:radial-gradient(\n    circle,\n    rgba(112,70,255,.15),\n    rgba(67,212,208,.09) 45%,\n    transparent 70%\n  );\n}\n\n.svb26-cta-copy,\n.svb26-cta-actions{\n  position:relative;\n  z-index:2;\n}\n\n.svb26-cta-copy h3{\n  margin:0;\n  color:var(--ink);\n  font-size:clamp(28px,3.3vw,46px);\n  line-height:1;\n  letter-spacing:-.05em;\n}\n\n.svb26-cta-copy p{\n  max-width:720px;\n  margin:10px 0 0;\n  color:#706977;\n  font-size:13px;\n  line-height:1.55;\n}\n\n.svb26-cta-actions{\n  display:flex;\n  gap:8px;\n  flex-wrap:wrap;\n}\n\n\n\/* ==========================================================\n   REVEALS\n========================================================== *\/\n\n.svb26-reveal{\n  opacity:0;\n  transform:translateY(18px);\n  transition:\n    opacity .7s ease,\n    transform .7s cubic-bezier(.22,.7,.2,1);\n}\n\n.svb26-reveal.is-visible{\n  opacity:1;\n  transform:none;\n}\n\n\n\/* ==========================================================\n   RESPONSIVE\n========================================================== *\/\n\n@media(max-width:1100px){\n\n  .svb26-container{\n    width:min(calc(100% - 36px),var(--max));\n  }\n\n  .svb26-hero .svb26-container{\n    grid-template-columns:1fr .88fr;\n    gap:28px;\n  }\n\n  .svb26-hero-visual{\n    min-height:500px;\n  }\n\n  .svb26-plan-grid{\n    grid-template-columns:1fr;\n  }\n\n  .svb26-showcase-grid{\n    grid-template-columns:1fr 1fr;\n  }\n\n  .svb26-impi-wrap{\n    grid-template-columns:1fr;\n  }\n\n  .svb26-impi-visual{\n    min-height:480px;\n  }\n\n  .svb26-fit-grid{\n    grid-template-columns:1fr 1fr;\n  }\n\n  .svb26-journey-track{\n    grid-template-columns:repeat(3,minmax(0,1fr));\n  }\n\n  .svb26-journey-step:nth-child(3)::after{\n    display:none;\n  }\n\n}\n\n@media(max-width:900px){\n\n  .svb26-hero{\n    min-height:auto;\n    padding:150px 0 74px;\n  }\n\n  .svb26-hero .svb26-container{\n    grid-template-columns:1fr;\n  }\n\n  .svb26-hero-visual{\n    min-height:475px;\n  }\n\n  .svb26-hero-panel{\n    inset:8px 4% 0 4%;\n  }\n\n  .svb26-caprail{\n    justify-content:flex-start;\n    overflow-x:auto;\n    scrollbar-width:none;\n  }\n\n  .svb26-caprail::-webkit-scrollbar{\n    display:none;\n  }\n\n  .svb26-section-head{\n    grid-template-columns:1fr;\n    gap:20px;\n  }\n\n  .svb26-section-head .svb26-lead{\n    justify-self:start;\n  }\n\n  .svb26-system-grid{\n    grid-template-columns:1fr 1fr;\n  }\n\n  .svb26-cloud-inner{\n    grid-template-columns:1fr;\n  }\n\n  .svb26-cloud-visual{\n    min-height:360px;\n  }\n\n  .svb26-cta-box{\n    grid-template-columns:1fr;\n  }\n\n  .svb26-invest-card{\n    grid-template-columns:1fr;\n  }\n\n  .svb26-after-grid{\n    grid-template-columns:1fr;\n  }\n\n}\n\n@media(max-width:640px){\n\n  .svb26-container{\n    width:calc(100% - 24px);\n  }\n\n  .svb26-hero{\n    padding:132px 0 62px;\n  }\n\n  .svb26-display{\n    font-size:clamp(46px,14vw,68px);\n    line-height:.94;\n  }\n\n  .svb26-hero p{\n    font-size:14px;\n    line-height:1.58;\n  }\n\n  .svb26-hero-actions{\n    display:grid;\n    grid-template-columns:1fr;\n  }\n\n  .svb26-btn{\n    width:100%;\n  }\n\n  .svb26-hero-visual{\n    min-height:405px;\n  }\n\n  .svb26-hero-panel{\n    inset:8px 0 0;\n    border-radius:24px;\n    padding:13px;\n  }\n\n  .svb26-collage{\n    height:350px;\n  }\n\n  .svb26-board.a{\n    width:100%;\n    height:190px;\n  }\n\n  .svb26-board.b{\n    top:203px;\n    width:42%;\n    height:110px;\n  }\n\n  .svb26-board.c{\n    left:0;\n    bottom:0;\n    width:53%;\n    height:120px;\n    padding:13px;\n  }\n\n  .svb26-board.d{\n    display:none;\n  }\n\n  .svb26-float{\n    display:none;\n  }\n\n  .svb26-caprail-wrap{\n    margin-top:-18px;\n  }\n\n  .svb26-system,\n  .svb26-plan,\n  .svb26-cloud,\n  .svb26-showcase,\n  .svb26-impi,\n  .svb26-fit,\n  .svb26-journey,\n  .svb26-invest,\n  .svb26-after,\n  .svb26-faq{\n    padding:72px 0;\n  }\n\n  .svb26-h2{\n    font-size:clamp(39px,12vw,55px);\n  }\n\n  .svb26-lead{\n    font-size:13px;\n  }\n\n  .svb26-section-head{\n    margin-bottom:28px;\n  }\n\n  .svb26-system-grid{\n    grid-template-columns:1fr 1fr;\n    gap:8px;\n  }\n\n  .svb26-system-card{\n    min-height:210px;\n    padding:15px;\n  }\n\n  .svb26-system-num{\n    margin-bottom:28px;\n  }\n\n  .svb26-system-card h3{\n    font-size:15px;\n  }\n\n  .svb26-system-card p{\n    font-size:9.5px;\n  }\n\n  .svb26-plan-visual,\n  .svb26-plan-visual-inner{\n    min-height:440px;\n  }\n\n  .svb26-plan-card{\n    padding:20px;\n  }\n\n  .svb26-deliverables{\n    grid-template-columns:1fr 1fr;\n  }\n\n  .svb26-deliverable{\n    grid-template-columns:1fr;\n    padding:10px;\n  }\n\n  .svb26-deliverable-icon{\n    width:34px;\n    height:34px;\n  }\n\n  .svb26-deliverable strong{\n    font-size:10.5px;\n  }\n\n  .svb26-deliverable span{\n    font-size:8.5px;\n  }\n\n  .svb26-cloud-inner{\n    padding:16px;\n  }\n\n  .svb26-cloud-content{\n    padding:6px;\n  }\n\n  .svb26-cloud-top{\n    align-items:flex-start;\n  }\n\n  .svb26-cloud-logo{\n    width:64px;\n    height:64px;\n  }\n\n  .svb26-cloud-features{\n    grid-template-columns:1fr 1fr;\n  }\n\n  .svb26-cloud-feature{\n    font-size:8.8px;\n  }\n\n  .svb26-cloud-feature strong{\n    font-size:10.5px;\n  }\n\n  .svb26-cloud-visual{\n    min-height:260px;\n  }\n\n  .svb26-showcase-grid{\n    grid-template-columns:1fr 1fr;\n    grid-template-rows:235px 185px;\n  }\n\n  .svb26-showcase-card.a{\n    grid-column:1\/-1;\n    grid-row:auto;\n  }\n\n  .svb26-showcase-card{\n    border-radius:18px;\n  }\n\n  .svb26-showcase-caption{\n    left:13px;\n    right:13px;\n    bottom:12px;\n  }\n\n  .svb26-showcase-caption strong{\n    font-size:14px;\n  }\n\n  .svb26-impi-visual{\n    min-height:390px;\n    border-radius:22px;\n  }\n\n  .svb26-impi-visual-copy{\n    left:18px;\n    right:18px;\n    bottom:18px;\n  }\n\n  .svb26-impi-card{\n    padding:20px;\n    border-radius:22px;\n  }\n\n  .svb26-impi-routes{\n    grid-template-columns:1fr 1fr;\n  }\n\n  .svb26-impi-steps{\n    grid-template-columns:1fr 1fr;\n  }\n\n  .svb26-impi-actions{\n    display:grid;\n    grid-template-columns:1fr;\n  }\n\n  .svb26-fit-grid{\n    grid-template-columns:1fr 1fr;\n    gap:8px;\n  }\n\n  .svb26-fit-card{\n    min-height:205px;\n    padding:15px;\n  }\n\n  .svb26-fit-num{\n    margin-bottom:28px;\n  }\n\n  .svb26-fit-card h3{\n    font-size:15px;\n  }\n\n  .svb26-fit-card p{\n    font-size:9.5px;\n  }\n\n  .svb26-journey-track{\n    grid-template-columns:1fr;\n    gap:8px;\n  }\n\n  .svb26-journey-step:not(:last-child)::after{\n    display:none;\n  }\n\n  .svb26-journey-step small{\n    margin-bottom:14px;\n  }\n\n  .svb26-invest-card{\n    padding:20px;\n    border-radius:22px;\n  }\n\n  .svb26-invest-factors{\n    grid-template-columns:1fr 1fr;\n  }\n\n  .svb26-invest-factor{\n    padding:11px;\n  }\n\n  .svb26-after-main{\n    min-height:auto;\n    padding:22px;\n  }\n\n  .svb26-after-list{\n    grid-template-columns:1fr 1fr;\n  }\n\n  .svb26-after-side{\n    padding:22px;\n  }\n\n  .svb26-faq-q{\n    padding:14px;\n  }\n\n  .svb26-faq-item.open .svb26-faq-a{\n    padding:0 14px 14px;\n  }\n\n  .svb26-cta{\n    padding:52px 0;\n  }\n\n  .svb26-cta-box{\n    padding:25px 20px;\n  }\n\n  .svb26-cta-actions{\n    display:grid;\n    grid-template-columns:1fr;\n  }\n\n}\n\n@media(max-width:420px){\n\n  .svb26-system-grid{\n    grid-template-columns:1fr 1fr;\n  }\n\n  .svb26-system-card{\n    min-height:200px;\n  }\n\n  .svb26-deliverables{\n    grid-template-columns:1fr 1fr;\n  }\n\n  .svb26-invest-factors,\n  .svb26-after-list{\n    grid-template-columns:1fr;\n  }\n\n}\n\n@media(prefers-reduced-motion:reduce){\n\n  #svb26 *,\n  #svb26 *::before,\n  #svb26 *::after{\n    animation:none!important;\n    transition:none!important;\n  }\n\n  .svb26-reveal{\n    opacity:1;\n    transform:none;\n  }\n\n}\n<\/style>\n\n<div id=\"svb26\">\n\n  <!-- ======================================================\n       HERO\n  ======================================================= -->\n  <section class=\"svb26-hero\">\n\n    <div class=\"svb26-container\">\n\n      <div class=\"svb26-hero-copy svb26-reveal\">\n\n        <div class=\"svb26-kicker\">\n          Branding by StudioVainilla\n        <\/div>\n\n        <h1 class=\"svb26-display\">\n          Creamos marcas que\n          <span class=\"grad\">se sienten correctas<\/span>\n          antes de que alguien\n          <span class=\"muted\">las explique.<\/span>\n        <\/h1>\n\n        <p>\n          Dise\u00f1amos identidades visuales con estrategia, car\u00e1cter\n          y direcci\u00f3n para que tu negocio proyecte el valor que\n          realmente tiene, se reconozca con facilidad y mantenga\n          coherencia en cada punto de contacto.\n        <\/p>\n\n        <div class=\"svb26-hero-actions\">\n\n          <a\n            href=\"https:\/\/studiovainilla.com\/te-asesoramos-gratis\/\"\n            class=\"svb26-btn primary\"\n          >\n            Cotizar branding \u2197\n          <\/a>\n\n          <a\n            href=\"#svb26-plan\"\n            class=\"svb26-btn secondary\"\n          >\n            Ver entregables\n          <\/a>\n\n        <\/div>\n\n        <div class=\"svb26-pills\">\n\n          <span>\n            <i><\/i>\n            Identidad visual\n          <\/span>\n\n          <span>\n            <i><\/i>\n            Logotipo\n          <\/span>\n\n          <span>\n            <i><\/i>\n            Tipograf\u00eda\n          <\/span>\n\n          <span>\n            <i><\/i>\n            Colorimetr\u00eda\n          <\/span>\n\n          <span>\n            <i><\/i>\n            Sistema gr\u00e1fico\n          <\/span>\n\n        <\/div>\n\n      <\/div>\n\n\n      <div class=\"svb26-hero-visual svb26-reveal\">\n\n        <div class=\"svb26-hero-panel\">\n\n          <div class=\"svb26-windowbar\">\n\n            <div class=\"svb26-dots\">\n              <i><\/i>\n              <i><\/i>\n              <i><\/i>\n            <\/div>\n\n            <div class=\"svb26-windowtag\">\n              Brand Identity System\n            <\/div>\n\n          <\/div>\n\n          <div class=\"svb26-collage\">\n\n            <div class=\"svb26-board a\">\n\n              <img decoding=\"async\"\n                src=\"https:\/\/images.unsplash.com\/photo-1523726491678-bf852e717f6a?q=80&w=1200&auto=format&fit=crop\"\n                alt=\"Branding moodboard\"\n              >\n\n            <\/div>\n\n\n            <div class=\"svb26-board b\">\n\n              <div class=\"svb26-palette-title\">\n                Color system\n              <\/div>\n\n              <div class=\"svb26-swatches\">\n\n                <div\n                  class=\"svb26-swatch\"\n                  style=\"background:#7046ff\"\n                ><\/div>\n\n                <div\n                  class=\"svb26-swatch\"\n                  style=\"background:#43d4d0\"\n                ><\/div>\n\n                <div\n                  class=\"svb26-swatch\"\n                  style=\"background:#17141f\"\n                ><\/div>\n\n                <div\n                  class=\"svb26-swatch\"\n                  style=\"background:#f7f3ff\"\n                ><\/div>\n\n              <\/div>\n\n            <\/div>\n\n\n            <div class=\"svb26-board c svb26-type\">\n\n              <small>\n                Typography\n              <\/small>\n\n              <strong>\n                Aa\n              <\/strong>\n\n              <span>\n                Personalidad visual, tono y legibilidad alineados\n                a la marca.\n              <\/span>\n\n            <\/div>\n\n\n            <div class=\"svb26-board d\">\n\n              <img decoding=\"async\"\n                src=\"https:\/\/images.unsplash.com\/photo-1516383607781-913a19294fd1?q=80&w=1200&auto=format&fit=crop\"\n                alt=\"Aplicaciones de marca\"\n              >\n\n            <\/div>\n\n          <\/div>\n\n        <\/div>\n\n\n        <div class=\"svb26-float one\">\n\n          <strong>\n            Marca con direcci\u00f3n\n          <\/strong>\n\n          <span>\n            m\u00e1s que solo un logo\n          <\/span>\n\n        <\/div>\n\n\n        <div class=\"svb26-float two\">\n\n          <strong>\n            Sistema visual\n          <\/strong>\n\n          <span>\n            coherencia en cada aplicaci\u00f3n\n          <\/span>\n\n        <\/div>\n\n      <\/div>\n\n    <\/div>\n\n  <\/section>\n\n\n  <!-- ======================================================\n       QUICK NAV\n  ======================================================= -->\n  <div class=\"svb26-caprail-wrap\">\n\n    <div class=\"svb26-container\">\n\n      <div class=\"svb26-caprail svb26-reveal\">\n\n        <a href=\"#svb26-fit\">\n          Necesidad\n        <\/a>\n\n        <a href=\"#svb26-system\">\n          Estrategia\n        <\/a>\n\n        <a href=\"#svb26-showcase\">\n          Aplicaciones\n        <\/a>\n\n        <a href=\"#svb26-journey\">\n          Proceso\n        <\/a>\n\n        <a href=\"#svb26-plan\">\n          Entregables\n        <\/a>\n\n        <a href=\"#svb26-impi\">\n          Registro IMPI\n        <\/a>\n\n      <\/div>\n\n    <\/div>\n\n  <\/div>\n\n\n  <!-- ======================================================\n       NEED \/ FIT\n  ======================================================= -->\n  <section\n    class=\"svb26-fit\"\n    id=\"svb26-fit\"\n  >\n\n    <div class=\"svb26-container\">\n\n      <div class=\"svb26-section-head svb26-reveal\">\n\n        <div>\n\n          <div class=\"svb26-kicker\">\n            \u00bfQu\u00e9 necesitas resolver?\n          <\/div>\n\n          <h2 class=\"svb26-h2\">\n            No todas las marcas llegan\n            <span class=\"muted\">\n              desde el mismo punto.\n            <\/span>\n          <\/h2>\n\n        <\/div>\n\n        <p class=\"svb26-lead\">\n          Antes de hablar de logotipos o aplicaciones,\n          identificamos qu\u00e9 est\u00e1 frenando la percepci\u00f3n,\n          claridad o consistencia de tu marca. A partir de ah\u00ed\n          definimos el alcance correcto.\n        <\/p>\n\n      <\/div>\n\n\n      <div class=\"svb26-fit-grid svb26-reveal\">\n\n        <article class=\"svb26-fit-card\">\n\n          <span class=\"svb26-fit-num\">\n            01 \u00b7 NUEVA MARCA\n          <\/span>\n\n          <h3>\n            Voy a lanzar una marca.\n          <\/h3>\n\n          <p>\n            Necesitas una identidad que nazca con direcci\u00f3n y\n            pueda crecer sin perder coherencia.\n          <\/p>\n\n          <span class=\"svb26-fit-result\">\n            Construcci\u00f3n desde cero\n          <\/span>\n\n        <\/article>\n\n\n        <article class=\"svb26-fit-card\">\n\n          <span class=\"svb26-fit-num\">\n            02 \u00b7 REBRANDING\n          <\/span>\n\n          <h3>\n            Mi marca ya no me representa.\n          <\/h3>\n\n          <p>\n            La empresa evolucion\u00f3, pero su identidad sigue\n            comunicando una versi\u00f3n anterior del negocio.\n          <\/p>\n\n          <span class=\"svb26-fit-result\">\n            Evoluci\u00f3n de percepci\u00f3n\n          <\/span>\n\n        <\/article>\n\n\n        <article class=\"svb26-fit-card\">\n\n          <span class=\"svb26-fit-num\">\n            03 \u00b7 PROFESIONALIZACI\u00d3N\n          <\/span>\n\n          <h3>\n            Mi negocio se ve improvisado.\n          <\/h3>\n\n          <p>\n            Hay valor real detr\u00e1s de la empresa, pero la\n            identidad visual no lo est\u00e1 proyectando con\n            suficiente claridad.\n          <\/p>\n\n          <span class=\"svb26-fit-result\">\n            Mayor solidez visual\n          <\/span>\n\n        <\/article>\n\n\n        <article class=\"svb26-fit-card\">\n\n          <span class=\"svb26-fit-num\">\n            04 \u00b7 CONSISTENCIA\n          <\/span>\n\n          <h3>\n            Cada pieza se ve diferente.\n          <\/h3>\n\n          <p>\n            El equipo necesita reglas y recursos para aplicar\n            la marca correctamente sin depender de\n            interpretaciones.\n          <\/p>\n\n          <span class=\"svb26-fit-result\">\n            Sistema visual usable\n          <\/span>\n\n        <\/article>\n\n      <\/div>\n\n    <\/div>\n\n  <\/section>\n\n\n  <!-- ======================================================\n       BRAND SYSTEM\n  ======================================================= -->\n  <section\n    class=\"svb26-system\"\n    id=\"svb26-system\"\n  >\n\n    <div class=\"svb26-container\">\n\n      <div class=\"svb26-section-head svb26-reveal\">\n\n        <div>\n\n          <div class=\"svb26-kicker\">\n            Una marca es un sistema\n          <\/div>\n\n          <h2 class=\"svb26-h2\">\n            No dise\u00f1amos un logo aislado.\n            <span class=\"muted\">\n              Construimos c\u00f3mo se reconoce tu marca.\n            <\/span>\n          <\/h2>\n\n        <\/div>\n\n        <p class=\"svb26-lead\">\n          La identidad debe funcionar cuando cambia el formato,\n          el canal o la persona que la utiliza. Por eso\n          construimos reglas, recursos y criterios que mantienen\n          una misma percepci\u00f3n.\n        <\/p>\n\n      <\/div>\n\n\n      <div class=\"svb26-system-grid svb26-reveal\">\n\n        <article class=\"svb26-system-card\">\n\n          <div class=\"svb26-system-num\">\n\n            <span>\n              01 \u00b7 FOUNDATION\n            <\/span>\n\n            <span class=\"svb26-system-icon\">\n              \u25c7\n            <\/span>\n\n          <\/div>\n\n          <h3>\n            Direcci\u00f3n de marca\n          <\/h3>\n\n          <p>\n            Definimos personalidad, intenci\u00f3n y criterios\n            visuales antes de comenzar a dise\u00f1ar aplicaciones.\n          <\/p>\n\n        <\/article>\n\n\n        <article class=\"svb26-system-card\">\n\n          <div class=\"svb26-system-num\">\n\n            <span>\n              02 \u00b7 IDENTITY\n            <\/span>\n\n            <span class=\"svb26-system-icon\">\n              \u2726\n            <\/span>\n\n          <\/div>\n\n          <h3>\n            Identidad visual\n          <\/h3>\n\n          <p>\n            Logotipo, color, tipograf\u00eda y recursos gr\u00e1ficos\n            construidos para trabajar como un mismo lenguaje.\n          <\/p>\n\n        <\/article>\n\n\n        <article class=\"svb26-system-card\">\n\n          <div class=\"svb26-system-num\">\n\n            <span>\n              03 \u00b7 SYSTEM\n            <\/span>\n\n            <span class=\"svb26-system-icon\">\n              \u2318\n            <\/span>\n\n          <\/div>\n\n          <h3>\n            Sistema gr\u00e1fico\n          <\/h3>\n\n          <p>\n            Reglas de composici\u00f3n, jerarqu\u00edas y variantes para\n            mantener coherencia en diferentes contextos.\n          <\/p>\n\n        <\/article>\n\n\n        <article class=\"svb26-system-card\">\n\n          <div class=\"svb26-system-num\">\n\n            <span>\n              04 \u00b7 APPLICATION\n            <\/span>\n\n            <span class=\"svb26-system-icon\">\n              \u2197\n            <\/span>\n\n          <\/div>\n\n          <h3>\n            Aplicaciones\n          <\/h3>\n\n          <p>\n            Recursos listos para implementar la marca en\n            comunicaci\u00f3n digital, impresa y comercial.\n          <\/p>\n\n        <\/article>\n\n      <\/div>\n\n    <\/div>\n\n  <\/section>\n\n\n  <!-- ======================================================\n       VISUAL SHOWCASE\n  ======================================================= -->\n  <section\n    class=\"svb26-showcase\"\n    id=\"svb26-showcase\"\n  >\n\n    <div class=\"svb26-container\">\n\n      <div class=\"svb26-section-head svb26-reveal\">\n\n        <div>\n\n          <div class=\"svb26-kicker\">\n            La marca en acci\u00f3n\n          <\/div>\n\n          <h2 class=\"svb26-h2\">\n            Una identidad debe verse bien\n            <span class=\"muted\">\n              fuera del brandbook.\n            <\/span>\n          <\/h2>\n\n        <\/div>\n\n        <p class=\"svb26-lead\">\n          Probamos la direcci\u00f3n visual en contextos reales para\n          comprobar que tenga personalidad, flexibilidad y\n          consistencia. Estas im\u00e1genes son demostrativas y\n          puedes sustituirlas por proyectos reales de\n          StudioVainilla.\n        <\/p>\n\n      <\/div>\n\n\n      <div class=\"svb26-showcase-grid svb26-reveal\">\n\n        <article class=\"svb26-showcase-card a\">\n\n          <img decoding=\"async\"\n            src=\"https:\/\/images.unsplash.com\/photo-1558655146-9f40138edfeb?q=80&w=1600&auto=format&fit=crop\"\n            alt=\"Demo de identidad aplicada a materiales de marca\"\n          >\n\n          <span class=\"svb26-showcase-demo\">\n            Imagen demo\n          <\/span>\n\n          <div class=\"svb26-showcase-caption\">\n\n            <small>\n              Aplicaci\u00f3n 01\n            <\/small>\n\n            <strong>\n              Identidad viviendo en piezas reales.\n            <\/strong>\n\n          <\/div>\n\n        <\/article>\n\n\n        <article class=\"svb26-showcase-card\">\n\n          <img decoding=\"async\"\n            src=\"https:\/\/images.unsplash.com\/photo-1545235617-9465d2a55698?q=80&w=1200&auto=format&fit=crop\"\n            alt=\"Demo de branding aplicado a experiencia digital\"\n          >\n\n          <span class=\"svb26-showcase-demo\">\n            Imagen demo\n          <\/span>\n\n          <div class=\"svb26-showcase-caption\">\n\n            <small>\n              Aplicaci\u00f3n 02\n            <\/small>\n\n            <strong>\n              Consistencia tambi\u00e9n en digital.\n            <\/strong>\n\n          <\/div>\n\n        <\/article>\n\n\n        <article class=\"svb26-showcase-card\">\n\n          <img decoding=\"async\"\n            src=\"https:\/\/images.unsplash.com\/photo-1497215842964-222b430dc094?q=80&w=1200&auto=format&fit=crop\"\n            alt=\"Demo de identidad aplicada a materiales corporativos\"\n          >\n\n          <span class=\"svb26-showcase-demo\">\n            Imagen demo\n          <\/span>\n\n          <div class=\"svb26-showcase-caption\">\n\n            <small>\n              Aplicaci\u00f3n 03\n            <\/small>\n\n            <strong>\n              Una misma percepci\u00f3n en distintos puntos\n              de contacto.\n            <\/strong>\n\n          <\/div>\n\n        <\/article>\n\n      <\/div>\n\n    <\/div>\n\n  <\/section>\n\n\n  <!-- ======================================================\n       CLIENT JOURNEY\n  ======================================================= -->\n  <section\n    class=\"svb26-journey\"\n    id=\"svb26-journey\"\n  >\n\n    <div class=\"svb26-container\">\n\n      <div class=\"svb26-section-head svb26-reveal\">\n\n        <div>\n\n          <div class=\"svb26-kicker\">\n            As\u00ed se construye tu marca\n          <\/div>\n\n          <h2 class=\"svb26-h2\">\n            De entender el negocio a entregar\n            <span class=\"muted\">\n              un sistema que s\u00ed puedes usar.\n            <\/span>\n          <\/h2>\n\n        <\/div>\n\n        <p class=\"svb26-lead\">\n          El proyecto avanza por etapas para que cada decisi\u00f3n\n          visual responda a una direcci\u00f3n clara y no a gustos\n          aislados.\n        <\/p>\n\n      <\/div>\n\n\n      <div class=\"svb26-journey-track svb26-reveal\">\n\n        <article class=\"svb26-journey-step\">\n\n          <small>\n            01 \u00b7 Diagn\u00f3stico\n          <\/small>\n\n          <h3>\n            Entendemos el contexto\n          <\/h3>\n\n          <p>\n            Revisamos negocio, percepci\u00f3n actual, objetivos y\n            necesidades de uso.\n          <\/p>\n\n        <\/article>\n\n\n        <article class=\"svb26-journey-step\">\n\n          <small>\n            02 \u00b7 Direcci\u00f3n\n          <\/small>\n\n          <h3>\n            Definimos el territorio\n          <\/h3>\n\n          <p>\n            Establecemos criterios de personalidad, intenci\u00f3n y\n            direcci\u00f3n visual.\n          <\/p>\n\n        <\/article>\n\n\n        <article class=\"svb26-journey-step\">\n\n          <small>\n            03 \u00b7 Identidad\n          <\/small>\n\n          <h3>\n            Dise\u00f1amos el lenguaje\n          <\/h3>\n\n          <p>\n            Construimos logotipo, color, tipograf\u00eda y recursos\n            gr\u00e1ficos.\n          <\/p>\n\n        <\/article>\n\n\n        <article class=\"svb26-journey-step\">\n\n          <small>\n            04 \u00b7 Sistema\n          <\/small>\n\n          <h3>\n            Lo llevamos a aplicaciones\n          <\/h3>\n\n          <p>\n            Probamos c\u00f3mo vive la marca en contextos reales y\n            construimos reglas.\n          <\/p>\n\n        <\/article>\n\n\n        <article class=\"svb26-journey-step\">\n\n          <small>\n            05 \u00b7 Entrega\n          <\/small>\n\n          <h3>\n            Organizamos todo\n          <\/h3>\n\n          <p>\n            Entregamos recursos finales, lineamientos y archivos\n            para su implementaci\u00f3n.\n          <\/p>\n\n        <\/article>\n\n      <\/div>\n\n    <\/div>\n\n  <\/section>\n\n\n  <!-- ======================================================\n       PLAN\n  ======================================================= -->\n  <section\n    class=\"svb26-plan\"\n    id=\"svb26-plan\"\n  >\n\n    <div class=\"svb26-container\">\n\n      <div class=\"svb26-section-head svb26-reveal\">\n\n        <div>\n\n          <div class=\"svb26-kicker\">\n            Plan Premium de Branding\n          <\/div>\n\n          <h2 class=\"svb26-h2\">\n            Una identidad completa para marcas que quieren\n            <span class=\"muted\">\n              verse m\u00e1s s\u00f3lidas.\n            <\/span>\n          <\/h2>\n\n        <\/div>\n\n        <p class=\"svb26-lead\">\n          Creamos tu sistema de marca con entregables\n          profesionales, lineamientos claros y recursos listos\n          para usarse en comunicaci\u00f3n digital, impresa y\n          comercial.\n        <\/p>\n\n      <\/div>\n\n\n      <div class=\"svb26-plan-grid svb26-reveal\">\n\n        <div class=\"svb26-plan-visual\">\n\n          <div class=\"svb26-plan-visual-inner\">\n\n            <div class=\"svb26-plan-badge\">\n              Brandbook \u00b7 Identidad \u00b7 Aplicaciones\n            <\/div>\n\n            <div>\n\n              <h3>\n                Dise\u00f1amos la base visual que sostiene la\n                percepci\u00f3n de tu marca.\n              <\/h3>\n\n              <p>\n                Tu identidad debe poder usarse con claridad en\n                redes, documentos, presentaciones, papeler\u00eda,\n                anuncios y materiales comerciales.\n              <\/p>\n\n            <\/div>\n\n          <\/div>\n\n        <\/div>\n\n\n        <div class=\"svb26-plan-card\">\n\n          <div class=\"svb26-plan-inner\">\n\n            <div class=\"svb26-plan-label\">\n              Alcance base recomendado\n            <\/div>\n\n            <h3>\n              Premium Gr\u00e1fico\n            <\/h3>\n\n            <p>\n              Nuestro alcance base para construir una identidad\n              visual completa, ordenada y lista para\n              implementarse. La propuesta final se ajusta a la\n              complejidad y necesidades reales de cada marca.\n            <\/p>\n\n\n            <div class=\"svb26-deliverables\">\n\n              <div class=\"svb26-deliverable\">\n\n                <div class=\"svb26-deliverable-icon\">\n                  \u25a4\n                <\/div>\n\n                <div>\n\n                  <strong>\n                    Brandbook\n                  <\/strong>\n\n                  <span>\n                    Lineamientos para utilizar correctamente la\n                    marca.\n                  <\/span>\n\n                <\/div>\n\n              <\/div>\n\n\n              <div class=\"svb26-deliverable\">\n\n                <div class=\"svb26-deliverable-icon\">\n                  \u2726\n                <\/div>\n\n                <div>\n\n                  <strong>\n                    Identidad visual\n                  <\/strong>\n\n                  <span>\n                    Sistema gr\u00e1fico base de la marca.\n                  <\/span>\n\n                <\/div>\n\n              <\/div>\n\n\n              <div class=\"svb26-deliverable\">\n\n                <div class=\"svb26-deliverable-icon\">\n                  \u25c9\n                <\/div>\n\n                <div>\n\n                  <strong>\n                    Colorimetr\u00eda\n                  <\/strong>\n\n                  <span>\n                    Paleta crom\u00e1tica definida para mantener\n                    coherencia.\n                  <\/span>\n\n                <\/div>\n\n              <\/div>\n\n\n              <div class=\"svb26-deliverable\">\n\n                <div class=\"svb26-deliverable-icon\">\n                  Aa\n                <\/div>\n\n                <div>\n\n                  <strong>\n                    Tipograf\u00eda corporativa\n                  <\/strong>\n\n                  <span>\n                    Selecci\u00f3n tipogr\u00e1fica para personalidad y\n                    legibilidad.\n                  <\/span>\n\n                <\/div>\n\n              <\/div>\n\n\n              <div class=\"svb26-deliverable\">\n\n                <div class=\"svb26-deliverable-icon\">\n                  \u25a3\n                <\/div>\n\n                <div>\n\n                  <strong>\n                    Reproducciones gr\u00e1ficas\n                  <\/strong>\n\n                  <span>\n                    Variantes y recursos visuales para aplicar\n                    la marca.\n                  <\/span>\n\n                <\/div>\n\n              <\/div>\n\n\n              <div class=\"svb26-deliverable\">\n\n                <div class=\"svb26-deliverable-icon\">\n                  \u2709\n                <\/div>\n\n                <div>\n\n                  <strong>\n                    Papeler\u00eda premium\n                  <\/strong>\n\n                  <span>\n                    Materiales base para comunicaci\u00f3n\n                    empresarial.\n                  <\/span>\n\n                <\/div>\n\n              <\/div>\n\n\n              <div class=\"svb26-deliverable\">\n\n                <div class=\"svb26-deliverable-icon\">\n                  \u25eb\n                <\/div>\n\n                <div>\n\n                  <strong>\n                    Banco de im\u00e1genes\n                  <\/strong>\n\n                  <span>\n                    Hasta 10 im\u00e1genes de stock alineadas a la\n                    direcci\u00f3n visual.\n                  <\/span>\n\n                <\/div>\n\n              <\/div>\n\n\n              <div class=\"svb26-deliverable\">\n\n                <div class=\"svb26-deliverable-icon\">\n                  \u2601\n                <\/div>\n\n                <div>\n\n                  <strong>\n                    Entrega digital organizada\n                  <\/strong>\n\n                  <span>\n                    Archivos finales preparados para\n                    conservarse y utilizarse.\n                  <\/span>\n\n                <\/div>\n\n              <\/div>\n\n            <\/div>\n\n\n            <div class=\"svb26-note\">\n\n              <strong>\n                Importante:\n              <\/strong>\n\n              este plan se enfoca exclusivamente en branding e\n              identidad visual. No incluye propuesta web,\n              landing page, dominio ni hospedaje.\n\n            <\/div>\n\n\n            <div class=\"svb26-plan-actions\">\n\n              <a\n                href=\"https:\/\/studiovainilla.com\/contacto\/\"\n                class=\"svb26-btn primary\"\n              >\n                Cotizar mi branding \u2197\n              <\/a>\n\n              <a\n                href=\"#svb26-cloud\"\n                class=\"svb26-btn secondary\"\n              >\n                Ver c\u00f3mo se entrega\n              <\/a>\n\n            <\/div>\n\n          <\/div>\n\n        <\/div>\n\n      <\/div>\n\n    <\/div>\n\n  <\/section>\n\n\n  <!-- ======================================================\n       INVESTMENT\n  ======================================================= -->\n  <section\n    class=\"svb26-invest\"\n    id=\"svb26-invest\"\n  >\n\n    <div class=\"svb26-container\">\n\n      <div class=\"svb26-invest-card svb26-reveal\">\n\n        <div class=\"svb26-invest-copy\">\n\n          <div class=\"svb26-kicker\">\n            Alcance e inversi\u00f3n\n          <\/div>\n\n          <h3>\n            La marca correcta no se cotiza s\u00f3lo por la cantidad\n            de archivos.\n          <\/h3>\n\n          <p>\n            Dos empresas pueden necesitar un brandbook y, aun\n            as\u00ed, requerir niveles de an\u00e1lisis, arquitectura y\n            aplicaci\u00f3n completamente diferentes. Por eso\n            definimos la inversi\u00f3n a partir del alcance real del\n            proyecto.\n          <\/p>\n\n        <\/div>\n\n\n        <div class=\"svb26-invest-factors\">\n\n          <div class=\"svb26-invest-factor\">\n\n            <strong>\n              Estado actual de la marca\n            <\/strong>\n\n            <span>\n              Nueva identidad, evoluci\u00f3n o rebranding.\n            <\/span>\n\n          <\/div>\n\n\n          <div class=\"svb26-invest-factor\">\n\n            <strong>\n              Complejidad del negocio\n            <\/strong>\n\n            <span>\n              Oferta, audiencias, l\u00edneas o necesidades de\n              comunicaci\u00f3n.\n            <\/span>\n\n          <\/div>\n\n\n          <div class=\"svb26-invest-factor\">\n\n            <strong>\n              Profundidad del sistema\n            <\/strong>\n\n            <span>\n              Recursos, variantes, reglas y aplicaciones\n              necesarias.\n            <\/span>\n\n          <\/div>\n\n\n          <div class=\"svb26-invest-factor\">\n\n            <strong>\n              Implementaci\u00f3n requerida\n            <\/strong>\n\n            <span>\n              Qu\u00e9 materiales deben quedar preparados para\n              comenzar a usar la marca.\n            <\/span>\n\n          <\/div>\n\n        <\/div>\n\n\n        <div class=\"svb26-invest-note\">\n\n          <strong>\n            No necesitas definir el alcance antes de hablar con\n            nosotros.\n          <\/strong>\n\n          Revisamos tu situaci\u00f3n y te proponemos una estructura\n          de proyecto acorde a lo que realmente necesita la\n          marca.\n\n        <\/div>\n\n      <\/div>\n\n    <\/div>\n\n  <\/section>\n\n\n  <!-- ======================================================\n       VAINILLA CLOUD\n  ======================================================= -->\n  <section\n    class=\"svb26-cloud\"\n    id=\"svb26-cloud\"\n  >\n\n    <div class=\"svb26-container\">\n\n      <div class=\"svb26-cloud-card svb26-reveal\">\n\n        <div class=\"svb26-cloud-inner\">\n\n          <div class=\"svb26-cloud-content\">\n\n            <div class=\"svb26-cloud-top\">\n\n              <div class=\"svb26-cloud-logo\">\n\n                <img decoding=\"async\"\n                  src=\"https:\/\/drive.studiovainilla.mx\/storage\/branding_media\/62974c4e-1979-4bf7-bba4-317ec9049833.png\"\n                  alt=\"Vainilla Cloud\"\n                >\n\n              <\/div>\n\n              <div>\n\n                <small>\n                  Resguardo y organizaci\u00f3n\n                <\/small>\n\n                <strong>\n                  Vainilla Cloud\n                <\/strong>\n\n              <\/div>\n\n            <\/div>\n\n\n            <h3>\n              Tu proyecto de branding, ordenado y resguardado\n              en un solo lugar.\n            <\/h3>\n\n            <p>\n              Vainilla Cloud es nuestra plataforma para alojar\n              materiales clave del proyecto. Mantiene\n              organizados los archivos importantes de tu marca\n              y facilita su consulta cuando los necesitas.\n            <\/p>\n\n\n            <div class=\"svb26-cloud-features\">\n\n              <div class=\"svb26-cloud-feature\">\n\n                <strong>\n                  Brandbook y manuales\n                <\/strong>\n\n                Lineamientos visuales de tu identidad.\n\n              <\/div>\n\n\n              <div class=\"svb26-cloud-feature\">\n\n                <strong>\n                  Archivos editables\n                <\/strong>\n\n                Recursos base del proyecto centralizados.\n\n              <\/div>\n\n\n              <div class=\"svb26-cloud-feature\">\n\n                <strong>\n                  Versiones finales\n                <\/strong>\n\n                Materiales terminados y aprobados.\n\n              <\/div>\n\n\n              <div class=\"svb26-cloud-feature\">\n\n                <strong>\n                  Material visual\n                <\/strong>\n\n                Recursos complementarios y elementos gr\u00e1ficos.\n\n              <\/div>\n\n            <\/div>\n\n          <\/div>\n\n\n          <div\n            class=\"svb26-cloud-visual\"\n            aria-label=\"Vista de Vainilla Cloud\"\n          ><\/div>\n\n        <\/div>\n\n      <\/div>\n\n    <\/div>\n\n  <\/section>\n\n\n  <!-- ======================================================\n       REGISTRA TU MARCA IMPI\n  ======================================================= -->\n  <section\n    class=\"svb26-impi\"\n    id=\"svb26-impi\"\n  >\n\n    <div class=\"svb26-container\">\n\n      <div class=\"svb26-section-head svb26-reveal\">\n\n        <div>\n\n          <div class=\"svb26-kicker\">\n            Registra tu Marca by StudioVainilla\n          <\/div>\n\n          <h2 class=\"svb26-h2\">\n            Dise\u00f1ar una marca es una parte.\n            <span class=\"muted\">\n              Protegerla tambi\u00e9n importa.\n            <\/span>\n          <\/h2>\n\n        <\/div>\n\n        <p class=\"svb26-lead\">\n          Adem\u00e1s del desarrollo de identidad, StudioVainilla\n          cuenta con un servicio especializado para acompa\u00f1ar\n          el registro de marca ante el IMPI, con un proceso\n          digital claro y seguimiento desde portal.\n        <\/p>\n\n      <\/div>\n\n\n      <div class=\"svb26-impi-wrap svb26-reveal\">\n\n        <div class=\"svb26-impi-visual\">\n\n          <img decoding=\"async\"\n            src=\"https:\/\/images.unsplash.com\/photo-1450101499163-c8848c66ca85?q=80&w=1600&auto=format&fit=crop\"\n            alt=\"Imagen demo para servicio de registro de marca ante el IMPI\"\n          >\n\n          <span class=\"svb26-showcase-demo\">\n            Imagen demo\n          <\/span>\n\n\n          <div class=\"svb26-impi-visual-copy\">\n\n            <small>\n              Brand protection\n            <\/small>\n\n            <h3>\n              Tu identidad puede comenzar aqu\u00ed y continuar\n              hasta su registro.\n            <\/h3>\n\n            <p>\n              Branding y protecci\u00f3n pueden formar parte de una\n              misma ruta, sin obligarte a contratar ambos\n              servicios juntos.\n            <\/p>\n\n          <\/div>\n\n        <\/div>\n\n\n        <div class=\"svb26-impi-card\">\n\n          <div class=\"svb26-kicker\">\n            Dos formas de comenzar\n          <\/div>\n\n          <h3>\n            Hazlo desde el portal o d\u00e9janos acompa\u00f1arte.\n          <\/h3>\n\n          <p>\n            <strong>\n              Registra tu Marca by StudioVainilla\n            <\/strong>\n            funciona como una experiencia digital donde puedes\n            iniciar por tu cuenta, revisar las opciones del\n            proceso y dar seguimiento. Si prefieres hablar\n            primero con nosotros, tambi\u00e9n puedes hacerlo desde\n            asesor\u00eda.\n          <\/p>\n\n\n          <div class=\"svb26-impi-routes\">\n\n            <div class=\"svb26-impi-route\">\n\n              <small>\n                01 \u00b7 Self service\n              <\/small>\n\n              <h4>\n                Comienza directamente en el portal\n              <\/h4>\n\n              <p>\n                Consulta opciones, inicia una b\u00fasqueda fon\u00e9tica\n                o avanza al registro desde la plataforma de\n                Registra tu Marca.\n              <\/p>\n\n            <\/div>\n\n\n            <div class=\"svb26-impi-route\">\n\n              <small>\n                02 \u00b7 Acompa\u00f1ado\n              <\/small>\n\n              <h4>\n                Habla primero con StudioVainilla\n              <\/h4>\n\n              <p>\n                Si tienes dudas sobre tu identidad, nombre o\n                siguiente paso, un asesor puede ayudarte a\n                orientar el proceso.\n              <\/p>\n\n            <\/div>\n\n          <\/div>\n\n\n          <div class=\"svb26-impi-steps\">\n\n            <div class=\"svb26-impi-step\">\n\n              <strong>\n                01\n              <\/strong>\n\n              <span>\n                B\u00fasqueda fon\u00e9tica\n              <\/span>\n\n            <\/div>\n\n\n            <div class=\"svb26-impi-step\">\n\n              <strong>\n                02\n              <\/strong>\n\n              <span>\n                An\u00e1lisis de viabilidad\n              <\/span>\n\n            <\/div>\n\n\n            <div class=\"svb26-impi-step\">\n\n              <strong>\n                03\n              <\/strong>\n\n              <span>\n                Solicitud ante IMPI\n              <\/span>\n\n            <\/div>\n\n\n            <div class=\"svb26-impi-step\">\n\n              <strong>\n                04\n              <\/strong>\n\n              <span>\n                Seguimiento en portal\n              <\/span>\n\n            <\/div>\n\n          <\/div>\n\n\n          <div class=\"svb26-impi-note\">\n            La b\u00fasqueda y el an\u00e1lisis previo ayudan a estimar\n            viabilidad, pero no garantizan que el IMPI conceda\n            el registro. El portal permite iniciar el proceso y\n            consultar su seguimiento de forma organizada.\n          <\/div>\n\n\n          <div class=\"svb26-impi-actions\">\n\n            <a\n              class=\"svb26-btn primary\"\n              href=\"https:\/\/registratumarcaimpi.com\/\"\n              target=\"_blank\"\n              rel=\"noopener\"\n            >\n              Ir a Registra tu Marca \u2197\n            <\/a>\n\n            <a\n              class=\"svb26-btn secondary\"\n              href=\"https:\/\/studiovainilla.com\/te-asesoramos-gratis\/\"\n            >\n              Quiero que me orienten\n            <\/a>\n\n          <\/div>\n\n        <\/div>\n\n      <\/div>\n\n    <\/div>\n\n  <\/section>\n\n\n  <!-- ======================================================\n       AFTER BRANDING\n  ======================================================= -->\n  <section class=\"svb26-after\">\n\n    <div class=\"svb26-container\">\n\n      <div class=\"svb26-after-grid svb26-reveal\">\n\n        <div class=\"svb26-after-main\">\n\n          <div class=\"svb26-after-main-content\">\n\n            <div class=\"svb26-kicker\">\n              Despu\u00e9s del branding\n            <\/div>\n\n            <h3>\n              La identidad no termina cuando entregamos el logo.\n            <\/h3>\n\n            <p>\n              Una marca cobra valor cuando empieza a vivir de\n              forma consistente. Si tu proyecto lo necesita,\n              podemos ayudarte a llevar la nueva identidad a los\n              puntos de contacto donde realmente interact\u00faa con\n              clientes y equipo.\n            <\/p>\n\n\n            <div class=\"svb26-after-list\">\n\n              <div class=\"svb26-after-item\">\n\n                <strong>\n                  Marketing\n                <\/strong>\n\n                Contenido y comunicaci\u00f3n alineados a la nueva\n                identidad.\n\n              <\/div>\n\n\n              <div class=\"svb26-after-item\">\n\n                <strong>\n                  Desarrollo Web\n                <\/strong>\n\n                Experiencias digitales construidas con el nuevo\n                sistema visual.\n\n              <\/div>\n\n\n              <div class=\"svb26-after-item\">\n\n                <strong>\n                  Presentaciones y materiales\n                <\/strong>\n\n                Aplicaciones comerciales y corporativas\n                consistentes.\n\n              <\/div>\n\n\n              <div class=\"svb26-after-item\">\n\n                <strong>\n                  Producci\u00f3n visual\n                <\/strong>\n\n                Recursos gr\u00e1ficos, fotograf\u00eda o video seg\u00fan el\n                proyecto.\n\n              <\/div>\n\n            <\/div>\n\n          <\/div>\n\n        <\/div>\n\n\n        <div class=\"svb26-after-side\">\n\n          <div class=\"svb26-kicker\">\n            Una sola direcci\u00f3n\n          <\/div>\n\n          <h3>\n            Tu marca puede seguir creciendo con el mismo\n            criterio.\n          <\/h3>\n\n          <p>\n            No tienes que contratar servicios adicionales para\n            hacer branding. Pero si despu\u00e9s necesitas llevar la\n            identidad a web, marketing o materiales comerciales,\n            el sistema ya est\u00e1 preparado para hacerlo.\n          <\/p>\n\n          <a\n            class=\"svb26-btn primary\"\n            href=\"https:\/\/studiovainilla.com\/te-asesoramos-gratis\/\"\n          >\n            Revisar mi proyecto \u2197\n          <\/a>\n\n        <\/div>\n\n      <\/div>\n\n    <\/div>\n\n  <\/section>\n\n\n  <!-- ======================================================\n       FAQ\n  ======================================================= -->\n  <section\n    class=\"svb26-faq\"\n    id=\"svb26-faq\"\n  >\n\n    <div class=\"svb26-container\">\n\n      <div class=\"svb26-section-head svb26-reveal\">\n\n        <div>\n\n          <div class=\"svb26-kicker\">\n            Antes de comenzar\n          <\/div>\n\n          <h2 class=\"svb26-h2\">\n            Lo que normalmente necesitas saber\n            <span class=\"muted\">\n              antes de cotizar.\n            <\/span>\n          <\/h2>\n\n        <\/div>\n\n        <p class=\"svb26-lead\">\n          El alcance final se define en la propuesta, pero estas\n          respuestas te ayudan a entender c\u00f3mo abordamos un\n          proyecto de branding.\n        <\/p>\n\n      <\/div>\n\n\n      <div class=\"svb26-faq-list svb26-reveal\">\n\n        <article class=\"svb26-faq-item open\">\n\n          <div class=\"svb26-faq-q\">\n\n            <h3>\n              \u00bfBranding es solamente dise\u00f1ar un logotipo?\n            <\/h3>\n\n            <span class=\"svb26-faq-toggle\">\n              \uff0b\n            <\/span>\n\n          <\/div>\n\n          <div class=\"svb26-faq-a\">\n\n            <p>\n              No. El logotipo es una parte del sistema.\n              Trabajamos direcci\u00f3n visual, color, tipograf\u00eda,\n              recursos, reglas y aplicaciones para que la marca\n              pueda reconocerse y utilizarse con coherencia.\n            <\/p>\n\n          <\/div>\n\n        <\/article>\n\n\n        <article class=\"svb26-faq-item\">\n\n          <div class=\"svb26-faq-q\">\n\n            <h3>\n              \u00bfPueden trabajar con una marca que ya existe?\n            <\/h3>\n\n            <span class=\"svb26-faq-toggle\">\n              \uff0b\n            <\/span>\n\n          <\/div>\n\n          <div class=\"svb26-faq-a\">\n\n            <p>\n              S\u00ed. Primero revisamos qu\u00e9 debe conservarse,\n              evolucionar o replantearse y a partir de ah\u00ed\n              definimos si el proyecto requiere ajuste,\n              profesionalizaci\u00f3n o rebranding.\n            <\/p>\n\n          <\/div>\n\n        <\/article>\n\n\n        <article class=\"svb26-faq-item\">\n\n          <div class=\"svb26-faq-q\">\n\n            <h3>\n              \u00bfQu\u00e9 recibo al finalizar?\n            <\/h3>\n\n            <span class=\"svb26-faq-toggle\">\n              \uff0b\n            <\/span>\n\n          <\/div>\n\n          <div class=\"svb26-faq-a\">\n\n            <p>\n              El alcance base contempla identidad visual,\n              lineamientos y recursos organizados para su\n              implementaci\u00f3n. Los entregables espec\u00edficos se\n              detallan en la propuesta de cada proyecto.\n            <\/p>\n\n          <\/div>\n\n        <\/article>\n\n\n        <article class=\"svb26-faq-item\">\n\n          <div class=\"svb26-faq-q\">\n\n            <h3>\n              \u00bfEl branding incluye sitio web o marketing?\n            <\/h3>\n\n            <span class=\"svb26-faq-toggle\">\n              \uff0b\n            <\/span>\n\n          <\/div>\n\n          <div class=\"svb26-faq-a\">\n\n            <p>\n              No necesariamente. Branding puede contratarse como\n              proyecto independiente. Si despu\u00e9s necesitas\n              implementar la nueva identidad en web, marketing u\n              otros materiales, podemos estructurarlo como una\n              etapa adicional.\n            <\/p>\n\n          <\/div>\n\n        <\/article>\n\n\n        <article class=\"svb26-faq-item\">\n\n          <div class=\"svb26-faq-q\">\n\n            <h3>\n              \u00bfPor qu\u00e9 no aparece un precio fijo?\n            <\/h3>\n\n            <span class=\"svb26-faq-toggle\">\n              \uff0b\n            <\/span>\n\n          <\/div>\n\n          <div class=\"svb26-faq-a\">\n\n            <p>\n              Porque el trabajo cambia seg\u00fan el estado actual de\n              la marca, la complejidad del negocio, la\n              profundidad del sistema y las aplicaciones\n              necesarias. Primero entendemos el proyecto y\n              despu\u00e9s definimos un alcance responsable.\n            <\/p>\n\n          <\/div>\n\n        <\/article>\n\n      <\/div>\n\n    <\/div>\n\n  <\/section>\n\n\n  <!-- ======================================================\n       FINAL CTA\n  ======================================================= -->\n  <section class=\"svb26-cta\">\n\n    <div class=\"svb26-container\">\n\n      <div class=\"svb26-cta-box svb26-reveal\">\n\n        <div class=\"svb26-cta-copy\">\n\n          <div class=\"svb26-kicker\">\n            Branding con direcci\u00f3n\n          <\/div>\n\n          <h3>\n            \u00bfTu marca refleja el valor real de tu negocio?\n          <\/h3>\n\n          <p>\n            Cu\u00e9ntanos en qu\u00e9 punto est\u00e1 tu marca. Revisamos\n            contigo su percepci\u00f3n actual y te ayudamos a definir\n            si necesita evolucionar, profesionalizarse o\n            construirse desde cero.\n          <\/p>\n\n        <\/div>\n\n\n        <div class=\"svb26-cta-actions\">\n\n          <a\n            class=\"svb26-btn primary\"\n            href=\"https:\/\/studiovainilla.com\/te-asesoramos-gratis\/\"\n          >\n            Solicitar asesor\u00eda \u2197\n          <\/a>\n\n          <a\n            class=\"svb26-btn secondary\"\n            href=\"https:\/\/wa.me\/526144741000\"\n            target=\"_blank\"\n            rel=\"noopener\"\n          >\n            WhatsApp\n          <\/a>\n\n        <\/div>\n\n      <\/div>\n\n    <\/div>\n\n  <\/section>\n\n<\/div>\n\n\n<script>\n(function(){\n\n  const root=document.getElementById('svb26');\n\n  if(!root){\n    return;\n  }\n\n\n  \/* ========================================================\n     FAQ\n  ======================================================== *\/\n\n  const faqItems=[\n    ...root.querySelectorAll('.svb26-faq-item')\n  ];\n\n  faqItems.forEach(item=>{\n\n    const q=item.querySelector('.svb26-faq-q');\n\n    if(!q){\n      return;\n    }\n\n    q.addEventListener('click',()=>{\n\n      const wasOpen=\n        item.classList.contains('open');\n\n      faqItems.forEach(i=>{\n        i.classList.remove('open');\n      });\n\n      if(!wasOpen){\n        item.classList.add('open');\n      }\n\n    });\n\n  });\n\n\n  \/* ========================================================\n     REVEAL\n  ======================================================== *\/\n\n  const els=[\n    ...root.querySelectorAll('.svb26-reveal')\n  ];\n\n  if('IntersectionObserver' in window){\n\n    const io=\n      new IntersectionObserver(\n        entries=>\n          entries.forEach(e=>{\n\n            if(e.isIntersecting){\n\n              e.target.classList.add('is-visible');\n\n              io.unobserve(e.target);\n\n            }\n\n          }),\n        {\n          threshold:.08,\n          rootMargin:'0px 0px -28px 0px'\n        }\n      );\n\n    els.forEach(el=>{\n      io.observe(el);\n    });\n\n  }else{\n\n    els.forEach(el=>{\n      el.classList.add('is-visible');\n    });\n\n  }\n\n})();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-ff45fbd e-con-full e-flex e-con e-parent\" data-id=\"ff45fbd\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-39d6d6b elementor-widget elementor-widget-image-carousel\" data-id=\"39d6d6b\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;slides_to_show&quot;:&quot;10&quot;,&quot;slides_to_scroll&quot;:&quot;1&quot;,&quot;slides_to_show_mobile&quot;:&quot;5&quot;,&quot;slides_to_scroll_mobile&quot;:&quot;1&quot;,&quot;navigation&quot;:&quot;none&quot;,&quot;pause_on_hover&quot;:&quot;no&quot;,&quot;pause_on_interaction&quot;:&quot;no&quot;,&quot;autoplay_speed&quot;:1000,&quot;speed&quot;:300,&quot;image_spacing_custom&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:38,&quot;sizes&quot;:[]},&quot;slides_to_show_tablet&quot;:&quot;7&quot;,&quot;slides_to_scroll_tablet&quot;:&quot;1&quot;,&quot;autoplay&quot;:&quot;yes&quot;,&quot;infinite&quot;:&quot;yes&quot;,&quot;image_spacing_custom_tablet&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;image_spacing_custom_mobile&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]}}\" data-widget_type=\"image-carousel.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-image-carousel-wrapper swiper\" role=\"region\" aria-roledescription=\"carousel\" aria-label=\"Carrusel de im\u00e1genes\" dir=\"ltr\">\n\t\t\t<div class=\"elementor-image-carousel swiper-wrapper\" aria-live=\"off\">\n\t\t\t\t\t\t\t\t<div class=\"swiper-slide\" role=\"group\" aria-roledescription=\"slide\" aria-label=\"1 de 15\"><figure class=\"swiper-slide-inner\"><img decoding=\"async\" class=\"swiper-slide-image\" src=\"https:\/\/studiovainilla.com\/wp-content\/uploads\/2026\/05\/Beat-75-StudioVainilla.png\" alt=\"Beat-75-StudioVainilla.png\" \/><\/figure><\/div><div class=\"swiper-slide\" role=\"group\" aria-roledescription=\"slide\" aria-label=\"2 de 15\"><figure class=\"swiper-slide-inner\"><img decoding=\"async\" class=\"swiper-slide-image\" src=\"https:\/\/studiovainilla.com\/wp-content\/uploads\/2026\/05\/Integra-Tres-StudioVainilla-Branding.png\" alt=\"Integra-Tres-StudioVainilla-Branding.png\" \/><\/figure><\/div><div class=\"swiper-slide\" role=\"group\" aria-roledescription=\"slide\" aria-label=\"3 de 15\"><figure class=\"swiper-slide-inner\"><img decoding=\"async\" class=\"swiper-slide-image\" src=\"https:\/\/studiovainilla.com\/wp-content\/uploads\/2026\/05\/Kyoto-StudioVanilla-Branding-Design.png\" alt=\"Kyoto-StudioVanilla-Branding-Design.png\" \/><\/figure><\/div><div class=\"swiper-slide\" role=\"group\" aria-roledescription=\"slide\" aria-label=\"4 de 15\"><figure class=\"swiper-slide-inner\"><img decoding=\"async\" class=\"swiper-slide-image\" src=\"https:\/\/studiovainilla.com\/wp-content\/uploads\/2026\/05\/Lucky-Paper-Goods-StudioVainilla.png\" alt=\"Lucky-Paper-Goods-StudioVainilla.png\" \/><\/figure><\/div><div class=\"swiper-slide\" role=\"group\" aria-roledescription=\"slide\" aria-label=\"5 de 15\"><figure class=\"swiper-slide-inner\"><img decoding=\"async\" class=\"swiper-slide-image\" src=\"https:\/\/studiovainilla.com\/wp-content\/uploads\/2026\/05\/Mexico-Barbaro-StudioVainilla.png\" alt=\"Me\u0301xico-Ba\u0301rbaro-StudioVainilla.png\" \/><\/figure><\/div><div class=\"swiper-slide\" role=\"group\" aria-roledescription=\"slide\" aria-label=\"6 de 15\"><figure class=\"swiper-slide-inner\"><img decoding=\"async\" class=\"swiper-slide-image\" src=\"https:\/\/studiovainilla.com\/wp-content\/uploads\/2026\/05\/Napawika-StudioVainilla-Branding.png\" alt=\"Napawika-StudioVainilla-Branding.png\" \/><\/figure><\/div><div class=\"swiper-slide\" role=\"group\" aria-roledescription=\"slide\" aria-label=\"7 de 15\"><figure class=\"swiper-slide-inner\"><img decoding=\"async\" class=\"swiper-slide-image\" src=\"https:\/\/studiovainilla.com\/wp-content\/uploads\/2026\/05\/Noni-Knots-StudioVainilla.png\" alt=\"Noni-Knots-StudioVainilla.png\" \/><\/figure><\/div><div class=\"swiper-slide\" role=\"group\" aria-roledescription=\"slide\" aria-label=\"8 de 15\"><figure class=\"swiper-slide-inner\"><img decoding=\"async\" class=\"swiper-slide-image\" src=\"https:\/\/studiovainilla.com\/wp-content\/uploads\/2026\/05\/Startup-Chihuahua-StudioVainilla-Branding-Design.png\" alt=\"Startup-Chihuahua-StudioVainilla-Branding-Design.png\" \/><\/figure><\/div><div class=\"swiper-slide\" role=\"group\" aria-roledescription=\"slide\" aria-label=\"9 de 15\"><figure class=\"swiper-slide-inner\"><img decoding=\"async\" class=\"swiper-slide-image\" src=\"https:\/\/studiovainilla.com\/wp-content\/uploads\/2026\/05\/Yoomi-Churros-StudioVainilla.png\" alt=\"Yoomi-Churros-StudioVainilla.png\" \/><\/figure><\/div><div class=\"swiper-slide\" role=\"group\" aria-roledescription=\"slide\" aria-label=\"10 de 15\"><figure class=\"swiper-slide-inner\"><img decoding=\"async\" class=\"swiper-slide-image\" src=\"https:\/\/studiovainilla.com\/wp-content\/uploads\/2026\/05\/Sultan-Suleyman-StudioVainilla.png\" alt=\"Sultan-Suleyman-StudioVainilla.png\" \/><\/figure><\/div><div class=\"swiper-slide\" role=\"group\" aria-roledescription=\"slide\" aria-label=\"11 de 15\"><figure class=\"swiper-slide-inner\"><img decoding=\"async\" class=\"swiper-slide-image\" src=\"https:\/\/studiovainilla.com\/wp-content\/uploads\/2026\/05\/Moreno-rico-StudioVainilla.png\" alt=\"Moreno-rico-StudioVainilla.png\" \/><\/figure><\/div><div class=\"swiper-slide\" role=\"group\" aria-roledescription=\"slide\" aria-label=\"12 de 15\"><figure class=\"swiper-slide-inner\"><img decoding=\"async\" class=\"swiper-slide-image\" src=\"https:\/\/studiovainilla.com\/wp-content\/uploads\/2026\/05\/Lic-Carrillo-StudioVainilla.png\" alt=\"Lic-Carrillo-StudioVainilla.png\" \/><\/figure><\/div><div class=\"swiper-slide\" role=\"group\" aria-roledescription=\"slide\" aria-label=\"13 de 15\"><figure class=\"swiper-slide-inner\"><img decoding=\"async\" class=\"swiper-slide-image\" src=\"https:\/\/studiovainilla.com\/wp-content\/uploads\/2026\/05\/Jox-Medical-StudioVainilla.png\" alt=\"Jox-Medical-StudioVainilla.png\" \/><\/figure><\/div><div class=\"swiper-slide\" role=\"group\" aria-roledescription=\"slide\" aria-label=\"14 de 15\"><figure class=\"swiper-slide-inner\"><img decoding=\"async\" class=\"swiper-slide-image\" src=\"https:\/\/studiovainilla.com\/wp-content\/uploads\/2026\/05\/Klogistic-StudioVainilla.png\" alt=\"Klogistic-StudioVainilla.png\" \/><\/figure><\/div><div class=\"swiper-slide\" role=\"group\" aria-roledescription=\"slide\" aria-label=\"15 de 15\"><figure class=\"swiper-slide-inner\"><img decoding=\"async\" class=\"swiper-slide-image\" src=\"https:\/\/studiovainilla.com\/wp-content\/uploads\/2026\/05\/La-Alianza-StudioVainilla.png\" alt=\"La-Alianza-StudioVainilla.png\" \/><\/figure><\/div>\t\t\t<\/div>\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>We build brands with strategy, visual identity, and conceptual direction for companies looking to differentiate themselves and communicate better.<\/p>","protected":false},"author":1,"featured_media":762,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-369","page","type-page","status-publish","has-post-thumbnail","hentry"],"_links":{"self":[{"href":"https:\/\/studiovainilla.com\/en\/wp-json\/wp\/v2\/pages\/369","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/studiovainilla.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/studiovainilla.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/studiovainilla.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/studiovainilla.com\/en\/wp-json\/wp\/v2\/comments?post=369"}],"version-history":[{"count":26,"href":"https:\/\/studiovainilla.com\/en\/wp-json\/wp\/v2\/pages\/369\/revisions"}],"predecessor-version":[{"id":1281,"href":"https:\/\/studiovainilla.com\/en\/wp-json\/wp\/v2\/pages\/369\/revisions\/1281"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/studiovainilla.com\/en\/wp-json\/wp\/v2\/media\/762"}],"wp:attachment":[{"href":"https:\/\/studiovainilla.com\/en\/wp-json\/wp\/v2\/media?parent=369"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}