/* === 成都康礼学校 Cogdel School Chengdu === */
/* 紫金配色 (参考宣传册0610): 深紫 #5A3580 中紫 #7B52AB 浅紫 #9B7BCB | 金 #C4A070 */
:root{
  --dp:#5A3580;--pu:#7B52AB;--pl:#9B7BCB;--pp:#EDE4F5;
  --gd:#C4A070;--gl:#D4BA96;--gp:#F9F3EB;
  --tx:#2D2D2D;--tx2:#666;--bg:#FAFAFA;--wh:#FFF;
  --font-cn:"Microsoft YaHei","PingFang SC","Hiragino Sans GB",sans-serif;
  --font-en:Georgia,"Times New Roman",serif;
  --mw:1200px;--rd:12px;--sh:0 4px 24px rgba(0,0,0,.08);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font-cn);color:var(--tx);background:var(--bg);font-size:16px;line-height:1.8;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--pu);text-decoration:none;transition:.25s}
a:hover{color:var(--gd)}

/* === LANG BAR === */
.lang-bar{background:var(--dp);color:var(--wh);text-align:right;padding:6px 32px;font-size:13px;position:relative;z-index:102}
.lang-bar a{color:var(--gl);margin-left:10px;font-weight:500}
.lang-bar a.active{color:var(--wh);text-decoration:underline}
.lang-bar span{opacity:.5;margin:0 4px}

/* === HEADER === */
.header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.97);backdrop-filter:blur(12px);box-shadow:0 1px 0 rgba(0,0,0,.06),0 4px 24px rgba(0,0,0,.04)}
.header-inner{max-width:var(--mw);margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:0 24px;height:76px}
.logo{display:flex;align-items:center;gap:14px;text-decoration:none}
.logo-img{height:44px;width:auto}
.logo-text{font-family:var(--font-en);font-size:18px;font-weight:700;color:var(--dp);line-height:1.3}
.logo-text small{display:block;font-size:11px;color:var(--tx2);font-family:var(--font-cn);font-weight:400}
.nav{display:flex;list-style:none;gap:4px;align-items:center}
.nav>li{position:relative}
.nav>li>a{display:block;padding:10px 14px;font-size:15px;color:var(--tx);font-weight:500;white-space:nowrap;border-radius:8px;transition:.2s}
.nav>li>a:hover,.nav>li>a.active{color:var(--pu);background:var(--pp)}
.nav .dropdown{display:none;position:absolute;top:100%;left:0;background:var(--wh);box-shadow:0 12px 40px rgba(0,0,0,.12);border-radius:var(--rd);min-width:200px;padding:8px 0;z-index:99}
.nav li:hover .dropdown{display:block}
.nav .dropdown a{display:block;padding:10px 22px;font-size:14px;color:var(--tx);transition:.15s}
.nav .dropdown a:hover{background:var(--pp);color:var(--pu)}
.nav-cta{background:var(--gd)!important;color:var(--wh)!important;border-radius:24px!important;padding:8px 22px!important;font-weight:700!important;margin-left:8px}
.nav-cta:hover{background:var(--dp)!important;color:var(--wh)!important}
.nav-phone{display:inline-block;background:var(--dp);color:var(--wh)!important;border-radius:24px;padding:8px 18px;font-weight:700;font-size:14px;margin-left:6px;white-space:nowrap}
.nav-phone:hover{background:var(--pu)!important}
.menu-toggle{display:none;background:none;border:none;font-size:30px;cursor:pointer;color:var(--pu);padding:4px}

/* === HERO SLIDER === */
.hero-slider{position:relative;width:100%;height:85vh;min-height:520px;overflow:hidden;background:var(--dp)}
.hero-slide{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;transition:opacity .8s;background-size:cover;background-position:center}
.hero-slide.active{opacity:1}
.hero-slider::after{content:'';position:absolute;bottom:0;left:0;width:100%;height:80px;background:linear-gradient(to top,var(--bg),transparent);z-index:2}
.hero-dots{position:absolute;bottom:48px;left:50%;transform:translateX(-50%);display:flex;gap:10px;z-index:3}
.hero-dot{width:12px;height:12px;border-radius:50%;background:rgba(255,255,255,.4);cursor:pointer;transition:.3s}
.hero-dot.active{background:var(--gd);transform:scale(1.3)}

/* === SECTION === */
.section{padding:72px 24px}
.section-inner{max-width:var(--mw);margin:0 auto}
.section-title{text-align:center;margin-bottom:56px}
.section-title h2{font-size:clamp(22px,3vw,34px);color:var(--dp);margin-bottom:6px}
.section-title .en{font-family:var(--font-en);font-size:13px;color:var(--gd);text-transform:uppercase;letter-spacing:4px}
.section-title .gold-line{width:50px;height:3px;background:var(--gd);margin:14px auto 0;border-radius:2px}
.section-alt{background:var(--wh)}

