*{margin:0;padding:0;box-sizing:border-box}
:root{
  --bg:#f5f6fa;--fg:#202122;--muted:#6b7280;
  --brand:#0645ad;--brand-dark:#042f7c;
  --card:#ffffff;--bd:#e5e7eb;--ok:#28a745;--no:#dc3545;
  --shadow:0 2px 8px rgba(0,0,0,.06);
}
html,body{height:100%}
body{font-family:Arial,Helvetica,sans-serif;
  background-image: url(2.png);

  color:var(--fg);
  line-height:1.55}
a{color:var(--brand);
  text-decoration:none}
a:hover{text-decoration:underline}

header{
  position:sticky;
  top:0;
  left:0;
  right:0;
  background:#fff;
  border-bottom:8px dashed black;
  padding:10px 18px;
  z-index:1000;
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  box-shadow:var(--shadow);
  background-image: url(3.png);
  height:150pt;

}

.logo{
  margin-left: 15%;
  width: 500px;
  height: auto;
  transition: transform 0.3s ease;   
}
.logo:hover {
  transform: scale(1.2); 
}

.brand{display:flex;align-items:center;gap:12px;cursor:pointer}

.brand img{height:150px; width:auto; object-fit:contain; display:block; filter:drop-shadow(0 2px 2px rgba(0,0,0,.1));}

nav{display:flex;align-items:center;flex-wrap:wrap;gap:10px}

nav a,nav button,nav span{font-weight:700;color:var(--brand);background:none;border:none;cursor:pointer}

nav button:hover,nav a:hover{text-decoration:underline}

main{max-width:1100px;margin:0 auto;padding:110px 18px 40px}

.card{background:var(--card);border:1px solid var(--bd);border-radius:12px;box-shadow:var(--shadow)}

.republic-list{list-style:none;display:flex;flex-wrap:wrap;gap:16px}

.republic-item{display:flex;align-items:center;justify-content:space-between;width:calc(50% - 8px);

  padding:12px;border-radius:12px;border:1px solid var(--bd);background:#fff;box-shadow:var(--shadow);cursor:pointer;transition:.15s}
.republic-item:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(0,0,0,.08)}

.republic-item .left{display:flex;align-items:center;gap:10px}

.republic-item img.logo{width:48px;height:48px;border-radius:8px;border:1px solid #d1d5db;object-fit:cover;background:#eee}
.status{padding:2px 8px;border-radius:999px;color:#fff;font-size:.8rem;font-weight:700}

.status.active{background:var(--ok)} .status.inactive{background:var(--no)}

.article{display:flex;flex-direction:column;gap:16px;
    border-style: dashed;
    padding: 100px 100px;
    border-radius: 15px;
    background-color: #fff2e3;
    box-sizing: border-box;}

  .cardSection{
     border-style: dashed;
    padding: 100px 100px;
    border-radius: 15px;
    background-color: #ff008d;
    box-sizing: border-box;
  }

.article-header{display:flex;gap:18px;flex-wrap:wrap}


.infobox{flex:0 0 240px} .infocard{padding:12px}
.infobox img{width:100%;border-radius:12px;border:1px solid var(--bd);box-shadow:var(--shadow);cursor:pointer}
.article-info{flex:1;display:flex;flex-direction:column;gap:8px}
.kv p{margin:0 0 4px}
.kv strong{color:#111827}
.kv{
  border-style: dashed;
    padding: 10px 10px;
    border-radius: 15px;
    box-sizing: border-box;
}
#historico{
    border-style: dashed;
    padding: 10px 10px;
    border-radius: 15px;
    box-sizing: border-box;
}
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px; border-style: dashed; border-radius: 15px; }
.gallery img{width:100%;height:140px;object-fit:cover;border-radius:10px;border:1px solid var(--bd);box-shadow:var(--shadow);cursor:pointer;transition:transform .15s}
.gallery img:hover{transform:scale(1.03)}

.form label{display:block;font-weight:700;margin:8px 0 4px}
.form input,.form textarea,.form select{width:100%;padding:10px;border:1px solid var(--bd);border-radius:10px}
.form textarea{min-height:90px}
.form .row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.form .actions{margin-top:12px;display:flex;gap:8px}
.btn{background:var(--brand);color:#fff;border:none;border-radius:10px;padding:10px 14px;font-weight:700;cursor:pointer}
.btn:hover{background:var(--brand-dark)} .btn.secondary{background:#1118271a;color:#111827}
.btn.danger{background:var(--no)} .btn.info{background:#17a2b8}

.lightbox{display:none;position:fixed;inset:0;background:rgba(0,0,0,.85);z-index:2000;align-items:center;justify-content:center}
.lightbox img{max-width:92%;max-height:92%;border-radius:12px;border:1px solid #000}

.search{display:flex;gap:10px;align-items:center;margin-bottom:14px}
.search input{padding:10px;border:1px solid var(--bd);border-radius:10px;flex:1}

@media (max-width:768px){
  .republic-item{width:100%}
  .infobox{flex:1 1 100%}
}

.botao {
    background-color: black;      
    color: white;              
    border: none;             
    border-radius: 25px;     
    padding: 15px 25px;        
    font-size: 16px;          
    cursor: pointer;            
    transition: background-color 0.3s ease; 
   }
  .botao:hover {
    background-color: #ff008d; 
  }

  .botaoSecundario {
    background-color: #f48a58;      
    color: black;              
    border: none;             
    border-radius: 12px;     
    padding: 7px 12px;        
    font-size: 16px;          
    cursor: pointer;
    border-style: dashed;            
    transition: background-color 0.3s ease; 
   }
  .botaoSecundario:hover {
    background-color: #ff008d; 
  }

  .apresentacao{
    border-style: dashed;
    padding: 50px 50px;
    border-radius: 30px;
    background-color: #fff2e3;
    box-sizing: border-box;
  } 

  .rodape{
    text-align: center;
    background-color:#383838;
    color:#f48a58 ;
  }
  .rodapeDiv{
    text-align: center;
    border-style: double;
    border-color: #f48a58;      
    border-radius: 30px;         
    width: 500px;
    height: 130px; 
    align-items: center;
    display: flex;
    justify-content: center;
    margin-left: 30%;
    margin-right: 50%;
  }

  .imgRodape{
      width: 200px;   
      height: auto;
      text-align: right;  
  }

  .forNovRepub{
    border-style: dashed;
    padding: 100px 100px;
    border-radius: 15px;
    background-color: #fff2e3;
    box-sizing: border-box;
  }