:root{
  --nh-ink:#1d332b;
  --nh-text:#2d3e39;
  --nh-muted:#5d6d68;
  --nh-green:#15908D;
  --nh-green-dark:#0F766E;
  --nh-line:rgba(29,51,43,.14);
  --nh-shadow:0 14px 34px rgba(24,42,35,.12);
}

*{ box-sizing:border-box; }

html,
body{
  margin:0;
  min-height:100%;
  background:#fff;
  color:var(--nh-text);
  font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
  -webkit-font-smoothing:antialiased;
  text-rendering:geometricPrecision;
}

a{ color:inherit; text-decoration:none; }

main{
  padding-top:102px;
}

.nhHeader{
  width:100%;
  height:102px;
  display:grid;
  grid-template-columns:minmax(150px, .62fr) minmax(0, auto) minmax(220px, .78fr);
  align-items:start;
  gap:clamp(20px, 2.2vw, 34px);
  padding:18px clamp(30px, 4.8vw, 76px) 0;
  background:rgba(255,255,255,.96);
  box-shadow:0 4px 22px rgba(30,45,40,.10);
  border:1px solid rgba(21,144,141,0);
  position:fixed;
  top:0;
  left:50%;
  transform:translateX(-50%);
  z-index:20;
  transition:
    width .86s cubic-bezier(.22, 1, .36, 1),
    height .86s cubic-bezier(.22, 1, .36, 1),
    top .86s cubic-bezier(.22, 1, .36, 1),
    padding .86s cubic-bezier(.22, 1, .36, 1),
    border-radius .86s cubic-bezier(.22, 1, .36, 1),
    border-color .86s ease,
    box-shadow .86s ease,
    background-color .86s ease;
}

body.is-scrolled .nhHeader{
  width:min(1500px, calc(100% - 28px));
  height:88px;
  top:10px;
  padding:13px clamp(28px, 3.8vw, 60px) 0;
  border-radius:10px;
  border-color:rgba(21,144,141,.13);
  background:rgba(255,255,255,.94);
  box-shadow:0 14px 34px rgba(24,42,35,.12);
  backdrop-filter:blur(10px);
}

.nhHeader:has(.nhNavItem:hover),
.nhHeader:has(.nhNavItem:focus-within){
  height:282px;
  background:rgba(255,255,255,.97);
  box-shadow:0 20px 56px rgba(24,42,35,.13);
}

body.is-scrolled .nhHeader:has(.nhNavItem:hover),
body.is-scrolled .nhHeader:has(.nhNavItem:focus-within){
  height:264px;
}

.nhHeader:has(.nhNavItem:hover .nhNavMenu[aria-label="Menu testimonianze"]),
.nhHeader:has(.nhNavItem:focus-within .nhNavMenu[aria-label="Menu testimonianze"]){
  height:456px;
}

body.is-scrolled .nhHeader:has(.nhNavItem:hover .nhNavMenu[aria-label="Menu testimonianze"]),
body.is-scrolled .nhHeader:has(.nhNavItem:focus-within .nhNavMenu[aria-label="Menu testimonianze"]){
  height:432px;
}

.nhBrand{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:max-content;
  color:var(--nh-ink);
  font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size:16px;
  font-weight:650;
  letter-spacing:.045em;
  text-transform:uppercase;
}

.nhBrand img{
  width:42px;
  height:42px;
  object-fit:contain;
  transition:width .72s cubic-bezier(.16, 1, .3, 1), height .72s cubic-bezier(.16, 1, .3, 1);
}

body.is-scrolled .nhBrand img{
  width:40px;
  height:40px;
}

.nhNav{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:clamp(22px, 2.45vw, 35px);
  margin-top:13px;
  color:#31423d;
  font-size:15px;
  line-height:1;
  white-space:nowrap;
  transition:margin-top .72s cubic-bezier(.16, 1, .3, 1);
}

