/* =========================================================
   DOSSIER-GUIAS.CSS · Índice y guías CCN-STIC
   Revisión editorial PC
   ========================================================= */

.ds-page .gg-overview{
  display:grid;
  grid-template-columns:minmax(0,.82fr) minmax(650px,1.18fr);
  gap:62px;
  align-items:center;
  padding:58px 72px;
  border-bottom:1px solid var(--ds-line);
  background:#f3f6f6;
}
.ds-page .gg-kicker{
  display:block;font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--brand);
}
.ds-page .gg-copy h2,.ds-page .gg-final h2{
  margin:11px 0 17px;color:var(--ds-ink);font-size:clamp(30px,3.1vw,45px);line-height:1.08;letter-spacing:-.035em;
}
.ds-page .gg-copy p{margin:0;color:#5f6c75;font-size:15px;line-height:1.75;max-width:660px;}
.ds-page .gg-flow{display:flex;align-items:stretch;}
.ds-page .gg-flow>div{flex:1;min-height:150px;padding:22px 18px;border:1px solid var(--ds-line);background:#fff;}
.ds-page .gg-flow>i{flex:0 0 20px;display:grid;place-items:center;font-style:normal;color:#8e9aa2;}
.ds-page .gg-flow b{display:block;font-family:var(--mono);font-size:10px;color:var(--brand);margin-bottom:30px;}
.ds-page .gg-flow span{font-size:15px;font-weight:800;color:var(--ds-ink);}
.ds-page .gg-flow .is-strong{background:var(--ds-deep);border-color:var(--ds-deep);}
.ds-page .gg-flow .is-strong b{color:#8bcfeb}.ds-page .gg-flow .is-strong span{color:#fff;}

.ds-page .gg-index-content{padding:46px 72px 62px;}
.ds-page .gg-index-content>p:first-child{max-width:980px;font-size:16px;line-height:1.8;color:#53616a;}
.ds-page .gg-index-content .ccn-banner{margin-left:0;margin-right:0;}
.ds-page .gg-index-content .gc-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;}
.ds-page .gg-index-content .gc-card{border-radius:0;box-shadow:none;border:1px solid var(--ds-line);}
.ds-page .gg-index-content .gc-card:hover{transform:translateY(-2px);border-color:var(--brand);box-shadow:0 14px 30px rgba(0,57,85,.06);}

.ds-page .gg-final{padding:68px 72px;text-align:center;background:var(--ds-deep);}
.ds-page .gg-final .gg-kicker{color:#8bcfeb;}
.ds-page .gg-final h2{max-width:1100px;margin-left:auto;margin-right:auto;color:#fff;}
.ds-page .gg-final p{color:#b8ced8;font-size:15px;}

.ds-page .guia-read-when{
  max-width:1100px;
  margin:0 0 26px;
  padding:24px 28px;
  border-left:4px solid var(--brand);
  background:#eef5f8;
}
.ds-page .guia-read-when>span{
  display:block;font-family:var(--mono);font-size:10px;letter-spacing:.1em;color:var(--brand);font-weight:700;margin-bottom:8px;
}
.ds-page .guia-read-when h2{font-size:21px;line-height:1.35;color:var(--ds-ink);margin:0 0 9px;}
.ds-page .guia-read-when p{font-size:14px;line-height:1.7;color:#58666f;margin:0;}

.ds-page .guia-roadmap{
  position:relative;
  max-width:1240px;
  margin:0 0 34px;
  padding:28px 30px;
  border:1px solid var(--ds-line);
  background:#fff;
}
.ds-page .guia-roadmap .art-visual-kicker{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--brand);margin-bottom:8px;}
.ds-page .guia-roadmap .art-visual-title{font-size:21px;font-weight:800;color:var(--ds-ink);margin-bottom:20px;}
.ds-page .guia-roadmap svg{display:block;width:100%;height:auto;}
.ds-page .guia-roadmap .art-visual-note{margin-top:15px;padding-top:13px;border-top:1px solid var(--ds-line);font-size:13px;line-height:1.65;color:#67737d;}

.ds-page .gg-svg-box{fill:#f6f7f5;stroke:#c9d3d8;stroke-width:1.2;}
.ds-page .gg-svg-box.is-strong{fill:#003955;stroke:#003955;}
.ds-page .gg-svg-num{font-family:var(--mono);font-size:11px;fill:#0077b5;font-weight:700;}
.ds-page .gg-svg-num.is-light{fill:#8bd0f0;}
.ds-page .gg-svg-label{font-family:Arial,sans-serif;font-size:14px;fill:#10161b;font-weight:700;}
.ds-page .gg-svg-label.is-light{fill:#fff;}
.ds-page .gg-svg-line{stroke:#9eb0ba;stroke-width:2;}
.ds-page .gg-svg-arrow{fill:#9eb0ba;}
.ds-page .gg-svg-band{fill:#eef4f6;stroke:#c9d3d8;stroke-width:1.1;}
.ds-page .gg-svg-band-label{font-family:var(--mono);font-size:10px;fill:#003955;font-weight:700;letter-spacing:.02em;}

/* Zoom */
.art-zoom-btn{position:absolute;top:14px;right:14px;width:40px;height:40px;border:1px solid #b9c9d1;background:#fff;display:grid;place-items:center;cursor:pointer;z-index:3;}
.art-zoom-btn:hover{border-color:var(--brand);background:#eef7fb;}
.art-zoom-btn svg{width:20px!important;min-width:0!important;height:20px!important;stroke:#003955;stroke-width:1.8;fill:none;}
body.art-zoom-open{overflow:hidden;}
.art-zoom-modal{position:fixed;inset:0;background:rgba(6,18,26,.82);z-index:9999;display:none;padding:34px;}
.art-zoom-modal.is-open{display:flex;align-items:center;justify-content:center;}
.art-zoom-dialog{position:relative;width:min(96vw,1540px);height:min(92vh,980px);background:#f6f7f5;border:1px solid rgba(255,255,255,.3);overflow:auto;padding:54px 34px 34px;}
.art-zoom-close{position:absolute;top:12px;right:14px;width:40px;height:40px;border:1px solid #9fb0b9;background:#fff;color:#003955;font-size:28px;line-height:1;cursor:pointer;z-index:5;}
.art-zoom-content{width:100%;min-height:100%;box-sizing:border-box;}
.art-zoom-content.ds-page .art-visual{width:100%;max-width:none;margin:0;box-sizing:border-box;}
.art-zoom-content.ds-page .art-visual svg{width:100%;max-width:none;height:auto;min-width:0;}

@media(max-width:1100px){
  .ds-page .gg-overview{grid-template-columns:1fr;}
  .ds-page .gg-index-content .gc-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}


/* =========================================================
   GRCREAL · Voz editorial propia en Guías CCN-STIC
   ========================================================= */

.ds-page .grc-guide-angle,
.ds-page .grc-guide-question,
.ds-page .grc-guide-approach{
  padding-top:56px;
  padding-bottom:56px;
}

.ds-page .grc-guide-angle .block-title,
.ds-page .grc-guide-question .block-title,
.ds-page .grc-guide-approach .block-title{
  max-width:1050px;
  font-size:clamp(25px,2.5vw,36px);
  line-height:1.13;
  letter-spacing:-.025em;
}

.ds-page .grc-guide-angle .block-text,
.ds-page .grc-guide-question .block-text,
.ds-page .grc-guide-approach .block-text{
  max-width:980px;
  font-size:16.5px;
  line-height:1.9;
  color:#46545d;
}

.ds-page .grc-guide-angle{
  position:relative;
}

.ds-page .grc-guide-angle::before{
  content:'LECTURA GRCREAL';
  position:absolute;
  right:0;
  top:56px;
  font-family:var(--mono);
  font-size:9px;
  letter-spacing:.12em;
  color:#91a0a8;
  writing-mode:vertical-rl;
}

.ds-page .grc-question-box{
  max-width:1050px;
  margin:26px 0 30px;
  padding:28px 30px;
  border-left:5px solid var(--ds-deep);
  background:#f1f5f6;
}

.ds-page .grc-question-box>span{
  display:block;
  margin-bottom:12px;
  font-family:var(--mono);
  font-size:10px;
  font-weight:700;
  letter-spacing:.11em;
  color:var(--brand);
}

.ds-page .grc-guide-evidence{
  width:100%;
  max-width:1240px;
  margin:28px 0 0;
  border-collapse:collapse;
  background:#fff;
  border:1px solid var(--ds-line);
  font-size:14px;
  line-height:1.55;
}

.ds-page .grc-guide-evidence th{
  padding:13px 16px;
  text-align:left;
  background:var(--ds-deep);
  color:#fff;
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.ds-page .grc-guide-evidence td{
  padding:15px 16px;
  border-bottom:1px solid var(--ds-line);
  vertical-align:top;
  color:#526069;
}

.ds-page .grc-guide-evidence tr:last-child td{border-bottom:0;}

.ds-page .grc-guide-evidence td:first-child{
  width:88px;
  color:var(--brand);
  font-family:var(--mono);
  font-size:11px;
  font-weight:700;
}

.ds-page .grc-guide-evidence td:nth-child(2){
  width:31%;
  color:var(--ds-ink);
  font-weight:750;
}

.ds-page .grc-approach-box{
  display:grid;
  grid-template-columns:130px minmax(0,1fr);
  gap:30px;
  max-width:1080px;
  margin-top:26px;
  padding:30px;
  background:var(--ds-deep);
}

.ds-page .grc-approach-mark{
  padding-top:5px;
  font-family:var(--mono);
  font-size:10px;
  font-weight:700;
  letter-spacing:.12em;
  color:#8bcfeb;
}

.ds-page .grc-approach-box .block-text{
  max-width:none;
  color:#c1d5de;
}

.ds-page .grc-approach-box .block-text strong{
  color:#fff;
}

.ds-page .gg-copy strong{
  color:var(--ds-deep);
}


/* GRCREAL · Guías más técnicas */
.ds-page .grc-guide-techvisual{
  position:relative;max-width:1240px;margin:34px 0;padding:28px 30px;border:1px solid var(--ds-line);background:#fff;
}
.ds-page .grc-guide-techvisual svg{display:block;width:100%;height:auto;}
.ds-page .gg-tech-box{fill:#f6f7f5;stroke:#c9d3d8;stroke-width:1.2;}
.ds-page .gg-tech-box.gg-tech-box-strong{fill:#003955;stroke:#003955;}
.ds-page .gg-tech-num{font-family:var(--mono);font-size:11px;fill:#0077b5;font-weight:700;}
.ds-page .gg-tech-num.gg-tech-num-light{fill:#8bd0f0;}
.ds-page .gg-tech-label{font-family:Arial,sans-serif;font-size:14px;fill:#10161b;font-weight:700;}
.ds-page .gg-tech-label.gg-tech-label-light{fill:#fff;}
.ds-page .gg-tech-line{stroke:#9eb0ba;stroke-width:2;}
.ds-page .gg-tech-arrow{fill:#9eb0ba;}
.ds-page .gg-tech-band{fill:#eef4f6;stroke:#c9d3d8;stroke-width:1.1;}
.ds-page .gg-tech-band-label{font-family:var(--mono);font-size:10px;fill:#003955;font-weight:700;letter-spacing:.02em;}

.ds-page .grc-guide-tech,
.ds-page .grc-guide-error,
.ds-page .grc-guide-example,
.ds-page .grc-guide-official{padding-top:54px;padding-bottom:54px;}

.ds-page .grc-guide-tech .block-text,
.ds-page .grc-guide-error .block-text,
.ds-page .grc-guide-example .block-text,
.ds-page .grc-guide-official .block-text{
  max-width:1000px;font-size:16px;line-height:1.9;color:#495861;
}
.ds-page .grc-guide-alert{
  max-width:1040px;margin-top:24px;padding:26px 28px;border-left:5px solid var(--brand);background:#eef5f8;
}
.ds-page .grc-guide-alert > span{
  display:block;margin-bottom:12px;font-family:var(--mono);font-size:10px;font-weight:800;letter-spacing:.12em;color:var(--brand);
}
.ds-page .grc-guide-example-box{
  display:grid;grid-template-columns:95px minmax(0,1fr);gap:24px;max-width:1080px;margin-top:24px;padding:28px 30px;background:#f5f7f6;border:1px solid var(--ds-line);
}
.ds-page .grc-guide-example-mark{
  padding-top:4px;font-family:var(--mono);font-size:10px;font-weight:800;letter-spacing:.12em;color:var(--brand);
}
.ds-page .grc-guide-example-box .block-text{max-width:none;margin:0;}
.ds-page .grc-guide-official-lead{
  max-width:960px;margin:0 0 22px;font-size:15px;line-height:1.75;color:#5d6b74;
}
.ds-page .grc-guide-official .ccn-banner{margin-top:10px;}
.ds-page .grc-guide-official .ccn-note{margin-top:14px;}
.ds-page .grc-guide-official-actions{margin:22px 0 0;}
.ds-page .grc-guide-official-btn{
  display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 18px;background:var(--ds-deep);color:#fff;text-decoration:none;font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
}
.ds-page .grc-guide-official-btn:hover{opacity:.92;}


/* SVG realmente distintos por guía */
.ds-page .gx-box,.ds-page .gx-column,.ds-page .gx-card,.ds-page .gx-node{
  fill:#f6f7f5;stroke:#c9d3d8;stroke-width:1.2;
}
.ds-page .gx-core,.ds-page .gx-core-circle,.ds-page .gx-event,.ds-page .gx-card-strong{
  fill:#003955;stroke:#003955;stroke-width:1.2;
}
.ds-page .gx-title{font-family:Arial,sans-serif;font-size:15px;fill:#10161b;font-weight:800;}
.ds-page .gx-title-light{font-family:Arial,sans-serif;font-size:15px;fill:#fff;font-weight:800;}
.ds-page .gx-small{font-family:Arial,sans-serif;font-size:12px;fill:#69757e;}
.ds-page .gx-small-light{font-family:Arial,sans-serif;font-size:12px;fill:#c1d9e4;}
.ds-page .gx-code{font-family:var(--mono);font-size:11px;fill:#0077b5;font-weight:700;letter-spacing:.05em;}
.ds-page .gx-line,.ds-page .gx-line-arrow,.ds-page .gx-timeline{
  stroke:#9eb0ba;stroke-width:2;fill:none;
}
.ds-page .gx-line-arrow{marker-end:url(#none);}
.ds-page .gx-band{fill:#eef4f6;stroke:#c9d3d8;stroke-width:1;}
.ds-page .gx-band-label{font-family:var(--mono);font-size:10px;fill:#003955;font-weight:700;letter-spacing:.02em;}
.ds-page .gx-pyramid1{fill:#003955;}
.ds-page .gx-pyramid2{fill:#dfe9ed;stroke:#c0cdd3;stroke-width:1;}
.ds-page .gx-pyramid3{fill:#f4f7f7;stroke:#c9d3d8;stroke-width:1;}
.ds-page .gx-radar{fill:none;stroke:#9eb0ba;stroke-width:2;}
.ds-page .gx-radar-fill{fill:#d8edf7;stroke:#0077b5;stroke-width:2;}
.ds-page .gx-layer1{fill:#f4f7f7;stroke:#c9d3d8;stroke-width:1;}
.ds-page .gx-layer2{fill:#e7f0f3;stroke:#bfd0d8;stroke-width:1;}
.ds-page .gx-layer3{fill:#17617f;stroke:#17617f;stroke-width:1;}
.ds-page .gx-layer4{fill:#003955;stroke:#003955;stroke-width:1;}
.ds-page .gx-ring{fill:none;stroke:#9eb0ba;stroke-width:2;}
.ds-page .gx-arc{fill:none;stroke:#0077b5;stroke-width:3;}
.ds-page .gx-loop{fill:none;stroke:#7f97a3;stroke-width:2;}
.ds-page .gx-funnel1{fill:#f4f7f7;stroke:#c9d3d8;stroke-width:1;}
.ds-page .gx-funnel2{fill:#dfe9ed;stroke:#c0cdd3;stroke-width:1;}
.ds-page .gx-funnel3{fill:#17617f;stroke:#17617f;stroke-width:1;}
.ds-page .gx-cloud-provider{fill:#003955;}
.ds-page .gx-shared{fill:#e3eef2;stroke:#b9ccd5;stroke-width:1;}
.ds-page .gx-client{fill:#17617f;}


/* =========================================================
   Guías · Metadatos editoriales + ejemplo técnico de infra
   ========================================================= */

.ds-page .guide-editorial-meta{
  position:relative;
  z-index:1;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:0;
  margin-top:24px;
  border-top:1px solid var(--ds-line);
  border-bottom:1px solid var(--ds-line);
}

.ds-page .guide-editorial-meta-item{
  display:flex;
  align-items:center;
  gap:8px;
  min-height:42px;
  padding:0 17px;
  border-right:1px solid var(--ds-line);
  color:#53616a;
  font-size:13px;
}

.ds-page .guide-editorial-meta-item:first-child{padding-left:0;}
.ds-page .guide-editorial-meta-item strong{color:var(--ds-ink);font-weight:750;}
.ds-page .guide-meta-icon{
  color:var(--brand);
  font-family:var(--mono);
  font-size:14px;
}

.ds-page .grc-guide-infra{
  padding-top:54px;
  padding-bottom:54px;
}

.ds-page .grc-infra-visual{
  position:relative;
  max-width:1240px;
  margin:28px 0 26px;
  padding:26px 28px;
  border:1px solid var(--ds-line);
  background:#fff;
}

.ds-page .grc-infra-visual svg{
  display:block;
  width:100%;
  height:auto;
}

.ds-page .gi-node{
  fill:#f5f7f6;
  stroke:#c6d2d8;
  stroke-width:1.2;
}

.ds-page .gi-node.gi-node-strong{
  fill:#003955;
  stroke:#003955;
}

.ds-page .gi-label{
  font-family:Arial,sans-serif;
  font-size:14px;
  font-weight:800;
  fill:#10161b;
}

.ds-page .gi-label.gi-label-light{fill:#fff;}

.ds-page .gi-link{
  stroke:#8da2ad;
  stroke-width:2;
  fill:none;
}

.ds-page .gi-band{
  fill:#eaf2f5;
  stroke:#c6d2d8;
  stroke-width:1;
}

.ds-page .gi-band-label{
  font-family:var(--mono);
  font-size:10px;
  font-weight:700;
  letter-spacing:.04em;
  fill:#003955;
}

.ds-page .grc-infra-case{
  display:grid;
  grid-template-columns:110px minmax(0,1fr);
  gap:28px;
  max-width:1100px;
  padding:30px;
  background:var(--ds-deep);
}

.ds-page .grc-infra-case-mark{
  padding-top:5px;
  color:#8bcfeb;
  font-family:var(--mono);
  font-size:10px;
  font-weight:800;
  letter-spacing:.12em;
}

.ds-page .grc-infra-case .block-text{
  max-width:none;
  margin:0;
  color:#c4d7df;
}

.ds-page .grc-infra-case .block-text strong{
  color:#fff;
}
