.fn-home {
  background: var(--fn-off-white);
}

.fn-home :where(.wp-block-group, .wp-block-image, p, h1, h2) {
  margin-block-start: 0;
  margin-block-end: 0;
}

/* Hero */
.fn-home-hero {
  position: relative;
  min-height: 100svh;
  overflow: clip;
  background: var(--fn-charcoal);
  color: var(--fn-white);
  isolation: isolate;
}

.fn-home-hero__media {
  position: absolute;
  z-index: -3;
  inset: 0;
  margin: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #17191a;
}

.fn-home-hero__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transform: scale(1.045);
}

.fn-home-hero:not(:has(.fn-home-hero__media img))::before {
  content: "Imposta l’immagine in evidenza della Home";
  position: absolute;
  z-index: -2;
  inset: 0;
  display: grid;
  place-items: center;
  color: color-mix(in srgb, var(--fn-white) 42%, transparent);
  font-size: .72rem;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.fn-home-hero__veil {
  position: absolute;
  z-index: -1;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(9, 13, 14, .18) 0%, rgba(9, 13, 14, .06) 36%, rgba(9, 13, 14, .68) 100%),
    linear-gradient(90deg, rgba(9, 13, 14, .32) 0%, transparent 60%);
}

.fn-home-hero__content {
  position: absolute;
  inset: auto 0 clamp(4.8rem, 9vh, 8rem);
}

.fn-home-hero__kicker {
  margin-bottom: 1rem !important;
  font-size: clamp(.68rem, .62rem + .16vw, .78rem);
  font-weight: 650;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.fn-home-hero__title {
  max-width: 9ch;
  font-family: var(--fn-font-editorial);
  font-size: clamp(4rem, 11.5vw, 11.5rem);
  font-weight: 400;
  letter-spacing: -.055em;
  line-height: .78;
  text-wrap: balance;
}

.fn-home-hero__copy {
  max-width: 34rem;
  margin-top: clamp(1.5rem, 3vw, 2.5rem) !important;
  color: color-mix(in srgb, var(--fn-white) 82%, transparent);
  font-size: clamp(.94rem, .86rem + .25vw, 1.15rem);
}

.fn-home-hero__actions {
  margin-top: 1.75rem !important;
}

.fn-home-hero .wp-block-button.is-style-outline .wp-block-button__link {
  border-color: color-mix(in srgb, var(--fn-white) 65%, transparent);
  color: var(--fn-white);
}

.fn-home-hero .wp-block-button.is-style-outline .wp-block-button__link:hover {
  border-color: var(--fn-white);
  background: var(--fn-white);
  color: var(--fn-charcoal);
}

.fn-home-scrollcue {
  position: absolute;
  right: clamp(1.25rem, 4vw, 5rem);
  bottom: clamp(1.75rem, 3vw, 2.5rem);
  display: inline-flex;
  align-items: center;
  gap: .75rem;
  color: color-mix(in srgb, var(--fn-white) 75%, transparent);
  font-size: .68rem;
  font-weight: 650;
  letter-spacing: .14em;
  text-decoration: none;
  text-transform: uppercase;
}

.fn-home-scrollcue i {
  width: 3.25rem;
  height: 1px;
  background: currentColor;
  transform-origin: right center;
}

/* Intro */
.fn-home-intro {
  background: var(--fn-off-white);
}

.fn-home-intro__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  align-items: center;
  gap: var(--fn-grid-gap);
}

.fn-home-intro__copy {
  grid-column: 2 / span 5;
  position: relative;
  z-index: 2;
}

.fn-home-intro__body {
  max-width: 31rem;
  margin-top: 2rem !important;
  color: color-mix(in srgb, var(--fn-charcoal) 72%, transparent);
  font-size: clamp(1rem, .95rem + .2vw, 1.16rem);
}

.fn-home-intro__media {
  grid-column: 8 / span 4;
  aspect-ratio: 4 / 5.4;
}

