/* ============================================================
   YEC HOMEPAGE REDESIGN — override layer (loaded AFTER style.css)
   Safe & reversible: remove the <link> to this file to revert.
   Palette: navy #12284c (藍) + brand orange #f5821f
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:wght@400;500;600;700;800&family=Noto+Sans+JP:wght@400;500;700&family=Noto+Sans+Myanmar:wght@400;500;700&display=swap');

:root{
  --navy:#12284c;
  --navy-2:#1b3a6b;
  --navy-3:#0d1f3d;
  --accent:#f5821f;
  --accent-2:#ffb15c;
  --ink:#1a2233;
  --muted:#5b6678;
  --line:#e7ebf1;
  --bg-soft:#f5f7fb;
  --radius:16px;
  --shadow:0 10px 30px rgba(18,40,76,.08);
  --shadow-lg:0 22px 55px rgba(18,40,76,.16);
}

/* ---------- BASE ---------- */
body{
  font-family:'Noto Sans','Noto Sans Myanmar','Noto Sans JP',system-ui,-apple-system,'Segoe UI',sans-serif !important;
  color:var(--ink);
  line-height:1.7;
}
h1,h2,h3,h4,h5,h6{
  font-family:'Noto Sans','Noto Sans Myanmar','Noto Sans JP',sans-serif !important;
  font-weight:800 !important;
  color:var(--navy);
}
a{transition:.25s !important}
a:hover,a:active,a:focus{color:var(--accent)}
img{max-width:100%}

