/* AI Fit landing refinements */
.problem-screen{
  overflow:visible;
  padding-top:clamp(90px,8vw,125px);
  padding-bottom:clamp(108px,9vw,140px);
}

.problem-screen.section-shell{
  width:calc(100% - clamp(48px,8vw,128px));
  max-width:none;
}

.problem-screen::before{
  border-top:0;
  border-radius:0;
  background:#050505;
}

.problem-stage{
  min-height:700px;
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(440px,.85fr);
  align-items:center;
  gap:clamp(42px,5vw,82px);
}

.problem-intro{
  position:relative;
  z-index:4;
  max-width:760px;
  padding-left:0;
}

.problem-kicker-row{
  display:block;
  margin-bottom:30px;
}

.problem-kicker-row .kicker{
  margin:0;
  color:#898991;
  font-size:10px;
  letter-spacing:.24em;
}

.problem-intro h2{
  max-width:740px;
  margin:0;
  font-family:var(--display);
  font-size:clamp(52px,5.15vw,78px);
  font-weight:800;
  line-height:.96;
  letter-spacing:-.048em;
  text-align:left;
  text-wrap:wrap;
}

.problem-lead{
  max-width:580px;
  margin:28px 0 0;
  color:#aaaab2;
  font-size:clamp(15px,1.25vw,18px);
  line-height:1.58;
}

.problem-visual{
  position:relative;
  min-height:700px;
  display:grid;
  place-items:center;
  isolation:isolate;
}

.problem-visual-glow{
  display:none;
}

.problem-mockup{
  position:relative;
  z-index:2;
  width:auto;
  height:min(680px,62vw);
  max-width:90%;
  max-height:680px;
  object-fit:contain;
  background:transparent;
  filter:drop-shadow(0 38px 80px rgba(0,0,0,.55));
}

.problem-question{
  position:absolute;
  z-index:5;
  width:min(220px,31%);
  padding:16px 18px 14px;
  border:1px solid rgba(255,122,0,.16);
  border-radius:14px;
  color:#c8b39d;
  background:linear-gradient(145deg,rgba(36,23,15,.86),rgba(14,12,11,.88));
  box-shadow:0 22px 60px rgba(0,0,0,.28),inset 0 0 22px rgba(255,122,0,.035);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  font-size:12px;
  font-weight:650;
  line-height:1.25;
  transform:rotate(var(--q-rotate,0deg));
}

.problem-question small{
  display:block;
  margin-top:10px;
  color:#787077;
  font-size:8px;
  font-weight:600;
  text-align:right;
}

.problem-question--one{--q-rotate:-3deg;left:1%;top:13%}
.problem-question--two{--q-rotate:2deg;right:0;top:33%}
.problem-question--three{--q-rotate:-1.5deg;left:4%;top:62%}
.problem-question--four{--q-rotate:2.5deg;right:2%;top:79%}

.problem-bridge{
  position:relative;
  z-index:6;
  margin-top:24px;
  padding:28px clamp(24px,3vw,38px);
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(260px,.78fr) auto;
  align-items:center;
  gap:clamp(24px,3vw,52px);
  border:1px solid rgba(255,255,255,.14);
  border-radius:20px;
  background:
    radial-gradient(circle at 2% 100%,rgba(255,122,0,.11),transparent 22rem),
    linear-gradient(135deg,rgba(18,14,12,.94),rgba(7,7,8,.96));
  box-shadow:0 28px 70px rgba(0,0,0,.22);
}

.problem-bridge-title>span{
  display:block;
  margin-bottom:12px;
  color:#d5c9be;
  font-size:9px;
  font-weight:850;
  letter-spacing:.17em;
}

.problem-bridge-title>span:before{
  content:"";
  width:8px;
  height:8px;
  margin-right:10px;
  display:inline-block;
  border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 16px rgba(255,122,0,.65);
}

.problem-bridge h3{
  max-width:620px;
  margin:0;
  font-family:var(--display);
  font-size:clamp(28px,3vw,42px);
  line-height:1.02;
  letter-spacing:-.04em;
}

.problem-bridge h3 em{
  color:var(--accent);
  font-style:normal;
}

