/* ContentFormatter Effects - minimal global styles */

/* Matrix-style green neon text: $$texto$$ */
.matrix-text{color:#86efac;text-shadow:0 0 6px rgba(134,239,172,.6),0 0 14px rgba(16,185,129,.45)}

/* Dynamic highlight background: ||texto|| */
.dynamic-highlight{display:inline;background:linear-gradient(120deg,rgba(236,72,153,.18),rgba(59,130,246,.18));padding:.05em .25em;border-radius:.35em;box-shadow:0 0 12px rgba(168,85,247,.15)}

/* Tooltip: [texto]{tooltip} */
.tooltip-text{position:relative;cursor:help;border-bottom:1px dashed rgba(255,255,255,.35)}
.tooltip-text:hover::after{content:attr(data-tooltip);position:absolute;left:50%;transform:translateX(-50%);bottom:120%;background:rgba(0,0,0,.9);color:#fff;padding:8px 10px;border-radius:10px;max-width:320px;font-size:.9rem;line-height:1.35;border:1px solid rgba(255,255,255,.15);white-space:normal;z-index:30}
.tooltip-text:hover::before{content:"";position:absolute;left:50%;transform:translateX(-50%);bottom:112%;border:6px solid transparent;border-top-color:rgba(0,0,0,.9)}

/* Important block: lines starting with ! */
.important-block{background:rgba(236,72,153,.08);border:1px solid rgba(236,72,153,.35);border-radius:12px;padding:14px 16px;margin:14px 0}

/* Animated number: wrap large numbers */
.number-stat{display:inline-block;background:linear-gradient(45deg,#a855f7,#3b82f6);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 6px rgba(168,85,247,.35))}

/* Neon text effect for ~~text~~ - preserve existing font sizes */
.neon-text{color:#fff;text-shadow:0 0 5px rgba(255,255,255,.8),0 0 10px rgba(255,255,255,.5),0 0 20px rgba(236,116,252,.5),0 0 40px rgba(236,116,252,.4)}

/* Ensure home page title keeps its responsive sizing and is bold */
.hero-title-container h1.neon-text{font-size:inherit !important;font-weight:800 !important;font-size:clamp(2.5rem, 7vw, 6rem) !important}

/* Title lines for two-line layout */
.hero-title-container .title-line{display:block;line-height:0.85}

/* Mobile specific adjustments - larger since we have two lines */
@media (max-width: 640px) {
  .hero-title-container h1.neon-text{font-size:clamp(2.2rem, 12vw, 3.5rem) !important;letter-spacing:-0.02em}
  .hero-title-container .title-line{line-height:0.8}
}

/* Highlighted strong text from **bold** */
.highlight-word{background:linear-gradient(45deg,#a855f7,#ec4899);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;text-shadow:0 0 10px rgba(168,85,247,.4)}

/* First paragraph typewriter block */
.typewriter{background:linear-gradient(135deg,rgba(168,85,247,.08),rgba(59,130,246,.08));border:1px solid rgba(168,85,247,.25);border-radius:12px;padding:16px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
