/* CSS Josep Aguilera Solà - blocas.com (20250620) */
body {
    font-family: 'Roboto', 'Merriweather', sans-serif;
    margin: 0;
    background-color: #f8f8f8;
    line-height: 1.5;
}
header {
    background-color: #333;
    color: white;
    padding: 0.5rem 0;
}
.header-content {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 2rem;
}
nav a {
    color: white;
    text-decoration: none;
    margin: 0 1rem;
}
.hero2 {
    background: linear-gradient(to right, #f6e9c7, #f6e9c7);
    padding: 3rem 2rem;
    text-align: center;
}
.hero {
    width: 100%;
    /*padding: 3rem 2rem;*/
    padding: 3rem 0;
    text-align: center;
    background-image: url('../img/Captura1.png'); /* Canvia per la teva ruta */
    background-size: cover;        /* Fa que la imatge ompli tot l'espai */
    background-position: center;   /* Centra la imatge */
    background-repeat: no-repeat;  /* Evita que es repeteixi */
    color: white;                  /* Canvia si necessites contrast */
}
.content {
    max-width: 1200px;
    margin: auto;
    padding: 2rem;
}
.grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));
    gap: 2rem;
}
.linear {

}
.footer {
    grid-column: 1 / -1;   /* Ocupa totes les columnes del grid */
    background-color: #333; /* Fons negre com el header */
    color: white;
    padding: 1rem 2rem;
    text-align: center;
    border-radius: 0.25rem; /* Opcional: una mica d’arrodoniment */
}
pre {
    background-color: whitesmoke; 
    border-radius: 5px; 
    border: 2px solid gray; 
    padding: 10px; 
}


.card-header {
    /* max-width: 300px; */
}

.card-header [slot='header'] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.card-header h3 {
    margin: 0;
}

.card-header sl-icon-button {
    font-size: var(--sl-font-size-medium);
}