/* ============================================================
   School Holiday Camps 页（/p/about-1）专属样式
   基础布局复用 rttc-about.css（导航/hero/区块/优势卡/页脚），
   此处只做营地页特有部分：按钮行、信息 chips、日程表、
   黑底图文板块、场馆大图。响应式：≤1024px 单列、≤768px 缩字号。
   ============================================================ */

/* ---------- 报名按钮行 ---------- */
.hc-btn-row {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 16px;
    margin: 26px 0 8px;
}

.hc-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 50px;
    padding: 8px 34px;
    font-family: 'Roboto', Arial, sans-serif;
    font-weight: 700;
    font-size: 19px;
    line-height: 1.4em;
    text-decoration: none;
    border: 4px solid #000000;
    transition: background-color .3s ease, color .3s ease;
}

.hc-btn--primary {
    background: #000000;
    color: #FFFFFF;
}

.hc-btn--primary:hover {
    background: #FFC314;
    border-color: #FFC314;
    color: #000000;
}

.hc-btn--ghost {
    background: #FFFFFF;
    color: #000000;
}

.hc-btn--ghost:hover {
    background: #C71212;
    border-color: #C71212;
    color: #FFFFFF;
}

/* ---------- 关键信息 chips ---------- */
.hc-facts {
    list-style: none outside none;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
    margin: 26px 0 0;
    padding: 0;
}

.hc-facts-item {
    background: #FFFFFF;
    border: 3px solid #000000;
    font-family: 'Roboto', Arial, sans-serif;
    font-weight: 700;
    font-size: 15px;
    line-height: 1.4em;
    color: #000000;
    padding: 8px 18px;
}

/* ---------- 营地日程表 ---------- */
.hc-sched {
    width: 100%;
    max-width: 860px;
    margin: 30px auto 0;
    border-collapse: collapse;
    background: #FFFFFF;
    border: 6px solid #000000;
}

.hc-sched th,
.hc-sched td {
    font-family: 'Roboto', Arial, sans-serif;
    font-size: 16px;
    line-height: 1.6em;
    color: #000000;
    text-align: left;
    padding: 12px 18px;
    border-bottom: 2px solid #DBDBDB;
    vertical-align: top;
}

.hc-sched thead th {
    font-weight: 700;
    font-size: 17px;
    background: #000000;
    color: #FFFFFF;
    border-bottom: 0;
}

.hc-sched tbody tr:last-child td {
    border-bottom: 0;
}

.hc-sched tbody tr:nth-child(even) {
    background: #F5F5F5;
}

.hc-sched-time {
    font-weight: 700;
    white-space: nowrap;
    width: 170px;
}

/* ---------- 黑底图文板块 ---------- */
.hc-dark {
    background: #000000;
}

.hc-dark .rttc-sec-title {
    color: #FFFFFF;
}

.hc-dark .rttc-sec-tag {
    color: #FFC314;
}

.hc-dark .rttc-sec-desc {
    color: #D6D4D4;
}

/* 图文交替行：图片一侧 + 文字一侧 */
.hc-row {
    display: flex;
    align-items: center;
    gap: 34px;
    margin-top: 44px;
}

.hc-row--rev {
    flex-direction: row-reverse;
}

.hc-row-media {
    flex: 0 0 46%;
    min-width: 0;
}

.hc-row-media img {
    /* 按图片原始比例完整显示，不裁剪、不强制宽高比 */
    display: block;
    width: 100%;
    height: auto;
    border: 6px solid #FFFFFF;
    background: #000000;
}

/* 第一行（Skills That Stick）卡片：宽度保持整列不变（与第二行同宽），
   仅降低高度至与第二行教练团队图（784×526）一致，照片居中裁剪 */
.hc-row:not(.hc-row--rev) .hc-row-media img {
    width: 100%;
    aspect-ratio: 784 / 526;
    object-fit: cover;
    object-position: 50% 50%;
}

/* 第二行（Led by Champions）卡片：照片框尺寸保持不变（与原教练团队图
   784×526 的显示框一致），新竖版团队图居中裁剪填充，只换图不改框；
   object-position Y=60%：照片在框内稍微上移，人物位置抬高 */
.hc-row--rev .hc-row-media img {
    aspect-ratio: 784 / 526;
    object-fit: cover;
    object-position: 50% 60%;
}

.hc-row-body {
    flex: 1 1 auto;
    min-width: 0;
}

.hc-row-title {
    font-family: 'Oswald', Arial, sans-serif;
    font-weight: 500;
    font-size: 26px;
    line-height: 1.4em;
    color: #FFFFFF;
    margin: 0 0 14px;
}

.hc-row-list {
    list-style: disc outside none;
    font-family: 'Roboto', Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 1.9em;
    color: #D6D4D4;
    text-align: left;
    margin: 0;
    padding-left: 22px;
}

.hc-row-text {
    font-family: 'Roboto', Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 1.9em;
    color: #D6D4D4;
    text-align: left;
    margin: 0 0 14px;
}

.hc-link {
    display: inline-block;
    font-family: 'Roboto', Arial, sans-serif;
    font-weight: 700;
    font-size: 16px;
    line-height: 1.6em;
    color: #FFC314;
    text-decoration: none;
    border-bottom: 2px solid #FFC314;
    padding-bottom: 2px;
}

.hc-link:hover {
    color: #FFFFFF;
    border-bottom-color: #FFFFFF;
}

/* ---------- 场馆大图 ---------- */
.hc-venue {
    margin: 32px 0 0;
}

.hc-venue img {
    /* 按图片原始比例完整显示，不裁剪、不强制宽高比 */
    display: block;
    width: 100%;
    height: auto;
    border: 6px solid #000000;
}

.hc-venue-cap {
    font-family: 'Roboto', Arial, sans-serif;
    font-weight: 700;
    font-size: 14px;
    line-height: 1.7em;
    color: #000000;
    text-align: center;
    margin: 10px 0 0;
}

/* 开业公告框内按钮行去掉多余上边距并居中 */
.rttc-open-box .hc-btn-row {
    margin: 18px 0 0;
}

/* ---------- 响应式 ---------- */
@media (max-width: 1024px) {
    .hc-row,
    .hc-row--rev {
        flex-direction: column;
        gap: 20px;
    }

    .hc-row-media {
        flex: 1 1 auto;
        width: 100%;
    }
}

@media (max-width: 768px) {
    .hc-btn {
        width: 100%;
        max-width: 320px;
    }

    .hc-facts-item {
        font-size: 13px;
        padding: 6px 14px;
    }

    .hc-sched,
    .hc-sched tbody,
    .hc-sched tr,
    .hc-sched td {
        display: block;
        width: 100%;
    }

    .hc-sched thead {
        display: none;
    }

    .hc-sched tr {
        border-bottom: 2px solid #DBDBDB;
    }

    .hc-sched tr:last-child {
        border-bottom: 0;
    }

    .hc-sched td {
        border-bottom: 0;
        padding: 6px 16px;
    }

    .hc-sched-time {
        width: auto;
        padding-top: 12px;
        font-size: 17px;
    }

    .hc-row-title {
        font-size: 21px;
    }

    .hc-row-list,
    .hc-row-text {
        font-size: 14px;
    }

    .hc-venue-cap {
        font-size: 13px;
    }
}
