/* products-v2 — product hub (nested under /products/) */

body.ll-shell[data-page="products"]{
  background:var(--ll-bg);
}

/* ——— Hero ——— */
.pc-hero{
  position:relative;
  min-height:min(92svh,900px);
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  overflow:hidden;
  background:#0f1012;
  color:#f2f2f4;
}
.pc-hero__media{
  position:absolute;
  inset:0;
  z-index:0;
}
.pc-hero__media img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center 48%;
}
.pc-hero__media::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(180deg,
      rgba(15,16,18,0.35) 0%,
      rgba(15,16,18,0.2) 32%,
      rgba(15,16,18,0.55) 62%,
      rgba(15,16,18,0.92) 88%,
      #0f1012 100%),
    linear-gradient(90deg,
      rgba(15,16,18,0.72) 0%,
      rgba(15,16,18,0.28) 48%,
      transparent 78%);
}
.pc-hero__body{
  position:relative;
  z-index:1;
  width:min(var(--ll-max),100%);
  margin:0 auto;
  padding:6.5rem var(--ll-gutter) 2.5rem;
}
.pc-hero__eyebrow{
  margin:0 0 0.85rem;
  font-size:0.78rem;
  font-weight:500;
  letter-spacing:0.14em;
  color:rgba(242,242,244,0.48);
}
.pc-hero h1{
  margin:0;
  font-size:clamp(2.2rem,4.6vw,3.4rem);
  font-weight:460;
  letter-spacing:-0.035em;
  line-height:1.1;
  color:#fdfdfd;
}
.pc-hero__lead{
  margin:1.1rem 0 0;
  max-width:36ch;
  font-size:clamp(1.02rem,1.25vw,1.12rem);
  line-height:1.65;
  color:rgba(242,242,244,0.62);
}
.pc-hero__scroll{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  gap:0.65rem;
  width:min(var(--ll-max),100%);
  margin:0 auto;
  padding:0 var(--ll-gutter) 1.4rem;
  font-size:0.78rem;
  letter-spacing:0.12em;
  color:rgba(242,242,244,0.4);
}
.pc-hero__scroll-line{
  width:2.4rem;
  height:1px;
  background:rgba(242,242,244,0.28);
}

/* ——— Product chapters ——— */
.pc-list{
  padding:clamp(3.5rem,7vw,5.5rem) var(--ll-gutter) clamp(2.5rem,5vw,3.5rem);
  background:var(--ll-bg);
}
.pc-list__inner{
  width:min(var(--ll-max),100%);
  margin:0 auto;
}
.pc-list__head{
  margin:0 0 clamp(1.75rem,3.5vw,2.5rem);
  max-width:32rem;
}
.pc-list__label{
  margin:0 0 0.7rem;
  font-size:0.78rem;
  font-weight:500;
  letter-spacing:0.14em;
  color:rgba(15,16,18,0.4);
}
.pc-list__title{
  margin:0;
  font-size:clamp(1.7rem,3vw,2.3rem);
  font-weight:460;
  letter-spacing:-0.03em;
  line-height:1.15;
  color:var(--ll-ink);
}
.pc-list__lead{
  margin:0.75rem 0 0;
  font-size:1.02rem;
  line-height:1.6;
  color:var(--ll-muted);
  max-width:36ch;
}

.pc-chapter{
  list-style:none;
  margin:0;
  padding:0;
  border-top:1px solid var(--ll-line);
}
.pc-chapter__item{
  border-bottom:1px solid var(--ll-line);
}
.pc-chapter__row{
  display:grid;
  grid-template-columns:minmax(0,0.38fr) minmax(0,0.62fr);
  gap:clamp(1.5rem,3vw,2.75rem);
  align-items:center;
  min-height:clamp(340px,36vw,410px);
  padding:clamp(1.35rem,2.4vw,1.75rem) 0;
}
.pc-chapter__text{
  min-width:0;
  max-width:22rem;
}
.pc-chapter__num{
  display:block;
  margin:0 0 0.85rem;
  font-size:0.84rem;
  font-weight:520;
  letter-spacing:0.12em;
  color:var(--ll-blue);
}
.pc-chapter__name{
  margin:0;
  font-size:clamp(1.35rem,2vw,1.7rem);
  font-weight:520;
  letter-spacing:-0.025em;
  line-height:1.2;
  color:var(--ll-ink);
}
.pc-chapter__task{
  margin:0.65rem 0 0;
  font-size:1rem;
  line-height:1.6;
  color:var(--ll-muted);
  max-width:28ch;
}
.pc-chapter__note{
  margin:0.85rem 0 0;
  font-size:0.78rem;
  letter-spacing:0.04em;
  color:rgba(15,16,18,0.38);
}
.pc-chapter__actions{
  display:flex;
  flex-wrap:wrap;
  gap:0.75rem;
  margin-top:1.4rem;
}
.pc-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:2.75rem;
  padding:0.55rem 1.15rem;
  border-radius:999px;
  font-size:0.94rem;
  font-weight:520;
  transition:background 0.2s var(--ll-ease), border-color 0.2s var(--ll-ease), color 0.2s var(--ll-ease);
}
.pc-btn--primary{
  background:var(--ll-blue);
  color:#fff;
  border:1px solid transparent;
}
.pc-btn--primary:hover{background:#0060c0}
.pc-btn--ghost{
  background:transparent;
  color:var(--ll-ink);
  border:1px solid rgba(15,16,18,0.18);
}
.pc-btn--ghost:hover{border-color:rgba(15,16,18,0.4)}

.pc-chapter__media{
  margin:0;
  width:100%;
  height:clamp(300px,32vw,360px);
  min-height:300px;
  max-height:360px;
  overflow:hidden;
  background:#f0f1f3;
}
.pc-chapter__media img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center center;
}

