/* CLIMAGLAS — Guía técnica compartida · cgg-* · accent #2ec4da */
:root{--cgg:#2ec4da;--cgg-dark:#041222}

/* ── HERO COMPACTO ───────────────────────────────────── */
.cgg-hero{background:linear-gradient(135deg,#041222 0%,#062a4a 55%,#0a3a6a 100%);padding:1.6rem 1.5rem 1.4rem;border-bottom:3px solid #2ec4da}
.cgg-hero-inner{max-width:900px;margin:0 auto;display:flex;align-items:flex-start;justify-content:space-between;gap:1.5rem}
.cgg-hero-text{flex:1}
.cgg-breadcrumb{font-size:.72rem;color:rgba(255,255,255,.45);margin-bottom:.35rem;display:flex;align-items:center;flex-wrap:wrap;gap:.2rem}
.cgg-breadcrumb a{color:#2ec4da;text-decoration:none;font-weight:600}
.cgg-breadcrumb a:hover{text-decoration:underline}
.cgg-breadcrumb span{opacity:.35}
.cgg-hero-brand{font-size:.65rem;color:#2ec4da;font-weight:700;text-transform:uppercase;letter-spacing:.16em;margin-bottom:.2rem}
.cgg-hero-title{font-size:1.45rem;font-weight:900;color:#fff;margin:.15rem 0 .45rem;line-height:1.2}
.cgg-hero-title em{color:#2ec4da;font-style:normal}
.cgg-hero-sub{font-size:.86rem;color:rgba(255,255,255,.8);line-height:1.6;max-width:620px;margin:0}
.cgg-hero-actions{display:flex;align-items:center;gap:.6rem;margin-top:.9rem;flex-wrap:wrap}
.cgg-hero-badge{background:rgba(46,196,218,.15);border:1px solid rgba(46,196,218,.3);color:#2ec4da;font-size:.68rem;font-weight:700;padding:.2rem .65rem;border-radius:20px;text-transform:uppercase;letter-spacing:.06em}
.cgg-print-btn{background:transparent;border:1px solid rgba(255,255,255,.22);border-radius:5px;padding:.28rem .7rem;font-size:.72rem;color:rgba(255,255,255,.6);cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;gap:.3rem}
.cgg-print-btn:hover{border-color:#2ec4da;color:#2ec4da}
.cgg-hero-img{width:100px;border-radius:8px;opacity:.65;flex-shrink:0;object-fit:cover;display:block}
@media(max-width:480px){.cgg-hero-img{display:none}.cgg-hero-inner{flex-direction:column;gap:.8rem}}

/* ── STEP INDICATOR ──────────────────────────────────── */
.cgg-steps{background:#0a1e35;border-bottom:1px solid rgba(46,196,218,.14);overflow-x:auto;-webkit-overflow-scrolling:touch}
.cgg-steps-inner{display:flex;gap:0;max-width:900px;margin:0 auto;min-width:max-content;padding:0 .5rem}
.cgg-step{display:flex;align-items:center;gap:.35rem;padding:.6rem .8rem;font-size:.74rem;font-weight:600;color:rgba(255,255,255,.35);text-decoration:none;white-space:nowrap;border-bottom:2px solid transparent;transition:all .18s}
.cgg-step.active{color:#2ec4da;border-bottom-color:#2ec4da}
.cgg-step:not(.active):hover{color:rgba(255,255,255,.65)}
.cgg-step-num{width:17px;height:17px;border-radius:50%;background:rgba(255,255,255,.08);display:inline-flex;align-items:center;justify-content:center;font-size:.62rem;font-weight:800;flex-shrink:0;transition:background .18s}
.cgg-step.active .cgg-step-num{background:#2ec4da;color:#041222}
.cgg-step-sep{color:rgba(255,255,255,.15);font-size:.7rem;padding:0 .1rem}

/* ── MAIN WRAP ──────────────────────────────────────── */
.cgg-wrap{max-width:900px;margin:0 auto;padding:1.8rem 1.5rem 2.5rem}

/* ── SUMMARY BOX ─────────────────────────────────────── */
.cgg-summary{background:#e8fafe;border-radius:10px;padding:1rem 1.3rem;display:flex;align-items:flex-start;gap:1rem;margin-bottom:1.6rem;border:1px solid #b0e4f4}
.cgg-summary-icon{font-size:1.8rem;flex-shrink:0;margin-top:.1rem}
.cgg-summary-body strong{display:block;font-size:.92rem;color:#041222;margin-bottom:.2rem}
.cgg-summary-body p{font-size:.82rem;color:#3a5a7a;margin:0;line-height:1.5}

/* ── SECTION TITLE ───────────────────────────────────── */
.cgg-section-title{font-size:.92rem;font-weight:800;color:#041222;border-left:4px solid #2ec4da;padding-left:.7rem;margin:1.6rem 0 .9rem;text-transform:uppercase;letter-spacing:.05em}

/* ── RULES LIST ──────────────────────────────────────── */
.cgg-rules{display:flex;flex-direction:column;gap:.55rem;margin-bottom:1.2rem}
.cgg-rule{display:flex;align-items:flex-start;gap:.85rem;background:#fff;border:1px solid #dde5ed;border-radius:8px;padding:.85rem 1rem;transition:box-shadow .18s,border-color .18s}
.cgg-rule:hover{box-shadow:0 3px 14px rgba(46,196,218,.1);border-color:#b0e0f0}
.cgg-rule-num{width:22px;height:22px;border-radius:50%;background:#2ec4da;color:#041222;font-size:.68rem;font-weight:900;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px}
.cgg-rule-icon{font-size:1.15rem;flex-shrink:0;line-height:1.4}
.cgg-rule-body{flex:1;font-size:.87rem;color:#2a3a4a;line-height:1.6}
.cgg-rule-body strong{color:#041222;display:block;margin-bottom:.15rem}

/* ── CALLOUTS ────────────────────────────────────────── */
.cgg-warn{background:#fff8e0;border-left:4px solid #f59e0b;border-radius:0 8px 8px 0;padding:.8rem 1rem;font-size:.85rem;color:#3a2800;line-height:1.6;margin:1.1rem 0}
.cgg-warn strong{color:#92400e}
.cgg-info{background:#e8fafe;border-left:4px solid #2ec4da;border-radius:0 8px 8px 0;padding:.8rem 1rem;font-size:.85rem;color:#062040;line-height:1.6;margin:1.1rem 0}
.cgg-ok{background:#f0fdf4;border-left:4px solid #22c55e;border-radius:0 8px 8px 0;padding:.8rem 1rem;font-size:.85rem;color:#166534;line-height:1.6;margin:1.1rem 0}

/* ── FAQ ACCORDION ───────────────────────────────────── */
.cgg-faq-title{font-size:.9rem;font-weight:700;color:#041222;margin:1.6rem 0 .7rem;padding-left:.65rem;border-left:3px solid rgba(46,196,218,.4)}
.cgg-faq{display:flex;flex-direction:column;gap:.45rem;margin-bottom:1.4rem}
.cgg-faq-item{border:1px solid #d0e8f4;border-radius:8px;overflow:hidden}
.cgg-faq-item summary{list-style:none;cursor:pointer;padding:.8rem 1.1rem;background:#f5f9fc;display:flex;justify-content:space-between;align-items:center;font-size:.86rem;font-weight:700;color:#041222;transition:background .18s}
.cgg-faq-item summary::-webkit-details-marker{display:none}
.cgg-faq-item summary::after{content:'＋';color:#2ec4da;flex-shrink:0;font-weight:400;margin-left:.5rem}
.cgg-faq-item[open] summary{background:#e8f4fc}
.cgg-faq-item[open] summary::after{content:'－'}
.cgg-faq-body{padding:.9rem 1.1rem 1rem;font-size:.85rem;color:#3a4a5a;line-height:1.65;background:#fff}

/* ── PREV / NEXT NAV ─────────────────────────────────── */
.cgg-nav{display:flex;justify-content:space-between;align-items:center;padding:1.2rem 0 .4rem;border-top:1px solid #e0ecf4;margin-top:1.6rem;gap:.6rem;flex-wrap:wrap}
.cgg-nav-prev,.cgg-nav-next{display:flex;align-items:center;gap:.45rem;background:#e8fafe;border-radius:8px;padding:.55rem 1rem;font-size:.82rem;font-weight:700;color:#065a7a;text-decoration:none;transition:all .2s;min-width:0}
.cgg-nav-prev:hover,.cgg-nav-next:hover{background:#2ec4da;color:#fff}
.cgg-nav-next{margin-left:auto}
.cgg-nav-label{font-size:.67rem;color:#8aabbb;display:block;font-weight:400;line-height:1}
.cgg-nav-home{font-size:.78rem;color:#7a9ab0;text-decoration:none;padding:.3rem .6rem;border-radius:5px;transition:color .2s}
.cgg-nav-home:hover{color:#2ec4da}

/* ── RESPONSIVE ──────────────────────────────────────── */
@media(max-width:600px){
  .cgg-hero-title{font-size:1.25rem}
  .cgg-wrap{padding:1.4rem 1rem 2rem}
  .cgg-summary{flex-direction:column;gap:.6rem}
  .cgg-nav{flex-direction:column;align-items:stretch}
  .cgg-nav-prev,.cgg-nav-next{justify-content:center}
  .cgg-nav-next{margin-left:0}
}
@media print{
  .cgg-steps,.cgg-nav,.cgg-print-btn,.header,.footer{display:none}
  .cgg-hero{background:#fff !important;border-bottom:2px solid #2ec4da;color:#000 !important;padding:1rem}
  .cgg-hero-title,.cgg-hero-brand,.cgg-hero-sub,.cgg-breadcrumb a{color:#000 !important}
  .cgg-rule{border:1px solid #ccc;break-inside:avoid}
}
