.doccontrol-landing {
  background: #fff;
}

.dc-hero {
  position: relative;
  overflow: hidden;
  padding: 96px 0 86px;
  color: #fff;
  background:
    radial-gradient(circle at 85% 10%, rgba(25, 194, 255, .2), transparent 30%),
    radial-gradient(circle at 15% 90%, rgba(59, 130, 246, .16), transparent 28%),
    linear-gradient(135deg, var(--azul-900), var(--azul-800));
}

.dc-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .18;
  background-image: linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
  background-size: 48px 48px;
  pointer-events: none;
}

.dc-hero__grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(500px, 1.1fr);
  align-items: center;
  gap: 64px;
}

.dc-wordmark {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 28px 0 20px;
  font-size: 1.05rem;
  font-weight: 800;
}

.dc-wordmark b,
.dc-app-icon {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  color: var(--azul-900);
  background: linear-gradient(135deg, #fff, var(--neon));
  border-radius: 13px;
  font-size: .76rem;
  font-weight: 900;
  box-shadow: 0 8px 28px rgba(25,194,255,.22);
}

.dc-hero h1 {
  max-width: 700px;
  margin-bottom: 24px;
  color: #fff;
  font-size: clamp(2.6rem, 5.6vw, 4.7rem);
  line-height: 1.02;
  letter-spacing: -.06em;
}

.dc-hero__copy > p {
  max-width: 650px;
  color: rgba(255,255,255,.72);
  font-size: 1.08rem;
  line-height: 1.75;
}

.dc-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 13px;
  margin: 32px 0 26px;
}

.dc-btn-light {
  color: #fff;
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.22);
}

.dc-login-link {
  padding: 12px 3px;
  color: #fff;
  font-size: .88rem;
  font-weight: 700;
}

.dc-trust {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  color: rgba(255,255,255,.66);
  font-size: .78rem;
}

.dc-dashboard {
  position: relative;
  padding: 26px;
  color: #fff;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 26px;
  box-shadow: 0 35px 90px rgba(0,0,0,.28);
  backdrop-filter: blur(14px);
}

.dc-dashboard__top {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 22px;
}

.dc-dashboard__top > div {
  display: grid;
  flex: 1;
}

.dc-dashboard__top small {
  color: rgba(255,255,255,.5);
}

.dc-dashboard__top strong,
.dc-dashboard__table b,
.dc-role-list strong,
.dc-final h2 {
  color: #fff;
}

.dc-dashboard__top em {
  padding: 7px 10px;
  color: #a7f3d0;
  background: rgba(16,185,129,.14);
  border-radius: 999px;
  font-size: .66rem;
  font-style: normal;
}

.dc-dashboard__metrics {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin-bottom: 18px;
}

.dc-dashboard__metrics article {
  display: grid;
  gap: 4px;
  padding: 16px;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 15px;
}

.dc-dashboard__metrics small,
.dc-dashboard__metrics span {
  color: rgba(255,255,255,.56);
  font-size: .68rem;
}

.dc-dashboard__metrics strong {
  color: var(--neon);
  font-size: 1.45rem;
}

.dc-dashboard__table {
  overflow: hidden;
  background: rgba(2,18,42,.42);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 17px;
}

.dc-dashboard__table > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 14px 16px;
  border-bottom: 1px solid rgba(255,255,255,.07);
}

.dc-dashboard__table > div:last-child { border: 0; }
.dc-dashboard__table > div > span { display: grid; gap: 3px; }
.dc-dashboard__table small { color: rgba(255,255,255,.48); }
.dc-table-head { color: rgba(255,255,255,.45); font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; }

.dc-status {
  flex: 0 0 auto;
  padding: 6px 9px;
  border-radius: 999px;
  font-size: .66rem;
  font-style: normal;
}

