/* 學校理念與特色頁專用樣式：與 about-page.css 的 .abt 基礎共用 */
.phi{padding:0;overflow:hidden}
.phi *{box-sizing:border-box}
.phi .abt-stats{grid-template-columns:repeat(4,minmax(0,1fr))}

/* ---------- 校訓 ---------- */
.phi-motto{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:1.4rem}
.phi-motto-art{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;
  gap:1.6rem;margin:0;padding:3rem;border-radius:16px;overflow:hidden;color:#fff;
  background:linear-gradient(135deg,#0d2115 0%,#123a20 58%,#1d5c33 100%)}
.phi-motto-art::after{content:"";position:absolute;right:-54px;bottom:-72px;width:210px;height:210px;
  border-radius:50%;border:16px solid rgba(242,193,78,.16);pointer-events:none}
/* 衍生圖已去掉白邊，screen 讓黑底融入墨綠卡面；放大補回裁切後的視覺比例 */
.phi-motto-art img{position:relative;display:block;width:112%;max-width:none;margin-left:-6%;height:auto;
  mix-blend-mode:screen}
.phi-motto-art figcaption{position:relative;font-size:1.25rem;letter-spacing:.14em;color:#cfe0d4}
.phi-motto-copy{position:relative;overflow:hidden;padding:3rem 3.2rem;
  background:linear-gradient(135deg,#fffdf5 0%,#fff 100%);
  border:1px solid var(--abt-line);border-radius:16px}
.phi-motto-copy::after{content:"";position:absolute;right:-42px;top:-48px;width:140px;height:140px;
  border-radius:50%;background:rgba(242,193,78,.1);pointer-events:none}
.phi-label{position:relative;display:inline-block;padding:.35rem 1rem;border-radius:999px;
  background:#fdf6e3;border:1px solid #ecdcae;color:#6b5513;
  font-size:1.25rem;font-weight:700;letter-spacing:.12em}
.phi-motto-copy h4{position:relative;margin:.9rem 0 1.6rem;font-size:2.25rem;line-height:1.5;
  color:var(--g-900);letter-spacing:.03em}
.phi-def{position:relative;display:grid;grid-template-columns:auto 1fr;gap:1rem 1.4rem;margin:0}
.phi-def dt{font-size:1.2rem;font-weight:700;letter-spacing:.14em;color:#856818;padding-top:.3rem;white-space:nowrap}
.phi-def dd{margin:0;font-size:1.55rem;line-height:1.95;color:#3f4c44;text-align:justify}

/* ---------- 核心價值 ---------- */
.phi-values-wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(27rem,35rem);
  gap:1.4rem;margin-top:1.4rem;align-items:stretch}
.phi-values{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.phi-value{position:relative;overflow:hidden;padding:2rem;background:var(--abt-soft);
  border:1px solid #dce9e0;border-radius:14px}
.phi-value b{display:block;font-size:1.2rem;font-weight:700;letter-spacing:.14em;color:#856818}
.phi-value span{display:block;margin-top:.7rem;font-size:1.9rem;font-weight:700;
  color:var(--g-900);letter-spacing:.04em}
.phi-value::after{content:"";position:absolute;right:1.4rem;top:1.4rem;width:1.1rem;height:1.1rem;
  border-radius:50%;background:var(--gold);opacity:.6}
.phi-cartoon{display:flex;flex-direction:column;justify-content:center;margin:0;padding:1.2rem;
  background:var(--abt-cream);border:1px solid var(--abt-line);border-radius:16px}
.phi-cartoon img{display:block;width:100%;height:auto;border-radius:10px;background:#fff}
.phi-cartoon figcaption{padding:.9rem .4rem .1rem;font-size:1.25rem;line-height:1.6;
  color:#68736b;text-align:center}

/* ---------- 教育宗旨 ---------- */
.phi-aims{display:grid;grid-template-columns:minmax(0,1.22fr) minmax(24rem,.78fr);
  gap:1.8rem;align-items:start}
.phi-prose{position:relative;padding:2.4rem 2.6rem;background:#fff;
  border:1px solid var(--abt-line);border-left:4px solid var(--gold);border-radius:0 14px 14px 0}
.phi-prose p{margin:0;font-size:1.65rem;line-height:2;color:#3f4c44;text-align:justify}
.phi-photo{margin:0;padding:1rem;background:var(--abt-cream);
  border:1px solid var(--abt-line);border-radius:16px}
.phi-photo img{display:block;width:100%;height:auto;border-radius:10px;background:#fff}
.phi-photo figcaption{padding:.9rem .4rem .1rem;font-size:1.3rem;line-height:1.6;
  color:#68736b;text-align:center}

/* ---------- 辦學宗旨與理念 ---------- */
.phi-subhead{margin:0 0 1.4rem;padding-left:1.2rem;border-left:3px solid var(--gold);
  font-size:1.85rem;line-height:1.5;color:var(--g-900)}
.phi-purpose-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.2rem}
.phi-purpose{position:relative;padding:1.8rem 1.8rem 1.8rem 6.4rem;background:#fff;
  border:1px solid var(--abt-line);border-radius:14px}
.phi-purpose b{position:absolute;left:1.8rem;top:1.8rem;display:flex;align-items:center;
  justify-content:center;width:3.4rem;height:3.4rem;border-radius:50%;
  background:var(--g-700);color:var(--gold);font-size:1.2rem;font-weight:700}
.phi-purpose p{margin:0;font-size:1.5rem;line-height:1.9;color:#3f4c44;text-align:justify}
.phi-pillars{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.2rem;margin-top:2.4rem}
.phi-pillar{position:relative;overflow:hidden;padding:2.1rem;border:1px solid var(--abt-line);
  border-radius:14px;background:linear-gradient(135deg,#fffdf5 0%,#fff 100%)}
.phi-pillar-no{display:block;margin-bottom:.9rem;font-size:1.2rem;font-weight:700;
  letter-spacing:.16em;color:#856818}
.phi-pillar h4{margin:0 0 .9rem;font-size:1.7rem;line-height:1.5;color:var(--g-900)}
.phi-pillar p{margin:0;font-size:1.45rem;line-height:1.9;color:#45524a;text-align:justify}
.phi-pillar--dark{background:linear-gradient(135deg,var(--g-900) 0%,var(--g-700) 100%);
  border-color:transparent}
.phi-pillar--dark .phi-pillar-no{color:var(--gold)}
.phi-pillar--dark h4{color:var(--gold)}
.phi-pillar--dark p{color:#d7e7dc}

/* ---------- 教學特色 ---------- */
.phi-features{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.phi-feature{display:flex;align-items:flex-start;gap:1.1rem;padding:1.6rem 1.7rem;
  background:#fff;border:1px solid var(--abt-line);border-radius:12px}
.phi-feature:last-child{grid-column:1/-1}
.phi-feature-ico{display:flex;align-items:center;justify-content:center;flex:0 0 auto;
  width:2.8rem;height:2.8rem;border-radius:50%;background:var(--g-100);color:var(--g-700)}
.phi-feature-ico svg{width:1.6rem;height:1.6rem}
.phi-feature p{margin:0;font-size:1.5rem;line-height:1.8;color:#3f4c44}

/* ---------- 學生要求 ---------- */
.phi-require{position:relative;overflow:hidden;padding:3rem 3.2rem;border-radius:16px;color:#fff;
  background:linear-gradient(135deg,var(--g-900) 0%,var(--g-700) 100%)}
.phi-require::after{content:"";position:absolute;right:-46px;bottom:-72px;width:210px;height:210px;
  border-radius:50%;border:16px solid rgba(242,193,78,.16);pointer-events:none}
.phi-require-kicker{display:inline-block;font-size:1.2rem;font-weight:700;
  letter-spacing:.18em;color:var(--gold)}
.phi-require h4{position:relative;margin:.7rem 0 1.4rem;font-size:3rem;line-height:1.25;
  color:#fff;letter-spacing:.14em}
.phi-directions-label{position:relative;margin:0 0 .7rem;font-size:1.3rem;
  letter-spacing:.12em;color:#cfe0d4}
.phi-directions{position:relative;display:flex;flex-wrap:wrap;gap:.8rem;list-style:none;margin:0;padding:0}
.phi-directions li{padding:.55rem 1.3rem;border-radius:999px;border:1px solid rgba(242,193,78,.45);
  background:rgba(242,193,78,.1);color:#ffe6a3;font-size:1.4rem;letter-spacing:.08em}
.phi-rules{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.2rem;margin-top:1.2rem}
.phi-rule{padding:1.9rem 2rem;background:#fff;border:1px solid var(--abt-line);
  border-top:3px solid var(--g-500);border-radius:14px}
.phi-rule b{display:block;margin-bottom:.7rem;font-size:1.2rem;font-weight:700;
  letter-spacing:.16em;color:#856818}
.phi-rule p{margin:0;font-size:1.5rem;line-height:1.85;color:#3f4c44}

/* ---------- 響應式 ---------- */
@media(max-width:1099px){
  .phi-motto{grid-template-columns:1fr}
  .phi-motto-art{align-items:center;padding:2.6rem;text-align:center}
  .phi-values-wrap{grid-template-columns:1fr}
  .phi-cartoon{width:100%;max-width:44rem;margin-left:auto;margin-right:auto}
  .phi-aims{grid-template-columns:1fr}
  .phi-photo{width:100%;max-width:44rem;margin-left:auto;margin-right:auto}
  .phi-pillars{grid-template-columns:1fr}
}
@media(max-width:767px){
  .phi .abt-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .phi .abt-stats li:last-child{grid-column:auto}
  .phi-purpose-grid,.phi-features,.phi-rules{grid-template-columns:1fr}
  .phi-feature:last-child{grid-column:auto}
  .phi-motto-copy{padding:2.2rem}
  .phi-prose{padding:2rem;border-left-width:3px}
  .phi-require{padding:2.4rem 2rem}
  .phi-require h4{font-size:2.6rem}
}
@media(max-width:479px){
  .phi-def{grid-template-columns:1fr;gap:.3rem}
  .phi-def dt{padding-top:1rem}
  .phi-motto-art{padding:2rem 1.6rem}
  .phi-motto-copy h4{font-size:2rem}
  .phi-require h4{font-size:2.4rem}
}
