/* NetHome+ homepage V4 | scoped visual redesign; load after the existing Sage bundle.
The primary site header, product templates and checkout are not modified on other pages. */

/* ── Header / navigation ── */
.nhp-homepage-header {
  position: relative;
  z-index: 9990;
  background: #fff;
}
.nhp-homepage-nav.nav {
  background: #fff;
  position: relative;
  z-index: 9990;
}
.nhp-homepage-nav__inner {
  box-sizing:border-box;
  min-height: 66px;
  display: grid;
  grid-template-columns: 205px minmax(0, 1fr) minmax(385px, 440px);
  gap: 23px;
  align-items: center;
  max-width: 1840px;
  margin: 0 auto;
  padding: 10px 3.3%;
}
.nhp-homepage-nav__logo {
  display:inline-block;
  width: max-content;
  color: #121212 !important;
  font: 800 31px/1 Arial, sans-serif !important;
  letter-spacing: -1.6px;
  text-decoration: none !important;
  white-space: nowrap;
}
.nhp-homepage-nav__logo span {
  color: #b78a53;
}
.nhp-homepage-nav__links.nav__list--links {
  display: flex;
  gap: clamp(15px, 1.8vw, 27px);
  list-style: none;
  position: static;
  z-index: auto;
  width: auto;
  height: auto;
  padding: 0;
  margin: 0;
  transform: none;
  background: transparent;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}
