@brunoalz/smartgesti-site-editor 1.0.0 → 1.2.0

package/dist/engine/export/exporters/sections/HeroExporter.js.map

@@ -1 +1 @@
-{"version":3,"file":"HeroExporter.js","sources":["../../../../../src/engine/export/exporters/sections/HeroExporter.ts"],"sourcesContent":["/**\n * Hero Section Exporter\n * Exporta Hero com múltiplas variações e customizações avançadas\n * Mobile-first responsive: split layout collapses to stack in mobile\n */\n\nimport { Block } from \"../../../schema/siteDocument\";\nimport { ThemeTokens } from \"../../../schema/themeTokens\";\nimport { PLACEHOLDER_IMAGE_URL } from \"../../../presets/heroVariations\";\nimport { dataBlockIdAttr, blockIdAttr, escapeHtml, resolveHref, linkTargetAttr } from \"../../shared/htmlHelpers\";\nimport { generateScopedId } from \"../../shared/idGenerator\";\nimport {\n  generateButtonHoverStyles,\n  generateButtonOverlayCSS,\n  getButtonHoverKeyframes,\n  type ButtonHoverEffect,\n  type ButtonHoverOverlay,\n} from \"../../../shared/hoverEffects\";\nimport { gridPresetMap, type ImageGridItem, type ImageGridPreset } from \"../../../shared/imageGrid\";\nimport {\n  generateTypographyStyles,\n  mergeTypographyWithDefaults,\n  heroTitleDefaults,\n  heroSubtitleDefaults,\n  heroDescriptionDefaults,\n  type TypographyConfig,\n} from \"../../../shared/typography\";\nimport { imageShadowMap } from \"../../../shared/shadowConstants\";\nimport { contentPositionMap, blockGapConfig } from \"../../../shared/layoutConstants\";\n\nexport function exportHero(\n  block: Block,\n  depth: number,\n  basePath?: string,\n  theme?: ThemeTokens,\n): string {\n  const {\n    variation,\n    variant = \"centered\",\n    title,\n    subtitle,\n    description,\n    primaryButton,\n    secondaryButton,\n    badge,\n    align = \"center\",\n    contentPosition = \"center\",\n    contentSpacing = \"default\",\n    blockGap = \"default\",\n    minHeight = \"80vh\",\n    image,\n    overlay,\n    overlayColor,\n    background,\n    // Typography colors (legacy)\n    titleColor,\n    subtitleColor,\n    descriptionColor,\n    // Typography config (novo sistema)\n    titleTypography,\n    subtitleTypography,\n    descriptionTypography,\n    // Badge styling\n    badgeColor,\n    badgeTextColor,\n    // Layout\n    contentMaxWidth = \"800px\",\n    paddingY,\n    // Image styling\n    imageRadius = 16,\n    imageShadow = \"lg\",\n    imagePosition = \"right\",\n    // Button size\n    buttonSize = \"md\",\n    // Primary button styling\n    primaryButtonVariant = \"solid\",\n    primaryButtonColor,\n    primaryButtonTextColor,\n    primaryButtonRadius = 8,\n    // Secondary button styling\n    secondaryButtonVariant = \"outline\",\n    secondaryButtonColor,\n    secondaryButtonTextColor,\n    secondaryButtonRadius = 8,\n    // Button hover effects\n    buttonHoverEffect = \"scale\",\n    buttonHoverIntensity = 50,\n    buttonHoverOverlay = \"none\",\n    buttonHoverIconName = \"arrow-right\",\n    // Decorative\n    showWave,\n    waveColor = \"rgba(255,255,255,0.1)\",\n    // Image Grid\n    imageGridEnabled,\n    imageGridPreset = \"four-equal\",\n    imageGridImages = [],\n    imageGridGap = 8,\n  } = (block as any).props;\n\n  // Determine variation types\n  const heroImage = image || PLACEHOLDER_IMAGE_URL;\n  const isSplit = variation === \"hero-split\" || variant === \"split\";\n  const isParallax = variation === \"hero-parallax\";\n  const isOverlayVariant = variation === \"hero-overlay\";\n  const isGradient = variation === \"hero-gradient\";\n  const isMinimal = variation === \"hero-minimal\";\n  const isCard = variation === \"hero-card\";\n  const isImageBg = (variant === \"image-bg\" || isOverlayVariant || isParallax || isCard) && heroImage;\n  const isOverlay = isImageBg && overlay;\n\n  // Determine if dark background context\n  const hasDarkBg = isOverlay || isGradient || isOverlayVariant;\n\n  // Theme colors\n  const themePrimaryColor = theme?.colors?.primary || \"#3b82f6\";\n  const themePrimaryText = theme?.colors?.primaryText || \"#ffffff\";\n\n  // Text colors (fallback)\n  const defaultTextColor = hasDarkBg ? \"#ffffff\" : \"var(--sg-text, #1f2937)\";\n  const defaultMutedColor = hasDarkBg ? \"rgba(255,255,255,0.85)\" : \"var(--sg-muted-text, #6b7280)\";\n\n  // Merge typography configs with defaults (retrocompatível com titleColor, etc.)\n  const mergedTitleTypo = mergeTypographyWithDefaults(\n    titleTypography as TypographyConfig | undefined,\n    { ...heroTitleDefaults, color: titleColor as string | undefined }\n  );\n  const mergedSubtitleTypo = mergeTypographyWithDefaults(\n    subtitleTypography as TypographyConfig | undefined,\n    { ...heroSubtitleDefaults, color: subtitleColor as string | undefined }\n  );\n  const mergedDescriptionTypo = mergeTypographyWithDefaults(\n    descriptionTypography as TypographyConfig | undefined,\n    { ...heroDescriptionDefaults, color: descriptionColor as string | undefined }\n  );\n\n  // Generate typography CSS strings\n  const titleTypoStyles = generateTypographyStyles(mergedTitleTypo, defaultTextColor);\n  const subtitleTypoStyles = generateTypographyStyles(mergedSubtitleTypo, defaultMutedColor);\n  const descriptionTypoStyles = generateTypographyStyles(mergedDescriptionTypo, defaultMutedColor);\n\n  // Badge colors\n  const finalBadgeColor = badgeColor || themePrimaryColor;\n  const finalBadgeTextColor = badgeTextColor || \"#ffffff\";\n\n  // Button colors\n  const finalPrimaryBtnColor = primaryButtonColor || themePrimaryColor;\n  const finalPrimaryBtnTextColor = primaryButtonTextColor || themePrimaryText;\n  const finalSecondaryBtnColor = secondaryButtonColor || (hasDarkBg ? \"#ffffff\" : themePrimaryColor);\n  const finalSecondaryBtnTextColor = secondaryButtonTextColor || finalSecondaryBtnColor;\n\n  // Section classes\n  const sectionClasses = [\n    \"sg-hero\",\n    variation ? `sg-hero--${String(variation).replace(\"hero-\", \"\")}` : \"\",\n    isSplit ? \"sg-hero--split\" : \"\",\n    isParallax ? \"sg-hero--parallax\" : \"\",\n    isOverlayVariant ? \"sg-hero--overlay\" : \"\",\n    isGradient ? \"sg-hero--gradient\" : \"\",\n    isMinimal ? \"sg-hero--minimal\" : \"\",\n    isCard ? \"sg-hero--card\" : \"\",\n  ]\n    .filter(Boolean)\n    .join(\" \");\n\n  // Build background style\n  let bgStyle = \"\";\n  if (background) {\n    bgStyle = `background: ${background};`;\n  } else if (isImageBg && !isSplit) {\n    bgStyle = `background-image: url(${escapeHtml(heroImage)}); background-size: cover; background-position: center;`;\n    if (isParallax) bgStyle += \" background-attachment: fixed;\";\n  } else {\n    bgStyle = \"background-color: var(--sg-bg, #fff);\";\n  }\n\n  // Padding\n  const paddingStyle = paddingY ? `padding: ${paddingY} 2rem;` : \"padding: 6rem 2rem;\";\n\n  // Content position mapping for flexbox justify-content\n  const justifyContent = contentPositionMap[contentPosition] || \"center\";\n\n  // Determine if layout has two blocks (content + image) - these should always be centered\n  const hasTwoBlocks = isSplit || isCard;\n  // Note: shouldShowImageGrid is checked later, so we'll handle it in each section\n\n  // Content spacing map - controls margin between elements\n  const spacingMap: Record<string, { title: string; subtitle: string; description: string; badge: string; actions: string }> = {\n    compact: { title: \"0.75rem\", subtitle: \"0.5rem\", description: \"1.25rem\", badge: \"1rem\", actions: \"0.25rem\" },\n    default: { title: \"1.25rem\", subtitle: \"1rem\", description: \"2.5rem\", badge: \"1.5rem\", actions: \"0.5rem\" },\n    spacious: { title: \"2.25rem\", subtitle: \"2rem\", description: \"3.5rem\", badge: \"2.5rem\", actions: \"1.5rem\" },\n  };\n  const spacing = spacingMap[contentSpacing] || spacingMap.default;\n\n  // Block gap configuration\n  const blocksConfig = blockGapConfig[blockGap] || blockGapConfig.default;\n  const blocksJustify = blocksConfig.justify;\n  const blocksMaxWidth = blocksConfig.blockMaxWidth;\n  const containerMaxWidth = blocksConfig.containerMaxWidth;\n  const blocksGap = blocksConfig.gap;\n\n  // Overlay HTML\n  const overlayStyle = overlayColor\n    ? `position: absolute; inset: 0; background: ${overlayColor}; z-index: 0;`\n    : \"position: absolute; inset: 0; background: linear-gradient(135deg, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0.3) 100%); z-index: 0;\";\n  const overlayHtml = isOverlay\n    ? `<div class=\"sg-hero__overlay\" style=\"${overlayStyle}\"></div>`\n    : \"\";\n\n  // Wave SVG\n  const waveHtml = showWave\n    ? `<div style=\"position: absolute; bottom: 0; left: 0; right: 0; height: 150px; overflow: hidden; z-index: 1;\">\n        <svg viewBox=\"0 0 1200 120\" preserveAspectRatio=\"none\" style=\"position: absolute; bottom: 0; width: 100%; height: 100%;\">\n          <path d=\"M0,0V46.29c47.79,22.2,103.59,32.17,158,28,70.36-5.37,136.33-33.31,206.8-37.5C438.64,32.43,512.34,53.67,583,72.05c69.27,18,138.3,24.88,209.4,13.08,36.15-6,69.85-17.84,104.45-29.34C989.49,25,1113-14.29,1200,52.47V0Z\" fill=\"${waveColor}\" opacity=\"0.5\"/>\n          <path d=\"M0,0V15.81C13,36.92,27.64,56.86,47.69,72.05,99.41,111.27,165,111,224.58,91.58c31.15-10.15,60.09-26.07,89.67-39.8,40.92-19,84.73-46,130.83-49.67,36.26-2.85,70.9,9.42,98.6,31.56,31.77,25.39,62.32,62,103.63,73,40.44,10.79,81.35-6.69,119.13-24.28s75.16-39,116.92-43.05c59.73-5.85,113.28,22.88,168.9,38.84,30.2,8.66,59,6.17,87.09-7.5,22.43-10.89,48-26.93,60.65-49.24V0Z\" fill=\"${waveColor}\" opacity=\"0.3\"/>\n        </svg>\n      </div>`\n    : \"\";\n\n  // Badge HTML\n  const badgeHtml = badge\n    ? `<span class=\"sg-hero__badge\" style=\"display: inline-block; padding: 0.5rem 1.25rem; background: ${finalBadgeColor}; color: ${finalBadgeTextColor}; border-radius: 999px; font-size: 0.875rem; font-weight: 600; margin-bottom: ${spacing.badge};\">${escapeHtml(badge)}</span>`\n    : \"\";\n\n  // Title HTML - usa tipografia customizada com clamp para responsividade\n  const titleFontSize = mergedTitleTypo.fontSize || 48;\n  const titleHtml = title\n    ? `<h1 class=\"sg-hero__title\" style=\"${titleTypoStyles.cssString} font-size: clamp(2rem, 5vw, ${titleFontSize}px); line-height: 1.1; margin-bottom: ${spacing.title}; letter-spacing: -0.02em;\">${escapeHtml(title)}</h1>`\n    : \"\";\n\n  // Subtitle HTML - usa tipografia customizada com clamp para responsividade\n  const subtitleFontSize = mergedSubtitleTypo.fontSize || 24;\n  const subtitleHtml = subtitle\n    ? `<h2 class=\"sg-hero__subtitle\" style=\"${subtitleTypoStyles.cssString} font-size: clamp(1.125rem, 2.5vw, ${subtitleFontSize}px); line-height: 1.3; margin-bottom: ${spacing.subtitle};\">${escapeHtml(subtitle)}</h2>`\n    : \"\";\n\n  // Description HTML - usa tipografia customizada\n  const descHtml = description\n    ? `<p class=\"sg-hero__description\" style=\"max-width: 650px; margin: ${align === \"center\" ? `0 auto ${spacing.description}` : `0 0 ${spacing.description}`}; ${descriptionTypoStyles.cssString} line-height: 1.7;\">${escapeHtml(description)}</p>`\n    : \"\";\n\n  // Button styles\n  const buttonStyles = resolveHeroButtonStyles({\n    theme,\n    blockId: block.id,\n    buttonSize,\n    primaryButtonVariant,\n    primaryButtonColor: finalPrimaryBtnColor,\n    primaryButtonTextColor: finalPrimaryBtnTextColor,\n    primaryButtonRadius,\n    secondaryButtonVariant,\n    secondaryButtonColor: finalSecondaryBtnColor,\n    secondaryButtonTextColor: finalSecondaryBtnTextColor,\n    secondaryButtonRadius,\n    hoverEffect: buttonHoverEffect,\n    hoverIntensity: buttonHoverIntensity,\n    hoverOverlay: buttonHoverOverlay,\n    hoverIconName: buttonHoverIconName,\n  });\n\n  // Buttons HTML\n  const primaryHref = primaryButton ? resolveHref(primaryButton.href || \"#\", basePath) : \"#\";\n  const secondaryHref = secondaryButton ? resolveHref(secondaryButton.href || \"#\", basePath) : \"#\";\n  const primaryBtnHtml = primaryButton\n    ? `<a href=\"${escapeHtml(primaryHref)}\"${linkTargetAttr(primaryHref, basePath)} class=\"sg-hero__btn sg-hero__btn--primary\" style=\"${buttonStyles.primary}\">${escapeHtml(primaryButton.text)}</a>`\n    : \"\";\n  const secondaryBtnHtml = secondaryButton\n    ? `<a href=\"${escapeHtml(secondaryHref)}\"${linkTargetAttr(secondaryHref, basePath)} class=\"sg-hero__btn sg-hero__btn--secondary\" style=\"${buttonStyles.secondary}\">${escapeHtml(secondaryButton.text)}</a>`\n    : \"\";\n  const buttonsHtml =\n    primaryButton || secondaryButton\n      ? `<div class=\"sg-hero__actions\" style=\"display: flex; gap: 1rem; flex-wrap: wrap; justify-content: ${align === \"center\" ? \"center\" : \"flex-start\"}; margin-top: ${spacing.actions};\">${primaryBtnHtml}${secondaryBtnHtml}</div>`\n      : \"\";\n\n  // Content block\n  const contentBlock = `${badgeHtml}${titleHtml}${subtitleHtml}${descHtml}${buttonsHtml}`;\n\n  // Style block (hover effects)\n  const styleBlock = buttonStyles.css ? `<style>${buttonStyles.css}</style>` : \"\";\n\n  // Image fallback\n  const imgFallback = `this.onerror=null;this.src='${escapeHtml(PLACEHOLDER_IMAGE_URL)}';`;\n\n  // =========================================================================\n  // IMAGE GRID EXPORT HELPER\n  // =========================================================================\n  const exportImageGrid = (\n    images: ImageGridItem[],\n    preset: ImageGridPreset,\n    gap: number,\n    radius: number,\n    shadow: string,\n    gridId: string\n  ): { html: string; css: string } => {\n    const config = gridPresetMap[preset];\n    const shadowValue = imageShadowMap[shadow] || imageShadowMap.lg;\n\n    // Generate grid items HTML\n    const itemsHtml = config.positions\n      .map((pos, idx) => {\n        const img = images[idx];\n        const imgSrc = img?.src || PLACEHOLDER_IMAGE_URL;\n        const imgAlt = img?.alt || `Imagem ${idx + 1}`;\n\n        return `<div class=\"sg-hero__grid-item\" style=\"grid-column: ${pos.col}; grid-row: ${pos.row}; overflow: hidden; border-radius: ${radius}px;\">\n          <img src=\"${escapeHtml(imgSrc)}\" alt=\"${escapeHtml(imgAlt)}\" style=\"width: 100%; height: 100%; object-fit: cover; box-shadow: ${shadowValue};\" onerror=\"${imgFallback}\" />\n        </div>`;\n      })\n      .join(\"\");\n\n    const gridHtml = `<div id=\"${gridId}\" class=\"sg-hero__image-grid\" style=\"display: grid; grid-template: ${config.gridTemplate}; gap: ${gap}px; width: 100%; max-width: 500px; aspect-ratio: 1 / 1;\">\n      ${itemsHtml}\n    </div>`;\n\n    // Responsive CSS: collapse to single column on mobile\n    const gridCss = `\n      @media (max-width: 767px) {\n        #${gridId} {\n          grid-template: auto / 1fr !important;\n          aspect-ratio: auto !important;\n        }\n        #${gridId} .sg-hero__grid-item {\n          grid-column: 1 / -1 !important;\n          grid-row: auto !important;\n          aspect-ratio: 16 / 9;\n        }\n      }\n    `;\n\n    return { html: gridHtml, css: gridCss };\n  };\n\n  // Determine if we should use image grid (works in ANY variation now)\n  const hasValidGridImages = imageGridImages && imageGridImages.length > 0 && (imageGridImages as ImageGridItem[]).some((img: ImageGridItem) => img?.src);\n  const shouldShowImageGrid = imageGridEnabled && hasValidGridImages;\n\n  // =========================================================================\n  // RENDER: Split Layout (without image grid)\n  // =========================================================================\n  if (isSplit && heroImage && !shouldShowImageGrid) {\n    const splitId = generateScopedId(block.id || \"\", \"hero-split\");\n    const isImageLeft = imagePosition === \"left\";\n    const imgShadow = imageShadowMap[imageShadow] || imageShadowMap.lg;\n\n    const splitCss = `\n      @media (max-width: 1023px) {\n        #${splitId} {\n          grid-template-columns: 1fr !important;\n          gap: 2rem !important;\n          padding: 0 1rem !important;\n        }\n        #${splitId} .sg-hero__split-image {\n          order: -1;\n        }\n      }\n    `;\n\n    const splitBgStyle = background ? `background: ${background};` : \"background-color: var(--sg-bg, #fff);\";\n    const imgStyle = `width: 100%; max-width: 500px; height: auto; border-radius: ${imageRadius}px; box-shadow: ${imgShadow}; object-fit: cover;`;\n    const imageDiv = `<div class=\"sg-hero__split-image\" style=\"display: flex; justify-content: center; flex: 0 1 auto; max-width: ${blocksMaxWidth};\"><img src=\"${escapeHtml(heroImage)}\" alt=\"${escapeHtml(title || \"\")}\" class=\"sg-hero__img\" style=\"${imgStyle}\" onerror=\"${imgFallback}\" /></div>`;\n    const contentDiv = `<div class=\"sg-hero__split-content\" style=\"text-align: ${align}; position: relative; z-index: 1; max-width: ${blocksMaxWidth}; flex: 0 1 auto;\">${contentBlock}</div>`;\n\n    const innerHtml = isImageLeft\n      ? `<style>${splitCss}</style><div id=\"${splitId}\" class=\"sg-hero__split-inner\" style=\"display: flex; justify-content: ${blocksJustify}; gap: ${blocksGap}; align-items: center; max-width: ${containerMaxWidth}; width: 100%; padding: 0 2rem;\">${imageDiv}${contentDiv}</div>`\n      : `<style>${splitCss}</style><div id=\"${splitId}\" class=\"sg-hero__split-inner\" style=\"display: flex; justify-content: ${blocksJustify}; gap: ${blocksGap}; align-items: center; max-width: ${containerMaxWidth}; width: 100%; padding: 0 2rem;\">${contentDiv}${imageDiv}</div>`;\n\n    return `<section ${blockIdAttr(block.id)} ${dataBlockIdAttr(block.id)} class=\"${sectionClasses}\" style=\"min-height: ${minHeight}; ${paddingStyle} display: flex; align-items: center; justify-content: ${justifyContent}; position: relative; overflow: hidden; ${splitBgStyle}\" data-variation=\"${escapeHtml(variation || variant || \"\")}\">${styleBlock}${innerHtml}</section>`;\n  }\n\n  // =========================================================================\n  // RENDER: Card Layout (supports both with and without Image Grid)\n  // Card always stays on the left (original position), Grid on the right\n  // =========================================================================\n  if (isCard && heroImage) {\n    const cardBg = background || \"#ffffff\";\n    const cardPadding = paddingY ? `${paddingY} 3rem` : \"6rem 3rem\";\n\n    // With Image Grid: Card on left + Grid on right (preserves original card position)\n    if (shouldShowImageGrid) {\n      const cardGridLayoutId = generateScopedId(block.id || \"\", \"hero-card-grid\");\n      const gridId = generateScopedId(block.id || \"\", \"hero-grid\");\n\n      const gridResult = exportImageGrid(\n        imageGridImages as ImageGridItem[],\n        imageGridPreset as ImageGridPreset,\n        imageGridGap as number,\n        imageRadius,\n        imageShadow,\n        gridId\n      );\n\n      const cardHtml = `<div class=\"sg-hero__card\" style=\"max-width: 500px; background: ${cardBg}; padding: 2rem; border-radius: 16px; box-shadow: 0 25px 50px rgba(0,0,0,0.25); position: relative; z-index: 2; text-align: ${align}; flex: 0 1 auto;\">${contentBlock}</div>`;\n      const gridWrapperHtml = `<div class=\"sg-hero__grid-wrapper\" style=\"position: relative; z-index: 3; display: flex; justify-content: center; align-items: center; flex: 0 1 auto; max-width: ${blocksMaxWidth};\">${gridResult.html}</div>`;\n\n      // Card always left, Grid always right\n      const innerHtml = `${cardHtml}${gridWrapperHtml}`;\n\n      // Responsive CSS\n      let layoutCss = `\n        @media (max-width: 1023px) {\n          #${cardGridLayoutId} {\n            flex-direction: column !important;\n            gap: 2rem !important;\n          }\n          #${cardGridLayoutId} .sg-hero__grid-wrapper {\n            order: -1;\n          }\n        }\n      `;\n      layoutCss += gridResult.css;\n\n      const cardGridLayoutHtml = `<style>${layoutCss}</style><div id=\"${cardGridLayoutId}\" class=\"sg-hero__card-grid-layout\" style=\"display: flex; width: 100%; max-width: ${containerMaxWidth}; align-items: center; justify-content: ${blocksJustify}; position: relative; z-index: 2; padding: 0 2rem; gap: ${blocksGap};\">${innerHtml}</div>`;\n\n      return `<section ${blockIdAttr(block.id)} ${dataBlockIdAttr(block.id)} class=\"${sectionClasses} sg-hero--with-grid\" style=\"min-height: ${minHeight}; padding: ${cardPadding}; display: flex; align-items: center; justify-content: center; background-image: url(${escapeHtml(heroImage)}); background-size: cover; background-position: center; position: relative; overflow: hidden;\" data-variation=\"${escapeHtml(variation || variant || \"\")}\">${styleBlock}${overlayHtml}${cardGridLayoutHtml}</section>`;\n    }\n\n    // Without Image Grid: Original card layout\n    const cardHtml = `\n      <div class=\"sg-hero__card\" style=\"max-width: ${contentMaxWidth}; width: 100%; background: ${cardBg}; padding: 2rem; border-radius: 16px; box-shadow: 0 25px 50px rgba(0,0,0,0.25); position: relative; z-index: 2; text-align: ${align};\">\n        ${contentBlock}\n      </div>\n    `;\n\n    return `<section ${blockIdAttr(block.id)} ${dataBlockIdAttr(block.id)} class=\"${sectionClasses}\" style=\"min-height: ${minHeight}; padding: ${cardPadding}; display: flex; align-items: center; justify-content: center; background-image: url(${escapeHtml(heroImage)}); background-size: cover; background-position: center; position: relative; overflow: hidden;\" data-variation=\"${escapeHtml(variation || variant || \"\")}\">${styleBlock}${overlayHtml}${cardHtml}</section>`;\n  }\n\n  // =========================================================================\n  // RENDER: With Image Grid (any variation) - Floating grid alongside content\n  // =========================================================================\n  if (shouldShowImageGrid) {\n    const gridLayoutId = generateScopedId(block.id || \"\", \"hero-grid-layout\");\n    const gridId = generateScopedId(block.id || \"\", \"hero-grid\");\n    const isGridLeft = imagePosition === \"left\";\n\n    const gridResult = exportImageGrid(\n      imageGridImages as ImageGridItem[],\n      imageGridPreset as ImageGridPreset,\n      imageGridGap as number,\n      imageRadius,\n      imageShadow,\n      gridId\n    );\n\n    const gridWrapperHtml = `<div class=\"sg-hero__grid-wrapper\" style=\"position: relative; z-index: 3; display: flex; justify-content: center; align-items: center; flex: 0 1 auto; max-width: ${blocksMaxWidth};\">${gridResult.html}</div>`;\n    const contentSideHtml = `<div class=\"sg-hero__content-side\" style=\"max-width: ${blocksMaxWidth}; flex: 0 1 auto; text-align: ${align}; position: relative; z-index: 2;\">${contentBlock}</div>`;\n\n    // Responsive CSS for the grid layout\n    let layoutCss = `\n      @media (max-width: 1023px) {\n        #${gridLayoutId} {\n          flex-direction: column !important;\n          gap: 2rem !important;\n        }\n        #${gridLayoutId} .sg-hero__grid-wrapper,\n        #${gridLayoutId} .sg-hero__content-side {\n          max-width: 100% !important;\n        }\n        #${gridLayoutId} .sg-hero__grid-wrapper {\n          order: -1;\n        }\n      }\n    `;\n    layoutCss += gridResult.css;\n\n    const innerHtml = isGridLeft\n      ? `${gridWrapperHtml}${contentSideHtml}`\n      : `${contentSideHtml}${gridWrapperHtml}`;\n\n    const gridLayoutHtml = `<style>${layoutCss}</style><div id=\"${gridLayoutId}\" class=\"sg-hero__grid-layout\" style=\"display: flex; justify-content: ${blocksJustify}; gap: ${blocksGap}; max-width: ${containerMaxWidth}; width: 100%; align-items: center; position: relative; z-index: 2; padding: 0 2rem;\">${innerHtml}</div>`;\n\n    return `<section ${blockIdAttr(block.id)} ${dataBlockIdAttr(block.id)} class=\"${sectionClasses} sg-hero--with-grid\" style=\"min-height: ${minHeight}; ${paddingStyle} display: flex; align-items: center; justify-content: ${justifyContent}; ${bgStyle} position: relative; overflow: hidden;\" data-variation=\"${escapeHtml(variation || variant || \"\")}\">${styleBlock}${overlayHtml}${waveHtml}${gridLayoutHtml}</section>`;\n  }\n\n  // =========================================================================\n  // RENDER: Default (centered, gradient, minimal, parallax, overlay)\n  // =========================================================================\n  const contentWrapHtml = `<div style=\"max-width: ${contentMaxWidth}; width: 100%; padding: 0 2rem; text-align: ${align}; position: relative; z-index: 2;\">${contentBlock}</div>`;\n\n  return `<section ${blockIdAttr(block.id)} ${dataBlockIdAttr(block.id)} class=\"${sectionClasses}\" style=\"min-height: ${minHeight}; ${paddingStyle} display: flex; align-items: center; justify-content: ${justifyContent}; ${bgStyle} position: relative; overflow: hidden;\" data-variation=\"${escapeHtml(variation || variant || \"\")}\">${styleBlock}${overlayHtml}${waveHtml}${contentWrapHtml}</section>`;\n}\n\n/**\n * Resolve hero button styles with independent customization for primary and secondary\n */\ninterface ButtonStylesConfig {\n  theme?: ThemeTokens;\n  blockId: string;\n  buttonSize: string;\n  primaryButtonVariant: string;\n  primaryButtonColor: string;\n  primaryButtonTextColor: string;\n  primaryButtonRadius: number;\n  secondaryButtonVariant: string;\n  secondaryButtonColor: string;\n  secondaryButtonTextColor: string;\n  secondaryButtonRadius: number;\n  hoverEffect: string;\n  hoverIntensity: number;\n  hoverOverlay: string;\n  hoverIconName: string;\n}\n\nfunction resolveHeroButtonStyles(config: ButtonStylesConfig): { primary: string; secondary: string; css: string } {\n  const {\n    blockId,\n    buttonSize,\n    primaryButtonVariant,\n    primaryButtonColor,\n    primaryButtonTextColor,\n    primaryButtonRadius,\n    secondaryButtonVariant,\n    secondaryButtonColor,\n    secondaryButtonTextColor,\n    secondaryButtonRadius,\n    hoverEffect,\n    hoverIntensity,\n    hoverOverlay,\n    hoverIconName,\n  } = config;\n\n  // Size-based styles\n  const sizeStyles: Record<string, { padding: string; fontSize: string }> = {\n    sm: { padding: \"0.625rem 1.25rem\", fontSize: \"0.875rem\" },\n    md: { padding: \"0.875rem 2rem\", fontSize: \"1rem\" },\n    lg: { padding: \"1rem 2.5rem\", fontSize: \"1.125rem\" },\n  };\n  const size = sizeStyles[buttonSize] || sizeStyles.md;\n\n  // Base button styles\n  const baseStyles = [\n    `padding: ${size.padding}`,\n    \"font-weight: 600\",\n    `font-size: ${size.fontSize}`,\n    \"text-decoration: none\",\n    \"display: inline-flex\",\n    \"align-items: center\",\n    \"justify-content: center\",\n    \"gap: 0.5rem\",\n    \"transition: all 0.2s ease\",\n    \"position: relative\",\n    \"overflow: hidden\",\n    \"cursor: pointer\",\n  ];\n\n  // Primary button styles\n  const primaryStyles = [...baseStyles, `border-radius: ${primaryButtonRadius}px`];\n  switch (primaryButtonVariant) {\n    case \"outline\":\n      primaryStyles.push(`background-color: transparent`, `border: 2px solid ${primaryButtonColor}`, `color: ${primaryButtonColor}`);\n      break;\n    case \"ghost\":\n      primaryStyles.push(`background-color: transparent`, `border: none`, `color: ${primaryButtonColor}`);\n      break;\n    default: // solid\n      primaryStyles.push(`background-color: ${primaryButtonColor}`, `border: 2px solid ${primaryButtonColor}`, `color: ${primaryButtonTextColor}`);\n  }\n\n  // Secondary button styles\n  const secondaryStyles = [...baseStyles, `border-radius: ${secondaryButtonRadius}px`];\n  switch (secondaryButtonVariant) {\n    case \"solid\":\n      secondaryStyles.push(`background-color: ${secondaryButtonColor}`, `border: 2px solid ${secondaryButtonColor}`, `color: ${secondaryButtonTextColor}`);\n      break;\n    case \"ghost\":\n      secondaryStyles.push(`background-color: transparent`, `border: none`, `color: ${secondaryButtonTextColor}`);\n      break;\n    default: // outline\n      secondaryStyles.push(`background-color: transparent`, `border: 2px solid ${secondaryButtonColor}`, `color: ${secondaryButtonTextColor}`);\n  }\n\n  const scope = blockId ? `[data-block-id=\"${blockId}\"]` : \"\";\n  let css = \"\";\n\n  // Hover effects\n  if (hoverEffect !== \"none\") {\n    // Primary button hover\n    const primaryHoverResult = generateButtonHoverStyles({\n      effect: hoverEffect as ButtonHoverEffect,\n      intensity: hoverIntensity,\n      buttonColor: primaryButtonColor,\n      buttonTextColor: primaryButtonVariant === \"solid\" ? primaryButtonTextColor : primaryButtonColor,\n      variant: primaryButtonVariant as \"solid\" | \"outline\" | \"ghost\",\n    });\n\n    // Secondary button hover\n    const secondaryHoverResult = generateButtonHoverStyles({\n      effect: hoverEffect as ButtonHoverEffect,\n      intensity: hoverIntensity,\n      buttonColor: secondaryButtonColor,\n      buttonTextColor: secondaryButtonVariant === \"solid\" ? secondaryButtonTextColor : secondaryButtonColor,\n      variant: secondaryButtonVariant as \"solid\" | \"outline\" | \"ghost\",\n    });\n\n    if (primaryHoverResult.base) {\n      css += `${scope} .sg-hero__btn--primary { ${primaryHoverResult.base} }\\n`;\n    }\n    if (secondaryHoverResult.base) {\n      css += `${scope} .sg-hero__btn--secondary { ${secondaryHoverResult.base} }\\n`;\n    }\n\n    css += `\n      ${scope} .sg-hero__btn--primary:hover { ${primaryHoverResult.hover} }\n      ${scope} .sg-hero__btn--secondary:hover { ${secondaryHoverResult.hover} }\n    `;\n\n    css += getButtonHoverKeyframes();\n  }\n\n  // Overlay effects\n  if (hoverOverlay && hoverOverlay !== \"none\") {\n    css += generateButtonOverlayCSS(`${scope} .sg-hero__btn--primary`, {\n      overlay: hoverOverlay as ButtonHoverOverlay,\n      primaryColor: primaryButtonColor,\n      iconName: hoverIconName,\n      textColor: primaryButtonVariant === \"solid\" ? primaryButtonTextColor : primaryButtonColor,\n    });\n    css += generateButtonOverlayCSS(`${scope} .sg-hero__btn--secondary`, {\n      overlay: hoverOverlay as ButtonHoverOverlay,\n      primaryColor: secondaryButtonColor,\n      iconName: hoverIconName,\n      textColor: secondaryButtonVariant === \"solid\" ? secondaryButtonTextColor : secondaryButtonColor,\n    });\n  }\n\n  return {\n    primary: primaryStyles.join(\"; \"),\n    secondary: secondaryStyles.join(\"; \"),\n    css,\n  };\n}\n\n"],"names":["exportHero","block","depth","basePath","theme","variation","variant","title","subtitle","description","primaryButton","secondaryButton","badge","align","contentPosition","contentSpacing","blockGap","minHeight","image","overlay","overlayColor","background","titleColor","subtitleColor","descriptionColor","titleTypography","subtitleTypography","descriptionTypography","badgeColor","badgeTextColor","contentMaxWidth","paddingY","imageRadius","imageShadow","imagePosition","buttonSize","primaryButtonVariant","primaryButtonColor","primaryButtonTextColor","primaryButtonRadius","secondaryButtonVariant","secondaryButtonColor","secondaryButtonTextColor","secondaryButtonRadius","buttonHoverEffect","buttonHoverIntensity","buttonHoverOverlay","buttonHoverIconName","showWave","waveColor","imageGridEnabled","imageGridPreset","imageGridImages","imageGridGap","heroImage","PLACEHOLDER_IMAGE_URL","isSplit","isParallax","isOverlayVariant","isGradient","isMinimal","isCard","isImageBg","isOverlay","hasDarkBg","themePrimaryColor","themePrimaryText","defaultTextColor","defaultMutedColor","mergedTitleTypo","mergeTypographyWithDefaults","heroTitleDefaults","mergedSubtitleTypo","heroSubtitleDefaults","mergedDescriptionTypo","heroDescriptionDefaults","titleTypoStyles","generateTypographyStyles","subtitleTypoStyles","descriptionTypoStyles","finalBadgeColor","finalBadgeTextColor","finalPrimaryBtnColor","finalPrimaryBtnTextColor","finalSecondaryBtnColor","finalSecondaryBtnTextColor","sectionClasses","bgStyle","escapeHtml","paddingStyle","justifyContent","contentPositionMap","spacingMap","spacing","blocksConfig","blockGapConfig","blocksJustify","blocksMaxWidth","containerMaxWidth","blocksGap","overlayStyle","overlayHtml","waveHtml","badgeHtml","titleFontSize","titleHtml","subtitleFontSize","subtitleHtml","descHtml","buttonStyles","resolveHeroButtonStyles","primaryHref","resolveHref","secondaryHref","primaryBtnHtml","linkTargetAttr","secondaryBtnHtml","buttonsHtml","contentBlock","styleBlock","imgFallback","exportImageGrid","images","preset","gap","radius","shadow","gridId","config","gridPresetMap","shadowValue","imageShadowMap","itemsHtml","pos","idx","img","imgSrc","imgAlt","gridHtml","gridCss","hasValidGridImages","shouldShowImageGrid","splitId","generateScopedId","isImageLeft","imgShadow","splitCss","splitBgStyle","imgStyle","imageDiv","contentDiv","innerHtml","blockIdAttr","dataBlockIdAttr","cardBg","cardPadding","cardGridLayoutId","gridResult","cardHtml","gridWrapperHtml","layoutCss","cardGridLayoutHtml","gridLayoutId","isGridLeft","contentSideHtml","gridLayoutHtml","contentWrapHtml","blockId","hoverEffect","hoverIntensity","hoverOverlay","hoverIconName","sizeStyles","size","baseStyles","primaryStyles","secondaryStyles","scope","css","primaryHoverResult","generateButtonHoverStyles","secondaryHoverResult","getButtonHoverKeyframes","generateButtonOverlayCSS"],"mappings":"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"}
+{"version":3,"file":"HeroExporter.js","sources":["../../../../../src/engine/export/exporters/sections/HeroExporter.ts"],"sourcesContent":["/**\n * Hero Section Exporter\n * Exporta Hero com múltiplas variações e customizações avançadas\n * Mobile-first responsive: split layout collapses to stack in mobile\n */\n\nimport { Block } from \"../../../schema/siteDocument\";\nimport { ThemeTokens } from \"../../../schema/themeTokens\";\nimport { PLACEHOLDER_IMAGE_URL, CAROUSEL_PLACEHOLDER_IMAGES } from \"../../../presets/heroVariations\";\nimport { dataBlockIdAttr, blockIdAttr, escapeHtml, resolveHref, linkTargetAttr } from \"../../shared/htmlHelpers\";\nimport { generateScopedId } from \"../../shared/idGenerator\";\nimport { generateCarouselCSS } from \"../../../shared/carouselAnimation\";\nimport {\n  generateButtonHoverStyles,\n  generateButtonOverlayCSS,\n  getButtonHoverKeyframes,\n  type ButtonHoverEffect,\n  type ButtonHoverOverlay,\n} from \"../../../shared/hoverEffects\";\nimport { gridPresetMap, type ImageGridItem, type ImageGridPreset } from \"../../../shared/imageGrid\";\nimport {\n  generateTypographyStyles,\n  mergeTypographyWithDefaults,\n  heroTitleDefaults,\n  heroSubtitleDefaults,\n  heroDescriptionDefaults,\n  type TypographyConfig,\n} from \"../../../shared/typography\";\nimport { imageShadowMap } from \"../../../shared/shadowConstants\";\nimport { contentPositionMap, blockGapConfig } from \"../../../shared/layoutConstants\";\n\nexport function exportHero(\n  block: Block,\n  depth: number,\n  basePath?: string,\n  theme?: ThemeTokens,\n): string {\n  const {\n    variation,\n    variant = \"centered\",\n    title,\n    subtitle,\n    description,\n    primaryButton,\n    secondaryButton,\n    badge,\n    align = \"center\",\n    contentPosition = \"center\",\n    contentSpacing = \"default\",\n    blockGap = \"default\",\n    minHeight = \"80vh\",\n    image,\n    overlay,\n    overlayColor,\n    background,\n    // Typography colors (legacy)\n    titleColor,\n    subtitleColor,\n    descriptionColor,\n    // Typography config (novo sistema)\n    titleTypography,\n    subtitleTypography,\n    descriptionTypography,\n    // Badge styling\n    badgeColor,\n    badgeTextColor,\n    // Layout\n    contentMaxWidth = \"800px\",\n    paddingY,\n    // Image styling\n    imageRadius = 16,\n    imageShadow = \"lg\",\n    imagePosition = \"right\",\n    // Button size\n    buttonSize = \"md\",\n    // Primary button styling\n    primaryButtonVariant = \"solid\",\n    primaryButtonColor,\n    primaryButtonTextColor,\n    primaryButtonRadius = 8,\n    // Secondary button styling\n    secondaryButtonVariant = \"outline\",\n    secondaryButtonColor,\n    secondaryButtonTextColor,\n    secondaryButtonRadius = 8,\n    // Button hover effects\n    buttonHoverEffect = \"scale\",\n    buttonHoverIntensity = 50,\n    buttonHoverOverlay = \"none\",\n    buttonHoverIconName = \"arrow-right\",\n    // Decorative\n    showWave,\n    waveColor = \"rgba(255,255,255,0.1)\",\n    // Image Grid\n    imageGridEnabled,\n    imageGridPreset = \"four-equal\",\n    imageGridImages = [],\n    imageGridGap = 8,\n    // Carousel\n    carouselImages,\n    carouselInterval = 5,\n    carouselTransition = \"crossfade\",\n  } = (block as any).props;\n\n  // Determine variation types\n  const heroImage = image || PLACEHOLDER_IMAGE_URL;\n  const isSplit = variation === \"hero-split\" || variant === \"split\";\n  const isParallax = variation === \"hero-parallax\";\n  const isOverlayVariant = variation === \"hero-overlay\";\n  const isGradient = variation === \"hero-gradient\";\n  const isMinimal = variation === \"hero-minimal\";\n  const isCard = variation === \"hero-card\";\n  const isCarousel = variation === \"hero-carousel\";\n  const isImageBg = (variant === \"image-bg\" || isOverlayVariant || isParallax || isCard || isCarousel) && heroImage;\n  const isOverlay = isImageBg && overlay;\n\n  // Determine if dark background context\n  const hasDarkBg = isOverlay || isGradient || isOverlayVariant || isCarousel;\n\n  // Theme colors\n  const themePrimaryColor = theme?.colors?.primary || \"#3b82f6\";\n  const themePrimaryText = theme?.colors?.primaryText || \"#ffffff\";\n\n  // Text colors (fallback)\n  const defaultTextColor = hasDarkBg ? \"#ffffff\" : \"var(--sg-text, #1f2937)\";\n  const defaultMutedColor = hasDarkBg ? \"rgba(255,255,255,0.85)\" : \"var(--sg-muted-text, #6b7280)\";\n\n  // Merge typography configs with defaults (retrocompatível com titleColor, etc.)\n  const mergedTitleTypo = mergeTypographyWithDefaults(\n    titleTypography as TypographyConfig | undefined,\n    { ...heroTitleDefaults, color: titleColor as string | undefined }\n  );\n  const mergedSubtitleTypo = mergeTypographyWithDefaults(\n    subtitleTypography as TypographyConfig | undefined,\n    { ...heroSubtitleDefaults, color: subtitleColor as string | undefined }\n  );\n  const mergedDescriptionTypo = mergeTypographyWithDefaults(\n    descriptionTypography as TypographyConfig | undefined,\n    { ...heroDescriptionDefaults, color: descriptionColor as string | undefined }\n  );\n\n  // Generate typography CSS strings\n  const titleTypoStyles = generateTypographyStyles(mergedTitleTypo, defaultTextColor);\n  const subtitleTypoStyles = generateTypographyStyles(mergedSubtitleTypo, defaultMutedColor);\n  const descriptionTypoStyles = generateTypographyStyles(mergedDescriptionTypo, defaultMutedColor);\n\n  // Badge colors\n  const finalBadgeColor = badgeColor || themePrimaryColor;\n  const finalBadgeTextColor = badgeTextColor || \"#ffffff\";\n\n  // Button colors\n  const finalPrimaryBtnColor = primaryButtonColor || themePrimaryColor;\n  const finalPrimaryBtnTextColor = primaryButtonTextColor || themePrimaryText;\n  const finalSecondaryBtnColor = secondaryButtonColor || (hasDarkBg ? \"#ffffff\" : themePrimaryColor);\n  const finalSecondaryBtnTextColor = secondaryButtonTextColor || finalSecondaryBtnColor;\n\n  // Section classes\n  const sectionClasses = [\n    \"sg-hero\",\n    variation ? `sg-hero--${String(variation).replace(\"hero-\", \"\")}` : \"\",\n    isSplit ? \"sg-hero--split\" : \"\",\n    isParallax ? \"sg-hero--parallax\" : \"\",\n    isOverlayVariant ? \"sg-hero--overlay\" : \"\",\n    isGradient ? \"sg-hero--gradient\" : \"\",\n    isMinimal ? \"sg-hero--minimal\" : \"\",\n    isCard ? \"sg-hero--card\" : \"\",\n    isCarousel ? \"sg-hero--carousel\" : \"\",\n  ]\n    .filter(Boolean)\n    .join(\" \");\n\n  // Build background style\n  let bgStyle = \"\";\n  if (background) {\n    bgStyle = `background: ${background};`;\n  } else if (isImageBg && !isSplit) {\n    bgStyle = `background-image: url(${escapeHtml(heroImage)}); background-size: cover; background-position: center;`;\n    if (isParallax) bgStyle += \" background-attachment: fixed;\";\n  } else {\n    bgStyle = \"background-color: var(--sg-bg, #fff);\";\n  }\n\n  // Padding\n  const paddingStyle = paddingY ? `padding: ${paddingY} 2rem;` : \"padding: 6rem 2rem;\";\n\n  // Content position mapping for flexbox justify-content\n  const justifyContent = contentPositionMap[contentPosition] || \"center\";\n\n  // Determine if layout has two blocks (content + image) - these should always be centered\n  const hasTwoBlocks = isSplit || isCard;\n  // Note: shouldShowImageGrid is checked later, so we'll handle it in each section\n\n  // Content spacing map - controls margin between elements\n  const spacingMap: Record<string, { title: string; subtitle: string; description: string; badge: string; actions: string }> = {\n    compact: { title: \"0.75rem\", subtitle: \"0.5rem\", description: \"1.25rem\", badge: \"1rem\", actions: \"0.25rem\" },\n    default: { title: \"1.25rem\", subtitle: \"1rem\", description: \"2.5rem\", badge: \"1.5rem\", actions: \"0.5rem\" },\n    spacious: { title: \"2.25rem\", subtitle: \"2rem\", description: \"3.5rem\", badge: \"2.5rem\", actions: \"1.5rem\" },\n  };\n  const spacing = spacingMap[contentSpacing] || spacingMap.default;\n\n  // Block gap configuration\n  const blocksConfig = blockGapConfig[blockGap] || blockGapConfig.default;\n  const blocksJustify = blocksConfig.justify;\n  const blocksMaxWidth = blocksConfig.blockMaxWidth;\n  const containerMaxWidth = blocksConfig.containerMaxWidth;\n  const blocksGap = blocksConfig.gap;\n\n  // Overlay HTML\n  const overlayStyle = overlayColor\n    ? `position: absolute; inset: 0; background: ${overlayColor}; z-index: 0;`\n    : \"position: absolute; inset: 0; background: linear-gradient(135deg, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0.3) 100%); z-index: 0;\";\n  const overlayHtml = isOverlay\n    ? `<div class=\"sg-hero__overlay\" style=\"${overlayStyle}\"></div>`\n    : \"\";\n\n  // Wave SVG\n  const waveHtml = showWave\n    ? `<div style=\"position: absolute; bottom: 0; left: 0; right: 0; height: 150px; overflow: hidden; z-index: 1;\">\n        <svg viewBox=\"0 0 1200 120\" preserveAspectRatio=\"none\" style=\"position: absolute; bottom: 0; width: 100%; height: 100%;\">\n          <path d=\"M0,0V46.29c47.79,22.2,103.59,32.17,158,28,70.36-5.37,136.33-33.31,206.8-37.5C438.64,32.43,512.34,53.67,583,72.05c69.27,18,138.3,24.88,209.4,13.08,36.15-6,69.85-17.84,104.45-29.34C989.49,25,1113-14.29,1200,52.47V0Z\" fill=\"${waveColor}\" opacity=\"0.5\"/>\n          <path d=\"M0,0V15.81C13,36.92,27.64,56.86,47.69,72.05,99.41,111.27,165,111,224.58,91.58c31.15-10.15,60.09-26.07,89.67-39.8,40.92-19,84.73-46,130.83-49.67,36.26-2.85,70.9,9.42,98.6,31.56,31.77,25.39,62.32,62,103.63,73,40.44,10.79,81.35-6.69,119.13-24.28s75.16-39,116.92-43.05c59.73-5.85,113.28,22.88,168.9,38.84,30.2,8.66,59,6.17,87.09-7.5,22.43-10.89,48-26.93,60.65-49.24V0Z\" fill=\"${waveColor}\" opacity=\"0.3\"/>\n        </svg>\n      </div>`\n    : \"\";\n\n  // Badge HTML\n  const badgeHtml = badge\n    ? `<span class=\"sg-hero__badge\" data-block-group=\"Badge\" style=\"display: inline-block; padding: 0.5rem 1.25rem; background: ${finalBadgeColor}; color: ${finalBadgeTextColor}; border-radius: 999px; font-size: 0.875rem; font-weight: 600; margin-bottom: ${spacing.badge};\">${escapeHtml(badge)}</span>`\n    : \"\";\n\n  // Title HTML - usa tipografia customizada com clamp para responsividade\n  const titleFontSize = mergedTitleTypo.fontSize || 48;\n  const titleHtml = title\n    ? `<h1 class=\"sg-hero__title\" style=\"${titleTypoStyles.cssString} font-size: clamp(2rem, 5vw, ${titleFontSize}px); line-height: 1.1; margin-bottom: ${spacing.title}; letter-spacing: -0.02em;\">${escapeHtml(title)}</h1>`\n    : \"\";\n\n  // Subtitle HTML - usa tipografia customizada com clamp para responsividade\n  const subtitleFontSize = mergedSubtitleTypo.fontSize || 24;\n  const subtitleHtml = subtitle\n    ? `<h2 class=\"sg-hero__subtitle\" style=\"${subtitleTypoStyles.cssString} font-size: clamp(1.125rem, 2.5vw, ${subtitleFontSize}px); line-height: 1.3; margin-bottom: ${spacing.subtitle};\">${escapeHtml(subtitle)}</h2>`\n    : \"\";\n\n  // Description HTML - usa tipografia customizada\n  const descHtml = description\n    ? `<p class=\"sg-hero__description\" style=\"max-width: 650px; margin: ${align === \"center\" ? `0 auto ${spacing.description}` : `0 0 ${spacing.description}`}; ${descriptionTypoStyles.cssString} line-height: 1.7;\">${escapeHtml(description)}</p>`\n    : \"\";\n\n  // Button styles\n  const buttonStyles = resolveHeroButtonStyles({\n    theme,\n    blockId: block.id,\n    buttonSize,\n    primaryButtonVariant,\n    primaryButtonColor: finalPrimaryBtnColor,\n    primaryButtonTextColor: finalPrimaryBtnTextColor,\n    primaryButtonRadius,\n    secondaryButtonVariant,\n    secondaryButtonColor: finalSecondaryBtnColor,\n    secondaryButtonTextColor: finalSecondaryBtnTextColor,\n    secondaryButtonRadius,\n    hoverEffect: buttonHoverEffect,\n    hoverIntensity: buttonHoverIntensity,\n    hoverOverlay: buttonHoverOverlay,\n    hoverIconName: buttonHoverIconName,\n  });\n\n  // Buttons HTML\n  const primaryHref = primaryButton ? resolveHref(primaryButton.href || \"#\", basePath) : \"#\";\n  const secondaryHref = secondaryButton ? resolveHref(secondaryButton.href || \"#\", basePath) : \"#\";\n  const primaryBtnHtml = primaryButton\n    ? `<a href=\"${escapeHtml(primaryHref)}\"${linkTargetAttr(primaryHref, basePath)} class=\"sg-hero__btn sg-hero__btn--primary\" data-block-group=\"Botão Primário\" style=\"${buttonStyles.primary}\">${escapeHtml(primaryButton.text)}</a>`\n    : \"\";\n  const secondaryBtnHtml = secondaryButton\n    ? `<a href=\"${escapeHtml(secondaryHref)}\"${linkTargetAttr(secondaryHref, basePath)} class=\"sg-hero__btn sg-hero__btn--secondary\" data-block-group=\"Botão Secundário\" style=\"${buttonStyles.secondary}\">${escapeHtml(secondaryButton.text)}</a>`\n    : \"\";\n  const buttonsHtml =\n    primaryButton || secondaryButton\n      ? `<div class=\"sg-hero__actions\" style=\"display: flex; gap: 1rem; flex-wrap: wrap; justify-content: ${align === \"center\" ? \"center\" : \"flex-start\"}; margin-top: ${spacing.actions};\">${primaryBtnHtml}${secondaryBtnHtml}</div>`\n      : \"\";\n\n  // Content block — wrap text content in a group for click-to-scroll\n  const textContentHtml = (titleHtml || subtitleHtml || descHtml) ? `<div data-block-group=\"Conteúdo\">${titleHtml}${subtitleHtml}${descHtml}</div>` : \"\";\n  const contentBlock = `${badgeHtml}${textContentHtml}${buttonsHtml}`;\n\n  // Style block (hover effects)\n  const styleBlock = buttonStyles.css ? `<style>${buttonStyles.css}</style>` : \"\";\n\n  // Image fallback\n  const imgFallback = `this.onerror=null;this.src='${escapeHtml(PLACEHOLDER_IMAGE_URL)}';`;\n\n  // =========================================================================\n  // IMAGE GRID EXPORT HELPER\n  // =========================================================================\n  const exportImageGrid = (\n    images: ImageGridItem[],\n    preset: ImageGridPreset,\n    gap: number,\n    radius: number,\n    shadow: string,\n    gridId: string\n  ): { html: string; css: string } => {\n    const config = gridPresetMap[preset];\n    const shadowValue = imageShadowMap[shadow] || imageShadowMap.lg;\n\n    // Generate grid items HTML\n    const itemsHtml = config.positions\n      .map((pos, idx) => {\n        const img = images[idx];\n        const imgSrc = img?.src || PLACEHOLDER_IMAGE_URL;\n        const imgAlt = img?.alt || `Imagem ${idx + 1}`;\n        const imgScale = img?.scale ?? 1;\n        const scaleStyle = imgScale !== 1 ? ` transform: scale(${imgScale}); z-index: 1;` : \"\";\n\n        return `<div class=\"sg-hero__grid-item\" style=\"grid-column: ${pos.col}; grid-row: ${pos.row}; overflow: hidden; border-radius: ${radius}px;${scaleStyle}\">\n          <img src=\"${escapeHtml(imgSrc)}\" alt=\"${escapeHtml(imgAlt)}\" style=\"width: 100%; height: 100%; object-fit: contain; display: block;\" onerror=\"${imgFallback}\" />\n        </div>`;\n      })\n      .join(\"\");\n\n    const gridHtml = `<div id=\"${gridId}\" class=\"sg-hero__image-grid\" style=\"display: grid; grid-template: ${config.gridTemplate}; gap: ${gap}px; width: 100%; max-width: 500px; aspect-ratio: 1 / 1;\">\n      ${itemsHtml}\n    </div>`;\n\n    // Responsive CSS: collapse to single column on mobile\n    const gridCss = `\n      @media (max-width: 767px) {\n        #${gridId} {\n          grid-template: auto / 1fr !important;\n          aspect-ratio: auto !important;\n        }\n        #${gridId} .sg-hero__grid-item {\n          grid-column: 1 / -1 !important;\n          grid-row: auto !important;\n          aspect-ratio: 16 / 9;\n        }\n      }\n    `;\n\n    return { html: gridHtml, css: gridCss };\n  };\n\n  // Determine if we should use image grid (works in ANY variation now)\n  const hasValidGridImages = imageGridImages && imageGridImages.length > 0 && (imageGridImages as ImageGridItem[]).some((img: ImageGridItem) => img?.src);\n  const shouldShowImageGrid = imageGridEnabled && hasValidGridImages;\n\n  // =========================================================================\n  // RENDER: Carousel Layout (crossfade image background)\n  // =========================================================================\n  if (isCarousel) {\n    const resolvedImages = (carouselImages && carouselImages.length >= 2)\n      ? (carouselImages as string[])\n      : CAROUSEL_PLACEHOLDER_IMAGES;\n    const carouselScopeId = generateScopedId(block.id || \"\", \"hero-carousel\");\n\n    const carouselCss = generateCarouselCSS(\n      `#${carouselScopeId}`,\n      resolvedImages.length,\n      carouselInterval as number,\n    );\n\n    // Generate carousel images HTML\n    const carouselImagesHtml = resolvedImages\n      .map((imgSrc: string, i: number) =>\n        `<img src=\"${escapeHtml(imgSrc)}\" alt=\"Slide ${i + 1}\" class=\"sg-carousel__img\" ${i === 0 ? 'style=\"opacity: 1;\"' : ''} onerror=\"${imgFallback}\" />`\n      )\n      .join(\"\");\n\n    // Dot indicators HTML\n    const dotsHtml = `<div class=\"sg-carousel__dots\">${resolvedImages.map(() => '<span class=\"sg-carousel__dot\"></span>').join(\"\")}</div>`;\n\n    // Overlay for carousel\n    const carouselOverlayStyle = overlayColor\n      ? `position: absolute; inset: 0; background: ${overlayColor}; z-index: 1;`\n      : \"position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.7) 100%); z-index: 1;\";\n    const carouselOverlayHtml = overlay\n      ? `<div class=\"sg-hero__overlay\" style=\"${carouselOverlayStyle}\"></div>`\n      : \"\";\n\n    const carouselContentHtml = `<div style=\"max-width: ${contentMaxWidth}; width: 100%; padding: 0 2rem; text-align: ${align}; position: relative; z-index: 2;\">${contentBlock}</div>`;\n\n    // Combine all CSS (carousel animation + button hover effects)\n    const allCss = `<style>${carouselCss}${buttonStyles.css ? \"\\n\" + buttonStyles.css : \"\"}</style>`;\n\n    return `<section ${blockIdAttr(block.id)} ${dataBlockIdAttr(block.id)} class=\"${sectionClasses}\" style=\"min-height: ${minHeight}; ${paddingStyle} display: flex; align-items: center; justify-content: ${justifyContent}; position: relative; overflow: hidden; background: #000;\" data-variation=\"${escapeHtml(variation || variant || \"\")}\">${allCss}<div id=\"${carouselScopeId}\" style=\"position: absolute; inset: 0; z-index: 0;\">${carouselImagesHtml}${dotsHtml}</div>${carouselOverlayHtml}${carouselContentHtml}</section>`;\n  }\n\n  // =========================================================================\n  // RENDER: Split Layout (without image grid)\n  // =========================================================================\n  if (isSplit && heroImage && !shouldShowImageGrid) {\n    const splitId = generateScopedId(block.id || \"\", \"hero-split\");\n    const isImageLeft = imagePosition === \"left\";\n    const imgShadow = imageShadowMap[imageShadow] || imageShadowMap.lg;\n\n    const splitCss = `\n      @media (max-width: 1023px) {\n        #${splitId} {\n          grid-template-columns: 1fr !important;\n          gap: 2rem !important;\n          padding: 0 1rem !important;\n        }\n        #${splitId} .sg-hero__split-image {\n          order: -1;\n        }\n      }\n    `;\n\n    const splitBgStyle = background ? `background: ${background};` : \"background-color: var(--sg-bg, #fff);\";\n    const imgStyle = `width: 100%; max-width: 500px; height: auto; border-radius: ${imageRadius}px; box-shadow: ${imgShadow}; object-fit: cover;`;\n    const imageDiv = `<div class=\"sg-hero__split-image\" data-block-group=\"Mídia\" style=\"display: flex; justify-content: center; flex: 0 1 auto; max-width: ${blocksMaxWidth};\"><img src=\"${escapeHtml(heroImage)}\" alt=\"${escapeHtml(title || \"\")}\" class=\"sg-hero__img\" style=\"${imgStyle}\" onerror=\"${imgFallback}\" /></div>`;\n    const contentDiv = `<div class=\"sg-hero__split-content\" style=\"text-align: ${align}; position: relative; z-index: 1; max-width: ${blocksMaxWidth}; flex: 0 1 auto;\">${contentBlock}</div>`;\n\n    const innerHtml = isImageLeft\n      ? `<style>${splitCss}</style><div id=\"${splitId}\" class=\"sg-hero__split-inner\" style=\"display: flex; justify-content: ${blocksJustify}; gap: ${blocksGap}; align-items: center; max-width: ${containerMaxWidth}; width: 100%; padding: 0 2rem;\">${imageDiv}${contentDiv}</div>`\n      : `<style>${splitCss}</style><div id=\"${splitId}\" class=\"sg-hero__split-inner\" style=\"display: flex; justify-content: ${blocksJustify}; gap: ${blocksGap}; align-items: center; max-width: ${containerMaxWidth}; width: 100%; padding: 0 2rem;\">${contentDiv}${imageDiv}</div>`;\n\n    return `<section ${blockIdAttr(block.id)} ${dataBlockIdAttr(block.id)} class=\"${sectionClasses}\" style=\"min-height: ${minHeight}; ${paddingStyle} display: flex; align-items: center; justify-content: ${justifyContent}; position: relative; overflow: hidden; ${splitBgStyle}\" data-variation=\"${escapeHtml(variation || variant || \"\")}\">${styleBlock}${innerHtml}</section>`;\n  }\n\n  // =========================================================================\n  // RENDER: Card Layout (supports both with and without Image Grid)\n  // Card always stays on the left (original position), Grid on the right\n  // =========================================================================\n  if (isCard && heroImage) {\n    const cardBg = background || \"#ffffff\";\n    const cardPadding = paddingY ? `${paddingY} 3rem` : \"6rem 3rem\";\n\n    // With Image Grid: Card on left + Grid on right (preserves original card position)\n    if (shouldShowImageGrid) {\n      const cardGridLayoutId = generateScopedId(block.id || \"\", \"hero-card-grid\");\n      const gridId = generateScopedId(block.id || \"\", \"hero-grid\");\n\n      const gridResult = exportImageGrid(\n        imageGridImages as ImageGridItem[],\n        imageGridPreset as ImageGridPreset,\n        imageGridGap as number,\n        imageRadius,\n        imageShadow,\n        gridId\n      );\n\n      const cardHtml = `<div class=\"sg-hero__card\" style=\"max-width: 500px; background: ${cardBg}; padding: 2rem; border-radius: 16px; box-shadow: 0 25px 50px rgba(0,0,0,0.25); position: relative; z-index: 2; text-align: ${align}; flex: 0 1 auto;\">${contentBlock}</div>`;\n      const gridWrapperHtml = `<div class=\"sg-hero__grid-wrapper\" data-block-group=\"Mídia\" style=\"position: relative; z-index: 3; display: flex; justify-content: center; align-items: center; flex: 0 1 auto; max-width: ${blocksMaxWidth};\">${gridResult.html}</div>`;\n\n      // Card always left, Grid always right\n      const innerHtml = `${cardHtml}${gridWrapperHtml}`;\n\n      // Responsive CSS\n      let layoutCss = `\n        @media (max-width: 1023px) {\n          #${cardGridLayoutId} {\n            flex-direction: column !important;\n            gap: 2rem !important;\n          }\n          #${cardGridLayoutId} .sg-hero__grid-wrapper {\n            order: -1;\n          }\n        }\n      `;\n      layoutCss += gridResult.css;\n\n      const cardGridLayoutHtml = `<style>${layoutCss}</style><div id=\"${cardGridLayoutId}\" class=\"sg-hero__card-grid-layout\" style=\"display: flex; width: 100%; max-width: ${containerMaxWidth}; align-items: center; justify-content: ${blocksJustify}; position: relative; z-index: 2; padding: 0 2rem; gap: ${blocksGap};\">${innerHtml}</div>`;\n\n      return `<section ${blockIdAttr(block.id)} ${dataBlockIdAttr(block.id)} class=\"${sectionClasses} sg-hero--with-grid\" style=\"min-height: ${minHeight}; padding: ${cardPadding}; display: flex; align-items: center; justify-content: center; background-image: url(${escapeHtml(heroImage)}); background-size: cover; background-position: center; position: relative; overflow: hidden;\" data-variation=\"${escapeHtml(variation || variant || \"\")}\">${styleBlock}${overlayHtml}${cardGridLayoutHtml}</section>`;\n    }\n\n    // Without Image Grid: Original card layout\n    const cardHtml = `\n      <div class=\"sg-hero__card\" style=\"max-width: ${contentMaxWidth}; width: 100%; background: ${cardBg}; padding: 2rem; border-radius: 16px; box-shadow: 0 25px 50px rgba(0,0,0,0.25); position: relative; z-index: 2; text-align: ${align};\">\n        ${contentBlock}\n      </div>\n    `;\n\n    return `<section ${blockIdAttr(block.id)} ${dataBlockIdAttr(block.id)} class=\"${sectionClasses}\" style=\"min-height: ${minHeight}; padding: ${cardPadding}; display: flex; align-items: center; justify-content: center; background-image: url(${escapeHtml(heroImage)}); background-size: cover; background-position: center; position: relative; overflow: hidden;\" data-variation=\"${escapeHtml(variation || variant || \"\")}\">${styleBlock}${overlayHtml}${cardHtml}</section>`;\n  }\n\n  // =========================================================================\n  // RENDER: With Image Grid (any variation) - Floating grid alongside content\n  // =========================================================================\n  if (shouldShowImageGrid) {\n    const gridLayoutId = generateScopedId(block.id || \"\", \"hero-grid-layout\");\n    const gridId = generateScopedId(block.id || \"\", \"hero-grid\");\n    const isGridLeft = imagePosition === \"left\";\n\n    const gridResult = exportImageGrid(\n      imageGridImages as ImageGridItem[],\n      imageGridPreset as ImageGridPreset,\n      imageGridGap as number,\n      imageRadius,\n      imageShadow,\n      gridId\n    );\n\n    const gridWrapperHtml = `<div class=\"sg-hero__grid-wrapper\" data-block-group=\"Mídia\" style=\"position: relative; z-index: 3; display: flex; justify-content: center; align-items: center; flex: 1 1 0%; max-width: ${blocksMaxWidth};\">${gridResult.html}</div>`;\n    const contentSideHtml = `<div class=\"sg-hero__content-side\" style=\"max-width: ${blocksMaxWidth}; flex: 1 1 0%; text-align: ${align}; position: relative; z-index: 2;\">${contentBlock}</div>`;\n\n    // Responsive CSS for the grid layout\n    let layoutCss = `\n      @media (max-width: 1023px) {\n        #${gridLayoutId} {\n          flex-direction: column !important;\n          gap: 2rem !important;\n        }\n        #${gridLayoutId} .sg-hero__grid-wrapper,\n        #${gridLayoutId} .sg-hero__content-side {\n          max-width: 100% !important;\n        }\n        #${gridLayoutId} .sg-hero__grid-wrapper {\n          order: -1;\n        }\n      }\n    `;\n    layoutCss += gridResult.css;\n\n    const innerHtml = isGridLeft\n      ? `${gridWrapperHtml}${contentSideHtml}`\n      : `${contentSideHtml}${gridWrapperHtml}`;\n\n    const gridLayoutHtml = `<style>${layoutCss}</style><div id=\"${gridLayoutId}\" class=\"sg-hero__grid-layout\" style=\"display: flex; justify-content: ${blocksJustify}; gap: ${blocksGap}; max-width: ${containerMaxWidth}; width: 100%; align-items: center; position: relative; z-index: 2; padding: 0 2rem;\">${innerHtml}</div>`;\n\n    return `<section ${blockIdAttr(block.id)} ${dataBlockIdAttr(block.id)} class=\"${sectionClasses} sg-hero--with-grid\" style=\"min-height: ${minHeight}; ${paddingStyle} display: flex; align-items: center; justify-content: ${justifyContent}; ${bgStyle} position: relative; overflow: hidden;\" data-variation=\"${escapeHtml(variation || variant || \"\")}\">${styleBlock}${overlayHtml}${waveHtml}${gridLayoutHtml}</section>`;\n  }\n\n  // =========================================================================\n  // RENDER: Default (centered, gradient, minimal, parallax, overlay)\n  // =========================================================================\n  const contentWrapHtml = `<div style=\"max-width: ${contentMaxWidth}; width: 100%; padding: 0 2rem; text-align: ${align}; position: relative; z-index: 2;\">${contentBlock}</div>`;\n\n  return `<section ${blockIdAttr(block.id)} ${dataBlockIdAttr(block.id)} class=\"${sectionClasses}\" style=\"min-height: ${minHeight}; ${paddingStyle} display: flex; align-items: center; justify-content: ${justifyContent}; ${bgStyle} position: relative; overflow: hidden;\" data-variation=\"${escapeHtml(variation || variant || \"\")}\">${styleBlock}${overlayHtml}${waveHtml}${contentWrapHtml}</section>`;\n}\n\n/**\n * Resolve hero button styles with independent customization for primary and secondary\n */\ninterface ButtonStylesConfig {\n  theme?: ThemeTokens;\n  blockId: string;\n  buttonSize: string;\n  primaryButtonVariant: string;\n  primaryButtonColor: string;\n  primaryButtonTextColor: string;\n  primaryButtonRadius: number;\n  secondaryButtonVariant: string;\n  secondaryButtonColor: string;\n  secondaryButtonTextColor: string;\n  secondaryButtonRadius: number;\n  hoverEffect: string;\n  hoverIntensity: number;\n  hoverOverlay: string;\n  hoverIconName: string;\n}\n\nfunction resolveHeroButtonStyles(config: ButtonStylesConfig): { primary: string; secondary: string; css: string } {\n  const {\n    blockId,\n    buttonSize,\n    primaryButtonVariant,\n    primaryButtonColor,\n    primaryButtonTextColor,\n    primaryButtonRadius,\n    secondaryButtonVariant,\n    secondaryButtonColor,\n    secondaryButtonTextColor,\n    secondaryButtonRadius,\n    hoverEffect,\n    hoverIntensity,\n    hoverOverlay,\n    hoverIconName,\n  } = config;\n\n  // Size-based styles\n  const sizeStyles: Record<string, { padding: string; fontSize: string }> = {\n    sm: { padding: \"0.625rem 1.25rem\", fontSize: \"0.875rem\" },\n    md: { padding: \"0.875rem 2rem\", fontSize: \"1rem\" },\n    lg: { padding: \"1rem 2.5rem\", fontSize: \"1.125rem\" },\n  };\n  const size = sizeStyles[buttonSize] || sizeStyles.md;\n\n  // Base button styles\n  const baseStyles = [\n    `padding: ${size.padding}`,\n    \"font-weight: 600\",\n    `font-size: ${size.fontSize}`,\n    \"text-decoration: none\",\n    \"display: inline-flex\",\n    \"align-items: center\",\n    \"justify-content: center\",\n    \"gap: 0.5rem\",\n    \"transition: all 0.2s ease\",\n    \"position: relative\",\n    \"overflow: hidden\",\n    \"cursor: pointer\",\n  ];\n\n  // Primary button styles\n  const primaryStyles = [...baseStyles, `border-radius: ${primaryButtonRadius}px`];\n  switch (primaryButtonVariant) {\n    case \"outline\":\n      primaryStyles.push(`background-color: transparent`, `border: 2px solid ${primaryButtonColor}`, `color: ${primaryButtonColor}`);\n      break;\n    case \"ghost\":\n      primaryStyles.push(`background-color: transparent`, `border: none`, `color: ${primaryButtonColor}`);\n      break;\n    default: // solid\n      primaryStyles.push(`background-color: ${primaryButtonColor}`, `border: 2px solid ${primaryButtonColor}`, `color: ${primaryButtonTextColor}`);\n  }\n\n  // Secondary button styles\n  const secondaryStyles = [...baseStyles, `border-radius: ${secondaryButtonRadius}px`];\n  switch (secondaryButtonVariant) {\n    case \"solid\":\n      secondaryStyles.push(`background-color: ${secondaryButtonColor}`, `border: 2px solid ${secondaryButtonColor}`, `color: ${secondaryButtonTextColor}`);\n      break;\n    case \"ghost\":\n      secondaryStyles.push(`background-color: transparent`, `border: none`, `color: ${secondaryButtonTextColor}`);\n      break;\n    default: // outline\n      secondaryStyles.push(`background-color: transparent`, `border: 2px solid ${secondaryButtonColor}`, `color: ${secondaryButtonTextColor}`);\n  }\n\n  const scope = blockId ? `[data-block-id=\"${blockId}\"]` : \"\";\n  let css = \"\";\n\n  // Hover effects\n  if (hoverEffect !== \"none\") {\n    // Primary button hover\n    const primaryHoverResult = generateButtonHoverStyles({\n      effect: hoverEffect as ButtonHoverEffect,\n      intensity: hoverIntensity,\n      buttonColor: primaryButtonColor,\n      buttonTextColor: primaryButtonVariant === \"solid\" ? primaryButtonTextColor : primaryButtonColor,\n      variant: primaryButtonVariant as \"solid\" | \"outline\" | \"ghost\",\n    });\n\n    // Secondary button hover\n    const secondaryHoverResult = generateButtonHoverStyles({\n      effect: hoverEffect as ButtonHoverEffect,\n      intensity: hoverIntensity,\n      buttonColor: secondaryButtonColor,\n      buttonTextColor: secondaryButtonVariant === \"solid\" ? secondaryButtonTextColor : secondaryButtonColor,\n      variant: secondaryButtonVariant as \"solid\" | \"outline\" | \"ghost\",\n    });\n\n    if (primaryHoverResult.base) {\n      css += `${scope} .sg-hero__btn--primary { ${primaryHoverResult.base} }\\n`;\n    }\n    if (secondaryHoverResult.base) {\n      css += `${scope} .sg-hero__btn--secondary { ${secondaryHoverResult.base} }\\n`;\n    }\n\n    css += `\n      ${scope} .sg-hero__btn--primary:hover { ${primaryHoverResult.hover} }\n      ${scope} .sg-hero__btn--secondary:hover { ${secondaryHoverResult.hover} }\n    `;\n\n    css += getButtonHoverKeyframes();\n  }\n\n  // Overlay effects\n  if (hoverOverlay && hoverOverlay !== \"none\") {\n    css += generateButtonOverlayCSS(`${scope} .sg-hero__btn--primary`, {\n      overlay: hoverOverlay as ButtonHoverOverlay,\n      primaryColor: primaryButtonColor,\n      iconName: hoverIconName,\n      textColor: primaryButtonVariant === \"solid\" ? primaryButtonTextColor : primaryButtonColor,\n    });\n    css += generateButtonOverlayCSS(`${scope} .sg-hero__btn--secondary`, {\n      overlay: hoverOverlay as ButtonHoverOverlay,\n      primaryColor: secondaryButtonColor,\n      iconName: hoverIconName,\n      textColor: secondaryButtonVariant === \"solid\" ? secondaryButtonTextColor : secondaryButtonColor,\n    });\n  }\n\n  return {\n    primary: primaryStyles.join(\"; \"),\n    secondary: secondaryStyles.join(\"; \"),\n    css,\n  };\n}\n\n"],"names":["exportHero","block","depth","basePath","theme","variation","variant","title","subtitle","description","primaryButton","secondaryButton","badge","align","contentPosition","contentSpacing","blockGap","minHeight","image","overlay","overlayColor","background","titleColor","subtitleColor","descriptionColor","titleTypography","subtitleTypography","descriptionTypography","badgeColor","badgeTextColor","contentMaxWidth","paddingY","imageRadius","imageShadow","imagePosition","buttonSize","primaryButtonVariant","primaryButtonColor","primaryButtonTextColor","primaryButtonRadius","secondaryButtonVariant","secondaryButtonColor","secondaryButtonTextColor","secondaryButtonRadius","buttonHoverEffect","buttonHoverIntensity","buttonHoverOverlay","buttonHoverIconName","showWave","waveColor","imageGridEnabled","imageGridPreset","imageGridImages","imageGridGap","carouselImages","carouselInterval","carouselTransition","heroImage","PLACEHOLDER_IMAGE_URL","isSplit","isParallax","isOverlayVariant","isGradient","isMinimal","isCard","isCarousel","isImageBg","isOverlay","hasDarkBg","themePrimaryColor","themePrimaryText","defaultTextColor","defaultMutedColor","mergedTitleTypo","mergeTypographyWithDefaults","heroTitleDefaults","mergedSubtitleTypo","heroSubtitleDefaults","mergedDescriptionTypo","heroDescriptionDefaults","titleTypoStyles","generateTypographyStyles","subtitleTypoStyles","descriptionTypoStyles","finalBadgeColor","finalBadgeTextColor","finalPrimaryBtnColor","finalPrimaryBtnTextColor","finalSecondaryBtnColor","finalSecondaryBtnTextColor","sectionClasses","bgStyle","escapeHtml","paddingStyle","justifyContent","contentPositionMap","spacingMap","spacing","blocksConfig","blockGapConfig","blocksJustify","blocksMaxWidth","containerMaxWidth","blocksGap","overlayStyle","overlayHtml","waveHtml","badgeHtml","titleFontSize","titleHtml","subtitleFontSize","subtitleHtml","descHtml","buttonStyles","resolveHeroButtonStyles","primaryHref","resolveHref","secondaryHref","primaryBtnHtml","linkTargetAttr","secondaryBtnHtml","buttonsHtml","textContentHtml","contentBlock","styleBlock","imgFallback","exportImageGrid","images","preset","gap","radius","shadow","gridId","config","gridPresetMap","itemsHtml","pos","idx","img","imgSrc","imgAlt","imgScale","scaleStyle","gridHtml","gridCss","hasValidGridImages","shouldShowImageGrid","resolvedImages","CAROUSEL_PLACEHOLDER_IMAGES","carouselScopeId","generateScopedId","carouselCss","generateCarouselCSS","carouselImagesHtml","i","dotsHtml","carouselOverlayStyle","carouselOverlayHtml","carouselContentHtml","allCss","blockIdAttr","dataBlockIdAttr","splitId","isImageLeft","imgShadow","imageShadowMap","splitCss","splitBgStyle","imgStyle","imageDiv","contentDiv","innerHtml","cardBg","cardPadding","cardGridLayoutId","gridResult","cardHtml","gridWrapperHtml","layoutCss","cardGridLayoutHtml","gridLayoutId","isGridLeft","contentSideHtml","gridLayoutHtml","contentWrapHtml","blockId","hoverEffect","hoverIntensity","hoverOverlay","hoverIconName","sizeStyles","size","baseStyles","primaryStyles","secondaryStyles","scope","css","primaryHoverResult","generateButtonHoverStyles","secondaryHoverResult","getButtonHoverKeyframes","generateButtonOverlayCSS"],"mappings":"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"}

