/* "Cinematic reel" theme (2026-10-08, owner reference: runway.com / awesome-design-md runwayml).
   Black canvas, full-bleed video as the interface, one geometric sans (DM Sans stands in for abcNormal),
   zero shadows, 4 to 8px radii, cool-slate secondary text, uppercase tracked labels at weight 450.
   Colour comes from footage; UNCODE cyan marks live dots, focus and the logo bracket only.
   Everything is scoped to html.t-runway and loaded last. It supersedes theme-deck.css (t-deck). */

html.t-runway{
  --rw-font: "DM Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --rw-black:#fff; --rw-deep:#f6f7f9; --rw-surface:#f6f7f9; --rw-card:#eef0f3; --rw-raise:#e9ecf2;
  --rw-line:#dfe3e8; --rw-line-soft:#eceff2;
  --rw-white:#000; --rw-text:#1c1f23; --rw-slate:#4d5560; --rw-mid:#5f6772; --rw-dim:#767d88;
  --rw-cyan:#29B5E8;
  --rw-r:6px; --rw-r-lg:10px;
  --rw-max:1600px; --rw-gut:clamp(18px,4vw,56px);

  /* remap the site's own tokens so every existing component follows */
  --fg:var(--rw-white); --fg-soft:var(--rw-slate); --fg-faint:var(--rw-mid);
  --rule:var(--rw-line); --shade:var(--rw-black);
  --pill-bg:var(--rw-white); --pill-fg:var(--rw-black); --brand:var(--rw-cyan);
  --accent:var(--rw-white); --accent-bright:var(--rw-cyan);
  --paper:var(--rw-surface); --vellum:var(--rw-black); --frost:var(--rw-line); --cloud:var(--rw-line);
  --slate-900:var(--rw-white); --slate-700:var(--rw-text); --slate-600:var(--rw-slate);
  color-scheme:light;
}
/* dark contexts: video heroes, header, home film panels, close band, footer keep the cinematic black palette */
html.t-runway .pghero, html.t-runway .panels, html.t-runway .stage, html.t-runway .foot, html.t-runway .site-foot,
html.t-runway .b-close, html.t-runway .deck-tile, html.t-runway .rw-dark{
  --rw-black:#000; --rw-deep:#030303; --rw-surface:#0c0c0d; --rw-card:#141415; --rw-raise:#1a1a1a;
  --rw-line:#27272a; --rw-line-soft:#1d1d20; --rw-white:#fff; --rw-text:#e9ecf2; --rw-slate:#a3aab5; --rw-mid:#8a919c; --rw-dim:#767d88;
  --fg:#fff; --fg-soft:#a3aab5; --fg-faint:#8a919c; --rule:#27272a; --shade:#000; --pill-bg:#fff; --pill-fg:#000;
  --paper:#0c0c0d; --vellum:#000; --frost:#27272a; --cloud:#27272a; --slate-900:#fff; --slate-700:#e9ecf2; --slate-600:#a3aab5;
  color-scheme:dark; color:#fff;
}


