/* MAPS visual identity: photographic course composition + green MAPS system.
   Applied last. Preserve the course layout; replace aqua as its primary language.
   Colors and idioms are shared with rediseno-ingles: forest, lime, editorial
   contrast, rounded pills, circular arrows and lightweight green surfaces. */
:root {
  --forest:#004b3c; --deep:#003d32; --map-ink:#064535;
  --lime:#b7f46b; --lime-soft:#d7fbb1; --mint:#e6f7da;
  --map-paper:#edf7e7; --map-pale:#f9fff5; --map-line:#cfe4c7;
  --map-muted:#4d7460;
  --teal:var(--forest); --aqua:var(--lime-soft);
  --paper:var(--map-paper); --ink:var(--map-ink); --muted:var(--map-muted);
}
body{background:var(--map-paper);color:var(--map-ink)}
::selection{background:var(--lime);color:var(--deep)}
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline-color:#078a65}

/* Full-bleed composition from the original course; unmistakably MAPS by color/controls. */
.hero.hero-course{background:#023b31;border-radius:0}
.hero.hero-course:before{
  background:
    radial-gradient(ellipse at 18% 18%,rgba(1,85,52,.34),transparent 42%),
    linear-gradient(180deg,rgba(0,40,31,.53) 0%,rgba(0,46,34,.36) 31%,rgba(0,31,24,.65) 90%),
    linear-gradient(96deg,rgba(0,72,50,.55),rgba(0,48,35,.04) 52%,rgba(0,52,39,.26));
}
.hero.hero-course .hero-photo{filter:saturate(.73) contrast(1.06)}
.hero.hero-course .hero-header{z-index:5}
.hero.hero-course .maps-pill{
  background:var(--lime);border:1px solid #e0ffbd;color:#064938;
  box-shadow:0 10px 24px #002e2670;
  font-size:11px;letter-spacing:.105em;
  padding:5px 7px 5px 5px;gap:9px;
  transition:transform .2s;
}
.hero.hero-course .maps-pill b{color:#064938;font-weight:900}
.hero.hero-course .maps-pill .maps-spark{
  background:var(--forest);color:var(--lime);
  border-radius:50%;height:33px;width:33px;font-size:19px;
}
.hero.hero-course .maps-pill>span:last-child{
  display:grid;place-items:center;border:1px solid #185c41a8;
  width:29px;height:29px;border-radius:50%;color:var(--forest);font-size:18px;
}
.hero.hero-course .hero-kicker{
  color:#e1ffd7;padding:8px 14px;background:#003e32a6;
  border:1px solid #d1ffb260;border-radius:99px;backdrop-filter:blur(6px);
}
.hero.hero-course .hero-kicker .signal{background:var(--lime);box-shadow:0 0 0 4px #b7f46b2d}
.hero-kicker-separator{color:var(--lime)}
.hero.hero-course h1{letter-spacing:-.061em;text-shadow:0 9px 35px #001d1963}
.hero-divider{background:var(--lime);width:92px;height:4px;border-radius:10px;opacity:1}
.hero.hero-course .hero-competence{color:#f2fff2}
.hero.hero-course .hero-explore{
  border-radius:999px;padding:6px 7px 6px 25px;gap:24px;
  background:var(--lime);color:var(--deep);font-weight:900;
  border:1px solid #d8ffaf;box-shadow:0 12px 28px #00292052;
}
.hero.hero-course .hero-explore>span{
  display:grid;place-items:center;width:42px;height:42px;
  background:var(--deep);color:var(--lime);border-radius:50%;font-size:22px;
  transition:transform .22s ease;
}
.hero.hero-course .hero-explore:hover{background:#c9ff87;color:var(--deep)}
.hero.hero-course .hero-explore:hover>span{transform:rotate(45deg)}
.hero.hero-course .hero-foot{color:#efffe5}
.hero.hero-course .hero-foot b{color:var(--lime)}

/* Recognizable MAPS ribbon and pill navigation, not a generic aqua band. */
.maps-ribbon{background:var(--forest);color:#e7ffd7;border-top:1px solid #bbfb9540}
.maps-ribbon .ribbon-inner{min-height:67px;gap:12px}
.maps-ribbon .ribbon-inner>span{
  display:inline-flex;align-items:center;white-space:nowrap;
  border:1px solid #b1ec9a66;background:#095e47;
  padding:9px 14px 9px 10px;border-radius:999px;font-size:10px;letter-spacing:.1em;
}
.maps-ribbon .ribbon-inner span b{
  margin-right:10px;display:inline-grid;place-items:center;
  height:25px;min-width:25px;border-radius:50%;background:var(--lime);color:var(--deep);font-size:9px;
}
.maps-ribbon .ribbon-inner>i{height:1px;width:18px;background:#bceea477}
.maps-ribbon .ribbon-inner>strong{color:#cfff9b;font-size:10px;letter-spacing:.11em}
.course-nav{background:#fafff6ed;border-color:var(--map-line)}
.nav-name{color:var(--forest)}.nav-name span{color:#00875f}
.nav-links a{color:#426b53;border:1px solid transparent;transition:background .18s,border-color .18s}
.nav-links a:hover,.nav-links a[aria-current=location]{
  background:#d9f5c5;border-color:#bedfa9;color:var(--forest);border-radius:999px;
}
.nav-progress{border-left-color:#c8dcc4;color:var(--forest)}
.nav-toggle{border-color:#cde0c4}.nav-toggle span{background:var(--forest)}

/* Original intro card, rewritten in MAPS greens and rounded identity details. */
.course-introduction,.course-hub{background:var(--map-paper)}
.introduction-card{background:var(--map-pale);border:1px solid #d6e7cd;box-shadow:0 19px 43px #003c2715}
.intro-overline{color:#07794e}
.intro-head h2{color:var(--forest)}
.intro-title-dot{color:#09a875}
.intro-mark{
  display:inline-flex;align-items:center;gap:7px;background:var(--lime);border-color:#a7e36b;
  color:var(--forest);padding:9px 13px;border-radius:999px;font-size:10px;
}
.intro-mark b{color:var(--deep)}
.intro-text{color:#345746}
.intro-text strong{color:#07543c}
.intro-bottom{border-top-color:#d9e8cf}
.academic-badge{background:#e4f6d9;border-color:#bedfae;color:var(--forest);border-radius:19px}
.academic-badge.accent{background:#d4f4bc;border-color:#b3e293;color:var(--forest)}
.academic-badge .badge-mark{background:var(--forest);color:var(--lime);border-radius:50%;font-size:15px}
.academic-badge.accent .badge-mark{background:#19754d;color:#eaffd7}
.academic-badge b{color:var(--deep)}.academic-badge small{color:#477459}
.intro-action{background:var(--lime);border-color:#a0d867;border-radius:999px;color:var(--deep);padding:6px 7px 6px 19px}
.intro-action>span{background:var(--forest);color:var(--lime);display:grid;place-items:center;width:35px;height:35px;border-radius:50%;font-size:19px}
.intro-action:hover{background:#c9ff87;color:var(--deep)}

/* The original five visual cards remain; MAPS replaces their aqua paintwork. */
.hub-heading h2{color:var(--forest)}
.hub-step{
  border-radius:999px;background:#d9f5c8;border:1px solid #c2e4b0;
  color:#246442;padding:8px 12px;display:flex;align-items:center;gap:8px;
  font-size:9px;font-weight:900;letter-spacing:.055em;
}
.hub-step-star{display:grid;place-items:center;background:var(--forest);color:var(--lime);border-radius:50%;width:23px;height:23px;font-size:14px}
.hub-step i{font-style:normal;color:#4e916b}
.hub-step>span:last-child{font-size:16px;color:#006844}
.hub-card{box-shadow:0 13px 28px #073d2418}
.hub-card:hover,.hub-card:focus-visible{box-shadow:0 22px 45px #003f2830}
.hub-start{background:var(--forest);color:#f6fff3}
.hub-start:before{border-color:#b9eea861;box-shadow:0 0 0 28px #baf69510,0 0 0 67px #baf6950a}
.hub-start .hub-play{background:var(--lime)!important;color:var(--deep)!important;box-shadow:0 9px 26px #00251b29}
.hub-start-title{color:#fafff7}
.hub-start-arrow{color:var(--lime)}
.hub-start-bottom{color:#def4d0;border-top-color:#d0f4b83d}
.hub-tile:nth-child(2){background:#c9f49f;color:var(--forest)}
.hub-tile:nth-child(3){background:#e3f7d4;color:var(--forest)}
.hub-tile:nth-child(4){background:#c8efb4;color:var(--forest)}
.hub-tile:nth-child(5){background:#b7eb94;color:var(--forest)}
.hub-tile:nth-child(6){background:#d9f3cd;color:var(--forest)}
.hub-tile:before{border-color:#347f5152;box-shadow:0 0 0 19px #60975d0d,0 0 0 46px #60975d0d}
.hub-icon{background:#f9fff4;color:var(--forest);border:1px solid #e1f4d2}
.hub-card-number{
  background:var(--forest);color:#ddffba;letter-spacing:.055em;
  font-size:9px;line-height:1.3;border-radius:999px;padding:8px 12px;margin-top:10px;
  width:max-content;max-width:100%;
}
.hub-tile strong{color:var(--forest);font-weight:800}
.hub-card-arrow{
  top:20px;right:20px;width:35px;height:35px;display:grid;place-items:center;
  border:1.3px solid var(--forest);border-radius:50%;
  font-size:20px;color:var(--forest);transition:background .2s,color .2s,transform .2s;
}
.hub-tile:hover .hub-card-arrow{background:var(--forest);color:var(--lime);transform:translate(2px,-2px)}

/* MAPS learning workspace, progressive rather than decorative. */
.learning{background:linear-gradient(180deg,#edf7e7,#f5fbef)}
.learning .eyebrow{color:#15784f}
.learning .eyebrow i{background:#10b771}
.learning-head h2{color:var(--forest)}
.learning-head h2>span{background:#bdf58b;color:var(--forest);border-radius:999px;padding:0 17px 3px}
.learning-head>div:first-child>p{color:#4e745a}
.progress-card{background:#fff;border:1px solid #cae4be;border-radius:26px}
.progress-ring{background:conic-gradient(#0caa73 var(--progress,0%),#e1f1d8 var(--progress,0%))}
.progress-card span{color:#21734b}
.workspace{background:#fff;border-color:#cce2c1;border-radius:30px}
.workspace-lead{background:radial-gradient(ellipse at 95% -10%,#bef293,transparent 54%),linear-gradient(110deg,#e5f9d8,#f6ffee)}
.workspace-lead h3{color:var(--forest)}
.workspace-lead .micro{color:#227a4f}
.workspace-lead .continue-button{
  border-radius:999px;background:var(--forest);color:#f0ffea;
  padding:6px 7px 6px 20px;
}
.workspace-lead .continue-button>span{
  display:grid;place-items:center;width:34px;height:34px;
  border-radius:50%;background:var(--lime);color:var(--deep);
  font-size:18px;transition:transform .2s ease;
}
.workspace-lead .continue-button:hover>span{transform:translate(2px,-2px)}
.workspace-tools label{color:#1d7046}
.search-box:focus-within{border-color:#0d9f69;box-shadow:0 0 0 4px #0fbc751c}
.search-box .icon{color:#188453}
.filters button{border-radius:999px;border-color:#c8e5b7;background:#f3fcee;color:#446c48}
.workspace-tools .filters button[aria-pressed=true]{background:var(--forest);border-color:var(--forest);color:#eeffe3}
.map-heading h3{color:var(--forest)}
.map-heading h3 em{color:#198e5b}
.topic-card{border-color:#b7dba3;box-shadow:0 15px 29px #1e492019}
.topic-card.topic-1{background:#c9f39c;border-color:#b8e284}
.topic-card.topic-2{background:#e5f9d3;color:var(--forest);border-color:#cde8b8}
.topic-card.topic-3{background:#d5f2bd;border-color:#bfe2a5}
.topic-card.topic-4{background:#c3edac;border-color:#aedc90}
.topic-card.topic-5{background:#f0fae5;border-color:#d4e8bf}
.topic-card:after{border-color:#297f4c35;box-shadow:0 0 0 40px #539d3808}
.topic-card.topic-2:after{border-color:#2b824638}
.topic-top{color:#296745}
.topic-status,.topic-card.topic-2 .topic-status{color:#4b7b4f}
.topic-card.is-reviewed .topic-status{color:#006a3c}
.topic-symbol,.topic-card.topic-2 .topic-symbol{
  border-color:#e9ffdb;background:#fafff4bf;color:var(--forest);
  border-radius:50%;height:60px;width:60px;
}
.topic-tag,.topic-card.topic-2 .topic-tag{
  width:max-content;max-width:100%;border-radius:999px;
  padding:7px 11px;background:var(--forest);color:#e6ffce;
  font-size:9px;letter-spacing:.07em;
}
.topic-body h4{color:var(--forest)}
.topic-body p,.topic-card.topic-2 .topic-body p{color:#487051}
.topic-bottom,.topic-card.topic-2 .topic-bottom{border-top-color:#28774437;color:var(--forest)}
.circle-arrow{background:var(--forest);border-color:var(--forest);color:var(--lime);border-radius:50%}
.topic-card:hover .circle-arrow{transform:translate(2px,-2px)}
.map-footer{color:#476c4d}.map-footer .signal{background:#0eb276}

/* Stackable achievements, coding practice and course details share the same palette. */
.accreditation{background:#f7fbf3}
.credential-card{background:linear-gradient(125deg,var(--forest),#0e7550);color:#f3ffe8}
.credential-card:before{border-color:#b1ff8070;box-shadow:0 0 0 70px #b1ff800b,0 0 0 140px #b1ff8008}
.credential-top,.credential-main>.micro{color:#d0f7ae}
.credential-star{color:var(--lime)}
.credential-main h2{color:#fafff6}
.credential-main h2 em{color:var(--lime)}
.credential-main p{color:#dbf6d2}
.credential-emblem{background:#f5fff1ed;border-color:#f5fff1;color:var(--forest);border-radius:24px}
.credential-icon{background:var(--lime);color:var(--deep);border-radius:50%}
.credential-emblem small,.credential-emblem>div span{color:#416950}
.credential-emblem>b{color:var(--forest);font-size:22px;border:1px solid var(--forest);border-radius:50%;width:34px;height:34px;display:grid;place-items:center}
.credential-disclaimer{color:#c5ecc0}
.feature-tile{background:#d4f5b9}
.feature-lime{background:#eaf9dd}
.feature-tile>span{
  display:inline-flex;border-radius:999px;padding:7px 11px;
  background:#f7fff1;color:#1a7045;border:1px solid #cae8b6;font-weight:900;
}
.feature-symbol{border-radius:50%;background:var(--forest);color:var(--lime)}
.feature-tile h3{color:var(--forest)}
.feature-tile p{color:#456e4f}
.practice{background:linear-gradient(120deg,#073f33,#116746);color:#f9fff3}
.practice-copy h2{color:white}
.practice-copy h2 em{color:var(--lime)}
.practice-copy p{color:#cfebce}
.practice .eyebrow.light{color:#c9f5ba}
.practice .eyebrow.light i{background:var(--lime)}
.practice-label{color:#e9ffde;border-color:#a7db8770;border-radius:999px}
.practice-label .icon{color:var(--lime)}
.exercise{border-color:#a2e18670}
.check-answer{background:var(--lime);border-radius:999px}
.guide{background:#f3faed}
.guide-head h2{color:var(--forest)}
.guide-head h2 span{color:#209157}
.guide-card{background:#fff;border-color:#cee3c1;border-radius:26px}
.guide-card[open]{background:#e1f6cd}
.guide-card summary small{color:#087c4c}
.guide-card p{color:#466d50}
.footer{background:var(--deep)}
.footer-inner b span{color:var(--lime)}
.back-top{border-radius:50%;border-color:#b8e996}
.back-top:hover{background:var(--lime)}
.topic-modal .modal-header{background:#e4f6d1}
.topic-modal .modal-content{background:#fafff7}
.topic-modal .modal-header .micro{color:#147649}
.modal-glyph{background:var(--forest);color:var(--lime)}
.modal-skills span{background:#e0f5d1;border-color:#c2e2ae}
.review-button{background:var(--forest);border-radius:999px}
.review-button.is-reviewed{background:var(--lime);color:var(--forest)}
.topic-modal .modal-footer{background:#eef8e6}

/* Keep brand details legible at narrow widths. */
@media(max-width:1090px){
  .maps-ribbon .ribbon-inner>strong{display:none}
  .hub-step{max-width:100%;white-space:normal}
}
@media(max-width:767px){
  .hero.hero-course .maps-pill{background:var(--lime);color:var(--deep);z-index:6}
  .hero.hero-course .hero-photo{filter:saturate(.75) contrast(1.08)}
  .hero.hero-course .hero-kicker{font-size:8px;padding:7px 10px}
  .hero.hero-course .hero-explore{padding-left:20px}
  .maps-ribbon .ribbon-inner{min-height:68px;gap:6px}
  .maps-ribbon .ribbon-inner>span{padding:6px 8px 6px 5px;font-size:8px}
  .maps-ribbon .ribbon-inner span b{height:20px;min-width:20px;margin-right:5px;font-size:8px}
  .maps-ribbon .ribbon-inner>i{width:5px}
  .hub-step{display:flex;padding:6px 10px;font-size:8px}
  .hub-step-star{width:19px;height:19px}
  .hub-card-number{font-size:8px;padding:6px 9px}
  .hub-card-arrow{width:31px;height:31px;top:16px;right:16px}
  .hub-tile strong{max-width:100%}
  .intro-mark{margin-bottom:18px}
}
@media(max-width:420px){
  .maps-ribbon .ribbon-inner>i{display:none}
  .maps-ribbon .ribbon-inner>span{font-size:7px;gap:0}
  .maps-ribbon .ribbon-inner span b{min-width:18px;height:18px;margin-right:4px}
  .hub-step{font-size:7px;letter-spacing:0}
  .hub-card-number{max-width:100%;font-size:7px}
}
@media(prefers-reduced-motion:reduce){
  .hero.hero-course .hero-explore>span,.hub-card-arrow,.workspace-lead .continue-button>span{transition:none}
}