/* product-detail-v2 — reusable single-product narrative (nested /products/) */

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

/* ——— 1. Product hero ——— */
.pd-hero{
  position:relative;
  min-height:100svh;
  min-height:100dvh;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  overflow:hidden;
  background:#0f1012;
  color:#f2f2f4;
}
.pd-hero__media{
  position:absolute;
  inset:0;
  z-index:0;
}
.pd-hero__media img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center 48%;
}
.pd-hero__media::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(180deg,
      rgba(15,16,18,0.32) 0%,
      rgba(15,16,18,0.18) 30%,
      rgba(15,16,18,0.5) 58%,
      rgba(15,16,18,0.9) 84%,
      #0f1012 100%),
    linear-gradient(90deg,
      rgba(15,16,18,0.7) 0%,
      rgba(15,16,18,0.25) 46%,
      transparent 76%);
}
.pd-hero__body{
  position:relative;
  z-index:1;
  width:min(var(--ll-max),100%);
  margin:0 auto;
  padding:6.25rem var(--ll-gutter) 2.4rem;
}
.pd-breadcrumb{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:0.4rem;
  margin:0 0 1.25rem;
  font-size:0.84rem;
  color:rgba(242,242,244,0.5);
}
.pd-breadcrumb a{
  color:rgba(242,242,244,0.55);
  transition:color 0.2s var(--ll-ease);
}
.pd-breadcrumb a:hover{color:#fff}
.pd-breadcrumb__sep{opacity:0.4}
.pd-breadcrumb [aria-current="page"]{color:rgba(253,253,253,0.88)}

.pd-hero__product{
  margin:0 0 0.85rem;
  font-size:0.8rem;
  font-weight:500;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:rgba(242,242,244,0.5);
}
.pd-hero h1{
  margin:0;
  max-width:14em;
  font-size:clamp(2.15rem,4.5vw,3.35rem);
  font-weight:460;
  letter-spacing:-0.035em;
  line-height:1.12;
  color:#fdfdfd;
}
.pd-hero__tagline{
  margin:0.95rem 0 0;
  font-size:clamp(1.05rem,1.5vw,1.22rem);
  font-weight:460;
  letter-spacing:-0.02em;
  color:rgba(253,253,253,0.82);
}
.pd-hero__lead{
  margin:0.95rem 0 0;
  max-width:36ch;
  font-size:clamp(1rem,1.2vw,1.08rem);
  line-height:1.65;
  color:rgba(242,242,244,0.58);
}
.pd-hero__note{
  margin:0.75rem 0 0;
  font-size:0.78rem;
  letter-spacing:0.04em;
  color:rgba(242,242,244,0.38);
}
.pd-hero__actions{
  display:flex;
  flex-wrap:wrap;
  gap:0.85rem;
  margin-top:1.75rem;
}
.pd-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:2.75rem;
  padding:0.55rem 1.2rem;
  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);
}
.pd-btn--primary{
  background:var(--ll-blue);
  color:#fff;
  border:1px solid transparent;
}
.pd-btn--primary:hover{background:#0060c0}
.pd-btn--ghost{
  background:transparent;
  color:#fff;
  border:1px solid rgba(255,255,255,0.4);
}
.pd-btn--ghost:hover{border-color:#fff}
.pd-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.35rem;
  font-size:0.78rem;
  letter-spacing:0.12em;
  color:rgba(242,242,244,0.4);
}
.pd-hero__scroll-line{
  width:2.4rem;
  height:1px;
  background:rgba(242,242,244,0.28);
}

/* ——— 2. What it is ——— */
/* ——— Body shell: editorial content width ~1240–1320 ——— */
.pd-body-shell{
  width:min(80rem,var(--ll-max),100%); /* 1280px @16 */
  margin:0 auto;
}

/* ——— About: asymmetric editorial dual-column ——— */
.pd-about{
  padding:clamp(4.25rem,7.5vw,5.75rem) var(--ll-gutter);
  background:var(--ll-white);
}
.pd-about__inner{
  width:min(80rem,var(--ll-max),100%);
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(0,0.58fr) minmax(0,0.36fr);
  gap:clamp(2rem,5vw,4.5rem);
  align-items:start;
}
.pd-about__identity{min-width:0;max-width:none}
.pd-about__index{
  margin:0 0 0.85rem;
  font-size:0.8rem;
  font-weight:520;
  letter-spacing:0.14em;
  color:var(--ll-blue);
}
.pd-about__label{
  margin:0 0 1rem;
  font-size:0.78rem;
  font-weight:500;
  letter-spacing:0.14em;
  color:rgba(15,16,18,0.42);
}
.pd-about__title{
  margin:0;
  font-size:3.25rem; /* 52px fixed — no vw scaling */
  font-weight:420;
  letter-spacing:0;
  line-height:1.12;
  color:var(--ll-ink);
  max-width:none; /* R2.1: let semantic .pd-title-line control wrap, not em-cap mid-word */
}
/* Round 2.1 — about/values: semantic lines on wide desktop only */
.pd-title-line{
  display:inline;
}
/* Round 2.2 — collab titles: always two semantic lines at every breakpoint */
.pd-collab__title{
  /* flex column absorbs any source whitespace between spans (no double-space) */
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}
.pd-collab__title .pd-title-line{
  display:block;
}
@media (min-width:1200px){
  .pd-about__title .pd-title-line,
  .pd-values__title .pd-title-line{
    display:block;
  }
}
.pd-about__copy{min-width:0;padding-top:0.15rem}
.pd-about__body{
  margin:0;
  font-size:1.125rem; /* 18px */
  line-height:1.72;
  letter-spacing:0;
  color:rgba(15,16,18,0.78);
  max-width:40ch;
}
.pd-about__body + .pd-about__body{
  margin-top:1.15rem;
  padding-top:1.15rem;
  border-top:1px solid var(--ll-line);
  font-size:1.05rem;
  color:var(--ll-muted);
}
.pd-about__aside{
  margin:1.25rem 0 0;
  padding-top:1.15rem;
  border-top:1px solid var(--ll-line);
  font-size:1rem;
  line-height:1.7;
  color:var(--ll-muted);
  max-width:40ch;
}
.pd-about__group-label{
  display:block;
  margin:0 0 0.4rem;
  font-size:0.72rem;
  font-weight:520;
  letter-spacing:0.12em;
  color:var(--ll-blue);
}

/* ——— Scene chapter: copy left, media right (stage markup untouched) ——— */
.pd-scene{
  padding:clamp(3.75rem,7vw,5.5rem) var(--ll-gutter);
  background:var(--ll-bg);
}
.pd-scene__inner{
  width:min(80rem,var(--ll-max),100%);
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(0,0.38fr) minmax(0,0.58fr);
  gap:clamp(1.75rem,4vw,3.25rem);
  align-items:center;
}
.pd-scene__copy{min-width:0}
.pd-scene__label{
  margin:0 0 0.85rem;
  font-size:0.78rem;
  font-weight:500;
  letter-spacing:0.14em;
  color:rgba(15,16,18,0.42);
}
.pd-scene__title{
  margin:0;
  font-size:2.75rem; /* 44px fixed */
  font-weight:420;
  letter-spacing:0;
  line-height:1.14;
  color:var(--ll-ink);
  max-width:10em;
}
.pd-scene__body{
  margin:1.1rem 0 0;
  font-size:1.05rem;
  line-height:1.7;
  letter-spacing:0;
  color:var(--ll-muted);
  max-width:36ch;
}
.pd-scene__body + .pd-scene__body{margin-top:0.9rem}
.pd-scene__note{
  margin:1.15rem 0 0;
  font-size:0.8rem;
  letter-spacing:0.04em;
  color:rgba(15,16,18,0.4);
}
.pd-scene__media{
  margin:0;
  width:100%;
  height:clamp(300px,34vw,400px);
  min-height:300px;
  max-height:420px;
  overflow:hidden;
  background:#f0f1f3;
}
.pd-scene__media img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center center;
  filter:none;
}

