/* ==========================================================
   WORKSHOPS PAGE
========================================================== */

.workshops-page {
    background: #fffdf9;
}


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

.workshops-hero {
    position: relative;

    margin-top: 70px;

    padding-bottom: 42px;

    overflow: hidden;

    color: #ffffff;

    background: #103f34;
}


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

.workshops-hero__layout {
    display: grid;

    grid-template-columns:
        minmax(420px, .86fr)
        minmax(0, 1.14fr);

    min-height: 430px;
}


/* ==========================================================
   LEFT CONTENT
========================================================== */

.workshops-hero__content {
    position: relative;

    z-index: 2;

    display: flex;

    justify-content: flex-end;

    background:
        radial-gradient(
            circle at 0 100%,
            rgba(218,169,66,.08),
            transparent 35%
        ),
        linear-gradient(
            135deg,
            #0b3b30,
            #104a3c
        );
}


.workshops-hero__content::before {
    content: "❧";

    position: absolute;

    left: -35px;
    bottom: 18px;

    color:
        rgba(218,169,66,.30);

    font-size: 150px;

    line-height: 1;

    transform: rotate(34deg);
}


.workshops-hero__inner {
    width: 100%;

    max-width: 540px;

    padding:
        48px
        45px
        58px
        28px;
}


/* ==========================================================
   EYEBROW
========================================================== */

.workshops-hero__eyebrow {
    display: flex;

    align-items: center;

    gap: 7px;

    margin-bottom: 11px;

    color:
        rgba(255,255,255,.92);

    font-size: 10px;

    font-weight: 600;

    letter-spacing: .06em;

    text-transform: uppercase;
}


.workshops-hero__eyebrow-leaf {
    color: #d8a943;

    font-size: 13px;

    transform: rotate(-18deg);
}


/* ==========================================================
   TITLE
========================================================== */

.workshops-hero__title {
    max-width: 500px;

    margin: 0;

    color: #fffdf7;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 45px;

    font-weight: 400;

    line-height: 1.05;

    letter-spacing: -.02em;
}


.workshops-hero__title span {
    display: block;

    margin-top: 3px;

    color: #dfa942;

    font-style: italic;
}


/* ==========================================================
   GOLD LINE
========================================================== */

.workshops-hero__line {
    width: 42px;
    height: 2px;

    display: block;

    margin:
        18px
        0;

    background: #dca640;
}


/* ==========================================================
   DESCRIPTION
========================================================== */

.workshops-hero__description {
    max-width: 430px;

    margin: 0;

    color:
        rgba(255,255,255,.86);

    font-size: 10px;

    line-height: 1.7;
}


/* ==========================================================
   ACTIONS
========================================================== */

.workshops-hero__actions {
    display: flex;

    flex-wrap: wrap;

    gap: 11px;

    margin-top: 22px;
}


/* ==========================================================
   BUTTON
========================================================== */

