:root {
  --mint-1: #7fcdb8;
  --mint-2: #e6f4f1;

  --ink: #1f2937;
  --ink-muted: #4b5563;

  --accent: #0f766e;

  --pill: rgba(31, 41, 55, 0.05);
  --pill-hover: rgba(31, 41, 55, 0.08);
  --pill-active: rgba(15, 118, 110, 0.12);

  /* Dark scheme helpers */
  --dark-1: #0b1220;
  --dark-2: #0f1a2e;
  --dark-border: rgba(230, 244, 241, 0.18);
}

/* =======================================================
   HEADER + TABS
   - Light: mint gradient
   - Dark: dark gradient (so it does NOT stay mint)
   ======================================================= */
[data-md-color-scheme="default"] .md-header,
[data-md-color-scheme="default"] .md-tabs {
  background: linear-gradient(90deg, var(--mint-1), var(--mint-2)) !important;
}

[data-md-color-scheme="slate"] .md-header,
[data-md-color-scheme="slate"] .md-tabs {
  background: linear-gradient(90deg, var(--dark-1), var(--dark-2)) !important;
}

/* Keep inner containers transparent */
.md-header__inner,
.md-tabs__inner {
  background: transparent !important;
}

/* Clean divider feel */
[data-md-color-scheme="default"] .md-header {
  box-shadow: 0 1px 0 rgba(31, 41, 55, 0.10) !important;
}

[data-md-color-scheme="slate"] .md-header {
  box-shadow: 0 1px 0 rgba(230, 244, 241, 0.12) !important;
}

.md-tabs {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.45) !important;
  padding-top: 6px !important;
  padding-bottom: 6px !important;
}

/* =======================================================
   HEADER LAYOUT (NO OVERLAP)
   ======================================================= */
