/*
Theme Name: Lashlift
Theme URI: https://lashlift.dk
Author: Soren Sundahl
Description: Pixel-tro WordPress-tema for lashlift.dk, konverteret fra det oprindelige React/Vite-site. Genbruger den kompilerede Tailwind-CSS så designet er identisk. Indhold ligger i WordPress-sider/posts, så Soro AI-SEO kan opdatere det.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 8.1
License: GPL-2.0-or-later
Text Domain: lashlift
*/

/* Alt visuelt styles af den genbrugte, kompilerede Tailwind-CSS i assets/css/app.css (enqueued i functions.php). Denne fil er kun tema-header + minimale tilføjelser. */

/* Scroll-reveal: erstatter framer-motion.
   Robust: indhold er SYNLIGT som udgangspunkt. Kun når JS kører (html.js) skjules
   .reveal-elementer for at blive animeret ind. Uden JS / for crawlere vises alt. */
.js .reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.7s ease-out, transform 0.7s ease-out;
  will-change: opacity, transform;
}
.js .reveal.reveal--x-left  { transform: translateX(-30px); }
.js .reveal.reveal--x-right { transform: translateX(30px); }
.js .reveal.is-visible {
  opacity: 1;
  transform: translate(0, 0);
}
/* Hero-elementer animeres straks ved load (svarer til framer-motion animate på mount) */
.js .reveal--onload {
  animation: llfadeup 0.8s ease-out forwards;
  opacity: 0;
}
.js .reveal--onload.d1 { animation-delay: 0.2s; }
.js .reveal--onload.d2 { animation-delay: 0.4s; }
@keyframes llfadeup {
  from { opacity: 0; transform: translateY(24px); }
  to   { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
  .js .reveal, .js .reveal--onload { opacity: 1 !important; transform: none !important; animation: none !important; }
}

/* Prose: styling af editor/Soro-genereret indhold (page.php, single.php) i tema-look. */
.ll-prose h2 { font-family: "Cormorant Garamond", Georgia, serif; font-size: 1.875rem; line-height: 1.2; font-weight: 600; color: hsl(var(--foreground)); margin-top: 2rem; margin-bottom: 1rem; }
.ll-prose h3 { font-family: "Cormorant Garamond", Georgia, serif; font-size: 1.5rem; font-weight: 600; color: hsl(var(--foreground)); margin-top: 1.75rem; margin-bottom: 0.75rem; }
.ll-prose h4 { font-family: "Cormorant Garamond", Georgia, serif; font-size: 1.25rem; font-weight: 600; color: hsl(var(--foreground)); margin-top: 1.5rem; margin-bottom: 0.5rem; }
.ll-prose p { margin-bottom: 1.25rem; }
.ll-prose a { color: hsl(var(--primary)); text-decoration: underline; }
.ll-prose a:hover { opacity: 0.85; }
.ll-prose strong { color: hsl(var(--foreground)); font-weight: 600; }
.ll-prose ul, .ll-prose ol { margin: 1.25rem 0; padding-left: 1.5rem; }
.ll-prose ul { list-style: disc; }
.ll-prose ol { list-style: decimal; }
.ll-prose li { margin-bottom: 0.5rem; }
.ll-prose img { border-radius: 0.25rem; margin: 1.5rem 0; max-width: 100%; height: auto; }
.ll-prose blockquote { border-left: 3px solid hsl(var(--primary)); padding-left: 1rem; font-style: italic; margin: 1.5rem 0; }
.ll-prose figure { margin: 1.5rem 0; }
.ll-prose figcaption { font-size: 0.875rem; text-align: center; margin-top: 0.5rem; }

/* Checklist-variant (Kurser): gold ✓ i stedet for punkttegn, matcher det oprindelige design. */
.ll-checklist ul { list-style: none; padding-left: 0; }
.ll-checklist li { position: relative; padding-left: 1.5rem; margin-bottom: 1rem; }
.ll-checklist li::before { content: "✓"; position: absolute; left: 0; color: hsl(var(--primary)); font-weight: 700; }