/* ---------- canvas and type ---------- */
html.t-runway, html.t-runway body{ background:var(--rw-black); color:var(--rw-white); }
html.t-runway body{ font-family:var(--rw-font); font-weight:400; letter-spacing:-.01em; -webkit-font-smoothing:antialiased; }
html.t-runway body *:not(code):not(pre){ font-family:inherit; }
html.t-runway .below, html.t-runway main:not(.panels), html.t-runway section.pinsc > .pinsc-pin{ background:var(--rw-black); color:var(--rw-white); }
html.t-runway section.pinsc:nth-of-type(even) > .pinsc-pin{ background:var(--rw-deep); }
html.t-runway .b-close{ background:#000; }
html.t-runway section.pinsc{ border-top:1px solid var(--rw-line-soft); }
html.t-runway ::selection{ background:var(--rw-white); color:var(--rw-black); }

html.t-runway h1, html.t-runway .pghero h1, html.t-runway .panel h1, html.t-runway .panel h2,
html.t-runway .b-title, html.t-runway .story-title, html.t-runway h2{
  font-weight:400; letter-spacing:-.045em; line-height:1; text-shadow:none; color:var(--rw-white);
}
html.t-runway h3, html.t-runway h4, html.t-runway .hw-t{ font-weight:400; letter-spacing:-.02em; line-height:1.1; color:var(--rw-white); }
html.t-runway p, html.t-runway li{ color:inherit; }
html.t-runway .b-lede, html.t-runway .pghero-sub, html.t-runway .sub, html.t-runway .lede{ color:var(--rw-slate); font-weight:400; text-shadow:none; line-height:1.45; }
html.t-runway strong, html.t-runway b{ font-weight:600; }
html.t-runway a{ color:inherit; }

/* labels: uppercase, tracked, weight 450, no outline box */
html.t-runway .b-kicker, html.t-runway .pghero-kicker, html.t-runway .eyebrow, html.t-runway .story-head .b-kicker,
html.t-runway .mega-label, html.t-runway .hw-steps-h, html.t-runway .vk, html.t-runway .pane-h, html.t-runway .dt-bar, html.t-runway .dt-foot{
  font-size:12px; font-weight:450; letter-spacing:.14em; text-transform:uppercase; line-height:1.4;
  color:var(--rw-mid); background:none; border:0; padding:0; border-radius:0; text-shadow:none; display:inline-flex; width:auto; max-width:100%;
}
html.t-runway .b-kicker a, html.t-runway .pghero-kicker a{ color:inherit; text-decoration:none; }
html.t-runway .story-rail li{ font-size:12px; font-weight:450; text-transform:uppercase; letter-spacing:.14em; }

/* ---------- buttons: white fill on black, small radius, uppercase ---------- */
html.t-runway .pill, html.t-runway a.pill, html.t-runway button.pill{
  height:48px; padding:0 22px; border-radius:var(--rw-r); border:1px solid var(--rw-white);
  background:var(--rw-white); color:var(--rw-black); -webkit-text-fill-color:var(--rw-black);
  font-size:13px; font-weight:500; letter-spacing:.08em; text-transform:uppercase; box-shadow:none;
  transition:background-color .2s ease, color .2s ease, border-color .2s ease;
}
html.t-runway .pill::after{ content:"\2192"; margin-left:10px; font-weight:400; }
html.t-runway .pill:hover, html.t-runway .pill:focus-visible{ background:var(--rw-text); border-color:var(--rw-text); color:var(--rw-black); -webkit-text-fill-color:var(--rw-black); }
html.t-runway .pill.is-ghost, html.t-runway .pill.is-quiet{
  background:transparent; color:var(--rw-white); -webkit-text-fill-color:var(--rw-white); border-color:rgba(255,255,255,.35);
}
html.t-runway .pill.is-ghost:hover, html.t-runway .pill.is-quiet:hover,
html.t-runway .pill.is-ghost:focus-visible, html.t-runway .pill.is-quiet:focus-visible{
  background:var(--rw-white); color:var(--rw-black); -webkit-text-fill-color:var(--rw-black); border-color:var(--rw-white);
}
html.t-runway .pill.is-light{ background:var(--rw-white); color:var(--rw-black); -webkit-text-fill-color:var(--rw-black); }
html.t-runway :focus-visible{ outline:2px solid var(--rw-cyan); outline-offset:3px; }
html.t-runway .go, html.t-runway .hw-l{ color:var(--rw-white); font-weight:450; text-decoration:none; border-bottom:1px solid var(--rw-line); letter-spacing:.01em; }
html.t-runway .go:hover, html.t-runway .hw-l:hover{ border-bottom-color:var(--rw-white); }

/* ---------- header and nav ---------- */
html.t-runway .chrome, html.t-runway .chrome.on-white{
  background:rgba(0,0,0,.55); border-bottom:1px solid rgba(255,255,255,.08); box-shadow:none; color:var(--rw-white);
  -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
}
html.t-runway .chrome.is-stuck{ background:rgba(0,0,0,.86); border-bottom-color:var(--rw-line); }
html.t-runway .nav a:not(.pill), html.t-runway .nav .menu > li > a, html.t-runway .nav .sub a:not(.pill){
  font-size:12.5px; font-weight:450; letter-spacing:.12em; text-transform:uppercase; color:var(--rw-text); opacity:1;
}
html.t-runway .nav a:not(.pill):hover{ color:var(--rw-white); text-decoration-color:var(--rw-white); }
html.t-runway .nav a[aria-current="page"], html.t-runway .nav a[aria-current="true"]{ color:var(--rw-white); text-decoration-color:var(--rw-white); }
html.t-runway .chrome .nav > .pill{ background:var(--rw-white); height:40px; padding:0 18px; font-weight:500; }
html.t-runway .chrome .nav > .pill::after{ content:none; }
html.t-runway .nav .sub{ background:var(--rw-surface); border:1px solid var(--rw-line); border-radius:var(--rw-r); box-shadow:none; }
html.t-runway .mega{ background:var(--rw-black) !important; border:1px solid var(--rw-line) !important; border-radius:0 0 var(--rw-r-lg) var(--rw-r-lg); box-shadow:none !important; color:var(--rw-white); }
html.t-runway .mega-head, html.t-runway .nav .mega a.mega-head{ font-weight:400; letter-spacing:-.03em; color:var(--rw-white); }
html.t-runway .mega-item b{ font-weight:450; color:var(--rw-white); }
html.t-runway .mega-item span{ color:var(--rw-slate); }
html.t-runway .nav .mega a.mega-item:hover b{ text-decoration:underline; text-decoration-color:var(--rw-white); }
html.t-runway .mega-demo{ background:var(--rw-surface); border:1px solid var(--rw-line); border-radius:var(--rw-r); }
html.t-runway .mega-steps::before{ background:var(--rw-line); }
html.t-runway .mega-steps li{ color:var(--rw-mid); }
html.t-runway .mega-steps li::before{ background:var(--rw-black); border-color:var(--rw-dim); }
html.t-runway .mega-steps li.is-done{ color:var(--rw-slate); }
html.t-runway .mega-steps li.is-on{ color:var(--rw-white); }
html.t-runway .menu-btn{ border-radius:var(--rw-r); color:var(--rw-white); border:1px solid rgba(255,255,255,.3); text-transform:uppercase; letter-spacing:.12em; font-weight:450; }
@media (max-width:860px){
  html.t-runway .nav .menu{ background:var(--rw-black); border-top:1px solid var(--rw-line); }
}
/* logo: white wordmark (swapped in the markup), cyan brackets */
html.t-runway .lockup span{ color:var(--rw-mid); }
html.t-runway .lockup::before, html.t-runway .lockup::after{ border-color:var(--rw-cyan); }
html.t-runway .lockup, html.t-runway .foot .lockup, html.t-runway .site-foot .lockup{ color:var(--rw-white); }
html.t-runway .foot .lockup span, html.t-runway .site-foot .lockup span{ color:var(--rw-mid); }

/* ---------- flat surfaces: no washes, no shadows ---------- */
html.t-runway .pinsc-pin::before, html.t-runway .story-bg, html.t-runway .chat-bg, html.t-runway .blob,
html.t-runway .lt-wash, html.t-runway .lt-bloom{ display:none !important; }
html.t-runway *{ box-shadow:none !important; text-shadow:none; }
html.t-runway .ui, html.t-runway .vis, html.t-runway .pane, html.t-runway .chat-glass, html.t-runway .ct2-card,
html.t-runway .story-vis .vis, html.t-runway [class*="-panel"]:not(section){
  background:var(--rw-surface) !important; color:var(--rw-white); border:1px solid var(--rw-line) !important; border-radius:var(--rw-r-lg) !important;
  -webkit-backdrop-filter:none !important; backdrop-filter:none !important;
}
html.t-runway .st.ok{ color:var(--rw-white); border-color:var(--rw-white); background:transparent; }
html.t-runway .st.mid, html.t-runway .st.hold{ color:var(--rw-cyan); border-color:var(--rw-cyan); background:transparent; }
html.t-runway .ag a{ background:var(--rw-surface); border:1px solid var(--rw-line); border-radius:var(--rw-r-lg); color:var(--rw-white); }
html.t-runway .ag img{ filter:grayscale(1) contrast(1.05); border-radius:var(--rw-r); }
html.t-runway .chips a{ border-radius:var(--rw-r); text-transform:uppercase; font-size:11.5px; letter-spacing:.12em; font-weight:450; border:1px solid rgba(255,255,255,.28); color:var(--rw-white); background:transparent; }
html.t-runway .chips a:hover{ background:var(--rw-white); color:var(--rw-black); }
html.t-runway hr{ border-color:var(--rw-line); }

/* FAQ */
html.t-runway .faqh-item{ background:transparent; border:0; border-top:1px solid var(--rw-line); border-radius:0; padding:20px 0; margin:0; }
html.t-runway .faqh-item:last-child{ border-bottom:1px solid var(--rw-line); }
html.t-runway .faqh-item summary{ font-weight:400; font-size:clamp(18px,1.6vw,24px); letter-spacing:-.025em; color:var(--rw-white); }
html.t-runway .faqh-item p, html.t-runway .faqh-item div{ color:var(--rw-slate); }

/* rotating word in the Build headline stays white */
html.t-runway .hw-col, html.t-runway .hw-col span{ color:var(--rw-white) !important; -webkit-text-fill-color:var(--rw-white) !important; background:none !important; }

/* ---------- full-bleed video hero (inner pages) ----------
   Script (assets/runway.js) injects <video class="rw-bg"> as the first child of .pghero and sets poster, sources and lazy play.
   Hero text sits bottom-left over a darkening scrim, the page's product tile (if any) bottom-right. */
html.t-runway .pghero{ position:relative; margin-top:calc(-1 * var(--hdr,90px)); min-height:min(100svh,1000px); display:flex; align-items:flex-end; justify-content:flex-start; overflow:hidden; background:var(--rw-black); isolation:isolate; }
html.t-runway .pghero-img, html.t-runway .rw-bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:var(--pos,50% 50%); z-index:-3; background:var(--rw-black); }
html.t-runway .pghero-img{ filter:saturate(.8) brightness(.62); }
html.t-runway .rw-bg{ opacity:0; transition:opacity .9s ease; }
html.t-runway .rw-bg.is-on{ opacity:1; }
html.t-runway .rw-bg-poster{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-4; }
html.t-runway .pghero-veil{ position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:linear-gradient(0deg, #000 0%, rgba(0,0,0,.72) 24%, rgba(0,0,0,.18) 58%, rgba(0,0,0,.42) 100%),
             linear-gradient(90deg, rgba(0,0,0,.66) 0%, rgba(0,0,0,0) 62%) !important; }
html.t-runway .pghero-in{ width:100%; max-width:var(--rw-max); margin:0 auto; box-sizing:border-box; padding:calc(var(--hdr,90px) + 40px) var(--rw-gut) clamp(40px,7vh,84px);
  display:flex; flex-direction:column; align-items:flex-start; text-align:left; }
html.t-runway .pghero-kicker{ margin:0 0 clamp(16px,2vw,24px); }
html.t-runway .pghero h1, html.t-runway .pghero h1.one-line{ max-width:12ch; font-size:clamp(44px,min(8.2vw,15vh),148px); line-height:.94; letter-spacing:-.05em; text-wrap:balance; white-space:normal; }
html.t-runway .pghero.is-left h1{ max-width:14ch; font-size:clamp(44px,min(7vw,13vh),128px); }
html.t-runway .pghero-sub{ margin:clamp(18px,2vw,28px) 0 0; max-width:min(46ch,100%); font-size:clamp(16px,1.3vw,20px); color:var(--rw-text); text-wrap:pretty; }
html.t-runway .pghero-cta{ display:flex; flex-wrap:wrap; gap:12px; justify-content:flex-start; margin-top:clamp(22px,3.4vh,36px); }

/* split hero with product tile: the tile floats bottom-right as a dark pane over the film */
html.t-runway .deck-split{ display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); align-items:end; gap:clamp(24px,4vw,64px); max-width:none; padding:0; min-height:min(100svh,1000px); }
html.t-runway .deck-split .pghero-img, html.t-runway .deck-split .pghero-veil{ display:block; }
html.t-runway .deck-split .pghero-in{ grid-column:1; grid-row:1; max-width:none; margin:0; padding-right:0; padding-left:max(var(--rw-gut), calc((100vw - var(--rw-max)) / 2 + var(--rw-gut))); }
html.t-runway .deck-split h1, html.t-runway .deck-split h1.one-line{ font-size:clamp(44px,min(6.4vw,13vh),120px); max-width:11ch; }
html.t-runway .deck-split .pghero-sub{ font-size:clamp(16px,1.25vw,19px); max-width:44ch; }
html.t-runway .deck-tile{ grid-column:2; grid-row:1; align-self:end; margin:0 max(var(--rw-gut), calc((100vw - var(--rw-max)) / 2 + var(--rw-gut))) clamp(40px,7vh,84px) 0; min-width:0;
  background:rgba(8,8,9,.72); border:1px solid rgba(255,255,255,.14); border-radius:var(--rw-r-lg); padding:14px;
  -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); }
