/*
Theme Name: FDM-B
Description: Tema minimalista per Filla del Mar
Version: 2.0 — Neteja i estandardització
*/

/* ============================
   GLOBAL
============================ */

html, body {
    margin: 0;
    padding: 0;
    font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
    background: #fff;
    overflow-x: clip;
    height: 100%;
}

img {
    max-width: 100%;
    height: auto; /* ✔ CORRECTE */
}

/* ============================
   LAYOUT GLOBAL
============================ */

/* ============================
   FDM DESIGN SYSTEM
============================ */

:root {

    /* amplades */
    --fdm-max-width: 1100px;
    --fdm-max-width-narrow: 820px;

    /* espais */
    --fdm-space-xs: 8px;
    --fdm-space-sm: 16px;
    --fdm-space-md: 24px;
    --fdm-space-lg: 40px;

    /* cards */
    --fdm-card-radius: 14px;
    --fdm-card-border: 1px solid #e5e5e5;

    /* ombres */
    --fdm-shadow-soft:
        0 2px 10px rgba(0,0,0,0.04);

    --fdm-shadow-hover:
        0 8px 18px rgba(0,0,0,0.08);

    /* tipografia */
    --fdm-text-main: #222;
    --fdm-text-soft: #777;

    /* transicions */
    --fdm-transition:
        all 0.25s ease;
}

.fdm-main {
    width: 100%;
    margin: 0;
    flex: 1;
    padding: 0 0 40px 0;
}

.fdm-main-inner {
    width: 100%;
    max-width: 1100px; /* AMPLADA FLUIDA */
    margin: 0 auto;
    padding: 20px 16px; /* MARGE COMPACTE */
    box-sizing: border-box;
}

.fdm-page-wrapper {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

/* ============================
   TÍTOLS DE PÀGINA
============================ */

.fdm-page-header-block {
    width: 100%;
    max-width: 1100px;
    margin: 16px auto;
    text-align: center;
}

.fdm-page-title {
    margin: 0 0 12px 0;
    font-size: 2.2rem;
    font-weight: 600;
}

/* ============================
   CONTINGUT DE PÀGINA
============================ */

.fdm-page-content {
    margin: 0 auto 20px auto;
    padding-top: 1px; /* evita margin collapsing */
}

/* ============================
   IMATGE DESTACADA
============================ */

.fdm-featured-image {
    width: 100%;
    max-width: 1100px;
    margin: 20px auto;
}

.fdm-featured-image img {
    width: 100%;
    height: auto;
    border-radius: 60px;
    object-fit: cover;
    display: block;
}

/* ============================
   IMATGE PORTADA (INICI)
============================ */

/* ============================
   IMATGE PORTADA (INICI)
============================ */

.wp-block-image.imatge-portada {
    width: 100%;
    max-width: 900px;
    margin: 20px auto;
    display: flex;
    justify-content: center;
}

.wp-block-image.imatge-portada img {
    width: 78%;   /* abans 86% */
    height: auto;

    border-radius: 20px;

    object-fit: cover;
    object-position: center;

    box-shadow: 0 6px 18px rgba(0,0,0,0.05);

    transition: transform 0.4s ease, box-shadow 0.4s ease;
}

.wp-block-image.imatge-portada img:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 26px rgba(0,0,0,0.08);
}

/* ============================
   SINGLE CANÇÓ (CPT)
============================ */

.canco-single-layout {
    display: grid;
    grid-template-columns: 1fr 1.3fr;
    gap: 30px;
    padding: 20px 0;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}

@media (max-width: 1024px) {
    .canco-single-layout {
        grid-template-columns: 1fr;
    }
}

.canco-single-image img {
    width: 100%;
    border-radius: 14px;
    object-fit: cover;
    box-shadow: 0 8px 28px rgba(0,0,0,0.15);
}

/* Camps ACF */
.canco-single-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.canco-field {
    margin-bottom: 0.8rem;
}

.canco-label {
    font-size: 0.9rem;
    color: #777;
}

.canco-value {
    font-size: 1rem;
    font-weight: 500;
}

/* Descripció */
.canco-descripcio {
    grid-column: 1 / -1;
    margin: 20px 0;
    padding: 20px 0;
    text-align: center;
    border-top: 1px solid rgba(0,0,0,0.1);
}

/* Lletra */
.canco-lletra {
    margin-top: 2rem;
}

/* ============================
   FOOTER
============================ */

#fdm-global-footer {
    text-align: center;
    padding: 24px 20px;
    font-size: 0.9em;
    color: inherit;
    opacity: 0.7;
    border-top: 1px solid rgba(0,0,0,0.08);
}

/* ============================
   SUBTÍTOL
============================ */

.fdm-subtitle {
    text-align: center;
    margin: 12px 0 20px 0;
    font-size: 1.2rem;
}
/* --- Ajustos locals només per al bloc Escolta --- */

/* Contenidor inline i alineació vertical */
.canco-escolta-inline {
    display: inline-flex;
    align-items: center; /* Alinea icones + text */
    gap: 0.8rem; /* Espai entre plataformes */
    flex-wrap: wrap;
}

/* Icones */
.canco-escolta-inline .canco-icon {
    width: 18px;
    height: 18px;
    margin-right: 4px; /* Espai entre icona i nom */
    vertical-align: middle;
}

/* Enllaços dels media → estil de text normal */
.canco-escolta-inline a {
    display: inline-flex;
    align-items: center;
    font-family: inherit; /* Mateixa font del site */
    font-size: 1em;
    color: inherit; /* Mateix color que el text */
    text-decoration: none; /* Treu subratllat */
}

/* Hover suau */
.canco-escolta-inline a:hover {
    opacity: 0.8;
}

/* Alineació vertical de la etiqueta “Escolta a:” */
.canco-field .canco-label {
    display: inline-flex;
    align-items: center;
    margin-right: 10px; /* Espai entre etiqueta i media */
}
.fdm-site-shell {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}
/*body {
    outline: 5px solid red;
}*/
img.wp-post-image {
    border-radius: 22px !important;
    display: block;
    margin: 20px auto;
    box-shadow: 0 10px 30px rgba(0,0,0,0.08);
}