/* ============================================
   XINXUE GAOKAO - DedeCMS Template Stylesheet
   ============================================ */
:root {
  --primary:#BE1E2D;--primary-dark:#9A1825;--primary-light:#D93545;--primary-lighter:#F2D0D4;--primary-bg:#FFF5F6;
  --gold:#C8A45C;--gold-light:#E8D5A0;
  --white:#FFF;--bg-light:#FAFAFA;--bg-section:#F5F5F5;--border-light:#E8E8E8;
  --text-primary:#1A1A1A;--text-secondary:#555;--text-muted:#888;--text-light:#AAA;
  --gradient-primary:linear-gradient(135deg,var(--primary),var(--primary-dark));
  --gradient-hero:linear-gradient(135deg,#1A0A0C 0%,var(--primary-dark) 50%,var(--primary) 100%);
  --font-cn:"PingFang SC","Microsoft YaHei","Hiragino Sans GB",sans-serif;
  --max-w:1200px;--header-h:80px;--header-h-s:64px;
  --shadow-sm:0 1px 3px rgba(0,0,0,.08);--shadow-md:0 4px 12px rgba(0,0,0,.1);--shadow-lg:0 8px 30px rgba(0,0,0,.12);--shadow-card:0 2px 16px rgba(0,0,0,.06);--shadow-card-hover:0 8px 32px rgba(190,30,45,.12);
  --r-sm:4px;--r-md:8px;--r-lg:12px;--r-xl:16px;--r-2xl:24px;--r-full:9999px;
  --tr-f:.15s ease;--tr-b:.3s ease;
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{font-size:16px;scroll-behavior:smooth;-webkit-font-smoothing:antialiased}
body{font-family:var(--font-cn);font-size:1rem;line-height:1.7;color:var(--text-primary);background:var(--white);overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{text-decoration:none;color:inherit;transition:color var(--tr-f)}
ul,ol{list-style:none}
button{cursor:pointer;border:none;background:none;font-family:inherit}
input,textarea,select{font-family:inherit;font-size:inherit;outline:none}
h1,h2,h3,h4,h5,h6{font-weight:600;line-height:1.3;color:var(--text-primary)}
h1{font-size:2.25rem}h2{font-size:1.875rem}h3{font-size:1.5rem}h4{font-size:1.25rem}
p{margin-bottom:1rem;color:var(--text-secondary)}

.container{width:100%;max-width:var(--max-w);margin:0 auto;padding:0 1.5rem}
.section{padding:5rem 0}
.section--gray{background:var(--bg-section)}
.section--primary-bg{background:var(--primary-bg)}
.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}
.justify-between{justify-content:space-between}.justify-center{justify-content:center}
.text-center{text-align:center}
.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.gap-12{gap:3rem}

.section-header{text-align:center;margin-bottom:4rem}
.section-header .label{display:inline-block;font-size:.875rem;color:var(--primary);font-weight:500;letter-spacing:2px;margin-bottom:.75rem}
.section-header .label::after{content:"";display:block;width:40px;height:2px;background:var(--primary);margin:.5rem auto 0;border-radius:1px}
.section-header h2{font-size:1.875rem;margin-bottom:1rem}
.section-header h2 span{color:var(--primary)}
.section-header p{font-size:1.125rem;max-width:600px;margin:0 auto;color:var(--text-muted)}

/* Header */
.header{position:fixed;top:0;left:0;width:100%;height:var(--header-h);z-index:1000;transition:all var(--tr-b);background:#780606;}
.header.scrolled{background:#780606;backdrop-filter:blur(12px);box-shadow:var(--shadow-sm);height:var(--header-h-s)}
.header .container{display:flex;align-items:center;justify-content:space-between;height:100%}
.logo{display:flex;align-items:center;gap:.75rem;z-index:1001}
.logo-icon{width:44px;height:44px;background:var(--gradient-primary);border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:1.25rem;flex-shrink:0;transition:all var(--tr-b)}
.header.scrolled .logo-icon{width:38px;height:38px;font-size:1.125rem}
.logo-text{font-size:1.25rem;font-weight:700;color:#fff;transition:color var(--tr-b)}
.logo-text span{color:var(--gold-light)}
.header.scrolled .logo-text{color:var(--text-primary)}
.header.scrolled .logo-text span{color:var(--primary)}
.nav{display:flex;align-items:center;gap:.25rem}
.nav-link{padding:.5rem 1rem;font-size:.9375rem;color:rgba(255,255,255,.85);border-radius:var(--r-md);transition:all var(--tr-f);position:relative}
.nav-link:hover,.nav-link.active{color:#fff;background:rgba(255,255,255,.1)}
.nav-link::after{content:"";position:absolute;bottom:4px;left:50%;transform:translateX(-50%);width:0;height:2px;background:var(--gold);transition:width var(--tr-b);border-radius:1px}
.nav-link:hover::after,.nav-link.active::after{width:60%}
/* .header.scrolled .nav-link{color:var(--text-secondary)} */
.header.scrolled .nav-link:hover,.header.scrolled .nav-link.active{color:var(--primary);background:var(--primary-bg)}
.header.scrolled .nav-link::after{background:var(--primary)}
.header-phone{display:flex;align-items:center;gap:.5rem;padding:.5rem 1.25rem;background:var(--primary);color:#fff;border-radius:var(--r-full);font-size:.875rem;font-weight:500;transition:all var(--tr-b);white-space:nowrap}
.header-phone:hover{background:var(--primary-dark);transform:translateY(-1px);box-shadow:0 4px 12px rgba(190,30,45,.3)}
.header-phone svg{width:16px;height:16px}
.menu-btn{display:none;flex-direction:column;gap:5px;width:28px;z-index:1001;cursor:pointer}
.menu-btn span{display:block;width:100%;height:2px;background:#fff;border-radius:2px;transition:all var(--tr-b)}
.header.scrolled .menu-btn span{background:var(--text-primary)}
.menu-btn.active span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
.menu-btn.active span:nth-child(2){opacity:0}
.menu-btn.active span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}

/* Page Banner (inner pages) */
.page-banner{position:relative;height:380px;display:flex;align-items:center;justify-content:center;background:var(--gradient-hero);overflow:hidden;margin-top:var(--header-h)}
.page-banner::after{content:"";position:absolute;bottom:0;left:0;right:0;height:80px;background:linear-gradient(to top,var(--white),transparent)}
.page-banner .container{position:relative;z-index:2;text-align:center}
.page-banner h1{font-size:2.5rem;color:#fff;margin-bottom:.75rem;font-weight:700}
.page-banner .breadcrumb{display:flex;align-items:center;justify-content:center;gap:.5rem;font-size:.9375rem;color:rgba(255,255,255,.6)}
.page-banner .breadcrumb a{color:rgba(255,255,255,.6)}.page-banner .breadcrumb a:hover{color:#fff}
.page-banner .breadcrumb .sep{color:rgba(255,255,255,.3)}

/* Hero */
.hero{position:relative;min-height:100vh;display:flex;align-items:center;background:var(--gradient-hero);overflow:hidden}
.hero::before{content:"";position:absolute;top:-50%;right:-20%;width:80%;height:200%;background:radial-gradient(ellipse,rgba(190,30,45,.15) 0%,transparent 70%);pointer-events:none}
.hero::after{content:"";position:absolute;bottom:0;left:0;right:0;height:120px;background:linear-gradient(to top,var(--white),transparent);pointer-events:none}
.hero-deco{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.hero-deco .circle{position:absolute;border-radius:50%;border:1px solid rgba(255,255,255,.06)}
.hero-deco .circle:nth-child(1){width:400px;height:400px;top:10%;right:-5%}
.hero-deco .circle:nth-child(2){width:250px;height:250px;top:30%;right:5%}
.hero-deco .circle:nth-child(3){width:150px;height:150px;top:50%;right:15%}
.hero-deco .circle:nth-child(4){width:600px;height:600px;bottom:-30%;left:-15%;border-color:rgba(200,164,92,.08)}
.hero .container{display:flex;align-items:center}
.hero-content{position:relative;z-index:2;max-width:650px;flex-shrink:0}
.hero-badge{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1.25rem;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.15);border-radius:var(--r-full);color:var(--gold-light);font-size:.875rem;font-weight:500;margin-bottom:2rem;backdrop-filter:blur(8px)}
.hero h1{font-size:3rem;font-weight:700;color:#fff;line-height:1.2;margin-bottom:1.5rem}
.hero h1 .hl{color:var(--gold-light);position:relative}
.hero h1 .hl::after{content:"";position:absolute;bottom:2px;left:0;right:0;height:8px;background:rgba(200,164,92,.25);border-radius:4px}
.hero-desc{font-size:1.125rem;color:rgba(255,255,255,.75);line-height:1.8;margin-bottom:2.5rem;max-width:540px}
.hero-actions{display:flex;gap:1rem;margin-bottom:4rem}
.hero-stats{display:flex;gap:3rem}
.hero-stat .number{display:block;font-size:2.25rem;font-weight:700;color:#fff;line-height:1.1}
.hero-stat .number em{font-style:normal;font-size:1.5rem;color:var(--gold-light);font-weight:600}
.hero-stat .label{display:block;font-size:.875rem;color:rgba(255,255,255,.5);margin-top:.25rem}

.hero-visual{position:absolute;right:5%;top:50%;transform:translateY(-50%);width:42%;max-width:520px;pointer-events:none}
.hero-img-box{position:relative;border-radius:var(--r-2xl);overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.3);aspect-ratio:4/3;background:var(--primary-dark)}
.hero-img-box img{width:100%;height:100%;object-fit:cover}
.hero-float{position:absolute;background:rgba(255,255,255,.95);backdrop-filter:blur(16px);border-radius:var(--r-lg);padding:.875rem 1.25rem;box-shadow:var(--shadow-lg);display:flex;align-items:center;gap:.75rem;animation:floaty 4s ease-in-out infinite}
.hero-float.c1{bottom:-20px;left:-30px}
.hero-float.c2{top:20px;right:-20px;animation-delay:1.5s}
.hero-float .ic{width:40px;height:40px;border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.hero-float .ic.r{background:var(--primary-bg);color:var(--primary)}
.hero-float .ic.g{background:#FBF7EC;color:var(--gold)}
.hero-float .val{font-size:1.125rem;font-weight:700;color:var(--text-primary)}
.hero-float .txt{font-size:.75rem;color:var(--text-muted)}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem 2rem;font-size:1rem;font-weight:500;border-radius:var(--r-full);transition:all var(--tr-b);white-space:nowrap;cursor:pointer;line-height:1.5}
.btn svg{width:18px;height:18px}
.btn--primary{background:var(--primary);color:#fff}
.btn--primary:hover{background:var(--primary-dark);transform:translateY(-2px);box-shadow:0 6px 20px rgba(190,30,45,.3)}
.btn--white{background:#fff;color:var(--primary);font-weight:600}
.btn--white:hover{background:var(--primary-bg);transform:translateY(-2px);box-shadow:var(--shadow-lg)}
.btn--outline{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.3)}
.btn--outline:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.5)}
.btn--outline-red{background:transparent;color:var(--primary);border:1.5px solid var(--primary)}
.btn--outline-red:hover{background:var(--primary);color:#fff}
.btn--sm{padding:.5rem 1.25rem;font-size:.875rem}
.btn--lg{padding:1rem 2.5rem;font-size:1.125rem}

/* Features Grid */
.features-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2rem}
.feature-card{background:var(--white);border-radius:var(--r-xl);padding:2rem;text-align:center;transition:all var(--tr-b);border:1px solid var(--border-light)}
.feature-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-card-hover);border-color:var(--primary-lighter)}
.feature-card .icon{width:64px;height:64px;border-radius:var(--r-lg);display:flex;align-items:center;justify-content:center;margin:0 auto 1.25rem;font-size:1.5rem;transition:transform var(--tr-b)}
.feature-card .icon.red{background:var(--primary-bg);color:var(--primary)}
.feature-card .icon.blue{background:#EFF3FF;color:#4A7BDF}
.feature-card .icon.green{background:#E8F8EE;color:#2EAA5A}
.feature-card .icon.gold{background:#FBF7EC;color:var(--gold)}
.feature-card:hover .icon{transform:scale(1.1)}
.feature-card h4{margin-bottom:.75rem;font-size:1.125rem}
.feature-card p{font-size:.9375rem;color:var(--text-muted);margin:0;line-height:1.6}

/* Stats Bar */
.stats-bar{background:var(--gradient-primary);padding:3rem 0}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;text-align:center}
.stat-item .number{font-size:2.5rem;font-weight:700;color:#fff;line-height:1}
.stat-item .number em{font-style:normal;font-size:1.5rem;color:var(--gold-light)}
.stat-item .label{font-size:.9375rem;color:rgba(255,255,255,.7);margin-top:.5rem}
.stat-item p{color:rgba(255,255,255,.7)}
/* Service Cards */
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem}
.service-card{background:var(--white);border-radius:var(--r-xl);overflow:hidden;transition:all var(--tr-b);border:1px solid var(--border-light)}
.service-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-card-hover)}
.service-card .thumb{width:100%;aspect-ratio:16/9;background:var(--bg-section);position:relative;overflow:hidden}
.service-card .thumb img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.service-card:hover .thumb img{transform:scale(1.05)}
.service-card .thumb .tag{position:absolute;top:1rem;left:1rem;padding:.25rem .75rem;background:var(--primary);color:#fff;font-size:.75rem;font-weight:500;border-radius:var(--r-full)}
.service-card .body{padding:1.5rem}
.service-card h4{margin-bottom:.5rem;font-size:1.125rem}
.service-card p{font-size:.9375rem;color:var(--text-muted);margin-bottom:1rem;line-height:1.6}
.service-card .link{font-size:.9375rem;color:var(--primary);font-weight:500;display:inline-flex;align-items:center;gap:.375rem;transition:gap var(--tr-b)}
.service-card:hover .link{gap:.625rem}
.service-card .link svg{width:16px;height:16px}

/* Teacher Cards */
.teachers-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2rem}
.teacher-card{background:var(--white);border-radius:var(--r-xl);overflow:hidden;text-align:center;transition:all var(--tr-b);border:1px solid var(--border-light)}
.teacher-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-card-hover)}
.teacher-card .photo{width:100%;aspect-ratio:3/4;background:var(--bg-section);overflow:hidden}
.teacher-card .photo img{width:100%;height:100%;object-fit:cover}
.teacher-card .info{padding:1.25rem}
.teacher-card .info h4{font-size:1.0625rem;margin-bottom:.25rem}
.teacher-card .info .subject{font-size:.875rem;color:var(--primary);font-weight:500;margin-bottom:.5rem}
.teacher-card .info p{font-size:.8125rem;color:var(--text-muted);margin:0;line-height:1.5}

/* Gallery */
.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.gallery-item{position:relative;border-radius:var(--r-xl);overflow:hidden;aspect-ratio:4/3;cursor:pointer}
.gallery-item img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.gallery-item:hover img{transform:scale(1.05)}
.gallery-item .overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.6) 0%,transparent 50%);opacity:0;transition:opacity var(--tr-b);display:flex;align-items:flex-end;padding:1.25rem}
.gallery-item:hover .overlay{opacity:1}
.gallery-item .overlay span{color:#fff;font-size:.9375rem;font-weight:500}

/* News Cards */
.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem}
.news-card{background:var(--white);border-radius:var(--r-xl);overflow:hidden;transition:all var(--tr-b);border:1px solid var(--border-light)}
.news-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-card-hover)}
.news-card .thumb{width:100%;aspect-ratio:16/9;background:var(--bg-section);overflow:hidden}
.news-card .thumb img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.news-card:hover .thumb img{transform:scale(1.05)}
.news-card .body{padding:1.25rem 1.5rem 1.5rem}
.news-card .date{font-size:.8125rem;color:var(--text-light);margin-bottom:.5rem}
.news-card h4{font-size:1.0625rem;margin-bottom:.5rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.5}
.news-card h4 a:hover{color:var(--primary)}
.news-card p{font-size:.875rem;color:var(--text-muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:.75rem;line-height:1.6}
.news-card .read-more{font-size:.875rem;color:var(--primary);font-weight:500;display:inline-flex;align-items:center;gap:.25rem}

/* News List */
.news-list{display:flex;flex-direction:column;gap:1.5rem}
.news-list-item{display:flex;gap:1.5rem;padding:1.5rem;background:var(--white);border-radius:var(--r-lg);border:1px solid var(--border-light);transition:all var(--tr-b)}
.news-list-item:hover{border-color:var(--primary-lighter);box-shadow:var(--shadow-card)}
.news-list-item .thumb{width:220px;flex-shrink:0;border-radius:var(--r-md);overflow:hidden;aspect-ratio:16/10;background:var(--bg-section)}
.news-list-item .thumb img{width:100%;height:100%;object-fit:cover}
.news-list-item .info{flex:1;display:flex;flex-direction:column;justify-content:center}
.news-list-item .info h4{font-size:1.125rem;margin-bottom:.5rem}
.news-list-item .info h4 a:hover{color:var(--primary)}
.news-list-item .info .meta{font-size:.8125rem;color:var(--text-light);margin-bottom:.5rem;display:flex;gap:1rem}
.news-list-item .info p{font-size:.9375rem;color:var(--text-muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:.75rem;line-height:1.6}
.news-list-item .info .read-more{font-size:.875rem;color:var(--primary);font-weight:500}

/* Article Detail */
.article-detail{max-width:800px;margin:0 auto;padding:3rem 1.5rem}
.article-detail .article-meta{display:flex;align-items:center;gap:1.5rem;padding-bottom:1.5rem;border-bottom:1px solid var(--border-light);margin-bottom:2rem;font-size:.875rem;color:var(--text-muted)}
.article-detail .article-content{font-size:1rem;line-height:1.9;color:var(--text-secondary)}
.article-detail .article-content h2{margin:2rem 0 1rem;font-size:1.5rem}
.article-detail .article-content h3{margin:1.5rem 0 .75rem;font-size:1.25rem}
.article-detail .article-content p{margin-bottom:1.25rem}
.article-detail .article-content img{border-radius:var(--r-md);margin:1.5rem 0}

/* Contact */
.contact-wrap{display:grid;grid-template-columns:1fr 1.2fr;gap:3rem;align-items:start}
.contact-info{display:flex;flex-direction:column;gap:2rem}
.contact-item{display:flex;gap:1rem;align-items:flex-start}
.contact-item .icon{width:48px;height:48px;border-radius:var(--r-lg);display:flex;align-items:center;justify-content:center;flex-shrink:0;background:var(--primary-bg);color:var(--primary)}
.contact-item .icon svg{width:22px;height:22px}
.contact-item h4{font-size:1rem;margin-bottom:.25rem}
.contact-item p{font-size:.9375rem;color:var(--text-muted);margin:0}

.contact-form{background:var(--white);border-radius:var(--r-xl);padding:2.5rem;box-shadow:var(--shadow-card);border:1px solid var(--border-light)}
.contact-form h3{margin-bottom:1.5rem;font-size:1.375rem}
.form-group{margin-bottom:1.25rem}
.form-group label{display:block;font-size:.875rem;color:var(--text-secondary);font-weight:500;margin-bottom:.5rem}
.form-group input,.form-group textarea,.form-group select{width:100%;padding:.75rem 1rem;border:1.5px solid var(--border-light);border-radius:var(--r-md);font-size:.9375rem;transition:border-color var(--tr-f);background:var(--white);color:var(--text-primary)}
.form-group input:focus,.form-group textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(190,30,45,.1)}
.form-group textarea{min-height:120px;resize:vertical}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.form-submit{width:100%;margin-top:.5rem}

/* FAQ */
.faq-list{max-width:800px;margin:0 auto;display:flex;flex-direction:column;gap:.75rem}
.faq-item{background:var(--white);border-radius:var(--r-lg);border:1px solid var(--border-light);overflow:hidden;transition:all var(--tr-b)}
.faq-item.open{border-color:var(--primary-lighter);box-shadow:var(--shadow-card)}
.faq-item .faq-q{display:flex;align-items:center;justify-content:space-between;padding:1.25rem 1.5rem;cursor:pointer;font-weight:500;font-size:1rem;transition:color var(--tr-f)}
.faq-item .faq-q:hover{color:var(--primary)}
.faq-item .faq-q svg{width:20px;height:20px;color:var(--text-muted);transition:transform var(--tr-b);flex-shrink:0}
.faq-item.open .faq-q svg{transform:rotate(180deg);color:var(--primary)}
.faq-item .faq-a{padding:0 1.5rem;max-height:0;overflow:hidden;transition:max-height var(--tr-b)}
.faq-item.open .faq-a{max-height:300px;padding-bottom:1.25rem}
.faq-item .faq-a p{font-size:.9375rem;color:var(--text-muted);line-height:1.7;margin:0}

/* Testimonials */
.testimonials-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem}
.testimonial-card{background:var(--white);border-radius:var(--r-xl);padding:2rem;border:1px solid var(--border-light);transition:all var(--tr-b)}
.testimonial-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-card)}
.testimonial-card .quote{font-size:2.5rem;color:var(--primary-lighter);line-height:1;margin-bottom:.75rem;font-family:Georgia,serif}
.testimonial-card p{font-size:.9375rem;color:var(--text-secondary);line-height:1.7;margin-bottom:1.25rem;font-style:italic}
.testimonial-card .author{display:flex;align-items:center;gap:.75rem}
.testimonial-card .author .avatar{width:40px;height:40px;border-radius:50%;background:var(--primary-bg);color:var(--primary);display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.875rem;flex-shrink:0}
.testimonial-card .author .name{font-size:.9375rem;font-weight:600;color:var(--text-primary)}
.testimonial-card .author .role{font-size:.75rem;color:var(--text-muted)}