/* === CARD === */
.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:28px}
.card{border-radius:var(--rd);overflow:hidden;background:var(--wh);box-shadow:var(--sh);transition:.3s;text-decoration:none;color:var(--tx);display:block}
.card:hover{transform:translateY(-6px);box-shadow:0 16px 48px rgba(0,0,0,.14)}
.card-img{width:100%;height:220px;object-fit:cover;background:var(--pp)}
.card-body{padding:24px}
.card-body h3{font-size:20px;color:var(--dp);margin-bottom:8px}
.card-body p{font-size:14px;color:var(--tx2);line-height:1.7}
.card-tag{display:inline-block;background:var(--gp);color:var(--gd);padding:3px 12px;border-radius:20px;font-size:12px;font-weight:600;margin-bottom:10px}

/* === HIGHLIGHT BOX === */
.highlight-box{background:linear-gradient(135deg,var(--pp),var(--gp));border-left:5px solid var(--gd);padding:28px 32px;border-radius:0 var(--rd) var(--rd) 0;margin:24px 0}
.highlight-box h3{color:var(--dp);margin-bottom:8px;font-size:19px}
.highlight-box p{font-size:15px;color:var(--tx);line-height:1.8}

/* === FEATURE ROW === */
.feature-row{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;margin:48px 0}
.feature-row.reverse{direction:rtl}
.feature-row.reverse>*{direction:ltr}
.feature-img{width:100%;border-radius:var(--rd);box-shadow:var(--sh);object-fit:cover;height:380px}
.feature-text h3{font-size:24px;color:var(--dp);margin-bottom:16px}
.feature-text p{font-size:15px;color:var(--tx2);line-height:1.9}
@media(max-width:768px){.feature-row{grid-template-columns:1fr;gap:24px}.feature-img{height:240px}}

/* === STATS BAR === */
.stats-bar{background:var(--dp);padding:48px 24px;text-align:center;position:relative;overflow:hidden}
.stats-bar::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--gd),var(--gl),var(--gd))}
.stats-inner{max-width:var(--mw);margin:0 auto;display:flex;flex-wrap:wrap;justify-content:center;gap:48px}
.stat-item{text-align:center;white-space:nowrap}
.stat-num{font-size:42px;font-weight:800;color:var(--gd);line-height:1.1}
.stat-label{font-size:14px;color:rgba(255,255,255,.7);margin-top:4px}

/* === QUICK LINKS GRID (首页6个板块) === */
.quick-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;max-width:var(--mw);margin:0 auto}
.quick-card{background:var(--wh);border-radius:var(--rd);box-shadow:var(--sh);padding:36px 28px;text-align:center;transition:.3s;text-decoration:none;color:var(--tx);display:block;border:2px solid transparent;overflow:hidden}
.quick-card:hover{transform:translateY(-6px);box-shadow:0 16px 48px rgba(0,0,0,.14);border-color:var(--gd)}
.quick-card img{transition:.3s}
.quick-card:hover img{transform:scale(1.03)}
.quick-card .icon{width:64px;height:64px;border-radius:50%;background:linear-gradient(135deg,var(--pp),var(--gp));display:flex;align-items:center;justify-content:center;margin:0 auto 18px;font-size:28px}
.quick-card h3{font-size:20px;color:var(--dp);margin-bottom:8px}
.quick-card p{font-size:14px;color:var(--tx2);line-height:1.7}
@media(max-width:768px){.quick-grid{grid-template-columns:1fr}}

/* === FEATURE CARDS (康礼特色) === */
.feature-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;max-width:var(--mw);margin:0 auto}
.feature-card{background:var(--wh);border-radius:var(--rd);box-shadow:var(--sh);overflow:hidden;transition:.3s}
.feature-card:hover{transform:translateY(-4px);box-shadow:0 12px 36px rgba(0,0,0,.12)}
.feature-card-img{width:100%;height:200px;object-fit:cover}
.feature-card-body{padding:28px}
.feature-card-body h3{font-size:20px;color:var(--dp);margin-bottom:10px}
.feature-card-body p{font-size:14px;color:var(--tx2);line-height:1.8}
.feature-card-body .tag{display:inline-block;background:var(--gp);color:var(--gd);padding:3px 12px;border-radius:20px;font-size:12px;font-weight:600;margin-bottom:10px}
@media(max-width:768px){.feature-cards{grid-template-columns:1fr}}

/* === FAQ === */
.faq-list{max-width:800px;margin:0 auto}
.faq-item{background:var(--wh);border-radius:var(--rd);margin-bottom:10px;overflow:hidden;box-shadow:0 2px 8px rgba(0,0,0,.04)}
.faq-q{padding:18px 24px;font-weight:600;cursor:pointer;display:flex;justify-content:space-between;align-items:center;color:var(--dp);font-size:16px;user-select:none}
.faq-q::after{content:'+';font-size:22px;color:var(--gd);transition:.3s;flex-shrink:0;margin-left:12px}
.faq-item.open .faq-q::after{content:'\2212'}
.faq-a{padding:0 24px 20px;display:none;font-size:15px;color:var(--tx2);line-height:1.9}
.faq-item.open .faq-a{display:block}

