/* HomeGlo — Shop by Room */
.hg-room-section{
  position:relative;
  padding:84px 0 92px!important;
  background:#f3eee7!important;
  color:#2b2622!important;
  scroll-margin-top:120px;
  overflow:hidden;
}
.hg-room-section:before{
  content:"";
  position:absolute;
  width:420px;
  height:420px;
  right:-170px;
  top:-230px;
  border-radius:50%;
  border:1px solid rgba(92,107,79,.13);
  pointer-events:none;
}
.hg-room-section .hg-shell{position:relative;z-index:1}
.hg-room-heading{
  display:grid!important;
  grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr)!important;
  gap:70px!important;
  align-items:end!important;
  margin-bottom:38px!important;
}
.hg-room-kicker{
  display:block;
  margin-bottom:9px;
  color:#5c6b4f;
  font:700 9px/1.3 "Manrope",sans-serif;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.hg-room-heading h2{
  margin:0!important;
  max-width:760px;
  color:#2b2622!important;
  font:600 clamp(44px,5.4vw,76px)/.92 "Cormorant Garamond",serif!important;
  letter-spacing:-.042em;
}
.hg-room-heading-copy p{
  margin:0 0 14px!important;
  color:#746d64!important;
  font:400 12px/1.75 "Manrope",sans-serif!important;
}
.hg-room-heading-copy>a{
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding-bottom:4px;
  border-bottom:1px solid #2b2622;
  color:#2b2622!important;
  text-decoration:none!important;
  font:700 9px/1.3 "Manrope",sans-serif!important;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.hg-room-grid{
  display:grid!important;
  grid-template-columns:repeat(12,minmax(0,1fr))!important;
  grid-auto-rows:300px;
  gap:13px!important;
}
.hg-room-card{
  position:relative;
  display:flex!important;
  flex-direction:column!important;
  min-width:0;
  min-height:0;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:#d8d0c5!important;
  color:#fff!important;
  text-decoration:none!important;
  overflow:hidden;
  isolation:isolate;
  transition:transform .3s ease,box-shadow .3s ease!important;
}
.hg-room-card:nth-child(1){grid-column:span 7;grid-row:span 2}
.hg-room-card:nth-child(2){grid-column:span 5;grid-row:span 2}
.hg-room-card:nth-child(3){grid-column:span 4}
.hg-room-card:nth-child(4){grid-column:span 4}
.hg-room-card:nth-child(5){grid-column:span 4}
.hg-room-card:hover{
  transform:translateY(-3px)!important;
  box-shadow:0 20px 42px rgba(43,38,34,.13);
}
.hg-room-card:focus-visible{outline:3px solid #c4693b;outline-offset:4px}
.hg-room-media{
  position:absolute;
  inset:0;
  z-index:-1;
}
.hg-room-media img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .65s cubic-bezier(.2,.65,.2,1),filter .4s ease;
}
.hg-room-card:hover .hg-room-media img{transform:scale(1.035);filter:saturate(1.03)}
.hg-room-shade{
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(22,18,16,.06) 15%,rgba(22,18,16,.12) 45%,rgba(22,18,16,.78) 100%);
}
.hg-room-index{
  position:absolute;
  left:18px;
  top:17px;
  display:grid;
  place-items:center;
  min-width:38px;
  height:30px;
  padding:0 9px;
  border:1px solid rgba(255,255,255,.52);
  background:rgba(31,27,24,.18);
  backdrop-filter:blur(6px);
  color:#fff;
  font:700 9px/1 "Manrope",sans-serif;
  letter-spacing:.12em;
}
.hg-room-accent{
  position:absolute;
  right:17px;
  top:18px;
  color:rgba(255,255,255,.86);
  font:600 8px/1.2 "Manrope",sans-serif;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.hg-room-copy{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:22px;
  margin-top:auto;
  padding:26px!important;
}
.hg-room-card:nth-child(-n+2) .hg-room-copy{padding:31px!important}
.hg-room-copy>div{max-width:480px}
.hg-room-copy h3{
  margin:0 0 7px!important;
  color:#fff!important;
  font:600 clamp(27px,2.8vw,42px)/.98 "Cormorant Garamond",serif!important;
  letter-spacing:-.025em;
}
.hg-room-card:nth-child(-n+2) .hg-room-copy h3{font-size:clamp(35px,3.6vw,54px)!important}
.hg-room-copy p{
  max-width:440px;
  margin:0!important;
  color:rgba(255,255,255,.82)!important;
  font:400 10.5px/1.55 "Manrope",sans-serif!important;
}
.hg-room-cta{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:#fff;
  font:700 8px/1.3 "Manrope",sans-serif!important;
  letter-spacing:.1em;
  text-transform:uppercase;
  white-space:nowrap;
}
.hg-room-credit{
  position:absolute;
  left:17px;
  bottom:9px;
  opacity:.68;
  color:#fff;
  font:500 6.5px/1.2 "Manrope",sans-serif;
  pointer-events:none;
}
.hg-room-card--bedroom .hg-room-copy{padding-bottom:31px!important}

/* Shop/archive room filter navigation */
.hg-room-nav{
  display:flex!important;
  gap:7px!important;
  flex-wrap:wrap!important;
  margin:23px 0 30px!important;
}
.hg-room-nav a{
  min-height:40px;
  display:inline-flex;
  align-items:center;
  padding:0 15px!important;
  border:1px solid #d8d0c5!important;
  border-radius:999px!important;
  background:#fff!important;
  color:#2b2622!important;
  text-decoration:none!important;
  font:700 9px/1 "Manrope",sans-serif!important;
  letter-spacing:.04em;
  transition:background .2s ease,border-color .2s ease,color .2s ease;
}
.hg-room-nav a:hover{border-color:#c4693b!important}
.hg-room-nav a[aria-current]{background:#2b2622!important;color:#fff!important;border-color:#2b2622!important}

@media(max-width:1050px){
  .hg-room-section{padding:68px 0 76px!important}
  .hg-room-heading{grid-template-columns:1fr minmax(260px,.7fr)!important;gap:44px!important}
  .hg-room-grid{grid-auto-rows:250px}
  .hg-room-card:nth-child(1){grid-column:span 7}
  .hg-room-card:nth-child(2){grid-column:span 5}
  .hg-room-copy{padding:20px!important}
  .hg-room-card:nth-child(-n+2) .hg-room-copy{padding:24px!important}
}
@media(max-width:760px){
  .hg-room-section{padding:54px 0 62px!important}
  .hg-room-section .hg-shell{width:calc(100% - 28px)!important}
  .hg-room-heading{display:block!important;margin-bottom:26px!important}
  .hg-room-heading h2{font-size:48px!important}
  .hg-room-heading-copy{margin-top:16px}
  .hg-room-heading-copy p{max-width:520px}
  .hg-room-grid{
    display:grid!important;
    grid-template-columns:none!important;
    grid-auto-flow:column!important;
    grid-auto-columns:minmax(255px,82vw)!important;
    grid-auto-rows:420px!important;
    gap:11px!important;
    overflow-x:auto!important;
    padding:0 1px 12px!important;
    scroll-snap-type:x mandatory!important;
    scrollbar-width:none!important;
    -webkit-overflow-scrolling:touch!important;
  }
  .hg-room-grid::-webkit-scrollbar{display:none}
  .hg-room-card,
  .hg-room-card:nth-child(n){
    grid-column:auto!important;
    grid-row:auto!important;
    scroll-snap-align:start;
  }
  .hg-room-copy,
  .hg-room-card:nth-child(-n+2) .hg-room-copy{display:block!important;padding:22px!important}
  .hg-room-copy h3,
  .hg-room-card:nth-child(-n+2) .hg-room-copy h3{font-size:38px!important}
  .hg-room-cta{margin-top:13px}
  .hg-room-credit{bottom:7px}
  .hg-room-card--bedroom .hg-room-copy{padding-bottom:29px!important}
  .hg-room-nav{flex-wrap:nowrap!important;overflow-x:auto!important;padding-bottom:7px!important;scrollbar-width:none}
  .hg-room-nav::-webkit-scrollbar{display:none}
  .hg-room-nav a{flex:none}
}
@media(max-width:440px){
  .hg-room-section{padding:46px 0 52px!important}
  .hg-room-heading h2{font-size:42px!important}
  .hg-room-heading-copy p{font-size:11px!important}
  .hg-room-grid{grid-auto-columns:84vw!important;grid-auto-rows:390px!important}
  .hg-room-copy h3,.hg-room-card:nth-child(-n+2) .hg-room-copy h3{font-size:34px!important}
  .hg-room-copy p{font-size:10px!important}
}
@media(prefers-reduced-motion:reduce){
  .hg-room-card,.hg-room-media img{transition:none!important}
  .hg-room-card:hover{transform:none!important}
  .hg-room-card:hover .hg-room-media img{transform:none!important}
}