.workshops-hero__button {
    min-height: 40px;

    display: inline-flex;

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

    gap: 8px;

    padding:
        9px
        15px;

    border-radius: 5px;

    font-size: 8px;

    font-weight: 700;

    text-decoration: none;

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


.workshops-hero__button svg {
    width: 14px;
    height: 14px;

    fill: none;

    stroke: currentColor;

    stroke-width: 1.5;

    stroke-linecap: round;
    stroke-linejoin: round;
}


.workshops-hero__button:hover {
    transform: translateY(-2px);
}


.workshops-hero__button--primary {
    color: #173d31;

    background: #e5b75a;

    border:
        1px solid #e5b75a;
}


.workshops-hero__button--primary:hover {
    background: #edc46c;
}


.workshops-hero__button--secondary {
    color: #ffffff;

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

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


.workshops-hero__button--secondary:hover {
    background:
        rgba(255,255,255,.07);
}


/* ==========================================================
   RIGHT VISUAL
========================================================== */

.workshops-hero__visual {
    position: relative;

    min-width: 0;

    overflow: hidden;

    background: #7d6b51;
}


/* ==========================================================
   PNG PLACEHOLDER
========================================================== */

.workshops-hero__image-placeholder {
    position: absolute;

    inset: 0;

    display: flex;

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

    background:
        linear-gradient(
            135deg,
            #947c5c,
            #6c745d
        );
}


.workshops-hero__image-placeholder::after {
    content: "";

    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            90deg,
            rgba(8,54,43,.35) 0%,
            transparent 25%,
            transparent 100%
        );
}


.workshops-hero__image-placeholder span {
    position: relative;

    z-index: 2;

    padding:
        6px
        10px;

    color: #ffffff;

    background:
        rgba(10,58,46,.68);

    border-radius: 999px;

    font-size: 7px;
}


/* ==========================================================
   QUOTE CARD
========================================================== */

.workshops-hero__quote {
    position: absolute;

    z-index: 4;

    top: 65px;
    right: 45px;

    width: 175px;

    overflow: hidden;

    padding:
        20px
        18px
        23px;

    color: #ffffff;

    background:
        linear-gradient(
            145deg,
            #0d4739,
            #07352b
        );

    border:
        1px solid #d5a43e;

    border-radius: 12px;

    box-shadow:
        0
        12px
        30px
        rgba(0,0,0,.16);
}


.workshops-hero__quote-mark {
    display: block;

    height: 28px;

    color: #e2ad45;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 38px;

    font-weight: 700;

    line-height: 1;
}


.workshops-hero__quote blockquote {
    position: relative;

    z-index: 2;

    margin: 0;

    color: #fffdf7;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 16px;

    line-height: 1.42;
}


.workshops-hero__quote-leaf {
    position: absolute;

    right: -10px;
    bottom: -18px;

    color:
        rgba(218,169,66,.45);

    font-size: 80px;

    line-height: 1;

    transform: rotate(-22deg);
}


/* ==========================================================
   HERO VALUE STRIP
========================================================== */

.workshops-hero__values {
    position: relative;

    z-index: 7;

    display: grid;

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

    margin-top: -32px;

    overflow: hidden;

    background:
        linear-gradient(
            105deg,
            #17483b,
            #0d392f
        );

    border:
        1px solid rgba(222,176,76,.32);

    border-radius: 8px;

    box-shadow:
        0
        11px
        26px
        rgba(10,50,40,.10);
}


/* ==========================================================
   VALUE
========================================================== */

.workshops-hero__value {
    position: relative;

    min-width: 0;

    min-height: 88px;

    display: grid;

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

    gap: 10px;

    align-items: center;

    padding:
        15px
        18px;

    color: #ffffff;
}


.workshops-hero__value:not(:last-child)::after {
    content: "";

    position: absolute;

    top: 20px;
    right: 0;
    bottom: 20px;

    width: 1px;

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


/* ==========================================================
   VALUE ICON
========================================================== */

.workshops-hero__value-icon {
    width: 46px;
    height: 46px;

    display: flex;

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

    color: #d9aa46;
}


.workshops-hero__value-icon svg {
    width: 39px;
    height: 39px;

    fill: none;

    stroke: currentColor;

    stroke-width: 1.35;

    stroke-linecap: round;
    stroke-linejoin: round;
}


/* ==========================================================
   VALUE TEXT
========================================================== */

.workshops-hero__value strong {
    display: block;

    margin-bottom: 3px;

    color: #fffdf7;

    font-size: 8px;

    font-weight: 700;

    line-height: 1.3;
}


.workshops-hero__value div > span {
    display: block;

    color:
        rgba(255,255,255,.70);

    font-size: 7px;

    line-height: 1.45;
}

/* ==========================================================
   WORKSHOPS — CATEGORIES
========================================================== */

.workshops-categories {
    position: relative;

    padding:
        6px
        0
        42px;

    background: #fffdf9;
}


/* ==========================================================
   HEADING
========================================================== */

.workshops-categories__heading {
    display: flex;

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

    gap: 20px;

    margin-bottom: 17px;
}


.workshops-categories__title-wrap {
    display: flex;

    align-items: center;

    gap: 8px;
}


.workshops-categories__title-wrap h2 {
    margin: 0;

    color: #233c33;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 24px;

    font-weight: 400;

    line-height: 1.2;
}


.workshops-categories__title-wrap > span {
    color: #c99b43;

    font-size: 14px;

    transform: rotate(-18deg);
}


.workshops-categories__view-all {
    display: inline-flex;

    align-items: center;

    gap: 7px;

    color: #17483b;

    font-size: 8px;

    font-weight: 600;

    text-decoration: none;
}


.workshops-categories__view-all span {
    transition: transform .2s ease;
}


.workshops-categories__view-all:hover span {
    transform: translateX(3px);
}


/* ==========================================================
   CATEGORY GRID
========================================================== */

.workshops-categories__grid {
    display: grid;

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

    gap: 8px;
}


/* ==========================================================
   CATEGORY CARD
========================================================== */

.workshop-category-card {
    min-width: 0;

    min-height: 100px;

    display: flex;

    flex-direction: column;

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

    gap: 8px;

    padding:
        12px
        8px;

    color: #31483f;

    background:
        linear-gradient(
            135deg,
            #ffffff,
            #faf8f2
        );

    border:
        1px solid rgba(23,72,59,.10);

    border-radius: 7px;

    text-align: center;

    text-decoration: none;

    transition:
        color .2s ease,
        border-color .2s ease,
        background-color .2s ease,
        transform .2s ease,
        box-shadow .2s ease;
}


.workshop-category-card:hover {
    color: #a97d31;

    border-color:
        rgba(169,125,49,.35);

    transform:
        translateY(-2px);

    box-shadow:
        0
        7px
        16px
        rgba(20,55,44,.06);
}


/* ==========================================================
   ICON
========================================================== */

.workshop-category-card__icon {
    width: 45px;
    height: 45px;

    display: flex;

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

    color: #17483b;
}


.workshop-category-card__icon svg {
    width: 39px;
    height: 39px;

    display: block;

    fill: none;

    stroke: currentColor;

    stroke-width: 1.35;

    stroke-linecap: round;
    stroke-linejoin: round;

    transition:
        color .2s ease,
        transform .2s ease;
}


.workshop-category-card:hover
.workshop-category-card__icon svg {
    color: #a97d31;

    transform:
        scale(1.04);
}


/* ==========================================================
   LABEL
========================================================== */

.workshop-category-card__label {
    max-width: 110px;

    color: inherit;

    font-size: 7px;

    font-weight: 600;

    line-height: 1.35;
}




/* ==========================================================
   WORKSHOPS — FEATURED
========================================================== */

.workshops-featured {
    position: relative;

    padding:
        42px
        0
        50px;

    background: #f8f5ed;
}


/* ==========================================================
   HEADING
========================================================== */

.workshops-featured__heading {
    display: flex;

    align-items: flex-end;
    justify-content: space-between;

    gap: 30px;

    margin-bottom: 19px;
}


.workshops-featured__eyebrow {
    display: block;

    margin-bottom: 5px;

    color: #a67b31;

    font-size: 7px;

    font-weight: 700;

    letter-spacing: .1em;

    text-transform: uppercase;
}


.workshops-featured__heading h2 {
    margin: 0;

    color: #233d34;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 26px;

    font-weight: 400;

    line-height: 1.2;
}


.workshops-featured__heading > p {
    max-width: 360px;

    margin: 0;

    color: #68756e;

    font-size: 7px;

    line-height: 1.6;
}


/* ==========================================================
   MAIN LAYOUT
========================================================== */

.workshops-featured__layout {
    display: grid;

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

    gap: 20px;

    align-items: start;
}


/* ==========================================================
   WORKSHOP LIST
========================================================== */

.workshops-featured__list {
    display: grid;

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

    gap: 12px;
}


/* ==========================================================
   FEATURED WORKSHOP CARD
========================================================== */

.featured-workshop-card {
    min-width: 0;

    overflow: hidden;

    background: #ffffff;

    border:
        1px solid rgba(23,72,59,.09);

    border-radius: 8px;

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


.featured-workshop-card:hover {
    transform: translateY(-2px);

    box-shadow:
        0
        10px
        22px
        rgba(18,54,43,.07);
}


/* ==========================================================
   IMAGE
========================================================== */

.featured-workshop-card__image {
    position: relative;

    min-height: 145px;

    overflow: hidden;
}


.featured-workshop-card__placeholder {
    position: absolute;

    inset: 0;

    display: flex;

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

    background:
        linear-gradient(
            135deg,
            #95836b,
            #667664
        );
}


.featured-workshop-card:nth-child(2)
.featured-workshop-card__placeholder {
    background:
        linear-gradient(
            135deg,
            #84927a,
            #536f5c
        );
}


.featured-workshop-card:nth-child(3)
.featured-workshop-card__placeholder {
    background:
        linear-gradient(
            135deg,
            #a08b70,
            #725f4d
        );
}


.featured-workshop-card:nth-child(4)
.featured-workshop-card__placeholder {
    background:
        linear-gradient(
            135deg,
            #798e84,
            #4f6b60
        );
}


.featured-workshop-card__placeholder span {
    padding:
        5px
        9px;

    color: #ffffff;

    background:
        rgba(10,55,44,.65);

    border-radius: 999px;

    font-size: 6px;
}


/* ==========================================================
   CATEGORY
========================================================== */

.featured-workshop-card__category {
    position: absolute;

    left: 11px;
    bottom: 10px;

    z-index: 2;

    padding:
        4px
        8px;

    color: #173d31;

    background: #e4b85f;

    border-radius: 999px;

    font-size: 6px;

    font-weight: 700;

    text-transform: uppercase;
}


/* ==========================================================
   CARD CONTENT
========================================================== */

.featured-workshop-card__content {
    padding:
        14px
        14px
        15px;
}


.featured-workshop-card__content h3 {
    margin:
        0
        0
        7px;

    color: #294239;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 14px;

    font-weight: 400;

    line-height: 1.3;
}


.featured-workshop-card__content > p {
    margin: 0;

    color: #69756f;

    font-size: 7px;

    line-height: 1.55;
}


/* ==========================================================
   META
========================================================== */

.featured-workshop-card__meta {
    display: flex;

    align-items: center;

    flex-wrap: wrap;

    gap:
        7px
        13px;

    margin-top: 11px;

    color: #65726b;

    font-size: 6px;
}


.featured-workshop-card__meta span {
    display: inline-flex;

    align-items: center;

    gap: 5px;
}


.featured-workshop-card__meta svg,
.featured-workshop-card__audience svg {
    width: 12px;
    height: 12px;

    flex: 0 0 12px;

    fill: none;

    stroke: #a47c36;

    stroke-width: 1.5;

    stroke-linecap: round;
    stroke-linejoin: round;
}


/* ==========================================================
   AUDIENCE
========================================================== */

.featured-workshop-card__audience {
    display: flex;

    align-items: center;

    gap: 5px;

    margin-top: 7px;

    color: #65726b;

    font-size: 6px;
}


/* ==========================================================
   LEARN MORE
========================================================== */

.featured-workshop-card__link {
    display: inline-flex;

    align-items: center;

    gap: 6px;

    margin-top: 12px;

    color: #17483b;

    font-size: 7px;

    font-weight: 700;

    text-decoration: none;
}


.featured-workshop-card__link span {
    transition: transform .2s ease;
}


.featured-workshop-card__link:hover span {
    transform: translateX(3px);
}


/* ==========================================================
   FEATURED SIDEBAR
========================================================== */

.workshops-featured__sidebar {
    display: grid;

    gap: 12px;
}


/* ==========================================================
   INFORMATION CARD
========================================================== */

.workshops-info-card {
    position: relative;

    overflow: hidden;

    padding:
        17px;

    border-radius: 8px;
}


/* ==========================================================
   WHY CARD
========================================================== */

.workshops-info-card--why {
    color: #ffffff;

    background:
        linear-gradient(
            145deg,
            #17483b,
            #0d382e
        );
}


.workshops-info-card--why::after {
    content: "❧";

    position: absolute;

    right: -18px;
    bottom: -30px;

    color:
        rgba(219,173,71,.12);

    font-size: 105px;

    line-height: 1;

    transform: rotate(-25deg);
}


.workshops-info-card__eyebrow {
    position: relative;

    z-index: 2;

    display: block;

    margin-bottom: 5px;

    color: #ddb158;

    font-size: 6px;

    font-weight: 700;

    letter-spacing: .1em;

    text-transform: uppercase;
}


.workshops-info-card--why h3 {
    position: relative;

    z-index: 2;

    margin:
        0
        0
        7px;

    color: #fffaf0;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 16px;

    font-weight: 400;
}


.workshops-info-card--why > p {
    position: relative;

    z-index: 2;

    margin:
        0
        0
        13px;

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

    font-size: 7px;

    line-height: 1.55;
}


/* ==========================================================
   WHY LIST
========================================================== */

.workshops-info-card__list {
    position: relative;

    z-index: 2;

    display: grid;

    gap: 11px;

    margin: 0;

    padding: 0;

    list-style: none;
}


.workshops-info-card__list li {
    display: grid;

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

    gap: 8px;

    align-items: start;
}


.workshops-info-card__check {
    width: 22px;
    height: 22px;

    display: flex;

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

    color: #173d31;

    background: #ddb158;

    border-radius: 50%;

    font-size: 8px;

    font-weight: 700;
}


.workshops-info-card__list strong {
    display: block;

    margin-bottom: 2px;

    color: #ffffff;

    font-size: 7px;
}


.workshops-info-card__list li div > span {
    display: block;

    color:
        rgba(255,255,255,.65);

    font-size: 6px;

    line-height: 1.45;
}


/* ==========================================================
   FORMATS CARD
========================================================== */

.workshops-info-card--formats {
    background: #ffffff;

    border:
        1px solid rgba(23,72,59,.09);
}


.workshops-info-card__title-row {
    display: flex;

    align-items: center;

    gap: 6px;

    margin-bottom: 12px;
}


.workshops-info-card__title-row h3 {
    margin: 0;

    color: #294239;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 14px;

    font-weight: 400;
}


.workshops-info-card__title-row > span {
    color: #b68b3d;

    font-size: 13px;
}


/* ==========================================================
   FORMATS
========================================================== */

.workshops-formats {
    display: grid;

    gap: 9px;
}


.workshops-format {
    display: grid;

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

    gap: 8px;

    align-items: center;
}


.workshops-format__icon {
    width: 30px;
    height: 30px;

    display: flex;

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

    color: #17483b;

    background: #f4efe4;

    border-radius: 50%;
}


.workshops-format__icon svg {
    width: 16px;
    height: 16px;

    fill: none;

    stroke: currentColor;

    stroke-width: 1.45;

    stroke-linecap: round;
    stroke-linejoin: round;
}


.workshops-format strong {
    display: block;

    margin-bottom: 1px;

    color: #344b42;

    font-size: 7px;
}


.workshops-format div > span {
    display: block;

    color: #7a847f;

    font-size: 6px;

    line-height: 1.35;
}


/* ==========================================================
   CUSTOM WORKSHOP BUTTON
========================================================== */

.workshops-info-card__button {
    min-height: 34px;

    display: flex;

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

    gap: 7px;

    margin-top: 14px;

    padding:
        8px
        10px;

    color: #ffffff;

    background: #17483b;

    border-radius: 4px;

    font-size: 7px;

    font-weight: 700;

    text-align: center;

    text-decoration: none;

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


.workshops-info-card__button:hover {
    background: #103b30;

    transform: translateY(-1px);
}

/* ==========================================================
   WORKSHOPS — BY AUDIENCE
========================================================== */

.workshops-audience {
    position: relative;

    padding:
        45px
        0
        48px;

    background: #fffdf9;
}


/* ==========================================================
   HEADING
========================================================== */

.workshops-audience__heading {
    display: flex;

    align-items: flex-end;
    justify-content: space-between;

    gap: 30px;

    margin-bottom: 20px;
}


.workshops-audience__eyebrow {
    display: block;

    margin-bottom: 5px;

    color: #a77d32;

    font-size: 7px;

    font-weight: 700;

    letter-spacing: .1em;

    text-transform: uppercase;
}


.workshops-audience__heading h2 {
    margin: 0;

    color: #233d34;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 26px;

    font-weight: 400;

    line-height: 1.2;
}


.workshops-audience__heading > p {
    max-width: 390px;

    margin: 0;

    color: #6c7871;

    font-size: 7px;

    line-height: 1.6;
}


/* ==========================================================
   GRID
========================================================== */

.workshops-audience__grid {
    display: grid;

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

    gap: 12px;
}


/* ==========================================================
   CARD
========================================================== */

.workshops-audience-card {
    min-width: 0;

    min-height: 210px;

    display: flex;

    flex-direction: column;

    align-items: flex-start;

    padding:
        20px
        17px;

    background:
        linear-gradient(
            145deg,
            #ffffff,
            #faf8f2
        );

    border:
        1px solid rgba(23,72,59,.09);

    border-radius: 8px;

    transition:
        transform .2s ease,
        box-shadow .2s ease,
        border-color .2s ease;
}


.workshops-audience-card:hover {
    transform: translateY(-3px);

    border-color:
        rgba(166,123,49,.28);

    box-shadow:
        0
        9px
        20px
        rgba(18,54,43,.06);
}


/* ==========================================================
   ICON
========================================================== */

.workshops-audience-card__icon {
    width: 50px;
    height: 50px;

    display: flex;

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

    margin-bottom: 13px;

    color: #17483b;

    background: #f3eee3;

    border-radius: 50%;
}


.workshops-audience-card__icon svg {
    width: 32px;
    height: 32px;

    fill: none;

    stroke: currentColor;

    stroke-width: 1.35;

    stroke-linecap: round;
    stroke-linejoin: round;
}


/* ==========================================================
   TITLE
========================================================== */

.workshops-audience-card h3 {
    margin:
        0
        0
        7px;

    color: #2a4239;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 14px;

    font-weight: 400;

    line-height: 1.25;
}


/* ==========================================================
   DESCRIPTION
========================================================== */

.workshops-audience-card p {
    margin: 0;

    color: #6a756f;

    font-size: 7px;

    line-height: 1.55;
}


/* ==========================================================
   LINK
========================================================== */

.workshops-audience-card a {
    display: inline-flex;

    align-items: center;

    gap: 6px;

    margin-top: auto;

    padding-top: 14px;

    color: #17483b;

    font-size: 7px;

    font-weight: 700;

    text-decoration: none;
}


.workshops-audience-card a span {
    transition: transform .2s ease;
}


.workshops-audience-card a:hover span {
    transform: translateX(3px);
}


/* ==========================================================
   WORKSHOPS — HOW IT WORKS
========================================================== */

.workshops-process {
    position: relative;

    padding:
        18px
        0
        28px;

    background: #fffdf9;
}


/* ==========================================================
   PANEL
========================================================== */

.workshops-process__panel {
    position: relative;

    min-height: 185px;

    overflow: hidden;

    padding:
        15px
        245px
        18px
        20px;

    background:
        linear-gradient(
            105deg,
            #fbfaf6 0%,
            #f7f4ec 73%,
            #f0ede5 100%
        );

    border:
        1px solid rgba(23,72,59,.08);

    border-radius: 10px;
}


/* ==========================================================
   HEADING
========================================================== */

.workshops-process__heading {
    position: relative;

    z-index: 3;

    display: flex;

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

    gap: 7px;

    margin-bottom: 13px;
}


.workshops-process__heading h2 {
    margin: 0;

    color: #223c33;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 22px;

    font-weight: 400;

    line-height: 1.2;
}


.workshops-process__heading > span {
    color: #86988a;

    font-size: 13px;

    transform: rotate(-18deg);
}


/* ==========================================================
   STEPS
========================================================== */

.workshops-process__steps {
    position: relative;

    z-index: 3;

    display: grid;

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

    gap: 6px;

    align-items: start;
}


/* ==========================================================
   SINGLE STEP
========================================================== */

.workshops-process-step {
    position: relative;

    min-width: 0;

    display: flex;

    flex-direction: column;

    align-items: center;

    padding:
        0
        12px;

    text-align: center;
}


/* ==========================================================
   NUMBER
========================================================== */

.workshops-process-step__number {
    position: absolute;

    z-index: 4;

    top: 14px;
    left: 2px;

    width: 20px;
    height: 20px;

    display: flex;

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

    color: #3b4c45;

    background: #eeeadf;

    border-radius: 50%;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 8px;

    font-weight: 700;
}


/* ==========================================================
   ICON CIRCLE
========================================================== */

.workshops-process-step__icon {
    width: 58px;
    height: 58px;

    display: flex;

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

    margin-bottom: 8px;

    color: #17483b;

    background:
        rgba(246,243,234,.94);

    border:
        1px solid rgba(23,72,59,.10);

    border-radius: 50%;
}


.workshops-process-step__icon svg {
    width: 34px;
    height: 34px;

    fill: none;

    stroke: currentColor;

    stroke-width: 1.35;

    stroke-linecap: round;
    stroke-linejoin: round;
}


/* ==========================================================
   STEP TITLE
========================================================== */

.workshops-process-step h3 {
    margin:
        0
        0
        4px;

    color: #2a4239;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 12px;

    font-weight: 400;

    line-height: 1.2;
}


/* ==========================================================
   STEP DESCRIPTION
========================================================== */

.workshops-process-step p {
    max-width: 130px;

    margin: 0;

    color: #66736c;

    font-size: 6px;

    line-height: 1.45;
}


/* ==========================================================
   DOTTED CONNECTOR
========================================================== */

.workshops-process-step__connector {
    position: absolute;

    z-index: 2;

    top: 27px;

    left:
        calc(50% + 37px);

    width:
        calc(100% - 62px);

    height: 10px;

    pointer-events: none;
}


.workshops-process-step__connector > span {
    position: absolute;

    top: 4px;
    left: 0;
    right: 15px;

    border-top:
        1px dashed
        rgba(71,91,82,.25);
}


.workshops-process-step__connector svg {
    position: absolute;

    top: 0;
    right: 0;

    width: 17px;
    height: 9px;

    fill: none;

    stroke:
        rgba(71,91,82,.42);

    stroke-width: 1.2;

    stroke-linecap: round;
    stroke-linejoin: round;
}


/* ==========================================================
   RIGHT IMAGE
========================================================== */

.workshops-process__visual {
    position: absolute;

    z-index: 1;

    top: 0;
    right: 0;
    bottom: 0;

    width: 245px;

    overflow: hidden;

    border-radius:
        0
        10px
        10px
        0;
}


/* ==========================================================
   IMAGE PLACEHOLDER
========================================================== */

.workshops-process__image-placeholder {
    position: absolute;

    inset: 0;

    display: flex;

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

    overflow: hidden;

    background:
        linear-gradient(
            135deg,
            #9d8668,
            #68715d
        );
}


.workshops-process__image-placeholder::before {
    content: "";

    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            90deg,
            #f7f4ec 0%,
            rgba(247,244,236,.70) 11%,
            rgba(247,244,236,.15) 28%,
            transparent 45%
        );
}


.workshops-process__image-placeholder span {
    position: relative;

    z-index: 2;

    padding:
        5px
        8px;

    color: #ffffff;

    background:
        rgba(10,55,44,.62);

    border-radius: 999px;

    font-size: 6px;
}


/* ==========================================================
   WORKSHOPS — TESTIMONIALS
========================================================== */

.workshops-testimonials {
    position: relative;

    padding:
        18px
        0
        28px;

    background: #fffdf9;
}


/* ==========================================================
   HEADING
========================================================== */

.workshops-testimonials__heading {
    display: flex;

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

    gap: 20px;

    margin-bottom: 13px;
}


.workshops-testimonials__title-wrap {
    display: flex;

    align-items: center;

    gap: 7px;
}


.workshops-testimonials__title-wrap h2 {
    margin: 0;

    color: #223c33;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 22px;

    font-weight: 400;

    line-height: 1.2;
}


.workshops-testimonials__title-wrap > span {
    color: #8a9b8d;

    font-size: 13px;

    transform: rotate(-18deg);
}


/* ==========================================================
   CONTROLS
========================================================== */

.workshops-testimonials__controls {
    display: flex;

    gap: 6px;
}


.workshops-testimonials__arrow {
    width: 30px;
    height: 30px;

    display: flex;

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

    color: #17483b;

    background: #ffffff;

    border:
        1px solid rgba(23,72,59,.13);

    border-radius: 50%;

    font-size: 12px;

    cursor: pointer;

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


.workshops-testimonials__arrow:hover {
    color: #ffffff;

    background: #17483b;

    transform: translateY(-1px);
}


/* ==========================================================
   VIEWPORT
========================================================== */

.workshops-testimonials__viewport {
    overflow: hidden;
}


/* ==========================================================
   TRACK
========================================================== */

.workshops-testimonials__track {
    display: flex;

    gap: 12px;

    transition:
        transform .35s ease;
}


/* ==========================================================
   CARD
========================================================== */

.workshop-testimonial-card {
    flex:
        0
        0
        calc((100% - 24px) / 3);

    min-width: 0;

    min-height: 150px;

    padding:
        15px
        16px;

    background:
        linear-gradient(
            145deg,
            #ffffff,
            #faf8f2
        );

    border:
        1px solid rgba(23,72,59,.08);

    border-radius: 8px;
}


/* ==========================================================
   QUOTE
========================================================== */

.workshop-testimonial-card__quote {
    height: 25px;

    color: #17483b;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 32px;

    font-weight: 700;

    line-height: 1;
}


/* ==========================================================
   TEXT
========================================================== */

.workshop-testimonial-card__text {
    margin:
        2px
        0
        13px;

    color: #53635b;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 8px;

    line-height: 1.6;
}


/* ==========================================================
   AUTHOR
========================================================== */

.workshop-testimonial-card__author {
    display: flex;

    align-items: center;

    gap: 9px;
}


/* ==========================================================
   AVATAR PLACEHOLDER
========================================================== */

.workshop-testimonial-card__avatar {
    width: 34px;
    height: 34px;

    flex:
        0
        0
        34px;

    display: flex;

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

    overflow: hidden;

    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            #947c64,
            #61715f
        );

    border-radius: 50%;
}


.workshop-testimonial-card__avatar span {
    max-width: 90%;

    font-size: 4px;

    text-align: center;
}


/* ==========================================================
   AUTHOR TEXT
========================================================== */

.workshop-testimonial-card__author strong {
    display: block;

    margin-bottom: 2px;

    color: #294239;

    font-size: 7px;

    font-weight: 700;
}


.workshop-testimonial-card__author div > span {
    display: block;

    color: #7b8580;

    font-size: 6px;
}

/* ==========================================================
   WORKSHOPS — FINAL CTA
========================================================== */

.workshops-cta {
    position: relative;

    padding:
        10px
        0
        34px;

    background: #fffdf9;
}


.workshops-cta__box {
    position: relative;

    min-height: 150px;

    display: grid;

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

    overflow: hidden;

    color: #ffffff;

    background:
        linear-gradient(
            110deg,
            #073b30 0%,
            #10483a 62%,
            #17483b 100%
        );

    border-radius: 9px;
}


/* ==========================================================
   CONTENT
========================================================== */

.workshops-cta__content {
    position: relative;

    z-index: 3;

    padding:
        25px
        30px
        25px
        70px;
}


.workshops-cta__content h2 {
    max-width: 540px;

    margin:
        0
        0
        7px;

    color: #fffaf1;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 21px;

    font-weight: 400;

    line-height: 1.2;
}


.workshops-cta__content p {
    max-width: 450px;

    margin: 0;

    color:
        rgba(255,255,255,.78);

    font-size: 7px;

    line-height: 1.55;
}


/* ==========================================================
   ACTIONS
========================================================== */

.workshops-cta__actions {
    display: flex;

    flex-wrap: wrap;

    gap: 10px;

    margin-top: 15px;
}


.workshops-cta__button {
    min-height: 34px;

    display: inline-flex;

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

    gap: 8px;

    padding:
        8px
        13px;

    border-radius: 4px;

    font-size: 7px;

    font-weight: 700;

    text-decoration: none;

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


.workshops-cta__button svg {
    width: 13px;
    height: 13px;

    fill: none;

    stroke: currentColor;

    stroke-width: 1.5;

    stroke-linecap: round;
    stroke-linejoin: round;
}


.workshops-cta__button:hover {
    transform: translateY(-1px);
}


.workshops-cta__button--gold {
    color: #173d31;

    background: #e3b457;

    border:
        1px solid #e3b457;
}


.workshops-cta__button--gold:hover {
    background: #edc46c;
}


.workshops-cta__button--outline {
    color: #ffffff;

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

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


.workshops-cta__button--outline:hover {
    background:
        rgba(255,255,255,.08);
}


/* ==========================================================
   IMAGE
========================================================== */

.workshops-cta__visual {
    position: relative;

    min-width: 0;

    overflow: hidden;
}


.workshops-cta__placeholder {
    position: absolute;

    inset: 0;

    display: flex;

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

    background:
        linear-gradient(
            135deg,
            #927a59,
            #5e6954
        );
}


.workshops-cta__placeholder::before {
    content: "";

    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            90deg,
            #10483a 0%,
            rgba(16,72,58,.55) 15%,
            transparent 42%
        );
}


.workshops-cta__placeholder span {
    position: relative;

    z-index: 2;

    padding:
        5px
        9px;

    color: #ffffff;

    background:
        rgba(10,55,44,.67);

    border-radius: 999px;

    font-size: 6px;
}


/* ==========================================================
   BOTANICAL DECORATION
========================================================== */

.workshops-cta__decor {
    position: absolute;

    z-index: 4;

    left: -16px;
    bottom: -30px;

    color:
        rgba(220,170,67,.62);

    font-size: 115px;

    line-height: 1;

    transform: rotate(25deg);

    pointer-events: none;
}

/* ==========================================================
   WORKSHOPS — CTA / FOOTER SPACING
========================================================== */

.workshops-cta {
    position: relative;

    padding:
        10px
        0
        55px;

    margin: 0;

    background: #fffdf9;
}

/* Prevent unwanted margin collapsing before footer */
.workshops-cta + footer,
.workshops-cta + .site-footer {
    margin-top: 0;
}

/* If footer has its own top margin */
.site-footer {
    margin-top: 0;
}

/* ==========================================================
   WORKSHOPS PAGE — RESPONSIVE
   Keep this at the VERY END of workshops.css
========================================================== */


/* ==========================================================
   TABLET
   769px — 1024px
========================================================== */

@media (max-width: 1024px) {

    /* ------------------------------------------------------
       HERO
    ------------------------------------------------------ */

    .workshops-hero {
        margin-top: 70px;
    }

    .workshops-hero__layout {
        grid-template-columns:
            minmax(340px, .95fr)
            minmax(0, 1.05fr);

        min-height: 400px;
    }

    .workshops-hero__inner {
        padding:
            45px
            30px
            55px
            25px;
    }

    .workshops-hero__title {
        font-size: 39px;
    }

    .workshops-hero__quote {
        top: 45px;
        right: 25px;

        width: 155px;

        padding:
            17px
            15px
            20px;
    }

    .workshops-hero__quote blockquote {
        font-size: 14px;
    }


    /* VALUE STRIP */

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

    .workshops-hero__value:nth-child(2)::after {
        display: none;
    }

    .workshops-hero__value:nth-child(-n+2) {
        border-bottom:
            1px solid rgba(255,255,255,.12);
    }


    /* ------------------------------------------------------
       CATEGORIES
    ------------------------------------------------------ */

    .workshops-categories__grid {
        grid-template-columns:
            repeat(4, minmax(0, 1fr));
    }


    /* ------------------------------------------------------
       FEATURED
    ------------------------------------------------------ */

    .workshops-featured__layout {
        grid-template-columns:
            minmax(0, 1fr)
            220px;

        gap: 16px;
    }


    /* ------------------------------------------------------
       AUDIENCE
    ------------------------------------------------------ */

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


    /* last two cards */

    .workshops-audience-card:nth-child(4),
    .workshops-audience-card:nth-child(5) {
        min-height: 190px;
    }


    /* ------------------------------------------------------
       HOW IT WORKS
    ------------------------------------------------------ */

    .workshops-process__panel {
        padding-right: 200px;
    }

    .workshops-process__visual {
        width: 200px;
    }

    .workshops-process-step {
        padding:
            0
            7px;
    }

    .workshops-process-step__number {
        left: -2px;
    }

    .workshops-process-step__icon {
        width: 52px;
        height: 52px;
    }

    .workshops-process-step__icon svg {
        width: 30px;
        height: 30px;
    }


    /* ------------------------------------------------------
       CTA
    ------------------------------------------------------ */

    .workshops-cta__box {
        grid-template-columns:
            minmax(0, 1fr)
            300px;
    }

    .workshops-cta__content {
        padding:
            25px
            25px
            25px
            55px;
    }

}



/* ==========================================================
   MOBILE / SMALL TABLET
   <= 768px
========================================================== */

@media (max-width: 768px) {

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

    .workshops-hero {
        margin-top: 70px;

        padding-bottom: 28px;
    }

    .workshops-hero__layout {
        display: flex;

        flex-direction: column;

        min-height: 0;
    }


    /* HERO CONTENT */

    .workshops-hero__content {
        display: block;
    }

    .workshops-hero__inner {
        max-width: none;

        padding:
            42px
            24px
            38px;
    }

    .workshops-hero__eyebrow {
        margin-bottom: 10px;

        font-size: 9px;
    }

    .workshops-hero__title {
        max-width: 520px;

        font-size: 38px;

        line-height: 1.08;
    }

    .workshops-hero__line {
        margin:
            16px
            0;
    }

    .workshops-hero__description {
        max-width: 520px;

        font-size: 10px;

        line-height: 1.65;
    }

    .workshops-hero__button {
        font-size: 8px;
    }


    /* HERO IMAGE */

    .workshops-hero__visual {
        min-height: 310px;
    }

    .workshops-hero__image-placeholder {
        position: absolute;
    }


    /* QUOTE */

    .workshops-hero__quote {
        top: auto;
        right: 22px;
        bottom: 22px;

        width: 180px;
    }

    .workshops-hero__quote blockquote {
        font-size: 14px;
    }


    /* VALUE STRIP */

    .workshops-hero__values {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        margin-top: -15px;
    }

    .workshops-hero__value {
        min-height: 82px;

        padding:
            14px
            15px;
    }


    /* ======================================================
       CATEGORIES
    ====================================================== */

    .workshops-categories {
        padding:
            16px
            0
            35px;
    }

    .workshops-categories__grid {
        grid-template-columns:
            repeat(4, minmax(0, 1fr));

        gap: 7px;
    }

    .workshop-category-card {
        min-height: 95px;
    }


    /* ======================================================
       FEATURED
    ====================================================== */

    .workshops-featured {
        padding:
            38px
            0;
    }

    .workshops-featured__heading {
        align-items: flex-start;

        flex-direction: column;

        gap: 8px;
    }

    .workshops-featured__heading > p {
        max-width: 500px;
    }

    .workshops-featured__layout {
        grid-template-columns:
            1fr;

        gap: 18px;
    }

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


    /* SIDEBAR BECOMES 2 COLUMNS */

    .workshops-featured__sidebar {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        align-items: stretch;
    }

    .workshops-info-card {
        height: 100%;
    }


    /* ======================================================
       AUDIENCE
    ====================================================== */

    .workshops-audience {
        padding:
            38px
            0;
    }

    .workshops-audience__heading {
        flex-direction: column;

        align-items: flex-start;

        gap: 8px;
    }

    .workshops-audience__heading > p {
        max-width: 500px;
    }

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

    .workshops-audience-card,
    .workshops-audience-card:nth-child(4),
    .workshops-audience-card:nth-child(5) {
        min-height: 185px;
    }


    /* ======================================================
       HOW IT WORKS
    ====================================================== */

    .workshops-process {
        padding:
            18px
            0
            30px;
    }

    .workshops-process__panel {
        padding:
            20px
            20px
            210px;

        min-height: 0;
    }

    .workshops-process__heading {
        justify-content: flex-start;

        margin-bottom: 20px;
    }

    .workshops-process__steps {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap:
            24px
            15px;
    }

    .workshops-process-step {
        padding:
            0
            10px;
    }


    /* Hide horizontal connectors because rows wrap */

    .workshops-process-step__connector {
        display: none;
    }

    .workshops-process-step__number {
        left: 5px;
    }

    .workshops-process-step p {
        max-width: 160px;
    }


    /* PROCESS IMAGE BELOW */

    .workshops-process__visual {
        top: auto;
        left: 20px;
        right: 20px;
        bottom: 20px;

        width: auto;
        height: 170px;

        border-radius: 8px;
    }

    .workshops-process__image-placeholder::before {
        background:
            linear-gradient(
                0deg,
                rgba(16,72,58,.15),
                transparent 45%
            );
    }


    /* ======================================================
       TESTIMONIALS
    ====================================================== */

    .workshop-testimonial-card {
        flex:
            0
            0
            calc((100% - 12px) / 2);
    }


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

    .workshops-cta__box {
        grid-template-columns:
            minmax(0, 1fr)
            230px;
    }

    .workshops-cta__content {
        padding:
            26px
            20px
            26px
            45px;
    }

    .workshops-cta__content h2 {
        font-size: 20px;
    }

}



/* ==========================================================
   MOBILE
   <= 600px
========================================================== */

@media (max-width: 600px) {

    /* ======================================================
       GLOBAL MOBILE TYPOGRAPHY
    ====================================================== */

    .workshops-categories__title-wrap h2,
    .workshops-testimonials__title-wrap h2,
    .workshops-process__heading h2 {
        font-size: 24px;
    }

    .workshops-featured__heading h2,
    .workshops-audience__heading h2 {
        font-size: 27px;
    }


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

    .workshops-hero {
        margin-top: 64px;
    }

    .workshops-hero__inner {
        padding:
            36px
            20px
            32px;
    }

    .workshops-hero__title {
        font-size: 34px;
    }

    .workshops-hero__description {
        font-size: 11px;
    }

    .workshops-hero__actions {
        gap: 8px;

        margin-top: 20px;
    }

    .workshops-hero__button {
        min-height: 40px;

        font-size: 9px;
    }

    .workshops-hero__visual {
        min-height: 275px;
    }

    .workshops-hero__quote {
        right: 18px;
        bottom: 18px;

        width: 170px;

        padding:
            17px
            15px
            19px;
    }


    /* ======================================================
       VALUE STRIP
    ====================================================== */

    .workshops-hero__values {
        grid-template-columns:
            1fr;

        margin-top: -10px;
    }

    .workshops-hero__value {
        min-height: 76px;

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

        padding:
            13px
            16px;
    }

    .workshops-hero__value:not(:last-child)::after {
        display: none;
    }

    .workshops-hero__value:nth-child(-n+3) {
        border-bottom:
            1px solid rgba(255,255,255,.12);
    }

    .workshops-hero__value strong {
        font-size: 10px;
    }

    .workshops-hero__value div > span {
        font-size: 8px;
    }


    /* ======================================================
       CATEGORIES
    ====================================================== */

    .workshops-categories__heading {
        align-items: flex-start;
    }

    .workshops-categories__view-all {
        padding-top: 7px;

        white-space: nowrap;
    }

    .workshops-categories__grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap: 9px;
    }

    .workshop-category-card {
        min-height: 112px;

        padding:
            15px
            10px;
    }

    .workshop-category-card__label {
        font-size: 9px;
    }


    /* ======================================================
       FEATURED
    ====================================================== */

    .workshops-featured {
        padding:
            35px
            0;
    }

    .workshops-featured__eyebrow {
        font-size: 8px;
    }

    .workshops-featured__heading > p {
        font-size: 9px;
    }

    .workshops-featured__list {
        grid-template-columns:
            1fr;

        gap: 13px;
    }

    .featured-workshop-card__image {
        min-height: 190px;
    }

    .featured-workshop-card__content {
        padding:
            17px
            16px;
    }

    .featured-workshop-card__content h3 {
        font-size: 18px;
    }

    .featured-workshop-card__content > p {
        font-size: 10px;
    }

    .featured-workshop-card__category {
        font-size: 8px;
    }

    .featured-workshop-card__meta,
    .featured-workshop-card__audience {
        font-size: 8px;
    }

    .featured-workshop-card__link {
        font-size: 9px;
    }


    /* FEATURED SIDEBAR */

    .workshops-featured__sidebar {
        grid-template-columns:
            1fr;

        gap: 12px;
    }

    .workshops-info-card {
        padding: 20px;
    }

    .workshops-info-card__eyebrow {
        font-size: 8px;
    }

    .workshops-info-card--why h3 {
        font-size: 20px;
    }

    .workshops-info-card--why > p {
        font-size: 9px;
    }

    .workshops-info-card__list strong {
        font-size: 9px;
    }

    .workshops-info-card__list li div > span {
        font-size: 8px;
    }

    .workshops-info-card__title-row h3 {
        font-size: 19px;
    }

    .workshops-format strong {
        font-size: 9px;
    }

    .workshops-format div > span {
        font-size: 8px;
    }

    .workshops-info-card__button {
        font-size: 9px;
    }


    /* ======================================================
       AUDIENCE
    ====================================================== */

    .workshops-audience {
        padding:
            35px
            0;
    }

    .workshops-audience__eyebrow {
        font-size: 8px;
    }

    .workshops-audience__heading > p {
        font-size: 9px;
    }

    .workshops-audience__grid {
        grid-template-columns:
            1fr;

        gap: 10px;
    }

    .workshops-audience-card,
    .workshops-audience-card:nth-child(4),
    .workshops-audience-card:nth-child(5) {
        min-height: 0;

        padding:
            20px;
    }

    .workshops-audience-card h3 {
        font-size: 18px;
    }

    .workshops-audience-card p {
        font-size: 10px;
    }

    .workshops-audience-card a {
        margin-top: 15px;

        padding-top: 0;

        font-size: 9px;
    }


    /* ======================================================
       HOW IT WORKS
    ====================================================== */

    .workshops-process__panel {
        padding:
            22px
            16px
            205px;
    }

    .workshops-process__heading {
        justify-content: center;
    }

    .workshops-process__steps {
        grid-template-columns:
            1fr;

        gap: 22px;
    }

    .workshops-process-step {
        display: grid;

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

        grid-template-rows:
            auto
            auto;

        column-gap: 14px;

        align-items: center;

        text-align: left;

        padding: 0;
    }

    .workshops-process-step__icon {
        grid-column: 1;
        grid-row:
            1 / span 2;

        margin: 0;

        width: 58px;
        height: 58px;
    }

    .workshops-process-step__number {
        top: -4px;
        left: 42px;

        width: 19px;
        height: 19px;
    }

    .workshops-process-step h3 {
        grid-column: 2;
        grid-row: 1;

        align-self: end;

        margin-bottom: 4px;

        font-size: 16px;
    }

    .workshops-process-step p {
        grid-column: 2;
        grid-row: 2;

        align-self: start;

        max-width: none;

        font-size: 9px;
    }

    .workshops-process__visual {
        left: 16px;
        right: 16px;
        bottom: 16px;

        height: 165px;
    }


    /* ======================================================
       TESTIMONIALS
    ====================================================== */

    .workshops-testimonials {
        padding:
            20px
            0
            30px;
    }

    .workshops-testimonials__heading {
        margin-bottom: 15px;
    }

    .workshops-testimonials__arrow {
        width: 32px;
        height: 32px;
    }

    .workshop-testimonial-card {
        flex:
            0
            0
            100%;

        min-height: 170px;

        padding:
            18px;
    }

    .workshop-testimonial-card__text {
        font-size: 11px;

        line-height: 1.6;
    }

    .workshop-testimonial-card__author strong {
        font-size: 9px;
    }

    .workshop-testimonial-card__author div > span {
        font-size: 8px;
    }


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

    .workshops-cta {
        padding:
            10px
            0
            28px;
    }

    .workshops-cta__box {
        display: flex;

        flex-direction: column;

        min-height: 0;
    }

    .workshops-cta__content {
        order: 1;

        padding:
            30px
            22px
            27px;
    }

    .workshops-cta__content h2 {
        max-width: 400px;

        font-size: 25px;

        line-height: 1.2;
    }

    .workshops-cta__content p {
        font-size: 10px;

        line-height: 1.6;
    }

    .workshops-cta__actions {
        margin-top: 18px;
    }

    .workshops-cta__button {
        min-height: 40px;

        font-size: 9px;
    }

    .workshops-cta__visual {
        order: 2;

        min-height: 210px;
    }

    .workshops-cta__placeholder {
        position: absolute;
    }

    .workshops-cta__placeholder::before {
        background:
            linear-gradient(
                180deg,
                #10483a 0%,
                rgba(16,72,58,.35) 18%,
                transparent 45%
            );
    }

    .workshops-cta__decor {
        left: -30px;
        bottom: auto;
        top: 40px;

        font-size: 100px;

        opacity: .6;
    }

}



/* ==========================================================
   SMALL MOBILE
   <= 420px
========================================================== */

@media (max-width: 420px) {

    /* HERO */

    .workshops-hero__title {
        font-size: 31px;
    }

    .workshops-hero__actions {
        flex-direction: column;

        align-items: stretch;
    }

    .workshops-hero__button {
        width: 100%;
    }


    /* CATEGORY HEADER */

    .workshops-categories__heading {
        flex-direction: column;

        gap: 8px;
    }

    .workshops-categories__view-all {
        padding-top: 0;
    }


    /* TESTIMONIAL HEADER */

    .workshops-testimonials__title-wrap h2 {
        font-size: 21px;
    }


    /* CTA BUTTONS */

    .workshops-cta__actions {
        flex-direction: column;
    }

    .workshops-cta__button {
        width: 100%;
    }

}