.nhp-homepage-nav__links li {
  list-style: none;
  margin: 0;
  padding: 0;
}
.nhp-homepage-nav__links a {
  display:inline-block;
  color:#242424 !important;
  text-decoration:none !important;
  font: 700 14.5px/1.35 Arial, sans-serif !important;
  white-space:nowrap;
  letter-spacing: -0.12px;
  padding: 11px 0;
}
.nhp-homepage-nav__links a:hover, .nhp-homepage-nav__links a:focus-visible {
  color: #a97841 !important;
}
.nhp-homepage-nav__links a:focus-visible {
  outline:2px solid #a97841;
  outline-offset:4px;
  border-radius:2px;
}
.nhp-homepage-nav__tools {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
.nhp-homepage-nav__cart {
  display:flex;
  align-items:center;
  justify-content:center;
  flex:none;
  color:#222 !important;
  width:28px;
  height:36px;
  position:relative;
}
.nhp-homepage-nav__cart-count {
  display:flex;
  align-items:center;
  justify-content:center;
  position:absolute;
  right:-5px;
  top:-4px;
  width:17px;
  height:17px;
  background:#151515;
  color:#fff;
  border-radius:50%;
  font: 700 10px/1 Arial,sans-serif;
}
.nhp-homepage-nav__burger.burger {
  display: none;
}

/* Reuse the existing advanced filter panel + NHP live search without the old slogan strip. */
.nhp-homepage-header .archive-sticky-shell {
  position:static !important;
  display:block;
  background:transparent !important;
  flex:1;
  min-width:0;
  width:100%;
  padding:0 !important;
  margin:0 !important;
  box-shadow:none !important;
  border:0 !important;
}
.nhp-homepage-header .archive-sticky-shell__inner {
  padding:0 !important;
  margin:0 !important;
}
.nhp-homepage-header .nh-values,
.nhp-homepage-header .products-list-header,
.nhp-homepage-header .nhp-active-chips {
  display:none !important;
}
.nhp-homepage-header .archive-toolbar {
  margin:0 !important;
}
.nhp-homepage-header .archive-toolbar__inner {
  display:flex;
  align-items:center;
  flex-wrap:nowrap;
  gap:12px;
  margin:0 !important;
}
.nhp-homepage-header .archive-toolbar__filter {
  order:0;
  flex:none;
}
.nhp-homepage-header .archive-toolbar__search {
  order:1;
  flex:1;
  min-width:0;
}
.nhp-homepage-header .nhp-filter-btn {
  background:#151515 !important;
  color:#fff !important;
  border:1px solid #151515 !important;
  border-radius:6px;
  min-height:40px;
  font:600 12px/1.2 Arial,sans-serif;
  padding:9px 16px;
  transition:background .2s;
}
.nhp-homepage-header .nhp-filter-btn:hover {
  background:#414141 !important;
}
.nhp-homepage-header .nhp-filter-btn svg {
  color:#fff;
}
.nhp-homepage-header .nhp-search {
  min-width:0;
}
.nhp-homepage-header .nhp-search__input {
  height:41px;
  width:100%;
  padding:0 39px 0 16px;
  border:1px solid #d6d6d6;
  border-radius:7px;
  box-shadow:0 1px 1px rgba(0,0,0,.02);
  color:#1d1d1d;
  font:400 13px/1.4 Arial,sans-serif;
}
.nhp-homepage-header .nhp-search__submit {
  color:#292929;
}
.nhp-homepage-header .nhp-search__dropdown {
  min-width: min(370px, 85vw);
  border-radius:6px;
  z-index:10002;
}
.nhp-homepage-header .nhp-filter-overlay {
  z-index:10015 !important;
}
.nhp-homepage-header .nhp-filter-panel {
  z-index:10016 !important;
}
.nhp-homepage-header .nhp-filter-panel * {
  box-sizing: border-box;
}

/* ── Hero ── */
.nhp-homepage {
  background:#fff;
  color:#1d1b19;
  width:100%;
  font-family:Arial,Helvetica,sans-serif;
}
.nhp-homepage *, .nhp-homepage *::before, .nhp-homepage *::after {
  box-sizing:border-box;
}
.nhp-homepage__hero {
  display:grid;
  grid-template-columns:47.25% 52.75%;
  min-height:540px;
  width:100%;
}
.nhp-homepage__portrait {
  overflow:hidden;
  position:relative;
  min-height:540px;
  background:#c6b4a2;
}
.nhp-homepage__portrait-img {
  display:block;
  position:absolute;
  width:100%;
  height:100%;
  inset:0;
  object-fit:cover;
  object-position:center 35%;
}
.nhp-homepage__hero-copy {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start;
  padding:42px clamp(38px, 4.0vw, 72px);
  background:
    radial-gradient(ellipse at 78% 18%,rgba(255,255,255,.88),transparent 55%),
    radial-gradient(ellipse at 98% 84%,rgba(212,195,175,.20),transparent 54%),
    linear-gradient(105deg,#f5eee7 0%,#faf4ed 56%,#f1e9df 100%);
}
/* Decorative transparent still life: behind the copy, hidden on compact screens. */
.nhp-homepage__hero-copy::after {
  content:"";
  position:absolute;
  z-index:-1;
  inset:0 0 0 auto;
  width:22%;
  pointer-events:none;
  background:url('./nhp-hero-stilllife-v4.webp') right bottom / auto 100% no-repeat;
  opacity:.68;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.22) 28%,#000 72%);
  mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.22) 28%,#000 72%);
}
.nhp-homepage__hero-copy > * {
  position:relative;
  z-index:1;
}
.nhp-homepage__eyebrow {
  display:block;
  color:#ae7848;
  font:700 11px/1.4 Arial,Helvetica,sans-serif;
  letter-spacing:2px;
  text-transform:uppercase;
}
.nhp-homepage h1.nhp-homepage__title {
  max-width:685px;
  margin:13px 0 21px;
  color:#131212;
  font:400 clamp(41px, 3.78vw, 57px)/1.06 Georgia,'Times New Roman',serif !important;
  letter-spacing:-1.9px;
}
.nhp-homepage__body-copy {
  max-width:610px;
}
.nhp-homepage__body-copy p {
  margin:0 0 17px;
  color:#353331;
  font:400 clamp(14px, 1.05vw, 15.6px)/1.53 Arial,Helvetica,sans-serif;
}
.nhp-homepage__body-copy p:last-child {
  margin-bottom:0;
}
.nhp-homepage__actions {
  display:flex;
  flex-wrap:wrap;
  gap:15px;
  margin-top:28px;
}
.nhp-homepage a.nhp-homepage__button {
  min-height:47px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:28px;
  padding:12px 28px;
  border:1px solid #171717;
  border-radius:6px;
  text-decoration:none !important;
  font:600 14px/1.2 Arial,Helvetica,sans-serif !important;
  transition:background .2s,color .2s;
}
.nhp-homepage__button span {
  font-size:19px;
  line-height:0.7;
}
.nhp-homepage a.nhp-homepage__button--primary {
  background:#171717;
  color:#fff !important;
}
.nhp-homepage a.nhp-homepage__button--primary:hover {
  background:#454545;
}
.nhp-homepage a.nhp-homepage__button--secondary {
  background:transparent;
  color:#171717 !important;
}
.nhp-homepage a.nhp-homepage__button--secondary:hover {
  background:#fff;
}

