/* ===================================================
   Urbanismo – Estilo exclusivo da página
   Versão limpa, moderna e minimal
=================================================== */

/* ---------- Estrutura Base ---------- */

/* ===== Gestão Territorial ===== */

/* CONTAINER */

html{
scroll-behavior:smooth;
}

.urb-container{
max-width:1100px;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
font-size: 16px;
line-height: 1.7;
color: #2c2c2c;
-webkit-font-smoothing: antialiased;
 -moz-osx-font-smoothing: grayscale;
margin: 0 auto;
/* padding: 0 15px 60px;*/
}

/* HEADER */
.page-header{
margin-bottom:40px;
}

.page-header h1{
margin-top: 60px;
	font-size: 32px;
    margin-bottom: 18px;
	color: #1a1a1a;
}

.intro{
font-size:16px;
max-width:700px;
line-height:1.5;
}

/* LAYOUT 2 COLUNAS */
.layout{
display:flex;
gap:40px;
align-items:flex-start;
}

/* CONTEÚDO */
.main-content{
flex:1;
min-width:0;
max-width: 800px;
}

.grupo-seccoes h2{
margin-top: 60px;
	font-size: 24px;
    margin-bottom: 18px;
	color: #1a1a1a;
	}

.nota{
margin-top:10px;
font-size:14px;
}


.disclaimer{
margin-top:50px;
font-size:13px;
color:#666;
max-width:700px;
}


/* SIDEBAR */
.sidebar{
margin-top: 50px;
width:220px;
font-size:14px;
}

.sidebar-sticky{
position: sticky;
top: 50px;
align-self:flex-start;
}

.sidebar-nav{
display:flex;
flex-direction:column;
gap:10px;
}

.sidebar h3{
font-size:16px;
margin:20px 0 8px;
text-transform:uppercase;
}

/* BLOCOS SIDEBAR */
.side-block{
margin-bottom:30px;
}

.side-block h3{
font-size:18px;
margin-bottom:10px;
}

.side-block ul{
list-style:none;
padding:0;
margin:0;
}

.side-block li{
margin-bottom:6px;
}

.side-block a{
text-decoration:none;
color:#333;
}

/* TÍTULOS */
.urb h2{
font-size:24px;
margin-top:60px;
margin-bottom:20px;
color: #333;
}

.urb h3{
font-size:20px;
margin-bottom:6px;
}




/* FLEX GRID */
.flex-grid{
display:flex;
flex-wrap:wrap;
gap:40px;
margin-bottom:10px;
}

/* CAIXAS */

.section{
margin-bottom:50px;
}


.box{
flex:1 1 260px;
padding:22px 20px;
border-left:4px solid #6fb7a3;
background: #F7F9FA;
border-radius: 10px;
box-shadow: 0 6px 18px rgba(0,0,0,0.06);
text-decoration:none;
color:#333;
margin-bottom:10px;
}

.box:hover{
border-left:5px solid #0e896b;
text-decoration: none !important;
color:#333;
}

.box-2{
flex:1 1 260px;
padding:22px 20px;
border-left:3px solid #c7e2d3;
border-radius: 10px;
box-shadow: 0 1px 3px rgba(0,0,0,0.08);
text-decoration:none;
color:#333;
margin-bottom:10px;
}


.box-2:hover{
border-left:5px solid #0e896b;
box-shadow: 0 9px 22px rgba(0,0,0,0.08);
background: #F7F9FA;
text-decoration: none !important;
color:#333;
}

.box-2 h3{
font-size:20px;
color:#333;
margin-bottom:6px;
}

.box-2 p{
font-size:16px;
color:#333;
margin-bottom:6px;
}

.box h3{
font-size:20px;
color:#333;
margin-bottom:6px;
}

.box p{
font-size:16px;
color:#333;
margin-bottom:6px;
}

.box.disabled {
    pointer-events: none;
    cursor: default;
}

.flex-cards{
display:flex;
flex-wrap:wrap;
gap:22px;
margin-top: 20px;
margin-bottom: 40px;
}

.card{
flex:1 1 260px;
padding: 24px;
border-left:3px solid #bfd9c8;
text-decoration:none;
color:#333;
background: #F7F9FA;
border-radius: 10px;
}

.card:hover{
background-color:#f3f6f8;
text-decoration: none !important;
border-left-width:6px;
}

.card h3{
font-size:20px;
margin-bottom:6px;
color:#333;
}

.card p{
font-size:16px;
color:#555;
}

.verde .card{
border-left-color:#0e896b;
}

.terrenos .card{
border-left-color:#bfd9c8;
}

.cinza .card{
border-left-color:#2f3439;
}


.azul .card{
border-left-color:#0069A1;
}

