:root {
    --homepage-ink: #173c51;
    --homepage-muted: #586972;
    --homepage-accent: #c76522;
    --homepage-accent-dark: #a94d13;
    --homepage-cream: #fbf8f1;
    --homepage-line: #e7dece;
}

/*
 * headerStyle.css keeps the legacy site convention of 1rem = 10px.
 * This stylesheet is loaded only by the refreshed homepage, whose type scale
 * uses the browser-standard rem baseline.
 */
html {
    font-size: 100% !important;
}

.starart-home-page {
    min-width: 0;
    color: var(--homepage-ink);
    background: var(--homepage-cream);
    font-family: "Microsoft JhengHei", "Noto Sans TC", sans-serif;
}

.starart-home-page .elementor-element-homepageTop {
    overflow: hidden;
    border-bottom: 1px solid rgba(23, 60, 81, .12);
    box-shadow: 0 10px 30px rgba(30, 56, 70, .08);
}

/* Elementor 的滿版計算會把桌面瀏覽器的垂直捲軸寬度算入，造成 15px 水平溢位。 */
.starart-home-page .homepage-announcement-section {
    left: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden;
}

.starart-home-page .homepage-intro {
    position: relative;
    overflow: hidden;
    padding: 46px 24px;
    background: linear-gradient(120deg, #eef8f5 0%, #fff8e9 55%, #f7ead7 100%) !important;
}

.starart-home-page .homepage-intro::before,
.starart-home-page .homepage-intro::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
}

.starart-home-page .homepage-intro::before {
    width: 220px;
    height: 220px;
    top: -150px;
    left: 8%;
    background: rgba(199, 101, 34, .10);
}

.starart-home-page .homepage-intro::after {
    width: 180px;
    height: 180px;
    right: 10%;
    bottom: -130px;
    background: rgba(23, 60, 81, .09);
}

.starart-home-page .homepage-intro > .elementor-container {
    min-height: 0 !important;
}

.starart-home-page .homepage-intro .elementor-element-starart {
    color: var(--homepage-ink);
    font-size: 1rem;
    font-style: normal;
}

.starart-home-page .homepage-intro p {
    margin: 0;
}

.starart-home-page .homepage-intro-eyebrow,
.starart-home-page .homepage-section-eyebrow {
    color: var(--homepage-accent);
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: .14em;
    white-space: nowrap;
}

.starart-home-page .homepage-intro-title {
    margin: 10px 0 0 !important;
    font-size: clamp(2rem, 5vw, 3.35rem);
    font-weight: 800;
    line-height: 1.35;
    letter-spacing: .08em;
    white-space: nowrap;
}

.starart-home-page .homepage-intro-title span {
    color: var(--homepage-accent);
}

.starart-home-page .homepage-intro-copy,
.starart-home-page .homepage-section-copy {
    color: var(--homepage-muted);
    font-size: 1.08rem;
    line-height: 1.8;
}

.starart-home-page .homepage-intro-copy {
    margin-top: 12px !important;
}

.starart-home-page .homepage-experiences {
    padding: 76px 24px 84px;
    background: #fffdf8 !important;
}

.starart-home-page .homepage-experiences > .elementor-container {
    max-width: 1180px;
}

.starart-home-page .homepage-experiences .elementor-element-videoTitle > .elementor-widget-container {
    margin: 0;
    padding: 0 12px 34px;
}

.starart-home-page .homepage-experiences .elementor-element-videoTitle .elementor-heading-title {
    max-width: 760px;
    margin: 8px auto 10px;
    color: var(--homepage-ink);
    font-size: clamp(1.75rem, 4vw, 2.45rem);
    font-weight: 600;
    line-height: 1.4;
}

.starart-home-page .homepage-experiences .homepage-section-copy {
    max-width: 720px;
    margin: 0 auto;
}

.starart-home-page .homepage-experiences .elementor-inner-section > .elementor-container > .elementor-row {
    gap: 26px;
    align-items: stretch;
}