.md-header__inner {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

/* Title container can shrink safely */
.md-header__title {
  min-width: 0 !important;
  overflow: hidden !important;
  flex: 1 1 auto !important;
}

/* Site title (light) */
[data-md-color-scheme="default"] .md-header__title .md-header__ellipsis {
  color: var(--ink) !important;
}

/* Site title (dark) */
[data-md-color-scheme="slate"] .md-header__title .md-header__ellipsis {
  color: #e6f4f1 !important;
}

.md-header__title .md-header__ellipsis {
  opacity: 1 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Topic (page label) */
.md-header__topic {
  min-width: 0 !important;
  overflow: hidden !important;
  flex: 0 1 auto !important;
  max-width: 40vw !important;
}

/* Topic text (light) */
[data-md-color-scheme="default"] .md-header__topic .md-ellipsis {
  color: var(--ink-muted) !important;
}

/* Topic text (dark) */
[data-md-color-scheme="slate"] .md-header__topic .md-ellipsis {
  color: rgba(230, 244, 241, 0.78) !important;
}

.md-header__topic .md-ellipsis {
  opacity: 1 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

@media (max-width: 720px) {
  .md-header__topic {
    display: none !important;
  }
}

/* Header icons visible */
[data-md-color-scheme="default"] .md-header .md-header__button,
[data-md-color-scheme="default"] .md-header .md-header__button * {
  color: var(--ink) !important;
  opacity: 1 !important;
}

[data-md-color-scheme="slate"] .md-header .md-header__button,
[data-md-color-scheme="slate"] .md-header .md-header__button * {
  color: #e6f4f1 !important;
  opacity: 1 !important;
}

/* =======================================================
   SEARCH (PILL)
   ======================================================= */
.md-header .md-search__label,
.md-header .md-search__label span {
  opacity: 1 !important;
  font-weight: 600 !important;
}

[data-md-color-scheme="default"] .md-header .md-search__label,
[data-md-color-scheme="default"] .md-header .md-search__label span {
  color: var(--ink) !important;
}

[data-md-color-scheme="slate"] .md-header .md-search__label,
[data-md-color-scheme="slate"] .md-header .md-search__label span {
  color: #e6f4f1 !important;
}

.md-header .md-search__icon,
.md-header .md-search__icon svg,
.md-header .md-search__label .md-icon,
.md-header .md-search__label .md-icon svg {
  fill: currentColor !important;
  opacity: 1 !important;
}

[data-md-color-scheme="default"] .md-header .md-search__icon,
[data-md-color-scheme="default"] .md-header .md-search__label .md-icon {
  color: var(--ink) !important;
}

[data-md-color-scheme="slate"] .md-header .md-search__icon,
[data-md-color-scheme="slate"] .md-header .md-search__label .md-icon {
  color: #e6f4f1 !important;
}

/* Search pill surface */
[data-md-color-scheme="default"] .md-header .md-search__label {
  background: rgba(255, 255, 255, 0.60) !important;
  border: 1px solid rgba(31, 41, 55, 0.14) !important;
}

[data-md-color-scheme="slate"] .md-header .md-search__label {
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid var(--dark-border) !important;
}

.md-header .md-search__label {
  padding: 6px 10px !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  max-width: 240px !important;
}

.md-header .md-search--active .md-search__label {
  border-color: rgba(15, 118, 110, 0.35) !important;
  box-shadow: 0 0 0 3px rgba(15, 118, 110, 0.12) !important;
}

.md-search__input {
  opacity: 1 !important;
}

[data-md-color-scheme="default"] .md-search__input {
  color: var(--ink) !important;
}

[data-md-color-scheme="slate"] .md-search__input {
  color: #e6f4f1 !important;
}

[data-md-color-scheme="default"] .md-search__input::placeholder {
  color: var(--ink-muted) !important;
  opacity: 1 !important;
}

[data-md-color-scheme="slate"] .md-search__input::placeholder {
  color: rgba(230, 244, 241, 0.70) !important;
  opacity: 1 !important;
}

@media (max-width: 720px) {
  .md-header .md-search__label {
    max-width: 160px !important;
  }
}

/* =======================================================
   CONTACT US BUTTON (this is what JS injects: .header-cta)
   ======================================================= */
.header-cta {
  margin-left: 10px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  padding: 0.5rem 0.95rem !important;
  border-radius: 12px !important;

  font-weight: 800 !important;
  text-decoration: none !important;

  transition: transform 120ms ease, opacity 120ms ease, background 120ms ease;
}

/* Light CTA */
[data-md-color-scheme="default"] .header-cta {
  background: rgba(255, 255, 255, 0.70) !important;
  color: var(--accent) !important;
  border: 1px solid rgba(15, 118, 110, 0.22) !important;
  box-shadow: 0 6px 18px rgba(15, 118, 110, 0.12) !important;
}

/* Dark CTA */
[data-md-color-scheme="slate"] .header-cta {
  background: rgba(255, 255, 255, 0.10) !important;
  color: #e6f4f1 !important;
  border: 1px solid var(--dark-border) !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.25) !important;
}

.header-cta:hover {
  opacity: 0.95 !important;
  transform: translateY(-1px) !important;
}

/* =======================================================
   TABS WRAP + PILL STYLE
   ======================================================= */
.md-tabs .md-grid {
  max-width: 100% !important;
  padding-left: 14px !important;
  padding-right: 14px !important;
}

.md-tabs__list {
  width: 100% !important;
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 10px 14px !important;
  padding: 10px 0 !important;
}

.md-tabs__item {
  margin: 0 !important;
  white-space: normal !important;
}

.md-tabs__link {
  font-weight: 500 !important;
  opacity: 1 !important;

  font-size: 0.82rem !important;
  line-height: 1.1 !important;

  padding: 0.55rem 0.85rem !important;
  text-align: center !important;

  border-radius: 999px !important;

  transition: background-color 0.15s ease, color 0.15s ease, transform 0.15s ease, border-color 0.15s ease;
}

/* Light tabs */
[data-md-color-scheme="default"] .md-tabs__link {
  color: var(--ink-muted) !important;
  background: rgba(255, 255, 255, 0.45) !important;
  border: 1px solid rgba(31, 41, 55, 0.10) !important;
  backdrop-filter: blur(6px) !important;
}

/* Dark tabs */
[data-md-color-scheme="slate"] .md-tabs__link {
  color: rgba(230, 244, 241, 0.80) !important;
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(230, 244, 241, 0.14) !important;
  backdrop-filter: blur(6px) !important;
}

.md-tabs__link:hover {
  transform: translateY(-1px);
}

/* Hover colors */
[data-md-color-scheme="default"] .md-tabs__link:hover {
  background: rgba(255, 255, 255, 0.55) !important;
  border-color: rgba(31, 41, 55, 0.16) !important;
  color: var(--ink) !important;
}

[data-md-color-scheme="slate"] .md-tabs__link:hover {
  background: rgba(255, 255, 255, 0.10) !important;
  border-color: rgba(230, 244, 241, 0.22) !important;
  color: #e6f4f1 !important;
}

/* Active tab */
[data-md-color-scheme="default"] .md-tabs__link--active {
  background: rgba(255, 255, 255, 0.70) !important;
  border-color: rgba(15, 118, 110, 0.25) !important;
  color: var(--accent) !important;
  font-weight: 600 !important;
  border-bottom: 0 !important;
}

[data-md-color-scheme="slate"] .md-tabs__link--active {
  background: rgba(15, 118, 110, 0.18) !important;
  border-color: rgba(127, 205, 184, 0.30) !important;
  color: #e6f4f1 !important;
  font-weight: 700 !important;
  border-bottom: 0 !important;
}

@media (max-width: 720px) {
  .md-tabs__list {
    justify-content: flex-start !important;
  }
}

/* =======================================================
   LEFT SIDEBAR (PRIMARY NAV)
   ======================================================= */
.md-nav--primary .md-nav__link {
  background: transparent !important;
  color: inherit !important;
  font-weight: 400 !important;
  border-radius: 8px;
}

.md-nav--primary .md-nav__item--section > .md-nav__title,
.md-nav--primary .md-nav__item--section > .md-nav__link {
  display: flex !important;
  align-items: center !important;
  width: calc(100% - 16px) !important;
  margin: 8px !important;
  padding: 8px 12px !important;
  border-radius: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.2px !important;
  box-sizing: border-box !important;
}

/* Light section header gradient */
[data-md-color-scheme="default"] .md-nav--primary .md-nav__item--section > .md-nav__title,
[data-md-color-scheme="default"] .md-nav--primary .md-nav__item--section > .md-nav__link {
  background: linear-gradient(90deg, var(--mint-1), var(--mint-2)) !important;
  color: var(--ink) !important;
}

/* Dark section header */
[data-md-color-scheme="slate"] .md-nav--primary .md-nav__item--section > .md-nav__title,
[data-md-color-scheme="slate"] .md-nav--primary .md-nav__item--section > .md-nav__link {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(230, 244, 241, 0.14) !important;
  color: #e6f4f1 !important;
}

.md-nav--primary .md-nav__item--section > .md-nav__title .md-nav__button {
  margin-left: auto !important;
  background: transparent !important;
  color: inherit !important;
  opacity: 1 !important;
}

.md-nav--primary .md-nav__link--active {
  background-color: rgba(152, 226, 198, 0.20) !important;
  color: var(--accent) !important;
  font-weight: 700 !important;
}

/* Dark active link */
[data-md-color-scheme="slate"] .md-nav--primary .md-nav__link--active {
  background: rgba(15, 118, 110, 0.18) !important;
  color: #e6f4f1 !important;
}

/* =======================================================
   RIGHT SIDEBAR (TOC)
   ======================================================= */
.md-nav--secondary {
  padding-top: 12px;
}

.md-nav--secondary .md-nav__title {
  border-radius: 10px;
  padding: 10px 12px !important;
  margin-bottom: 10px !important;
  font-weight: 700 !important;
}

/* Light TOC title */
[data-md-color-scheme="default"] .md-nav--secondary .md-nav__title {
  background: linear-gradient(90deg, var(--mint-1), var(--mint-2)) !important;
  color: var(--ink) !important;
}

/* Dark TOC title */
[data-md-color-scheme="slate"] .md-nav--secondary .md-nav__title {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(230, 244, 241, 0.14) !important;
  color: #e6f4f1 !important;
}

.md-nav--secondary .md-nav__link {
  border-radius: 8px;
  padding: 6px 10px;
}

.md-nav--secondary .md-nav__link:hover {
  background-color: rgba(187, 247, 208, 0.10);
}

.md-nav--secondary .md-nav__link--active {
  background-color: rgba(152, 226, 198, 0.20) !important;
  color: var(--accent) !important;
  font-weight: 700 !important;
}

[data-md-color-scheme="slate"] .md-nav--secondary .md-nav__link--active {
  background: rgba(15, 118, 110, 0.18) !important;
  color: #e6f4f1 !important;
}

.md-nav--secondary .md-nav__link--active * {
  color: inherit !important;
}

/* =======================================================
   CUSTOM FOOTER (MATCH COLOR SCHEME)
   - Light: mint gradient
   - Dark: dark gradient
   ======================================================= */
.custom-footer {
  padding: 56px 16px !important;
  border-top: 1px solid rgba(31, 41, 55, 0.10) !important;
}

[data-md-color-scheme="default"] .custom-footer {
  background: linear-gradient(90deg, var(--mint-1), var(--mint-2)) !important;
  color: var(--ink) !important;
}

[data-md-color-scheme="slate"] .custom-footer {
  background: linear-gradient(90deg, var(--dark-1), var(--dark-2)) !important;
  color: #e6f4f1 !important;
  border-top: 1px solid rgba(230, 244, 241, 0.12) !important;
}

.custom-footer__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  gap: 32px;
  grid-template-columns: 1.2fr 1fr;
}

@media (max-width: 900px) {
  .custom-footer__inner {
    grid-template-columns: 1fr;
  }
}

.custom-footer__brand {
  font-size: 1.25rem;
  font-weight: 800;
  letter-spacing: 0.3px;
  opacity: 0.95;
  margin-bottom: 10px;
}

.custom-footer__title {
  font-size: 1.8rem;
  font-weight: 800;
  margin-bottom: 18px;
}

.custom-footer__form {
  display: flex;
  gap: 12px;
  align-items: center;
  max-width: 520px;
  border-radius: 999px;
  padding: 10px;
}

/* Light footer form */
[data-md-color-scheme="default"] .custom-footer__form {
  background: rgba(255, 255, 255, 0.55) !important;
  border: 1px solid rgba(31, 41, 55, 0.14) !important;
}

/* Dark footer form */
[data-md-color-scheme="slate"] .custom-footer__form {
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(230, 244, 241, 0.16) !important;
}

.custom-footer__input {
  flex: 1;
  border: none;
  outline: none;
  background: transparent;
  padding: 10px 14px;
  font-size: 1rem;
}

[data-md-color-scheme="default"] .custom-footer__input {
  color: var(--ink) !important;
}
[data-md-color-scheme="slate"] .custom-footer__input {
  color: #e6f4f1 !important;
}

[data-md-color-scheme="default"] .custom-footer__input::placeholder {
  color: var(--ink-muted) !important;
}
[data-md-color-scheme="slate"] .custom-footer__input::placeholder {
  color: rgba(230, 244, 241, 0.70) !important;
}

.custom-footer__button {
  border: none;
  cursor: pointer;
  border-radius: 999px;
  padding: 10px 16px;
  font-weight: 800;
}

/* Light footer button */
[data-md-color-scheme="default"] .custom-footer__button {
  background: var(--accent) !important;
  color: #ffffff !important;
}

/* Dark footer button */
[data-md-color-scheme="slate"] .custom-footer__button {
  background: var(--mint-1) !important;
  color: #06211d !important;
}

.custom-footer__button:hover {
  opacity: 0.92;
}

.custom-footer__note {
  margin-top: 14px;
  font-size: 0.9rem;
  max-width: 520px;
  opacity: 0.9;
}

[data-md-color-scheme="default"] .custom-footer__note {
  color: var(--ink-muted) !important;
}
[data-md-color-scheme="slate"] .custom-footer__note {
  color: rgba(230, 244, 241, 0.80) !important;
}

.custom-footer__right {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 26px;
}

@media (max-width: 900px) {
  .custom-footer__right {
    grid-template-columns: 1fr;
  }
}

.footer-col__title {
  font-weight: 900;
  margin-bottom: 10px;
  font-size: 1.05rem;
}

.footer-link {
  display: block;
  text-decoration: none;
  padding: 6px 0;
}

[data-md-color-scheme="default"] .footer-link {
  color: var(--ink-muted) !important;
}
[data-md-color-scheme="slate"] .footer-link {
  color: rgba(230, 244, 241, 0.78) !important;
}

.footer-link:hover {
  text-decoration: underline;
}

[data-md-color-scheme="default"] .footer-link:hover {
  color: var(--ink) !important;
}
[data-md-color-scheme="slate"] .footer-link:hover {
  color: #e6f4f1 !important;
}

.home-hero{
  margin: 0 0 18px 0;
}
/* =========================
   HOME HERO (MINT)
   - same layout as CS330
   ========================= */

.home-hero__text{
  border-radius: 18px;
  padding: 22px 22px;

  /* mint border like your theme */
  border: 1px solid rgba(15, 118, 110, 0.20);

  /* light mint card */
  background:
    radial-gradient(800px 240px at 20% 0%, rgba(127, 205, 184, 0.26), transparent 60%),
    linear-gradient(180deg, rgba(230, 244, 241, 0.92), rgba(230, 244, 241, 0.70));

  box-shadow: 0 12px 30px rgba(2, 6, 23, 0.06);
}

/* Better spacing/typography inside the hero */
.home-hero__text h1{
  margin-top: 0 !important;
}

/* Keep hero paragraph readable like CS330 */
.home-hero__text p{
  max-width: 90ch;
}

/* Buttons look like a "pair" */
.home-hero__text .md-button{
  margin-right: 10px;
  margin-top: 6px;
}

/* Dark mode version (mint glow, dark surface) */
[data-md-color-scheme="slate"] .home-hero__text{
  border: 1px solid rgba(230, 244, 241, 0.16);

  background:
    radial-gradient(800px 240px at 20% 0%, rgba(127, 205, 184, 0.18), transparent 60%),
    linear-gradient(180deg, rgba(15, 26, 46, 0.78), rgba(11, 18, 32, 0.92));

  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.30);
}
/* =======================================================
   HEADER + FOOTER REDESIGN V3 (EDGY GREEN)
   ======================================================= */
