/* ==========================================================================
   Dark theme for the asset download pages (asset/*.html).
   Hand-maintained; layered on top of the generated css/webflow-asset.css.
   Uses the site's tokens so the pages match the rest of the site in dark mode.
   Only surfaces and text change; the coral title band, buttons, gradients,
   and imagery stay as designed.
   ========================================================================== */
:root[data-theme="dark"] .wf-page { background-color: var(--bg); color: var(--text-2); }
:root[data-theme="dark"] .wf-page h1, :root[data-theme="dark"] .wf-page h2, :root[data-theme="dark"] .wf-page h3,
:root[data-theme="dark"] .wf-page h4, :root[data-theme="dark"] .wf-page h5, :root[data-theme="dark"] .wf-page h6,
:root[data-theme="dark"] .wf-page .heading, :root[data-theme="dark"] .wf-page .heading-new,
:root[data-theme="dark"] .wf-page .largetext-new, :root[data-theme="dark"] .wf-page .heading-3 { color: var(--text); }
:root[data-theme="dark"] .wf-page .section.red h1, :root[data-theme="dark"] .wf-page .section.red .heading { color: #fff; }
:root[data-theme="dark"] .wf-page a { color: var(--text); }
:root[data-theme="dark"] .wf-page a:hover { color: var(--accent); }
:root[data-theme="dark"] .wf-page .paragraph, :root[data-theme="dark"] .wf-page p { color: var(--text-2); }

/* tinted feature band (light: #f4f8fb) */
:root[data-theme="dark"] .wf-page .section-3,
:root[data-theme="dark"] .wf-page .section.m.newsletter-news,
:root[data-theme="dark"] .wf-page .section.l.newssignupmain-new { background-color: var(--bg-2); }

/* cards */
:root[data-theme="dark"] .wf-page .sidebar-card { background-color: var(--surface); color: var(--text); border: 1px solid var(--line); box-shadow: var(--shadow-lg); }
:root[data-theme="dark"] .wf-page .sidebar-card .paragraph, :root[data-theme="dark"] .wf-page .sidebar-card p { color: var(--text-2); }
:root[data-theme="dark"] .wf-page .card-item-new.light,
:root[data-theme="dark"] .wf-page .card-item-new.light.darkshadow,
:root[data-theme="dark"] .wf-page .card-chapter-new.light,
:root[data-theme="dark"] .wf-page .column.desk-8.tab-12.newscol,
:root[data-theme="dark"] .wf-page .columnnewsletterleft.desk-8.tab-12.newscol { background-color: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow-md); }
:root[data-theme="dark"] .wf-page .card-item-new.light .heading-new,
:root[data-theme="dark"] .wf-page .card-item-new.light h4 { color: var(--text); }
:root[data-theme="dark"] .wf-page .card-item-new.light p { color: var(--text-2); }

/* form fields */
:root[data-theme="dark"] .wf-page .w-input, :root[data-theme="dark"] .wf-page .w-select,
:root[data-theme="dark"] .wf-page .email-input { background-color: var(--surface-2); color: var(--text); border-color: var(--line-2); }
:root[data-theme="dark"] .wf-page .w-input::placeholder, :root[data-theme="dark"] .wf-page .email-input::placeholder { color: var(--text-4); }
:root[data-theme="dark"] .wf-page .w-input:focus, :root[data-theme="dark"] .wf-page .email-input:focus { border-color: var(--focus-accent); }
:root[data-theme="dark"] .wf-page .w-form-done, :root[data-theme="dark"] .wf-page .form-success { background-color: rgba(255, 97, 68, .14); color: var(--text); }
:root[data-theme="dark"] .wf-page .w-form-fail, :root[data-theme="dark"] .wf-page .form-error { background-color: rgba(255, 97, 68, .22); color: var(--text); }

/* imagery: soften pure-white frames around video thumbnails */
:root[data-theme="dark"] .wf-page .videoplaybutton, :root[data-theme="dark"] .wf-page .feature-1-image-new { border-color: var(--line); }