/* CTA Band */
.cta-band{background:var(--gradient-hero);padding:4rem 0;text-align:center;position:relative;overflow:hidden}
.cta-band::before{content:"";position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg width='60' height='60' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M30 0L60 30L30 60L0 30Z' fill='none' stroke='rgba(255,255,255,0.04)' stroke-width='1'/%3E%3C/svg%3E")}
.cta-band .container{position:relative;z-index:2}
.cta-band h2{color:#fff;font-size:1.875rem;margin-bottom:.75rem}
.cta-band p{color:rgba(255,255,255,.7);font-size:1.125rem;margin-bottom:2rem;max-width:500px;margin-left:auto;margin-right:auto}
.cta-band .btns{display:flex;justify-content:center;gap:1rem}

/* About intro */
.about-intro{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
.about-img{border-radius:var(--r-xl);overflow:hidden;aspect-ratio:4/3;background:var(--bg-section)}
.about-img img{width:100%;height:100%;object-fit:cover}
.about-text h2{margin-bottom:1rem}
.about-text p{margin-bottom:1.25rem;line-height:1.8}
.about-highlights{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:1.5rem}
.about-highlight-item{display:flex;gap:.75rem;align-items:center}
.about-highlight-item .dot{width:8px;height:8px;border-radius:50%;background:var(--primary);flex-shrink:0}
.about-highlight-item span{font-size:.9375rem;color:var(--text-secondary)}

/* Timeline */
.timeline{max-width:700px;margin:0 auto;position:relative;padding-left:3rem}
.timeline::before{content:"";position:absolute;left:5px;top:0;bottom:0;width:2px;background:var(--border-light)}
.timeline-item{position:relative;margin-bottom:2.5rem}
.timeline-item::before{content:"";position:absolute;left:-3rem;top:6px;width:12px;height:12px;border-radius:50%;background:var(--primary);border:3px solid var(--white);box-shadow:0 0 0 2px var(--primary-lighter);z-index:1}
.timeline-item .year{font-size:.875rem;color:var(--primary);font-weight:600;margin-bottom:.375rem}
.timeline-item h4{margin-bottom:.25rem;font-size:1.0625rem}
.timeline-item p{font-size:.9375rem;color:var(--text-muted);margin:0;line-height:1.6}

/* Values Grid */
.values-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem}
.value-card{background:var(--white);border-radius:var(--r-xl);padding:2.5rem 2rem;text-align:center;border:1px solid var(--border-light);transition:all var(--tr-b)}
.value-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-card)}
.value-card .icon{width:56px;height:56px;border-radius:var(--r-lg);display:flex;align-items:center;justify-content:center;margin:0 auto 1.25rem;background:var(--primary-bg);color:var(--primary);font-size:1.25rem}
.value-card h4{margin-bottom:.75rem;font-size:1.125rem}
.value-card p{font-size:.9375rem;color:var(--text-muted);margin:0;line-height:1.6}