:root {
  --hf-navy-1: #0f5132;
  --hf-navy-2: #1f7a4d;
  --hf-deep-1: #0a3d28;
  --hf-deep-2: #145a3b;
  --hf-surface: rgba(255, 255, 255, 0.1);
  --hf-surface-strong: rgba(255, 255, 255, 0.2);
  --hf-border: rgba(153, 220, 182, 0.42);
  --hf-text: #ecfff3;
  --hf-text-muted: rgba(236, 255, 246, 0.82);
  --hf-accent: #b8f28a;
  --hf-accent-ink: #163116;
}

[data-md-color-scheme="default"] .md-header,
[data-md-color-scheme="default"] .md-tabs,
[data-md-color-scheme="slate"] .md-header,
[data-md-color-scheme="slate"] .md-tabs {
  background:
    linear-gradient(132deg, rgba(9, 44, 28, 0.92), rgba(19, 92, 57, 0.92)),
    repeating-linear-gradient(
      125deg,
      rgba(190, 255, 214, 0.06) 0 8px,
      rgba(190, 255, 214, 0) 8px 16px
    ) !important;
  border-bottom: 1px solid var(--hf-border) !important;
}

[data-md-color-scheme="slate"] .md-header,
[data-md-color-scheme="slate"] .md-tabs {
  background:
    linear-gradient(132deg, rgba(5, 28, 17, 0.96), rgba(15, 70, 44, 0.92)),
    repeating-linear-gradient(
      125deg,
      rgba(187, 255, 210, 0.05) 0 8px,
      rgba(187, 255, 210, 0) 8px 16px
    ) !important;
}