/* ── Benefits strip ── */
.nhp-homepage__benefits {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:0;
  background:linear-gradient(105deg,#f9f8f7,#f5f1ec);
  padding:24px 3.35%;
}
.nhp-homepage__benefit {
  display:flex;
  align-items:center;
  gap:21px;
  padding:2px clamp(10px,2.5vw,35px);
  min-height:82px;
  border-right:1px solid #dfd8d1;
}
.nhp-homepage__benefit:first-child {
  padding-left:0;
}
.nhp-homepage__benefit:last-child {
  border-right:0;
  padding-right:0;
}
.nhp-homepage__benefit-icon {
  display:flex;
  justify-content:center;
  align-items:center;
  flex:none;
  width:61px;
  height:61px;
  border-radius:50%;
  background:#f0eae4;
}
.nhp-homepage__benefit-icon svg {
  width:25px;
  height:25px;
  stroke:#201e1b;
  stroke-width:1.65;
  stroke-linejoin:round;
  stroke-linecap:round;
}
.nhp-homepage__benefit h2 {
  margin:0 0 5px;
  color:#222;
  font:700 15.5px/1.25 Arial,sans-serif !important;
}
.nhp-homepage__benefit p {
  margin:0;
  color:#6d6863;
  font:400 13px/1.45 Arial,sans-serif;
}

/* ── Curated project catalog ── */
.nhp-homepage__projects {
  max-width:1740px;
  margin:0 auto;
  padding:37px 3.35% 65px;
}
.nhp-homepage__section-top {
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:24px;
  margin-bottom:24px;
}
.nhp-homepage__section-top h2, .nhp-homepage__how-heading h2 {
  margin:9px 0 0;
  color:#151515;
  font:400 clamp(32px,3.05vw,45px)/1.15 Georgia,'Times New Roman',serif !important;
  letter-spacing:-.9px;
}
.nhp-homepage a.nhp-homepage__all-link {
  white-space:nowrap;
  display:inline-flex;
  align-items:center;
  gap:14px;
  padding-bottom:7px;
  color:#171717 !important;
  text-decoration:underline;
  text-underline-offset:4px;
  font:600 13px/1.4 Arial,sans-serif !important;
}
.nhp-homepage__all-link span {
  font-size:18px;
}
.nhp-homepage__projects-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:28px 22px;
}
.nhp-homepage__project-card {
  min-width:0;
}
.nhp-homepage__project-link {
  display:block;
  color:#181818 !important;
  text-decoration:none !important;
}
.nhp-homepage__project-photo {
  overflow:hidden;
  border-radius:8px;
  background:#efeae4;
  aspect-ratio:1.56/1;
}
.nhp-homepage__project-img {
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .35s ease;
}
.nhp-homepage__project-link:hover .nhp-homepage__project-img {
  transform:scale(1.025);
}
.nhp-homepage__project-no-image {
  display:flex;
  height:100%;
  align-items:center;
  justify-content:center;
  font:700 24px/1.2 Arial,sans-serif;
  color:#b9a48b;
}
.nhp-homepage__project-caption {
  padding:14px 1px 4px;
}
.nhp-homepage__project-caption h3 {
  font:600 18px/1.3 Arial,sans-serif !important;
  margin:0 0 6px;
  color:#161616;
}
.nhp-homepage__project-caption p {
  margin:0 0 4px;
  color:#625e59;
  font:400 12px/1.5 Arial,sans-serif;
}
.nhp-homepage__project-caption p.nhp-homepage__project-price {
  margin-top:9px;
  color:#1c1c1c;
  font:700 15px/1.35 Arial,sans-serif;
}
.nhp-homepage__project-price span,.nhp-homepage__project-price ins,.nhp-homepage__project-price bdi {
  font:inherit;
  color:inherit;
}
.nhp-homepage__empty {
  padding:30px 0;
  color:#777;
}

