/* ============================================================
   YDC THEATRE – ABOUT US
   Shortcode: [ydc_about]
   Epic Business Child / Birzberg Compatible
   ============================================================ */

.ydca-page {
    --ydc-green: #23b580;
    --ydc-green-dark: #16865e;
    --ydc-black: #000000;
    --ydc-grey: #969090;
    --ydc-text: #222222;
    --ydc-muted: #666666;
    --ydc-light: #f6f8f7;
    --ydc-white: #ffffff;
    --ydc-border: #e4e8e6;

    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0;

    color: var(--ydc-text);
    background: var(--ydc-white);

    font-family: Arial, Helvetica, sans-serif;
    line-height: 1.6;

    overflow: hidden;
    position: relative;
}

.ydca-page *,
.ydca-page *::before,
.ydca-page *::after {
    box-sizing: border-box;
}

.ydca-page img {
    max-width: 100%;
    height: auto;
    display: block;
}

.ydca-page a {
    text-decoration: none;
}

.ydca-page h1,
.ydca-page h2,
.ydca-page h3,
.ydca-page p {
    margin-top: 0;
}

.ydca-page section {
    margin: 0;
}

.ydca-container {
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    padding-left: 7%;
    padding-right: 7%;
}


/* ============================================================
   HERO
   ============================================================ */

.ydca-hero {
    position: relative;
    min-height: 650px;

    display: flex;
    align-items: center;

    background:
        radial-gradient(
            circle at 85% 20%,
            rgba(35,181,128,.16),
            transparent 32%
        ),
        linear-gradient(
            135deg,
            #ffffff 0%,
            #f5f8f6 55%,
            #eaf5f0 100%
        );

    overflow: hidden;
}

.ydca-hero::before {
    content: "";

    position: absolute;

    width: 620px;
    height: 620px;

    right: -280px;
    top: -280px;

    border: 2px solid rgba(35,181,128,.16);
    border-radius: 50%;
}

.ydca-hero::after {
    content: "";

    position: absolute;

    width: 350px;
    height: 350px;

    left: -200px;
    bottom: -210px;

    border: 2px solid rgba(150,144,144,.15);
    border-radius: 50%;
}

.ydca-hero-bg {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            90deg,
            rgba(255,255,255,.95),
            rgba(255,255,255,.55),
            rgba(35,181,128,.04)
        );

    pointer-events: none;
}

.ydca-hero .ydca-container {
    position: relative;
    z-index: 2;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 60px;
}

.ydca-hero-content {
    max-width: 850px;
    padding: 100px 0;
}

.ydca-eyebrow,
.ydca-kicker {
    color: var(--ydc-green);

    font-size: 12px;
    font-weight: 900;

    letter-spacing: 3px;
    text-transform: uppercase;
}

.ydca-eyebrow {
    margin-bottom: 24px;
}

.ydca-eyebrow::before,
.ydca-kicker::before {
    content: "";

    display: inline-block;

    width: 40px;
    height: 2px;

    margin-right: 12px;

    vertical-align: middle;

    background: var(--ydc-green);
}

.ydca-hero h1 {
    max-width: 900px;

    margin: 0 0 28px !important;

    color: var(--ydc-black) !important;

    font-size: clamp(48px, 6vw, 84px) !important;

    line-height: .98 !important;
    letter-spacing: -4px !important;

    font-weight: 900 !important;
}

.ydca-page h1 span,
.ydca-page h2 span {
    color: var(--ydc-green) !important;
}

.ydca-hero-content > p {
    max-width: 760px;

    margin: 0 0 32px !important;

    color: #555 !important;

    font-size: 19px !important;
    line-height: 1.75 !important;
}

.ydca-hero-buttons,
.ydca-cta-buttons {
    display: flex;
    flex-wrap: wrap;

    gap: 14px;
}

.ydca-btn {
    display: inline-flex;

    align-items: center;
    justify-content: center;
    gap: 12px;

    min-height: 52px;

    padding: 14px 25px;

    border-radius: 50px;

    font-size: 14px;
    font-weight: 800;

    transition:
        transform .3s ease,
        background .3s ease,
        color .3s ease,
        border-color .3s ease;
}