.md-header__title .md-header__ellipsis,
.md-header__topic .md-ellipsis,
.md-header .md-header__button,
.md-header .md-header__button * {
  color: var(--hf-text) !important;
  opacity: 1 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.3);
}

[data-md-color-scheme="default"] .md-header__title .md-ellipsis,
[data-md-color-scheme="slate"] .md-header__title .md-ellipsis {
  color: #f3fff8 !important;
  font-weight: 800;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
}

.md-header .md-search__label {
  border: 1px solid var(--hf-border) !important;
  background: var(--hf-surface) !important;
  border-radius: 6px !important;
  clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 50%, calc(100% - 14px) 100%, 0 100%);
}

.md-header .md-search__label:hover {
  background: var(--hf-surface-strong) !important;
}

.md-header .md-search__input,
.md-header .md-search__input::placeholder,
.md-header .md-search__icon,
.md-header .md-search__label span {
  color: var(--hf-text) !important;
  opacity: 1 !important;
}

.md-header .md-search--active .md-search__label {
  box-shadow: 0 0 0 3px rgba(184, 242, 138, 0.28) !important;
  border-color: rgba(184, 242, 138, 0.9) !important;
}

.md-tabs__link {
  color: #f4fff8 !important;
  background: rgba(255, 255, 255, 0.18) !important;
  border: 1px solid rgba(186, 240, 209, 0.52) !important;
  border-radius: 0 !important;
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 100%, 0 100%);
  padding: 0.6rem 1rem !important;
}