.laranja .card{
border-left-color:#e16f60;
}

.sig-manual {
    background: #F7F9FA;
    padding: 18px 25px;
    border-left: 4px solid #0069A1;
    margin: 30px 0 50px 0;
    font-size: 15px;
}

.sig-manual p{
	font-size:16px;
color:#333;
margin-bottom:15px;
}


.exemplo{
background:#f9f0e0;
padding:12px;
border-left:4px solid #f6b89b;
}

.indice{
font-size:13px;
color:#666;
margin-bottom:20px;
margin-top:20px
}

.indice a{
color:#0069A1;
text-decoration:none;
margin-right:10px;
}

.indice a:hover{
text-decoration:underline;
}

.topo-link{
display:block;
text-align:left;
font-size:14px;
margin-top:10px;
margin-bottom:30px;
color:#777;
font-weight: 600;
}

.sig-equip-bloco{
    scroll-margin-top:90px;
	padding: 30px 25px;
	border-left:3px solid #c7e2d3;
    margin-bottom:40px;
	margin-top:40px;
	border-bottom:1px solid #ddd;
	border-radius:6px;
	box-shadow:0 1px 3px rgba(0,0,0,0.08);
	transition: background-color 0.2s ease, border-left-width 0.2s ease;
}

.sig-equip-bloco h2{
font-size:20px;
margin-bottom:25px;
color:#333;
}

.sig-equip-bloco h3{
font-size:16px;
margin-top:22px;
margin-bottom:8px;
color:#104834;
border-left:3px solid #bfd9c8;
padding-left:8px;
}

.sig-equip-bloco p{
font-size:14px;
color:#333;
margin-bottom:15px;

}	


.sig-equip-lista{
    list-style:none;
    padding:0;
    margin-top:20px;
}

.sig-equip-lista li{
    display:grid;
    grid-template-columns:1fr auto;
    align-items:start;
    gap:20px;
	font-size:14px;
	color:#333;
    padding:6px 0;
    
}

.sig-equip-lista li:hover{
    background-color:#F7F9FA;
}

.texto small {
  display:block;
  font-size:0.9em;
  color:#666;
}

.sig-botao { 
	background-color: #f3f6f8;
	color: #00527d !important;
	display: block;
	padding: 6px 6px;
	font-weight: 600;
	text-decoration: none !important;
	border-radius: 8px;
	font-size: 14px;
	border:1px solid #e5e5e5;
}

.sig-botao:hover{
background-color: transparent; /* 👈 tirar fundo */
}

.sig-botao-puce {
    background-color: #D6E6DC;
	color: #104834 !important;
	display: inline-block;
    padding: 10px 18px;
	font-weight: 600;
    text-decoration: none !important;
    border-radius: 8px;
    font-size: 14px;
	border:1px solid #e5e5e5;
    transition: background 0.2s ease, transform 0.1s ease;
}

.sig-botao-puce:hover {
    background-color: transparent; /* 👈 tirar fundo */
	
}

.acao-direita{
  text-align:right;
  margin-top:10px;
}

.acao-direita a {
  display: inline-block;
  min-width: 220px; /* ou o que fizer sentido no teu layout */
  text-align: center;
}

.sig-botao-verde { 
	background-color: #D6E6DC;
	color: #104834 !important;
	display: inline-block;
	margin-top:10px;
	padding:10px 18px;
    max-width:260px;
	font-weight: 600;
	text-decoration: none !important;
	border-radius: 8px;
	font-size: 14px;
	border:1px solid #e5e5e5;
}

.sig-botao-verde:hover{
background-color: transparent; /* 👈 tirar fundo */
}

.sig-botao-longo { 
	background-color: #D6E6DC;
	color: #104834 !important;
	display: inline-block;
	margin-top:10px;
	padding:10px 18px;
    font-weight: 600;
	text-decoration: none !important;
	border-radius: 8px;
	font-size: 14px;
	border:1px solid #e5e5e5;
}

.sig-botao-longo:hover{
background-color: transparent; /* 👈 tirar fundo */
}

.sig-botao-coral { 
	background-color: #f9f0e0;
	color: #333 !important;
	display: inline-block;
	margin-top:10px;
	padding:10px 18px;
    font-weight: 600;
	text-decoration: none !important;
	border-radius: 8px;
	font-size: 14px;
	border:1px solid #e5e5e5;
}

.sig-botao-coral:hover{
background-color: transparent; /* 👈 tirar fundo */
}



.sig-botao-old { 
	background-color: #0069A1;
	color: #ffffff !important;
	display: block;
    padding: 10px 18px;
	font-weight: 600;
    text-decoration: none !important;
    border-radius: 6px;
    font-size: 14px;
    transition: background 0.2s ease, transform 0.1s ease;
}