.ydca-btn span {
    font-size: 20px;
    line-height: 1;
}

.ydca-btn:hover {
    transform: translateY(-3px);
}

.ydca-btn-green {
    background: var(--ydc-green);
    color: #fff !important;
}

.ydca-btn-green:hover {
    background: var(--ydc-green-dark);
}

.ydca-btn-white {
    background: #fff;
    color: #000 !important;

    border: 1px solid var(--ydc-border);
}

.ydca-btn-white:hover {
    background: #000;
    color: #fff !important;
}

.ydca-hero-mark {
    width: 280px;
    height: 280px;

    flex: 0 0 280px;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(35,181,128,.25);
    border-radius: 50%;

    background: rgba(255,255,255,.6);

    box-shadow:
        0 25px 70px rgba(0,0,0,.07);
}

.ydca-hero-mark span {
    color: var(--ydc-black);

    font-size: 75px;
    line-height: 1;

    font-weight: 900;
    letter-spacing: -5px;
}

.ydca-hero-mark small {
    margin-top: 10px;

    color: var(--ydc-green);

    font-size: 11px;
    font-weight: 900;

    letter-spacing: 4px;
}


/* ============================================================
   GENERAL SECTIONS
   ============================================================ */

.ydca-section {
    padding-top: 105px;
    padding-bottom: 105px;
}

.ydca-section-heading {
    max-width: 820px;
    margin-bottom: 50px;
}

.ydca-section-heading h2,
.ydca-intro-copy h2,
.ydca-story-content h2,
.ydca-approach h2,
.ydca-team-intro h2,
.ydca-credibility h2,
.ydca-cta h2 {
    margin: 14px 0 22px !important;

    color: #000 !important;

    font-size: clamp(38px, 4.5vw, 62px) !important;

    line-height: 1.02 !important;
    letter-spacing: -2.5px !important;

    font-weight: 900 !important;
}

.ydca-section-heading p,
.ydca-intro-copy p,
.ydca-story-content p,
.ydca-approach p,
.ydca-team-intro p,
.ydca-credibility p {
    color: var(--ydc-muted) !important;

    font-size: 16px !important;
    line-height: 1.8 !important;
}


/* ============================================================
   INTRO
   ============================================================ */

.ydca-intro {
    background: #fff;
}

.ydca-two-column {
    display: grid;

    grid-template-columns:
        minmax(180px, .35fr)
        minmax(0, 1fr);

    gap: 70px;

    align-items: start;
}

.ydca-section-label {
    color: #000;

    font-size: 13px;
    font-weight: 900;

    letter-spacing: 2px;
}

.ydca-section-label span {
    display: block;

    margin-bottom: 15px;

    color: var(--ydc-green);

    font-size: 42px;
    line-height: 1;
}

.ydca-intro-copy {
    max-width: 850px;
}

.ydca-intro-copy .ydca-lead {
    color: #333 !important;

    font-size: 21px !important;
    line-height: 1.7 !important;

    margin-bottom: 25px !important;
}


/* ============================================================
   STORY
   ============================================================ */

.ydca-story-section {
    background: var(--ydc-light);
}

.ydca-story-grid {
    display: grid;

    grid-template-columns: 260px minmax(0, 1fr);

    gap: 80px;
}

.ydca-story-number {
    position: relative;

    padding-top: 10px;
}

.ydca-story-number span {
    display: block;

    color: rgba(35,181,128,.15);

    font-size: 90px;
    line-height: .9;

    font-weight: 900;
    letter-spacing: -6px;
}

.ydca-story-number strong {
    color: #000;

    font-size: 13px;
    letter-spacing: 4px;
}

.ydca-story-content {
    max-width: 820px;
}

.ydca-story-highlight {
    display: flex;
    flex-direction: column;

    gap: 7px;

    margin-top: 35px;
    padding: 25px 30px;

    border-left: 4px solid var(--ydc-green);

    background: #fff;

    box-shadow: 0 10px 35px rgba(0,0,0,.05);
}

.ydca-story-highlight strong {
    color: var(--ydc-green);

    font-size: 17px;
}