/* Footer */
.footer{background:#1A0A0C;color:rgba(255,255,255,.7);padding-top:4rem}
.footer-main{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:3rem;padding-bottom:3rem}
.footer-brand .logo-text{color:#fff;font-size:1.25rem;font-weight:700;margin-bottom:1rem}
.footer-brand .logo-text span{color:var(--gold-light)}
.footer-brand p{font-size:.9375rem;color:rgba(255,255,255,.5);line-height:1.7;margin-bottom:1.5rem;max-width:280px}
.footer-social{display:flex;gap:.75rem}
.footer-social a{width:36px;height:36px;border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.08);color:rgba(255,255,255,.5);transition:all var(--tr-f)}
.footer-social a:hover{background:var(--primary);color:#fff}
.footer-col h4{color:#fff;font-size:1rem;margin-bottom:1.25rem;font-weight:600}
.footer-col li{margin-bottom:.625rem}
.footer-col a{font-size:.9375rem;color:rgba(255,255,255,.5);transition:color var(--tr-f)}
.footer-col a:hover{color:var(--gold-light)}
.footer-contact-item{display:flex;gap:.625rem;align-items:flex-start;margin-bottom:.75rem;font-size:.9375rem;color:rgba(255,255,255,.5)}
.footer-contact-item svg{width:16px;height:16px;flex-shrink:0;margin-top:3px;color:var(--gold-light)}
.footer-bottom{border-top:1px solid rgba(255,255,255,.08);padding:1.5rem 0;display:flex;align-items:center;justify-content:space-between;font-size:.8125rem;color:rgba(255,255,255,.35)}

/* Floating Widget - Online Consultation */
.float-widget{position:fixed;right:1.5rem;bottom:1.5rem;z-index:999}
.float-btn{width:56px;height:56px;border-radius:50%;background:var(--primary);color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 20px rgba(190,30,45,.35);cursor:pointer;transition:all var(--tr-b);animation:pulse-btn 2s infinite}
.float-btn:hover{transform:scale(1.1);box-shadow:0 6px 30px rgba(190,30,45,.45)}
.float-btn svg{width:26px;height:26px}
@keyframes pulse-btn{0%{box-shadow:0 4px 20px rgba(190,30,45,.35)}50%{box-shadow:0 4px 30px rgba(190,30,45,.55)}100%{box-shadow:0 4px 20px rgba(190,30,45,.35)}}

.float-panel{position:absolute;right:0;bottom:70px;width:340px;background:var(--white);border-radius:var(--r-xl);box-shadow:var(--shadow-lg);overflow:hidden;transform:scale(.9) translateY(10px);opacity:0;pointer-events:none;transition:all var(--tr-b);transform-origin:bottom right}
.float-panel.open{transform:scale(1) translateY(0);opacity:1;pointer-events:auto}
.float-panel-header{background:var(--gradient-primary);padding:1.25rem;color:#fff;display:flex;align-items:center;justify-content:space-between}
.float-panel-header h4{color:#fff;font-size:1rem;margin:0}
.float-panel-close{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.7);transition:all var(--tr-f)}
.float-panel-close:hover{background:rgba(255,255,255,.15);color:#fff}
.float-panel-body{padding:1.5rem}
.float-panel-body p{font-size:.875rem;color:var(--text-muted);margin-bottom:1rem}
.float-panel-body .form-group{margin-bottom:.75rem}
.float-panel-body .form-group input,.float-panel-body .form-group textarea{font-size:.875rem;padding:.625rem .875rem}
.float-panel-body .form-group textarea{min-height:80px}
.float-panel-body .btn{width:100%;padding:.625rem;font-size:.9375rem}

/* Back to Top */
.back-top{position:fixed;right:1.5rem;bottom:6rem;width:42px;height:42px;border-radius:50%;background:var(--white);color:var(--text-secondary);display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-md);cursor:pointer;opacity:0;transform:translateY(20px);transition:all var(--tr-b);z-index:998}
.back-top.visible{opacity:1;transform:translateY(0)}
.back-top:hover{background:var(--primary);color:#fff}
.back-top svg{width:18px;height:18px}

/* Pagination */
.pagination{display:flex;align-items:center;justify-content:center;gap:.5rem;margin-top:3rem}
.pagination a{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 .75rem;border-radius:var(--r-md);font-size:.9375rem;transition:all var(--tr-f);border:1px solid var(--border-light)}
.pagination a{color:var(--text-secondary)}
.pagination a:hover{border-color:var(--primary);color:var(--primary)}
.pagination .page-num-current{background:var(--primary);color:#fff;border-color:var(--primary)}
.pagination .next,.pagination .prev{padding:0 1rem}

/* ============================================
   RESPONSIVE
   ============================================ */
@media(max-width:1024px){
  .features-grid{grid-template-columns:repeat(2,1fr)}
  .services-grid{grid-template-columns:repeat(2,1fr)}
  .teachers-grid{grid-template-columns:repeat(2,1fr)}
  .gallery-grid{grid-template-columns:repeat(2,1fr)}
  .testimonials-grid{grid-template-columns:repeat(2,1fr)}
  .footer-main{grid-template-columns:1fr 1fr;gap:2rem}
  .about-intro{grid-template-columns:1fr;gap:2rem}
  .contact-wrap{grid-template-columns:1fr}
  .hero-visual{display:none}
  .hero h1{font-size:2.5rem}
  .hero-stats{gap:2rem}
  .values-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:768px){
    .hero-content{flex-shrink:unset}
  .section{padding:3.5rem 0}
  .section-header{margin-bottom:2.5rem}
  .section-header h2{font-size:1.5rem}
  .hero{min-height:auto;padding:8rem 0 4rem}
  .hero h1{font-size:2rem}
  .hero-desc{font-size:1rem}
  .hero-actions{flex-direction:column;align-items:flex-start}
  .hero-stats{flex-wrap:wrap;gap:1.5rem}
  .stats-grid{grid-template-columns:repeat(2,1fr);gap:1.5rem}
  .features-grid{grid-template-columns:1fr}
  .services-grid{grid-template-columns:1fr}
  .teachers-grid{grid-template-columns:repeat(2,1fr);gap:1rem}
  .gallery-grid{grid-template-columns:repeat(2,1fr);gap:1rem}
  .news-grid{grid-template-columns:1fr}
  .testimonials-grid{grid-template-columns:1fr}
  .news-list-item{flex-direction:column}
  .news-list-item .thumb{width:100%}
  .page-banner{height:280px;margin-top:var(--header-h-s)}
  .page-banner h1{font-size:1.875rem}
  .nav{display:none;position:fixed;inset:0;background:rgba(26,10,12,.95);backdrop-filter:blur(16px);flex-direction:column;align-items:center;justify-content:center;gap:.5rem}
  .nav.mobile-open{display:flex;        width: 100%;
        inset: unset;
        margin-left: -1.5rem;
        top: 80px;}
  .nav-link{font-size:1.25rem;padding:.75rem 2rem;color:rgba(255,255,255,.85)}
  .nav-link:hover{color:#fff;background:rgba(255,255,255,0)}
.nav-link.active,.header.scrolled .nav-link:hover, .header.scrolled .nav-link.active{background:none}
  .menu-btn{display:flex}
  .header-phone{display:none}
  .footer-main{grid-template-columns:1fr;gap:2rem}
  .footer-bottom{flex-direction:column;gap:.75rem;text-align:center}
  .float-panel{width:calc(100vw - 2rem);right:0}
  .form-row{grid-template-columns:1fr}
  .about-highlights{grid-template-columns:1fr}
  .cta-band h2{font-size:1.5rem}
  .values-grid{grid-template-columns:1fr}
  .about-highlight-item{flex-wrap:wrap}
}
@media(max-width:640px){
    .hero-stats {
        gap: .5rem;
    }
    .hero-stat .number{    font-size: 1.50rem;}
    .cta-band .btns{flex-wrap:wrap}
}
@media(max-width:480px){
  .hero h1{font-size:1.75rem}
  .hero-badge{font-size:.8125rem}
  .stats-grid{grid-template-columns:1fr 1fr}
  .stat-item .number{font-size:2rem}
  .teachers-grid{grid-template-columns:repeat(2,1fr);gap:.75rem}
  .teacher-card .info{padding:.875rem}
}