/* OUTBOX Comparison V2 — editorial production matrix with scroll-activated OUTBOX column.
   ALL selectors scoped to #outbox-comparison. Existing section backdrop unchanged. */
#outbox-comparison.oc-vs {
  --vs-orange:#FBAF2A;
  --vs-green:#40e46d;
  --vs-stroke:rgba(255,255,255,.13);
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:clamp(84px,9vw,140px) 0 clamp(92px,10vw,155px);
  background:
    radial-gradient(ellipse 61% 62% at 17% 24%,rgba(78,78,78,.24),transparent 81%),
    radial-gradient(ellipse 46% 62% at 88% 76%,rgba(251,175,42,.055),transparent 80%),
    #202021;
  color:#f8f7f3;
}
#outbox-comparison *,#outbox-comparison *::before,#outbox-comparison *::after {box-sizing:border-box}
#outbox-comparison .oc-vs-container{position:relative;z-index:2;max-width:1510px}
#outbox-comparison .oc-vs-ghost{
  position:absolute;
  z-index:0;
  inset:auto -1.5vw -3.4vw auto;
  color:transparent;
  -webkit-text-stroke:1.4px rgba(255,255,255,.16);
  font:900 clamp(225px,38vw,680px)/.72 'Barlow Condensed',Impact,sans-serif;
  letter-spacing:-.085em;
  white-space:nowrap;user-select:none;pointer-events:none;
  opacity:.85;
}
#outbox-comparison .oc-vs-kicker{
  display:flex;align-items:center;gap:13px;
  color:var(--vs-orange);
  font:800 11px/1.4 'Space Grotesk',sans-serif;
  letter-spacing:.23em;text-transform:uppercase;
  margin:0 0 20px;
}
#outbox-comparison .oc-vs-kicker::before{content:"";width:31px;height:2px;background:currentColor}
#outbox-comparison .oc-vs-intro{position:relative;z-index:1;margin:0 0 36px}
#outbox-comparison .oc-vs-heading{
  max-width:100%;
  margin:0;
  font:900 clamp(56px,6.6vw,109px)/.91 'Barlow Condensed',Impact,sans-serif;
  letter-spacing:-.021em;text-transform:uppercase;
  color:#fcfaf7;
}
#outbox-comparison .oc-vs-heading span{display:block;color:var(--vs-orange)}
#outbox-comparison .oc-vs-deck{
  margin:23px 0 0;
  max-width:51ch;
  color:#cdcbc7;
  font:400 clamp(14px,1.1vw,17px)/1.6 'DM Sans',Arial,sans-serif;
}
#outbox-comparison .oc-vs-matrix {
  display:grid;
  grid-template-columns:minmax(0,1.28fr) minmax(255px,.88fr) minmax(230px,.78fr);
  grid-template-rows:108px repeat(6, minmax(81px, auto)) 138px;
  column-gap:18px;
  position:relative;
  isolation:isolate;
  align-items:stretch;
}
#outbox-comparison .oc-vs-panel-shell{
  position:relative;
  border:1px solid rgba(255,255,255,.12);
  border-radius:19px;
  overflow:hidden;
  pointer-events:none;
  z-index:0;
}
#outbox-comparison .oc-vs-center-shell{
  grid-column:2;grid-row:1 / 9;
  border-color:rgba(251,175,42,.23);
  background:linear-gradient(155deg,#27251f 0%,#241d14 38%,#161513 85%);
  box-shadow:0 27px 75px rgba(0,0,0,.27),inset 0 0 65px rgba(251,175,42,.045);
}
#outbox-comparison .oc-vs-center-shell::before{
  content:"";position:absolute;inset:0;border-radius:inherit;
  background:linear-gradient(160deg,rgba(251,175,42,.07),transparent 47%);
  pointer-events:none;
}
#outbox-comparison .oc-vs-center-light{
  position:absolute;inset:0;border:1.6px solid #FBAF2A;border-radius:18px;
  opacity:.65;
  box-shadow:inset 0 0 18px rgba(251,175,42,.11),0 0 18px rgba(251,175,42,.19),0 0 36px rgba(251,175,42,.075);
  pointer-events:none;
}
#outbox-comparison .oc-vs-other-shell{
  grid-column:3;grid-row:1 / 9;
  background:linear-gradient(140deg,#222222,#171717 56%,#151515);
  box-shadow:0 20px 57px rgba(0,0,0,.18);
}
#outbox-comparison .oc-vs-head-feature,
#outbox-comparison .oc-vs-head-outbox,
#outbox-comparison .oc-vs-head-other{
  position:relative;z-index:1;min-width:0;
  display:flex;justify-content:center;flex-direction:column;
}
#outbox-comparison .oc-vs-head-feature{
  grid-column:1;grid-row:1;
  justify-content:flex-end;
  padding:0 20px 23px 0;
  color:var(--vs-orange);
  text-transform:uppercase;
  font:800 11px/1.5 'Space Grotesk',sans-serif;
  letter-spacing:.19em;
}
#outbox-comparison .oc-vs-head-outbox{
  grid-column:2;grid-row:1;
  padding:22px 24px 20px;
  border-bottom:1px solid rgba(251,175,42,.23);
}
#outbox-comparison .oc-vs-brand-img{
  display:block;
  width:min(150px,100%);
  height:55px;
  object-fit:contain;
  object-position:left center;
}
#outbox-comparison .oc-vs-logo{
  font:900 clamp(32px,3vw,44px)/.88 'Barlow Condensed',Impact,sans-serif;
  color:var(--vs-orange);letter-spacing:-.035em;
}
#outbox-comparison .oc-vs-head-outbox small{
  display:block;color:#FBAF2A;
  font:800 11px/1 'Space Grotesk',sans-serif;
  letter-spacing:.23em;margin-top:9px;
}
#outbox-comparison .oc-vs-head-other{
  grid-column:3;grid-row:1;
  padding:20px 25px;
  border-bottom:1px solid rgba(255,255,255,.1);
  color:#d7d7d6;
  font:800 clamp(14px,1.25vw,18px)/1.3 'Space Grotesk',sans-serif;
  letter-spacing:.115em;
}
#outbox-comparison .oc-vs-rows{display:contents;list-style:none;margin:0;padding:0}
#outbox-comparison .oc-vs-row{display:contents}
#outbox-comparison .oc-vs-feature{
  grid-column:1;grid-row:var(--vs-row);
  position:relative;z-index:1;
  min-width:0;
  display:flex;align-items:center;gap:clamp(13px,1.5vw,23px);
  padding:14px 18px 14px 0;
  border-bottom:1px solid rgba(255,255,255,.10);
}
#outbox-comparison .oc-vs-feature-ico{
  display:grid;place-items:center;
  width:53px;height:53px;flex:0 0 53px;
  border:1px solid rgba(251,175,42,.24);
  border-radius:12px;
  background:rgba(251,175,42,.055);
  color:var(--vs-orange);
}
#outbox-comparison .oc-vs-feature-ico svg{
  width:25px;height:25px;
  fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;
}
#outbox-comparison .oc-vs-feature-copy{min-width:0}
#outbox-comparison .oc-vs-feature-title{
  display:block;
  color:#f8f7f3;
  font:800 clamp(13px,1.03vw,16px)/1.35 'Space Grotesk',sans-serif;
  letter-spacing:.058em;text-transform:uppercase;
}
#outbox-comparison .oc-vs-feature-description{
  display:block;color:#b6b5b0;
  font:400 clamp(12px,.88vw,14px)/1.45 'DM Sans',Arial,sans-serif;
  margin-top:5px;
}
#outbox-comparison .oc-vs-result{
  position:relative;z-index:1;min-width:0;
  grid-row:var(--vs-row);
  display:flex;align-items:center;gap:14px;
  border-bottom:1px solid rgba(255,255,255,.095);
  padding:12px clamp(15px,1.45vw,25px);
  font:800 clamp(11px,.82vw,13px)/1.35 'Space Grotesk',sans-serif;
  letter-spacing:.065em;text-transform:uppercase;
}
#outbox-comparison .oc-vs-result-outbox{grid-column:2;color:var(--vs-orange)}
#outbox-comparison .oc-vs-result-other{grid-column:3;color:#9e9e9e}
#outbox-comparison .oc-vs-check{
  display:block;position:relative;
  width:35px;height:35px;flex:0 0 35px;
}
#outbox-comparison .oc-vs-check svg{
  position:absolute;inset:0;width:100%;height:100%;
  fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;
}
#outbox-comparison .oc-vs-check-base{color:#55665b}
#outbox-comparison .oc-vs-check-active{
  color:#40e46d;
  opacity:1;
  filter:drop-shadow(0 0 6px rgba(64,228,109,.45));
  transform-origin:center;
}
#outbox-comparison .oc-vs-result-outbox .oc-vs-result-text{
  color:#D5D4C8;
  transition:color .25s ease;
}
#outbox-comparison .oc-vs-result-other .oc-vs-check{color:#858587}
#outbox-comparison .oc-vs-result-other svg{
  width:32px;height:32px;
}
#outbox-comparison .oc-vs-mobile-label{display:none}
#outbox-comparison .oc-vs-mobile-border{display:none}
#outbox-comparison .oc-vs-photo{
  position:relative;z-index:1;
  grid-column:2;grid-row:8;
  min-width:0;overflow:hidden;
  border-radius:0 0 18px 18px;
}
#outbox-comparison .oc-vs-photo img{
  width:100%;height:100%;
  object-fit:cover;object-position:center 48%;
  filter:saturate(.89) contrast(1.02) brightness(.72);
  transition:transform .7s ease;
}
#outbox-comparison .oc-vs-photo::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(0deg,rgba(0,0,0,.52),transparent 76%);
}
#outbox-comparison .oc-vs-photo-caption{
  position:absolute;z-index:2;bottom:13px;left:21px;
  color:#FBAF2A;
  font:800 10px 'Space Grotesk',sans-serif;
  letter-spacing:.13em;text-transform:uppercase;
}
#outbox-comparison .oc-vs-other-art{
  position:relative;z-index:1;
  grid-column:3;grid-row:8;
  display:flex;align-items:end;justify-content:center;
  padding:15px;
  background:
    repeating-linear-gradient(90deg,transparent 0 54px,rgba(255,255,255,.015) 55px 56px),
    radial-gradient(ellipse at center 0%,rgba(255,255,255,.06),transparent 62%);
  color:rgba(255,255,255,.4);
  font:700 9px/1.5 'Space Grotesk',sans-serif;
  letter-spacing:.18em;text-transform:uppercase;
  border-radius:0 0 18px 18px;
}
#outbox-comparison .oc-vs-bottom{
  position:relative;z-index:1;
  display:grid;grid-template-columns:minmax(0,1fr) auto;
  align-items:center;gap:24px;
  padding:19px clamp(18px,3vw,33px);
  margin:24px 0 0;
  background:linear-gradient(100deg,rgba(20,20,20,.86),rgba(36,34,29,.9));
  border:1px solid rgba(255,255,255,.16);
  border-radius:14px;
  box-shadow:0 18px 45px rgba(0,0,0,.17);
}
#outbox-comparison .oc-vs-bottom-copy{
  display:flex;gap:17px;align-items:center;
}
#outbox-comparison .oc-vs-bottom-star{
  color:var(--vs-orange);
  font-size:29px;line-height:1;
}
#outbox-comparison .oc-vs-bottom strong{
  display:block;
  color:#f9f8f5;
  font:800 12px/1.4 'Space Grotesk',sans-serif;
  letter-spacing:.13em;
}
#outbox-comparison .oc-vs-bottom p{
  margin:4px 0 0;
  color:#adaca7;
  font:400 13px/1.5 'DM Sans',Arial,sans-serif;
}
#outbox-comparison .oc-vs-book{
  display:inline-flex;align-items:center;justify-content:space-between;gap:30px;
  min-width:220px;min-height:54px;padding:13px 21px;
  color:#101010;text-decoration:none!important;
  background:var(--vs-orange);border-radius:6px;
  font:800 12px/1.3 'Space Grotesk',sans-serif;
  letter-spacing:.095em;text-transform:uppercase;
  transition:transform .3s ease,background .3s ease,box-shadow .3s ease;
}
#outbox-comparison .oc-vs-book svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;transition:transform .3s}
#outbox-comparison .oc-vs-book:hover{background:#ffc04b;transform:translateY(-3px);box-shadow:0 11px 29px rgba(251,175,42,.18)}
#outbox-comparison .oc-vs-book:hover svg{transform:translate(3px,-3px)}
#outbox-comparison .oc-vs-book:focus-visible{outline:2px solid #fff;outline-offset:3px}
#outbox-comparison .oc-vs-comparison-note{
  margin:15px 2px 0;
  color:#92918e;font:400 11px/1.5 'DM Sans',Arial,sans-serif;
}
@media(hover:hover) and (pointer:fine){
  #outbox-comparison .oc-vs-feature:hover .oc-vs-feature-ico{
    border-color:rgba(251,175,42,.6);
    background:rgba(251,175,42,.1);
  }
  #outbox-comparison .oc-vs-photo:hover img{transform:scale(1.055)}
}
@media(max-width:1160px){
  #outbox-comparison .oc-vs-matrix{grid-template-columns:minmax(0,1.18fr) minmax(207px,.84fr) minmax(185px,.8fr);column-gap:11px}
  #outbox-comparison .oc-vs-head-outbox{padding:17px 18px}
  #outbox-comparison .oc-vs-head-other{padding:18px}
  #outbox-comparison .oc-vs-result{padding:12px 14px;gap:9px}
  #outbox-comparison .oc-vs-feature-ico{width:43px;height:43px;flex-basis:43px}
  #outbox-comparison .oc-vs-feature-ico svg{width:22px;height:22px}
  #outbox-comparison .oc-vs-feature-description{font-size:12px}
}
@media(max-width:820px){
  #outbox-comparison{padding:75px 0 95px}
  #outbox-comparison .oc-vs-heading{font-size:clamp(51px,9vw,77px)}
  #outbox-comparison .oc-vs-deck{font-size:14px}
  #outbox-comparison .oc-vs-matrix{display:block}
  #outbox-comparison .oc-vs-panel-shell,
  #outbox-comparison .oc-vs-head-feature,
  #outbox-comparison .oc-vs-head-outbox,
  #outbox-comparison .oc-vs-head-other,
  #outbox-comparison .oc-vs-photo,
  #outbox-comparison .oc-vs-other-art{display:none}
  #outbox-comparison .oc-vs-rows{display:grid;gap:12px}
  #outbox-comparison .oc-vs-row{
    display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    column-gap:12px;row-gap:12px;
    padding:17px 16px 16px;
    border:1px solid rgba(255,255,255,.12);
    border-radius:13px;
    background:linear-gradient(110deg,rgba(61,61,61,.62),rgba(31,31,31,.74));
  }
  #outbox-comparison .oc-vs-feature{
    grid-row:auto;grid-column:1/-1;
    gap:13px;padding:0 0 10px;
    border-color:rgba(255,255,255,.09);
  }
  #outbox-comparison .oc-vs-feature-ico{width:39px;height:39px;flex-basis:39px;border-radius:9px}
  #outbox-comparison .oc-vs-feature-ico svg{width:20px;height:20px}
  #outbox-comparison .oc-vs-feature-title{font-size:13px}
  #outbox-comparison .oc-vs-feature-description{font-size:12px;margin-top:3px}
  #outbox-comparison .oc-vs-result{
    grid-row:auto;
    padding:0 3px;
    border:0;
    display:flex;flex-direction:column;align-items:flex-start;justify-content:center;
    gap:6px;
  }
  #outbox-comparison .oc-vs-result-outbox{grid-column:1}
  #outbox-comparison .oc-vs-result-outbox .oc-vs-check,
  #outbox-comparison .oc-vs-result-outbox .oc-vs-result-copy{position:relative;z-index:1}
  #outbox-comparison .oc-vs-mobile-border{
    position:absolute;
    display:block;
    z-index:0;
    inset:-7px -4px;
    border:1px solid #FBAF2A;
    border-radius:9px;
    background:rgba(251,175,42,.05);
    box-shadow:0 0 13px rgba(251,175,42,.13);
    pointer-events:none;
    opacity:.6;
  }
  #outbox-comparison .oc-vs-result-other{grid-column:2}
  #outbox-comparison .oc-vs-result-text{font-size:10px;line-height:1.2}
  #outbox-comparison .oc-vs-check{width:24px;height:24px;flex-basis:24px}
  #outbox-comparison .oc-vs-result-other svg{width:24px;height:24px}
  #outbox-comparison .oc-vs-mobile-label{
    display:block;
    color:var(--vs-orange);
    font:800 9px/1.2 'Space Grotesk',sans-serif;
    letter-spacing:.055em;
  }
  #outbox-comparison .oc-vs-result-other .oc-vs-mobile-label{color:#b3b1af}
  #outbox-comparison .oc-vs-result{flex-direction:row;align-items:center;justify-content:flex-start;gap:8px}
  #outbox-comparison .oc-vs-result-copy{display:grid;gap:3px}
  #outbox-comparison .oc-vs-bottom{grid-template-columns:1fr;gap:18px}
  #outbox-comparison .oc-vs-book{width:100%}
  #outbox-comparison .oc-vs-ghost{
    inset:auto -.18em 15px auto;
    font-size:clamp(180px,52vw,400px);
    -webkit-text-stroke-color:rgba(255,255,255,.12);
  }
}
@media(max-width:390px){
  #outbox-comparison .oc-vs-row{padding:14px 11px}
  #outbox-comparison .oc-vs-feature-ico{display:none}
  #outbox-comparison .oc-vs-feature-description{font-size:11px}
  #outbox-comparison .oc-vs-result-text{font-size:9px;letter-spacing:0}
  #outbox-comparison .oc-vs-result{gap:5px}
  #outbox-comparison .oc-vs-mobile-label{font-size:8px}
}
@media(prefers-reduced-motion:reduce){
  #outbox-comparison .oc-vs-photo img,
  #outbox-comparison .oc-vs-book,
  #outbox-comparison .oc-vs-book svg{transition:none!important;transform:none!important}
  #outbox-comparison .oc-vs-center-light{opacity:.62!important}
  #outbox-comparison .oc-vs-check-active{opacity:1!important;transform:none!important}
}

/* The OUTBOX bottom panel mirrors the neighboring dark panel; no image. */
#outbox-comparison .oc-vs-outbox-art{grid-column:2}