.dc-status.pending { color: #fde68a; background: rgba(245,158,11,.16); }
.dc-status.approved { color: #a7f3d0; background: rgba(16,185,129,.16); }
.dc-status.warning { color: #bae6fd; background: rgba(25,194,255,.16); }

.dc-access {
  padding: 28px 0;
  background: #fff;
  border-bottom: 1px solid var(--cinza-200);
}

.dc-access__inner {
  display: grid;
  grid-template-columns: 1fr 1.3fr auto;
  align-items: center;
  gap: 36px;
}

.dc-access h2 {
  margin-top: 5px;
  color: var(--azul-900);
  font-size: 1.35rem;
}

.dc-access p { color: var(--cinza-500); font-size: .9rem; }

.dc-benefits { background: var(--cinza-50); }

.dc-section-heading {
  max-width: 760px;
  margin-bottom: 42px;
}

.dc-section-heading h2,
.dc-governance h2 {
  margin: 8px 0 16px;
  color: var(--azul-900);
  font-size: clamp(1.8rem, 4vw, 2.8rem);
  line-height: 1.12;
  letter-spacing: -.04em;
}

.dc-section-heading p,
.dc-governance p {
  color: var(--cinza-500);
  line-height: 1.75;
}

.dc-card-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}

.dc-info-card {
  padding: 28px;
  background: #fff;
  border: 1px solid var(--cinza-200);
  border-radius: 18px;
  box-shadow: var(--shadow-sm);
}

.dc-info-card > span,
.dc-steps li > span {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  margin-bottom: 22px;
  color: var(--azul-700);
  background: var(--azul-100);
  border-radius: 11px;
  font-size: .75rem;
  font-weight: 900;
}

.dc-info-card h3,
.dc-steps h3 {
  margin-bottom: 10px;
  color: var(--azul-900);
  font-size: 1.05rem;
}

.dc-info-card p,
.dc-steps p {
  color: var(--cinza-500);
  font-size: .86rem;
  line-height: 1.65;
}

.dc-governance {
  background: #fff;
}

.dc-governance__grid {
  display: grid;
  grid-template-columns: .85fr 1.15fr;
  align-items: center;
  gap: 76px;
}

.dc-governance .btn { margin-top: 26px; }

.dc-role-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
  padding: 24px;
  background: linear-gradient(145deg, var(--azul-900), var(--azul-800));
  border-radius: 24px;
  box-shadow: var(--shadow-xl);
}

.dc-role-list article {
  display: grid;
  gap: 10px;
  min-height: 135px;
  padding: 22px;
  color: #fff;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 16px;
}

.dc-role-list span { color: var(--neon); font-size: .73rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }

.dc-process { background: var(--azul-50); }

.dc-steps {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: steps;
}

.dc-steps li {
  position: relative;
  padding: 28px;
  background: #fff;
  border: 1px solid var(--azul-100);
}

.dc-steps li:first-child { border-radius: 18px 0 0 18px; }
.dc-steps li:last-child { border-radius: 0 18px 18px 0; }

.dc-final {
  padding-top: 30px;
  background: #fff;
}

.dc-final__inner {
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 48px;
  color: #fff;
  background:
    radial-gradient(circle at 90% 0, rgba(25,194,255,.23), transparent 28%),
    linear-gradient(135deg, var(--azul-900), var(--azul-800));
  border-radius: 24px;
}

.dc-final__inner > div:nth-child(2) { flex: 1; }
.dc-final h2 { margin-bottom: 8px; font-size: clamp(1.4rem, 3vw, 2rem); }
.dc-final p { color: rgba(255,255,255,.65); }
.dc-final__actions { display: flex; flex-wrap: wrap; gap: 10px; }

@media (max-width: 1040px) {
  .dc-hero__grid { grid-template-columns: 1fr; }
  .dc-dashboard { max-width: 720px; }
  .dc-card-grid { grid-template-columns: repeat(2, 1fr); }
  .dc-governance__grid { grid-template-columns: 1fr; gap: 42px; }
  .dc-steps { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  .dc-steps li { border-radius: 16px !important; }
}

@media (max-width: 760px) {
  .dc-hero { padding: 70px 0; }
  .dc-hero__grid { gap: 38px; }
  .dc-access__inner { grid-template-columns: 1fr; gap: 16px; }
  .dc-dashboard__metrics { grid-template-columns: 1fr; }
  .dc-card-grid, .dc-role-list, .dc-steps { grid-template-columns: 1fr; }
  .dc-final__inner { align-items: flex-start; flex-direction: column; padding: 32px; }
}

@media (max-width: 480px) {
  .dc-dashboard { padding: 16px; }
  .dc-dashboard__top em { display: none; }
  .dc-dashboard__table > div { align-items: flex-start; }
  .dc-actions .btn { width: 100%; }
  .dc-final__actions, .dc-final__actions .btn { width: 100%; }
}