/**
 * METEO SANTA SUSANNA
 * Fitxer: public/assets/css/content-page.css
 * Versió: 1.5.8p1
 *
 * Desenvolupament i proveïdor: SOMOSDIGITAL.NET
 * © 2026 SOMOSDIGITAL.NET
 */
.content-page{max-width:1200px;margin:0 auto;padding:24px 16px 34px}
.content-page__card{border:1px solid var(--line,#d6e1e8);border-radius:20px;background:var(--panel,#fff);padding:28px 30px;box-shadow:0 8px 24px rgba(22,46,72,.06)}
.content-page__heading{padding-bottom:20px;margin-bottom:22px;border-bottom:1px solid var(--line,#d6e1e8)}
.content-page__heading h1{margin:0 0 10px;font-size:clamp(1.75rem,3vw,2.4rem)}
.content-page__heading p{margin:0;color:var(--muted,#667d8c);font-size:1.02rem;line-height:1.6}
.content-page__body{font-size:1rem;line-height:1.72}
.content-page__body h2{margin-top:1.7em}.content-page__body h3{margin-top:1.45em}
.content-page__body img{max-width:100%;height:auto;border-radius:14px}
.content-page__body figure{margin:24px 0}.content-page__body figcaption{margin-top:7px;color:var(--muted,#667d8c);font-size:.86rem}
.content-page__pending{color:var(--muted,#667d8c);font-style:italic}
@media(max-width:600px){.content-page{padding:18px 12px 24px}.content-page__card{padding:20px 18px;border-radius:16px}}


/* v1.5.7d – CMS section headings aligned with Wetternetzwerke */
.content-page__card{
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    padding:0 !important;
}

.content-page__heading{
    margin:0 0 22px !important;
    padding:22px 24px !important;
    border:1px solid var(--line,#d6e1e8) !important;
    border-radius:0 !important;
    background:var(--panel,#fff) !important;
    box-shadow:none !important;
}

.content-page__heading h1{
    margin:0 0 6px !important;
    color:var(--text,#173246) !important;
}

.content-page__heading p{
    margin:0 !important;
    color:var(--muted,#667d8c) !important;
}

.content-page__body{
    padding:0 2px;
}

html[data-theme="dark"] .content-page__heading{
    background:var(--panel,#142a38) !important;
    border-color:var(--line,#2c4555) !important;
}

html[data-theme="dark"] .content-page__heading h1{
    color:var(--text,#f2f7fa) !important;
}

html[data-theme="dark"] .content-page__heading p{
    color:var(--muted,#a8bdca) !important;
}

@media(max-width:600px){
    .content-page__heading{
        padding:18px 18px !important;
    }
}


/* v1.5.7e – CMS page headings exactly aligned with Wetternetzwerke */
.content-page{
    max-width:1200px;
    margin:0 auto;
    padding:16px;
}

.content-page__card{
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    padding:0 !important;
}

.content-page__heading.page-heading{
    display:block !important;
    margin:0 0 18px !important;
    padding:22px 24px !important;
    border:1px solid var(--line,#d5e1e7) !important;
    border-radius:0 !important;
    background:var(--panel,#fff) !important;
    box-shadow:none !important;
}

.content-page__heading.page-heading > div{
    display:block !important;
    width:100% !important;
}

.content-page__heading.page-heading h2{
    display:block !important;
    margin:0 0 6px !important;
    padding:0 !important;
    font-size:1.5rem !important;
    line-height:1.2 !important;
    font-weight:700 !important;
    color:var(--text,#173246) !important;
    text-align:left !important;
}

.content-page__heading.page-heading p{
    display:block !important;
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
    color:var(--muted,#687c8a) !important;
    font-size:1rem !important;
    line-height:1.45 !important;
    text-align:left !important;
}

.content-page__body{
    padding:0 2px !important;
}

html[data-theme="dark"] .content-page__heading.page-heading{
    background:var(--panel,#142a38) !important;
    border-color:var(--line,#2c4555) !important;
}

html[data-theme="dark"] .content-page__heading.page-heading h2{
    color:var(--text,#f2f7fa) !important;
}

html[data-theme="dark"] .content-page__heading.page-heading p{
    color:var(--muted,#a8bdca) !important;
}

@media(max-width:580px){
    .content-page{
        padding:14px;
    }

    .content-page__heading.page-heading{
        margin-bottom:16px !important;
        padding:18px !important;
    }

    .content-page__heading.page-heading h2{
        font-size:1.5rem !important;
        line-height:1.2 !important;
    }

    .content-page__heading.page-heading p{
        font-size:1rem !important;
        line-height:1.45 !important;
    }
}


/* v1.5.7f – restore separate rounded content box below heading */
.content-page__body{
    display:block;
    margin-top:0 !important;
    padding:22px 24px !important;
    border:1px solid var(--line,#d5e1e7) !important;
    border-radius:18px !important;
    background:var(--panel,#fff) !important;
    box-shadow:0 8px 24px rgba(22,46,72,.06) !important;
    min-height:80px;
}

.content-page__body > :first-child{
    margin-top:0;
}

.content-page__body > :last-child{
    margin-bottom:0;
}

.content-page__pending{
    margin:0 !important;
    color:var(--muted,#687c8a) !important;
    font-style:italic;
}

html[data-theme="dark"] .content-page__body{
    background:var(--panel,#142a38) !important;
    border-color:var(--line,#2c4555) !important;
    box-shadow:none !important;
}

html[data-theme="dark"] .content-page__pending{
    color:var(--muted,#a8bdca) !important;
}

@media(max-width:900px){
    .content-page__body{
        padding:20px 20px !important;
        border-radius:16px !important;
    }
}

@media(max-width:580px){
    .content-page__body{
        padding:18px 18px !important;
        border-radius:16px !important;
        min-height:64px;
    }
}