/* Small amount of hand-written CSS that Tailwind utilities do not cover. */

/* Logo: marks are drawn with currentColor (primary) and --accent (secondary). */
[data-logo] { --accent: #f28c28; }
[data-logo] .logo-word {
  font-family: Fraunces, Georgia, serif;
  font-weight: 600; letter-spacing: -0.02em; line-height: 1;
  display: inline-flex; align-items: center;
}
[data-logo] .logo-word svg { height: 0.72em; width: 0.72em; margin: 0.18em -0.02em 0; }

/* Reveal on scroll */
[data-reveal] { opacity: 0; transform: translateY(14px); transition: opacity .7s ease, transform .7s ease; }
[data-reveal].is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  [data-reveal] { opacity: 1; transform: none; transition: none; }
  [data-draw] { transition: none !important; stroke-dashoffset: 0 !important; }
}

/* Soft frame around photos */
.frame { position: relative; border-radius: 1.5rem; padding: 4px; background: #fff; box-shadow: 0 1px 2px rgba(30,42,68,.06); }
.frame > * { border-radius: calc(1.5rem - 4px); display: block; }

/* Handwritten accents */
.hand { font-family: Caveat, "Segoe Print", cursive; }

/* Accordion marker rotation */
details[open] .plus { transform: rotate(45deg); }
summary::-webkit-details-marker { display: none; }

/* Dotted connector between steps */
.dotted-line { background-image: radial-gradient(circle, rgba(59,116,214,.55) 1.5px, transparent 1.6px); background-size: 10px 10px; background-repeat: repeat-x; background-position: center; }