body.is-scrolled .nhNav{
  margin-top:11px;
}

.nhNav a{
  padding:12px 0;
  transition:color .18s ease;
}

.nhNav a:hover{ color:var(--nh-green-dark); }

.nhNavItem{
  position:static;
  display:flex;
  align-items:center;
}

.nhNavTrigger{
  display:inline-flex;
  align-items:center;
  gap:6px;
}

.nhNavChevron{
  width:11px;
  height:11px;
  display:inline-block;
  margin-right:-7px;
  color:currentColor;
  opacity:.72;
  transform:translateY(1px);
  transition:transform .24s ease, opacity .24s ease;
}

.nhNavChevron svg{
  width:100%;
  height:100%;
  display:block;
  fill:currentColor;
}

.nhNavItem:hover .nhNavChevron,
.nhNavItem:focus-within .nhNavChevron{
  opacity:1;
  transform:translateY(1px) rotate(180deg);
}

.nhNavItem::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:58px;
  height:224px;
  z-index:1;
  pointer-events:none;
}

.nhNavItem:hover::after,
.nhNavItem:focus-within::after{
  pointer-events:auto;
}

body.is-scrolled .nhNavItem::after{
  left:0;
  right:0;
  top:52px;
  height:212px;
}

.nhNavItem:has(.nhNavMenu[aria-label="Menu testimonianze"])::after{
  height:398px;
}

body.is-scrolled .nhNavItem:has(.nhNavMenu[aria-label="Menu testimonianze"])::after{
  height:378px;
}

.nhNavMenu{
  position:absolute;
  z-index:2;
  left:clamp(30px, 4.8vw, 76px);
  right:clamp(30px, 4.8vw, 76px);
  top:106px;
  width:auto;
  min-width:0;
  max-width:none;
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:0;
  padding:8px 0 0;
  border-top:1px solid rgba(21,144,141,.12);
  background:transparent;
  box-shadow:none;
  backdrop-filter:blur(12px);
  opacity:0;
  pointer-events:none;
  transform:translateY(-10px);
  transform-origin:50% 0;
  transition:opacity .26s ease .05s, transform .46s cubic-bezier(.16, 1, .3, 1);
}

.nhNavMenu:has(a:nth-child(2):last-child){
  grid-template-columns:repeat(2, minmax(0, 1fr));
}

.nhNavMenu:has(a:nth-child(3):last-child){
  grid-template-columns:repeat(3, minmax(0, 1fr));
}

body.is-scrolled .nhNavMenu{
  left:clamp(28px, 3.8vw, 60px);
  right:clamp(28px, 3.8vw, 60px);
  top:94px;
}

.nhNavItem:hover .nhNavMenu,
.nhNavItem:focus-within .nhNavMenu{
  opacity:1;
  pointer-events:auto;
  transform:translateY(0);
}

.nhNavMenu a{
  min-height:82px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:18px 22px;
  border-left:1px solid rgba(21,144,141,.12);
  color:#253c35;
  font-size:15.5px;
  font-weight:780;
  line-height:1.18;
  box-shadow:none;
  transition:background .2s ease, color .2s ease, transform .22s ease;
}

.nhNavMenu a:first-child{
  border-left:0;
}

.nhNavMenu a::after{
  content:"→";
  flex:0 0 auto;
  color:#253c35;
  font-size:20px;
  line-height:1;
  opacity:.38;
  transform:translateX(-4px);
  transition:opacity .2s ease, transform .22s ease, color .2s ease;
}

.nhNavMenu a:hover{
  color:var(--nh-green-dark);
  background:rgba(21,144,141,.07);
  transform:translateY(-1px);
}

.nhNavMenu a:hover::after{
  color:var(--nh-green-dark);
  opacity:1;
  transform:translateX(0);
}

.nhNavMenu small{
  color:#75857f;
  font-size:12px;
  font-weight:650;
  white-space:nowrap;
}