/* ——— Demo stage: editorial media module (cover + rail, no center green capsule) ——— */
.pd-demo-stage{
  margin:0;
  width:100%;
  min-width:0;
  background:transparent;
  overflow:visible;
  height:auto;
  max-height:none;
}
.pd-demo-stage__frame{
  position:relative;
  display:flex;
  flex-direction:column;
  width:100%;
  min-width:0;
}
.pd-demo-stage__visual{
  position:relative;
  width:100%;
  aspect-ratio:16 / 9;
  overflow:hidden;
  border-radius:6px 6px 0 0;
  border:1px solid rgba(15,16,18,0.08);
  border-bottom:0;
  background:#e8eaed;
}
.pd-demo-stage__img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center center;
}
/* product-specific framing — no hard crop of key subjects */
body.pd--auto-margin .pd-demo-stage__img,
[data-pd-demo-stage="auto-margin"] .pd-demo-stage__img{
  object-position:center 46%;
}
body.pd--framework .pd-demo-stage__img,
[data-pd-demo-stage="framework"] .pd-demo-stage__img{
  object-position:center 48%;
}
body.pd--arrangement .pd-demo-stage__img,
[data-pd-demo-stage="arrangement"] .pd-demo-stage__img{
  object-position:center 50%;
  transform:none;
}
.pd-demo-stage__play{
  position:absolute;
  z-index:2;
  right:0.85rem;
  bottom:0.85rem;
  width:3rem; /* 48px */
  height:3rem;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  background:rgba(15,16,18,0.52);
  pointer-events:none;
  transition:background 0.2s ease, color 0.2s ease;
}
.pd-demo-stage__play svg{margin-left:2px}
.pd-demo-stage__rail{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:0.75rem 1rem;
  min-height:3.5rem; /* 56px */
  height:clamp(3.4rem,5.2vw,4.15rem); /* ~54–66px */
  padding:0 0.95rem 0 1rem;
  border:1px solid rgba(15,16,18,0.08);
  border-radius:0 0 6px 6px;
  background:var(--ll-white, #fff);
  color:var(--ll-ink);
}
.pd-demo-stage__rail-label{
  font-size:0.88rem;
  font-weight:520;
  letter-spacing:0.01em;
  color:rgba(15,16,18,0.72);
  white-space:nowrap;
}
.pd-demo-stage__rail-meta{
  display:inline-flex;
  align-items:center;
  gap:0.45rem;
  flex:0 0 auto;
  color:rgba(15,16,18,0.55);
}
.pd-demo-stage__rail-time{
  font-size:0.84rem;
  font-variant-numeric:tabular-nums;
  letter-spacing:0.02em;
}
.pd-demo-stage__rail-icon{
  display:inline-flex;
  line-height:0;
  opacity:0.75;
}
.pd-demo-stage__hit{
  position:absolute;
  inset:0;
  z-index:3;
  margin:0;
  padding:0;
  border:0;
  border-radius:6px;
  background:transparent;
  cursor:pointer;
}
.pd-demo-stage__frame:hover .pd-demo-stage__play,
.pd-demo-stage__hit:hover + .pd-demo-stage__play,
.pd-demo-stage__frame:focus-within .pd-demo-stage__play{
  background:rgba(15,16,18,0.66);
}
.pd-demo-stage__frame:hover .pd-demo-stage__rail-label,
.pd-demo-stage__frame:hover .pd-demo-stage__rail-time,
.pd-demo-stage__frame:hover .pd-demo-stage__rail-icon,
.pd-demo-stage__frame:focus-within .pd-demo-stage__rail-label,
.pd-demo-stage__frame:focus-within .pd-demo-stage__rail-time,
.pd-demo-stage__frame:focus-within .pd-demo-stage__rail-icon{
  color:var(--ll-blue);
  opacity:1;
}
.pd-demo-stage__hit:focus-visible{
  outline:2px solid var(--ll-blue);
  outline-offset:3px;
}
.pd-demo-stage__hit:focus-visible .pd-demo-stage__play,
.pd-demo-stage__frame:focus-within .pd-demo-stage__play{
  box-shadow:0 0 0 2px #fff, 0 0 0 4px var(--ll-blue);
}
/* evidence stage: wide demo module, same family */
.pd-demo-stage--evidence{
  margin:0 0 clamp(1.5rem,3vw,2.25rem);
}
.pd-demo-stage--scene{
  /* replaces constrained .pd-scene__media box when used as scene media */
  height:auto;
  min-height:0;
  max-height:none;
  overflow:visible;
  background:transparent;
}
/* full demo dialog */
.pd-demo-dialog{
  border:0;
  padding:0;
  max-width:none;
  width:100%;
  height:100%;
  background:transparent;
  color:#fff;
}
.pd-demo-dialog::backdrop{
  background:rgba(8,9,11,0.78);
}
.pd-demo-dialog[open]{
  display:flex;
  align-items:center;
  justify-content:center;
}
.pd-demo-dialog__panel{
  position:relative;
  width:min(90vw,1120px);
  max-height:86vh;
}
.pd-demo-dialog__stage{
  position:relative;
  width:100%;
  aspect-ratio:16 / 9;
  background:#0b0c0e;
  border-radius:6px;
  overflow:hidden;
}
.pd-demo-dialog__video{
  width:100%;
  height:100%;
  display:block;
  object-fit:contain;
  background:#0b0c0e;
}
.pd-demo-dialog__close{
  position:absolute;
  z-index:3;
  top:-0.35rem;
  right:-0.35rem;
  width:2.5rem;
  height:2.5rem;
  border:0;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  color:#fff;
  background:rgba(15,16,18,0.72);
}
.pd-demo-dialog__close:hover{background:rgba(15,16,18,0.88)}
.pd-demo-dialog__close:focus-visible{
  outline:2px solid #fff;
  outline-offset:2px;
}
.pd-demo-dialog__error{
  position:absolute;
  inset:auto 1rem 1rem;
  margin:0;
  padding:0.65rem 0.85rem;
  border-radius:6px;
  background:rgba(15,16,18,0.82);
  color:rgba(255,255,255,0.9);
  font-size:0.9rem;
}
html.pd-demo-open,
body.pd-demo-open{
  overflow:hidden;
}
body.pd-demo-open{
  position:fixed;
  width:100%;
  left:0;
  right:0;
}
@media (max-width:640px){
  .pd-demo-stage__play{
    width:2.75rem;
    height:2.75rem;
    right:0.7rem;
    bottom:0.7rem;
  }
  .pd-demo-stage__rail{
    min-height:3.35rem;
    height:3.5rem;
    padding:0 0.75rem;
    gap:0.5rem;
  }
  .pd-demo-stage__rail-label{font-size:0.82rem}
  .pd-demo-stage__rail-time{font-size:0.8rem}
  .pd-demo-dialog__panel{
    width:min(96vw,100%);
  }
  .pd-demo-dialog__close{
    top:0.35rem;
    right:0.35rem;
  }
}
@media (prefers-reduced-motion:reduce){
  .pd-demo-stage__play,
  .pd-demo-stage__rail-label,
  .pd-demo-stage__rail-meta{transition:none}
  .pd-demo-dialog,
  .pd-demo-dialog::backdrop{animation:none !important}
}

/* ——— Product software gallery: horizontal 3D cover flow ——— */
.pd-coverflow-section{
  position:relative;
  padding:clamp(4.5rem,8vw,6.5rem) var(--ll-gutter) clamp(3.5rem,7vw,5.5rem);
  overflow:hidden;
  background:#edf5fa;
}
.pd-coverflow-section__inner{
  width:min(84rem,var(--ll-max),100%);
  margin:0 auto;
}
.pd-coverflow-section__head{
  display:grid;
  grid-template-columns:minmax(0,0.34fr) minmax(0,0.6fr);
  gap:clamp(1.75rem,4vw,3.75rem);
  align-items:end;
}
.pd-coverflow-section__label{
  margin:0;
  color:rgba(15,16,18,0.44);
  font-size:0.78rem;
  font-weight:520;
  letter-spacing:0.14em;
}
.pd-coverflow-section__title{
  margin:0;
  max-width:14em;
  color:var(--ll-ink);
  font-size:clamp(2.2rem,4vw,3.5rem);
  font-weight:430;
  letter-spacing:0;
  line-height:1.12;
  text-wrap:balance;
}
.pd-coverflow-section__lead{
  grid-column:2;
  margin:0.9rem 0 0;
  max-width:42ch;
  color:var(--ll-muted);
  font-size:1rem;
  line-height:1.7;
}
.pd-coverflow-stage{
  position:relative;
  height:clamp(31rem,52vw,42rem);
  margin-top:clamp(1.75rem,4vw,3rem);
}
.ll-coverflow{
  position:absolute;
  inset:0;
  overflow:hidden;
  perspective:1400px;
  touch-action:pan-y;
  user-select:none;
}
.ll-coverflow:focus-visible{
  outline:3px solid rgba(8,120,209,0.42);
  outline-offset:-6px;
}
.ll-coverflow__track{
  position:absolute;
  left:50%;
  top:43%;
  width:0;
  height:0;
  transform-style:preserve-3d;
}
.ll-coverflow__card{
  --cover-x:0;
  --cover-z:0;
  --cover-rotate:0deg;
  --cover-scale:1;
  --cover-opacity:1;
  position:absolute;
  left:0;
  top:0;
  width:clamp(24rem,58vw,54rem);
  aspect-ratio:39 / 20;
  padding:0;
  border:0;
  border-radius:8px;
  background:transparent;
  color:#12334a;
  font:inherit;
  cursor:pointer;
  opacity:var(--cover-opacity);
  transform:translate(-50%,-50%) translate3d(var(--cover-x),0,var(--cover-z)) rotateY(var(--cover-rotate)) scale(var(--cover-scale));
  transform-style:preserve-3d;
  will-change:transform,opacity;
  transition:transform 0.72s cubic-bezier(0.2,0.9,0.25,1.08),opacity 0.48s ease;
}
.ll-coverflow__card img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  border:1px solid rgba(121,161,189,0.24);
  border-radius:8px;
  background:#eef5fa;
  box-shadow:0 18px 48px rgba(61,101,132,0.18);
  filter:saturate(0.86) brightness(0.96);
  transition:filter 0.42s ease,box-shadow 0.42s ease;
}
.ll-coverflow__card.is-active img{
  filter:none;
  box-shadow:0 26px 72px rgba(54,95,126,0.24);
}
.ll-coverflow__caption{
  position:absolute;
  top:calc(100% + 0.9rem);
  left:0;
  right:0;
  color:#385366;
  font-size:0.9rem;
  font-weight:540;
  line-height:1.3;
  text-align:center;
  opacity:0;
  transform:translateY(-6px);
  transition:opacity 0.3s ease,transform 0.42s cubic-bezier(0.22,1,0.36,1);
}
.ll-coverflow__card.is-active .ll-coverflow__caption{
  opacity:1;
  transform:translateY(0);
}
.ll-coverflow__card[data-cover-position="-2"]{
  --cover-x:-33vw;
  --cover-z:-190px;
  --cover-rotate:36deg;
  --cover-scale:0.78;
  --cover-opacity:0.38;
  z-index:1;
}
.ll-coverflow__card[data-cover-position="-1"]{
  --cover-x:-18vw;
  --cover-z:-90px;
  --cover-rotate:32deg;
  --cover-scale:0.88;
  --cover-opacity:0.72;
  z-index:2;
}
.ll-coverflow__card[data-cover-position="0"]{
  --cover-z:70px;
  z-index:5;
}
.ll-coverflow__card[data-cover-position="1"]{
  --cover-x:18vw;
  --cover-z:-90px;
  --cover-rotate:-32deg;
  --cover-scale:0.88;
  --cover-opacity:0.72;
  z-index:2;
}
.ll-coverflow__card[data-cover-position="2"]{
  --cover-x:33vw;
  --cover-z:-190px;
  --cover-rotate:-36deg;
  --cover-scale:0.78;
  --cover-opacity:0.38;
  z-index:1;
}
.ll-coverflow__card[data-cover-position="far"]{
  --cover-scale:0.72;
  --cover-opacity:0;
  z-index:0;
  pointer-events:none;
}
.ll-coverflow__card:focus-visible{
  outline:3px solid #0878d1;
  outline-offset:5px;
}
.ll-coverflow__controls{
  position:absolute;
  left:50%;
  bottom:1.5rem;
  z-index:10;
  display:flex;
  align-items:center;
  gap:0.55rem;
  min-height:42px;
  padding:0.25rem 0.45rem;
  border:1px solid rgba(97,143,176,0.2);
  border-radius:999px;
  background:rgba(255,255,255,0.82);
  box-shadow:0 10px 30px rgba(70,111,141,0.12);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  transform:translateX(-50%);
}
.ll-coverflow__arrow{
  display:grid;
  width:32px;
  height:32px;
  padding:0;
  place-items:center;
  border:0;
  border-radius:50%;
  background:transparent;
  color:#24475f;
  font:600 1rem/1 system-ui,sans-serif;
  cursor:pointer;
  transition:color 0.22s ease,background 0.22s ease,transform 0.22s ease;
}
.ll-coverflow__arrow:hover:not(:disabled){
  background:rgba(8,120,209,0.1);
  color:#0878d1;
  transform:translateY(-1px);
}
.ll-coverflow__arrow:disabled{opacity:0.28;cursor:default}
.ll-coverflow__arrow:focus-visible,
.ll-coverflow__dots button:focus-visible{
  outline:2px solid #0878d1;
  outline-offset:2px;
}
.ll-coverflow__dots{
  display:flex;
  align-items:center;
  gap:0.35rem;
}
.ll-coverflow__dots button{
  width:6px;
  height:6px;
  padding:0;
  border:0;
  border-radius:999px;
  background:rgba(36,71,95,0.28);
  cursor:pointer;
  transition:width 0.3s cubic-bezier(0.22,1,0.36,1),background 0.25s ease;
}
.ll-coverflow__dots button[aria-current="true"]{
  width:22px;
  background:#0878d1;
}