.starart-home-page .homepage-experiences .elementor-inner-section > .elementor-container > .elementor-row > .elementor-column {
    width: calc(50% - 13px);
}

.starart-home-page .homepage-experiences .elementor-element-seriesCourseContext,
.starart-home-page .homepage-experiences .elementor-element-seriesCourseContext > .elementor-widget-container,
.starart-home-page .homepage-experiences .elementor-cta {
    height: 100%;
}

.starart-home-page .homepage-experiences .elementor-cta {
    overflow: hidden;
    background: #fff;
    border: 1px solid var(--homepage-line);
    border-radius: 20px;
    box-shadow: 0 14px 36px rgba(56, 67, 71, .10);
    transition: transform .25s ease, box-shadow .25s ease;
}

.starart-home-page .homepage-experiences .elementor-cta:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 40px rgba(56, 67, 71, .16);
}

.starart-home-page .homepage-experiences .elementor-cta__bg-wrapper {
    min-width: 42%;
    min-height: 310px;
}

.starart-home-page .homepage-experience-image-link {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
}

.starart-home-page .homepage-experience-image-link:focus-visible {
    outline: 3px solid #fff;
    outline-offset: -5px;
}

.starart-home-page .homepage-experience-icon {
    position: absolute;
    inset: 0;
    display: block;
    width: 50%;
    height: auto;
    margin: auto;
}

.starart-home-page .homepage-experiences .elementor-cta__content {
    padding: 30px;
    background: #fff;
}

.starart-home-page .homepage-experiences .elementor-cta__title {
    color: var(--homepage-ink);
    font-size: 1.55rem;
    font-weight: 800;
    line-height: 1.45;
}

.starart-home-page .homepage-experiences .elementor-cta__description {
    color: #485b65;
    font-size: 1.08rem !important;
    line-height: 1.85;
    text-align: justify;
}

.starart-home-page .homepage-experiences .elementor-cta__button {
    padding: 11px 22px;
    color: #fff !important;
    background: var(--homepage-accent);
    border: 0;
    border-radius: 999px;
    font-size: 1rem;
    font-weight: 700;
}

.starart-home-page .homepage-experiences .elementor-cta__button:hover,
.starart-home-page .homepage-experiences .elementor-cta__button:focus-visible {
    color: #fff !important;
    background: var(--homepage-accent-dark);
}