.ydca-story-highlight span {
    color: #555;

    font-size: 15px;
}


/* ============================================================
   VISION / MISSION
   ============================================================ */

.ydca-vision-section {
    background: #fff;
}

.ydca-purpose-grid {
    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 22px;
}

.ydca-purpose-card {
    min-height: 330px;

    padding: 40px;

    border-radius: 24px;

    position: relative;

    overflow: hidden;
}

.ydca-purpose-green {
    background: var(--ydc-green);
    color: #fff;
}

.ydca-purpose-dark {
    background: #000;
    color: #fff;
}

.ydca-card-number {
    margin-bottom: 25px;

    font-size: 13px;
    font-weight: 900;
    letter-spacing: 3px;

    opacity: .65;
}

.ydca-card-label {
    margin-bottom: 18px;

    font-size: 12px;
    font-weight: 900;

    letter-spacing: 2px;
}

.ydca-purpose-card h3 {
    max-width: 520px;

    margin: 0 0 18px !important;

    color: #fff !important;

    font-size: 32px !important;
    line-height: 1.1 !important;

    font-weight: 900 !important;
}

.ydca-purpose-card p {
    max-width: 600px;

    margin: 0 !important;

    color: rgba(255,255,255,.85) !important;

    font-size: 15px !important;
    line-height: 1.75 !important;
}


/* ============================================================
   BELIEFS
   ============================================================ */

.ydca-beliefs {
    background: var(--ydc-light);
}

.ydca-beliefs-grid {
    display: grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 1px;

    background: var(--ydc-border);

    border: 1px solid var(--ydc-border);
}

.ydca-belief {
    min-height: 230px;

    padding: 32px;

    background: #fff;
}

.ydca-belief > span {
    color: var(--ydc-green);

    font-size: 12px;
    font-weight: 900;
    letter-spacing: 2px;
}

.ydca-belief h3 {
    margin: 25px 0 10px !important;

    color: #000 !important;

    font-size: 22px !important;
    font-weight: 900 !important;
}

.ydca-belief p {
    margin: 0 !important;

    color: #666 !important;

    font-size: 14px !important;
    line-height: 1.7 !important;
}


/* ============================================================
   APPROACH
   ============================================================ */

.ydca-approach {
    background: #000;
    color: #fff;
}

.ydca-approach h2 {
    color: #fff !important;
}

.ydca-approach p {
    color: rgba(255,255,255,.72) !important;
}

.ydca-approach-grid {
    display: grid;

    grid-template-columns:
        minmax(0, .8fr)
        minmax(0, 1.2fr);

    gap: 90px;

    align-items: center;
}

.ydca-process {
    display: flex;
    align-items: center;
    justify-content: center;

    flex-wrap: wrap;

    gap: 10px;
}

.ydca-process-step {
    width: 105px;
    height: 105px;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(255,255,255,.15);
    border-radius: 50%;

    background: rgba(255,255,255,.04);
}

.ydca-process-step strong {
    color: var(--ydc-green);

    font-size: 12px;
}

.ydca-process-step span {
    margin-top: 5px;

    color: #fff;

    font-size: 10px;
    font-weight: 900;
    letter-spacing: 1px;
}

.ydca-process-arrow {
    color: var(--ydc-green);

    font-size: 22px;
}


/* ============================================================
   WORK
   ============================================================ */

.ydca-work {
    background: #fff;
}

.ydca-work-grid {
    display: grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 18px;
}

.ydca-work-card {
    padding: 32px;

    min-height: 245px;

    border: 1px solid var(--ydc-border);
    border-radius: 20px;

    background: #fff;

    transition:
        transform .3s ease,
        box-shadow .3s ease;
}

.ydca-work-card:hover {
    transform: translateY(-6px);

    box-shadow:
        0 20px 45px rgba(0,0,0,.08);
}

.ydca-work-card > span {
    color: var(--ydc-green);

    font-size: 12px;
    font-weight: 900;
    letter-spacing: 2px;
}

.ydca-work-card h3 {
    margin: 25px 0 12px !important;

    color: #000 !important;

    font-size: 21px !important;
    font-weight: 900 !important;
}