.md-tabs__link:hover,
.md-tabs__link--active {
  color: #ffffff !important;
  background: rgba(184, 242, 138, 0.32) !important;
  border-color: rgba(184, 242, 138, 0.8) !important;
  transform: translateY(-1px);
}

[data-md-color-scheme="default"] .md-tabs__link,
[data-md-color-scheme="slate"] .md-tabs__link {
  color: #f4fff8 !important;
}

.header-utility {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.header-toggle,
.header-badge,
.header-cta {
  min-height: 36px;
  border-radius: 0 !important;
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 100%, 0 100%);
}

.header-toggle {
  min-width: 50px;
  padding: 0 11px;
  border: 1px solid rgba(184, 232, 198, 0.56);
  background: rgba(255, 255, 255, 0.18);
  color: var(--hf-text);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  cursor: pointer;
}

.header-toggle:hover {
  background: rgba(255, 255, 255, 0.19);
}

.header-toggle[aria-pressed="true"] {
  background: rgba(184, 242, 138, 0.28);
  border-color: rgba(184, 242, 138, 0.9);
}

.header-badge {
  align-items: center;
  display: inline-flex;
  padding: 0 14px 0 12px;
  border: 1px solid rgba(174, 238, 202, 0.5);
  background: rgba(255, 255, 255, 0.2);
  color: var(--hf-text);
  font-size: 0.73rem;
  text-transform: uppercase;
  letter-spacing: 0.11em;
  font-weight: 800;
}

