/* Illustration scenes: one image layer, one protected reading layer.
   Screenshots, provider marks and media downloads retain their own layouts. */
.section-scene {
  --scene-bg:#070c18;
  --scene-title:#f6f8ff;
  --scene-copy:#cad7eb;
  --scene-accent:#a6caff;
  --scene-link:#d9e8ff;
  --scene-line:#5575ad;
  position:relative;
  isolation:isolate;
  overflow:hidden;
  color:var(--scene-copy);
  background:var(--scene-bg);
  border-color:var(--scene-line);
}
.section-scene,
.detail-hero.hero-with-art.section-scene,
.how-it-works .story-slider--workflow .story-panel.section-scene {
  display:block;
  min-height:clamp(520px,44vw,640px);
  padding:clamp(48px,5vw,72px) max(32px,calc((100% - 1240px) / 2));
  gap:0;
}
.section-scene::before { content:none; }
.section-scene::after {
  content:'';
  position:absolute;
  z-index:1;
  inset:0;
  border:0;
  border-radius:0;
  box-shadow:none;
  pointer-events:none;
  background:linear-gradient(90deg,#070c18 0%,#070c18f5 33%,#070c18e8 45%,#070c1870 62%,#070c1810 100%);
}
.section-scene > .hero-art,
.section-scene > .section-scene-content > .hero-art { display:none; }
.section-scene > .section-scene-art {
  position:absolute;
  z-index:0;
  inset:0 0 0 auto;
  width:76%;
  max-width:1440px;
  height:100%;
  margin:0;
  padding:0;
  border:0;
  border-radius:0;
  background:none;
  box-shadow:none;
  transform:none;
  pointer-events:none;
}
.section-scene > .section-scene-art::before,
.section-scene > .section-scene-art::after { display:none; }
/* Specificity also resets the previous shared artwork frame and its image ratio. */
.section-scene > .section-scene-art > img[src] {
  display:block;
  position:static;
  width:100%;
  max-width:none;
  height:100%;
  max-height:none;
  aspect-ratio:auto;
  object-fit:contain;
  object-position:right center;
  border:0;
  border-radius:0;
  box-shadow:none;
  filter:none;
  transform:none;
}
.section-scene > .section-scene-content,
.how-it-works .story-slider--workflow .section-scene .story-copy {
  position:relative;
  z-index:2;
  width:min(54%,640px);
  max-width:none;
  min-width:0;
  margin:0;
  padding:0;
  justify-self:start;
  color:var(--scene-copy);
  overflow-wrap:anywhere;
}
.section-scene .section-scene-content :is(h1,h2,h3) { color:var(--scene-title); }
.section-scene .section-scene-content :is(h1,h2,h3) > span { color:var(--scene-accent); -webkit-text-fill-color:currentColor; background:none; }
.section-scene .section-scene-content > p,
.section-scene .section-scene-content > small,
.section-scene .detail-section-heading p,
.section-scene .story-copy dd { color:var(--scene-copy); }
.section-scene .section-scene-content :is(.eyebrow,.home-journey-step,.breadcrumb) { color:var(--scene-accent); }
.section-scene .story-copy dt { color:#ffb476; }
.section-scene .story-copy dl > div { grid-template-columns:100px minmax(0,1fr); }
.section-scene :is(.text-link,.home-journey-link,.claw-projects a) { color:var(--scene-link); }
.section-scene :is(.button.primary:not(.hero-dark .button),.button.primary,.button.secondary,.button.outline,.button.dark,.button.light) {
  color:var(--scene-link);
  background:var(--scene-bg);
  border-color:var(--scene-line);
  box-shadow:inset 0 1px #ffffff14,0 6px 20px #0004;
  white-space:normal;
  text-align:center;
}
.section-scene :is(.button.primary:not(.hero-dark .button),.button.primary,.button.secondary,.button.outline,.button.dark,.button.light):is(:hover,:focus-visible) {
  color:var(--scene-title);
  background:var(--scene-bg);
  border-color:var(--scene-accent);
  box-shadow:0 0 24px #568df04d;
}
.section-scene :is(a,button):focus-visible { outline:3px solid var(--scene-accent); outline-offset:4px; }
.section-scene .section-scene-note,
.section-scene .story-copy .story-art-label,
.how-it-works .story-slider--workflow .section-scene .story-art-label {
  display:block;
  position:static;
  margin:20px 0 0;
  padding:0;
  border:0;
  background:none;
  color:var(--scene-copy);
  font-size:11px;
  line-height:1.65;
}
.section-scene > .scroll-cue {
  position:relative;
  z-index:2;
  inset:auto;
  transform:none;
  margin:28px 0 0;
  color:var(--scene-link);
  min-height:44px;
}
.section-scene :is(.hero-capability-tags,.platform-dock) { position:static; margin:24px 0 0; }
.section-scene .hero-capability-tags { flex-wrap:wrap; }
.section-scene .hero-capability-tags > span { color:var(--scene-copy); background:var(--scene-bg); border-color:var(--scene-line); }
.section-scene .platform-dock { grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; padding:18px 0; border:0; border-radius:0; background:none; box-shadow:none; }
.section-scene .platform-dock > * { min-height:76px; color:var(--scene-copy); }
.section-scene .platform-dock .brand-icon { width:34px; height:34px; }
/* Apple marks need a contrasting surface; keep all other official brand colors. */
.section-scene :is(.brand-macos,.brand-ios) { padding:3px; background:#edf3ff; border-radius:4px; }
.section-scene .claw-brand-row { flex-wrap:wrap; justify-content:flex-start; margin:0 0 28px; padding:0; color:var(--scene-title); }
.section-scene .claw-brand-row > span { min-height:44px; }
.section-scene .claw-brand-row .claw-rangoon { font-size:20px; }
.section-scene .claw-projects a { min-height:44px; background:var(--scene-bg); border-color:var(--scene-line); }

/* Exterior scenes span the viewport; product body scenes span their reading section. */
:is(.home-journey,.home-journey-row.section-scene,.ecosystem-hero.section-scene,.marketplace-hero.section-scene,.downloads-hero.section-scene,.detail-hero.section-scene,.claw-section.section-scene,.marketplace-teaser.section-scene,.closing-cta.section-scene) { width:100%; max-width:none; border-radius:0; }
.home-journey { padding:0; background:var(--ink); }
.home-journey-heading { width:min(1240px,calc(100% - 64px)); max-width:none; margin:0 auto; padding:72px 0 48px; }
.home-journey-heading h2 { max-width:820px; color:#f6f8ff; }
.home-journey-heading .home-journey-kicker { color:#a6caff; }
.home-journey-row.section-scene { border-color:#344f7a; }
.home-journey-row.section-scene .home-journey-copy > p:not(.home-journey-step):not(.home-journey-note) { color:var(--scene-copy); }
.home-journey-row.section-scene .home-journey-inset { position:relative; inset:auto; width:min(100%,300px); margin:30px 0 0; }
.home-journey-row.section-scene .home-journey-links a { color:var(--scene-link); background:var(--scene-bg); border-color:var(--scene-line); }
.home-journey-row.section-scene .home-journey-links .icon { color:var(--scene-accent); }
.home-journey-row.section-scene .deploy-platforms,
.home-journey-row.section-scene .deploy-platforms li { border-color:var(--scene-line); }
.home-journey-row.section-scene .deploy-platforms strong { color:var(--scene-title); }
.home-journey-row.section-scene .deploy-platforms span { color:var(--scene-copy); }

/* The whole platform team is visible. Text begins below the scene, not over faces. */
.section-scene.section-scene-team { padding:0; min-height:0; }
.section-scene-team::before { content:''; display:block; width:min(100%,1536px); aspect-ratio:3 / 2; margin:auto; }
.section-scene-team::after { display:none; }
.section-scene-team > .section-scene-art { inset:0 0 auto; width:min(100%,1536px); height:auto; aspect-ratio:3 / 2; margin:auto; }
.section-scene-team > .section-scene-art > img[src] { height:auto; }
.section-scene-team > .section-scene-art::after { content:''; display:block; position:absolute; inset:0; background:linear-gradient(0deg,var(--scene-bg),transparent 20%); }
.section-scene-team > .section-scene-content { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:18px 64px; width:min(1240px,calc(100% - 64px)); margin:0 auto; padding:28px 0 72px; }
.section-scene-team .section-scene-content > * { grid-column:1; margin:0; }
.section-scene-team .section-scene-content > .deploy-platforms { grid-column:2; grid-row:1 / span 6; align-self:start; }

/* Reading surfaces belong to the dark scene; screenshot pixels remain unchanged. */
.detail-section-illustrated.section-scene { padding:48px 32px; }
.detail-section-illustrated.section-scene .detail-cards { grid-template-columns:minmax(0,1fr); }
.detail-section-illustrated.section-scene .detail-cards article {
  --scene-title:#f1f5ff;
  color:var(--scene-copy);
  background:linear-gradient(125deg,#122039f5,#101727f5);
  border:1px solid #3f587b;
  padding:24px;
  box-shadow:0 12px 28px #0003,inset 0 1px #d5e7ff0d;
}
.detail-section-illustrated.section-scene .detail-cards article h3 { color:var(--scene-title); }
.detail-section-illustrated.section-scene .detail-cards article p { color:var(--scene-copy); }
.detail-section-illustrated.section-scene .detail-cards article .icon { color:var(--scene-accent); }
.detail-section-illustrated.section-scene .section-number { color:var(--scene-accent); }
.detail-section-illustrated.section-scene .editorial-scene { transform:none; }
.story-slider .story-panel.section-scene { background:var(--scene-bg); border:0; border-radius:0; }
.story-slider:has(.section-scene) { padding:0; }
.story-slider:has(.section-scene) > :is(.story-tabs,.story-controls) { padding:18px 24px; margin:0; }

@media (max-width:900px) {
  .section-scene,
  .detail-hero.hero-with-art.section-scene,
  .how-it-works .story-slider--workflow .story-panel.section-scene,
  .detail-section-illustrated.section-scene {
    display:block;
    min-height:0;
    padding:0;
  }
  /* The intrinsic-ratio spacer reserves the backdrop without a fixed text height. */
  .section-scene::before { content:''; display:block; position:static; width:100%; height:auto; aspect-ratio:3 / 2; background:none; }
  .section-scene::after { display:none; }
  .section-scene > .section-scene-art { position:absolute; inset:0 0 auto; width:100%; max-width:none; height:auto; aspect-ratio:3 / 2; margin:0; }
  .section-scene > .section-scene-art > img[src] { width:100%; height:auto; object-fit:contain; object-position:center; }
  .section-scene > .section-scene-art::after { content:''; display:block; position:absolute; inset:0; background:linear-gradient(0deg,var(--scene-bg),transparent 15%); }
  .section-scene > .section-scene-content,
  .section-scene-team > .section-scene-content,
  .how-it-works .story-slider--workflow .section-scene .story-copy {
    display:block;
    width:100%;
    max-width:none;
    padding:28px 32px 44px;
  }
  .section-scene > .scroll-cue { margin:0 32px 32px; }
  .section-scene.section-scene h1 { font-size:clamp(32px,7vw,48px); line-height:1.08; }
  .section-scene .section-scene-content :is(h2,h3) { font-size:clamp(29px,6vw,42px); line-height:1.1; }
  .section-scene .section-scene-content > p:not(.eyebrow):not(.home-journey-step) { font-size:15px; line-height:1.75; }
  .section-scene-team .section-scene-content > * + * { margin-top:22px; }
  .home-journey-heading { padding-block:50px 36px; }
  .detail-section-illustrated.section-scene .detail-cards article h3 { font-size:19px; }
  .detail-section-illustrated.section-scene .detail-cards article p { font-size:13px; }
}
@media (max-width:640px) {
  .section-scene > .section-scene-content,
  .section-scene-team > .section-scene-content,
  .how-it-works .story-slider--workflow .section-scene .story-copy { padding:24px 20px 40px; }
  .home-journey-heading { width:calc(100% - 40px); }
  .section-scene > .scroll-cue { margin-inline:20px; }
  .section-scene .button-row { display:grid; grid-template-columns:minmax(0,1fr); }
  .section-scene .story-copy dl > div,
  .how-it-works .story-slider--workflow .section-scene .story-copy dl > div { grid-template-columns:minmax(0,1fr); gap:4px; }
  .story-slider:has(.section-scene) > :is(.story-tabs,.story-controls) { padding-inline:16px; }
  .section-scene .detail-section-heading { grid-template-columns:minmax(0,1fr); gap:12px; }
  .section-scene .claw-brand-row { gap:10px 18px; }
}
/* Hidden panels stay hidden at every breakpoint, including without JS. */
.story-slider .story-panel.section-scene[hidden] { display:none; }
@media (forced-colors:active) {
  .section-scene { --scene-bg:Canvas; --scene-title:CanvasText; --scene-copy:CanvasText; --scene-accent:Highlight; --scene-link:LinkText; --scene-line:CanvasText; box-shadow:none; }
  .section-scene::before,.section-scene::after,.section-scene > .section-scene-art { display:none; }
  .section-scene .section-scene-content { width:100%; }
  .section-scene .section-scene-content :is(a,.breadcrumb) { color:LinkText; }
  .section-scene :is(.text-link,.home-journey-link,.breadcrumb) { text-decoration:underline; }
  .section-scene .story-copy dt { color:CanvasText; }
  .detail-section-illustrated.section-scene .detail-cards article { --scene-title:CanvasText; background:Canvas; color:CanvasText; border-color:CanvasText; box-shadow:none; }
  .detail-section-illustrated.section-scene .detail-cards article :is(h3,p) { color:CanvasText; }
  .section-scene :is(a,button):focus-visible { outline-color:Highlight; }
}