.ydca-work-card p {
    margin: 0 !important;

    color: #666 !important;

    font-size: 14px !important;
    line-height: 1.7 !important;
}


/* ============================================================
   TEAM INTRO
   ============================================================ */

.ydca-team-intro {
    padding: 115px 0;

    background:
        linear-gradient(
            135deg,
            #000 0%,
            #101513 100%
        );

    color: #fff;
}

.ydca-team-intro-content {
    max-width: 850px;
}

.ydca-team-intro h2 {
    color: #fff !important;
}

.ydca-team-intro p {
    max-width: 720px;

    margin: 0 !important;

    color: rgba(255,255,255,.72) !important;

    font-size: 18px !important;
}


/* ============================================================
   TEAM / BOARD
   ============================================================ */

.ydca-board {
    background: #fff;
}

.ydca-admin {
    background: var(--ydc-light);
}

.ydca-team-grid {
    display: grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 24px;
}

.ydca-person {
    overflow: hidden;

    background: #fff;

    border: 1px solid var(--ydc-border);
    border-radius: 20px;

    box-shadow:
        0 8px 28px rgba(0,0,0,.045);

    transition:
        transform .3s ease,
        box-shadow .3s ease;
}

.ydca-person:hover {
    transform: translateY(-7px);

    box-shadow:
        0 20px 45px rgba(0,0,0,.10);
}

.ydca-board-person {
    border-top: 4px solid var(--ydc-green);
}

.ydca-person-image {
    width: 100%;

    aspect-ratio: 1 / 1;

    overflow: hidden;

    background: #eee;
}

.ydca-person-image img {
    width: 100%;
    height: 100%;

    object-fit: cover;

    transition: transform .45s ease;
}

.ydca-person:hover .ydca-person-image img {
    transform: scale(1.04);
}

.ydca-person-info {
    padding: 22px;
}

.ydca-person-info h3 {
    margin: 0 0 7px !important;

    color: #000 !important;

    font-size: 19px !important;
    line-height: 1.2 !important;

    font-weight: 900 !important;
}

.ydca-person-info span {
    display: block;

    color: var(--ydc-green) !important;

    font-size: 11px !important;
    line-height: 1.5 !important;

    font-weight: 900 !important;

    letter-spacing: 1px;
    text-transform: uppercase;
}


/* ============================================================
   ARTISTS
   ============================================================ */

.ydca-artists {
    background: var(--ydc-light);
}

.ydca-artist-grid {
    display: grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 18px;
}

.ydca-artist {
    overflow: hidden;

    border: 1px solid var(--ydc-border);
    border-radius: 18px;

    background: #fff;

    transition:
        transform .3s ease,
        box-shadow .3s ease;
}

.ydca-artist:hover {
    transform: translateY(-6px);

    box-shadow:
        0 18px 40px rgba(0,0,0,.09);
}

.ydca-artist > img {
    width: 100%;

    aspect-ratio: 1 / 1;

    object-fit: cover;

    transition: transform .45s ease;
}

.ydca-artist:hover > img {
    transform: scale(1.05);
}

.ydca-artist > div {
    padding: 17px 19px;
}

.ydca-artist strong {
    display: block;

    margin-bottom: 4px;

    color: #000;

    font-size: 16px;
}

.ydca-artist span {
    color: var(--ydc-green);

    font-size: 10px;
    font-weight: 900;

    letter-spacing: 1.5px;
    text-transform: uppercase;
}


/* ============================================================
   CREDIBILITY
   ============================================================ */

.ydca-credibility {
    background: #fff;
}

.ydca-credibility-grid {
    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(320px, .8fr);

    gap: 90px;

    align-items: center;
}

.ydca-credibility-list {
    border-top: 1px solid var(--ydc-border);
}

.ydca-credibility-list > div {
    display: flex;

    justify-content: space-between;
    align-items: center;

    gap: 20px;

    padding: 18px 0;

    border-bottom: 1px solid var(--ydc-border);
}

.ydca-credibility-list strong {
    color: var(--ydc-green);

    font-size: 12px;
    letter-spacing: 2px;
}

