/* PACK09G-C: owner-approved B1 motion integrated only on the real homepage. */
.rubber-cinema {
  --cinema-ink: #11251c;
  --cinema-deep: #0e1d17;
  --cinema-cream: #f4eddb;
  --cinema-muted: #d1d7cb;
  --cinema-orange: #efb278;
  --cinema-header: 76px;
  --cinema-toolbar: 62px;
  position: relative;
  overflow: clip;
  background: var(--cinema-ink);
  color: var(--cinema-cream);
  font-family: var(--font-body);
  isolation: isolate;
}
.rubber-cinema *, .rubber-cinema *::before, .rubber-cinema *::after { box-sizing: border-box; }
.rubber-cinema h2, .rubber-cinema h3 { color: inherit; font-family: var(--font-display); font-weight: 400; letter-spacing: -.045em; }
.rubber-cinema h2 { font-size: clamp(2.7rem,4.8vw,4.8rem); line-height: 1.03; }
.rubber-cinema h3 { font-size: clamp(2rem,3vw,2.7rem); line-height: 1.08; }
.rubber-cinema p, .rubber-cinema figure { margin: 0; }
.rubber-cinema p { line-height: 1.55; }
.rubber-cinema a { color: inherit; text-underline-offset: .3em; }
.rubber-cinema button { color: inherit; font: inherit; cursor: pointer; }
.rubber-cinema :is(a,button,[tabindex],summary):focus-visible { outline: 3px solid #ffcd8e; outline-offset: 5px; box-shadow: none; }

.rubber-cinema__intro {
  display: grid;
  grid-template-columns: minmax(0,1.05fr) minmax(18rem,.75fr);
  gap: clamp(2rem,7vw,7rem);
  align-items: end;
  padding-block: clamp(3.5rem,7vw,6.5rem);
}
.rubber-cinema__intro h2 { margin: .55rem 0 0; }
.rubber-cinema__intro h2 em { color: var(--cinema-orange); font-weight: 400; }
.rubber-cinema__intro > div:last-child > p { max-width: 42ch; color: var(--cinema-muted); }
.rubber-cinema__intro-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.4rem; margin-top: 1.5rem; }
.rubber-cinema__intro-actions > a:last-child { display: inline-flex; align-items: center; min-height: 44px; font-size: .78rem; }