package/dist/engine/export/exporters/sections/MarketingExporters.js

@@ -1,43 +1,43 @@
-import { dataBlockIdAttr as $, escapeHtml as e, resolveHref as G, linkTargetAttr as R, blockIdAttr as w } from "../../shared/htmlHelpers.js";
-import { generateScopedId as H } from "../../shared/idGenerator.js";
-import { resolveResponsiveColumns as C, generateResponsiveGridStyles as B } from "../../shared/responsiveGridHelper.js";
-import { generateButtonHoverStyles as A, generateButtonOverlayCSS as E, getButtonHoverKeyframes as J } from "../../../shared/hoverEffects/buttonHover.js";
+import { dataBlockIdAttr as $, escapeHtml as e, resolveHref as E, linkTargetAttr as F, blockIdAttr as w } from "../../shared/htmlHelpers.js";
+import { generateScopedId as C } from "../../shared/idGenerator.js";
+import { resolveResponsiveColumns as k, generateResponsiveGridStyles as S } from "../../shared/responsiveGridHelper.js";
+import { generateButtonHoverStyles as G, generateButtonOverlayCSS as R, getButtonHoverKeyframes as J } from "../../../shared/hoverEffects/buttonHover.js";
 function Z(t, p, l, m) {
-  const { icon: n, title: i, description: r } = t.props, o = n ? '<div style="width: 3rem; height: 3rem; background-color: var(--sg-primary); border-radius: 0.75rem; display: flex; align-items: center; justify-content: center; margin: 0 auto 1rem; color: #fff;">[★]</div>' : "";
-  return `<div ${$(t.id)} style="padding: 1.5rem; text-align: center;">${o}<h3 style="font-size: 1.25rem; font-weight: 600; margin-bottom: 0.5rem;">${e(i)}</h3><p style="color: var(--sg-muted-text); font-size: 0.875rem;">${e(r)}</p></div>`;
+  const { icon: n, title: o, description: r } = t.props, i = n ? '<div style="width: 3rem; height: 3rem; background-color: var(--sg-primary); border-radius: 0.75rem; display: flex; align-items: center; justify-content: center; margin: 0 auto 1rem; color: #fff;">[★]</div>' : "";
+  return `<div ${$(t.id)} data-block-group="Conteúdo" style="padding: 1.5rem; text-align: center;">${i}<h3 style="font-size: 1.25rem; font-weight: 600; margin-bottom: 0.5rem;">${e(o)}</h3><p style="color: var(--sg-muted-text); font-size: 0.875rem;">${e(r)}</p></div>`;
 }
 function tt(t, p, l, m, n) {
   const {
-    title: i,
+    title: o,
     subtitle: r,
-    columns: o = 3,
-    variant: s = "default",
-    features: a = []
-  } = t.props, d = H(t.id || "", "feature-grid"), v = C(o, 1, 2, o), { inlineStyles: g, mediaQueries: y } = B(d, v, "2rem"), u = s === "image-cards", f = i || r ? `<div style="text-align: center; margin-bottom: 3rem;">${i ? `<h2 style="font-size: var(--sg-heading-h2); margin-bottom: 0.5rem;">${e(i)}</h2>` : ""}${r ? `<p style="color: var(--sg-muted-text); font-size: 1.125rem;">${e(r)}</p>` : ""}</div>` : "", z = a.map((c) => {
-    const h = u && c.image ? `<div style="width: 100%; height: 200px; background-image: url(${e(c.image)}); background-size: cover; background-position: center;"></div>` : "", b = !u && c.icon ? '<div style="width: 3rem; height: 3rem; background-color: var(--sg-primary); border-radius: 0.75rem; display: flex; align-items: center; justify-content: center; margin-bottom: 1rem; color: #fff;">[★]</div>' : "", _ = c.link ? `<a href="${e(c.link.href || "#")}" style="display: inline-block; margin-top: 0.75rem; color: var(--sg-primary); font-weight: 500; text-decoration: none; border: 1px solid var(--sg-primary); padding: 0.5rem 1rem; border-radius: var(--sg-button-radius);">${e(c.link.text)}</a>` : "", S = u && c.image ? "1.5rem" : "2rem";
-    return `<div style="background-color: var(--sg-bg); border-radius: 0.75rem; padding: ${u && c.image ? 0 : "2rem"}; box-shadow: var(--sg-card-shadow); overflow: hidden;">${h}<div style="padding: ${S};">${b}<h3 style="font-size: 1.25rem; font-weight: 600; margin-bottom: 0.5rem;">${e(c.title)}</h3><p style="color: var(--sg-muted-text);">${e(c.description)}</p>${_}</div></div>`;
+    columns: i = 3,
+    variant: a = "default",
+    features: s = []
+  } = t.props, d = C(t.id || "", "feature-grid"), u = k(i, 1, 2, i), { inlineStyles: g, mediaQueries: v } = S(d, u, "2rem"), y = a === "image-cards", f = o || r ? `<div data-block-group="Conteúdo" style="text-align: center; margin-bottom: 3rem;">${o ? `<h2 style="font-size: var(--sg-heading-h2); margin-bottom: 0.5rem;">${e(o)}</h2>` : ""}${r ? `<p style="color: var(--sg-muted-text); font-size: 1.125rem;">${e(r)}</p>` : ""}</div>` : "", z = s.map((c) => {
+    const h = y && c.image ? `<div style="width: 100%; height: 200px; background-image: url(${e(c.image)}); background-size: cover; background-position: center;"></div>` : "", b = !y && c.icon ? '<div style="width: 3rem; height: 3rem; background-color: var(--sg-primary); border-radius: 0.75rem; display: flex; align-items: center; justify-content: center; margin-bottom: 1rem; color: #fff;">[★]</div>' : "", B = c.link ? `<a href="${e(c.link.href || "#")}" style="display: inline-block; margin-top: 0.75rem; color: var(--sg-primary); font-weight: 500; text-decoration: none; border: 1px solid var(--sg-primary); padding: 0.5rem 1rem; border-radius: var(--sg-button-radius);">${e(c.link.text)}</a>` : "", H = y && c.image ? "1.5rem" : "2rem";
+    return `<div style="background-color: var(--sg-bg); border-radius: 0.75rem; padding: ${y && c.image ? 0 : "2rem"}; box-shadow: var(--sg-card-shadow); overflow: hidden;">${h}<div style="padding: ${H};">${b}<h3 style="font-size: 1.25rem; font-weight: 600; margin-bottom: 0.5rem;">${e(c.title)}</h3><p style="color: var(--sg-muted-text);">${e(c.description)}</p>${B}</div></div>`;
   }).join("");
-  return `<style>${y}</style><section ${w(t.id)} ${$(t.id)} style="padding: 4rem 0; background-color: var(--sg-surface);"><div style="max-width: 1200px; margin: 0 auto; padding: 0 1rem;">${f}<div id="${d}" style="${g}">${z}</div></div></section>`;
+  return `<style>${v}</style><section ${w(t.id)} ${$(t.id)} style="padding: 4rem 0; background-color: var(--sg-surface);"><div style="max-width: 1200px; margin: 0 auto; padding: 0 1rem;">${f}<div data-block-group="Layout" id="${d}" style="${g}">${z}</div></div></section>`;
 }
 function et(t, p, l, m) {
   const {
     title: n,
-    description: i,
+    description: o,
     primaryButton: r,
-    secondaryButton: o,
-    variant: s = "centered",
+    secondaryButton: i,
+    variant: a = "centered",
     // Button size
-    buttonSize: a = "md",
+    buttonSize: s = "md",
     // Button hover effects
     buttonHoverEffect: d = "scale",
-    buttonHoverIntensity: v = 50,
+    buttonHoverIntensity: u = 50,
     buttonHoverOverlay: g = "none",
-    buttonHoverIconName: y = "arrow-right"
-  } = t.props, u = {
+    buttonHoverIconName: v = "arrow-right"
+  } = t.props, y = {
     sm: { padding: "0.5rem 1rem", fontSize: "0.875rem" },
     md: { padding: "0.75rem 1.5rem", fontSize: "1rem" },
     lg: { padding: "1rem 2rem", fontSize: "1.125rem" }
-  }, f = u[a] || u.md, z = H(t.id || "", "cta-actions"), c = `[data-block-id="${t.id}"]`, h = s === "gradient", b = m?.colors?.primary || "#3b82f6", _ = m?.colors?.primaryText || "#ffffff", S = h ? "#fff" : b, I = h ? b : _, N = "transparent", q = h ? "#fff" : b, P = h ? "#fff" : b;
+  }, f = y[s] || y.md, z = C(t.id || "", "cta-actions"), c = `[data-block-id="${t.id}"]`, h = a === "gradient", b = m?.colors?.primary || "#3b82f6", B = m?.colors?.primaryText || "#ffffff", H = h ? "#fff" : b, I = h ? b : B, L = "transparent", q = h ? "#fff" : b, P = h ? "#fff" : b;
   let x = `
     @media (max-width: 640px) {
       #${z} {
@@ -51,68 +51,68 @@ function et(t, p, l, m) {
     }
   `;
   if (d !== "none") {
-    const j = A({
+    const _ = G({
       effect: d,
-      intensity: v,
-      buttonColor: S,
+      intensity: u,
+      buttonColor: H,
       variant: "solid"
-    }), k = A({
+    }), j = G({
       effect: d,
-      intensity: v,
+      intensity: u,
       buttonColor: P,
       variant: "outline"
     });
-    j.base && (x += `
+    _.base && (x += `
         ${c} .sg-cta__btn--primary {
-          ${j.base}
+          ${_.base}
         }
-      `), k.base && (x += `
+      `), j.base && (x += `
         ${c} .sg-cta__btn--secondary {
-          ${k.base}
+          ${j.base}
         }
       `), x += `
       ${c} .sg-cta__btn--primary:hover {
-        ${j.hover}
+        ${_.hover}
       }
       ${c} .sg-cta__btn--secondary:hover {
-        ${k.hover}
+        ${j.hover}
       }
     `, x += J();
   }
-  g && g !== "none" && (x += E(`${c} .sg-cta__btn--primary`, {
+  g && g !== "none" && (x += R(`${c} .sg-cta__btn--primary`, {
     overlay: g,
     primaryColor: b,
-    iconName: y,
+    iconName: v,
     textColor: I
-  }), x += E(`${c} .sg-cta__btn--secondary`, {
+  }), x += R(`${c} .sg-cta__btn--secondary`, {
     overlay: g,
     primaryColor: b,
-    iconName: y,
+    iconName: v,
     textColor: q
   }));
-  const Q = h ? "background: linear-gradient(135deg, var(--sg-primary), var(--sg-accent));" : "background-color: var(--sg-surface);", L = h ? "#fff" : "var(--sg-text)", M = h ? "rgba(255,255,255,0.9)" : "var(--sg-muted-text)", T = r ? G(r.href || "#", l) : "#", F = o ? G(o.href || "#", l) : "#", O = `padding: ${f.padding}; font-size: ${f.fontSize}; background-color: ${S}; color: ${I}; border-radius: var(--sg-button-radius); text-decoration: none; font-weight: 500; display: inline-block; transition: all 0.2s ease; position: relative; overflow: hidden;`, D = `padding: ${f.padding}; font-size: ${f.fontSize}; background-color: ${N}; color: ${q}; border: 2px solid ${P}; border-radius: var(--sg-button-radius); text-decoration: none; font-weight: 500; display: inline-block; transition: all 0.2s ease; position: relative; overflow: hidden;`, K = r ? `<a href="${e(T)}"${R(T, l)} class="sg-cta__btn sg-cta__btn--primary" style="${O}">${e(r.text)}</a>` : "", U = o ? `<a href="${e(F)}"${R(F, l)} class="sg-cta__btn sg-cta__btn--secondary" style="${D}">${e(o.text)}</a>` : "";
-  return `<style>${x}</style><section ${w(t.id)} ${$(t.id)} style="padding: 4rem 0; ${Q} text-align: center;"><div style="max-width: 800px; margin: 0 auto; padding: 0 1rem;"><h2 style="font-size: var(--sg-heading-h2); margin-bottom: 1rem; color: ${L};">${e(n)}</h2>${i ? `<p style="font-size: 1.125rem; margin-bottom: 2rem; color: ${M};">${e(i)}</p>` : ""}<div id="${z}" style="display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap;">${K}${U}</div></div></section>`;
+  const N = h ? "background: linear-gradient(135deg, var(--sg-primary), var(--sg-accent));" : "background-color: var(--sg-surface);", Q = h ? "#fff" : "var(--sg-text)", M = h ? "rgba(255,255,255,0.9)" : "var(--sg-muted-text)", T = r ? E(r.href || "#", l) : "#", A = i ? E(i.href || "#", l) : "#", O = `padding: ${f.padding}; font-size: ${f.fontSize}; background-color: ${H}; color: ${I}; border-radius: var(--sg-button-radius); text-decoration: none; font-weight: 500; display: inline-block; transition: all 0.2s ease; position: relative; overflow: hidden;`, D = `padding: ${f.padding}; font-size: ${f.fontSize}; background-color: ${L}; color: ${q}; border: 2px solid ${P}; border-radius: var(--sg-button-radius); text-decoration: none; font-weight: 500; display: inline-block; transition: all 0.2s ease; position: relative; overflow: hidden;`, K = r ? `<a href="${e(T)}"${F(T, l)} class="sg-cta__btn sg-cta__btn--primary" style="${O}">${e(r.text)}</a>` : "", U = i ? `<a href="${e(A)}"${F(A, l)} class="sg-cta__btn sg-cta__btn--secondary" style="${D}">${e(i.text)}</a>` : "";
+  return `<style>${x}</style><section ${w(t.id)} ${$(t.id)} style="padding: 4rem 0; ${N} text-align: center;"><div style="max-width: 800px; margin: 0 auto; padding: 0 1rem;"><div data-block-group="Conteúdo"><h2 style="font-size: var(--sg-heading-h2); margin-bottom: 1rem; color: ${Q};">${e(n)}</h2>${o ? `<p style="font-size: 1.125rem; margin-bottom: 2rem; color: ${M};">${e(o)}</p>` : ""}</div><div data-block-group="Botoes" id="${z}" style="display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap;">${K}${U}</div></div></section>`;
 }
 function rt(t, p, l, m) {
   const {
     name: n,
-    price: i,
+    price: o,
     period: r,
-    description: o,
-    features: s = [],
-    buttonText: a,
+    description: i,
+    features: a = [],
+    buttonText: s,
     highlighted: d,
-    badge: v
-  } = t.props, g = v ? `<span style="position: absolute; top: -0.75rem; right: 1rem; background-color: var(--sg-primary); color: #fff; padding: 0.25rem 0.75rem; border-radius: 9999px; font-size: 0.75rem;">${e(v)}</span>` : "", y = s.map(
+    badge: u
+  } = t.props, g = u ? `<span style="position: absolute; top: -0.75rem; right: 1rem; background-color: var(--sg-primary); color: #fff; padding: 0.25rem 0.75rem; border-radius: 9999px; font-size: 0.75rem;">${e(u)}</span>` : "", v = a.map(
     (f) => `<li style="padding: 0.5rem 0; display: flex; align-items: center; gap: 0.5rem;"><span style="color: var(--sg-success);">✓</span>${e(f)}</li>`
-  ).join(""), u = d ? "background-color: var(--sg-primary); color: var(--sg-primary-text); border: none;" : "background-color: transparent; color: var(--sg-primary); border: 1px solid var(--sg-primary);";
-  return `<div ${$(t.id)} style="background-color: var(--sg-bg); border-radius: 0.75rem; padding: 2rem; box-shadow: ${d ? "var(--sg-shadow-strong)" : "var(--sg-card-shadow)"}; border: ${d ? "2px solid var(--sg-primary)" : "1px solid var(--sg-border)"}; position: relative;">${g}<h3 style="font-size: 1.25rem; font-weight: 600; margin-bottom: 0.5rem;">${e(n)}</h3>${o ? `<p style="color: var(--sg-muted-text); margin-bottom: 1rem;">${e(o)}</p>` : ""}<div style="margin-bottom: 1.5rem;"><span style="font-size: 2.5rem; font-weight: 700;">${e(i)}</span>${r ? `<span style="color: var(--sg-muted-text);">${e(r)}</span>` : ""}</div><ul style="list-style: none; padding: 0; margin-bottom: 1.5rem;">${y}</ul>${a ? `<button style="width: 100%; padding: 0.625rem 1.25rem; ${u} border-radius: var(--sg-button-radius); font-weight: 500; cursor: pointer;">${e(a)}</button>` : ""}</div>`;
+  ).join(""), y = d ? "background-color: var(--sg-primary); color: var(--sg-primary-text); border: none;" : "background-color: transparent; color: var(--sg-primary); border: 1px solid var(--sg-primary);";
+  return `<div ${$(t.id)} data-block-group="Conteúdo" style="background-color: var(--sg-bg); border-radius: 0.75rem; padding: 2rem; box-shadow: ${d ? "var(--sg-shadow-strong)" : "var(--sg-card-shadow)"}; border: ${d ? "2px solid var(--sg-primary)" : "1px solid var(--sg-border)"}; position: relative;">${g}<h3 style="font-size: 1.25rem; font-weight: 600; margin-bottom: 0.5rem;">${e(n)}</h3>${i ? `<p style="color: var(--sg-muted-text); margin-bottom: 1rem;">${e(i)}</p>` : ""}<div style="margin-bottom: 1.5rem;"><span style="font-size: 2.5rem; font-weight: 700;">${e(o)}</span>${r ? `<span style="color: var(--sg-muted-text);">${e(r)}</span>` : ""}</div><ul style="list-style: none; padding: 0; margin-bottom: 1.5rem;">${v}</ul>${s ? `<button style="width: 100%; padding: 0.625rem 1.25rem; ${y} border-radius: var(--sg-button-radius); font-weight: 500; cursor: pointer;">${e(s)}</button>` : ""}</div>`;
 }
-function it(t, p, l, m, n) {
-  const { title: i, subtitle: r, plans: o = [] } = t.props, s = H(t.id || "", "pricing-grid"), a = Math.min(o.length, 4), d = C({ lg: a }, 1, 2, a), { inlineStyles: v, mediaQueries: g } = B(s, d, "2rem", "align-items: start;"), y = i || r ? `<div style="text-align: center; margin-bottom: 3rem;">${i ? `<h2 style="font-size: var(--sg-heading-h2); margin-bottom: 0.5rem;">${e(i)}</h2>` : ""}${r ? `<p style="color: var(--sg-muted-text); font-size: 1.125rem;">${e(r)}</p>` : ""}</div>` : "";
+function ot(t, p, l, m, n) {
+  const { title: o, subtitle: r, plans: i = [] } = t.props, a = C(t.id || "", "pricing-grid"), s = Math.min(i.length, 4), d = k({ lg: s }, 1, 2, s), { inlineStyles: u, mediaQueries: g } = S(a, d, "2rem", "align-items: start;"), v = o || r ? `<div data-block-group="Conteúdo" style="text-align: center; margin-bottom: 3rem;">${o ? `<h2 style="font-size: var(--sg-heading-h2); margin-bottom: 0.5rem;">${e(o)}</h2>` : ""}${r ? `<p style="color: var(--sg-muted-text); font-size: 1.125rem;">${e(r)}</p>` : ""}</div>` : "";
   if (!n)
     throw new Error("exportPricing requires renderChild function");
-  const u = o.map(
+  const y = i.map(
     (f) => n(
       { id: `${t.id}-plan`, type: "pricingCard", props: f },
       p + 1,
@@ -120,29 +120,29 @@ function it(t, p, l, m, n) {
       m
     )
   ).join("");
-  return `<style>${g}</style><section ${w(t.id)} ${$(t.id)} style="padding: 4rem 0; background-color: var(--sg-bg);"><div style="max-width: 1200px; margin: 0 auto; padding: 0 1rem;">${y}<div id="${s}" style="${v}">${u}</div></div></section>`;
+  return `<style>${g}</style><section ${w(t.id)} ${$(t.id)} style="padding: 4rem 0; background-color: var(--sg-bg);"><div style="max-width: 1200px; margin: 0 auto; padding: 0 1rem;">${v}<div id="${a}" style="${u}">${y}</div></div></section>`;
 }
-function ot(t, p, l, m) {
+function it(t, p, l, m) {
   const {
     quote: n,
-    authorName: i,
+    authorName: o,
     authorRole: r,
-    authorCompany: o,
-    authorAvatar: s,
-    rating: a
-  } = t.props, d = a ? `<div style="margin-bottom: 1rem; color: #fbbf24;">${"★".repeat(a)}</div>` : "", v = s ? `<img src="${e(s)}" alt="${e(i)}" style="width: 3rem; height: 3rem; border-radius: 50%; object-fit: cover;" />` : `<div style="width: 3rem; height: 3rem; border-radius: 50%; background-color: var(--sg-primary); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 600;">${i ? i.split(" ").map((g) => g[0]).join("").toUpperCase().slice(0, 2) : "?"}</div>`;
-  return `<div ${$(t.id)} style="background-color: var(--sg-surface); border-radius: var(--sg-card-radius); padding: 2rem;">${d}<blockquote style="font-size: 1rem; margin-bottom: 1.5rem; font-style: italic;">"${e(n)}"</blockquote><div style="display: flex; align-items: center; gap: 1rem;">${v}<div><div style="font-weight: 600;">${e(i)}</div>${r || o ? `<div style="color: var(--sg-muted-text); font-size: 0.875rem;">${e(r || "")}${r && o ? ", " : ""}${e(o || "")}</div>` : ""}</div></div></div>`;
+    authorCompany: i,
+    authorAvatar: a,
+    rating: s
+  } = t.props, d = s ? `<div data-block-group="Estilo" style="margin-bottom: 1rem; color: #fbbf24;">${"★".repeat(s)}</div>` : "", u = a ? `<img src="${e(a)}" alt="${e(o)}" style="width: 3rem; height: 3rem; border-radius: 50%; object-fit: cover;" />` : `<div style="width: 3rem; height: 3rem; border-radius: 50%; background-color: var(--sg-primary); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 600;">${o ? o.split(" ").map((g) => g[0]).join("").toUpperCase().slice(0, 2) : "?"}</div>`;
+  return `<div ${$(t.id)} style="background-color: var(--sg-surface); border-radius: var(--sg-card-radius); padding: 2rem;">${d}<blockquote data-block-group="Conteúdo" style="font-size: 1rem; margin-bottom: 1.5rem; font-style: italic;">"${e(n)}"</blockquote><div data-block-group="Autor" style="display: flex; align-items: center; gap: 1rem;">${u}<div><div style="font-weight: 600;">${e(o)}</div>${r || i ? `<div style="color: var(--sg-muted-text); font-size: 0.875rem;">${e(r || "")}${r && i ? ", " : ""}${e(i || "")}</div>` : ""}</div></div></div>`;
 }
 function nt(t, p, l, m, n) {
   const {
-    title: i,
+    title: o,
     subtitle: r,
-    columns: o = 3,
-    testimonials: s = []
-  } = t.props, a = H(t.id || "", "testimonial-grid"), d = C(o, 1, 2, o), { inlineStyles: v, mediaQueries: g } = B(a, d, "2rem"), y = i || r ? `<div style="text-align: center; margin-bottom: 3rem;">${i ? `<h2 style="font-size: var(--sg-heading-h2); margin-bottom: 0.5rem;">${e(i)}</h2>` : ""}${r ? `<p style="color: var(--sg-muted-text); font-size: 1.125rem;">${e(r)}</p>` : ""}</div>` : "";
+    columns: i = 3,
+    testimonials: a = []
+  } = t.props, s = C(t.id || "", "testimonial-grid"), d = k(i, 1, 2, i), { inlineStyles: u, mediaQueries: g } = S(s, d, "2rem"), v = o || r ? `<div data-block-group="Conteúdo" style="text-align: center; margin-bottom: 3rem;">${o ? `<h2 style="font-size: var(--sg-heading-h2); margin-bottom: 0.5rem;">${e(o)}</h2>` : ""}${r ? `<p style="color: var(--sg-muted-text); font-size: 1.125rem;">${e(r)}</p>` : ""}</div>` : "";
   if (!n)
     throw new Error("exportTestimonialGrid requires renderChild function");
-  const u = s.map(
+  const y = a.map(
     (f) => n(
       { id: `${t.id}-t`, type: "testimonial", props: f },
       p + 1,
@@ -150,17 +150,17 @@ function nt(t, p, l, m, n) {
       m
     )
   ).join("");
-  return `<style>${g}</style><section ${w(t.id)} ${$(t.id)} style="padding: 4rem 0; background-color: var(--sg-bg);"><div style="max-width: 1200px; margin: 0 auto; padding: 0 1rem;">${y}<div id="${a}" style="${v}">${u}</div></div></section>`;
+  return `<style>${g}</style><section ${w(t.id)} ${$(t.id)} style="padding: 4rem 0; background-color: var(--sg-bg);"><div style="max-width: 1200px; margin: 0 auto; padding: 0 1rem;">${v}<div data-block-group="Layout" id="${s}" style="${u}">${y}</div></div></section>`;
 }
-function st(t, p, l, m) {
-  const { question: n, answer: i } = t.props;
-  return `<details ${$(t.id)} style="border-bottom: 1px solid var(--sg-border); padding: 1rem 0;"><summary style="font-weight: 600; cursor: pointer; display: flex; justify-content: space-between; align-items: center;">${e(n)}<span>+</span></summary><p style="margin-top: 1rem; color: var(--sg-muted-text);">${e(i)}</p></details>`;
+function at(t, p, l, m) {
+  const { question: n, answer: o } = t.props;
+  return `<details ${$(t.id)} data-block-group="Conteúdo" style="border-bottom: 1px solid var(--sg-border); padding: 1rem 0;"><summary style="font-weight: 600; cursor: pointer; display: flex; justify-content: space-between; align-items: center;">${e(n)}<span>+</span></summary><p style="margin-top: 1rem; color: var(--sg-muted-text);">${e(o)}</p></details>`;
 }
-function at(t, p, l, m, n) {
-  const { title: i, subtitle: r, items: o = [] } = t.props, s = i || r ? `<div style="text-align: center; margin-bottom: 3rem;">${i ? `<h2 style="font-size: var(--sg-heading-h2); margin-bottom: 0.5rem;">${e(i)}</h2>` : ""}${r ? `<p style="color: var(--sg-muted-text); font-size: 1.125rem;">${e(r)}</p>` : ""}</div>` : "";
+function st(t, p, l, m, n) {
+  const { title: o, subtitle: r, items: i = [] } = t.props, a = o || r ? `<div data-block-group="Conteúdo" style="text-align: center; margin-bottom: 3rem;">${o ? `<h2 style="font-size: var(--sg-heading-h2); margin-bottom: 0.5rem;">${e(o)}</h2>` : ""}${r ? `<p style="color: var(--sg-muted-text); font-size: 1.125rem;">${e(r)}</p>` : ""}</div>` : "";
   if (!n)
     throw new Error("exportFaq requires renderChild function");
-  const a = o.map(
+  const s = i.map(
     (d) => n(
       { id: `${t.id}-faq`, type: "faqItem", props: d },
       p + 1,
@@ -168,51 +168,51 @@ function at(t, p, l, m, n) {
       m
     )
   ).join("");
-  return `<section ${w(t.id)} ${$(t.id)} style="padding: 4rem 0; background-color: var(--sg-bg);"><div style="max-width: 800px; margin: 0 auto; padding: 0 1rem;">${s}<div>${a}</div></div></section>`;
+  return `<section ${w(t.id)} ${$(t.id)} style="padding: 4rem 0; background-color: var(--sg-bg);"><div style="max-width: 800px; margin: 0 auto; padding: 0 1rem;">${a}<div>${s}</div></div></section>`;
 }
 function dt(t, p, l, m) {
-  const { title: n, subtitle: i, items: r = [] } = t.props, o = H(t.id || "", "stats-grid"), s = C({ lg: r.length }, 1, 2, r.length), { inlineStyles: a, mediaQueries: d } = B(o, s, "2rem", "text-align: center;"), v = n || i ? `<div style="text-align: center; margin-bottom: 3rem;">${n ? `<h2 style="font-size: var(--sg-heading-h2); margin-bottom: 0.5rem;">${e(n)}</h2>` : ""}${i ? `<p style="color: var(--sg-muted-text); font-size: 1.125rem;">${e(i)}</p>` : ""}</div>` : "", g = r.map(
-    (y) => `<div style="text-align: center;"><div style="font-size: 3rem; font-weight: 700; color: var(--sg-primary);">${e(y.prefix || "")}${e(y.value)}${e(y.suffix || "")}</div><div style="color: var(--sg-muted-text);">${e(y.label)}</div></div>`
+  const { title: n, subtitle: o, items: r = [] } = t.props, i = C(t.id || "", "stats-grid"), a = k({ lg: r.length }, 1, 2, r.length), { inlineStyles: s, mediaQueries: d } = S(i, a, "2rem", "text-align: center;"), u = n || o ? `<div style="text-align: center; margin-bottom: 3rem;">${n ? `<h2 style="font-size: var(--sg-heading-h2); margin-bottom: 0.5rem;">${e(n)}</h2>` : ""}${o ? `<p style="color: var(--sg-muted-text); font-size: 1.125rem;">${e(o)}</p>` : ""}</div>` : "", g = r.map(
+    (v) => `<div style="text-align: center;"><div style="font-size: 3rem; font-weight: 700; color: var(--sg-primary);">${e(v.prefix || "")}${e(v.value)}${e(v.suffix || "")}</div><div style="color: var(--sg-muted-text);">${e(v.label)}</div></div>`
   ).join("");
-  return `<style>${d}</style><section ${w(t.id)} ${$(t.id)} style="padding: 4rem 0; background-color: var(--sg-surface);"><div style="max-width: 1200px; margin: 0 auto; padding: 0 1rem;">${v}<div id="${o}" style="${a}">${g}</div></div></section>`;
+  return `<style>${d}</style><section ${w(t.id)} ${$(t.id)} style="padding: 4rem 0; background-color: var(--sg-surface);"><div style="max-width: 1200px; margin: 0 auto; padding: 0 1rem;">${u}<div id="${i}" style="${s}">${g}</div></div></section>`;
 }
 function lt(t, p, l, m) {
-  const { value: n, label: i, prefix: r, suffix: o } = t.props;
-  return `<div ${$(t.id)} style="text-align: center;"><div style="font-size: 2.5rem; font-weight: 700; color: var(--sg-primary);">${e(r || "")}${e(n)}${e(o || "")}</div><div style="color: var(--sg-muted-text);">${e(i)}</div></div>`;
+  const { value: n, label: o, prefix: r, suffix: i } = t.props;
+  return `<div ${$(t.id)} style="text-align: center;"><div style="font-size: 2.5rem; font-weight: 700; color: var(--sg-primary);">${e(r || "")}${e(n)}${e(i || "")}</div><div style="color: var(--sg-muted-text);">${e(o)}</div></div>`;
 }
 function mt(t, p, l, m) {
-  const { title: n, logos: i = [], grayscale: r } = t.props, o = n ? `<p style="color: var(--sg-muted-text); margin-bottom: 2rem;">${e(n)}</p>` : "", s = i.map(
-    (a) => `<img src="${e(a.src)}" alt="${e(a.alt)}" style="height: 2rem; object-fit: contain; ${r ? "filter: grayscale(100%); opacity: 0.6;" : ""}" />`
+  const { title: n, logos: o = [], grayscale: r } = t.props, i = n ? `<p style="color: var(--sg-muted-text); margin-bottom: 2rem;">${e(n)}</p>` : "", a = o.map(
+    (s) => `<img src="${e(s.src)}" alt="${e(s.alt)}" style="height: 2rem; object-fit: contain; ${r ? "filter: grayscale(100%); opacity: 0.6;" : ""}" />`
   ).join("");
-  return `<section ${w(t.id)} ${$(t.id)} style="padding: 2rem 0; background-color: var(--sg-bg);"><div style="max-width: 1200px; margin: 0 auto; padding: 0 1rem; text-align: center;">${o}<div style="display: flex; justify-content: center; align-items: center; gap: 3rem; flex-wrap: wrap;">${s}</div></div></section>`;
+  return `<section ${w(t.id)} ${$(t.id)} style="padding: 2rem 0; background-color: var(--sg-bg);"><div style="max-width: 1200px; margin: 0 auto; padding: 0 1rem; text-align: center;">${i}<div style="display: flex; justify-content: center; align-items: center; gap: 3rem; flex-wrap: wrap;">${a}</div></div></section>`;
 }
 function ct(t, p, l, m) {
   const {
     links: n = [],
-    size: i = "md",
+    size: o = "md",
     variant: r = "default"
-  } = t.props, o = {
+  } = t.props, i = {
     sm: "1.25rem",
     md: "1.5rem",
     lg: "2rem"
-  }, s = o[i] || o.md, a = n.map(
-    (d) => `<a href="${e(d.url)}" target="_blank" rel="noopener noreferrer" style="display: flex; align-items: center; justify-content: center; width: ${r === "filled" ? `calc(${s} + 0.75rem)` : s}; height: ${r === "filled" ? `calc(${s} + 0.75rem)` : s}; background-color: ${r === "filled" ? "var(--sg-surface)" : "transparent"}; border-radius: ${r === "filled" ? "50%" : "0"}; color: var(--sg-muted-text); text-decoration: none;">[${e(d.platform)}]</a>`
+  }, a = i[o] || i.md, s = n.map(
+    (d) => `<a href="${e(d.url)}" target="_blank" rel="noopener noreferrer" style="display: flex; align-items: center; justify-content: center; width: ${r === "filled" ? `calc(${a} + 0.75rem)` : a}; height: ${r === "filled" ? `calc(${a} + 0.75rem)` : a}; background-color: ${r === "filled" ? "var(--sg-surface)" : "transparent"}; border-radius: ${r === "filled" ? "50%" : "0"}; color: var(--sg-muted-text); text-decoration: none;">[${e(d.platform)}]</a>`
   ).join("");
-  return `<div ${$(t.id)} style="display: flex; gap: 1rem; align-items: center;">${a}</div>`;
+  return `<div ${$(t.id)} style="display: flex; gap: 1rem; align-items: center;">${s}</div>`;
 }
 export {
   et as exportCta,
-  at as exportFaq,
-  st as exportFaqItem,
+  st as exportFaq,
+  at as exportFaqItem,
   Z as exportFeature,
   tt as exportFeatureGrid,
   mt as exportLogoCloud,
-  it as exportPricing,
+  ot as exportPricing,
   rt as exportPricingCard,
   ct as exportSocialLinks,
   lt as exportStatItem,
   dt as exportStats,
-  ot as exportTestimonial,
+  it as exportTestimonial,
   nt as exportTestimonialGrid
 };
 //# sourceMappingURL=MarketingExporters.js.map