

#product-input .rail__label{ bottom:var(--pad-ch-y-lg); }

#product-input .s-product-input__brk{
  grid-template-columns:auto minmax(0,1fr);
  gap:var(--sp-5);
}
#product-input .brk__rule{ align-self:center; }

#product-input .s-product-input__head{
  margin-top:var(--sp-8);
  align-items:start;
}

#product-input .s-product-input__h{
  grid-column:1 / span 8;
  max-width:none;
  font-size:min(var(--fs-hero), 12.6vw);
}
#product-input .s-product-input__h .reveal--line{
  padding-bottom:.12em;
  margin-bottom:-.12em;
}

#product-input .s-product-input__note{
  position:relative;
  grid-column:9 / span 4;
  margin-top:var(--sp-7);
  padding-left:var(--gutter);
}
#product-input .s-product-input__note::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:calc(var(--sp-8) * -1);
  width:var(--hair);
  background:var(--line);
}
#product-input .s-product-input__note .body{ max-width:none; }

#product-input .s-product-input__lead{ color:var(--fg); }

#product-input .s-product-input__register{
  margin:clamp(var(--sp-10), 20vh, var(--sp-12)) 0 0;
  padding:0;
  border-bottom:var(--hair) solid var(--line-strong);
}

#product-input .s-product-input__row{
  display:grid;
  grid-template-columns:repeat(var(--cols), minmax(0,1fr));
  gap:var(--gutter);
  align-items:start;
  border-top:var(--hair) solid var(--line-strong);
  padding:var(--sp-7) 0 var(--sp-8);
}

#product-input .s-product-input__key{
  grid-column:1 / span 2;
  padding-top:var(--sp-1);
  margin:0;
  color:var(--fg-mut);
}

#product-input .s-product-input__val{
  position:relative;
  grid-column:3 / span 6;
  max-width:var(--measure-tight);
  margin:0;                        
  margin-inline-start:0;
  color:var(--fg);
}

#product-input .s-product-input__val::before{
  content:"";
  position:absolute;
  left:calc(var(--gutter) / -2);
  top:calc(var(--sp-7) * -1);
  bottom:calc(var(--sp-8) * -1);
  width:var(--hair);
  background:var(--line);
}

#product-input .s-product-input__row--absent .s-product-input__val{
  color:var(--fg-mut);
}

#product-input .s-product-input__foot{
  align-items:start;
  margin-top:var(--sp-9);
}

#product-input .s-product-input__flag{
  grid-column:1 / span 2;
  margin:0;
  color:var(--fg-mut);
}

#product-input .s-product-input__close{
  grid-column:9 / span 4;
  padding-left:var(--gutter);
  border-left:var(--hair) solid var(--line);
}

#product-input .s-product-input__deploy{
  margin:0;
  color:var(--fg);
}

#product-input .s-product-input__withhold{
  margin-top:var(--sp-5);
  padding-top:var(--sp-5);
  border-top:var(--hair) solid var(--line);
  max-width:none;
  color:var(--fg-mut);
}

@media (max-width: 1100px){
  #product-input .s-product-input__h{ grid-column:1 / -1; }
  #product-input .s-product-input__note{
    grid-column:1 / -1;
    margin-top:var(--sp-7);
    padding-left:0;
  }
  #product-input .s-product-input__note::before{ display:none; }
  #product-input .s-product-input__note .body{ max-width:var(--measure-prose); }

  
  #product-input .s-product-input__key{ grid-column:1 / span 3; }
  #product-input .s-product-input__val{ grid-column:4 / span 9; }

  
  #product-input .s-product-input__flag { grid-column:1 / -1; }
  #product-input .s-product-input__close{
    grid-column:1 / -1;
    margin-top:var(--sp-4);
    padding-left:0;
    border-left:0;
  }
  #product-input .s-product-input__deploy { max-width:var(--measure-tight); }
  #product-input .s-product-input__withhold{ max-width:var(--measure-record); }
}

@media (max-width: 760px){
  
  #product-input .s-product-input__row{
    grid-template-columns:minmax(0,1fr);
    gap:var(--sp-3);
    padding:var(--sp-5) 0 var(--sp-6);
  }
  #product-input .s-product-input__key,
  #product-input .s-product-input__val{ grid-column:1; }
  #product-input .s-product-input__key{ padding-top:0; }
  #product-input .s-product-input__val{ max-width:none; }
  #product-input .s-product-input__val::before{ display:none; }
  #product-input .s-product-input__deploy,
  #product-input .s-product-input__withhold{ max-width:none; }

  #product-input .s-product-input__head{ margin-top:var(--sp-7); }
  #product-input .s-product-input__note{ margin-top:var(--sp-6); }
  #product-input .s-product-input__register{
    margin-top:clamp(var(--sp-8), 12vh, var(--sp-10));
  }
  #product-input .s-product-input__foot{ margin-top:var(--sp-7); }
  
  #product-input .s-product-input__close{ margin-top:var(--sp-3); }
  #product-input .rail__label{ bottom:var(--pad-ch-y); }
}
