/* ====================================================================== *
 * File: landing-visual-polish.css
 * Location: static/css/landing-visual-polish.css
 * Description: Sharpens landing credentials/social icons, expands specialist testimonials to the full landing width, preserves complete course cards, and blends the final legal footer into the landing background.
 * Version: 1.1.0
 * Last Modified: Mon Aug 10 2026 - 12:40
 * Dependencies: landing.css, landing-social-position.css, landing-course-portfolio.css, specialist_comments.css
 * ====================================================================== */

/* -------------------------------------------------------------------------- *
 * 1. Credential sharpness
 * -------------------------------------------------------------------------- */

/* - - - 1.1. Remove soft glow and force fully opaque credential rendering - - - */

.landing-credentials,
.landing-credential,
.landing-credential-visual,
.landing-enamad-visual {
  opacity: 1 !important;
  filter: none !important;
}

.landing-award {
  opacity: 1 !important;
  filter: contrast(1.22) saturate(1.12) brightness(1.04) !important;
  image-rendering: -webkit-optimize-contrast;
  mix-blend-mode: normal;
}

.enamad-seal-image {
  opacity: 1 !important;
  filter: none !important;
  image-rendering: auto;
  mix-blend-mode: normal;
}

/* - - - 1.2. Keep the tiny bases crisp instead of glowing into the artwork - - - */

.landing-micro-plinth {
  opacity: 1;
  border-color: rgba(255, 231, 166, 0.46);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.12), rgba(229, 185, 83, 0.08));
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.14);
}

.landing-micro-plinth::after {
  display: none;
}

/* - - - 1.3. Desktop credential baseline aligns with the copyright row - - - */

@media (min-width: 701px) {
  .landing-credentials {
    bottom: max(18px, env(safe-area-inset-bottom));
  }

  .landing-award-consumer {
    height: 86px;
  }

  .landing-award-beauty {
    height: 82px;
  }

  .enamad-seal-image {
    width: 92px;
    max-height: 76px;
  }
}

/* -------------------------------------------------------------------------- *
 * 2. Crisp social controls
 * -------------------------------------------------------------------------- */

.landing-social {
  border-color: rgba(255, 255, 255, 0.24);
  background: rgba(5, 20, 50, 0.58);
  color: #ffffff;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.16);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.landing-social:hover {
  color: #ffe7a5;
  border-color: rgba(239, 202, 112, 0.68);
  background: rgba(13, 39, 83, 0.86);
}

.landing-social svg {
  width: 17px;
  height: 17px;
  shape-rendering: geometricPrecision;
}

.landing-social rect,
.landing-social circle,
.landing-social path:last-child:not(:only-child) {
  stroke-width: 2;
}

/* -------------------------------------------------------------------------- *
 * 3. Full-width course portfolio
 * -------------------------------------------------------------------------- */

.landing-course-portfolio-shell {
  width: 100%;
  max-width: none;
}

.landing-course-portfolio-track {
  box-sizing: border-box;
  scroll-padding-inline: clamp(20px, 2.5vw, 48px);
}

/* - - - 3.1. Four complete cards on standard wide displays - - - */

@media (min-width: 1200px) {
  .landing-course-portfolio-heading {
    padding-inline: clamp(28px, 3vw, 56px);
  }

  .landing-course-portfolio-track {
    gap: 18px;
    padding-inline: clamp(28px, 3vw, 56px);
  }

  .landing-course-card {
    flex: 0 0 calc((100% - 54px) / 4);
    min-width: 0;
  }
}

/* - - - 3.2. Five complete cards on ultra-wide displays - - - */

@media (min-width: 2200px) {
  .landing-course-card {
    flex-basis: calc((100% - 72px) / 5);
  }
}

/* -------------------------------------------------------------------------- *
 * 4. Full-width specialist testimonials on the public landing page
 * -------------------------------------------------------------------------- */

.landing-content-flow .specialist-comments-section {
  width: 100%;
  margin-top: 0;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.landing-content-flow .specialist-comments-shell {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 54px clamp(28px, 3vw, 56px) 68px;
}

.landing-content-flow .specialist-comments-heading {
  align-items: flex-start;
  margin-bottom: 28px;
  text-align: right;
}

.landing-content-flow .specialist-comments-heading-accent {
  margin-top: 11px;
}

.landing-content-flow .specialist-comments-track {
  box-sizing: border-box;
  width: 100%;
  gap: 18px;
  padding: 7px 0 14px;
  scroll-padding-inline: 0;
}

/* - - - 4.1. Four complete testimonial cards on standard wide displays - - - */

@media (min-width: 1200px) {
  .landing-content-flow .specialist-comment-card {
    flex: 0 0 calc((100% - 54px) / 4);
    min-width: 0;
  }

  .landing-content-flow .specialist-comment-card:only-child {
    flex-basis: min(620px, 100%);
    margin-inline: auto;
  }
}

/* - - - 4.2. Five complete cards on ultra-wide displays - - - */

@media (min-width: 2200px) {
  .landing-content-flow .specialist-comment-card {
    flex-basis: calc((100% - 72px) / 5);
  }

  .landing-content-flow .specialist-comment-card:only-child {
    flex-basis: min(680px, 100%);
  }
}

/* -------------------------------------------------------------------------- *
 * 5. Seamless final legal footer
 * -------------------------------------------------------------------------- */

.landing-bottom-legal {
  position: relative;
  z-index: 1;
  margin-top: -1px;
  border: 0;
  background: linear-gradient(180deg, #06142e 0%, #05132c 55%, #041126 100%);
  box-shadow: none;
}

.landing-bottom-legal::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: -54px;
  right: 0;
  left: 0;
  height: 55px;
  background: linear-gradient(180deg, rgba(6, 20, 46, 0), #06142e 92%);
  pointer-events: none;
}

/* -------------------------------------------------------------------------- *
 * 6. Preserve established phone/tablet layout
 * -------------------------------------------------------------------------- */

@media (max-width: 700px) {
  .landing-social svg {
    width: 15px;
    height: 15px;
  }

  .landing-content-flow .specialist-comments-shell {
    padding: 42px 16px 48px;
  }

  .landing-content-flow .specialist-comments-heading {
    align-items: center;
    text-align: center;
  }

  .landing-content-flow .specialist-comments-track {
    gap: 13px;
  }

  .landing-bottom-legal::before {
    top: -38px;
    height: 39px;
  }
}

/* ============================= End of landing-visual-polish.css ============================= */