/* ============================================================
   247Lab — 旗下项目 / Projects
   为首页的 LADss 入口面板提供样式。沿用 247Lab 既有的排版体系
   （Montserrat 大写字距标题、.line 分隔线、.button 按钮），
   底色取自 LADss 自身的品牌色，使两套视觉自然衔接。
   ============================================================ */

section.project-block {
    background: #f3ece3;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

/* 主站的版权信息原为 fixed 定位（白字），会在浅色面板上透出。
   这里让它回到联系面板的内容流中，仅影响本页，未改动 style.css。 */
section.contact-block .copyright {
    position: static;
    width: auto;
    margin-top: 26px;
}

section.project-block > .center {
    display: block;
    width: 100%;
}

.project-block h2,
.project-block h3 {
    color: #1b1613;
}

.project-block p {
    color: #5b4636;
    max-width: 620px;
    margin: 12px auto 0;
}

.project-block .line.no-accent {
    background: rgba(27, 22, 19, 0.2);
}

.project-logo {
    display: inline-block;
    margin: 22px 0 2px;
    -webkit-transition: opacity 0.3s ease-in-out;
    transition: opacity 0.3s ease-in-out;
}

.project-logo:hover {
    opacity: .65;
}

.project-logo img {
    display: inline-block;
    width: 260px;
    max-width: 62vw;
    height: auto;
}

.project-block .button {
    margin-top: 34px;
    /* 主站 .button 为全大写，会把品牌名 LADss 变成 LADSS，这里关闭 */
    text-transform: none;
    color: #1b1613;
    border: 1px solid rgba(27, 22, 19, 0.35);
}

.project-block .button:hover {
    background: #1b1613;
    border: 1px solid #1b1613;
    color: #f3ece3;
}

.project-meta {
    margin-top: 26px;
    font-size: 10px;
    color: #8a7461;
    font-family: "Montserrat", "Helvetica Neue", Arial, "Microsoft Yahei", Helvetica, sans-serif, Lato;
    font-weight: 400;
    text-transform: none;  /* 保留 auoc、LADss 等品牌名的原有大小写 */
    letter-spacing: 0.2em;
    line-height: 1.6em;
}

@media all and (max-width: 700px) {
    .project-logo img { width: 210px; }
    .project-block .button { margin-top: 26px; }
    .project-meta { margin-top: 18px; }
}

/* ============================================================
   关于 / 业务面板（#about）
   沿用主站的排版体系与 Ionicons 图标（linea 图标字体文件缺失，未使用）。
   ============================================================ */

section.about-block {
    background: #ffffff;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

section.about-block > .center {
    display: block;
    width: 100%;
}

.about-block .about-lead {
    max-width: 640px;
    margin: 14px auto 0;
    color: #777;
}

.about-block .line.no-accent {
    background: #e0e0e0;
}

.service-row {
    margin-top: clamp(28px, 5vh, 56px);
}

.service {
    margin-bottom: 22px;
}

.service i.icon {
    font-size: 30px;
    line-height: 1;
    color: #272727;
}

.service h3 {
    padding: 12px 0 6px;
}

.service p {
    font-size: 14px;
    line-height: 1.7em;
    color: #777;
    max-width: 260px;
    margin: 0 auto;
}

/* 小屏内容较高，改为自适应高度，避免被 section 的 100vh 裁掉 */
@media (max-width: 991px) {
    section.about-block {
        height: auto;
        min-height: 100vh;
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .service p { max-width: 420px; }
}

/* ============================================================
   团队与能力面板（#team）
   内容依据 247Lab Info Pack：创意设计部门 / 开发部署部门。
   ============================================================ */

section.team-block {
    background: #f6f6f6;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

section.team-block > .center {
    display: block;
    width: 100%;
}

.team-block .team-lead {
    max-width: 640px;
    margin: 14px auto 0;
    color: #777;
}

.team-block .line.no-accent {
    background: #e0e0e0;
}

.division-row {
    margin-top: clamp(28px, 5vh, 52px);
    max-width: 860px;
    margin-left: auto;
    margin-right: auto;
}

.division {
    margin-bottom: 24px;
}

.division h3 {
    padding-bottom: 8px;
}

.division .division-meta {
    font-size: 11px;
    letter-spacing: 0.14em;
    color: #b0392f;
    color: #d81b41;
    margin: 0 auto 8px;
    max-width: 380px;
}

.division p {
    font-size: 14px;
    line-height: 1.8em;
    color: #777;
    max-width: 380px;
    margin: 0 auto;
}

.capability-list {
    margin: clamp(20px, 4vh, 40px) auto 0;
    padding: 0;
    max-width: 700px;
    text-align: center;
}

.capability-list li {
    display: inline-block;
    margin: 6px 5px;
    padding: 7px 16px;
    border: 1px solid #dcdcdc;
    border-radius: 999px;
    background: #fff;
    font-size: 12px;
    letter-spacing: 0.1em;
    color: #555;
}

/* 首屏 logo 下的中文名（与 Info Pack 的标准组合一致） */
.logo-cn {
    position: absolute;
    top: 80px;
    left: 0;
    width: 250px;
    padding-right: 2px;
    text-align: right;
    font-size: 12px;
    line-height: 1;
    letter-spacing: 0.3em;
    color: #272727;
}

@media (max-width: 991px) {
    section.team-block {
        height: auto;
        min-height: 100vh;
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .division p, .division .division-meta { max-width: 420px; }
}

/* ============================================================
   项目方向面板（#work）
   依据 Info Pack 的案例页，按客户要求不署具体客户与项目名称，
   只呈现行业与项目类型。
   ============================================================ */

section.work-block {
    background: #ffffff;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

section.work-block > .center {
    display: block;
    width: 100%;
}

.work-block .work-lead {
    max-width: 640px;
    margin: 14px auto 0;
    color: #777;
}

.work-block .line.no-accent {
    background: #e0e0e0;
}

.work-row {
    margin-top: clamp(28px, 5vh, 52px);
}

.work-item {
    margin-bottom: 24px;
}

.work-item h3 {
    padding: 0 0 10px;
    position: relative;
}

.work-item .tag {
    display: inline-block;
    margin-left: 8px;
    padding: 3px 8px;
    border-radius: 999px;
    background: #ffe8ed;
    color: #d81b41;
    font-size: 9px;
    letter-spacing: 0.16em;
    vertical-align: middle;
}

.work-item p {
    font-size: 14px;
    line-height: 1.8em;
    color: #777;
    max-width: 260px;
    margin: 0 auto;
}

@media (max-width: 991px) {
    section.work-block {
        height: auto;
        min-height: 100vh;
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .work-item p { max-width: 420px; }
}

/* LADss 面板：现场缩略图与子站入口 */
.project-shots {
    margin: 26px auto 0;
    padding: 0;
    max-width: 620px;
    font-size: 0;
    text-align: center;
}

.project-shots li {
    display: inline-block;
    width: 25%;
    padding: 0 4px;
    vertical-align: top;
}

.project-shots a {
    display: block;
    overflow: hidden;
    border-radius: 2px;
    -webkit-transition: opacity 0.3s ease-in-out;
    transition: opacity 0.3s ease-in-out;
}

.project-shots a:hover { opacity: .72; }

.project-shots img {
    display: block;
    width: 100%;
    height: 92px;
    object-fit: cover;
}

.project-links {
    margin: 30px 0 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.project-links .button {
    margin-top: 0;
    margin-right: 24px;
}

.project-links .text-link {
    margin: 0 12px;
    font-size: 12px;
    letter-spacing: 0.16em;
    color: #6b4a2f;
    border-bottom: 1px solid rgba(107, 74, 47, 0.35);
    padding-bottom: 3px;
    text-decoration: none;
}

.project-links .text-link:hover { color: #1b1613; border-bottom-color: #1b1613; }

@media (max-width: 700px) {
    .project-shots { max-width: 420px; }
    .project-shots img { height: 64px; }
    .project-links .button { margin-right: 0; margin-bottom: 14px; }
    .project-links .text-link { margin: 0 8px; font-size: 11px; }
}