.ydca-credibility-list span {
    color: #666;

    font-size: 13px;
}


/* ============================================================
   CTA
   ============================================================ */

.ydca-cta {
    margin: 0 5% 45px;

    padding: 80px 7%;

    text-align: center;

    border-radius: 28px;

    background:
        linear-gradient(
            135deg,
            #23b580 0%,
            #1b9d70 100%
        );

    box-shadow:
        0 20px 50px rgba(35,181,128,.17);
}

.ydca-cta-content {
    max-width: 850px;
    margin: 0 auto;
}

.ydca-cta .ydca-kicker {
    color: #fff;
}

.ydca-cta .ydca-kicker::before {
    background: #fff;
}

.ydca-cta h2 {
    color: #fff !important;
}

.ydca-cta h2 span {
    color: #000 !important;
}

.ydca-cta p {
    max-width: 700px;

    margin: 0 auto 30px !important;

    color: rgba(255,255,255,.9) !important;

    font-size: 17px !important;
}

.ydca-cta-buttons {
    justify-content: center;
}

.ydca-btn-black {
    background: #000;
    color: #fff !important;
}

.ydca-btn-black:hover {
    background: #fff;
    color: #000 !important;
}

.ydca-btn-outline-white {
    background: transparent;

    color: #fff !important;

    border: 1px solid rgba(255,255,255,.65);
}

.ydca-btn-outline-white:hover {
    background: #fff;
    color: #000 !important;
}


/* ============================================================
   TABLET
   ============================================================ */

@media (max-width: 1100px) {

    .ydca-container {
        padding-left: 5%;
        padding-right: 5%;
    }

    .ydca-hero .ydca-container {
        gap: 30px;
    }

    .ydca-hero-mark {
        width: 220px;
        height: 220px;
        flex-basis: 220px;
    }

    .ydca-team-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .ydca-artist-grid {
        grid-template-columns:
            repeat(3, minmax(0, 1fr));
    }

    .ydca-work-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

}


/* ============================================================
   MOBILE
   ============================================================ */

@media (max-width: 700px) {

    .ydca-container {
        padding-left: 22px;
        padding-right: 22px;
    }

    .ydca-hero {
        min-height: auto;
    }

    .ydca-hero .ydca-container {
        display: block;
    }

    .ydca-hero-content {
        padding: 75px 0 45px;
    }

    .ydca-hero h1 {
        font-size: 46px !important;
        letter-spacing: -2.5px !important;
    }

    .ydca-hero-content > p {
        font-size: 16px !important;
    }

    .ydca-hero-mark {
        display: none;
    }

    .ydca-section {
        padding-top: 70px;
        padding-bottom: 70px;
    }

    .ydca-two-column,
    .ydca-story-grid,
    .ydca-approach-grid,
    .ydca-credibility-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .ydca-purpose-grid {
        grid-template-columns: 1fr;
    }

    .ydca-beliefs-grid {
        grid-template-columns: 1fr;
    }

    .ydca-work-grid {
        grid-template-columns: 1fr;
    }

    .ydca-team-grid {
        grid-template-columns: 1fr;
    }

    .ydca-artist-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .ydca-team-intro {
        padding: 75px 0;
    }

    .ydca-process {
        justify-content: flex-start;
    }

    .ydca-process-step {
        width: 85px;
        height: 85px;
    }

    .ydca-process-arrow {
        font-size: 18px;
    }

    .ydca-cta {
        margin: 0 15px 25px;

        padding: 55px 25px;

        border-radius: 22px;
    }

}


/* ============================================================
   VERY SMALL DEVICES
   ============================================================ */

@media (max-width: 420px) {

    .ydca-hero h1 {
        font-size: 40px !important;
    }

    .ydca-eyebrow,
    .ydca-kicker {
        font-size: 10px;
        letter-spacing: 2px;
    }

    .ydca-artist-grid {
        grid-template-columns: 1fr;
    }

    .ydca-hero-buttons,
    .ydca-cta-buttons {
        flex-direction: column;
    }

    .ydca-btn {
        width: 100%;
    }

}