.problem-bridge>p{
  max-width:460px;
  margin:0;
  color:#aaaab2;
  font-size:13px;
  line-height:1.6;
}

.problem-bridge>p strong{
  color:#fff;
  font-weight:720;
}

.problem-bridge-cta{
  min-height:56px;
  padding:0 18px 0 8px;
  display:inline-flex;
  align-items:center;
  gap:12px;
  border:1px solid rgba(255,255,255,.17);
  border-radius:999px;
  white-space:nowrap;
  background:rgba(9,9,10,.78);
  font-size:11px;
  font-weight:780;
  transition:border-color .22s ease,transform .22s var(--ease),background .22s ease;
}

.problem-bridge-cta:hover{
  transform:translateY(-2px);
  border-color:rgba(255,122,0,.44);
  background:rgba(255,122,0,.055);
}

.problem-bridge-cta i{
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  border:1px solid rgba(255,122,0,.62);
  border-radius:50%;
  color:#fff;
  background:rgba(255,122,0,.07);
  font-size:18px;
  font-style:normal;
}

.problem-bridge-cta b{
  color:#b8b8bf;
  font-size:13px;
  font-weight:500;
}

@media(max-width:1120px){
  .problem-stage{
    grid-template-columns:minmax(0,1.05fr) minmax(400px,.95fr);
    gap:34px;
  }

  .problem-visual{
    min-height:630px;
  }

  .problem-mockup{
    height:min(610px,62vw);
    max-height:610px;
  }

  .problem-question{
    width:190px;
    padding:13px 14px 12px;
    font-size:10px;
  }

  .problem-bridge{
    grid-template-columns:1fr 1fr;
  }

  .problem-bridge-cta{
    grid-column:1/-1;
    width:max-content;
  }
}

@media(max-width:820px){
  .hero-copy{width:100%}
  .hero h1{font-size:clamp(43px,12vw,59px)}

  .problem-screen{
    padding-top:84px;
    padding-bottom:100px;
  }

  .problem-screen.section-shell{
    width:min(calc(100% - 24px),var(--container));
  }

  .problem-stage{
    min-height:auto;
    grid-template-columns:1fr;
    gap:24px;
  }

  .problem-intro{
    max-width:none;
    padding:0;
  }

  .problem-kicker-row{
    margin-bottom:24px;
  }

  .problem-intro h2{
    max-width:720px;
    font-size:clamp(42px,9.5vw,68px);
  }

  .problem-lead{
    margin-top:20px;
    font-size:14px;
  }

  .problem-visual{
    min-height:900px;
    margin-top:0;
  }

  .problem-mockup{
    width:min(430px,90vw);
    height:auto;
    max-width:90vw;
    max-height:none;
  }

  .problem-question{
    width:min(190px,43vw);
  }

  .problem-question--one{left:0;right:auto;top:12%}
  .problem-question--two{display:none}
  .problem-question--three{left:auto;right:0;top:61%}
  .problem-question--four{display:none}

  .problem-bridge{
    margin-top:14px;
    grid-template-columns:1fr;
    gap:22px;
  }

  .problem-bridge>p{
    max-width:640px;
  }

  .problem-bridge-cta{
    grid-column:auto;
    width:100%;
  }
}

@media(max-width:560px){
  .problem-screen{
    padding-top:72px;
    padding-bottom:96px;
  }

  .problem-kicker-row .kicker{
    font-size:7px;
    letter-spacing:.16em;
  }

  .problem-intro h2{
    font-size:clamp(39px,11.5vw,54px);
  }

  .problem-visual{
    min-height:clamp(720px,190vw,880px);
    margin-inline:0;
  }

  .problem-mockup{
    width:min(430px,94vw);
    max-width:94vw;
  }

  .problem-question{
    width:154px;
    padding:10px 11px;
    border-radius:11px;
    font-size:9px;
  }

  .problem-question--one{left:0;top:10%}
  .problem-question--three{right:0;top:62%}

  .problem-bridge{
    padding:24px 18px;
    border-radius:17px;
  }

  .problem-bridge h3{
    font-size:clamp(27px,8.4vw,38px);
  }

  .problem-bridge-cta{
    width:100%;
    justify-content:flex-start;
  }

  .problem-bridge-cta span{
    flex:1;
  }
}

