﻿/* CommerciumIQ Academy R11D final form polish.
   Academy-only CSS. Loaded after style.css and shell.css.
   Keeps future Academy changes here instead of stacking rules in global style.css. */

/* Original R11 base follows. */
/* CommerciumIQ Academy R11B micro polish.
   Academy-only CSS. Loaded after style.css and shell.css.
   Keeps future Academy changes here instead of stacking rules in global style.css. */

.academy-page {
  background:
    radial-gradient(circle at 14% 0%, rgba(216,173,78,.10), transparent 34%),
    radial-gradient(circle at 90% 10%, rgba(216,173,78,.055), transparent 32%),
    #050504;
}

.academy-page .site-header {
  position: relative !important;
  top: auto !important;
}

.academy-page .compact-hero,
.academy-page .section {
  width: min(1180px, calc(100% - 48px)) !important;
  max-width: none !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.academy-page .compact-hero {
  padding-top: clamp(1.55rem, 3vw, 2.45rem) !important;
  padding-bottom: clamp(1.35rem, 2.6vw, 2.05rem) !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
}

.academy-page .section {
  padding-top: clamp(1.2rem, 2.5vw, 2rem) !important;
  padding-bottom: clamp(1.2rem, 2.5vw, 2rem) !important;
}

.academy-page .academy-breadcrumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .42rem;
  margin: 0 0 .95rem;
  padding: 0;
  color: var(--soft, #8f8778);
  font-size: .78rem;
  line-height: 1.45;
  letter-spacing: .01em;
}

.academy-page .academy-breadcrumb a {
  color: var(--gold2, #f3d77d);
  font-weight: 650;
  text-decoration: none;
}

.academy-page .academy-breadcrumb span:last-child {
  color: var(--muted, #c7bfae);
  font-weight: 500;
}

.academy-page .academy-breadcrumb a:hover {
  color: var(--gold2, #f3d77d);
  text-decoration: none;
}

.academy-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, .42fr);
  gap: clamp(1rem, 3vw, 2rem);
  align-items: start;
}

.academy-hero-copy {
  max-width: 790px;
}

.academy-page .compact-hero h1 {
  max-width: 790px !important;
  margin: .35rem 0 .7rem !important;
  font-size: clamp(2.15rem, 4vw, 3.25rem) !important;
  line-height: 1.04 !important;
  letter-spacing: -.045em !important;
}

.academy-page .compact-hero .lede {
  max-width: 790px !important;
  color: var(--muted, #c7bfae) !important;
  line-height: 1.72 !important;
  font-size: clamp(1rem, 1.15vw, 1.08rem) !important;
}

.academy-page .button-row {
  display: none !important;
}

.academy-hero-note,
.academy-text-panel,
.academy-capture-panel,
.academy-form-card,
.academy-mini-chart,
.academy-table-wrap,
.academy-notice,
.academy-link-grid a,
.academy-workflow article {
  border: 1px solid rgba(216,173,78,.22);
  border-radius: 18px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.035), rgba(255,255,255,.015)),
    rgba(8,8,7,.72);
  box-shadow: 0 20px 60px rgba(0,0,0,.28);
}

.academy-hero-note {
  padding: 1rem;
  color: var(--muted, #c7bfae);
}

.academy-hero-note strong {
  display: block;
  color: var(--gold2, #f3d77d);
  margin-bottom: .4rem;
}

.academy-hero-note p {
  margin: 0;
  line-height: 1.65;
  font-size: .94rem;
}

.academy-page .section-title {
  margin-bottom: 1rem !important;
}

.academy-page .section-title h2,
.academy-page .academy-text-panel h2,
.academy-page .academy-notice h2,
.academy-page .academy-capture-copy h2 {
  margin: .35rem 0 .65rem !important;
  font-size: clamp(1.55rem, 2.4vw, 2.15rem) !important;
  line-height: 1.12 !important;
  letter-spacing: -.025em !important;
}

.academy-text-panel {
  padding: clamp(1rem, 2vw, 1.35rem);
  color: var(--muted, #c7bfae);
}

.academy-text-panel p {
  max-width: 78ch;
  margin: 0 0 .9rem;
  line-height: 1.75;
}

.academy-text-panel p:last-child {
  margin-bottom: 0;
}

.academy-capture-panel {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(360px, .95fr);
  gap: clamp(1rem, 2vw, 1.5rem);
  align-items: stretch;
  padding: clamp(1rem, 2.4vw, 1.55rem);
  background:
    radial-gradient(circle at 12% 0%, rgba(216,173,78,.12), transparent 30%),
    linear-gradient(135deg, rgba(243,215,125,.065), rgba(255,255,255,.02) 42%, rgba(0,0,0,.24));
}

.academy-capture-copy {
  min-width: 0;
}

.academy-capture-copy p {
  margin: 0 0 .85rem;
  color: var(--muted, #c7bfae);
  line-height: 1.7;
  max-width: 72ch;
}

.academy-value-list {
  display: grid;
  gap: .55rem;
  margin: .95rem 0 0;
  padding: 0;
  list-style: none;
}

.academy-value-list li {
  position: relative;
  padding-left: 1.35rem;
  color: var(--muted, #c7bfae);
  line-height: 1.55;
}

.academy-value-list li::before {
  content: "+";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--gold2, #f3d77d);
  font-weight: 900;
}

.academy-small-note,
.academy-updates-capture-fallback {
  color: var(--soft, #8f8778);
  font-size: .9rem;
}

.academy-small-note {
  margin-top: .95rem !important;
}

.academy-form-card {
  display: flex;
  min-width: 0;
  flex-direction: column;
  padding: clamp(.9rem, 2vw, 1.15rem);
  background: linear-gradient(180deg, rgba(0,0,0,.72), rgba(0,0,0,.48));
}

.academy-form-brand-lockup {
  display: flex;
  align-items: center;
  gap: .72rem;
  margin: 0 0 .55rem;
  padding: 0;
}

.academy-form-brand-lockup img {
  width: 34px;
  height: 34px;
  object-fit: contain;
  filter: drop-shadow(0 0 14px rgba(216,173,78,.22));
}

.academy-form-brand-lockup > div {
  display: flex;
  align-items: baseline;
  gap: .38rem;
  min-width: 0;
}

.academy-form-join-word {
  color: var(--gold2, #f3d77d);
  font-size: clamp(1.05rem, 1.25vw, 1.28rem);
  font-weight: 850;
  letter-spacing: -.015em;
}

.academy-form-brand-word {
  color: var(--gold2, #f3d77d);
  font-size: clamp(1.24rem, 1.75vw, 1.78rem);
  font-weight: 800;
  letter-spacing: -.015em;
  line-height: 1.05;
}

.academy-form-value {
  margin: 0 0 .85rem;
  color: var(--muted, #c7bfae);
  line-height: 1.58;
  font-size: .92rem;
}

.academy-updates-capture-embed {
  width: 100%;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  overflow: visible !important;
}

.academy-updates-capture-embed,
.academy-updates-capture-embed * {
  max-width: 100% !important;
  box-sizing: border-box !important;
  font-family: inherit !important;
}

.academy-updates-capture-embed input,
.academy-updates-capture-embed input[type="email"] {
  min-height: 44px !important;
  border-radius: 10px !important;
  border: 1px solid rgba(243,215,125,.55) !important;
  background: #f8f4e9 !important;
  color: #080602 !important;
}

.academy-updates-capture-embed button,
.academy-updates-capture-embed input[type="submit"] {
  min-height: 44px !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: linear-gradient(135deg, var(--gold2, #f3d77d), var(--gold, #d8ad4e)) !important;
  color: #080602 !important;
  font-weight: 900 !important;
}

.academy-updates-capture-fallback {
  margin: .8rem 0 0;
  line-height: 1.55;
}

.academy-updates-capture-fallback a {
  color: var(--gold2, #f3d77d);
  font-weight: 850;
}

.academy-workflow {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .85rem;
  margin-top: 1rem;
}

.academy-workflow article {
  padding: 1rem;
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}

.academy-workflow article:hover {
  transform: translateY(-2px);
  border-color: rgba(243,215,125,.4);
  background:
    linear-gradient(135deg, rgba(216,173,78,.075), rgba(255,255,255,.018)),
    rgba(8,8,7,.78);
}

.academy-step {
  display: inline-flex;
  width: 1.65rem;
  height: 1.65rem;
  align-items: center;
  justify-content: center;
  margin-bottom: .65rem;
  border-radius: 999px;
  border: 1px solid rgba(243,215,125,.42);
  color: var(--gold2, #f3d77d);
  font-weight: 900;
  font-size: .85rem;
}

.academy-workflow h3 {
  margin: 0 0 .5rem;
  color: var(--ink, #f6f0df);
  font-size: 1.02rem;
  line-height: 1.25;
}

.academy-workflow p {
  margin: 0;
  color: var(--muted, #c7bfae);
  line-height: 1.58;
  font-size: .94rem;
}

.academy-split {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(330px, .72fr);
  gap: clamp(1rem, 2.3vw, 1.5rem);
  align-items: stretch;
}

.academy-mini-chart {
  padding: 1rem;
  align-self: stretch;
}

.academy-bar-row {
  display: grid;
  grid-template-columns: 122px minmax(120px, 1fr) 70px;
  gap: .65rem;
  align-items: center;
  margin: .72rem 0;
  color: var(--muted, #c7bfae);
  font-size: .9rem;
}

.academy-bar-row div {
  height: .58rem;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  overflow: hidden;
}

.academy-bar-row i {
  position: relative;
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--gold, #d8ad4e), var(--gold2, #f3d77d));
  transform-origin: left center;
  animation: academy-bar-grow .95s cubic-bezier(.2,.75,.2,1) both;
  overflow: hidden;
}

.academy-bar-row i::after {
  content: "";
  position: absolute;
  inset: 0;
  width: 42%;
  transform: translateX(-130%);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.36), transparent);
  animation: academy-bar-sheen 1.9s ease-in-out .55s both;
}

.academy-mini-chart .academy-bar-row:nth-child(1) i { animation-delay: .05s; }
.academy-mini-chart .academy-bar-row:nth-child(2) i { animation-delay: .16s; }
.academy-mini-chart .academy-bar-row:nth-child(3) i { animation-delay: .27s; }
.academy-mini-chart .academy-bar-row:nth-child(4) i { animation-delay: .38s; }

@keyframes academy-bar-grow {
  from { transform: scaleX(0); opacity: .58; }
  to { transform: scaleX(1); opacity: 1; }
}

@keyframes academy-bar-sheen {
  from { transform: translateX(-130%); }
  to { transform: translateX(260%); }
}

.academy-bar-row b {
  color: var(--gold2, #f3d77d);
  font-size: .82rem;
}

.academy-mini-chart p {
  margin: .85rem 0 0;
  color: var(--soft, #8f8778);
  font-size: .88rem;
  line-height: 1.55;
}

.academy-table-wrap {
  overflow-x: auto;
  padding: .8rem;
}

.academy-table {
  width: 100%;
  min-width: 760px;
  border-collapse: collapse;
  color: var(--muted, #c7bfae);
}

.academy-table th,
.academy-table td {
  padding: .85rem .9rem;
  border-bottom: 1px solid rgba(216,173,78,.15);
  vertical-align: top;
  text-align: left;
}

.academy-table th {
  color: var(--gold2, #f3d77d);
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .09em;
  background: rgba(216,173,78,.055);
}

.academy-table tr:last-child td {
  border-bottom: 0;
}

.academy-table td:nth-child(2) {
  color: var(--ink, #f6f0df);
  font-weight: 850;
}

.academy-notice {
  display: grid;
  grid-template-columns: minmax(220px, .38fr) minmax(0, 1fr);
  gap: 1rem;
  align-items: start;
  padding: clamp(1rem, 2vw, 1.25rem);
  border-left: 4px solid var(--gold, #d8ad4e);
}

.academy-notice p {
  margin: 0;
  color: var(--muted, #c7bfae);
  line-height: 1.72;
}

.academy-next-grid {
  grid-template-columns: minmax(0, .9fr) minmax(360px, 1fr);
}

.academy-link-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
}

.academy-link-grid a {
  display: block;
  padding: .95rem;
  color: var(--muted, #c7bfae);
  text-decoration: none;
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}

.academy-link-grid a:hover {
  transform: translateY(-2px);
  border-color: rgba(243,215,125,.42);
  background: rgba(216,173,78,.065);
}

.academy-link-grid strong {
  display: block;
  color: var(--gold2, #f3d77d);
  margin-bottom: .35rem;
}

.academy-link-grid span {
  display: block;
  line-height: 1.5;
}

.academy-faq-stack details {
  transition: border-color .18s ease, background .18s ease;
}

.academy-faq-stack details:hover {
  border-color: rgba(243,215,125,.35);
  background: rgba(216,173,78,.045);
}

.academy-sponsored-slot:empty,
.academy-ad-slot:empty {
  display: none !important;
}

.academy-sponsored-slot.is-empty,
.academy-ad-slot.is-empty {
  display: none !important;
}


/* R11C final EmailOctopus form polish: use the embedded heading, make it gold, and remove custom duplicate branding. */
.academy-form-brand-lockup,
.academy-form-value {
  display: none !important;
}

.academy-form-card .academy-updates-capture-embed {
  padding-top: 0 !important;
}

.academy-form-card .academy-updates-capture-embed h1,
.academy-form-card .academy-updates-capture-embed h2,
.academy-form-card .academy-updates-capture-embed h3,
.academy-form-card .academy-updates-capture-embed .form-title,
.academy-form-card .academy-updates-capture-embed [class*="title"],
.academy-form-card .academy-updates-capture-embed [class*="heading"] {
  color: var(--gold2, #f3d77d) !important;
  font-family: inherit !important;
  font-weight: 760 !important;
  letter-spacing: -.02em !important;
  text-shadow: 0 0 18px rgba(216,173,78,.16) !important;
}

.academy-form-card .academy-updates-capture-embed hr,
.academy-form-card .academy-updates-capture-embed [style*="border-top"],
.academy-form-card .academy-updates-capture-embed [style*="border-bottom"] {
  border-color: rgba(216,173,78,.18) !important;
}

.academy-form-card .academy-updates-capture-embed input[type="email"],
.academy-form-card .academy-updates-capture-embed input:not([type]),
.academy-form-card .academy-updates-capture-embed button,
.academy-form-card .academy-updates-capture-embed input[type="submit"] {
  border-radius: 10px !important;
}

/* Keep the mini-chart interactive after initial page load, even when the user scrolls to it later. */
.academy-bar-row i::after {
  animation-name: academy-bar-sheen-loop !important;
  animation-duration: 4.25s !important;
  animation-timing-function: ease-in-out !important;
  animation-iteration-count: infinite !important;
}

.academy-mini-chart .academy-bar-row:nth-child(1) i::after { animation-delay: .15s !important; }
.academy-mini-chart .academy-bar-row:nth-child(2) i::after { animation-delay: .55s !important; }
.academy-mini-chart .academy-bar-row:nth-child(3) i::after { animation-delay: .95s !important; }
.academy-mini-chart .academy-bar-row:nth-child(4) i::after { animation-delay: 1.35s !important; }

@keyframes academy-bar-sheen-loop {
  0%, 38% { transform: translateX(-140%); opacity: 0; }
  48% { opacity: .72; }
  66% { transform: translateX(250%); opacity: 0; }
  100% { transform: translateX(250%); opacity: 0; }
}

@media (max-width: 1080px) {
  .academy-hero-grid,
  .academy-capture-panel,
  .academy-split,
  .academy-next-grid,
  .academy-notice {
    grid-template-columns: 1fr;
  }

  .academy-workflow {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .academy-form-heading small {
    text-align: left;
  }
}

@media (max-width: 720px) {
  .academy-page .compact-hero,
  .academy-page .section {
    width: min(100% - 32px, 1180px) !important;
  }

  .academy-page .compact-hero h1 {
    font-size: clamp(2rem, 10vw, 2.7rem) !important;
  }

  .academy-workflow,
  .academy-link-grid {
    grid-template-columns: 1fr;
  }

  .academy-bar-row {
    grid-template-columns: 1fr;
    gap: .35rem;
  }

  .academy-form-brand-lockup > div {
    flex-wrap: wrap;
  }

  .academy-table {
    min-width: 680px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .academy-page *,
  .academy-page *::before,
  .academy-page *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }

  .academy-workflow article:hover,
  .academy-link-grid a:hover {
    transform: none;
  }
}


/* R11D final EmailOctopus integration:
   EmailOctopus now provides the bare fields only; CommerciumIQ owns the premium heading and wrapper. */
.academy-site-form-heading {
  margin: 0 0 .9rem;
  padding: 0 0 .15rem;
  text-align: center;
}

.academy-site-form-heading h2 {
  margin: 0;
  color: var(--gold2, #f3d77d);
  font-family: inherit;
  font-size: clamp(2.05rem, 3.35vw, 3.05rem);
  font-weight: 790;
  line-height: 1.02;
  letter-spacing: -.035em;
  text-shadow: 0 0 22px rgba(216,173,78,.15);
}

.academy-site-form-heading p {
  max-width: 44ch;
  margin: .58rem auto 0;
  color: var(--muted, #c7bfae);
  font-size: .95rem;
  line-height: 1.55;
}

.academy-form-card .academy-updates-capture-embed {
  background: transparent !important;
}

.academy-form-card .academy-updates-capture-embed form,
.academy-form-card .academy-updates-capture-embed > div,
.academy-form-card .academy-updates-capture-embed [class*="container"],
.academy-form-card .academy-updates-capture-embed [class*="wrapper"] {
  background-color: transparent !important;
  background-image: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

/* If EmailOctopus title/description elements are re-enabled later, keep them hidden so the page does not duplicate branding. */
.academy-form-card .academy-updates-capture-embed h1,
.academy-form-card .academy-updates-capture-embed h2,
.academy-form-card .academy-updates-capture-embed h3,
.academy-form-card .academy-updates-capture-embed [class*="title"],
.academy-form-card .academy-updates-capture-embed [class*="heading"],
.academy-form-card .academy-updates-capture-embed [class*="description"] {
  display: none !important;
}

.academy-form-card .academy-updates-capture-embed hr,
.academy-form-card .academy-updates-capture-embed [style*="border-top"],
.academy-form-card .academy-updates-capture-embed [style*="border-bottom"] {
  border: 0 !important;
  opacity: 0 !important;
}

.academy-form-card .academy-updates-capture-embed input[type="email"],
.academy-form-card .academy-updates-capture-embed input:not([type]) {
  width: 100% !important;
  min-height: 46px !important;
  margin-bottom: .65rem !important;
}

.academy-form-card .academy-updates-capture-embed button,
.academy-form-card .academy-updates-capture-embed input[type="submit"] {
  width: 100% !important;
  min-height: 46px !important;
}

.academy-form-card .academy-updates-capture-embed label,
.academy-form-card .academy-updates-capture-embed p,
.academy-form-card .academy-updates-capture-embed span {
  color: var(--muted, #c7bfae) !important;
}

/* Keep required EmailOctopus attribution, but make it less visually dominant when the embed allows CSS inheritance. */
.academy-form-card .academy-updates-capture-embed a[href*="emailoctopus"],
.academy-form-card .academy-updates-capture-embed [class*="powered"] {
  color: var(--soft, #8f8778) !important;
  opacity: .85 !important;
}

@media (max-width: 720px) {
  .academy-site-form-heading h2 {
    font-size: clamp(1.85rem, 9vw, 2.5rem);
  }
}

/* === CIQ BACKGROUND R2 START ===
   Academy inherits the shared page background while preserving its panels.
*/
.academy-page main,
.academy-main,
.academy-shell {
  background: transparent !important;
}
/* === CIQ BACKGROUND R2 END === */