@media (prefers-reduced-motion: reduce){
  .nhNavChevron,
  .nhNavMenu,
  .nhNavMenu a{
    transition:none !important;
  }
}

.nhTopCta{
  justify-self:end;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-top:13px;
  min-height:38px;
  padding:0 24px;
  background:var(--nh-green-dark);
  color:#fff;
  font-size:15px;
  font-weight:700;
  white-space:nowrap;
  box-shadow:0 10px 22px rgba(21,144,141,.18);
  transition:margin-top .72s cubic-bezier(.16, 1, .3, 1), transform .18s ease, background .18s ease;
}

.nhTopCta:hover{
  transform:translateY(-1px);
  background:#0d6862;
}

body.is-scrolled .nhTopCta{
  margin-top:12px;
  min-height:36px;
  padding-inline:24px;
}

.nhMobileBurger,
.nhMobileDrawer{
  display:none;
}

@media (min-width: 1121px) and (max-width: 1512px){
  main{
    padding-top:88px;
  }

  .nhHeader{
    height:88px;
    grid-template-columns:minmax(128px, .52fr) minmax(0, auto) minmax(190px, .66fr);
    gap:clamp(16px, 1.8vw, 26px);
    padding:14px clamp(24px, 3.4vw, 52px) 0;
  }

  body.is-scrolled .nhHeader{
    width:min(1280px, calc(100% - 24px));
    height:78px;
    top:8px;
    padding:11px clamp(22px, 3vw, 44px) 0;
  }

  .nhBrand img{
    width:38px;
    height:38px;
  }

  body.is-scrolled .nhBrand img{
    width:36px;
    height:36px;
  }

  .nhNav{
    gap:clamp(17px, 1.75vw, 26px);
    margin-top:11px;
    font-size:14px;
  }

  body.is-scrolled .nhNav{
    margin-top:9px;
  }

  .nhNavChevron{
    width:10px;
    height:10px;
    margin-right:-6px;
  }

  .nhTopCta{
    margin-top:10px;
    min-height:34px;
    padding:0 20px;
    font-size:14px;
  }

  body.is-scrolled .nhTopCta{
    margin-top:9px;
    min-height:33px;
    padding-inline:20px;
  }

  .nhHeader:has(.nhNavItem:hover),
  .nhHeader:has(.nhNavItem:focus-within){
    height:252px;
  }

  body.is-scrolled .nhHeader:has(.nhNavItem:hover),
  body.is-scrolled .nhHeader:has(.nhNavItem:focus-within){
    height:238px;
  }

  .nhNavMenu{
    left:clamp(24px, 3.4vw, 52px);
    right:clamp(24px, 3.4vw, 52px);
    top:92px;
  }

  body.is-scrolled .nhNavMenu{
    left:clamp(22px, 3vw, 44px);
    right:clamp(22px, 3vw, 44px);
    top:84px;
  }

  .nhNavMenu a{
    min-height:72px;
    padding:15px 18px;
    font-size:14px;
  }
}

.nhHero{
  position:relative;
  min-height:735px;
  overflow:hidden;
  isolation:isolate;
  background:#fff;
}

.nhHero__image{
  position:absolute;
  inset:0 0 0 auto;
  width:66%;
  background-image:
    linear-gradient(90deg, #fff 0%, rgba(255,255,255,.96) 8%, rgba(255,255,255,.58) 18%, rgba(255,255,255,.14) 29%, rgba(255,255,255,0) 40%),
    url("../assets/optimized/hero/luigina-hero-1536-v1.webp");
  background-size:auto 100%;
  background-position:right bottom;
  background-repeat:no-repeat;
  z-index:-1;
}

.nhHero::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-1px;
  height:0;
  background:none;
  pointer-events:none;
  z-index:0;
}

.nhHero__content{
  width:min(560px, calc(100% - 40px));
  margin-left:clamp(28px, 6.5vw, 100px);
  padding-top:120px;
  position:relative;
  z-index:1;
}

