/* Composer Website Manager – frontend design */
body.cwm-managed-page {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 300;
    color: #17222b;
}
body.cwm-managed-page h1,
body.cwm-managed-page h2,
body.cwm-managed-page h3,
body.cwm-managed-page h4,
body.cwm-managed-page .wp-block-button__link {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 300;
}
body.cwm-managed-page p { font-weight: 300; }

/* Subpages continue to use Blocksy as their visual and structural basis. */
.cwm-subpage .site-main {
    max-width: var(--cwm-subpage-width);
    margin: clamp(24px, 5vw, 72px) auto;
    padding: 0 24px;
    background: transparent;
}
.cwm-content-surface {
    background: color-mix(in srgb, var(--cwm-content-background) 90%, transparent);
    padding: clamp(36px, 5vw, 72px) clamp(24px, 5vw, 64px);
    max-width: var(--cwm-subpage-width);
    margin: 0 auto;
}
.cwm-content-surface > p,
.cwm-content-surface > h1,
.cwm-content-surface > h2,
.cwm-content-surface > h3 { max-width: var(--cwm-text-width); }

/* Homepage: remove Blocksy's visible frame only here. */
body.cwm-homepage {
    margin: 0;
    background: #fff;
}
body.cwm-homepage .hero-section,
body.cwm-homepage .page-title,
body.cwm-homepage .entry-header,
body.cwm-homepage .ct-breadcrumbs {
    display: none !important;
}
body.cwm-homepage #main,
body.cwm-homepage .site-main,
body.cwm-homepage .ct-container-full,
body.cwm-homepage .ct-container,
body.cwm-homepage article,
body.cwm-homepage .entry-content {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}
body.cwm-homepage #main,
body.cwm-homepage .site-main {
    background: #fff !important;
}
body.cwm-homepage article > .entry-content {
    margin-top: 0 !important;
}

.cwm-hero {
    box-sizing: border-box;
    width: 100%;
    min-height: var(--cwm-hero-desktop);
    margin: 0;
    background-color: #eef4f6;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden;
}
/* The homepage uses Blocksy's real header and WordPress menu management.
   It is merely placed transparently over the plugin hero. */
body.cwm-homepage #header,
body.cwm-homepage header#header,
body.cwm-homepage .ct-header {
    position: absolute !important;
    inset: 0 0 auto 0;
    z-index: 20;
    width: 100%;
    background: transparent !important;
}
body.cwm-homepage #header [data-row],
body.cwm-homepage .ct-header [data-row],
body.cwm-homepage #header .ct-container,
body.cwm-homepage .ct-header .ct-container {
    background: transparent !important;
    box-shadow: none !important;
    border: 0 !important;
}
body.cwm-homepage #header .ct-container,
body.cwm-homepage .ct-header .ct-container {
    width: min(calc(100% - 48px), var(--cwm-hero-content-width)) !important;
    max-width: var(--cwm-hero-content-width) !important;
    margin-inline: auto !important;
    padding-inline: 0 !important;
}
body.cwm-homepage #header a,
body.cwm-homepage .ct-header a {
    text-shadow: none;
}
body.cwm-homepage .ct-sticky-container,
body.cwm-homepage [data-sticky] {
    background: transparent;
}

.cwm-hero-inner {
    width: min(calc(100% - 64px), var(--cwm-hero-content-width));
    margin: auto;
    padding-top: 72px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: clamp(36px, 5vw, 90px);
    position: relative;
    z-index: 1;
}
.cwm-hero-art { flex: 1 1 54%; }
.cwm-hero-art img { display: block; width: 100%; height: auto; }
.cwm-hero-brand { flex: 0 1 43%; text-align: left; }
.cwm-hero-name {
    font-size: clamp(3rem, 5.3vw, 6.3rem);
    line-height: 1.02;
    font-weight: 200;
    letter-spacing: -.025em;
}
.cwm-hero-tagline {
    font-size: clamp(.92rem, 1.35vw, 1.45rem);
    font-weight: 300;
    letter-spacing: .24em;
    text-transform: uppercase;
    margin-top: .72em;
}
.cwm-hero-layout-centered .cwm-hero-inner { flex-direction: column; justify-content: center; text-align: center; }
.cwm-hero-layout-centered .cwm-hero-brand { text-align: center; flex: 0; }
.cwm-scroll-indicator { position: absolute; bottom: 18px; left: 50%; transform: translateX(-50%); font-size: 2rem; }

.cwm-home-content { background: #fff; }
.cwm-home-positioning,
.cwm-home-recording,
.cwm-home-commission,
.cwm-home-links {
    max-width: var(--cwm-content-width);
    margin: 0 auto;
    padding: var(--cwm-section-spacing) 24px;
}
.cwm-home-positioning {
    max-width: none;
    padding-left: max(24px, calc((100vw - var(--cwm-content-width))/2 + 24px));
    padding-right: max(24px, calc((100vw - var(--cwm-content-width))/2 + 24px));
    background: #fff;
}
.cwm-home-positioning > p { max-width: var(--cwm-text-width); margin-left: auto; margin-right: auto; }
.cwm-home-positioning h1 { font-weight: 300; }
.cwm-home-recording { padding-top: calc(var(--cwm-section-spacing) * .72); }
.cwm-featured-recording-placeholder {
    border: 1px solid rgba(23,34,43,.22);
    padding: 42px;
    text-align: center;
    background: #fff;
}
.cwm-home-commission { text-align: center; background: #f3f6f7; }
.cwm-home-links { padding-top: calc(var(--cwm-section-spacing)/2); }
.cwm-home-links .wp-block-button__link { min-width: 160px; }
.cwm-managed-page .wp-block-button__link { letter-spacing: .05em; border-radius: 0; }

@media(max-width:1000px) {
    .cwm-hero { min-height: var(--cwm-hero-tablet); }
    .cwm-hero-inner {
        width: calc(100% - 40px);
        flex-direction: column;
        justify-content: center;
        text-align: center;
        padding-top: 100px;
        padding-bottom: 34px;
        gap: 20px;
    }
    .cwm-hero-brand { text-align: center; flex: 0 1 auto; }
    .cwm-hero-art { max-width: var(--cwm-choir-mobile-width) !important; flex: 0 1 auto; }
    .cwm-home-links { gap: 16px; }
}
@media(max-width:680px) {
    .cwm-hero { min-height: var(--cwm-hero-mobile); align-items: flex-start; }
    .cwm-hero-inner {
        position: absolute;
        inset: 78px 18px 18px;
        width: auto;
        padding: 0;
        justify-content: center;
    }
    .cwm-hero-name { font-size: clamp(2.55rem, 13vw, 4rem); }
    .cwm-hero-tagline { font-size: .78rem; letter-spacing: .16em; }
    .cwm-home-positioning,
    .cwm-home-recording,
    .cwm-home-commission,
    .cwm-home-links { padding-left: 18px; padding-right: 18px; }
    .cwm-home-links { display: block; }
    .cwm-home-links .wp-block-column { margin-bottom: 14px; }
}