/* ===================================================
   WealthSyncDaily — custom styles
   Tailwind (CDN) handles the bulk of the layout; this file
   covers fonts, the signature ribbon tag, and small motion.
   =================================================== */

   :root {
    --font-display: "Plus Jakarta Sans", sans-serif;
    --font-body: "Inter", sans-serif;
  }
  
  html {
    scroll-behavior: smooth;
  }
  
  body {
    font-family: var(--font-body);
  }
  
  h1, h2, h3, h4, h5, .font-display {
    font-family: var(--font-display);
  }
  
  /* Signature element: diagonal-cut ribbon tag used on category labels */
  .ribbon-tag {
    position: relative;
    display: inline-flex;
    align-items: center;
    padding: 0.3rem 0.85rem 0.3rem 0.7rem;
    background: #F59E0B;
    color: #0F172A;
    font-weight: 700;
    font-size: 0.7rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    clip-path: polygon(0 0, 100% 0, 92% 100%, 0% 100%);
  }
  
  .ribbon-tag--green {
    background: #047857;
    color: #FFFFFF;
  }
  
  /* Scroll reveal */
  .reveal {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity 0.5s ease, transform 0.5s ease;
  }
  
  .reveal-visible {
    opacity: 1;
    transform: translateY(0);
  }
  
  @media (prefers-reduced-motion: reduce) {
    .reveal {
      opacity: 1;
      transform: none;
      transition: none;
    }
    html {
      scroll-behavior: auto;
    }
  }
  
  /* Focus visibility for accessibility */
  a:focus-visible,
  button:focus-visible,
  input:focus-visible,
  textarea:focus-visible {
    outline: 2px solid #047857;
    outline-offset: 2px;
  }
  
  /* Divider bar used between major sections — a quiet nod to a ticker line */
  .pulse-divider {
    height: 3px;
    background: linear-gradient(90deg, #047857 0%, #047857 50%, #F59E0B 50%, #F59E0B 100%);
    background-size: 32px 3px;
  }
  
  /* Article prose readability */
  .article-prose p {
    margin-bottom: 1.25rem;
    line-height: 1.8;
  }
  
  .article-prose h2 {
    margin-top: 2.5rem;
    margin-bottom: 1rem;
  }
  
  .article-prose h3 {
    margin-top: 2rem;
    margin-bottom: 0.75rem;
  }
  
  /* Card hover lift */
  .lift-hover {
    transition: transform 0.25s ease, box-shadow 0.25s ease;
  }
  
  .lift-hover:hover {
    transform: translateY(-4px);
  }
  
  /* Number input spinners removed for calculator inputs */
  input[type="number"] {
    -moz-appearance: textfield;
  }
  
  input[type="number"]::-webkit-outer-spin-button,
  input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }

/* Hide Scrollbar */
html,
body{
    overflow-x: hidden;
    scrollbar-width: none;      
    -ms-overflow-style: none;
    padding-top: 1rem;
}

html::-webkit-scrollbar,
body::-webkit-scrollbar{
    display: none;              
}