@media (max-width:1023px){
  .pd-coverflow-section__head{grid-template-columns:1fr;gap:0.8rem}
  .pd-coverflow-section__title{max-width:16em}
  .pd-coverflow-section__lead{grid-column:1;margin-top:0}
  .pd-coverflow-stage{height:clamp(27rem,65vw,34rem)}
  .ll-coverflow__track{top:44%}
  .ll-coverflow__card{width:min(76vw,38rem)}
}

@media (max-width:560px){
  .pd-coverflow-section{
    padding-top:3.75rem;
    padding-bottom:3rem;
  }
  .pd-coverflow-section__title{font-size:clamp(2rem,9vw,2.55rem)}
  .pd-coverflow-stage{height:23rem;margin-top:1.2rem}
  .ll-coverflow__track{top:42%}
  .ll-coverflow__card{width:min(82vw,21rem)}
  .ll-coverflow__card[data-cover-position="-2"]{--cover-x:-68vw}
  .ll-coverflow__card[data-cover-position="-1"]{--cover-x:-38vw}
  .ll-coverflow__card[data-cover-position="1"]{--cover-x:38vw}
  .ll-coverflow__card[data-cover-position="2"]{--cover-x:68vw}
  .ll-coverflow__caption{top:calc(100% + 0.65rem);font-size:0.82rem}
  .ll-coverflow__controls{bottom:0.75rem}
}

