*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{

    background:#2A2E35;

    font-family:"IBM Plex Sans",sans-serif;

    color:#222;

}

/* Marco */

#wrapper{

    width:820px;

    margin:35px auto;

    background:#ede9df;

    border:4px solid #CC0000;

}

/* Header */

header{

    display:flex;

    align-items:center;

    padding:18px;

    background:#3a3f47;

    border-bottom:4px solid #CC0000;

    background: linear-gradient(#4a4f58,#3a3f47);

}

.logo{

    width:80px;

    margin-right:18px;

}

.title h1{

    font-family:"Space Grotesk",sans-serif;

    color:white;

    letter-spacing:8px;

    font-size:42px;

    font-weight:700;

}

.title p{

    font-family:"IBM Plex Sans",sans-serif;

    color:#d6d6d6;

    font-size:14px;

    margin-top:3px;

    letter-spacing:1px;

}

.system-info{

    margin-left:auto;

    text-align:right;

    font-family:"IBM Plex Mono", monospace;

    font-size:11px;

    line-height:1.4;

    color:#cfcfcf;

}

.system-info span{

    display:block;

    color:#999;

    letter-spacing:1px;

}

.system-info strong{

    display:block;

    color:white;

    font-weight:500;

    margin-bottom:8px;

}

/* Navegación */

nav{

    background:#555;

    border-bottom:5px solid #CC0000;

}

nav a{

    display:inline-block;

    font-family:"Space Grotesk",sans-serif;

    color:white;

    text-decoration:none;

    padding:10px 16px;

    font-size:13px;

    font-weight:600;

    letter-spacing:1px;

}

nav a:hover{

    background:#CC0000;

}

/* Contenido */

main{

    padding:18px;

}

.panel{

    border:1px solid #777;

    background:white;

    margin-bottom:18px;

    box-shadow:2px 2px 0 #9d9d9d;

}

.panel h2{

    font-family:"Space Grotesk",sans-serif;

    background:#CC0000;

    color:white;

    padding:8px 12px;

    font-size:15px;

    letter-spacing:2px;

}

.panel p{

    padding:12px;

    line-height:1.5;

    font-size:15px;

}

table{

    width:100%;

    border-collapse:collapse;

    font-family:"IBM Plex Mono",monospace;


}

td{

    padding:10px 12px;

    border-top:1px solid #ccc;

    vertical-align: middle;

    white-space: nowrap;

}

td:first-child{

    width:155px;

    font-weight:bold;

}


td:last-child{

    padding-left:6px;

}

/* Footer */

footer{

    background:#3a3f47;

    color:#ddd;

    text-align:center;

    padding:12px;

    border-top:4px solid #CC0000;

    font-size:13px;

}

.row{

    display:flex;

    gap:18px;

    margin-bottom:18px;

}

.half{

    flex:1;

}

.panel ul{

    list-style: none;

    padding: 12px;

}

.panel li{

    margin-bottom: 8px;

}

.panel li::before{

    content: "► ";

    color: #CC0000;

    font-weight: bold;

}

/* CENTRAL DIRECTIVE */

.directive{

    margin-bottom:18px;

}

.directive blockquote{

    padding:16px 24px 8px;

    font-size:18px;

    line-height:1.4;

    text-align:center;

    font-family:"Space Grotesk",sans-serif;

    font-weight:500;

    color:#222;

    font-style:normal;

}

.directive-author{

    text-align:right;

    padding:0 24px 14px;

    color:#666;

    font-size:12px;

    letter-spacing:1px;

    text-transform:uppercase;

}