{"id":10,"date":"2025-06-21T19:17:06","date_gmt":"2025-06-21T19:17:06","guid":{"rendered":"https:\/\/assinatura.calidan.com.br\/?page_id=10"},"modified":"2026-03-13T23:18:40","modified_gmt":"2026-03-13T23:18:40","slug":"elementor-10","status":"publish","type":"page","link":"https:\/\/assinatura.calidan.com.br\/","title":{"rendered":"Home"},"content":{"rendered":"\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t
\r\n \r\n \r\n \r\n\r\n\r\n\r\n \r\n \r\n\r\n CALIDAN | Clube de Assinatura de Roupa Feminina e Beleza Premium<\/title>\r\n <meta name=\"description\"\r\n content=\"O melhor clube de assinatura de roupa e beleza do Brasil. Receba mensalmente uma curadoria exclusiva de moda, acess\u00f3rios e cosm\u00e9ticos na sua casa. Assinatura de roupa personalizada.\">\r\n <meta name=\"keywords\"\r\n content=\"clube de assinatura de roupa, assinatura de roupa, box de roupas, moda por assinatura, calidan box, curadoria de moda feminina\">\r\n <link rel=\"canonical\" href=\"https:\/\/www.calidan.com.br\/\">\r\n\r\n <meta property=\"og:title\" content=\"CALIDAN | Sua dose mensal de estilo e sofistica\u00e7\u00e3o\">\r\n <meta property=\"og:description\" content=\"Invista em voc\u00ea com o clube de assinatura de roupa mais completo.\">\r\n <meta property=\"og:image\" content=\"https:\/\/www.calidan.com.br\/wp-content\/uploads\/2026\/01\/clube-de-assinatura.png\">\r\n\r\n <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\r\n <script src=\"https:\/\/unpkg.com\/vue@3\/dist\/vue.global.js\"><\/script>\r\n <script src=\"https:\/\/unpkg.com\/lucide@latest\"><\/script>\r\n\r\n <style>\r\n @import url('https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@300;400;500;600;700&family=Playfair+Display:ital,wght@0,400;0,700;1,400&display=swap');\r\n\r\n html {\r\n scroll-behavior: smooth;\r\n }\r\n\r\n body {\r\n font-family: 'Inter', sans-serif;\r\n text-rendering: optimizeLegibility;\r\n -webkit-font-smoothing: antialiased;\r\n }\r\n\r\n .font-serif {\r\n font-family: 'Playfair Display', serif;\r\n }\r\n\r\n [v-cloak] {\r\n display: none;\r\n }\r\n\r\n \/* Custom scrollbar for better aesthetic *\/\r\n ::-webkit-scrollbar {\r\n width: 8px;\r\n }\r\n\r\n ::-webkit-scrollbar-track {\r\n background: #FDFCFB;\r\n }\r\n\r\n ::-webkit-scrollbar-thumb {\r\n background: #e5e5e5;\r\n border-radius: 10px;\r\n }\r\n\r\n .bg-stone-50.p-6.md\\:p-10.border.border-stone-100.rounded-sm {\r\n padding: 0 !important;\r\n }\r\n\r\n \r\n\r\n <\/style>\r\n<\/head>\r\n\r\n<body>\r\n <div id=\"app\" v-cloak>\r\n <div class=\"min-h-screen bg-[#FDFCFB] text-[#333] font-sans overflow-x-hidden\">\r\n <nav\r\n :class=\"['fixed w-full z-50 transition-all duration-500', scrolled ? 'bg-white\/95 backdrop-blur-md shadow-sm py-3' : 'bg-transparent py-5']\">\r\n <div class=\"max-w-7xl mx-auto px-6 flex justify-between items-center\">\r\n <div class=\"text-2xl font-serif tracking-widest font-light\">CALIDAN<\/div>\r\n\r\n <div class=\"hidden md:flex space-x-8 text-sm uppercase tracking-widest font-medium\">\r\n <a href=\"#como-funciona\" class=\"hover:text-stone-500 transition-colors\">Como Funciona<\/a>\r\n <a href=\"#o-que-vem\" class=\"hover:text-stone-500 transition-colors\">A Box<\/a>\r\n <a href=\"#planos\" class=\"hover:text-stone-500 transition-colors\">Planos<\/a>\r\n <a href=\"#depoimentos\" class=\"hover:text-stone-500 transition-colors\">Comunidade<\/a>\r\n <\/div>\r\n\r\n <div class=\"hidden md:block\">\r\n <button @click=\"activeModal = 'form'\"\r\n class=\"bg-stone-800 text-white px-6 py-2.5 text-xs uppercase tracking-widest hover:bg-stone-700 transition-all shadow-sm\">\r\n Quero Minha Box\r\n <\/button>\r\n <\/div>\r\n\r\n <button class=\"md:hidden p-2\" @click=\"isMenuOpen = !isMenuOpen\" aria-label=\"Menu\">\r\n <i :data-lucide=\"isMenuOpen ? 'x' : 'menu'\" class=\"text-stone-800\" size=\"24\"><\/i>\r\n <\/button>\r\n <\/div>\r\n\r\n <transition enter-active-class=\"transition duration-300 ease-out\"\r\n enter-from-class=\"opacity-0 -translate-y-4\" enter-to-class=\"opacity-100 translate-y-0\"\r\n leave-active-class=\"transition duration-200 ease-in\" leave-from-class=\"opacity-100 translate-y-0\"\r\n leave-to-class=\"opacity-0 -translate-y-4\">\r\n <div v-if=\"isMenuOpen\"\r\n class=\"md:hidden bg-white border-b border-stone-100 shadow-xl absolute w-full left-0 p-8 space-y-6\">\r\n <a href=\"#como-funciona\" @click=\"isMenuOpen = false\"\r\n class=\"block text-sm uppercase tracking-[0.2em] font-medium border-b border-stone-50 pb-2\">Como\r\n Funciona<\/a>\r\n <a href=\"#o-que-vem\" @click=\"isMenuOpen = false\"\r\n class=\"block text-sm uppercase tracking-[0.2em] font-medium border-b border-stone-50 pb-2\">A\r\n Box<\/a>\r\n <a href=\"#planos\" @click=\"isMenuOpen = false\"\r\n class=\"block text-sm uppercase tracking-[0.2em] font-medium border-b border-stone-50 pb-2\">Planos<\/a>\r\n <a href=\"#depoimentos\" @click=\"isMenuOpen = false\"\r\n class=\"block text-sm uppercase tracking-[0.2em] font-medium border-b border-stone-50 pb-2\">Comunidade<\/a>\r\n <button @click=\"isMenuOpen = false; activeModal = 'form'\"\r\n class=\"block w-full text-center bg-stone-800 text-white py-4 text-xs uppercase tracking-widest font-bold\">Assinar\r\n Agora<\/button>\r\n <\/div>\r\n <\/transition>\r\n <\/nav>\r\n\r\n <section class=\"relative min-h-screen flex flex-col lg:flex-row items-center bg-[#F9F8F6] overflow-hidden\">\r\n <div\r\n class=\"max-w-7xl mx-auto px-6 w-full grid grid-cols-1 lg:grid-cols-2 gap-12 items-center pt-32 lg:pt-0\">\r\n\r\n <div class=\"z-10 order-2 lg:order-1 pb-20 lg:pb-0 text-center lg:text-left\">\r\n <span\r\n class=\"uppercase tracking-[0.3em] text-[10px] md:text-sm mb-6 block text-stone-500 font-semibold\">\r\n Clube de Assinatura Premium\r\n <\/span>\r\n <h1 class=\"text-4xl md:text-5xl lg:text-7xl font-serif mb-8 leading-[1.1] text-stone-900\">\r\n Sua dose mensal de <br class=\"hidden md:block\" \/>\r\n <span class=\"italic font-light\">estilo e sofistica\u00e7\u00e3o.<\/span>\r\n <\/h1>\r\n <p\r\n class=\"text-base md:text-xl mb-10 font-light text-stone-600 leading-relaxed max-w-xl mx-auto lg:mx-0\">\r\n Receba mensalmente uma curadoria exclusiva de roupas, acess\u00f3rios e cosm\u00e9ticos.\r\n Invista a partir de <span class=\"font-semibold text-stone-900\">R$ 249,90<\/span> e receba at\u00e9\r\n <span class=\"font-semibold text-stone-900\">R$ 499,90<\/span> em produtos de alta qualidade\r\n atrav\u00e9s da nossa <strong class=\"font-medium text-stone-800\">assinatura de roupa<\/strong>\r\n personalizada.\r\n <\/p>\r\n <div class=\"flex flex-col sm:flex-row gap-4 justify-center lg:justify-start\">\r\n <button @click=\"activeModal = 'form'\"\r\n class=\"bg-stone-800 text-white px-10 py-5 font-bold uppercase tracking-widest hover:bg-stone-700 transition-all flex items-center justify-center group shadow-lg\">\r\n Come\u00e7ar Meu Quiz <i data-lucide=\"chevron-right\"\r\n class=\"ml-2 group-hover:translate-x-1 transition-transform\" size=\"18\"><\/i>\r\n <\/button>\r\n <a href=\"#planos\"\r\n class=\"border border-stone-300 text-stone-600 px-10 py-5 font-medium uppercase tracking-widest hover:bg-stone-50 transition-all flex items-center justify-center text-center\">\r\n Ver Planos\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"relative h-[450px] lg:h-screen w-full order-1 lg:order-2 px-4 lg:px-0\">\r\n <div class=\"absolute inset-0 bg-stone-200 animate-pulse lg:hidden\" v-if=\"!imageLoaded\"><\/div>\r\n <img decoding=\"async\" src=\"https:\/\/www.calidan.com.br\/wp-content\/uploads\/2026\/01\/clube-de-assinatura.png\"\r\n alt=\"Clube de Assinatura de Roupa Calidan\"\r\n class=\"w-full h-full object-cover shadow-2xl rounded-sm lg:rounded-none\"\r\n @load=\"imageLoaded = true\" \/>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <section class=\"py-24 px-6 bg-white relative\">\r\n <div class=\"max-w-7xl mx-auto\">\r\n <div class=\"grid grid-cols-1 md:grid-cols-3 gap-16 text-center\">\r\n <div class=\"flex flex-col items-center\">\r\n <div\r\n class=\"w-20 h-20 rounded-full bg-stone-50 flex items-center justify-center mb-6 shadow-sm\">\r\n <i data-lucide=\"sparkles\" class=\"text-stone-400\" size=\"32\"><\/i>\r\n <\/div>\r\n <h3 class=\"font-serif text-2xl mb-4\">Curadoria Especializada<\/h3>\r\n <p class=\"text-stone-500 leading-relaxed font-light\">Nossos personal stylists selecionam\r\n cada item baseados no seu perfil \u00fanico de estilo e beleza.<\/p>\r\n <\/div>\r\n <div class=\"flex flex-col items-center\">\r\n <div\r\n class=\"w-20 h-20 rounded-full bg-stone-50 flex items-center justify-center mb-6 shadow-sm\">\r\n <i data-lucide=\"shopping-bag\" class=\"text-stone-400\" size=\"32\"><\/i>\r\n <\/div>\r\n <h3 class=\"font-serif text-2xl mb-4\">Beleza Completa<\/h3>\r\n <p class=\"text-stone-500 leading-relaxed font-light\">Mais que roupas: acess\u00f3rios, maquiagens\r\n e perfumes que complementam seu visual de forma integral.<\/p>\r\n <\/div>\r\n <div class=\"flex flex-col items-center\">\r\n <div\r\n class=\"w-20 h-20 rounded-full bg-stone-50 flex items-center justify-center mb-6 shadow-sm\">\r\n <i data-lucide=\"heart\" class=\"text-stone-400\" size=\"32\"><\/i>\r\n <\/div>\r\n <h3 class=\"font-serif text-2xl mb-4\">Autoestima Todo M\u00eas<\/h3>\r\n <p class=\"text-stone-500 leading-relaxed font-light\">Mantenha seu guarda-roupa renovado e\r\n sua rotina de beleza em dia sem precisar sair de casa.<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"mt-20 text-center\">\r\n <button @click=\"activeModal = 'form'\"\r\n class=\"inline-block bg-stone-800 text-white px-12 py-5 font-bold uppercase tracking-widest hover:bg-stone-700 transition-all shadow-xl\">\r\n Quero Transformar Meu Estilo\r\n <\/button>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"como-funciona\" class=\"py-24 bg-[#FAF9F6]\">\r\n <div class=\"max-w-7xl mx-auto px-6\">\r\n <div class=\"flex flex-col lg:flex-row items-center gap-16\">\r\n <div class=\"w-full lg:w-1\/2\">\r\n <div class=\"relative group\">\r\n <img decoding=\"async\" src=\"https:\/\/www.calidan.com.br\/wp-content\/uploads\/2026\/01\/clube-de-assinatura-1.png\"\r\n alt=\"Experi\u00eancia Calidan Assinatura de Roupa\"\r\n class=\"w-full h-[400px] md:h-[600px] object-cover shadow-2xl rounded-sm\" \/>\r\n <div class=\"absolute -bottom-6 -right-6 w-32 h-32 bg-stone-100 -z-10 hidden md:block\">\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <div class=\"w-full lg:w-1\/2\">\r\n <span\r\n class=\"uppercase tracking-[0.2em] text-xs text-stone-400 mb-4 block font-bold\">Experi\u00eancia\r\n Calidan<\/span>\r\n <h2 class=\"text-4xl md:text-5xl font-serif mb-12 leading-[1.2]\">Sua jornada para um novo eu\r\n come\u00e7a agora.<\/h2>\r\n\r\n <div class=\"space-y-12\">\r\n <div class=\"flex gap-6\">\r\n <span class=\"text-4xl font-serif text-stone-200\">01<\/span>\r\n <div>\r\n <h4 class=\"text-xl font-medium mb-2\">Preencha seu Quiz de Estilo<\/h4>\r\n <p class=\"text-stone-500 font-light\">Conte-nos suas prefer\u00eancias, numera\u00e7\u00f5es e o\r\n que voc\u00ea ama (ou evita). \u00c9 r\u00e1pido e essencial para a personaliza\u00e7\u00e3o.<\/p>\r\n <\/div>\r\n <\/div>\r\n <div class=\"flex gap-6\">\r\n <span class=\"text-4xl font-serif text-stone-200\">02<\/span>\r\n <div>\r\n <h4 class=\"text-xl font-medium mb-2\">Curadoria Calidan<\/h4>\r\n <p class=\"text-stone-500 font-light\">Nossos especialistas analisam seu perfil e\r\n montam uma box com itens de moda e beleza que combinam com voc\u00ea.<\/p>\r\n <\/div>\r\n <\/div>\r\n <div class=\"flex gap-6\">\r\n <span class=\"text-4xl font-serif text-stone-200\">03<\/span>\r\n <div>\r\n <h4 class=\"text-xl font-medium mb-2\">Receba em Casa<\/h4>\r\n <p class=\"text-stone-500 font-light\">Sua Calidan Box chega em uma embalagem\r\n luxuosa, pronta para transformar sua rotina e seu visual.<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <button @click=\"activeModal = 'form'\"\r\n class=\"mt-12 w-full md:w-auto bg-stone-800 text-white px-10 py-5 uppercase tracking-widest text-sm font-bold hover:bg-stone-700 transition-all flex items-center justify-center shadow-lg group\">\r\n Fazer Meu Quiz <i data-lucide=\"arrow-right\"\r\n class=\"ml-3 group-hover:translate-x-1 transition-transform\" size=\"18\"><\/i>\r\n <\/button>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"o-que-vem\" class=\"py-24 bg-white px-6\">\r\n <div class=\"max-w-7xl mx-auto text-center mb-16\">\r\n <h2 class=\"text-4xl font-serif mb-4 text-stone-900\">O que esperar da sua Box?<\/h2>\r\n <p class=\"text-stone-500 max-w-2xl mx-auto font-light leading-relaxed\">Trabalhamos com marcas\r\n premium e curadoria pr\u00f3pria para garantir qualidade e tend\u00eancia em cada envio do nosso <strong\r\n class=\"text-stone-700\">clube de assinatura de roupa<\/strong>.<\/p>\r\n <\/div>\r\n\r\n <div class=\"grid grid-cols-2 lg:grid-cols-4 gap-4 md:gap-6 max-w-7xl mx-auto\">\r\n <div class=\"relative group overflow-hidden aspect-[3\/4] shadow-md\">\r\n <img decoding=\"async\" src=\"https:\/\/www.calidan.com.br\/wp-content\/uploads\/2026\/01\/2.png\"\r\n class=\"w-full h-full object-cover grayscale-[20%] group-hover:grayscale-0 group-hover:scale-110 transition-all duration-700\"\r\n alt=\"Moda Feminina Calidan\" \/>\r\n <div\r\n class=\"absolute inset-0 bg-gradient-to-t from-black\/70 via-transparent to-transparent opacity-60 group-hover:opacity-80 transition-opacity\">\r\n <\/div>\r\n <div class=\"absolute bottom-4 left-4 md:bottom-6 md:left-6 text-white\">\r\n <p class=\"text-[10px] uppercase tracking-widest mb-1 opacity-80\">Pe\u00e7a Principal<\/p>\r\n <h4 class=\"text-base md:text-xl font-serif\">Moda Feminina<\/h4>\r\n <\/div>\r\n <\/div>\r\n <div class=\"relative group overflow-hidden aspect-[3\/4] shadow-md\">\r\n <img decoding=\"async\" src=\"https:\/\/www.calidan.com.br\/wp-content\/uploads\/2026\/01\/3.png\"\r\n class=\"w-full h-full object-cover grayscale-[20%] group-hover:grayscale-0 group-hover:scale-110 transition-all duration-700\"\r\n alt=\"Cosm\u00e9ticos Premium Calidan\" \/>\r\n <div\r\n class=\"absolute inset-0 bg-gradient-to-t from-black\/70 via-transparent to-transparent opacity-60 group-hover:opacity-80 transition-opacity\">\r\n <\/div>\r\n <div class=\"absolute bottom-4 left-4 md:bottom-6 md:left-6 text-white\">\r\n <p class=\"text-[10px] uppercase tracking-widest mb-1 opacity-80\">Cuidado<\/p>\r\n <h4 class=\"text-base md:text-xl font-serif\">Skincare & Makeup<\/h4>\r\n <\/div>\r\n <\/div>\r\n <div class=\"relative group overflow-hidden aspect-[3\/4] shadow-md\">\r\n <img decoding=\"async\" src=\"https:\/\/www.calidan.com.br\/wp-content\/uploads\/2026\/01\/4.png\"\r\n class=\"w-full h-full object-cover grayscale-[20%] group-hover:grayscale-0 group-hover:scale-110 transition-all duration-700\"\r\n alt=\"Perfumes Exclusivos Calidan\" \/>\r\n <div\r\n class=\"absolute inset-0 bg-gradient-to-t from-black\/70 via-transparent to-transparent opacity-60 group-hover:opacity-80 transition-opacity\">\r\n <\/div>\r\n <div class=\"absolute bottom-4 left-4 md:bottom-6 md:left-6 text-white\">\r\n <p class=\"text-[10px] uppercase tracking-widest mb-1 opacity-80\">Fragr\u00e2ncia<\/p>\r\n <h4 class=\"text-base md:text-xl font-serif\">Perfumes<\/h4>\r\n <\/div>\r\n <\/div>\r\n <div class=\"relative group overflow-hidden aspect-[3\/4] shadow-md\">\r\n <img decoding=\"async\" src=\"https:\/\/www.calidan.com.br\/wp-content\/uploads\/2026\/01\/5.png\"\r\n class=\"w-full h-full object-cover grayscale-[20%] group-hover:grayscale-0 group-hover:scale-110 transition-all duration-700\"\r\n alt=\"Acess\u00f3rios de Luxo Calidan\" \/>\r\n <div\r\n class=\"absolute inset-0 bg-gradient-to-t from-black\/70 via-transparent to-transparent opacity-60 group-hover:opacity-80 transition-opacity\">\r\n <\/div>\r\n <div class=\"absolute bottom-4 left-4 md:bottom-6 md:left-6 text-white\">\r\n <p class=\"text-[10px] uppercase tracking-widest mb-1 opacity-80\">Detalhes<\/p>\r\n <h4 class=\"text-base md:text-xl font-serif\">Acess\u00f3rios<\/h4>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"mt-16 text-center\">\r\n <a href=\"#planos\"\r\n class=\"inline-flex items-center space-x-2 text-stone-800 font-bold uppercase tracking-[0.2em] text-sm hover:text-stone-500 transition-colors group\">\r\n <span>Ver todos os benef\u00edcios dos planos<\/span>\r\n <i data-lucide=\"chevron-right\" size=\"20\"\r\n class=\"group-hover:translate-x-1 transition-transform\"><\/i>\r\n <\/a>\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"planos\" class=\"py-24 bg-[#F5F4F0] px-6\">\r\n <div class=\"max-w-7xl mx-auto\">\r\n <div class=\"text-center mb-16\">\r\n <span\r\n class=\"uppercase tracking-widest text-[10px] md:text-xs text-stone-400 mb-2 block font-bold\">Escolha\r\n sua frequ\u00eancia<\/span>\r\n <h2 class=\"text-4xl md:text-5xl font-serif mb-4 text-stone-900\">Planos de Assinatura<\/h2>\r\n <div class=\"w-20 h-[2px] bg-stone-800 mx-auto mt-6\"><\/div>\r\n <\/div>\r\n\r\n <div class=\"grid grid-cols-1 md:grid-cols-3 gap-8\">\r\n <div v-for=\"(plan, index) in plans\" :key=\"index\"\r\n :class=\"['relative flex flex-col p-10 bg-white transition-all duration-500 hover:-translate-y-2 group', plan.highlight ? 'ring-2 ring-stone-800 shadow-2xl z-10' : 'shadow-md opacity-90 hover:opacity-100']\">\r\n <div v-if=\"plan.highlight\"\r\n class=\"absolute top-0 left-1\/2 -translate-x-1\/2 -translate-y-1\/2 bg-stone-800 text-white px-6 py-2 text-[10px] uppercase tracking-[0.2em] font-bold shadow-lg\">\r\n Mais Popular\r\n <\/div>\r\n\r\n <h3 class=\"text-2xl font-serif mb-2 text-stone-800\">{{ plan.name }}<\/h3>\r\n <p class=\"text-stone-400 text-sm mb-8 h-10 leading-relaxed italic\">{{ plan.description }}\r\n <\/p>\r\n\r\n <div class=\"mb-8 border-b border-stone-100 pb-8\">\r\n <div v-if=\"plan.oldPrice\" class=\"text-stone-400 text-sm line-through mb-1 font-medium\">\r\n R$ {{ plan.oldPrice }}\r\n <\/div>\r\n <div class=\"flex items-baseline\">\r\n <span class=\"text-sm align-top font-bold mr-1\">R$<\/span>\r\n <span class=\"text-5xl md:text-6xl font-serif text-stone-900\">{{ plan.price }}<\/span>\r\n <span class=\"text-stone-400 text-sm ml-1 font-medium\">\/{{ plan.period }}<\/span>\r\n <\/div>\r\n <\/div>\r\n\r\n <ul class=\"space-y-4 mb-10 flex-grow\">\r\n <li v-for=\"(feature, i) in plan.features\" :key=\"i\"\r\n class=\"flex items-start text-sm text-stone-600\">\r\n <i data-lucide=\"check\" size=\"18\" class=\"text-stone-800 mr-3 shrink-0 mt-0.5\"><\/i>\r\n <span class=\"font-light\">{{ feature }}<\/span>\r\n <\/li>\r\n <\/ul>\r\n\r\n <a :href=\"plan.link\" target=\"_blank\" rel=\"noopener noreferrer\"\r\n :class=\"['w-full py-5 uppercase tracking-widest text-xs font-black transition-all text-center block shadow-sm', plan.highlight ? 'bg-stone-800 text-white hover:bg-stone-700 shadow-stone-200' : 'bg-transparent border-2 border-stone-800 text-stone-800 hover:bg-stone-800 hover:text-white']\">\r\n {{ plan.cta }}\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <section class=\"py-24 bg-white px-6\">\r\n <div class=\"max-w-7xl mx-auto\">\r\n <div class=\"text-center mb-16\">\r\n <span class=\"uppercase tracking-widest text-xs text-stone-400 mb-2 block font-bold\">Experi\u00eancia\r\n Real<\/span>\r\n <h2 class=\"text-4xl md:text-5xl font-serif mb-4 text-stone-900\">Curadoria Exclusiva<\/h2>\r\n <div class=\"w-20 h-[2px] bg-stone-800 mx-auto mt-6\"><\/div>\r\n <\/div>\r\n\r\n <div class=\"grid grid-cols-1 md:grid-cols-12 gap-4 auto-rows-auto\">\r\n <div\r\n class=\"md:col-span-6 md:row-span-2 overflow-hidden rounded-sm shadow-xl group bg-stone-100 min-h-[500px] md:min-h-0\">\r\n <video src=\"https:\/\/calidan.com.br\/wp-content\/uploads\/2026\/01\/Copia-de-Video.mp4\" autoplay\r\n loop muted playsinline\r\n class=\"w-full h-full object-cover transition-transform duration-1000 group-hover:scale-105\"><\/video>\r\n <\/div>\r\n\r\n <div class=\"md:col-span-3 h-64 md:h-auto overflow-hidden rounded-sm shadow-sm group\">\r\n <img decoding=\"async\" src=\"https:\/\/calidan.com.br\/wp-content\/uploads\/2026\/01\/ChatGPT-Image-15-de-jan.-de-2026-10_37_31.png\"\r\n alt=\"Assinatura de Roupa Calidan Box 1\"\r\n class=\"w-full h-full object-cover transition-transform duration-700 group-hover:scale-110\" \/>\r\n <\/div>\r\n\r\n <div class=\"md:col-span-3 h-64 md:h-auto overflow-hidden rounded-sm shadow-sm group\">\r\n <img decoding=\"async\" src=\"https:\/\/calidan.com.br\/wp-content\/uploads\/2026\/01\/Gemini_Generated_Image_n040iln040iln040-scaled-e1768410635232.png\"\r\n alt=\"Assinatura de Roupa Calidan Box 2\"\r\n class=\"w-full h-full object-cover transition-transform duration-700 group-hover:scale-110\" \/>\r\n <\/div>\r\n\r\n <div class=\"md:col-span-3 h-64 md:h-auto overflow-hidden rounded-sm shadow-sm group\">\r\n <img decoding=\"async\" src=\"https:\/\/calidan.com.br\/wp-content\/uploads\/2026\/01\/New-Calidan-Box-.png\"\r\n alt=\"Assinatura de Roupa Calidan Box 3\"\r\n class=\"w-full h-full object-cover transition-transform duration-700 group-hover:scale-110\" \/>\r\n <\/div>\r\n\r\n <div class=\"md:col-span-3 h-64 md:h-auto overflow-hidden rounded-sm shadow-sm group\">\r\n <img decoding=\"async\" src=\"https:\/\/calidan.com.br\/wp-content\/uploads\/2025\/06\/ChatGPT-Image-17-de-jun.-de-2025-15_52_17.png\"\r\n alt=\"Assinatura de Roupa Calidan Box 4\"\r\n class=\"w-full h-full object-cover transition-transform duration-700 group-hover:scale-110\" \/>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"mt-20 text-center\">\r\n <button @click=\"activeModal = 'form'\"\r\n class=\"bg-stone-800 text-white px-12 py-5 font-bold uppercase tracking-widest hover:bg-stone-700 transition-all shadow-xl group\">\r\n Quero Minha Experi\u00eancia Calidan <i data-lucide=\"sparkles\"\r\n class=\"ml-2 inline-block group-hover:rotate-12 transition-transform\" size=\"18\"><\/i>\r\n <\/button>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"depoimentos\" class=\"py-24 bg-[#FAF9F6] overflow-hidden\">\r\n <div class=\"max-w-7xl mx-auto px-6\">\r\n <div class=\"text-center mb-16\">\r\n <h2 class=\"text-4xl md:text-5xl font-serif text-stone-900\">O que dizem as mulheres Calidan<\/h2>\r\n <\/div>\r\n\r\n <div class=\"grid grid-cols-1 lg:grid-cols-2 gap-8 md:gap-16\">\r\n <div\r\n class=\"flex flex-col md:flex-row gap-8 items-center bg-white p-8 md:p-10 rounded-sm shadow-sm border border-stone-50\">\r\n <img decoding=\"async\" src=\"https:\/\/www.calidan.com.br\/wp-content\/uploads\/2026\/01\/2-1.png\"\r\n alt=\"Assinante Calidan Juliana M.\"\r\n class=\"w-full md:w-48 h-64 object-cover shadow-lg rounded-sm shrink-0\" \/>\r\n <div>\r\n <div class=\"flex mb-4\">\r\n <i v-for=\"s in 5\" :key=\"s\" data-lucide=\"star\" size=\"14\"\r\n class=\"fill-stone-800 text-stone-800 mr-1\"><\/i>\r\n <\/div>\r\n <p class=\"text-lg font-light italic mb-4 leading-relaxed text-stone-600\">\r\n \"A experi\u00eancia de abrir a Calidan Box \u00e9 m\u00e1gica. As roupas vestem perfeitamente e os\r\n mimos de beleza s\u00e3o sempre marcas que eu j\u00e1 queria testar.\"\r\n <\/p>\r\n <span class=\"font-bold text-stone-900 uppercase text-[10px] tracking-widest\">\u2014 Juliana\r\n M., Assinante h\u00e1 8 meses<\/span>\r\n <\/div>\r\n <\/div>\r\n\r\n <div\r\n class=\"flex flex-col md:flex-row gap-8 items-center bg-white p-8 md:p-10 rounded-sm shadow-sm border border-stone-50\">\r\n <img decoding=\"async\" src=\"https:\/\/www.calidan.com.br\/wp-content\/uploads\/2026\/01\/3-1.png\"\r\n alt=\"Assinante Calidan Renata S.\"\r\n class=\"w-full md:w-48 h-64 object-cover shadow-lg rounded-sm shrink-0\" \/>\r\n <div>\r\n <div class=\"flex mb-4\">\r\n <i v-for=\"s in 5\" :key=\"s\" data-lucide=\"star\" size=\"14\"\r\n class=\"fill-stone-800 text-stone-800 mr-1\"><\/i>\r\n <\/div>\r\n <p class=\"text-lg font-light italic mb-4 leading-relaxed text-stone-600\">\r\n \"Economizo tempo e dinheiro. Por R$ 249,90\/m\u00eas recebo pe\u00e7as que sozinhas custariam\r\n muito mais em lojas de shopping. A curadoria \u00e9 impec\u00e1vel.\"\r\n <\/p>\r\n <span class=\"font-bold text-stone-900 uppercase text-[10px] tracking-widest\">\u2014 Renata\r\n S., Assinante Plano Anual<\/span>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <section class=\"bg-stone-900 py-16 px-6\">\r\n <div class=\"max-w-4xl mx-auto text-center\">\r\n <h3 class=\"text-white font-serif text-3xl mb-6 italic\">Prepare-se para o seu melhor look.<\/h3>\r\n <p class=\"text-stone-400 mb-10 font-light\">Participe da nossa comunidade e receba dicas de estilo\r\n exclusivas da nossa curadoria.<\/p>\r\n <div class=\"flex flex-col md:flex-row gap-0 max-w-lg mx-auto overflow-hidden rounded-sm\">\r\n <input type=\"email\" placeholder=\"Seu melhor e-mail\"\r\n class=\"flex-grow bg-white border-none px-6 py-4 text-sm outline-none\" \/>\r\n <button\r\n class=\"bg-stone-700 text-white px-8 py-4 text-sm uppercase tracking-widest font-black hover:bg-stone-600 transition-colors\">Cadastrar<\/button>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <footer class=\"bg-[#FAF9F6] pt-20 pb-10 px-6 border-t border-stone-100\">\r\n <div class=\"max-w-7xl mx-auto\">\r\n <div class=\"grid grid-cols-1 sm:grid-cols-2 md:grid-cols-4 gap-12 mb-16\">\r\n <div class=\"col-span-1\">\r\n <div class=\"text-2xl font-serif tracking-widest mb-6\">CALIDAN<\/div>\r\n <p class=\"text-stone-500 text-sm leading-relaxed mb-6 font-light\">\r\n Curadoria de moda e beleza por assinatura. Elevando sua autoestima mensalmente atrav\u00e9s\r\n de experi\u00eancias personalizadas.\r\n <\/p>\r\n <div class=\"flex space-x-6\">\r\n <a href=\"https:\/\/www.instagram.com\/_calidan?utm_source=ig_web_button_share_sheet&igsh=ZDNlZDc0MzIxNw%3D%3D\"\r\n target=\"_blank\" rel=\"noopener noreferrer\"\r\n class=\"text-stone-400 cursor-pointer hover:text-stone-800 transition-all transform hover:scale-110\"\r\n aria-label=\"Instagram\">\r\n <i data-lucide=\"instagram\" size=\"22\"><\/i>\r\n <\/a>\r\n <a href=\"https:\/\/web.facebook.com\/people\/Calidan\/61577702633950\/\" target=\"_blank\"\r\n rel=\"noopener noreferrer\"\r\n class=\"text-stone-400 cursor-pointer hover:text-stone-800 transition-all transform hover:scale-110\"\r\n aria-label=\"Facebook\">\r\n <i data-lucide=\"facebook\" size=\"22\"><\/i>\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n\r\n <div>\r\n <h4 class=\"text-xs uppercase tracking-[0.2em] font-black mb-6 text-stone-800\">Ajuda<\/h4>\r\n <ul class=\"space-y-4 text-sm text-stone-500 font-light\">\r\n <li @click=\"activeModal = 'faq'\"\r\n class=\"hover:text-stone-800 cursor-pointer transition-colors\">Perguntas Frequentes\r\n <\/li>\r\n <li @click=\"activeModal = 'terms'\"\r\n class=\"hover:text-stone-800 cursor-pointer transition-colors\">Termos de Uso<\/li>\r\n <\/ul>\r\n <\/div>\r\n\r\n <div>\r\n <h4 class=\"text-xs uppercase tracking-[0.2em] font-black mb-6 text-stone-800\">Empresa<\/h4>\r\n <ul class=\"space-y-4 text-sm text-stone-500 font-light\">\r\n <li @click=\"activeModal = 'about'\"\r\n class=\"hover:text-stone-800 cursor-pointer transition-colors\">Sobre n\u00f3s<\/li>\r\n <li @click=\"activeModal = 'contact'\"\r\n class=\"hover:text-stone-800 cursor-pointer transition-colors\">Contato<\/li>\r\n <\/ul>\r\n <\/div>\r\n\r\n <div>\r\n <h4 class=\"text-xs uppercase tracking-[0.2em] font-black mb-6 text-stone-800\">Siga-nos<\/h4>\r\n <p\r\n class=\"text-[10px] text-stone-400 mb-6 leading-relaxed uppercase tracking-widest font-bold\">\r\n Descubra as novidades do <br \/>clube de assinatura de roupa mais amado.<\/p>\r\n <a href=\"#planos\"\r\n class=\"block w-full text-center border-2 border-stone-800 text-stone-800 py-3 text-[10px] font-black uppercase tracking-[0.2em] hover:bg-stone-800 hover:text-white transition-all\">Ver\r\n Planos 2025<\/a>\r\n <\/div>\r\n <\/div>\r\n\r\n <div\r\n class=\"border-t border-stone-200 pt-8 flex flex-col md:flex-row justify-between items-center text-[10px] uppercase tracking-[0.2em] text-stone-400 font-bold\">\r\n <p>\u00a9 2025 Calidan Box. Todos os direitos reservados.<\/p>\r\n <p class=\"mt-4 md:mt-0\">Desenvolvido com sofistica\u00e7\u00e3o<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/footer>\r\n<transition enter-active-class=\"transition duration-300 ease-out\" enter-from-class=\"opacity-0\"\r\n enter-to-class=\"opacity-100\" leave-active-class=\"transition duration-200 ease-in\"\r\n leave-from-class=\"opacity-100\" leave-to-class=\"opacity-0\">\r\n <div v-show=\"activeModal\" class=\"fixed inset-0 z-[100] flex items-center justify-center p-4\">\r\n <div class=\"absolute inset-0 bg-stone-950\/80 backdrop-blur-md\" @click=\"activeModal = null\"><\/div>\r\n <div class=\"relative bg-white w-full max-w-2xl max-h-[85vh] overflow-y-auto p-8 md:p-12 shadow-2xl rounded-sm\">\r\n \r\n <button @click=\"activeModal = null\"\r\n class=\"absolute top-6 right-6 text-stone-300 hover:text-stone-800 transition-colors\">\r\n <i data-lucide=\"x\" size=\"28\"><\/i>\r\n <\/button>\r\n\r\n <div v-show=\"activeModal === 'form'\" class=\"font-light\">\r\n <div class=\"text-center mb-10\">\r\n <span class=\"uppercase tracking-[0.3em] text-[10px] text-stone-400 mb-3 block font-bold\">Inicie sua Experi\u00eancia<\/span>\r\n <h3 class=\"text-3xl md:text-4xl font-serif text-stone-900 italic\">Quase l\u00e1...<\/h3>\r\n <p class=\"text-stone-500 mt-4 text-sm md:text-base leading-relaxed\">Preencha os dados\r\n abaixo para come\u00e7armos sua curadoria personalizada no melhor <strong\r\n class=\"text-stone-800\">clube de assinatura de roupa<\/strong>.<\/p>\r\n <\/div>\r\n\r\n <div class=\"bg-stone-50 p-6 md:p-10 border border-stone-100 rounded-sm\">\r\n <div v-pre>\r\n <div id=\"calidan-quiz-container\" class=\"w-full max-w-xl mx-auto\">\r\n <\/div>\r\n\r\n <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\r\n <style>\r\n @import url('https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@300;400;500;600;700;900&display=swap');\r\n #calidan-quiz-container { font-family: 'Inter', sans-serif; }\r\n .custom-scrollbar::-webkit-scrollbar { width: 4px; }\r\n .custom-scrollbar::-webkit-scrollbar-track { background: #fdfcfb; }\r\n .custom-scrollbar::-webkit-scrollbar-thumb { background: #c9b1c6; border-radius: 10px; }\r\n .selected-card { border-color: #b885b2 !important; background-color: rgba(201, 177, 198, 0.1) !important; transform: scale(1.02); }\r\n @keyframes slideUp { from { opacity: 0; transform: translateY(15px); } to { opacity: 1; transform: translateY(0); } }\r\n .animate-step { animation: slideUp 0.4s ease-out; }\r\n img.logo-calidan-final.object-contain.opacity-80\r\nSpecificity: (0,3,1)\r\n {\r\n width: 150px !important;\r\n}\r\n \r\n \/* Ajuste do Logo em 150px *\/\r\n .logo-calidan-final {\r\n width: 150px !important;\r\n height: auto !important;\r\n }\r\n <\/style>\r\n\r\n <script>\r\n (function() {\r\n \/\/ --- CONFIGURA\u00c7\u00d5ES GLOBAIS ---\r\n const icons = {\r\n user: `<svg class=\"w-6 h-6 text-[#b885b2]\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z\"><\/path><\/svg>`,\r\n bag: `<svg class=\"w-4 h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"3\" d=\"M16 11V7a4 4 0 00-8 0v4M5 9h14l1 12H4L5 9z\"><\/path><\/svg>`\r\n };\r\n\r\n window.currentQuizStep = 0;\r\n window.isQuizSaving = false;\r\n window.quizFormData = {\r\n name: '', email: '', phone: '', birthDate: '', address: '', instagram: '',\r\n footwearSize: '', footwearStyle: [], fragrance: [], skinType: [], makeupStyle: [],\r\n clothingSize: '', measurements: '', skirtLength: [], dressLength: [],\r\n pantStyle: [], shirtType: [], jumpsuitStyle: [], accessories: [],\r\n metalPreference: '', characterPreference: '', observations: '', selectedBox: ''\r\n };\r\n\r\n const stepsInfo = [\r\n { title: \"Boas-vindas \u00e0 Calidan\", subtitle: \"Dados b\u00e1sicos para sua curadoria premium.\", icon: icons.user },\r\n { title: \"Toque Especial\", subtitle: \"Fragr\u00e2ncia e cal\u00e7ado.\" },\r\n { title: \"Beleza Calidan\", subtitle: \"Skincare e maquiagem.\" },\r\n { title: \"Seu Caimento\", subtitle: \"Precis\u00e3o no envio das roupas.\" },\r\n { title: \"Saias e Vestidos\", subtitle: \"Escolha seus comprimentos.\" },\r\n { title: \"Modelagens\", subtitle: \"O que n\u00e3o pode faltar?\" },\r\n { title: \"Pe\u00e7as \u00danicas\", subtitle: \"Finalizando suas prefer\u00eancias.\" },\r\n { title: \"Personalidade\", subtitle: \"Mimos e detalhes extras.\" },\r\n { title: \"Sua Calidan Box\", subtitle: \"Selecione o plano ideal.\" },\r\n { title: \"Resumo Final\", subtitle: \"Tudo pronto para sua transforma\u00e7\u00e3o.\" }\r\n ];\r\n\r\n \/\/ --- VALIDA\u00c7\u00c3O OBRIGAT\u00d3RIA ---\r\n function validateCurrentStep() {\r\n const d = window.quizFormData;\r\n const s = window.currentQuizStep;\r\n if (s === 0) {\r\n if (!d.name || !d.email || !d.phone || !d.birthDate || !d.instagram || !d.address) return \"Por favor, preencha todos os campos de contato e entrega.\";\r\n }\r\n if (s === 1) {\r\n if (!d.footwearSize || d.footwearStyle.length === 0 || d.fragrance.length === 0) return \"Selecione seu tamanho, pelo menos um estilo de sapato e uma fragr\u00e2ncia.\";\r\n }\r\n if (s === 2) {\r\n if (d.skinType.length === 0 || d.makeupStyle.length === 0) return \"Informe seu tipo de pele e estilo de maquiagem.\";\r\n }\r\n if (s === 3) {\r\n if (!d.clothingSize || !d.measurements) return \"Selecione seu tamanho e informe suas medidas para ajuste.\";\r\n }\r\n if (s === 4) {\r\n if (d.skirtLength.length === 0 || d.dressLength.length === 0) return \"Selecione os comprimentos desejados para saias e vestidos.\";\r\n }\r\n if (s === 5) {\r\n if (d.pantStyle.length === 0 || d.shirtType.length === 0) return \"Escolha seus estilos de cal\u00e7a e blusas.\";\r\n }\r\n if (s === 6) {\r\n if (d.jumpsuitStyle.length === 0 || d.accessories.length === 0 || !d.metalPreference) return \"Complete as prefer\u00eancias de pe\u00e7as \u00fanicas e acess\u00f3rios.\";\r\n }\r\n if (s === 7) {\r\n if (!d.characterPreference || !d.observations) return \"Conte-nos sobre seus gostos e observa\u00e7\u00f5es extras.\";\r\n }\r\n if (s === 8) {\r\n if (!d.selectedBox) return \"Escolha uma das op\u00e7\u00f5es de Box para finalizar.\";\r\n }\r\n return \"\";\r\n }\r\n\r\n window.updateQuizField = function(f, v) { window.quizFormData[f] = v; renderQuizContent(); };\r\n window.toggleQuizArray = function(f, v) {\r\n const i = window.quizFormData[f].indexOf(v);\r\n if (i > -1) window.quizFormData[f].splice(i, 1);\r\n else window.quizFormData[f].push(v);\r\n renderQuizContent();\r\n };\r\n\r\n window.nextQuizStep = function() {\r\n const err = validateCurrentStep();\r\n if (err) { showQuizError(err); return; }\r\n hideQuizError();\r\n window.currentQuizStep++;\r\n renderQuizContent();\r\n };\r\n\r\n window.prevQuizStep = function() { hideQuizError(); window.currentQuizStep--; renderQuizContent(); };\r\n\r\n function showQuizError(m) {\r\n const e = document.getElementById('quiz-error-msg');\r\n if (e) { e.innerHTML = m; e.classList.remove('hidden'); }\r\n }\r\n function hideQuizError() { document.getElementById('quiz-error-msg')?.classList.add('hidden'); }\r\n\r\n \/\/ --- APIS E SALVAMENTO ---\r\n window.handleFinalizeCalidanQuiz = async function() {\r\n const urls = { 'mensal': 'https:\/\/www.calidan.com.br\/produto\/box-calidan-plano-mensal\/', 'semestral': 'https:\/\/www.calidan.com.br\/produto\/box-calidan-plano-semestral\/', 'anual': 'https:\/\/www.calidan.com.br\/produto\/box-calidan-plano-anual\/' };\r\n const getC = (n) => { let a = `; ${document.cookie}`.split(`; ${n}=`); return a.length === 2 ? a.pop().split(';').shift() : null; };\r\n \r\n let visitorUUID = localStorage.getItem('alethe_visitor_uuid') || crypto.randomUUID();\r\n localStorage.setItem('alethe_visitor_uuid', visitorUUID);\r\n window.isQuizSaving = true;\r\n renderQuizContent();\r\n\r\n try {\r\n const leadDataBasico = {\r\n nome: window.quizFormData.name,\r\n email: window.quizFormData.email,\r\n telefone: window.quizFormData.phone,\r\n visitor_uuid: visitorUUID,\r\n utm_source: getC('utm_source') || 'organico'\r\n };\r\n\r\n \/\/ 1. Salva Local (Calidan)\r\n await fetch('https:\/\/assinatura.calidan.com.br\/index.php?rest_route=\/calidan\/v1\/save-quiz', {\r\n method: 'POST', \r\n headers: { 'Content-Type': 'application\/json' },\r\n body: JSON.stringify({ ...window.quizFormData, visitor_uuid: visitorUUID })\r\n });\r\n\r\n \/\/ 2. Envia Lista VIP Inovetime\r\n await fetch('https:\/\/www.inovetime.com.br\/wp-json\/custom-api\/v1\/adicionar_na_lista_vip_via_api\/', {\r\n method: 'POST', \r\n headers: { 'Content-Type': 'application\/json' },\r\n body: JSON.stringify({ ...leadDataBasico, dono: '6', categoria: 'Assinatura' })\r\n });\r\n\r\n \/\/ 3. Envia CRM Alethe\r\n await fetch('https:\/\/calidan.com.br\/wp-json\/alethe\/v1\/receive-lead', { \r\n method: 'POST', \r\n headers: { 'Content-Type': 'application\/json' }, \r\n body: JSON.stringify(leadDataBasico) \r\n });\r\n\r\n \/\/ 4. Ajax Local\r\n const localData = new FormData();\r\n localData.append('action', 'alethe_handle_lead_conversion');\r\n localData.append('nome', window.quizFormData.name);\r\n localData.append('email', window.quizFormData.email);\r\n localData.append('telefone', window.quizFormData.phone);\r\n localData.append('visitor_uuid', visitorUUID);\r\n await fetch('\/wp-admin\/admin-ajax.php', { method: 'POST', body: localData });\r\n\r\n window.location.href = urls[window.quizFormData.selectedBox] + \"?v_uuid=\" + visitorUUID;\r\n } catch (e) {\r\n window.location.href = urls[window.quizFormData.selectedBox];\r\n }\r\n };\r\n\r\n \/\/ --- RENDERIZA\u00c7\u00c3O DAS 10 ETAPAS ---\r\n window.renderQuizContent = function() {\r\n const container = document.getElementById('calidan-quiz-container');\r\n if (!container) return;\r\n const d = window.quizFormData;\r\n const step = window.currentQuizStep;\r\n const progress = ((step + 1) \/ stepsInfo.length) * 100;\r\n let html = '';\r\n\r\n if (step === 0) {\r\n html = `<div class=\"space-y-4 animate-step\">\r\n <input type=\"text\" placeholder=\"Nome Completo *\" class=\"w-full p-4 bg-stone-50 border-none rounded-2xl outline-none focus:ring-2 focus:ring-[#b885b2]\" value=\"${d.name}\" oninput=\"window.quizFormData.name=this.value\">\r\n <input type=\"email\" placeholder=\"E-mail *\" class=\"w-full p-4 bg-stone-50 border-none rounded-2xl outline-none focus:ring-2 focus:ring-[#b885b2]\" value=\"${d.email}\" oninput=\"window.quizFormData.email=this.value\">\r\n <div class=\"grid grid-cols-1 sm:grid-cols-2 gap-4\">\r\n <input type=\"text\" placeholder=\"WhatsApp *\" class=\"w-full p-4 bg-stone-50 border-none rounded-2xl outline-none focus:ring-2 focus:ring-[#b885b2]\" value=\"${d.phone}\" oninput=\"window.quizFormData.phone=this.value\">\r\n <input type=\"text\" placeholder=\"Nascimento\" class=\"w-full p-4 bg-stone-50 border-none rounded-2xl outline-none focus:ring-2 focus:ring-[#b885b2]\" value=\"${d.birthDate}\" onfocus=\"this.type='date'\" oninput=\"window.quizFormData.birthDate=this.value\">\r\n <\/div>\r\n <input type=\"text\" placeholder=\"@instagram\" class=\"w-full p-4 bg-stone-50 border-none rounded-2xl outline-none focus:ring-2 focus:ring-[#b885b2]\" value=\"${d.instagram}\" oninput=\"window.quizFormData.instagram=this.value\">\r\n <textarea placeholder=\"Endere\u00e7o Completo para entrega *\" class=\"w-full p-4 bg-stone-50 border-none rounded-2xl outline-none h-28 focus:ring-2 focus:ring-[#b885b2]\" oninput=\"window.quizFormData.address=this.value\">${d.address}<\/textarea>\r\n <\/div>`;\r\n }\r\n else if (step === 1) {\r\n html = `<div class=\"space-y-6 animate-step\">\r\n <div><label class=\"block text-[10px] font-black uppercase tracking-widest text-stone-400 mb-3\">Sua numera\u00e7\u00e3o:<\/label>\r\n <div class=\"grid grid-cols-4 sm:grid-cols-7 gap-2\">${['34','35','36','37','38','39','40'].map(n => `<button onclick=\"window.updateQuizField('footwearSize','${n}')\" class=\"py-3 border rounded-xl font-bold text-xs ${d.footwearSize===n?'bg-[#b885b2] text-white border-[#b885b2]':'bg-white text-stone-400 border-stone-100'}\">${n}<\/button>`).join('')}<\/div><\/div>\r\n <div><label class=\"block text-[10px] font-black uppercase tracking-widest text-stone-400 mb-3\">Estilos de Sapato:<\/label>\r\n <div class=\"grid grid-cols-2 sm:grid-cols-4 gap-2\">${[{l:'T\u00eanis',v:'tenis',img:'1.png'},{l:'Scarpin',v:'scarpin',img:'2-2.png'},{l:'Sand\u00e1lia',v:'sandalia',img:'3-2.png'},{l:'Bota',v:'bota',img:'4-1.png'}].map(o=>`<button onclick=\"window.toggleQuizArray('footwearStyle','${o.v}')\" class=\"p-2 border-2 rounded-2xl transition-all ${d.footwearStyle.includes(o.v)?'selected-card':'border-stone-50 bg-white'}\"><img decoding=\"async\" src=\"https:\/\/calidan.com.br\/wp-content\/uploads\/2026\/01\/${o.img}\" class=\"w-full h-24 object-cover rounded-xl mb-1\"><span class=\"text-[9px] font-black uppercase\">${o.l}<\/span><\/button>`).join('')}<\/div><\/div>\r\n <div><label class=\"block text-[10px] font-black uppercase tracking-widest text-stone-400 mb-3\">Fragr\u00e2ncias:<\/label>\r\n <div class=\"grid grid-cols-2 sm:grid-cols-4 gap-2\">${[{l:'Doce',v:'doce',img:'5-1.png'},{l:'Fresco',v:'citrico',img:'6.png'},{l:'Floral',v:'floral',img:'7.png'},{l:'Amadeirado',v:'amadeirado',img:'8.png'}].map(o=>`<button onclick=\"window.toggleQuizArray('fragrance','${o.v}')\" class=\"p-2 border-2 rounded-2xl transition-all ${d.fragrance.includes(o.v)?'selected-card':'border-stone-50 bg-white'}\"><img decoding=\"async\" src=\"https:\/\/calidan.com.br\/wp-content\/uploads\/2026\/01\/${o.img}\" class=\"w-full h-24 object-cover rounded-xl mb-1\"><span class=\"text-[9px] font-black uppercase\">${o.l}<\/span><\/button>`).join('')}<\/div><\/div>\r\n <\/div>`;\r\n }\r\n else if (step === 2) {\r\n html = `<div class=\"space-y-6 animate-step\">\r\n <div><label class=\"block text-[10px] font-black uppercase tracking-widest text-stone-400 mb-3\">Tipo de pele:<\/label><div class=\"grid grid-cols-2 gap-2\">${['Seca','Oleosa','Mista','Sens\u00edvel'].map(t=>`<button onclick=\"window.toggleQuizArray('skinType','${t}')\" class=\"py-3 border rounded-xl text-xs font-bold ${d.skinType.includes(t)?'bg-[#b885b2] text-white border-[#b885b2]':'bg-white text-stone-400 border-stone-100'}\">${t}<\/button>`).join('')}<\/div><\/div>\r\n <div><label class=\"block text-[10px] font-black uppercase tracking-widest text-stone-400 mb-3\">Estilo de Make:<\/label><div class=\"grid grid-cols-2 gap-2\">${[{l:'Natural',v:'natural',img:'9.png'},{l:'Glam',v:'glam',img:'10.png'},{l:'Cl\u00e1ssica',v:'classica',img:'11.png'},{l:'Colorida',v:'colorida',img:'12.png'}].map(o=>`<button onclick=\"window.toggleQuizArray('makeupStyle','${o.v}')\" class=\"p-2 border-2 rounded-2xl transition-all ${d.makeupStyle.includes(o.v)?'selected-card':'border-stone-50 bg-white'}\"><img decoding=\"async\" src=\"https:\/\/calidan.com.br\/wp-content\/uploads\/2026\/01\/${o.img}\" class=\"w-full h-24 object-cover rounded-xl mb-1\"><span class=\"text-[9px] font-black uppercase\">${o.l}<\/span><\/button>`).join('')}<\/div><\/div>\r\n <\/div>`;\r\n }\r\n else if (step === 3) {\r\n html = `<div class=\"space-y-6 animate-step\">\r\n <div><label class=\"block text-[10px] font-black uppercase tracking-widest text-stone-400 mb-3\">Tamanho:<\/label><div class=\"grid grid-cols-3 sm:grid-cols-6 gap-2\">${['PP','P','M','G','GG','XG'].map(s=>`<button onclick=\"window.updateQuizField('clothingSize','${s}')\" class=\"py-3 border rounded-xl text-xs font-bold ${d.clothingSize===s?'bg-[#b885b2] text-white border-[#b885b2]':'bg-white text-stone-400 border-stone-100'}\">${s}<\/button>`).join('')}<\/div><\/div>\r\n <textarea placeholder=\"Medidas de Busto, Cintura, Quadril e Altura...\" class=\"w-full p-4 bg-stone-50 border-none rounded-2xl outline-none h-40 focus:ring-2 focus:ring-[#b885b2]\" oninput=\"window.quizFormData.measurements=this.value\">${d.measurements}<\/textarea>\r\n <\/div>`;\r\n }\r\n else if (step === 4) {\r\n html = `<div class=\"space-y-6 animate-step\">\r\n <div class=\"grid grid-cols-3 gap-2\">${[{l:'Saia Curta',v:'curta',img:'13.png'},{l:'Saia Midi',v:'midi',img:'14.png'},{l:'Saia Longa',v:'longa',img:'15.png'}].map(o=>`<button onclick=\"window.toggleQuizArray('skirtLength','${o.v}')\" class=\"p-2 border-2 rounded-2xl transition-all ${d.skirtLength.includes(o.v)?'selected-card':'border-stone-50 bg-white'}\"><img decoding=\"async\" src=\"https:\/\/calidan.com.br\/wp-content\/uploads\/2026\/01\/${o.img}\" class=\"w-full h-24 object-cover rounded-xl mb-1\"><span class=\"text-[8px] font-black uppercase\">${o.l}<\/span><\/button>`).join('')}<\/div>\r\n <div class=\"grid grid-cols-3 gap-2\">${[{l:'Vest. Curto',v:'curto',img:'16.png'},{l:'Vest. Midi',v:'midi',img:'17.png'},{l:'Vest. Longo',v:'longo',img:'18.png'}].map(o=>`<button onclick=\"window.toggleQuizArray('dressLength','${o.v}')\" class=\"p-2 border-2 rounded-2xl transition-all ${d.dressLength.includes(o.v)?'selected-card':'border-stone-50 bg-white'}\"><img decoding=\"async\" src=\"https:\/\/calidan.com.br\/wp-content\/uploads\/2026\/01\/${o.img}\" class=\"w-full h-24 object-cover rounded-xl mb-1\"><span class=\"text-[8px] font-black uppercase\">${o.l}<\/span><\/button>`).join('')}<\/div>\r\n <\/div>`;\r\n }\r\n else if (step === 5) {\r\n html = `<div class=\"space-y-6 animate-step\">\r\n <div class=\"grid grid-cols-3 gap-2\">${[{l:'Skinny',v:'skinny',img:'28.png'},{l:'Wide',v:'wide',img:'29.png'},{l:'Mom',v:'mom',img:'30.png'},{l:'Social',v:'social',img:'31.png'},{l:'Jogger',v:'jogger',img:'32.png'},{l:'Flare',v:'flare',img:'33.png'}].map(o=>`<button onclick=\"window.toggleQuizArray('pantStyle','${o.v}')\" class=\"p-2 border-2 rounded-2xl transition-all ${d.pantStyle.includes(o.v)?'selected-card':'border-stone-50 bg-white'}\"><img decoding=\"async\" src=\"https:\/\/calidan.com.br\/wp-content\/uploads\/2026\/01\/${o.img}\" class=\"w-full h-20 object-cover rounded-lg mb-1\"><span class=\"text-[8px] font-black uppercase\">${o.l}<\/span><\/button>`).join('')}<\/div>\r\n <div class=\"grid grid-cols-3 gap-2\">${[{l:'T-shirt',v:'basic',img:'19.png'},{l:'Baby Look',v:'baby',img:'20.png'},{l:'Over',v:'over',img:'21.png'},{l:'Regata',v:'tank',img:'22.png'},{l:'Camisa',v:'camisa',img:'23.png'},{l:'Cropped',v:'cropped',img:'24.png'}].map(o=>`<button onclick=\"window.toggleQuizArray('shirtType','${o.v}')\" class=\"p-2 border-2 rounded-2xl transition-all ${d.shirtType.includes(o.v)?'selected-card':'border-stone-50 bg-white'}\"><img decoding=\"async\" src=\"https:\/\/calidan.com.br\/wp-content\/uploads\/2026\/01\/${o.img}\" class=\"w-full h-20 object-cover rounded-lg mb-1\"><span class=\"text-[8px] font-black uppercase\">${o.l}<\/span><\/button>`).join('')}<\/div>\r\n <\/div>`;\r\n }\r\n else if (step === 6) {\r\n html = `<div class=\"space-y-6 animate-step\">\r\n <div class=\"grid grid-cols-3 gap-2\">${[{l:'Macaquinho',v:'macaquinho',img:'25.png'},{l:'Pantacourt',v:'pantacourt',img:'26.png'},{l:'Macac\u00e3o',v:'macacao',img:'27.png'}].map(o=>`<button onclick=\"window.toggleQuizArray('jumpsuitStyle','${o.v}')\" class=\"p-2 border-2 rounded-2xl transition-all ${d.jumpsuitStyle.includes(o.v)?'selected-card':'border-stone-50 bg-white'}\"><img decoding=\"async\" src=\"https:\/\/calidan.com.br\/wp-content\/uploads\/2026\/01\/${o.img}\" class=\"w-full h-24 object-cover rounded-xl mb-1\"><span class=\"text-[9px] font-black uppercase\">${o.l}<\/span><\/button>`).join('')}<\/div>\r\n <div class=\"grid grid-cols-2 gap-4\">\r\n <div><label class=\"block text-[10px] font-black uppercase text-stone-400 mb-2\">Acess\u00f3rios:<\/label>\r\n <div class=\"space-y-1\">${['Colar','Pulseira','Anel','Brinco'].map(a=>`<button onclick=\"window.toggleQuizArray('accessories','${a}')\" class=\"w-full py-2 border rounded-xl text-[10px] font-bold ${d.accessories.includes(a)?'bg-[#b885b2] text-white border-[#b885b2]':'bg-white text-stone-300 border-stone-100'}\">${a.toUpperCase()}<\/button>`).join('')}<\/div><\/div>\r\n <div><label class=\"block text-[10px] font-black uppercase text-stone-400 mb-2\">Metal:<\/label>\r\n <div class=\"space-y-1\"><button onclick=\"window.updateQuizField('metalPreference','prata')\" class=\"w-full py-3 border rounded-xl text-[10px] font-bold ${d.metalPreference==='prata'?'bg-[#b885b2] text-white border-[#b885b2]':'bg-white text-stone-300 border-stone-100'}\">PRATA<\/button><button onclick=\"window.updateQuizField('metalPreference','dourado')\" class=\"w-full py-3 border rounded-xl text-[10px] font-bold ${d.metalPreference==='dourado'?'bg-[#b885b2] text-white border-[#b885b2]':'bg-white text-stone-300 border-stone-100'}\">DOURADO<\/button><\/div><\/div>\r\n <\/div>\r\n <\/div>`;\r\n }\r\n else if (step === 7) {\r\n html = `<div class=\"space-y-6 animate-step\">\r\n <div class=\"bg-stone-50 p-6 rounded-[2rem] border border-stone-100\">\r\n <label class=\"block text-sm font-bold text-[#b885b2] mb-3\">Algum Personagem?<\/label>\r\n <input type=\"text\" placeholder=\"Disney, S\u00e9ries, Filmes...\" class=\"w-full p-4 bg-white border-none rounded-2xl outline-none focus:ring-2 focus:ring-[#b885b2]\" value=\"${d.characterPreference}\" oninput=\"window.quizFormData.characterPreference=this.value\">\r\n <\/div>\r\n <div class=\"bg-stone-50 p-6 rounded-[2rem] border border-stone-100\">\r\n <label class=\"block text-sm font-bold text-gray-700 mb-3\">Observa\u00e7\u00f5es Extras:<\/label>\r\n <textarea placeholder=\"Algo que queira destacar?\" class=\"w-full p-4 bg-white border-none rounded-2xl outline-none h-32 focus:ring-2 focus:ring-[#b885b2]\" oninput=\"window.quizFormData.observations=this.value\">${d.observations}<\/textarea>\r\n <\/div>\r\n <\/div>`;\r\n }\r\n else if (step === 8) {\r\n html = `<div class=\"grid grid-cols-1 gap-3 animate-step\">\r\n ${[{v:'mensal',l:'Box Mensal',img:'34.png',p:'R$ 299'},{v:'semestral',l:'Box Semestral',img:'35.png',p:'R$ 269\/m\u00eas'},{v:'anual',l:'Box Anual',img:'36.png',p:'R$ 249\/m\u00eas'}].map(o=>`\r\n <button onclick=\"window.updateQuizField('selectedBox','${o.v}')\" class=\"flex items-center p-4 border-2 rounded-[2rem] transition-all ${d.selectedBox===o.v?'selected-card':'bg-white border-stone-50'}\">\r\n <img decoding=\"async\" src=\"https:\/\/calidan.com.br\/wp-content\/uploads\/2026\/01\/${o.img}\" class=\"w-16 h-16 rounded-2xl object-cover mr-4\">\r\n <div class=\"text-left flex-1\"><h4 class=\"font-black text-sm text-gray-800 uppercase\">${o.l}<\/h4><p class=\"text-[10px] text-stone-400 font-bold tracking-widest\">${o.p}<\/p><\/div>\r\n ${d.selectedBox===o.v ? `<div class=\"w-6 h-6 bg-[#b885b2] rounded-full flex items-center justify-center\"><svg class=\"w-4 h-4 text-white\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"3\" d=\"M5 13l4 4L19 7\"><\/path><\/svg><\/div>` : ''}\r\n <\/button>`).join('')}\r\n <\/div>`;\r\n }\r\n else if (step === 9) {\r\n html = `<div class=\"bg-stone-50 p-8 rounded-[2.5rem] border border-stone-100 text-center animate-step shadow-inner\">\r\n <div class=\"inline-flex items-center gap-2 px-4 py-1 rounded-full bg-white text-[#b885b2] text-[10px] font-black uppercase tracking-widest shadow-sm mb-4\">Perfil Verificado<\/div>\r\n <p class=\"text-lg font-bold text-gray-800\">${d.name}<\/p>\r\n <p class=\"text-xs uppercase tracking-widest text-stone-400 mt-1\">${d.selectedBox || 'Assinatura'} Calidan<\/p>\r\n <div class=\"mt-6 pt-6 border-t border-stone-200 text-[10px] text-stone-400 italic\">Clique em finalizar para ser redirecionada ao checkout seguro.<\/div>\r\n <\/div>`;\r\n }\r\n\r\n container.innerHTML = `\r\n <div class=\"w-full bg-white rounded-[2.5rem] shadow-[0_30px_60px_-12px_rgba(0,0,0,0.12)] overflow-hidden relative border border-stone-50\">\r\n <div class=\"flex justify-center pt-8 pb-4\">\r\n <img decoding=\"async\" \r\n src=\"https:\/\/calidan.com.br\/wp-content\/uploads\/2024\/04\/Calidan-Logo-4.png\" \r\n class=\"logo-calidan-final object-contain opacity-80 w-[150px]\"\r\n>\r\n <\/div>\r\n <div class=\"relative w-full h-1 bg-stone-50\"><div class=\"h-full transition-all duration-700 ease-in-out\" style=\"width: ${progress}%; background-color: #b885b2\"><\/div><\/div>\r\n <div id=\"quiz-error-msg\" class=\"hidden absolute top-24 left-6 right-6 z-50 bg-red-50 text-red-700 text-[10px] font-black uppercase tracking-widest p-4 rounded-2xl shadow-xl border-l-4 border-red-500\"><\/div>\r\n <div class=\"pt-8 px-6 sm:px-12 pb-4 text-center\">\r\n <div class=\"flex items-center justify-center gap-2\">\r\n ${stepsInfo[step].icon || ''}\r\n <h1 class=\"text-xl sm:text-2xl font-black text-gray-800 tracking-tight leading-tight\">${stepsInfo[step].title}<\/h1>\r\n <\/div>\r\n <p class=\"text-stone-400 mt-2 text-[12px] uppercase tracking-widest font-bold\">${stepsInfo[step].subtitle}<\/p>\r\n <\/div>\r\n <div class=\"px-6 sm:px-12 pb-10 max-h-[55vh] overflow-y-auto custom-scrollbar\">${html}<\/div>\r\n <div class=\"px-8 sm:px-12 py-6 bg-stone-50\/50 flex items-center justify-between border-t border-stone-100\">\r\n ${step > 0 ? `<button onclick=\"window.prevQuizStep()\" class=\"text-stone-300 hover:text-stone-800 font-bold text-xs uppercase tracking-widest transition-colors\">Voltar<\/button>` : `<div><\/div>`}\r\n ${step < stepsInfo.length - 1 ? \r\n `<button onclick=\"window.nextQuizStep()\" class=\"text-white px-10 py-4 rounded-2xl font-black text-xs uppercase tracking-[0.2em] shadow-lg active:scale-95 transition-all\" style=\"background-color: #b885b2\">PR\u00d3XIMO<\/button>` : \r\n `<button onclick=\"window.handleFinalizeCalidanQuiz()\" class=\"bg-gray-800 text-white px-10 py-4 rounded-2xl font-black text-xs uppercase tracking-[0.2em] shadow-lg flex items-center gap-2\">\r\n ${window.isQuizSaving ? 'PROCESSANDO...' : 'FINALIZAR PAGAMENTO ' + icons.bag}\r\n <\/button>`\r\n }\r\n <\/div>\r\n <\/div>\r\n `;\r\n };\r\n\r\n window.initCalidanQuiz = function() { window.currentQuizStep = 0; window.renderQuizContent(); };\r\n if (!document.querySelector('[v-cloak]')) { document.addEventListener('DOMContentLoaded', window.renderQuizContent); }\r\n setTimeout(window.renderQuizContent, 500);\r\n })();\r\n <\/script>\r\n \r\n <\/div>\r\n <div class=\"grid grid-cols-1 gap-4 opacity-50 pointer-events-none\">\r\n <div class=\"h-12 bg-white border border-stone-100\"><\/div>\r\n <div class=\"h-12 bg-white border border-stone-100\"><\/div>\r\n <div class=\"h-32 bg-white border border-stone-100\"><\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"mt-8 text-center\">\r\n <p class=\"text-[10px] text-stone-400 uppercase tracking-widest leading-relaxed\">\r\n Seus dados est\u00e3o seguros conosco e ser\u00e3o usados <br class=\"hidden md:block\" \/>\r\n exclusivamente para personalizar sua Box Calidan.\r\n <\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div v-if=\"activeModal === 'faq'\" class=\"font-light\">\r\n <h3 class=\"text-3xl font-serif mb-8 border-b border-stone-100 pb-4 text-stone-900\">Perguntas Frequentes<\/h3>\r\n <div class=\"space-y-8 text-stone-600\">\r\n <div class=\"border-b border-stone-50 pb-6\">\r\n <h4 class=\"font-bold text-stone-900 mb-2 uppercase text-[10px] tracking-widest\">COMO FUNCIONA A ASSINATURA?<\/h4>\r\n <p class=\"text-sm leading-relaxed\">Todo m\u00eas, voc\u00ea receber\u00e1 em casa uma Box com cinco produtos premium, selecionados por nossa curadoria baseados nas suas respostas do question\u00e1rio.<\/p>\r\n <\/div>\r\n <div class=\"border-b border-stone-50 pb-6\">\r\n <h4 class=\"font-bold text-stone-900 mb-2 uppercase text-[10px] tracking-widest\">OS VALORES S\u00c3O FIXOS?<\/h4>\r\n <p class=\"text-sm leading-relaxed\">O valor da assinatura ir\u00e1 variar de acordo com o plano escolhido. Em caso de reajustes, realizaremos um comunicado com 30 dias de anteced\u00eancia.<\/p>\r\n <\/div>\r\n <div>\r\n <h4 class=\"font-bold text-stone-900 mb-2 uppercase text-[10px] tracking-widest\">QUAL \u00c9 O PRAZO DE ENTREGA DA MINHA BOX?<\/h4>\r\n <p class=\"text-sm leading-relaxed\">O prazo de entrega ir\u00e1 variar de acordo com a sua regi\u00e3o. Para o estado de S\u00e3o Paulo e regi\u00e3o Sul, o prazo de entrega \u00e9 de at\u00e9 14 dias.<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <div v-if=\"activeModal === 'terms'\" class=\"font-light text-sm\">\r\n <h3 class=\"text-3xl font-serif mb-8 border-b border-stone-100 pb-4 text-stone-900\">Termos de Uso | Box Calidan<\/h3>\r\n <div class=\"space-y-6 text-stone-600 leading-relaxed\">\r\n <p>Seja bem-vinda \u00e0 Box Calidan! Ao utilizar nosso site e adquirir nossa box, voc\u00ea concorda com os termos abaixo.<\/p>\r\n <p><strong>1. O Servi\u00e7o:<\/strong> A Box Calidan oferece uma experi\u00eancia de curadoria personalizada em moda e beleza. Os itens enviados s\u00e3o selecionados com base nas respostas fornecidas por voc\u00ea em nosso Quiz de Estilo.<\/p>\r\n <p><strong>2. Cadastro e Dados:<\/strong> Para uma experi\u00eancia completa, voc\u00ea se compromete a fornecer informa\u00e7\u00f5es verdadeiras e atualizadas.<\/p>\r\n <p><strong>3. Personaliza\u00e7\u00e3o:<\/strong> A sele\u00e7\u00e3o dos produtos \u00e9 feita por nossa equipe de curadoria seguindo o perfil tra\u00e7ado no seu quiz.<\/p>\r\n <p><strong>4. Pagamento e Entrega:<\/strong> A confirma\u00e7\u00e3o do envio ocorre ap\u00f3s a aprova\u00e7\u00e3o do pagamento.<\/p>\r\n <p><strong>5. Trocas e Devolu\u00e7\u00f5es:<\/strong> Conforme o CDC, voc\u00ea tem at\u00e9 7 dias corridos para desistir da compra. <a href=\"https:\/\/www.calidan.com.br\/reembolso_devolucoes\/\" class=\"underline font-bold text-stone-800\" target=\"_blank\">Acesse a pol\u00edtica completa aqui<\/a>.<\/p>\r\n <p><strong>6. Propriedade Intelectual:<\/strong> Todo o conte\u00fado deste site \u00e9 de propriedade da Box Calidan.<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div v-if=\"activeModal === 'about'\" class=\"font-light\">\r\n <h3 class=\"text-3xl font-serif mb-8 border-b border-stone-100 pb-4 text-stone-900\">Sobre a Calidan<\/h3>\r\n <div class=\"space-y-6 text-stone-600 leading-relaxed\">\r\n <h4 class=\"font-medium text-stone-900 text-lg italic\">Onde Sua Beleza Encontra a Personaliza\u00e7\u00e3o<\/h4>\r\n <p>Na Calidan, acreditamos que a beleza \u00e9 \u00fanica, assim como voc\u00ea. Nossa jornada come\u00e7ou em 2020, impulsionada pela paix\u00e3o por personaliza\u00e7\u00e3o e pelo desejo de criar algo verdadeiramente especial.<\/p>\r\n <p>O nome Calidan, uma fus\u00e3o carinhosa dos sobrenomes da nossa fundadora (Dantas) e de seu esposo (Calixto), simboliza a uni\u00e3o e o cuidado que dedicamos a cada detalhe.<\/p>\r\n <p>Com o lan\u00e7amento do nosso site em 2025, expandimos a miss\u00e3o de levar a voc\u00ea uma experi\u00eancia de compra sem igual.<\/p>\r\n <p>Na Calidan, sua satisfa\u00e7\u00e3o e felicidade s\u00e3o a nossa infra\u00e7\u00e3o. Venha descobrir o prazer de ter produtos que refletem quem voc\u00ea \u00e9.<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div v-if=\"activeModal === 'contact'\" class=\"font-light text-center\">\r\n <h3 class=\"text-3xl font-serif mb-8 border-b border-stone-100 pb-4 text-stone-900\">Fale Conosco<\/h3>\r\n <div class=\"space-y-12 py-8\">\r\n <div class=\"flex flex-col items-center group\">\r\n <div class=\"w-16 h-16 bg-green-50 rounded-full flex items-center justify-center mb-4 transition-transform group-hover:scale-110\">\r\n <i data-lucide=\"message-circle\" class=\"text-green-600\" size=\"32\"><\/i>\r\n <\/div>\r\n <span class=\"text-[10px] uppercase tracking-[0.2em] text-stone-400 mb-1 font-bold\">WhatsApp<\/span>\r\n <a href=\"https:\/\/wa.me\/551198682286\" target=\"_blank\" class=\"text-2xl font-serif text-stone-800 hover:text-green-600 transition-colors\">(11) 98682-286<\/a>\r\n <\/div>\r\n <div class=\"flex flex-col items-center group\">\r\n <div class=\"w-16 h-16 bg-stone-50 rounded-full flex items-center justify-center mb-4 transition-transform group-hover:scale-110\">\r\n <i data-lucide=\"mail\" class=\"text-stone-800\" size=\"32\"><\/i>\r\n <\/div>\r\n <span class=\"text-[10px] uppercase tracking-[0.2em] text-stone-400 mb-1 font-bold\">E-mail<\/span>\r\n <a href=\"mailto:contato@calidan.com.br\" class=\"text-2xl font-serif text-stone-800 hover:text-stone-500 transition-colors\">contato@calidan.com.br<\/a>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <\/div>\r\n <\/div>\r\n <\/transition>\r\n \r\n <\/div>\r\n <\/div>\r\n\r\n <script>\r\n const { createApp, ref, onMounted, onUnmounted, nextTick, watch } = Vue;\r\n\r\n createApp({\r\n setup() {\r\n const isMenuOpen = ref(false);\r\n const scrolled = ref(false);\r\n const activeModal = ref(null);\r\n const imageLoaded = ref(false);\r\n\r\n const plans = [\r\n {\r\n name: 'Plano Mensal',\r\n price: '299,90',\r\n period: 'm\u00eas',\r\n description: 'Sem fidelidade. Flexibilidade total para voc\u00ea renovar seu estilo.',\r\n features: ['Curadoria personalizada', 'Roupas, maquiagem e acess\u00f3rios', 'Valor em produtos: at\u00e9 R$ 499,90', 'Cancele quando quiser'],\r\n highlight: false,\r\n cta: 'Assinar Mensal',\r\n link: 'https:\/\/www.calidan.com.br\/produto\/box-calidan-plano-mensal\/'\r\n },\r\n {\r\n name: 'Plano Semestral',\r\n oldPrice: '299,90',\r\n price: '269,90',\r\n period: 'm\u00eas',\r\n description: 'Cobran\u00e7a semestral parcelada. O equil\u00edbrio perfeito.',\r\n features: ['Curadoria personalizada', 'Roupas, maquiagem e acess\u00f3rios', 'Valor em produtos: at\u00e9 R$ 499,90', 'Prioridade no envio', 'Mimo surpresa na 3\u00aa box'],\r\n highlight: true,\r\n cta: 'Assinar Semestral',\r\n link: 'https:\/\/www.calidan.com.br\/produto\/box-calidan-plano-semestral\/'\r\n },\r\n {\r\n name: 'Plano Anual',\r\n oldPrice: '299,90',\r\n price: '249,90',\r\n period: 'm\u00eas',\r\n description: 'Cobran\u00e7a anual parcelada. A experi\u00eancia completa.',\r\n features: ['Curadoria personalizada', 'Roupas, maquiagem e acess\u00f3rios', 'Valor em produtos: at\u00e9 R$ 499,90', 'Frete Gr\u00e1tis em todas as boxes', '13\u00aa Box de presente'],\r\n highlight: false,\r\n cta: 'Assinar Anual',\r\n link: 'https:\/\/www.calidan.com.br\/produto\/box-calidan-plano-anual\/'\r\n }\r\n ];\r\n\r\n const handleScroll = () => {\r\n scrolled.value = window.scrollY > 50;\r\n };\r\n\r\n const refreshIcons = () => {\r\n nextTick(() => {\r\n if (window.lucide) {\r\n lucide.createIcons();\r\n }\r\n });\r\n };\r\n\r\n \/\/ --- AJUSTE PRINCIPAL AQUI ---\r\n \/\/ Monitora a abertura do modal para carregar o Quiz\r\n watch(activeModal, (newVal) => {\r\n if (newVal === 'form') {\r\n nextTick(() => {\r\n \/\/ Tenta iniciar o Quiz React se a fun\u00e7\u00e3o existir\r\n if (window.initCalidanQuiz) {\r\n window.initCalidanQuiz();\r\n }else {\r\n console.error('Calidan Quiz not found');\r\n }\r\n });\r\n }\r\n refreshIcons();\r\n });\r\n\r\n watch(isMenuOpen, () => refreshIcons());\r\n\r\n onMounted(() => {\r\n window.addEventListener('scroll', handleScroll);\r\n refreshIcons();\r\n\r\n setTimeout(() => {\r\n imageLoaded.value = true;\r\n }, 1000);\r\n });\r\n\r\n onUnmounted(() => {\r\n window.removeEventListener('scroll', handleScroll);\r\n });\r\n\r\n return {\r\n isMenuOpen,\r\n scrolled,\r\n activeModal,\r\n plans,\r\n imageLoaded\r\n };\r\n }\r\n }).mount('#app');\r\n <\/script>\r\n<\/body>\r\n\r\n<\/html>\r\n\r\n \r\n \r\n \r\n <\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-bf5ec08 e-flex e-con-boxed e-con e-parent\" data-id=\"bf5ec08\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-6d78c8a elementor-widget elementor-widget-html\" data-id=\"6d78c8a\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- WhatsApp Button Styles -->\r\n<style>\r\n .lg-whatsapp-btn {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n position: fixed;\r\n bottom: 20px;\r\n right: 20px;\r\n background-color: #25D366;\r\n color: #fff !important;\r\n padding: 12px 20px;\r\n border-radius: 50px;\r\n font-weight: bold;\r\n text-decoration: none;\r\n box-shadow: 0 4px 6px rgba(0,0,0,0.1);\r\n transition: transform .1s ease-in-out, width .2s ease, height .2s ease, padding .2s ease;\r\n z-index: 9999;\r\n white-space: nowrap;\r\n }\r\n .lg-whatsapp-btn .lg-whatsapp-icon {\r\n font-size: 1.4em;\r\n margin-right: 8px;\r\n }\r\n .lg-whatsapp-btn .lg-whatsapp-text {\r\n display: inline;\r\n }\r\n .lg-whatsapp-btn:hover {\r\n transform: scale(1.05);\r\n }\r\n\r\n \/* Mobile: s\u00f3 mostra \u00edcone, circula e reduz tamanho *\/\r\n @media (max-width: 600px) {\r\n .lg-whatsapp-btn {\r\n width: 50px;\r\n height: 50px;\r\n padding: 0;\r\n border-radius: 50%;\r\n }\r\n .lg-whatsapp-btn .lg-whatsapp-icon {\r\n margin: 0;\r\n }\r\n .lg-whatsapp-btn .lg-whatsapp-text {\r\n display: none;\r\n }\r\n }\r\n \r\n \r\n \/* Substitua todo o bloco .lg-whatsapp-icon por este *\/\r\n.lg-whatsapp-icon {\r\n display: inline-block; \/* permite width\/height *\/\r\n width: 24px; \/* tamanho fixo do \u00edcone *\/\r\n height: 24px;\r\n background-image: url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' viewBox='0 0 39 39'%3E%3Cpath d='M10.7 32.8l.6.3c2.5 1.5 5.3 2.2 8.1 2.2 8.8 0 16-7.2 16-16 0-4.2-1.7-8.3-4.7-11.3s-7-4.7-11.3-4.7c-8.8 0-16 7.2-15.9 16.1 0 3 .9 5.9 2.4 8.4l.4.6-1.6 5.9 6-1.5z' fill='%2325d366'\/%3E%3Cpath d='M32.4 6.4C29 2.9 24.3 1 19.5 1 9.3 1 1.1 9.3 1.2 19.4c0 3.2.9 6.3 2.4 9.1L1 38l9.7-2.5c2.7 1.5 5.7 2.2 8.7 2.2 10.1 0 18.3-8.3 18.3-18.4 0-4.9-1.9-9.5-5.3-12.9zM19.5 34.6c-2.7 0-5.4-.7-7.7-2.1l-.6-.3-5.8 1.5L6.9 28l-.4-.6c-4.4-7.1-2.3-16.5 4.9-20.9s16.5-2.3 20.9 4.9 2.3 16.5-4.9 20.9c-2.3 1.5-5.1 2.3-7.9 2.3zm8.8-11.1l-1.1-.5s-1.6-.7-2.6-1.2c-.1 0-.2-.1-.3-.1-.3 0-.5.1-.7.2 0 0-.1.1-1.5 1.7-.1.2-.3.3-.5.3h-.1c-.1 0-.3-.1-.4-.2l-.5-.2c-1.1-.5-2.1-1.1-2.9-1.9-.2-.2-.5-.4-.7-.6-.7-.7-1.4-1.5-1.9-2.4l-.1-.2c-.1-.1-.1-.2-.2-.4 0-.2 0-.4.1-.5 0 0 .4-.5.7-.8.2-.2.3-.5.5-.7.2-.3.3-.7.2-1-.1-.5-1.3-3.2-1.6-3.8-.2-.3-.4-.4-.7-.5h-1.1c-.2 0-.4.1-.6.1l-.1.1c-.2.1-.4.3-.6.4-.2.2-.3.4-.5.6-.7.9-1.1 2-1.1 3.1 0 .8.2 1.6.5 2.3l.1.3c.9 1.9 2.1 3.6 3.7 5.1l.4.4c.3.3.6.5.8.8 2.1 1.8 4.5 3.1 7.2 3.8.3.1.7.1 1 .2h1c.5 0 1.1-.2 1.5-.4.3-.2.5-.2.7-.4l.2-.2c.2-.2.4-.3.6-.5s.4-.4.5-.6c.2-.4.3-.9.4-1.4v-.7s-.1-.1-.3-.2z' fill='%23fff'\/%3E%3C\/svg%3E\");\r\n background-repeat: no-repeat;\r\n background-position: center;\r\n background-size: contain;\r\n}\r\n\r\n<\/style>\r\n\r\n<!-- WhatsApp Button Container -->\r\n<a id=\"lg-whatsapp-link\" class=\"lg-whatsapp-btn\" href=\"#\" target=\"_blank\" rel=\"noopener\">\r\n <span class=\"lg-whatsapp-icon\"><\/span>\r\n <span class=\"lg-whatsapp-text\">Falar no WhatsApp<\/span>\r\n<\/a>\r\n\r\n<!-- WhatsApp Button Script -->\r\n<script>\r\n document.addEventListener('DOMContentLoaded', function(){\r\n \/\/ 1) Tenta capturar t\u00edtulo de produto WooCommerce\r\n var prodEl = document.querySelector('.product_title');\r\n var label = prodEl ? prodEl.textContent.trim() : document.title.trim();\r\n\r\n \/\/ 2) N\u00famero de WhatsApp (DDD + n\u00famero, sem \"+\")\r\n var phone = '5511977527926';\r\n\r\n \/\/ 3) Mensagem pr\u00e9-preenchida\r\n var msg = 'Ol\u00e1! Estou na p\u00e1gina \"' + label + '\" e estou com d\u00favidas sobre este produto. Voc\u00ea pode me ajudar?';\r\n\r\n \/\/ 4) URL do WhatsApp\r\n var url = 'https:\/\/wa.me\/' + phone + '?text=' + encodeURIComponent(msg);\r\n\r\n \/\/ 5) Define o href do bot\u00e3o\r\n var link = document.getElementById('lg-whatsapp-link');\r\n if (link) link.href = url;\r\n });\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\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>Falar no WhatsApp<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-10","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/assinatura.calidan.com.br\/index.php?rest_route=\/wp\/v2\/pages\/10","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/assinatura.calidan.com.br\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/assinatura.calidan.com.br\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/assinatura.calidan.com.br\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/assinatura.calidan.com.br\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=10"}],"version-history":[{"count":44,"href":"https:\/\/assinatura.calidan.com.br\/index.php?rest_route=\/wp\/v2\/pages\/10\/revisions"}],"predecessor-version":[{"id":66,"href":"https:\/\/assinatura.calidan.com.br\/index.php?rest_route=\/wp\/v2\/pages\/10\/revisions\/66"}],"wp:attachment":[{"href":"https:\/\/assinatura.calidan.com.br\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=10"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}