/* Shared media slots — intentionally asset-free until original work is supplied. */
.fn-home-media-slot {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--fn-warm-grey) 46%, var(--fn-off-white)), var(--fn-warm-grey-light));
}

.fn-home-media-slot::after {
  content: "";
  position: absolute;
  inset: 1rem;
  border: 1px solid color-mix(in srgb, var(--fn-charcoal) 12%, transparent);
  pointer-events: none;
}

.fn-home-media-slot__label {
  position: absolute;
  left: 1.5rem;
  bottom: 1.5rem;
  color: color-mix(in srgb, var(--fn-charcoal) 50%, transparent);
  font-size: .64rem;
  font-weight: 650;
  letter-spacing: .14em;
  text-transform: uppercase;
}

/* Stories */
.fn-home-stories {
  padding-top: clamp(2rem, 4vw, 4.5rem);
  background: var(--fn-off-white);
}

.fn-home-stories__header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--fn-space-lg);
  margin-bottom: clamp(3.5rem, 8vw, 8rem);
}

.fn-home-stories__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: clamp(3rem, 7vw, 8rem) var(--fn-grid-gap);
}

.fn-home-story {
  min-width: 0;
}

.fn-home-story--one { grid-column: 1 / span 7; }
.fn-home-story--two { grid-column: 9 / span 4; margin-top: clamp(6rem, 13vw, 13rem); }
.fn-home-story--three { grid-column: 3 / span 5; }

.fn-home-story__media {
  margin: 0;
  aspect-ratio: 5 / 6.2;
  transform-origin: center center;
}

.fn-home-story--one .fn-home-story__media { aspect-ratio: 16 / 10.5; }
.fn-home-story--three .fn-home-story__media { aspect-ratio: 4 / 5; }

.fn-home-story__meta {
  padding-top: 1rem;
  border-top: var(--fn-border);
  font-size: .72rem;
  font-weight: 650;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.fn-home-story__meta p { margin: 0; }

/* Experience */
.fn-home-experience {
  position: relative;
  min-height: 100svh;
  display: grid;
  place-items: center;
  overflow: clip;
  background: var(--fn-charcoal);
  color: var(--fn-off-white);
}

.fn-home-experience::before {
  content: "";
  position: absolute;
  width: min(42vw, 42rem);
  aspect-ratio: 1;
  border: 1px solid color-mix(in srgb, var(--fn-teal) 34%, transparent);
  border-radius: 50%;
  opacity: .7;
}

.fn-home-experience__inner {
  position: relative;
  z-index: 1;
}

.fn-home-experience__eyebrow {
  color: color-mix(in srgb, var(--fn-off-white) 58%, transparent);
}

.fn-home-experience__title {
  max-width: 11ch;
  font-family: var(--fn-font-editorial);
  font-size: clamp(3.4rem, 9.2vw, 10rem);
  font-weight: 400;
  letter-spacing: -.05em;
  line-height: .86;
}

/* Services */
.fn-home-services {
  background: var(--fn-off-white);
}

.fn-home-services__head {
  display: grid;
  grid-template-columns: 1fr minmax(0, 2fr);
  gap: var(--fn-grid-gap);
  margin-bottom: clamp(3rem, 6vw, 6rem);
}

.fn-home-services__head .fn-heading {
  grid-column: 2;
}

.fn-home-services__list {
  border-top: var(--fn-border);
}

.fn-home-service {
  min-height: clamp(5.5rem, 9vw, 8.5rem);
  align-items: center;
  border-bottom: var(--fn-border);
}

.fn-home-service p {
  font-family: var(--fn-font-editorial);
  font-size: clamp(2rem, 4.6vw, 5.2rem);
  font-weight: 400;
  letter-spacing: -.035em;
  line-height: 1;
}

.fn-home-service__number {
  color: var(--fn-warm-grey);
  font-size: .68rem;
  font-weight: 650;
  letter-spacing: .12em;
}

/* Proof is intentionally hidden until verified content exists. */
.fn-home-proof.is-empty { display: none; }

/* Closing */
.fn-home-closing {
  position: relative;
  min-height: min(88svh, 58rem);
  display: grid;
  align-items: end;
  overflow: clip;
  background: var(--fn-charcoal);
  color: var(--fn-white);
  isolation: isolate;
}

.fn-home-closing__media {
  position: absolute;
  z-index: -3;
  inset: 0;
  margin: 0;
  width: 100%;
  height: 100%;
}

.fn-home-closing__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(.82);
}

