/* Base tweaks */
html { font-variation-settings: normal; }
img[loading="lazy"] { opacity:.001; transition: opacity .6s ease; }
img.is-loaded { opacity:1; }

/* Minimal cards and inputs */
.card { border:1px solid rgb(228,228,231); border-radius:1rem; padding:1.25rem; background:white; }
.input { border:1px solid rgb(228,228,231); border-radius:0.75rem; padding:0.75rem; outline:none; }
.input:focus { box-shadow:0 0 0 3px rgba(13,148,136,.2); border-color:rgb(45,212,191); }
.btn-primary { margin-top:.5rem; padding:.75rem 1.25rem; border-radius:1rem; background:#0f766e; color:white; transition:opacity .2s; }
.btn-primary:hover { opacity:.9; }

/* Hero info card */
.info-card { position:absolute; left:-1rem; bottom:-1.5rem; background:white; border-radius:1rem; padding:1rem; width:85%; box-shadow:0 10px 25px rgba(0,0,0,.08); animation: gentle 4s ease-in-out infinite; }
@keyframes gentle { 0%,100%{ transform:translateY(0)} 50%{ transform:translateY(-3px)} }

/* Reveal on scroll */
.reveal { opacity:0; transform:translateY(16px); }
.reveal.in-view { animation: fadeUp .7s ease-out both; }
.reveal.delay-1.in-view { animation-delay:.1s }
.reveal.delay-2.in-view { animation-delay:.2s }
.reveal.delay-3.in-view { animation-delay:.3s }

@keyframes fadeUp { 0%{opacity:0; transform:translateY(16px)} 100%{opacity:1; transform:translateY(0)} }

/* Numbers */
.stat { font-weight:600; font-size:1.5rem; }
.stat-label { font-size:.875rem; color:rgb(82,82,91); }

/* Image fade */
.fade-img { opacity:.001; transition: opacity .6s ease; }
.fade-img.is-loaded { opacity:1; }