/* ── Simple purchasing flow ── */
.nhp-homepage__how {
  padding:55px max(3.35%, calc((100% - 1650px)/2)) 65px;
  text-align:center;
  background:#f8f6f3;
}
.nhp-homepage__steps {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:22px;
  margin:32px auto 30px;
}
.nhp-homepage__step {
  background:white;
  border:1px solid #eae4dd;
  border-radius:8px;
  padding:29px 25px;
  text-align:left;
}
.nhp-homepage__step>span {
  display:inline-flex;
  justify-content:center;
  align-items:center;
  width:44px;
  height:44px;
  border-radius:50%;
  background:#f0eae4;
  color:#8b6c4d;
  font:700 16px/1 Arial,sans-serif;
}
.nhp-homepage__step h3 {
  color:#242424;
  font:700 19px/1.2 Arial,sans-serif !important;
  margin:16px 0 7px;
}
.nhp-homepage__step p {
  color:#6a6662;
  font:400 14px/1.5 Arial,sans-serif;
  margin:0;
}
.nhp-homepage__how .nhp-homepage__all-link {
  margin:0 auto;
}
.nhp-homepage__designers {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:35px;
  max-width:1500px;
  margin:0 auto;
  padding:52px 4%;
}
.nhp-homepage__designers h2 {
  margin:9px 0;
  color:#1e1c1a;
  font:400 clamp(28px,2.4vw,35px)/1.2 Georgia,serif !important;
}
.nhp-homepage__designers p {
  margin:0;
  max-width:610px;
  color:#6a655f;
  font:400 14px/1.55 Arial,sans-serif;
}
.nhp-homepage__designers .nhp-homepage__button {
  flex:none;
}

/* Accessibility and responsive layouts */
.nhp-homepage a:focus-visible, .nhp-homepage-nav a:focus-visible,
.nhp-homepage-nav button:focus-visible {
  outline:3px solid #af8151 !important;
  outline-offset:3px;
}

