/* GetPassive design-system styles.css — fonts + utilities + brand custom classes */
@import url('https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600;700&family=Geist+Mono:wght@400;500&display=swap');
@import "./tw.css";

/* ---- brand custom classes (from the site's inline <style>) ---- */
html { scroll-behavior: smooth; }
  body { font-family: 'Geist', system-ui, sans-serif; background:#f6f4ef; color:#161614; -webkit-font-smoothing: antialiased; letter-spacing: -0.005em; }
  .font-feature-tnum { font-variant-numeric: tabular-nums; font-feature-settings: 'tnum' 1; }
  /* Range slider — clean cross-browser */
  input[type=range].gp-range { -webkit-appearance:none; appearance:none; background:transparent; width:100%; height:28px; cursor:pointer; }
  input[type=range].gp-range::-webkit-slider-runnable-track {
    height:6px; border-radius:999px;
    background: linear-gradient(to right, #161614 0%, #161614 var(--p,50%), #ebe7df var(--p,50%), #ebe7df 100%);
  }
  input[type=range].gp-range::-moz-range-track {
    height:6px; border-radius:999px; background:#ebe7df;
  }
  input[type=range].gp-range::-moz-range-progress {
    height:6px; border-radius:999px; background:#161614;
  }
  input[type=range].gp-range::-webkit-slider-thumb {
    -webkit-appearance:none; appearance:none;
    width:22px; height:22px; border-radius:999px; background:#fff;
    border:1px solid #dcd8d0; margin-top:-8px;
    box-shadow: 0 1px 2px rgba(0,0,0,.06), 0 4px 12px rgba(0,0,0,.06);
    transition: transform .12s ease;
  }
  input[type=range].gp-range::-webkit-slider-thumb:hover { transform: scale(1.06); }
  input[type=range].gp-range::-moz-range-thumb {
    width:22px; height:22px; border-radius:999px; background:#fff;
    border:1px solid #dcd8d0;
    box-shadow: 0 1px 2px rgba(0,0,0,.06), 0 4px 12px rgba(0,0,0,.06);
  }
  /* Subtle scroll reveal */
  .reveal { opacity:0; transform: translateY(8px); transition: opacity .6s ease, transform .6s ease; }
  .reveal.in { opacity:1; transform:none; }
  /* Marquee logos */
  @keyframes gp-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
  .gp-marquee { animation: gp-marquee 38s linear infinite; }
  /* Hero subtle grid backdrop on light bg */
  .hero-grid {
    background-image:
      linear-gradient(to right, rgba(22,22,20,0.035) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(22,22,20,0.035) 1px, transparent 1px);
    background-size: 56px 56px, 56px 56px;
  }
  .hero-mask {
    -webkit-mask-image: radial-gradient(ellipse 70% 80% at 50% 30%, #000 40%, transparent 85%);
            mask-image: radial-gradient(ellipse 70% 80% at 50% 30%, #000 40%, transparent 85%);
  }
  /* Number flicker on update */
  .num-pulse { animation: num-pulse 350ms ease; }
  @keyframes num-pulse { 0% { transform: translateY(2px); opacity:.5 } 100% { transform: none; opacity:1 } }
  /* Subtle dotted divider */
  .dotted-divider { background-image: radial-gradient(circle, rgba(15,19,17,0.14) 1px, transparent 1px); background-size: 8px 8px; }
  /* Accordion */
  details.faq[open] summary .chev { transform: rotate(45deg); }
  details.faq summary { list-style:none; }
  details.faq summary::-webkit-details-marker { display:none; }
  /* Glow ring for primary action */
  .btn-primary { background:#161614; color:#fff; transition: transform .15s ease, box-shadow .2s ease, background-color .2s ease; }
  .btn-primary:hover { transform: translateY(-1px); box-shadow: 0 8px 20px -8px rgba(22,22,20,0.35); background:#0d0d0c; }
  .btn-ghost { border:1px solid #dcd8d0; color:#161614; transition: background-color .15s ease; }
  .btn-ghost:hover { background: rgba(22,22,20,0.03); }
  .btn-accent { background:#f06a3a; color:#fff; transition: transform .15s ease, box-shadow .2s ease, background-color .2s ease; }
  .btn-accent:hover { transform: translateY(-1px); box-shadow: 0 8px 20px -8px rgba(240,106,58,0.50); background:#e85b29; }
  ::selection { background: rgba(240,106,58,.22); }

/* ---- design-system static-render overrides ----
   The live site reveals sections via IntersectionObserver adding .in.
   In static design use there is no observer, so make .reveal visible by default. */
.reveal { opacity: 1 !important; transform: none !important; }