.header-cta {
  margin-left: 0 !important;
  padding: 0 14px !important;
  border: 1px solid rgba(184, 242, 138, 0.74) !important;
  background: linear-gradient(135deg, #b8f28a, #8ed95b) !important;
  color: #133318 !important;
  box-shadow: 0 10px 20px rgba(7, 31, 18, 0.35) !important;
  font-weight: 900 !important;
  letter-spacing: 0.03em;
}

.header-cta:hover {
  transform: translateY(-1px) !important;
  filter: brightness(1.03);
}

.header-cta:focus-visible,
.header-toggle:focus-visible,
.md-header .md-search__label:focus-within,
.custom-footer__input:focus-visible,
.custom-footer__button:focus-visible,
.footer-link:focus-visible {
  outline: 3px solid rgba(184, 242, 138, 0.92) !important;
  outline-offset: 2px;
}

@media (max-width: 960px) {
  .header-toggle,
  .header-badge {
    display: none;
  }
}

@media (max-width: 600px) {
  .header-utility {
    gap: 6px;
  }

  .header-cta {
    font-size: 0.73rem;
    padding: 0 10px !important;
  }
}

.custom-footer {
  position: relative;
  overflow: hidden;
  padding: 68px 16px 34px !important;
  border-top: 1px solid rgba(150, 208, 173, 0.42) !important;
  background:
    linear-gradient(138deg, rgba(8, 49, 30, 0.96), rgba(19, 92, 57, 0.94)),
    repeating-linear-gradient(
      130deg,
      rgba(183, 255, 207, 0.05) 0 10px,
      rgba(183, 255, 207, 0) 10px 22px
    ) !important;
  color: var(--hf-text) !important;
}

[data-md-color-scheme="default"] .custom-footer {
  background:
    linear-gradient(138deg, rgba(12, 65, 41, 0.96), rgba(27, 114, 70, 0.92)),
    repeating-linear-gradient(
      130deg,
      rgba(183, 255, 207, 0.05) 0 10px,
      rgba(183, 255, 207, 0) 10px 22px
    ) !important;
}

.custom-footer::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(110deg, rgba(184, 242, 138, 0.13), transparent 32%),
    linear-gradient(290deg, rgba(184, 242, 138, 0.1), transparent 36%);
  pointer-events: none;
}

