/* ============================================================
   superCAD landing page — theme overrides
   Loads on top of ../css/styles.css (the PowerGridTools theme).
   Same layout system, same dark navy; the accent moves from
   electric cyan to drafting amber so the two products read as
   siblings rather than copies.
   ============================================================ */

.scad {
  --cad:       #ffb454;
  --cad-2:     #ff7a59;
  --cad-rgb:   255, 180, 84;

  /* Re-point the shared accent tokens at the CAD palette. */
  --cyan:      var(--cad);
  --cyan-2:    var(--cad-2);
  --teal:      #ffd28a;
  --grad:      linear-gradient(120deg, #ffb454 0%, #ff7a59 100%);
  --shadow-glow: 0 0 0 1px rgba(var(--cad-rgb), .18), 0 20px 50px -20px rgba(var(--cad-rgb), .25);
}

/* Elements in the base sheet that hard-code the cyan rgba values. */
.scad .btn--primary { color: #2a1404; box-shadow: 0 10px 26px -10px rgba(var(--cad-rgb), .6); }
.scad .btn--primary:hover { box-shadow: 0 14px 34px -10px rgba(var(--cad-rgb), .8); }
.scad .btn--ghost:hover { background: rgba(var(--cad-rgb), .07); }
.scad .spinner { border-color: rgba(42,20,4,.3); border-top-color: #2a1404; }

.scad .hero__glow { background: radial-gradient(ellipse at center, rgba(var(--cad-rgb), .16), transparent 60%); }
.scad .eyebrow { background: rgba(var(--cad-rgb), .08); border-color: rgba(var(--cad-rgb), .25); }
.scad .eyebrow .dot { background: var(--cad); box-shadow: 0 0 10px var(--cad); }

.scad .feat__ic { background: rgba(var(--cad-rgb), .08); border-color: rgba(var(--cad-rgb), .2); }
.scad .data tbody tr:hover { background: rgba(var(--cad-rgb), .035); }
.scad .section--download { background: radial-gradient(ellipse 80% 60% at 50% 0%, rgba(var(--cad-rgb), .08), transparent 70%), var(--bg); }
.scad .dl-card--pro { border-color: rgba(var(--cad-rgb), .35); }
.scad .badge--pro { background: rgba(var(--cad-rgb), .14); color: var(--cad); border-color: rgba(var(--cad-rgb), .3); }
.scad .keyform input:focus { box-shadow: 0 0 0 3px rgba(var(--cad-rgb), .15); }
.scad .osopt:hover { background: rgba(var(--cad-rgb), .06); box-shadow: 0 14px 30px -16px rgba(var(--cad-rgb), .5); }
.scad .dl-locked__meta .pill { background: rgba(var(--cad-rgb), .12); color: var(--cad); border-color: rgba(var(--cad-rgb), .3); }
.scad .osopt--rec { border-color: rgba(var(--cad-rgb), .5); }
.scad .osopt__rec { color: var(--cad); background: rgba(var(--cad-rgb), .14); border-color: rgba(var(--cad-rgb), .3); }
.scad .toast.toast--ok { border-color: rgba(var(--cad-rgb), .5); }

/* The base "blue" tag is the sibling product's accent; keep it cyan here on
   purpose so the format table has more than one colour. */

/* ---------- Nav: link back to the product family ---------- */
.nav__family {
  display: inline-flex; align-items: center; gap: 7px;
  font-size: .88rem; font-weight: 500; color: var(--txt-dim);
  padding: 10px 14px; border-radius: 999px; border: 1px solid var(--line);
  transition: color .2s, border-color .2s;
}
.nav__family::before { content: "←"; color: var(--txt-mute); }
.nav__family:hover { color: var(--txt); border-color: var(--line-2); }

/* ---------- Hero screenshot card ---------- */
.sld-card__title { margin-left: 8px; font-family: var(--ff-mono); font-size: .72rem; color: var(--txt-mute); }

/* ---------- Format table ---------- */
.data--formats td:last-child { color: var(--txt-dim); }

/* ---------- Platform chooser: greyed-out builds ---------- */
.osopt__na {
  position: absolute; top: 8px; right: 8px;
  font-family: var(--ff-mono); font-size: .6rem; text-transform: uppercase; letter-spacing: .06em;
  color: var(--txt-mute); background: rgba(255,255,255,.04); border: 1px solid var(--line);
  padding: 2px 7px; border-radius: 5px;
}
.osopt.is-disabled { opacity: .45; cursor: not-allowed; }
.osopt.is-disabled:hover { transform: none; border-color: var(--line-2); background: var(--bg); box-shadow: none; }

@media (max-width: 920px) {
  .scad .nav.is-open .nav__cta { flex-direction: column; align-items: flex-start; gap: 10px; padding: 0 24px 16px; background: var(--bg-2); right: 0; border-bottom: 1px solid var(--line); }
}