/* FIMO Energy — stili custom (il resto è Tailwind) */

:root {
  --fimo-orange: #E35A1E;
  --fimo-cream: #FAF5F1;
  --fimo-ink: #221C18;
}

html { scroll-behavior: smooth; }

body { font-family: 'Plus Jakarta Sans', sans-serif; }

.font-logo { font-family: 'Space Grotesk', sans-serif; }

.bg-pattern {
  background-color: var(--fimo-cream);
  background-image:
    radial-gradient(var(--fimo-orange) 0.65px, transparent 0.65px),
    radial-gradient(var(--fimo-ink) 0.65px, var(--fimo-cream) 0.65px);
  background-size: 26px 26px;
  background-position: 0 0, 13px 13px;
}

/* Hero: foto famiglia, versione leggera su mobile */
.hero-bg {
  background-image: url('../img/hero-famiglia-800.webp');
  background-size: cover;
  /* inquadratura bassa: telecomando in vista, scritta Sorgenia tagliata a metà */
  background-position: 68% 62%;
}
@media (min-width: 801px) {
  .hero-bg { background-image: url('../img/hero-famiglia.webp'); }
}
@media (min-width: 1024px) {
  /* la card copre la sinistra: TV e famiglia restano nella metà destra */
  .hero-bg { background-position: 40% 62%; }
}

/* Velatura scura: più densa sotto la card, più leggera sulla foto */
.hero-veil {
  background:
    linear-gradient(180deg, rgba(20, 15, 12, .6) 0%, rgba(20, 15, 12, .85) 100%);
}
@media (min-width: 1024px) {
  .hero-veil {
    background:
      linear-gradient(90deg, rgba(20, 15, 12, .92) 0%, rgba(20, 15, 12, .75) 40%, rgba(20, 15, 12, .5) 75%),
      linear-gradient(0deg, rgba(20, 15, 12, .65) 0%, rgba(20, 15, 12, 0) 40%);
  }
}

/* Form */
.field {
  width: 100%;
  padding: .625rem .875rem;
  font-size: .875rem;
  background: var(--fimo-cream);
  border: 1px solid #D8C7BC;
  border-radius: .75rem;
  transition: border-color .15s, background-color .15s;
}
.field:focus {
  outline: none;
  border-color: var(--fimo-orange);
  background: #fff;
}