.nhEyebrow{
  margin:0 0 30px;
  color:var(--nh-green-dark);
  font-size:16px;
  font-weight:700;
  letter-spacing:.32em;
  text-transform:uppercase;
}

.nhHero h1{
  margin:0;
  color:var(--nh-ink);
  font-family:Georgia, "Times New Roman", serif;
  font-size:clamp(56px, 5.05vw, 74px);
  line-height:1.08;
  font-weight:400;
  letter-spacing:-.015em;
  max-width:10.4ch;
}

.nhHero h1 span{
  display:block;
  white-space:nowrap;
}

.nhLead{
  margin:22px 0 0;
  color:#40514c;
  max-width:450px;
  font-size:17px;
  line-height:1.55;
}

.nhHeroCta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-top:38px;
  min-height:52px;
  padding:0 34px;
  background:var(--nh-green);
  color:#fff;
  font-size:16px;
  font-weight:700;
  box-shadow:var(--nh-shadow);
  transition:transform .18s ease, background .18s ease;
}

.nhHeroCta:hover{
  transform:translateY(-1px);
  background:var(--nh-green-dark);
}

.nhNote{
  margin:44px 0 0;
  display:flex;
  align-items:center;
  gap:16px;
  color:#53615d;
  font-size:16px;
}

.nhNote span{
  width:46px;
  height:1px;
  background:var(--nh-green);
  display:block;
  flex:0 0 auto;
}

.nhQuote{
  min-height:215px;
  padding:36px 24px 54px;
  display:grid;
  justify-items:center;
  align-content:start;
  text-align:center;
  background:#fff;
}

.nhQuote span{
  color:#b8d7ce;
  font-family:Georgia, "Times New Roman", serif;
  font-size:54px;
  line-height:.8;
  height:32px;
}

.nhQuote p{
  margin:20px 0 0;
  color:#1d2926;
  font-family:Georgia, "Times New Roman", serif;
  font-size:clamp(23px, 2.2vw, 31px);
  line-height:1.35;
  font-style:italic;
}

.nhQuote strong{
  color:var(--nh-ink);
  font-weight:700;
}

.nhQuote i{
  margin-top:26px;
  width:52px;
  height:1px;
  background:var(--nh-green);
}

