/* =========================================================================
   DesiGenetics V25 — Technical fixes + path clarity + email capture (CRO)
   Layered on top of the existing system. No brand, colour or content removal.
   Only design tokens already used by the site (#e10600 red, #050505 base).
   ========================================================================= */

/* -------------------------------------------------------------------------
   1. TECHNICAL FIX — intrinsic image size mismatch (CLS + squashed logo)
   assets/logo-header-v159.webp  = 1600 x 321  (attributes said 2508 x 627)
   assets/logo-mark-v159.webp    = 1091 x 683  (attributes said 1091 x 727)
   The wrong attributes make the browser reserve the wrong box height and
   stretch the image ~25% vertically. Pin the real ratio so every page that
   loads styles.css is correct even before the image bytes arrive.
   ------------------------------------------------------------------------- */
.nav-logo-full img,
.nav-logo img,
.footer-brand img {
  aspect-ratio: 1600 / 321;
}
.training-hero-art img,
.learn-hero-mark img,
.final-bg img {
  aspect-ratio: 1091 / 683;
}

/* -------------------------------------------------------------------------
   2. TECHNICAL FIX — mobile tap targets (measured at 375px)
   Footer + goal-card + quick-search links were well under the 44px minimum.
   ------------------------------------------------------------------------- */
@media (max-width: 780px) {
  .footer-links a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 4px 0;
  }
  .footer-links {
    gap: 2px;
  }
  .goal-copy a {
    min-height: 48px;
    display: flex;
    align-items: center;
  }
  .quick-search-v906__inner button[type="submit"],
  .quick-search-v906 button[type="submit"] {
    min-height: 48px;
  }
  .newsletter-social a,
  .newsletter-privacy a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
  }
  .dg18-support-card > a,
  .dg21-actions a,
  .dg22-actions a {
    min-height: 48px;
    display: inline-flex;
    align-items: center;
  }
}

/* -------------------------------------------------------------------------
   3. TECHNICAL FIX — the mobile hero poster had dead zones
   Two CTA overlays measured 28px / 25px tall, and the poster image itself was
   not tappable. Add a full-poster fallback link plus wider hit areas.
   ------------------------------------------------------------------------- */
@media (max-width: 780px) {
  .dg23-mobile-fulltap {
    position: absolute;
    inset: 0;
    z-index: 4;
    display: block;
    -webkit-tap-highlight-color: rgba(255, 255, 255, .06);
  }
  .dg23-mobile-hotspot-primary::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: -14px;
    height: 6px;
  }
  .dg23-mobile-hotspot-secondary::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -20px;
    height: 6px;
  }
}

/* -------------------------------------------------------------------------
   4. PATH CLARITY — one-tap Build / Cut / Move
   Whole card is tappable, the CTA reads as the destination, and a compact
   chooser sits directly under the hero so a visitor picks in one tap.
   ------------------------------------------------------------------------- */
.dg-goal-card {
  position: relative;
  transition: border-color .2s ease, transform .2s ease, background .2s ease;
}
@media (hover: hover) {
  .dg-goal-card:hover {
    border-color: #3a3a3a;
    transform: translateY(-3px);
  }
}
.dg-goal-card .dg-goal-stretch {
  position: absolute;
  inset: 0;
  z-index: 3;
  border-radius: inherit;
}
.dg-goal-card .dg-goal-stretch:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}
.dg-goal-card .goal-copy a {
  position: relative;
  z-index: 4;
  color: #fff;
}
.dg-goal-card .goal-copy a:hover {
  color: #ff4a42;
}
.dg-goal-tap {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.dg-goal-tap i {
  font-style: normal;
  color: #e10600;
  font-weight: 900;
}
/* Generic one-tap card: used by the Training hub path cards, which use a
   different class name than the homepage goal cards. */
.dg-stretch-card {
  position: relative;
  transition: border-color .2s ease, transform .2s ease;
}
@media (hover: hover) {
  .dg-stretch-card:hover {
    border-color: #3a3a3a;
    transform: translateY(-3px);
  }
}
.dg-stretch-card > .dg-goal-stretch {
  position: absolute;
  inset: 0;
  z-index: 3;
  border-radius: inherit;
}
.dg-stretch-card > .dg-goal-stretch:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}
.dg-stretch-card a:not(.dg-goal-stretch) {
  position: relative;
  z-index: 4;
}
@media (max-width: 780px) {
  .dg-stretch-card a:not(.dg-goal-stretch) {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }
}
@media (max-width: 780px) {
  .dg-goal-card .goal-copy a {
    color: #fff;
  }
  .dg-goal-card {
    border-color: #2f2f2f;
  }
}

