/* Hero section */
.hero {
  height: 75dvh;
  min-height: 420px;
  max-height: 760px;

  display: grid;
  grid-template-columns: 1fr 1.3fr; /* immagine a sinistra, hero-inner a destra */
  gap: 20px;
  padding: 24px 20px;

  background:
    radial-gradient(60% 80% at 50% 20%, rgba(198,166,100,.18), transparent 60%),
    linear-gradient(180deg, #fff, #f7f3ec 60%, #f0ece5 100%);
  border-bottom: 1px solid var(--line);
  align-items: center; /* allinea verticalmente */
}

/* contenitore immagine */
.hero-image {
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  border-radius: var(--radius-lg);
  max-height: 100%;
}

.hero-image img {
  width: 100%;
  height: auto;
  object-fit: cover;
  border-radius: var(--radius-lg);
}

.hero-inner {
  width: 100%;
  max-width: 980px;
  height: 100%;
  border-radius: var(--radius-lg);
  border: 2px dashed #d9d2c8;
  background: repeating-linear-gradient(
    45deg,
    rgba(166,166,166,.08),
    rgba(166,166,166,.08) 16px,
    rgba(198,198,198,.08) 16px,
    rgba(198,198,198,.08) 32px
  );
  display: grid;
  place-items: center;
  color: #9B907F;
  font-weight: 600;
}

.btn-hero { display: inline-block; padding: 20px 26px; background-color: #f2f2f2; color: #333; border-radius: 6px; text-decoration: none; font-weight: 600; transition: all 0.25s ease; border: 1px solid #d4a017; font-size: 24px; margin: 0 35px; vertical-align: bottom; }
.btn-hero:hover {background-color: #d4a017; color: #ffffff; border-color: #d4a017;}

.hero-title{text-align:center; max-width:720px; color:var(--ink);}
.hero-title h1{margin:0 0 8px;font-size:clamp(28px,4.8vw,48px); font-weight:700;color:var(--curry);}
.hero-title p{margin:0;color:#6f6a60;}