html.t-runway .dt-bar, html.t-runway .dt-foot{ display:flex; justify-content:space-between; align-items:center; gap:12px; padding:4px 4px 12px; }
html.t-runway .dt-foot{ padding:12px 4px 2px; }
html.t-runway .dt-live{ padding:2px 10px; border:1px solid rgba(255,255,255,.4); border-radius:var(--rw-r); color:var(--rw-white); white-space:nowrap; }
html.t-runway .dt-carbon{ position:relative; background:rgba(0,0,0,.7); color:#fff; border:1px solid var(--rw-line); border-radius:var(--rw-r); padding:20px 22px; display:grid; gap:16px; }
html.t-runway .dt-carbon.has-line::before, html.t-runway .dt-carbon:has(> .dt-row)::before{ content:""; position:absolute; left:29px; top:28px; bottom:28px; width:1px; background:rgba(255,255,255,.16); }
html.t-runway .dt-row{ position:relative; display:grid; grid-template-columns:16px 1fr auto; gap:16px; align-items:start; color:#fff; }
html.t-runway .dt-row b{ display:block; font-size:15px; font-weight:450; }
html.t-runway .dt-row small{ display:block; margin-top:2px; font-size:13px; color:var(--rw-slate); }
html.t-runway .dt-row em{ font-style:normal; font-size:11.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--rw-slate); white-space:nowrap; }
html.t-runway .dt-node{ width:15px; height:15px; margin-top:3px; border-radius:50%; border:2px solid var(--rw-cyan); background:#000; box-sizing:border-box; }
html.t-runway .dt-row.is-gate .dt-node{ background:var(--rw-cyan); }
html.t-runway .dt-row.is-gate small, html.t-runway .dt-row.is-gate em{ color:#fff; }
html.t-runway .dt-kv{ display:grid; grid-template-columns:1fr auto; gap:10px 16px; margin:0; font-size:14px; }
html.t-runway .dt-kv dt{ color:var(--rw-slate); } html.t-runway .dt-kv dd{ margin:0; color:#fff; text-align:right; }
html.t-runway .dt-meter{ height:4px; border-radius:2px; background:rgba(255,255,255,.14); overflow:hidden; }
html.t-runway .dt-meter i{ display:block; height:100%; width:var(--v,50%); background:var(--rw-white); }
@media (max-width:900px){
  html.t-runway .deck-split{ grid-template-columns:1fr; align-items:end; }
  html.t-runway .deck-split .pghero-in{ padding-left:var(--rw-gut); padding-right:var(--rw-gut); padding-bottom:20px; }
  html.t-runway .deck-tile{ grid-column:1; grid-row:2; margin:0 var(--rw-gut) 36px; }
}

/* ---------- home: the scroll film runs full-bleed, darkened, copy bottom-left ---------- */
html.t-runway .stage{ background:var(--rw-black); }
html.t-runway .stage video{ filter:brightness(.58) saturate(.72) contrast(1.06); }
html.t-runway .veil{ background:linear-gradient(0deg, rgba(0,0,0,.82) 0%, rgba(0,0,0,.1) 46%, rgba(0,0,0,.45) 100%), linear-gradient(90deg, rgba(0,0,0,.6) 0%, rgba(0,0,0,0) 64%) !important; }
html.t-runway .grain{ opacity:.06; }
html.t-runway .panel{ color:var(--rw-white); }
html.t-runway .panel h1, html.t-runway .panel h2{ color:var(--rw-white); }
html.t-runway .panel .sub::before{ display:none; }
html.t-runway .panel .sub{ color:var(--rw-text); text-shadow:none; font-weight:400; }
html.t-runway .foot{ color:var(--rw-slate); }
@media (min-width:1024px){
  html.t-runway{ --col-l:max(var(--rw-gut), calc((100vw - var(--rw-max)) / 2 + var(--rw-gut))); }
  html.t-runway .panel{ align-items:flex-start; justify-content:flex-end; text-align:left; padding-left:var(--col-l); padding-right:calc(var(--col-l) + 18vw); padding-bottom:max(120px, 15vh); }
  html.t-runway .panel h1, html.t-runway .panel h2{ font-size:clamp(44px, min(7.6vw, 14vh), 132px); max-width:11ch; line-height:.94; text-wrap:balance; }
  html.t-runway .panel h1 br, html.t-runway .panel h2 br{ display:none; }
  html.t-runway .panel h2.is-long{ font-size:clamp(34px, min(5vw, 9vh), 88px); max-width:17ch; }
  html.t-runway .panel .sub, html.t-runway .panel .sub.is-long{ max-width:50ch; font-size:clamp(16px,1.25vw,19px); }
  html.t-runway .panel .eyebrow, html.t-runway .panel .chips, html.t-runway .panel .cta{ justify-content:flex-start; }
  html.t-runway .foot{ justify-content:flex-start; padding-left:var(--col-l); }
  html.t-runway .hud{ display:none; }
}

/* ---------- close band, footer ---------- */
html.t-runway .b-close > .pinsc-pin{ background:var(--rw-black) !important; }
html.t-runway .b-close .b-title{ font-size:clamp(40px,6.4vw,112px); letter-spacing:-.05em; line-height:.95; }
html.t-runway .site-foot, html.t-runway .foot.site-foot{ background:var(--rw-black) !important; color:var(--rw-slate) !important; border-top:1px solid var(--rw-line); }
html.t-runway .site-foot h2, html.t-runway .site-foot .foot-h{ font-size:12px; font-weight:450; letter-spacing:.14em; text-transform:uppercase; color:var(--rw-mid) !important; }
html.t-runway .site-foot a:hover, html.t-runway .site-foot a:focus-visible{ color:var(--rw-white) !important; }
html.t-runway .foot-legal, html.t-runway .site-foot .foot-legal{ color:var(--rw-dim) !important; border-top-color:var(--rw-line) !important; }

/* ---------- scroll reveal (runway.js adds .rw-in once) ---------- */
html.t-runway.rw-js .rw-rev{ opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s cubic-bezier(.22,.61,.36,1); }
html.t-runway.rw-js .rw-rev.rw-in{ opacity:1; transform:none; }

/* ---------- phones ---------- */
@media (max-width:720px){
  html.t-runway .pill{ height:46px; padding:0 18px; font-size:12px; }
  html.t-runway .chrome .nav > .pill{ height:38px; padding:0 12px; font-size:11px; }
  html.t-runway .menu-btn{ min-height:38px; padding:0 12px; font-size:11px; }
  html.t-runway .pghero{ min-height:92svh; }
  html.t-runway .pghero h1, html.t-runway .deck-split h1{ font-size:clamp(40px,12.5vw,64px); max-width:10ch; }
}
@media (prefers-reduced-motion:reduce){
  html.t-runway .pill, html.t-runway .rw-bg{ transition:none; }
  html.t-runway.rw-js .rw-rev{ opacity:1; transform:none; transition:none; }
}

/* a page with a hero clip drops its old still; the poster img stands in until the video plays */
html.t-runway .pghero[data-rw] .pghero-img{ display:none; }
html.t-runway .pghero .pghero-in{ position:relative; z-index:1; }

/* phones: heavier scrim so the headline holds contrast over bright footage */
@media (max-width:720px){
  html.t-runway .pghero-veil{ background:linear-gradient(0deg,#000 0%,rgba(0,0,0,.82) 38%,rgba(0,0,0,.5) 70%,rgba(0,0,0,.55) 100%) !important; }
}

/* phones: 44px touch targets in the header */
@media (max-width:720px){
  html.t-runway .chrome .nav > .pill, html.t-runway .menu-btn{ min-height:44px; height:44px; }
}


/* =====================================================================
   v2 layout (2026-10-08, matches runway.com): light header, inset rounded hero card, one container,
   sentence-case type, dark-fill + grey-fill buttons. Later rules win over the v1 rules above.
   ===================================================================== */
html.t-runway{ --rw-gut:clamp(20px,4.2vw,56px); --rw-wrap:1280px; --rw-rad:16px; --rw-btn:#1f1f1f; --rw-btn2:#eef0f3; }

/* type: one family, sentence case, restrained scale */
html.t-runway body{ font-size:17px; line-height:1.5; letter-spacing:-.011em; }
html.t-runway h1, html.t-runway .pghero h1, html.t-runway .panel h1{ font-weight:450; letter-spacing:-.035em; line-height:1.04; }
html.t-runway h2, html.t-runway .b-title, html.t-runway .story-title, html.t-runway .panel h2{ font-weight:450; letter-spacing:-.03em; line-height:1.08; font-size:clamp(28px,3.4vw,52px); }
html.t-runway h3{ font-weight:500; letter-spacing:-.02em; font-size:clamp(19px,1.6vw,24px); }
html.t-runway .b-kicker, html.t-runway .pghero-kicker, html.t-runway .eyebrow, html.t-runway .mega-label, html.t-runway .hw-steps-h, html.t-runway .vk, html.t-runway .pane-h, html.t-runway .dt-bar, html.t-runway .dt-foot, html.t-runway .story-rail li, html.t-runway .chips a, html.t-runway .dt-row em{
  text-transform:none; letter-spacing:-.005em; font-size:15px; font-weight:500; }
html.t-runway .b-lede, html.t-runway .pghero-sub, html.t-runway .sub{ font-size:clamp(17px,1.4vw,20px); line-height:1.5; }

/* buttons: dark fill + grey fill, 8px, sentence case (runway.com) */
html.t-runway .pill, html.t-runway a.pill, html.t-runway button.pill{
  height:46px; padding:0 20px; border-radius:8px; border:0; font-size:16px; font-weight:500; letter-spacing:-.01em; text-transform:none;
  background:var(--rw-btn); color:#fff; -webkit-text-fill-color:#fff; }
html.t-runway .pill::after{ content:none; }
html.t-runway .pill:hover, html.t-runway .pill:focus-visible{ background:#000; color:#fff; -webkit-text-fill-color:#fff; }
html.t-runway .pill.is-ghost, html.t-runway .pill.is-quiet{ background:var(--rw-btn2); color:#0c0c0c; -webkit-text-fill-color:#0c0c0c; border:0; }
html.t-runway .pill.is-ghost:hover, html.t-runway .pill.is-quiet:hover{ background:#e1e4ea; color:#000; -webkit-text-fill-color:#000; }
/* on dark contexts: white fill + translucent fill */
html.t-runway .pghero .pill, html.t-runway .b-close .pill, html.t-runway .panels .pill{ background:#fff; color:#000; -webkit-text-fill-color:#000; }
html.t-runway .pghero .pill:hover, html.t-runway .b-close .pill:hover, html.t-runway .panels .pill:hover{ background:#e9ecf2; }
html.t-runway .pghero .pill.is-ghost, html.t-runway .b-close .pill.is-ghost, html.t-runway .panels .pill.is-ghost{ background:rgba(255,255,255,.16); color:#fff; -webkit-text-fill-color:#fff; }
html.t-runway .pghero .pill.is-ghost:hover, html.t-runway .b-close .pill.is-ghost:hover{ background:rgba(255,255,255,.28); }
html.t-runway .chips a{ border-radius:8px; border:0; background:var(--rw-btn2); color:#0c0c0c; }
html.t-runway .chips a:hover{ background:#e1e4ea; color:#000; }
html.t-runway .panels .chips a{ background:rgba(255,255,255,.16); color:#fff; }

/* header: white bar, dark wordmark, plain nav (runway.com) */
html.t-runway .chrome, html.t-runway .chrome.on-white, html.t-runway .chrome.is-stuck{
  background:rgba(255,255,255,.94); color:#0c0c0c; border-bottom:1px solid #eceff2; -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); }
html.t-runway .nav a:not(.pill), html.t-runway .nav .menu > li > a, html.t-runway .nav .sub a:not(.pill){
  text-transform:none; letter-spacing:-.01em; font-size:16px; font-weight:500; color:#0c0c0c; }
html.t-runway .nav a:not(.pill):hover{ color:#000; text-decoration-color:#000; }
html.t-runway .chrome .nav > .pill{ background:var(--rw-btn); color:#fff; -webkit-text-fill-color:#fff; height:40px; padding:0 16px; }
html.t-runway .menu-btn{ text-transform:none; letter-spacing:-.01em; font-size:15px; font-weight:500; color:#0c0c0c; border:0; background:var(--rw-btn2); }
html.t-runway .lockup span{ color:#5f6772; }
html.t-runway .nav .sub{ background:#fff; border:1px solid #eceff2; }
html.t-runway .mega{ background:#fff !important; border:0 !important; border-bottom:1px solid #eceff2 !important; border-radius:0 0 var(--rw-rad) var(--rw-rad); color:#0c0c0c; }
html.t-runway .mega-demo{ background:#f6f7f9; border:0; border-radius:12px; }
@media (max-width:860px){ html.t-runway .nav .menu{ background:#fff; border-top:1px solid #eceff2; } }

/* one container: every section's content sits inside equal side padding */
html.t-runway .pinsc-pin, html.t-runway .b-wrap, html.t-runway .wrap{ padding-left:max(var(--rw-gut), calc((100vw - var(--rw-wrap)) / 2)); padding-right:max(var(--rw-gut), calc((100vw - var(--rw-wrap)) / 2)); box-sizing:border-box; }
html.t-runway img, html.t-runway video, html.t-runway svg{ max-width:100%; }

/* hero: inset rounded card under the header, text centred inside it */
html.t-runway .pghero{ margin:calc(var(--hdr,76px) + 12px) var(--rw-gut) 0; border-radius:var(--rw-rad); min-height:min(80svh,780px); align-items:center; justify-content:center; width:auto; }
html.t-runway .pghero-in, html.t-runway .deck-split .pghero-in{ max-width:880px; margin:0 auto; padding:56px clamp(20px,5vw,64px); align-items:center; text-align:center; }
html.t-runway .pghero-kicker{ color:rgba(255,255,255,.78); font-size:15px; }
html.t-runway .pghero h1, html.t-runway .pghero h1.one-line, html.t-runway .pghero.is-left h1, html.t-runway .deck-split h1, html.t-runway .deck-split h1.one-line{
  max-width:16ch; font-size:clamp(34px,5vw,68px); line-height:1.04; letter-spacing:-.035em; margin-left:auto; margin-right:auto; }
html.t-runway .pghero-sub, html.t-runway .deck-split .pghero-sub{ margin-left:auto; margin-right:auto; max-width:56ch; font-size:clamp(17px,1.5vw,21px); color:rgba(255,255,255,.9); }
html.t-runway .pghero-cta, html.t-runway .pghero.is-left .pghero-cta{ justify-content:center; }
html.t-runway .pghero-veil{ background:linear-gradient(0deg,rgba(0,0,0,.7) 0%,rgba(0,0,0,.48) 55%,rgba(0,0,0,.58) 100%) !important; }
html.t-runway .deck-split{ display:flex; flex-direction:column; align-items:center; justify-content:center; padding:0; gap:0; }
html.t-runway .deck-tile{ grid-column:auto; grid-row:auto; align-self:center; width:min(620px,calc(100% - 2 * var(--rw-gut))); margin:0 auto 48px; }
@media (max-width:720px){ html.t-runway .pghero{ margin-top:calc(var(--hdr,64px) + 8px); border-radius:12px; min-height:auto; } html.t-runway .pghero-in{ padding:40px 20px; } }

/* home: film runs as an inset rounded card too, copy centred over it */
@media (min-width:1024px){
  html.t-runway .panel{ align-items:center; justify-content:center; text-align:center; padding:var(--hdr,90px) calc(var(--rw-gut) + 6vw) 12vh; }
  html.t-runway .panel h1, html.t-runway .panel h2{ max-width:16ch; font-size:clamp(36px,5.4vw,84px); }
  html.t-runway .panel h2.is-long{ font-size:clamp(30px,3.8vw,60px); max-width:22ch; }
  html.t-runway .panel .sub, html.t-runway .panel .sub.is-long{ max-width:56ch; text-align:center; }
  html.t-runway .panel .eyebrow, html.t-runway .panel .chips, html.t-runway .panel .cta{ justify-content:center; }
  html.t-runway .foot{ justify-content:center; padding-left:0; }
}
html.t-runway .stage{ inset:calc(var(--hdr,76px) + 12px) var(--rw-gut) 12px; border-radius:var(--rw-rad); }
html.t-runway .stage + .panels, html.t-runway .panels{ inset:calc(var(--hdr,76px) + 12px) var(--rw-gut) 12px; border-radius:var(--rw-rad); overflow:hidden; }
html.t-runway .b-close .b-title{ font-size:clamp(34px,5vw,72px); text-align:center; }
html.t-runway .b-close .b-lede, html.t-runway .b-close .pghero-cta, html.t-runway .b-close .cta{ text-align:center; justify-content:center; margin-left:auto; margin-right:auto; }
html.t-runway .deck-split .pghero-in{ order:1; }
html.t-runway .deck-split .deck-tile{ order:2; }

/* ---------- type scale (one scale for every page, runway.com proportions) ----------
   hero 34-60 / section heading 26-40 / card heading 20-26 / lede 17-20 / body 17 / label 15 */
html.t-runway{ --t-hero:clamp(34px,4.6vw,60px); --t-h2:clamp(26px,2.8vw,40px); --t-h3:clamp(20px,1.8vw,26px); --t-lede:clamp(17px,1.35vw,20px); }
html.t-runway h1, html.t-runway .pghero h1, html.t-runway .pghero h1.one-line, html.t-runway .pghero.is-left h1, html.t-runway .deck-split h1{ font-size:var(--t-hero); }
html.t-runway h2, html.t-runway .b-title, html.t-runway .story-title, html.t-runway .b-close .b-title{ font-size:var(--t-h2); line-height:1.1; }
html.t-runway h3{ font-size:var(--t-h3); }
html.t-runway .b-lede, html.t-runway .pghero-sub, html.t-runway .sub, html.t-runway .lede{ font-size:var(--t-lede); }
html.t-runway p{ font-size:inherit; }

/* ---------- short pages: generic pinned scenes flow as normal sections, content visible ----------
   (film openers keep their own pinned mechanism). Fixes "too much scrolling" on every inner page. */
html.t-runway section.pinsc{ height:auto !important; min-height:0 !important; }
html.t-runway section.pinsc > .pinsc-pin{ position:relative !important; top:auto !important; height:auto !important; min-height:0 !important; padding-top:clamp(48px,7vw,96px); padding-bottom:clamp(48px,7vw,96px); overflow:visible; }
html.t-runway section.pinsc .pinsc-fit{ transform:none !important; height:auto !important; }
html.t-runway section.pinsc [data-in], html.t-runway section.pinsc [data-reveal]{ opacity:1 !important; transform:none !important; visibility:visible !important; }

/* ---------- v3: runway.com header and hero proportions ---------- */
@media (min-width:861px){
html.t-runway .chrome{ display:grid; grid-template-columns:1fr auto 1fr; align-items:center; column-gap:16px; padding-top:10px; padding-bottom:10px; }
html.t-runway .chrome .nav{ display:contents; }
html.t-runway .chrome .nav > .menu{ grid-column:2; justify-self:center; display:flex; gap:clamp(8px,1.6vw,22px); }
html.t-runway .chrome .nav > .pill{ grid-column:3; justify-self:end; }
html.t-runway .chrome .menu-btn{ grid-column:3; justify-self:end; }
}
html.t-runway .nav a:not(.pill), html.t-runway .nav .menu > li > a{ font-size:14px; letter-spacing:-.005em; }
html.t-runway .nav .menu > li.has-sub > a::after{ content:""; display:inline-block; width:5px; height:5px; margin:0 0 3px 7px; border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor; transform:rotate(45deg); opacity:.7; }
html.t-runway .chrome .nav > .pill{ height:34px; padding:0 14px; font-size:13px; border-radius:6px; }
/* every page hero: inset card, text bottom-left (runway.com) */
html.t-runway .pghero{ margin-left:8px; margin-right:8px; border-radius:12px; min-height:min(62svh,600px); align-items:flex-end; justify-content:flex-start; }
html.t-runway .pghero-in, html.t-runway .deck-split .pghero-in{ max-width:none; margin:0; padding:clamp(24px,3vw,44px); align-items:flex-start; text-align:left; }
html.t-runway .pghero h1, html.t-runway .pghero h1.one-line, html.t-runway .pghero.is-left h1, html.t-runway .deck-split h1{ font-size:clamp(28px,3.2vw,46px); max-width:20ch; margin-left:0; margin-right:0; letter-spacing:-.03em; }
html.t-runway .pghero-sub, html.t-runway .deck-split .pghero-sub{ margin-left:0; margin-right:0; text-align:left; font-size:clamp(15px,1.2vw,18px); }
html.t-runway .pghero-cta, html.t-runway .pghero.is-left .pghero-cta{ justify-content:flex-start; }
html.t-runway .pghero .pill{ height:36px; padding:0 14px; font-size:14px; border-radius:6px; }
html.t-runway .deck-split{ align-items:stretch; justify-content:flex-end; }
html.t-runway .deck-tile{ align-self:flex-start; margin:0 clamp(24px,3vw,44px) 28px; width:min(560px,calc(100% - 2 * clamp(24px,3vw,44px))); }
/* footer: black, small columns */
html.t-runway .site-foot{ background:#000 !important; }
html.t-runway .site-foot, html.t-runway .site-foot li, html.t-runway .site-foot p{ font-size:14px; }
html.t-runway .site-foot a{ padding:4px 0; }

/* hero pause control (added by runway.js on every page with a hero clip) */
html.t-runway .rw-pause{ position:absolute; right:16px; bottom:16px; z-index:3; width:44px; height:44px; padding:0; border:0; border-radius:8px; background:rgba(255,255,255,.18); color:#fff; cursor:pointer; display:grid; place-items:center; }
html.t-runway .rw-pause:hover{ background:rgba(255,255,255,.3); }
html.t-runway .rw-pause svg{ width:18px; height:18px; fill:currentColor; }

/* tile card under the hero */
html.t-runway .rw-tilesec{ padding:clamp(20px,3vw,40px) var(--rw-gut) 0; background:var(--rw-black); }
html.t-runway .rw-tilesec .deck-tile{ width:min(760px,100%); margin:0 auto; background:#0b0b0c; border:1px solid #1d1d20; border-radius:16px; padding:16px; -webkit-backdrop-filter:none; backdrop-filter:none; }
html.t-runway .deck-split{ min-height:min(62svh,600px); justify-content:flex-end; }

/* logo: the wordmark keeps its true 402:88 shape and spans the tagline's width (nav.css tight lockup).
   Size is set ONLY by the tagline font-size: header ~29px wordmark, phone ~25px, footer larger. Never force a height. */
html.t-runway .lockup img{ height:auto !important; aspect-ratio:402/88; }
html.t-runway .chrome .lockup span{ font-size:8.5px; letter-spacing:.04em; }
html.t-runway .chrome .lockup{ gap:3px; }
@media (max-width:720px){ html.t-runway .chrome .lockup span{ font-size:7.5px; } }
html.t-runway .site-foot .lockup span{ font-size:11px; }
html.t-runway .site-foot a.lockup{ margin:4px 0; }
@media (max-width:720px){ html.t-runway .rw-pause{ top:12px; bottom:auto; right:12px; width:40px; height:40px; } }
/* footer lockup keeps its inner space (the footer link rule above zeroes horizontal padding) */
html.t-runway .site-foot a.lockup{ padding:7px 11px 8.5px !important; }

/* hero video box: height grows with width so 16:9 clips are cropped far less (was 2.55:1 at 1440, 3.17:1 at 1920, 0.72 on phones) */
html.t-runway .pghero, html.t-runway .rwh-hero, html.t-runway .deck-split, html.t-runway .pghero.is-center{ min-height:0; height:clamp(460px, 44vw, 860px); }
@media (max-width:720px){ html.t-runway .pghero, html.t-runway .rwh-hero, html.t-runway .deck-split, html.t-runway .pghero.is-center{ height:auto; min-height:0; aspect-ratio:4/5; max-height:78svh; } }
html.t-runway .rw-bg, html.t-runway .rw-bg-poster{ object-position:50% 50%; }

/* header sits in flow on every page (sticky); the hero card starts 8px under it, no double offset */
html.t-runway .chrome{ position:sticky !important; top:0; }
html.t-runway .pghero, html.t-runway .rwh-hero{ margin-top:8px !important; }
/* skip link: hidden until keyboard focus (it showed as a thin bar at the top) */
html.t-runway .skip, html.t-runway a.skip{ position:absolute !important; left:12px; top:-60px; z-index:200; padding:10px 14px; border-radius:8px; background:#0c0c0c; color:#fff; font-size:14px; text-decoration:none; border:0; }
html.t-runway .skip:focus, html.t-runway .skip:focus-visible{ top:10px; }

/* ---------- footer: Runway-style black footer, clean link columns ---------- */
html.t-runway .site-foot{ padding:clamp(56px,7vw,96px) var(--rw-gut) 32px !important; }
html.t-runway .site-foot .wrap{ max-width:1280px; margin:0 auto; }
html.t-runway .site-foot ul{ list-style:none !important; margin:0; padding:0 !important; }
html.t-runway .site-foot li{ list-style:none !important; padding:0; margin:0; }
html.t-runway .site-foot li::marker{ content:""; }
html.t-runway .site-foot a:not(.lockup){ text-decoration:none !important; color:rgba(255,255,255,.82) !important; font-size:14px; padding:5px 0 !important; display:inline-block; }
html.t-runway .site-foot a:not(.lockup):hover, html.t-runway .site-foot a:not(.lockup):focus-visible{ color:#fff !important; text-decoration:underline !important; text-underline-offset:3px; }
html.t-runway .site-foot h2, html.t-runway .site-foot .foot-h{ margin:0 0 14px !important; font-size:11px !important; letter-spacing:.14em; }
html.t-runway .site-foot .foot-grid{ align-items:start; gap:40px clamp(24px,4vw,64px); }
html.t-runway .site-foot .foot-brand p{ max-width:36ch; font-size:14px; line-height:1.6; color:rgba(255,255,255,.62); }
html.t-runway .site-foot .foot-legal{ margin-top:clamp(40px,5vw,72px); padding-top:20px; align-items:center; }
html.t-runway .site-foot .foot-legal a{ font-size:13px !important; color:rgba(255,255,255,.6) !important; }

/* ---------- no section may bleed past the page padding ---------- */
html.t-runway main > section:not(.pghero):not(.rwh-hero):not(:has(> .rwh-wrap)):not(:has(> .wrap)){ padding-left:max(var(--rw-gut), calc((100vw - 1280px) / 2)); padding-right:max(var(--rw-gut), calc((100vw - 1280px) / 2)); box-sizing:border-box; }
html.t-runway .rp-split, html.t-runway .rp-acc, html.t-runway .rp-band, html.t-runway .rp-switch, html.t-runway .rp-flow{ max-width:1280px; margin-left:auto; margin-right:auto; }

/* owner design rule: no numbered labels on cards or steps (live-site 01..06 numerals are hidden everywhere) */
html.t-runway .gv-n{ display:none !important; }

/* logos: one treatment everywhere, the brand's own full-colour mark (owner: consistent across all pages) */
html.t-runway img:is([src*="https://uncode.com.au/wp-content/plugins/uncode-scroll/assets/logos/"],[src*="https://uncode.com.au/wp-content/plugins/uncode-scroll/assets/home/brand/"],[src*="https://uncode.com.au/wp-content/plugins/uncode-scroll/assets/home/icons/"],[src*="https://uncode.com.au/wp-content/plugins/uncode-scroll/assets/recognition/"]){ filter:none !important; opacity:1 !important; mix-blend-mode:normal !important; }