.starart-home-page .homepage-schedules {
    min-height: 0;
    padding: 76px 24px 86px;
    background: linear-gradient(145deg, #edf5f3 0%, #f7efe1 100%) !important;
}

.starart-home-page .homepage-schedules > .elementor-background-overlay {
    display: none;
}

.starart-home-page .homepage-section-heading {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 820px;
    margin: 0 auto 34px;
    padding: 0 16px;
    text-align: center;
}

.starart-home-page .homepage-section-heading h2 {
    margin: 8px 0 10px;
    color: var(--homepage-ink);
    font-size: clamp(1.75rem, 4vw, 2.45rem);
    font-weight: 800;
    line-height: 1.4;
}

.starart-home-page .homepage-schedules > .elementor-container {
    min-height: 0 !important;
    max-width: 1180px;
}

.starart-home-page .homepage-schedules > .elementor-container > .elementor-row {
    gap: 26px;
    align-items: stretch;
}

.starart-home-page .homepage-schedules .elementor-element-pointBorder {
    width: calc(50% - 13px);
}

.starart-home-page .homepage-schedules .elementor-element-pointBorder > .elementor-column-wrap.elementor-element-populated {
    height: 100%;
    margin: 0;
    padding: 26px;
    background: rgba(255, 255, 255, .96);
    border: 1px solid var(--homepage-line);
    border-radius: 20px;
    box-shadow: 0 14px 36px rgba(56, 67, 71, .10);
}

.starart-home-page .homepage-schedules .elementor-element-pointBorder > .elementor-column-wrap > .elementor-widget-wrap {
    align-content: flex-start;
}

.starart-home-page .homepage-schedule-card-title {
    width: 100%;
    margin-bottom: 18px;
    text-align: left;
}

.starart-home-page .homepage-schedule-card-title span {
    display: inline-block;
    margin-bottom: 7px;
    padding: 4px 10px;
    color: var(--homepage-accent-dark);
    background: #fff0df;
    border-radius: 999px;
    font-size: .9rem;
    font-weight: 700;
}

.starart-home-page .homepage-schedule-card-title h3 {
    margin: 0;
    color: var(--homepage-ink);
    font-size: 1.45rem;
    font-weight: 800;
}

.starart-home-page .homepage-schedules .elementor-inner-section,
.starart-home-page .homepage-schedules .elementor-inner-section > .elementor-container {
    width: 100%;
}

.starart-home-page .homepage-schedule-image {
    display: block;
    width: 100%;
    height: auto;
    border: 1px solid #e5e7e8;
    border-radius: 12px;
}

.starart-home-page .homepage-schedule-empty {
    display: flex;
    min-height: 280px;
    align-items: center;
    justify-content: center;
    padding: 24px;
    color: var(--homepage-muted);
    background: #f5f6f6;
    border: 1px dashed #b9c4c8;
    border-radius: 12px;
    font-size: 1.05rem;
}

.starart-home-page .homepage-schedules .elementor-element-pointBg > .elementor-widget-container {
    margin-top: 18px;
    padding: 0;
    background: transparent;
    border-radius: 0;
}

.starart-home-page .homepage-schedule-action {
    display: block;
    padding: 12px 18px;
    color: #fff !important;
    background: var(--homepage-ink);
    border-radius: 10px;
    font-family: "Microsoft JhengHei", "Noto Sans TC", sans-serif !important;
    font-size: 1.3rem !important;
    font-style: normal !important;
    font-weight: 700;
    text-align: center;
    text-decoration: none;
}

.starart-home-page .homepage-schedule-action:hover,
.starart-home-page .homepage-schedule-action:focus-visible {
    color: #fff !important;
    background: #0d2b3b;
}

@media (max-width: 767px) {
    .starart-home-page .homepage-intro {
        padding: 38px 18px;
    }

    .starart-home-page .homepage-intro-title {
        font-size: clamp(1.65rem, 8vw, 2.35rem);
        letter-spacing: .04em;
    }

    .starart-home-page .homepage-intro-copy,
    .starart-home-page .homepage-section-copy {
        font-size: 1rem;
    }

    .starart-home-page .homepage-experiences,
    .starart-home-page .homepage-schedules {
        padding: 54px 14px 60px;
    }

    .starart-home-page .homepage-experiences .elementor-element-videoTitle > .elementor-widget-container {
        margin: 0;
        padding: 0 8px 26px;
    }

    .starart-home-page .homepage-experiences .elementor-inner-section > .elementor-container > .elementor-row,
    .starart-home-page .homepage-schedules > .elementor-container > .elementor-row {
        display: flex;
        flex-direction: column;
        gap: 20px;
    }

    .starart-home-page .homepage-experiences .elementor-inner-section > .elementor-container > .elementor-row > .elementor-column,
    .starart-home-page .homepage-schedules .elementor-element-pointBorder {
        width: 100%;
    }

    .starart-home-page .homepage-experiences .elementor-cta {
        display: block;
    }

    .starart-home-page .homepage-experiences .elementor-cta__bg-wrapper {
        width: 100%;
        min-height: 225px;
    }

    .starart-home-page .homepage-experiences .elementor-cta__content {
        padding: 24px 22px 28px;
    }

    .starart-home-page .homepage-experiences .elementor-cta__title {
        font-size: 1.35rem;
    }

    .starart-home-page .homepage-schedules .elementor-element-pointBorder > .elementor-column-wrap.elementor-element-populated {
        padding: 20px;
    }

}