@media (prefers-reduced-motion:reduce){
  .ll-coverflow__card,
  .ll-coverflow__card img,
  .ll-coverflow__caption,
  .ll-coverflow__arrow,
  .ll-coverflow__dots button{
    transition:none;
  }
}

/* ——— Values: left title / right numbered progression (auto-margin only) ——— */
.pd-values{
  padding:clamp(4rem,7.5vw,5.75rem) var(--ll-gutter);
  background:var(--ll-bg);
}
.pd-values__inner{
  width:min(80rem,var(--ll-max),100%);
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(0,0.4fr) minmax(0,0.56fr);
  gap:clamp(2rem,5vw,4rem);
  align-items:start;
}
.pd-values__head{
  margin:0;
  max-width:22rem;
  position:sticky;
  top:6.5rem;
}
.pd-values__label{
  margin:0 0 0.85rem;
  font-size:0.78rem;
  font-weight:500;
  letter-spacing:0.14em;
  color:rgba(15,16,18,0.42);
}
.pd-values__title{
  margin:0;
  font-size:3rem; /* 48px fixed */
  font-weight:420;
  letter-spacing:0;
  line-height:1.14;
  color:var(--ll-ink);
  max-width:none;
}
.pd-values__list{
  list-style:none;
  margin:0;
  padding:0;
  border-top:1px solid var(--ll-line);
}
.pd-values__item{
  display:grid;
  grid-template-columns:3rem minmax(0,1fr);
  gap:0.85rem 1.25rem;
  align-items:start;
  padding:1.45rem 0;
  min-height:5.75rem;
  border-bottom:1px solid var(--ll-line);
}
.pd-values__num{
  font-size:0.82rem;
  font-weight:520;
  letter-spacing:0.12em;
  color:var(--ll-blue);
  line-height:1.4;
  padding-top:0.2rem;
}
.pd-values__key{
  display:block;
  margin:0 0 0.4rem;
  font-size:1.25rem;
  font-weight:500;
  letter-spacing:0;
  color:var(--ll-ink);
  line-height:1.25;
}
.pd-values__item:first-child .pd-values__key{
  font-size:1.35rem;
  font-weight:520;
}
.pd-values__text{
  margin:0;
  max-width:42ch;
  font-size:1.05rem;
  line-height:1.7;
  letter-spacing:0;
  color:var(--ll-muted);
}

