:root {
  --orange: #EB8720;
  --orange-deep: #C96F14;
  --slate-blue: #3F6BB2;
  --slate-blue-deep: #2E3D5C;
  --moss: #7AA828;
  --amber-soft: #F9E2BF;
  --terracotta: #e57373;
  --surface: #ffffff;
  --line: #EBE5DD;
  --text: #1D1D1B;
  --muted: #666666;
  --font-headline: "Nunito Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-body: "Nunito Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body {
  font-family: var(--font-body);
  color: var(--text);
  background: linear-gradient(180deg, #fff 0%, #fbfaf6 38%, #f7f8fa 100%);
}
a { color: inherit; }

.ant-layout { background: transparent !important; }

.page-container { width: 100%; max-width: 1180px; margin: 0 auto; padding: 0 20px; }

.brand-mark { height: 56px; width: auto; }

.ant-layout-header div:has(> img[alt="Dirección de Sustitución de Cultivos de Uso Ilícito"]) {
  position: static !important;
  transform: none !important;
  order: -1 !important;
}

.hero-home {
  position: relative;
  overflow: hidden;
  min-height: 220px;
  padding: 32px 34px;
  border-radius: 16px;
  background: linear-gradient(135deg, #FFFDF8 0%, #FBF5E8 100%);
  border: 1px solid #F0E7D5;
}
.hero-copy { position: relative; z-index: 2; max-width: 610px; }
.botanical { position: absolute; right: 0; top: 0; width: 44%; height: 100%; opacity: .85; pointer-events: none; }
.sun { position: absolute; right: 18%; top: 32%; width: 92px; height: 92px; border-radius: 50%; background: #F8D99188; }
.hill { position: absolute; bottom: -20px; border-radius: 50% 50% 0 0; filter: saturate(.8); }
.hill-a { right: -5%; width: 95%; height: 45%; background: #DCE6C8; }
.hill-b { right: 22%; width: 75%; height: 34%; background: #C5D49D; }
.stem { position: absolute; right: 14%; bottom: 10%; width: 5px; height: 72%; background: #7AA82888; transform: rotate(-8deg); border-radius: 99px; }
.leaf { position: absolute; width: 70px; height: 32px; border-radius: 100% 0 100% 0; background: #7AA828AA; }
.leaf-1 { right: 14%; top: 18%; transform: rotate(-30deg); }
.leaf-2 { right: 5%; top: 30%; transform: rotate(55deg); }
.leaf-3 { right: 18%; top: 45%; transform: rotate(-18deg); }
.leaf-4 { right: 8%; top: 60%; transform: rotate(48deg); }

.program-hero {
  position: relative; overflow: hidden;
  padding: 26px 28px; border-radius: 20px; color: #fff;
  box-shadow: 0 10px 30px rgba(24, 39, 75, .08);
}
.program-hero.compact { padding: 22px 26px; }
.program-hero--green { background: linear-gradient(120deg, #537A2A 0%, var(--moss) 46%, #9BC24C 100%); }
.program-hero--blue { background: linear-gradient(120deg, var(--slate-blue-deep) 0%, var(--slate-blue) 46%, #6F93CC 100%); }
.program-hero--orange { background: linear-gradient(120deg, var(--orange-deep) 0%, var(--orange) 46%, #F0A94D 100%); }
.program-hero .round-icon { background: #F8FBEF; font-size: 28px; }
.program-hero--green .round-icon { color: var(--moss); }
.program-hero--blue .round-icon { color: var(--slate-blue); }
.program-hero--orange .round-icon { color: var(--orange-deep); }
.hero-decoration { position: absolute; right: 30px; bottom: -24px; font-size: 110px; opacity: .12; color: #fff; }

.round-icon {
  display: grid; place-items: center; flex: 0 0 auto;
  width: 58px; height: 58px; border-radius: 50%;
  background: var(--amber-soft); color: var(--orange-deep); font-size: 26px;
}

.form-art-wrap { position: relative; overflow: hidden; border-radius: 16px; }
.form-art { position: absolute; right: 0; bottom: 0; width: 34%; height: 100%; background: linear-gradient(180deg, transparent 20%, #F7F0DF 100%); pointer-events: none; }
.art-sun { position: absolute; right: 22%; bottom: 24%; width: 70px; height: 70px; border-radius: 50%; background: #F5D99488; }
.art-hill { position: absolute; right: -15%; bottom: -8%; width: 130%; height: 38%; border-radius: 55% 55% 0 0; background: #D9E4C8; }
.art-plant { position: absolute; right: 24%; bottom: 12%; height: 62%; width: 7px; background: #6F8F2F88; border-radius: 99px; transform: rotate(-8deg); }
@media (max-width: 900px) { .form-art { display: none; } }

.ant-steps-item-icon-number { font-weight: 800; }
.ant-steps-item-finish .ant-steps-item-icon,
.ant-steps-item-process .ant-steps-item-icon {
  background: var(--moss) !important;
  border-color: var(--moss) !important;
  color: #fff !important;
}
.ant-steps-item-finish .ant-steps-item-title { color: #4F7A1E !important; }

.ant-layout-footer {
  min-height: 48px;
  padding: 12px 28px !important;
  display: flex;
  align-items: center;
  justify-content: center;
  border-top: 1px solid #E8E1D5 !important;
  background: #FBF8F1 !important;
}

.ant-form-item-label > label { font-weight: 800 !important; }

.ant-collapse-item { border-radius: 8px; overflow: hidden; }
.ant-collapse-header { background: #fff !important; border-radius: 8px !important; }
.ant-collapse-item-active > .ant-collapse-header { border-radius: 8px 8px 0 0 !important; }

.section-heading { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 18px; }
.section-heading--compact { align-items: center; }
.section-heading__icon {
  display: grid; flex: 0 0 46px; place-items: center; width: 46px; height: 46px;
  border-radius: 50%; background: #EEF3FA; color: var(--slate-blue-deep); font-size: 1.15rem;
}
.section-heading--green .section-heading__icon { background: #EDF5E3; color: #4F7A1E; }
.section-heading--orange .section-heading__icon { background: var(--amber-soft); color: var(--orange-deep); }

.ant-btn { font-weight: 800 !important; }

.ant-btn.btn-outline-orange {
  background: #fff !important;
  border-color: #EFC492 !important;
  color: #D87912 !important;
}
.ant-btn.ant-btn.btn-outline-orange:hover:not(:disabled),
.ant-btn.ant-btn.btn-outline-orange:focus:not(:disabled),
.ant-btn.ant-btn.btn-outline-orange:active:not(:disabled) {
  background: var(--amber-soft) !important;
  border-color: #D87912 !important;
  color: #D87912 !important;
  transform: translateY(-1px);
}

.row-actions { display: flex; justify-content: flex-end; gap: 10px; flex-wrap: wrap; }
.row-between { display: flex; justify-content: space-between; align-items: center; gap: 14px; flex-wrap: wrap; }

@media (max-width: 900px) {
  .hero-home { min-height: 260px; }
  .botanical { width: 55%; opacity: .45; }
  .summary-grid-mobile { grid-template-columns: 1fr !important; }
}
@media (max-width: 620px) {
  .hero-home { padding: 24px 20px; }
}
