.guides-hero,
.guide-article-hero {
  background: linear-gradient(135deg, #0f3b36 0%, #1d5b51 100%);
  color: #fff;
  padding: 72px 0 78px;
}

.guides-hero h1,
.guide-article-hero h1 {
  color: #fff;
  font-size: clamp(36px, 6vw, 60px);
  font-weight: 700;
  letter-spacing: -.025em;
  line-height: 1.08;
  margin: 10px 0 20px;
}

.guide-article-hero h1 {
  font-size: clamp(34px, 5vw, 52px);
}

.guides-hero > .container > p:not(.guides-eyebrow),
.guide-article-hero__summary {
  color: #dcefe9;
  font-size: 19px;
  line-height: 1.6;
  max-width: 760px;
}

.guides-eyebrow {
  color: #75d0b8;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .15em;
  margin: 0;
  text-transform: uppercase;
}

.guides-breadcrumb {
  align-items: center;
  color: #c9d6d2;
  display: flex;
  flex-wrap: wrap;
  font-size: 14px;
  gap: 9px;
  margin-bottom: 28px;
}

.guides-breadcrumb a {
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.guides-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 30px;
}

.guide-button {
  background: #47ae94;
  border: 2px solid #47ae94;
  border-radius: 6px;
  color: #fff;
  display: inline-block;
  font-weight: 700;
  padding: 13px 20px;
  text-align: center;
  transition: background .18s ease, border-color .18s ease, color .18s ease;
}

.guide-button:hover,
.guide-button:focus {
  background: #2f8c74;
  border-color: #2f8c74;
  color: #fff;
}

.guide-button--outline {
  background: transparent;
  border-color: #8bd9c4;
}

.guide-button--light {
  background: #fff;
  border-color: #fff;
  color: #0f3b36;
}

.guide-button--light:hover,
.guide-button--light:focus {
  background: #dcefe9;
  border-color: #dcefe9;
  color: #0f3b36;
}

.guides-index {
  background: #f6f9f8;
  padding: 70px 0 85px;
}

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

.guide-card {
  background: #fff;
  border: 1px solid #dce7e3;
  border-radius: 10px;
  box-shadow: 0 8px 30px rgba(15, 59, 54, .06);
  display: flex;
  flex-direction: column;
  min-height: 330px;
  padding: 30px;
}

.guide-card__number {
  color: #47ae94;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .16em;
}

.guide-card h2 {
  font-size: 23px;
  line-height: 1.3;
  margin: 18px 0 15px;
}

.guide-card h2 a {
  color: #0f3b36;
}

.guide-card > p:not(.guide-card__number) {
  color: #667a75;
  line-height: 1.65;
}

.guide-card__link {
  color: #2f8c74;
  font-weight: 700;
  margin-top: auto;
  padding-top: 22px;
}

.guide-container {
  max-width: 900px;
}

.guide-article-meta {
  color: #b9cdc7;
  font-size: 14px;
  margin-top: 24px;
}

.guide-article {
  background: #fff;
  padding: 58px 0 85px;
}

.guide-article p,
.guide-article li {
  color: #334743;
  font-size: 17px;
  line-height: 1.76;
}

.guide-article h2 {
  color: #0f3b36;
  font-size: 29px;
  line-height: 1.28;
  margin: 50px 0 16px;
}

.guide-article h3 {
  color: #0f3b36;
  font-size: 22px;
  line-height: 1.35;
  margin: 36px 0 13px;
}

.guide-direct {
  border-left: 5px solid #47ae94;
  color: #0f3b36 !important;
  font-size: 20px !important;
  font-weight: 500;
  line-height: 1.65 !important;
  margin: 0 0 34px;
  padding: 7px 0 7px 22px;
}

.guide-table {
  border: 1px solid #dce7e3;
  margin: 22px 0 28px;
}

.guide-table th {
  background: #edf7f4;
  color: #0f3b36;
  font-weight: 700;
}

.guide-table td,
.guide-table th {
  border-color: #dce7e3 !important;
  font-size: 15px;
  padding: 13px 14px !important;
  vertical-align: middle !important;
}

.guide-reference {
  color: #237760;
  font-weight: 700;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.guide-reference--help::after {
  content: " · consultar";
  font-size: 11px;
  font-weight: 600;
  text-decoration: none;
}

.guide-note {
  background: #f1f7f5;
  border: 1px solid #c9ded8;
  border-radius: 8px;
  color: #334743;
  font-size: 16px;
  line-height: 1.65;
  margin: 30px 0;
  padding: 20px 22px;
}

.guide-parts {
  background: #f8faf9;
  border-radius: 6px;
  font-size: 15px !important;
  padding: 16px 18px;
}

.guide-related {
  border-top: 1px solid #dce7e3;
  margin-top: 54px;
  padding-top: 4px;
}

.guide-related ul {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  list-style: none;
  margin: 0;
  padding: 0;
}

.guide-related a {
  background: #f1f7f5;
  border-radius: 6px;
  color: #17614f;
  display: block;
  font-weight: 700;
  height: 100%;
  padding: 15px 17px;
}

.guide-service {
  background: #0f3b36;
  border-radius: 10px;
  color: #fff;
  margin-top: 48px;
  padding: 32px;
}

.guide-service h2 {
  color: #fff;
  margin: 0 0 17px;
}

.guide-service p {
  color: #dcefe9;
}

.guide-service .guide-button {
  margin-top: 9px;
}

.guide-back {
  margin-top: 35px;
}

.guide-back a {
  color: #2f8c74;
  font-weight: 700;
}

@media (max-width: 991px) {
  .guides-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767px) {
  .guides-hero,
  .guide-article-hero { padding: 50px 0 55px; }
  .guides-grid,
  .guide-related ul { grid-template-columns: 1fr; }
  .guides-index { padding: 45px 0 60px; }
  .guide-card { min-height: 0; padding: 24px; }
  .guide-article { padding: 38px 0 60px; }
  .guide-article h2 { font-size: 25px; margin-top: 40px; }
  .guide-direct { font-size: 18px !important; padding-left: 17px; }
  .guide-service { padding: 24px 20px; }
  .guide-button { width: 100%; }
}

/* Identificador interactivo, completamente aislado del resto del sitio. */
.identifier-page {
  background: #f6f9f8;
  padding: 46px 0 80px;
}

.identifier-breadcrumb {
  align-items: center;
  color: #657a75;
  display: flex;
  font-size: 14px;
  gap: 9px;
  margin: 0 auto 28px;
  max-width: 700px;
}

.identifier-breadcrumb a { color: #237760; }

.env-identifier {
  --env-deep: #0f3b36;
  --env-green: #47ae94;
  --env-green-dark: #2f8c74;
  --env-pale: #dcefe9;
  --env-stone: #71857f;
  --env-silver: #c9d6d2;
  color: var(--env-deep);
  font-size: 17px;
  line-height: 1.55;
  margin: 0 auto;
  max-width: 700px;
}

.env-identifier *,
.env-identifier *::before,
.env-identifier *::after { box-sizing: border-box; }

.env-eyebrow {
  color: var(--env-stone);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .16em;
  margin-bottom: 10px;
  text-transform: uppercase;
}

.env-title {
  color: var(--env-deep);
  font-size: clamp(30px, 6vw, 46px);
  font-weight: 700;
  letter-spacing: -.025em;
  line-height: 1.08;
  margin-bottom: 12px;
}

.env-sub {
  color: var(--env-stone);
  font-size: 17px;
  margin-bottom: 28px;
  max-width: 62ch;
}

.env-track { display: flex; gap: 5px; margin-bottom: 27px; }
.env-track i { background: var(--env-silver); border-radius: 2px; flex: 1; height: 4px; transition: background .25s ease; }
.env-track i.on { background: var(--env-green); }

.env-card {
  background: #fff;
  border: 1px solid var(--env-silver);
  border-radius: 14px;
  box-shadow: 0 12px 40px rgba(15, 59, 54, .07);
  padding: 30px 27px;
}

.env-q { color: var(--env-deep); font-size: 22px; font-weight: 700; line-height: 1.28; margin-bottom: 7px; }
.env-hint { color: var(--env-stone); font-size: 15px; margin-bottom: 19px; }
.env-opt {
  background: #f6f9f8;
  border: 1.5px solid var(--env-silver);
  border-radius: 9px;
  color: var(--env-deep);
  cursor: pointer;
  display: block;
  font: inherit;
  margin-bottom: 9px;
  padding: 14px 16px;
  text-align: left;
  transition: background .16s ease, border-color .16s ease, transform .16s ease;
  width: 100%;
}
.env-opt:hover,
.env-opt:focus-visible { background: var(--env-pale); border-color: var(--env-green); outline: none; }
.env-opt:active { transform: scale(.99); }
.env-opt strong { display: block; font-weight: 700; }
.env-opt span { color: var(--env-stone); display: block; font-size: 14px; margin-top: 2px; }
.env-back { background: none; border: 0; color: var(--env-stone); cursor: pointer; font: inherit; font-size: 15px; margin-top: 12px; padding: 7px 0; text-decoration: underline; text-underline-offset: 3px; }
.env-back:hover,
.env-back:focus-visible { color: var(--env-deep); }
.env-help { color: var(--env-stone); font-size: 15px; line-height: 1.5; margin: 18px 0 0; text-align: center; }
.env-help a { color: var(--env-green-dark); font-weight: 700; }
.env-found { color: var(--env-green-dark); font-size: 11px; font-weight: 700; letter-spacing: .16em; margin-bottom: 8px; text-transform: uppercase; }
.env-model { color: var(--env-deep); font-size: clamp(28px, 5vw, 38px); font-weight: 700; letter-spacing: -.025em; line-height: 1.1; margin-bottom: 9px; }
.env-model:focus { outline: 2px solid transparent; }
.env-note { background: var(--env-pale); border-radius: 9px; color: var(--env-deep); font-size: 15px; margin: 17px 0 24px; padding: 14px 16px; }
.env-cycle,
.env-parts { margin-top: 27px; }
.env-legend { color: var(--env-stone); font-size: 11px; font-weight: 700; letter-spacing: .14em; margin-bottom: 12px; text-transform: uppercase; }
.env-years { display: grid; gap: 8px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.env-yr { background: #fff; border: 1.5px solid var(--env-silver); border-radius: 9px; color: var(--env-deep); display: block; padding: 14px 13px; text-decoration: none; transition: border-color .14s ease, transform .14s ease; }
.env-yr:hover,
.env-yr:focus-visible { border-color: var(--env-green); color: var(--env-deep); transform: translateY(-2px); }
.env-yr.big { background: var(--env-pale); border-color: var(--env-green); }
.env-yr em { color: var(--env-stone); display: block; font-size: 10px; font-style: normal; font-weight: 700; letter-spacing: .1em; margin-bottom: 5px; text-transform: uppercase; }
.env-yr b { display: block; font-size: 18px; }
.env-yr span { color: var(--env-stone); display: block; font-size: 13px; line-height: 1.35; margin-top: 3px; }
.env-row { align-items: center; border-bottom: 1px solid var(--env-silver); display: flex; gap: 9px; }
.env-row:last-child { border-bottom: 0; }
.env-row-main { align-items: baseline; color: var(--env-deep); display: flex; flex: 1; gap: 13px; justify-content: space-between; padding: 13px 8px 13px 0; text-decoration: none; }
.env-row-main:hover,
.env-row-main:focus-visible { color: var(--env-green-dark); }
.env-row-main p { font-size: 15px; margin: 0; }
.env-row-main p span { color: var(--env-stone); display: block; font-size: 13px; margin-top: 1px; }
.env-ref { color: var(--env-deep); font-size: 15px; white-space: nowrap; }
.env-buy { border: 1.5px solid var(--env-silver); border-radius: 999px; color: var(--env-green-dark); flex: none; font-size: 13px; font-weight: 700; padding: 6px 12px; text-decoration: none; }
.env-buy:hover,
.env-buy:focus-visible { background: var(--env-pale); border-color: var(--env-green); color: var(--env-green-dark); }
.env-cross { background: #fff; border: 1.5px dashed var(--env-green); border-radius: 9px; font-size: 15px; line-height: 1.5; margin-top: 23px; padding: 15px 16px; }
.env-cross a { color: var(--env-green-dark); font-weight: 700; }
.env-serv { background: var(--env-deep); border-radius: 12px; color: #fff; margin-top: 27px; padding: 20px 18px; }
.env-serv .env-legend { color: var(--env-green); }
.env-serv-i { border-bottom: 1px solid rgba(255, 255, 255, .13); padding: 9px 0; }
.env-serv-i:last-child { border-bottom: 0; padding-bottom: 0; }
.env-serv-i b { display: block; font-size: 15px; margin-bottom: 2px; }
.env-serv-i span { color: var(--env-silver); display: block; font-size: 14px; line-height: 1.45; }
.env-cta,
.env-ghost { border-radius: 9px; cursor: pointer; display: block; font: inherit; font-weight: 700; margin-top: 10px; padding: 14px; text-align: center; text-decoration: none; width: 100%; }
.env-cta { background: var(--env-green); border: 1.5px solid var(--env-green); color: #fff; margin-top: 27px; }
.env-cta:hover,
.env-cta:focus-visible { background: var(--env-green-dark); border-color: var(--env-green-dark); color: #fff; }
.env-ghost { background: none; border: 1.5px solid var(--env-silver); color: var(--env-deep); }
.env-ghost:hover,
.env-ghost:focus-visible { border-color: var(--env-stone); color: var(--env-deep); }
.env-step { animation: env-rise .25s ease both; }
@keyframes env-rise { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: none; } }

@media (prefers-reduced-motion: reduce) {
  .env-step { animation: none; }
  .env-identifier * { transition: none !important; }
}

@media (max-width: 575px) {
  .identifier-page { padding: 32px 0 55px; }
  .env-card { padding: 24px 18px; }
  .env-years { grid-template-columns: 1fr; }
  .env-row { align-items: flex-start; flex-wrap: wrap; padding-bottom: 10px; }
  .env-row-main { flex-basis: 100%; padding-bottom: 4px; }
  .env-buy { margin-left: auto; }
}