/* ——— Evidence + workflow ——— */
.pd-evidence{
  padding:clamp(3.75rem,7vw,5.5rem) var(--ll-gutter);
  background:var(--ll-white);
}
.pd-evidence__inner{
  width:min(80rem,var(--ll-max),100%);
  margin:0 auto;
}
.pd-evidence__stage{
  margin:0 0 clamp(2rem,4vw,2.75rem);
  border:1px solid var(--ll-line);
  border-radius:8px;
  overflow:hidden;
  background:#1a1c1f;
  aspect-ratio:16 / 10;
  max-height:min(62vh,580px);
}
.pd-evidence__stage img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center 42%;
  filter:none;
}
.pd-evidence__caption{
  margin:0.75rem 0 0;
  font-size:0.82rem;
  color:rgba(15,16,18,0.42);
  letter-spacing:0.02em;
}

/* flow band: left identity + right vertical steps */
.pd-flow-band{
  display:grid;
  grid-template-columns:minmax(0,0.38fr) minmax(0,0.58fr);
  gap:clamp(1.75rem,4vw,3.5rem);
  align-items:start;
  margin-top:clamp(2rem,4vw,2.75rem);
}
.pd-flow-band__identity{min-width:0;max-width:22rem}
.pd-flow-band__identity .pd-evidence__label,
.pd-evidence__label{
  margin:0 0 0.75rem;
  font-size:0.78rem;
  font-weight:500;
  letter-spacing:0.14em;
  color:rgba(15,16,18,0.42);
}
.pd-flow-band__identity .pd-evidence__title,
.pd-evidence__title{
  margin:0;
  font-size:2.75rem; /* 44px */
  font-weight:420;
  letter-spacing:0;
  line-height:1.14;
  color:var(--ll-ink);
}
.pd-flow-band__identity .pd-evidence__lead,
.pd-evidence__lead{
  margin:1rem 0 0;
  font-size:1.05rem;
  line-height:1.7;
  letter-spacing:0;
  color:var(--ll-muted);
  max-width:36ch;
}
.pd-flow-band__steps{min-width:0}
.pd-flow{
  list-style:none;
  margin:0;
  padding:0;
  border-top:1px solid var(--ll-line);
  display:flex;
  flex-direction:column;
  gap:0;
}
.pd-flow__step{
  display:grid;
  grid-template-columns:3rem minmax(0,1fr);
  gap:0.65rem 1.1rem;
  align-items:start;
  padding:1.35rem 0;
  min-height:5.75rem; /* ~92px */
  border-right:0;
  border-bottom:1px solid var(--ll-line);
}
.pd-flow__step:first-child{
  min-height:6.5rem;
}
.pd-flow__step:last-child{
  border-bottom:0;
  padding-right:0;
}
.pd-flow__num{
  display:block;
  margin:0;
  font-size:0.82rem;
  font-weight:520;
  letter-spacing:0.12em;
  color:var(--ll-blue);
  line-height:1.4;
  padding-top:0.15rem;
}
.pd-flow__step:first-child .pd-flow__num{
  font-size:0.9rem;
}
.pd-flow__name{
  margin:0;
  font-size:1.12rem;
  font-weight:520;
  letter-spacing:0;
  color:var(--ll-ink);
  line-height:1.3;
}
.pd-flow__step:first-child .pd-flow__name{
  font-size:1.2rem;
}
.pd-flow__desc{
  margin:0.4rem 0 0;
  font-size:1rem;
  line-height:1.65;
  letter-spacing:0;
  color:var(--ll-muted);
  max-width:42ch;
}
.pd-flow__note{
  margin:1.15rem 0 0;
  font-size:0.9rem;
  line-height:1.55;
  color:rgba(15,16,18,0.48);
  max-width:42ch;
}

