/* Business section — desktop geometry follows the approved reference mockup. */
#business{
  --business-height:clamp(420px,22.65625vw,464px);
  --business-gutter:clamp(52px,3.71094vw,76px);
  --benefit-icon:clamp(44px,2.44141vw,50px);
  position:relative!important;
  overflow:hidden!important;
  width:100%!important;
  height:var(--business-height)!important;
  min-height:var(--business-height)!important;
  padding:0!important;
  background:linear-gradient(180deg,#813e1b 0%,#7d3b19 10%,#773918 20%,#713516 30%,#6d3416 40%,#6c3416 50%,#6a3215 62%,#682e10 100%)!important;
}
#business:before,
#business:after{
  content:none!important;
  display:none!important;
  background:none!important;
  opacity:0!important;
}
#business>.wrap.split{
  position:relative!important;
  display:grid!important;
  grid-template-columns:39% 23% 38%!important;
  grid-template-rows:1fr!important;
  grid-template-areas:'title copy visual'!important;
  align-items:stretch!important;
  width:100%!important;
  max-width:none!important;
  height:var(--business-height)!important;
  min-height:var(--business-height)!important;
  margin:0!important;
  padding:0!important;
  gap:0!important;
}
#business .business-title{
  grid-area:title!important;
  align-self:start!important;
  position:relative!important;
  z-index:2!important;
  margin:0!important;
  padding:clamp(74px,4.10156vw,84px) clamp(20px,1.17188vw,24px) 0 var(--business-gutter)!important;
}
#business .business-copy{
  grid-area:copy!important;
  align-self:start!important;
  position:relative!important;
  z-index:2!important;
  width:100%!important;
  margin:0!important;
  padding:clamp(96px,5.41992vw,111px) 0 0 clamp(34px,1.95313vw,40px)!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
}
#business .business-benefits,
#business .business-benefits.product-points{
  position:absolute!important;
  z-index:3!important;
  left:var(--business-gutter)!important;
  top:clamp(260px,14.55078vw,298px)!important;
  width:clamp(690px,37.10938vw,760px)!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
}
#business .business-visual-space{
  grid-area:visual!important;
  position:relative!important;
  display:block!important;
  visibility:visible!important;
  align-self:stretch!important;
  width:calc(100% + clamp(92px,5.85938vw,120px))!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  margin:0 0 0 calc(clamp(92px,5.85938vw,120px) * -1)!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background-image:url('../images/business-coaster-scene.webp')!important;
  background-size:cover!important;
  background-position:center 55%!important;
  background-repeat:no-repeat!important;
  box-shadow:none!important;
  opacity:1!important;
  filter:none!important;
  mix-blend-mode:normal!important;
  pointer-events:none!important;
  overflow:hidden!important;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.06) 8%,rgba(0,0,0,.18) 16%,rgba(0,0,0,.38) 25%,rgba(0,0,0,.66) 35%,rgba(0,0,0,.88) 44%,#000 54%,#000 100%)!important;
  mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.06) 8%,rgba(0,0,0,.18) 16%,rgba(0,0,0,.38) 25%,rgba(0,0,0,.66) 35%,rgba(0,0,0,.88) 44%,#000 54%,#000 100%)!important;
  -webkit-mask-repeat:no-repeat!important;
  mask-repeat:no-repeat!important;
  -webkit-mask-size:100% 100%!important;
  mask-size:100% 100%!important;
}
#business .business-visual-space:before{
  content:none!important;
  display:none!important;
}
#business .eyebrow{
  margin:0 0 clamp(17px,.97656vw,20px)!important;
  color:#f5c9ae!important;
  font-size:clamp(13px,.73242vw,15px)!important;
  line-height:1.6!important;
  font-weight:800!important;
  letter-spacing:.13em!important;
}
#business h2{
  max-width:700px!important;
  margin:0!important;
  color:#fff!important;
  font-size:clamp(46px,2.53906vw,52px)!important;
  line-height:1.02!important;
  font-weight:700!important;
  letter-spacing:-.04em!important;
  text-wrap:balance!important;
}
#business .lead-small{
  max-width:none!important;
  margin:0!important;
  color:#fff!important;
  font-size:clamp(16px,.87891vw,18px)!important;
  line-height:1.62!important;
  font-weight:500!important;
  letter-spacing:0!important;
}
#business .button.light{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:clamp(220px,12.5vw,256px)!important;
  height:clamp(56px,3.17383vw,65px)!important;
  min-height:0!important;
  margin:clamp(24px,1.41602vw,29px) 0 0 clamp(5px,.3418vw,7px)!important;
  padding:0 clamp(20px,1.17188vw,24px)!important;
  border:1px solid #ff986b!important;
  border-radius:12px!important;
  background:#fc682c!important;
  color:#fff!important;
  box-shadow:0 12px 26px #35110738!important;
  font-size:clamp(14px,.78125vw,16px)!important;
  line-height:1!important;
  font-weight:800!important;
  white-space:nowrap!important;
}
#business .button.light:after{
  content:'→'!important;
  margin-left:clamp(10px,.58594vw,12px)!important;
  font-size:clamp(17px,.97656vw,20px)!important;
  line-height:1!important;
}
#business .product-points{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:clamp(6px,.39063vw,8px)!important;
}
#business .product-point{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  min-width:0!important;
  min-height:var(--benefit-icon)!important;
  margin:0!important;
  padding:0 4px 0 clamp(54px,3.02734vw,62px)!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