.sig-botao-old:hover {
    background-color: #00527d;
	color: #ffffff !important;
}

.sig-btn {
	background-color:#0e896b;
	color: #ffffff !important;
	display: inline-block;
    padding: 10px 38px;
	font-weight: 600;
    text-decoration: none !important;
    border-radius:10px;
    font-size: 14px;
    transition: background 0.2s ease, transform 0.1s ease;
	}
	
.sig-btn:hover {
    background-color: #bfd9c8;
	color: #ffffff !important;
}

.botoes-pip{
    gap:12px;
    margin-top:20px;
}

.botoes-pip .sig-botao-longo{
    flex:1 1 180px;
    text-align:center;
    margin-top:0;
}

/* DEFINIÇÕES */

.definicoes{
display:flex;
gap:20px;
margin-bottom:40px;
margin-top:40px;
}

.def-box{
flex:1;
padding:20px;
border-left:3px solid #0e896b;
border-bottom:1px solid #ddd;
border-radius:6px;
box-shadow:0 1px 3px rgba(0,0,0,0.08);
}

.def-box h2{
font-size:18px;
margin-bottom:10px;
color:#333;
}

.def-box p{
font-size:16px;
color:#333;
margin-bottom:6px;
}

/* CAIXAS */

.section-box{
scroll-margin-top:90px;
margin-bottom:40px;
margin-top:40px;
padding:20px;
border-left:3px solid #c7e2d3;
border-bottom:1px solid #ddd;
border-radius:6px;
box-shadow:0 1px 3px rgba(0,0,0,0.08);
}


.section-box:first-of-type{
border-left:4px solid #0e896b;
}


.section-box h2{
font-size:20px;
margin-bottom:25px;
color:#333;
}

.section-box h3{
font-size:16px;
margin-top:22px;
margin-bottom:8px;
color:#104834;
border-left:3px solid #bfd9c8;
padding-left:8px;
}

.section-box h3.alt{
font-size:16px;
margin-top:40px;
margin-bottom:8px;
color:#104834;
border-left:3px solid #bfd9c8;
padding-left:8px;
}

.section-box p{
font-size:16px;
color:#333;
margin-bottom:15px;

}

.section-box p.nota{
margin-top:10px;
font-size:14px;
}


.section-box p.disclaimer{
margin-top:50px;
font-size:13px;
color:#666;
max-width:700px;
}

.patrimonio {
border-left: 5px solid #e16f60;
}

.zona-protecao {
border-left: 5px solid #0069A1;
}

/* BLOCO SIG */

.sig-ajuda{
/*margin-bottom:40px;*/
padding:20px 0 20px 20px;
/*border-left:3px solid #0e896b;*/
/*background:#f9fbfa;*/

/*border-radius:6px;*/
}

.sig-ajuda h2{
font-size:20px;
margin-bottom:15px;
}

.sig-ajuda p{
font-size:16px;
color:#333;
margin-bottom:6px;
}

.passos-sig{
display:flex;
gap:20px;
margin:20px 0;
}

.passo{
flex:1;
display:flex;
gap:10px;
}

.numero{
width:26px;
height:26px;
border-radius:50%;
background:#e8f3ef;
display:flex;
align-items:center;
justify-content:center;
font-weight:600;
}

.bloco{
margin-top:40px;
padding:22px;
background:#ffffff;
border-left:3px solid #bfd9c8;
box-shadow:0 2px 6px rgba(0,0,0,0.06);
}

.bloco h2{
margin-top:0;
color:#333;
}

.bloco h3{
margin-top:22px;
margin-bottom:6px;
font-size:18px;
color:#104834;
}

.bloco-acesso{
margin-top:35px;
padding:26px;
background:#fafafa;
border-left:3px solid #bfd9c8;
text-align:center;
}

.definicoes{
margin:12px 0 16px 0;
padding-left:12px;
border-left:3px solid #e6efe9;
}

.definicoes p{
margin:6px 0;
}



/* RESPONSIVO */
@media (max-width:900px){

.layout{
flex-direction:column;
}
.urb-container {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  .sidebar {
    width: 100%;
    margin-top: 30px;
    padding: 0 20px;
  }
  
  .sidebar-sticky {
    position: static;
  }
}



/* ---------- trilho ---------- */

.sig-trilho{
    width: 100%;
	text-align: left;
    font-size:13px;
    color:#666;
	line-height:40px;
	font-weight:600;
}

.sig-trilho a{
    color:#0069A1;
    text-decoration:none;
}

.sig-trilho a:hover{
    text-decoration:underline;
}

.sig-trilho span{
    margin:0 6px;
}

/* página atual */
.sig-trilho .atual{
    color:#104834;
    font-weight:600;
}