/* stage sits full-width above flow band on auto-margin */
.pd-evidence__stage-slot{
  margin:0 0 0.35rem;
}
.pd-evidence__stage-slot + .pd-evidence__caption{
  margin-bottom:0.25rem;
}

/* ——— Collab: near-black asymmetric statement ——— */
.pd-collab{
  padding:clamp(4.5rem,9vw,6.5rem) var(--ll-gutter);
  background:#0f1012;
  color:#f2f2f4;
  min-height:0;
}
.pd-collab__inner{
  width:min(80rem,var(--ll-max),100%);
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(0,0.55fr) minmax(0,0.36fr);
  gap:clamp(2rem,5vw,4.25rem);
  align-items:start;
  max-width:none;
}
.pd-collab__identity{min-width:0;max-width:none}
.pd-collab__label{
  margin:0 0 1.1rem;
  font-size:0.78rem;
  font-weight:500;
  letter-spacing:0.14em;
  color:rgba(91,156,246,0.85); /* signal blue label only */
}
.pd-collab__title{
  margin:0;
  font-size:3.25rem; /* 52px */
  font-weight:420;
  letter-spacing:0;
  line-height:1.12;
  color:#fdfdfd;
  max-width:none;
}
.pd-collab__copy{min-width:0}
.pd-collab__body{
  margin:0;
  font-size:1.1rem;
  line-height:1.75;
  letter-spacing:0;
  color:rgba(242,242,244,0.62);
  max-width:38ch;
}
.pd-collab__group{
  margin:0;
  padding:0 0 1.25rem;
  border-bottom:1px solid rgba(242,242,244,0.12);
}
.pd-collab__group + .pd-collab__group{
  margin-top:1.25rem;
  padding-bottom:0;
  border-bottom:0;
}
.pd-collab__group-label{
  display:block;
  margin:0 0 0.45rem;
  font-size:0.72rem;
  font-weight:520;
  letter-spacing:0.12em;
  color:rgba(91,156,246,0.9);
}
.pd-collab__group p{
  margin:0;
  font-size:1.05rem;
  line-height:1.72;
  color:rgba(242,242,244,0.62);
  max-width:38ch;
}

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

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

/* Related — dual column; GEO marker block preserved as link list */
.pd-related{
  padding:clamp(3.5rem,6.5vw,5rem) var(--ll-gutter);
  background:var(--ll-white);
  border-top:1px solid var(--ll-line);
}
.pd-related__inner{
  width:min(80rem,var(--ll-max),100%);
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(0,0.38fr) minmax(0,0.56fr);
  gap:clamp(1.75rem,4vw,3.25rem);
  align-items:start;
  max-width:none;
}
.pd-related__identity{min-width:0;max-width:22rem}
.pd-related__label{
  margin:0 0 0.75rem;
  font-size:0.78rem;
  font-weight:500;
  letter-spacing:0.14em;
  color:rgba(15,16,18,0.42);
}
.pd-related__title{
  margin:0;
  font-size:2rem;
  font-weight:420;
  letter-spacing:0;
  line-height:1.2;
  color:var(--ll-ink);
}
.pd-related__note{
  margin:0.85rem 0 0;
  font-size:1rem;
  line-height:1.65;
  color:var(--ll-muted);
  max-width:36ch;
}
.pd-related__panel{min-width:0}
.pd-related__link{
  display:grid;
  grid-template-columns:3rem minmax(0,1fr) 1.25rem;
  gap:0.65rem 0.85rem;
  align-items:center;
  padding:1.1rem 0;
  border-top:1px solid var(--ll-line);
  border-bottom:1px solid var(--ll-line);
  font-size:1.08rem;
  font-weight:520;
  letter-spacing:0;
  color:var(--ll-ink);
  line-height:1.35;
  text-decoration:none;
}
.pd-related__link:hover{color:var(--ll-blue)}
.pd-related__link:focus-visible{
  outline:2px solid var(--ll-blue);
  outline-offset:3px;
}
.pd-related__link-num{
  font-size:0.78rem;
  font-weight:520;
  letter-spacing:0.12em;
  color:var(--ll-blue);
}
.pd-related__link-arrow{
  color:var(--ll-blue);
  font-size:1.1rem;
  line-height:1;
}
.pd-related__sublabel{
  margin:0 0 0.35rem;
  font-size:0.72rem;
  font-weight:520;
  letter-spacing:0.12em;
  color:rgba(15,16,18,0.4);
}
.pd-related__links{
  display:flex;
  flex-direction:column;
  gap:0;
  margin:0;
  max-width:none;
  counter-reset:pd-rel;
  border-top:1px solid var(--ll-line);
}
.pd-related__links a{
  counter-increment:pd-rel;
  display:grid;
  grid-template-columns:3rem minmax(0,1fr) 1.25rem;
  gap:0.65rem 0.85rem;
  align-items:center;
  padding:1rem 0;
  font-size:1rem;
  font-weight:500;
  color:var(--ll-ink);
  border-bottom:1px solid var(--ll-line);
  text-decoration:none;
}
.pd-related__links a::before{
  content:counter(pd-rel, decimal-leading-zero);
  font-size:0.78rem;
  font-weight:520;
  letter-spacing:0.1em;
  color:var(--ll-blue);
}
.pd-related__links a::after{
  content:"→";
  color:var(--ll-blue);
  font-size:1rem;
}
.pd-related__links a:hover{color:var(--ll-blue)}
.pd-related__links a:focus-visible{
  outline:2px solid var(--ll-blue);
  outline-offset:3px;
}

