@import url('https://fonts.googleapis.com/css2?family=Syne:wght@400;500;600;700;800&family=DM+Sans:ital,wght@0,300;0,400;0,500;1,300&family=DM+Mono:wght@400;500&display=swap');

*{margin:0;padding:0;box-sizing:border-box;}
:root{
  --gold:#C9A84C;--gold-light:#E8C97A;--gold-dim:rgba(201,168,76,0.12);
  --dark:#0D0D0D;--dark2:#141414;--dark3:#1C1C1C;--dark4:#242424;
  --border:rgba(201,168,76,0.18);--border2:rgba(255,255,255,0.07);
  --text:#F0EBE0;--muted:#8A8070;--green:#2ECC71;--red:#E05555;--blue:#5B9BD5;--orange:#E8944A;
}
html{scroll-behavior:smooth;}
body{font-family:'DM Sans',sans-serif;background:var(--dark);color:var(--text);font-size:15px;line-height:1.7;overflow-x:hidden;}

/* TOPBAR */
.topbar{position:sticky;top:0;z-index:100;background:rgba(13,13,13,0.96);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);padding:0 2rem;display:flex;align-items:center;justify-content:space-between;height:58px;}
.topbar-logo{font-family:'Syne',sans-serif;font-weight:800;font-size:18px;letter-spacing:-0.5px;color:var(--gold);text-decoration:none;}
.topbar-logo span{color:var(--text);}
.topbar-nav{display:flex;gap:1.5rem;list-style:none;font-size:13px;color:var(--muted);}
.topbar-nav li a{color:var(--muted);text-decoration:none;transition:color 0.2s;}
.topbar-nav li a:hover{color:var(--gold);}
.topbar-cta{background:var(--gold);color:var(--dark);border:none;padding:7px 18px;border-radius:4px;font-family:'DM Sans',sans-serif;font-weight:500;font-size:13px;cursor:pointer;text-decoration:none;transition:all 0.2s;}
.topbar-cta:hover{background:var(--gold-light);}

/* MÓDULO WRAPPER */
.module-page{max-width:920px;margin:0 auto;padding:2.5rem 2rem 5rem;}
.module-header{padding:3rem 2rem 2rem;border-bottom:1px solid var(--border);position:relative;overflow:hidden;margin-bottom:0;}
.module-header::before{content:'';position:absolute;top:0;right:0;width:500px;height:100%;background:radial-gradient(ellipse at right,rgba(201,168,76,0.04) 0%,transparent 70%);}

/* BREADCRUMB */
.breadcrumb{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted);margin-bottom:1rem;font-family:'DM Mono',monospace;}
.breadcrumb a{color:var(--muted);text-decoration:none;}
.breadcrumb a:hover{color:var(--gold);}
.breadcrumb span{color:var(--muted);}

/* NAVEGACIÓN ENTRE MÓDULOS */
.mod-nav{display:flex;justify-content:space-between;align-items:center;padding:1.5rem 2rem;border-top:1px solid var(--border2);margin-top:3rem;}
.mod-nav a{display:flex;align-items:center;gap:8px;color:var(--muted);text-decoration:none;font-size:13px;transition:color 0.2s;}
.mod-nav a:hover{color:var(--gold);}
.mod-nav .nav-prev::before{content:'←';}
.mod-nav .nav-next::after{content:'→';}

/* SECCIONES */
.section{padding:2.5rem 0;border-bottom:1px solid var(--border2);}
.section:last-child{border-bottom:none;}
.section-label{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--gold);margin-bottom:0.6rem;font-family:'DM Mono',monospace;}
.section-title{font-family:'Syne',sans-serif;font-size:1.4rem;font-weight:700;letter-spacing:-0.5px;margin-bottom:1.2rem;}
.body-text{color:var(--muted);font-size:15px;line-height:1.85;margin-bottom:1rem;}
.body-text strong{color:var(--text);font-weight:500;}

/* COMPONENTES */
.key-rule{background:var(--dark3);border-left:2px solid var(--gold);padding:1rem 1.2rem;border-radius:0 4px 4px 0;margin:1.2rem 0;font-size:14px;color:var(--text);}
.key-rule strong{color:var(--gold);}
.tip-box{background:var(--dark3);border:1px solid var(--border);border-radius:8px;padding:1.2rem 1.5rem;margin:1.5rem 0;display:flex;gap:1rem;}
.tip-icon{font-size:16px;flex-shrink:0;margin-top:2px;}
.tip-title{font-family:'Syne',sans-serif;font-size:0.9rem;font-weight:700;margin-bottom:0.3rem;color:var(--gold);}
.tip-text{font-size:13px;color:var(--muted);line-height:1.7;}
.warning-box{background:rgba(224,85,85,0.05);border:1px solid rgba(224,85,85,0.18);border-radius:8px;padding:1.2rem 1.5rem;margin:1.5rem 0;display:flex;gap:1rem;}
.wb-title{font-family:'Syne',sans-serif;font-size:0.9rem;font-weight:700;margin-bottom:0.3rem;color:var(--red);}
.wb-text{font-size:13px;color:var(--muted);line-height:1.7;}
.summary-box{background:var(--dark2);border:1px solid var(--border);border-radius:8px;padding:1.8rem 2rem;margin-top:2rem;}
.summary-box h3{font-family:'Syne',sans-serif;font-size:1.1rem;font-weight:700;margin-bottom:1rem;color:var(--gold);}
.rule-list{list-style:none;}
.rule-list li{padding:0.5rem 0;border-bottom:1px solid var(--border2);font-size:14px;color:var(--muted);display:flex;gap:10px;align-items:flex-start;}
.rule-list li:last-child{border-bottom:none;}
.rule-list li::before{content:'→';color:var(--gold);flex-shrink:0;}
.rule-list li strong{color:var(--text);font-weight:500;}

/* MODULE TAG */
.module-tag{display:inline-flex;align-items:center;gap:8px;background:var(--gold-dim);border:1px solid var(--border);color:var(--gold);padding:4px 14px;border-radius:3px;font-size:11px;font-weight:500;letter-spacing:1.5px;text-transform:uppercase;margin-bottom:1.2rem;font-family:'DM Mono',monospace;}
.phase-tag{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:3px;font-size:10px;letter-spacing:1px;text-transform:uppercase;margin-bottom:0.8rem;font-family:'DM Mono',monospace;}

/* HEADINGS */
h1{font-family:'Syne',sans-serif;font-size:clamp(1.8rem,4vw,3rem);font-weight:800;letter-spacing:-1.5px;line-height:1.05;margin-bottom:1rem;}
h1 span{color:var(--gold);}
.header-desc{color:var(--muted);font-size:16px;max-width:600px;line-height:1.7;}
.header-meta{display:flex;gap:2rem;margin-top:2rem;padding-top:1.5rem;border-top:1px solid var(--border2);flex-wrap:wrap;}
.meta-item{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:6px;}
.meta-dot{width:6px;height:6px;border-radius:50%;background:var(--gold);}

/* FOOTER */
.site-footer{padding:1.5rem 2rem;border-top:1px solid var(--border2);display:flex;justify-content:space-between;align-items:center;font-size:11px;color:var(--muted);flex-wrap:wrap;gap:1rem;}
.site-footer a{color:var(--muted);text-decoration:none;}
.site-footer a:hover{color:var(--gold);}

@media(max-width:700px){
  .topbar-nav{display:none;}
  .module-page{padding:1.5rem 1.2rem 4rem;}
}
