.inner-main { min-height: 70vh; background: var(--bg); }

.source-content {
  --ink: #07100e;
  --ink-2: #0c1513;
  --ink-3: #111d1a;
  --line: #263934;
  --paper: #f2f6ed;
  --muted: #93a49e;
  --amber: #d8ff3e;
  --amber-dim: #78972a;
  --verde: #55e6b2;
  --rojo: #ff7b75;
  --r: 3px;
  --wrap: min(980px, 100% - 3rem);
  color: var(--paper);
  background:
    radial-gradient(circle at 80% 4%, rgba(85,230,178,.06), transparent 26rem),
    var(--ink);
}

/* Fallback structure for browsers without @scope support. */
.source-content .wrap { width: var(--wrap); margin-inline: auto; }
.source-content a { color: var(--amber); }
.source-content h1,
.source-content h2,
.source-content h3,
.source-content h4,
.source-content .btn,
.source-content th { font-family: "Avenir Next Condensed", "Trebuchet MS", sans-serif; }
.source-content p { max-width: 72ch; }

.source-content > .wrap:first-child {
  padding-top: 17px;
  padding-bottom: 17px;
  border-bottom: 1px solid var(--line);
}
.source-content .crumbs { margin: 0; color: #71817b; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.source-content .crumbs a { border: 0; color: var(--green); }

.source-content > header {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 330px;
  background: linear-gradient(115deg, #07100e 0%, #091512 58%, #10231d 100%);
}
.source-content > header::before {
  content: "";
  position: absolute;
  z-index: -2;
  inset: 0 0 0 46%;
  background-image: var(--page-image);
  background-size: cover;
  background-position: center;
  opacity: .22;
  filter: saturate(.78) contrast(1.1);
}
.source-content > header::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background:
    linear-gradient(90deg, #07100e 5%, rgba(7,16,14,.94) 38%, rgba(7,16,14,.48) 75%, rgba(7,16,14,.8)),
    linear-gradient(0deg, #07100e 0%, transparent 45%);
}
.source-content > header > .wrap { position: relative; z-index: 1; }
.source-content > header h1 {
  max-width: 820px;
  color: #f7faf4;
  text-shadow: 0 10px 34px rgba(0,0,0,.5);
}
.source-content > header .lede { max-width: 760px; color: #c4d0cb; }
.source-content > header .eyebrow { color: var(--amber); }

.source-content > section {
  position: relative;
  background: rgba(7,16,14,.78);
  border-bottom-color: var(--line);
}
.source-content > section:nth-of-type(even) { background: rgba(12,21,19,.72); }
.source-content > section h2 { color: #f4f8f1; }
.source-content > section h2::before {
  content: "";
  display: inline-block;
  width: 3px;
  height: .82em;
  margin-right: 10px;
  background: linear-gradient(var(--amber), var(--green));
  box-shadow: 0 0 12px rgba(85,230,178,.18);
}
.source-content > section p,
.source-content > section li { color: #aebbb6; }
.source-content > section strong { color: #f2f6ed; }

.source-content .answer,
.source-content .alerta,
.source-content .aviso,
.source-content .avisos {
  border-color: var(--amber-dim);
  background: linear-gradient(110deg, rgba(216,255,62,.07), rgba(85,230,178,.035));
}
.source-content .answer { border-left-color: var(--amber); }

.source-content :is(.selector,.ficha,.balanza,.doble,.escalera,.reloj,.seguridad,.espejo,.linea,.socorro,.veredicto,.trampas,.tramos,.kyc) {
  border-color: #385149;
  background: rgba(8,17,15,.9);
  box-shadow: 0 18px 60px rgba(0,0,0,.18);
}
.source-content :is(.selector-head,.ficha-head,.balanza-head,.doble-head,.escalera-head,.reloj-head,.seguridad-head,.espejo-head,.linea-head,.socorro-head) {
  border-color: #385149;
  background: linear-gradient(90deg, rgba(216,255,62,.055), rgba(85,230,178,.02));
}
.source-content :is(.fila,.row,.r) { border-color: var(--line); }
.source-content :is(.oferta,.bono,.jack > div,.diag > article,.col,.org,.fuente) {
  border-color: #30473f;
  background-color: rgba(8,17,15,.9);
}

.source-content table {
  display: block;
  width: 100%;
  overflow-x: auto;
  border: 1px solid var(--line);
  background: rgba(8,17,15,.92);
}
.source-content thead { background: rgba(216,255,62,.045); }
.source-content th,
.source-content td { min-width: 115px; border-color: var(--line); }
.source-content tbody tr:hover { background: rgba(85,230,178,.045); }

.source-content .btn {
  border: 0;
  background: linear-gradient(105deg, var(--amber), #b9ef54 66%, var(--verde));
  color: #07100e;
  box-shadow: 0 12px 34px rgba(85,230,178,.12);
}
.source-content .btn:hover { background: linear-gradient(105deg, #efff82, #caff70, #7af3c7); }
.source-content .cta small { color: #74847e; }
.source-content .chips span,
.source-content .vip span { border-color: #344c44; background: #0b1714; }
.source-content details { border-color: var(--line); }
.source-content summary { color: #f0f5ee; }
.source-content summary::after { color: var(--amber); }

.inner-page footer { background: #050c0a; }
.inner-page .topbar-links a[aria-current="page"] { color: var(--yellow); }

.utility-hero .wrap { padding-block: clamp(58px, 8vw, 104px); }
.utility-hero h1 { max-width: 900px; margin: 12px 0 20px; font-size: clamp(2.7rem, 6vw, 5.7rem); line-height: .92; letter-spacing: -.035em; }
.utility-hero .lede { max-width: 760px; margin: 0; font-size: clamp(1.05rem, 2vw, 1.3rem); line-height: 1.6; }
.utility-meta { display: flex; flex-wrap: wrap; gap: 10px 24px; margin-top: 28px; color: #71817b; font: 700 10px/1.2 "Avenir Next Condensed", "Trebuchet MS", sans-serif; letter-spacing: .11em; text-transform: uppercase; }
.utility-meta span { display: inline-flex; align-items: center; gap: 8px; }
.utility-meta span::before { content: ""; width: 5px; height: 5px; background: var(--amber); box-shadow: 0 0 12px rgba(216,255,62,.35); }
.source-content > .utility-body { padding-block: clamp(44px, 7vw, 88px); background: #0a1311; }
.utility-layout { display: grid; grid-template-columns: minmax(180px, 230px) minmax(0, 1fr); gap: clamp(34px, 6vw, 88px); align-items: start; }
.utility-toc { position: sticky; top: 92px; padding: 18px 0; border-top: 1px solid #385149; border-bottom: 1px solid #263934; }
.utility-toc p { margin: 0 0 11px; color: #f2f6ed; font: 800 10px/1.2 "Avenir Next Condensed", "Trebuchet MS", sans-serif; letter-spacing: .13em; text-transform: uppercase; }
.utility-toc a { display: block; padding: 7px 0; border: 0; color: #7f918a; font-size: 12px; line-height: 1.35; }
.utility-toc a:hover { color: var(--amber); transform: translateX(3px); }
.utility-copy { max-width: 760px; }
.utility-copy > section { scroll-margin-top: 92px; padding: 0 0 clamp(42px, 6vw, 72px); margin: 0 0 clamp(42px, 6vw, 72px); border-bottom: 1px solid #263934; }
.utility-copy > section:last-child { padding-bottom: 0; margin-bottom: 0; border-bottom: 0; }
.utility-copy h2 { margin: 0 0 20px; color: #f5f8f2; font-size: clamp(1.6rem, 3vw, 2.35rem); line-height: 1.05; }
.utility-copy h2::before { content: ""; display: inline-block; width: 3px; height: .82em; margin-right: 11px; background: linear-gradient(var(--amber), var(--green)); }
.utility-copy h3 { margin: 8px 0 10px; color: #f2f6ed; font-size: 1rem; }
.utility-copy p { margin: 0 0 17px; color: #aebbb6; line-height: 1.75; }
.utility-copy ul,
.utility-copy ol { display: grid; gap: 10px; margin: 20px 0; padding-left: 22px; color: #aebbb6; }
.utility-copy li { padding-left: 4px; line-height: 1.65; }
.utility-copy li::marker { color: var(--amber); font-weight: 800; }
.utility-callout { margin: 26px 0; padding: 22px 24px; border: 1px solid #496254; border-left: 3px solid var(--amber); background: linear-gradient(110deg, rgba(216,255,62,.07), rgba(85,230,178,.025)); }
.utility-callout strong { display: block; margin-bottom: 7px; color: #f3f7ef; font-family: "Avenir Next Condensed", "Trebuchet MS", sans-serif; font-size: 1.05rem; }
.utility-callout p { margin: 0; }
.utility-callout.danger { border-color: #6f413d; border-left-color: var(--rojo); background: rgba(255,123,117,.055); }
.contact-panel { padding: clamp(24px, 5vw, 44px); border: 1px solid #385149; background: radial-gradient(circle at 100% 0, rgba(216,255,62,.08), transparent 15rem), #08120f; }
.contact-label { margin: 0 0 7px !important; color: #71817b !important; font: 800 10px/1.2 "Avenir Next Condensed", "Trebuchet MS", sans-serif; letter-spacing: .13em; text-transform: uppercase; }
.contact-address { display: inline-block; margin-bottom: 18px; border: 0; color: var(--amber); font-family: "Avenir Next Condensed", "Trebuchet MS", sans-serif; font-size: clamp(1.55rem, 4vw, 2.8rem); line-height: 1; }
.utility-card-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.utility-card-grid article { min-height: 190px; padding: 20px; border: 1px solid #30473f; background: #08110f; }
.utility-card-grid article > span { color: var(--amber); font: 800 10px/1 "Avenir Next Condensed", "Trebuchet MS", sans-serif; letter-spacing: .12em; }
.utility-card-grid article p { margin: 0; font-size: .9rem; line-height: 1.55; }
.utility-template { padding: 24px; border: 1px dashed #52655f; background: #07100e; }
.utility-template p { margin: 0; padding: 10px 0; border-bottom: 1px solid #21332e; }
.utility-template p:last-child { border-bottom: 0; }

@media (max-width: 960px) {
  .source-content { --wrap: min(100% - 2.2rem, 760px); }
  .source-content > header { min-height: 300px; }
  .source-content > header::before { left: 35%; opacity: .16; }
  .source-content > header::after { background: linear-gradient(90deg, #07100e 0%, rgba(7,16,14,.9) 58%, rgba(7,16,14,.66)); }
  .utility-layout { grid-template-columns: 1fr; }
  .utility-toc { position: static; display: flex; flex-wrap: wrap; gap: 5px 16px; padding: 16px 0; }
  .utility-toc p { flex: 0 0 100%; }
  .utility-toc a { padding: 3px 0; }
}

@media (max-width: 680px) {
  .source-content { --wrap: calc(100% - 1.5rem); }
  .source-content > .wrap:first-child { padding-block: 12px; }
  .source-content > header { min-height: 0; }
  .source-content > header::before { inset: 0; opacity: .12; }
  .source-content > header h1 { font-size: clamp(2rem, 11vw, 3rem); }
  .source-content > header .lede { font-size: 1rem; }
  .source-content > section h2 { font-size: 1.45rem; }
  .source-content table { margin-inline: 0; }
  .source-content :is(.fila,.row,.r) { grid-template-columns: 1fr; }
  .utility-hero h1 { font-size: clamp(2.35rem, 12vw, 3.5rem); }
  .utility-card-grid { grid-template-columns: 1fr; }
  .utility-card-grid article { min-height: 0; }
  .contact-address { overflow-wrap: anywhere; }
}