.custom-footer__inner {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  gap: 28px;
  grid-template-columns: minmax(300px, 1.1fr) minmax(320px, 1fr);
}

.custom-footer__left {
  border: 1px solid rgba(170, 229, 193, 0.45);
  background: rgba(6, 31, 19, 0.4);
  padding: 18px;
  clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 0 100%);
}

.custom-footer__brand {
  color: #ffffff;
  font-weight: 900;
  letter-spacing: 0.02em;
  margin-bottom: 8px;
}

.custom-footer__kicker {
  display: inline-block;
  margin-bottom: 10px;
  padding: 0.18rem 0.55rem;
  font-size: 0.7rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #102d17;
  background: var(--hf-accent);
  font-weight: 900;
  clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 100%, 0 100%);
}

.custom-footer__title {
  font-size: clamp(1.65rem, 2.7vw, 2.35rem);
  line-height: 1.06;
  margin: 0 0 10px;
  color: #ffffff;
}

.custom-footer__subtitle {
  max-width: 52ch;
  color: #effff5;
  margin-bottom: 14px;
}

.custom-footer__form {
  background: rgba(255, 255, 255, 0.2) !important;
  border: 1px solid rgba(199, 245, 218, 0.65) !important;
  border-radius: 0 !important;
  padding: 8px;
  gap: 8px;
  clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 0 100%);
}

.custom-footer__input {
  color: #f5fbff !important;
  outline: none;
  font-weight: 600;
}

.custom-footer__input::placeholder {
  color: rgba(236, 255, 246, 0.95) !important;
}

.custom-footer__button {
  border-radius: 0 !important;
  background: linear-gradient(135deg, #b8f28a, #8ed95b) !important;
  color: #133318 !important;
  border: 1px solid rgba(184, 242, 138, 0.64);
  font-weight: 900;
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 100%, 0 100%);
}

.custom-footer__button:hover {
  transform: translateY(-1px);
}

.custom-footer__note {
  color: #ecfff3 !important;
  max-width: 42ch;
}

.custom-footer__right {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px 14px;
}

.footer-col--panel {
  border: 1px solid rgba(186, 240, 209, 0.56);
  background: rgba(8, 36, 23, 0.44);
  padding: 12px 12px 10px;
  clip-path: polygon(0 0, calc(100% - 11px) 0, 100% 100%, 0 100%);
}

