/* ==========================================================================
   Lets Safe - subtle refinement layer
   Loaded after the main Webflow stylesheet. Intentionally restrained: this
   sharpens typography, focus states and micro-interactions without changing
   the brand, layout or component structure.
   ========================================================================== */

/* --- Type rendering -------------------------------------------------------
   Webflow ships no smoothing hints; these make Mona Sans noticeably cleaner
   on macOS/iOS without altering weights or metrics. */
html{-webkit-text-size-adjust:100%}
body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}

/* Large display headings read tighter and more considered at big sizes.
   Kept to headings only so body copy spacing is untouched. */
h1,h2,.display-1,.display-2{letter-spacing:-.018em}
h3,h4{letter-spacing:-.011em}

/* Avoid awkward single-word last lines in short headings. */
h1,h2,h3{text-wrap:balance}
p{text-wrap:pretty}

/* --- Reading comfort ------------------------------------------------------
   Long-form legal/policy pages otherwise run the full container width. */
.rich-text-block p,.rich-text-block li{max-width:72ch}

/* --- Focus visibility -----------------------------------------------------
   The template has no visible keyboard focus at all. */
a:focus-visible,button:focus-visible,[role="button"]:focus-visible,
input:focus-visible,select:focus-visible,textarea:focus-visible,
.w-button:focus-visible,.w-dropdown-toggle:focus-visible{
  outline:2px solid var(--accent--primary-1,#b6f34a);
  outline-offset:3px;
  border-radius:8px;
}

/* --- Micro-interactions ---------------------------------------------------
   Small, consistent motion on the elements users actually click. */
.btn-primary,.btn-secondary,.w-button{
  transition:transform .18s cubic-bezier(.2,.7,.3,1),
             box-shadow .18s ease,
             background-color .18s ease,
             color .18s ease;
  will-change:transform;
}
.btn-primary:hover,.btn-secondary:hover,.w-button:hover{transform:translateY(-1px)}
.btn-primary:active,.btn-secondary:active,.w-button:active{transform:translateY(0)}

/* Cards lift very slightly, enough to read as interactive. */
.card{transition:transform .22s cubic-bezier(.2,.7,.3,1),box-shadow .22s ease}
a:hover > .card,.card-link:hover .card,.card.hover-lift:hover{
  transform:translateY(-3px);
  box-shadow:0 18px 40px -24px rgba(16,24,40,.28);
}

/* --- Media ----------------------------------------------------------------
   Guard against layout shift and stretched art. */
img,svg,video{max-width:100%;height:auto}
img{vertical-align:middle}

/* --- Anchors --------------------------------------------------------------
   In-page links (e.g. /contact.html#us) otherwise land under the sticky header. */
html{scroll-behavior:smooth}
:target{scroll-margin-top:104px}

/* --- Selection ------------------------------------------------------------ */
::selection{background:var(--accent--primary-1,#b6f34a);color:#101828}

/* --- Accessibility: honour reduced-motion preferences --------------------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    transition-duration:.001ms!important;
    scroll-behavior:auto!important;
  }
  .btn-primary:hover,.btn-secondary:hover,.w-button:hover,
  a:hover > .card,.card-link:hover .card{transform:none}
}

/* --- Print ---------------------------------------------------------------- */
@media print{
  .header-wrapper,.footer-wrapper,.btn-primary,.btn-secondary{display:none!important}
  body{background:#fff}
}