/* Product-specific: framework — keep metal body fully in frame */
body.pd--framework .pd-hero__media img{
  object-position:center 46%;
}
body.pd--framework .pd-scene__media img{
  object-fit:cover;
  object-position:center 48%;
}

/* Product-specific: arrangement — bright light hero + crop soft-scene side panels */
body.pd--arrangement .pd-hero--light{
  background:#eef1f5;
  color:var(--ll-ink);
}
body.pd--arrangement .pd-hero--light .pd-hero__media img{
  object-fit:cover;
  /* center-right: full upper/lower arch readable, room for left copy */
  object-position:58% 48%;
}
body.pd--arrangement .pd-hero--light .pd-hero__media::after{
  /*
   * Light editorial hero: NO full-frame white fog.
   * Left band = text safety only; bottom = soft blend into section.
   * Center/right product stays near original clarity.
   */
  background:
    linear-gradient(180deg,
      rgba(238,241,245,0.28) 0%,
      transparent 14%,
      transparent 62%,
      rgba(238,241,245,0.18) 82%,
      rgba(238,241,245,0.55) 94%,
      #eef1f5 100%),
    linear-gradient(90deg,
      rgba(238,241,245,0.86) 0%,
      rgba(238,241,245,0.52) 22%,
      rgba(238,241,245,0.14) 38%,
      transparent 52%);
}
body.pd--arrangement .pd-hero--light .pd-breadcrumb{
  color:rgba(15,16,18,0.42);
}
body.pd--arrangement .pd-hero--light .pd-breadcrumb a{
  color:rgba(15,16,18,0.48);
}
body.pd--arrangement .pd-hero--light .pd-breadcrumb a:hover{color:var(--ll-ink)}
body.pd--arrangement .pd-hero--light .pd-breadcrumb [aria-current="page"]{
  color:rgba(15,16,18,0.72);
}
body.pd--arrangement .pd-hero--light .pd-hero__product{
  color:rgba(15,16,18,0.42);
}
body.pd--arrangement .pd-hero--light h1{
  color:var(--ll-ink);
  max-width:12em;
}
body.pd--arrangement .pd-hero--light .pd-hero__tagline{
  color:rgba(15,16,18,0.72);
}
body.pd--arrangement .pd-hero--light .pd-hero__lead{
  color:rgba(15,16,18,0.58);
  max-width:32ch;
}
body.pd--arrangement .pd-hero--light .pd-hero__note{
  color:rgba(15,16,18,0.4);
}
body.pd--arrangement .pd-hero--light .pd-btn--ghost{
  color:var(--ll-ink);
  border-color:rgba(15,16,18,0.22);
}
body.pd--arrangement .pd-hero--light .pd-btn--ghost:hover{
  border-color:rgba(15,16,18,0.5);
}
body.pd--arrangement .pd-hero--light .pd-hero__scroll{
  color:rgba(15,16,18,0.38);
}
body.pd--arrangement .pd-hero--light .pd-hero__scroll-line{
  background:rgba(15,16,18,0.22);
}
/* Scene: zoom & crop side decorative panels (98% / 0.05 mm etc.) — focus on arch */
body.pd--arrangement .pd-scene__media{
  height:clamp(320px,38vw,460px);
  max-height:480px;
  background:#e8ecf2;
  overflow:hidden;
}
body.pd--arrangement .pd-scene__media img{
  object-fit:cover;
  /* bias slightly right so left analysis panel exits frame first */
  object-position:54% 44%;
  /* stronger crop: decorative 98%/0.05mm panels must not be legible */
  transform:scale(1.82);
  transform-origin:54% 44%;
  will-change:transform;
}
@media (prefers-reduced-motion: reduce){
  body.pd--arrangement .pd-scene__media img{
    /* crop still required; scale is layout crop not motion */
    transform:scale(1.82);
  }
}

@media (max-width:1023px){
  .pd-about__inner,
  .pd-values__inner,
  .pd-flow-band,
  .pd-collab__inner,
  .pd-related__inner{
    grid-template-columns:1fr;
    gap:1.75rem;
  }
  .pd-values__head{position:static;max-width:none}
  .pd-about__title{font-size:2.5rem}
  .pd-values__title{font-size:2.35rem}
  .pd-collab__title{font-size:2.5rem}
  .pd-flow-band__identity .pd-evidence__title,
  .pd-evidence__title{font-size:2.35rem}
  .pd-scene__title{font-size:2.25rem}
  .pd-evidence__stage{
    max-height:none;
    aspect-ratio:16 / 10;
  }
  .pd-scene__inner{
    grid-template-columns:1fr;
    gap:1.35rem;
  }
  .pd-scene__media{
    height:auto;
    min-height:0;
    max-height:none;
    aspect-ratio:16 / 9;
  }
  .pd-demo-stage--scene{
    width:100%;
  }
  body.pd--arrangement .pd-scene__media{
    height:auto;
    max-height:none;
    aspect-ratio:16 / 10;
  }
  body.pd--arrangement .pd-scene__media img{
    transform:scale(1.72);
    object-position:54% 42%;
    transform-origin:54% 42%;
  }
  /* demo stage covers are full-bleed 16:9 — no soft-scene scale crop */
  body.pd--arrangement .pd-demo-stage__img{
    transform:none;
    object-position:center 50%;
  }
}

@media (max-width:640px){
  .pd-hero__body{
    padding:5.5rem var(--ll-gutter) 2rem;
  }
  .pd-hero h1{max-width:none}
  .pd-hero__lead{max-width:none}
  .pd-hero__actions{
    flex-direction:column;
    align-items:stretch;
  }
  .pd-btn{width:100%;min-height:3rem}
  .pd-about__title{font-size:2.15rem;max-width:none}
  .pd-about__body,
  .pd-about__aside{max-width:none}
  .pd-values__title{font-size:2.1rem}
  .pd-values__item{
    grid-template-columns:2.5rem minmax(0,1fr);
    gap:0.55rem 0.85rem;
    padding:1.2rem 0;
    min-height:0;
  }
  .pd-values__text{max-width:none}
  .pd-evidence__stage{
    aspect-ratio:16 / 11;
  }
  .pd-evidence__stage img{
    object-position:28% 42%;
  }
  .pd-flow-band__identity .pd-evidence__title,
  .pd-evidence__title{font-size:2.1rem;max-width:none}
  .pd-scene__inner{
    grid-template-columns:1fr;
  }
  .pd-scene__media{
    order:2;
    aspect-ratio:16 / 9;
    width:100%;
  }
  .pd-demo-stage--scene{
    order:2;
    width:100%;
  }
  .pd-scene__copy{order:1}
  .pd-scene__title{font-size:2rem;max-width:none}
  .pd-scene__body{max-width:none}
  body.pd--framework .pd-scene__media img{
    object-position:center center;
  }
  body.pd--framework .pd-hero__media img{
    object-position:center 50%;
  }
  /*
   * Mobile light hero: dedicated top product stage (~30svh), copy below.
   * Avoid absolute full-bleed + heavy wash that collapses the denture to ~100px.
   */
  body.pd--arrangement .pd-hero--light{
    justify-content:flex-start;
    min-height:100svh;
    min-height:100dvh;
  }
  body.pd--arrangement .pd-hero--light .pd-hero__media{
    position:relative;
    inset:auto;
    z-index:0;
    flex:0 0 auto;
    width:100%;
    height:clamp(28svh,32svh,34svh);
    min-height:28svh;
    max-height:34svh;
  }
  body.pd--arrangement .pd-hero--light .pd-hero__media img{
    object-position:center 42%;
  }
  body.pd--arrangement .pd-hero--light .pd-hero__media::after{
    /* only seam blend product → copy; do not fog the arch */
    background:linear-gradient(180deg,
      rgba(238,241,245,0.18) 0%,
      transparent 18%,
      transparent 62%,
      rgba(238,241,245,0.35) 86%,
      #eef1f5 100%);
  }
  body.pd--arrangement .pd-hero--light .pd-hero__body{
    position:relative;
    z-index:1;
    flex:1 1 auto;
    width:100%;
    margin:0;
    padding:1.1rem var(--ll-gutter) 1.25rem;
    background:#eef1f5;
  }
  body.pd--arrangement .pd-hero--light .pd-hero__scroll{
    margin-top:auto;
    padding-top:0.35rem;
    background:#eef1f5;
  }
  body.pd--arrangement .pd-hero--light h1{max-width:none}
  body.pd--arrangement .pd-hero--light .pd-hero__lead{max-width:none}
  body.pd--arrangement .pd-scene__media{
    aspect-ratio:5 / 4;
  }
  body.pd--arrangement .pd-scene__media img{
    transform:scale(1.9);
    object-position:52% 40%;
    transform-origin:52% 40%;
  }
  .pd-flow__step{
    grid-template-columns:2.5rem minmax(0,1fr);
    border-bottom:1px solid var(--ll-line);
    padding:1.15rem 0;
    min-height:0;
  }
  .pd-flow__step:last-child{border-bottom:0}
  .pd-flow__desc{max-width:none}
  .pd-collab__title{font-size:2.15rem;max-width:none}
  .pd-collab__body,
  .pd-collab__group p{max-width:none}
  .pd-related__title{font-size:1.65rem}
  .pd-related__note{max-width:none}
  .pd-related__link,
  .pd-related__links a{
    grid-template-columns:2.35rem minmax(0,1fr) 1.1rem;
  }
  .pd-cta p{max-width:none}
  .pd-cta__actions{
    flex-direction:column;
    align-items:stretch;
  }
  .pd-cta__actions .pd-btn{width:100%}
}