/* PRODUCT_SHOWCASE_SLIDER_V1 */
.product-showcase{
  padding-top:clamp(96px,9vw,144px);
}

.product-showcase-head{
  max-width:960px;
  margin:0 0 clamp(44px,5vw,72px);
}

.product-showcase-head .kicker{
  margin-bottom:18px;
}

.product-showcase-head h2{
  max-width:920px;
  margin:0;
  font-family:var(--display);
  font-size:clamp(46px,5.4vw,76px);
  font-weight:760;
  line-height:.96;
  letter-spacing:-.048em;
}

.product-showcase-lead{
  max-width:760px;
  margin:26px 0 0;
  color:#a7a7af;
  font-size:clamp(15px,1.25vw,18px);
  line-height:1.62;
}

.product-slider{
  position:relative;
  padding:clamp(24px,3vw,42px) clamp(58px,5vw,82px) 26px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.09);
  border-radius:32px;
  background:#0a0a0c;
  box-shadow:0 34px 100px rgba(0,0,0,.24);
}

.product-slider-stage{
  position:relative;
  min-height:690px;
}

.product-slide{
  position:absolute;
  inset:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(390px,.82fr);
  align-items:center;
  gap:clamp(40px,6vw,96px);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translate3d(40px,0,0) scale(.988);
  transition:opacity .5s ease,transform .68s cubic-bezier(.22,.75,.24,1),visibility .5s step-end;
}

.product-slide.is-active{
  position:relative;
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:none;
  transition:opacity .5s ease,transform .68s cubic-bezier(.22,.75,.24,1),visibility 0s step-start;
}

.product-slide.is-leaving-left{
  position:absolute;
  opacity:0;
  transform:translate3d(-48px,0,0) scale(.986);
}

.product-slide.is-leaving-right{
  position:absolute;
  opacity:0;
  transform:translate3d(48px,0,0) scale(.986);
}

.product-slide-copy{
  max-width:650px;
  padding:clamp(12px,2vw,30px) 0;
}

.product-slide-index{
  width:max-content;
  min-height:34px;
  margin-bottom:28px;
  padding:0 12px;
  display:flex;
  align-items:center;
  border:1px solid rgba(255,122,0,.22);
  border-radius:999px;
  color:var(--accent-warm);
  background:rgba(255,122,0,.055);
  font-size:9px;
  font-weight:850;
  letter-spacing:.15em;
}

.product-slide-copy h3{
  max-width:650px;
  margin:0;
  font-family:var(--display);
  font-size:clamp(38px,4.3vw,62px);
  font-weight:760;
  line-height:.98;
  letter-spacing:-.045em;
}

.product-slide-copy>p{
  max-width:590px;
  margin:25px 0 0;
  color:#aaaab2;
  font-size:14px;
  line-height:1.68;
}

.product-slide-copy ul{
  max-width:590px;
  margin:30px 0 0;
  padding:0;
  display:grid;
  list-style:none;
  border-top:1px solid rgba(255,255,255,.08);
}

.product-slide-copy li{
  position:relative;
  padding:13px 0 13px 26px;
  border-bottom:1px solid rgba(255,255,255,.08);
  color:#d0d0d5;
  font-size:12px;
  line-height:1.45;
}

.product-slide-copy li::before{
  content:"";
  position:absolute;
  left:1px;
  top:19px;
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 14px rgba(255,122,0,.55);
}

.product-slide-visual{
  position:relative;
  min-height:620px;
  display:grid;
  place-items:center;
}

.product-slide-visual::before{
  content:"";
  position:absolute;
  width:min(470px,88%);
  aspect-ratio:1;
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,122,0,.11),rgba(255,77,0,.035) 44%,transparent 70%);
  filter:blur(16px);
  opacity:.8;
}

.product-slide-visual img{
  position:relative;
  z-index:2;
  width:auto;
  height:min(640px,58vw);
  max-width:100%;
  max-height:640px;
  object-fit:contain;
  filter:drop-shadow(0 34px 62px rgba(0,0,0,.5));
  user-select:none;
  -webkit-user-drag:none;
}