@media (max-width: 1040px){
  main{
    padding-top:92px;
  }

  .nhHeader{
    grid-template-columns:1fr auto;
    align-items:center;
    width:100%;
    height:92px;
    min-height:92px;
    top:0;
    padding:0 18px 0 14px;
    border-radius:0;
    border-color:rgba(21,144,141,0);
    box-shadow:0 6px 24px rgba(30,45,40,.08);
    backdrop-filter:blur(14px);
  }

  .nhNav{ display:none; }

  .nhTopCta{
    display:none;
  }

  .nhBrand{
    min-width:0;
    align-items:center;
  }

  .nhMobileBurger{
    appearance:none;
    width:46px;
    height:46px;
    display:inline-grid;
    place-items:center;
    gap:0;
    position:relative;
    border:0;
    border-radius:0;
    background:transparent;
    color:var(--nh-green-dark);
    box-shadow:none;
    cursor:pointer;
    transform:translateZ(0);
    transition:color .2s ease;
    -webkit-tap-highlight-color:transparent;
  }

  .nhMobileBurger span{
    position:absolute;
    right:6px;
    width:28px;
    height:2px;
    border-radius:999px;
    background:currentColor;
    transform-origin:50% 50%;
    transition:none;
    backface-visibility:hidden;
  }

  .nhMobileBurger span:nth-child(1){ transform:translateY(-8px); }
  .nhMobileBurger span:nth-child(2){
    width:20px;
    right:6px;
  }
  .nhMobileBurger span:nth-child(3){ transform:translateY(8px); }

  .nhMobileBurger.is-open span:nth-child(1){
    width:28px;
    right:6px;
    transform:rotate(45deg);
  }

  .nhMobileBurger.is-open span:nth-child(2){
    opacity:0;
    transform:scaleX(.2);
  }

  .nhMobileBurger.is-open span:nth-child(3){
    width:28px;
    right:6px;
    transform:rotate(-45deg);
  }

  body.is-scrolled .nhMobileBurger{
    width:46px;
    height:46px;
  }

  body.is-scrolled .nhHeader{
    width:calc(100% - 18px);
    min-height:72px;
    height:72px;
    top:8px;
    padding:0 16px 0 8px;
    border-radius:8px;
    border-color:rgba(21,144,141,.12);
    box-shadow:0 14px 34px rgba(24,42,35,.12);
  }

  body.nhMobileMenuOpen{
    overflow:hidden;
  }

  body.nhMobileMenuOpen .nhHeader{
    box-shadow:0 12px 34px rgba(24,42,35,.08);
  }

  .nhMobileDrawer{
    position:fixed;
    inset:0;
    z-index:60;
    display:block;
    pointer-events:none;
    background:rgba(18,32,27,0);
    transition:background .42s ease;
  }

  body.nhMobileMenuOpen .nhMobileDrawer{
    pointer-events:auto;
    background:rgba(18,32,27,.24);
  }

  .nhMobileDrawer__panel{
    width:min(88vw, 390px);
    min-height:100%;
    padding:18px 18px 22px;
    display:flex;
    flex-direction:column;
    background:
      linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(251,250,247,.98) 100%);
    box-shadow:30px 0 80px rgba(20,36,31,.18);
    transform:translateX(-106%);
    transition:transform .62s cubic-bezier(.16, 1, .3, 1);
  }

  body.nhMobileMenuOpen .nhMobileDrawer__panel{
    transform:translateX(0);
  }

  .nhMobileDrawer__top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    margin-bottom:18px;
  }

  .nhMobileDrawer__mark{
    width:188px;
    height:66px;
    display:block;
    background:var(--nh-green-dark);
    -webkit-mask:url("../assets/brand/logo-mobile-mask.png") left center / auto 96% no-repeat;
    mask:url("../assets/brand/logo-mobile-mask.png") left center / auto 96% no-repeat;
  }

  .nhMobileDrawer__close{
    width:48px;
    height:48px;
    display:grid;
    place-items:center;
    position:relative;
    border:0;
    border-radius:0;
    background:transparent;
    color:var(--nh-green-dark);
    cursor:pointer;
    transition:transform .24s cubic-bezier(.16, 1, .3, 1), color .2s ease;
  }

  .nhMobileDrawer__close:hover{
    transform:rotate(90deg);
    color:#0b5d57;
  }

  .nhMobileDrawer__close span{
    position:absolute;
    width:30px;
    height:2.5px;
    border-radius:999px;
    background:currentColor;
  }

  .nhMobileDrawer__close span:first-child{ transform:rotate(45deg); }
  .nhMobileDrawer__close span:last-child{ transform:rotate(-45deg); }

  .nhMobileDrawer__nav{
    display:grid;
    gap:10px;
    padding:8px 0 18px;
    overflow:auto;
    overscroll-behavior:contain;
  }

  .nhMobileDrawer__link,
  .nhMobileDrawer__group summary{
    min-height:58px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    padding:0 18px;
    border:1px solid rgba(21,144,141,.12);
    border-radius:8px;
    background:#fff;
    color:#20372f;
    font-size:18px;
    font-weight:760;
    letter-spacing:-.01em;
    box-shadow:none;
  }

  .nhMobileDrawer__group{
    overflow:hidden;
  }

  .nhMobileDrawer__group summary{
    list-style:none;
    cursor:pointer;
  }

  .nhMobileDrawer__group summary::-webkit-details-marker{
    display:none;
  }

  .nhMobileDrawer__group summary i{
    width:24px;
    height:24px;
    display:block;
    border-radius:999px;
    border:1px solid rgba(15,118,110,.22);
    position:relative;
    flex:0 0 auto;
    transition:background .24s ease, border-color .24s ease;
  }

  .nhMobileDrawer__group summary i::before,
  .nhMobileDrawer__group summary i::after{
    content:"";
    position:absolute;
    inset:50% auto auto 50%;
    width:10px;
    height:2px;
    background:var(--nh-green-dark);
    border-radius:999px;
    transform:translate(-50%, -50%);
  }

  .nhMobileDrawer__group summary i::after{
    transform:translate(-50%, -50%) rotate(90deg);
    transition:opacity .2s ease;
  }

  .nhMobileDrawer__group.is-open summary{
    background:#f4fbfa;
    color:var(--nh-green-dark);
  }

  .nhMobileDrawer__group.is-open summary i{
    background:#fff;
    border-color:rgba(15,118,110,.28);
  }

  .nhMobileDrawer__group.is-open summary i::after{
    opacity:0;
  }

  .nhMobileDrawer__sub{
    display:grid;
    gap:8px;
    padding:8px 0 4px 18px;
    overflow:hidden;
    opacity:0;
    transition:max-height .42s cubic-bezier(.22, 1, .36, 1), opacity .28s ease;
  }

  .nhMobileDrawer__group.is-open .nhMobileDrawer__sub{
    opacity:1;
  }

  .nhMobileDrawer__sub a{
    min-height:48px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:12px 14px;
    border-left:1px solid rgba(21,144,141,.2);
    background:#fff;
    color:#2b423a;
    font-size:15px;
    font-weight:720;
    line-height:1.18;
  }

  .nhMobileDrawer__sub small{
    color:#77877f;
    font-size:11px;
    font-weight:650;
    white-space:nowrap;
  }

  .nhMobileDrawer__cta{
    margin-top:auto;
    width:min(100%, 300px);
    align-self:center;
    min-height:54px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    padding:0 18px;
    background:var(--nh-green-dark);
    color:#fff;
    font-size:16px;
    font-weight:780;
    box-shadow:0 18px 34px rgba(21,144,141,.18);
  }

  .nhHero{
    min-height:680px;
  }

  .nhHero__image{
    width:76%;
    opacity:.9;
  }
}