/* legal pages (terms-conditions.html, privacy-policy.html) */
:root[data-theme="dark"] .wf-page .section-2.light-blue-bg { background-color: var(--bg-2); }
:root[data-theme="dark"] .wf-page .rich-text, :root[data-theme="dark"] .wf-page .w-richtext,
:root[data-theme="dark"] .wf-page .rich-text li, :root[data-theme="dark"] .wf-page .rich-text p { color: var(--text-2); }
:root[data-theme="dark"] .wf-page .rich-text h1, :root[data-theme="dark"] .wf-page .rich-text h2, :root[data-theme="dark"] .wf-page .rich-text h3,
:root[data-theme="dark"] .wf-page .rich-text h4, :root[data-theme="dark"] .wf-page .rich-text strong { color: var(--text); }
:root[data-theme="dark"] .wf-page .rich-text a { color: var(--accent); }

/* Long legal URLs must wrap within the mobile content column. */
.wf-page .small-container { min-width: 0; max-width: 100%; }
.wf-page .rich-text { min-width: 0; overflow-wrap: anywhere; }

/* Terrain Material artwork restored from the current Webflow resource. */
.wf-page .fullback.newue5beginner.terrainmaterialea { background-image: url('/assets/wf/BackgroundMeshTerrainBanner.avif'); }
.wf-page .card-chapter-new.light.darkshadow.chapter.ue5beginner.terrainmaterialea { background-image: url('/assets/wf/SenseiTerrainMasterMaterialThumb.avif'); }

/* Forms stay in normal flow so labels and feedback cannot cover the tutorial. */
.wf-page #MainFormArea .sidebar-card { position: relative; margin-left: 0; padding: 32px; }
.wf-page #MainFormArea ._12-columns { align-items: center; }
.wf-page .terrain-features { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.wf-page .terrain-features .card-item-new { min-width: 0; }
@media (max-width: 767px) {
 .wf-page .terrain-features { grid-template-columns: minmax(0, 1fr); }
}

/* Resource pages: compact title bands and floating download cards. */
.wf-page.resource-floating-form #MainFormArea > .container { padding-block: 0; }
@media (min-width: 992px) {
 .wf-page.resource-floating-form #MainFormArea { padding-block: 40px; }
 .wf-page.resource-floating-form #MainFormArea ._12-columns { align-items: flex-start; }
 .wf-page.resource-floating-form #MainFormArea .sidebar-card { position: absolute; top: 0; left: 0; width: 100%; box-shadow: 0 12px 36px #00000018; }
 .wf-page.resource-floating-form #MainFormArea .column:last-child { position: relative; }
 .wf-page.resource-floating-form #MainFormArea + .section { min-height: 440px; padding-top: 48px; }
 .wf-page.resource-floating-form #MainFormArea + .section ._12-columns { width: 62%; }
 .wf-page.resource-floating-form #MainFormArea + .section .column { width: 100%; }
}
@media (max-width: 991px) {
 .wf-page.resource-floating-form #MainFormArea { background: linear-gradient(to bottom, var(--red) 0 240px, transparent 240px); padding-block: 32px 0; }
 .wf-page.resource-floating-form #MainFormArea ._12-columns { display: flex; flex-direction: column; align-items: stretch; }
 .wf-page.resource-floating-form #MainFormArea .column { width: 100%; }
 .wf-page.resource-floating-form #MainFormArea .sidebar-card { max-width: 480px; margin-inline: auto; box-shadow: 0 12px 36px #00000018; }
 .wf-page.resource-floating-form #MainFormArea h1 { max-width: 700px; }
 .wf-page.resource-floating-form #MainFormArea + .section { padding-top: 48px; }
}

/* Keep tutorial artwork at its original video-thumbnail proportions. */
.wf-page.resource-floating-form .card-chapter-new.light.darkshadow.chapter {
 width: 100%; height: auto; min-height: 0; max-height: none;
 aspect-ratio: 16 / 9; background-size: contain; background-repeat: no-repeat;
}
@media (min-width: 992px) {
 .wf-page.resource-floating-form #MainFormArea + .container { min-height: 440px; }
 .wf-page.resource-floating-form #MainFormArea + .container > ._12-columns { width: 62%; }
 .wf-page.resource-floating-form #MainFormArea + .container > ._12-columns > .column { width: 100%; }
 .wf-page.resource-floating-form #MainFormArea + .section .column:has(> .spacer),
 .wf-page.resource-floating-form #MainFormArea + .container .column:has(> .spacer) { display: none; }
}

/* Override the imported 300px email-field/button cap inside resource cards. */
.wf-page .resource-form, .wf-page .resource-form .email-form,
.wf-page .resource-form .email-input, .wf-page .resource-form .button {
 width: 100%; max-width: none; min-width: 0; box-sizing: border-box;
}