.footer-col__title {
  color: #ffffff;
  margin-bottom: 6px;
  font-weight: 900;
  letter-spacing: 0.01em;
}

.footer-link {
  color: #f2fff7 !important;
}

[data-md-color-scheme="default"] .custom-footer .footer-link,
[data-md-color-scheme="slate"] .custom-footer .footer-link,
[data-md-color-scheme="default"] .custom-footer .custom-footer__note,
[data-md-color-scheme="slate"] .custom-footer .custom-footer__note {
  color: #f2fff7 !important;
}

.footer-link:hover {
  color: #ffffff !important;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
}

.sr-only {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

@media (max-width: 980px) {
  .custom-footer__inner {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .custom-footer {
    padding: 50px 14px 26px !important;
  }

  .custom-footer__left {
    padding: 14px;
  }

  .custom-footer__form {
    flex-direction: column;
    align-items: stretch;
    clip-path: none;
  }

  .custom-footer__button {
    width: 100%;
    clip-path: none;
  }

  .custom-footer__right {
    grid-template-columns: 1fr;
  }

  .footer-col--panel,
  .header-toggle,
  .header-badge,
  .header-cta {
    clip-path: none;
  }
}

@media (min-width: 76.25em) {
  body:not(.sidebar-nav-collapsed) .md-sidebar--primary {
    display: block !important;
  }

  body:not(.sidebar-toc-collapsed) .md-sidebar--secondary {
    display: block !important;
  }

  body.sidebar-nav-collapsed .md-sidebar--primary {
    display: none !important;
  }

  body.sidebar-toc-collapsed .md-sidebar--secondary {
    display: none !important;
  }

  body.sidebar-nav-collapsed .md-main__inner {
    grid-template-columns: 0 minmax(0, 1fr) 13rem;
  }

  body.sidebar-toc-collapsed .md-main__inner {
    grid-template-columns: 15rem minmax(0, 1fr) 0;
  }

  body.sidebar-nav-collapsed.sidebar-toc-collapsed .md-main__inner {
    grid-template-columns: 0 minmax(0, 1fr) 0;
  }
}

/* =======================================================
   PHASE PAGE REFRESH (SIMPLE, FUN, FRESH)
   ======================================================= */
.phase-refresh {
  margin-top: 0.5rem;
}

.phase-refresh > h2,
.phase-refresh > h3 {
  letter-spacing: 0.01em;
}

.phase-refresh > h2 {
  margin-top: 2rem;
  padding: 0.45rem 0.75rem;
  border-left: 4px solid #34a853;
  background: linear-gradient(90deg, rgba(52, 168, 83, 0.14), rgba(52, 168, 83, 0.04));
  border-radius: 8px;
}

.phase-refresh > h3 {
  margin-top: 1.1rem;
  color: #156b3f;
}

.phase-refresh p,
.phase-refresh li {
  line-height: 1.65;
}

.phase-refresh table {
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 8px 22px rgba(15, 81, 50, 0.08);
}

.phase-refresh pre {
  border-radius: 10px;
  border: 1px solid rgba(31, 122, 77, 0.25);
}

.phase-refresh hr {
  border: 0;
  height: 1px;
  margin: 1.3rem 0;
  background: linear-gradient(90deg, rgba(31, 122, 77, 0), rgba(31, 122, 77, 0.45), rgba(31, 122, 77, 0));
}

@media (min-width: 76.25em) {
  body.sidebar-nav-collapsed .md-content,
  body.sidebar-toc-collapsed .md-content,
  body.sidebar-nav-collapsed.sidebar-toc-collapsed .md-content {
    max-width: none;
  }

  body.sidebar-nav-collapsed .md-content__inner,
  body.sidebar-toc-collapsed .md-content__inner,
  body.sidebar-nav-collapsed.sidebar-toc-collapsed .md-content__inner {
    max-width: none;
    margin: 0;
  }
}