@media (max-width: 760px){
  .nhHeader{
    padding:0 14px 0 2px;
    gap:14px;
  }

  .nhBrand span{
    font-size:14px;
    letter-spacing:.06em;
  }

  .nhTopCta{
    display:none;
  }

  .nhMobileDrawer__panel{
    width:min(91vw, 370px);
    padding:16px 14px 18px;
  }

  .nhHero{
    min-height:760px;
    display:flex;
    align-items:flex-start;
  }

  .nhHero__image{
    inset:0;
    width:100%;
    height:100%;
    opacity:1;
    background-image:
      linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(255,255,255,.88) 22%, rgba(255,255,255,.4) 48%, rgba(255,255,255,.96) 92%),
      url("../assets/optimized/hero/luigina-hero-768-v1.webp");
    background-position:62% bottom;
  }

  .nhHero__content{
    width:calc(100% - 36px);
    margin:0 auto;
    padding-top:54px;
  }

  .nhEyebrow{
    font-size:12px;
    letter-spacing:.24em;
    margin-bottom:20px;
  }

  .nhHero h1{
    max-width:9.8ch;
    font-size:clamp(42px, 13vw, 58px);
    line-height:1.06;
  }

  .nhLead{
    font-size:16px;
    max-width:330px;
  }

  .nhHeroCta{
    width:100%;
    min-height:50px;
    padding:0 16px;
    margin-top:26px;
    font-size:15px;
  }

  .nhNote{
    margin-top:26px;
    font-size:14px;
    align-items:flex-start;
  }

  .nhQuote{
    padding-top:22px;
  }
}
