/* JDS Enterprises — custom polish on top of Tailwind */

html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;   /* iOS: no surprise font inflation in landscape */
}

body {
  font-feature-settings: "ss01", "cv11";
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;               /* belt-and-braces against stray overflow on small screens */
}

/* Media never breaks its container */
img, svg, video, iframe { max-width: 100%; }

/* Sticky header offset for in-page anchors */
:target { scroll-margin-top: 6.5rem; }

/* Visible, on-brand keyboard focus — never remove the outline outright */
:focus-visible {
  outline: 2px solid #f59e0b;
  outline-offset: 2px;
  border-radius: 4px;
}
:focus:not(:focus-visible) { outline: none; }

/* Elegant scrollbar */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #f6f7fa; }
::-webkit-scrollbar-thumb { background: #d3d9e7; border-radius: 999px; }
::-webkit-scrollbar-thumb:hover { background: #a3adc6; }

/* Line clamp helpers */
.line-clamp-1 { display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.line-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.line-clamp-3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

/* Subtle grain overlay for hero sections */
.grain::after {
  content: "";
  position: absolute; inset: 0;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='120'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)' opacity='.35'/></svg>");
  mix-blend-mode: overlay;
  opacity: 0.15;
  pointer-events: none;
}

/* Reveal on scroll (opt-in via .reveal) */
.reveal { opacity: 0; transform: translateY(20px); transition: opacity .7s ease, transform .7s ease; }
.reveal.visible { opacity: 1; transform: none; }

/* Small utility for image hover cards */
.card-tilt { transition: transform .5s ease, box-shadow .5s ease; }
.card-tilt:hover { transform: translateY(-4px); }

/* Prose overrides */
.prose h2, .prose h3 { font-family: "Space Grotesk", Inter, sans-serif; letter-spacing: -0.01em; }

/* Respect the OS "reduce motion" setting */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
  .reveal { opacity: 1; transform: none; }
}

/* Print: drop chrome, keep the content legible */
@media print {
  header, footer, .no-print { display: none !important; }
  body { color: #000; background: #fff; }
  a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 10px; }
}