#business .product-point:before{
  position:absolute!important;
  left:0!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  display:grid!important;
  place-items:center!important;
  width:var(--benefit-icon)!important;
  height:var(--benefit-icon)!important;
  border-radius:50%!important;
  background:#a94d24!important;
  color:#fff!important;
  box-shadow:inset 0 0 0 1px #ffffff35!important;
  font-size:clamp(16px,.87891vw,18px)!important;
  line-height:1!important;
}
#business .product-point:nth-child(1):before{content:'☕'!important}
#business .product-point:nth-child(2):before{content:'♡'!important}
#business .product-point:nth-child(3):before{content:'♚'!important}
#business .product-point:nth-child(4):before{content:'✦'!important}
#business .product-point b{
  display:block!important;
  color:#fff!important;
  font-size:clamp(11px,.61035vw,12.5px)!important;
  line-height:1.4!important;
  font-weight:750!important;
  letter-spacing:0!important;
}

/* Tablet: keep the content readable, then place the photo full width below it. */
@media(max-width:1280px){
  #business{
    height:auto!important;
    min-height:0!important;
  }
  #business>.wrap.split{
    grid-template-columns:1fr 1fr!important;
    grid-template-rows:auto auto auto!important;
    grid-template-areas:'title copy' 'benefits benefits' 'visual visual'!important;
    height:auto!important;
    min-height:0!important;
  }
  #business .business-title{
    padding:52px 24px 0 48px!important;
  }
  #business .business-copy{
    padding:52px 48px 20px 24px!important;
  }
  #business .business-benefits,
  #business .business-benefits.product-points{
    position:relative!important;
    left:auto!important;
    top:auto!important;
    grid-area:benefits!important;
    width:auto!important;
    margin:24px 48px 36px!important;
  }
  #business .business-visual-space{
    width:100%!important;
    min-height:390px!important;
    height:390px!important;
    margin-left:0!important;
    background-position:center!important;
    -webkit-mask-image:none!important;
    mask-image:none!important;
  }
  #business .business-visual-space:before{
    display:none!important;
  }
  #business .button.light{
    width:auto!important;
    height:auto!important;
    min-height:52px!important;
    margin-left:0!important;
    padding:14px 24px!important;
  }
}

@media(max-width:760px){
  #business>.wrap.split{
    grid-template-columns:1fr!important;
    grid-template-rows:auto auto auto auto!important;
    grid-template-areas:'title' 'copy' 'benefits' 'visual'!important;
  }
  #business .business-title{
    padding:42px 16px 0!important;
  }
  #business .business-copy{
    padding:26px 16px 20px!important;
  }
  #business .business-benefits,
  #business .business-benefits.product-points{
    margin:8px 16px 28px!important;
  }
  #business h2{
    font-size:clamp(38px,11vw,50px)!important;
  }
  #business .lead-small{
    font-size:16px!important;
  }
  #business .product-points{
    grid-template-columns:1fr 1fr!important;
    gap:8px 12px!important;
  }
  #business .business-visual-space{
    min-height:320px!important;
    height:320px!important;
  }
}

@media(max-width:520px){
  #business .product-points{
    grid-template-columns:1fr!important;
  }
  #business .product-point{
    min-height:50px!important;
  }
  #business .business-visual-space{
    min-height:260px!important;
    height:260px!important;
  }
}