/* ——— How to choose ——— */
.pc-choose{
  padding:clamp(3.5rem,7vw,5.5rem) var(--ll-gutter);
  background:var(--ll-white);
}
.pc-choose__inner{
  width:min(var(--ll-max),100%);
  margin:0 auto;
}
.pc-choose__label{
  margin:0 0 0.7rem;
  font-size:0.78rem;
  font-weight:500;
  letter-spacing:0.14em;
  color:rgba(15,16,18,0.4);
}
.pc-choose__title{
  margin:0 0 clamp(1.75rem,3.5vw,2.4rem);
  font-size:clamp(1.65rem,2.8vw,2.2rem);
  font-weight:460;
  letter-spacing:-0.03em;
  color:var(--ll-ink);
}
.pc-choose__list{
  list-style:none;
  margin:0;
  padding:0;
  border-top:1px solid var(--ll-line);
}
.pc-choose__item{
  border-bottom:1px solid var(--ll-line);
}
.pc-choose__link{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1.1fr);
  gap:1rem 1.5rem;
  align-items:center;
  padding:1.2rem 0.1rem;
  min-height:4.25rem;
  transition:opacity 0.2s var(--ll-ease);
}
.pc-choose__link:hover{opacity:0.72}
.pc-choose__need{
  font-size:clamp(1.05rem,1.3vw,1.15rem);
  font-weight:520;
  letter-spacing:-0.015em;
  color:var(--ll-ink);
}
.pc-choose__arrow{
  color:rgba(15,16,18,0.28);
  font-size:1rem;
}
.pc-choose__product{
  font-size:clamp(1.02rem,1.25vw,1.1rem);
  color:var(--ll-blue);
  font-weight:520;
  text-align:right;
}
.pc-choose__hint{
  margin:1.35rem 0 0;
  font-size:0.95rem;
  line-height:1.55;
  color:var(--ll-muted);
  max-width:40ch;
}

/* ——— CTA ——— */
.pc-cta{
  padding:clamp(4.5rem,9vw,6.5rem) var(--ll-gutter);
  background:var(--ll-blue);
  color:#fff;
  text-align:center;
}
.pc-cta__inner{
  width:min(var(--ll-max),100%);
  margin:0 auto;
}
.pc-cta h2{
  margin:0;
  font-size:clamp(1.85rem,3.5vw,2.65rem);
  font-weight:520;
  letter-spacing:-0.03em;
  line-height:1.15;
}
.pc-cta p{
  margin:1rem auto 0;
  max-width:34ch;
  font-size:1.05rem;
  line-height:1.6;
  color:rgba(255,255,255,0.8);
}
.pc-cta__actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:0.9rem;
  margin-top:1.85rem;
}
.pc-btn--light{
  background:#fff;
  color:var(--ll-ink);
  border:1px solid transparent;
}
.pc-btn--light:hover{background:rgba(255,255,255,0.92)}
.pc-btn--ghost-light{
  background:transparent;
  color:#fff;
  border:1px solid rgba(255,255,255,0.45);
}
.pc-btn--ghost-light:hover{border-color:#fff}

body.ll-shell[data-page="products"] .ll-footer{
  min-height:auto;
}

@media (max-width:1023px){
  .pc-chapter__row{
    grid-template-columns:1fr;
    gap:1.25rem;
    min-height:0;
    padding:1.75rem 0 2rem;
  }
  .pc-chapter__text{max-width:none}
  .pc-chapter__media{
    height:auto;
    min-height:0;
    max-height:none;
    aspect-ratio:16 / 9;
  }
  .pc-choose__link{
    grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  }
}

@media (max-width:640px){
  .pc-hero{
    min-height:88svh;
  }
  .pc-hero__body{
    padding:5.5rem var(--ll-gutter) 2rem;
  }
  .pc-hero__lead{max-width:none}
  .pc-chapter__row{
    gap:1.1rem;
    padding:1.5rem 0 1.75rem;
  }
  .pc-chapter__name{font-size:1.28rem}
  .pc-chapter__task{max-width:none}
  .pc-chapter__actions{
    flex-direction:column;
    align-items:stretch;
  }
  .pc-btn{
    width:100%;
    min-height:3rem;
  }
  .pc-choose__link{
    grid-template-columns:1fr;
    gap:0.35rem;
    padding:1.15rem 0;
  }
  .pc-choose__arrow{display:none}
  .pc-choose__product{text-align:left}
  .pc-choose__hint{max-width:none}
  .pc-cta p{max-width:none}
  .pc-cta__actions{
    flex-direction:column;
    align-items:stretch;
  }
  .pc-cta__actions .pc-btn{width:100%}
}