.fn-home-closing__veil {
  position: absolute;
  z-index: -2;
  inset: 0;
  background: linear-gradient(180deg, rgba(13, 16, 17, .12), rgba(13, 16, 17, .76));
}

.fn-home-closing__content {
  padding-bottom: clamp(4rem, 9vw, 8rem);
}

.fn-home-closing__content .fn-eyebrow {
  color: color-mix(in srgb, var(--fn-white) 62%, transparent);
}

.fn-home-closing__title {
  max-width: 12ch;
  margin-bottom: clamp(2rem, 4vw, 3rem) !important;
  font-family: var(--fn-font-editorial);
  font-size: clamp(3rem, 8vw, 8.5rem);
  font-weight: 400;
  letter-spacing: -.05em;
  line-height: .88;
}

.fn-home-closing .wp-block-button.is-style-outline .wp-block-button__link {
  border-color: color-mix(in srgb, var(--fn-white) 65%, transparent);
  color: var(--fn-white);
}

.fn-home-closing .wp-block-button.is-style-outline .wp-block-button__link:hover {
  border-color: var(--fn-white);
  background: var(--fn-white);
  color: var(--fn-charcoal);
}

@media (max-width: 1024px) {
  .fn-home-intro__copy { grid-column: 1 / span 6; }
  .fn-home-intro__media { grid-column: 8 / span 5; }
  .fn-home-story--one { grid-column: 1 / span 8; }
  .fn-home-story--two { grid-column: 8 / span 5; }
  .fn-home-story--three { grid-column: 2 / span 6; }
}

@media (max-width: 782px) {
  .fn-home-hero__content {
    bottom: max(5.75rem, calc(env(safe-area-inset-bottom) + 5rem));
  }

  .fn-home-hero__title {
    font-size: clamp(4.1rem, 21vw, 7rem);
    line-height: .8;
  }

  .fn-home-scrollcue {
    right: 1.25rem;
    bottom: max(1.3rem, env(safe-area-inset-bottom));
  }

  .fn-home-scrollcue span { display: none; }
  .fn-home-scrollcue i { width: 2.5rem; }

  .fn-home-intro__grid,
  .fn-home-stories__grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .fn-home-intro__copy,
  .fn-home-intro__media,
  .fn-home-story--one,
  .fn-home-story--two,
  .fn-home-story--three {
    grid-column: 1 / -1;
  }

  .fn-home-intro__copy { margin-bottom: 2.25rem; }
  .fn-home-intro__media { width: 82%; margin-left: auto; }

  .fn-home-stories__header {
    display: block;
    margin-bottom: 3rem;
  }

  .fn-home-story--two {
    width: 74%;
    margin-top: 0;
    margin-left: auto;
  }

  .fn-home-story--three { width: 88%; }

  .fn-home-experience {
    min-height: 76svh;
  }

  .fn-home-experience::before { width: 76vw; }

  .fn-home-services__head {
    display: block;
  }

  .fn-home-services__head .fn-heading { margin-top: 1rem; }

  .fn-home-service {
    min-height: 5.25rem;
  }

  .fn-home-service p {
    font-size: clamp(2rem, 10vw, 3.3rem);
  }

  .fn-home-closing {
    min-height: 76svh;
  }
}

@media (prefers-reduced-motion: reduce) {
  .fn-home-hero__media img,
  .fn-home-story__media,
  .fn-home-experience__title,
  .fn-home-scrollcue i {
    transform: none !important;
  }
}