.product-slider-arrow{
  position:absolute;
  z-index:10;
  top:50%;
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.13);
  border-radius:50%;
  color:#fff;
  background:rgba(12,12,14,.78);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  cursor:pointer;
  transform:translateY(-50%);
  transition:transform .22s ease,border-color .22s ease,background .22s ease;
}

.product-slider-arrow:hover{
  border-color:rgba(255,122,0,.45);
  background:rgba(255,122,0,.08);
  transform:translateY(-50%) scale(1.06);
}

.product-slider-arrow span{
  font-size:18px;
  line-height:1;
}

.product-slider-arrow--prev{left:16px}
.product-slider-arrow--next{right:16px}

.product-slider-nav{
  position:relative;
  z-index:12;
  margin-top:8px;
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:7px;
}

.product-slider-nav button{
  min-width:0;
  padding:11px 10px;
  display:flex;
  align-items:center;
  gap:8px;
  border:1px solid rgba(255,255,255,.065);
  border-radius:12px;
  color:#71717a;
  background:rgba(255,255,255,.018);
  cursor:pointer;
  text-align:left;
  transition:border-color .22s ease,color .22s ease,background .22s ease;
}

.product-slider-nav button:hover,
.product-slider-nav button.is-active{
  color:#fff;
  border-color:rgba(255,122,0,.24);
  background:rgba(255,122,0,.055);
}

.product-slider-nav button span{
  flex:0 0 auto;
  color:var(--accent-warm);
  font-size:8px;
  font-weight:850;
}

.product-slider-nav button b{
  overflow:hidden;
  font-size:9px;
  font-weight:650;
  text-overflow:ellipsis;
  white-space:nowrap;
}

@media(max-width:1050px){
  .product-slider{
    padding-inline:58px;
  }

  .product-slide{
    grid-template-columns:minmax(0,1fr) minmax(340px,.82fr);
    gap:34px;
  }

  .product-slide-visual{
    min-height:560px;
  }

  .product-slide-visual img{
    height:min(560px,55vw);
    max-height:560px;
  }

  .product-slider-nav button b{
    display:none;
  }
}

@media(max-width:820px){
  .product-showcase-head{
    margin-bottom:36px;
  }

  .product-showcase-head h2{
    font-size:clamp(40px,9vw,60px);
  }

  .product-slider{
    padding:24px 16px 18px;
    overflow:hidden;
    border-radius:24px;
  }

  .product-slider-stage{
    min-height:0;
  }

  .product-slide,
  .product-slide.is-active{
    grid-template-columns:1fr;
    gap:8px;
  }

  .product-slide{
    transform:translate3d(28px,0,0);
  }

  .product-slide.is-leaving-left{
    transform:translate3d(-28px,0,0);
  }

  .product-slide.is-leaving-right{
    transform:translate3d(28px,0,0);
  }

  .product-slide-visual{
    grid-row:1;
    min-height:auto;
    padding:6px 38px 0;
  }

  .product-slide-visual img{
    width:min(430px,82vw);
    height:auto;
    max-height:none;
  }

  .product-slide-copy{
    grid-row:2;
    max-width:none;
    padding:22px 4px 8px;
  }

  .product-slide-copy h3{
    font-size:clamp(34px,9.8vw,50px);
  }

  .product-slide-copy>p{
    font-size:13px;
  }

  .product-slider-arrow{
    top:32%;
    width:42px;
    height:42px;
  }

  .product-slider-arrow--prev{left:10px}
  .product-slider-arrow--next{right:10px}

  .product-slider-nav{
    margin-top:20px;
    grid-template-columns:repeat(6,1fr);
    gap:5px;
  }

  .product-slider-nav button{
    min-height:38px;
    padding:0;
    justify-content:center;
    border-radius:999px;
  }

  .product-slider-nav button span{
    font-size:7px;
  }

  .product-slider-nav button b{
    display:none;
  }
}

@media(max-width:480px){
  .product-slider{
    margin-inline:-2px;
  }

  .product-slide-visual{
    padding-inline:28px;
  }

  .product-slide-copy ul{
    margin-top:24px;
  }

  .product-slider-arrow{
    top:28%;
  }
}