@media (max-width:1450px) {
  .nhp-homepage-nav__inner {
    grid-template-columns:190px minmax(0,1fr) minmax(355px,410px);
    gap:13px;
    padding-left:3%;
    padding-right:3%;
  }
  .nhp-homepage-nav__links.nav__list--links {
    gap:14px;
  }
  .nhp-homepage-nav__links a {
    font-size:14px !important;
  }
  .nhp-homepage__hero-copy {
    padding-left:clamp(35px,3vw,55px);
    padding-right:clamp(35px,3vw,55px);
  }
}
@media (max-width:1180px) {
  .nhp-homepage-nav__inner {
    display:flex;
    min-height:69px;
    justify-content:space-between;
  }
  .nhp-homepage-nav__logo {
    flex:none;
  }
  .nhp-homepage-nav__tools {
    margin-left:auto;
    width: min(465px, 58vw);
  }
  .nhp-homepage-nav__burger.burger {
    display:block;
    flex:none;
    right:auto;
    z-index:10002;
  }
  .nhp-homepage-nav .nav__list--links.nhp-homepage-nav__links {
    display:flex;
    position:fixed;
    top:0;
    left:0;
    z-index:10000;
    flex-direction:column;
    align-items:start;
    justify-content:start;
    gap:15px;
    width:min(440px,100vw);
    height:100vh;
    padding:105px 30px 30px;
    margin:0;
    background:#fff;
    overflow-y:auto;
    box-shadow:0 0 20px rgba(0,0,0,.07);
    transform:translateX(-110%);
    transition:transform .25s ease;
  }
  .nhp-homepage-nav.nav--active .nav__list--links.nhp-homepage-nav__links {
    transform:translateX(0);
  }
  .nhp-homepage-nav__links a {
    font-size:18px !important;
    font-weight:700 !important;
  }
  .nhp-homepage__hero {
    grid-template-columns:43% 57%;
  }
  .nhp-homepage__title {
    font-size:clamp(36px,3.8vw,48px) !important;
  }
  .nhp-homepage__benefit {
    gap:12px;
    padding:0 16px;
  }
  .nhp-homepage__benefit-icon {
    width:46px;
    height:46px;
  }
  .nhp-homepage__benefit h2 {
    font-size:13px !important;
  }
  .nhp-homepage__benefit p {
    font-size:11px;
  }
}
@media (max-width:850px) {
  .nhp-homepage__hero {
    grid-template-columns:1fr 1fr;
    min-height:0;
  }
  .nhp-homepage__portrait {
    min-height:510px;
  }
  .nhp-homepage__hero-copy {
    padding:32px 25px;
  }
  .nhp-homepage__title {
    font-size:36px !important;
    letter-spacing:-1px !important;
  }
  .nhp-homepage__body-copy p {
    font-size:13px;
    line-height:1.45;
  }
  .nhp-homepage__benefits {
    grid-template-columns:repeat(2,1fr);
    gap:20px 10px;
    padding:23px 4%;
  }
  .nhp-homepage__benefit {
    border:0;
    padding:0 12px !important;
  }
  .nhp-homepage__projects-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media (max-width:650px) {
  .nhp-homepage-nav__inner {
    padding:10px 15px;
    flex-wrap:wrap;
    gap:9px;
  }
  .nhp-homepage-nav__logo {
    font-size:26px !important;
  }
  .nhp-homepage-nav__tools {
    width:auto;
    min-width:0;
    flex:1;
    justify-content:end;
    gap:9px;
  }
  .nhp-homepage-header .archive-toolbar__inner {
    gap:6px;
  }
  .nhp-homepage-header .nhp-filter-btn {
    padding:10px;
    width:42px;
    justify-content:center;
  }
  .nhp-homepage-header .nhp-filter-btn__label {
    display:none;
  }
  .nhp-homepage-header .archive-toolbar__search {
    min-width:0;
  }
  .nhp-homepage-header .nhp-search__input {
    height:40px;
    min-width:0;
    font-size:12px;
    padding-left:10px;
  }
  .nhp-homepage-nav__cart {
    display:none;
  }
  .nhp-homepage-nav__burger.burger {
    margin:0;
    padding:12px 5px;
  }
  .nhp-homepage__hero {
    display:flex;
    flex-direction:column;
  }
  .nhp-homepage__portrait {
    min-height:0;
    height:min(83vw,440px);
  }
  .nhp-homepage__portrait-img {
    object-position:center 38%;
  }
  .nhp-homepage__hero-copy {
    padding:36px 6% 40px;
  }
  .nhp-homepage h1.nhp-homepage__title {
    font-size:clamp(37px,9vw,48px) !important;
    max-width:520px;
  }
  .nhp-homepage__body-copy p {
    font-size:14px;
    line-height:1.55;
    margin-bottom:14px;
  }
  .nhp-homepage__actions {
    gap:9px;
    margin-top:22px;
  }
  .nhp-homepage a.nhp-homepage__button {
    font-size:13px !important;
    gap:10px;
    padding:12px 16px;
  }
  .nhp-homepage__benefits {
    grid-template-columns:1fr 1fr;
    gap:12px;
  }
  .nhp-homepage__benefit {
    gap:8px;
    align-items:flex-start;
  }
  .nhp-homepage__benefit-icon {
    width:38px;
    height:38px;
  }
  .nhp-homepage__benefit-icon svg {
    width:20px;
    height:20px;
  }
  .nhp-homepage__benefit h2 {
    font-size:12px !important;
  }
  .nhp-homepage__benefit p {
    font-size:11.5px;
    line-height:1.45;
  }
  .nhp-homepage__projects {
    padding:38px 5% 50px;
  }
  .nhp-homepage__section-top {
    display:block;
  }
  .nhp-homepage__section-top h2 {
    font-size:32px !important;
  }
  .nhp-homepage__section-top .nhp-homepage__all-link {
    margin-top:13px;
  }
  .nhp-homepage__projects-grid {
    grid-template-columns:1fr;
    gap:22px;
  }
  .nhp-homepage__project-caption h3 {
    font-size:16px !important;
  }
  .nhp-homepage__how {
    padding:42px 5%;
  }
  .nhp-homepage__steps {
    grid-template-columns:1fr;
    gap:12px;
    margin:24px 0;
  }
  .nhp-homepage__step {
    padding:20px;
  }
  .nhp-homepage__designers {
    display:block;
    padding:44px 6%;
  }
  .nhp-homepage__designers .nhp-homepage__button {
    margin-top:22px;
  }
}
@media (max-width:400px) {
  .nhp-homepage-header .nhp-search__input {
    width:105px;
  }
  .nhp-homepage-nav__logo {
    font-size:23px !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  .nhp-homepage *, .nhp-homepage-nav * {
    transition:none !important;
    scroll-behavior:auto !important;
  }
}

.nhp-homepage__demo-notice {
  position:absolute;
  bottom:13px;
  left:13px;
  right:13px;
  width:fit-content;
  max-width:calc(100% - 26px);
  z-index:1;
  padding:7px 12px;
  color:#fff;
  background:rgba(0,0,0,.68);
  border-radius:4px;
  font:600 11px/1.4 Arial,sans-serif;
}

/* ── Reference-matching refinements ── */
.nhp-homepage__benefit > div { min-width:0; }
.nhp-homepage__benefit p { max-width:245px; }
.nhp-homepage__benefit-icon svg { width:27px; height:27px; }
.nhp-homepage__section-top h2 { text-wrap:balance; }
.nhp-homepage__title { text-wrap:balance; white-space:pre-line; }
.nhp-homepage__project-link:focus-visible { outline:3px solid #a87949; outline-offset:4px; }
@media (max-width:1180px) {
  .nhp-homepage__hero-copy::after { display:none; }
  .nhp-homepage__benefit-icon { width:49px; height:49px; }
  .nhp-homepage__benefit p { font-size:12px; line-height:1.4; }
}
@media (max-width:650px) {
  .nhp-homepage__title { text-wrap:pretty; }
}
@media (max-width:520px) {
  .nhp-homepage__benefits { grid-template-columns:1fr; gap:0; padding:10px 6%; }
  .nhp-homepage__benefit { gap:17px; padding:13px 0 !important; border:0; border-bottom:1px solid #e5ded7; align-items:center; }
  .nhp-homepage__benefit:last-child { border-bottom:0; }
  .nhp-homepage__benefit-icon { width:48px; height:48px; }
  .nhp-homepage__benefit h2 { font-size:14px !important; }
  .nhp-homepage__benefit p { max-width:none; font-size:12.5px; }
}