/* Generic modern buttons for read/apply links */
.btn-read,.accordion-toggle,.courses-box .btn,.service-box .btn,a.btn-warning,.onlineformbtn,.mdbtn{
  border-radius:999px !important;
  font-weight:700 !important;
  transition:.25s !important;
}
.btn-read{
  display:inline-flex;align-items:center;gap:6px;
  background:linear-gradient(135deg,var(--accent),var(--accent-2)) !important;
  color:#fff !important;border:0 !important;padding:10px 22px !important;
  box-shadow:0 8px 20px rgba(245,130,31,.30);
}
.btn-read:hover{transform:translateY(-2px);color:#fff !important;box-shadow:0 12px 26px rgba(245,130,31,.42)}

/* ---------- TOP BAR / NEWS TICKER ---------- */
.toparea{
  background:var(--navy) !important;
  border-bottom:3px solid var(--accent);
}
.toparea .newstab,.newstab{
  background:var(--accent) !important;
  color:#fff !important;font-weight:700 !important;
  border-radius:6px !important;letter-spacing:.3px;
}
.toparea .newscontent,.toparea a{color:#dfe7f4 !important}
.toparea a:hover{color:#fff !important}
.datenews{color:var(--accent-2) !important;font-weight:600}

/* ---------- HEADER / NAV ---------- */
#navbar_top header{
  background:rgba(255,255,255,.95) !important;
  backdrop-filter:blur(10px);
  box-shadow:0 4px 20px rgba(18,40,76,.06);
}
header .navbar,.navborder .navbar{margin-bottom:0 !important}
header .logo img{height:56px !important}
.navbar-nav > li > a{
  font-weight:600 !important;
  color:var(--ink) !important;
  font-size:15px !important;
  padding:14px 16px !important;
  position:relative;
}
.navbar-nav > li > a:hover,.navbar-nav > li.active > a{color:var(--navy) !important}
.navbar-nav > li.active > a:after{
  content:"";position:absolute;left:16px;right:16px;bottom:8px;height:3px;
  border-radius:3px;background:var(--accent);
}
.dropdown-menu{
  border:0 !important;border-radius:12px !important;
  box-shadow:var(--shadow-lg) !important;overflow:hidden;padding:8px !important;margin-top:6px !important;
}
.dropdown-menu > li > a{border-radius:8px !important;padding:9px 14px !important;font-weight:500}
.dropdown-menu > li > a:hover{background:var(--bg-soft) !important;color:var(--navy) !important}

/* Login button -> pill */
.navborder .login-btn,.login-btn{
  border-radius:999px !important;
  border:1.5px solid var(--navy) !important;
  color:var(--navy) !important;font-weight:700 !important;
  padding:9px 20px !important;margin-left:8px;
  display:inline-flex !important;align-items:center;gap:6px;
}
.navborder .login-btn:hover,.login-btn:hover{
  background:var(--accent) !important;border-color:var(--accent) !important;color:#fff !important;
}

/* ---------- SLIDER ---------- */
.bs-slider{border-radius:0 0 24px 24px;overflow:hidden}
.bs-slider > .carousel-inner > .item > img{border-radius:0}
.bs-slider .carousel-control{
  width:52px;height:52px;top:50%;transform:translateY(-50%);
  background:rgba(18,40,76,.45) !important;border-radius:50%;opacity:1 !important;
  display:grid;place-items:center;text-shadow:none;
}
.bs-slider .carousel-control.left{left:24px}
.bs-slider .carousel-control.right{right:24px}
.bs-slider .carousel-control:hover{background:var(--accent) !important}

/* ---------- SECTION HEADINGS ---------- */
.head-title,.about-right h3,.countdown_bg h3{
  position:relative;font-weight:800 !important;color:var(--navy);
}
.divider{background:var(--accent) !important;height:4px !important;border-radius:4px;width:80px !important}
.bg-gray{background:var(--bg-soft) !important}

/* ---------- SERVICES (feature cards) ---------- */
.services{padding:0}
/* neutralise legacy absolute/translucent layout so cards sit as a clean row */
.service-inner{
  position:relative !important;top:auto !important;left:auto !important;right:auto !important;
  margin-top:-60px !important;z-index:5;
}
.service-box{
  width:auto !important;background:transparent !important;color:inherit !important;
  border-right:0 !important;padding:0 12px 26px !important;
}
.service-box .service-box-content p{color:var(--muted) !important;width:100% !important;font-size:15px}
.service-box .service-box-icon{
  position:static !important;right:auto !important;top:auto !important;padding-top:0 !important;
}
.service-box .service-box-content{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:34px 28px !important;box-shadow:var(--shadow);
  transition:.28s;height:100%;text-align:center;position:relative;overflow:hidden;
}
.service-box .service-box-content:before{
  content:"";position:absolute;top:0;left:0;right:0;height:4px;
  background:linear-gradient(90deg,var(--accent),var(--accent-2));
  transform:scaleX(0);transform-origin:left;transition:.3s;
}
.service-box .service-box-content:hover{transform:translateY(-8px);box-shadow:var(--shadow-lg)}
.service-box .service-box-content:hover:before{transform:scaleX(1)}
.service-box .service-box-content h3{margin-bottom:12px;font-size:20px}
.service-box .service-box-content h3 a{color:var(--navy) !important}
.service-box .service-box-content h3 a:hover{color:var(--accent) !important}
.service-box-icon{
  width:88px;height:88px;margin:18px auto 0 !important;
  background:#fff3e8;border-radius:20px;display:grid !important;place-items:center;
}
.service-box-icon img{width:52px;height:52px;object-fit:contain}

/* ---------- ABOUT ---------- */
.about_img img,.about-right img{border-radius:20px !important;box-shadow:var(--shadow)}
.about-right h3{text-transform:uppercase;letter-spacing:.5px;font-size:26px;margin-bottom:14px}
.about-right{margin-top:0 !important}

/* ---------- COUNTER / STATS ---------- */
.countdown_bg{position:relative}
.countdown_bg:after{
  background:linear-gradient(135deg,rgba(13,31,61,.92),rgba(27,58,107,.88)) !important;
}
.counter-main{border:0 !important;background:transparent !important}
.counter-value{color:#fff !important;font-weight:800 !important;font-size:44px !important}
.counter-title,.counter-text{color:#dbe4f3 !important}
.countdown_bg h3{color:#fff !important}

/* ---------- COURSES (cards) ---------- */
.courses-box{
  border:1px solid var(--line) !important;border-radius:var(--radius) !important;
  overflow:hidden;box-shadow:var(--shadow);transition:.28s;background:#fff;margin-bottom:30px;
}
.courses-box:hover{transform:translateY(-8px);box-shadow:var(--shadow-lg)}
.courses-box-img img{width:100%;transition:.5s}
.courses-box:hover .courses-box-img img{transform:scale(1.06)}
.course-inner{padding:24px 22px !important}
.courses-box:hover .course-inner{background:var(--navy) !important}
.course-inner h4{font-weight:700 !important;font-size:18px}
.course-subject{
  display:inline-block;background:var(--accent);color:#fff !important;
  font-weight:700;font-size:12px;padding:4px 12px;border-radius:999px;margin-bottom:10px;
}
.courses-carousel .owl-nav button,.owl-carousel .owl-nav [class*="owl-"]{
  background:var(--navy) !important;color:#fff !important;border-radius:50% !important;
}
.owl-dots .owl-dot.active span{background:var(--accent) !important}

/* ---------- STAFF / TEACHERS ---------- */
.staffteam{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;box-shadow:var(--shadow);transition:.28s;
}
.staffteam:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg)}
.staffteam .staffteamimg img{width:100%}
.staff-content{padding:18px;text-align:center}
.staff-content .title{color:var(--navy);font-weight:700}

/* ---------- TESTIMONIALS ---------- */
.testimonial_bg:after{background:linear-gradient(135deg,rgba(13,31,61,.90),rgba(27,58,107,.85)) !important}
.testimonial{
  border-radius:var(--radius) !important;box-shadow:var(--shadow-lg) !important;
  padding:34px 30px !important;position:relative;
}
.testimonial:before{
  content:"\201C";position:absolute;top:6px;left:24px;font-size:80px;line-height:1;
  color:var(--accent);opacity:.25;font-family:Georgia,serif;
}
.testi_description{position:relative;z-index:1}

/* ---------- FOOTER ---------- */
footer{
  background:linear-gradient(135deg,var(--navy-3),var(--navy)) !important;
  padding-top:64px !important;
}
.fo-title{
  color:#fff !important;font-weight:700 !important;text-align:left !important;
  font-size:17px;margin-bottom:22px !important;
}
.fo-title:after{left:0 !important;right:auto !important;margin:0 !important;background:var(--accent) !important;width:44px !important;height:3px !important}
.f1-list li a{color:#c3cfe4 !important;display:block;padding:6px 0;font-size:14.5px}
.f1-list li a:hover{color:var(--accent-2) !important;padding-left:6px}
.company-social li a{
  width:42px;height:42px;border-radius:12px !important;
  background:rgba(255,255,255,.08) !important;color:#fff !important;
  display:grid !important;place-items:center;font-size:17px;
}
.company-social li a:hover{background:var(--accent) !important;transform:translateY(-3px)}
.co-list{border-top:1px solid rgba(255,255,255,.1);margin-top:30px !important;padding-top:24px !important}
.co-list li{color:#c3cfe4 !important}
.co-list li a{color:#c3cfe4 !important}
.co-list li a:hover{color:var(--accent-2) !important}
footer p{color:#8497b8 !important}
.scrollToTop{
  background:var(--accent) !important;color:#fff !important;border-radius:12px !important;
  box-shadow:0 8px 20px rgba(245,130,31,.4);
}
.scrollToTop:hover{background:#fff !important;color:var(--accent) !important}

/* ---------- ACCORDION (course descriptions) ---------- */
.panel-group.accrodion2 .panel{
  border:1px solid var(--line) !important;border-radius:12px !important;
  overflow:hidden;margin-bottom:12px !important;box-shadow:none;
}
.panel-group.accrodion2 .panel-heading{background:var(--bg-soft) !important;padding:0}
.panel-group.accrodion2 .panel-title a{
  display:block;padding:16px 20px;color:var(--navy) !important;font-weight:700 !important;
}
.panel-group.accrodion2 .panel-title a:hover{color:var(--accent) !important}

/* ---------- COOKIE / WHATSAPP ---------- */
.cookieConsent{border-radius:14px !important;box-shadow:var(--shadow-lg) !important}
.cookieConsentOK{
  background:var(--accent) !important;color:#fff !important;border-radius:999px !important;
  padding:6px 18px !important;font-weight:700;
}

/* ---------- RESPONSIVE TWEAKS ---------- */
@media(max-width:767px){
  .service-box .service-box-content{padding:26px 20px !important}
  .counter-value{font-size:34px !important}
  .bs-slider .carousel-control{width:40px;height:40px}
}