:root {
    --primary-color: #E04030;
    --accent-color: #f19f4d;
    --text-color: #21314d;
    --bg-soft: #f5f7fb;
    --shadow: 0 0.75rem 1.5rem rgba(18, 38, 63, 0.08);
    --radius: 0.9rem;
}

body {
	background-color:#424242;
	background-image: 
	linear-gradient(30deg, #484848 12%, transparent 12.5%, transparent 87%, #484848 87.5%, #484848),
	linear-gradient(150deg, #484848 12%, transparent 12.5%, transparent 87%, #484848 87.5%, #484848),
	linear-gradient(30deg, #484848 12%, transparent 12.5%, transparent 87%, #484848 87.5%, #484848),
	linear-gradient(150deg, #484848 12%, transparent 12.5%, transparent 87%, #484848 87.5%, #484848),
	linear-gradient(60deg, #3F3F3F 25%, transparent 25.5%, transparent 75%, #3F3F3F 75%, #3F3F3F), 
	linear-gradient(60deg, #3F3F3F 25%, transparent 25.5%, transparent 75%, #3F3F3F 75%, #3F3F3F);
	background-size:20px 35px;
	background-position: 0 0, 0 0, 10px 17.5px, 10px 17.5px, 0 0, 10px 17.5px;
}

a {
    color: #A2D5F2;
    color: var(--primary-color);
    text-decoration: none;
}
@font-face {
  font-family: 'Moonglade';
  src: url('includes/Moonglade.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
}

h1 {
  font-family: 'Moonglade', sans-serif;
  font-size: 2em;
  color: #222;
}
h3 {
  font-family: 'Moonglade', sans-serif;
  
  
}
a:hover {
    color: var(--accent-color);
}
.text-primary
{
	color: white !important;
}
.text-muted
{

}
.site-header {
	background-color:#E04030;
    
    padding: 0.75rem 0;
}

.navbar-brand {
    letter-spacing: 0.05em;
		
}

.navbar-dark .navbar-nav .nav-link {
    color: rgba(255, 255, 255, 0.8);
    font-weight: 500;
	font-size: 1.5em;
margin:20px;
}

.navbar-dark .navbar-nav .nav-link.active,
.navbar-dark .navbar-nav .nav-link:hover {
    color: #fff;
	font-weight: 700;
	font-size: 1.7em;
	margin:20px;
}

.page-hero img,
.building-gallery img,
.unit-gallery img {
    object-fit: cover;
    max-height: 480px;
}

.placeholder-image {
    min-height: 220px;
    background: rgba(26, 79, 139, 0.08);
    border-radius: var(--radius);
}

.page-content {
    background-color: #fff;
    padding: 2rem;
    border-radius: var(--radius);
    box-shadow: var(--shadow);
}

.page-content p {
    margin-bottom: 1rem;
}

.building-card {
    border: none;
    border-radius: var(--radius);
    overflow: hidden;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.building-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow);
}

.building-card .card-img-top {
    height: 200px;
    object-fit: cover;
}

.site-footer {
    background: #E04030;
    color: #dbe3f3;
}

.site-footer p {
    margin-bottom: 0;
}

.card {
    border: none;
    border-radius: var(--radius);
    box-shadow: var(--shadow);
	background-color:#B7B7B7;
}

.btn-primary {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

.btn-outline-primary {
    color: var(--primary-color);
    border-color: var(--primary-color);
}

.btn-outline-primary:hover {
    background-color: var(--primary-color);
    color: #fff;
}

.table thead th {
    background-color: rgba(26, 79, 139, 0.08);
    color: var(--primary-color);
    border-bottom: none;
}

.table-striped > tbody > tr:nth-of-type(odd) {
    --bs-table-accent-bg: rgba(26, 79, 139, 0.04);
}

.carousel-item img {
    border-radius: var(--radius);
}

@media (max-width: 768px) {
    .page-content {
        padding: 1.5rem;
    }

    .building-card .card-img-top {
        height: 180px;
    }
}

/* GRID SIMÉTRICO DE 4 COLUMNAS */
.gallery-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 25px;
    margin-top: 15px;
}

/* TARJETA DE IMAGEN */
.gallery-item {
    background: #f0f0f0;
    border-radius: 10px;
    border: 1px solid #ccc;
    padding: 12px;
    text-align: center;
    display: flex;
    flex-direction: column;
    height: 100%; /* todas iguales */
}

/* IMAGEN FIJA */
.gallery-item img {
    width: 100%;
    height: 180px;      /* <-- Ajustá si querés más alto */
    object-fit: cover;  /* recorta sin deformar */
    border-radius: 5px;
    background: #fff;
}

/* CUERPO DE LA TARJETA */
.gallery-item form,
.gallery-item .controls {
    margin-top: auto; /* todo lo que esté debajo queda pegado abajo */
}

/* BOTONES DE SUBIR/BAJAR */
.gallery-item .controls button {
    width: 35px;
    padding: 2px 5px;
}