.dg-path-chooser {
  margin: 0 0 34px;
}
.dg-path-chooser > .dg-path-chooser-label {
  display: block;
  margin: 0 0 12px;
  color: #8a8a8a;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .2em;
  text-transform: uppercase;
}
.dg-path-chooser-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.dg-path-chip {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
  min-height: 62px;
  padding: 12px 14px;
  border: 1px solid #2f2f2f;
  background: #080808;
  text-align: left;
  color: #fff;
  cursor: pointer;
  font: inherit;
  transition: border-color .18s ease, background .18s ease;
}
.dg-path-chip:hover {
  border-color: #e10600;
  background: #0d0505;
}
.dg-path-chip[aria-pressed="true"] {
  border-color: #e10600;
  background: #140303;
}
.dg-path-chip b {
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.dg-path-chip small {
  color: #8a8a8a;
  font-size: 10px;
  letter-spacing: .02em;
}
.dg-path-chip[aria-pressed="true"] small {
  color: #c9c9c9;
}
@media (max-width: 780px) {
  .dg-path-chooser-grid {
    grid-template-columns: 1fr;
  }
  .dg-path-chip {
    min-height: 56px;
  }
}

/* -------------------------------------------------------------------------
   5. EMAIL CAPTURE — coaching waitlist / starter guide
   ------------------------------------------------------------------------- */
.dg-waitlist {
  position: relative;
  border: 1px solid #2a2a2a;
  border-top: 3px solid #e10600;
  background: linear-gradient(140deg, #0b0b0b 0%, #050505 62%, #140303 100%);
  padding: clamp(26px, 4vw, 46px);
  overflow: hidden;
}
/* These bands carry the .section class, whose large padding is overridden by the
   band's own padding above (equal specificity, later file wins). Restore the
   vertical breathing room so adjacent sections do not collide. */
.section.dg-waitlist {
  margin-top: clamp(56px, 7vw, 110px);
  margin-bottom: clamp(56px, 7vw, 110px);
}
.dg-waitlist::before {
  content: "";
  position: absolute;
  inset: -30% -20% auto auto;
  width: 60%;
  height: 160%;
  background: radial-gradient(circle, rgba(225, 6, 0, .12), transparent 68%);
  pointer-events: none;
}
.dg-waitlist__inner {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(320px, .98fr);
  gap: clamp(26px, 4vw, 58px);
  align-items: center;
}
.dg-waitlist__kicker {
  display: inline-block;
  margin: 0 0 14px;
  padding: 6px 10px;
  border: 1px solid #e10600;
  background: rgba(225, 6, 0, .09);
  color: #fff;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.dg-waitlist__title {
  margin: 0 0 14px;
  font-family: Impact, "Arial Black", sans-serif;
  font-size: clamp(32px, 4.3vw, 58px);
  line-height: .92;
  letter-spacing: -.02em;
  text-transform: uppercase;
}
.dg-waitlist__title span {
  color: #e10600;
}
.dg-waitlist__lead {
  margin: 0 0 18px;
  max-width: 560px;
  color: #a4a4a4;
  font-size: 14px;
  line-height: 1.65;
}
.dg-waitlist__deliverables {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.dg-waitlist__deliverables li {
  padding: 8px 10px;
  border: 1px solid #2c2c2c;
  background: #0a0a0a;
  color: #c4c4c4;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.dg-waitlist__lead strong {
  color: #fff;
}
.dg-field--check {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  gap: 11px;
  align-items: start;
  margin-bottom: 16px;
  cursor: pointer;
}
.dg-field--check input[type="checkbox"] {
  width: 20px;
  height: 20px;
  margin: 1px 0 0;
  accent-color: #e10600;
  cursor: pointer;
}
.dg-field--check > span {
  margin: 0;
  color: #9a9a9a;
  font-size: 10.5px;
  font-weight: 600;
  line-height: 1.55;
  letter-spacing: .01em;
  text-transform: none;
}
/* Hero capture note — the hero's own link into the waitlist section. */
.dg23-hero-capture-note {
  margin: 16px 0 0;
  max-width: 620px;
  color: #8f8f8f;
  font-size: 11px;
  line-height: 1.6;
}
.dg23-hero-capture-note a {
  color: #fff;
  font-weight: 900;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.dg23-hero-capture-note a:hover {
  color: #ff4a42;
}
@media (max-width: 780px) {
  .dg23-hero-capture-note {
    font-size: 10.5px;
  }
}

.dg-waitlist__form {
  position: relative;
  border: 1px solid #303030;
  background: #070707;
  padding: clamp(18px, 2.4vw, 26px);
}
.dg-waitlist__formhead {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
  color: #7d7d7d;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.dg-waitlist__formhead b {
  color: #e10600;
}
.dg-field {
  display: block;
  margin: 0 0 12px;
}
.dg-field > span {
  display: block;
  margin-bottom: 7px;
  color: #9a9a9a;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.dg-field > span em {
  color: #666;
  font-style: normal;
  font-weight: 700;
}
.dg-field input[type="email"],
.dg-field input[type="text"],
.dg-field select {
  width: 100%;
  min-height: 52px;
  padding: 0 14px;
  border: 1px solid #3a3a3a;
  border-radius: 3px;
  background: #f7f7f7;
  color: #111;
  font: inherit;
  font-size: 16px;
}
.dg-field select {
  appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, #333 50%),
    linear-gradient(135deg, #333 50%, transparent 50%);
  background-position: calc(100% - 20px) 23px, calc(100% - 14px) 23px;
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
}
.dg-field input:focus-visible,
.dg-field select:focus-visible {
  outline: 2px solid #e10600;
  outline-offset: 1px;
}
.dg-field input[aria-invalid="true"] {
  border-color: #e10600;
  box-shadow: 0 0 0 2px rgba(225, 6, 0, .22);
}
.dg-hp {
  position: absolute !important;
  left: -9999px !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
.dg-waitlist__submit {
  width: 100%;
  min-height: 56px;
  border: 1px solid #ef2230;
  border-radius: 3px;
  background: linear-gradient(180deg, #df1421, #bc0712);
  color: #fff;
  cursor: pointer;
  font: inherit;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .13em;
  text-transform: uppercase;
  transition: background .18s ease, transform .18s ease;
}
.dg-waitlist__submit:hover {
  background: #e60d1a;
  transform: translateY(-1px);
}
.dg-waitlist__submit[disabled] {
  opacity: .6;
  cursor: progress;
  transform: none;
}
.dg-waitlist__consent,
.dg-waitlist__note {
  margin: 12px 0 0;
  color: #6d6d6d;
  font-size: 10px;
  line-height: 1.6;
}
.dg-waitlist__consent a,
.dg-waitlist__note a {
  color: #a8a8a8;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.dg-waitlist__status {
  margin: 12px 0 0;
  font-size: 11px;
  line-height: 1.55;
  font-weight: 700;
}
.dg-waitlist__status[data-state="error"] {
  color: #ff6a5f;
}
.dg-waitlist__status[data-state="info"] {
  color: #9a9a9a;
}
.dg-waitlist__status[data-state="success"] {
  color: #7ee08a;
}
.dg-waitlist__success {
  margin: 0;
  padding: 0;
  list-style: none;
}
.dg-waitlist__success li {
  padding: 11px 0;
  border-top: 1px solid #242424;
  color: #c4c4c4;
  font-size: 12px;
  line-height: 1.55;
}
.dg-waitlist__success li:first-child {
  border-top: 0;
  padding-top: 0;
}
.dg-waitlist__success a {
  color: #fff;
  font-weight: 900;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.dg-waitlist__fallback {
  margin: 11px 0 0;
  font-size: 10px;
  line-height: 1.6;
  color: #7c7c7c;
}
.dg-waitlist__fallback a {
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 3px;
}
@media (max-width: 860px) {
  .dg-waitlist__inner {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 780px) {
  .dg-waitlist {
    padding: 24px 18px;
  }
  .dg-waitlist__deliverables {
    display: grid;
    grid-template-columns: 1fr;
  }
  .dg-waitlist__deliverables li {
    text-align: left;
  }
}

/* Footer capture variant — compact, no competing headline. */
.dg-waitlist--footer {
  border-top-width: 2px;
  margin: 8px 0 40px;
  padding: clamp(22px, 3vw, 34px);
}
.dg-waitlist--footer .dg-waitlist__title {
  font-size: clamp(26px, 3vw, 38px);
}
.dg-waitlist--footer .dg-waitlist__inner {
  grid-template-columns: minmax(0, 1fr) minmax(300px, .85fr);
}
@media (max-width: 860px) {
  .dg-waitlist--footer .dg-waitlist__inner {
    grid-template-columns: 1fr;
  }
}

/* -------------------------------------------------------------------------
   6. TRUST — references / citations component (clearly labelled, not invented)
   ------------------------------------------------------------------------- */
.dg-references {
  border: 1px solid #2a2a2a;
  border-left: 3px solid #e10600;
  background: #080808;
  padding: clamp(20px, 3vw, 32px);
}
.dg-references__head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 18px;
  flex-wrap: wrap;
  margin-bottom: 6px;
}
.dg-references__head small {
  color: #7a7a7a;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .2em;
  text-transform: uppercase;
}
.dg-references__head a {
  color: #fff;
  font-size: 11px;
  font-weight: 900;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.dg-references h3 {
  margin: 0 0 12px;
  font-family: Impact, "Arial Black", sans-serif;
  font-size: clamp(24px, 2.7vw, 38px);
  line-height: .95;
  text-transform: uppercase;
}
.dg-references p {
  margin: 0 0 18px;
  color: #9a9a9a;
  font-size: 13px;
  line-height: 1.7;
}
.dg-references ol {
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: dgref;
}
.dg-references li {
  counter-increment: dgref;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 12px;
  padding: 14px 0;
  border-top: 1px solid #242424;
  color: #b6b6b6;
  font-size: 12.5px;
  line-height: 1.6;
}
.dg-references li::before {
  content: "[" counter(dgref) "]";
  color: #e10600;
  font-weight: 900;
  font-size: 11px;
}
.dg-references li b {
  color: #fff;
}
.dg-references__placeholder {
  margin-top: 6px;
  padding: 12px 14px;
  border: 1px dashed #4a4a4a;
  background: #0c0c0c;
  color: #8f8f8f;
  font-size: 11px;
  line-height: 1.65;
}
.dg-references__placeholder b {
  color: #e10600;
  font-size: 9px;
  letter-spacing: .16em;
  text-transform: uppercase;
  display: block;
  margin-bottom: 5px;
}
@media (max-width: 780px) {
  .dg-references li {
    grid-template-columns: 28px minmax(0, 1fr);
    gap: 9px;
    font-size: 12px;
  }
}

/* -------------------------------------------------------------------------
   7. TRUST — proof / credential placeholders (no invented content)
   ------------------------------------------------------------------------- */
.dg-proof-placeholder {
  border: 1px dashed #454545;
  background: #0a0a0a;
  padding: clamp(20px, 3vw, 32px);
}
.dg-proof-placeholder__tag {
  display: inline-block;
  margin-bottom: 14px;
  padding: 6px 10px;
  border: 1px dashed #6a6a6a;
  color: #b9b9b9;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.dg-proof-placeholder h3 {
  margin: 0 0 12px;
  font-family: Impact, "Arial Black", sans-serif;
  font-size: clamp(26px, 3vw, 42px);
  line-height: .94;
  text-transform: uppercase;
}
.dg-proof-placeholder > p {
  margin: 0 0 20px;
  max-width: 760px;
  color: #9c9c9c;
  font-size: 13px;
  line-height: 1.7;
}
.dg-proof-slots {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 10px;
}
.dg-proof-slot {
  border: 1px solid #2b2b2b;
  background: #060606;
  padding: 16px;
}
.dg-proof-slot small {
  display: block;
  margin-bottom: 8px;
  color: #e10600;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.dg-proof-slot p {
  margin: 0;
  color: #7c7c7c;
  font-size: 11.5px;
  line-height: 1.6;
}
.dg-proof-slot [data-dg-fill] {
  display: block;
  margin-top: 10px;
  padding-top: 9px;
  border-top: 1px dashed #3d3d3d;
  color: #6a6a6a;
  font-size: 10px;
  letter-spacing: .04em;
}
.dg-proof-placeholder__note {
  margin: 16px 0 0;
  color: #7c7c7c;
  font-size: 11px;
  line-height: 1.65;
}