/* === ARTICLE === */
.article{max-width:820px;margin:0 auto;padding:48px 24px 64px}
.article h1{font-size:30px;color:var(--dp);margin-bottom:6px}
.article .meta{color:var(--tx2);font-size:14px;margin-bottom:36px;padding-bottom:16px;border-bottom:1px solid #eee}
.article .content{font-size:16px;line-height:2.1}
.article .content p{margin-bottom:18px}
.article .content h2{font-size:22px;color:var(--pu);margin:36px 0 16px;padding-left:16px;border-left:4px solid var(--gd)}
.article .content h3{font-size:18px;color:var(--dp);margin:24px 0 12px}
.article .content img{border-radius:var(--rd);margin:24px 0;max-width:100%}

/* === BREADCRUMB === */
.breadcrumb{padding:14px 24px;font-size:14px;color:var(--tx2);max-width:var(--mw);margin:0 auto}
.breadcrumb a{color:var(--pu)}

/* === PAGE BANNER === */
.page-banner{position:relative;height:280px;background:linear-gradient(135deg,var(--dp) 0%,var(--pu) 50%,var(--pl) 100%);display:flex;align-items:center;justify-content:center;text-align:center;color:var(--wh);overflow:hidden}
.page-banner::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:url('../images/1945.png') center/contain no-repeat;opacity:.05}
.page-banner h1{font-size:clamp(24px,4vw,40px);position:relative;z-index:1}
.page-banner .en{font-family:var(--font-en);font-size:14px;color:var(--gl);letter-spacing:3px;position:relative;z-index:1}

/* === SCHOOL PROFILE GRID === */
.profile-block{background:var(--wh);border-radius:var(--rd);box-shadow:var(--sh);padding:36px;margin-bottom:24px}
.profile-block h3{font-size:22px;color:var(--dp);border-bottom:2px solid var(--gd);padding-bottom:12px;margin-bottom:20px}
.profile-grid{display:grid;grid-template-columns:120px 1fr;gap:8px 28px;font-size:15px}
.profile-grid .label{color:var(--pu);font-weight:700}
@media(max-width:768px){.profile-grid{grid-template-columns:1fr;gap:4px}}

/* === CTA SECTION === */
.cta-section{background:linear-gradient(135deg,var(--dp),var(--pu));padding:64px 24px;text-align:center;position:relative;overflow:hidden}
.cta-section::before{content:'';position:absolute;top:-50%;right:-10%;width:400px;height:400px;border-radius:50%;background:rgba(196,160,112,.08)}
.cta-section::after{content:'';position:absolute;bottom:-50%;left:-10%;width:300px;height:300px;border-radius:50%;background:rgba(155,123,203,.08)}
.cta-inner{max-width:700px;margin:0 auto;position:relative;z-index:1}
.cta-inner h2{font-size:clamp(22px,3vw,30px);color:var(--wh);margin-bottom:12px}
.cta-inner p{color:rgba(255,255,255,.75);font-size:16px;margin-bottom:28px}
.cta-btns{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}
.cta-btn{display:inline-block;padding:14px 32px;border-radius:28px;font-size:16px;font-weight:700;text-decoration:none;transition:.3s}
.cta-phone{background:var(--gd);color:var(--wh)}
.cta-phone:hover{background:var(--gl);color:var(--dp);transform:translateY(-2px)}
.cta-visit{background:var(--wh);color:var(--dp);border:2px solid var(--wh)}
.cta-visit:hover{background:transparent;color:var(--wh);border-color:var(--wh)}

/* === FOOTER === */
.footer{background:var(--dp);color:rgba(255,255,255,.75);padding:56px 24px 28px}
.footer-inner{max-width:var(--mw);margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:36px}
.footer h4{font-size:16px;color:var(--gl);margin-bottom:16px}
.footer p,.footer a{font-size:14px;color:rgba(255,255,255,.6);line-height:2.2}
.footer a:hover{color:var(--gd)}
.footer-bottom{text-align:center;padding-top:24px;margin-top:32px;border-top:1px solid rgba(255,255,255,.1);font-size:13px;opacity:.5}

/* === MOBILE === */
@media(max-width:768px){
  .nav{display:none;flex-direction:column;position:absolute;top:76px;left:0;right:0;background:var(--wh);box-shadow:0 16px 32px rgba(0,0,0,.1);padding:8px 0}
  .nav.open{display:flex}
  .nav>li>a{padding:12px 24px}
  .nav .dropdown{position:static;box-shadow:none;padding-left:16px}
  .menu-toggle{display:block}
  .hero-slider{height:420px}
  .stats-inner{gap:24px}
  .stat-num{font-size:30px}
  .quick-grid{grid-template-columns:1fr}
  .feature-cards{grid-template-columns:1fr}
}