.rubber-cinema__action {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: .75rem;
  padding: .75rem 1rem;
  border: 1px solid #859780;
  border-radius: 3px;
  background: #1d3325;
  color: var(--cinema-cream);
  font-size: .78rem;
  font-weight: 700;
  text-decoration: none;
}
.rubber-cinema__action:hover { border-color: #b4c0ae; background: #2c4733; }
.rubber-cinema__action--accent { border-color: var(--cinema-orange); background: var(--cinema-orange); color: #15251a; }
.rubber-cinema__action--accent:hover { border-color: #ffd0a1; background: #ffd0a1; color: #15251a; }

.rubber-cinema__toolbar {
  position: sticky;
  z-index: 30;
  top: var(--cinema-header);
  min-height: 62px;
  border-block: 1px solid #ffffff20;
  background: #10231bf2;
  backdrop-filter: blur(14px);
}
.rubber-cinema__toolbar-inner { display: flex; min-height: inherit; align-items: center; gap: 1rem; }
.rubber-cinema__toolbar nav { display: flex; gap: .35rem; }
.rubber-cinema__toolbar nav a {
  display: grid;
  min-width: 38px;
  min-height: 44px;
  place-items: center;
  border-bottom: 2px solid transparent;
  color: #c9d3c4;
  font-size: .72rem;
  text-decoration: none;
}
.rubber-cinema__toolbar nav a[aria-current='step'] { border-color: var(--cinema-orange); color: #f6c591; }
.rubber-cinema__toolbar button {
  min-width: 116px;
  min-height: 44px;
  margin-left: auto;
  padding: .5rem .8rem;
  border: 1px solid #74906d;
  border-radius: 3px;
  background: #243d2c;
  font-size: .72rem;
}
.rubber-cinema__toolbar button:disabled { cursor: default; }
.rubber-cinema__toolbar [data-cinema-view-mode] { max-width: 112px; color: var(--cinema-muted); font-size: .62rem; line-height: 1.35; }

.rubber-cinema__journey { position: relative; }
.rubber-cinema__stage { position: relative; background: var(--cinema-deep); }
.rubber-cinema__scene {
  position: relative;
  display: flex;
  min-height: 820px;
  align-items: center;
  padding: 4rem 6vw;
  overflow: hidden;
  scroll-margin-top: calc(var(--cinema-header) + var(--cinema-toolbar) + 1rem);
}
.rubber-cinema__scene-image { position: absolute; inset: 0; }
.rubber-cinema__photo { display: block; width: 100%; height: 100%; }
.rubber-cinema__photo img { display: block; width: 100%; height: 100%; aspect-ratio: 16/9; object-fit: cover; object-position: center; }
.rubber-cinema__scene-image::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg,#071710f5 0%,#0a1811dc 24%,#09150d85 40%,#09150d0a 67%,transparent 100%),linear-gradient(0deg,#07140c77,transparent 30%);
  content: '';
  pointer-events: none;
}
.rubber-cinema__scene-copy { position: relative; z-index: 4; width: 35%; max-width: 430px; }
.rubber-cinema__eyebrow, .rubber-cinema__scene-copy > .rubber-cinema__eyebrow {
  margin-bottom: 1.4rem;
  color: var(--cinema-orange);
  font-size: .65rem;
  font-weight: 700;
  letter-spacing: .17em;
  text-transform: uppercase;
}
.rubber-cinema__scene-copy > p:not(.rubber-cinema__eyebrow) { max-width: 38ch; margin-top: 1.5rem; color: var(--cinema-muted); }
.rubber-cinema__scene-copy .rubber-cinema__action { margin-top: 1.4rem; }
.rubber-cinema__small { font-size: .72rem !important; line-height: 1.5; }
.rubber-cinema__process-caption { min-height: 1.6em; margin-block: 1.2rem .5rem !important; color: #f7c397 !important; font-size: .78rem !important; letter-spacing: .04em; }
.rubber-cinema__process-steps { display: grid; max-width: 390px; grid-template-columns: 1fr 1fr; gap: .8rem 1.4rem; margin: 1.5rem 0 0; padding-left: 1rem; color: #e3e2d6; font-size: .73rem; }
.rubber-cinema__process-steps li::marker { color: #dfa265; }
.rubber-cinema__process-steps [aria-current='step'] { color: #ffcf9f; text-decoration: underline; text-underline-offset: 5px; }
.rubber-cinema__connection-labels span { display: block; margin: .7rem 0; color: var(--cinema-cream); font-weight: 700; }
.rubber-cinema__application-labels { font-size: .85rem; }
.rubber-cinema__stage-footer { display: none; }

.rubber-cinema__surface { display: none; }
.rubber-cinema.is-cinematic .rubber-cinema__journey { height: 900vh; }
.rubber-cinema.is-cinematic .rubber-cinema__stage {
  position: sticky;
  top: calc(var(--cinema-header) + var(--cinema-toolbar));
  height: calc(100svh - var(--cinema-header) - var(--cinema-toolbar));
  min-height: 0;
  overflow: hidden;
}
.rubber-cinema.is-cinematic .rubber-cinema__surface { position: absolute; z-index: 0; inset: 0; display: block; width: 100%; height: 100%; pointer-events: none; }
.rubber-cinema.is-cinematic .rubber-cinema__stage::after {
  position: absolute;
  z-index: 1;
  inset: 0;
  background: linear-gradient(90deg,#071710f5 0%,#0a1811d4 24%,#09150d60 42%,transparent 70%),linear-gradient(0deg,#07140c77,transparent 25%);
  content: '';
  pointer-events: none;
}
.rubber-cinema.is-cinematic .rubber-cinema__scene { position: absolute; z-index: 2; inset: 0; min-height: 0; padding: 3rem 6vw 4rem; opacity: 0; visibility: hidden; pointer-events: none; }
.rubber-cinema.is-cinematic .rubber-cinema__scene.is-current { z-index: 3; opacity: 1; visibility: visible; pointer-events: auto; }
.rubber-cinema.is-cinematic.is-canvas-ready .rubber-cinema__scene-image { opacity: 0; }
.rubber-cinema.is-cinematic .rubber-cinema__scene-copy { opacity: var(--cinema-text-opacity,1); transform: translateY(var(--cinema-text-y,0)); }
.rubber-cinema.is-cinematic .rubber-cinema__stage-footer { position: absolute; z-index: 8; right: 6vw; bottom: 1.2rem; left: 6vw; display: flex; justify-content: space-between; color: #e2e6da; font-size: .64rem; letter-spacing: .08em; }
.rubber-cinema__mobile-surface { position: absolute; z-index: 1; inset: 0; display: none; width: 100%; height: 100%; pointer-events: none; }
.rubber-cinema.is-vertical-motion .rubber-cinema__mobile-surface[data-ready='true'] { display: block; }
.rubber-cinema__motion-status { position: absolute; z-index: 9; top: 16px; right: 20px; max-width: 250px; padding: .5rem .8rem; border: 1px solid #829278; background: #11251cee; font-size: .7rem; }
.rubber-cinema__motion-status[hidden] { display: none; }
.rubber-cinema__supply-path { display: none; }
.rubber-cinema.is-cinematic .rubber-cinema__supply-path { position: absolute; z-index: 4; right: 8%; bottom: 12%; left: 47%; display: block; height: 1px; background: #ffffff24; opacity: var(--cinema-line-opacity,0); pointer-events: none; }
.rubber-cinema__supply-path span { display: block; height: 2px; background: var(--cinema-orange); box-shadow: 0 0 15px #eaa46744; transform: scaleX(var(--cinema-line-progress,0)); transform-origin: left; }
.rubber-cinema.is-cinematic #discovery .rubber-cinema__action,
.rubber-cinema.is-cinematic #discovery .rubber-cinema__grade-links { opacity: var(--cinema-product-reveal,0); transform: translateY(calc((1 - var(--cinema-product-reveal,0))*12px)); }

.rubber-cinema__grade-explorer { max-width: 350px; margin-top: 1.4rem; }
.rubber-cinema__grade-controls[hidden] { display: none; }
.rubber-cinema__grade-static details { padding: .6rem 0; border-top: 1px solid #688565; font-size: .78rem; }
.rubber-cinema__grade-static summary { min-height: 30px; cursor: pointer; }
.rubber-cinema__grade-static p { padding: .75rem 0; }
.rubber-cinema.is-enhanced .rubber-cinema__grade-static { display: none; }
.rubber-cinema__grade-swipe { display: flex; min-height: 65px; align-items: center; justify-content: space-between; padding: .65rem 1rem; border: 1px solid #789270; border-radius: 3px; background: #10281d; cursor: ew-resize; touch-action: pan-y pinch-zoom; user-select: none; }
.rubber-cinema__grade-swipe span { color: var(--cinema-muted); font-size: .69rem; }
.rubber-cinema__grade-swipe strong { font-family: var(--font-display); font-size: 1.5rem; font-weight: 400; }
.rubber-cinema__grade-buttons { display: grid; grid-template-columns: repeat(5,1fr); gap: .4rem; margin: .7rem 0; }
.rubber-cinema__grade-buttons button { min-height: 44px; padding: .3rem; border: 1px solid #748a6e; border-radius: 2px; background: transparent; color: var(--cinema-cream); font-size: .72rem; }
.rubber-cinema__grade-buttons button[aria-pressed='true'] { border-color: var(--cinema-orange); background: var(--cinema-orange); color: #16291c; font-weight: 700; }
.rubber-cinema__grade-buttons button:hover { border-color: #f2d3ab; }
.rubber-cinema__grade-readout { min-height: 105px; padding-top: 1rem; }
.rubber-cinema__grade-readout strong { color: var(--cinema-orange); font-size: .68rem; letter-spacing: .09em; text-transform: uppercase; }
.rubber-cinema__grade-readout p { margin: .5rem 0; color: #e0e4d0; font-size: .78rem; }
.rubber-cinema__grade-links { display: flex; flex-wrap: wrap; gap: .2rem 1.2rem; margin-top: .6rem; }
.rubber-cinema__grade-links a { display: flex; min-height: 44px; align-items: center; font-size: .7rem; }

.rubber-cinema__progress-track { position: sticky; z-index: 31; bottom: 0; height: 3px; background: #28422d; }
.rubber-cinema__progress-track span { display: block; height: 100%; background: var(--cinema-orange); transform: scaleX(0); transform-origin: left; }
.rubber-cinema__destinations { padding: clamp(4rem,7vw,7rem) 0 clamp(3.5rem,6vw,6rem); background: #eee9dc; color: #23372a; scroll-margin-top: calc(var(--cinema-header) + 1rem); }
.rubber-cinema__destinations h2 { margin: 1.4rem 0 3rem; }
.rubber-cinema__destination-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 5vw; }
.rubber-cinema__destination-grid article { padding: 2rem 0; border-top: 1px solid #8d9a86; }
.rubber-cinema__destination-grid h3 { margin: 1.4rem 0 1rem; }
.rubber-cinema__destination-grid article > p:not(.rubber-cinema__eyebrow) { max-width: 48ch; min-height: 76px; color: #53624f; font-size: .88rem; }
.rubber-cinema__destination-grid .rubber-cinema__action { margin-top: 1.35rem; color: var(--cinema-cream); }
.rubber-cinema__product-links { display: flex; flex-wrap: wrap; gap: .55rem; margin-top: 1.1rem; }
.rubber-cinema__product-links a { display: inline-flex; min-height: 40px; align-items: center; padding: .4rem .75rem; border: 1px solid #83907e; border-radius: 999px; font-size: .75rem; font-weight: 700; text-decoration: none; }
.rubber-cinema__product-links a:hover { background: #d8ded0; }
.rubber-cinema__destination-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1.5rem; margin: 2rem 0; }
.rubber-cinema__destination-actions > a:last-child { display: inline-flex; min-height: 44px; align-items: center; font-size: .82rem; font-weight: 700; }
.rubber-cinema__disclosure { max-width: 72ch; color: #58664f; font-size: .7rem; }
.rubber-cinema__destinations:focus { outline-offset: -6px; }

.rubber-cinema__photo--deferred { display: none; }
.rubber-cinema.is-enhanced .rubber-cinema__photo--deferred { display: block; }
.page--home { overflow-anchor: none; }

@media (min-width:701px) and (max-width:1099px) {
  .rubber-cinema__scene-copy { width: 45%; max-width: 350px; }
  .rubber-cinema__scene h2 { font-size: 2.65rem; }
  .rubber-cinema__scene-copy > p:not(.rubber-cinema__eyebrow) { font-size: .9rem; }
}

@media (min-width:701px) and (max-width:1099px) and (min-height:700px) {
  .rubber-cinema.is-cinematic .rubber-cinema__journey { height: 850vh; }
  .rubber-cinema.is-cinematic .rubber-cinema__scene { display: block; padding: 0; }
  .rubber-cinema.is-cinematic .rubber-cinema__surface { height: 42%; }
  .rubber-cinema.is-cinematic .rubber-cinema__stage::after { background: linear-gradient(0deg,#0e1d17 55%,transparent 64%); }
  .rubber-cinema.is-cinematic .rubber-cinema__scene-image { inset: 0 0 auto; height: 42%; }
  .rubber-cinema.is-cinematic .rubber-cinema__scene-image::after { background: linear-gradient(0deg,#0e1d17,transparent 25%); }
  .rubber-cinema.is-cinematic .rubber-cinema__scene-copy { position: absolute; top: 45%; left: 5%; width: 90%; max-width: none; }
  .rubber-cinema.is-cinematic .rubber-cinema__scene h2 { max-width: 22ch; font-size: 2.1rem; }
  .rubber-cinema.is-cinematic .rubber-cinema__scene-copy > .rubber-cinema__eyebrow { margin-bottom: .65rem; }
  .rubber-cinema.is-cinematic .rubber-cinema__scene-copy > p:not(.rubber-cinema__eyebrow) { max-width: 58ch; margin-top: .6rem; }
  .rubber-cinema.is-cinematic .rubber-cinema__grade-explorer { display: grid; max-width: 100%; grid-template-columns: 320px 1fr; gap: 0 1.8rem; margin-top: .7rem; }
  .rubber-cinema.is-cinematic .rubber-cinema__grade-controls { grid-row: 1/3; }
  .rubber-cinema.is-cinematic .rubber-cinema__grade-readout { min-height: 75px; padding-top: .45rem; }
  .rubber-cinema.is-cinematic .rubber-cinema__grade-links { align-content: start; margin-top: .8rem; }
  .rubber-cinema.is-cinematic .rubber-cinema__supply-path { right: 15%; bottom: 61%; left: 15%; }
  .rubber-cinema.is-cinematic .rubber-cinema__stage-footer { bottom: .7rem; }
}

@media (max-width:700px), (max-height:699px) {
  .rubber-cinema__intro { display: block; padding-block: 3rem; }
  .rubber-cinema__intro h2 { font-size: 2.8rem; }
  .rubber-cinema__intro > div:last-child { margin-top: 1.3rem; }
  .rubber-cinema__toolbar { min-height: 88px; }
  .rubber-cinema__toolbar-inner { flex-wrap: wrap; align-content: center; gap: 0; }
  .rubber-cinema__toolbar nav { width: 100%; justify-content: space-between; gap: 0; }
  .rubber-cinema__toolbar nav a { min-width: 32px; font-size: .65rem; }
  .rubber-cinema__toolbar button { min-width: 0; margin: 0 auto 0 0; font-size: .66rem; }
  .rubber-cinema__toolbar [data-cinema-view-mode] { max-width: none; margin-left: auto; font-size: .6rem; }
  .rubber-cinema__scene { display: flex; min-height: 0; flex-direction: column; align-items: stretch; gap: 1.5rem; padding: 0 0 3rem; overflow: visible; border-bottom: 1px solid #66845d33; }
  .rubber-cinema__scene-image { position: relative; inset: auto; width: 100%; aspect-ratio: 3/4; overflow: hidden; }
  .rubber-cinema__photo img { aspect-ratio: 3/4; object-fit: cover; }
  .rubber-cinema__scene-image::after { display: none; }
  .rubber-cinema__scene-copy { width: 100%; max-width: 100%; padding: 0 7vw; }
  .rubber-cinema__scene h2 { max-width: 13ch; font-size: 2.8rem; }
  .rubber-cinema__scene-copy > .rubber-cinema__eyebrow { margin-bottom: 1rem; }
  .rubber-cinema__scene-copy > p:not(.rubber-cinema__eyebrow) { margin-top: 1rem; }
  .rubber-cinema__grade-explorer { max-width: 100%; }
  .rubber-cinema__destination-grid { grid-template-columns: 1fr; gap: 1rem; }
  .rubber-cinema__destination-grid article > p:not(.rubber-cinema__eyebrow) { min-height: 0; }
}

@media (min-width:701px) and (max-height:699px) {
  .rubber-cinema__scene { min-height: 580px; flex-direction: row; align-items: center; padding: 3rem 6vw; }
  .rubber-cinema__scene-image { position: absolute; inset: 0; aspect-ratio: auto; }
  .rubber-cinema__photo img { aspect-ratio: 16/9; object-fit: contain; object-position: right center; background: var(--cinema-deep); }
  .rubber-cinema__scene-image::after { display: block; }
  .rubber-cinema__scene-copy { width: 40%; max-width: 450px; padding: 0; }
  .rubber-cinema__toolbar { min-height: 62px; }
  .rubber-cinema__toolbar-inner { flex-wrap: nowrap; }
  .rubber-cinema__toolbar nav { width: auto; }
}

@media (prefers-reduced-motion:reduce) {
  .rubber-cinema *, .rubber-cinema *::before, .rubber-cinema *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
  .rubber-cinema__surface, .rubber-cinema__mobile-surface, .rubber-cinema__supply-path { display: none !important; }
}
