/* Ajustes propios del theme FRAMA (sobre el Tailwind compilado). */ /* FIX tipografia: en el sitio React, next/font define estas variables en una clase del . Aqui las definimos en :root para que font-display (Syne) y el body (Inter) resuelvan. Self-hosted primero, Google como respaldo. */ :root { --font-syne: "__Syne_744198", "Syne", system-ui, sans-serif; --font-inter: "__Inter_f367f3", "Inter", system-ui, sans-serif; /* Tokens de diseño (antes en app.css; necesarios con Tailwind CDN) */ --background: 0 0% 4%; --foreground: 0 0% 97%; --card: 0 0% 6%; --card-foreground: 0 0% 97%; --popover: 0 0% 6%; --popover-foreground: 0 0% 97%; --primary: 45 100% 50%; --primary-foreground: 0 0% 4%; --secondary: 0 0% 12%; --secondary-foreground: 0 0% 97%; --muted: 0 0% 10%; --muted-foreground: 0 0% 55%; --accent: 0 0% 12%; --accent-foreground: 0 0% 97%; --destructive: 0 84.2% 60.2%; --destructive-foreground: 0 0% 100%; --border: 0 0% 12%; --input: 0 0% 12%; --ring: 45 100% 50%; --radius: 0.75rem; } /* Submenú lateral (fly-out) del desplegable del navbar: se muestra al pasar el ratón. */ .frama-dd-sub { display: none; } .frama-dd-item:hover > .frama-dd-sub { display: block; } html { scroll-behavior: smooth; } body { font-family: var(--font-inter), system-ui, sans-serif; background-color: #0a0a0a; } /* Margen para no quedar bajo el navbar fijo en paginas de contenido. */ .frama-page-top { padding-top: 8rem; } /* H1 del hero de las landings: mas grande y con peso. */ [data-hero-title] { font-weight: 600; letter-spacing: -0.03em; } /* Tipografia del contenido editable (the_content) — Tailwind resetea h1-h6 y p, asi que aqui le devolvemos jerarquia: titulos grandes/negrita, parrafos, listas. */ .frama-content { line-height: 1.75; } .frama-content > * + * { margin-top: 1.1rem; } .frama-content h2 { font-family: var(--font-syne), system-ui, sans-serif; font-weight: 600; font-size: clamp(1.6rem, 3vw, 2.4rem); line-height: 1.15; letter-spacing: -0.02em; color: #0a0a0a; margin-top: 2.75rem; margin-bottom: 1rem; } .frama-content h3 { font-family: var(--font-syne), system-ui, sans-serif; font-weight: 600; font-size: clamp(1.3rem, 2vw, 1.7rem); line-height: 1.2; color: #0a0a0a; margin-top: 2rem; margin-bottom: 0.75rem; } .frama-content h4 { font-weight: 700; font-size: 1.15rem; color: #0a0a0a; margin-top: 1.75rem; margin-bottom: 0.5rem; } .frama-content h2:first-child, .frama-content h3:first-child, .frama-content h4:first-child { margin-top: 0; } .frama-content p { margin-bottom: 1.25rem; } .frama-content ul, .frama-content ol { margin: 1.25rem 0; padding-left: 1.5rem; } .frama-content ul { list-style: disc; } .frama-content ol { list-style: decimal; } .frama-content li { margin-bottom: 0.5rem; } .frama-content strong, .frama-content b { font-weight: 700; color: #0a0a0a; } .frama-content a { color: #0a0a0a; text-decoration: underline; text-underline-offset: 2px; } .frama-content a:hover { color: hsl(45, 100%, 38%); } .frama-content blockquote { border-left: 3px solid hsl(45, 100%, 50%); padding-left: 1.25rem; font-style: italic; margin: 1.5rem 0; } .frama-content img { border-radius: 1rem; height: auto; margin: 1.5rem 0; } /* Preguntas frecuentes (acordeón nativo
, sin JS). */ .frama-faq summary { list-style: none; } .frama-faq summary::-webkit-details-marker { display: none; } .frama-faq .faq-ico::after { content: "+"; } .frama-faq details[open] .faq-ico::after { content: "\2013"; } .frama-faq details[open] summary { color: hsl(45, 100%, 38%); } /* Checkbox de consentimiento del formulario (CF7) — más grande */ .frama-cf7 .wpcf7-acceptance input[type=checkbox] { width: 1.35rem; height: 1.35rem; flex-shrink: 0; margin-top: 0.1rem; cursor: pointer; }